feat: 设备列表新增批量分配按钮

@@ -15,6 +15,7 @@
     "SNMP",
     "unref",
     "vben",
-    "VITE"
+    "VITE",
+    "windicss"
   ]
 }

@@ -48,6 +48,8 @@ export interface DeviceModel {
   label: string;
   lastConnectTime: string;
   deviceType: DeviceTypeEnum;
+  organizationId: string;
+  customerId?: string;
 }
 
 export interface DeviceProfileModel {

+import { computed } from 'vue';
+import { TableActionType } from '/@//components/Table';
+
+const useBatchOperation = (
+  getRowSelection: TableActionType['getRowSelection'],
+  setSelectedRowKeys: TableActionType['setSelectedRowKeys']
+) => {
+  const isExistOption = computed(() => {
+    const rowSelection = getRowSelection();
+    return !!rowSelection.selectedRowKeys?.length;
+  });
+
+  const resetSelectedOptions = () => {
+    setSelectedRowKeys([]);
+  };
+
+  return {
+    isExistOption,
+    resetSelectedOptions,
+  };
+};
+
+export { useBatchOperation };

@@ -20,6 +20,8 @@
   import { BasicForm, useForm } from '/@/components/Form';
   import { customerForm } from '../../config/detail.config';
   import { dispatchCustomer as dispatchCustomerApi } from '/@/api/device/deviceManager';
+  import { DeviceModel } from '/@/api/device/model/deviceModel';
+  import { isArray } from '/@/utils/is';
   export default defineComponent({
     name: 'AlarmDetailModal',
     components: {
@@ -28,9 +30,10 @@
     },
     emits: ['reload', 'register'],
     setup(_, { emit }) {
-      let record = {};
-      const [registerModal, { closeModal }] = useModalInner((data: any) => {
-        const { organizationId } = data;
+      let record: DeviceModel[] = [];
+      const [registerModal, { closeModal }] = useModalInner((data: DeviceModel | DeviceModel[]) => {
+        data = isArray(data) ? data : [data as DeviceModel];
+        const { organizationId } = data.at(0) || {};
         record = data;
         updateSchema([
           {
@@ -50,7 +53,11 @@
       const dispatchCustomer = async () => {
         await validate();
         const { customerId } = getFieldsValue();
-        await dispatchCustomerApi({ ...record, customerId });
+        const task: Promise<any>[] = [];
+        for await (const item of record) {
+          task.push(dispatchCustomerApi({ ...item, customerId }));
+        }
+        await Promise.all(task);
         closeModal();
         resetFields();
         emit('reload');

@@ -14,13 +14,21 @@
               title="您确定要批量删除数据"
               ok-text="确定"
               cancel-text="取消"
-              @confirm="handleDeleteOrBatchDelete(null)"
+              @confirm="handleDelete()"
             >
-              <a-button color="error" v-if="authBtn(role)" :disabled="hasBatchDelete">
+              <a-button color="error" v-if="authBtn(role)" :disabled="!isExistOption">
                 批量删除
               </a-button>
             </Popconfirm>
           </Authority>
+          <a-button
+            v-if="authBtn(role)"
+            type="primary"
+            @click="handleBatchAssign"
+            :disabled="!isExistOption"
+          >
+            批量分配
+          </a-button>
         </template>
         <template #img="{ record }">
           <TableImg
@@ -147,7 +155,7 @@
                 color: 'error',
                 popConfirm: {
                   title: '是否确认删除',
-                  confirm: handleDeleteOrBatchDelete.bind(null, record),
+                  confirm: handleDelete.bind(null, record),
                 },
               },
             ]"
@@ -170,7 +178,12 @@
 </template>
 <script lang="ts">
   import { defineComponent, reactive, unref, nextTick, h, onUnmounted, ref } from 'vue';
-  import { DeviceState, DeviceTypeEnum } from '/@/api/device/model/deviceModel';
+  import {
+    DeviceModel,
+    DeviceRecord,
+    DeviceState,
+    DeviceTypeEnum,
+  } from '/@/api/device/model/deviceModel';
   import { BasicTable, useTable, TableAction, TableImg } from '/@/components/Table';
   import { columns, searchFormSchema } from './config/device.data';
   import { Tag, Tooltip, Popover, Popconfirm } from 'ant-design-vue';
@@ -194,11 +207,11 @@
   import { USER_INFO_KEY } from '/@/enums/cacheEnum';
   import { getAuthCache } from '/@/utils/auth';
   import { authBtn } from '/@/enums/roleEnum';
-  import { useBatchDelete } from '/@/hooks/web/useBatchDelete';
   import { useCopyToClipboard } from '/@/hooks/web/useCopyToClipboard';
   import { QuestionCircleOutlined } from '@ant-design/icons-vue';
   import { Authority } from '/@/components/Authority';
   import { useRouter } from 'vue-router';
+  import { useBatchOperation } from '/@/utils/useBatchOperation';
 
   export default defineComponent({
     name: 'DeviceManagement',
@@ -233,7 +246,17 @@
 
       const [
         registerTable,
-        { reload, setSelectedRowKeys, setProps, setTableData, getForm, setPagination },
+        {
+          reload,
+          setLoading,
+          setSelectedRowKeys,
+          setTableData,
+          getForm,
+          setPagination,
+          getSelectRowKeys,
+          getSelectRows,
+          getRowSelection,
+        },
       ] = useTable({
         title: '设备列表',
         api: devicePage,
@@ -241,7 +264,6 @@
         columns,
         beforeFetch: (params) => {
           const { deviceProfileId } = params;
-          console.log(deviceProfileId);
           const obj = {
             ...params,
             ...{
@@ -272,21 +294,16 @@
           slots: { customRender: 'action' },
           fixed: 'right',
         },
-      });
-      const { hasBatchDelete, handleDeleteOrBatchDelete, selectionOptions, resetSelectedRowKeys } =
-        useBatchDelete(deleteDevice, handleSuccess, setProps);
-      selectionOptions.rowSelection.getCheckboxProps = (record: Recordable) => {
-        // Demo:status为1的选择框禁用
-        if (record.customerId) {
-          return { disabled: true };
-        } else {
-          return { disabled: false };
-        }
-      };
-      nextTick(() => {
-        setProps(selectionOptions);
+        rowSelection: {
+          type: 'checkbox',
+          getCheckboxProps: (record: DeviceModel) => {
+            return { disabled: !!record.customerId };
+          },
+        },
       });
 
+      const { isExistOption } = useBatchOperation(getRowSelection, setSelectedRowKeys);
+
       function getParams(keyword) {
         const reg = new RegExp('(^|&)' + keyword + '=([^&]*)(&|$)', 'i');
         const r = window.location.search.substr(1).match(reg);
@@ -349,7 +366,6 @@
       }
       function handleReload() {
         setSelectedRowKeys([]);
-        resetSelectedRowKeys();
         handleSuccess();
       }
       // 取消分配客户
@@ -419,6 +435,48 @@
         });
       };
 
+      const handleCheckHasDiffenterOrg = (options: DeviceModel[]) => {
+        let orgId: string | undefined;
+        let flag = false;
+        for (const item of options) {
+          const _orgId = item.organizationId;
+          if (!orgId) orgId = _orgId;
+          if (orgId !== _orgId) {
+            flag = true;
+            break;
+          }
+        }
+        return flag;
+      };
+
+      const handleBatchAssign = () => {
+        const options = getSelectRows();
+        if (handleCheckHasDiffenterOrg(options)) {
+          createMessage.error('当前选中项中存在不同所属组织的设备！');
+          return;
+        }
+        openCustomerModal(true, options);
+      };
+
+      const handleDelete = async (record?: DeviceRecord) => {
+        let ids: string[] = [];
+        if (record) {
+          ids.push(record.id);
+        } else {
+          ids = getSelectRowKeys();
+        }
+        try {
+          setLoading(true);
+          await deleteDevice(ids);
+          createMessage.success('删除成功');
+          handleReload();
+        } catch (error) {
+          createMessage.error('删除失败');
+        } finally {
+          setLoading(false);
+        }
+      };
+
       return {
         registerTable,
         handleCreate,
@@ -439,14 +497,17 @@
         authBtn,
         role,
         copySN,
-        hasBatchDelete,
-        handleDeleteOrBatchDelete,
+        isExistOption,
+        handleDelete,
+        // hasBatchDelete,
+        // handleDeleteOrBatchDelete,
         handleReload,
         registerTbDetailDrawer,
         handleOpenTbDeviceDetail,
         handleOpenGatewayDetail,
         registerGatewayDetailDrawer,
         handleUpAndDownRecord,
+        handleBatchAssign,
       };
     },
   });

@@ -260,6 +260,8 @@
         }
       };
       const setClientProperties = (record: Recordable) => {
+        const type = Reflect.get(record, 'type');
+        if (type === 'org.thingsboard.rule.engine.rabbitmq.TbRabbitMqNode') return;
         const configuration = Reflect.get(record, 'configuration');
         const clientProperties = Reflect.get(configuration, 'clientProperties');
         !clientProperties && record.configuration && (record.configuration.clientProperties = {});