refactor:基于 lint 处理排版

This commit is contained in:
YunaiV
2025-04-22 22:10:33 +08:00
parent 3fe36fd823
commit fb785894b6
322 changed files with 4781 additions and 2093 deletions

View File

@@ -2,9 +2,10 @@ import type { VbenFormSchema } from '#/adapter/form';
import type { OnActionClickFn, VxeTableGridOptions } from '#/adapter/vxe-table';
import type { InfraJobApi } from '#/api/infra/job';
import { DICT_TYPE, getDictOptions } from '#/utils/dict';
import { useAccess } from '@vben/access';
import { InfraJobStatusEnum } from '#/utils/constants';
import { DICT_TYPE, getDictOptions } from '#/utils/dict';
const { hasAccessByCodes } = useAccess();
@@ -75,7 +76,7 @@ export function useFormSchema(): VbenFormSchema[] {
componentProps: {
placeholder: '请输入重试间隔,单位:毫秒。设置为 0 时,无需间隔',
min: 0,
class: 'w-full'
class: 'w-full',
},
rules: 'required',
},
@@ -127,7 +128,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
}
/** 表格列配置 */
export function useGridColumns<T = InfraJobApi.InfraJob>(
export function useGridColumns<T = InfraJobApi.Job>(
onActionClick: OnActionClickFn<T>,
): VxeTableGridOptions['columns'] {
return [
@@ -147,7 +148,7 @@ export function useGridColumns<T = InfraJobApi.InfraJob>(
minWidth: 100,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.INFRA_JOB_STATUS, },
props: { type: DICT_TYPE.INFRA_JOB_STATUS },
},
},
{
@@ -186,14 +187,16 @@ export function useGridColumns<T = InfraJobApi.InfraJob>(
{
code: 'update-status',
text: '开启',
show: (row: any) => hasAccessByCodes(['infra:job:update'])
&& row.status === InfraJobStatusEnum.STOP,
show: (row: any) =>
hasAccessByCodes(['infra:job:update']) &&
row.status === InfraJobStatusEnum.STOP,
},
{
code: 'update-status',
text: '暂停',
show: (row: any) => hasAccessByCodes(['infra:job:update'])
&& row.status == InfraJobStatusEnum.NORMAL,
show: (row: any) =>
hasAccessByCodes(['infra:job:update']) &&
row.status == InfraJobStatusEnum.NORMAL,
},
{
code: 'trigger',

View File

@@ -1,22 +1,33 @@
<script lang="ts" setup>
import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter/vxe-table';
import type {
OnActionClickParams,
VxeTableGridOptions,
} from '#/adapter/vxe-table';
import type { InfraJobApi } from '#/api/infra/job';
import { Page, useVbenModal } from '@vben/common-ui';
import { Download, Plus, History } from '@vben/icons';
import { Button, message, Modal } from 'ant-design-vue';
import Form from './modules/form.vue';
import Detail from './modules/detail.vue';
import { DocAlert } from '#/components/doc-alert';
import { $t } from '#/locales';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { useRouter } from 'vue-router';
import { InfraJobStatusEnum} from '#/utils/constants';
import { deleteJob, exportJob, getJobPage, runJob, updateJobStatus } from '#/api/infra/job';
import { Page, useVbenModal } from '@vben/common-ui';
import { Download, History, Plus } from '@vben/icons';
import { Button, message, Modal } from 'ant-design-vue';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import {
deleteJob,
exportJob,
getJobPage,
runJob,
updateJobStatus,
} from '#/api/infra/job';
import { DocAlert } from '#/components/doc-alert';
import { $t } from '#/locales';
import { InfraJobStatusEnum } from '#/utils/constants';
import { downloadByData } from '#/utils/download';
import { useGridColumns, useGridFormSchema } from './data';
import Detail from './modules/detail.vue';
import Form from './modules/form.vue';
const { push } = useRouter();
@@ -47,18 +58,21 @@ function onCreate() {
}
/** 编辑任务 */
function onEdit(row: InfraJobApi.InfraJob) {
function onEdit(row: InfraJobApi.Job) {
formModalApi.setData(row).open();
}
/** 查看任务详情 */
function onDetail(row: InfraJobApi.InfraJob) {
function onDetail(row: InfraJobApi.Job) {
detailModalApi.setData({ id: row.id }).open();
}
/** 更新任务状态 */
async function onUpdateStatus(row: InfraJobApi.InfraJob) {
const status = row.status === InfraJobStatusEnum.STOP ? InfraJobStatusEnum.NORMAL : InfraJobStatusEnum.STOP;
async function onUpdateStatus(row: InfraJobApi.Job) {
const status =
row.status === InfraJobStatusEnum.STOP
? InfraJobStatusEnum.NORMAL
: InfraJobStatusEnum.STOP;
const statusText = status === InfraJobStatusEnum.NORMAL ? '启用' : '停用';
Modal.confirm({
title: '确认操作',
@@ -70,12 +84,12 @@ async function onUpdateStatus(row: InfraJobApi.InfraJob) {
key: 'action_process_msg',
});
onRefresh();
}
},
});
}
/** 执行一次任务 */
async function onTrigger(row: InfraJobApi.InfraJob) {
async function onTrigger(row: InfraJobApi.Job) {
Modal.confirm({
title: '确认操作',
content: `确定执行一次 ${row.name} 吗?`,
@@ -85,12 +99,12 @@ async function onTrigger(row: InfraJobApi.InfraJob) {
content: $t('ui.actionMessage.operationSuccess'),
key: 'action_process_msg',
});
}
},
});
}
/** 跳转到任务日志 */
function onLog(row?: InfraJobApi.InfraJob) {
function onLog(row?: InfraJobApi.Job) {
push({
name: 'InfraJobLog',
query: row?.id ? { id: row.id } : {},
@@ -98,7 +112,7 @@ function onLog(row?: InfraJobApi.InfraJob) {
}
/** 删除任务 */
async function onDelete(row: InfraJobApi.InfraJob) {
async function onDelete(row: InfraJobApi.Job) {
const hideLoading = message.loading({
content: $t('ui.actionMessage.deleting', [row.name]),
duration: 0,
@@ -117,35 +131,32 @@ async function onDelete(row: InfraJobApi.InfraJob) {
}
/** 表格操作按钮的回调函数 */
function onActionClick({
code,
row,
}: OnActionClickParams<InfraJobApi.InfraJob>) {
function onActionClick({ code, row }: OnActionClickParams<InfraJobApi.Job>) {
switch (code) {
case 'edit': {
onEdit(row);
break;
}
case 'update-status': {
onUpdateStatus(row);
break;
}
case 'delete': {
onDelete(row);
break;
}
case 'trigger': {
onTrigger(row);
break;
}
case 'detail': {
onDetail(row);
break;
}
case 'edit': {
onEdit(row);
break;
}
case 'log': {
onLog(row);
break;
}
case 'trigger': {
onTrigger(row);
break;
}
case 'update-status': {
onUpdateStatus(row);
break;
}
}
}
@@ -175,7 +186,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
refresh: { code: 'query' },
search: true,
},
} as VxeTableGridOptions<InfraJobApi.InfraJob>,
} as VxeTableGridOptions<InfraJobApi.Job>,
});
</script>
@@ -189,15 +200,29 @@ const [Grid, gridApi] = useVbenVxeGrid({
<DetailModal />
<Grid table-title="定时任务列表">
<template #toolbar-tools>
<Button type="primary" @click="onCreate" v-access:code="['infra:job:create']">
<Button
type="primary"
@click="onCreate"
v-access:code="['infra:job:create']"
>
<Plus class="size-5" />
{{ $t('ui.actionTitle.create', ['任务']) }}
</Button>
<Button type="primary" class="ml-2" @click="onExport" v-access:code="['infra:job:export']">
<Button
type="primary"
class="ml-2"
@click="onExport"
v-access:code="['infra:job:export']"
>
<Download class="size-5" />
{{ $t('ui.actionTitle.export') }}
</Button>
<Button type="primary" class="ml-2" @click="onLog(undefined)" v-access:code="['infra:job:query']">
<Button
type="primary"
class="ml-2"
@click="onLog(undefined)"
v-access:code="['infra:job:query']"
>
<History class="size-5" />
执行日志
</Button>

View File

@@ -2,11 +2,13 @@ import type { VbenFormSchema } from '#/adapter/form';
import type { OnActionClickFn, VxeTableGridOptions } from '#/adapter/vxe-table';
import type { InfraJobLogApi } from '#/api/infra/job-log';
import { DICT_TYPE, getDictOptions } from '#/utils/dict';
import { useAccess } from '@vben/access';
import dayjs from 'dayjs';
import { formatDateTime } from '@vben/utils';
import dayjs from 'dayjs';
import { DICT_TYPE, getDictOptions } from '#/utils/dict';
const { hasAccessByCodes } = useAccess();
/** 列表的搜索表单 */
@@ -63,7 +65,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
}
/** 表格列配置 */
export function useGridColumns<T = InfraJobLogApi.InfraJobLog>(
export function useGridColumns<T = InfraJobLogApi.JobLog>(
onActionClick: OnActionClickFn<T>,
): VxeTableGridOptions['columns'] {
return [

View File

@@ -1,20 +1,25 @@
<script lang="ts" setup>
import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter/vxe-table';
import type {
OnActionClickParams,
VxeTableGridOptions,
} from '#/adapter/vxe-table';
import type { InfraJobLogApi } from '#/api/infra/job-log';
import { useRoute } from 'vue-router';
import { Page, useVbenModal } from '@vben/common-ui';
import { Download } from '@vben/icons';
import { Button } from 'ant-design-vue';
import Detail from './modules/detail.vue';
import { DocAlert } from '#/components/doc-alert';
import { $t } from '#/locales';
import { Button } from 'ant-design-vue';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { useRoute } from 'vue-router';
import { exportJobLog, getJobLogPage } from '#/api/infra/job-log';
import { DocAlert } from '#/components/doc-alert';
import { $t } from '#/locales';
import { downloadByData } from '#/utils/download';
import { useGridColumns, useGridFormSchema } from './data';
import Detail from './modules/detail.vue';
const { query } = useRoute();
@@ -30,7 +35,7 @@ async function onExport() {
}
/** 查看日志详情 */
function onDetail(row: InfraJobLogApi.InfraJobLog) {
function onDetail(row: InfraJobLogApi.JobLog) {
detailModalApi.setData({ id: row.id }).open();
}
@@ -38,7 +43,7 @@ function onDetail(row: InfraJobLogApi.InfraJobLog) {
function onActionClick({
code,
row,
}: OnActionClickParams<InfraJobLogApi.InfraJobLog>) {
}: OnActionClickParams<InfraJobLogApi.JobLog>) {
switch (code) {
case 'detail': {
onDetail(row);
@@ -77,7 +82,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
refresh: { code: 'query' },
search: true,
},
} as VxeTableGridOptions<InfraJobLogApi.InfraJobLog>,
} as VxeTableGridOptions<InfraJobLogApi.JobLog>,
});
</script>
@@ -90,7 +95,12 @@ const [Grid, gridApi] = useVbenVxeGrid({
<DetailModal />
<Grid table-title="任务日志列表">
<template #toolbar-tools>
<Button type="primary" class="ml-2" @click="onExport" v-access:code="['infra:job:export']">
<Button
type="primary"
class="ml-2"
@click="onExport"
v-access:code="['infra:job:export']"
>
<Download class="size-5" />
{{ $t('ui.actionTitle.export') }}
</Button>

View File

@@ -1,16 +1,18 @@
<script lang="ts" setup>
import type { InfraJobLogApi } from '#/api/infra/job-log';
import { Descriptions } from 'ant-design-vue';
import { DictTag } from '#/components/dict-tag';
import { useVbenModal } from '@vben/common-ui';
import { DICT_TYPE } from '#/utils/dict';
import { formatDateTime } from '@vben/utils';
import { getJobLog } from '#/api/infra/job-log';
import { ref } from 'vue';
const formData = ref<InfraJobLogApi.InfraJobLog>();
import { useVbenModal } from '@vben/common-ui';
import { formatDateTime } from '@vben/utils';
import { Descriptions } from 'ant-design-vue';
import { getJobLog } from '#/api/infra/job-log';
import { DictTag } from '#/components/dict-tag';
import { DICT_TYPE } from '#/utils/dict';
const formData = ref<InfraJobLogApi.JobLog>();
const [Modal, modalApi] = useVbenModal({
async onOpenChange(isOpen: boolean) {
@@ -33,8 +35,19 @@ const [Modal, modalApi] = useVbenModal({
</script>
<template>
<Modal title="日志详情" class="w-1/2" :show-cancel-button="false" :show-confirm-button="false">
<Descriptions :column="1" bordered size="middle" class="mx-4" :label-style="{ width: '140px' }">
<Modal
title="日志详情"
class="w-1/2"
:show-cancel-button="false"
:show-confirm-button="false"
>
<Descriptions
:column="1"
bordered
size="middle"
class="mx-4"
:label-style="{ width: '140px' }"
>
<Descriptions.Item label="日志编号">
{{ formData?.id }}
</Descriptions.Item>
@@ -55,10 +68,13 @@ const [Modal, modalApi] = useVbenModal({
{{ formData?.endTime ? formatDateTime(formData.endTime) : '' }}
</Descriptions.Item>
<Descriptions.Item label="执行时长">
{{ formData?.duration ? formData.duration + ' 毫秒' : '' }}
{{ formData?.duration ? `${formData.duration} 毫秒` : '' }}
</Descriptions.Item>
<Descriptions.Item label="任务状态">
<DictTag :type="DICT_TYPE.INFRA_JOB_LOG_STATUS" :value="formData?.status" />
<DictTag
:type="DICT_TYPE.INFRA_JOB_LOG_STATUS"
:value="formData?.status"
/>
</Descriptions.Item>
<Descriptions.Item label="执行结果">
{{ formData?.result }}

View File

@@ -1,16 +1,18 @@
<script lang="ts" setup>
import type { InfraJobApi } from '#/api/infra/job';
import { Descriptions, Timeline } from 'ant-design-vue';
import { DictTag } from '#/components/dict-tag';
import { useVbenModal } from '@vben/common-ui';
import { DICT_TYPE } from '#/utils/dict';
import { formatDateTime } from '@vben/utils';
import { getJob, getJobNextTimes } from '#/api/infra/job';
import { ref } from 'vue';
const formData = ref<InfraJobApi.InfraJob>(); // 任务详情
import { useVbenModal } from '@vben/common-ui';
import { formatDateTime } from '@vben/utils';
import { Descriptions, Timeline } from 'ant-design-vue';
import { getJob, getJobNextTimes } from '#/api/infra/job';
import { DictTag } from '#/components/dict-tag';
import { DICT_TYPE } from '#/utils/dict';
const formData = ref<InfraJobApi.Job>(); // 任务详情
const nextTimes = ref<Date[]>([]); // 下一次执行时间
const [Modal, modalApi] = useVbenModal({
@@ -36,8 +38,19 @@ const [Modal, modalApi] = useVbenModal({
</script>
<template>
<Modal title="任务详情" class="w-1/2" :show-cancel-button="false" :show-confirm-button="false">
<Descriptions :column="1" bordered size="middle" class="mx-4" :label-style="{ width: '140px' }">
<Modal
title="任务详情"
class="w-1/2"
:show-cancel-button="false"
:show-confirm-button="false"
>
<Descriptions
:column="1"
bordered
size="middle"
class="mx-4"
:label-style="{ width: '140px' }"
>
<Descriptions.Item label="任务编号">
{{ formData?.id }}
</Descriptions.Item>
@@ -60,14 +73,24 @@ const [Modal, modalApi] = useVbenModal({
{{ formData?.retryCount }}
</Descriptions.Item>
<Descriptions.Item label="重试间隔">
{{ formData?.retryInterval ? formData.retryInterval + ' 毫秒' : '无间隔' }}
{{
formData?.retryInterval ? `${formData.retryInterval} 毫秒` : '无间隔'
}}
</Descriptions.Item>
<Descriptions.Item label="监控超时时间">
{{ formData?.monitorTimeout && formData.monitorTimeout > 0 ? formData.monitorTimeout + ' 毫秒' : '未开启' }}
{{
formData?.monitorTimeout && formData.monitorTimeout > 0
? `${formData.monitorTimeout} 毫秒`
: '未开启'
}}
</Descriptions.Item>
<Descriptions.Item label="后续执行时间">
<Timeline class="h-[180px]">
<Timeline.Item v-for="(nextTime, index) in nextTimes" :key="index" color="blue">
<Timeline.Item
v-for="(nextTime, index) in nextTimes"
:key="index"
color="blue"
>
{{ index + 1 }} {{ formatDateTime(nextTime.toString()) }}
</Timeline.Item>
</Timeline>

View File

@@ -1,18 +1,20 @@
<script lang="ts" setup>
import type { InfraJobApi } from '#/api/infra/job';
import { computed, ref } from 'vue';
import { useVbenModal } from '@vben/common-ui';
import { message } from 'ant-design-vue';
import { $t } from '#/locales';
import { computed, ref } from 'vue';
import { useVbenForm } from '#/adapter/form';
import { createJob, getJob, updateJob } from '#/api/infra/job';
import { $t } from '#/locales';
import { useFormSchema } from '../data';
const emit = defineEmits(['success']);
const formData = ref<InfraJobApi.InfraJob>();
const formData = ref<InfraJobApi.Job>();
const getTitle = computed(() => {
return formData.value?.id
? $t('ui.actionTitle.edit', ['任务'])
@@ -24,8 +26,8 @@ const [Form, formApi] = useVbenForm({
schema: useFormSchema(),
showDefaultActions: false,
commonConfig: {
labelWidth: 140
}
labelWidth: 140,
},
});
const [Modal, modalApi] = useVbenModal({
@@ -36,11 +38,9 @@ const [Modal, modalApi] = useVbenModal({
}
modalApi.lock();
// 提交表单
const data = (await formApi.getValues()) as InfraJobApi.InfraJob;
const data = (await formApi.getValues()) as InfraJobApi.Job;
try {
await (formData.value?.id
? updateJob(data)
: createJob(data));
await (formData.value?.id ? updateJob(data) : createJob(data));
// 关闭并提示
await modalApi.close();
emit('success');
@@ -57,7 +57,7 @@ const [Modal, modalApi] = useVbenModal({
return;
}
// 加载数据
const data = modalApi.getData<InfraJobApi.InfraJob>();
const data = modalApi.getData<InfraJobApi.Job>();
if (!data || !data.id) {
return;
}
@@ -77,4 +77,4 @@ const [Modal, modalApi] = useVbenModal({
<Modal :title="getTitle">
<Form class="mx-4" />
</Modal>
</template>
</template>