隔离点，作业票模块查看功能实现

src/components/separationPoint/index.vue

@@ -4,7 +4,10 @@
 
 <script>
 import Konva from "konva";
-import { selectIsIsolationPointById,getIsIsolationPointPage } from "@/api/mes/spm/segregationPoint";
+import {
+  selectIsIsolationPointById,
+  getIsIsolationPointPage,
+} from "@/api/mes/spm/segregationPoint";
 import { mapGetters } from "vuex";
 
 export default {
@@ -34,11 +37,16 @@ export default {
     console.log(
       this.getSelectSopPoints,
       this.getSopEdit,
+      this.getSopLook,
       "getSopEdit - getSelectSopPoints"
     );
   },
   computed: {
-    ...mapGetters("sopSelectPoints", ["getSelectSopPoints", "getSopEdit"]),
+    ...mapGetters("sopSelectPoints", [
+      "getSelectSopPoints",
+      "getSopEdit",
+      "getSopLook",
+    ]),
   },
   methods: {
     initKonva() {
@@ -126,6 +134,7 @@ export default {
       const isLocked = this.getSelectSopPoints.length > 0;
 
       // 添加或移除全局点击事件监听器 this.getSopEdit这是vuex里判断是否可以选择隔离点的操作
+
       if (isLocked && this.getSopEdit == true) {
         this.layer.on("click", (e) => {
           e.cancelBubble = true; // 阻止事件冒泡
@@ -152,7 +161,7 @@ export default {
             draggable: false,
           });
           // 添加点击事件，仅当 getSopEdit 为 true 时才允许点击a
-          if (this.getSopEdit == true) {
+          if (this.getSopEdit == true && this.getSopLook == false) {
             knovaImage.on("click", () => {
               // 切换选中状态，基于文本内容
               this.selectedStates[labelText] = !this.selectedStates[labelText];
@@ -174,7 +183,10 @@ export default {
                 // 获取隔离点信息，并将选中的 labelText 推入数组
 
                 this.$nextTick(() => {
-                  if(this.$route.query.sopId!==null||this.$route.query.ticketId!==null){
+                  if (
+                    this.$route.query.sopId !== null ||
+                    this.$route.query.ticketId !== null
+                  ) {
                     selectIsIsolationPointById(pos.pointId).then((res) => {
                       this.selectedText.push({
                         pointName: res.data.pointName,
@@ -182,11 +194,10 @@ export default {
                         pointType: res.data.pointType,
                         powerType: res.data.powerType,
                       });
-                      console.log(this.selectedText,'$emit');
+                      console.log(this.selectedText, "$emit");
                       this.$emit("selection-changed", this.selectedText);
                     });
                   }
-
                 });
               } else {
                 // 取消选中状态，恢复普通矩形和文字，切换为未选中的图片
@@ -214,7 +225,6 @@ export default {
             });
           }
 
-
           this.layer.add(knovaImage);
 
           // 普通矩形
@@ -287,39 +297,42 @@ export default {
               knovaImage.image(selectedImage); // 更新图像
               this.layer.draw(); // 更新图层
             };
-          // 将选中的 labelText 推入数组
+            // 将选中的 labelText 推入数组
             this.$nextTick(() => {
-              getIsIsolationPointPage({ current: 1, size: 100 }).then((res) => {
-                const allPoints = res.data.records; // 假设返回的数据结构是 { records: [点数据] }
-
-                // 根据 pos.pointId 查找对应的 pointType 和 powerType
-                const pointInfo = allPoints.find(point => point.pointId == pos.pointId);
-
-                if (pointInfo) {
-                  this.selectedText.push({
-                    pointName: labelText,
-                    pointId: pos.pointId,
-                    pointType: pointInfo.pointType,
-                    powerType: pointInfo.powerType,
-                  });
-                } else {
-                  // 如果没有找到对应的点信息，可以处理这种情况
-                  console.warn(`未找到 pointId 为 ${pos.pointId} 的点信息`);
-                  this.selectedText.push({
-                    pointName: labelText,
-                    pointId: pos.pointId,
-                    pointType: '',
-                    powerType: '',
-                  });
-                }
-                // console.log(this.selectedText,'默认拿到的points')
-                // 触发父组件的 selection-changed 事件
-                this.$emit("selection-changed", this.selectedText);
-              }).catch((error) => {
-                console.error("获取隔离点信息失败", error);
-              });
+              getIsIsolationPointPage({ current: 1, size: 100 })
+                .then((res) => {
+                  const allPoints = res.data.records; // 假设返回的数据结构是 { records: [点数据] }
+
+                  // 根据 pos.pointId 查找对应的 pointType 和 powerType
+                  const pointInfo = allPoints.find(
+                    (point) => point.pointId == pos.pointId
+                  );
+
+                  if (pointInfo) {
+                    this.selectedText.push({
+                      pointName: labelText,
+                      pointId: pos.pointId,
+                      pointType: pointInfo.pointType,
+                      powerType: pointInfo.powerType,
+                    });
+                  } else {
+                    // 如果没有找到对应的点信息，可以处理这种情况
+                    console.warn(`未找到 pointId 为 ${pos.pointId} 的点信息`);
+                    this.selectedText.push({
+                      pointName: labelText,
+                      pointId: pos.pointId,
+                      pointType: "",
+                      powerType: "",
+                    });
+                  }
+                  // console.log(this.selectedText,'默认拿到的points')
+                  // 触发父组件的 selection-changed 事件
+                  this.$emit("selection-changed", this.selectedText);
+                })
+                .catch((error) => {
+                  console.error("获取隔离点信息失败", error);
+                });
             });
-
           }
 
           this.layer.draw();

src/components/separationPoint/workshop.vue

@@ -5,6 +5,7 @@
       <el-form ref="form" :model="form" label-width="100px" :inline="true">
         <el-form-item label="车间">
           <el-select
+            :disabled="this.getSopLook"
             v-model="form.workShop"
             placeholder="请选择车间"
             @change="handleselect"
@@ -49,6 +50,7 @@
         </el-form-item>
         <el-form-item label="生产线">
           <el-select
+            :disabled="this.getSopLook"
             v-model="form.producLine"
             placeholder="请选择生产线"
             @change="handleselectProductLine"
@@ -125,6 +127,7 @@ export default {
           });
           // 调用 Vuex action 来存储 selectSopPoints
           this.setSelectSopPoints(selectSopPoints);
+          
           this.setSopEdit(true);
           console.log(selectSopPoints, "sop_selectePoints");
         });
@@ -157,6 +160,7 @@ export default {
             // 调用 Vuex action 来存储 selectSopPoints
             this.setSelectSopPoints(selectSopPoints);
             this.setPointTableData(res.data);
+         
             this.setSopEdit(false);
             console.log(selectSopPoints, "sop_selectePoints");
           });
@@ -175,12 +179,15 @@ export default {
   mounted() {
     this.getworkshopList();
   },
-
+  computed: {
+    ...mapGetters("sopSelectPoints", ["getSopLook"]),
+  },
   methods: {
     ...mapActions("sopSelectPoints", [
       "setSelectSopPoints",
       "setPointTableData",
       "setSopEdit",
+      
     ]),
 
     // 获取车间列表

src/router/index.js

@@ -126,6 +126,13 @@ export const dynamicRoutes = [
         meta: { title: 'SOP管理-编辑SOP', activeMenu: '/mes/sop/sopm/NewSop' },
 
       },
+      {
+        path: 'NewSopLook',
+        component: () => import('@/views/mes/sop/sopm/NewSop'),
+        name: 'NewSopEdit',
+        meta: { title: 'SOP管理-查看SOP', activeMenu: '/mes/sop/sopm/NewSop' },
+
+      },
     ]
   },
   {
@@ -150,9 +157,9 @@ export const dynamicRoutes = [
       },
       {
         path: 'LookJob',
-        component: () => import('@/views/mes/job/jobm/LookJob'),
+        component: () => import('@/views/mes/job/jobm/NewOperations'),
         name: 'LookJob',
-        meta: { title: '作业管理-查看作业票', activeMenu: '/mes/job/jobm/LookJob' }
+        meta: { title: '作业管理-查看作业票', activeMenu: '/mes/job/jobm/NewOperations' }
       },
 
     ]

src/store/modules/sopSelectPoints.js

@@ -4,7 +4,9 @@ const state = {
   PointTableData: [],
   sopEdit: true,
   sopTitle: '',
-  ticketTitle: ''
+  ticketTitle: '',
+  sopLook: false,
+  
 };
 
 const mutations = {
@@ -23,7 +25,10 @@ const mutations = {
   setTicketTitle(state, points) {
     state.ticketTitle = points;
   },
-
+  setSopLook(state, points) {
+    state.sopLook = points;
+  },
+ 
 };
 
 const actions = {
@@ -42,6 +47,10 @@ const actions = {
   setTicketTitle({ commit }, points) {
     commit('setTicketTitle', points);
   },
+  setSopLook({ commit }, points) {
+    commit('setSopLook', points);
+  },
+
 };
 
 const getters = {
@@ -49,7 +58,9 @@ const getters = {
   getPointTableData: state => state.PointTableData,
   getSopEdit: state => state.sopEdit,
   getSopTitle: state => state.sopTitle,
-  getTicketTitle: state => state.ticketTitle
+  getTicketTitle: state => state.ticketTitle,
+  getSopLook: state => state.sopLook,
+  
 };
 
 export default {

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

@@ -1,132 +0,0 @@
-<template>
-  <div class="detailall">
-    <div class="left">
-      <div class="leftpoint">
-        <p class="item">E-1</p>
-      </div>
-      <div class="rightstatus">
-        <p>隔离点上锁状态</p>
-        <section>
-          <span>上锁人:</span>
-          <div class="status">
-            <img src="@/assets/images/colocked.png" alt="" />
-            <b>已上锁</b>
-          </div>
-        </section>
-      </div>
-    </div>
-    <div class="right">
-      <h6>作业基础信息</h6>
-      <div class="bottomcon"></div>
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      tabPosition: "left",
-    };
-  },
-};
-</script>
-
-<style scoped lang="scss">
-.detailall {
-  width: 100%;
-  height: 91vh;
-  padding: 1% 2%;
-  display: flex;
-  background: #eff0f2;
-  // 左边内容
-  .left {
-    width: 60%;
-    height: 820px;
-    margin: 0 1% 0 0;
-    padding: 0;
-    display: flex;
-    // 左边隔离点
-    .leftpoint {
-      width: 100px;
-      height: 100%;
-      background-color: rgba(164, 173, 179, 1);
-      .item {
-        width: 100%;
-        height: 60px;
-        line-height: 20px;
-        color: rgba(51, 51, 51, 1);
-        font-size: 14px;
-        text-align: center;
-        font-family: Roboto;
-      }
-    }
-    // 隔离点上锁状态
-    .rightstatus {
-      width: 800px;
-      height: 880px;
-      background: #fff;
-      p {
-        display: block;
-        width: 97%;
-        height: 32px;
-        margin: 2% 0;
-        // background: pink;
-        color: rgb(23, 43, 77);
-        font-size: 18px;
-        text-align: left;
-        font-family: SourceHanSansSC-regular;
-        border-bottom: 1px solid rgba(223, 225, 230, 1);
-      }
-      section {
-        width: 97%;
-        height: 60px;
-        display: flex;
-        border-bottom: 1px solid rgba(15, 64, 245, 1);
-        span {
-          line-height: 52px;
-          color: rgba(16, 16, 16, 1);
-          font-size: 14px;
-          text-align: center;
-          font-weight: bolder;
-          font-family: Roboto;
-        }
-        .status {
-          width: 96px;
-          height: 35px;
-          line-height: 20px;
-          border-radius: 4px;
-          background-color: rgba(255, 255, 255, 1);
-          color: rgba(16, 16, 16, 1);
-          font-size: 14px;
-          text-align: center;
-          font-family: Roboto;
-          border: 1px solid rgba(76, 61, 236, 1);
-          margin: 2% 4%;
-          img {
-            width: 23px;
-            height: 22px;
-            position: relative;
-            top: 12%;
-            left: -8%;
-          }
-          b {
-            color: rgba(16, 16, 16, 1);
-            font-size: 14px;
-            text-align: left;
-            position: relative;
-            top: -6%;
-            font-family: PingFangSC-bold;
-          }
-        }
-      }
-    }
-  }
-  // 右边信息
-  .right {
-    width: 38%;
-    height: 820px;
-    background: #fff;
-  }
-}
-</style>

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

@@ -40,6 +40,7 @@
                 <el-form ref="form" :model="form" label-width="90px">
                   <el-form-item label="选择SOP" prop="sop">
                     <el-select
+                      :disabled="this.getSopLook"
                       v-model="form.sopId"
                       placeholder="请选择sop"
                       clearable
@@ -58,6 +59,7 @@
                     <el-col :span="16">
                       <el-form-item label="作业票编号" prop="ticketCode">
                         <el-input
+                          :disabled="this.getSopLook"
                           v-model="form.ticketCode"
                           placeholder="请输入作业票编号"
                           style="width: 100%"
@@ -67,6 +69,7 @@
                     <el-col :span="8">
                       <el-form-item label-width="80">
                         <el-switch
+                          :disabled="this.getSopLook"
                           v-model="autoGenFlag"
                           active-color="#13ce66"
                           active-text="自动生成"
@@ -80,6 +83,7 @@
 
                   <el-form-item label="作业票名称" prop="ticketName">
                     <el-input
+                      :disabled="this.getSopLook"
                       v-model="form.ticketName"
                       placeholder="请输入作业票名称"
                       style="width: 100%"
@@ -87,6 +91,7 @@
                   </el-form-item>
                   <el-form-item label="作业票类型" prop="ticketType">
                     <el-select
+                      :disabled="this.getSopLook"
                       v-model="form.ticketType"
                       placeholder="请选择作业类型"
                       clearable
@@ -102,6 +107,7 @@
                   </el-form-item>
                   <el-form-item label="作业内容" prop="ticketContent">
                     <el-input
+                      :disabled="this.getSopLook"
                       type="textarea"
                       v-model="form.ticketContent"
                       :rows="4"
@@ -206,6 +212,7 @@
                 <el-form ref="form" :model="form" label-width="70px">
                   <el-form-item label="开始时间" prop="ticketStartTime">
                     <el-date-picker
+                      :disabled="this.getSopLook"
                       v-model="form.ticketStartTime"
                       type="datetime"
                       placeholder="选择日期时间"
@@ -218,6 +225,7 @@
                   </el-form-item>
                   <el-form-item label="结束时间" prop="ticketEndTime">
                     <el-date-picker
+                      :disabled="this.getSopLook"
                       v-model="form.ticketEndTime"
                       type="datetime"
                       placeholder="选择日期时间"
@@ -230,6 +238,7 @@
                   </el-form-item>
                   <el-form-item label="上锁人" prop="locker">
                     <el-select
+                      :disabled="this.getSopLook"
                       v-model="form.locker"
                       placeholder="上锁人"
                       clearable
@@ -280,7 +289,7 @@
                     <el-table
                       :data="sortedTicketUserDTOList"
                       stripe
-                      height="480"
+                      height="400"
                       style="width: 100%"
                     >
                       <el-table-column prop="userId" label="序号" width="50">
@@ -299,7 +308,7 @@
                       <el-table-column prop="userRole" label="共锁人来源">
                         <template slot-scope="scope">
                           <span>{{
-                            scope.row.userRole ? "内部" : "外部"
+                            scope.row.userRole == "0" ? "内部" : "外部"
                           }}</span>
                         </template>
                       </el-table-column>
@@ -319,7 +328,7 @@
                     </el-table>
                   </div>
 
-                  <el-form-item label="" prop="" style="margin-top: 100%">
+                  <el-form-item label="" prop="">
                     <el-button
                       style="float: right; height: 30px; line-height: 10px"
                       type="primary"
@@ -545,6 +554,7 @@ export default {
       "getSelectSopPoints",
       "getSopEdit",
       "getTicketTitle",
+      "getSopLook",
     ]),
     // 排序 ticketUserDTOList，将 userRole 为 0 的选项放在前面
     sortedTicketUserDTOList() {
@@ -1011,7 +1021,7 @@ export default {
       this.title = "添加内部人员";
       this.insideMumber = true;
       this.outsideMumber = false;
-      this.form.ticketUserDTOList = [];
+      // this.form.ticketUserDTOList = [];
       this.dialogForm.deptId = "";
       this.dialogForm.nickName = "";
     },
@@ -1028,7 +1038,9 @@ export default {
     },
     // 人员列表删除
     deleteRow(index, rows) {
+      console.log(index, rows, "删除的行");
       rows.splice(index, 1);
+      this.form.ticketUserDTOList.splice(index, 1);
     },
 
     //   时间选项
@@ -1061,7 +1073,7 @@ export default {
         (this.autoGenFlag = false);
     },
 
-    // 侧边x关闭
+    // 侧边x关闭函数
     goBack() {
       this.$router.push("/job/jobm");
     },

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

@@ -173,7 +173,11 @@
       @selection-change="handleSelectionChange"
     >
       <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="作业票Id" prop="ticketId" width="75"></el-table-column>
+      <el-table-column
+        label="作业票Id"
+        prop="ticketId"
+        width="75"
+      ></el-table-column>
       <el-table-column label="作业票编号" align="center" prop="ticketCode">
         <!-- <template slot-scope="scope">
           <el-button
@@ -254,13 +258,13 @@
 </template>
 
 <script>
-import { getJobTicketInfo, listJobTicket } from '@/api/mes/job/job'
+import { getJobTicketInfo, listJobTicket } from "@/api/mes/job/job";
 import {
   workshoplistAll,
   getIsWorkareaList,
 } from "@/api/mes/spm/segregationPoint";
 import { genCode } from "@/api/system/autocode/rule";
-
+import { mapActions } from "vuex";
 export default {
   name: "Team",
   dicts: ["ticket_type", "ticket_status"],
@@ -347,6 +351,11 @@ export default {
   },
 
   methods: {
+    ...mapActions("sopSelectPoints", [
+      "setSopEdit",
+      "setSopLook",
+      "setJobLook",
+    ]),
     // 格式化日期查询数据
     formatDate(date) {
       if (date && date instanceof Date && !isNaN(date)) {
@@ -367,7 +376,7 @@ export default {
         this.queryParams.endTime = this.formatDate(this.createTime[1]);
       }
       listJobTicket(this.queryParams).then((response) => {
-        console.log(response,'response--作业票列表')
+        console.log(response, "response--作业票列表");
         this.jobList = response.data.records;
         this.total = response.data.total;
         this.loading = false;
@@ -461,27 +470,24 @@ export default {
       this.$router.push(`/mes/job/jobm/NewOperations?ticketId=null`);
       this.title = "添加隔离点";
       this.optType = "add";
+      this.setSopLook(false);
     },
     // 查看
-    handleLook() {
-      this.$router.push("/mes/job/jobm/LookJob");
-    },
-    // 查询明细按钮操作
-    handleView(row) {
-      this.reset();
-      const teamId = row.teamId || this.ids;
-      getTeam(teamId).then((response) => {
-        this.form = response.data;
-        this.open = true;
-        this.title = "查看班组";
-        this.optType = "view";
-      });
+    handleLook(row) {
+      // 设置为true表示作业票里查看不可以点击隔离点
+      this.setSopLook(true);
+      this.$router.push(`/mes/job/jobm/LookJob?ticketId=${row.ticketId}`);
     },
+
     /** 修改按钮操作 */
     handleUpdate(row) {
       this.reset();
       const teamId = row.ticketId || this.ids;
-      this.$router.push(`/mes/job/jobm/NewOperationsEdit?ticketId=${row.ticketId}`);
+      this.setSopLook(false);
+
+      this.$router.push(
+        `/mes/job/jobm/NewOperationsEdit?ticketId=${row.ticketId}`
+      );
       getJobTicketInfo(teamId).then((response) => {
         this.form = response.data;
         this.open = true;

src/views/mes/md/workarea/MapData.vue

@@ -4,7 +4,6 @@
     <div class="left">
       <el-input v-model="value" type="textarea" :rows="38" ></el-input>
       <el-button @click="refresh" type="primary" style="width: 80px;align-self: flex-end">刷新</el-button>
-
     </div>
   </div>
 

src/views/mes/md/workarea/index.vue

@@ -277,7 +277,7 @@ import {
 } from "@/api/mes/wa/workarea";
 
 import { genCode } from "@/api/system/autocode/rule";
-import { mapState } from "vuex";
+import { mapActions, mapState } from "vuex";
 
 export default {
   name: "index",
@@ -338,6 +338,7 @@ export default {
     this.getList();
   },
   methods: {
+    
     /** 查询班组列表 */
     getList() {
       this.loading = true;

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

@@ -40,6 +40,7 @@
                 <el-form ref="form" :model="form" label-width="70px">
                   <el-form-item label="SOP名称" prop="sopName">
                     <el-input
+                      :disabled="this.getSopLook"
                       v-model="form.sopName"
                       placeholder="请输入SOP名称"
                       style="width: 100%"
@@ -49,6 +50,7 @@
                     <el-col :span="16">
                       <el-form-item label="SOP编号" prop="sopCode">
                         <el-input
+                          :disabled="this.getSopLook"
                           v-model="form.sopCode"
                           placeholder="请输入SOP编号"
                           style="width: 100%"
@@ -58,6 +60,7 @@
                     <el-col :span="8">
                       <el-form-item label-width="80">
                         <el-switch
+                          :disabled="this.getSopLook"
                           v-model="autoGenFlag"
                           active-color="#13ce66"
                           active-text="自动生成"
@@ -70,6 +73,7 @@
 
                   <el-form-item label="SOP类型" prop="sopType">
                     <el-select
+                      :disabled="this.getSopLook"
                       v-model="form.sopType"
                       placeholder="请选择SOP类型"
                       clearable
@@ -85,6 +89,7 @@
                   </el-form-item>
                   <el-form-item label="SOP内容" prop="sopContent">
                     <el-input
+                      :disabled="this.getSopLook"
                       type="textarea"
                       v-model="form.sopContent"
                       :rows="5"
@@ -164,6 +169,7 @@
                   </div>
                   <el-form-item label="" prop="">
                     <el-button
+                      :disabled="this.getSopLook"
                       style="float: right; height: 30px; line-height: 10px"
                       type="primary"
                       @click="submit"
@@ -270,7 +276,7 @@ export default {
     }
   },
   computed: {
-    ...mapGetters("sopSelectPoints", ["getSopTitle"]),
+    ...mapGetters("sopSelectPoints", ["getSopTitle", "getSopLook"]),
   },
   methods: {
     ...mapActions("sopSelectPoints", [

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

@@ -204,7 +204,7 @@
             icon="el-icon-view"
             @click="handleLook(scope.row)"
             v-hasPermi="['mes:sop:sopm:progress']"
-          >查看
+            >查看
           </el-button>
           <el-button
             size="mini"
@@ -240,6 +240,7 @@ import {
   selectIsSopById,
 } from "@/api/mes/sop/sopindex";
 import { genCode } from "@/api/system/autocode/rule";
+import { mapActions } from "vuex";
 export default {
   name: "Team",
 
@@ -326,7 +327,7 @@ export default {
   },
 
   methods: {
-
+    ...mapActions("sopSelectPoints", ["setSopEdit", "setSopLook"]),
     // 格式化日期查询数据
     formatDate(date) {
       if (date && date instanceof Date && !isNaN(date)) {
@@ -434,6 +435,8 @@ export default {
     /** 新增按钮操作a */
     handleAdd() {
       this.reset();
+      
+      this.setSopLook(false);
       this.$router.push("/mes/sop/sopm/NewSop?sopId=null");
       this.title = "添加隔离点";
       // 新增或修改
@@ -442,8 +445,15 @@ export default {
     /** 修改按钮操作 */
     handleUpdate(row) {
       this.reset();
+      this.setSopLook(false);
       this.$router.push(`/mes/sop/sopm/NewSopEdit?sopId=${row.sopId}`);
     },
+    // 查看操作
+    handleLook(row) {
+      // 设置为true表示作业票里查看不可以点击隔离点
+      this.setSopLook(true);
+      this.$router.push(`/mes/sop/sopm/NewSopLook?sopId=${row.sopId}`);
+    },
     /** 删除按钮操作 */
     handleDelete(row) {
       const sopIds = row.sopId || this.ids;