Merge pull request #4155 from jumpserver/pr@dev@fix_table_select

fixed: Fixed an issue with Select2 component and table in user list

src/components/Cards/RelationCard/index.vue

@@ -114,15 +114,17 @@ export default {
     onDeleteSuccess: {
       type: Function,
       default(obj, that) {
-        // 从hasObjects中移除这个object
+        // 从 hasObjects 中移除这个object
         const theRemoveIndex = that.iHasObjects.findIndex((v) => v.value === obj.value)
         that.iHasObjects.splice(theRemoveIndex, 1)
-        // 从disabled values中移除这个value
+
+        // 从 disabled values 中移除这个 value
         while (that.select2.disabledValues.indexOf(obj.value) !== -1) {
           const i = that.select2.disabledValues.indexOf(obj.value)
-          this.$log.debug('disabled values remove index: ', i)
+          that.$log.debug('disabled values remove index: ', i)
           that.select2.disabledValues.splice(i, 1)
         }
+
         that.$message.success(that.$t('RemoveSuccessMsg'))
       }
     },
@@ -157,6 +159,8 @@ export default {
         that.iHasObjects = [...that.iHasObjects, ...objects]
         that.$refs.select2.clearSelected()
         that.$message.success(that.$t('AddSuccessMsg'))
+        this.$refs.select2.refresh()
+        this.$emit('addSuccess')
       }
     },
     getHasObjects: {
@@ -291,9 +295,9 @@ export default {
       }
     },
     removeObject(obj) {
-      this.performDelete(obj, this).then(
-        () => this.onDeleteSuccess(obj, this)
-      ).catch(error => {
+      this.performDelete(obj, this).then(() => {
+        this.onDeleteSuccess(obj, this)
+      }).catch(error => {
         this.onDeleteFail(error, this)
       })
     },
@@ -303,7 +307,9 @@ export default {
         return
       }
       this.performAdd(objects, this).then(
-        () => this.onAddSuccess(objects, this)
+        () => {
+          this.onAddSuccess(objects, this)
+        }
       )
     },
     async selectAll() {

src/views/assets/Asset/AssetDetail/components/PermUserGroupCard.vue

@@ -51,7 +51,7 @@ export default {
   props: {
     icon: {
       type: String,
-      required: true
+      default: ''
     },
     title: {
       type: String,

src/views/users/Group/UserGroupDetail/GroupUser.vue

@@ -5,7 +5,7 @@
         <GenericListTable ref="listTable" :header-actions="headerActions" :table-config="tableConfig" />
       </el-col>
       <el-col :md="9" :sm="24">
-        <RelationCard v-bind="relationConfig" />
+        <RelationCard ref="relationCard" v-bind="relationConfig" @addSuccess="addSuccess" />
       </el-col>
     </el-row>
   </div>
@@ -95,6 +95,11 @@ export default {
                 }
               ).then(res => {
                 this.$message.success(this.$tc('DeleteSuccessMsg'))
+
+                setTimeout(() => {
+                  this.$refs.relationCard.$refs.select2.refresh()
+                }, 300)
+
                 reload()
               }).catch(error => {
                 this.$message.error(this.$tc('DeleteErrorMsg') + ' ' + error)
@@ -143,14 +148,17 @@ export default {
               usergroup: groupId
             }
           })
-          this.$axios.post(relationUrl, data)
+
           this.$message.success(this.$tc('AddSuccessMsg'))
-          setTimeout(() => {
-            window.location.reload()
-          }, 1000)
+          return this.$axios.post(relationUrl, data)
         }
       }
     }
+  },
+  methods: {
+    addSuccess() {
+      this.$refs.listTable.reloadTable()
+    }
   }
 }
 </script>