From 281971fb8056d8c244d48fa0db383e48db541f06 Mon Sep 17 00:00:00 2001
From: 86134 <aa>
Date: 星期六, 18 十一月 2023 16:16:09 +0800
Subject: [PATCH] 11
---
src/views/product/workbench/operation-task-pane.vue | 53 +++++++++++++++++++++++++++++++++++++----------------
1 files changed, 37 insertions(+), 16 deletions(-)
diff --git a/src/views/product/workbench/operation-task-pane.vue b/src/views/product/workbench/operation-task-pane.vue
index badea28..e0a5772 100644
--- a/src/views/product/workbench/operation-task-pane.vue
+++ b/src/views/product/workbench/operation-task-pane.vue
@@ -8,7 +8,6 @@
>
</el-alert>
<el-card
-
v-for="(item, index) in operationTasks"
@click.native="setCheckFlag(item)"
shadow="hover"
@@ -60,10 +59,25 @@
</div> -->
<div class="row">
<div class="l">璁″垝瀹屾垚鏃堕棿锛�</div>
- <div class="r" >{{ item.planFinishDay }}</div>
+ <div class="r">{{ item.planFinishDay }}</div>
</div>
</div>
+ <el-progress
+ class="task-progress"
+ :text-inside="true"
+ :stroke-width="20"
+ :percentage="
+ Number((item.completedQuantity / item.plannedQuantity).toFixed(2)) *
+ 100 >
+ 100
+ ? 100
+ : Number(
+ (item.completedQuantity / item.plannedQuantity).toFixed(2)
+ ) * 100
+ "
+ :format="formatPercentage(item.completedQuantity, item.plannedQuantity)"
+ ></el-progress>
</el-card>
</div>
</template>
@@ -334,6 +348,12 @@
}
},
methods: {
+
+ setCheckFlag(item) {
+ this.$nextTick(() => {
+ this.changeBackgroundColor(item.planFinishDay);
+ });
+ },
getBackgroundColor(planFinishDay) {
const currentDate = new Date();
currentDate.setHours(0, 0, 0, 0); // 璁剧疆鏃堕棿涓哄綋澶╃殑寮�濮嬶紝蹇界暐鏃跺垎绉掓绉�
@@ -341,25 +361,26 @@
planFinishDayObj.setHours(0, 0, 0, 0); // 鍚屾牱璁剧疆鏃堕棿涓鸿鍒掑畬鎴愭棩鐨勫紑濮�
if (planFinishDayObj < currentDate) {
- // 濡傛灉璁″垝瀹屾垚鏃ュ湪褰撳墠鏃ヤ箣鍓嶏紝杩斿洖'blue'琛ㄧず杩囨湡
- return 'red';
+ // 濡傛灉璁″垝瀹屾垚鏃ュ湪褰撳墠鏃ヤ箣鍓嶏紝杩斿洖'rgba(0, 0, 255, 0.3)'琛ㄧず杩囨湡锛岃繖閲岀殑 0.3 鎺у埗浜嗛�忔槑搴�
+ return 'rgba(255, 0, 0, 0.5)';
} else {
- const timeDifference = currentDate - planFinishDayObj;
- const daysDifference = Math.ceil(timeDifference / (1000 * 60 * 60 * 24));
+ const timeDifference = currentDate - planFinishDayObj;
+ const daysDifference = Math.ceil(timeDifference / (1000 * 60 * 60 * 24));
- if (daysDifference < 0) {
- // 濡傛灉璁″垝瀹屾垚鏃ュ湪鏈潵锛岃绠楀畠鏄惁鍦�10澶╁唴
- const daysUntilDue = Math.abs(daysDifference);
- if (daysUntilDue <= 10) {
- // 濡傛灉鍦�10澶╁唴锛岃繑鍥�'yellow'琛ㄧず鍗冲皢鍒版湡
- return 'yellow';
+ if (daysDifference < 0) {
+ // 濡傛灉璁″垝瀹屾垚鏃ュ湪鏈潵锛岃绠楀畠鏄惁鍦�10澶╁唴
+ const daysUntilDue = Math.abs(daysDifference);
+ if (daysUntilDue <= 10) {
+ // 濡傛灉鍦�10澶╁唴锛岃繑鍥�'rgba(255, 255, 0, 0.3)'琛ㄧず鍗冲皢鍒版湡锛岃繖閲岀殑 0.3 鎺у埗浜嗛�忔槑搴�
+ return 'rgba(219, 219, 54, 0.7)';
+ }
+ return 'rgba(28, 62, 222, 0.8)';
}
- }
}
- // 濡傛灉涓嶆槸鍗冲皢鍒版湡鎴栧凡杩囨湡锛岃繑鍥�'red'琛ㄧず宸插埌鏈�
- return 'blue';
+ // 濡傛灉涓嶆槸鍗冲皢鍒版湡鎴栧凡杩囨湡锛岃繑鍥�'rgba(255, 0, 0, 0.3)'琛ㄧず宸插埌鏈燂紝杩欓噷鐨� 0.3 鎺у埗浜嗛�忔槑搴�
+ return 'rgba(255, 0, 0, 0.5)';
},
-
+
// 鐐瑰嚮宸ュ崟锛岄�変腑宸ュ崟
setCheckFlag(item) {
if (item.checkFlag) {
--
Gitblit v1.9.3