|
@@ -1,101 +1,104 @@
|
|
|
<template>
|
|
|
- <el-dialog v-model="state.dialogVisible" draggable title="工单重办" width="50%" append-to-body destroy-on-close @close="close">
|
|
|
- <div class="collapse-container">
|
|
|
- <el-form ref="ruleFormRef" :model="state.ruleForm">
|
|
|
- <el-row :gutter="35">
|
|
|
- <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
|
|
|
- <el-form-item label="退回节点" prop="nextStepCode" :rules="[{ required: true, message: '请选退回节点', trigger: 'change' }]">
|
|
|
- <el-select v-model="state.ruleForm.nextStepCode" placeholder="请选退回节点" class="w100" @change="selectNextCode">
|
|
|
- <el-option v-for="item in steps" :value="item.key" :key="item.key" :label="item.value"> </el-option>
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" v-if="state.ruleForm.nextStepCode">
|
|
|
- <el-form-item label="办理对象" prop="nextHandlers" :rules="[{ required: true, message: '请选择办理对象', trigger: 'change' }]">
|
|
|
- <el-select-v2
|
|
|
- v-model="state.ruleForm.nextHandlers"
|
|
|
- :options="handlerOptions"
|
|
|
- placeholder="请选择办理对象"
|
|
|
- class="w100"
|
|
|
- multiple
|
|
|
- clearable
|
|
|
- collapse-tags
|
|
|
- collapse-tags-tooltip
|
|
|
- filterable
|
|
|
- value-key="key"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12" v-if="isDepartment">
|
|
|
- <el-form-item
|
|
|
- label="延期"
|
|
|
- label-width="76px"
|
|
|
- prop="timeLimit"
|
|
|
- :rules="[{ required: false, message: '请填写延期申请数量', trigger: 'blur' }]"
|
|
|
- >
|
|
|
- <el-row :gutter="10">
|
|
|
- <el-col :xs="24" :sm="12" :md="12" :lg="16" :xl="16">
|
|
|
- <el-select
|
|
|
- v-model="state.ruleForm.timeLimit"
|
|
|
- placeholder="请选择延期数量"
|
|
|
- :rules="[{ required: true, message: '请选择延期数量', trigger: 'change' }]"
|
|
|
- clearable
|
|
|
- >
|
|
|
- <el-option v-for="item in delayOptions" :value="item.value" :key="item.value" :label="item.label" />
|
|
|
- </el-select>
|
|
|
- </el-col>
|
|
|
- <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
|
|
|
- <el-form-item label="" prop="timeLimitUnit" :rules="[{ required: true, message: '请选择延期申请单位', trigger: 'change' }]">
|
|
|
- <el-select v-model="state.ruleForm.timeLimitUnit" placeholder="延期申请单位" disabled>
|
|
|
- <el-option v-for="item in timeType" :value="item.key" :key="item.key" :label="item.value" />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
|
|
- <el-form-item label="错件类别" :rules="[{ required: true, message: '请选择错件类别', trigger: 'change' }]" prop="error">
|
|
|
- <el-row>
|
|
|
- <el-col :span="24" v-for="(item, index) in state.ruleForm.orgs" :key="item.id" class="mb18">
|
|
|
- <el-form-item :prop="`orgs.${index}.reason`" :rules="[{ required: true, message: '请选择错件类别', trigger: 'change' }]">
|
|
|
- <template #label>
|
|
|
- <el-checkbox v-model="item.choose" @change="selectError"> {{ item.value }}</el-checkbox>
|
|
|
- </template>
|
|
|
- <el-select
|
|
|
- v-model="item.reason"
|
|
|
- placeholder="请选择错件类别"
|
|
|
- value-key="dicDataValue"
|
|
|
- clearable
|
|
|
- @change="selectError"
|
|
|
- >
|
|
|
- <el-option v-for="items in reTransactErrorType" :key="items.dicDataValue" :label="items.dicDataName" :value="items" />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
|
|
- <el-form-item label="退回意见" prop="reason" :rules="[{ required: true, message: '请填写退回意见', trigger: 'blur' }]">
|
|
|
- <common-advice
|
|
|
- @chooseAdvice="chooseAdvice"
|
|
|
- v-model="state.ruleForm.reason"
|
|
|
- placeholder="请填写退回意见"
|
|
|
- :commonEnum="commonEnum.Seat"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </el-form>
|
|
|
- </div>
|
|
|
- <template #footer>
|
|
|
+ <el-dialog v-model="state.dialogVisible" draggable title="工单重办" width="50%" append-to-body destroy-on-close @close="close">
|
|
|
+ <div class="collapse-container">
|
|
|
+ <el-form ref="ruleFormRef" :model="state.ruleForm">
|
|
|
+ <el-row :gutter="35">
|
|
|
+ <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
|
|
|
+ <el-form-item label="退回节点" prop="nextStepCode" :rules="[{ required: true, message: '请选退回节点', trigger: 'change' }]">
|
|
|
+ <el-select v-model="state.ruleForm.nextStepCode" placeholder="请选退回节点" class="w100" @change="selectNextCode">
|
|
|
+ <el-option v-for="item in steps" :value="item.key" :key="item.key" :label="item.value"> </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" v-if="state.ruleForm.nextStepCode">
|
|
|
+ <el-form-item label="办理对象" prop="nextHandlers" :rules="[{ required: true, message: '请选择办理对象', trigger: 'change' }]">
|
|
|
+ <el-select-v2
|
|
|
+ v-model="state.ruleForm.nextHandlers"
|
|
|
+ :options="handlerOptions"
|
|
|
+ placeholder="请选择办理对象"
|
|
|
+ class="w100"
|
|
|
+ multiple
|
|
|
+ clearable
|
|
|
+ collapse-tags
|
|
|
+ collapse-tags-tooltip
|
|
|
+ filterable
|
|
|
+ value-key="key"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12" v-if="isDepartment">
|
|
|
+ <el-form-item
|
|
|
+ label="延期"
|
|
|
+ label-width="76px"
|
|
|
+ prop="timeLimit"
|
|
|
+ :rules="[{ required: false, message: '请填写延期申请数量', trigger: 'blur' }]"
|
|
|
+ >
|
|
|
+ <el-row :gutter="10">
|
|
|
+ <el-col :xs="24" :sm="12" :md="12" :lg="16" :xl="16">
|
|
|
+ <el-select
|
|
|
+ v-model="state.ruleForm.timeLimit"
|
|
|
+ placeholder="请选择延期数量"
|
|
|
+ :rules="[{ required: true, message: '请选择延期数量', trigger: 'change' }]"
|
|
|
+ clearable
|
|
|
+ >
|
|
|
+ <el-option v-for="item in delayOptions" :value="item.value" :key="item.value" :label="item.label" />
|
|
|
+ </el-select>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
|
|
|
+ <el-form-item label="" prop="timeLimitUnit" :rules="[{ required: true, message: '请选择延期申请单位', trigger: 'change' }]">
|
|
|
+ <el-select v-model="state.ruleForm.timeLimitUnit" placeholder="延期申请单位" disabled>
|
|
|
+ <el-option v-for="item in timeType" :value="item.key" :key="item.key" :label="item.value" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
|
|
+ <el-alert type="warning" class="mb18" show-icon>注意: 勾选后还需要选择类型 </el-alert>
|
|
|
+ <el-form-item label="错件类别" :rules="[{ required: true, message: '请选择错件类别', trigger: 'change' }]" prop="error">
|
|
|
+ <el-checkbox v-model="state.ruleForm.error" @change="selectError" style="display: none"></el-checkbox>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24" v-for="(item, index) in state.ruleForm.orgs" :key="item.id" class="mb18">
|
|
|
+ <el-form-item :prop="`orgs.${index}.reason`" :rules="[{ required: item.choose, message: '请选择错件类别', trigger: 'change' }]">
|
|
|
+ <template #label>
|
|
|
+ <el-checkbox v-model="item.choose" @change="selectError"> {{ item.value }}</el-checkbox>
|
|
|
+ </template>
|
|
|
+ <el-select
|
|
|
+ v-model="item.reason"
|
|
|
+ placeholder="请选择错件类别"
|
|
|
+ value-key="dicDataValue"
|
|
|
+ clearable
|
|
|
+ @change="selectError"
|
|
|
+ >
|
|
|
+ <el-option v-for="items in reTransactErrorType" :key="items.dicDataValue" :label="items.dicDataName" :value="items" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
|
|
+ <el-form-item label="退回意见" prop="reason" :rules="[{ required: true, message: '请填写退回意见', trigger: 'blur' }]">
|
|
|
+ <common-advice
|
|
|
+ @chooseAdvice="chooseAdvice"
|
|
|
+ v-model="state.ruleForm.reason"
|
|
|
+ placeholder="请填写退回意见"
|
|
|
+ :commonEnum="commonEnum.Seat"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <template #footer>
|
|
|
<span class="dialog-footer">
|
|
|
<el-button @click="closeDialog" class="default-button">取 消</el-button>
|
|
|
<el-button type="primary" @click="onSubmit(ruleFormRef)" :loading="state.loading">重办</el-button>
|
|
|
</span>
|
|
|
- </template>
|
|
|
- </el-dialog>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
</template>
|
|
|
<script setup lang="ts" name="SpecialDialog">
|
|
|
import { reactive, ref, defineAsyncComponent } from 'vue';
|
|
@@ -109,18 +112,18 @@ const CommonAdvice = defineAsyncComponent(() => import('@/components/CommonAdvic
|
|
|
const emit = defineEmits(['updateList']);
|
|
|
// 定义变量内容
|
|
|
const state = reactive<any>({
|
|
|
- dialogVisible: false, // 是否显示弹窗
|
|
|
- loading: false, // 是否显示加载
|
|
|
- ruleForm: {
|
|
|
- nextStepCode: null, // 退回节点
|
|
|
- reason: '', // 退回理由
|
|
|
- timeLimitUnit: 2,
|
|
|
- timeLimit: null,
|
|
|
- orgs: [],
|
|
|
- nextHandlers: [],
|
|
|
+ dialogVisible: false, // 是否显示弹窗
|
|
|
+ loading: false, // 是否显示加载
|
|
|
+ ruleForm: {
|
|
|
+ nextStepCode: null, // 退回节点
|
|
|
+ reason: '', // 退回理由
|
|
|
+ timeLimitUnit: 2,
|
|
|
+ timeLimit: null,
|
|
|
+ orgs: [],
|
|
|
+ nextHandlers: [],
|
|
|
stepType:null
|
|
|
- },
|
|
|
- orderDetail: {}, // 工单详情
|
|
|
+ },
|
|
|
+ orderDetail: {}, // 工单详情
|
|
|
});
|
|
|
const ruleFormRef = ref<RefType>();
|
|
|
const steps = ref<EmptyArrayType>([]); // 退回节点
|
|
@@ -128,123 +131,121 @@ const timeType = ref([]); // 时间单位
|
|
|
const reTransactErrorType = ref<EmptyArrayType>([]); // 错件类别
|
|
|
const handlerOptions = ref<EmptyArrayType>([]); // 办理对象
|
|
|
const delayOptions = ref([
|
|
|
- { value: 1, label: '1' },
|
|
|
- { value: 3, label: '3' },
|
|
|
- { value: 5, label: '5' },
|
|
|
+ { value: 1, label: '1' },
|
|
|
+ { value: 3, label: '3' },
|
|
|
+ { value: 5, label: '5' },
|
|
|
]); // 延期
|
|
|
/**
|
|
|
* @description 打开弹窗
|
|
|
* @param {object} val 工单详情
|
|
|
*/
|
|
|
const openDialog = async (val: any) => {
|
|
|
- state.orderDetail = val;
|
|
|
- state.workflowId = val.workflowId;
|
|
|
- state.loading = true;
|
|
|
- state.dialogVisible = true;
|
|
|
- try {
|
|
|
- const baseRes = await redoBaseData(val.id);
|
|
|
- timeType.value = baseRes.result?.specialTimeType ?? [];
|
|
|
- steps.value = baseRes.result?.step?.steps ?? [];
|
|
|
- reTransactErrorType.value = baseRes.result?.reTransactErrorType ?? [];
|
|
|
- state.ruleForm.orgs = baseRes.result?.orgs ?? [];
|
|
|
- } catch (e) {
|
|
|
- console.log(e);
|
|
|
- } finally {
|
|
|
- state.loading = false;
|
|
|
- }
|
|
|
+ state.orderDetail = val;
|
|
|
+ state.workflowId = val.workflowId;
|
|
|
+ state.loading = true;
|
|
|
+ state.dialogVisible = true;
|
|
|
+ try {
|
|
|
+ const baseRes = await redoBaseData(val.id);
|
|
|
+ timeType.value = baseRes.result?.specialTimeType ?? [];
|
|
|
+ steps.value = baseRes.result?.step?.steps ?? [];
|
|
|
+ reTransactErrorType.value = baseRes.result?.reTransactErrorType ?? [];
|
|
|
+ state.ruleForm.orgs = baseRes.result?.orgs ?? [];
|
|
|
+ } catch (e) {
|
|
|
+ console.log(e);
|
|
|
+ } finally {
|
|
|
+ state.loading = false;
|
|
|
+ }
|
|
|
};
|
|
|
// 关闭弹窗
|
|
|
const closeDialog = () => {
|
|
|
- state.dialogVisible = false;
|
|
|
+ state.dialogVisible = false;
|
|
|
};
|
|
|
const close = () => {
|
|
|
- ruleFormRef.value?.clearValidate();
|
|
|
- ruleFormRef.value?.resetFields();
|
|
|
- steps.value = [];
|
|
|
+ ruleFormRef.value?.clearValidate();
|
|
|
+ ruleFormRef.value?.resetFields();
|
|
|
+ steps.value = [];
|
|
|
};
|
|
|
// 选择退回节点
|
|
|
const isDepartment = ref<Boolean>(false); // 选择的退回节点是否是部门
|
|
|
const selectNextCode = (val: any) => {
|
|
|
- ruleFormRef.value?.resetFields('nextHandlers');
|
|
|
- ruleFormRef.value?.resetFields('nextMainHandler');
|
|
|
- const next = steps.value.find((item: any) => item.key === val);
|
|
|
- isDepartment.value = next.businessType === 2; // 如果是部门才可以选择延期
|
|
|
- const items = next.items; //获取下一节点
|
|
|
- state.ruleForm.nextStepName = next.value; // 下一节点name
|
|
|
- handlerOptions.value = items ?? [];
|
|
|
- state.ruleForm.businessType = next.businessType;
|
|
|
- state.ruleForm.flowDirection = next.flowDirection;
|
|
|
- state.ruleForm.handlerType = next.handlerType;
|
|
|
+ ruleFormRef.value?.resetFields('nextHandlers');
|
|
|
+ ruleFormRef.value?.resetFields('nextMainHandler');
|
|
|
+ const next = steps.value.find((item: any) => item.key === val);
|
|
|
+ isDepartment.value = next.businessType === 2; // 如果是部门才可以选择延期
|
|
|
+ const items = next.items; //获取下一节点
|
|
|
+ state.ruleForm.nextStepName = next.value; // 下一节点name
|
|
|
+ handlerOptions.value = items ?? [];
|
|
|
+ state.ruleForm.businessType = next.businessType;
|
|
|
+ state.ruleForm.flowDirection = next.flowDirection;
|
|
|
+ state.ruleForm.handlerType = next.handlerType;
|
|
|
state.ruleForm.stepType = next.stepType;
|
|
|
- console.log(state.ruleForm.stepType )
|
|
|
- handlerOptions.value = handlerOptions.value.map((item: any) => {
|
|
|
- return {
|
|
|
- value: {
|
|
|
- ...item,
|
|
|
- },
|
|
|
- label: item.value,
|
|
|
- };
|
|
|
- });
|
|
|
+ handlerOptions.value = handlerOptions.value.map((item: any) => {
|
|
|
+ return {
|
|
|
+ value: {
|
|
|
+ ...item,
|
|
|
+ },
|
|
|
+ label: item.value,
|
|
|
+ };
|
|
|
+ });
|
|
|
|
|
|
- if (items.length === 1) {
|
|
|
- // 如果办理对象只有一个默认选中
|
|
|
- state.ruleForm.nextHandlers = [items[0]];
|
|
|
- }
|
|
|
+ if (items.length === 1) {
|
|
|
+ // 如果办理对象只有一个默认选中
|
|
|
+ state.ruleForm.nextHandlers = [items[0]];
|
|
|
+ }
|
|
|
};
|
|
|
// 选择错件类别
|
|
|
const selectError = () => {
|
|
|
- state.ruleForm.error = state.ruleForm.orgs.find((item: any) => item.choose) ? true : null;
|
|
|
+ state.ruleForm.error = state.ruleForm.orgs.find((item: any) => item.choose) ? true : null;
|
|
|
};
|
|
|
// 提交
|
|
|
const onSubmit = (formEl: FormInstance | undefined) => {
|
|
|
- if (!formEl) return;
|
|
|
- formEl.validate((valid: boolean) => {
|
|
|
- if (!valid) return;
|
|
|
- state.loading = true;
|
|
|
- const reTransactError = state.ruleForm.orgs
|
|
|
- .filter((item: any) => item.choose)
|
|
|
- .map((item: any) => {
|
|
|
- return {
|
|
|
- orgId: item.key,
|
|
|
- orgName: item.value,
|
|
|
- errorId: item.reason.id,
|
|
|
- errorName: item.reason.dicDataName,
|
|
|
- };
|
|
|
- });
|
|
|
- const request = {
|
|
|
- workflowId: state.orderDetail.workflowId,
|
|
|
- orderId: state.orderDetail.id,
|
|
|
- nextStepCode: state.ruleForm.nextStepCode,
|
|
|
- nextStepName: state.ruleForm.nextStepName,
|
|
|
- nextHandlers: state.ruleForm.nextHandlers,
|
|
|
- reason: state.ruleForm.reason,
|
|
|
- timeLimit: state.ruleForm.timeLimit,
|
|
|
- timeLimitUnit: state.ruleForm.timeLimitUnit,
|
|
|
- alterTime: !!state.ruleForm.timeLimit,
|
|
|
- businessType: state.ruleForm.businessType,
|
|
|
- flowDirection: state.ruleForm.flowDirection,
|
|
|
- handlerType: state.ruleForm.handlerType,
|
|
|
- stepType: state.ruleForm.stepType,
|
|
|
- reTransactError,
|
|
|
- };
|
|
|
- redo(request)
|
|
|
- .then(() => {
|
|
|
- state.loading = false;
|
|
|
- closeDialog();
|
|
|
- emit('updateList');
|
|
|
- ElMessage.success('重办成功');
|
|
|
- })
|
|
|
- .catch(() => {
|
|
|
- state.loading = false;
|
|
|
- });
|
|
|
- });
|
|
|
+ if (!formEl) return;
|
|
|
+ formEl.validate((valid: boolean) => {
|
|
|
+ if (!valid) return;
|
|
|
+ state.loading = true;
|
|
|
+ const reTransactError = state.ruleForm.orgs
|
|
|
+ .filter((item: any) => item.choose)
|
|
|
+ .map((item: any) => {
|
|
|
+ return {
|
|
|
+ orgId: item.key,
|
|
|
+ orgName: item.value,
|
|
|
+ errorId: item.reason.id,
|
|
|
+ errorName: item.reason.dicDataName,
|
|
|
+ };
|
|
|
+ });
|
|
|
+ const request = {
|
|
|
+ workflowId: state.orderDetail.workflowId,
|
|
|
+ orderId: state.orderDetail.id,
|
|
|
+ nextStepCode: state.ruleForm.nextStepCode,
|
|
|
+ nextStepName: state.ruleForm.nextStepName,
|
|
|
+ nextHandlers: state.ruleForm.nextHandlers,
|
|
|
+ reason: state.ruleForm.reason,
|
|
|
+ timeLimit: state.ruleForm.timeLimit,
|
|
|
+ timeLimitUnit: state.ruleForm.timeLimitUnit,
|
|
|
+ alterTime: !!state.ruleForm.timeLimit,
|
|
|
+ businessType: state.ruleForm.businessType,
|
|
|
+ flowDirection: state.ruleForm.flowDirection,
|
|
|
+ handlerType: state.ruleForm.handlerType,
|
|
|
+ reTransactError,
|
|
|
+ };
|
|
|
+ redo(request)
|
|
|
+ .then(() => {
|
|
|
+ state.loading = false;
|
|
|
+ closeDialog();
|
|
|
+ emit('updateList');
|
|
|
+ ElMessage.success('重办成功');
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ state.loading = false;
|
|
|
+ });
|
|
|
+ });
|
|
|
};
|
|
|
// 选中常用意见
|
|
|
const chooseAdvice = (item: any) => {
|
|
|
- state.ruleForm.reason += item.content;
|
|
|
+ state.ruleForm.reason += item.content;
|
|
|
};
|
|
|
defineExpose({
|
|
|
- openDialog,
|
|
|
- closeDialog,
|
|
|
+ openDialog,
|
|
|
+ closeDialog,
|
|
|
});
|
|
|
</script>
|