<script lang="ts" setup>
|
import type { HrmEmployeeContractApi } from '#/api/hrm/employee/contract';
|
|
import { ref, watch } from 'vue';
|
|
import { Table, Tag } from 'ant-design-vue';
|
|
import { getEmployeeContractPage } from '#/api/hrm/employee/contract';
|
import { DICT_TYPE } from '#/packages/constants/src';
|
import { getDictLabel } from '#/packages/effects/hooks/src';
|
|
const props = defineProps<{
|
employeeId?: number;
|
}>();
|
|
const list = ref<HrmEmployeeContractApi.EmployeeContract[]>([]);
|
const loading = ref(false);
|
|
/** 合同状态颜色：1-待生效 2-生效中 3-即将到期 4-已到期 5-已解除 6-已终止 */
|
const statusColorMap: Record<number, string> = {
|
1: 'processing',
|
2: 'success',
|
3: 'warning',
|
4: 'default',
|
5: 'error',
|
6: 'error',
|
};
|
|
/** 刷新列表 */
|
async function handleRefresh() {
|
if (!props.employeeId) return;
|
loading.value = true;
|
try {
|
const res = await getEmployeeContractPage({
|
pageNo: 1,
|
pageSize: 100,
|
employeeId: props.employeeId,
|
});
|
list.value = res.list;
|
} finally {
|
loading.value = false;
|
}
|
}
|
|
/** 监听 employeeId 变化 */
|
watch(
|
() => props.employeeId,
|
(val) => {
|
if (val) {
|
handleRefresh();
|
}
|
},
|
{ immediate: true },
|
);
|
|
const columns = [
|
{ title: '合同编号', dataIndex: 'contractNo', width: 150 },
|
{ title: '续签自', dataIndex: 'parentNo', width: 130, key: 'parentNo' },
|
{ title: '合同类型', dataIndex: 'contractType', width: 100, key: 'contractType' },
|
{ title: '期限类型', dataIndex: 'contractTermType', width: 110, key: 'contractTermType' },
|
{ title: '签订日期', dataIndex: 'signDate', width: 110 },
|
{ title: '开始日期', dataIndex: 'startDate', width: 110 },
|
{ title: '结束日期', dataIndex: 'endDate', width: 110 },
|
{ title: '合同状态', dataIndex: 'status', width: 100, key: 'status' },
|
{ title: '当前合同', dataIndex: 'isCurrent', width: 90, key: 'isCurrent' },
|
];
|
</script>
|
|
<template>
|
<div class="contract-list">
|
<Table
|
:columns="columns"
|
:data-source="list"
|
:loading="loading"
|
:pagination="false"
|
size="small"
|
row-key="id"
|
>
|
<template #bodyCell="{ column, record }">
|
<template v-if="column.key === 'parentNo'">
|
{{ record.parentNo || '-' }}
|
</template>
|
<template v-else-if="column.key === 'contractType'">
|
{{ getDictLabel(DICT_TYPE.HRM_CONTRACT_TYPE, record.contractType) }}
|
</template>
|
<template v-else-if="column.key === 'contractTermType'">
|
{{ getDictLabel(DICT_TYPE.HRM_CONTRACT_TERM_TYPE, record.contractTermType) }}
|
</template>
|
<template v-else-if="column.key === 'status'">
|
<Tag :color="statusColorMap[record.status!] || 'default'">
|
{{ getDictLabel(DICT_TYPE.HRM_CONTRACT_STATUS, record.status) }}
|
</Tag>
|
</template>
|
<template v-else-if="column.key === 'isCurrent'">
|
<Tag v-if="record.isCurrent" color="processing">当前</Tag>
|
<span v-else>-</span>
|
</template>
|
</template>
|
</Table>
|
</div>
|
</template>
|
|
<style scoped>
|
.contract-list {
|
padding: 0;
|
}
|
</style>
|
