From bc5b6c286860d9684d776a775d8f6f8b0a64c98d Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Wed, 9 Aug 2023 14:11:57 +0800
Subject: [PATCH] =?UTF-8?q?update=20=E8=AE=A2=E5=8D=95=E7=AE=A1=E7=90=86?=
 =?UTF-8?q?=E7=9A=84cell-class-name?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/modules/pms/blenderOrder/config.js  |  8 +-
 src/views/modules/pms/blenderOrder/index.vue  | 10 +-
 .../components/ListViewWithHead.vue           | 10 +-
 src/views/modules/pms/blenderPress/config.js  | 97 +++++++++++++------
 src/views/modules/pms/blenderPress/index.vue  | 13 ++-
 src/views/modules/pms/order/index.vue         | 43 +++++---
 src/views/modules/pms/pressOrder/config.js    | 26 ++++-
 src/views/modules/pms/pressOrder/index.vue    | 10 +-
 8 files changed, 161 insertions(+), 56 deletions(-)

diff --git a/src/views/modules/pms/blenderOrder/config.js b/src/views/modules/pms/blenderOrder/config.js
index 08d0d18..941ea1c 100644
--- a/src/views/modules/pms/blenderOrder/config.js
+++ b/src/views/modules/pms/blenderOrder/config.js
@@ -305,7 +305,13 @@ export default function () {
   return {
     dialogConfigs,
     tableConfig: {
-      table: null, // 此处可省略，el-table 上的配置项
+      table: {
+        "cell-class-name": ({ row, column, rowIndex, columnIndex }) => {
+          if ("statusDictValue" in row && row.statusDictValue == "2") {
+            return "cell-in-production";
+          }
+        },
+      },
       column: tableProps, // el-column-item 上的配置项
     },
     headFormConfigs: {
diff --git a/src/views/modules/pms/blenderOrder/index.vue b/src/views/modules/pms/blenderOrder/index.vue
index de8ab96..83d9b95 100644
--- a/src/views/modules/pms/blenderOrder/index.vue
+++ b/src/views/modules/pms/blenderOrder/index.vue
@@ -1,5 +1,6 @@
 <template>
   <ListViewWithHead
+    class="highlight-cell"
     key="blender-order"
     :table-config="tableConfig"
     :head-config="headFormConfigs"
@@ -34,4 +35,11 @@ export default {
 };
 </script>
 
-<style scoped></style>
+<style scoped>
+.highlight-cell >>> .cell-in-production {
+  background: rgba(33, 207, 134, 0.35);
+}
+.highlight-cell >>> .hover-row .cell-in-production {
+  background: rgba(33, 207, 134, 0.7);
+}
+</style>
diff --git a/src/views/modules/pms/blenderPress/components/ListViewWithHead.vue b/src/views/modules/pms/blenderPress/components/ListViewWithHead.vue
index 0b2a7c0..3dee129 100644
--- a/src/views/modules/pms/blenderPress/components/ListViewWithHead.vue
+++ b/src/views/modules/pms/blenderPress/components/ListViewWithHead.vue
@@ -220,8 +220,11 @@ export default {
           }).then(() => {
             this.overlayVisible = true;
             return this.$http
-              .post(this.urls.pressDetach, data /* { id: data } */, { headers: { "Content-Type": "application/json" } })
+              .post(this.urls.pressDetach, data /* { id: data } */, {
+                headers: { "Content-Type": "application/json" },
+              })
               .then(({ data: res }) => {
+                this.overlayVisible = false;
                 if (res.code === 0) {
                   this.$message({
                     message: `下发成功`,
@@ -238,7 +241,6 @@ export default {
                     duration: 1500,
                   });
                 }
-                this.overlayVisible = false;
               });
           });
         }
@@ -329,7 +331,9 @@ export default {
               .then(({ data: res }) => {
                 if (res.code === 0) {
                   this.$message({
-                    message: `${type === "detach" ? "下发" : type === "pause-blender" ? "暂停" : "开始"}成功`,
+                    message: `${
+                      type === "detach" ? "下发" : type === "pause-blender" ? "暂停" : "开始"
+                    }成功`,
                     type: "success",
                     duration: 1500,
                     onClose: () => {
diff --git a/src/views/modules/pms/blenderPress/config.js b/src/views/modules/pms/blenderPress/config.js
index a0b628b..e2ef1c8 100644
--- a/src/views/modules/pms/blenderPress/config.js
+++ b/src/views/modules/pms/blenderPress/config.js
@@ -9,11 +9,19 @@ export default function () {
     { width: 160, prop: "orderCode", label: "主订单号" },
     { width: 60, prop: "orderCate", label: "子号" },
     { width: 160, prop: "code", label: "混料订单号" },
-    { width: 60, prop: "percent", label: "进度", filter: (val) => (val !== null && val !== undefined ? val + " %" : "-") },
+    {
+      width: 60,
+      prop: "percent",
+      label: "进度",
+      filter: (val) => (val !== null && val !== undefined ? val + " %" : "-"),
+    },
     {
       prop: "statusDictValue",
       label: "订单状态",
-      filter: (val) => (val !== null && val !== undefined ? ["等待", "确认", "生产", "暂停", "结束", "接受", "拒绝", "已下发"][val] : "-"),
+      filter: (val) =>
+        val !== null && val !== undefined
+          ? ["等待", "确认", "生产", "暂停", "结束", "接受", "拒绝", "已下发"][val]
+          : "-",
     },
     { prop: "bomCode", label: "配方" },
     { width: 120, prop: "qty", label: "混料总量 [kg]" },
@@ -25,20 +33,30 @@ export default function () {
       prop: "operations",
       name: "操作",
       fixed: "right",
-      width: 180,
+      width: 188,
       subcomponent: TableOperaionComponent,
       options: [
         {
-          name: "edit", label: "编辑", emitFull: true, icon: 'edit-outline', enable: injectData => {
-            const v = injectData.statusDictValue
-            if (v && +v === 1) return true
-            return false
-          }
+          name: "edit",
+          label: "编辑",
+          emitFull: true,
+          icon: "edit-outline",
+          enable: (injectData) => {
+            const v = injectData.statusDictValue;
+            if (v && +v === 1) return true;
+            return false;
+          },
         },
-        { name: "view-batch", label: "查看批次", color: "#ff8000", toRouter: 'pms-blenderBatch', icon: 'document-copy' }, // 路由跳转至 pms-blenderBatch
-        { name: "pause-blender", label: "暂停", color: "#f10000", icon: 'video-pause' },
-        { name: "start-blender", label: "开始", color: "#0b58ff", icon: 'video-play' },
-        { name: "detach", label: "下发", color: "#099", icon: 'bottom-right' },
+        {
+          name: "view-batch",
+          label: "查看批次",
+          color: "#ff8000",
+          toRouter: "pms-blenderBatch",
+          icon: "document-copy",
+        }, // 路由跳转至 pms-blenderBatch
+        { name: "pause-blender", label: "暂停", color: "#f10000", icon: "video-pause" },
+        { name: "start-blender", label: "开始", color: "#0b58ff", icon: "video-play" },
+        { name: "detach", label: "下发", color: "#099", icon: "bottom-right" },
       ],
     },
   ];
@@ -48,8 +66,20 @@ export default function () {
     { width: 160, prop: "orderCode", label: "主订单号" },
     { width: 60, prop: "orderCate", label: "子号" },
     { width: 160, prop: "code", label: "压制订单号" },
-    { width: 60, prop: "percent", label: "进度", filter: (val) => (val !== null && val !== undefined ? val + " %" : "-") },
-    { prop: "statusDictValue", label: "订单状态", filter: (val) => (val !== null && val !== undefined ? ["等待", "确认", "生产", "暂停", "结束", "接受", "拒绝", "已下发"][val] : "-"), },
+    {
+      width: 60,
+      prop: "percent",
+      label: "进度",
+      filter: (val) => (val !== null && val !== undefined ? val + " %" : "-"),
+    },
+    {
+      prop: "statusDictValue",
+      label: "订单状态",
+      filter: (val) =>
+        val !== null && val !== undefined
+          ? ["等待", "确认", "生产", "暂停", "结束", "接受", "拒绝", "已下发"][val]
+          : "-",
+    },
     { prop: "startTime", label: "开始时间" },
     { width: 100, prop: "shapeCode", label: "砖型" },
     { prop: "pressCode", label: "压机" },
@@ -64,11 +94,10 @@ export default function () {
       fixed: "right",
       width: 80,
       subcomponent: TableOperaionComponent,
-      options: [{ name: 'detach', label: '下发', icon: 'bottom-right' }]
+      options: [{ name: "detach", label: "下发", icon: "bottom-right" }],
     },
   ];
 
-
   const headFormFields = [
     {
       prop: "code",
@@ -109,8 +138,8 @@ export default function () {
         [
           {
             forceDisabled: true,
-            prop: 'code',
-            label: '混料订单号'
+            prop: "code",
+            label: "混料订单号",
           },
         ],
         [
@@ -119,10 +148,11 @@ export default function () {
             label: "配方",
             prop: "bomId",
             options: [],
-            optionLabelProp: 'code',
+            optionLabelProp: "code",
             /** ====== */
-            fetchData: (bomCode) => this.$http.get('/pms/bom/pageVersion', { params: { key: bomCode, limit: 999, page: 1 } }),
-            fetchDataParam: 'bomCode',
+            fetchData: (bomCode) =>
+              this.$http.get("/pms/bom/pageVersion", { params: { key: bomCode, limit: 999, page: 1 } }),
+            fetchDataParam: "bomCode",
             delayRequest: true,
             /** ====== */
             rules: { required: true, message: "必填项不能为空", trigger: "blur" },
@@ -135,8 +165,9 @@ export default function () {
             label: "混料机",
             prop: "blender",
             options: [],
-            optionLabelProp: 'code',
-            fetchData: () => this.$http.get('/pms/equipment/list', { params: { workSequenceName: '混料工序' } }),
+            optionLabelProp: "code",
+            fetchData: () =>
+              this.$http.get("/pms/equipment/list", { params: { workSequenceName: "混料工序" } }),
             rules: { required: true, message: "必填项不能为空", trigger: "blur" },
             elparams: { clearable: true, filterable: true, placeholder: "请选择混料机" },
           },
@@ -146,18 +177,30 @@ export default function () {
         { name: "add", label: "保存", type: "primary", permission: "", showOnEdit: false },
         { name: "update", label: "更新", type: "primary", permission: "", showOnEdit: true },
         // { name: "reset", label: "重置", type: "warning", showAlways: true },
-      ]
+      ],
     },
   };
 
   return {
     dialogConfigs,
     tableConfig: {
-      table: null,
+      table: {
+        "cell-class-name": ({ row, column, rowIndex, columnIndex }) => {
+          if ("statusDictValue" in row && row.statusDictValue == "2") {
+            return "cell-in-production";
+          }
+        },
+      },
       column: tableProps,
     },
     pressTableConfig: {
-      table: null,
+      table: {
+        "cell-class-name": ({ row, column, rowIndex, columnIndex }) => {
+          if ("statusDictValue" in row && row.statusDictValue == "2") {
+            return "cell-in-production";
+          }
+        },
+      },
       column: pressTableProps,
     },
     headFormConfigs: {
@@ -171,7 +214,7 @@ export default function () {
       pauseBlender: "/pms/trans/blenderPause",
       startBlender: "/pms/trans/blenderStart",
       pageIsPostApi: true, // 使用post接口来获取page数据，极少用，目前基本上只有工艺管理模块里在用
-      changeBlender: '/pms/order/changeBlender',
+      changeBlender: "/pms/order/changeBlender",
       pressPage: "/pms/pressOrder/pageView",
       pressDetach: "/pms/trans/pressDeli",
     },
diff --git a/src/views/modules/pms/blenderPress/index.vue b/src/views/modules/pms/blenderPress/index.vue
index ba7bd0e..295e755 100644
--- a/src/views/modules/pms/blenderPress/index.vue
+++ b/src/views/modules/pms/blenderPress/index.vue
@@ -1,12 +1,12 @@
 <template>
   <ListViewWithHead
+    class="highlight-cell"
     key="blender-order"
     :table-config="tableConfig"
     :press-table-config="pressTableConfig"
     :head-config="headFormConfigs"
     :dialog-configs="dialogConfigs"
-    :list-query-extra="[]"
-  />
+    :list-query-extra="[]" />
 </template>
 
 <script>
@@ -37,4 +37,11 @@ export default {
 };
 </script>
 
-<style scoped></style>
+<style scoped>
+.highlight-cell >>> .cell-in-production {
+  background: rgba(33, 207, 134, 0.35);
+}
+.highlight-cell >>> .hover-row .cell-in-production {
+  background: rgba(33, 207, 134, 0.7);
+}
+</style>
diff --git a/src/views/modules/pms/order/index.vue b/src/views/modules/pms/order/index.vue
index 3760ddd..166d5ea 100644
--- a/src/views/modules/pms/order/index.vue
+++ b/src/views/modules/pms/order/index.vue
@@ -6,22 +6,20 @@
         :refresh-key="keys.ongoing"
         :extra-search-conditions="{ code: '' }"
         :page-url="allUrls.confirmedOrder"
-        :table-config="{ table: null, column: tableConfigs.ongoingTable }"
+        :table-config="{ table: { 'cell-class-name': cellClassName }, column: tableConfigs.ongoingTable }"
         :head-config="{ title: '进行中的订单', form: headFormConfigs.ongoingTableSearch }"
         :dialog-config="dialogConfigs"
-        @refresh-tables="handleRefreshTable"
-        />
-        <ListSectionWithHead
+        @refresh-tables="handleRefreshTable" />
+      <ListSectionWithHead
         id="pending"
         :refresh-key="keys.pending"
         :extra-search-conditions="{ code: '' }"
         :page-url="allUrls.unConfirmedOrder"
-        :table-config="{ table: null, column: tableConfigs.pendingTable }"
+        :table-config="{ table: { 'cell-class-name': cellClassName }, column: tableConfigs.pendingTable }"
         :head-config="{ title: '等待中的订单', form: headFormConfigs.pendingTableSearch }"
         :dialog-config="dialogConfigs"
-        @refresh-tables="handleRefreshTable"
-        />
-        <!-- <ListSectionWithHead
+        @refresh-tables="handleRefreshTable" />
+      <!-- <ListSectionWithHead
         id="finished"
         :refresh-key="keys.finished"
         :extra-search-conditions="{ code: '' }"
@@ -73,22 +71,29 @@ export default {
   },
   methods: {
     scrollTo(pos) {
-      const el = document.querySelector(pos)
+      const el = document.querySelector(pos);
       window.scrollTo({
         top: el.offsetTop - 16,
-        behavior: 'smooth'
-      })
+        behavior: "smooth",
+      });
     },
 
     handleRefreshTable(tableNameList) {
       if (Array.isArray(tableNameList)) {
-        tableNameList.forEach(name => {
-          this.keys[name] = Math.random().toString()
-        })
+        tableNameList.forEach((name) => {
+          this.keys[name] = Math.random().toString();
+        });
       } else {
-        console.log('handleRefreshTable 需要传递数组!')
+        console.log("handleRefreshTable 需要传递数组!");
       }
-    }
+    },
+
+    cellClassName({ row, column, rowIndex, columnIndex }) {
+      if ("statusDictValue" in row && row.statusDictValue == "2") {
+        console.log("setting cell style.....", row);
+        return "cell-in-production";
+      }
+    },
   },
 };
 </script>
@@ -138,4 +143,10 @@ export default {
   /* margin-left: 144px; */
   flex-grow: 1;
 }
+.list-section-with-head >>> .cell-in-production {
+  background: rgba(33, 207, 134, 0.35);
+}
+.list-section-with-head >>> .hover-row .cell-in-production {
+  background: rgba(33, 207, 134, 0.7);
+}
 </style>
diff --git a/src/views/modules/pms/pressOrder/config.js b/src/views/modules/pms/pressOrder/config.js
index 7b1f39d..6d02609 100644
--- a/src/views/modules/pms/pressOrder/config.js
+++ b/src/views/modules/pms/pressOrder/config.js
@@ -10,8 +10,20 @@ export default function () {
     { width: 160, prop: "orderCode", label: "主订单号" },
     { width: 60, prop: "orderCate", label: "子号" },
     { width: 160, prop: "code", label: "压制订单号" },
-    { width: 90, prop: "percent", label: "进度", filter: (val) => (val !== null && val !== undefined ? val + " %" : "-") },
-    { prop: "statusDictValue", label: "订单状态", filter: (val) => (val !== null && val !== undefined ? ["等待", "确认", "生产", "暂停", "结束", "接受", "拒绝", "已下发"][val] : "-"), },
+    {
+      width: 90,
+      prop: "percent",
+      label: "进度",
+      filter: (val) => (val !== null && val !== undefined ? val + " %" : "-"),
+    },
+    {
+      prop: "statusDictValue",
+      label: "订单状态",
+      filter: (val) =>
+        val !== null && val !== undefined
+          ? ["等待", "确认", "生产", "暂停", "结束", "接受", "拒绝", "已下发"][val]
+          : "-",
+    },
     { width: 160, prop: "startTime", label: "开始时间", filter: timeFilter },
     { width: 100, prop: "shapeCode", label: "砖型" },
     { prop: "pressCode", label: "压机" },
@@ -30,7 +42,7 @@ export default function () {
       fixed: "right",
       width: 80,
       subcomponent: TableOperaionComponent,
-      options: [{ name: 'detach', label: '下发', icon: 'bottom-right' }] // , url: '/pms/trans/pressDeli' }]
+      options: [{ name: "detach", label: "下发", icon: "bottom-right" }], // , url: '/pms/trans/pressDeli' }]
       // options: ["copy", { name: "edit", label: "编辑", icon: "edit-outline" }, { name: "delete", icon: "delete", label: "删除", emitFull: true, permission: "pms:blenderStep:delete" }],
     },
   ];
@@ -233,7 +245,13 @@ export default function () {
   return {
     // dialogConfigs,
     tableConfig: {
-      table: null, // 此处可省略，el-table 上的配置项
+      table: {
+        "cell-class-name": ({ row, column, rowIndex, columnIndex }) => {
+          if ("statusDictValue" in row && row.statusDictValue == "2") {
+            return "cell-in-production";
+          }
+        },
+      },
       column: tableProps, // el-column-item 上的配置项
     },
     headFormConfigs: {
diff --git a/src/views/modules/pms/pressOrder/index.vue b/src/views/modules/pms/pressOrder/index.vue
index 96cac28..b13bb99 100644
--- a/src/views/modules/pms/pressOrder/index.vue
+++ b/src/views/modules/pms/pressOrder/index.vue
@@ -1,5 +1,6 @@
 <template>
   <ListViewWithHead
+    class="highlight-cell"
     :table-config="tableConfig"
     :head-config="headFormConfigs"
     :dialog-configs="dialogConfigs"
@@ -30,4 +31,11 @@ export default {
 };
 </script>
 
-<style scoped></style>
+<style scoped>
+.highlight-cell >>> .cell-in-production {
+  background: rgba(33, 207, 134, 0.35);
+}
+.highlight-cell >>> .hover-row .cell-in-production {
+  background: rgba(33, 207, 134, 0.7);
+}
+</style>