feat: 记录详情表格逻辑

src/views/dike/runManage/patrolMaintenance/InspectionRecords/index.vue

@@ -221,7 +221,9 @@ export default {
   mixins: [calcTableHeight],
   data() {
     return {
-      tableData: [],
+      tableData: [{
+        id: 1
+      }],
       maintenanceStatus: [],
       maintenanceCategory: [],
       maintenanceType: [],

src/views/dike/runManage/patrolMaintenance/componentsDetails/inspectionRecordDetails.vue

@@ -60,21 +60,77 @@
         style="margin-bottom: 16px;"
         border
       >
-        <el-table-column prop="nspectionLocation" align="center" label="巡查部位" />
+        <el-table-column prop="parts" align="center" label="巡查部位" />
-        <el-table-column prop="inspectionContent" align="center" label="检查内容" />
+        <el-table-column prop="content" align="center" label="检查内容" />
       </el-table>
       <div class="form-row-title">缺陷问题列表</div>
-
+      <div class="flex-1 flex justify-end search-item">
+        <el-button
+          size="small"
+          class="flex-shrink-0 myml-12"
+          type="success"
+          @click="addProblems"
+        >新增</el-button
+        >
+        <el-button
+          class="flex-shrink-0"
+          size="small"
+          @click="delProblems"
+        >删除</el-button
+        >
+      </div>
       <el-table
         :height="tableHeight"
-        :data="tableData"
+        :data="problemsData"
         border
       >
         <el-table-column type="selection" width="55"></el-table-column>
-        <el-table-column prop="nspectionLocation" align="center" label="巡查部位" />
+        <el-table-column prop="parts" align="center" label="巡查部位" />
-        <el-table-column prop="inspectionContent" align="center" label="问题等级" />
+<!--        <el-table-column prop="content" label="检查内容">-->
-        <el-table-column prop="inspectionContent" align="center" label="具体位置" />
+<!--          <template slot-scope="scope">-->
-        <el-table-column prop="inspectionContent" align="center" label="具体描述" />
+<!--            <el-input-->
+<!--              :disabled="!canEdit"-->
+<!--              v-model="scope.row.content"-->
+<!--              placeholder="请输入"-->
+<!--            ></el-input>-->
+<!--          </template>-->
+<!--        </el-table-column>-->
+        <el-table-column prop="problemLevel" label="问题等级">
+          <template slot-scope="scope">
+            <el-select
+              clearable
+              size="small"
+              class="w-202 ml-10"
+              v-model="scope.row.problemLevel"
+              filterable
+              placeholder="请选择"
+            >
+              <el-option
+                v-for="item in maintenanceLevel"
+                :key="item.dictValue"
+                :label="item.dictLabel"
+                :value="item.dictValue"
+              >
+              </el-option>
+            </el-select>
+          </template>
+        </el-table-column>
+        <el-table-column prop="position" label="具体位置">
+          <template slot-scope="scope">
+            <el-input
+              v-model="scope.row.position"
+              placeholder="请输入"
+            ></el-input>
+          </template>
+        </el-table-column>
+        <el-table-column prop="content" label="具体描述">
+          <template slot-scope="scope">
+            <el-input
+              v-model="scope.row.content"
+              placeholder="请输入"
+            ></el-input>
+          </template>
+        </el-table-column>
         <el-table-column prop="inspectionContent" align="center" label="缺陷照片" />
         <el-table-column prop="inspectionContent" align="center" label="维养状态" />
         <el-table-column
@@ -117,10 +173,11 @@
   </div>
 </template>
 <script>
+import { intersection } from "lodash";
 import TopBackTitle from "@/components/TopBackTitle/index.vue";
 import {calcTableHeight} from "@/mixins/calcTableHeight";
 import SyMixMap from "@/views/components/SyMixMap.vue";
-import {getRecordDetails, getRecordTraceList} from "@/api/dike";
+import {getCheckingDictTree, getRecordDetails, getRecordTraceList, getV2PatrolChecking} from "@/api/dike";
 import {gettV2Record} from "@/api/dike/patrolMaintenance";
 
 export default {
@@ -132,7 +189,13 @@ export default {
   data() {
     return {
       entries: {},
+      maintenanceStatus: [],
+      maintenanceLevel: [],
       traceList: [],
+      problemsData: [{
+        nspectionLocation: '堤坡与戗台',
+        inspectionContent: '是否坚实平整',
+      }],
       tableData: [{
         nspectionLocation: '堤坡与戗台',
         inspectionContent: '是否坚实平整',
@@ -156,6 +219,12 @@ export default {
     };
   },
   created() {
+    this.getDicts("patrol_maintenance_status").then((response) => {
+      this.maintenanceStatus = response.data;
+    });
+    this.getDicts("patrol_maintenance_level").then((response) => {
+      this.maintenanceLevel = response.data;
+    });
   },
   mounted() {
     this.initData()
@@ -168,7 +237,14 @@ export default {
     async getDetail() {
       console.log(this.$route.query.id)
       const details = await gettV2Record(this.$route.query.id);
-
+      const checking = await getV2PatrolChecking(22);
+      console.log(checking)
+      this.tableData = checking.data.items;
+      const dictData = await getCheckingDictTree("df_xs_c_classfy");
+      let _xcTreeData = this.transformArr(dictData?.data);
+      this.matchXcTreeData(_xcTreeData, this.tableData);
+      console.log(_xcTreeData)
+      console.log(this.tableData)
     },
     async getMapData() {
       // 获取地图数据
@@ -192,6 +268,62 @@ export default {
             })
             ?.reverse() || [];
       });
+    },
+    // 树转换
+    transformArr(treeList) {
+      // 递归设置路径
+      function deepCalc(item, part = []) {
+        item.parts = [...part, item.key];
+        if (item.children?.length) {
+          item.children.forEach((v) => {
+            if (!v.children || v.children.length === 0) {
+              v.parts = [...item.parts, v.key];
+              v.content = v.remark || "";
+              delete v.children;
+            } else {
+              deepCalc(v, item.parts);
+            }
+          });
+        } else {
+          delete item.children;
+        }
+      }
+      treeList.forEach((item) => {
+        deepCalc(item);
+      });
+      return treeList;
+    },
+    // 匹配维修养护内容
+    matchXcTreeData(treeData, dataList) {
+      treeData.forEach((v) => {
+        if (!v.children?.length) {
+          for (const item of dataList) {
+            v.id = item.id;
+            if (intersection(v.parts, item.parts).length === v.parts.length) {
+              // 证明匹配成功
+              v.content = item.content || "";
+              break;
+            }
+          }
+        } else {
+          this.matchXcTreeData(v.children, dataList);
+        }
+      });
+    },
+    addProblems() {
+      this.problemsData.push({
+        problemLevel: '1',
+        poistion: '',
+        content: '',
+        problemImages: [],
+        status: '1',
+      })
+    },
+    delProblems() {
+
+    },
+    deleteTableItem() {
+
     }
   },
 };

src/views/dike/runManage/patrolMaintenance/defectList/index.vue

@@ -248,7 +248,9 @@ export default {
   mixins: [calcTableHeight],
   data() {
     return {
-      tableData: [],
+      tableData: [{
+        id: 1
+      }],
       maintenanceStatus: [],
       maintenanceCategory: [],
       maintenanceType: [],
@@ -350,7 +352,9 @@ export default {
         pageNum: this.pageData.pageNum,
       }).then((res) => {
         if (res) {
-          this.tableData = res.records;
+          this.tableData = [{
+            id: 1
+          }];
           this.pageData.total = res.total;
         }
       });