<template lang="pug"> <div class='m_i_dialog'> <el-dialog width="400px" :close-on-click-modal='false' :visible.sync='visible' append-to-body @close="closeForm('dataForm')"> .title-bold(slot='title') {{title}}巡查机 <el-form :model='dataForm' ref='dataForm' :inline='true' :rules="rules" label-width="100px"> <el-form-item label='巡查机名称:' prop='name'> <el-input v-model='dataForm.name' maxlength="50"></el-input> </el-form-item> <el-form-item label='巡查机编码:' prop='code'> <el-input v-model='dataForm.code' maxlength="50"></el-input> </el-form-item> <el-form-item label='所属部门:' prop='orgName'> <el-input v-model='dataForm.orgName' maxlength="30"></el-input> </el-form-item> <el-form-item label='启用时间:' prop='startTime'> <el-date-picker v-model="dataForm.startTime" type="datetime" placeholder="选择日期时间"></el-date-picker> </el-form-item> </el-form> <span class="dialog-footer" slot='footer'> <el-button type="primary" @click='cancel'>取消</el-button> <el-button type="primary" @click='saveClick' v-prevent-re-click>保存</el-button> </span> </el-dialog> </div> </template> <script> import { mapState } from 'vuex' export default { computed: { ...mapState('d2admin/user', [ 'info' ]) }, data () { return { visible: false, stationId: '', dataForm: { name: '', code: '', orgName: '', startTime: '' }, rules: {//添加规则 name: [{ required: true, message: '巡查机名称不能为空', trigger: 'blur' }], code: [{ required: true, message: '巡查机编码不能为空', trigger: 'blur' }, { min: 1, max: 20, message: '长度在 1 到 20 个字符', trigger: 'blur' }], startTime: [{ required: true, message: '启用时间不能为空', trigger: 'blur' }] }, title: '注册' } }, created() { }, methods: { init (stationId, res) { this.visible = true this.stationId = stationId if (res) { this.dataForm = res this.title = '编辑' } else { this.title = '注册' this.dataForm = { id: '', name: '', code: '', orgName: '', startTime: '' } } }, saveClick() { this.$refs.dataForm.validate((valida) => { if (valida) { let url = this.$http.adornUrlEq('/epPatrolMachine/save') if (this.title == '编辑') { url = this.$http.adornUrlEq('/epPatrolMachine/update') } this.$http({ url: url, method: 'post', data: { id: this.dataForm.id, stationId: this.stationId, orgName: this.dataForm.orgName, name: this.dataForm.name, code: this.dataForm.code, startTime: this.formatTime(this.dataForm.startTime, 'yyyy-MM-dd hh:mm:ss') } }).then(data => { if (data && data.code === 0) { this.$message.success('保存成功') this.visible = false this.$emit('closeQ') } }) } }) }, //转化时间 formatTime(date, format) { if (date) { date = new Date(date) var o = { 'M+': date.getMonth() + 1, //月份 'd+': date.getDate(), //日 'h+': date.getHours(), //小时 'm+': date.getMinutes(), //分 's+': date.getSeconds(), //秒 'q+': Math.floor((date.getMonth() + 3) / 3), //季度 'S': date.getMilliseconds() //毫秒 } var fmt = format || 'yyyy-MM-dd hh:mm' if (/(y+)/.test(fmt)) { fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length)) } for (var k in o) { if (new RegExp('(' + k + ')').test(fmt)) { fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (('00' + o[k]).substr(('' + o[k]).length))) } } return fmt } else { return '' } }, //取消 cancel() { this.$confirm('确认取消?', `${this.title}巡查机`, { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }) .then(() => { this.visible = false }) .catch(() => { this.$message({ type: 'info', message: '已取消退出' }) }) }, closeForm (formRule) { this.ruleForm = {} this.$refs[formRule].resetFields() this.visible = false } } } </script> <style> </style>