修改作业票选择隔离点的交互；

删除sop新建页面作业票部分已选隔离点列表

src/views/mes/job/jobm/NewOperations.vue

@@ -252,64 +252,15 @@ export default {
         workContent: "",
         workshopName: "", //车间名称
         workline: "", //产线
-        spoint: "", //已选隔离点
+        spoint: [], //已选隔离点
         locker: "", //上锁人
         coLocker: "", //共锁人
         startTime: "", //开始时间
         endTime: "", //结束时间
       },
       hardwareTypeOption: null,
-      selectPoint: [
-        {
-          label: "E-1",
-          value: 1,
-        },
-        {
-          label: "E-2",
-          value: 2,
-        },
-        {
-          label: "E-3",
-          value: 3,
-        },
-        {
-          label: "E-4",
-          value: 4,
-        },
-        {
-          label: "E-5",
-          value: 5,
-        },
-        {
-          label: "E-6",
-          value: 6,
-        },
-        {
-          label: "E-7",
-          value: 7,
-        },
-      ],
       // 已选隔离点
-      tableData: [
-        {
-          id: 1,
-          point: "E-1",
-          isolation: "挂锁",
-          type: "电能",
-        },
-        {
-          id: 2,
-          point: "E-2",
-          isolation: "挂锁",
-          type: "电能",
-        },
-        {
-          id: 3,
-          point: "E-3",
-          isolation: "挂锁",
-          type: "电能",
-        },
-      ],
+      tableData: [],
       pickerOptions: {
         shortcuts: [
           {
@@ -357,17 +308,25 @@ export default {
     // 子组件逆向传递选中的隔离点
     handleSelectPoint(points) {
       console.log(points, "逆向传递选中的隔离点");
+      // 使用 Set 来存储传递过来的点值
+      const newValues = new Set(points.map((point) => point.value));
+
+      // 1. 删除取消选中的点
+      this.tableData = this.tableData.filter((item) => newValues.has(item.id));
+
+      // 2. 确保新增点不会重复
+      const existingValues = new Set(this.tableData.map((item) => item.id));
       points.forEach((point) => {
-        // 确保当前传递的点不重复添加
-        if (
-          !this.selectPoint.some(
-            (existingPoint) => existingPoint.value === point.value
-          )
-        ) {
-          this.selectPoint.push({
-            label: point.label, // 显示的名称
-            value: point.value, // 对应的值
+        // 如果当前传递的点不在已有的点集中，则添加
+        if (!existingValues.has(point.value)) {
+          this.tableData.push({
+            point: point.label, // 显示的名称
+            id: point.value, // 对应的值
+            isolation: "挂锁",
+            type: "电能",
           });
+          // 将新点值添加到 Set 中
+          existingValues.add(point.value);
         }
       });
 

src/views/mes/job/jobm/SeparationPoint.vue

@@ -3,188 +3,362 @@
 </template>
 
 <script>
-import Konva from 'konva'
+import Konva from "konva";
 
 export default {
-  name: 'KonvaExample',
+  name: "KonvaExample",
   data() {
     return {
       stage: null,
       layer: null,
       selectedStates: [], // 用于存储每个元素的选中状态
-      selectedText: [] // 用于存储未选中的元素文本
-    }
+      selectedText: [], // 用于存储未选中的元素文本
+    };
   },
   mounted() {
-    this.initKonva()
+    this.initKonva();
   },
   methods: {
+    // initKonva() {
+    //   // 创建舞台
+    //   this.stage = new Konva.Stage({
+    //     container: this.$refs.container, // 容器元素
+    //     width: 1250,
+    //     height: 830,
+    //     fill: 'black'
+    //   })
+
+    //   // 创建图层
+    //   this.layer = new Konva.Layer()
+
+    //   // 创建底图
+    //   const bgImage = new Image()
+    //   bgImage.src = require('@/assets/images/table.png')
+    //   bgImage.onload = () => {
+    //     const KnovaImage = new Konva.Image({
+    //       x: 350,
+    //       y: 10,
+    //       image: bgImage,
+    //       width: 500,
+    //       height: 790,
+    //       draggable: false
+    //     })
+    //     this.layer.add(KnovaImage)
+
+    //     this.layer.draw()
+    //   }
+    // // 调用函数
+    //   const imageSrc = require('@/assets/images/localSetIcon.jpg'); // 图片路径
+
+    //   this.renderGrid( imageSrc, 6, 3, 450, 100, 120, 100, 50, 50, 60, 25);
+    //   // 将图层添加到舞台
+    //   this.stage.add(this.layer)
+    //   this.layer.draw()
+
+    //   // 添加鼠标滚轮缩放功能
+    //   this.stage.on('wheel', (e) => {
+    //     e.evt.preventDefault()
+
+    //     const scaleBy = 1.05 // 缩放因子
+    //     const oldScale = this.stage.scaleX() // 获取当前缩放比例
+    //     const pointer = this.stage.getPointerPosition() // 获取鼠标位置
+
+    //     const mousePointTo = {
+    //       x: (pointer.x - this.stage.x()) / oldScale,
+    //       y: (pointer.y - this.stage.y()) / oldScale
+    //     }
+
+    //     // 根据滚轮滚动的方向决定缩放
+    //     const newScale = e.evt.deltaY > 0 ? oldScale / scaleBy : oldScale * scaleBy
+
+    //     this.stage.scale({ x: newScale, y: newScale })
+
+    //     const newPos = {
+    //       x: pointer.x - mousePointTo.x * newScale,
+    //       y: pointer.y - mousePointTo.y * newScale
+    //     }
+    //     this.stage.position(newPos)
+    //     this.stage.batchDraw()
+    //   })
+
+    //   this.stage.on('mousedown', function() {
+    //     this.stage.container().style.cursor = 'move'
+    //   }.bind(this))
+
+    //   this.stage.on('mouseup', function() {
+    //     this.stage.container().style.cursor = 'default'
+    //   }.bind(this))
+    //   this.stage.draggable(true)
+    // },
+
     initKonva() {
       // 创建舞台
       this.stage = new Konva.Stage({
         container: this.$refs.container, // 容器元素
-        width: 1250,
+        width: 1270,
         height: 830,
-        fill: 'black'
-      })
+      });
 
       // 创建图层
-      this.layer = new Konva.Layer()
+      this.layer = new Konva.Layer();
 
       // 创建底图
-      const bgImage = new Image()
-      bgImage.src = require('@/assets/images/table.png')
+      const bgImage = new Image();
+      bgImage.src = require("@/assets/images/table.png");
       bgImage.onload = () => {
-        const KnovaImage = new Konva.Image({
-          x: 350,
+        const knovaImage = new Konva.Image({
+          x: 330,
           y: 10,
           image: bgImage,
           width: 500,
           height: 790,
-          draggable: false
-        })
-        this.layer.add(KnovaImage)
+          draggable: false,
+        });
+        this.layer.add(knovaImage);
+        this.layer.draw();
+      };
 
-        this.layer.draw()
-      }
-    // 调用函数
-      const imageSrc = require('@/assets/images/localSetIcon.jpg'); // 图片路径
+      // 绘制无限网格
+      this.drawGrid(50, 50, "#e0e0e0"); // 每个单元格50x50，浅灰色网格
+
+      // 渲染数据
+      const imageSrc = require("@/assets/images/localSetIcon.jpg"); // 图片路径
+      this.renderGrid(imageSrc, 6, 3, 450, 100, 120, 100, 50, 50, 60, 25);
 
-      this.renderGrid( imageSrc, 6, 3, 450, 100, 120, 100, 50, 50, 60, 25);
       // 将图层添加到舞台
-      this.stage.add(this.layer)
-      this.layer.draw()
-
-      // 添加鼠标滚轮缩放功能
-      this.stage.on('wheel', (e) => {
-        e.evt.preventDefault()
-
-        const scaleBy = 1.05 // 缩放因子
-        const oldScale = this.stage.scaleX() // 获取当前缩放比例
-        const pointer = this.stage.getPointerPosition() // 获取鼠标位置
-
-        const mousePointTo = {
-          x: (pointer.x - this.stage.x()) / oldScale,
-          y: (pointer.y - this.stage.y()) / oldScale
-        }
-
-        // 根据滚轮滚动的方向决定缩放
-        const newScale = e.evt.deltaY > 0 ? oldScale / scaleBy : oldScale * scaleBy
-
-        this.stage.scale({ x: newScale, y: newScale })
-
-        const newPos = {
-          x: pointer.x - mousePointTo.x * newScale,
-          y: pointer.y - mousePointTo.y * newScale
-        }
-        this.stage.position(newPos)
-        this.stage.batchDraw()
-      })
-
-      this.stage.on('mousedown', function() {
-        this.stage.container().style.cursor = 'move'
-      }.bind(this))
-
-      this.stage.on('mouseup', function() {
-        this.stage.container().style.cursor = 'default'
-      }.bind(this))
-      this.stage.draggable(true)
+      this.stage.add(this.layer);
+      this.layer.draw();
+
+      // 禁止舞台拖拽
+      this.stage.draggable(false);
     },
-    renderGrid(imageSrc, rows, cols, startX, startY, xOffset, yOffset, imageWidth, imageHeight, rectWidth, rectHeight) {
-      // 初始化状态数组
-      this.selectedStates = new Array(rows * cols).fill(false);
-
-      for (let row = 0; row < rows; row++) {
-        for (let col = 0; col < cols; col++) {
-          const x = startX + col * xOffset;
-          const y = startY + row * yOffset;
-          const index = row * cols + col;
-
-          const point = new Image();
-          point.src = imageSrc;
-          point.onload = () => {
-            const knovaImage = new Konva.Image({
-              x: x,
-              y: y,
-              image: point,
-              width: imageWidth,
-              height: imageHeight,
-              draggable: false,
-            });
-
-            knovaImage.on('click', () => {
-              // 切换选中状态
-              this.selectedStates[index] = !this.selectedStates[index];
-
-              // 更新 selectedText 数组
-              if (this.selectedStates[index]) {
-                // 元素被选中，替换成选中的图片
-                point.src = require('@/assets/images/localSetSelect.jpg');
-
-                // 检查是否已经在 selectedText 数组中
-                if (!this.selectedText.some(item => item.value === index + 1)) {
-                  // 元素被选中，添加到 selectedText 数组
-                  this.selectedText.push({
-                    label: `E-${index + 1}`,
-                    value: index + 1
-                  });
-                }
-              } else {
-                // 元素未选中，恢复原图片
-                point.src = imageSrc;
-
-                // 元素未选中，从 selectedText 数组中移除
-                const textIndex = this.selectedText.findIndex(item => item.value === index + 1);
-                if (textIndex !== -1) {
-                  this.selectedText.splice(textIndex, 1); // 如果元素在 selectedText 中，移除它
-                }
-              }
-
-              knovaImage.image(point); // 更新图片
-              this.layer.draw(); // 重绘图层
-
-              // console.log(this.selectedText, '子组件选中的隔离点');
-
-              // 传递选中的元素文本到父组件
-              this.$emit('selection-changed', this.selectedText);
-            });
-
-
-
-            this.layer.add(knovaImage);
-
-            const rect = new Konva.Rect({
-              x: x - 3,
-              y: y + imageHeight + 10,
-              width: rectWidth,
-              height: rectHeight,
-              cornerRadius: 10,
-              stroke: 'red',
-              strokeWidth: 2,
-              fill: 'white',
-            });
-            this.layer.add(rect);
-
-            const text = new Konva.Text({
-              x: x + 12,
-              y: y + imageHeight + 15,
-              fontSize: 20,
-              text: `E-${index + 1}`,
-              fontFamily: 'Calibri',
-              fill: 'red',
-            });
-            this.layer.add(text);
 
-            this.layer.draw();
-          };
-        }
+    // 绘制无限网格
+    drawGrid(cellWidth, cellHeight, gridColor) {
+      const width = 1270;
+      const height = 830;
+
+      // 绘制竖线
+      for (let i = 0; i <= width; i += cellWidth) {
+        const verticalLine = new Konva.Line({
+          points: [i, 0, i, height],
+          stroke: gridColor,
+          strokeWidth: 1,
+        });
+        this.layer.add(verticalLine);
       }
-    }
 
-    //     methods结束
-  }
+      // 绘制横线
+      for (let j = 0; j <= height; j += cellHeight) {
+        const horizontalLine = new Konva.Line({
+          points: [0, j, width, j],
+          stroke: gridColor,
+          strokeWidth: 1,
+        });
+        this.layer.add(horizontalLine);
+      }
 
-}
+      this.layer.draw();
+    },
+    // renderGrid(
+    //   imageSrc,
+    //   rows,
+    //   cols,
+    //   startX,
+    //   startY,
+    //   xOffset,
+    //   yOffset,
+    //   imageWidth,
+    //   imageHeight,
+    //   rectWidth,
+    //   rectHeight
+    // ) {
+    //   // 初始化状态数组
+    //   this.selectedStates = new Array(rows * cols).fill(false);
+
+    //   for (let row = 0; row < rows; row++) {
+    //     for (let col = 0; col < cols; col++) {
+    //       const x = startX + col * xOffset;
+    //       const y = startY + row * yOffset;
+    //       const index = row * cols + col;
+
+    //       const point = new Image();
+    //       point.src = imageSrc;
+    //       point.onload = () => {
+    //         const knovaImage = new Konva.Image({
+    //           x: x,
+    //           y: y,
+    //           image: point,
+    //           width: imageWidth,
+    //           height: imageHeight,
+    //           draggable: false,
+    //         });
+
+    //         knovaImage.on("click", () => {
+    //           // 切换选中状态
+    //           this.selectedStates[index] = !this.selectedStates[index];
+
+    //           // 更新 selectedText 数组
+    //           if (this.selectedStates[index]) {
+    //             // 元素被选中，替换成选中的图片
+    //             point.src = require("@/assets/images/localSetSelect.jpg");
+
+    //             // 检查是否已经在 selectedText 数组中
+    //             if (
+    //               !this.selectedText.some((item) => item.value === index + 1)
+    //             ) {
+    //               // 元素被选中，添加到 selectedText 数组
+    //               this.selectedText.push({
+    //                 label: `E-${index + 1}`,
+    //                 value: index + 1,
+    //               });
+    //             }
+    //           } else {
+    //             // 元素未选中，恢复原图片
+    //             point.src = imageSrc;
+
+    //             // 元素未选中，从 selectedText 数组中移除
+    //             const textIndex = this.selectedText.findIndex(
+    //               (item) => item.value === index + 1
+    //             );
+    //             if (textIndex !== -1) {
+    //               this.selectedText.splice(textIndex, 1); // 如果元素在 selectedText 中，移除它
+    //             }
+    //           }
+
+    //           knovaImage.image(point); // 更新图片
+    //           this.layer.draw(); // 重绘图层
+
+    //           // console.log(this.selectedText, '子组件选中的隔离点');
+
+    //           // 传递选中的元素文本到父组件
+    //           this.$emit("selection-changed", this.selectedText);
+    //         });
+
+    //         this.layer.add(knovaImage);
+
+    //         const rect = new Konva.Rect({
+    //           x: x - 3,
+    //           y: y + imageHeight + 10,
+    //           width: rectWidth,
+    //           height: rectHeight,
+    //           cornerRadius: 10,
+    //           stroke: "red",
+    //           strokeWidth: 2,
+    //           fill: "white",
+    //         });
+    //         this.layer.add(rect);
+
+    //         const text = new Konva.Text({
+    //           x: x + 12,
+    //           y: y + imageHeight + 15,
+    //           fontSize: 20,
+    //           text: `E-${index + 1}`,
+    //           fontFamily: "Calibri",
+    //           fill: "red",
+    //         });
+    //         this.layer.add(text);
+
+    //         this.layer.draw();
+    //       };
+    //     }
+    //   }
+    // },
+
+    renderGrid(imageSrc) {
+      this.selectedStates = [];
+
+      const positions = [
+        { row: 2, col: 9 }, // E-1
+        { row: 2, col: 11 }, // E-2
+        { row: 2, col: 13 }, // E-3
+        { row: 4, col: 9 }, // E-4
+        { row: 4, col: 11 }, // E-5
+        { row: 4, col: 13 }, // E-6
+        { row: 6, col: 9 }, // E-7
+        { row: 6, col: 11 }, // E-8
+        { row: 6, col: 13 }, // E-9
+        { row: 8, col: 9 }, // E-10
+        { row: 8, col: 11 }, // E-11
+        { row: 8, col: 13 }, // E-12
+        { row: 10, col: 9 }, // E-13
+        { row: 10, col: 11 }, // E-14
+        { row: 10, col: 13 }, // E-15
+        { row: 12, col: 9 }, // E-16
+        { row: 12, col: 11 }, // E-17
+        { row: 12, col: 13 }, // E-18
+      ];
+
+      positions.forEach((pos, index) => {
+        const x = pos.col * 50; // 每个单元格宽度为50
+        const y = pos.row * 50; // 每个单元格高度为50
+
+        const point = new Image();
+        point.src = imageSrc;
+        point.onload = () => {
+          const knovaImage = new Konva.Image({
+            x: x,
+            y: y,
+            image: point,
+            width: 50,
+            height: 50,
+            draggable: false,
+          });
+
+          knovaImage.on("click", () => {
+            this.selectedStates[index] = !this.selectedStates[index];
+
+            if (this.selectedStates[index]) {
+              point.src = require("@/assets/images/localSetSelect.jpg");
+              this.selectedText.push({
+                label: `E-${index + 1}`,
+                value: index + 1,
+              });
+            } else {
+              point.src = imageSrc;
+              this.selectedText = this.selectedText.filter(
+                (item) => item.value !== index + 1
+              );
+            }
+
+            knovaImage.image(point);
+            this.layer.draw();
+
+            // 传递选中的元素文本到父组件
+            this.$emit("selection-changed", this.selectedText);
+          });
+
+          this.layer.add(knovaImage);
+
+          const rect = new Konva.Rect({
+            x: x - 3,
+            y: y + 55,
+            width: 60,
+            height: 25,
+            cornerRadius: 10,
+            stroke: "red",
+            strokeWidth: 2,
+            fill: "white",
+          });
+          this.layer.add(rect);
+
+          const text = new Konva.Text({
+            x: x + 12,
+            y: y + 60,
+            fontSize: 20,
+            text: `E-${index + 1}`,
+            fontFamily: "Calibri",
+            fill: "red",
+          });
+          this.layer.add(text);
+          this.layer.draw();
+        };
+      });
+    },
+
+    //     methods结束
+  },
+};
 </script>
 
 <style scoped lang="scss">

src/views/mes/sop/sopm/IsolationLeft.vue

@@ -19,165 +19,6 @@ export default {
     this.initKonva()
   },
   methods: {
-    // initKonva() {
-    //   // 创建舞台
-    //   this.stage = new Konva.Stage({
-    //     container: this.$refs.container, // 容器元素
-    //     width: 1250,
-    //     height: 830,
-    //     fill: 'black'
-    //   })
-    //
-    //   // 创建图层
-    //   this.layer = new Konva.Layer()
-    //
-    //   // 创建底图
-    //   const bgImage = new Image()
-    //   bgImage.src = require('@/assets/images/table.png')
-    //   bgImage.onload = () => {
-    //     const KnovaImage = new Konva.Image({
-    //       x: 350,
-    //       y: 10,
-    //       image: bgImage,
-    //       width: 500,
-    //       height: 790,
-    //       draggable: false
-    //     })
-    //     this.layer.add(KnovaImage)
-    //
-    //     this.layer.draw()
-    //   }
-    //   // 调用函数
-    //   const imageSrc = require('@/assets/images/localSetIcon.jpg'); // 图片路径
-    //
-    //   this.renderGrid(imageSrc, 6, 3, 450, 100, 120, 100, 50, 50, 60, 25);
-    //   // 将图层添加到舞台
-    //   this.stage.add(this.layer)
-    //   this.layer.draw()
-    //
-    //   // 添加鼠标滚轮缩放功能
-    //   this.stage.on('wheel', (e) => {
-    //     e.evt.preventDefault()
-    //
-    //     const scaleBy = 1.05 // 缩放因子
-    //     const oldScale = this.stage.scaleX() // 获取当前缩放比例
-    //     const pointer = this.stage.getPointerPosition() // 获取鼠标位置
-    //
-    //     const mousePointTo = {
-    //       x: (pointer.x - this.stage.x()) / oldScale,
-    //       y: (pointer.y - this.stage.y()) / oldScale
-    //     }
-    //
-    //     // 根据滚轮滚动的方向决定缩放
-    //     const newScale = e.evt.deltaY > 0 ? oldScale / scaleBy : oldScale * scaleBy
-    //
-    //     this.stage.scale({ x: newScale, y: newScale })
-    //
-    //     const newPos = {
-    //       x: pointer.x - mousePointTo.x * newScale,
-    //       y: pointer.y - mousePointTo.y * newScale
-    //     }
-    //     this.stage.position(newPos)
-    //     this.stage.batchDraw()
-    //   })
-    //
-    //   this.stage.on('mousedown', function() {
-    //     this.stage.container().style.cursor = 'move'
-    //   }.bind(this))
-    //
-    //   this.stage.on('mouseup', function() {
-    //     this.stage.container().style.cursor = 'default'
-    //   }.bind(this))
-    //   this.stage.draggable(true)
-    // },
-    // renderGrid(imageSrc, rows, cols, startX, startY, xOffset, yOffset, imageWidth, imageHeight, rectWidth, rectHeight) {
-    //   // 初始化状态数组
-    //   this.selectedStates = new Array(rows * cols).fill(false);
-    //
-    //   for (let row = 0; row < rows; row++) {
-    //     for (let col = 0; col < cols; col++) {
-    //       const x = startX + col * xOffset;
-    //       const y = startY + row * yOffset;
-    //       const index = row * cols + col;
-    //
-    //       const point = new Image();
-    //       point.src = imageSrc;
-    //       point.onload = () => {
-    //         const knovaImage = new Konva.Image({
-    //           x: x,
-    //           y: y,
-    //           image: point,
-    //           width: imageWidth,
-    //           height: imageHeight,
-    //           draggable: false,
-    //         });
-    //
-    //         knovaImage.on('click', () => {
-    //           // 切换选中状态
-    //           this.selectedStates[index] = !this.selectedStates[index];
-    //
-    //           // 更新 selectedText 数组
-    //           if (this.selectedStates[index]) {
-    //             // 元素被选中，替换成选中的图片
-    //             point.src = require('@/assets/images/localSetSelect.jpg');
-    //
-    //             // 检查是否已经在 selectedText 数组中
-    //             if (!this.selectedText.some(item => item.value === index + 1)) {
-    //               // 元素被选中，添加到 selectedText 数组
-    //               this.selectedText.push({
-    //                 label: `E-${index + 1}`,
-    //                 value: index + 1
-    //               });
-    //             }
-    //           } else {
-    //             // 元素未选中，恢复原图片
-    //             point.src = imageSrc;
-    //
-    //             // 元素未选中，从 selectedText 数组中移除
-    //             const textIndex = this.selectedText.findIndex(item => item.value === index + 1);
-    //             if (textIndex !== -1) {
-    //               this.selectedText.splice(textIndex, 1); // 如果元素在 selectedText 中，移除它
-    //             }
-    //           }
-    //
-    //           knovaImage.image(point); // 更新图片
-    //           this.layer.draw(); // 重绘图层
-    //
-    //           // console.log(this.selectedText, '子组件选中的隔离点');
-    //
-    //           // 传递选中的元素文本到父组件
-    //           this.$emit('selection-changed', this.selectedText);
-    //         });
-    //
-    //         this.layer.add(knovaImage);
-    //
-    //         const rect = new Konva.Rect({
-    //           x: x - 3,
-    //           y: y + imageHeight + 10,
-    //           width: rectWidth,
-    //           height: rectHeight,
-    //           cornerRadius: 10,
-    //           stroke: 'red',
-    //           strokeWidth: 2,
-    //           fill: 'white',
-    //         });
-    //         this.layer.add(rect);
-    //
-    //         const text = new Konva.Text({
-    //           x: x + 12,
-    //           y: y + imageHeight + 15,
-    //           fontSize: 20,
-    //           text: `E-${index + 1}`,
-    //           fontFamily: 'Calibri',
-    //           fill: 'red',
-    //         });
-    //         this.layer.add(text);
-    //
-    //         this.layer.draw();
-    //       };
-    //     }
-    //   }
-    // }
     initKonva() {
       // 创建舞台
       this.stage = new Konva.Stage({
@@ -333,10 +174,6 @@ export default {
         };
       });
     },
-
-
-
-
     //     methods结束
   }
 

src/views/mes/sop/sopm/NewSop.vue

@@ -4,7 +4,7 @@
     <div class="left">
       <!-- <h1>我是左边</h1> -->
       <SopLeft v-if="this.activeName == 'first'" />
-      <IsolationLeftVue v-else @selection-changed="handleSelectPoint"/>
+      <IsolationLeftVue v-else @selection-changed="handleSelectPoint" />
     </div>
     <div class="right">
       <div class="right_top">
@@ -58,34 +58,8 @@
                       :rows="5"
                     ></el-input>
                   </el-form-item>
-                  <div class="text item">
-                    <p>已选隔离点</p>
-                    <el-table
-                      :data="tableData"
-                      stripe
-                      height="280"
-                      style="width: 100%"
-                    >
-                      <el-table-column prop="id" label="序号" width="60">
-                      </el-table-column>
-                      <el-table-column prop="point" label="已选隔离点">
-                        <template slot-scope="scope">
-                          <span style="color: #2a87ff">{{
-                            scope.row.point
-                          }}</span>
-                        </template>
-                      </el-table-column>
-                      <el-table-column prop="isolation" label="隔离方式">
-                      </el-table-column>
-                      <el-table-column
-                        prop="type"
-                        label="危险能量类型"
-                        width="100"
-                      >
-                      </el-table-column>
-                    </el-table>
-                  </div>
-                  <el-form-item label="" prop="">
+
+                  <el-form-item label="" prop="" style="margin-top: 95%">
                     <el-button
                       style="float: right; height: 30px; line-height: 10px"
                       type="primary"
@@ -241,23 +215,23 @@ export default {
     // 子组件逆向传递选中的隔离点
     // 子组件逆向传递选中的隔离点
     handleSelectPoint(points) {
-      console.log(points, '逆向传递选中的隔离点');
+      console.log(points, "逆向传递选中的隔离点");
 
       // 使用 Set 来存储传递过来的点值
-      const newValues = new Set(points.map(point => point.value));
+      const newValues = new Set(points.map((point) => point.value));
 
       // 1. 删除取消选中的点
-      this.tableData = this.tableData.filter(item => newValues.has(item.id));
+      this.tableData = this.tableData.filter((item) => newValues.has(item.id));
 
       // 2. 确保新增点不会重复
-      const existingValues = new Set(this.tableData.map(item => item.id));
+      const existingValues = new Set(this.tableData.map((item) => item.id));
 
-      points.forEach(point => {
+      points.forEach((point) => {
         // 如果当前传递的点不在已有的点集中，则添加
         if (!existingValues.has(point.value)) {
           this.tableData.push({
-            point: point.label,  // 显示的名称
-            id: point.value,     // 对应的值
+            point: point.label, // 显示的名称
+            id: point.value, // 对应的值
             isolation: "挂锁",
             type: "电能",
           });
@@ -267,8 +241,8 @@ export default {
       });
 
       // 更新 form.spoint 为最新选中的隔离点数组
-      this.form.spoint = points.map(point => point.value);
-    }
+      this.form.spoint = points.map((point) => point.value);
+    },
 
     //   methods结束
   },
@@ -287,7 +261,7 @@ export default {
   .left {
     width: 75%;
     height: 830px;
-     background: #eee;
+    background: #eee;
     margin-right: 10px;
   }
   .right {