table

vite-demo/mock/table.js

@@ -44,7 +44,6 @@ module.exports = [
                     msg: 'ok'
                 }
             }
-
         }
     },
 ]

vite-demo/src/components/configForm/form.vue

@@ -81,7 +81,7 @@
 </template>
 
 <script>
-    import {defineComponent, ref, reactive, toRaw, onMounted, computed} from 'vue';
+    import {defineComponent, ref, reactive, toRaw, onMounted, computed, onUnmounted} from 'vue';
     import moment from 'moment';
     import {Form} from 'ant-design-vue';
     import {parseDate, formatObjDate} from '@/utils/util'
@@ -146,10 +146,6 @@
                 console.log('form - formState', formState);
             }
 
-            onMounted(() => {
-                initForm()
-            })
-
             // 时间选择
             function onInputChange(fieldName, date, dateStrings, type) {
                 console.log(fieldName, date, dateStrings, type);
@@ -226,6 +222,10 @@
                 return option.value.toLowerCase().indexOf(input.toLowerCase()) >= 0;
             };
 
+            onMounted(() => {
+                initForm()
+            })
+
             return {
                 //
                 moment,

vite-demo/src/hook/useModal.js

@@ -8,6 +8,7 @@ export function useModal(emit) {
         confirmLoading: false
     })
 
+
     const onModalShow = () => {
         console.log('打开弹框')
         useModalData.isShow = true
@@ -47,9 +48,10 @@ export function useModal(emit) {
             axios = postAction(url.add, formData);
         }
         axios.then((res) => {
-            if (res.code === 201 || res.code === 202) {
-                this.$emit('ok');
-                this.close();
+            if (res.code === 200) {
+                // this.$emit('ok');
+                // this.close();
+                modalCancel()
             }
         }).catch(err => {
             console.error(err);

vite-demo/src/hook/useTableMdal.js

@@ -374,14 +374,14 @@ export function useModal() {
         let axios;
         if (this.type === 'edit') { // 修改
             if (!this.url.edit) {
-                this.$message.error('请设置url.edit属性!');
+                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属性!');
+                message.error('请设置url.add属性!');
                 console.error('请设置url.add属性!');
                 return;
             }

vite-demo/src/views/antd/table/components/fromModal.vue

@@ -5,11 +5,12 @@
         <a-spin :spinning="confirmLoading">
             <configForm :config="configListForm" ref="getQueryRef" @ok="query" @close="modalCancel"></configForm>
         </a-spin>
+        <div ref="divRef">aaa</div>
     </renderPopups>
 </template>
 
 <script>
-    import {ref, reactive} from 'vue'
+    import {ref, reactive, watch, nextTick, onUnmounted} from 'vue'
     import modal from '@c/modal/index.vue'
     import {renderPopups} from '@c/popups/popups'
     import {useModal} from "@/hook/useModal";
@@ -28,7 +29,8 @@
         setup(props, {emit}) {
             const {onModalShow, isShow, modalCancel, handleOk, confirmLoading} = useModal(emit)
             let spinning = ref(false)
-            let getQueryRef = ref(null)
+            const getQueryRef = ref()
+            const divRef = ref()
             const query = (data) => {
                 console.log('spinning', data);
                 handleOk({
@@ -84,6 +86,17 @@
                     }
                 ],
             })
+            console.log('getQueryRef', getQueryRef);
+            console.log('divRef', divRef.value);
+            watch(isShow, (n, o) => {
+                console.log('watch - isShow', n, o);
+                nextTick(() => {
+                    console.log(getQueryRef);
+                    console.log('resetForm - 页面关闭')
+                    getQueryRef.value.resetForm()
+                })
+            }, {immediate: true})
+
             return {
                 onModalShow,
                 isShow,
@@ -92,6 +105,7 @@
                 confirmLoading,
                 configListForm,
                 getQueryRef,
+                divRef,
                 query
             }
         }

vite-demo/src/views/layout/index.vue

@@ -2,12 +2,11 @@
     <!--    侧栏-->
     <div class='layout-content'>
         <sidebar :router="router"/>
-        <div style="flex: 1">
+        <div class="app-content" style="flex: 1">
             <a-card style="width: 100%">
                 <a-config-provider :locale="zhCN">
                     <router-view/>
                 </a-config-provider>
-
             </a-card>
         </div>
     </div>
@@ -44,4 +43,7 @@
         display: flex;
         height: 100%;
     }
+    .app-content {
+        overflow-y: auto;
+    }
 </style>
\ No newline at end of file

vite-demo/src/views/layout/sidebar/index.vue

@@ -132,6 +132,7 @@
 <style scoped>
     .sidbar, .layout-menu {
         height: 100%;
+        overflow: hidden auto;
     }
 
     .sidbar {