jiangping
2024-11-05 c9ef2687d3460da668d08d58dee6af468ed6693e
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
<template>
  <div class="main_app">
    <QueryForm v-model="filters" :query-form-config="queryFormConfig" @handleQuery="getList(1)" @clear="clear" />
    <div class="table_btns">
      <el-button icon="el-icon-plus" @click="handleEdit()" type="primary">新建</el-button>
      <el-button @click="handleAppr" type="primary">下发授权</el-button>
    </div>
    <el-table v-loading="loading" :data="list" stripe>
      <el-table-column prop="name" label="车牌照" min-width="100" show-overflow-tooltip />
      <el-table-column prop="name" label="业务类型" min-width="80" show-overflow-tooltip />
      <el-table-column prop="name" label="授权停车场" min-width="100" show-overflow-tooltip />
      <el-table-column prop="name" label="车主姓名" min-width="80" show-overflow-tooltip />
      <el-table-column prop="name" label="申请有效期" min-width="110" show-overflow-tooltip />
      <el-table-column prop="name" label="停车场下发" min-width="100" show-overflow-tooltip />
      <el-table-column prop="name" label="操作人" min-width="80" show-overflow-tooltip />
      <el-table-column prop="name" label="操作时间" min-width="110" show-overflow-tooltip />
 
      <el-table-column label="操作" width="230" fixed="right">
        <!-- v-permissions="['business:company:update']" -->
        <template slot-scope="{ row }">
          <el-button type="text" icon="el-icon-edit" @click="handleEdit(row)">编辑</el-button>
          <el-button type="text" icon="el-icon-delete" @click="handleDel(row)" class="red">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <pagination @size-change="handleSizeChange" @current-change="getList" :pagination="pagination" />
    <!--  -->
    <el-dialog :title="param.id ? '编辑车辆' : '新增车辆'" :visible.sync="isShowEdit" width="600px">
      <el-form :model="param" :rules="rules" ref="ruleForm" label-width="100px">
        <el-form-item label="车牌照">
          <el-input type="text" placeholder="请输入" v-model="param.explain" />
        </el-form-item>
        <el-form-item label="业务类型">
          <el-radio v-model="param.aa" label="1">员工车辆</el-radio>
        </el-form-item>
        <el-form-item label="车主姓名">
          <el-select v-model="param.b" filterable placeholder="请选择,单选,支持搜索">
            <el-option></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="isShowEdit = false">取消</el-button>
        <el-button type="primary" @click="handleSub">确定</el-button>
      </span>
    </el-dialog>
    <!--  -->
    <el-dialog title="停车场授权" :visible.sync="isShowAuthor" width="600px">
      <el-form :model="authorization" :rules="rules" ref="authorForm" label-width="100px">
        <el-form-item label="授权停车场">
          <el-select v-model="authorization.b" filterable placeholder="请选择,多选">
            <el-option></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="申请有效期">
          <el-radio v-model="authorization.aa" label="1">长期有效</el-radio>
          <div class="mt10">
            <el-date-picker v-model="authorization.ac" type="daterange" range-separator="至" start-placeholder="开始日期"
              format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss" end-placeholder="结束日期">
            </el-date-picker>
          </div>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="isShowAuthor = false">取消</el-button>
        <el-button type="primary" @click="authorSub">提交</el-button>
      </span>
    </el-dialog>
  </div>
</template>
 
<script>
import Pagination from '@/components/common/Pagination'
import QueryForm from '@/components/common/QueryForm'
export default {
  components: {
    Pagination,
    QueryForm
  },
  data() {
    return {
      filters: {},
      loading: false,
      queryFormConfig: {
        formItems: [
          {
            filed: 'idCard',
            type: 'input',
            label: '车牌照'
          },
          {
            filed: 'name',
            type: 'select',
            label: '业务类型',
            options: []
          },
          {
            filed: 'name',
            type: 'select',
            label: '停车场下发',
            options: []
          }
        ],
        online: true
      },
      pagination: {
        capacity: 10,
        page: 1
      },
      list: [{}],
      total: 0,
 
      isShowEdit: false,
      param: {},
      isShowAuthor: false,
      authorization: {},
      rules: {}
    }
  },
  methods: {
    handleSub() {
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          alert('submit!')
        }
      })
    },
    authorSub() { },
    handleEdit(row) {
      this.isShowEdit = true
    },
    handleAppr() {
      this.isShowAuthor = true
    },
    handleDel(row) {
      this.$confirm('确认删除该车辆', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
 
      })
    },
    getList(page) { },
    clear() { },
    handleSizeChange(capacity) {
      this.pagination.capacity = capacity
    }
  }
}
</script>
 
<style></style>