Showing
6 changed files
with
478 additions
and
288 deletions
@@ -2,11 +2,11 @@ import { BasicPageParams } from '/@/api/model/baseModel'; | @@ -2,11 +2,11 @@ import { BasicPageParams } from '/@/api/model/baseModel'; | ||
2 | export type ReportQueryParam = BasicPageParams & SchedueParam; | 2 | export type ReportQueryParam = BasicPageParams & SchedueParam; |
3 | 3 | ||
4 | export type SchedueParam = { | 4 | export type SchedueParam = { |
5 | - status: true; | ||
6 | - jobName: string; | ||
7 | - jobGroup: string; | ||
8 | - orderFiled: string; | ||
9 | - orderType: string; | 5 | + status?: any; |
6 | + jobName?: string; | ||
7 | + jobGroup?: string; | ||
8 | + orderFiled?: string; | ||
9 | + orderType?: string; | ||
10 | data?: any; | 10 | data?: any; |
11 | code?: number; | 11 | code?: number; |
12 | jobId?: string; | 12 | jobId?: string; |
@@ -29,14 +29,15 @@ | @@ -29,14 +29,15 @@ | ||
29 | > | 29 | > |
30 | <slot name="more"></slot> | 30 | <slot name="more"></slot> |
31 | <a-button type="link" size="small" v-if="!$slots.more"> | 31 | <a-button type="link" size="small" v-if="!$slots.more"> |
32 | - <MoreOutlined class="icon-more" /> | 32 | + <!-- <MoreOutlined class="icon-more" /> --> |
33 | + <span>更多</span> | ||
33 | </a-button> | 34 | </a-button> |
34 | </Dropdown> | 35 | </Dropdown> |
35 | </div> | 36 | </div> |
36 | </template> | 37 | </template> |
37 | <script lang="ts"> | 38 | <script lang="ts"> |
38 | import { defineComponent, PropType, computed, toRaw, unref } from 'vue'; | 39 | import { defineComponent, PropType, computed, toRaw, unref } from 'vue'; |
39 | - import { MoreOutlined } from '@ant-design/icons-vue'; | 40 | + // import { MoreOutlined } from '@ant-design/icons-vue'; |
40 | import { Divider, Tooltip, TooltipProps } from 'ant-design-vue'; | 41 | import { Divider, Tooltip, TooltipProps } from 'ant-design-vue'; |
41 | import Icon from '/@/components/Icon/index'; | 42 | import Icon from '/@/components/Icon/index'; |
42 | import { ActionItem, TableActionType } from '/@/components/Table'; | 43 | import { ActionItem, TableActionType } from '/@/components/Table'; |
@@ -51,7 +52,7 @@ | @@ -51,7 +52,7 @@ | ||
51 | 52 | ||
52 | export default defineComponent({ | 53 | export default defineComponent({ |
53 | name: 'TableAction', | 54 | name: 'TableAction', |
54 | - components: { Icon, PopConfirmButton, Divider, Dropdown, MoreOutlined, Tooltip }, | 55 | + components: { Icon, PopConfirmButton, Divider, Dropdown, Tooltip }, |
55 | props: { | 56 | props: { |
56 | actions: { | 57 | actions: { |
57 | type: Array as PropType<ActionItem[]>, | 58 | type: Array as PropType<ActionItem[]>, |
1 | <template> | 1 | <template> |
2 | <div> | 2 | <div> |
3 | - <BasicModal v-bind="$attrs" width="110rem" :height="heightNum" @register="register" title="调度日志" | ||
4 | - @cancel="handleCancel" :showOkBtn="false" destroyOnClose> | 3 | + <BasicModal |
4 | + v-bind="$attrs" | ||
5 | + width="110rem" | ||
6 | + :height="heightNum" | ||
7 | + @register="register" | ||
8 | + title="调度日志" | ||
9 | + @cancel="handleCancel" | ||
10 | + :showOkBtn="false" | ||
11 | + destroyOnClose | ||
12 | + > | ||
5 | <div> | 13 | <div> |
6 | - <BasicTable @register="registerTable"> | 14 | + <a-row type="flex"> |
15 | + <a-col :span="2" style="margin-left: 5rem"> | ||
16 | + <a-input v-model:value="searchInfo.jobName" placeholder="请输入任务名称" /> | ||
17 | + </a-col> | ||
18 | + <a-col :span="4" style="margin-left: 5rem"> | ||
19 | + <a-select | ||
20 | + allowClear | ||
21 | + v-model:value="searchInfo.jobGroup" | ||
22 | + notFoundContent="请选择任务组名" | ||
23 | + placeholder="请选择任务组名" | ||
24 | + style="width: 200px" | ||
25 | + :options="optionGroup" | ||
26 | + > | ||
27 | + </a-select> | ||
28 | + </a-col> | ||
29 | + <a-col :span="4"> | ||
30 | + <a-select | ||
31 | + allowClear | ||
32 | + v-model:value="searchInfo.status" | ||
33 | + placeholder="请选择执行状态" | ||
34 | + style="width: 200px" | ||
35 | + :options="optionStatus" | ||
36 | + > | ||
37 | + </a-select> | ||
38 | + </a-col> | ||
39 | + <a-col :span="4"> | ||
40 | + <a-range-picker | ||
41 | + style="width: 400px" | ||
42 | + v-model:value="searchInfo.sendTime" | ||
43 | + :show-time="{ | ||
44 | + hideDisabledOptions: true, | ||
45 | + defaultValue: [moment('00:00:00', 'HH:mm:ss'), moment('11:59:59', 'HH:mm:ss')], | ||
46 | + }" | ||
47 | + format="YYYY-MM-DD HH:mm:ss" | ||
48 | + /> | ||
49 | + </a-col> | ||
50 | + <a-col :span="4" style="margin-left: 10rem"> | ||
51 | + <a-button type="primary" @click="handleClearData">重置</a-button> | ||
52 | + <a-button style="margin-left: 10px" @click="handleSearchInfo">查询</a-button> | ||
53 | + </a-col> | ||
54 | + </a-row> | ||
55 | + <BasicTable | ||
56 | + :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }" | ||
57 | + @change="onChange" | ||
58 | + :pagination="pagination" | ||
59 | + @register="registerTable" | ||
60 | + > | ||
7 | <template #toolbar> | 61 | <template #toolbar> |
8 | - <Popconfirm title="您确定要清空全部数据" ok-text="确定" cancel-text="取消" @confirm="handleClear"> | 62 | + <Popconfirm |
63 | + title="您确定要清空全部数据" | ||
64 | + ok-text="确定" | ||
65 | + cancel-text="取消" | ||
66 | + @confirm="handleClear" | ||
67 | + > | ||
9 | <a-button type="primary"> 清空 </a-button> | 68 | <a-button type="primary"> 清空 </a-button> |
10 | </Popconfirm> | 69 | </Popconfirm> |
11 | - <Popconfirm title="您确定要批量删除数据" ok-text="确定" cancel-text="取消"> | 70 | + <Popconfirm |
71 | + title="您确定要批量删除数据" | ||
72 | + ok-text="确定" | ||
73 | + cancel-text="取消" | ||
74 | + @confirm="handleDeleteOrBatchDelete(null)" | ||
75 | + > | ||
12 | <a-button type="primary" color="error" :disabled="hasBatchDelete"> | 76 | <a-button type="primary" color="error" :disabled="hasBatchDelete"> |
13 | 批量删除 | 77 | 批量删除 |
14 | </a-button> | 78 | </a-button> |
15 | </Popconfirm> | 79 | </Popconfirm> |
16 | </template> | 80 | </template> |
17 | <template #action="{ record }"> | 81 | <template #action="{ record }"> |
18 | - <TableAction :actions="[ | ||
19 | - { | ||
20 | - label: '查看', | ||
21 | - icon: 'clarity:note-edit-line', | ||
22 | - onClick: handleView.bind(null, record), | ||
23 | - }, | ||
24 | - { | ||
25 | - label: '删除', | ||
26 | - icon: 'ant-design:delete-outlined', | ||
27 | - color: 'error', | ||
28 | - popConfirm: { | ||
29 | - title: '是否确认删除', | ||
30 | - confirm: handleDeleteOrBatchDelete.bind(null, record), | 82 | + <TableAction |
83 | + :actions="[ | ||
84 | + { | ||
85 | + label: '查看', | ||
86 | + icon: 'clarity:note-edit-line', | ||
87 | + onClick: handleView.bind(null, record), | ||
31 | }, | 88 | }, |
32 | - }, | ||
33 | - ]" /> | 89 | + { |
90 | + label: '删除', | ||
91 | + icon: 'ant-design:delete-outlined', | ||
92 | + color: 'error', | ||
93 | + popConfirm: { | ||
94 | + title: '是否确认删除', | ||
95 | + confirm: handleDeleteOrBatchDelete.bind(null, record), | ||
96 | + }, | ||
97 | + }, | ||
98 | + ]" | ||
99 | + /> | ||
34 | </template> | 100 | </template> |
35 | </BasicTable> | 101 | </BasicTable> |
36 | <ScheduleLogViewModal @register="registerModalScheduleLogView" /> | 102 | <ScheduleLogViewModal @register="registerModalScheduleLogView" /> |
@@ -39,85 +105,187 @@ | @@ -39,85 +105,187 @@ | ||
39 | </div> | 105 | </div> |
40 | </template> | 106 | </template> |
41 | <script setup lang="ts"> | 107 | <script setup lang="ts"> |
42 | -import { ref, nextTick } from 'vue'; | ||
43 | -import { BasicModal, useModalInner } from '/@/components/Modal'; | ||
44 | -import { BasicTable, useTable, TableAction } from '/@/components/Table'; | ||
45 | -import { columnSchedue, searchSchedueFormSchema } from './config.data'; | ||
46 | -import { useBatchDelete } from '/@/hooks/web/useBatchDelete'; | ||
47 | -import { | ||
48 | - deleteSchedueLogManage, | ||
49 | - schedueLogPage, | ||
50 | - schedueLogCleanPage, | ||
51 | -} from '/@/api/schedue/schedueManager'; | ||
52 | -import { Popconfirm } from 'ant-design-vue'; | ||
53 | -import { useMessage } from '/@/hooks/web/useMessage'; | ||
54 | -import ScheduleLogViewModal from './ScheduleLogViewModal.vue'; | ||
55 | -import { useModal } from '/@/components/Modal'; | ||
56 | - | ||
57 | -const { createMessage } = useMessage(); | ||
58 | -const heightNum = ref(800); | ||
59 | -const [registerTable, { setProps, reload, getForm, setTableData }] = useTable({ | ||
60 | - title: '调度日志列表', | ||
61 | - // api: schedueLogPage, | ||
62 | - columns: columnSchedue, | ||
63 | - showIndexColumn: false, | ||
64 | - clickToRowSelect: false, | ||
65 | - useSearchForm: true, | ||
66 | - ellipsis: true, | ||
67 | - showTableSetting: true, | ||
68 | - bordered: true, | ||
69 | - formConfig: { | ||
70 | - labelWidth: 120, | ||
71 | - schemas: searchSchedueFormSchema, | ||
72 | - fieldMapToTime: [['sendTime', ['startTime', 'endTime'], 'YYYY-MM-DD HH:mm:ss']], | ||
73 | - }, | ||
74 | - rowKey: 'id', | ||
75 | - actionColumn: { | ||
76 | - width: 200, | ||
77 | - title: '操作', | ||
78 | - dataIndex: 'action', | ||
79 | - slots: { customRender: 'action' }, | ||
80 | - fixed: 'right', | ||
81 | - }, | ||
82 | -}); | ||
83 | -// 刷新 | ||
84 | -const handleSuccess = () => { | ||
85 | - reload(); | ||
86 | -}; | ||
87 | -const { hasBatchDelete, handleDeleteOrBatchDelete, selectionOptions } = useBatchDelete( | ||
88 | - deleteSchedueLogManage, | ||
89 | - handleSuccess, | ||
90 | - setProps | ||
91 | -); | 108 | + import { ref, nextTick, reactive } from 'vue'; |
109 | + import { BasicModal, useModalInner } from '/@/components/Modal'; | ||
110 | + import { BasicTable, useTable, TableAction } from '/@/components/Table'; | ||
111 | + import { columnSchedue } from './config.data'; | ||
112 | + import { | ||
113 | + deleteSchedueLogManage, | ||
114 | + schedueLogPage, | ||
115 | + schedueLogCleanPage, | ||
116 | + } from '/@/api/schedue/schedueManager'; | ||
117 | + import { Popconfirm } from 'ant-design-vue'; | ||
118 | + import { useMessage } from '/@/hooks/web/useMessage'; | ||
119 | + import ScheduleLogViewModal from './ScheduleLogViewModal.vue'; | ||
120 | + import { useModal } from '/@/components/Modal'; | ||
121 | + import moment from 'moment'; | ||
92 | 122 | ||
93 | -const [register] = useModalInner(async (data) => { | ||
94 | - console.log(data.record) | ||
95 | - const res: any = await schedueLogPage({ jobId: data.record.id, page: 1, pageSize: 10 }) | ||
96 | - nextTick(() => { | ||
97 | - console.log(res) | ||
98 | - setTableData(res.items) | ||
99 | - setProps(selectionOptions); | 123 | + const { createMessage } = useMessage(); |
124 | + const heightNum = ref(800); | ||
125 | + const pagination = reactive({ | ||
126 | + total: 0, | ||
127 | + current: 1, | ||
128 | + pageSize: 10, | ||
129 | + }); | ||
130 | + const searchInfo: any = reactive({ | ||
131 | + jobName: '', | ||
132 | + jobGroup: null, | ||
133 | + status: null, | ||
134 | + sendTime: [], | ||
135 | + }); | ||
136 | + const handleClearData = async () => { | ||
137 | + searchInfo.jobName = ''; | ||
138 | + searchInfo.jobGroup = null; | ||
139 | + searchInfo.status = null; | ||
140 | + searchInfo.sendTime = []; | ||
141 | + setProps({ | ||
142 | + loading: true, | ||
143 | + }); | ||
144 | + const res: any = await schedueLogPage({ jobId: getJobId.value, page: 1, pageSize: 10 }); | ||
145 | + setTableData(res.items); | ||
146 | + pagination.total = res.total; | ||
100 | setProps({ | 147 | setProps({ |
101 | - rowKey: 'id', | 148 | + loading: false, |
102 | }); | 149 | }); |
103 | - //重置清空搜索表单 | ||
104 | - const { resetFields } = getForm(); | ||
105 | - resetFields(); | 150 | + }; |
151 | + const optionGroup: any = ref([ | ||
152 | + { value: 'DEFAULT', label: '默认' }, | ||
153 | + { value: 'SYSTEM', label: '系统' }, | ||
154 | + { value: 'REPORT', label: '报表' }, | ||
155 | + ]); | ||
156 | + const optionStatus: any = ref([ | ||
157 | + { value: '1 ', label: '成功' }, | ||
158 | + { value: '0', label: '失败' }, | ||
159 | + ]); | ||
160 | + const [registerTable, { setProps, reload, setTableData }] = useTable({ | ||
161 | + title: '调度日志列表', | ||
162 | + columns: columnSchedue, | ||
163 | + showIndexColumn: false, | ||
164 | + clickToRowSelect: false, | ||
165 | + useSearchForm: false, | ||
166 | + ellipsis: true, | ||
167 | + showTableSetting: false, | ||
168 | + bordered: true, | ||
169 | + rowKey: 'id', | ||
170 | + actionColumn: { | ||
171 | + width: 200, | ||
172 | + title: '操作', | ||
173 | + dataIndex: 'action', | ||
174 | + slots: { customRender: 'action' }, | ||
175 | + fixed: 'right', | ||
176 | + }, | ||
106 | }); | 177 | }); |
107 | -}); | ||
108 | -const handleCancel = () => { }; | ||
109 | -const handleClear = async () => { | ||
110 | - await schedueLogCleanPage(); | ||
111 | - createMessage.success(`清空成功`); | ||
112 | - handleSuccess(); | ||
113 | -}; | ||
114 | -const [registerModalScheduleLogView, { openModal: openModalLogView }] = useModal(); | ||
115 | -const handleView = (record: Recordable) => { | ||
116 | - openModalLogView(true, { | ||
117 | - isUpdate: true, | ||
118 | - record, | 178 | + // 刷新 |
179 | + const handleSuccess = () => { | ||
180 | + reload(); | ||
181 | + }; | ||
182 | + const hasBatchDelete = ref(true); | ||
183 | + const selectedRowKeys = ref([]); | ||
184 | + const onSelectChange = (e) => { | ||
185 | + selectedRowKeys.value = e; | ||
186 | + if (selectedRowKeys.value.length > 0) { | ||
187 | + hasBatchDelete.value = false; | ||
188 | + } else { | ||
189 | + hasBatchDelete.value = true; | ||
190 | + } | ||
191 | + }; | ||
192 | + const handleDeleteOrBatchDelete = async (record) => { | ||
193 | + setProps({ | ||
194 | + loading: true, | ||
195 | + }); | ||
196 | + if (record !== null) { | ||
197 | + await deleteSchedueLogManage([record.id]); | ||
198 | + createMessage.success(`删除成功`); | ||
199 | + setProps({ | ||
200 | + loading: false, | ||
201 | + }); | ||
202 | + handleClearData(); | ||
203 | + } else { | ||
204 | + //批量删除 | ||
205 | + await deleteSchedueLogManage(selectedRowKeys.value); | ||
206 | + createMessage.success(`批量删除成功`); | ||
207 | + setProps({ | ||
208 | + loading: false, | ||
209 | + }); | ||
210 | + handleClearData(); | ||
211 | + selectedRowKeys.value = []; | ||
212 | + } | ||
213 | + }; | ||
214 | + const getJobId = ref(''); | ||
215 | + const [register] = useModalInner(async (data) => { | ||
216 | + setProps({ | ||
217 | + loading: true, | ||
218 | + }); | ||
219 | + selectedRowKeys.value = []; | ||
220 | + getJobId.value = data.record.id; | ||
221 | + const res: any = await schedueLogPage({ | ||
222 | + jobId: getJobId.value, | ||
223 | + page: pagination.current, | ||
224 | + pageSize: pagination.pageSize, | ||
225 | + }); | ||
226 | + nextTick(() => { | ||
227 | + setTableData(res.items); | ||
228 | + pagination.total = res.total; | ||
229 | + setProps({ | ||
230 | + loading: false, | ||
231 | + }); | ||
232 | + setProps({ | ||
233 | + rowKey: 'id', | ||
234 | + }); | ||
235 | + searchInfo.jobName = ''; | ||
236 | + searchInfo.jobGroup = null; | ||
237 | + searchInfo.status = null; | ||
238 | + searchInfo.sendTime = []; | ||
239 | + }); | ||
119 | }); | 240 | }); |
120 | -}; | 241 | + const onChange = async (page) => { |
242 | + setProps({ | ||
243 | + loading: true, | ||
244 | + }); | ||
245 | + pagination.current = page.current; | ||
246 | + pagination.pageSize = page.pageSize; | ||
247 | + const res: any = await schedueLogPage({ | ||
248 | + jobId: getJobId.value, | ||
249 | + page: pagination.current, | ||
250 | + pageSize: pagination.pageSize, | ||
251 | + }); | ||
252 | + setTableData(res.items); | ||
253 | + pagination.total = res.total; | ||
254 | + setProps({ | ||
255 | + loading: false, | ||
256 | + }); | ||
257 | + handleSuccess(); | ||
258 | + }; | ||
259 | + const handleCancel = () => {}; | ||
260 | + const handleClear = async () => { | ||
261 | + await schedueLogCleanPage(); | ||
262 | + createMessage.success(`清空成功`); | ||
263 | + handleSuccess(); | ||
264 | + }; | ||
265 | + const handleSearchInfo = async () => { | ||
266 | + setProps({ | ||
267 | + loading: true, | ||
268 | + }); | ||
269 | + const res: any = await schedueLogPage({ | ||
270 | + jobId: getJobId.value, | ||
271 | + jobName: searchInfo.jobName, | ||
272 | + jobGroup: searchInfo.jobGroup, | ||
273 | + status: searchInfo.status, | ||
274 | + page: pagination.current, | ||
275 | + pageSize: pagination.pageSize, | ||
276 | + }); | ||
277 | + setTableData(res.items); | ||
278 | + pagination.total = res.total; | ||
279 | + setProps({ | ||
280 | + loading: false, | ||
281 | + }); | ||
282 | + }; | ||
283 | + const [registerModalScheduleLogView, { openModal: openModalLogView }] = useModal(); | ||
284 | + const handleView = (record: Recordable) => { | ||
285 | + openModalLogView(true, { | ||
286 | + isUpdate: true, | ||
287 | + record, | ||
288 | + }); | ||
289 | + }; | ||
121 | </script> | 290 | </script> |
122 | -<style lang="less" scoped> | ||
123 | -</style> | 291 | +<style lang="less" scoped></style> |
@@ -27,7 +27,6 @@ | @@ -27,7 +27,6 @@ | ||
27 | const heightNum = ref(800); | 27 | const heightNum = ref(800); |
28 | let personData = reactive({}); | 28 | let personData = reactive({}); |
29 | const [registeDesc, { setDescProps }] = useDescription({ | 29 | const [registeDesc, { setDescProps }] = useDescription({ |
30 | - title: '调度日志详细信息', | ||
31 | data: personData, | 30 | data: personData, |
32 | schema: scheduleLogDetailSchema, | 31 | schema: scheduleLogDetailSchema, |
33 | column: 3, | 32 | column: 3, |
1 | <template> | 1 | <template> |
2 | <div> | 2 | <div> |
3 | - <BasicModal v-bind="$attrs" width="62rem" :height="heightNum" @register="register" title="任务详细" | ||
4 | - @cancel="handleCancel" :showOkBtn="false" style="font-size: 12px"> | 3 | + <BasicModal |
4 | + v-bind="$attrs" | ||
5 | + width="62rem" | ||
6 | + :height="heightNum" | ||
7 | + @register="register" | ||
8 | + title="任务详细信息" | ||
9 | + @cancel="handleCancel" | ||
10 | + :showOkBtn="false" | ||
11 | + style="font-size: 12px" | ||
12 | + > | ||
5 | <div> | 13 | <div> |
6 | <Description :column="3" size="middle" @register="registeDesc" /> | 14 | <Description :column="3" size="middle" @register="registeDesc" /> |
7 | </div> | 15 | </div> |
@@ -9,46 +17,45 @@ | @@ -9,46 +17,45 @@ | ||
9 | </div> | 17 | </div> |
10 | </template> | 18 | </template> |
11 | <script setup lang="ts"> | 19 | <script setup lang="ts"> |
12 | -import { ref, nextTick, reactive } from 'vue'; | ||
13 | -import { BasicModal, useModalInner } from '/@/components/Modal'; | ||
14 | -import { personSchema } from './config.data'; | ||
15 | -import { Description } from '/@/components/Description/index'; | ||
16 | -import { useDescription } from '/@/components/Description'; | 20 | + import { ref, nextTick, reactive } from 'vue'; |
21 | + import { BasicModal, useModalInner } from '/@/components/Modal'; | ||
22 | + import { personSchema } from './config.data'; | ||
23 | + import { Description } from '/@/components/Description/index'; | ||
24 | + import { useDescription } from '/@/components/Description'; | ||
17 | 25 | ||
18 | -const heightNum = ref(800); | ||
19 | -let personData = reactive({}); | ||
20 | -const [registeDesc, { setDescProps }] = useDescription({ | ||
21 | - title: '任务详细信息', | ||
22 | - data: personData, | ||
23 | - schema: personSchema, | ||
24 | - column: 3, | ||
25 | -}); | ||
26 | -const [register] = useModalInner((data) => { | ||
27 | - nextTick(() => { | ||
28 | - //回显 | ||
29 | - for (let i in data.record) { | ||
30 | - Reflect.set(personData, i, data.record[i]); | ||
31 | - } | ||
32 | - setDescProps(personData); | 26 | + const heightNum = ref(800); |
27 | + let personData = reactive({}); | ||
28 | + const [registeDesc, { setDescProps }] = useDescription({ | ||
29 | + data: personData, | ||
30 | + schema: personSchema, | ||
31 | + column: 3, | ||
33 | }); | 32 | }); |
34 | -}); | ||
35 | -const handleCancel = () => { }; | 33 | + const [register] = useModalInner((data) => { |
34 | + nextTick(() => { | ||
35 | + //回显 | ||
36 | + for (let i in data.record) { | ||
37 | + Reflect.set(personData, i, data.record[i]); | ||
38 | + } | ||
39 | + setDescProps(personData); | ||
40 | + }); | ||
41 | + }); | ||
42 | + const handleCancel = () => {}; | ||
36 | </script> | 43 | </script> |
37 | <style lang="less" scoped> | 44 | <style lang="less" scoped> |
38 | -:deep(.vben-basic-title-normal) { | ||
39 | - font-size: 16px; | ||
40 | - font-weight: 500; | ||
41 | -} | 45 | + :deep(.vben-basic-title-normal) { |
46 | + font-size: 16px; | ||
47 | + font-weight: 500; | ||
48 | + } | ||
42 | 49 | ||
43 | -:deep(.vben-collapse-container__header) { | ||
44 | - border-bottom: none; | ||
45 | -} | 50 | + :deep(.vben-collapse-container__header) { |
51 | + border-bottom: none; | ||
52 | + } | ||
46 | 53 | ||
47 | -:deep(.ant-descriptions-item-label) { | ||
48 | - width: 30rem | ||
49 | -} | 54 | + :deep(.ant-descriptions-item-label) { |
55 | + width: 30rem; | ||
56 | + } | ||
50 | 57 | ||
51 | -:deep(.ant-descriptions-item-content) { | ||
52 | - width: 45rem | ||
53 | -} | 58 | + :deep(.ant-descriptions-item-content) { |
59 | + width: 45rem; | ||
60 | + } | ||
54 | </style> | 61 | </style> |
@@ -9,53 +9,69 @@ | @@ -9,53 +9,69 @@ | ||
9 | <a-button type="primary"> 导出 </a-button> | 9 | <a-button type="primary"> 导出 </a-button> |
10 | </Authority> | 10 | </Authority> |
11 | <Authority value="api:yt:schedule:delete"> | 11 | <Authority value="api:yt:schedule:delete"> |
12 | - <Popconfirm title="您确定要批量删除数据" ok-text="确定" cancel-text="取消" @confirm="handleDeleteOrBatchDelete(null)"> | 12 | + <Popconfirm |
13 | + title="您确定要批量删除数据" | ||
14 | + ok-text="确定" | ||
15 | + cancel-text="取消" | ||
16 | + @confirm="handleDeleteOrBatchDelete(null)" | ||
17 | + > | ||
13 | <a-button type="primary" color="error" :disabled="hasBatchDelete"> 批量删除 </a-button> | 18 | <a-button type="primary" color="error" :disabled="hasBatchDelete"> 批量删除 </a-button> |
14 | </Popconfirm> | 19 | </Popconfirm> |
15 | </Authority> | 20 | </Authority> |
16 | </template> | 21 | </template> |
17 | <template #action="{ record }"> | 22 | <template #action="{ record }"> |
18 | - <TableAction :actions="[ | ||
19 | - { | ||
20 | - label: '编辑', | ||
21 | - icon: 'clarity:note-edit-line', | ||
22 | - auth: 'api:yt:schedule:update', | ||
23 | - onClick: handleCreateOrEdit.bind(null, record), | ||
24 | - }, | ||
25 | - { | ||
26 | - label: '删除', | ||
27 | - icon: 'ant-design:delete-outlined', | ||
28 | - color: 'error', | ||
29 | - auth: 'api:yt:schedule:delete', | ||
30 | - popConfirm: { | ||
31 | - title: '是否确认删除', | ||
32 | - confirm: handleDeleteOrBatchDelete.bind(null, record), | 23 | + <TableAction |
24 | + :actions="[ | ||
25 | + { | ||
26 | + label: '编辑', | ||
27 | + icon: 'clarity:note-edit-line', | ||
28 | + auth: 'api:yt:schedule:update', | ||
29 | + onClick: handleCreateOrEdit.bind(null, record), | ||
30 | + ifShow: record.status === 0, | ||
33 | }, | 31 | }, |
34 | - }, | ||
35 | - ]" :dropDownActions="[ | ||
36 | - { | ||
37 | - label: '执行一次', | ||
38 | - icon: 'ant-design:caret-right-filled', | ||
39 | - popConfirm: { | ||
40 | - title: '确认要立即执行一次' + '“' + record.jobName + '”' + '任务吗?', | ||
41 | - confirm: handleRunOne.bind(null, record), | ||
42 | - }, | ||
43 | - }, | ||
44 | - { | ||
45 | - label: '任务详细', | ||
46 | - icon: 'ant-design:eye-outlined', | ||
47 | - onClick: handleTaskDetailModal.bind(null, record), | ||
48 | - }, | ||
49 | - { | ||
50 | - label: '调度日志', | ||
51 | - icon: 'ant-design:insert-row-below-outlined', | ||
52 | - onClick: handleSchedulingLogFunc.bind(null, record), | ||
53 | - }, | ||
54 | -]" /> | 32 | + { |
33 | + label: '删除', | ||
34 | + icon: 'ant-design:delete-outlined', | ||
35 | + color: 'error', | ||
36 | + auth: 'api:yt:schedule:delete', | ||
37 | + ifShow: record.status === 0, | ||
38 | + popConfirm: { | ||
39 | + title: '是否确认删除', | ||
40 | + confirm: handleDeleteOrBatchDelete.bind(null, record), | ||
41 | + }, | ||
42 | + }, | ||
43 | + ]" | ||
44 | + :dropDownActions="[ | ||
45 | + { | ||
46 | + label: '执行一次', | ||
47 | + icon: 'ant-design:caret-right-filled', | ||
48 | + popConfirm: { | ||
49 | + title: '确认要立即执行一次' + '“' + record.jobName + '”' + '任务吗?', | ||
50 | + confirm: handleRunOne.bind(null, record), | ||
51 | + }, | ||
52 | + }, | ||
53 | + { | ||
54 | + label: '任务详细', | ||
55 | + icon: 'ant-design:eye-outlined', | ||
56 | + onClick: handleTaskDetailModal.bind(null, record), | ||
57 | + }, | ||
58 | + { | ||
59 | + label: '调度日志', | ||
60 | + icon: 'ant-design:insert-row-below-outlined', | ||
61 | + onClick: handleSchedulingLogFunc.bind(null, record), | ||
62 | + }, | ||
63 | + ]" | ||
64 | + /> | ||
55 | </template> | 65 | </template> |
56 | <template #status="{ record }"> | 66 | <template #status="{ record }"> |
57 | - <Switch :disabled="disabledSwitch" :checked="record.status === 1" :loading="record.pendingStatus" | ||
58 | - checkedChildren="启用" unCheckedChildren="禁用" @change="(checked: boolean) => statusChange(checked, record)" /> | 67 | + <Switch |
68 | + :disabled="disabledSwitch" | ||
69 | + :checked="record.status === 1" | ||
70 | + :loading="record.pendingStatus" | ||
71 | + checkedChildren="启用" | ||
72 | + unCheckedChildren="禁用" | ||
73 | + @change="(checked: boolean) => statusChange(checked, record)" | ||
74 | + /> | ||
59 | </template> | 75 | </template> |
60 | </BasicTable> | 76 | </BasicTable> |
61 | <ScheduledDrawer @register="registerDrawer" @success="handleSuccess" /> | 77 | <ScheduledDrawer @register="registerDrawer" @success="handleSuccess" /> |
@@ -64,121 +80,120 @@ | @@ -64,121 +80,120 @@ | ||
64 | </div> | 80 | </div> |
65 | </template> | 81 | </template> |
66 | <script setup lang="ts"> | 82 | <script setup lang="ts"> |
67 | -import { nextTick, ref } from 'vue'; | ||
68 | -import { BasicTable, useTable, TableAction } from '/@/components/Table'; | ||
69 | -import { columnSchedue, searchSchedueFormSchema } from './config.form.data'; | ||
70 | -import { useBatchDelete } from '/@/hooks/web/useBatchDelete'; | ||
71 | -import { | ||
72 | - deleteSchedueManage, | ||
73 | - scheduePage, | ||
74 | - putSchedueByidAndStatusManage, | ||
75 | - postRunSchedueConfigManage, | ||
76 | -} from '/@/api/schedue/schedueManager'; | ||
77 | -import { Popconfirm, Switch } from 'ant-design-vue'; | ||
78 | -import { useModal } from '/@/components/Modal'; | ||
79 | -import TaskDetailPreviewModal from './TaskDetailPreviewModal.vue'; | ||
80 | -import SchedueLog from './SchedueLog.vue'; | ||
81 | -import ScheduledDrawer from './ScheduledDrawer.vue'; | ||
82 | -import { useDrawer } from '/@/components/Drawer'; | ||
83 | -import { Authority } from '/@/components/Authority'; | ||
84 | -import { useMessage } from '/@/hooks/web/useMessage'; | ||
85 | - | ||
86 | -const disabledSwitch = ref(false); | ||
87 | -const { createMessage } = useMessage(); | ||
88 | -const [registerTable, { setProps, reload }] = useTable({ | ||
89 | - title: '定时任务列表', | ||
90 | - api: scheduePage, | ||
91 | - columns: columnSchedue, | ||
92 | - showIndexColumn: false, | ||
93 | - clickToRowSelect: false, | ||
94 | - useSearchForm: true, | ||
95 | - ellipsis: true, | ||
96 | - showTableSetting: true, | ||
97 | - bordered: true, | ||
98 | - formConfig: { | ||
99 | - labelWidth: 120, | ||
100 | - schemas: searchSchedueFormSchema, | ||
101 | - fieldMapToTime: [['sendTime', ['startTime', 'endTime'], 'YYYY-MM-DD HH:mm:ss']], | ||
102 | - }, | ||
103 | - actionColumn: { | ||
104 | - width: 200, | ||
105 | - title: '操作', | ||
106 | - dataIndex: 'action', | ||
107 | - slots: { customRender: 'action' }, | ||
108 | - fixed: 'right', | ||
109 | - }, | ||
110 | -}); | ||
111 | -// 刷新 | ||
112 | -const handleSuccess = () => { | ||
113 | - reload(); | ||
114 | -}; | ||
115 | -const { hasBatchDelete, handleDeleteOrBatchDelete, selectionOptions } = useBatchDelete( | ||
116 | - deleteSchedueManage, | ||
117 | - handleSuccess, | ||
118 | - setProps | ||
119 | -); | 83 | + import { nextTick, ref } from 'vue'; |
84 | + import { BasicTable, useTable, TableAction } from '/@/components/Table'; | ||
85 | + import { columnSchedue, searchSchedueFormSchema } from './config.form.data'; | ||
86 | + import { useBatchDelete } from '/@/hooks/web/useBatchDelete'; | ||
87 | + import { | ||
88 | + deleteSchedueManage, | ||
89 | + scheduePage, | ||
90 | + putSchedueByidAndStatusManage, | ||
91 | + postRunSchedueConfigManage, | ||
92 | + } from '/@/api/schedue/schedueManager'; | ||
93 | + import { Popconfirm, Switch } from 'ant-design-vue'; | ||
94 | + import { useModal } from '/@/components/Modal'; | ||
95 | + import TaskDetailPreviewModal from './TaskDetailPreviewModal.vue'; | ||
96 | + import SchedueLog from './SchedueLog.vue'; | ||
97 | + import ScheduledDrawer from './ScheduledDrawer.vue'; | ||
98 | + import { useDrawer } from '/@/components/Drawer'; | ||
99 | + import { Authority } from '/@/components/Authority'; | ||
100 | + import { useMessage } from '/@/hooks/web/useMessage'; | ||
120 | 101 | ||
121 | -nextTick(() => { | ||
122 | - setProps(selectionOptions); | ||
123 | -}); | ||
124 | -const [registerDrawer, { openDrawer }] = useDrawer(); | ||
125 | -const [registerModalTaskDetail, { openModal: openModalTaskDetail }] = useModal(); | ||
126 | -const [registerModalSchedueLog, { openModal: openModalSchedueLog }] = useModal(); | ||
127 | -const handleSchedulingLogFunc = (record: Recordable) => { | ||
128 | - openModalSchedueLog(true, { | ||
129 | - isUpdate: 2, | ||
130 | - record, | 102 | + const disabledSwitch = ref(false); |
103 | + const { createMessage } = useMessage(); | ||
104 | + const [registerTable, { setProps, reload }] = useTable({ | ||
105 | + title: '定时任务列表', | ||
106 | + api: scheduePage, | ||
107 | + columns: columnSchedue, | ||
108 | + showIndexColumn: false, | ||
109 | + clickToRowSelect: false, | ||
110 | + useSearchForm: true, | ||
111 | + ellipsis: true, | ||
112 | + showTableSetting: true, | ||
113 | + bordered: true, | ||
114 | + formConfig: { | ||
115 | + labelWidth: 120, | ||
116 | + schemas: searchSchedueFormSchema, | ||
117 | + fieldMapToTime: [['sendTime', ['startTime', 'endTime'], 'YYYY-MM-DD HH:mm:ss']], | ||
118 | + }, | ||
119 | + actionColumn: { | ||
120 | + width: 200, | ||
121 | + title: '操作', | ||
122 | + dataIndex: 'action', | ||
123 | + slots: { customRender: 'action' }, | ||
124 | + fixed: 'right', | ||
125 | + }, | ||
131 | }); | 126 | }); |
132 | -}; | ||
133 | -const handleTaskDetailModal = (record: Recordable) => { | ||
134 | - openModalTaskDetail(true, { | ||
135 | - isUpdate: true, | ||
136 | - record, | 127 | + // 刷新 |
128 | + const handleSuccess = () => { | ||
129 | + reload(); | ||
130 | + }; | ||
131 | + const { hasBatchDelete, handleDeleteOrBatchDelete, selectionOptions } = useBatchDelete( | ||
132 | + deleteSchedueManage, | ||
133 | + handleSuccess, | ||
134 | + setProps | ||
135 | + ); | ||
136 | + | ||
137 | + nextTick(() => { | ||
138 | + setProps(selectionOptions); | ||
137 | }); | 139 | }); |
138 | -}; | ||
139 | -// 新增或编辑 | ||
140 | -const handleCreateOrEdit = (record: Recordable | null) => { | ||
141 | - if (record) { | ||
142 | - openDrawer(true, { | ||
143 | - isUpdate: true, | 140 | + const [registerDrawer, { openDrawer }] = useDrawer(); |
141 | + const [registerModalTaskDetail, { openModal: openModalTaskDetail }] = useModal(); | ||
142 | + const [registerModalSchedueLog, { openModal: openModalSchedueLog }] = useModal(); | ||
143 | + const handleSchedulingLogFunc = (record: Recordable) => { | ||
144 | + openModalSchedueLog(true, { | ||
145 | + isUpdate: 2, | ||
144 | record, | 146 | record, |
145 | }); | 147 | }); |
146 | - } else { | ||
147 | - openDrawer(true, { | ||
148 | - isUpdate: false, | ||
149 | - }); | ||
150 | - } | ||
151 | -}; | ||
152 | - | ||
153 | -const statusChange = async (checked, record) => { | ||
154 | - try { | ||
155 | - setProps({ | ||
156 | - loading: true, | 148 | + }; |
149 | + const handleTaskDetailModal = (record: Recordable) => { | ||
150 | + openModalTaskDetail(true, { | ||
151 | + isUpdate: true, | ||
152 | + record, | ||
157 | }); | 153 | }); |
158 | - disabledSwitch.value = true; | ||
159 | - const newStatus = checked ? 1 : 0; | ||
160 | - const res = await putSchedueByidAndStatusManage(record.id, newStatus); | ||
161 | - if (res && newStatus) { | ||
162 | - createMessage.success(`启用成功`); | 154 | + }; |
155 | + // 新增或编辑 | ||
156 | + const handleCreateOrEdit = (record: Recordable | null) => { | ||
157 | + if (record) { | ||
158 | + openDrawer(true, { | ||
159 | + isUpdate: true, | ||
160 | + record, | ||
161 | + }); | ||
163 | } else { | 162 | } else { |
164 | - createMessage.success('禁用成功'); | 163 | + openDrawer(true, { |
164 | + isUpdate: false, | ||
165 | + }); | ||
165 | } | 166 | } |
166 | - } finally { | ||
167 | - setTimeout(() => { | 167 | + }; |
168 | + | ||
169 | + const statusChange = async (checked, record) => { | ||
170 | + try { | ||
168 | setProps({ | 171 | setProps({ |
169 | - loading: false, | 172 | + loading: true, |
170 | }); | 173 | }); |
171 | - disabledSwitch.value = false; | ||
172 | - }, 500); | ||
173 | - reload(); | ||
174 | - } | ||
175 | -}; | ||
176 | -const handleRunOne = async (record: Recordable) => { | ||
177 | - const res = await postRunSchedueConfigManage(record.id); | ||
178 | - if (res?.code === 200) { | ||
179 | - createMessage.success(`执行一次任务"${record.jobName}"成功`); | ||
180 | - } | ||
181 | -}; | 174 | + disabledSwitch.value = true; |
175 | + const newStatus = checked ? 1 : 0; | ||
176 | + const res = await putSchedueByidAndStatusManage(record.id, newStatus); | ||
177 | + if (res && newStatus) { | ||
178 | + createMessage.success(`启用成功`); | ||
179 | + } else { | ||
180 | + createMessage.success('禁用成功'); | ||
181 | + } | ||
182 | + } finally { | ||
183 | + setTimeout(() => { | ||
184 | + setProps({ | ||
185 | + loading: false, | ||
186 | + }); | ||
187 | + disabledSwitch.value = false; | ||
188 | + }, 500); | ||
189 | + reload(); | ||
190 | + } | ||
191 | + }; | ||
192 | + const handleRunOne = async (record: Recordable) => { | ||
193 | + const res = await postRunSchedueConfigManage(record.id); | ||
194 | + if (res?.code === 200) { | ||
195 | + createMessage.success(`执行一次任务"${record.jobName}"成功`); | ||
196 | + } | ||
197 | + }; | ||
182 | </script> | 198 | </script> |
183 | -<style lang="less" scoped> | ||
184 | -</style> | 199 | +<style lang="less" scoped></style> |