11<script setup lang="ts">
2- import { Refresh , Search } from ' @element-plus/icons-vue'
2+ import { ArrowUp , ArrowDown , Search } from ' @element-plus/icons-vue'
33import type { ScheduleJobLog } from ' ../type'
44import Detail from ' ./Detail.vue'
55
@@ -47,68 +47,74 @@ const openDetail = (id: string) => {
4747 </script >
4848
4949<template >
50- <el-drawer v-model =" visible" title =" 日志 " size =" 850px" >
50+ <el-drawer v-model =" visible" : title =" $t('scheduleJobLog.title') " size =" 850px" >
5151 <div class =" list-page" >
52+ <el-header >
53+ <el-space wrap class =" list-operation" >
54+ <el-button v-has-permission =" 'logDelete'" @click =" batchRemove(selectedKeys)" >{{
55+ $t('operation.batchDelete')
56+ }}</el-button >
57+ <el-space >
58+ <el-select
59+ v-model =" queryParam.runStatus"
60+ :label =" $t('scheduleJobLog.runStatus')"
61+ clearable
62+ @change =" onSearch"
63+ >
64+ <el-option :label =" $t('scheduleJobLog.success')" value =" S" />
65+ <el-option :label =" $t('scheduleJobLog.fail')" value =" F" />
66+ </el-select >
67+ <el-button :icon =" Search" type =" primary" @click =" onSearch" >{{ $t('operation.search') }}</el-button >
68+ <el-button :title =" $t('title.reset')" @click =" resetFilter" >{{ $t('operation.reset') }}</el-button >
69+ <el-button
70+ :icon =" searchState ? ArrowUp : ArrowDown"
71+ :title =" searchState ? $t('searchState.up') : $t('searchState.down')"
72+ @click =" searchState = !searchState"
73+ />
74+ </el-space >
75+ </el-space >
76+ </el-header >
77+
5278 <el-form v-show =" searchState" label-width =" 80px" class =" list-search" @submit.prevent >
5379 <el-row :gutter =" 18" >
5480 <el-col :md =" 12" :sm =" 24" >
55- <el-form-item label =" 执行结果" >
56- <el-select v-model =" queryParam.runStatus" clearable @change =" onSearch" >
57- <el-option label =" 成功" value =" S" />
58- <el-option label =" 失败" value =" F" />
59- </el-select >
60- </el-form-item >
61- </el-col >
62- <el-col :md =" 12" :sm =" 24" >
63- <el-form-item label =" 触发方式" >
81+ <el-form-item :label =" $t('scheduleJobLog.triggerMode')" >
6482 <el-select v-model =" queryParam.triggerMode" clearable @change =" onSearch" >
65- <el-option label =" 自动 " value =" AUTO" />
66- <el-option label =" 手动 " value =" MANUAL" />
83+ <el-option : label =" $t('scheduleJobLog.triggerModeOptions.auto') " value =" AUTO" />
84+ <el-option : label =" $t('scheduleJobLog.triggerModeOptions.manual') " value =" MANUAL" />
6785 </el-select >
6886 </el-form-item >
6987 </el-col >
7088 <el-col :md =" 12" :sm =" 24" >
71- <el-form-item label =" 执行时间 " >
89+ <el-form-item : label =" $t('scheduleJobLog.startTimeAlias') " >
7290 <date-range
7391 :model-value =" dateRangeQuery.startTime as [string, string]"
7492 @update:model-value =" dateRangeQuery.startTime = $event as [string, string]"
7593 @change =" onSearch"
7694 />
7795 </el-form-item >
7896 </el-col >
79- <el-col :md =" 12" :sm =" 24" style =" margin-left : auto " >
80- <el-form-item >
81- <el-button type =" primary" @click =" onSearch" >{{ $t('operation.search') }}</el-button >
82- <el-button @click =" resetFilter" >{{ $t('operation.reset') }}</el-button >
83- </el-form-item >
84- </el-col >
8597 </el-row >
8698 </el-form >
87- <el-header >
88- <el-space wrap class =" list-operation" >
89- <el-button v-has-permission =" 'logDelete'" @click =" batchRemove(selectedKeys)" >批量删除</el-button >
90- <el-space >
91- <el-button :icon =" Refresh" circle @click =" getList()" />
92- <el-button :icon =" Search" circle @click =" searchState = !searchState" />
93- </el-space >
94- </el-space >
95- </el-header >
99+
96100 <el-table
97101 ref =" tableRef"
98102 v-loading =" loading"
99103 :data =" dataList"
100104 height =" 100%"
105+ stripe
106+ style =" border-top : 1px solid var (--el-border-color-lighter )"
101107 @selection-change =" (arr: ScheduleJobLog[]) => (selectedKeys = arr.map(e => e.id))"
102108 >
103109 <el-table-column type =" selection" width =" 55" />
104- <el-table-column prop =" startTime" label =" 执行时间 " align =" center" width =" 165 " />
105- <el-table-column prop =" endTime" label =" 结束时间 " align =" center" width =" 165 " />
106- <el-table-column prop =" elapsedSeconds" label =" 耗时(s) " align =" right" width =" 100 " />
107- <el-table-column prop =" triggerModeLabel" align =" center" label =" 触发方式 " />
108- <el-table-column prop =" runStatus" align =" center" label =" 执行结果 " >
110+ <el-table-column prop =" startTime" : label =" $t('scheduleJobLog.startTimeAlias') " align =" center" width =" 140 " />
111+ <el-table-column prop =" endTime" : label =" $t('scheduleJobLog.endTime') " align =" center" width =" 140 " />
112+ <el-table-column prop =" elapsedSeconds" : label =" $t('scheduleJobLog.elapsedSeconds') " align =" right" width =" 120 " />
113+ <el-table-column prop =" triggerModeLabel" align =" center" : label =" $t('scheduleJobLog.triggerMode') " />
114+ <el-table-column prop =" runStatus" align =" center" : label =" $t('scheduleJobLog.runStatus') " >
109115 <template #default =" { row } " >
110- <el-tag v-if =" row.runStatus === 'S'" >成功 </el-tag >
111- <el-tag v-else type =" danger" >失败 </el-tag >
116+ <el-tag v-if =" row.runStatus === 'S'" >{{ $t('scheduleJobLog.success') }} </el-tag >
117+ <el-tag v-else type =" danger" >{{ $t('scheduleJobLog.fail') }} </el-tag >
112118 </template >
113119 </el-table-column >
114120 <el-table-column :label =" $t('operation.label')" align =" center" width =" 130" fixed =" right" >
@@ -117,7 +123,7 @@ const openDetail = (id: string) => {
117123 >{{ $t('title.detail') }}
118124 </el-button >
119125 <el-button v-has-permission =" 'logDelete'" text bg type =" primary" size =" small" @click =" remove(row.id)" >
120- 删除
126+ {{ $t('operation.delete') }}
121127 </el-button >
122128 </template >
123129 </el-table-column >
0 commit comments