⚡ 批量删除前端.

orion-visor-dependencies/pom.xml

@@ -18,7 +18,7 @@
         <spring.boot.version>2.7.17</spring.boot.version>
         <spring.boot.admin.version>2.7.15</spring.boot.admin.version>
         <flatten.maven.plugin.version>1.5.0</flatten.maven.plugin.version>
-        <orion.kit.revision>1.0.7</orion.kit.revision>
+        <orion.kit.version>1.0.7</orion.kit.version>
         <aspectj.version>1.9.7</aspectj.version>
         <lombok.version>1.18.26</lombok.version>
         <springdoc.version>1.6.15</springdoc.version>
@@ -50,7 +50,7 @@
             <dependency>
                 <groupId>io.github.lijiahangmax</groupId>
                 <artifactId>orion-all</artifactId>
-                <version>${orion.kit.revision}</version>
+                <version>${orion.kit.version}</version>
                 <exclusions>
                     <exclusion>
                         <artifactId>orion-log</artifactId>

orion-visor-ui/src/views/asset/host-identity/components/host-identity-table.vue

@@ -74,19 +74,36 @@
               <icon-plus />
             </template>
           </a-button>
+          <!-- 删除 -->
+          <a-popconfirm :content="`确认删除选中的 ${selectedKeys.length} 条记录吗?`"
+                        position="br"
+                        type="warning"
+                        @ok="deleteSelectRows">
+            <a-button v-permission="['asset:host-identity:delete']"
+                      type="primary"
+                      status="danger"
+                      :disabled="selectedKeys.length === 0">
+              删除
+              <template #icon>
+                <icon-delete />
+              </template>
+            </a-button>
+          </a-popconfirm>
         </a-space>
       </div>
     </template>
     <!-- table -->
-    <a-table row-key="id"
+    <a-table v-model:selected-keys="selectedKeys"
+             row-key="id"
              ref="tableRef"
              :loading="loading"
              :columns="columns"
+             :row-selection="rowSelection"
              :data="tableRenderData"
              :pagination="pagination"
+             :bordered="false"
              @page-change="(page) => fetchTableData(page, pagination.pageSize)"
-             @page-size-change="(size) => fetchTableData(1, size)"
-             :bordered="false">
+             @page-size-change="(size) => fetchTableData(1, size)">
       <!-- 类型 -->
       <template #type="{ record }">
         <a-tag :color="getDictValue(identityTypeKey, record.type, 'color')">
@@ -159,14 +176,14 @@
 <script lang="ts" setup>
   import type { HostIdentityQueryRequest, HostIdentityQueryResponse } from '@/api/asset/host-identity';
   import { reactive, ref, onMounted } from 'vue';
-  import { deleteHostIdentity, getHostIdentityPage } from '@/api/asset/host-identity';
+  import { deleteHostIdentity, batchDeleteHostIdentity, getHostIdentityPage } from '@/api/asset/host-identity';
   import { Message } from '@arco-design/web-vue';
   import columns from '../types/table.columns';
   import useLoading from '@/hooks/loading';
   import usePermission from '@/hooks/permission';
   import { copy } from '@/hooks/copy';
   import { useDictStore } from '@/store';
-  import { usePagination } from '@/types/table';
+  import { usePagination, useRowSelection } from '@/types/table';
   import { GrantKey, GrantRouteName } from '@/views/asset/grant/types/const';
   import { IdentityType, identityTypeKey } from '../types/const';
   import HostKeySelector from '@/components/asset/host-key/selector/index.vue';
@@ -174,10 +191,12 @@
   const emits = defineEmits(['openAdd', 'openUpdate', 'openKeyView']);
 
   const pagination = usePagination();
+  const rowSelection = useRowSelection();
   const { toOptions, getDictValue } = useDictStore();
   const { loading, setLoading } = useLoading();
   const { hasAnyPermission } = usePermission();
 
+  const selectedKeys = ref<number[]>([]);
   const tableRenderData = ref<HostIdentityQueryResponse[]>([]);
   const formModel = reactive<HostIdentityQueryRequest>({
     id: undefined,
@@ -204,6 +223,22 @@
     }
   };
 
+  // 删除选中行
+  const deleteSelectRows = async () => {
+    try {
+      setLoading(true);
+      // 调用删除接口
+      await batchDeleteHostIdentity(selectedKeys.value);
+      Message.success(`成功删除 ${selectedKeys.value.length} 条数据`);
+      selectedKeys.value = [];
+      // 重新加载数据
+      fetchTableData();
+    } catch (e) {
+    } finally {
+      setLoading(false);
+    }
+  };
+
   // 添加后回调
   const addedCallback = () => {
     fetchTableData();
@@ -227,6 +262,7 @@
       pagination.total = data.total;
       pagination.current = request.page;
       pagination.pageSize = request.limit;
+      selectedKeys.value = [];
     } catch (e) {
     } finally {
       setLoading(false);

orion-visor-ui/src/views/asset/host-key/components/host-key-table.vue

@@ -59,19 +59,36 @@
               <icon-plus />
             </template>
           </a-button>
+          <!-- 删除 -->
+          <a-popconfirm :content="`确认删除选中的 ${selectedKeys.length} 条记录吗?`"
+                        position="br"
+                        type="warning"
+                        @ok="deleteSelectRows">
+            <a-button v-permission="['asset:host-key:delete']"
+                      type="primary"
+                      status="danger"
+                      :disabled="selectedKeys.length === 0">
+              删除
+              <template #icon>
+                <icon-delete />
+              </template>
+            </a-button>
+          </a-popconfirm>
         </a-space>
       </div>
     </template>
     <!-- table -->
-    <a-table row-key="id"
+    <a-table v-model:selected-keys="selectedKeys"
+             row-key="id"
              ref="tableRef"
              :loading="loading"
              :columns="columns"
+             :row-selection="rowSelection"
              :data="tableRenderData"
              :pagination="pagination"
+             :bordered="false"
              @page-change="(page) => fetchTableData(page, pagination.pageSize)"
-             @page-size-change="(size) => fetchTableData(1, size)"
-             :bordered="false">
+             @page-size-change="(size) => fetchTableData(1, size)">
       <!-- 操作 -->
       <template #handle="{ record }">
         <div class="table-handle-wrapper">
@@ -116,20 +133,21 @@
 <script lang="ts" setup>
   import type { HostKeyQueryRequest, HostKeyQueryResponse } from '@/api/asset/host-key';
   import { reactive, ref, onMounted } from 'vue';
-  import { deleteHostKey, getHostKeyPage } from '@/api/asset/host-key';
+  import { deleteHostKey, batchDeleteHostKey, getHostKeyPage } from '@/api/asset/host-key';
   import { Message } from '@arco-design/web-vue';
   import useLoading from '@/hooks/loading';
   import columns from '../types/table.columns';
-  import { usePagination } from '@/types/table';
+  import { usePagination, useRowSelection } from '@/types/table';
   import { GrantKey, GrantRouteName } from '@/views/asset/grant/types/const';
 
   const emits = defineEmits(['openAdd', 'openUpdate', 'openView']);
 
-  const tableRenderData = ref<HostKeyQueryResponse[]>([]);
-
   const pagination = usePagination();
+  const rowSelection = useRowSelection();
   const { loading, setLoading } = useLoading();
 
+  const selectedKeys = ref<number[]>([]);
+  const tableRenderData = ref<HostKeyQueryResponse[]>([]);
   const formModel = reactive<HostKeyQueryRequest>({
     id: undefined,
     name: undefined,
@@ -154,6 +172,22 @@
     }
   };
 
+  // 删除选中行
+  const deleteSelectRows = async () => {
+    try {
+      setLoading(true);
+      // 调用删除接口
+      await batchDeleteHostKey(selectedKeys.value);
+      Message.success(`成功删除 ${selectedKeys.value.length} 条数据`);
+      selectedKeys.value = [];
+      // 重新加载数据
+      fetchTableData();
+    } catch (e) {
+    } finally {
+      setLoading(false);
+    }
+  };
+
   // 添加后回调
   const addedCallback = () => {
     fetchTableData();
@@ -177,6 +211,7 @@
       pagination.total = data.total;
       pagination.current = request.page;
       pagination.pageSize = request.limit;
+      selectedKeys.value = [];
     } catch (e) {
     } finally {
       setLoading(false);

orion-visor-ui/src/views/asset/host-list/components/host-table.vue

@@ -85,19 +85,36 @@
               <icon-plus />
             </template>
           </a-button>
+          <!-- 删除 -->
+          <a-popconfirm :content="`确认删除选中的 ${selectedKeys.length} 条记录吗?`"
+                        position="br"
+                        type="warning"
+                        @ok="deleteSelectRows">
+            <a-button v-permission="['asset:host:delete']"
+                      type="primary"
+                      status="danger"
+                      :disabled="selectedKeys.length === 0">
+              删除
+              <template #icon>
+                <icon-delete />
+              </template>
+            </a-button>
+          </a-popconfirm>
         </a-space>
       </div>
     </template>
     <!-- table -->
-    <a-table row-key="id"
+    <a-table v-model:selected-keys="selectedKeys"
+             row-key="id"
              ref="tableRef"
              :loading="loading"
              :columns="columns"
+             :row-selection="rowSelection"
              :data="tableRenderData"
              :pagination="pagination"
+             :bordered="false"
              @page-change="(page) => fetchTableData(page, pagination.pageSize)"
-             @page-size-change="(size) => fetchTableData(1, size)"
-             :bordered="false">
+             @page-size-change="(size) => fetchTableData(1, size)">
       <!-- 编码 -->
       <template #code="{ record }">
         <a-tag>{{ record.code }}</a-tag>
@@ -166,10 +183,10 @@
 <script lang="ts" setup>
   import type { HostQueryRequest, HostQueryResponse } from '@/api/asset/host';
   import { reactive, ref, onMounted } from 'vue';
-  import { deleteHost, getHostPage } from '@/api/asset/host';
+  import { deleteHost, batchDeleteHost, getHostPage } from '@/api/asset/host';
   import { Message } from '@arco-design/web-vue';
   import { tagColor } from '../types/const';
-  import { usePagination } from '@/types/table';
+  import { usePagination, useRowSelection } from '@/types/table';
   import useLoading from '@/hooks/loading';
   import { copy } from '@/hooks/copy';
   import columns from '../types/table.columns';
@@ -177,13 +194,15 @@
   import { GrantKey, GrantRouteName } from '@/views/asset/grant/types/const';
   import TagMultiSelector from '@/components/meta/tag/multi-selector/index.vue';
 
-  const tagSelector = ref();
-  const tableRenderData = ref<HostQueryResponse[]>([]);
-  const { loading, setLoading } = useLoading();
   const emits = defineEmits(['openAdd', 'openUpdate', 'openUpdateConfig', 'openHostGroup']);
 
   const pagination = usePagination();
+  const rowSelection = useRowSelection();
+  const { loading, setLoading } = useLoading();
 
+  const tagSelector = ref();
+  const selectedKeys = ref<number[]>([]);
+  const tableRenderData = ref<HostQueryResponse[]>([]);
   const formModel = reactive<HostQueryRequest>({
     id: undefined,
     name: undefined,
@@ -210,6 +229,22 @@
     }
   };
 
+  // 删除选中行
+  const deleteSelectRows = async () => {
+    try {
+      setLoading(true);
+      // 调用删除接口
+      await batchDeleteHost(selectedKeys.value);
+      Message.success(`成功删除 ${selectedKeys.value.length} 条数据`);
+      selectedKeys.value = [];
+      // 重新加载数据
+      fetchTableData();
+    } catch (e) {
+    } finally {
+      setLoading(false);
+    }
+  };
+
   // 添加后回调
   const addedCallback = () => {
     fetchTableData();
@@ -233,6 +268,7 @@
       pagination.total = data.total;
       pagination.current = request.page;
       pagination.pageSize = request.limit;
+      selectedKeys.value = [];
     } catch (e) {
     } finally {
       setLoading(false);

orion-visor-ui/src/views/exec/exec-template/components/exec-template-table.vue

@@ -49,19 +49,36 @@
               <icon-plus />
             </template>
           </a-button>
+          <!-- 删除 -->
+          <a-popconfirm :content="`确认删除选中的 ${selectedKeys.length} 条记录吗?`"
+                        position="br"
+                        type="warning"
+                        @ok="deleteSelectRows">
+            <a-button v-permission="['asset:exec-template:delete']"
+                      type="primary"
+                      status="danger"
+                      :disabled="selectedKeys.length === 0">
+              删除
+              <template #icon>
+                <icon-delete />
+              </template>
+            </a-button>
+          </a-popconfirm>
         </a-space>
       </div>
     </template>
     <!-- table -->
-    <a-table row-key="id"
+    <a-table v-model:selected-keys="selectedKeys"
+             row-key="id"
              ref="tableRef"
              :loading="loading"
              :columns="columns"
+             :row-selection="rowSelection"
              :data="tableRenderData"
              :pagination="pagination"
+             :bordered="false"
              @page-change="(page) => fetchTableData(page, pagination.pageSize)"
-             @page-size-change="(size) => fetchTableData(1, size)"
-             :bordered="false">
+             @page-size-change="(size) => fetchTableData(1, size)">
       <!-- 模板命令 -->
       <template #command="{ record }">
         <span class="copy-left" @click="copy(record.command, '已复制')">
@@ -112,18 +129,20 @@
 <script lang="ts" setup>
   import type { ExecTemplateQueryRequest, ExecTemplateQueryResponse } from '@/api/exec/exec-template';
   import { reactive, ref, onMounted } from 'vue';
-  import { deleteExecTemplate, getExecTemplatePage } from '@/api/exec/exec-template';
+  import { deleteExecTemplate, batchDeleteExecTemplate, getExecTemplatePage } from '@/api/exec/exec-template';
   import { Message } from '@arco-design/web-vue';
   import useLoading from '@/hooks/loading';
   import columns from '../types/table.columns';
-  import { usePagination } from '@/types/table';
+  import { usePagination, useRowSelection } from '@/types/table';
   import { copy } from '@/hooks/copy';
 
   const emits = defineEmits(['openAdd', 'openUpdate', 'openExec']);
 
   const pagination = usePagination();
+  const rowSelection = useRowSelection();
   const { loading, setLoading } = useLoading();
 
+  const selectedKeys = ref<number[]>([]);
   const tableRenderData = ref<ExecTemplateQueryResponse[]>([]);
   const formModel = reactive<ExecTemplateQueryRequest>({
     id: undefined,
@@ -148,6 +167,22 @@
     }
   };
 
+  // 删除选中行
+  const deleteSelectRows = async () => {
+    try {
+      setLoading(true);
+      // 调用删除接口
+      await batchDeleteExecTemplate(selectedKeys.value);
+      Message.success(`成功删除 ${selectedKeys.value.length} 条数据`);
+      selectedKeys.value = [];
+      // 重新加载数据
+      fetchTableData();
+    } catch (e) {
+    } finally {
+      setLoading(false);
+    }
+  };
+
   // 添加后回调
   const addedCallback = () => {
     fetchTableData();
@@ -171,6 +206,7 @@
       pagination.total = data.total;
       pagination.current = request.page;
       pagination.pageSize = request.limit;
+      selectedKeys.value = [];
     } catch (e) {
     } finally {
       setLoading(false);

orion-visor-ui/src/views/job/exec-job/components/exec-job-table.vue

@@ -56,14 +56,31 @@
               <icon-plus />
             </template>
           </a-button>
+          <!-- 删除 -->
+          <a-popconfirm :content="`确认删除选中的 ${selectedKeys.length} 条记录吗?`"
+                        position="br"
+                        type="warning"
+                        @ok="deleteSelectRows">
+            <a-button v-permission="['asset:exec-job:delete']"
+                      type="primary"
+                      status="danger"
+                      :disabled="selectedKeys.length === 0">
+              删除
+              <template #icon>
+                <icon-delete />
+              </template>
+            </a-button>
+          </a-popconfirm>
         </a-space>
       </div>
     </template>
     <!-- table -->
-    <a-table row-key="id"
+    <a-table v-model:selected-keys="selectedKeys"
+             row-key="id"
              ref="tableRef"
              :loading="loading"
              :columns="columns"
+             :row-selection="rowSelection"
              :data="tableRenderData"
              :pagination="pagination"
              :bordered="false"
@@ -174,13 +191,13 @@
 <script lang="ts" setup>
   import type { ExecJobQueryRequest, ExecJobQueryResponse } from '@/api/job/exec-job';
   import { reactive, ref, onMounted } from 'vue';
-  import { deleteExecJob, getExecJobPage, triggerExecJob, updateExecJobStatus } from '@/api/job/exec-job';
+  import { deleteExecJob, batchDeleteExecJob, getExecJobPage, triggerExecJob, updateExecJobStatus } from '@/api/job/exec-job';
   import { Message } from '@arco-design/web-vue';
   import usePermission from '@/hooks/permission';
   import useLoading from '@/hooks/loading';
   import columns from '../types/table.columns';
   import { ExecJobStatus, execJobStatusKey, execStatusKey } from '../types/const';
-  import { usePagination } from '@/types/table';
+  import { usePagination, useRowSelection } from '@/types/table';
   import { useDictStore } from '@/store';
   import { copy } from '@/hooks/copy';
   import { dateFormat } from '@/utils';
@@ -188,10 +205,12 @@
   const emits = defineEmits(['openAdd', 'openUpdate', 'openDetail', 'testCron']);
 
   const pagination = usePagination();
+  const rowSelection = useRowSelection();
   const { loading, setLoading } = useLoading();
   const { hasPermission } = usePermission();
   const { toOptions, getDictValue } = useDictStore();
 
+  const selectedKeys = ref<number[]>([]);
   const tableRenderData = ref<ExecJobQueryResponse[]>([]);
   const formModel = reactive<ExecJobQueryRequest>({
     id: undefined,
@@ -218,6 +237,22 @@
     }
   };
 
+  // 删除选中行
+  const deleteSelectRows = async () => {
+    try {
+      setLoading(true);
+      // 调用删除接口
+      await batchDeleteExecJob(selectedKeys.value);
+      Message.success(`成功删除 ${selectedKeys.value.length} 条数据`);
+      selectedKeys.value = [];
+      // 重新加载数据
+      fetchTableData();
+    } catch (e) {
+    } finally {
+      setLoading(false);
+    }
+  };
+
   // 添加后回调
   const addedCallback = () => {
     fetchTableData();
@@ -265,6 +300,7 @@
       pagination.total = data.total;
       pagination.current = request.page;
       pagination.pageSize = request.limit;
+      selectedKeys.value = [];
     } catch (e) {
     } finally {
       setLoading(false);

orion-visor-ui/src/views/user/user/components/user-table.vue

@@ -60,19 +60,36 @@
               <icon-plus />
             </template>
           </a-button>
+          <!-- 删除 -->
+          <a-popconfirm :content="`确认删除选中的 ${selectedKeys.length} 条记录吗?`"
+                        position="br"
+                        type="warning"
+                        @ok="deleteSelectRows">
+            <a-button v-permission="['infra:system-user:delete']"
+                      type="primary"
+                      status="danger"
+                      :disabled="selectedKeys.length === 0">
+              删除
+              <template #icon>
+                <icon-delete />
+              </template>
+            </a-button>
+          </a-popconfirm>
         </a-space>
       </div>
     </template>
     <!-- table -->
-    <a-table row-key="id"
+    <a-table v-model:selected-keys="selectedKeys"
+             row-key="id"
              ref="tableRef"
              :loading="loading"
              :columns="columns"
+             :row-selection="rowSelection"
              :data="tableRenderData"
              :pagination="pagination"
+             :bordered="false"
              @page-change="(page) => fetchTableData(page, pagination.pageSize)"
-             @page-size-change="(size) => fetchTableData(1, size)"
-             :bordered="false">
+             @page-size-change="(size) => fetchTableData(1, size)">
       <!-- 用户名 -->
       <template #username="{ record }">
         <span class="text-copy" @click="copy(record.username)">
@@ -158,12 +175,12 @@
 <script lang="ts" setup>
   import type { UserQueryRequest, UserQueryResponse } from '@/api/user/user';
   import { reactive, ref, onMounted } from 'vue';
-  import { deleteUser, getUserPage, updateUserStatus } from '@/api/user/user';
+  import { batchDeleteUser, deleteUser, getUserPage, updateUserStatus } from '@/api/user/user';
   import { Message } from '@arco-design/web-vue';
   import columns from '../types/table.columns';
   import { userStatusKey, UserStatus } from '../types/const';
   import useLoading from '@/hooks/loading';
-  import { usePagination } from '@/types/table';
+  import { usePagination, useRowSelection } from '@/types/table';
   import usePermission from '@/hooks/permission';
   import { useRouter } from 'vue-router';
   import { useDictStore, useUserStore } from '@/store';
@@ -171,13 +188,16 @@
 
   const emits = defineEmits(['openAdd', 'openUpdate', 'openResetPassword', 'openGrantRole']);
 
-  const tableRenderData = ref<UserQueryResponse[]>([]);
-
   const pagination = usePagination();
+  const rowSelection = useRowSelection();
   const { hasPermission } = usePermission();
   const { loading, setLoading } = useLoading();
   const { toOptions, getDictValue } = useDictStore();
+  const router = useRouter();
+  const userStore = useUserStore();
 
+  const selectedKeys = ref<number[]>([]);
+  const tableRenderData = ref<UserQueryResponse[]>([]);
   const formModel = reactive<UserQueryRequest>({
     id: undefined,
     username: undefined,
@@ -190,9 +210,6 @@
     lastLoginTime: undefined,
   });
 
-  const router = useRouter();
-  const userStore = useUserStore();
-
   // 删除当前行
   const deleteRow = async ({ id }: {
     id: number
@@ -210,6 +227,22 @@
     }
   };
 
+  // 删除选中行
+  const deleteSelectRows = async () => {
+    try {
+      setLoading(true);
+      // 调用删除接口
+      await batchDeleteUser(selectedKeys.value);
+      Message.success(`成功删除 ${selectedKeys.value.length} 条数据`);
+      selectedKeys.value = [];
+      // 重新加载数据
+      fetchTableData();
+    } catch (e) {
+    } finally {
+      setLoading(false);
+    }
+  };
+
   // 更新状态
   const updateStatus = (id: number, status: number) => {
     return updateUserStatus({
@@ -250,6 +283,7 @@
       pagination.total = data.total;
       pagination.current = request.page;
       pagination.pageSize = request.limit;
+      selectedKeys.value = [];
     } catch (e) {
     } finally {
       setLoading(false);