|
@@ -0,0 +1,195 @@
|
|
|
+<template>
|
|
|
+ <el-dialog
|
|
|
+ v-model="dialogVisible"
|
|
|
+ title="批量绑定胜任力标签"
|
|
|
+ width="60%"
|
|
|
+ >
|
|
|
+ <el-form :model="form" label-width="120px">
|
|
|
+ <el-form-item label="胜任力标签">
|
|
|
+ <el-table :data="form.competency_tags" border style="width: 100%">
|
|
|
+ <el-table-column label="标签" width="200">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <el-select
|
|
|
+ v-model="row.id"
|
|
|
+ filterable
|
|
|
+ placeholder="请选择胜任力标签"
|
|
|
+ style="width: 100%"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in competencyOptions"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="权重" width="100">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <div class="weight-input">
|
|
|
+ <el-input-number
|
|
|
+ v-model="row.weight"
|
|
|
+ :min="0"
|
|
|
+ :max="100"
|
|
|
+ :step="1"
|
|
|
+ :precision="0"
|
|
|
+ :controls="false"
|
|
|
+ style="width: calc(100% - 20px)"
|
|
|
+ />
|
|
|
+ <span class="percent-sign">%</span>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="重要性" width="100">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <el-input-number
|
|
|
+ v-model="row.importance"
|
|
|
+ :min="1"
|
|
|
+ :controls="false"
|
|
|
+ style="width: 100%"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="备注">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <el-input
|
|
|
+ v-model="row.remark"
|
|
|
+ placeholder="请输入备注"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" width="80" fixed="right">
|
|
|
+ <template #default="{ $index }">
|
|
|
+ <el-button type="danger" link @click="removeTag($index)">删除</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <div style="margin-top: 10px">
|
|
|
+ <el-button type="primary" @click="addTag">添加标签</el-button>
|
|
|
+ </div>
|
|
|
+ </el-form-item>
|
|
|
+ <!-- <el-form-item label="清除现有标签">
|
|
|
+ <el-switch v-model="form.clear_existing" />
|
|
|
+ </el-form-item> -->
|
|
|
+ </el-form>
|
|
|
+ <template #footer>
|
|
|
+ <el-button @click="dialogVisible = false">取消</el-button>
|
|
|
+ <el-button type="primary" @click="handleSubmit">确定</el-button>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script lang="ts" setup>
|
|
|
+import { ref, reactive, onMounted } from 'vue'
|
|
|
+import { successMessage } from '/@/utils/message'
|
|
|
+import * as api from '../api'
|
|
|
+import { ElMessage } from 'element-plus'
|
|
|
+
|
|
|
+const props = defineProps({
|
|
|
+ crudExpose: {
|
|
|
+ type: Object,
|
|
|
+ required: true
|
|
|
+ }
|
|
|
+})
|
|
|
+
|
|
|
+const dialogVisible = ref(false)
|
|
|
+const selectedQuestions = ref<number[]>([])
|
|
|
+const competencyOptions = ref<Array<any>>([])
|
|
|
+
|
|
|
+const form = reactive({
|
|
|
+ competency_tags: [] as any[],
|
|
|
+ /* clear_existing: true */
|
|
|
+})
|
|
|
+
|
|
|
+// 获取胜任力标签列表
|
|
|
+const fetchCompetencyList = async () => {
|
|
|
+ try {
|
|
|
+ const res = await api.GetCompetencyList({
|
|
|
+ page: 1,
|
|
|
+ limit: 1000
|
|
|
+ })
|
|
|
+ if (res.code === 2000 && res.data?.items) {
|
|
|
+ competencyOptions.value = res.data.items
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ console.error('获取胜任力标签列表失败:', error)
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+const open = async (selection: any[]) => {
|
|
|
+ selectedQuestions.value = selection.map(item => item.id)
|
|
|
+ // 打开对话框时获取最新的胜任力标签列表
|
|
|
+ await fetchCompetencyList()
|
|
|
+ dialogVisible.value = true
|
|
|
+}
|
|
|
+
|
|
|
+const addTag = () => {
|
|
|
+ form.competency_tags.push({
|
|
|
+ id: undefined,
|
|
|
+ weight: 100,
|
|
|
+ importance: 1,
|
|
|
+ remark: ''
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+const removeTag = (index: number) => {
|
|
|
+ form.competency_tags.splice(index, 1)
|
|
|
+}
|
|
|
+
|
|
|
+const handleSubmit = async () => {
|
|
|
+ // 验证是否选择了标签
|
|
|
+ if (form.competency_tags.some(tag => !tag.id)) {
|
|
|
+ ElMessage.warning('请选择胜任力标签')
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
+ try {
|
|
|
+ // 转换权重为小数形式
|
|
|
+ const formattedTags = form.competency_tags.map(tag => ({
|
|
|
+ ...tag,
|
|
|
+ weight: tag.weight // 将百分比转换为小数
|
|
|
+ }))
|
|
|
+
|
|
|
+ const res = await api.BatchUpdateCompetencyTags({
|
|
|
+ question_ids: selectedQuestions.value,
|
|
|
+ competency_tags: formattedTags, // 使用转换后的数据
|
|
|
+ tenant_id: 1
|
|
|
+ })
|
|
|
+
|
|
|
+ if (res.code === 2000) {
|
|
|
+ successMessage('批量更新胜任力标签成功')
|
|
|
+ dialogVisible.value = false
|
|
|
+ // 刷新列表
|
|
|
+ props.crudExpose.doRefresh()
|
|
|
+ // 重置表单
|
|
|
+ form.competency_tags = []
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ console.error('批量更新胜任力标签失败', error)
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+// 组件挂载时获取胜任力标签列表
|
|
|
+onMounted(() => {
|
|
|
+ fetchCompetencyList()
|
|
|
+})
|
|
|
+
|
|
|
+defineExpose({
|
|
|
+ open
|
|
|
+})
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+.el-input-number {
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.weight-input {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.percent-sign {
|
|
|
+ margin-left: 4px;
|
|
|
+}
|
|
|
+</style>
|