| | |
| | | <template> |
| | | <div class="create"> |
| | | <el-form ref="device" label-position="right" label-width="120px" :model="bayonet" :rule="rules"> |
| | | <el-form ref="device" label-position="right" label-width="120px" :model="bayonet" :rules="rules"> |
| | | <!-- 卡口名称 --> |
| | | <div class="device-item"> |
| | | <div class="item-left"> |
| | |
| | | <!-- 所属区域 --> |
| | | <div class="device-item"> |
| | | <div class="item-left"> |
| | | <el-form-item label="所属区域:" prop="area"> |
| | | <el-input v-model="bayonet.area" placeholder="请填写区域名称"></el-input> |
| | | <el-form-item label="所属区域:" prop="belong_area"> |
| | | <el-input v-model="bayonet.belong_area" placeholder="请填写区域名称"></el-input> |
| | | </el-form-item> |
| | | </div> |
| | | <div class="item-right"></div> |
| | |
| | | <!-- 域名/ip --> |
| | | <div class="device-item"> |
| | | <div class="item-left"> |
| | | <el-form-item label="域名/IP:" prop="domainName"> |
| | | <el-input v-model="bayonet.domainName" placeholder="请填写域名或者IP"></el-input> |
| | | <el-form-item label="域名/IP:" prop="ipAddress"> |
| | | <el-input v-model="bayonet.ipAddress" placeholder="请填写域名或者IP"></el-input> |
| | | </el-form-item> |
| | | </div> |
| | | <div class="item-right"></div> |
| | |
| | | <!-- 前端类型 --> |
| | | <div class="device-item"> |
| | | <div class="item-left"> |
| | | <el-form-item label="前端类型:" prop="webType"> |
| | | <el-input v-model="bayonet.webType" placeholder="请输入前端类型"></el-input> |
| | | <el-form-item label="前端类型:" prop="frontEndType"> |
| | | <el-input v-model="bayonet.frontEndType" placeholder="请输入前端类型"></el-input> |
| | | </el-form-item> |
| | | </div> |
| | | <div class="item-right"></div> |
| | |
| | | <!-- 出入城类型 --> |
| | | <div class="device-item"> |
| | | <div class="item-left"> |
| | | <el-form-item label="出入城类型:" prop="cityType"> |
| | | <el-input v-model="bayonet.cityType" placeholder="出城/入城"></el-input> |
| | | <el-form-item label="出入城类型:" prop="inOutCityType"> |
| | | <el-input v-model="bayonet.inOutCityType" placeholder="出城/入城"></el-input> |
| | | </el-form-item> |
| | | </div> |
| | | <div class="item-right"></div> |
| | |
| | | </div> |
| | | <!-- 按钮 --> |
| | | <div class="device-btn"> |
| | | <el-button>返回</el-button> |
| | | <el-button type="primary">确定</el-button> |
| | | <el-button @click="closeDialog">返回</el-button> |
| | | <el-button type="primary" @click="onSubmit">确定</el-button> |
| | | </div> |
| | | </el-form> |
| | | </div> |
| | | </template> |
| | | <script> |
| | | export default { |
| | | data() { |
| | | return { |
| | | bayonet: { |
| | | bayonetName: '', |
| | | latitude: '', |
| | | longitude: '', |
| | | area: '', |
| | | ipAddress: '', |
| | | port: '', |
| | | frontEndType: '', |
| | | inOutCityType: '', |
| | | description: '', |
| | | }, |
| | | rules: { |
| | | import bayonet from "@/api/system/bayonet"; |
| | | import { deepClone } from "@/utils/helper"; |
| | | |
| | | } |
| | | } |
| | | export default { |
| | | props: { |
| | | originalBayonet: { |
| | | type: Object, |
| | | default: () => {} |
| | | }, |
| | | isEdit: { |
| | | type: Boolean, |
| | | default: () => false |
| | | } |
| | | }, |
| | | |
| | | data() { |
| | | return { |
| | | bayonet: { |
| | | name: '', |
| | | latitude: '', |
| | | longitude: '', |
| | | belong_area: '', |
| | | ipAddress: '', |
| | | port: '', |
| | | frontEndType: '', |
| | | inOutCityType: '', |
| | | description: '' |
| | | }, |
| | | rules: { |
| | | name: [{ required: true, trigger: 'blur', message: '请填写卡口名称' }], |
| | | latitude: [{ required: true, trigger: ['blur', 'change'], message: '请填写纬度位置' }], |
| | | longitude: [{ required: true, trigger: ['blur', 'change'], message: '请填写经度位置' }], |
| | | belong_area: [{ required: true, trigger: ['blur', 'change'], message: '请填写区域名称' }], |
| | | ipAddress: [{ required: true, trigger: ['blur', 'change'], message: '请填写域名或者IP' }], |
| | | port: [{ required: true, trigger: ['blur', 'change'], message: '请输入端口号' }], |
| | | frontEndType: [{ required: true, trigger: ['blur', 'change'], message: '请输入前端类型' }], |
| | | inOutCityType: [{ required: true, trigger: ['blur', 'change'], message: '请填写出城/入城' }], |
| | | description: [{ required: true, trigger: ['blur', 'change'], message: '请输入描述内容' }] |
| | | } |
| | | } |
| | | }, |
| | | |
| | | methods: { |
| | | onSubmit() { |
| | | this.$refs.device.validate(valid => { |
| | | if (valid) { |
| | | const copyBayonet = deepClone(this.bayonet); |
| | | if (!this.isEdit) { |
| | | bayonet.addBayonet(this.bayonet) |
| | | .then(() => { |
| | | this.$message({ type: 'success', message: '操作成功' }); |
| | | this.$emit('closeDialog'); |
| | | }) |
| | | .catch(err => { |
| | | this.$message({ type: 'error', message: err }); |
| | | }) |
| | | } else { |
| | | bayonet.updateBayonet(copyBayonet) |
| | | .then(() => { |
| | | this.$message({ type: 'success', message: '操作成功' }); |
| | | this.$emit('closeDialog'); |
| | | }) |
| | | .catch(err => { |
| | | this.$message({ type: 'error', message: err }); |
| | | }) |
| | | } |
| | | } else { |
| | | this.$message({ type: 'warning', message: '请检查必填项' }); |
| | | } |
| | | }); |
| | | }, |
| | | |
| | | closeDialog() { |
| | | this.$emit('closeDialog'); |
| | | } |
| | | } |
| | | |
| | | } |
| | | </script> |