149 lines
4.9 KiB
Vue
149 lines
4.9 KiB
Vue
|
<template>
|
||
|
|
<!-- 荧石摄像头详情抽屉 -->
|
||
|
|
<div class="system-ys7Devices-detail">
|
||
|
|
<el-drawer v-model="isShowDialog" size="80%" direction="ltr">
|
||
|
|
<template #header>
|
||
|
|
<h4>荧石摄像头详情</h4>
|
||
|
|
</template>
|
||
|
|
<el-form ref="formRef" :model="formData" label-width="100px">
|
||
|
|
<el-row>
|
||
|
|
<el-col :span="12">
|
||
|
|
<el-form-item label="创建时间">{{ proxy.parseTime(formData.createdAt, '{y}-{m}-{d} {h}:{i}:{s}') }}</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
<el-col :span="12">
|
||
|
|
<el-form-item label="设备串号">{{ formData.deviceSerial }}</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
<el-col :span="12">
|
||
|
|
<el-form-item label="设备名称">{{ formData.deviceName }}</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
<el-col :span="12">
|
||
|
|
<el-form-item label="设备类型">{{ formData.deviceType }}</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
<el-col :span="12">
|
||
|
|
<el-form-item label="状态">{{ formData.status }}</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
<!-- <el-col :span="12">
|
||
|
|
<el-form-item label="">{{ formData.defence }}</el-form-item>
|
||
|
|
</el-col> -->
|
||
|
|
<el-col :span="12">
|
||
|
|
<el-form-item label="设备版本">{{ formData.deviceVersion }}</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
<el-col :span="12">
|
||
|
|
<el-form-item label="所属项目">{{ formData.projectId }}</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
</el-row>
|
||
|
|
</el-form>
|
||
|
|
</el-drawer>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<script lang="ts">
|
||
|
|
import { reactive, toRefs, defineComponent,ref,unref,getCurrentInstance,computed } from 'vue';
|
||
|
|
import {ElMessageBox, ElMessage, FormInstance,UploadProps} from 'element-plus';
|
||
|
|
import {
|
||
|
|
listYs7Devices,
|
||
|
|
getYs7Devices,
|
||
|
|
delYs7Devices,
|
||
|
|
addYs7Devices,
|
||
|
|
updateYs7Devices,
|
||
|
|
} from "/@/api/system/ys7Devices";
|
||
|
|
import {
|
||
|
|
Ys7DevicesTableColumns,
|
||
|
|
Ys7DevicesInfoData,
|
||
|
|
Ys7DevicesTableDataState,
|
||
|
|
Ys7DevicesEditState,
|
||
|
|
} from "/@/views/system/ys7Devices/list/component/model"
|
||
|
|
export default defineComponent({
|
||
|
|
name:"apiV1SystemYs7DevicesDetail",
|
||
|
|
components:{
|
||
|
|
},
|
||
|
|
props:{
|
||
|
|
},
|
||
|
|
setup(props,{emit}) {
|
||
|
|
const {proxy} = <any>getCurrentInstance()
|
||
|
|
const formRef = ref<HTMLElement | null>(null);
|
||
|
|
const menuRef = ref();
|
||
|
|
const state = reactive<Ys7DevicesEditState>({
|
||
|
|
loading:false,
|
||
|
|
isShowDialog: false,
|
||
|
|
formData: {
|
||
|
|
id: undefined,
|
||
|
|
createdAt: undefined,
|
||
|
|
deviceSerial: undefined,
|
||
|
|
deviceName: undefined,
|
||
|
|
deviceType: undefined,
|
||
|
|
status: undefined,
|
||
|
|
defence: undefined,
|
||
|
|
deviceVersion: undefined,
|
||
|
|
projectId: undefined,
|
||
|
|
},
|
||
|
|
// 表单校验
|
||
|
|
rules: {
|
||
|
|
id : [
|
||
|
|
{ required: true, message: "id不能为空", trigger: "blur" }
|
||
|
|
],
|
||
|
|
}
|
||
|
|
});
|
||
|
|
// 打开弹窗
|
||
|
|
const openDialog = (row?: Ys7DevicesInfoData) => {
|
||
|
|
resetForm();
|
||
|
|
if(row) {
|
||
|
|
getYs7Devices(row.id!).then((res:any)=>{
|
||
|
|
const data = res.data;
|
||
|
|
state.formData = data;
|
||
|
|
})
|
||
|
|
}
|
||
|
|
state.isShowDialog = true;
|
||
|
|
};
|
||
|
|
// 关闭弹窗
|
||
|
|
const closeDialog = () => {
|
||
|
|
state.isShowDialog = false;
|
||
|
|
};
|
||
|
|
// 取消
|
||
|
|
const onCancel = () => {
|
||
|
|
closeDialog();
|
||
|
|
};
|
||
|
|
const resetForm = ()=>{
|
||
|
|
state.formData = {
|
||
|
|
id: undefined,
|
||
|
|
createdAt: undefined,
|
||
|
|
deviceSerial: undefined,
|
||
|
|
deviceName: undefined,
|
||
|
|
deviceType: undefined,
|
||
|
|
status: undefined,
|
||
|
|
defence: undefined,
|
||
|
|
deviceVersion: undefined,
|
||
|
|
projectId: undefined,
|
||
|
|
}
|
||
|
|
};
|
||
|
|
return {
|
||
|
|
proxy,
|
||
|
|
openDialog,
|
||
|
|
closeDialog,
|
||
|
|
onCancel,
|
||
|
|
menuRef,
|
||
|
|
formRef,
|
||
|
|
...toRefs(state),
|
||
|
|
};
|
||
|
|
}
|
||
|
|
})
|
||
|
|
</script>
|
||
|
|
<style scoped>
|
||
|
|
.system-ys7Devices-detail :deep(.el-form-item--large .el-form-item__label){
|
||
|
|
font-weight: bolder;
|
||
|
|
}
|
||
|
|
.pic-block{
|
||
|
|
margin-right: 8px;
|
||
|
|
}
|
||
|
|
.file-block{
|
||
|
|
width: 100%;
|
||
|
|
border: 1px solid var(--el-border-color);
|
||
|
|
border-radius: 6px;
|
||
|
|
cursor: pointer;
|
||
|
|
position: relative;
|
||
|
|
overflow: hidden;
|
||
|
|
transition: var(--el-transition-duration-fast);
|
||
|
|
margin-bottom: 5px;
|
||
|
|
padding: 3px 6px;
|
||
|
|
}
|
||
|
|
.ml-2{margin-right: 5px;}
|
||
|
|
</style>
|