From 7d26ed0e19bf952e7c037b21bfd687759b46e851 Mon Sep 17 00:00:00 2001
From: Ben Lin <maobin001@msn.com>
Date: 星期二, 25 六月 2024 19:21:33 +0800
Subject: [PATCH] 菜单更新
---
src/components/Table/src/components/HeaderCell.vue | 44 ++++++++++++++++++++++++++++----------------
1 files changed, 28 insertions(+), 16 deletions(-)
diff --git a/src/components/Table/src/components/HeaderCell.vue b/src/components/Table/src/components/HeaderCell.vue
index c21bfd0..68f9051 100644
--- a/src/components/Table/src/components/HeaderCell.vue
+++ b/src/components/Table/src/components/HeaderCell.vue
@@ -1,17 +1,11 @@
-<template>
- <EditTableHeaderCell v-if="getIsEdit">
- {{ getTitle }}
- </EditTableHeaderCell>
- <span v-else>{{ getTitle }}</span>
- <BasicHelp v-if="getHelpMessage" :text="getHelpMessage" :class="`${prefixCls}__help`" />
-</template>
-<script lang="ts">
+<script lang="tsx">
import type { PropType } from 'vue';
import type { BasicColumn } from '../types/table';
import { defineComponent, computed } from 'vue';
- import BasicHelp from '/@/components/Basic/src/BasicHelp.vue';
+ import BasicHelp from '@/components/Basic/src/BasicHelp.vue';
import EditTableHeaderCell from './EditTableHeaderIcon.vue';
- import { useDesign } from '/@/hooks/web/useDesign';
+ import { useDesign } from '@/hooks/web/useDesign';
+ import { ColumnType } from 'ant-design-vue/lib/table/interface';
export default defineComponent({
name: 'TableHeaderCell',
@@ -21,18 +15,37 @@
},
props: {
column: {
- type: Object as PropType<BasicColumn>,
+ type: Object as PropType<ColumnType<any>>,
default: () => ({}),
},
},
setup(props) {
const { prefixCls } = useDesign('basic-table-header-cell');
- const getIsEdit = computed(() => !!props.column?.edit);
- const getTitle = computed(() => props.column?.customTitle || props.column?.title);
- const getHelpMessage = computed(() => props.column?.helpMessage);
+ const getIsEdit = computed(() => !!(props.column as BasicColumn)?.edit);
+ const getTitle = computed(() => {
+ const column = props.column as BasicColumn;
+ if (typeof column.customHeaderRender === 'function') {
+ return column.customHeaderRender(column);
+ }
+ return column?.customTitle || props.column?.title;
+ });
+ const getHelpMessage = computed(() => (props.column as BasicColumn)?.helpMessage);
- return { prefixCls, getIsEdit, getTitle, getHelpMessage };
+ return () => {
+ return (
+ <div>
+ {getIsEdit.value ? (
+ <EditTableHeaderCell>{getTitle.value}</EditTableHeaderCell>
+ ) : (
+ <span class="default-header-cell">{getTitle.value}</span>
+ )}
+ {getHelpMessage.value && (
+ <BasicHelp text={getHelpMessage.value} class={`${prefixCls}__help`} />
+ )}
+ </div>
+ );
+ };
},
});
</script>
@@ -42,7 +55,6 @@
.@{prefix-cls} {
&__help {
margin-left: 8px;
- color: rgb(0 0 0 / 65%) !important;
}
}
</style>
--
Gitblit v1.9.3