5 changed files with 214 additions and 16 deletions
@ -1,19 +1,13 @@ |
|||
<template> |
|||
<el-dialog v-model="show" title="编辑设备信息" width="80%" :before-close="handleClose"> |
|||
<span>This is a message</span> |
|||
<template #footer> |
|||
<span class="dialog-footer"> |
|||
<el-button @click="$emit('toggle-mdoal')">Cancel</el-button> |
|||
<el-button type="primary" @click="$emit('toggle-mdoal')">Confirm</el-button> |
|||
</span> |
|||
</template> |
|||
<el-dialog v-model="show" title="编辑设备信息" fullscreen="true" @close="$emit('toggle-mdoal')"> |
|||
<DeviceEdit :edit="true" /> |
|||
</el-dialog> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { defineProps, defineEmits } from 'vue'; |
|||
import DeviceEdit from 'views/device-edit.vue'; |
|||
|
|||
defineProps({ show: Boolean }); |
|||
|
|||
defineEmits(['toggle-mdoal']); |
|||
</script> |
|||
|
|||
@ -0,0 +1,179 @@ |
|||
<template> |
|||
<el-form label-position="top" :model="data" ref="deviceCreate"> |
|||
<el-row :gutter="20"> |
|||
<el-col :span="12"> |
|||
<el-form-item label="设备ID号" prop="deviceId"> |
|||
<el-input v-model="data.deviceId"></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<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-form-item label="地区" prop="area"> |
|||
<el-input v-model="data.area"></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<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-form-item label="联系人" prop="contact"> |
|||
<el-input v-model="data.contact"></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<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-form-item label="经度" prop="lon"> |
|||
<el-input v-model="data.lon"></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<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-form-item label="负责人" prop="head"> |
|||
<el-input v-model="data.head"></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<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-form-item label="安装时间" prop="installTime"> |
|||
<el-input v-model="data.installTime"></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<el-form-item label="正式运行时间" prop="runTime"> |
|||
<el-input v-model="data.runTime"></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row :gutter="20"> |
|||
<el-col :span="12"> |
|||
<el-form-item label="链路地址" prop="linkAddress"> |
|||
<el-input v-model="data.linkAddress"></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<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-form-item label="试样" prop="simple"> |
|||
<el-input v-model="data.simple"></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<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-form-item label="设备朝向" prop="deviceDirection"> |
|||
<el-input v-model="data.deviceDirection"></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<el-form-item label="与主站后台联调情况" prop="joint"> |
|||
<el-input v-model="data.joint"></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row :gutter="20"> |
|||
<el-col :span="12"> |
|||
<el-form-item label="备注" prop="remark"> |
|||
<el-input v-model="data.remark" type="textarea"></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row :gutter="20" class="mt-5 pl-2"> |
|||
<el-form-item> |
|||
<el-button type="primary" @click="onSubmit">提交</el-button> |
|||
<el-button @click="onReset">重置</el-button> |
|||
</el-form-item> |
|||
</el-row> |
|||
</el-form> |
|||
{{ device }} |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { reactive, ref, computed } from 'vue'; |
|||
import { useStore } from 'vuex'; |
|||
|
|||
const data = reactive({ |
|||
deviceId: '', // 设备id |
|||
deviceFullId: '', // 设备完整id |
|||
deviceDirection: '', // 设备朝向 |
|||
area: '', // 地区 |
|||
address: '', // 安装地点名称 |
|||
contact: '', // 联系人 |
|||
phone: '', // 联系人电话 |
|||
lon: '', // 经度 |
|||
lat: '', // 纬度 |
|||
head: '', // 负责人 |
|||
installLocation: '', // 安装位置 |
|||
installTime: '', // 安装时间 |
|||
runTime: '', // 正式运行时间 |
|||
linkAddress: '', // 链路地址 |
|||
probNo: '', // 探头编号 |
|||
simple: '', // 试样 |
|||
sim1: '', // sim卡1 |
|||
joint: '', // 主站后台联调情况 |
|||
remark: '', // 备注 |
|||
}); |
|||
|
|||
const deviceCreate = ref(null); // form |
|||
const store = useStore(); |
|||
const device = computed(() => store.getters['device/current']); |
|||
|
|||
// 提交表单 |
|||
const onSubmit = () => { |
|||
deviceCreate.value.validate(valid => { |
|||
console.log(valid, { ...data }); |
|||
}); |
|||
}; |
|||
|
|||
// 重置表单 |
|||
const onReset = () => { |
|||
deviceCreate.value.resetFields(); |
|||
}; |
|||
</script> |
|||
Loading…
Reference in new issue