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