|
|
@ -1,116 +1,100 @@ |
|
|
|
<template> |
|
|
|
<el-form label-position="top" :model="data" ref="deviceEdit"> |
|
|
|
<el-row :gutter="20"> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-col :span="12" :xs="24" :md="12" :lg="8" :xl="6"> |
|
|
|
<el-form-item label="设备ID号" prop="deviceId"> |
|
|
|
<el-input v-model="data.deviceId" disabled></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-col :span="12" :xs="24" :md="12" :lg="8" :xl="6"> |
|
|
|
<el-form-item label="设备完整ID" prop="deviceFullId"> |
|
|
|
<el-input v-model="data.deviceFullId"></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
|
|
|
|
<el-row :gutter="20"> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-col :span="12" :xs="24" :md="12" :lg="8" :xl="6"> |
|
|
|
<el-form-item label="地区" prop="area"> |
|
|
|
<el-input v-model="data.area"></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-col :span="12" :xs="24" :md="12" :lg="8" :xl="6"> |
|
|
|
<el-form-item label="安装地点名称" prop="address"> |
|
|
|
<el-input v-model="data.address"></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
|
|
|
|
<el-row :gutter="20"> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-col :span="12" :xs="24" :md="12" :lg="8" :xl="6"> |
|
|
|
<el-form-item label="联系人" prop="contact"> |
|
|
|
<el-input v-model="data.contact"></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-col :span="12" :xs="24" :md="12" :lg="8" :xl="6"> |
|
|
|
<el-form-item label="电话" prop="phone"> |
|
|
|
<el-input v-model="data.phone"></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
|
|
|
|
<el-row :gutter="20"> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-col :span="12" :xs="24" :md="12" :lg="8" :xl="6"> |
|
|
|
<el-form-item label="经度" prop="lon"> |
|
|
|
<el-input v-model="data.lon"></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-col :span="12" :xs="24" :md="12" :lg="8" :xl="6"> |
|
|
|
<el-form-item label="纬度" prop="lat"> |
|
|
|
<el-input v-model="data.lat"></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
|
|
|
|
<el-row :gutter="20"> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-col :span="12" :xs="24" :md="12" :lg="8" :xl="6"> |
|
|
|
<el-form-item label="负责人" prop="head"> |
|
|
|
<el-input v-model="data.head"></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-col :span="12" :xs="24" :md="12" :lg="8" :xl="6"> |
|
|
|
<el-form-item label="安装位置" prop="installLocation"> |
|
|
|
<el-input v-model="data.installLocation"></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
|
|
|
|
<el-row :gutter="20"> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-col :span="12" :xs="24" :md="12" :lg="8" :xl="6"> |
|
|
|
<el-form-item label="安装时间" prop="installTime"> |
|
|
|
<el-input v-model="data.installTime"></el-input> |
|
|
|
<el-date-picker style="width: 100%" v-model="data.installTime" type="datetime" placeholder="安装时间"></el-date-picker> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-col :span="12" :xs="24" :md="12" :lg="8" :xl="6"> |
|
|
|
<el-form-item label="正式运行时间" prop="runTime"> |
|
|
|
<el-input v-model="data.runTime"></el-input> |
|
|
|
<el-date-picker style="width: 100%" v-model="data.runTime" type="datetime" placeholder="正式运行时间"></el-date-picker> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
|
|
|
|
<el-row :gutter="20"> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-col :span="12" :xs="24" :md="12" :lg="8" :xl="6"> |
|
|
|
<el-form-item label="链路地址" prop="linkAddress"> |
|
|
|
<el-input v-model="data.linkAddress"></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-col :span="12" :xs="24" :md="12" :lg="8" :xl="6"> |
|
|
|
<el-form-item label="探头编号" prop="probNo"> |
|
|
|
<el-input v-model="data.probNo"></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
|
|
|
|
<el-row :gutter="20"> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-col :span="12" :xs="24" :md="12" :lg="8" :xl="6"> |
|
|
|
<el-form-item label="试样" prop="simple"> |
|
|
|
<el-input v-model="data.simple"></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-col :span="12" :xs="24" :md="12" :lg="8" :xl="6"> |
|
|
|
<el-form-item label="sim卡1" prop="sim1"> |
|
|
|
<el-input v-model="data.sim1"></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
|
|
|
|
<el-row :gutter="20"> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-col :span="12" :xs="24" :md="12" :lg="8" :xl="6"> |
|
|
|
<el-form-item label="设备朝向" prop="deviceDirection"> |
|
|
|
<el-input v-model="data.deviceDirection"></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-col :span="12" :xs="24" :md="12" :lg="8" :xl="6"> |
|
|
|
<el-form-item label="与主站后台联调情况" prop="joint"> |
|
|
|
<el-input v-model="data.joint"></el-input> |
|
|
|
</el-form-item> |
|
|
@ -118,7 +102,7 @@ |
|
|
|
</el-row> |
|
|
|
|
|
|
|
<el-row :gutter="20"> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-col :span="12" :xs="24" :md="12" :lg="8" :xl="6"> |
|
|
|
<el-form-item label="备注" prop="remark"> |
|
|
|
<el-input v-model="data.remark" type="textarea"></el-input> |
|
|
|
</el-form-item> |
|
|
@ -135,8 +119,10 @@ |
|
|
|
</template> |
|
|
|
|
|
|
|
<script setup> |
|
|
|
import { reactive, ref, computed, watch } from 'vue'; |
|
|
|
import { reactive, ref, computed, watch, defineEmits } from 'vue'; |
|
|
|
import { useStore } from 'vuex'; |
|
|
|
import { updateDevice } from 'apis/index'; |
|
|
|
import { ElMessage } from 'element-plus'; |
|
|
|
|
|
|
|
let data = reactive({ |
|
|
|
deviceId: '', // 设备id |
|
|
@ -163,19 +149,36 @@ let data = reactive({ |
|
|
|
const deviceEdit = ref(null); // form |
|
|
|
const store = useStore(); |
|
|
|
const device = computed(() => store.getters['device/current']); |
|
|
|
const currentDeviceId = computed(() => store.state.device.currentDeviceId); |
|
|
|
|
|
|
|
const emit = defineEmits(['cancel']); |
|
|
|
|
|
|
|
watch( |
|
|
|
() => device, |
|
|
|
() => device.value, |
|
|
|
newValue => { |
|
|
|
data = newValue.value; |
|
|
|
data = newValue; |
|
|
|
}, |
|
|
|
{ immediate: true, deep: true }, |
|
|
|
); |
|
|
|
|
|
|
|
// 提交表单 |
|
|
|
const onSubmit = () => { |
|
|
|
deviceEdit.value.validate(valid => { |
|
|
|
console.log(valid, { ...data }); |
|
|
|
deviceEdit.value.validate(async () => { |
|
|
|
if (data.installTime) { |
|
|
|
data.installTime = new Date(data.installTime).getTime(); |
|
|
|
} |
|
|
|
if (data.runTime) { |
|
|
|
data.runTime = new Date(data.runTime).getTime(); |
|
|
|
} |
|
|
|
try { |
|
|
|
await updateDevice(currentDeviceId.value, data); |
|
|
|
ElMessage.success('更新成功'); |
|
|
|
emit('cancel'); |
|
|
|
store.commit('device/updateDevice', data); |
|
|
|
} catch (error) { |
|
|
|
ElMessage.error('更新失败, 请稍后重试'); |
|
|
|
throw new Error(error); |
|
|
|
} |
|
|
|
}); |
|
|
|
}; |
|
|
|
</script> |
|
|
|