<template>
|
<el-dialog
|
v-model="dialogVisible"
|
title="派发工单"
|
width="40%"
|
:close-on-click-modal="false"
|
@close="handleClose"
|
>
|
<el-form
|
:model="form"
|
:rules="rules"
|
ref="formRef"
|
label-width="100px"
|
@submit.prevent
|
>
|
<el-form-item label="选择部门" prop="department">
|
<el-tree-select
|
v-model="form.department"
|
placeholder="请选择部门"
|
:data="deptTreeData"
|
:props="treeProps"
|
:filterable="true"
|
:allow-clear="true"
|
:check-strictly="true"
|
@change="handleDepartmentChange"
|
class="full-width"
|
/>
|
</el-form-item>
|
<el-form-item label="选择处理人" prop="handler">
|
<el-select
|
filterable
|
v-model="form.handler"
|
placeholder="请选择处理人"
|
:disabled="!form.department"
|
class="full-width"
|
>
|
<el-option
|
v-for="user in availableHandlers"
|
:key="user.id"
|
:label="user.name"
|
:value="user.id"
|
/>
|
</el-select>
|
</el-form-item>
|
</el-form>
|
|
<template #footer>
|
<el-button @click="handleClose" icon="el-icon-circle-close">取消</el-button>
|
<el-button
|
type="primary"
|
:loading="loading"
|
@click="handleSubmit"
|
icon="el-icon-check"
|
>
|
确认派发
|
</el-button>
|
</template>
|
</el-dialog>
|
</template>
|
|
<script setup>
|
import { getDeptTree, getDeptLazyTree } from '@/api/system/dept'
|
import { ElMessage } from 'element-plus';
|
import { flowEvent } from '@/api/tickets/ticket';
|
import { onMounted } from 'vue';
|
const props = defineProps({
|
modelValue: {
|
type: Boolean,
|
default: false
|
},
|
currentDetail: {
|
type: Object,
|
default: () => ({})
|
},
|
|
departmentUsers: {
|
type: Object,
|
default: () => ({})
|
},
|
algorithms: {
|
type: Array,
|
default: () => []
|
},
|
types: {
|
type: Array,
|
default: () => []
|
}
|
});
|
const emit = defineEmits(['update:modelValue', 'dispatch-success', 'dispatch-error']);
|
const formRef = ref(null); // 表单引用
|
const loading = ref(false);
|
const form = ref({
|
department: '',
|
handler: ''
|
});
|
const deptTreeData =ref([])
|
// 树形选择器配置
|
const treeProps = ref({
|
value: 'id', // 对应部门数据的id字段（作为选中值）
|
label: 'name', // 对应部门数据的name字段（作为显示文本）
|
children: 'children' // 对应子部门字段
|
});
|
// 获取树形数据
|
const getDepartmentTree=() =>{
|
const tenantId = '000000'
|
getDeptTree(tenantId).then(res => {
|
deptTreeData.value = res.data.data
|
|
})
|
}
|
// 表单校验规则
|
const rules = ref({
|
department: [{ required: true, message: '请选择部门', trigger: 'change' }],
|
handler: [{ required: true, message: '请选择处理人', trigger: 'change' }]
|
});
|
const dialogVisible = computed({
|
get() {
|
return props.modelValue;
|
},
|
set(value) {
|
emit('update:modelValue', value);
|
}
|
});
|
|
// 处理人列表
|
const availableHandlers = computed(() => {
|
return form.value.department ? props.departmentUsers[form.value.department] || [] : [];
|
});
|
watch(
|
() => props.modelValue,
|
(newVal) => {
|
if (newVal) {
|
resetForm();
|
}
|
},
|
{ immediate: true }
|
);
|
|
// 重置表单
|
const resetForm = () => {
|
form.value = {
|
department: '',
|
handler: ''
|
};
|
if (formRef.value) {
|
formRef.value.clearValidate();
|
}
|
};
|
|
// 关闭对话框
|
const handleClose = () => {
|
dialogVisible.value = false;
|
resetForm();
|
};
|
|
// 部门切换时清空处理人
|
const handleDepartmentChange = () => {
|
form.value.handler = '';
|
};
|
|
// 验证必填字段（currentDetail 中的必填项）
|
const validateRequiredFields = () => {
|
if (!props.currentDetail.orderName || !props.currentDetail.orderName.trim()) {
|
ElMessage.warning('请填写工单名称');
|
return false;
|
}
|
if (!props.currentDetail.type) {
|
ElMessage.warning('请选择工单类型');
|
return false;
|
}
|
if (!props.currentDetail.content || !props.currentDetail.content.trim()) {
|
ElMessage.warning('请填写工单内容');
|
return false;
|
}
|
return true;
|
};
|
|
// 获取算法值
|
const getAlgorithmValue = () => {
|
const { aiType } = props.currentDetail;
|
// 检查是否直接匹配 value
|
const isValueMatch = props.algorithms.some(item => item.value === aiType);
|
if (isValueMatch) {
|
return aiType;
|
}
|
// 尝试匹配 dict_value 或 label
|
const matched = props.algorithms.find(
|
item => item.dict_value === aiType || item.label === aiType
|
);
|
return matched ? matched.value : null;
|
};
|
|
// 提交派发
|
const handleSubmit = async () => {
|
try {
|
const valid = await formRef.value.validate();
|
if (!valid) return;
|
if (!validateRequiredFields()) {
|
return;
|
}
|
|
loading.value = true;
|
const algorithmValue = getAlgorithmValue();
|
const data = {
|
id: props.currentDetail.id,
|
status: props.currentDetail.status,
|
isPass: 0, // 0 表示通过
|
eventName: props.currentDetail.orderName,
|
eventNum: props.currentDetail.orderNumber,
|
workOrderTypeDictKey: props.currentDetail.type,
|
content: props.currentDetail.content,
|
createDept: form.value.department,
|
updateUser: form.value.handler,
|
aiType: algorithmValue,
|
};
|
|
// 发送请求
|
const response = await flowEvent(data);
|
if (response.data.code === 0) {
|
ElMessage.success('工单已成功派发');
|
emit('dispatch-success');
|
handleClose();
|
} else {
|
throw new Error(response.data.msg || '派发失败');
|
}
|
} catch (error) {
|
console.error('派发失败:', error);
|
emit('dispatch-error', error);
|
ElMessage.error(error.message || '派发失败，请稍后重试');
|
} finally {
|
loading.value = false;
|
}
|
};
|
onMounted(()=>{
|
getDepartmentTree()
|
})
|
</script>
|
<style scoped>
|
.full-width {
|
width: 100%;
|
}
|
.el-form {
|
margin-top: 20px;}
|
</style>
|
