更新表格组件,新增过滤功能,调整数据获取逻辑,优化界面布局

This commit is contained in:
2025-12-17 23:24:18 +07:00
parent 8a9d617129
commit 63ca414f2b
7 changed files with 225 additions and 85 deletions

View File

@@ -39,34 +39,32 @@ function refresh() {
</script>
<template>
<NSpace :align="itemAlign" wrap justify="end" class="lt-sm:w-200px">
<NSpace :align="itemAlign" justify="space-between" wrap class="lt-sm:w-200px">
<slot name="prefix"></slot>
<slot name="default">
<NButton size="small" ghost type="primary" @click="add">
<div class="space-x-5">
<slot name="default">
<NButton size="small" ghost type="primary" @click="add">
<template #icon>
<icon-ic-round-plus class="text-icon" />
</template>
{{ $t('common.add') }}
</NButton>
<NButton size="small" ghost type="error" :disabled="disabledDelete" @click="batchDelete">
<template #icon>
<icon-ic-round-delete class="text-icon" />
</template>
{{ $t('common.batchDelete') }}
</NButton>
</slot>
<NButton size="small" @click="refresh">
<template #icon>
<icon-ic-round-plus class="text-icon" />
<icon-mdi-refresh class="text-icon" :class="{ 'animate-spin': loading }" />
</template>
{{ $t('common.add') }}
{{ $t('common.refresh') }}
</NButton>
<NPopconfirm @positive-click="batchDelete">
<template #trigger>
<NButton size="small" ghost type="error" :disabled="disabledDelete">
<template #icon>
<icon-ic-round-delete class="text-icon" />
</template>
{{ $t('common.batchDelete') }}
</NButton>
</template>
{{ $t('common.confirmDelete') }}
</NPopconfirm>
</slot>
<NButton size="small" @click="refresh">
<template #icon>
<icon-mdi-refresh class="text-icon" :class="{ 'animate-spin': loading }" />
</template>
{{ $t('common.refresh') }}
</NButton>
<TableColumnSetting v-model:columns="columns" />
<TableColumnSetting v-model:columns="columns" />
</div>
<slot name="suffix"></slot>
</NSpace>
</template>