This commit is contained in:
zmj 2024-01-31 23:15:12 +08:00
parent d5c4b4993f
commit 8954d28f4c
2 changed files with 129 additions and 70 deletions

View File

@ -10,20 +10,23 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<el-form-item label="审批类型" prop="flow_cate"> <el-form-item label="审批分类" prop="flow_cate">
<!-- <el-select v-model="formData.flow_cate" placeholder="审批类型" clearable <el-select class="flex-1" v-model="formData.type" clearable placeholder="请选择所属分类"
:style="{ width: '100%' }"> @change="getFlowTypeList">
<el-option label="日常审批" :value="1"></el-option>
<el-option label="报销审批" :value="2"></el-option>
<el-option label="发票审批" :value="3"></el-option>
<el-option label="合同审批" :value="4"></el-option>
</el-select> -->
<el-select class="flex-1" v-model="formData.flow_cate" clearable placeholder="请选择所属分类">
<el-option v-for="(item, index) in dictData.flow_type" :key="index" :label="item.name" <el-option v-for="(item, index) in dictData.flow_type" :key="index" :label="item.name"
:value="parseInt(item.value)" /> :value="parseInt(item.value)" />
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8">
<el-form-item label="审批类型" prop="flow_cate">
<el-select class="flex-1" v-model="formData.flow_cate" :disabled="!formData.type" clearable
placeholder="请选择审批类型">
<el-option v-for="(item, index) in flowTypeList" :key="index" :label="item.title"
:value="parseInt(item.id)" />
</el-select>
</el-form-item>
</el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col> <el-col>
@ -43,37 +46,50 @@
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
</el-col> </el-col>
<p v-if="formData.flow_detail.type == 1"> <p v-if="formData.check_type == 1">
<el-row v-for="(item, index) in formData.flow_detail.step"> <el-row v-for="(item, index) in formData.flow_list">
<el-col :span="12"> <el-col :span="8">
<el-form-item label="审批流程"> <el-form-item label="审批流程">
<el-select v-model="formData.flow_detail.step[index].type" placeholder="审批类型" clearable <el-select v-model="item.flow_step" placeholder="审批类型" @change="clearFlowUser(index)"
:style="{ width: '100%' }"> clearable :style="{ width: '100%' }">
<el-option label="当前部门负责人" value="1"></el-option> <el-option :value="item.value" :label="item.name"
<el-option label="上一级部门负责人" value="2"></el-option> v-for="(item, index) in dictData.flow_step_flow_type"></el-option>
<el-option label="指定用户(任意一人)" value="3"></el-option>
<el-option label="指定用户(多人会签)" value="4"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12" v-if="item.type == '3' || item.type == '4'"> <el-col :span="12" v-if="item.flow_step == '3' || item.flow_step == '2'">
<el-form-item label="指定人员"> <el-form-item label="指定人员">
<el-input clearable v-model="item.user[0].name" placeholder="指定人员" @click="openDialog" /> <el-tag v-for="(tag, i) in item.flow_user" @close="item.flow_user.splice(i, 1)"
:key="tag.id" class="mx-1" closable>
{{ tag.name }}
</el-tag>
<el-button type="primary" @click="openDialog(index)">
选择人员
</el-button>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="4">
<el-button @click="formData.flow_list.splice(index, 1)">
删除
</el-button>
</el-col>
</el-row> </el-row>
<el-col :span="24"> <el-col :span="24">
<el-form-item prop="field126"> <el-form-item prop="field126">
<el-button type="primary" @click=" <el-button type="primary" @click="
formData.flow_detail.step.push({ formData.flow_list.push(
type: '', {
user: [{ id: '', name: '' }], flow_step: '',
}) flow_user: []
}
)
">其他联系人</el-button> ">其他联系人</el-button>
</el-form-item> </el-form-item>
</el-col> </el-col>
</p> </p>
<el-row v-if="formData.flow_detail.type == 2"> <el-row v-if="formData.check_type == 2">
<el-col :span="12"> <el-col :span="12">
<el-form-item label=""> <el-form-item label="">
<span>无需审批</span> <span>无需审批</span>
@ -81,39 +97,58 @@
</el-col> </el-col>
</el-row> </el-row>
<p v-if="formData.flow_detail.type == 3"> <p v-if="formData.check_type == 3">
<el-row v-for="(item, index) in formData.flow_detail.step"> <el-row v-for="(item, index) in formData.flow_list">
<el-col :span="12"> <el-col :span="8">
<el-form-item label="审批流程" prop="copy_uids"> <el-form-item label="审批流程" prop="copy_uids">
<el-input v-model="item.type" clearable placeholder="请输入流程名称"> <el-input v-model="item.flow_step" clearable placeholder="请输入流程名称">
</el-input> </el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="指定人员"> <el-form-item label="指定人员">
<el-input v-model="item.user[0].name" @click="openDialog" readonly clearable <el-tag v-for="(tag, i) in item.flow_user" @close="item.flow_user.splice(i, 1)"
placeholder="指定人员" /> :key="tag.id" class="mx-1" closable>
{{ tag.name }}
</el-tag>
<el-button type="primary" @click="openDialog(index)">
选择人员
</el-button>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="4">
<el-button @click="formData.flow_list.splice(index, 1)">
删除
</el-button>
</el-col>
</el-row> </el-row>
<el-col :span="24"> <el-col :span="24">
<el-form-item prop="field126"> <el-form-item prop="field126">
<el-button type="primary" @click=" <el-button type="primary" @click="
formData.flow_detail.step.push({ formData.flow_list.push(
type: '', {
user: [{ id: '', name: '' }], flow_step: '',
}) flow_user: []
}
)
">其他联系人</el-button> ">其他联系人</el-button>
</el-form-item> </el-form-item>
</el-col> </el-col>
</p> </p>
<el-form-item label="抄送人ID" prop="copy_unames"> <el-form-item label="抄送人ID" prop="copy_unames">
<el-input v-model="formData.copy_to[0].name" clearable @click="openDialog" placeholder="请输入抄送人" /> <el-tag v-for="(tag, index) in formData.copy_uids" @close="formData.copy_uids.splice(index, 1)"
:key="tag.id" class="mx-1" closable>
{{ tag.name }}
</el-tag>
<el-button type="primary" @click="openDialog(-1)">
选择人员
</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
</popup> </popup>
<personnelSelector ref="personnel" @confirm="submituser" />
<personnelSelector v-if="showDiolg" ref="personnel" @confirm="submituser" />
</div> </div>
</template> </template>
@ -132,13 +167,12 @@ defineProps({
default: () => ({}), default: () => ({}),
}, },
}); });
const personnel = ref('') const personnel = ref('')
const isCompany = ref(false);
const emit = defineEmits(["success", "close"]); const emit = defineEmits(["success", "close"]);
const formRef = shallowRef<FormInstance>(); const formRef = shallowRef<FormInstance>();
const popupRef = shallowRef<InstanceType<typeof Popup>>(); const popupRef = shallowRef<InstanceType<typeof Popup>>();
const mode = ref("add"); const mode = ref("add");
const showDiolg = ref(false)
// //
const popupTitle = computed(() => { const popupTitle = computed(() => {
@ -153,30 +187,40 @@ const formData = reactive({
type: "", type: "",
flow_cate: "", flow_cate: "",
remark: "", remark: "",
flow_detail: { type: "",
type: 1,
step: [{ type: "", user: [{ id: "", name: "" }] }],
},
copy_to: [{ id: "", name: "" }],
// "name": "",
// "flow_cate": "",
// "check_type": "",
// "remark": "",
"flow_list": [ "flow_list": [
{
"flow_step": ""
},
{ {
"flow_step": "", "flow_step": "",
"flow_user": [] "flow_user": []
} },
], ],
"copy_uids": [] "copy_uids": []
}); });
//
const flowTypeList = reactive([])
const getFlowTypeList = async () => {
if (!formData.type) return
let res = await apiFlowTypeLists({
type: formData.type,
status: 2
})
Object.assign(flowTypeList, res.lists)
}
// //
const checkTypeFn = () => { const checkTypeFn = () => {
formData.flow_detail.step = [{ type: "", user: [{ id: "", name: "" }] }]; formData.flow_list = [
{
"flow_step": "",
"flow_user": []
},
]
}; };
// //
const formRules = reactive<any>({ const formRules = reactive<any>({
@ -223,38 +267,49 @@ const formRules = reactive<any>({
// //
const setFormData = async (data: Record<any, any>) => { const setFormData = async (data: Record<any, any>) => {
// let res = await apiFlowDetil(data.id); // let res = await apiFlowDetil(data.id);
console.log(data)
for (const key in formData) { for (const key in formData) {
if (data[key] != null && data[key] != undefined) { if (data[key] != null && data[key] != undefined) {
//@ts-ignore //@ts-ignore
formData[key] = res[key]; formData[key] = data[key];
} }
} }
formData.flow_detail.type = Number(formData.flow_detail.type); formData.flow_detail.type = Number(formData.flow_detail.type);
}; };
const getDetail = async (row: Record<string, any>) => {
// const data = await apiFlowDetail({
// id: row.id,
// });
// setFormData(data);
};
const a = {};
// //
const handleSubmit = async () => { const handleSubmit = async () => {
formData.copy_uids = [].concat(...formData.copy_uids.map(item => ([item.id])));
formData.flow_list.forEach(item => {
item.flow_user = [].concat(...item.flow_user.map(items => ([items.id])));
});
console.log(formData)
return
await formRef.value?.validate(); await formRef.value?.validate();
// mode.value == "edit" mode.value == "edit"
// ? await apiFlowCreat(formData) ? await apiFlowEdit(formData)
// : await apiFlowCreat(formData); : await apiFlowAdd(formData);
popupRef.value?.close(); popupRef.value?.close();
emit("success"); emit("success");
}; };
const submituser = (e) => { const submituser = (e) => {
console.log(e, "e")
if (selectIndex == -1) {
formData.copy_uids = e.map(item => ({ id: item.id, name: item.name }))
} else {
formData.flow_list[selectIndex].flow_user = e.map(item => ({ id: item.id, name: item.name }))
}
showDiolg.value = false
}
const clearFlowUser = (index) => {
formData.flow_list[index].flow_user = []
} }
// //
@ -268,13 +323,17 @@ const handleClose = () => {
emit("close"); emit("close");
}; };
const openDialog = () => { // selectIndex-1
let selectIndex;
const openDialog = async (index) => {
showDiolg.value = true
await nextTick()
personnel.value?.open() personnel.value?.open()
selectIndex = index
} }
defineExpose({ defineExpose({
open, open,
setFormData, setFormData,
getDetail,
}); });
</script> </script>

View File

@ -71,7 +71,7 @@ const handleSelectionChange = (val: any[]) => {
}; };
// //
const { dictData } = useDictData('flow_type') const { dictData } = useDictData('flow_type,flow_step_flow_type')
// //
const { pager, getLists, resetParams, resetPage } = usePaging({ const { pager, getLists, resetParams, resetPage } = usePaging({