|  |  | 
 |  |  | <template> | 
 |  |  |     <GlobalWindow | 
 |  |  |         :title="title" | 
 |  |  |         width="500px" | 
 |  |  |         :visible.sync="visible" | 
 |  |  |         :confirm-working="isWorking" | 
 |  |  |         @confirm="confirm" | 
 |  |  |     > | 
 |  |  |         <el-form :model="form" ref="form" :rules="rules"> | 
 |  |  |             <el-form-item label="车牌号" prop="code"> | 
 |  |  |                 <el-input v-model="form.code" placeholder="请输入车牌号" v-trim/> | 
 |  |  |             </el-form-item> | 
 |  |  |             <el-form-item label="用户类型" prop="code"> | 
 |  |  |                 <el-radio-group v-model="form.code"> | 
 |  |  |                     <el-radio label="内部员工"></el-radio> | 
 |  |  |                     <el-radio label="劳务人员"></el-radio> | 
 |  |  |                 </el-radio-group> | 
 |  |  |             </el-form-item> | 
 |  |  |             <el-form-item label="选择用户" prop="code"> | 
 |  |  |                 <el-select v-model="form.code" filterable placeholder="请选择"> | 
 |  |  |                     <el-option | 
 |  |  |                         v-for="item in options" | 
 |  |  |                         :key="item.value" | 
 |  |  |                         :label="item.label" | 
 |  |  |                         :value="item.value"> | 
 |  |  |                     </el-option> | 
 |  |  |                 </el-select> | 
 |  |  |             </el-form-item> | 
 |  |  |             <el-form-item label="授权有效期" prop="code"> | 
 |  |  |                 <el-date-picker | 
 |  |  |                     v-model="form.code" | 
 |  |  |                     type="daterange" | 
 |  |  |                     range-separator="至" | 
 |  |  |                     start-placeholder="开始日期" | 
 |  |  |                     end-placeholder="结束日期"> | 
 |  |  |                 </el-date-picker> | 
 |  |  |             </el-form-item> | 
 |  |  |             <el-form-item label="授权停车场" prop="code"> | 
 |  |  |                 <el-radio-group v-model="form.code"> | 
 |  |  |                     <el-radio label="全部停车场"></el-radio> | 
 |  |  |                     <el-radio label="部分停车场"></el-radio> | 
 |  |  |                 </el-radio-group> | 
 |  |  |             </el-form-item> | 
 |  |  |         </el-form> | 
 |  |  |     </GlobalWindow> | 
 |  |  |   <GlobalWindow :title="title" width="500px" @close="close" :visible.sync="visible" :confirm-working="isWorking" | 
 |  |  |     @confirm="confirm"> | 
 |  |  |     <el-form :model="form" ref="form" :rules="rules"> | 
 |  |  |       <el-form-item label="车牌号" prop="code"> | 
 |  |  |         <el-input v-model="form.code" placeholder="请输入车牌号" v-trim /> | 
 |  |  |       </el-form-item> | 
 |  |  |       <el-form-item label="业务类型" prop="type"> | 
 |  |  |         <el-radio-group v-model="form.type"> | 
 |  |  |           <el-radio :label="0">安泰公务车</el-radio> | 
 |  |  |           <el-radio :label="1">安泰物流车</el-radio> | 
 |  |  |           <el-radio :label="2">其他</el-radio> | 
 |  |  |         </el-radio-group> | 
 |  |  |       </el-form-item> | 
 |  |  |       <el-form-item label="选择分类:" prop="type"> | 
 |  |  |         <el-cascader v-model="form.cateId" @change="changeSel" :options="cateList" :props="{ | 
 |  |  |           label: 'name', | 
 |  |  |           value: 'id', | 
 |  |  |           children: 'childCategoryList', | 
 |  |  |           checkStrictly: true | 
 |  |  |         }"></el-cascader> | 
 |  |  |       </el-form-item> | 
 |  |  |       <el-form-item label="选择组织:" prop="groupId"> | 
 |  |  |         <el-select v-model="form.groupId" @change="changeSel" clearable filterable placeholder="请选择"> | 
 |  |  |           <el-option v-for="item in companyList" :key="item.id" :label="item.name" :value="item.id"> | 
 |  |  |           </el-option> | 
 |  |  |         </el-select> | 
 |  |  |       </el-form-item> | 
 |  |  |       <el-form-item label="选择车主:" prop="memberId"> | 
 |  |  |         <el-select v-model="form.memberId" clearable filterable placeholder="请选择"> | 
 |  |  |           <el-option v-for="item in memberList" :key="item.id" :label="item.name" :value="item.id"> | 
 |  |  |           </el-option> | 
 |  |  |         </el-select> | 
 |  |  |       </el-form-item> | 
 |  |  |     </el-form> | 
 |  |  |   </GlobalWindow> | 
 |  |  | </template> | 
 |  |  |  | 
 |  |  | <script> | 
 |  |  | import BaseOpera from '@/components/base/BaseOpera' | 
 |  |  | import GlobalWindow from '@/components/common/GlobalWindow' | 
 |  |  | import { allList } from '@/api/business/member' | 
 |  |  | import { fetchList } from '@/api/business/category.js' | 
 |  |  | import { create, updateById } from '@/api/business/cars' | 
 |  |  | import { companyGetList } from '@/api/business/company' | 
 |  |  | import { Message } from 'element-ui' | 
 |  |  | export default { | 
 |  |  |   name: 'OperaCarsWindow', | 
 |  |  |   name: 'OperaInternalCompanyWindow', | 
 |  |  |   extends: BaseOpera, | 
 |  |  |   components: { GlobalWindow }, | 
 |  |  |   data () { | 
 |  |  |   data() { | 
 |  |  |     return { | 
 |  |  |       // 表单数据 | 
 |  |  |       memberList: [], | 
 |  |  |       form: { | 
 |  |  |         id: null, | 
 |  |  |         code: '' | 
 |  |  |         code: null, | 
 |  |  |         memberId: null, | 
 |  |  |         type: 0, | 
 |  |  |         groupId: null, | 
 |  |  |         cateId: [], | 
 |  |  |       }, | 
 |  |  |       cateList: [], | 
 |  |  |       companyList: [], | 
 |  |  |       // 验证规则 | 
 |  |  |       rules: { | 
 |  |  |       }, | 
 |  |  |       options: [] | 
 |  |  |         code: [{ required: true, message: '请输入车牌号' }], | 
 |  |  |         groupId: [{ required: true, message: '请选择组织' }], | 
 |  |  |         type: [ | 
 |  |  |           { required: true, message: '请选择业务类型' } | 
 |  |  |         ] | 
 |  |  |       } | 
 |  |  |     } | 
 |  |  |   }, | 
 |  |  |   created () { | 
 |  |  |   created() { | 
 |  |  |     this.config({ | 
 |  |  |       api: '/business/parkBook', | 
 |  |  |       api: '/business/cars', | 
 |  |  |       'field.id': 'id' | 
 |  |  |     }) | 
 |  |  |   }, | 
 |  |  |   methods: { | 
 |  |  |     open(title, target) { | 
 |  |  |       this.title = title | 
 |  |  |       this.visible = true | 
 |  |  |       this.getCate() | 
 |  |  |       this.getCompany() | 
 |  |  |       // 新建组织 | 
 |  |  |       if (target == null) { | 
 |  |  |         this.$nextTick(() => { | 
 |  |  |           this.$refs.form.resetFields() | 
 |  |  |           this.form[this.configData['field.id']] = null | 
 |  |  |           this.form.type = 0 | 
 |  |  |         }) | 
 |  |  |         return | 
 |  |  |       } | 
 |  |  |       // 编辑 | 
 |  |  |       // this.$nextTick(() => { | 
 |  |  |       //   for (const key in this.form) { | 
 |  |  |       //     this.form[key] = target[key] | 
 |  |  |       //   } | 
 |  |  |       // }) | 
 |  |  |     }, | 
 |  |  |     changeSel() { | 
 |  |  |       const { form } = this | 
 |  |  |       if (form.groupId) { | 
 |  |  |         this.loadMember() | 
 |  |  |       } | 
 |  |  |     }, | 
 |  |  |     confirm() { | 
 |  |  |       console.log('form', this.form.cateId) | 
 |  |  |       const { form } = this | 
 |  |  |       if (form.cateId && form.cateId.length == 2) { | 
 |  |  |  | 
 |  |  |       } else { | 
 |  |  |         return Message.error('请选择二级分类') | 
 |  |  |       } | 
 |  |  |       this.$refs['form'].validate((valid) => { | 
 |  |  |         if (valid) { | 
 |  |  |           let fn = form.id ? updateById : create | 
 |  |  |           fn({ | 
 |  |  |             ...form, | 
 |  |  |             cateId: form.cateId[1] | 
 |  |  |           }).then(res => { | 
 |  |  |             Message.success('保存成功') | 
 |  |  |             this.visible = false | 
 |  |  |             this.$emit('success') | 
 |  |  |           }) | 
 |  |  |         } | 
 |  |  |       }) | 
 |  |  |  | 
 |  |  |     }, | 
 |  |  |     close() { | 
 |  |  |       this.visible = false | 
 |  |  |       this.$emit('close') | 
 |  |  |     }, | 
 |  |  |     handleChange(val) { | 
 |  |  |  | 
 |  |  |     }, | 
 |  |  |     getCate() { | 
 |  |  |       fetchList({ | 
 |  |  |         model: {}, | 
 |  |  |         capacity: 1000, | 
 |  |  |         page: 1, | 
 |  |  |       }).then(res => { | 
 |  |  |         this.cateList = res.records || [] | 
 |  |  |  | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     getCompany() { | 
 |  |  |       companyGetList({ | 
 |  |  |         model: {}, | 
 |  |  |         capacity: 1000, | 
 |  |  |         page: 1, | 
 |  |  |       }).then(res => { | 
 |  |  |         this.companyList = res.records || [] | 
 |  |  |  | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     loadMember() { | 
 |  |  |       const { form } = this | 
 |  |  |       allList({ | 
 |  |  |         type: 2, | 
 |  |  |         companyId: form.groupId, | 
 |  |  |  | 
 |  |  |       }) | 
 |  |  |         .then(res => { | 
 |  |  |           this.memberList = res | 
 |  |  |         }) | 
 |  |  |         .catch(e => { | 
 |  |  |           // this.$tip.apiFailed(e) | 
 |  |  |         }) | 
 |  |  |         .finally(() => { | 
 |  |  |           this.isWorking = false | 
 |  |  |         }) | 
 |  |  |     } | 
 |  |  |   } | 
 |  |  | } | 
 |  |  | </script> |