add
This commit is contained in:
parent
d5c4b4993f
commit
8954d28f4c
@ -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>
|
||||||
|
@ -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({
|
||||||
|
Loading…
x
Reference in New Issue
Block a user