diff --git a/packages/select-table-modal/index.vue b/packages/select-table-modal/index.vue
index 7fbfcb7..fb51455 100644
--- a/packages/select-table-modal/index.vue
+++ b/packages/select-table-modal/index.vue
@@ -2,7 +2,7 @@
* @Author: zhaojinfeng 121016171@qq.com
* @Date: 2023-07-18 12:30:07
* @LastEditors: zhaojinfeng 121016171@qq.com
- * @LastEditTime: 2023-07-22 16:36:13
+ * @LastEditTime: 2023-07-22 17:52:02
* @FilePath: \vue3\packages\select-table-modal\index.vue
* @Description: 模态框选择表格
*
@@ -45,9 +45,18 @@
@selection-change="handleSelectionChange"
>
-
-
-
+
+
+
+
+
@@ -140,6 +149,12 @@ interface FormItem {
}
const showDialog = ref(false)
+const slots = Object.keys(useSlots())
+
+function isExist(prop: string) {
+ return slots.includes(`column-${prop}`)
+}
+
let tableData = $ref([])
let selection = $ref()
let selections = $ref[] | null>(null)
diff --git a/stories/SelectTableModal.stories.ts b/stories/SelectTableModal.stories.ts
index b46bd0d..3d9861e 100644
--- a/stories/SelectTableModal.stories.ts
+++ b/stories/SelectTableModal.stories.ts
@@ -2,7 +2,7 @@
* @Author: zhaojinfeng 121016171@qq.com
* @Date: 2023-07-18 12:30:07
* @LastEditors: zhaojinfeng 121016171@qq.com
- * @LastEditTime: 2023-07-22 16:28:10
+ * @LastEditTime: 2023-07-22 17:51:34
* @FilePath: \vue3\stories\SelectTableModal.stories.ts
* @Description:
*
@@ -10,17 +10,17 @@
import type { Meta, StoryObj } from '@storybook/vue3'
import ThSelectTableModal from '../packages/select-table-modal/index.vue'
-// 模拟1秒钟的接口请求
+// 模拟800毫秒钟的接口请求
function request() {
return new Promise((resolve) => {
setTimeout(() => {
resolve({
code: 200,
- rows: [{ prop1: 'prop1', prop2: 'prop2', prop3: 'prop3' }],
+ rows: [{ prop1: 'prop11', prop2: 'prop12', prop3: 'prop13' }, { prop1: 'prop21', prop2: 'prop22', prop3: 'prop23' }],
total: 10,
message: 'ok',
})
- }, 1000)
+ }, 800)
})
}
@@ -58,7 +58,7 @@ const meta = {
:pager-count="args.pagerCount"
:multiple="args.multiple"
:z-index="args.zIndex"
- />`,
+ >x`,
}),
} satisfies Meta
export default meta
@@ -68,3 +68,29 @@ type Story = StoryObj
export const Base: Story = {
name: '基本使用',
}
+
+export const TableSlot: Story = {
+ name: '自定义表格展示',
+ render: args => ({
+ components: { ThSelectTableModal },
+ setup() {
+ return { args }
+ },
+ args: {
+ value: '',
+ rowKey: 'prop1',
+ columns: [{ label: 'label1', prop: 'prop1' }, { label: 'label2', prop: 'prop2' }, { label: 'label3', prop: 'prop3' }],
+ formItems: [{ label: 'label1', prop: 'prop1' }, { label: 'label2', prop: 'prop2', selectOptions: [{ label: '1', value: '1' }, { label: '2', value: '2' }] }],
+ request,
+ },
+ template: `
+ row:{{row}}
+ `,
+ }),
+}