|  |  | 
 |  |  | <template> | 
 |  |  |   <GlobalWindow | 
 |  |  |       :title="title" | 
 |  |  |       width="800px" | 
 |  |  |       :visible.sync="visible" | 
 |  |  |       :confirm-working="isWorking" | 
 |  |  |       @confirm="confirm" | 
 |  |  |   > | 
 |  |  |     <p class="tip-warn"><i class="el-icon-warning"></i>提醒:<br> | 
 |  |  |       1.车辆权限配置成功后,授权任务即进入权限下发队列,可前往【车辆授权申请记录】查看下发进度;<br> | 
 |  |  |       2.如果需要清空当前选中人员下发权限,以下【授权停车场】为空提交即可。 | 
 |  |  |     </p> | 
 |  |  |     <p class="tip" v-if="form.codes != null">正在为<em>【{{ form.codes.map(item => `${item}`).join(',') }}】</em> 配置停车场权限</p> | 
 |  |  |       <el-form :model="form" ref="form" :rules="rules"> | 
 |  |  |         <el-form-item label="授权有效期:" prop="authTimeType" > | 
 |  |  |           <el-radio-group v-model="form.authTimeType"> | 
 |  |  |             <el-radio :label="0">长期有效</el-radio> | 
 |  |  |             <el-radio :label="1">自定义时间</el-radio> | 
 |  |  |             <el-radio :label="2">跟随车主</el-radio> | 
 |  |  |           </el-radio-group> | 
 |  |  |           <div v-if="form.authTimeType ==1" style="margin-top: 10px" > | 
 |  |  |             <el-date-picker | 
 |  |  |                 @change="seleTime" | 
 |  |  |                 v-model="time" | 
 |  |  |                 type="datetimerange" | 
 |  |  |                 format="yyyy-MM-dd HH:mm:ss" | 
 |  |  |                 value-format="yyyy-MM-dd HH:mm:ss" | 
 |  |  |                 range-separator="至" | 
 |  |  |                 start-placeholder="开始日期" | 
 |  |  |                 end-placeholder="结束日期"> | 
 |  |  |             </el-date-picker> | 
 |  |  |           </div> | 
 |  |  |         </el-form-item> | 
 |  |  |         <el-form-item label="选择停车库" prop="parkIdList"> | 
 |  |  |           <el-select multiple v-model="form.parkIdList" filterable placeholder="请选择" clearable> | 
 |  |  |             <el-option | 
 |  |  |                 v-for="item in parks" | 
 |  |  |                 :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 { findList } from '@/api/business/parks' | 
 |  |  | export default { | 
 |  |  |   name: 'OperaCarsWindow', | 
 |  |  |   extends: BaseOpera, | 
 |  |  |   components: { GlobalWindow }, | 
 |  |  |   data () { | 
 |  |  |     var validateTime = (rule, value, callback) => { | 
 |  |  |       if (this.form.authTimeType == null) { | 
 |  |  |         callback(new Error('请填写正确的授权有效期时间')) | 
 |  |  |         return | 
 |  |  |       } | 
 |  |  |       if (this.form.authTimeType === 1 && (this.form.startTime == null || this.form.endTime == null)) { | 
 |  |  |         callback(new Error('请填写正确的授权有效期时间')) | 
 |  |  |         return | 
 |  |  |       } | 
 |  |  |       callback() | 
 |  |  |     } | 
 |  |  |     return { | 
 |  |  |       // 表单数据 | 
 |  |  |       form: { | 
 |  |  |         ids: [], | 
 |  |  |         codes: [], | 
 |  |  |         authTimeType: 0, | 
 |  |  |         startTime: null, | 
 |  |  |         endTime: null, | 
 |  |  |         parkIdList: [] | 
 |  |  |       }, | 
 |  |  |       time: null, | 
 |  |  |       parks: [], | 
 |  |  |       // 验证规则 | 
 |  |  |       rules: { | 
 |  |  |         authTimeType: [ | 
 |  |  |           { required: true, validator: validateTime, message: '请选中门禁有效期' } | 
 |  |  |         ] | 
 |  |  |  | 
 |  |  |       }, | 
 |  |  |       options: [] | 
 |  |  |     } | 
 |  |  |   }, | 
 |  |  |   created () { | 
 |  |  |     this.config({ | 
 |  |  |       api: '/business/parkBook', | 
 |  |  |       'field.id': 'id' | 
 |  |  |     }) | 
 |  |  |   }, | 
 |  |  |   methods: { | 
 |  |  |     confirm () { | 
 |  |  |       this.$refs.form.validate((valid) => { | 
 |  |  |         if (!valid) { | 
 |  |  |           return | 
 |  |  |         } | 
 |  |  |         if (this.form.parkIdList == null || this.form.parkIdList.length === 0) { | 
 |  |  |           this.$dialog.actionConfirm('授权停车库为空,提交后即清除所选车辆已分配的全部权限,请谨慎操作!', '您确认进行该操作吗?') | 
 |  |  |             .then(() => { | 
 |  |  |               this.confirmDo() | 
 |  |  |             }) | 
 |  |  |             .catch(() => {}) | 
 |  |  |         } else { | 
 |  |  |           this.confirmDo() | 
 |  |  |         } | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     confirmDo () { | 
 |  |  |       // 调用新建接口 | 
 |  |  |       this.isWorking = true | 
 |  |  |       this.api.batchAuth({ | 
 |  |  |         idList: this.form.ids, | 
 |  |  |         authTimeType: this.form.authTimeType, | 
 |  |  |         startTime: this.form.startTime, | 
 |  |  |         endTime: this.form.endTime, | 
 |  |  |         parkIdList: this.form.parkIdList | 
 |  |  |       }) | 
 |  |  |         .then(() => { | 
 |  |  |           this.visible = false | 
 |  |  |           this.$tip.apiSuccess('授权成功,可前往【车辆授权申请记录】查看下发进度') | 
 |  |  |           this.$emit('success') | 
 |  |  |         }) | 
 |  |  |         .catch(e => { | 
 |  |  |           // this.$tip.apiFailed(e) | 
 |  |  |         }) | 
 |  |  |         .finally(() => { | 
 |  |  |           this.isWorking = false | 
 |  |  |         }) | 
 |  |  |     }, | 
 |  |  |     seleTime (e) { | 
 |  |  |       if (e && e.length >= 2) { | 
 |  |  |         this.form.startTime = e[0] | 
 |  |  |         this.form.endTime = e[1] | 
 |  |  |       } else { | 
 |  |  |         this.form.startTime = null | 
 |  |  |         this.form.endTime = null | 
 |  |  |       } | 
 |  |  |     }, | 
 |  |  |     open (title, ids, names, companyType) { | 
 |  |  |       this.title = title | 
 |  |  |       this.visible = true | 
 |  |  |       this.companyType = companyType | 
 |  |  |       // 新建 | 
 |  |  |       this.$nextTick(() => { | 
 |  |  |         this.$refs.form.resetFields() | 
 |  |  |         this.form[this.configData['field.id']] = null | 
 |  |  |         this.form.ids = ids | 
 |  |  |         this.form.codes = names | 
 |  |  |  | 
 |  |  |         this.loadParks() | 
 |  |  |         console.log(names) | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     loadParks () { | 
 |  |  |       this.parks = [] | 
 |  |  |       findList({ | 
 |  |  |         isdeleted: 0 | 
 |  |  |       }) | 
 |  |  |         .then(res => { | 
 |  |  |           this.parks = res | 
 |  |  |         }) | 
 |  |  |         .catch(e => { | 
 |  |  |           this.$message.error('加载停车库信息失败') | 
 |  |  |         }) | 
 |  |  |         .finally(() => { | 
 |  |  |           // this.isWorking = false | 
 |  |  |         }) | 
 |  |  |     } | 
 |  |  |   } | 
 |  |  | } | 
 |  |  | </script> |