From ffb1bd190e9d4263c8c7d6c0096e0ec844cb3b52 Mon Sep 17 00:00:00 2001 From: gaoluyang <2820782392@qq.com> Date: 星期四, 19 六月 2025 17:30:55 +0800 Subject: [PATCH] 1.系统管理样式修改 --- src/components/Table/ETable.vue | 40 +++++++++++++++++++++++++--------------- 1 files changed, 25 insertions(+), 15 deletions(-) diff --git a/src/components/Table/ETable.vue b/src/components/Table/ETable.vue index 13d2dda..24fe060 100644 --- a/src/components/Table/ETable.vue +++ b/src/components/Table/ETable.vue @@ -18,9 +18,13 @@ style="width: 100%" > <el-table-column v-if="showSelection" type="selection" width="55" align="center" /> - <el-table-column v-if="showIndex" label="搴忓彿" type="index" width="60" align="center" /> + <el-table-column v-if="showIndex" label="搴忓彿" width="60" align="center" fixed="left"> + <template #default="scope"> + {{ getRowIndex(scope.$index) }} + </template> + </el-table-column> <template v-for="col in columns" :key="col.prop"> - <el-table-column v-bind="col" :show-overflow-tooltip="shouldShowTooltip(col, tableData)" + <el-table-column v-bind="col" :formatter="col.formatter || defaultFormatter" align="center"> <template v-if="col.slot" #default="scope"> <slot :name="col.prop" :row="scope.row" :column="scope.column" :index="scope.$index"></slot> @@ -139,24 +143,22 @@ rowKey: { type: String, default: 'id' - }, - showOverflowTooltip: { + }, showOverflowTooltip: { type: Boolean, default: true + }, + // 褰撳墠椤电爜 + currentPage: { + type: Number, + default: 1 + }, + // 姣忛〉澶у皬 + pageSize: { + type: Number, + default: 10 } }) const tableRef = ref(null) -// 妫�鏌ュ垪鏄惁闇�瑕佹樉绀簍ooltip -const shouldShowTooltip = (col, data) => { - // 濡傛灉鍒楅厤缃腑鏄庣‘璁剧疆浜唖howOverflowTooltip锛屼娇鐢ㄨ璁剧疆 - if (col.hasOwnProperty('showOverflowTooltip')) { - return col.showOverflowTooltip; - } - // 濡傛灉娌℃湁prop锛岀洿鎺ヨ繑鍥瀎alse - if (!col.prop) return false; - // 妫�鏌ヨ鍒楀湪鎵�鏈夋暟鎹腑鏄惁鏈夐潪绌哄�硷紝榛樿鏄剧ずtooltip - return data.some(row => row[col.prop] != null && row[col.prop] !== ''); -}; // 榛樿鐨勬牸寮忓寲鍑芥暟 const defaultFormatter = (row, column, cellValue) => { @@ -188,6 +190,11 @@ const handleExport = (row) => { emit('export', row) } + +// 璁$畻鍒嗛〉搴忓彿 +const getRowIndex = (index) => { + return (props.currentPage - 1) * props.pageSize + index + 1; +}; // 姝g‘鐨� toggleRowSelection 鏂规硶锛氶拡瀵瑰崟琛� const toggleRowSelection = (row, selected) => { @@ -270,6 +277,9 @@ </script> <style scoped> + :deep(.el-tooltip) { + justify-content: center !important; + } .el-table { margin: 20px 0 !important; } -- Gitblit v1.9.3