<script lang="ts" setup>
|
import type { ActionItem, BasicColumn } from '@jnpf/ui/vxeTable';
|
|
import type { TrainRecordListItem } from './types';
|
|
import { useRouter } from 'vue-router';
|
|
import { useMessage } from '@jnpf/hooks';
|
import { BasicVxeTable, TableAction, useVxeTable } from '@jnpf/ui/vxeTable';
|
|
import { getTrainRecordList } from '#/api/x/tms/trainRecord';
|
|
defineOptions({ name: 'TmsTrainRecord' });
|
|
const router = useRouter();
|
const { createMessage } = useMessage();
|
|
const columns: BasicColumn[] = [
|
{ title: '档案编号', dataIndex: 'archiveNo', width: 130 },
|
{ title: '进岗时间', dataIndex: 'postDate', width: 120 },
|
{ title: '姓名', dataIndex: 'userName', width: 100 },
|
{ title: '部门', dataIndex: 'deptName', minWidth: 120 },
|
{ title: '岗位', dataIndex: 'postName', width: 120 },
|
{ title: '兼职岗位', dataIndex: 'partPostName', width: 120 },
|
{ title: '专业', dataIndex: 'major', width: 100 },
|
{ title: '学历', dataIndex: 'education', width: 90 },
|
{ title: '技术职称', dataIndex: 'techTitle', width: 110 },
|
{ title: '入职时间', dataIndex: 'hireDate', width: 120 },
|
{ title: '离职日期', dataIndex: 'leaveDate', width: 120 },
|
];
|
|
const [registerTable, { getSelectRows }] = useVxeTable({
|
api: fetchList,
|
columns,
|
immediate: true,
|
rowKey: 'id',
|
rowSelection: { type: 'checkbox' },
|
useSearchForm: true,
|
formConfig: {
|
baseColProps: { span: 6 },
|
compact: true,
|
schemas: [
|
{
|
field: 'keyword',
|
label: '关键词',
|
component: 'Input',
|
componentProps: { placeholder: '姓名/部门/档案编号', submitOnPressEnter: true },
|
},
|
{
|
field: 'archiveNo',
|
label: '档案编号',
|
component: 'Input',
|
componentProps: { placeholder: '请输入档案编号', submitOnPressEnter: true },
|
},
|
],
|
},
|
actionColumn: {
|
width: 100,
|
title: '操作',
|
dataIndex: 'action',
|
fixed: 'right',
|
},
|
});
|
|
async function fetchList(params: Record<string, any>) {
|
return { data: await getTrainRecordList(params) };
|
}
|
|
function handleView(record: TrainRecordListItem) {
|
router.push(`/tms/trainRecord/catalog/${record.id}`);
|
}
|
|
function handleViewSelected() {
|
const rows = (getSelectRows?.() || []) as TrainRecordListItem[];
|
if (!rows.length) {
|
createMessage.warning('请先勾选一条记录');
|
return;
|
}
|
if (rows.length > 1) {
|
createMessage.warning('请只勾选一条记录查看');
|
return;
|
}
|
handleView(rows[0]);
|
}
|
|
function getTableActions(record: TrainRecordListItem): ActionItem[] {
|
return [{ label: '查看', onClick: handleView.bind(null, record) }];
|
}
|
</script>
|
|
<template>
|
<div class="jnpf-content-wrapper">
|
<div class="jnpf-content-wrapper-center">
|
<div class="jnpf-content-wrapper-content">
|
<BasicVxeTable @register="registerTable">
|
<template #tableTitle>
|
<a-space>
|
<a-button type="primary" @click="handleViewSelected">查看</a-button>
|
<span class="text-gray-400 text-sm">个人培训记录表，选择人员查看培训目录。</span>
|
</a-space>
|
</template>
|
<template #action="{ record }">
|
<TableAction :actions="getTableActions(record)" />
|
</template>
|
</BasicVxeTable>
|
</div>
|
</div>
|
</div>
|
</template>
|
