From 1bc5d77b95c15e5e23940402352da36a32c4547a Mon Sep 17 00:00:00 2001
From: yuan <123@>
Date: 星期六, 10 十月 2026 11:55:03 +0800
Subject: [PATCH] fix: 优化日期格式化显示逻辑
---
src/components/PIMTable/PIMTable.vue | 54 +++++++++++++++++++++++++++++++++++++++---------------
1 files changed, 39 insertions(+), 15 deletions(-)
diff --git a/src/components/PIMTable/PIMTable.vue b/src/components/PIMTable/PIMTable.vue
index 955173d..f25f74c 100644
--- a/src/components/PIMTable/PIMTable.vue
+++ b/src/components/PIMTable/PIMTable.vue
@@ -10,7 +10,7 @@
:row-class-name="rowClassName"
:row-style="rowStyle"
:row-key="rowKey"
- style="width: 100%"
+ :style="tableStyle"
tooltip-effect="dark"
:expand-row-keys="expandRowKeys"
:show-summary="isShowSummary"
@@ -40,12 +40,22 @@
:fixed="item.fixed"
:label="item.label"
:prop="item.prop"
- show-overflow-tooltip
+ :show-overflow-tooltip="item.dataType !== 'action' && item.dataType !== 'slot'"
:align="item.align"
:sortable="!!item.sortable"
:type="item.type"
:width="item.width"
>
+ <template #header="scope">
+ <div class="pim-table-header-cell">
+ <div class="pim-table-header-title">
+ {{ item.label }}
+ </div>
+ <div v-if="item.headerSlot" class="pim-table-header-extra">
+ <slot :name="item.headerSlot" :column="scope.column" />
+ </div>
+ </div>
+ </template>
<template
v-if="item.hasOwnProperty('colunmTemplate')"
#[item.colunmTemplate]="scope"
@@ -120,11 +130,10 @@
</div>
<!-- 鎸夐挳 -->
- <div v-else-if="item.dataType == 'action'">
+ <div v-else-if="item.dataType == 'action'" @click.stop>
<template v-for="(o, key) in item.operation" :key="key">
<el-button
v-show="o.type != 'upload'"
- size="small"
v-if="o.showHide ? o.showHide(scope.row) : true"
:disabled="o.disabled ? o.disabled(scope.row) : false"
:plain="o.plain"
@@ -136,7 +145,7 @@
: o.color,
}"
link
- @click="o.clickFun(scope.row)"
+ @click.stop="o.clickFun(scope.row)"
:key="key"
>
{{ o.name }}
@@ -149,7 +158,6 @@
(o.uploadIdFun ? o.uploadIdFun(scope.row) : scope.row.id)
"
ref="uploadRef"
- size="small"
:multiple="o.multiple ? o.multiple : false"
:limit="1"
:disabled="o.disabled ? o.disabled(scope.row) : false"
@@ -178,7 +186,6 @@
:show-file-list="false"
>
<el-button
- :size="o.size ? o.size : 'small'"
link
type="primary"
:disabled="o.disabled ? o.disabled(scope.row) : false"
@@ -194,20 +201,17 @@
style="width: 100%"
@click="goLink(scope.row, item.linkMethod)"
>
- <span v-if="!item.formatData">{{ scope.row[item.prop] }}</span>
+ <span>{{ formatters(scope.row[item.prop], item.formatData) }}</span>
</div>
<!-- 榛樿绾睍绀烘暟鎹� -->
<div v-else class="cell" style="width: 100%">
- <span v-if="!item.formatData">{{ scope.row[item.prop] }}</span>
- <span v-else>{{
- formatters(scope.row[item.prop], item.formatData)
- }}</span>
+ <span>{{ formatters(scope.row[item.prop], item.formatData) }}</span>
</div>
</template>
</el-table-column>
</el-table>
<pagination
- v-if="page.total > 0"
+ v-if="isShowPagination"
:total="page.total"
:layout="page.layout"
:page="page.current"
@@ -220,13 +224,14 @@
import pagination from "./Pagination.vue";
import { ref, inject, getCurrentInstance } from "vue";
import { ElMessage } from "element-plus";
+import { dateOnly } from "@/utils/ruoyi";
// 鑾峰彇鍏ㄥ眬鐨� uploadHeader
const { proxy } = getCurrentInstance();
const uploadHeader = proxy.uploadHeader;
const javaApi = proxy.javaApi;
-const emit = defineEmits(["pagination", "expand-change", "selection-change"]);
+const emit = defineEmits(["pagination", "expand-change", "selection-change", "row-click"]);
// Filters
const typeFn = (val, row) => {
@@ -234,7 +239,9 @@
};
const formatters = (val, format) => {
- return typeof format === "function" ? format(val) : val;
+ if (typeof format === "function") return format(val);
+ // 鏈樉寮忔寚瀹氭牸寮忓寲鍑芥暟鏃讹細鏃ユ湡鏃堕棿缁熶竴鍙樉绀哄勾鏈堟棩锛堥潪鏃ユ湡鍊煎師鏍疯繑鍥烇級
+ return dateOnly(val);
};
// Props锛堜娇鐢� defineProps 鐨勯潪 TS 褰㈠紡锛�
@@ -270,6 +277,10 @@
isSelection: {
type: Boolean,
default: false,
+ },
+ isShowPagination: {
+ type: Boolean,
+ default: true,
},
isShowSummary: {
type: Boolean,
@@ -315,6 +326,10 @@
total: {
type: Number,
default: 0,
+ },
+ tableStyle: {
+ type: [String, Object],
+ default: () => ({ width: "100%" }),
},
});
@@ -412,6 +427,10 @@
emit("pagination", { page: page, limit: limit });
};
+const rowClick = (row) => {
+ emit("row-click", row);
+};
+
const expandChange = (row, expandedRows) => {
emit("expand-change", row, expandedRows);
};
@@ -429,4 +448,9 @@
padding-right: 0 !important;
padding-left: 0 !important;
}
+
+.pim-table-header-extra :deep(.el-input),
+.pim-table-header-extra :deep(.el-select) {
+ width: 100%;
+}
</style>
--
Gitblit v1.9.3