diff --git a/apps/web-antd/src/views/system/user/index.vue b/apps/web-antd/src/views/system/user/index.vue index bc915cc9..75ef69e3 100644 --- a/apps/web-antd/src/views/system/user/index.vue +++ b/apps/web-antd/src/views/system/user/index.vue @@ -16,6 +16,8 @@ import { DictTag } from '#/components/Dict'; import { useDictStore } from '#/store/dict'; import { getDict, getDictOptions } from '#/utils/dict'; +import TableTest from './table'; + onMounted(() => { console.log('keepAlive测试 -> 挂载了'); }); @@ -93,5 +95,8 @@ onMounted(() => { geekblue purple + + + diff --git a/apps/web-antd/src/views/system/user/table.tsx b/apps/web-antd/src/views/system/user/table.tsx new file mode 100644 index 00000000..ab95c94f --- /dev/null +++ b/apps/web-antd/src/views/system/user/table.tsx @@ -0,0 +1,99 @@ +import type { ColumnsType } from 'ant-design-vue/es/table'; + +import { defineComponent, ref } from 'vue'; + +import { + Button, + message, + Modal, + Popconfirm, + Space, + Table, +} from 'ant-design-vue'; + +export default defineComponent({ + name: 'TableTest', + setup() { + const dataSource = [ + { age: 20, id: 1, name: '张三' }, + { age: 21, id: 2, name: '李四' }, + { age: 22, id: 3, name: '王五' }, + ]; + + const columns: ColumnsType = [ + { + align: 'center', + dataIndex: 'id', + title: 'id', + }, + { + align: 'center', + dataIndex: 'name', + title: '姓名', + }, + { + align: 'center', + dataIndex: 'age', + title: '年龄', + }, + { + align: 'center', + key: 'action', + title: '操作', + }, + ]; + + const open = ref(false); + + return () => ( +
+ + {{ + bodyCell: ({ column }: { column: any }) => { + if (column.key === 'action') { + return ( + + + { + message.success('删除成功'); + }} + placement="left" + title={'确认删除该条记录?'} + > + + + + ); + } + }, + }} +
+ (open.value = false)} + open={open.value} + title={'modal'} + > +

弹窗内容

+
+
+ ); + }, +});