From e7aa4062dad19b45261287bdd26f22e425cb1466 Mon Sep 17 00:00:00 2001
From: 张诺 <zhang_12370@163.com>
Date: 星期六, 11 四月 2026 15:06:24 +0800
Subject: [PATCH] 根据合同到期时间前45天标记数据颜色 优化通用表格设置单元格宽度问题
---
src/views/personnelManagement/employeeRecord/index.vue | 43 ++++++++++++++++++++++++++++++++++++++++++-
src/components/PIMTable/PIMTable.vue | 1 +
2 files changed, 43 insertions(+), 1 deletions(-)
diff --git a/src/components/PIMTable/PIMTable.vue b/src/components/PIMTable/PIMTable.vue
index a418280..b79cd91 100644
--- a/src/components/PIMTable/PIMTable.vue
+++ b/src/components/PIMTable/PIMTable.vue
@@ -45,6 +45,7 @@
:sortable="!!item.sortable"
:type="item.type"
:width="item.width"
+ :minWidth="item.minWidth"
>
<template #header="scope">
<div class="pim-table-header-cell">
diff --git a/src/views/personnelManagement/employeeRecord/index.vue b/src/views/personnelManagement/employeeRecord/index.vue
index 9a34f9f..c88336a 100644
--- a/src/views/personnelManagement/employeeRecord/index.vue
+++ b/src/views/personnelManagement/employeeRecord/index.vue
@@ -35,6 +35,7 @@
:tableLoading="tableLoading"
@pagination="pagination"
:total="page.total"
+ :rowClassName="rowClassName"
></PIMTable>
</div>
<show-form-dia ref="formDia" @close="handleQuery"></show-form-dia>
@@ -143,6 +144,11 @@
minWidth: 180,
},
{
+ label:"鍚堝悓鍒版湡鏃堕棿",
+ prop: "contractExpireTime",
+ minWidth: 120,
+ },
+ {
dataType: "action",
label: "鎿嶄綔",
align: "center",
@@ -196,6 +202,33 @@
}
getList();
};
+
+const rowClassName = ({ row }) => {
+ const dateStr = row.contractExpireTime;
+
+ if (!dateStr) return '';
+
+ const now = new Date();
+ const target = new Date(dateStr.replace(/-/g, '/')); // 鍏煎 Safari
+
+ // 褰掗浂鏃堕棿锛堝叧閿紒锛�
+ now.setHours(0, 0, 0, 0);
+ target.setHours(0, 0, 0, 0);
+
+ const days = Math.ceil((target - now) / (1000 * 60 * 60 * 24));
+
+ console.log('鍓╀綑澶╂暟:', days);
+
+ // 瓒呰繃45澶╋細姝ｅ父
+ if (days > 45) return '';
+
+ // 0~45澶╋細棰勮锛堜綘鍙互鎹㈤鑹诧級
+ if (days >= 0) return 'bg-warning';
+
+ // 宸茶繃鏈�
+ return 'bg-danger';
+};
+
// 鏌ヨ鍒楄〃
/** 鎼滅储鎸夐挳鎿嶄綔 */
const handleQuery = () => {
@@ -280,4 +313,12 @@
});
</script>
-<style scoped></style>
+<style scoped>
+:deep(.el-table .bg-warning > td.el-table__cell) {
+ background-color: #fdf2e3;
+}
+
+:deep(.el-table .bg-danger > td.el-table__cell) {
+ background-color: #ffe5e5;
+}
+</style>
--
Gitblit v1.9.3