From c1e2ec17485606ba8d2d6de9520396e55248ff6d Mon Sep 17 00:00:00 2001 From: web <candymxq888@outlook.com> Date: 星期二, 25 三月 2025 17:10:50 +0800 Subject: [PATCH] feat:添加界面,接入设备数据 --- src/views/facility/facilityList/index.vue | 51 +++++++++++++++++++++++---------------------------- 1 files changed, 23 insertions(+), 28 deletions(-) diff --git a/src/views/facility/facilityList/index.vue b/src/views/facility/facilityList/index.vue index 096d421..03e6ce3 100644 --- a/src/views/facility/facilityList/index.vue +++ b/src/views/facility/facilityList/index.vue @@ -7,6 +7,7 @@ import waterFacilityParameter from "@/api/facility/parameter.js"; import {PREURL} from '@/config/index' import setPostParams from "@/utils/searchParams.js"; +import {onMounted} from "vue"; const route = useRoute(); const preUrl = ref(PREURL); const {proxy} = getCurrentInstance(); @@ -80,21 +81,13 @@ }); //查询监控点 const pointList = ref(); +const cascaderOption = { label: 'pointName', value: 'id', children: 'childrenList', checkStrictly: true, expandTrigger: 'hover', emitPath: false }; //级联选择器配置 const getPoint = async () => { - await pointApi().search({limit: 100, page: 1}).then((res) => { - pointList.value = res.data.list + await pointApi().getParentPoint().then((res) => { + pointList.value = res.data }) } -getPoint() -//查询供应商 -const supplierList = ref(); -const getSupplier = async () => { - await supplierApi().search({limit: 100, page: 1}).then((res) => { - console.log("供应商" + res.data.list); - supplierList.value = res.data.list - }) -} -getSupplier() + //查询设备类型 const facilityTypeList = ref(); const getFacilityTypeList = async () => { @@ -102,7 +95,7 @@ facilityTypeList.value = res.data.list }) } -getFacilityTypeList() + //获取参数列表数据 //设备参数table const tableParamData = ref([]); @@ -133,13 +126,11 @@ open.value = true; isDetail.value = false; title.value = "新增"; - console.log('form',form.value) } /** 修改按钮操作 */ async function handleUpdate(row) { reset(); - // form.value = Object.assign({},row) Object.keys(row).forEach(key => { if (form.value.hasOwnProperty(key)) { form.value[key] = row[key]; @@ -189,7 +180,6 @@ //已选择设备参数 const handleSelectionParams = (val) =>{ multipleSelection.value = val - console.log('esele',val); } /** * 设备参数操作相关 @@ -271,12 +261,21 @@ form.value = { facilityCode: '', facilityName: '', + facilityType: '', + pointId: '', facilityUrl: '', + remark:'', + installDate: '' }; proxy.resetForm("facilityTypeRef"); } -getList(); +onMounted(() => { + getList(); + getPoint() + getFacilityTypeList() +}) + </script> <template> <div class="app-container"> @@ -322,7 +321,7 @@ </div> </template> </el-table-column> - <el-table-column label="操作" width="180" align="center" class-name="small-padding fixed-width"> + <el-table-column label="操作" align="center" class-name="small-padding fixed-width"> <template #default="scope"> <el-button link type="primary" icon="Edit" @click="handleband(scope.row)">参数绑定</el-button> <el-button link type="primary" icon="Edit" v-has="['update',route]" @@ -343,7 +342,7 @@ /> <!-- 添加/修改表单 --> <el-dialog :title="title" v-model="open" append-to-body center> - <el-form class="form-box" ref="facilityTypeRef" :model="form" :rules="rules" label-width='120' > + <el-form class="form-box" ref="facilityTypeRef" :model="form" :rules="rules" label-width='auto' > <el-form-item :label="formLabel.facilityCode" prop="facilityCode"> <el-input v-model="form.facilityCode" :placeholder="inpTip+formLabel.facilityCode"/> </el-form-item> @@ -361,14 +360,7 @@ </el-select> </el-form-item> <el-form-item label="选择监控点" prop="pointId"> - <el-select v-model="form.pointId" :placeholder="inpTip+formLabel.pointId"> - <el-option - v-for="(item,index) in pointList" - :label="item.pointName" - :value="item.id" - :key="index" - ></el-option> - </el-select> + <el-cascader v-model="form.pointId" :options="pointList" :show-all-levels="false" :props="cascaderOption" /> </el-form-item> <el-form-item label="安装日期" prop="installDate"> <el-date-picker @@ -383,7 +375,7 @@ <el-form-item :label="formLabel.remark" prop="remark"> <el-input v-model="form.remark" :placeholder="inpTip+formLabel.remark" /> </el-form-item> - <el-form-item label="资料上传" prop="facilityUrl"> + <el-form-item label="资料上传" prop="facilityUrl" style="flex: 1"> <upload-icons @uploadData="uploadData" :imageList="form.facilityUrl" :limit="1" :disabled='isDetail ? true : false'></upload-icons> <span style="display: block;">(请上传1张设备图片)</span> @@ -426,6 +418,9 @@ } .form-box{ justify-content: normal; + :deep(.el-cascader){ + flex-grow: 1; + } } </style> \ No newline at end of file -- Gitblit v1.9.3