lcw

src/components/ChooseList/ChooseUser/index.vue

@@ -153,11 +153,28 @@ watch(()=>props.modelValue, (val) => {
     nextTick(() => {
       getListData();
     });
-  } 
+  }
 },{
   immediate: true
 });
+
+// 监听 roleIds 变化，实时更新选择状态
+watch(()=>props.roleIds, () => {
+  if (props.modelValue && tableData.value && tableData.value.length > 0) {
+    nextTick(() => {
+      multipleUser();
+    });
+  }
+}, { deep: true });
 const closed = () => {
+  // 清空新选择的内容
+  multipleSelectionUser.value = [];
+  // 取消表格中所有行的选择状态
+  if (multipleUserRef.value && tableData.value && tableData.value.length > 0) {
+    tableData.value.forEach(item => {
+      multipleUserRef.value.toggleRowSelection(item, false);
+    });
+  }
   emits("update:modelValue", false);
 };
 const reset = () => {
@@ -176,6 +193,7 @@ const keyid = (row) => {
 // 为用户分配角色
 const onComfirm = () => {
   const userList = multipleSelectionUser.value;
+  console.log("userList", userList);
   let list = [];
   let listId = [];
   userList.forEach((val) => {
@@ -185,9 +203,8 @@ const onComfirm = () => {
     }
   });
   emits("choosedUsers", list);
-  let data = { type: props.LeaderType, userList: userList };
-
-  emits("choosedUsersLeader", data);
+  // let data = { type: props.LeaderType, userList: userList };
+  // emits("choosedUsersLeader", data);
   closed();
 };
 /**
@@ -210,12 +227,23 @@ const getListData = () => {
   selectUserDeptPage(params).then((res) => {
     tableData.value = res?.records;
     total.value = Number(res.total);
-    multipleUser();
+    // 使用 nextTick 确保表格已经渲染完成后再执行回显
+    nextTick(() => {
+      multipleUser();
+    });
   });
 };
 
 //列表回显
 function multipleUser() {
+  // 先清空之前的选择，确保选择状态的准确性
+  if (multipleUserRef.value && tableData.value && tableData.value.length > 0) {
+    tableData.value.forEach(item => {
+      multipleUserRef.value.toggleRowSelection(item, false);
+    });
+  }
+  
+  // 根据 roleIds 进行回显
   tableData.value.forEach((item) => {
     if (props.roleIds.some((id) => id == item.id)) {
       multipleUserRef.value.toggleRowSelection(item, true);