From 9d06991609d61fa4041d359d2410cbd83918991f Mon Sep 17 00:00:00 2001
From: bunny <1319900154@qq.com>
Date: Tue, 15 Oct 2024 16:52:03 +0800
Subject: [PATCH] =?UTF-8?q?page:=20=F0=9F=93=84=20=E5=88=9B=E5=BB=BA?=
 =?UTF-8?q?=E4=BB=BB=E5=8A=A1=E8=B0=83=E5=BA=A6=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/store/monitor/schedulers.ts               |  2 ++
 src/views/monitor/schedulers/index.vue        | 23 ++++++++++++--
 .../monitor/schedulers/schedulers-dialog.vue  | 15 ++++------
 src/views/monitor/schedulers/utils/columns.ts | 23 +++++++-------
 src/views/monitor/schedulers/utils/hooks.ts   | 30 +++++++++++++++----
 src/views/monitor/schedulers/utils/types.ts   |  6 ++--
 6 files changed, 66 insertions(+), 33 deletions(-)

diff --git a/src/store/monitor/schedulers.ts b/src/store/monitor/schedulers.ts
index 911d964..1961894 100644
--- a/src/store/monitor/schedulers.ts
+++ b/src/store/monitor/schedulers.ts
@@ -26,6 +26,8 @@ export const useSchedulersStore = defineStore('schedulersStore', {
 				triggerName: undefined,
 				// triggerState触发器状态
 				triggerState: undefined,
+				// 执行方法
+				jobMethodName: undefined,
 			},
 			// 分页查询结果
 			pagination: {
diff --git a/src/views/monitor/schedulers/index.vue b/src/views/monitor/schedulers/index.vue
index 75434cd..9a0d45e 100644
--- a/src/views/monitor/schedulers/index.vue
+++ b/src/views/monitor/schedulers/index.vue
@@ -4,7 +4,7 @@ import { columns } from '@/views/monitor/schedulers/utils/columns';
 import PureTableBar from '@/components/TableBar/src/bar';
 import AddFill from '@iconify-icons/ri/add-circle-line';
 import PureTable from '@pureadmin/table';
-import { onAdd, onDelete, onSearch, onUpdate } from '@/views/monitor/schedulers/utils/hooks';
+import { deleteIds, onAdd, onDelete, onDeleteBatch, onSearch, onUpdate } from '@/views/monitor/schedulers/utils/hooks';
 import Delete from '@iconify-icons/ep/delete';
 import EditPen from '@iconify-icons/ep/edit-pen';
 import Refresh from '@iconify-icons/ep/refresh';
@@ -35,6 +35,14 @@ const onPageSizeChange = async (value: number) => {
 	await onSearch();
 };
 
+/**
+ * * 选择多行
+ * @param rows
+ */
+const onSelectionChange = (rows: Array<any>) => {
+	deleteIds.value = rows.map((row: any) => row.id);
+};
+
 /**
  * 重置表单
  * @param formEl
@@ -59,8 +67,8 @@ onMounted(() => {
 			<el-form-item :label="$t('schedulers_jobGroup')" prop="jobGroup">
 				<el-input v-model="schedulersStore.form.jobGroup" :placeholder="`${$t('input')}${$t('schedulers_jobGroup')}`" class="!w-[180px]" clearable />
 			</el-form-item>
-			<el-form-item :label="$t('description')" prop="description">
-				<el-input v-model="schedulersStore.form.description" :placeholder="`${$t('input')}${$t('description')}`" class="!w-[180px]" clearable />
+			<el-form-item :label="$t('schedulers_description')" prop="description">
+				<el-input v-model="schedulersStore.form.description" :placeholder="`${$t('input')}${$t('schedulers_description')}`" class="!w-[180px]" clearable />
 			</el-form-item>
 			<el-form-item :label="$t('schedulers_jobClassName')" prop="jobClassName">
 				<el-input v-model="schedulersStore.form.jobClassName" :placeholder="`${$t('input')}${$t('schedulers_jobClassName')}`" class="!w-[180px]" clearable />
@@ -71,6 +79,9 @@ onMounted(() => {
 			<el-form-item :label="$t('schedulers_triggerState')" prop="triggerState">
 				<el-input v-model="schedulersStore.form.triggerState" :placeholder="`${$t('input')}${$t('schedulers_triggerState')}`" class="!w-[180px]" clearable />
 			</el-form-item>
+			<el-form-item :label="$t('schedulers_jobMethodName')" prop="jobMethodName">
+				<el-input v-model="schedulersStore.form.jobMethodName" :placeholder="`${$t('input')}${$t('schedulers_jobMethodName')}`" class="!w-[180px]" clearable />
+			</el-form-item>
 			<el-form-item>
 				<el-button :icon="useRenderIcon('ri:search-line')" :loading="schedulersStore.loading" type="primary" @click="onSearch"> {{ $t('search') }} </el-button>
 				<el-button :icon="useRenderIcon(Refresh)" @click="resetForm(formRef)"> {{ $t('buttons.reset') }}</el-button>
@@ -80,6 +91,11 @@ onMounted(() => {
 		<PureTableBar :columns="columns" title="Schedulers视图" @fullscreen="tableRef.setAdaptive()" @refresh="onSearch">
 			<template #buttons>
 				<el-button :icon="useRenderIcon(AddFill)" type="primary" @click="onAdd"> {{ $t('add_new') }}</el-button>
+
+				<!-- 批量删除按钮 -->
+				<el-button v-show="deleteIds.length > 0" :icon="useRenderIcon(Delete)" type="danger" @click="onDeleteBatch">
+					{{ $t('delete_batches') }}
+				</el-button>
 			</template>
 
 			<template v-slot="{ size, dynamicColumns }">
@@ -100,6 +116,7 @@ onMounted(() => {
 					showOverflowTooltip
 					table-layout="auto"
 					@page-size-change="onPageSizeChange"
+					@selection-change="onSelectionChange"
 					@page-current-change="onCurrentPageChange"
 				>
 					<template #createUser="{ row }">
diff --git a/src/views/monitor/schedulers/schedulers-dialog.vue b/src/views/monitor/schedulers/schedulers-dialog.vue
index 9826aa1..aaa2615 100644
--- a/src/views/monitor/schedulers/schedulers-dialog.vue
+++ b/src/views/monitor/schedulers/schedulers-dialog.vue
@@ -17,10 +17,8 @@ const props = withDefaults(defineProps<FormProps>(), {
 		jobClassName: undefined,
 		// corn表达式
 		cronExpression: undefined,
-		// 触发器名称
-		triggerName: undefined,
-		// triggerState触发器状态
-		triggerState: undefined,
+		// 执行方法
+		jobMethodName: undefined,
 	}),
 });
 
@@ -38,7 +36,7 @@ defineExpose({ formRef });
 		<el-form-item :label="$t('schedulers_jobGroup')" prop="jobGroup">
 			<el-input v-model="form.jobGroup" autocomplete="off" type="text" />
 		</el-form-item>
-		<el-form-item :label="$t('description')" prop="description">
+		<el-form-item :label="$t('schedulers_description')" prop="description">
 			<el-input v-model="form.description" autocomplete="off" type="text" />
 		</el-form-item>
 		<el-form-item :label="$t('schedulers_jobClassName')" prop="jobClassName">
@@ -47,11 +45,8 @@ defineExpose({ formRef });
 		<el-form-item :label="$t('schedulers_cronExpression')" prop="cronExpression">
 			<el-input v-model="form.cronExpression" autocomplete="off" type="text" />
 		</el-form-item>
-		<el-form-item :label="$t('schedulers_triggerName')" prop="triggerName">
-			<el-input v-model="form.triggerName" autocomplete="off" type="text" />
-		</el-form-item>
-		<el-form-item :label="$t('schedulers_triggerState')" prop="triggerState">
-			<el-input v-model="form.triggerState" autocomplete="off" type="text" />
+		<el-form-item :label="$t('schedulers_jobMethodName')" prop="jobMethodName">
+			<el-input v-model="form.jobMethodName" autocomplete="off" type="text" />
 		</el-form-item>
 	</el-form>
 </template>
diff --git a/src/views/monitor/schedulers/utils/columns.ts b/src/views/monitor/schedulers/utils/columns.ts
index c1fb22f..68bd8df 100644
--- a/src/views/monitor/schedulers/utils/columns.ts
+++ b/src/views/monitor/schedulers/utils/columns.ts
@@ -3,22 +3,25 @@ import { $t } from '@/plugins/i18n';
 
 // 表格列
 export const columns: TableColumnList = [
+	{ type: 'selection', align: 'left' },
 	{ type: 'index', index: (index: number) => index + 1, label: '序号', width: 60 },
+	{ label: $t('id'), prop: 'id' },
 	// 任务名称
 	{ label: $t('schedulers_jobName'), prop: 'jobName' },
 	// 任务分组
 	{ label: $t('schedulers_jobGroup'), prop: 'jobGroup' },
 	// 任务详情
-	{ label: $t('description'), prop: 'description' },
+	{ label: $t('schedulers_description'), prop: 'description' },
 	// 任务类名称
 	{ label: $t('schedulers_jobClassName'), prop: 'jobClassName' },
 	// corn表达式
 	{ label: $t('schedulers_cronExpression'), prop: 'cronExpression' },
-	// 触发器名称
-	{ label: $t('schedulers_triggerName'), prop: 'triggerName' },
-	// triggerState触发器状态
-	{ label: $t('schedulers_triggerState'), prop: 'triggerState' },
-	// 操作
+	// 执行方法
+	{ label: $t('schedulers_jobMethodName'), prop: 'jobMethodName' },
+	{ label: $t('table.updateTime'), prop: 'updateTime', sortable: true, width: 160 },
+	{ label: $t('table.createTime'), prop: 'createTime', sortable: true, width: 160 },
+	{ label: $t('table.createUser'), prop: 'createUser', slot: 'createUser', width: 90 },
+	{ label: $t('table.updateUser'), prop: 'updateUser', slot: 'updateUser', width: 90 },
 	{ label: $t('table.operation'), fixed: 'right', width: 210, slot: 'operation' },
 ];
 
@@ -29,13 +32,11 @@ export const rules = reactive({
 	// 任务分组
 	jobGroup: [{ required: true, message: `${$t('input')}${$t('schedulers_jobGroup')}`, trigger: 'blur' }],
 	// 任务详情
-	description: [{ required: true, message: `${$t('input')}${$t('description')}`, trigger: 'blur' }],
+	description: [{ required: true, message: `${$t('input')}${$t('schedulers_description')}`, trigger: 'blur' }],
 	// 任务类名称
 	jobClassName: [{ required: true, message: `${$t('input')}${$t('schedulers_jobClassName')}`, trigger: 'blur' }],
 	// corn表达式
 	cronExpression: [{ required: true, message: `${$t('input')}${$t('schedulers_cronExpression')}`, trigger: 'blur' }],
-	// 触发器名称
-	triggerName: [{ required: true, message: `${$t('input')}${$t('schedulers_triggerName')}`, trigger: 'blur' }],
-	// triggerState触发器状态
-	triggerState: [{ required: true, message: `${$t('input')}${$t('schedulers_triggerState')}`, trigger: 'blur' }],
+	// 执行方法
+	jobMethodName: [{ required: true, message: `${$t('input')}${$t('schedulers_jobMethodName')}`, trigger: 'blur' }],
 });
diff --git a/src/views/monitor/schedulers/utils/hooks.ts b/src/views/monitor/schedulers/utils/hooks.ts
index 0043503..d566009 100644
--- a/src/views/monitor/schedulers/utils/hooks.ts
+++ b/src/views/monitor/schedulers/utils/hooks.ts
@@ -1,12 +1,14 @@
 import { addDialog } from '@/components/BaseDialog/index';
 import SchedulersDialog from '@/views/monitor/schedulers/schedulers-dialog.vue';
-import { useSchedulersStore } from '@/store/monitor/schedulers.ts';
+import { useSchedulersStore } from '@/store/monitor/schedulers';
 import { h, ref } from 'vue';
 import { messageBox } from '@/utils/message';
 import type { FormItemProps } from '@/views/monitor/schedulers/utils/types';
 import { $t } from '@/plugins/i18n';
 
 export const formRef = ref();
+// 删除ids
+export const deleteIds = ref([]);
 const schedulersStore = useSchedulersStore();
 
 /**
@@ -32,8 +34,7 @@ export function onAdd() {
 				description: undefined,
 				jobClassName: undefined,
 				cronExpression: undefined,
-				triggerName: undefined,
-				triggerState: undefined,
+				jobMethodName: undefined,
 			},
 		},
 		draggable: true,
@@ -69,8 +70,7 @@ export function onUpdate(row: any) {
 				description: row.description,
 				jobClassName: row.jobClassName,
 				cronExpression: row.cronExpression,
-				triggerName: row.triggerName,
-				triggerState: row.triggerState,
+				jobMethodName: row.jobMethodName,
 			},
 		},
 		draggable: true,
@@ -110,3 +110,23 @@ export const onDelete = async (row: any) => {
 	await schedulersStore.deleteSchedulers([id]);
 	await onSearch();
 };
+
+/**
+ * 批量删除
+ */
+export const onDeleteBatch = async () => {
+	const ids = deleteIds.value;
+
+	// 是否确认删除
+	const result = await messageBox({
+		title: $t('confirm_delete'),
+		showMessage: false,
+		confirmMessage: undefined,
+		cancelMessage: $t('cancel_delete'),
+	});
+	if (!result) return;
+
+	// 删除数据
+	await schedulersStore.deleteSchedulers(ids);
+	await onSearch();
+};
diff --git a/src/views/monitor/schedulers/utils/types.ts b/src/views/monitor/schedulers/utils/types.ts
index b50d43b..a808b66 100644
--- a/src/views/monitor/schedulers/utils/types.ts
+++ b/src/views/monitor/schedulers/utils/types.ts
@@ -10,10 +10,8 @@ export interface FormItemProps {
 	jobClassName: string;
 	// corn表达式
 	cronExpression: string;
-	// 触发器名称
-	triggerName: string;
-	// triggerState触发器状态
-	triggerState: string;
+	// 执行方法
+	jobMethodName: string;
 }
 
 // 添加或修改表单Props