优化判断checkebox禁止是否选中

src/views/admin/admin/index.vue

@@ -10,7 +10,7 @@
       @register="registerTable"
       rowKey="id"
       @selectionChange="selectionChange"
-      @rowClick="selectionChange"
+      @rowClick="rowClick"
       @rowDbClick="handleEdit"
       showTableSetting
       :canResize="true"
@@ -73,6 +73,8 @@
     components: { CollapseContainer, BasicTable, TableAction, Popup, ExpExcelModel },
     setup() {
       init();
+      const userStore = useUserStore();
+      const id: any = userStore.getUserInfo?.id;
       const { createMessage } = useMessage();
       const { success, error } = createMessage;
       const tableRef = ref<Nullable<TableActionType>>(null);
@@ -85,9 +87,12 @@
         disable_btn: true,
       });
       const [registerTable] = useTable({
-        // title: '',
-        // titleHelpMessage: '',
-        rowSelection: { type: 'checkbox' },
+        rowSelection: {
+          type: 'checkbox',
+          getCheckboxProps: (record) => ({
+            disabled: record.id === id || !record.groups[0], // Column configuration not to be checked
+          }),
+        },
         columns: columns,
         // clickToRowSelect: false, // 点击行不勾选
         api: getUserList,
@@ -105,10 +110,8 @@
         showIndexColumn: false,
         bordered: true,
       });
-      const userStore = useUserStore();
       const [register, { openModal }] = useModal();
       const [addRegister, { openModal: openPopup }] = useModal();
-      const id: any = userStore.getUserInfo?.id;
       function getTableAction() {
         // 获取组件
         const tableAction = unref(tableRef);
@@ -121,7 +124,7 @@
       // 请求之前处理参数
       function beforeFetch(params) {
         console.log(params);
-        console.log('==========beforeFetch========');
+        console.log('==========before========');
         // params['op'] = {};
         for (let k in params) {
           if (!params[k]) {
@@ -157,6 +160,7 @@
             item.groups_text = [];
           }
         });
+        console.log(`result`, result);
       }
 
       async function init() {
@@ -197,7 +201,9 @@
       }
 
       async function handleDelete(record: Recordable) {
-        await deleteUser({ id: record.id }).then(() => {
+        console.log(record);
+        await deleteUser({ id: record.id }).then((res) => {
+          console.log(res);
           getTableAction().reload();
           success('删除成功!');
         });
@@ -205,20 +211,17 @@
 
       function selectionChange() {
         const keys = getTableAction().getSelectRowKeys();
-        const dataSource = getTableAction().getDataSource();
-        dataSource.map((item) => {
-          if (!item.groups[0]) {
-            if (keys.includes(item.id)) {
-              keys.splice(
-                keys.findIndex((keyItem) => keyItem === item.id),
-                1
-              );
-            }
-          }
-        });
-        if (keys.includes(id)) {
+        if (keys.length) {
+          btn.disable_btn = false;
+        } else {
+          btn.disable_btn = true;
+        }
+      }
+      function rowClick(target) {
+        const keys = getTableAction().getSelectRowKeys();
+        if (!target.groups[0] || target.id === id) {
           keys.splice(
-            keys.findIndex((keyItem) => keyItem === id),
+            keys.findIndex((item) => item === target.id),
             1
           );
         }
@@ -234,7 +237,8 @@
         if (!ids) {
           return;
         }
-        await deleteBatchesUser({ ids }).then(() => {
+        await deleteBatchesUser({ ids }).then((res) => {
+          console.log(res);
           getTableAction().reload();
           success('删除成功!');
           getTableAction().setSelectedRowKeys([]);
@@ -256,18 +260,23 @@
           data.groups = data.groups_text = '';
         }
         delete data.groups_value;
+        console.log(`data`, data);
         if (!data.id) {
-          await addUser(data).then(() => {
+          await addUser(data).then((res) => {
+            console.log(res);
             getTableAction().reload();
             closeModel();
             success('创建成功!');
           });
+          console.log('----------add---');
         } else {
-          await editUser(data).then(() => {
+          await editUser(data).then((res) => {
+            console.log(res);
             getTableAction().reload();
             closeModel();
             success('修改成功!');
           });
+          console.log('----------edit---');
         }
       }
 
@@ -318,6 +327,7 @@
         deleteBatches,
         createActions,
         getTableAction,
+        rowClick,
         selectionChange,
         addRegister,
         saveData,

src/views/admin/group/index.vue

@@ -10,7 +10,7 @@
       @register="registerTable"
       @fetchSuccess="ExpandAllRows"
       @selectionChange="selectionChange"
-      @rowClick="selectionChange"
+      @rowClick="rowClick"
       @rowDbClick="handleEdit"
       defaultExpandAllRows
       rowKey="id"
@@ -92,10 +92,12 @@
         disable_btn: true,
       });
       const [registerTable, { expandAll, collapseAll }] = useTable({
-        // title: '角色列表',
-        // titleHelpMessage:
-        //   '',
-        rowSelection: { type: 'checkbox' },
+        rowSelection: {
+          type: 'checkbox',
+          getCheckboxProps: (record) => ({
+            disabled: group_ids.includes(record.id), // Column configuration not to be checked
+          }),
+        },
         columns: columns,
         // clickToRowSelect: false, // 点击行不勾选
         api: getGroupTree,
@@ -153,7 +155,7 @@
       }
 
       function handleEdit(record: EditRecordRow) {
-        if (record.pid === 0 || group_ids.includes(record.id)) {
+        if (group_ids.includes(record.id)) {
           return;
         }
         currentEditKeyRef.value = record.id; // record.key
@@ -178,15 +180,21 @@
       }
 
       async function selectionChange() {
-        const keys = getTableAction().getSelectRowKeys();
-        groups.map((item) => {
-          if (keys.includes(item.id)) {
-            keys.splice(
-              keys.findIndex((keyItem) => keyItem === item.id),
-              1
-            );
-          }
-        });
+        const keys = await getTableAction().getSelectRowKeys();
+        if (keys.length) {
+          btn.disable_btn = false;
+        } else {
+          btn.disable_btn = true;
+        }
+      }
+      async function rowClick(target) {
+        const keys = await getTableAction().getSelectRowKeys();
+        if (group_ids.includes(target.id)) {
+          keys.splice(
+            keys.findIndex((item) => item === target.id),
+            1
+          );
+        }
         if (keys.length) {
           btn.disable_btn = false;
         } else {
@@ -279,6 +287,7 @@
         deleteBatches,
         createActions,
         getTableAction,
+        rowClick,
         selectionChange,
         toggleRowShow,
         addRegister,