Pārlūkot izejas kodu

隔离点选中渲染表格数据接口对应

pm 1 gadu atpakaļ
vecāks
revīzija
a20fcd4460

+ 20 - 10
src/components/separationPoint/index.vue

@@ -4,7 +4,7 @@
 
 <script>
 import Konva from "konva";
-import {mapGetters} from 'vuex'
+import {selectIsIsolationPointById} from "@/api/mes/spm/segregationPoint"
 
 export default {
   name: "KonvaExample",
@@ -137,7 +137,7 @@ export default {
       positions.forEach((pos, index) => {
         const x = pos.col * 50; // 每个单元格宽度为50
         const y = pos.row * 50; // 每个单元格高度为50
-        const labelText = `E-${index + 1}`; // 对应的文字
+        const labelText = pos.pointName; // 对应的文字
 
         const point = new Image();
         point.src = imageSrc;
@@ -172,12 +172,24 @@ export default {
                 this.layer.draw(); // 更新图层
               };
 
-              // 将选中的 labelText 推入数组
-              this.selectedText.push({
-                label: labelText,
-                value: pos.pointId,
-              });
-              console.log(this.selectedText,'选中的隔离点')
+              this.$nextTick(()=>{
+                selectIsIsolationPointById(pos.pointId).then((res)=>{
+                  console.log(res,'拿到的隔离点信息');
+                  //将选中的 labelText 推入数组
+                  this.selectedText.push({
+                    label: res.data.pointName,
+                    value: res.data.pointId,
+                    pointType: res.data.pointType,
+                    powerType: res.data.powerType,
+                  });
+                  // this.selectedText.push({
+                  //   label: labelText,
+                  //   value: pos.pointId,
+                  // });
+
+                  this.$emit("selection-changed", this.selectedText);
+                })
+              })
 
             } else {
               // 取消选中状态
@@ -194,13 +206,11 @@ export default {
                 knovaImage.image(normalImage); // 更新图像
                 this.layer.draw(); // 更新图层
               };
-
               // 从选中数组中移除该项
               this.selectedText = this.selectedText.filter(
                 (item) => item.label !== labelText
               );
             }
-
             // 最后确保图层重新渲染
             this.layer.draw();
 

+ 20 - 6
src/views/mes/sop/sopm/NewSop.vue

@@ -103,13 +103,25 @@
                           }}</span>
                         </template>
                       </el-table-column>
-                      <el-table-column prop="isolation" label="隔离方式">
+                      <el-table-column prop="pointType" label="隔离点类型">
+                        <template slot-scope="scope">
+                          <dict-tag
+                            :options="dict.type.point_type"
+                            :value="scope.row.pointType"
+                          />
+                        </template>
                       </el-table-column>
                       <el-table-column
-                        prop="type"
+                        prop="powerType"
                         label="危险能量类型"
                         width="100"
                       >
+                        <template slot-scope="scope">
+                          <dict-tag
+                            :options="dict.type.power_type"
+                            :value="scope.row.powerType"
+                          />
+                        </template>
                       </el-table-column>
                     </el-table>
                   </div>
@@ -150,6 +162,7 @@ import SopLeft from "@/components/separationPoint/workshop.vue";
 import {addinsertIsSop} from "@/api/mes/sop/sopindex"
 export default {
   name: "addView",
+  dicts: ["power_type", "point_type"],
   components: {
     SopLeft,
     IsolationLeftVue,
@@ -238,7 +251,7 @@ export default {
     },
     // 子组件逆向传递选中的隔离点
     handleSelectPoint(points) {
-      console.log(points, "逆向传递选中的隔离点");
+      console.log(points, "父组件接收逆向传递选中的隔离点");
 
       // 使用 Set 来存储传递过来的点值
       const newValues = new Set(points.map((point) => point.value));
@@ -255,8 +268,8 @@ export default {
           this.tableData.push({
             point: point.label, // 显示的名称
             id: point.value, // 对应的值
-            isolation: "挂锁",
-            type: "电能",
+            pointType:point.pointType,
+            powerType:point.powerType,
           });
           // 将新点值添加到 Set 中
           existingValues.add(point.value);
@@ -265,10 +278,11 @@ export default {
 
       // 更新 form.spoint 为最新选中的隔离点数组
       this.form.spoint = points.map((point) => point.value);
+
     },
     // 车间你逆向传递拿到的隔离点数据
     handleProductLineSelected(selectedOption) {
-      console.log(selectedOption, '父组件接收到的 selectedOption');
+      // console.log(selectedOption, '父组件接收到的 selectedOption');
       this.points = selectedOption;
       this.form.workline=selectedOption.label
     },

+ 5 - 5
src/views/mes/spm/segregationpoint/index.vue

@@ -159,11 +159,11 @@
           />
         </template>
       </el-table-column> -->
-      <el-table-column label="隔离点图片" align="center" prop="pointPicture">
-        <template slot-scope="scope">
-          <img :src="scope.row.pointPicture" alt="" />
-        </template>
-      </el-table-column>
+<!--      <el-table-column label="隔离点图片" align="center" prop="pointPicture">-->
+<!--        <template slot-scope="scope">-->
+<!--          <img :src="scope.row.pointPicture" alt="" />-->
+<!--        </template>-->
+<!--      </el-table-column>-->
       <el-table-column label="隔离点类型" align="center" prop="pointType">
         <template slot-scope="scope">
           <dict-tag