<script lang="ts" setup>
|
import type { HrmPerformanceAppraiseApi } from '#/api/hrm/performance-appraise';
|
|
import { ref } from 'vue';
|
|
import { useVbenModal } from '@vben/common-ui';
|
|
import { message } from 'ant-design-vue';
|
|
import {
|
getAppraiseItemList,
|
saveAppraiseItems,
|
} from '#/api/hrm/performance-appraise';
|
|
const emit = defineEmits(['success']);
|
|
const appraiseId = ref<number>();
|
const items = ref<HrmPerformanceAppraiseApi.AppraiseItem[]>([]);
|
|
const SCORER_TYPE_OPTIONS = [
|
{ label: '自评', value: 1 },
|
{ label: '上级评', value: 2 },
|
];
|
|
function addRow() {
|
items.value.push({
|
itemName: '',
|
weight: undefined,
|
scoringStandard: '',
|
scorerType: 1,
|
sort: items.value.length + 1,
|
});
|
}
|
|
function removeRow(index: number) {
|
items.value.splice(index, 1);
|
items.value.forEach((item, idx) => {
|
item.sort = idx + 1;
|
});
|
}
|
|
const [Modal, modalApi] = useVbenModal({
|
async onConfirm() {
|
// 校验:指标名称与权重必填
|
const invalid = items.value.some(
|
(item) => !item.itemName || item.weight == null,
|
);
|
if (invalid) {
|
message.warning('请填写完整的指标名称与权重');
|
return;
|
}
|
modalApi.lock();
|
try {
|
await saveAppraiseItems({ appraiseId: appraiseId.value!, items: items.value });
|
await modalApi.close();
|
emit('success');
|
message.success('指标保存成功');
|
} finally {
|
modalApi.unlock();
|
}
|
},
|
async onOpenChange(isOpen: boolean) {
|
if (!isOpen) {
|
appraiseId.value = undefined;
|
items.value = [];
|
return;
|
}
|
const data = modalApi.getData<{ id: number }>();
|
appraiseId.value = data?.id;
|
modalApi.lock();
|
try {
|
items.value = await getAppraiseItemList(appraiseId.value!);
|
} finally {
|
modalApi.unlock();
|
}
|
},
|
});
|
</script>
|
|
<template>
|
<Modal title="配置考核指标" class="w-3/4">
|
<div class="mb-3 flex items-center justify-between">
|
<span class="text-sm text-gray-500">设置考核指标名称、权重与评分标准,权重合计建议 100</span>
|
<a-button type="primary" @click="addRow">添加指标</a-button>
|
</div>
|
<a-table
|
:data-source="items"
|
:pagination="false"
|
:scroll="{ y: 360 }"
|
bordered
|
row-key="sort"
|
size="small"
|
>
|
<a-table-column title="指标名称" width="220">
|
<template #default="{ record }">
|
<a-input
|
v-model:value="record.itemName"
|
placeholder="请输入指标名称"
|
/>
|
</template>
|
</a-table-column>
|
<a-table-column title="权重" width="120">
|
<template #default="{ record }">
|
<a-input-number
|
v-model:value="record.weight"
|
:min="0"
|
:precision="2"
|
class="!w-full"
|
placeholder="权重"
|
/>
|
</template>
|
</a-table-column>
|
<a-table-column title="评分标准" min-width="220">
|
<template #default="{ record }">
|
<a-input
|
v-model:value="record.scoringStandard"
|
placeholder="请输入评分标准"
|
/>
|
</template>
|
</a-table-column>
|
<a-table-column title="评分人" width="120">
|
<template #default="{ record }">
|
<a-select
|
v-model:value="record.scorerType"
|
:options="SCORER_TYPE_OPTIONS"
|
class="!w-full"
|
/>
|
</template>
|
</a-table-column>
|
<a-table-column title="排序" width="90">
|
<template #default="{ record }">
|
<a-input-number
|
v-model:value="record.sort"
|
:min="1"
|
:precision="0"
|
class="!w-full"
|
/>
|
</template>
|
</a-table-column>
|
<a-table-column title="操作" width="80" align="center">
|
<template #default="{ index }">
|
<a-button type="link" danger @click="removeRow(index)">删除</a-button>
|
</template>
|
</a-table-column>
|
</a-table>
|
</Modal>
|
</template>
|