异步校验增加防抖

用户中心界面调整
代码优化

vue/src/component/AbstractForm/FormAnchor.vue

@@ -35,23 +35,24 @@ export default {
         getCur(offsetTop, bounds) {
             const sections = []
             const container = this.getContainer()
-            this.data.forEach(({ref}) => {
+            for (const {ref} of this.data) {
                 const target = this.getDomFromRef(ref)
+                if (!target) continue
                 const top = getOffsetTop(target, container)
                 if (top <= offsetTop + bounds) {
                     sections.push({ref, top})
                 }
-            })
-
+            }
             if (sections.length) {
                 const max = sections.reduce((prev, curr) => (curr.top > prev.top ? curr : prev))
                 return max.ref
             }
-            return ''
+            return null
         },
 
         getDomFromRef(ref) {
             const refs = this.reference()
+            if (!refs) return null
             return refs[ref]['$el'] || refs[ref][0]['$el']
         },
 

vue/src/component/AbstractForm/FormValidateInfo.vue

@@ -28,7 +28,7 @@
 export default {
     name: "FormValidateInfo",
 
-    props: {form: Function},
+    props: {form: [Function, Object]},
 
     data() {
         return {
@@ -57,13 +57,25 @@ export default {
             this.$refs.popover.doClose()
         },
 
+        getFormRef() {
+            let ref = this.form
+            if (!ref) return
+            if (typeof ref === 'function') {
+                ref = ref()
+            }
+            return ref
+        },
+
         findFormItem(prop) {
-            return this.form().fields.find(i => i.prop === prop)
+            const form = this.getFormRef()
+            if (!form) return
+            return form.fields.find(i => i.prop === prop)
         }
     },
 
     mounted() {
-        const form = this.form()
+        const form = this.getFormRef()
+        if (!form) return
         form.$on('validate', this.onValidate)
         this.$once('hook:beforeDestroy', () => {
             form.$off('validate', this.onValidate)

vue/src/component/biz/doc/DocDetailHeader.vue

@@ -27,14 +27,8 @@ export default {
 
     props: {
         title: String,
-        description: {
-            type: Array,
-            default: () => []
-        },
-        extra: {
-            type: Array,
-            default: () => []
-        }
+        description: {type: Array, default: () => []},
+        extra: {type: Array, default: () => []}
     }
 }
 </script>

vue/src/mixin/docDetailMixin.js

@@ -1,3 +1,4 @@
+import {commonMethods} from "@/mixin/docTableMixin"
 import AbstractForm from '@/component/AbstractForm'
 import AbstractFormItem from "@/component/AbstractForm/item"
 import AbstractTable from "@/component/AbstractTable"
@@ -9,11 +10,10 @@ import FormAnchor from "@/component/AbstractForm/FormAnchor"
 import FormCard from '@/component/AbstractForm/FormCard'
 import FormValidateInfo from "@/component/AbstractForm/FormValidateInfo"
 import UploadFile from '@/component/UploadFile'
-import {commonMethods} from "@/mixin/docTableMixin"
 import {isEmpty, mergeObj} from '@/util'
-import {elAlert, elConfirm, elPrompt, elSuccess} from "@/util/message"
-import {deleteUpload} from "@/util/file"
 import {auth} from "@/util/auth"
+import {deleteUpload} from "@/util/file"
+import {elAlert, elConfirm, elPrompt, elSuccess} from "@/util/message"
 import {closeCurrentPage} from "@/util/route"
 
 export default {

vue/src/store/module/user.js

@@ -8,7 +8,7 @@ const user = getUser()
 
 const state = {
     //是否在退出的过程中，避免重复弹框
-    prepareLogout: '',
+    prepareLogout: false,
 
     /*用户基本信息*/
     id: emptyOrDefault(user.id, null),
@@ -39,7 +39,7 @@ const actions = {
     logout({commit, state, dispatch}) {
         return new Promise((resolve, reject) => {
             if (state.prepareLogout) return Promise.reject()
-            commit('prepareLogout', 'yes')
+            commit('prepareLogout', true)
             logout(state.token)
                 .then(() => {
                     commit('resource/init', false, {root: true})
@@ -54,7 +54,7 @@ const actions = {
                     window.location.reload()
                 })
                 .catch(error => reject(error))
-                .finally(() => commit('prepareLogout', ''))
+                .finally(() => commit('prepareLogout', false))
         })
     },
 

vue/src/util/index.js

@@ -1,3 +1,5 @@
+import {timePass} from "@/filter"
+
 export function isEmpty(...str) {
     return str.some(i => i === undefined || i === null || i === '')
 }
@@ -6,6 +8,15 @@ export function emptyOrDefault(v, defaultValue = '') {
     return isEmpty(v) ? defaultValue : v
 }
 
+export function getInitialValue(v) {
+    if (v === undefined || v === null) v = null
+    else if (typeof v === 'string') v = ''
+    else if (typeof v === 'boolean') v = false
+    else if (typeof v === 'number') v = 0
+    else if (typeof v === 'object') v = {}
+    else if (Array.isArray(v)) v = []
+}
+
 //简单重置对象属性
 export function resetObj(obj) {
     if (isEmpty(obj)) return
@@ -170,12 +181,18 @@ export function waitUntilSuccess(success, callback, interval = 1000, maxTryTime
 
 //store中根据state批量生成对应的mutation
 export function createMutations(state, all = false) {
-    const arr = Object.keys(state)
+    const keys = Object.keys(state)
     const obj = {}
-    arr.forEach(key => {
+    keys.forEach(key => {
         obj[key] = (s, v) => s[key] = v
     })
-    if (all) obj['$all'] = (s, v) => arr.forEach(key => s[key] = v ? v[key] || '' : '')
+    if (all) {
+        obj['$all'] = (s, v) => {
+            keys.forEach(key => {
+                s[key] = v && v[key] || getInitialValue(s[key])
+            })
+        }
+    }
     return obj
 }
 

vue/src/view/app/login/RegisterForm.vue

@@ -48,17 +48,18 @@
 <script>
 import md5 from "js-md5"
 import {register, checkName} from "@/api/account"
+import {debounce} from "@/util"
 import {elSuccess} from "@/util/message"
 
 export default {
     name: "RegisterForm",
 
     data() {
-        const validateName = (r, v, c) => {
+        const validateName = debounce((r, v, c) => {
             checkName(this.form.username)
                 .then(({msg}) => msg ? c(msg) : c())
                 .catch(e => c(e))
-        }
+        }, 300)
         const validateRepwd = (r, v, c) => {
             return v !== this.form.pwd ? c('两次密码输入不一致') : c()
         }

vue/src/view/system/user/component/EditDialog.vue

@@ -43,7 +43,7 @@ import FormDialog from '@/component/FormDialog'
 import RoleSelector from './RoleSelector'
 import {checkName} from "@/api/account"
 import {addUser, updateUser} from "@/api/system/user"
-import {isEmpty} from '@/util'
+import {isEmpty, debounce} from '@/util'
 import {elConfirm} from "@/util/message"
 
 export default {
@@ -60,11 +60,11 @@ export default {
     },
 
     data() {
-        const validateName = (r, v, c) => {
+        const validateName = debounce((r, v, c) => {
             checkName(this.form.name, this.form.id)
                 .then(({msg}) => msg ? c(msg) : c())
                 .catch(e => c(e))
-        }
+        }, 300)
         return {
             loading: false,
             form: {

vue/src/view/userCenter/indexPage.vue

@@ -1,10 +1,10 @@
 <template>
     <el-row :gutter="20">
-        <el-col :xs="24" :sm="24" :md="8" :lg="6" :xl="5" style="margin-bottom: 10px">
+        <el-col :md="24" :lg="8" :xl="6" style="margin-bottom: 10px">
             <user-card/>
         </el-col>
 
-        <el-col :xs="24" :sm="24" :md="16" :lg="18" :xl="19">
+        <el-col :md="24" :lg="16" :xl="18">
             <el-card>
                 <el-tabs v-model="activeTab" stretch>
                     <el-tab-pane v-for="i in tabs" v-once :key="i.label" :name="i.name">