106 lines
2.5 KiB
Vue
106 lines
2.5 KiB
Vue
|
|
<template>
|
||
|
|
<ContentWrap>
|
||
|
|
<el-form ref="formRef" :model="formData" :rules="formRules" label-width="80px">
|
||
|
|
<div v-for="taskAssignRule in props?.taskAssignRules" :key="taskAssignRule.taskDefinitionKey">
|
||
|
|
<el-divider content-position="left">{{ taskAssignRule?.taskDefinitionName }}</el-divider>
|
||
|
|
<el-form-item :label="taskAssignRule.taskDefinitionName+'候选人'"
|
||
|
|
:prop="taskAssignRule.taskDefinitionKey"
|
||
|
|
label-width="200">
|
||
|
|
<UserSelect
|
||
|
|
v-model="formData[taskAssignRule.taskDefinitionKey]"
|
||
|
|
:column="userSelectColumn"
|
||
|
|
:prop="taskAssignRule.taskDefinitionKey"
|
||
|
|
type="edit"
|
||
|
|
:func="(value)=>{console.log(JSON.stringify(value))}"
|
||
|
|
>
|
||
|
|
</UserSelect>
|
||
|
|
</el-form-item>
|
||
|
|
</div>
|
||
|
|
</el-form>
|
||
|
|
</ContentWrap>
|
||
|
|
</template>
|
||
|
|
<script lang="ts" setup>
|
||
|
|
// 从 UserSelect 组件导入 Column 类型
|
||
|
|
import type {Column} from '@/components/LowDesign/src/shareControl/UserSelect.vue'
|
||
|
|
|
||
|
|
// 定义组件选项
|
||
|
|
defineOptions({
|
||
|
|
name: "BpmTaskSelectAssigneeForm"
|
||
|
|
})
|
||
|
|
|
||
|
|
interface TaskAssignRule {
|
||
|
|
id: number
|
||
|
|
modelId: string
|
||
|
|
processDefinitionId: string
|
||
|
|
taskDefinitionKey: string
|
||
|
|
taskDefinitionName: string
|
||
|
|
type: number
|
||
|
|
options: number[]
|
||
|
|
}
|
||
|
|
|
||
|
|
const props = defineProps<{
|
||
|
|
taskAssignRules: TaskAssignRule[]
|
||
|
|
modelValue: {}
|
||
|
|
}>()
|
||
|
|
|
||
|
|
const formRef = ref()
|
||
|
|
const formData = ref(props.modelValue)
|
||
|
|
const formRules = ref({})
|
||
|
|
const userSelectColumn: Column = {
|
||
|
|
label: '候选人',
|
||
|
|
findType: 'all',
|
||
|
|
multiple: false,
|
||
|
|
columnKey: ['sex', 'post', 'deptName']
|
||
|
|
}
|
||
|
|
|
||
|
|
const emit = defineEmits(['updateModelValue'])
|
||
|
|
|
||
|
|
watch(
|
||
|
|
() => props.modelValue,
|
||
|
|
(val: {}) => {
|
||
|
|
formData.value = val
|
||
|
|
},
|
||
|
|
{
|
||
|
|
deep: true,
|
||
|
|
immediate: true,
|
||
|
|
}
|
||
|
|
)
|
||
|
|
|
||
|
|
watch(
|
||
|
|
() => formData.value,
|
||
|
|
(val: {}) => {
|
||
|
|
emit('updateModelValue', val)
|
||
|
|
},
|
||
|
|
{
|
||
|
|
deep: true,
|
||
|
|
immediate: true,
|
||
|
|
}
|
||
|
|
)
|
||
|
|
|
||
|
|
const validateAssignee = (successCallBack: () => void, failCallback: () => void) => {
|
||
|
|
formRef.value.validate((valid: boolean) => {
|
||
|
|
if (valid) successCallBack()
|
||
|
|
else failCallback()
|
||
|
|
})
|
||
|
|
}
|
||
|
|
|
||
|
|
defineExpose({validateAssignee})
|
||
|
|
|
||
|
|
// 初始化 formData
|
||
|
|
onMounted(() => {
|
||
|
|
if (props.taskAssignRules) {
|
||
|
|
props.taskAssignRules.forEach(rule => {
|
||
|
|
formData.value[rule.taskDefinitionKey] = ''
|
||
|
|
formRules.value[rule.taskDefinitionKey] = [
|
||
|
|
{
|
||
|
|
required: true,
|
||
|
|
message: '请选择候选人',
|
||
|
|
trigger: 'blur'
|
||
|
|
}
|
||
|
|
]
|
||
|
|
})
|
||
|
|
}
|
||
|
|
})
|
||
|
|
|
||
|
|
</script>
|