'fix:[DEFECT-328]:统一转换脚本的删除风格'

@@ -48,8 +48,7 @@
     <SceneLinkAgeDrawer @register="registerDrawer" @success="handleSuccess" />
     <SceneLinkAgeDrawer @register="registerDrawer" @success="handleSuccess" />
   </div>
   </div>
 </template>
 </template>
-<script lang="ts">
-  import { defineComponent } from 'vue';
+<script lang="ts" setup>
   import { BasicTable, useTable, TableAction } from '/@/components/Table';
   import { BasicTable, useTable, TableAction } from '/@/components/Table';
   import { useDrawer } from '/@/components/Drawer';
   import { useDrawer } from '/@/components/Drawer';
   import {
   import {
@@ -62,110 +61,88 @@
   import { columns, searchFormSchema } from './config/config.data.ts';
   import { columns, searchFormSchema } from './config/config.data.ts';
   import { USER_INFO_KEY } from '/@/enums/cacheEnum';
   import { USER_INFO_KEY } from '/@/enums/cacheEnum';
   import { getAuthCache } from '/@/utils/auth';
   import { getAuthCache } from '/@/utils/auth';
-  import { authBtn } from '/@/enums/roleEnum';
   import SceneLinkAgeDrawer from './SceneLinkAgeDrawer.vue';
   import SceneLinkAgeDrawer from './SceneLinkAgeDrawer.vue';
   import { useMessage } from '/@/hooks/web/useMessage';
   import { useMessage } from '/@/hooks/web/useMessage';
 
 
-  export default defineComponent({
-    name: 'LinkEdge',
-    components: { BasicTable, SceneLinkAgeDrawer, TableAction, Switch },
-    setup() {
-      const { hasBatchDelete, handleDeleteOrBatchDelete, selectionOptions, resetSelectedRowKeys } =
-        useBatchDelete(screenLinkPageDeleteApi, handleSuccess);
-      selectionOptions.rowSelection.getCheckboxProps = (record: Recordable) => {
-        // Demo:status为1的选择框禁用
-        if (record.status === 1) {
-          return { disabled: true };
-        } else {
-          return { disabled: false };
-        }
-      };
+  const { hasBatchDelete, handleDeleteOrBatchDelete, selectionOptions, resetSelectedRowKeys } =
+    useBatchDelete(screenLinkPageDeleteApi, handleSuccess);
+  selectionOptions.rowSelection.getCheckboxProps = (record: Recordable) => {
+    // Demo:status为1的选择框禁用
+    if (record.status === 1) {
+      return { disabled: true };
+    } else {
+      return { disabled: false };
+    }
+  };
 
 
-      const userInfo: any = getAuthCache(USER_INFO_KEY);
-      const userId = userInfo.userId;
-      const role: string = userInfo.roles[0];
-      const [registerDrawer, { openDrawer }] = useDrawer();
-      const [registerTable, { reload, setProps, setSelectedRowKeys }] = useTable({
-        title: '场景联动列表',
-        api: screenLinkPageGetApi,
-        columns,
-        formConfig: {
-          labelWidth: 120,
-          schemas: searchFormSchema,
-        },
-        useSearchForm: true,
-        showTableSetting: true,
-        bordered: true,
-        showIndexColumn: false,
-        actionColumn: {
-          width: 200,
-          title: '操作',
-          dataIndex: 'action',
-          slots: { customRender: 'action' },
-          fixed: 'right',
-        },
-        ...selectionOptions,
-      });
-
-      function handleAdd() {
-        openDrawer(true, {
-          isUpdate: false,
-        });
-      }
-
-      function handleEdit(record: Recordable) {
-        openDrawer(true, {
-          record,
-          isUpdate: true,
-        });
-      }
-      function handleView(record: Recordable) {
-        openDrawer(true, {
-          record,
-          isUpdate: 3,
-        });
-      }
-      function handleSuccess() {
-        reload();
-      }
+  const userInfo: any = getAuthCache(USER_INFO_KEY);
+  const userId = userInfo.userId;
 
 
-      const statusChange = async (checked, record) => {
-        // record.pendingStatus = true;
-        setProps({
-          loading: true,
-        });
-        setSelectedRowKeys([]);
-        resetSelectedRowKeys();
-        const newStatus = checked ? 1 : 0;
-        const { createMessage } = useMessage();
-        try {
-          await screenLinkPagePutApi({ id: record.id, status: newStatus });
-          if (newStatus) {
-            createMessage.success(`启用成功`);
-          } else {
-            createMessage.success('禁用成功');
-          }
-        } finally {
-          setProps({
-            loading: false,
-          });
-          reload();
-        }
-      };
-      return {
-        registerTable,
-        registerDrawer,
-        handleAdd,
-        handleEdit,
-        handleSuccess,
-        hasBatchDelete,
-        handleDeleteOrBatchDelete,
-        handleView,
-        authBtn,
-        role,
-        userId,
-        statusChange,
-      };
+  const [registerDrawer, { openDrawer }] = useDrawer();
+  const [registerTable, { reload, setProps, setSelectedRowKeys }] = useTable({
+    title: '场景联动列表',
+    api: screenLinkPageGetApi,
+    columns,
+    formConfig: {
+      labelWidth: 120,
+      schemas: searchFormSchema,
     },
     },
+    useSearchForm: true,
+    showTableSetting: true,
+    bordered: true,
+    showIndexColumn: false,
+    actionColumn: {
+      width: 200,
+      title: '操作',
+      dataIndex: 'action',
+      slots: { customRender: 'action' },
+      fixed: 'right',
+    },
+    ...selectionOptions,
   });
   });
+
+  function handleAdd() {
+    openDrawer(true, {
+      isUpdate: false,
+    });
+  }
+
+  function handleEdit(record: Recordable) {
+    openDrawer(true, {
+      record,
+      isUpdate: true,
+    });
+  }
+  function handleView(record: Recordable) {
+    openDrawer(true, {
+      record,
+      isUpdate: 3,
+    });
+  }
+  function handleSuccess() {
+    reload();
+  }
+
+  const statusChange = async (checked, record) => {
+    setProps({
+      loading: true,
+    });
+    setSelectedRowKeys([]);
+    resetSelectedRowKeys();
+    const newStatus = checked ? 1 : 0;
+    const { createMessage } = useMessage();
+    try {
+      await screenLinkPagePutApi({ id: record.id, status: newStatus });
+      if (newStatus) {
+        createMessage.success(`启用成功`);
+      } else {
+        createMessage.success('禁用成功');
+      }
+    } finally {
+      setProps({
+        loading: false,
+      });
+      reload();
+    }
+  };
 </script>
 </script>

 import { BasicColumn, FormSchema } from '/@/components/Table';
 import { BasicColumn, FormSchema } from '/@/components/Table';
 import { h } from 'vue';
 import { h } from 'vue';
-import { Tag, Switch } from 'ant-design-vue';
-import { useMessage } from '/@/hooks/web/useMessage';
-import { updateTransformScriptStatusApi } from '/@/api/device/TransformScriptApi';
+import { Tag } from 'ant-design-vue';
 export const columns: BasicColumn[] = [
 export const columns: BasicColumn[] = [
   {
   {
     title: '名称',
     title: '名称',
@@ -19,30 +17,7 @@ export const columns: BasicColumn[] = [
     title: '状态',
     title: '状态',
     dataIndex: 'status',
     dataIndex: 'status',
     width: 120,
     width: 120,
-    customRender: ({ record }) => {
-      if (!Reflect.has(record, 'pendingStatus')) {
-        record.pendingStatus = false;
-      }
-      return h(Switch, {
-        checked: record.status === 1,
-        checkedChildren: '已启用',
-        unCheckedChildren: '已禁用',
-        loading: record.pendingStatus,
-        onChange(checked: boolean) {
-          record.pendingStatus = true;
-          const newStatus = checked ? 1 : 0;
-          const { createMessage } = useMessage();
-          updateTransformScriptStatusApi(newStatus, record.id)
-            .then(() => {
-              record.status = newStatus;
-              createMessage.success(`${record.status ? '启用' : '禁用'}成功`);
-            })
-            .finally(() => {
-              record.pendingStatus = false;
-            });
-        },
-      });
-    },
+    slots: { customRender: 'status' },
   },
   },
   {
   {
     title: '创建时间',
     title: '创建时间',

 <template>
 <template>
   <div>
   <div>
-    <BasicTable
-      @selection-change="useSelectionChange"
-      :rowSelection="{ type: 'checkbox' }"
-      @register="registerTable"
-      v-show="isStatus === 0"
-      :clickToRowSelect="false"
-    >
+    <BasicTable @register="registerTable" v-show="isStatus === 0">
       <template #toolbar>
       <template #toolbar>
         <a-button type="primary" @click="handleCreate"> 新增转换脚本 </a-button>
         <a-button type="primary" @click="handleCreate"> 新增转换脚本 </a-button>
-        <a-button color="error" @click="handleDeleteOrBatchDelete(null)" :disabled="disabled">
+        <a-button color="error" @click="handleDeleteOrBatchDelete(null)" :disabled="hasBatchDelete">
           批量删除
           批量删除
         </a-button>
         </a-button>
       </template>
       </template>
+      <template #status="{ record }">
+        <Switch
+          :checked="record.status === 1"
+          :loading="record.pendingStatus"
+          checkedChildren="启用"
+          unCheckedChildren="禁用"
+          @change="(checked:boolean)=>statusChange(checked,record)"
+        />
+      </template>
       <template #action="{ record }">
       <template #action="{ record }">
         <TableAction
         <TableAction
           :actions="[
           :actions="[
@@ -48,6 +51,7 @@
 
 
 <script lang="ts" setup>
 <script lang="ts" setup>
   import { ref } from 'vue';
   import { ref } from 'vue';
+  import { Switch } from 'ant-design-vue';
   import { BasicTable, useTable, TableAction } from '/@/components/Table';
   import { BasicTable, useTable, TableAction } from '/@/components/Table';
   import { columns, searchFormSchema } from './config/config.data';
   import { columns, searchFormSchema } from './config/config.data';
   import { getConvertApi, deleteTransformApi } from '/@/api/device/TransformScriptApi';
   import { getConvertApi, deleteTransformApi } from '/@/api/device/TransformScriptApi';
@@ -55,14 +59,24 @@
   import ScriptDrawer from './cpns/ScriptDrawer.vue';
   import ScriptDrawer from './cpns/ScriptDrawer.vue';
   import TestScript from './cpns/TestScript.vue';
   import TestScript from './cpns/TestScript.vue';
   import { useMessage } from '/@/hooks/web/useMessage';
   import { useMessage } from '/@/hooks/web/useMessage';
+  import { updateTransformScriptStatusApi } from '/@/api/device/TransformScriptApi';
+  import { useBatchDelete } from '/@/hooks/web/useBatchDelete';
 
 
   const handleSuccess = () => {
   const handleSuccess = () => {
     reload();
     reload();
   };
   };
-  const { createMessage } = useMessage();
-  let selectedRowKeys: any = [];
-  const disabled = ref(true);
-  const [registerTable, { reload, getSelectRowKeys, getSelectRows }] = useTable({
+
+  const { hasBatchDelete, handleDeleteOrBatchDelete, selectionOptions, resetSelectedRowKeys } =
+    useBatchDelete(deleteTransformApi, handleSuccess);
+  selectionOptions.rowSelection.getCheckboxProps = (record: Recordable) => {
+    // Demo:status为1的选择框禁用
+    if (record.status === 1) {
+      return { disabled: true };
+    } else {
+      return { disabled: false };
+    }
+  };
+  const [registerTable, { reload, setProps, setSelectedRowKeys }] = useTable({
     api: getConvertApi,
     api: getConvertApi,
     title: '转换脚本列表',
     title: '转换脚本列表',
     columns,
     columns,
@@ -74,6 +88,7 @@
       labelWidth: 100,
       labelWidth: 100,
       schemas: searchFormSchema,
       schemas: searchFormSchema,
     },
     },
+    clickToRowSelect: 'false',
     rowKey: 'id',
     rowKey: 'id',
     actionColumn: {
     actionColumn: {
       width: 180,
       width: 180,
@@ -82,6 +97,7 @@
       slots: { customRender: 'action' },
       slots: { customRender: 'action' },
       fixed: 'right',
       fixed: 'right',
     },
     },
+    ...selectionOptions,
   });
   });
   const [registerDrawer, { openDrawer }] = useDrawer();
   const [registerDrawer, { openDrawer }] = useDrawer();
 
 
@@ -108,39 +124,26 @@
   const handleEdit = (record: Recordable) => {
   const handleEdit = (record: Recordable) => {
     openDrawer(true, { isUpdate: true, record });
     openDrawer(true, { isUpdate: true, record });
   };
   };
-  const useSelectionChange = () => {
-    selectedRowKeys = getSelectRowKeys();
-    if (selectedRowKeys.length > 0) {
-      disabled.value = false;
-    }
-    let getRows = getSelectRows();
-    const isJudge = getRows.map((m) => m.status);
-    if (isJudge.length === 0) {
-      disabled.value = true;
-    }
-    if (isJudge.includes(1)) {
-      disabled.value = true;
-    }
-  };
-  // 删除或批量删除
-  const handleDeleteOrBatchDelete = async (record: Recordable | null) => {
-    if (record) {
-      try {
-        await deleteTransformApi([record.id]);
-        createMessage.success('删除成功');
-        handleSuccess();
-      } catch (e: any) {}
-    } else {
-      try {
-        await deleteTransformApi(selectedRowKeys);
-        createMessage.success('批量删除成功');
-        handleSuccess();
-        selectedRowKeys.length = 0;
-      } catch (e: any) {
-        selectedRowKeys.length = 0;
-      } finally {
-        selectedRowKeys.length = 0;
+  const statusChange = async (checked, record) => {
+    setProps({
+      loading: true,
+    });
+    setSelectedRowKeys([]);
+    resetSelectedRowKeys();
+    const newStatus = checked ? 1 : 0;
+    const { createMessage } = useMessage();
+    try {
+      await updateTransformScriptStatusApi(newStatus, record.id);
+      if (newStatus) {
+        createMessage.success(`启用成功`);
+      } else {
+        createMessage.success('禁用成功');
       }
       }
+    } finally {
+      setProps({
+        loading: false,
+      });
+      reload();
     }
     }
   };
   };
 </script>
 </script>

@@ -112,7 +112,7 @@
         showTableSetting: true,
         showTableSetting: true,
         bordered: true,
         bordered: true,
         actionColumn: {
         actionColumn: {
-          width: 200,
+          width: 240,
           title: '操作',
           title: '操作',
           dataIndex: 'action',
           dataIndex: 'action',
           slots: { customRender: 'action' },
           slots: { customRender: 'action' },