diff --git a/vite-demo/mock/table.js b/vite-demo/mock/table.js
index 340f52f6230e57be50d12692d64c863574d1b991..1b261d255ac17a290e072eba2060b3811f5b7cf9 100644
--- a/vite-demo/mock/table.js
+++ b/vite-demo/mock/table.js
@@ -1,31 +1,50 @@
 import {mock} from "mockjs";
 
 let data = {
-    'list|1-10': [{
+    'rows|1-10': [{
         // 属性 id 是一个自增数，起始值为 1，每次增 1
-        'id|+1': 1
+        'id|+1': 1,
+        'name': '@cname()',
+        "age|1-30": 18,
+        "address": '@county(true)',
+        "tags": '@shuffle([\'LOSER\', \'TEACHER\', \'DEVELOPER\', \'NICE\', \'COOL\'], 1, 3)'
     }]
 }
+
+
 module.exports = [
-    // 登录
+    // 获取列表
     {
         url: '/api/table/all',
-        type: 'post',
+        type: 'get',
         response: config => {
-            const {token} = config.body
-            if (!token) {
+
+            const {token} = config.headers
+            if (token) {
                 return {
-                    code: 60204,
-                    message: 'token失效'
+                    code: 200,
+                    data: data
                 }
             }
             return {
-                code: 200,
-                data: {
-                    count: data.length,
-                    rows: data
+                code: 60204,
+                data: token,
+                message: 'token失效'
+            }
+        }
+    },
+    {
+        url: '/api/table/add',
+        type: 'get',
+        response: config => {
+            const {token} = config.headers
+            if (token) {
+                return {
+                    code: 200,
+                    msg: 'ok'
                 }
             }
+
         }
     },
 ]
diff --git a/vite-demo/mock/user.js b/vite-demo/mock/user.js
index fd3d41af62ed1b9973056db14ef604a9599badc5..68069a0f8d55caf38b65713f301c3c6648d04c6e 100644
--- a/vite-demo/mock/user.js
+++ b/vite-demo/mock/user.js
@@ -54,14 +54,15 @@ module.exports = [
         url: '/api/user/info',
         type: 'get',
         response: config => {
-            const {token} = config.query
+            console.log('/api/user/info - config',config);
+            const {token} = config.headers
             const info = users[token]
 
             // mock error
             if (!info) {
                 return {
                     code: 50008,
-                    message: 'Login failed, unable to get user details.'
+                    message: '获取信息失败'
                 }
             }
 
@@ -88,7 +89,7 @@ module.exports = [
         url: '/api/menu/getRouter',
         type: 'get',
         response: config => {
-            const {token} = config.query
+            const {token} = config.headers
             if (token) {
                 return {
                     code: 200,
diff --git a/vite-demo/src/api/commonApi/index.js b/vite-demo/src/api/commonApi/index.js
new file mode 100644
index 0000000000000000000000000000000000000000..49bcc2322f4694a0f5d8737d18a8c72062eb9835
--- /dev/null
+++ b/vite-demo/src/api/commonApi/index.js
@@ -0,0 +1,49 @@
+/**
+ * 封装一些公用的接口
+ */
+import request from '@/utils/request';
+
+// post
+export const postAction = (url, data, params, option) => {
+  return request({
+    url,
+    method: 'post',
+    data,
+    params,
+    ...option
+  });
+};
+
+// put
+export const putAction = (url, data, params, option) => {
+  return request({
+    url,
+    method: 'put',
+    data,
+    params,
+    ...option
+  });
+};
+
+// delete
+export const deleteAction = (url, data, params, option) => {
+  return request({
+    url,
+    method: 'delete',
+    data,
+    params,
+    ...option
+  });
+};
+
+// 所有查询方法 默认get
+export const httpAction = (url, params, data, method = 'get', option) => {
+  console.log('httpAction',url, params, data, method = 'get', option);
+  return request({
+    url,
+    method,
+    data,
+    params,
+    ...option
+  });
+};
diff --git a/vite-demo/src/api/list.js b/vite-demo/src/api/list.js
new file mode 100644
index 0000000000000000000000000000000000000000..605583e2837869edf7a9543dd747123b9ce9f051
--- /dev/null
+++ b/vite-demo/src/api/list.js
@@ -0,0 +1,10 @@
+import request from '@/utils/request'
+
+export function tabelAll(data) {
+    console.log(data);
+    return request({
+        url: '/api/table/all',
+        method: 'get',
+        data
+    })
+}
\ No newline at end of file
diff --git a/vite-demo/src/components/configForm/form.vue b/vite-demo/src/components/configForm/form.vue
index fa35faf3e604122ec5f39a0a9ac558c4630a6936..a9ab94653542ba4f43229ef66a7bf40f3d5382f4 100644
--- a/vite-demo/src/components/configForm/form.vue
+++ b/vite-demo/src/components/configForm/form.vue
@@ -13,8 +13,8 @@
                     <a-input-number v-if="item.inputType === 'number'" :disabled="item.disabled || hasDisabled"
                                     v-model:value="formState[`${item.fieldName}`]"
                                     :placeholder="item.placeholder?item.placeholder:'请输入'"
-                                    :min="item.min?item.min:Infinity"
-                                    :max="item.max?item.max:Infinity"/>
+                                    :min="item.min"
+                                    :max="item.max"/>
                     <!--多行文本-->
                     <a-textarea v-if="item.inputType === 'textarea'" :disabled="item.disabled || hasDisabled"
                                 v-model:value="formState[`${item.fieldName}`]"
@@ -24,7 +24,8 @@
                     <!--单选-->
                     <a-radio-group v-if="item.inputType === 'radio'" :disabled="item.disabled || hasDisabled"
                                    v-model:value="formState[`${item.fieldName}`]">
-                        <a-radio v-for="radio in item.options" :key="radio.value" :value="radio.value">{{radio.name}}
+                        <a-radio v-for="radio in item.options" :key="radio.value" :value="radio.value">
+                            {{radio.name}}
                         </a-radio>
                     </a-radio-group>
                     <!-- 多选-->
@@ -39,7 +40,7 @@
                     <a-select
                             v-if="item.inputType == 'select'"
                             allowClear
-                            v-model="formState[`${item.fieldName}`]"
+                            v-model:value="formState[`${item.fieldName}`]"
                             :placeholder="item.placeholder?item.placeholder:'请选择'"
                             :show-search="item.showSearch"
                             :options="item.options"
@@ -91,7 +92,7 @@
         props: {
             config: Object,
         },
-        setup(props) {
+        setup(props, {emit}) {
             // 表单数据
             const formRef = ref(null);
             const dateFormat = 'YYYY-MM-DD';
@@ -101,7 +102,7 @@
             const initForm = () => {
                 props.config.data.forEach(item => {
                     if (item.inputType !== "range") {
-                        let defaultVal = item.defaultVal ? item.defaultVal : ''
+                        let defaultVal = item.defaultVal ? item.defaultVal : undefined
                         formState[`${item.fieldName}`] = defaultVal;
                     } else {
                         if (item.fieldName) {
@@ -122,25 +123,27 @@
                             let validator = typeof item.validator === 'function' ? item.validator : null
                             if (!validator) {
                                 rulesForm[item.fieldName] = [{
-                                    whitespace: true,
+                                    whitespace: item.required ? item.required : false, // 必选时，空格是否会被视为错误
                                     required: item.required,
-                                    message: `${item.label}内容不能为空`,
-                                    trigger: 'blur',
+                                    message: `${item.label}不能为空`,
+                                    // trigger: 'change',
+                                    type: item.inputType === 'number' ? 'number' : 'string'
                                 }]
+
                             } else {
                                 // 自定义效验内容
                                 rulesForm[item.fieldName] = [{
-                                    whitespace: true,
+                                    whitespace: item.required ? item.required : false,
                                     required: item.required,
                                     validator: validator,
-                                    trigger: 'blur',
+                                    // trigger: 'change',
                                 }]
                             }
                         }
                     }
                 });
-                console.log('rules', rulesForm);
-                console.log('formState', formState);
+                console.log('form - rules', rulesForm);
+                console.log('form - formState', formState);
             }
 
             onMounted(() => {
@@ -149,7 +152,7 @@
 
             // 时间选择
             function onInputChange(fieldName, date, dateStrings, type) {
-                // console.log(fieldName, date, dateStrings, type);
+                console.log(fieldName, date, dateStrings, type);
                 if (type) {
                     if (fieldName && type === 'range') {
                         let arr = fieldName.split(',');
@@ -162,26 +165,34 @@
                         formState.endTime = dateStrings[1];
                     }
                 } else {
-                    formState[fieldName] = date ? moment(date, dateFormat) : null
+                    // moment(val).format("YYYY-MM-DD HH:mm:ss")
+                    formState[fieldName] = date ? moment(date).format(dateFormat) : null
+                    // console.log('formState - moment', moment(date).format(dateFormat));
+                    console.log('formState - str', moment(date, dateFormat));
+                    // console.log('formState', formState);
                 }
             }
 
             // 重置表单
             const resetForm = () => {
                 formRef.value.resetFields();
+                console.log('resetForm', formState);
                 for (let key in formState) {
-                    formState[key] = '';
+                    formState[key] = undefined;
                 }
+                emit('close')
             }
 
             // 数据提交
             const onSubmit = () => {
                 console.log('formRef', formRef);
+
                 formRef.value.validate()
                     .then(() => {
                         console.log('values', toRaw(formState));
                         let data = getQuery();
                         console.log(data);
+                        emit('ok', data)
                     })
                     .catch((error) => {
                         console.log('error', error);
diff --git a/vite-demo/src/components/popups/drawer.vue b/vite-demo/src/components/popups/drawer.vue
index 1cb6d5e24f28c6707adf33d36355d7667fe3827e..14f1b80db3d8dfce7141ad1a7cea9bd20b76fcad 100644
--- a/vite-demo/src/components/popups/drawer.vue
+++ b/vite-demo/src/components/popups/drawer.vue
@@ -1,6 +1,7 @@
 <template>
     <a-drawer
-            :title="drawerTitle"
+            :title="title"
+            :width="drawerWidth"
             :placement="drawerPlacement"
             :closable="drawerClosable"
             v-model:visible="isShow"
@@ -18,8 +19,12 @@
                 type: Boolean,
                 default: false
             },
+            drawerWidth:{
+                type: [Number,String],
+                default: 700
+            },
             // 标题
-            drawerTitle: {
+            title: {
                 type: String,
                 default: ''
             },
diff --git a/vite-demo/src/components/popups/modal.vue b/vite-demo/src/components/popups/modal.vue
index f4995728c06b4535992031e933df1dd5303931f0..b283ae3c88f3c61b68cfc365c96d5f325e947ab6 100644
--- a/vite-demo/src/components/popups/modal.vue
+++ b/vite-demo/src/components/popups/modal.vue
@@ -2,19 +2,20 @@
     <a-modal
             :width="800"
             :title="title"
-            :visible="isShow"
+            v-model:visible="isShow"
             :maskClosable="false"
             :confirmLoading="confirmLoading"
-            @ok="handleOk"
-            @cancel="handleCancel"
+            @ok="modalOk"
+            @cancel="modalCancel"
     >
-        <slot></slot>
+        <slot>默认插槽</slot>
     </a-modal>
 
 </template>
 
 <script>
     import {ref, watch} from 'vue'
+    import {useModal} from "@/hook/useModal";
 
     export default {
         name: "modalIndex",
@@ -28,27 +29,17 @@
                 default: false
             },
         },
-        setup(props, content) {
-            console.log('props - modal', props);
-            let confirmLoading = ref(false)
-            const handleOk = (e) => {
-                confirmLoading.value = true
-                content.emit('modalOk');
-                handleCancel()
-                setTimeout(() => {
-                    confirmLoading.value = false
-                }, 300)
-            }
+        setup(props, {emit}) {
+            const {
+                modalOk,
+                modalCancel,
+            } = useModal(emit)
 
-            const handleCancel = () => {
-                content.emit('modalCancel');
-                content.emit('update:isShow', false);
-            }
 
             return {
-                handleOk,
-                handleCancel,
-                confirmLoading
+                modalOk,
+                modalCancel,
+                confirmLoading:false
             }
         }
     }
diff --git a/vite-demo/src/components/popups/popups.js b/vite-demo/src/components/popups/popups.js
index 7dab7da3424018f47baf3849ffd7b139140ec66e..695a447a8f7d19e1c65e68c785a318f8abba8c62 100644
--- a/vite-demo/src/components/popups/popups.js
+++ b/vite-demo/src/components/popups/popups.js
@@ -3,7 +3,9 @@ import modal from './modal.vue'
 import {h} from 'vue'
 
 export const renderPopups = function (props, {slots}) {
-    console.log('renderPopups',props);
-    return props.type === 'modal' ? h(modal, slots.default()) : h(drawer, slots.default())
-}
-
+    const paramsProps = {
+        isShow: props.isShow,
+        title: props.title,
+    }
+    return props.type === 'modal' ? h(modal, paramsProps, slots.default()) : h(drawer, paramsProps, slots.default())
+}
\ No newline at end of file
diff --git a/vite-demo/src/hook/useModal.js b/vite-demo/src/hook/useModal.js
index fdc784a6162232734039024e00faf0b4724992e3..41a53cadb3e994889766231edcdcfd4d7226bdb9 100644
--- a/vite-demo/src/hook/useModal.js
+++ b/vite-demo/src/hook/useModal.js
@@ -1,28 +1,81 @@
-import {ref, reactive, computed} from 'vue'
-
+import {ref, reactive, toRefs, computed} from 'vue'
+import {postAction, putAction, deleteAction, httpAction} from '@/api/commonApi/index';
 // 设置模态框
-export function useModal() {
-    const isShow = ref(false)
-    const isModalLoading = ref(false)
+export function useModal(emit) {
+
+    const useModalData = reactive({
+        isShow: false,
+        confirmLoading: false
+    })
 
     const onModalShow = () => {
-        isShow.value = true
+        console.log('打开弹框')
+        useModalData.isShow = true
+        console.log('modal - use', useModalData.isShow);
     }
+
     const modalOk = () => {
         console.log('确认')
+        useModalData.isShow = false
     }
 
     const modalCancel = () => {
-        console.log('取消')
+        console.log('modal  - use -  取消')
+        useModalData.isShow = false
+        console.log(useModalData.isShow);
+        emit('update:isShow', false)
     }
 
+
+    const handleOk = ({url,formItem, otherValues = {}, type = 'add', path}) => {
+        useModalData.confirmLoading = true;
+        let axios;
+        let formData = Object.assign(formItem, otherValues);
+        if (type === 'edit') { // 修改
+            if (!this.url.edit) {
+                message.error('请设置url.edit属性!');
+                console.error('请设置url.edit属性!');
+                return;
+            }
+            axios = putAction(`${url.edit}/${path}`, formData);
+        } else { // 新增
+            if (!url.add) {
+                message.error('请设置url.add属性!');
+                console.error('请设置url.add属性!');
+                return;
+            }
+            axios = postAction(url.add, formData);
+        }
+        axios.then((res) => {
+            if (res.code === 201 || res.code === 202) {
+                this.$emit('ok');
+                this.close();
+            }
+        }).catch(err => {
+            console.error(err);
+        }).finally(() => {
+            useModalData.confirmLoading = false;
+        });
+    }
+
+
+    // 根据屏幕变化,设置抽屉尺寸
+    // const resetScreenSize = () => {
+    //     const screenWidth = document.body.clientWidth;
+    //     if (screenWidth < 500) {
+    //         this.drawerWidth = screenWidth;
+    //     } else {
+    //         this.drawerWidth = 700;
+    //     }
+    // }
+
     return {
         modalOk,
         modalCancel,
         onModalShow,
-        isShow
+        ...toRefs(useModalData),
+        handleOk
     }
-
 }
 
 
diff --git a/vite-demo/src/hook/useTableMdal.js b/vite-demo/src/hook/useTableMdal.js
index c25e1914baad0817a9c67149331ef86034d9ce62..411c43b917dd75e08b7b4e08de173c7b69b9ab9a 100644
--- a/vite-demo/src/hook/useTableMdal.js
+++ b/vite-demo/src/hook/useTableMdal.js
@@ -3,10 +3,10 @@
  * useTable 表格查询，分页， 删除
  * @modalMixin 弹窗新增，修改，详情
  */
-import {ref, reactive, computed} from 'vue'
-import {message, confirm} from 'ant-design-vue'
-// import { postAction, putAction, deleteAction, httpAction } from 'api/commonApi/index';
-let postAction, putAction, deleteAction, httpAction;
+import {ref, reactive, toRefs, computed, onMounted} from 'vue'
+import {message, Modal} from 'ant-design-vue'
+import {postAction, putAction, deleteAction, httpAction} from '@/api/commonApi/index';
+// let postAction, putAction, deleteAction, httpAction;
 let filterObjByKey, parseDate, getMoment, formatObjDate, getTreeKeys;
 
 // import { filterObjByKey, parseDate, getMoment, formatObjDate, getTreeKeys } from 'utils/util';
@@ -61,15 +61,19 @@ export function usePaging() {
     }
 }
 
+// 表格
 export function useTable(url) {
     const {ipagination} = usePaging()
+    let tableData = reactive({
+        // 数据源
+        dataSource: [],
+    })
     let isInitTable = true, // 是否初始化表格
         // 查询条件
         queryParam = {},
         // 折叠区域查询条件
         subQueryParam = {},
-        // 数据源
-        dataSource = [],
+
 
         // 表格加载状态
         tableLoading = ref(false),
@@ -114,9 +118,9 @@ export function useTable(url) {
         if (url.dataAll) { // 数据和表格总数一起请求
             httpAction(url.dataAll, data).then((res) => { // 列表数据
                 if (res.code === 200) {
-                    dataSource = res.data.rows;
+                    tableData.dataSource = res.data.rows;
                     ipagination.total = Number(res.data.count);
-                    console.log(dataSource)
+                    console.log('tableData.', tableData.dataSource)
                 }
                 tableLoading.value = false;
             }).catch(error => {
@@ -126,7 +130,7 @@ export function useTable(url) {
         } else { // 数据和表格总数分开请求请求
             httpAction(url.list, data).then((res) => { // 列表数据
                 if (res.code === 200) {
-                    dataSource = res.data;
+                    tableData.dataSource = res.data;
                     console.log(dataSource)
                 }
                 tableLoading.value = false;
@@ -157,7 +161,6 @@ export function useTable(url) {
         return params;
     }
 
-
     // 表格行选择
     const onSelectChange = (selectedRowKeys, selectionRows) => {
         console.log(selectedRowKeys, selectionRows)
@@ -214,7 +217,7 @@ export function useTable(url) {
         // }
 
     const openModal = () => {
-            this.showModal = true;
+            showModal.value = true;
         }
 
     // 批量删除
@@ -268,7 +271,7 @@ export function useTable(url) {
             console.error('请设置url.delete属性!');
             return;
         }
-        confirm({
+        Modal.confirm({
             title: '确认删除',
             content: tip,
             centered: true,
@@ -295,16 +298,19 @@ export function useTable(url) {
 
     // 排序 分页
     const handleTableChange = (pagination, filters, sorter) => {
-        ipagination = pagination;
+        // ipagination = pagination;
         loadData();
     }
 
-    if (isInitTable) {
+
+    onMounted(() => {
         loadData();
-    }
+    })
 
     return {
-        ipagination,
+        loadData,
+        ...toRefs(tableData),
+        // ipagination,
         onSelectChange
     };
 };
@@ -331,7 +337,7 @@ const props = {
 }
 
 export function useModal() {
-    return {
+    const useModalData = reactive({
         // 弹窗设置
         drawerWidth: 700,
         // 布局
@@ -344,8 +350,7 @@ export function useModal() {
             sm: {span: 16}
         },
         confirmLoading: false,
-        form: this.$form.createForm(this)
-    }
+    })
     const disableSubmit = computed({
         get: () => {
             if (type === 'detail') {
@@ -353,95 +358,56 @@ export function useModal() {
             }
             return false;
         },
-
         set: () => {
         }// 查看详情，禁用所有表单
+    })
+
+    const close = () => {
+        this.confirmLoading = false;
+        this.disableSubmit = false;
+        this.$emit('close');
+        this.$emit('update:show', false);
     }
 
-    methods: {
-        // 回填数据
-        backfillData()
-        {
-            this.resetScreenSize();
-            // 回填数据
-            this.$nextTick().finally(() => {
-                this.form.resetFields();
-                // 日期处理
-                if (this.type !== 'add') {
-                    this.data = parseDate(this.data);
-                    setTimeout(() => {
-                            this.form.setFieldsValue(this.data);
-                        }
-                    )
-                }
-            })
-            ;
-        }
-    ,
-        handleOk(otherValues = {}, path, dateFormat = 'YYYY-MM-DD')
-        {
-            this.confirmLoading = true;
-            // 触发表单验证
-            this.form.validateFields((err, values) => {
-                if (!err) {
-                    let formData = Object.assign(values, otherValues);
-                    formData = formatObjDate(formData, dateFormat);
-                    Object.keys(formData).forEach(item => { // 清空字符串前后空格
-                        if (typeof formData[item] === 'string') {
-                            formData[item] = formData[item].trim();
-                        }
-                    })
-                    let axios;
-                    if (this.type === 'edit') { // 修改
-                        if (!this.url.edit) {
-                            this.$message.error('请设置url.edit属性!');
-                            console.error('请设置url.edit属性!');
-                            return;
-                        }
-                        axios = putAction(`${this.url.edit}/${path}`, formData);
-                    } else { // 新增
-                        if (!this.url.add) {
-                            this.$message.error('请设置url.add属性!');
-                            console.error('请设置url.add属性!');
-                            return;
-                        }
-                        axios = postAction(this.url.add, formData);
-                    }
-                    axios.then((res) => {
-                        if (res.code === 201 || res.code === 202) {
-                            this.$emit('ok');
-                            this.close();
-                        }
-                    }).catch(err => {
-                        console.error(err);
-                    }).finally(() => {
-                        this.confirmLoading = false;
-                    });
-                } else {
-                    this.confirmLoading = false;
-                }
-            })
-        }
-    ,
-        close()
-        {
-            this.confirmLoading = false;
-            this.disableSubmit = false;
-            this.$emit('close');
-            this.$emit('update:show', false);
-        }
-    ,
-        // 根据屏幕变化,设置抽屉尺寸
-        resetScreenSize()
-        {
-            const screenWidth = document.body.clientWidth;
-            if (screenWidth < 500) {
-                this.drawerWidth = screenWidth;
-            } else {
-                this.drawerWidth = 700;
+    const handleOk = (otherValues = {}, path, dateFormat = 'YYYY-MM-DD') => {
+        useModalData.confirmLoading = true;
+        let axios;
+        if (this.type === 'edit') { // 修改
+            if (!this.url.edit) {
+                this.$message.error('请设置url.edit属性!');
+                console.error('请设置url.edit属性!');
+                return;
             }
+            axios = putAction(`${this.url.edit}/${path}`, formData);
+        } else { // 新增
+            if (!this.url.add) {
+                this.$message.error('请设置url.add属性!');
+                console.error('请设置url.add属性!');
+                return;
+            }
+            axios = postAction(this.url.add, formData);
         }
-    ,
+        axios.then((res) => {
+            if (res.code === 201 || res.code === 202) {
+                this.$emit('ok');
+                this.close();
+            }
+        }).catch(err => {
+            console.error(err);
+        }).finally(() => {
+            this.confirmLoading = false;
+        });
+    }
+
 
+
+    // 根据屏幕变化,设置抽屉尺寸
+    const resetScreenSize = () => {
+        const screenWidth = document.body.clientWidth;
+        if (screenWidth < 500) {
+            this.drawerWidth = screenWidth;
+        } else {
+            this.drawerWidth = 700;
+        }
     }
 };
diff --git a/vite-demo/src/store/getters.js b/vite-demo/src/store/getters.js
index eba219abc6ab63d6b39e10b5358d745e1719943a..1ce86e4dc7c5c67c0e6dfa06af8680eb027a95d3 100644
--- a/vite-demo/src/store/getters.js
+++ b/vite-demo/src/store/getters.js
@@ -1,5 +1,6 @@
 const getters = {
     roles: state => state.user.roles, // 用户权限
-    router: state => state.permission.router // 用户路由
+    router: state => state.permission.router, // 用户路由
+    token: state => state.user.token // 用户路由
 }
 export default getters
\ No newline at end of file
diff --git a/vite-demo/src/store/modules/user.js b/vite-demo/src/store/modules/user.js
index ce4053bf83128fcc1d557249fccb9923e9b14405..fa86759d5207cc217044842a9f06e885704cbcf7 100644
--- a/vite-demo/src/store/modules/user.js
+++ b/vite-demo/src/store/modules/user.js
@@ -34,7 +34,7 @@ const user = {
         // 获取用户信息
         getUserInfo({commit}, token) {
             return new Promise((resolve, reject) => {
-                getInfo(token).then(res => {
+                getInfo().then(res => {
                     const {data} = res;
                     console.log('res', data.roles)
                     commit('SER_USER_ROLES',data.roles)
diff --git a/vite-demo/src/utils/request.js b/vite-demo/src/utils/request.js
index 22f6c0892b4b3e405a67d9975de97a673c10f82c..52e78d215e6243223f0a660705df4742924393d8 100644
--- a/vite-demo/src/utils/request.js
+++ b/vite-demo/src/utils/request.js
@@ -1,8 +1,9 @@
 import axios from 'axios'
 import {Modal, message} from 'ant-design-vue'
-import store from '@/store'
+import store from '@/store/index'
 import {getToken} from '@/utils/auth'
 
+
 // create an axios instance
 const service = axios.create({
     baseURL: import.meta.env.BASE_API, // url = base url + request url
@@ -14,13 +15,15 @@ const service = axios.create({
 service.interceptors.request.use(
     config => {
         // do something before request is sent
-
+        console.log('store',store);
+        console.log('store.getters.token',store.getters.token);
         if (store.getters.token) {
             // let each request carry token
             // ['X-Token'] is a custom headers key
             // please modify it according to the actual situation
-            config.headers['X-Token'] = getToken()
+            config.headers['token'] = getToken()
         }
+            console.log('config',config);
         return config
     },
     error => {
@@ -34,6 +37,8 @@ service.interceptors.request.use(
 service.interceptors.response.use(
     response => {
         const res = response.data
+        console.log('response',response);
+
         if (res.code !== 200) {
             message.error({
                 content: res.message || 'Error',
@@ -57,6 +62,7 @@ service.interceptors.response.use(
             }
             return Promise.reject(new Error(res.message || 'Error'))
         } else {
+            console.log('response',res);
             return res
         }
     },
diff --git a/vite-demo/src/views/antd/table/components/fromModal.vue b/vite-demo/src/views/antd/table/components/fromModal.vue
index 5c78a663ad9d829b69515f8f2506ef11221ec1fa..8fc8b3df449b591c3d94b8f27beccd60ccf551b6 100644
--- a/vite-demo/src/views/antd/table/components/fromModal.vue
+++ b/vite-demo/src/views/antd/table/components/fromModal.vue
@@ -1,29 +1,99 @@
 <template>
-    <!--    <modal >-->
-    <!--        <div>1232</div>-->
-    <!--    </modal>-->
-    <renderPopups :isShow="isShow" :type="2">
-        <template>
-            drawer
-        </template>
+
+    <renderPopups v-model:isShow="isShow" :title="title" type="drawer">
+
+        <a-spin :spinning="confirmLoading">
+            <configForm :config="configListForm" ref="getQueryRef" @ok="query" @close="modalCancel"></configForm>
+        </a-spin>
     </renderPopups>
 </template>
 
 <script>
+    import {ref, reactive} from 'vue'
     import modal from '@c/modal/index.vue'
     import {renderPopups} from '@c/popups/popups'
+    import {useModal} from "@/hook/useModal";
+    import configForm from '@c/configForm/form.vue'
 
     export default {
         name: "fromModal",
         props: {
-            isShow: Boolean
+            title: String
         },
         components: {
             modal,
-            renderPopups
+            renderPopups,
+            configForm
         },
-        setup() {
-
+        setup(props, {emit}) {
+            const {onModalShow, isShow, modalCancel, handleOk, confirmLoading} = useModal(emit)
+            let spinning = ref(false)
+            let getQueryRef = ref(null)
+            const query = (data) => {
+                console.log('spinning', data);
+                handleOk({
+                    url: {
+                        add: '/api/table/add'
+                    },
+                    formItem: data
+                })
+            }
+            let configListForm = reactive({
+                data: [
+                    {
+                        inputType: "text",
+                        fieldName: "name",
+                        required: true,
+                        label: "姓名",
+                        placeholder: "请输入姓名"
+                    },
+                    {
+                        inputType: "number",
+                        fieldName: "age",
+                        label: "年龄",
+                        required: true,
+                        placeholder: "请输入年龄"
+                    },
+                    {
+                        inputType: "text",
+                        fieldName: "address",
+                        label: "地址",
+                        required: true,
+                        placeholder: "请输入地址"
+                    },
+                    {
+                        inputType: "date",
+                        fieldName: "time",
+                        label: "时间",
+                        required: true,
+                        placeholder: "请选择时间"
+                    },
+                    {
+                        inputType: "select",
+                        fieldName: "tags",
+                        label: "标签",
+                        required: true,
+                        placeholder: "请选择",
+                        options: [
+                            {value: "0", label: "LOSER"},
+                            {value: "1", label: "TEACHER"},
+                            {value: "2", label: "DEVELOPER"},
+                            {value: "3", label: "NICE"},
+                            {value: "4", label: "COOL"},
+                        ]
+                    }
+                ],
+            })
+            return {
+                onModalShow,
+                isShow,
+                modalCancel,
+                //
+                confirmLoading,
+                configListForm,
+                getQueryRef,
+                query
+            }
         }
     }
 </script>
diff --git a/vite-demo/src/views/antd/table/index.vue b/vite-demo/src/views/antd/table/index.vue
index 5bd0de0e4ce22f5bb51df4b1b3898b598302c5fc..d4fdc5ace0d7c2ac92df3a45a9231f706bd04750 100644
--- a/vite-demo/src/views/antd/table/index.vue
+++ b/vite-demo/src/views/antd/table/index.vue
@@ -1,7 +1,8 @@
 <template>
     <a-space direction="vertical" style="width: 100%">
-        <a-button @click="onModalShow">新增</a-button>
-        <a-table :columns="columns" :data-source="data">
+        <a-button @click="bindModalShow">新增</a-button>
+        <a-table :columns="columns" :data-source="dataSource"
+                 :rowKey="(row,index) => index">
             <template #name="{ text }">{{ text }}</template>
             <!--设置表头信息-->
             <template #customTitle>
@@ -32,7 +33,8 @@
             </template>
         </a-table>
     </a-space>
-    <fromModal v-model:isShow="isShow" :title="13"></fromModal>
+
+    <fromModal ref="fromModalRef" title="jsx组价"></fromModal>
 </template>
 
 <script>
@@ -91,26 +93,34 @@
         },
     ];
     import {SmileOutlined, DownOutlined} from '@ant-design/icons-vue';
-    import {useModal} from "@/hook/useModal";
     import fromModal from './components/fromModal.vue'
+    import {ref} from 'vue'
+    // import {tabelAll} from '@/api/list'
+    import {useTable} from '@/hook/useTableMdal'
 
     export default {
         name: "tableIndex",
-        setup() {
-            const {
-                modalOk,
-                modalCancel,
-                onModalShow,
-                isShow
-            } = useModal()
+        setup(props, {emit}) {
+
+            const fromModalRef = ref()
+            const bindModalShow = () => {
+                console.log(fromModalRef.value);
+                fromModalRef.value.onModalShow()
+            }
+
+            const {dataSource} = useTable({
+                dataAll: '/api/table/all'
+            })
+
+            console.log('dataSource', dataSource);
 
             return {
                 data,
                 columns,
-                modalOk,
-                modalCancel,
-                onModalShow,
-                isShow
+                dataSource,
+
+                fromModalRef,
+                bindModalShow,
             };
         },
         components: {
diff --git a/vite-demo/src/views/skills/components/jsx/btn1.vue b/vite-demo/src/views/skills/components/jsx/btn1.vue
index 8ebe7252b32a191db82720c836d3b158db0a9557..537a8e13d7ffaecc8df8ee98e026b882b942a345 100644
--- a/vite-demo/src/views/skills/components/jsx/btn1.vue
+++ b/vite-demo/src/views/skills/components/jsx/btn1.vue
@@ -10,7 +10,7 @@
     </div>
 </template>
 <script>
-    import {ref, defineComponent} from 'vue'
+    import {ref, defineComponent, watch} from 'vue'
 
     export default defineComponent({
         name: 'btn1',
@@ -22,9 +22,9 @@
         setup(props, {emit}) {
             console.log('props - btn', props);
             const num = ref(1)
+
             const close = () => {
-                console.log('close')
-                emit('close');
+                console.log('props - close', 'close')
                 emit('update:show', false)
             }
             return {num, close}
diff --git a/vite-demo/src/views/skills/components/jsx/index.vue b/vite-demo/src/views/skills/components/jsx/index.vue
index e0b1efcf1c8a2adf6cef04353d4385d4c9d60c3a..88c8c2b460375f6319d1387cfd7a0bb68b77493b 100644
--- a/vite-demo/src/views/skills/components/jsx/index.vue
+++ b/vite-demo/src/views/skills/components/jsx/index.vue
@@ -1,7 +1,7 @@
 <template>
     <button @click="componentsToggle">切换</button>
     <button @click="onShow">显示</button>
-    <renderFn :type="componentsType" title="自定义title" :show.sync="isShow">
+    <renderFn :type="componentsType" title="自定义title" v-model:show="isShow">
         <div default="{text}">
             <p> 默认插槽： 111111</p>
         </div>
@@ -11,18 +11,21 @@
         <!--        </template>-->
     </renderFn>
 
+
+<!--    <btn1 title="自定义title" v-model:show="isShow"></btn1>-->
 </template>
 
 <script>
     import renderFn from './renderFn.js'
     import vnode from "./vnode"
     import {ref} from 'vue'
-
+    import btn1 from './btn1.vue'
     export default {
         name: "index",
         components: {
             renderFn,
-            vnode
+            vnode,
+            btn1
         },
         setup() {
             let isShow = ref(false)
diff --git a/vite-demo/src/views/skills/components/jsx/renderFn.js b/vite-demo/src/views/skills/components/jsx/renderFn.js
index 61c290f31f8aca95f8dc46d510e7dd1e294d1947..f001f79c94aecff018b50f7b6f83f1f51ccc89fa 100644
--- a/vite-demo/src/views/skills/components/jsx/renderFn.js
+++ b/vite-demo/src/views/skills/components/jsx/renderFn.js
@@ -1,6 +1,6 @@
 import btn1 from './btn1.vue'
 import btn2 from './btn2.vue'
-import {h, watch} from 'vue'
+import {h} from 'vue'
 
 // export const renderFn = function (props, {slots}) {
 //
@@ -14,13 +14,14 @@ import {h, watch} from 'vue'
 
 export default {
     props: ['type', 'show', 'title'],
-    setup(props, {slots}) {
+    setup(props, {slots,emit}) {
         console.log('props - renderFn', props);
         return () => [
             props.type === 1 ? h(btn1, {
                 title: props.title,
                 type: props.type,
-                show: props.show
+                show: props.show,
+                'onUpdate:show': (value) => emit('update:show', false)
             }, slots.default) : h(btn2)
         ]
     }