From afb7ee6979f9172f023e418e6da9d4ecba7f3eb2 Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期一, 21 九月 2026 16:08:20 +0800
Subject: [PATCH] 徐州-鼎业智能 1.生产订单页面当前工序进度与工序生产进度列展示修改
---
.gitignore | 1
multiple/config.json | 270 --------------------------------------
src/views/productionManagement/productionOrder/index.vue | 132 +++++++++---------
3 files changed, 66 insertions(+), 337 deletions(-)
diff --git a/.gitignore b/.gitignore
index 78a752d..20a972d 100644
--- a/.gitignore
+++ b/.gitignore
@@ -13,6 +13,7 @@
# Editor directories and files
.idea
.vscode
+.claude
*.suo
*.ntvs*
*.njsproj
diff --git a/multiple/config.json b/multiple/config.json
index 509fa8d..5d1ab56 100644
--- a/multiple/config.json
+++ b/multiple/config.json
@@ -15,276 +15,6 @@
"logo": "logo/Logo.png",
"favicon": "favicon/favicon.ico"
},
- "BTYX": {
- "env": {
- "VITE_APP_TITLE": "娌冲崡甯お浼橀�夐鍝佹湁闄愬叕鍙�",
- "VITE_BASE_API": "http://1.15.17.182:9056",
- "VITE_JAVA_API": "http://1.15.17.182:9057"
- },
- "logo": "logo/BTYXLogo.png",
- "favicon": "favicon/BTYXfavicon.ico"
- },
- "ZXZN": {
- "env": {
- "VITE_APP_TITLE": "娌冲崡鏅鸿姱鏅鸿兘鏈哄櫒浜烘湁闄愬叕鍙�",
- "VITE_BASE_API": "http://192.168.0.200:9001",
- "VITE_JAVA_API": "http://192.168.0.200:9000"
- },
- "logo": "logo/ZXZNLogo.png",
- "favicon": "favicon/ZXZNfavicon.ico"
- },
- "SDTX": {
- "env": {
- "VITE_APP_TITLE": "娌冲崡鍠勯紟閫氫俊绉戞妧鏈夐檺鍏徃",
- "VITE_BASE_API": "http://36.213.156.184:9001",
- "VITE_JAVA_API": "http://36.213.156.184:9000"
- },
- "logo": "logo/SDTXLogo.png",
- "favicon": "favicon/SDTXfavicon.ico"
- },
- "ZQSY": {
- "env": {
- "VITE_APP_TITLE": "娉芥穱瀹炰笟",
- "VITE_BASE_API": "http://36.213.128.159:9000",
- "VITE_JAVA_API": "http://36.213.128.159:9001"
- },
- "logo": "logo/ZQSYLogo.png",
- "favicon": "favicon/ZQSYfavicon.ico"
- },
- "JXJH": {
- "env": {
- "VITE_APP_TITLE": "娴氬幙姹熸捣姘存偿鍒跺搧鏈夐檺鍏徃",
- "VITE_BASE_API": "http://36.139.201.20:9000",
- "VITE_JAVA_API": "http://36.139.201.20:9001"
- },
- "logo": "logo/JXJHLogo.png",
- "favicon": "favicon/JXJHfavicon.ico"
- },
- "YTJZ": {
- "env": {
- "VITE_APP_TITLE": "璞嘲寤虹瓚鏉愭枡鏈夐檺鍏徃",
- "VITE_BASE_API": "http://36.139.201.181:9000",
- "VITE_JAVA_API": "http://36.139.201.181:9001"
- },
- "logo": "logo/YTJZLogo.png",
- "favicon": "favicon/YTJZfavicon.ico"
- },
- "HYLQ": {
- "env": {
- "VITE_APP_TITLE": "鑸�歌矾妗ュ伐绋嬫湁闄愬叕鍙�",
- "VITE_BASE_API": "http://36.139.202.111:9000",
- "VITE_JAVA_API": "http://36.139.202.111:9001"
- },
- "logo": "logo/HYLQLogo.png",
- "favicon": "favicon/HYLQfavicon.ico"
- },
- "QXY": {
- "env": {
- "VITE_APP_TITLE": "寮轰俊瀹囩數鍣ㄤ簯涓绘満",
- "VITE_BASE_API": "http://36.134.154.10:9000",
- "VITE_JAVA_API": "http://36.134.154.10:9001"
- },
- "logo": "logo/QXYLogo.png",
- "favicon": "favicon/QXYfavicon.ico"
- },
- "HYJC": {
- "env": {
- "VITE_APP_TITLE": "鎭掓磱寤烘潗",
- "VITE_BASE_API": "http://36.138.94.178:9000",
- "VITE_JAVA_API": "http://36.138.94.178:9001"
- },
- "logo": "logo/HYJCLogo.png",
- "favicon": "favicon/HYJCfavicon.ico"
- },
- "JHY": {
- "env": {
- "VITE_APP_TITLE": "灞辫タ鐪佹绀惧幙鏅嬪拰鍥鍝佹湁闄愬叕鍙�",
- "VITE_BASE_API": "http://223.15.233.27:9001",
- "VITE_JAVA_API": "http://223.15.233.27:9002"
- },
- "logo": "logo/JHYLogo.png",
- "favicon": "favicon/JHYfavicon.ico"
- },
- "XCDQ": {
- "env": {
- "VITE_APP_TITLE": "鏃櫒鐢靛櫒绠＄悊绯荤粺",
- "VITE_BASE_API": "http://36.133.45.183:9001",
- "VITE_JAVA_API": "http://36.133.45.183:9002"
- },
- "logo": "logo/XCDQLogo.png",
- "favicon": "favicon/XCDQfavicon.ico"
- },
- "LMJN": {
- "env": {
- "VITE_APP_TITLE": "缁跨編鑺傝兘绠＄悊绯荤粺",
- "VITE_BASE_API": "http://1.15.17.182:9105",
- "VITE_JAVA_API": "http://1.15.17.182:9106"
- },
- "logo": "logo/Logo.png",
- "favicon": "favicon/favicon.ico"
- },
- "XSWH": {
- "env": {
- "VITE_APP_TITLE": "鍏寸洓鏃烘捣绠＄悊绯荤粺",
- "VITE_BASE_API": "http://36.138.177.225:9001",
- "VITE_JAVA_API": "http://36.138.177.225:9002"
- },
- "logo": "logo/XSWHLogo.png",
- "favicon": "favicon/XSWHfavicon.ico"
- },
- "TDDQ": {
- "env": {
- "VITE_APP_TITLE": "娌冲崡鍚屽痉鐢垫皵鏈夐檺鍏徃",
- "VITE_BASE_API": "http://36.137.101.88:9001",
- "VITE_JAVA_API": "http://36.137.101.88:9002"
- },
- "logo": "logo/TDDQLogo.png",
- "favicon": "favicon/TDDQfavicon.ico"
- },
- "JHJM": {
- "env": {
- "VITE_APP_TITLE": "楣ゅ甯傞敠姹囩簿瀵嗘満姊版湁闄愬叕鍙�",
- "VITE_BASE_API": "http://103.189.141.42:9001",
- "VITE_JAVA_API": "http://103.189.141.42:9002"
- },
- "logo": "logo/JHJMLogo.png",
- "favicon": "favicon/JHJMfavicon.ico"
- },
- "DDGW": {
- "env": {
- "VITE_APP_TITLE": "娌冲崡涓滃ぇ楂樻俯鑺傝兘鏉愭枡鏈夐檺鍏徃",
- "VITE_BASE_API": "http://36.133.40.190:81",
- "VITE_JAVA_API": "http://36.133.40.190:82"
- },
- "logo": "logo/DDGWLogo.png",
- "favicon": "favicon/DDGWfavicon.ico"
- },
- "DDGW-TEST": {
- "env": {
- "VITE_APP_TITLE": "娌冲崡涓滃ぇ楂樻俯鑺傝兘鏉愭枡鏈夐檺鍏徃",
- "VITE_BASE_API": "http://36.133.40.190:83",
- "VITE_JAVA_API": "http://36.133.40.190:84"
- },
- "logo": "logo/DDGWLogo.png",
- "favicon": "favicon/DDGWfavicon.ico"
- },
- "XHZG": {
- "env": {
- "VITE_APP_TITLE": "楣ゅ娆ｅ紭閲嶅伐鏈夐檺鍏徃",
- "VITE_BASE_API": "http://103.189.141.42:9001",
- "VITE_JAVA_API": "http://103.189.141.42:9002"
- },
- "logo": "logo/XHZGLogo.png",
- "favicon": "favicon/XHZGfavicon.ico"
- },
- "SDKS": {
- "env": {
- "VITE_APP_TITLE": "楣ゅ甯傚洓杈剧熆灞辫澶囨湁闄愬叕鍙�",
- "VITE_BASE_API": "http://36.213.180.217:9520",
- "VITE_JAVA_API": "http://36.213.180.217:9521"
- },
- "logo": "logo/SDKSLogo.png",
- "favicon": "favicon/SDKSfavicon.ico"
- },
- "JMTM": {
- "env": {
- "VITE_APP_TITLE": "娌冲崡鎹风編鐗归晛绉戞妧鏈夐檺鍏徃",
- "VITE_BASE_API": "http://36.133.40.61:81",
- "VITE_JAVA_API": "http://36.133.40.61:82"
- },
- "logo": "logo/JMTMLogo.png",
- "favicon": "favicon/JMTMfavicon.ico"
- },
- "CHMY": {
- "env": {
- "VITE_APP_TITLE": "楣ゅ鏄屽畯闀佷笟鏈夐檺鍏徃",
- "VITE_BASE_API": "http://36.133.39.224:81",
- "VITE_JAVA_API": "http://36.133.39.224:82"
- },
- "logo": "logo/CHMYLogo.png",
- "favicon": "favicon/CHMYfavicon.ico"
- },
- "SJDQ": {
- "env": {
- "VITE_APP_TITLE": "楣ゅ甯傚北鍩庡尯鐩涗箙鐢靛櫒鏈夐檺鍏徃",
- "VITE_BASE_API": "http://36.139.201.235:81",
- "VITE_JAVA_API": "http://36.139.201.235:82"
- },
- "logo": "logo/SJDQLogo.png",
- "favicon": "favicon/SJDQfavicon.ico"
- },
- "TXDQ": {
- "env": {
- "VITE_APP_TITLE": "楣ゅ娉颁俊鐢垫皵鏈夐檺鍏徃",
- "VITE_BASE_API": "http://36.133.46.171:81",
- "VITE_JAVA_API": "http://36.133.46.171:82"
- },
- "logo": "logo/TXDQLogo.png",
- "favicon": "favicon/TXDQfavicon.ico"
- },
- "SMDQ": {
- "env": {
- "VITE_APP_TITLE": "楣ゅ甯傛櫉閾數鍣ㄦ湁闄愬叕鍙�",
- "VITE_BASE_API": "http://36.137.102.125:81",
- "VITE_JAVA_API": "http://36.137.102.125:82"
- },
- "logo": "logo/SMDQLogo.png",
- "favicon": "favicon/SMDQfavicon.ico"
- },
- "BCKJ": {
- "env": {
- "VITE_APP_TITLE": "娌冲崡鍐伴┌绉戞妧鏈夐檺鍏徃",
- "VITE_BASE_API": "http://36.133.209.54:81",
- "VITE_JAVA_API": "http://36.133.209.54:82"
- },
- "logo": "logo/BCKJLogo.png",
- "favicon": "favicon/BCKJfavicon.ico"
- },
- "HMCL": {
- "env": {
- "VITE_APP_TITLE": "楣ゅ娴╅晛鏉愭枡鏈夐檺鍏徃",
- "VITE_BASE_API": "http://36.213.90.123:9522",
- "VITE_JAVA_API": "http://36.213.90.123:9523"
- },
- "logo": "logo/HMCLLogo.png",
- "favicon": "favicon/HMCLfavicon.ico"
- },
- "DTZG": {
- "env": {
- "VITE_APP_TITLE": "寰愬窞涓滅壒閲嶅伐绉戞妧鏈夐檺鍏徃",
- "VITE_BASE_API": "http://36.213.90.123:9510",
- "VITE_JAVA_API": "http://36.213.90.123:9511"
- },
- "logo": "logo/DTZGLogo.png",
- "favicon": "favicon/DTZGfavicon.ico"
- },
- "XLZN": {
- "env": {
- "VITE_APP_TITLE": "姹熻嫃鏃緳鏅鸿兘绉戞妧鏈夐檺鍏徃",
- "VITE_BASE_API": "http://36.213.90.123:9512",
- "VITE_JAVA_API": "http://36.213.90.123:9513"
- },
- "logo": "logo/XLZNLogo.png",
- "favicon": "favicon/XLZNfavicon.ico"
- },
- "SKJS": {
- "env": {
- "VITE_APP_TITLE": "寰愬窞浠�鍏嬮噾灞炲埗鍝佹湁闄愬叕鍙�",
- "VITE_BASE_API": "http://36.213.90.123:9514",
- "VITE_JAVA_API": "http://36.213.90.123:9515"
- },
- "logo": "logo/SKJSLogo.png",
- "favicon": "favicon/SKJSFavicon.ico"
- },
- "YJYY": {
- "env": {
- "VITE_APP_TITLE": "寰愬窞姘镐匠娑插帇璁惧鏈夐檺鍏徃",
- "VITE_BASE_API": "http://36.213.90.123:9516",
- "VITE_JAVA_API": "http://36.213.90.123:9517"
- },
- "logo": "logo/YJYYLogo.png",
- "favicon": "favicon/YJYYFavicon.ico"
- },
"DYZN": {
"env": {
"VITE_APP_TITLE": "榧庝笟鏅鸿兘绉戞妧锛堟睙鑻忥級鏈夐檺鍏徃",
diff --git a/src/views/productionManagement/productionOrder/index.vue b/src/views/productionManagement/productionOrder/index.vue
index 6697c09..b0b64f0 100644
--- a/src/views/productionManagement/productionOrder/index.vue
+++ b/src/views/productionManagement/productionOrder/index.vue
@@ -89,18 +89,21 @@
:status="toProgressPercentage(row?.completionStatus) >= 100 ? 'success' : ''" />
</template>
<template #currentProcess="{ row }">
- <template v-if="getCurrentProcess(row)">
- <el-tag v-if="getCurrentProcess(row).done"
- type="success"
- size="small">鍏ㄩ儴瀹屾垚</el-tag>
- <div v-else
- class="current-process-name"
- :title="`${getCurrentProcess(row).name} 路 ${getCurrentProcess(row).pct}%`">
- <span class="process-color-dot"
- :style="{ background: getCurrentProcess(row).color || '#909399' }"></span>
- <span :style="readableTextColor(getCurrentProcess(row).color) ? { color: readableTextColor(getCurrentProcess(row).color) } : {}">{{ getCurrentProcess(row).name }}</span>
+ <div v-if="currentProcessStage(row)"
+ class="process-progress-container">
+ <div class="process-step">
+ <div class="step-content">
+ <div class="step-boxes"
+ :title="`${currentProcessStage(row).name} ${currentProcessStage(row).percentage}%`">
+ <div v-for="(color, i) in currentProcessStage(row).boxes"
+ :key="i"
+ class="step-box"
+ :style="{ background: color }"></div>
+ </div>
+ <div class="step-name">{{ currentProcessStage(row).name }}</div>
+ </div>
</div>
- </template>
+ </div>
<span v-else>-</span>
</template>
<template #processRouteStatus="{ row }">
@@ -110,14 +113,18 @@
:key="index"
class="process-step">
<div class="step-content">
- <div class="step-circle"
- :title="`${item.name} ${item.percentage}%`"
- :style="{ background: item.color || '#409EFF', opacity: item.percentage >= 100 ? 1 : item.percentage > 0 ? 0.6 : 0.25 }"></div>
+ <div class="step-boxes"
+ :title="`${item.name} ${item.percentage}%`">
+ <div v-for="(color, i) in processStateBoxes(row.processRouteStatus, index)"
+ :key="i"
+ class="step-box"
+ :style="{ background: color }"></div>
+ </div>
<div class="step-name">{{ item.name }}</div>
</div>
<div v-if="index < row.processRouteStatus.length - 1"
class="step-line"
- :style="{ background: item.percentage >= 100 ? '#67c23a' : '#dcdfe6' }"></div>
+ :style="{ background: processLineColor(item.percentage) }"></div>
</div>
</div>
<span v-else>-</span>
@@ -314,7 +321,7 @@
dataType: "slot",
slot: "currentProcess",
align: "center",
- width: 160,
+ width: PROCESS_STEP_WIDTH,
},
{
label: "閿�鍞崟鍙�",
@@ -544,40 +551,42 @@
return "#67c23a";
};
- // hex 鑹茶浆 rgba锛堢敤浜庡厜鏅�/娣″簳锛夛紝闈� hex 杩斿洖绌轰覆
- const hexToRgba = (hex, alpha) => {
- if (typeof hex !== "string") return "";
- const m = hex.match(/^#([0-9a-f]{3}|[0-9a-f]{6})$/i);
- if (!m) return "";
- let n = m[1];
- if (n.length === 3) n = n.split("").map(c => c + c).join("");
- const v = parseInt(n, 16);
- return `rgba(${(v >> 16) & 255}, ${(v >> 8) & 255}, ${v & 255}, ${alpha})`;
+ // 宸ュ簭/闃舵涓夋�侀厤鑹诧細宸插畬鎴愮豢銆佽繘琛屼腑钃濄�佹湭寮�濮嬬伆
+ const STAGE_DONE_COLOR = "#67c23a";
+ const STAGE_DOING_COLOR = "#409eff";
+ const STAGE_IDLE_COLOR = "#dcdfe6";
+
+ // 姣忛亾宸ュ簭涓�涓笁鎬佹缁勶細寰呭紑濮� / 鐢熶骇涓� / 鐢熶骇瀹屾垚銆�
+ // 0% 鏃朵寒銆屽緟寮�濮嬨�嶏紝寮�宸ユ湭瀹屽伐鏃躲�屽緟寮�濮嬨�嶈浆缁裤�併�岀敓浜т腑銆嶄寒钃濓紝瀹屽伐鍚庝笁涓鍏ㄧ豢锛�
+ // 鍓嶄竴閬撳伐搴忔病瀹屽伐锛屽悗闈㈢殑宸ュ簭涓変釜妗嗗叏鐏帮紙涓婁竴姝ヤ笉瀹屾垚涓嬩竴姝ヤ笉浜級
+ const processStateBoxes = (list, index) => {
+ const pct = toProgressPercentage(list?.[index]?.percentage);
+ if (pct >= 100) return [STAGE_DONE_COLOR, STAGE_DONE_COLOR, STAGE_DONE_COLOR];
+ const currentIndex = (list || []).findIndex(
+ item => toProgressPercentage(item.percentage) < 100
+ );
+ if (index > currentIndex) return [STAGE_IDLE_COLOR, STAGE_IDLE_COLOR, STAGE_IDLE_COLOR];
+ return pct > 0
+ ? [STAGE_DONE_COLOR, STAGE_DOING_COLOR, STAGE_IDLE_COLOR]
+ : [STAGE_DOING_COLOR, STAGE_IDLE_COLOR, STAGE_IDLE_COLOR];
};
- // 杩囨祬鐨勫伐搴忚壊鍦ㄧ櫧搴曚笂鏂囧瓧涓嶅彲璇伙紝鍥為��甯歌鏂囧瓧鑹�
- const isLightColor = hex => {
- const rgba = hexToRgba(hex, 1);
- if (!rgba) return false;
- const [r, g, b] = rgba.match(/\d+/g).map(Number);
- return (0.299 * r + 0.587 * g + 0.114 * b) / 255 > 0.72;
- };
- const readableTextColor = color =>
- !color || isLightColor(color) ? "" : color;
-
- // 褰撳墠宸ュ簭锛氱涓�閬撳畬鎴愬害涓嶈冻100%鐨勫伐搴忥紱鍏ㄩ儴瀹屾垚杩斿洖 done
- const getCurrentProcess = row => {
- const list = row.processRouteStatus;
+ // 褰撳墠宸ュ簭锛氱涓�閬撴湭瀹屽伐鐨勫伐搴忥紝鍙粰瀹冧竴缁勪笁鎬佹锛涘叏閮ㄥ畬宸ユ椂钀藉湪鏈�鍚庝竴閬撳伐搴忎笂
+ const currentProcessStage = row => {
+ const list = row?.processRouteStatus;
if (!Array.isArray(list) || list.length === 0) return null;
- const current = list.find(item => toProgressPercentage(item.percentage) < 100);
- if (!current) return { done: true };
+ let index = list.findIndex(item => toProgressPercentage(item.percentage) < 100);
+ if (index === -1) index = list.length - 1;
return {
- done: false,
- name: current.name || "鏈煡宸ュ簭",
- color: current.color || "",
- pct: toProgressPercentage(current.percentage),
+ name: list[index].name || "鏈煡宸ュ簭",
+ percentage: toProgressPercentage(list[index].percentage),
+ boxes: processStateBoxes(list, index),
};
};
+
+ // 宸ュ簭涔嬮棿鐨勮繛绾匡細鍓嶄竴閬撳畬宸ユ墠鐐逛寒
+ const processLineColor = val =>
+ toProgressPercentage(val) >= 100 ? STAGE_DONE_COLOR : STAGE_IDLE_COLOR;
// 浜ゆ湡棰勮鐨勬枃瀛楁彁绀猴紙棰滆壊涔嬪鐨勬棤闅滅鍐椾綑鎸囩ず锛�
const deliveryHint = row => {
@@ -949,22 +958,6 @@
margin-top: unset;
}
- .current-process-name {
- display: inline-flex;
- flex-direction: column;
- align-items: stretch; // 鑹叉潯瀹藉害鐢辨枃瀛楁拺寮�锛屼袱鑰呯瓑瀹�
- padding: 4px 0;
- font-size: 14px;
- color: #303133;
-
- .process-color-dot {
- display: block;
- height: 16px;
- border-radius: 4px;
- margin-bottom: 6px;
- }
- }
-
.process-progress-container {
display: inline-flex;
align-items: center;
@@ -984,12 +977,17 @@
flex-shrink: 0;
z-index: 1;
- .step-circle {
- width: 36px;
- height: 36px;
- border-radius: 50%;
+ .step-boxes {
+ display: flex;
+ gap: 4px;
+ margin-bottom: 6px;
+ }
+
+ .step-box {
+ width: 20px;
+ height: 20px;
+ border-radius: 4px;
box-sizing: border-box;
- margin-bottom: 4px;
}
.step-name {
@@ -1004,12 +1002,12 @@
}
.step-line {
- width: 130px; // 璐┛鐩搁偦涓ゅ渾蹇冿紝涓ょ琚渾鍦堬紙z-index鏇撮珮锛夐伄鎸�
+ width: 130px; // 璐┛鐩搁偦涓ょ粍妗嗭紝涓ょ琚缁勶紙z-index鏇撮珮锛夐伄鎸�
height: 2px;
border-radius: 1px;
background-color: #dcdfe6;
flex-shrink: 0;
- margin: 17px -48px 0; // 绾垮湪34px妲戒綅灞呬腑锛�(130-34)/2=48锛涢《杈�17px瀵瑰噯鍦嗗績
+ margin: 9px -48px 0; // 绾垮湪34px妲戒綅灞呬腑锛�(130-34)/2=48锛涢《杈�9px瀵瑰噯20px妗嗙粍鐨勫瀭鐩翠腑蹇�
}
}
}
--
Gitblit v1.9.3