mirror of
https://github.com/continew-org/continew-admin-ui.git
synced 2025-09-11 06:57:10 +08:00
feat: GiTable 表格组件插槽支持插槽类型提示(同步 GiDemo 更新)
This commit is contained in:
@@ -73,8 +73,16 @@
|
||||
</a-row>
|
||||
<div class="gi-table__body" :class="`gi-table__body-pagination-${attrs['page-position']}`">
|
||||
<div class="gi-table__container">
|
||||
<a-table ref="tableRef" :stripe="stripe" :size="size" column-resizable :bordered="{ cell: isBordered }"
|
||||
v-bind="{ ...attrs, columns: _columns }" :scrollbar="true">
|
||||
<a-table
|
||||
ref="tableRef"
|
||||
:stripe="stripe"
|
||||
:size="size"
|
||||
column-resizable
|
||||
:bordered="{ cell: isBordered }"
|
||||
v-bind="{ ...attrs, columns: _columns }"
|
||||
:scrollbar="true"
|
||||
:data="data"
|
||||
>
|
||||
<template v-for="key in Object.keys(slots)" :key="key" #[key]="scoped">
|
||||
<slot :key="key" :name="key" v-bind="scoped"></slot>
|
||||
</template>
|
||||
@@ -84,13 +92,14 @@
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import type { DropdownInstance, TableColumnData, TableInstance } from '@arco-design/web-vue'
|
||||
<script setup lang="ts" generic="T extends TableData">
|
||||
import type { DropdownInstance, TableColumnData, TableData, TableInstance } from '@arco-design/web-vue'
|
||||
import { VueDraggable } from 'vue-draggable-plus'
|
||||
|
||||
defineOptions({ name: 'GiTable', inheritAttrs: false })
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
title: '',
|
||||
data: () => [],
|
||||
disabledTools: () => [], // 禁止显示的工具
|
||||
disabledColumnKeys: () => [] // 禁止控制显示隐藏的列
|
||||
})
|
||||
@@ -99,11 +108,30 @@ const emit = defineEmits<{
|
||||
(e: 'refresh'): void
|
||||
}>()
|
||||
|
||||
defineSlots<{
|
||||
'th': (props: { column: TableColumnData }) => void
|
||||
'thead': () => void
|
||||
'empty': (props: { column: TableColumnData }) => void
|
||||
'summary-cell': (props: { column: TableColumnData, record: T, rowIndex: number }) => void
|
||||
'pagination-right': () => void
|
||||
'pagination-left': () => void
|
||||
'td': (props: { column: TableColumnData, record: T, rowIndex: number }) => void
|
||||
'tr': (props: { record: T, rowIndex: number }) => void
|
||||
'tbody': () => void
|
||||
'drag-handle-icon': () => void
|
||||
'footer': () => void
|
||||
'expand-row': (props: { record: T }) => void
|
||||
'expand-icon': (props: { record: T, expanded?: boolean }) => void
|
||||
'columns': () => void
|
||||
[propsName: string]: (props: { key: string, record: T, column: TableColumnData, rowIndex: number }) => void
|
||||
}>()
|
||||
|
||||
const attrs = useAttrs()
|
||||
const slots = useSlots()
|
||||
|
||||
interface Props {
|
||||
title?: string
|
||||
data: T[]
|
||||
disabledTools?: string[]
|
||||
disabledColumnKeys?: string[]
|
||||
}
|
||||
|
Reference in New Issue
Block a user