|
1 | 1 | <template>
|
2 |
| - <ContentWrap> |
3 |
| - <!-- 列表 --> |
4 |
| - <XTable @register="registerTable"> |
5 |
| - <template #toolbar_buttons> |
6 |
| - <XButton |
7 |
| - type="warning" |
8 |
| - preIcon="ep:download" |
9 |
| - :title="t('action.export')" |
10 |
| - v-hasPermi="['infra:job:export']" |
11 |
| - @click="exportList('定时任务详情.xls')" |
| 2 | + <content-wrap> |
| 3 | + <!-- 搜索栏 --> |
| 4 | + <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="120px"> |
| 5 | + <el-form-item label="处理器的名字" prop="handlerName"> |
| 6 | + <el-input |
| 7 | + v-model="queryParams.handlerName" |
| 8 | + placeholder="请输入处理器的名字" |
| 9 | + clearable |
| 10 | + @keyup.enter="handleQuery" |
| 11 | + /> |
| 12 | + </el-form-item> |
| 13 | + <el-form-item label="开始执行时间" prop="beginTime"> |
| 14 | + <el-date-picker |
| 15 | + clearable |
| 16 | + v-model="queryParams.beginTime" |
| 17 | + type="date" |
| 18 | + value-format="YYYY-MM-DD" |
| 19 | + placeholder="选择开始执行时间" |
12 | 20 | />
|
13 |
| - </template> |
14 |
| - <template #beginTime_default="{ row }"> |
15 |
| - <span>{{ parseTime(row.beginTime) + ' ~ ' + parseTime(row.endTime) }}</span> |
16 |
| - </template> |
17 |
| - <template #duration_default="{ row }"> |
18 |
| - <span>{{ row.duration + ' 毫秒' }}</span> |
19 |
| - </template> |
20 |
| - <template #actionbtns_default="{ row }"> |
21 |
| - <XTextButton |
22 |
| - preIcon="ep:view" |
23 |
| - :title="t('action.detail')" |
24 |
| - v-hasPermi="['infra:job:query']" |
25 |
| - @click="handleDetail(row)" |
| 21 | + </el-form-item> |
| 22 | + <el-form-item label="结束执行时间" prop="endTime"> |
| 23 | + <el-date-picker |
| 24 | + clearable |
| 25 | + v-model="queryParams.endTime" |
| 26 | + type="date" |
| 27 | + value-format="YYYY-MM-DD" |
| 28 | + placeholder="选择结束执行时间" |
26 | 29 | />
|
27 |
| - </template> |
28 |
| - </XTable> |
29 |
| - </ContentWrap> |
30 |
| - <XModal v-model="dialogVisible" :title="dialogTitle"> |
31 |
| - <!-- 对话框(详情) --> |
32 |
| - <Descriptions :schema="allSchemas.detailSchema" :data="detailData"> |
33 |
| - <template #retryInterval="{ row }"> |
34 |
| - <span>{{ row.retryInterval + '毫秒' }} </span> |
35 |
| - </template> |
36 |
| - <template #monitorTimeout="{ row }"> |
37 |
| - <span>{{ row.monitorTimeout > 0 ? row.monitorTimeout + ' 毫秒' : '未开启' }}</span> |
38 |
| - </template> |
39 |
| - </Descriptions> |
40 |
| - <!-- 操作按钮 --> |
41 |
| - <template #footer> |
42 |
| - <XButton :title="t('dialog.close')" @click="dialogVisible = false" /> |
43 |
| - </template> |
44 |
| - </XModal> |
| 30 | + </el-form-item> |
| 31 | + <el-form-item label="任务状态" prop="status"> |
| 32 | + <el-select v-model="queryParams.status" placeholder="请选择任务状态" clearable> |
| 33 | + <el-option |
| 34 | + v-for="dict in getDictOptions(DICT_TYPE.INFRA_JOB_LOG_STATUS)" |
| 35 | + :key="dict.value" |
| 36 | + :label="dict.label" |
| 37 | + :value="dict.value" |
| 38 | + /> |
| 39 | + </el-select> |
| 40 | + </el-form-item> |
| 41 | + <el-form-item> |
| 42 | + <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button> |
| 43 | + <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button> |
| 44 | + <el-button |
| 45 | + type="success" |
| 46 | + plain |
| 47 | + @click="handleExport" |
| 48 | + :loading="exportLoading" |
| 49 | + v-hasPermi="['infra:job:export']" |
| 50 | + > |
| 51 | + <Icon icon="ep:download" class="mr-5px" /> 导出 |
| 52 | + </el-button> |
| 53 | + </el-form-item> |
| 54 | + </el-form> |
| 55 | + |
| 56 | + <el-table v-loading="loading" :data="list"> |
| 57 | + <el-table-column label="日志编号" align="center" prop="id" /> |
| 58 | + <el-table-column label="任务编号" align="center" prop="jobId" /> |
| 59 | + <el-table-column label="处理器的名字" align="center" prop="handlerName" /> |
| 60 | + <el-table-column label="处理器的参数" align="center" prop="handlerParam" /> |
| 61 | + <el-table-column label="第几次执行" align="center" prop="executeIndex" /> |
| 62 | + <el-table-column label="执行时间" align="center" width="180"> |
| 63 | + <template #default="scope"> |
| 64 | + <span>{{ parseTime(scope.row.beginTime) + ' ~ ' + parseTime(scope.row.endTime) }}</span> |
| 65 | + </template> |
| 66 | + </el-table-column> |
| 67 | + <el-table-column label="执行时长" align="center" prop="duration"> |
| 68 | + <template #default="scope"> |
| 69 | + <span>{{ scope.row.duration + ' 毫秒' }}</span> |
| 70 | + </template> |
| 71 | + </el-table-column> |
| 72 | + <el-table-column label="任务状态" align="center" prop="status"> |
| 73 | + <template #default="scope"> |
| 74 | + <dict-tag :type="DICT_TYPE.INFRA_JOB_LOG_STATUS" :value="scope.row.status" /> |
| 75 | + </template> |
| 76 | + </el-table-column> |
| 77 | + <el-table-column label="操作" align="center" class-name="small-padding fixed-width"> |
| 78 | + <template #default="scope"> |
| 79 | + <el-button |
| 80 | + link |
| 81 | + icon="el-icon-view" |
| 82 | + @click="handleView(scope.row.id)" |
| 83 | + :loading="exportLoading" |
| 84 | + v-hasPermi="['infra:job:query']" |
| 85 | + >详细 |
| 86 | + </el-button> |
| 87 | + </template> |
| 88 | + </el-table-column> |
| 89 | + </el-table> |
| 90 | + |
| 91 | + <pagination |
| 92 | + v-show="total > 0" |
| 93 | + :total="total" |
| 94 | + v-model:page="queryParams.pageNo" |
| 95 | + v-model:limit="queryParams.pageSize" |
| 96 | + @pagination="getList" |
| 97 | + /> |
| 98 | + </content-wrap> |
| 99 | + <!-- 表单弹窗:查看 --> |
| 100 | + <log-view ref="viewModalRef" @success="getList" /> |
45 | 101 | </template>
|
46 |
| -<script setup lang="ts" name="JobLog"> |
47 |
| -import { parseTime } from '@/utils/formatTime' |
48 | 102 |
|
| 103 | +<script setup lang="ts" name="JobLog"> |
| 104 | +import { DICT_TYPE, getDictOptions } from '@/utils/dict' |
| 105 | +import download from '@/utils/download' |
| 106 | +import LogView from './JobLogView.vue' |
49 | 107 | import * as JobLogApi from '@/api/infra/jobLog'
|
50 |
| -import { allSchemas } from './jobLog.data' |
| 108 | +import { parseTime } from './utils' |
51 | 109 |
|
52 |
| -const { t } = useI18n() // 国际化 |
53 |
| -// 列表相关的变量 |
54 |
| -const [registerTable, { exportList }] = useXTable({ |
55 |
| - allSchemas: allSchemas, |
56 |
| - getListApi: JobLogApi.getJobLogPageApi, |
57 |
| - exportListApi: JobLogApi.exportJobLogApi |
| 110 | +const message = useMessage() // 消息弹窗 |
| 111 | +
|
| 112 | +const loading = ref(true) // 列表的加载中 |
| 113 | +const total = ref(0) // 列表的总页数 |
| 114 | +const list = ref([]) // 列表的数据 |
| 115 | +const queryParams = reactive({ |
| 116 | + pageNo: 1, |
| 117 | + pageSize: 10, |
| 118 | + handlerName: undefined, |
| 119 | + beginTime: undefined, |
| 120 | + endTime: undefined, |
| 121 | + status: undefined |
58 | 122 | })
|
59 |
| -// ========== CRUD 相关 ========== |
60 |
| -const dialogVisible = ref(false) // 是否显示弹出层 |
61 |
| -const dialogTitle = ref('') // 弹出层标题 |
| 123 | +const queryFormRef = ref() // 搜索的表单 |
| 124 | +const exportLoading = ref(false) // 导出的加载中 |
62 | 125 |
|
63 |
| -// ========== 详情相关 ========== |
64 |
| -const detailData = ref() // 详情 Ref |
| 126 | +/** 查询参数列表 */ |
| 127 | +const getList = async () => { |
| 128 | + loading.value = true |
| 129 | + try { |
| 130 | + const data = await JobLogApi.getJobLogPageApi({ |
| 131 | + ...queryParams, |
| 132 | + beginTime: queryParams.beginTime ? queryParams.beginTime + ' 00:00:00' : undefined, |
| 133 | + endTime: queryParams.endTime ? queryParams.endTime + ' 23:59:59' : undefined |
| 134 | + }) |
| 135 | + list.value = data.list |
| 136 | + total.value = data.total |
| 137 | + } finally { |
| 138 | + loading.value = false |
| 139 | + } |
| 140 | +} |
65 | 141 |
|
66 |
| -// 详情操作 |
67 |
| -const handleDetail = async (row: JobLogApi.JobLogVO) => { |
68 |
| - // 设置数据 |
69 |
| - const res = await JobLogApi.getJobLogApi(row.id) |
70 |
| - detailData.value = res |
71 |
| - dialogTitle.value = t('action.detail') |
72 |
| - dialogVisible.value = true |
| 142 | +/** 搜索按钮操作 */ |
| 143 | +const handleQuery = () => { |
| 144 | + queryParams.pageNo = 1 |
| 145 | + getList() |
73 | 146 | }
|
| 147 | +
|
| 148 | +/** 重置按钮操作 */ |
| 149 | +const resetQuery = () => { |
| 150 | + queryFormRef.value.resetFields() |
| 151 | + handleQuery() |
| 152 | +} |
| 153 | +
|
| 154 | +/** 查看操作 */ |
| 155 | +const viewModalRef = ref() |
| 156 | +const handleView = (rowId?: number) => { |
| 157 | + viewModalRef.value.openModal(rowId) |
| 158 | +} |
| 159 | +
|
| 160 | +/** 导出按钮操作 */ |
| 161 | +const handleExport = async () => { |
| 162 | + try { |
| 163 | + // 导出的二次确认 |
| 164 | + await message.exportConfirm() |
| 165 | + // 发起导出 |
| 166 | + exportLoading.value = true |
| 167 | + const data = await JobLogApi.exportJobLogApi(queryParams) |
| 168 | + download.excel(data, '定时任务执行日志.xls') |
| 169 | + } catch { |
| 170 | + } finally { |
| 171 | + exportLoading.value = false |
| 172 | + } |
| 173 | +} |
| 174 | +
|
| 175 | +/** 初始化 **/ |
| 176 | +onMounted(() => { |
| 177 | + getList() |
| 178 | +}) |
74 | 179 | </script>
|
0 commit comments