feature/工序操作tabbel样式修改

src/assets/icons/baogu.svg

@@ -1,7 +1,7 @@
 <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M24 10.3345C18.1099 10.3345 13.335 15.1094 13.335 20.9995V33.6645H34.665V20.9995C34.665 15.1094 29.8901 10.3345 24 10.3345ZM10.665 20.9995C10.665 13.6348 16.6353 7.66452 24 7.66452C31.3647 7.66452 37.335 13.6348 37.335 20.9995V34.9995C37.335 35.7368 36.7373 36.3345 36 36.3345H12C11.2627 36.3345 10.665 35.7368 10.665 34.9995V20.9995Z" fill="black" fill-opacity="0.9"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M6.66503 41.9995C6.66503 41.2622 7.26273 40.6645 8.00003 40.6645H40C40.7373 40.6645 41.335 41.2622 41.335 41.9995C41.335 42.7368 40.7373 43.3345 40 43.3345H8.00003C7.26273 43.3345 6.66503 42.7368 6.66503 41.9995Z" fill="black" fill-opacity="0.9"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M2.73354 12.5774C2.9667 11.8779 3.72273 11.4999 4.4222 11.733L7.4222 12.733C8.12166 12.9662 8.49968 13.7222 8.26653 14.4217C8.03337 15.1212 7.27734 15.4992 6.57787 15.266L3.57787 14.266C2.87841 14.0329 2.50039 13.2768 2.73354 12.5774Z" fill="black" fill-opacity="0.9"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M12.5779 2.73293C13.2773 2.49978 14.0334 2.8778 14.2665 3.57726L15.2665 6.57726C15.4997 7.27672 15.1217 8.03276 14.4222 8.26592C13.7227 8.49907 12.9667 8.12105 12.7335 7.42159L11.7335 4.42159C11.5004 3.72212 11.8784 2.96609 12.5779 2.73293Z" fill="black" fill-opacity="0.9"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M6.05614 6.05543C6.57749 5.53408 7.42276 5.53408 7.94411 6.05543L10.9441 9.05543C11.4655 9.57677 11.4655 10.422 10.9441 10.9434C10.4228 11.4648 9.5775 11.4648 9.05615 10.9434L6.05614 7.9434C5.53479 7.42205 5.53479 6.57678 6.05614 6.05543Z" fill="black" fill-opacity="0.9"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M24 10.3345C18.1099 10.3345 13.335 15.1094 13.335 20.9995V33.6645H34.665V20.9995C34.665 15.1094 29.8901 10.3345 24 10.3345ZM10.665 20.9995C10.665 13.6348 16.6353 7.66452 24 7.66452C31.3647 7.66452 37.335 13.6348 37.335 20.9995V34.9995C37.335 35.7368 36.7373 36.3345 36 36.3345H12C11.2627 36.3345 10.665 35.7368 10.665 34.9995V20.9995Z" fill="currentcolor" fill-opacity="0.9"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6.66503 41.9995C6.66503 41.2622 7.26273 40.6645 8.00003 40.6645H40C40.7373 40.6645 41.335 41.2622 41.335 41.9995C41.335 42.7368 40.7373 43.3345 40 43.3345H8.00003C7.26273 43.3345 6.66503 42.7368 6.66503 41.9995Z" fill="currentcolor" fill-opacity="0.9"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M2.73354 12.5774C2.9667 11.8779 3.72273 11.4999 4.4222 11.733L7.4222 12.733C8.12166 12.9662 8.49968 13.7222 8.26653 14.4217C8.03337 15.1212 7.27734 15.4992 6.57787 15.266L3.57787 14.266C2.87841 14.0329 2.50039 13.2768 2.73354 12.5774Z" fill="currentcolor" fill-opacity="0.9"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12.5779 2.73293C13.2773 2.49978 14.0334 2.8778 14.2665 3.57726L15.2665 6.57726C15.4997 7.27672 15.1217 8.03276 14.4222 8.26592C13.7227 8.49907 12.9667 8.12105 12.7335 7.42159L11.7335 4.42159C11.5004 3.72212 11.8784 2.96609 12.5779 2.73293Z" fill="currentcolor" fill-opacity="0.9"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6.05614 6.05543C6.57749 5.53408 7.42276 5.53408 7.94411 6.05543L10.9441 9.05543C11.4655 9.57677 11.4655 10.422 10.9441 10.9434C10.4228 11.4648 9.5775 11.4648 9.05615 10.9434L6.05614 7.9434C5.53479 7.42205 5.53479 6.57678 6.05614 6.05543Z" fill="currentcolor" fill-opacity="0.9"/>
 </svg>

src/assets/icons/gongweishangliao.svg

@@ -1,5 +1,5 @@
 <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M34.2463 27.8084C35.4434 26.941 36.8439 28.5836 35.7989 29.6286L25.2068 40.2207C24.6211 40.8064 23.6713 40.8065 23.0855 40.2207L12.4934 29.6286C11.4474 28.5826 12.8501 26.9421 14.0459 27.8083L24.1461 35.1267L34.2463 27.8084Z" fill="black"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M34.2465 9.46058C35.4422 8.59457 36.8451 10.2348 35.7989 11.281L25.2069 21.873C24.6211 22.4588 23.6713 22.4588 23.0855 21.873L12.4934 11.2809C11.4475 10.2349 12.85 8.59436 14.0459 9.46059L24.1461 16.779L34.2465 9.46058Z" fill="black"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M34.2464 18.6344C35.4423 17.7683 36.845 19.4087 35.7989 20.4548L25.2068 31.0469C24.6211 31.6326 23.6713 31.6326 23.0855 31.0469L12.4934 20.4548C11.4474 19.4088 12.85 17.7682 14.0459 18.6344L23.5594 25.5277C23.9094 25.7813 24.3829 25.7814 24.7329 25.5278L34.2464 18.6344Z" fill="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M34.2463 27.8084C35.4434 26.941 36.8439 28.5836 35.7989 29.6286L25.2068 40.2207C24.6211 40.8064 23.6713 40.8065 23.0855 40.2207L12.4934 29.6286C11.4474 28.5826 12.8501 26.9421 14.0459 27.8083L24.1461 35.1267L34.2463 27.8084Z" fill="currentcolor"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M34.2465 9.46058C35.4422 8.59457 36.8451 10.2348 35.7989 11.281L25.2069 21.873C24.6211 22.4588 23.6713 22.4588 23.0855 21.873L12.4934 11.2809C11.4475 10.2349 12.85 8.59436 14.0459 9.46059L24.1461 16.779L34.2465 9.46058Z" fill="currentcolor"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M34.2464 18.6344C35.4423 17.7683 36.845 19.4087 35.7989 20.4548L25.2068 31.0469C24.6211 31.6326 23.6713 31.6326 23.0855 31.0469L12.4934 20.4548C11.4474 19.4088 12.85 17.7682 14.0459 18.6344L23.5594 25.5277C23.9094 25.7813 24.3829 25.7814 24.7329 25.5278L34.2464 18.6344Z" fill="currentcolor"/>
 </svg>

src/layout/components/header.vue

@@ -1,12 +1,7 @@
 <template>
   <div class="commonHeader">
     <div style="width: 155px">
-      <svg-icon
-        v-if="routeMeta.back"
-        icon-class="back"
-        size="48"
-        @click="commonBack"
-      />
+      <svg-icon v-if="routeMeta.back" icon-class="back" size="48" @click="commonBack" />
       <svg-icon v-else icon-class="LOGO" style="height: 48px; width: 155px" />
     </div>
     <div>
@@ -16,11 +11,7 @@
     <div>
       <el-space>
         <div class="task">
-          <el-progress
-            :percentage="processCount"
-            :show-text="false"
-            :stroke-width="10"
-          />
+          <el-progress :percentage="processCount" :show-text="false" :stroke-width="10" />
           <div class="process">任务进度: {{ processCount }}%</div>
         </div>
         <div>
@@ -28,11 +19,7 @@
           <div class="work">gongwei</div>
         </div>
 
-        <el-dropdown
-          ref="dropdown1"
-          trigger="contextmenu"
-          @command="handleCommand"
-        >
+        <el-dropdown ref="dropdown1" trigger="contextmenu" @command="handleCommand">
           <img v-if="headUrl" :src="headUrl" alt="" @click="showClick" />
           <svg-icon v-else icon-class="head" size="48" @click="showClick" />
           <template #dropdown>

src/router/index.ts

@@ -56,7 +56,6 @@ export const constantRoutes: RouteRecordRaw[] = [
             name: "Dianjian",
             meta: {
               back: true,
-              keepAlive: true,
             },
           },
           {
@@ -96,7 +95,7 @@ export const constantRoutes: RouteRecordRaw[] = [
           {
             path: "jiluxiang",
             component: () =>
-              import("@/views/pro-steps/components/Jiluxiang.vue"),
+              import("@/views/pro-steps/components/jiluxiang.vue"),
             name: "Jiluxiang",
             meta: {
               back: true,

src/store/modules/processView.ts

@@ -3,10 +3,14 @@ export const processViewStore = defineStore(
   () => {
     //首页到工序操作传递参数
     const odersData = ref({});
+    const processInfo = ref({});
     function setOdersData(obj: object) {
       odersData.value = obj;
     }
-    return { odersData, setOdersData };
+    function setProcessInfo(obj: object) {
+      processInfo.value = obj;
+    }
+    return { odersData, processInfo, setOdersData, setProcessInfo };
   },
   {
     //开启持久化存储

src/views/pro-steps/components/ESOP.vue

@@ -2,6 +2,10 @@
   <div>3</div>
 </template>
 
-<script lang="ts" setup></script>
+<script lang="ts" setup>
+defineOptions({
+  name: "Esop",
+});
+</script>
 
 <style lang="scss" scoped></style>

src/views/pro-steps/components/jingu.vue

@@ -1,5 +1,4 @@
 <template>
-
   <div>4</div>
 </template>
 

src/views/pro-steps/components/leftBarInfo.vue

@@ -2,25 +2,39 @@
   <div class="container">
     <div class="textBox">
       <div class="titleText blackColor">
-        <el-tooltip class="box-item" effect="dark" content="SADFFFSAD-大天线" placement="right-start">
-          SADFFFSAD-大天线
+        <el-tooltip class="box-item" effect="dark" :content="processInfo.materialName" placement="left" trigger="click">
+          {{ substringInfo.materialName }}
+        </el-tooltip>
+      </div>
+      <div class="simpleText greyColor">
+        <el-tooltip class="box-item" effect="dark" :content="processInfo.materialModel" placement="left" trigger="click">
+          {{ processInfo.materialModel.substring(0, 15) }}
         </el-tooltip>
       </div>
-      <div class="simpleText greyColor">SASD-FSDDS-ASDDFFSA...</div>
     </div>
     <div class="textBox" style="margin: 10px 0">
       <div class="simpleText greyColor">序列号</div>
-      <div class="simpleText blackColor">ASD123212DSAD332</div>
+      <div class="simpleText blackColor">{{ processInfo.operationCode }}</div>
     </div>
     <div class="textBox">
-      <div class="simpleText greyColor">ASD123212DSAD332</div>
-      <div class="simpleText blackColor">ASD123212DSAD332</div>
+      <div class="simpleText greyColor">当前工序</div>
+      <div class="simpleText blackColor">{{ processInfo.operationName }}</div>
     </div>
   </div>
 </template>
 
 <script lang="ts" setup>
-const input = ref("");
+import { processViewStore } from "@/store";
+const store = processViewStore();
+const processInfo = ref({ materialName: "...", materialModel: "..." });
+const substringInfo = ref({});
+onMounted(() => {
+  let obj = {};
+  processInfo.value = store.processInfo;
+  obj = JSON.parse(JSON.stringify(store.processInfo));
+  obj.materialName = obj.materialName.substring(0, 15);
+  substringInfo.value = obj;
+});
 </script>
 
 <style lang="scss" scoped>
@@ -51,6 +65,7 @@ const input = ref("");
       overflow: hidden;
       text-overflow: ellipsis;
       cursor: pointer;
+      max-width: 100%;
     }
   }
 }

src/views/pro-steps/components/mingpaibangding.vue

@@ -1,5 +1,4 @@
 <template>
-
   <div>src/views/pro-steps</div>
 </template>
 

src/views/pro-steps/components/operates.vue

@@ -1,6 +1,7 @@
 <template>
   <div class="container">
-    <div class="operator active" v-for="(item, index) in stepComponents" :key="index">
+    <div :class="selectIndex == index ? 'operator active' : 'operator'" v-for="(item, index) in stepComponents"
+      :key="index" @click="setIndex(index)">
       <div class="operatorText">{{ item.compentName }}</div>
       <div class="operatorIcon">
         <svg-icon :icon-class="item.compentType" size="45" />
@@ -10,7 +11,10 @@
 </template>
 
 <script lang="ts" setup>
-const input = ref("");
+const selectIndex = ref(0);
+const setIndex = (index: number) => {
+  selectIndex.value = index;
+};
 const stepComponents = ref([
   {
     compentName: "叫料",
@@ -66,7 +70,7 @@ const stepComponents = ref([
 }
 
 .active {
-  background-color: #64bb5c;
+  background-color: #64bb5c !important;
   color: white;
 }
 </style>

src/views/pro-steps/index.vue

@@ -21,7 +21,8 @@
           <!-- 二级路由盒子 -->
           <div class="routerView">
             <router-view v-slot="{ Component, route }">
-              <keep-alive include="Dianjian,Jiluxiang">
+              <keep-alive
+                include="Dianjian,Jiluxiang,Duomeiticaiji,Esop,Jingu,Mingpaibangding,Shebeijilu,Tiaoshipipei,Wuliaocaiji">
                 <component :is="Component" :key="route.fullPath" />
               </keep-alive>
             </router-view>
@@ -43,58 +44,58 @@ const route = useRoute();
 //配置标签信息Data
 const stepComponents = ref([
   {
+    compentName: "物料采集",
+    compentType: "wuliaocaiji",
+    path: "wuliaocaiji",
+    name: "Wuliaocaiji",
+  },
+  {
     compentName: "记录项",
     compentType: "jiluxiang",
     path: "jiluxiang",
     name: "Jiluxiang",
   },
   {
-    compentName: "物料采集",
-    compentType: "wuliaocaiji",
-    path: "wuliaocaiji",
-    name: "Wuliaocaiji",
+    compentName: "多媒体采集",
+    compentType: "duomeiticaiji",
+    path: "duomeiticaiji",
+    name: "Duomeiticaiji",
   },
   {
     compentName: "ESOP",
     compentType: "ESOP",
     path: "esop",
-    path: "Esop",
+    name: "Esop",
   },
   {
     compentName: "点检",
     compentType: "dianjian",
     path: "dianjian",
-    path: "Dianjian",
+    name: "Dianjian",
   },
   {
     compentName: "设备记录",
     compentType: "shebeijilu",
     path: "shebeijilu",
-    path: "Shebeijilu",
+    name: "Shebeijilu",
   },
   {
     compentName: "紧固",
     compentType: "jingu",
     path: "jingu",
-    path: "Jingu",
+    name: "Jingu",
   },
   {
     compentName: "调试配对",
     compentType: "tiaoshipipei",
     path: "tiaoshipipei",
-    path: "Tiaoshipipei",
+    name: "Tiaoshipipei",
   },
   {
     compentName: "铭牌绑定",
     compentType: "mingpai",
     path: "mingpaibangding",
-    path: "Mingpaibangding",
-  },
-  {
-    compentName: "多媒体采集",
-    compentType: "duomeiticaiji",
-    path: "duomeiticaiji",
-    path: "Duomeiticaiji",
+    name: "Mingpaibangding",
   },
 ]);
 //当前路由在setpComponents中的index

src/views/process/components/steps.vue

@@ -44,10 +44,14 @@ defineProps<{
 }>();
 const emit = defineEmits(["setstepindex"]);
 const boxClick = (item, index) => {
-  const data = JSON.parse(JSON.stringify(store.odersData));
-  data.operationId = item.operationId;
-  store.setOdersData({ ...data });
-  //已按要求配置状态机data
+  const data1 = JSON.parse(JSON.stringify(store.odersData));
+  const data2 = JSON.parse(JSON.stringify(store.processInfo));
+  data1.operationId = item.operationId;
+  //配置状态机参数
+  store.setOdersData({ ...data1 });
+  data2.operationCode = item.operationCode;
+  data2.operationName = item.operationName;
+  store.setProcessInfo({ ...data2 });
   router.push({ path: "/pro-steps" });
   emit("setstepindex", index);
 };

src/views/process/orders.vue

@@ -24,6 +24,10 @@ const setSlectIndex = (value: number) => {
     productLineId: ordersDataArray.value[value].productLineId,
     workOrderCode: ordersDataArray.value[value].workOrderCode,
   });
+  store.setProcessInfo({
+    materialName: ordersDataArray.value[value].materialName,
+    materialModel: ordersDataArray.value[value].materialModel,
+  });
   emit("getindex", value);
 };
 </script>