Merge remote-tracking branch 'origin/master'
This commit is contained in:
@@ -1,160 +1,144 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class='default-main'>
|
<div class="default-main">
|
||||||
<!--返回按钮-->
|
<!--返回按钮-->
|
||||||
<back-component style='margin: 8px;position: absolute;z-index: 10;top: -3px;right: 2px' />
|
<back-component style="margin: 8px; position: absolute; z-index: 10; top: -3px; right: 2px" />
|
||||||
<el-tabs type='border-card' v-model='tab'>
|
<el-tabs type="border-card" v-model="tab">
|
||||||
<el-tab-pane label='流程审核' name='流程审核' v-if='runningTasks.length>0'>
|
<el-tab-pane label="流程审核" name="流程审核" v-if="runningTasks.length > 0">
|
||||||
<el-card
|
<el-card
|
||||||
v-for='(item, index) in runningTasks'
|
v-for="(item, index) in runningTasks"
|
||||||
:key='index'
|
:key="index"
|
||||||
v-loading='processInstanceLoading'
|
v-loading="processInstanceLoading"
|
||||||
class='box-card'
|
class="box-card"
|
||||||
>
|
>
|
||||||
<template #header>
|
<template #header>
|
||||||
<span class='el-icon-picture-outline'>当前任务【{{ item.name }}】</span>
|
<span class="el-icon-picture-outline">当前任务【{{ item.name }}】</span>
|
||||||
</template>
|
</template>
|
||||||
<el-col :offset='6' :span='16'>
|
<el-col :offset="6" :span="16">
|
||||||
<el-form
|
<el-form
|
||||||
:ref="'form' + index"
|
:ref="'form' + index"
|
||||||
:model='auditForms[index]'
|
:model="auditForms[index]"
|
||||||
:rules='auditRule'
|
:rules="auditRule"
|
||||||
label-width='100px'
|
label-width="100px"
|
||||||
>
|
>
|
||||||
<el-form-item v-if='processInstance && processInstance.name' label='流程名'>
|
<el-form-item v-if="processInstance && processInstance.name" label="流程名">
|
||||||
{{ processInstance.name }}
|
{{ processInstance.name }}
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item v-if='processInstance && processInstance.startUser' label='发起人'>
|
<el-form-item v-if="processInstance && processInstance.startUser" label="发起人">
|
||||||
{{ processInstance?.startUser.name }}
|
{{ processInstance?.startUser.name }}
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item v-if='processInstance && processInstance.startUser' label='发起部门'>
|
<el-form-item v-if="processInstance && processInstance.startUser" label="发起部门">
|
||||||
{{ processInstance?.startUser.deptName }}
|
{{ processInstance?.startUser.deptName }}
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
||||||
<el-card v-if='runningTasks[index].formId != null' class='mb-15px !-mt-10px'>
|
<el-card v-if="runningTasks[index].formId != null" class="mb-15px !-mt-10px">
|
||||||
<template #header>
|
<template #header>
|
||||||
<span class='el-icon-picture-outline'>
|
<span class="el-icon-picture-outline">
|
||||||
{{ runningTasks[index]?.formName }}
|
{{ runningTasks[index]?.formName }}
|
||||||
</span>
|
</span>
|
||||||
</template>
|
</template>
|
||||||
<form-create
|
<form-create
|
||||||
v-model='approveForms[index].value'
|
v-model="approveForms[index].value"
|
||||||
v-model:api='approveFormFApis[index]'
|
v-model:api="approveFormFApis[index]"
|
||||||
:option='approveForms[index].option'
|
:option="approveForms[index].option"
|
||||||
:rule='approveForms[index].rule'
|
:rule="approveForms[index].rule"
|
||||||
|
/>
|
||||||
|
</el-card>
|
||||||
|
|
||||||
|
<el-form-item label="审批建议" prop="reason" style="margin-top: 15px">
|
||||||
|
<el-input
|
||||||
|
v-model="auditForms[index].reason"
|
||||||
|
placeholder="请输入审批建议"
|
||||||
|
type="textarea"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<!-- <el-form-item label='抄送人' prop='copyUserIds'>-->
|
||||||
|
<!-- <el-select v-model='auditForms[index].copyUserIds' multiple placeholder='请选择抄送人'>-->
|
||||||
|
<!-- <el-option-->
|
||||||
|
<!-- v-for='item in userOptions'-->
|
||||||
|
<!-- :key='item.id'-->
|
||||||
|
<!-- :label='item.nickname'-->
|
||||||
|
<!-- :value='item.id'-->
|
||||||
|
<!-- />-->
|
||||||
|
<!-- </el-select>-->
|
||||||
|
<!-- </el-form-item>-->
|
||||||
|
</el-form>
|
||||||
|
<div style="margin-bottom: 20px; margin-left: 10%; font-size: 14px">
|
||||||
|
<el-button type="success" :icon="Select" @click="handleAudit(item, true)">通过</el-button>
|
||||||
|
|
||||||
|
<el-button type="danger" :icon="Close" @click="handleAudit(item, false)">不通过</el-button>
|
||||||
|
|
||||||
|
<!-- <el-button type='primary' @click='openTaskUpdateAssigneeForm(item.id)'>-->
|
||||||
|
<!-- <Icon icon='ep:edit' />-->
|
||||||
|
<!-- 转办-->
|
||||||
|
<!-- </el-button>-->
|
||||||
|
<!-- <el-button type='primary' @click='handleDelegate(item)'>-->
|
||||||
|
<!-- <Icon icon='ep:position' />-->
|
||||||
|
<!-- 委派-->
|
||||||
|
<!-- </el-button>-->
|
||||||
|
<!-- <el-button type='primary' @click='handleSign(item)'>-->
|
||||||
|
<!-- <Icon icon='ep:plus' />-->
|
||||||
|
<!-- 加签-->
|
||||||
|
<!-- </el-button>-->
|
||||||
|
|
||||||
|
<el-button type="warning" :icon="Back" @click="handleBack(item)">回退</el-button>
|
||||||
|
</div>
|
||||||
|
</el-col>
|
||||||
|
</el-card>
|
||||||
|
</el-tab-pane>
|
||||||
|
<el-tab-pane label="申请信息" name="申请信息">
|
||||||
|
<!-- 申请信息 -->
|
||||||
|
<el-card v-loading="processInstanceLoading" class="box-card">
|
||||||
|
<template #header>
|
||||||
|
<span class="el-icon-document">申请信息【{{ processInstance.name }}】</span>
|
||||||
|
</template>
|
||||||
|
<!-- 情况一:流程表单 -->
|
||||||
|
<el-col v-if="processInstance?.processDefinition?.formType === 10" :offset="6" :span="16">
|
||||||
|
<form-create
|
||||||
|
v-model="detailForm.value"
|
||||||
|
v-model:api="fApi"
|
||||||
|
:option="detailForm.option"
|
||||||
|
:rule="detailForm.rule"
|
||||||
|
/>
|
||||||
|
</el-col>
|
||||||
|
<!-- 情况二:业务表单 -->
|
||||||
|
<div v-if="processInstance?.processDefinition?.formType === 20">
|
||||||
|
<BusinessFormComponent :id="processInstance.businessKey" :applyTitle="processInstance.name" />
|
||||||
|
</div>
|
||||||
|
</el-card>
|
||||||
|
</el-tab-pane>
|
||||||
|
<el-tab-pane label="审批记录" name="审批记录">
|
||||||
|
<!-- 审批记录 -->
|
||||||
|
<ProcessInstanceTaskList
|
||||||
|
:loading="tasksLoad"
|
||||||
|
:process-instance="processInstance"
|
||||||
|
:tasks="tasks"
|
||||||
|
@refresh="getTaskList"
|
||||||
/>
|
/>
|
||||||
</el-card>
|
</el-tab-pane>
|
||||||
|
<!-- <el-tab-pane label='流程图'>-->
|
||||||
<el-form-item label='审批建议' prop='reason' style='margin-top: 15px'>
|
<!-- <!– 高亮流程图 –>-->
|
||||||
<el-input
|
<!-- <!– <ProcessInstanceBpmnViewer–>-->
|
||||||
v-model='auditForms[index].reason'
|
<!-- <!– :id="`${id}`"–>-->
|
||||||
placeholder='请输入审批建议'
|
<!-- <!– :bpmn-xml="bpmnXml"–>-->
|
||||||
type='textarea'
|
<!-- <!– :loading="processInstanceLoading"–>-->
|
||||||
/>
|
<!-- <!– :process-instance="processInstance"–>-->
|
||||||
</el-form-item>
|
<!-- <!– :tasks="tasks"–>-->
|
||||||
<!-- <el-form-item label='抄送人' prop='copyUserIds'>-->
|
<!-- <!– />–></el-tab-pane>-->
|
||||||
<!-- <el-select v-model='auditForms[index].copyUserIds' multiple placeholder='请选择抄送人'>-->
|
</el-tabs>
|
||||||
<!-- <el-option-->
|
<ContentWrap>
|
||||||
<!-- v-for='item in userOptions'-->
|
<!-- 弹窗:转派审批人 -->
|
||||||
<!-- :key='item.id'-->
|
<TaskTransferForm ref="taskTransferFormRef" @success="getDetail" />
|
||||||
<!-- :label='item.nickname'-->
|
<!-- 弹窗:回退节点 -->
|
||||||
<!-- :value='item.id'-->
|
<TaskReturnForm ref="taskReturnFormRef" @success="getDetail" />
|
||||||
<!-- />-->
|
<!-- 弹窗:委派,将任务委派给别人处理,处理完成后,会重新回到原审批人手中-->
|
||||||
<!-- </el-select>-->
|
<TaskDelegateForm ref="taskDelegateForm" @success="getDetail" />
|
||||||
<!-- </el-form-item>-->
|
<!-- 弹窗:加签,当前任务审批人为A,向前加签选了一个C,则需要C先审批,然后再是A审批,向后加签B,A审批完,需要B再审批完,才算完成这个任务节点 -->
|
||||||
</el-form>
|
<TaskSignCreateForm ref="taskSignCreateFormRef" @success="getDetail" />
|
||||||
<div style='margin-bottom: 20px; margin-left: 10%; font-size: 14px'>
|
</ContentWrap>
|
||||||
|
</div>
|
||||||
<el-button
|
|
||||||
type='success'
|
|
||||||
:icon='Select'
|
|
||||||
@click='handleAudit(item, true)'
|
|
||||||
>通过
|
|
||||||
</el-button>
|
|
||||||
|
|
||||||
<el-button
|
|
||||||
type='danger'
|
|
||||||
:icon='Close'
|
|
||||||
@click='handleAudit(item, false)'
|
|
||||||
>不通过
|
|
||||||
</el-button>
|
|
||||||
|
|
||||||
<!-- <el-button type='primary' @click='openTaskUpdateAssigneeForm(item.id)'>-->
|
|
||||||
<!-- <Icon icon='ep:edit' />-->
|
|
||||||
<!-- 转办-->
|
|
||||||
<!-- </el-button>-->
|
|
||||||
<!-- <el-button type='primary' @click='handleDelegate(item)'>-->
|
|
||||||
<!-- <Icon icon='ep:position' />-->
|
|
||||||
<!-- 委派-->
|
|
||||||
<!-- </el-button>-->
|
|
||||||
<!-- <el-button type='primary' @click='handleSign(item)'>-->
|
|
||||||
<!-- <Icon icon='ep:plus' />-->
|
|
||||||
<!-- 加签-->
|
|
||||||
<!-- </el-button>-->
|
|
||||||
|
|
||||||
<el-button
|
|
||||||
type='warning'
|
|
||||||
:icon='Back'
|
|
||||||
@click='handleBack(item)'
|
|
||||||
>回退
|
|
||||||
</el-button>
|
|
||||||
</div>
|
|
||||||
</el-col>
|
|
||||||
</el-card>
|
|
||||||
</el-tab-pane>
|
|
||||||
<el-tab-pane label='申请信息' name='申请信息'>
|
|
||||||
<!-- 申请信息 -->
|
|
||||||
<el-card v-loading='processInstanceLoading' class='box-card'>
|
|
||||||
<template #header>
|
|
||||||
<span class='el-icon-document'>申请信息【{{ processInstance.name }}】</span>
|
|
||||||
</template>
|
|
||||||
<!-- 情况一:流程表单 -->
|
|
||||||
<el-col v-if='processInstance?.processDefinition?.formType === 10' :offset='6' :span='16'>
|
|
||||||
<form-create
|
|
||||||
v-model='detailForm.value'
|
|
||||||
v-model:api='fApi'
|
|
||||||
:option='detailForm.option'
|
|
||||||
:rule='detailForm.rule'
|
|
||||||
/>
|
|
||||||
</el-col>
|
|
||||||
<!-- 情况二:业务表单 -->
|
|
||||||
<div v-if='processInstance?.processDefinition?.formType === 20'>
|
|
||||||
<BusinessFormComponent :id='processInstance.businessKey' :applyTitle='processInstance.name' />
|
|
||||||
</div>
|
|
||||||
</el-card>
|
|
||||||
</el-tab-pane>
|
|
||||||
<el-tab-pane label='审批记录' name='审批记录'>
|
|
||||||
<!-- 审批记录 -->
|
|
||||||
<ProcessInstanceTaskList
|
|
||||||
:loading='tasksLoad'
|
|
||||||
:process-instance='processInstance'
|
|
||||||
:tasks='tasks'
|
|
||||||
@refresh='getTaskList'
|
|
||||||
/>
|
|
||||||
</el-tab-pane>
|
|
||||||
<!-- <el-tab-pane label='流程图'>-->
|
|
||||||
<!-- <!– 高亮流程图 –>-->
|
|
||||||
<!-- <!– <ProcessInstanceBpmnViewer–>-->
|
|
||||||
<!-- <!– :id="`${id}`"–>-->
|
|
||||||
<!-- <!– :bpmn-xml="bpmnXml"–>-->
|
|
||||||
<!-- <!– :loading="processInstanceLoading"–>-->
|
|
||||||
<!-- <!– :process-instance="processInstance"–>-->
|
|
||||||
<!-- <!– :tasks="tasks"–>-->
|
|
||||||
<!-- <!– />–></el-tab-pane>-->
|
|
||||||
</el-tabs>
|
|
||||||
<ContentWrap>
|
|
||||||
<!-- 弹窗:转派审批人 -->
|
|
||||||
<TaskTransferForm ref='taskTransferFormRef' @success='getDetail' />
|
|
||||||
<!-- 弹窗:回退节点 -->
|
|
||||||
<TaskReturnForm ref='taskReturnFormRef' @success='getDetail' />
|
|
||||||
<!-- 弹窗:委派,将任务委派给别人处理,处理完成后,会重新回到原审批人手中-->
|
|
||||||
<TaskDelegateForm ref='taskDelegateForm' @success='getDetail' />
|
|
||||||
<!-- 弹窗:加签,当前任务审批人为A,向前加签选了一个C,则需要C先审批,然后再是A审批,向后加签B,A审批完,需要B再审批完,才算完成这个任务节点 -->
|
|
||||||
<TaskSignCreateForm ref='taskSignCreateFormRef' @success='getDetail' />
|
|
||||||
</ContentWrap>
|
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
<script lang='ts' setup>
|
<script lang="ts" setup>
|
||||||
import { onMounted, provide, ref, getCurrentInstance, reactive, watch, unref, nextTick } from 'vue'
|
import { onMounted, provide, ref, getCurrentInstance, reactive, watch, unref, nextTick ,markRaw} from 'vue'
|
||||||
import { ElMessage } from 'element-plus'
|
import { ElMessage } from 'element-plus'
|
||||||
import { useUserStore } from '@/stores/modules/user'
|
import { useUserStore } from '@/stores/modules/user'
|
||||||
import ContentWrap from '@/components/ContentWrap/src/ContentWrap.vue'
|
import ContentWrap from '@/components/ContentWrap/src/ContentWrap.vue'
|
||||||
@@ -181,11 +165,10 @@ defineOptions({ name: 'BpmProcessInstanceDetail' })
|
|||||||
const { query } = useRoute() // 查询参数
|
const { query } = useRoute() // 查询参数
|
||||||
const { proxy } = getCurrentInstance() as any
|
const { proxy } = getCurrentInstance() as any
|
||||||
|
|
||||||
const userId = JSON.parse(window.localStorage.getItem('adminInfo')).id// 当前登录的编号
|
const userId = JSON.parse(window.localStorage.getItem('adminInfo')).id // 当前登录的编号
|
||||||
|
|
||||||
|
|
||||||
const id = query.id as unknown as string // 流程实例的编号
|
const id = query.id as unknown as string // 流程实例的编号
|
||||||
const todo = query.todo// 是否存在待办事项
|
const todo = query.todo // 是否存在待办事项
|
||||||
const processInstanceLoading = ref(false) // 流程实例的加载中
|
const processInstanceLoading = ref(false) // 流程实例的加载中
|
||||||
const processInstance = ref({}) // 流程实例
|
const processInstance = ref({}) // 流程实例
|
||||||
const bpmnXml = ref('') // BPMN XML
|
const bpmnXml = ref('') // BPMN XML
|
||||||
@@ -195,7 +178,7 @@ const tasks = ref<any[]>([]) // 任务列表
|
|||||||
const runningTasks = ref<any[]>([]) // 运行中的任务
|
const runningTasks = ref<any[]>([]) // 运行中的任务
|
||||||
const auditForms = ref<any[]>([]) // 审批任务的表单
|
const auditForms = ref<any[]>([]) // 审批任务的表单
|
||||||
const auditRule = reactive({
|
const auditRule = reactive({
|
||||||
reason: [{ required: true, message: '审批建议不能为空', trigger: 'blur' }]
|
reason: [{ required: true, message: '审批建议不能为空', trigger: 'blur' }]
|
||||||
})
|
})
|
||||||
const approveForms = ref<any[]>([]) // 审批通过时,额外的补充信息
|
const approveForms = ref<any[]>([]) // 审批通过时,额外的补充信息
|
||||||
const approveFormFApis = ref<ApiAttrs[]>([]) // approveForms 的 fAPi
|
const approveFormFApis = ref<ApiAttrs[]>([]) // approveForms 的 fAPi
|
||||||
@@ -203,211 +186,203 @@ const approveFormFApis = ref<ApiAttrs[]>([]) // approveForms 的 fAPi
|
|||||||
// ========== 申请信息 ==========
|
// ========== 申请信息 ==========
|
||||||
const fApi = ref<ApiAttrs>() //
|
const fApi = ref<ApiAttrs>() //
|
||||||
const detailForm = ref({
|
const detailForm = ref({
|
||||||
rule: [],
|
rule: [],
|
||||||
option: {},
|
option: {},
|
||||||
value: {}
|
value: {}
|
||||||
}) // 流程实例的表单详情
|
}) // 流程实例的表单详情
|
||||||
|
|
||||||
/** 监听 approveFormFApis,实现它对应的 form-create 初始化后,隐藏掉对应的表单提交按钮 */
|
/** 监听 approveFormFApis,实现它对应的 form-create 初始化后,隐藏掉对应的表单提交按钮 */
|
||||||
watch(
|
watch(
|
||||||
() => approveFormFApis.value,
|
() => approveFormFApis.value,
|
||||||
(value) => {
|
value => {
|
||||||
value?.forEach((api) => {
|
value?.forEach(api => {
|
||||||
api.btn.show(false)
|
api.btn.show(false)
|
||||||
api.resetBtn.show(false)
|
api.resetBtn.show(false)
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
deep: true
|
deep: true
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
|
|
||||||
/** 处理审批通过和不通过的操作 */
|
/** 处理审批通过和不通过的操作 */
|
||||||
const handleAudit = async (task, pass) => {
|
const handleAudit = async (task, pass) => {
|
||||||
// 1.1 获得对应表单
|
// 1.1 获得对应表单
|
||||||
const index = runningTasks.value.indexOf(task)
|
const index = runningTasks.value.indexOf(task)
|
||||||
const auditFormRef = proxy.$refs['form' + index][0]
|
const auditFormRef = proxy.$refs['form' + index][0]
|
||||||
// 1.2 校验表单
|
// 1.2 校验表单
|
||||||
const elForm = unref(auditFormRef)
|
const elForm = unref(auditFormRef)
|
||||||
if (!elForm) return
|
if (!elForm) return
|
||||||
const valid = await elForm.validate()
|
const valid = await elForm.validate()
|
||||||
if (!valid) return
|
if (!valid) return
|
||||||
|
|
||||||
// 2.1 提交审批
|
// 2.1 提交审批
|
||||||
const data = {
|
const data = {
|
||||||
id: task.id,
|
id: task.id,
|
||||||
reason: auditForms.value[index].reason,
|
reason: auditForms.value[index].reason,
|
||||||
copyUserIds: auditForms.value[index].copyUserIds
|
copyUserIds: auditForms.value[index].copyUserIds
|
||||||
}
|
|
||||||
if (pass) {
|
|
||||||
// 审批通过,并且有额外的 approveForm 表单,需要校验 + 拼接到 data 表单里提交
|
|
||||||
const formCreateApi = approveFormFApis.value[index]
|
|
||||||
if (formCreateApi) {
|
|
||||||
await formCreateApi.validate()
|
|
||||||
data.variables = approveForms.value[index].value
|
|
||||||
}
|
}
|
||||||
await approveTask(data)
|
if (pass) {
|
||||||
tab.value = '审批记录'
|
// 审批通过,并且有额外的 approveForm 表单,需要校验 + 拼接到 data 表单里提交
|
||||||
ElMessage.success('审批通过成功')
|
const formCreateApi = approveFormFApis.value[index]
|
||||||
} else {
|
if (formCreateApi) {
|
||||||
await rejectTask(data)
|
await formCreateApi.validate()
|
||||||
tab.value = '审批记录'
|
data.variables = approveForms.value[index].value
|
||||||
ElMessage.success('审批不通过成功')
|
}
|
||||||
}
|
await approveTask(data)
|
||||||
// 2.2 加载最新数据
|
tab.value = '审批记录'
|
||||||
getDetail()
|
ElMessage.success('审批通过成功')
|
||||||
|
} else {
|
||||||
|
await rejectTask(data)
|
||||||
|
tab.value = '审批记录'
|
||||||
|
ElMessage.success('审批不通过成功')
|
||||||
|
}
|
||||||
|
// 2.2 加载最新数据
|
||||||
|
getDetail()
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 转派审批人 */
|
/** 转派审批人 */
|
||||||
const taskTransferFormRef = ref()
|
const taskTransferFormRef = ref()
|
||||||
const openTaskUpdateAssigneeForm = (id: string) => {
|
const openTaskUpdateAssigneeForm = (id: string) => {
|
||||||
taskTransferFormRef.value.open(id)
|
taskTransferFormRef.value.open(id)
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 处理审批委托的操作 */
|
/** 处理审批委托的操作 */
|
||||||
const taskDelegateForm = ref()
|
const taskDelegateForm = ref()
|
||||||
const handleDelegate = async (task) => {
|
const handleDelegate = async task => {
|
||||||
taskDelegateForm.value.open(task.id)
|
taskDelegateForm.value.open(task.id)
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 处理审批退回的操作 */
|
/** 处理审批退回的操作 */
|
||||||
const taskReturnFormRef = ref()
|
const taskReturnFormRef = ref()
|
||||||
const handleBack = async (task: any) => {
|
const handleBack = async (task: any) => {
|
||||||
taskReturnFormRef.value.open(task.id)
|
taskReturnFormRef.value.open(task.id)
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 处理审批加签的操作 */
|
/** 处理审批加签的操作 */
|
||||||
const taskSignCreateFormRef = ref()
|
const taskSignCreateFormRef = ref()
|
||||||
const handleSign = async (task: any) => {
|
const handleSign = async (task: any) => {
|
||||||
taskSignCreateFormRef.value.open(task.id)
|
taskSignCreateFormRef.value.open(task.id)
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 获得详情 */
|
/** 获得详情 */
|
||||||
const getDetail = () => {
|
const getDetail = () => {
|
||||||
// 1. 获得流程实例相关
|
// 1. 获得流程实例相关
|
||||||
getProcessInstance()
|
getProcessInstance()
|
||||||
// 2. 获得流程任务列表(审批记录)
|
// 2. 获得流程任务列表(审批记录)
|
||||||
getTaskList()
|
getTaskList()
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 加载流程实例 */
|
/** 加载流程实例 */
|
||||||
const BusinessFormComponent = ref(null) // 异步组件
|
const BusinessFormComponent = ref(null) // 异步组件
|
||||||
const getProcessInstance = async () => {
|
const getProcessInstance = async () => {
|
||||||
try {
|
try {
|
||||||
processInstanceLoading.value = true
|
processInstanceLoading.value = true
|
||||||
let data
|
let data
|
||||||
await getProcessInstanceById(id).then(res => {
|
await getProcessInstanceById(id).then(res => {
|
||||||
data = res.data
|
data = res.data
|
||||||
})
|
})
|
||||||
|
|
||||||
if (!data) {
|
if (!data) {
|
||||||
ElMessage.error('查询不到流程信息!')
|
ElMessage.error('查询不到流程信息!')
|
||||||
return
|
return
|
||||||
|
}
|
||||||
|
processInstance.value = data
|
||||||
|
// 设置表单信息
|
||||||
|
const processDefinition = data.processDefinition
|
||||||
|
if (processDefinition.formType === 10) {
|
||||||
|
setConfAndFields2(detailForm, processDefinition.formConf, processDefinition.formFields, data.formVariables)
|
||||||
|
nextTick().then(() => {
|
||||||
|
fApi.value?.btn.show(false)
|
||||||
|
fApi.value?.resetBtn.show(false)
|
||||||
|
fApi.value?.disabled(true)
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
// 注意:data.processDefinition.formCustomViewPath 是组件的全路径,例如说:/crm/contract/detail/index.vue
|
||||||
|
BusinessFormComponent.value = markRaw(registerComponent(data.processDefinition.formCustomViewPath))
|
||||||
|
}
|
||||||
|
|
||||||
|
// 加载流程图
|
||||||
|
bpmnXml.value = (await getProcessDefinitionById(processDefinition.id))?.bpmnXml
|
||||||
|
} finally {
|
||||||
|
processInstanceLoading.value = false
|
||||||
}
|
}
|
||||||
processInstance.value = data
|
|
||||||
// 设置表单信息
|
|
||||||
const processDefinition = data.processDefinition
|
|
||||||
if (processDefinition.formType === 10) {
|
|
||||||
setConfAndFields2(
|
|
||||||
detailForm,
|
|
||||||
processDefinition.formConf,
|
|
||||||
processDefinition.formFields,
|
|
||||||
data.formVariables
|
|
||||||
)
|
|
||||||
nextTick().then(() => {
|
|
||||||
fApi.value?.btn.show(false)
|
|
||||||
fApi.value?.resetBtn.show(false)
|
|
||||||
fApi.value?.disabled(true)
|
|
||||||
})
|
|
||||||
} else {
|
|
||||||
|
|
||||||
// 注意:data.processDefinition.formCustomViewPath 是组件的全路径,例如说:/crm/contract/detail/index.vue
|
|
||||||
BusinessFormComponent.value = registerComponent(data.processDefinition.formCustomViewPath)
|
|
||||||
}
|
|
||||||
|
|
||||||
// 加载流程图
|
|
||||||
bpmnXml.value = (
|
|
||||||
await getProcessDefinitionById(processDefinition.id)
|
|
||||||
)?.bpmnXml
|
|
||||||
} finally {
|
|
||||||
processInstanceLoading.value = false
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 加载任务列表 */
|
/** 加载任务列表 */
|
||||||
const getTaskList = async () => {
|
const getTaskList = async () => {
|
||||||
runningTasks.value = []
|
runningTasks.value = []
|
||||||
auditForms.value = []
|
auditForms.value = []
|
||||||
approveForms.value = []
|
approveForms.value = []
|
||||||
approveFormFApis.value = []
|
approveFormFApis.value = []
|
||||||
try {
|
try {
|
||||||
// 获得未取消的任务
|
// 获得未取消的任务
|
||||||
tasksLoad.value = true
|
tasksLoad.value = true
|
||||||
let data
|
let data
|
||||||
await getTaskListByProcessInstanceId(id).then(res => {
|
await getTaskListByProcessInstanceId(id).then(res => {
|
||||||
data = res.data
|
data = res.data
|
||||||
})
|
})
|
||||||
tasks.value = []
|
tasks.value = []
|
||||||
// 1.1 移除已取消的审批
|
// 1.1 移除已取消的审批
|
||||||
data.forEach((task) => {
|
data.forEach(task => {
|
||||||
if (task.status !== 4) {
|
if (task.status !== 4) {
|
||||||
tasks.value.push(task)
|
tasks.value.push(task)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
// 1.2 排序,将未完成的排在前面,已完成的排在后面;
|
// 1.2 排序,将未完成的排在前面,已完成的排在后面;
|
||||||
tasks.value.sort((a, b) => {
|
tasks.value.sort((a, b) => {
|
||||||
// 有已完成的情况,按照完成时间倒序
|
// 有已完成的情况,按照完成时间倒序
|
||||||
if (a.endTime && b.endTime) {
|
if (a.endTime && b.endTime) {
|
||||||
return b.endTime - a.endTime
|
return b.endTime - a.endTime
|
||||||
} else if (a.endTime) {
|
} else if (a.endTime) {
|
||||||
return 1
|
return 1
|
||||||
} else if (b.endTime) {
|
} else if (b.endTime) {
|
||||||
return -1
|
return -1
|
||||||
// 都是未完成,按照创建时间倒序
|
// 都是未完成,按照创建时间倒序
|
||||||
} else {
|
} else {
|
||||||
return b.createTime - a.createTime
|
return b.createTime - a.createTime
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
// 获得需要自己审批的任务
|
// 获得需要自己审批的任务
|
||||||
loadRunningTask(tasks.value)
|
loadRunningTask(tasks.value)
|
||||||
} finally {
|
} finally {
|
||||||
tasksLoad.value = false
|
tasksLoad.value = false
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 设置 runningTasks 中的任务
|
* 设置 runningTasks 中的任务
|
||||||
*/
|
*/
|
||||||
const loadRunningTask = (tasks) => {
|
const loadRunningTask = tasks => {
|
||||||
tasks.forEach((task) => {
|
tasks.forEach(task => {
|
||||||
if (!isEmpty(task.children)) {
|
if (!isEmpty(task.children)) {
|
||||||
loadRunningTask(task.children)
|
loadRunningTask(task.children)
|
||||||
}
|
}
|
||||||
// 2.1 只有待处理才需要
|
// 2.1 只有待处理才需要
|
||||||
if (task.status !== 1 && task.status !== 6) {
|
if (task.status !== 1 && task.status !== 6) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
// 2.2 自己不是处理人
|
// 2.2 自己不是处理人
|
||||||
if (!task.assigneeUser || task.assigneeUser.id !== userId) {
|
if (!task.assigneeUser || task.assigneeUser.id !== userId) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
// 2.3 添加到处理任务
|
// 2.3 添加到处理任务
|
||||||
runningTasks.value.push({ ...task })
|
runningTasks.value.push({ ...task })
|
||||||
auditForms.value.push({
|
auditForms.value.push({
|
||||||
reason: '',
|
reason: '',
|
||||||
copyUserIds: []
|
copyUserIds: []
|
||||||
|
})
|
||||||
|
console.log(runningTasks.value)
|
||||||
|
// 2.4 处理 approve 表单
|
||||||
|
if (task.formId && task.formConf) {
|
||||||
|
const approveForm = {}
|
||||||
|
setConfAndFields2(approveForm, task.formConf, task.formFields, task.formVariable)
|
||||||
|
approveForms.value.push(approveForm)
|
||||||
|
} else {
|
||||||
|
approveForms.value.push({}) // 占位,避免为空
|
||||||
|
}
|
||||||
})
|
})
|
||||||
console.log(runningTasks.value)
|
|
||||||
// 2.4 处理 approve 表单
|
|
||||||
if (task.formId && task.formConf) {
|
|
||||||
const approveForm = {}
|
|
||||||
setConfAndFields2(approveForm, task.formConf, task.formFields, task.formVariable)
|
|
||||||
approveForms.value.push(approveForm)
|
|
||||||
} else {
|
|
||||||
approveForms.value.push({}) // 占位,避免为空
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const tab = ref('')
|
const tab = ref('')
|
||||||
@@ -415,15 +390,15 @@ const tab = ref('')
|
|||||||
/** 初始化 */
|
/** 初始化 */
|
||||||
const userOptions = ref([]) // 用户列表
|
const userOptions = ref([]) // 用户列表
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
getDetail()
|
getDetail()
|
||||||
// 获得用户列表
|
// 获得用户列表
|
||||||
await getUserSimpleList().then(res => {
|
await getUserSimpleList().then(res => {
|
||||||
userOptions.value = res.data
|
userOptions.value = res.data
|
||||||
})
|
})
|
||||||
if (todo) {
|
if (todo) {
|
||||||
tab.value = '流程审核'
|
tab.value = '流程审核'
|
||||||
} else {
|
} else {
|
||||||
tab.value = '申请信息'
|
tab.value = '申请信息'
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Reference in New Issue
Block a user