148 lines
4.5 KiB
Vue
148 lines
4.5 KiB
Vue
<script setup lang="ts">
|
|
import { ref } from 'vue'
|
|
import { useRouter } from 'vue-router'
|
|
import { ElMessage } from 'element-plus'
|
|
import DataTablePage from '@/components/DataTablePage.vue'
|
|
import ModelStatusTag from '@/components/ModelStatusTag.vue'
|
|
|
|
import type { ProcessType } from './create/types'
|
|
|
|
/** 数据处理任务类型 */
|
|
interface DataProcessTask {
|
|
id: number | string
|
|
name: string
|
|
status: string
|
|
process_type: ProcessType
|
|
source_dataset: string
|
|
output_dataset?: string
|
|
create_time?: string
|
|
}
|
|
|
|
const processTypeMap: Record<ProcessType, string> = {
|
|
structured: '结构化数据',
|
|
unstructured: '非结构化数据',
|
|
external: '外来数据源拉取',
|
|
}
|
|
|
|
// TODO: 接入真实接口前，先用本地 mock 数据
|
|
const router = useRouter()
|
|
const dataList = ref<DataProcessTask[]>([
|
|
{
|
|
id: 183921,
|
|
name: '客服问答数据清洗',
|
|
status: 'completed',
|
|
process_type: 'structured',
|
|
source_dataset: '客服对话原始集',
|
|
output_dataset: '客服对话清洗集',
|
|
create_time: '2026-07-08 14:23:00',
|
|
},
|
|
{
|
|
id: 492015,
|
|
name: '指令微调数据构造',
|
|
status: 'running',
|
|
process_type: 'unstructured',
|
|
source_dataset: '通用语料库',
|
|
output_dataset: 'SFT 指令集',
|
|
create_time: '2026-07-09 09:10:00',
|
|
},
|
|
{
|
|
id: 731948,
|
|
name: '敏感信息脱敏处理',
|
|
status: 'pending',
|
|
process_type: 'structured',
|
|
source_dataset: '用户反馈数据',
|
|
create_time: '2026-07-09 16:45:00',
|
|
},
|
|
{
|
|
id: 582012,
|
|
name: '多轮对话拼接',
|
|
status: 'failed',
|
|
process_type: 'structured',
|
|
source_dataset: '单轮问答集',
|
|
create_time: '2026-07-10 08:30:00',
|
|
},
|
|
])
|
|
|
|
/** 新建数据处理任务 */
|
|
function handleCreate() {
|
|
router.push('/data-process/create')
|
|
}
|
|
|
|
/** 查看任务详情 */
|
|
function viewDetail(row: unknown) {
|
|
const taskId = (row as { id: string | number }).id
|
|
router.push({ name: 'data-process-detail', params: { id: taskId } })
|
|
}
|
|
|
|
/** 删除任务（功能开发中） */
|
|
function handleDelete(_row: unknown) {
|
|
ElMessage.info('删除功能开发中...')
|
|
}
|
|
|
|
function formatDateTime(value?: string) {
|
|
if (!value) return '-'
|
|
return new Date(value).toLocaleString('zh-CN', { hour12: false })
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="data-process-page" style="height: 100%;">
|
|
<DataTablePage
|
|
title=""
|
|
:data="dataList"
|
|
searchable
|
|
:search-fields="['name']"
|
|
create-text="新建数据处理"
|
|
create-to="/data-process/create"
|
|
row-key="id"
|
|
:page-size="10"
|
|
>
|
|
<template #columns>
|
|
<el-table-column label="任务ID" prop="id" align="center" width="100" />
|
|
<el-table-column label="任务名称" prop="name" align="center" show-overflow-tooltip />
|
|
<el-table-column label="任务状态" align="center" width="110">
|
|
<template #default="{ row }">
|
|
<ModelStatusTag :status="row.status" />
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="处理类型" align="center" width="140">
|
|
<template #default="{ row }">
|
|
<el-tag v-if="row.process_type" size="small" type="info" effect="plain">
|
|
{{ processTypeMap[row.process_type as ProcessType] || row.process_type }}
|
|
</el-tag>
|
|
<span v-else>-</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="源数据集" align="center" show-overflow-tooltip>
|
|
<template #default="{ row }">{{ row.source_dataset || '-' }}</template>
|
|
</el-table-column>
|
|
<el-table-column label="输出数据集" align="center" show-overflow-tooltip>
|
|
<template #default="{ row }">{{ row.output_dataset || '-' }}</template>
|
|
</el-table-column>
|
|
<el-table-column label="创建时间" align="center" width="190">
|
|
<template #default="{ row }">{{ formatDateTime(row.create_time) }}</template>
|
|
</el-table-column>
|
|
</template>
|
|
|
|
<template #actions="{ row }">
|
|
<div class="action-buttons">
|
|
<el-button type="primary" link size="small" @click="viewDetail(row)">
|
|
<i class="fa fa-file-text-o" style="margin-right: 4px" />详情
|
|
</el-button>
|
|
<el-button type="danger" link size="small" @click="handleDelete(row)">
|
|
<i class="fa fa-trash-o" style="margin-right: 4px" />删除
|
|
</el-button>
|
|
</div>
|
|
</template>
|
|
</DataTablePage>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped lang="scss">
|
|
.action-buttons {
|
|
display: flex;
|
|
justify-content: center;
|
|
gap: 8px;
|
|
}
|
|
</style>
|