完成用户列表页改造

web/pages/admin/user/group.vue

@@ -7,6 +7,7 @@
         :show-create="true"
         :show-delete="true"
         :disabled-delete="selectedRow.length === 0"
+        :default-search="search"
         @onCreate="onCreate"
         @onDelete="batchDelete"
         @onSearch="onSearch"
@@ -94,8 +95,8 @@ export default {
       search: {
         wd: '',
         page: 1,
-        status: [],
-        group_id: [],
+        // status: [],
+        // group_id: [],
         size: 10,
       },
       groups: [],
@@ -114,11 +115,23 @@ export default {
   computed: {
     ...mapGetters('setting', ['settings']),
   },
+  watch: {
+    '$route.query': {
+      immediate: true,
+      handler() {
+        let search = { ...this.$route.query }
+        search.page = parseInt(this.$route.query.page) || 1
+        search.size = parseInt(this.$route.query.size) || 10
+        this.search = search
+        this.listGroup()
+      },
+    },
+  },
   async created() {
     this.initGroup()
     this.initSearchForm()
     this.initTableListFields()
-    await this.listGroup()
+    // await this.listGroup()
   },
   methods: {
     async listGroup() {
@@ -141,7 +154,9 @@ export default {
     },
     handleSizeChange(val) {
       this.search.size = val
-      this.listGroup()
+      this.$router.push({
+        query: this.search,
+      })
     },
     updateGroupPermissionSuccess() {
       // 权限设置成功，需要：
@@ -152,12 +167,15 @@ export default {
     },
     handlePageChange(val) {
       this.search.page = val
-      this.listGroup()
+      this.$router.push({
+        query: this.search,
+      })
     },
     onSearch(search) {
-      this.search = search
-      this.search.page = 1
-      this.listGroup()
+      this.search = { ...this.search, ...search, page: 1 }
+      this.$router.push({
+        query: this.search,
+      })
     },
     onCreate() {
       this.initGroup()

web/pages/admin/user/list.vue

@@ -126,7 +126,7 @@ export default {
   watch: {
     '$route.query': {
       immediate: true,
-      handler() {
+      async handler() {
         let search = { ...this.$route.query }
         search.page = parseInt(this.$route.query.page) || 1
         search.size = parseInt(this.$route.query.size) || 10
@@ -150,6 +150,8 @@ export default {
         }
 
         this.search = search
+        // 这里要执行下初始化，避免数据请求回来了，但是表格字段还没初始化，导致列表布局错乱
+        await this.initTableListFields()
         this.listUser()
       },
     },
@@ -308,6 +310,7 @@ export default {
       ]
     },
     initTableListFields() {
+      if (this.listFields.length > 0) return
       this.listFields = [
         { prop: 'id', label: 'ID', width: 80, type: 'number', fixed: 'left' },
         {