更新

MrShi

2025-03-12 69a1b3bf45738f048361ee4ccb6bdc64fce35720

 admin/src/views/vehicle/manager.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,154 @@
<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
      this.getList(1)
    }
  }
}
</script>

<style></style>