From 439e3b0f076280311b7cd4251a95820730242780 Mon Sep 17 00:00:00 2001
From: Ben Lin <maobin001@msn.com>
Date: 星期三, 07 八月 2024 10:43:33 +0800
Subject: [PATCH] 一些更新
---
src/components/Table/src/components/TableHeader.vue | 71 +++++++++++++++++++----------------
1 files changed, 39 insertions(+), 32 deletions(-)
diff --git a/src/components/Table/src/components/TableHeader.vue b/src/components/Table/src/components/TableHeader.vue
index cfcd090..7e0b50c 100644
--- a/src/components/Table/src/components/TableHeader.vue
+++ b/src/components/Table/src/components/TableHeader.vue
@@ -3,6 +3,9 @@
<div v-if="$slots.headerTop" style="margin: 5px">
<slot name="headerTop"></slot>
</div>
+ <div v-if="showSelectionBar" style="margin: 5px">
+ <TableSelectionBar :clearSelectedRowKeys="props.clearSelectedRowKeys!" :count="props.count" />
+ </div>
<div class="flex items-center">
<slot name="tableTitle" v-if="$slots.tableTitle"></slot>
<TableTitle
@@ -13,7 +16,7 @@
<div :class="`${prefixCls}__toolbar`">
<slot name="toolbar"></slot>
<Divider type="vertical" v-if="$slots.toolbar && showTableSetting" />
- <TableSetting
+ <TableSettingComponent
:setting="tableSetting"
v-if="showTableSetting"
@columns-change="handleColumnChange"
@@ -22,46 +25,50 @@
</div>
</div>
</template>
-<script lang="ts">
- import type { TableSetting, ColumnChangeParam } from '../types/table';
+<script lang="ts" setup>
+ import type { TableSetting, ColumnChangeParam, TableActionType } from '../types/table';
import type { PropType } from 'vue';
- import { defineComponent } from 'vue';
import { Divider } from 'ant-design-vue';
import TableSettingComponent from './settings/index.vue';
import TableTitle from './TableTitle.vue';
- import { useDesign } from '/@/hooks/web/useDesign';
+ import { useDesign } from '@/hooks/web/useDesign';
+ import TableSelectionBar from '../components/TableSelectionBar.vue';
- export default defineComponent({
- name: 'BasicTableHeader',
- components: {
- Divider,
- TableTitle,
- TableSetting: TableSettingComponent,
+ defineOptions({ name: 'BasicTableHeader' });
+
+ const props = defineProps({
+ title: {
+ type: [Function, String] as PropType<string | ((data) => string)>,
},
- props: {
- title: {
- type: [Function, String] as PropType<string | ((data) => string)>,
- },
- tableSetting: {
- type: Object as PropType<TableSetting>,
- },
- showTableSetting: {
- type: Boolean,
- },
- titleHelpMessage: {
- type: [String, Array] as PropType<string | string[]>,
- default: '',
- },
+ tableSetting: {
+ type: Object as PropType<TableSetting>,
},
- emits: ['columns-change'],
- setup(_, { emit }) {
- const { prefixCls } = useDesign('basic-table-header');
- function handleColumnChange(data: ColumnChangeParam[]) {
- emit('columns-change', data);
- }
- return { prefixCls, handleColumnChange };
+ showTableSetting: {
+ type: Boolean,
+ },
+ titleHelpMessage: {
+ type: [String, Array] as PropType<string | string[]>,
+ default: '',
+ },
+ //
+ clearSelectedRowKeys: {
+ type: Function as PropType<TableActionType['clearSelectedRowKeys']>,
+ },
+ count: {
+ type: Number,
+ default: 0,
+ },
+ showSelectionBar: {
+ type: Boolean,
+ default: false,
},
});
+
+ const emit = defineEmits(['columns-change']);
+ const { prefixCls } = useDesign('basic-table-header');
+ function handleColumnChange(data: ColumnChangeParam[]) {
+ emit('columns-change', data);
+ }
</script>
<style lang="less">
@prefix-cls: ~'@{namespace}-basic-table-header';
--
Gitblit v1.9.3