Compare commits
No commits in common. 'main-v2' and 'main' have entirely different histories.
15 changed files with 658 additions and 543 deletions
@ -1,70 +0,0 @@
@@ -1,70 +0,0 @@
|
||||
import { globalServer } from '../index' |
||||
|
||||
interface Param { |
||||
page: number |
||||
size: number |
||||
} |
||||
|
||||
export const getTaskList = (params: Param) => |
||||
globalServer<{ |
||||
tasks: TaskList[] |
||||
total: number |
||||
}>({ |
||||
url: 'api/task/summary', |
||||
method: 'get', |
||||
data: params, |
||||
|
||||
}) |
||||
|
||||
|
||||
export const getTaskInfo = (taskId: string) => globalServer<{ details: TaskInfo[] }>({ |
||||
url: 'api/task/detail', |
||||
method: 'GET', |
||||
params: { task: taskId }, |
||||
}) |
||||
|
||||
export interface TaskCreateParams { |
||||
site: string |
||||
devices: { |
||||
sn: string |
||||
disk?: string |
||||
host?: string |
||||
}[], |
||||
mode: 'import' | 'export' | 'update' |
||||
startTime?: string |
||||
endTime?: string |
||||
} |
||||
|
||||
export const createTask = (params: TaskCreateParams) => globalServer({ |
||||
url: 'api/task/apply', |
||||
method: 'POST', |
||||
data: params, |
||||
}) |
||||
|
||||
export const cancelTask = (taskId: string) => globalServer({ |
||||
url: 'api/task/cancel', |
||||
method: 'POST', |
||||
data: { task: taskId }, |
||||
}) |
||||
|
||||
export type TaskInfo = { |
||||
finish: number; |
||||
id: string; |
||||
info: string; |
||||
site: string; |
||||
sn: string; |
||||
status: -1 | 0 | 1 | 2; // -1 失败, 0 未开始, 1 进行中, 2 成功
|
||||
task_id: string; |
||||
total: number; |
||||
}; |
||||
|
||||
export interface TaskList { |
||||
endTime: string; // 结束时间（可能是空字符串）
|
||||
id: string; // "task759956"
|
||||
info: string; // ""
|
||||
mode: string; // "export"
|
||||
site: string; // "test1"
|
||||
startTime: string; // 开始时间（可能是空字符串）
|
||||
status: -1 | 0 | 1 | 2 | 3; // -1 失败, 0 未开始, 1 进行中, 2 取消, 3 成功
|
||||
loading?: boolean |
||||
} |
||||
@ -1,130 +0,0 @@
@@ -1,130 +0,0 @@
|
||||
<template> |
||||
<div class="task-list wh-full"> |
||||
<EdfsWrap title="任务列表" class="h-full"> |
||||
<EdfsTable class="wh-full" v-loading="loading" :data="list" ref="tableRef" :highlight-current-row="true" |
||||
:page-total="total" :current-page="queryParams.page" :page-size="queryParams.size" row-class-name="row" |
||||
@pageCurrentChange="handleJump"> |
||||
<template v-for="(col, idx) in tableCol" :key="idx"> |
||||
<el-table-column v-if="col.prop.endsWith('Time')" :label="col.label" :min-width="col.minWidth"> |
||||
<template #default="scope"> |
||||
{{ dayjs(scope.row.createTime).format('YYYY-MM-DD HH:mm:ss') }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column v-else-if="col.prop === 'status'" :prop="col.prop" :label="col.label" |
||||
:min-width="col.minWidth"> |
||||
<template #default="scope"> |
||||
{{taskStatus.find(r => r.value === scope.row.status)?.label || '--'}} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column v-else-if="col.prop === 'mode'" :prop="col.prop" :label="col.label" |
||||
:min-width="col.minWidth"> |
||||
<template #default="scope"> |
||||
{{taskMode.find(r => r.value === scope.row.mode)?.label || '--'}} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column v-else :prop="col.prop" :label="col.label" :min-width="col.minWidth" /> |
||||
</template> |
||||
<el-table-column label="操作" width="210" align="center"> |
||||
<template #default="scope"> |
||||
<EdfsButton size="small" link type="primary" inner-text="详情" @click="onDetail(scope.row)" /> |
||||
<EdfsButton size="small" link type="danger" v-if="[0, 1].includes(scope.row.mode)" inner-text="取消任务" |
||||
@click="onCancel(scope.row.id)" /> |
||||
</template> |
||||
</el-table-column> |
||||
</EdfsTable> |
||||
|
||||
</EdfsWrap> |
||||
</div> |
||||
<InfoDrawer ref="InfoDrawerRef" /> |
||||
</template> |
||||
|
||||
<script setup lang="ts"> |
||||
import { cancelTask, getTaskInfo, getTaskList, type TaskInfo, type TaskList } from '@/api/module/taks' |
||||
import { useMessage } from '@/composables/useMessage' |
||||
import dayjs from 'dayjs' |
||||
import InfoDrawer from './infoDrawer.vue' |
||||
|
||||
const message = useMessage() |
||||
const taskStatus = [{ |
||||
value: -1, |
||||
label: '执行失败' |
||||
}, { |
||||
label: '等待执行', |
||||
value: 0 |
||||
}, { |
||||
label: '执行中', |
||||
value: 1 |
||||
}, { |
||||
label: '已取消', |
||||
value: 2 |
||||
}, { |
||||
label: '执行成功', |
||||
value: 3 |
||||
}] |
||||
|
||||
const taskMode = [{ |
||||
value: 'export', |
||||
label: '迁移' |
||||
}, { |
||||
value: 'import', |
||||
label: '导入' |
||||
}, { |
||||
value: 'update', |
||||
label: '升级' |
||||
}] |
||||
|
||||
const tableCol = [ |
||||
{ label: '任务ID', prop: 'id', minWidth: '10%' }, |
||||
{ label: '站点', prop: 'site', minWidth: '16%' }, |
||||
{ label: '任务类型', prop: 'mode', minWidth: '10%' }, |
||||
{ label: '任务状态', prop: 'status', minWidth: '10%' }, |
||||
{ label: '创建时间', prop: 'startTime', minWidth: '10%' }, |
||||
] |
||||
|
||||
|
||||
const loading = ref(true) |
||||
const total = ref(0) |
||||
const list = ref<TaskList[]>([]) |
||||
const queryParams = reactive({ |
||||
page: 1, |
||||
size: undefined, |
||||
|
||||
}) |
||||
const tableRef = ref() |
||||
const getList = async () => { |
||||
if (!queryParams.size) { |
||||
queryParams.size = tableRef.value.getSize() |
||||
} |
||||
loading.value = true |
||||
|
||||
const res = await getTaskList(queryParams as any) |
||||
|
||||
if (res !== null && res.code === 0) { |
||||
list.value = res.data.tasks |
||||
total.value = res.data.total |
||||
} |
||||
|
||||
loading.value = false |
||||
} |
||||
|
||||
function handleJump(page: number) { |
||||
queryParams.page = page |
||||
getList() |
||||
} |
||||
|
||||
const InfoDrawerRef = ref<typeof InfoDrawer>() |
||||
function onDetail(row: TaskList) { |
||||
InfoDrawerRef.value?.open(row) |
||||
} |
||||
const onCancel = async (id: string) => { |
||||
await message.delConfirm(`是否确认取消该任务？`) |
||||
const res = await cancelTask(id) |
||||
if (res.code !== 0) return |
||||
await getList() |
||||
} |
||||
onMounted(() => { |
||||
getList() |
||||
}) |
||||
</script> |
||||
|
||||
<style scoped></style> |
||||
@ -1,107 +0,0 @@
@@ -1,107 +0,0 @@
|
||||
<template> |
||||
<div class="fault-rule-drawer"> |
||||
<el-drawer v-model="isShowDrawer" title="任务详情" direction="rtl" size="50%" modal-class="model-dev-opn" |
||||
:before-close="handleBeforeClose"> |
||||
<main class="wh-full" v-loading="loading"> |
||||
<template v-for="detail in detailList"> |
||||
<el-descriptions border :title="`${detail.sn}任务详情`"> |
||||
<el-descriptions-item :label-width="60" label="状态"> <el-tag size="small">{{statusList.find(r => r.value === |
||||
detail.status)?.label || '--' |
||||
}}</el-tag></el-descriptions-item> |
||||
<el-descriptions-item :label-width="100" label="总数数据量">{{ detail.total }}</el-descriptions-item> |
||||
<el-descriptions-item :label-width="110" label="已完成数据量">{{ detail.finish }}</el-descriptions-item> |
||||
<el-descriptions-item :label-width="60" label="信息"> |
||||
{{ detail?.info ? detail.info : '暂无信息' }} |
||||
</el-descriptions-item> |
||||
<el-descriptions-item label="当前进度"> |
||||
<template v-if="detail.total === 0"> |
||||
<span>暂无进度</span> |
||||
</template> |
||||
<el-progress v-else style="width: 95%;" :percentage="Math.floor((detail.finish / detail.total) * 100)" |
||||
:text-inside="true" :stroke-width="20" /> |
||||
</el-descriptions-item> |
||||
</el-descriptions> |
||||
</template> |
||||
</main> |
||||
</el-drawer> |
||||
</div> |
||||
</template> |
||||
|
||||
<script setup lang="ts"> |
||||
import { getSubTopic, type PubMsgData } from '@/utils/zmq' |
||||
import ZMQWorker from '@/composables/useZMQJsonWorker' |
||||
import { getTaskInfo, type TaskInfo, type TaskList } from '@/api/module/taks' |
||||
import { useMessage } from '@/composables/useMessage' |
||||
|
||||
const message = useMessage() |
||||
const worker = ZMQWorker.getInstance() |
||||
const isShowDrawer = defineModel<boolean>() |
||||
|
||||
const detailList = ref<TaskInfo[]>([]) |
||||
const loading = ref(false) |
||||
|
||||
async function onDetail(row: TaskList) { |
||||
loading.value = true |
||||
const res = await getTaskInfo(row.id); |
||||
if (res.code === 0) { |
||||
detailList.value = res?.data?.details ?? [] |
||||
} else { |
||||
message.error('获取任务详情失败') |
||||
} |
||||
loading.value = false |
||||
} |
||||
const curentTaskId = ref('') |
||||
async function open(row: TaskList) { |
||||
isShowDrawer.value = true |
||||
curentTaskId.value = row.id |
||||
await onDetail(row) |
||||
worker.subscribe(getSubTopic('server', 'event', 'task'), zmqTaskCb) |
||||
} |
||||
|
||||
const statusList = [ |
||||
{ label: '未开始', value: 0 }, |
||||
{ label: '进行中', value: 1 }, |
||||
{ label: '成功', value: 2 }, |
||||
{ label: '失败', value: -1 }, |
||||
] |
||||
|
||||
|
||||
function zmqTaskCb(msg: PubMsgData) { |
||||
const { feedback, result, id } = msg |
||||
const taskId = feedback[0] |
||||
const deviceSN = feedback[1] |
||||
const deviceStatus = feedback[2] || '未知状态' |
||||
const finish = feedback[3] || 0 |
||||
const total = feedback[4] || 0 |
||||
if (curentTaskId.value !== taskId) return |
||||
const detail = detailList.value.find(item => item.sn === deviceSN) |
||||
if (!detail) return |
||||
detail.status = deviceStatus |
||||
detail.finish = finish |
||||
detail.total = total |
||||
} |
||||
|
||||
function handleBeforeClose(done: () => void) { |
||||
isShowDrawer.value = false |
||||
curentTaskId.value = '' |
||||
done() |
||||
} |
||||
|
||||
defineExpose({ |
||||
open, |
||||
}) |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
.fault-rule-drawer { |
||||
font-size: 16px; |
||||
|
||||
:deep(.edfs-wrap) { |
||||
width: auto; |
||||
} |
||||
|
||||
:deep(.el-drawer__header) { |
||||
color: var(--text-color); |
||||
} |
||||
} |
||||
</style> |
||||
Loading…
Reference in new issue