审核按钮防止快速点击
Zhufu
parent
f46777ec49
commit
37db6f8263
|
|
@ -1,236 +1,238 @@
|
|||
<template>
|
||||
<PageWrapper :class="prefixCls">
|
||||
<div class="btn-box">
|
||||
<a-button type="primary" @click="confimReading" class="ml-2" v-if="props.isRead == 1"
|
||||
>确认阅读
|
||||
</a-button>
|
||||
<a-button type="primary" @click="closePage" class="ml-2" danger>关闭 </a-button>
|
||||
</div>
|
||||
|
||||
<div class="maper-container" v-if="mapConfig?.isShowMap">
|
||||
<MapboxMap
|
||||
:mapConfig="mapConfig"
|
||||
:geomsList="geomsList"
|
||||
@handlerDrawComplete="handlerDrawComplete"
|
||||
@mapOnLoad="onMapboxLoad"
|
||||
ref="MapboxComponent"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div
|
||||
id="form-container"
|
||||
@mousemove="onFormContainerMouseOver"
|
||||
style="position: relative"
|
||||
:class="mapConfig?.isShowMap ? 'form-container' : ''"
|
||||
>
|
||||
<a-layout>
|
||||
<a-layout>
|
||||
<a-layout-content>
|
||||
<a-tabs
|
||||
v-model:activeKey="activeName"
|
||||
tabPosition="bottom"
|
||||
@change="changeActive"
|
||||
type="card"
|
||||
>
|
||||
<a-tab-pane
|
||||
key="form"
|
||||
:tab="
|
||||
designerData.formCurrentNode.formTitle
|
||||
? designerData.formCurrentNode.formTitle
|
||||
: '表单信息'
|
||||
"
|
||||
v-if="formVisble"
|
||||
>
|
||||
<div id="process-form-container">
|
||||
<ImagePreview
|
||||
style="width: 100%; height:"
|
||||
v-if="isShowImagePreview"
|
||||
:globalImagePreviewUrl="globalImagePreviewUrl"
|
||||
:globalImagePreviewList="globalImagePreviewList"
|
||||
@closeImagePreview="closeImagePreview"
|
||||
/>
|
||||
|
||||
<FormViewer
|
||||
ref="formBoxRef"
|
||||
:formConfig="formConfig"
|
||||
:processId="designerData.process.id"
|
||||
:formVerison="designerData.formCurrentNode.formVerison"
|
||||
:formRelationId="designerData.formCurrentNode.formRelationId"
|
||||
:instanceInfo="designerData.process.instanceInfo"
|
||||
@getFormSuccess="getFormSuccess"
|
||||
v-if="formVisble"
|
||||
/>
|
||||
</div>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane
|
||||
key="form"
|
||||
:tab="
|
||||
designerData.formCurrentNode.formTitle
|
||||
? designerData.formCurrentNode.formTitle
|
||||
: '系统表单信息'
|
||||
"
|
||||
v-if="formUrlVisble"
|
||||
>
|
||||
<AsyncComponent ref="pcForm" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="flow" tab="流程模板" force-render v-if="false">
|
||||
<div class="process-design" style="display: flex; height: calc(100vh - 350px)">
|
||||
<process-viewer
|
||||
v-if="processVisble"
|
||||
:key="`designer-${id}`"
|
||||
:events="['element.click']"
|
||||
@element-click="elementClick"
|
||||
:xml="flowContent"
|
||||
:flowViewer="flowViewer"
|
||||
/>
|
||||
</div>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="record" tab="操作记录" force-render v-if="false">
|
||||
<div :style="'padding:10px 0 40px 0;overflow:auto; height:' + designerData.height">
|
||||
<a-timeline>
|
||||
<a-timeline-item
|
||||
v-for="(item, index) in designerData.logs"
|
||||
:key="index"
|
||||
:color="item.type"
|
||||
>
|
||||
<div class="title">{{ item.time }}</div>
|
||||
<a-card hoverable size="small">
|
||||
<div class="type-title">{{ item.name }}</div>
|
||||
<div class="content">
|
||||
<span
|
||||
class="link"
|
||||
v-for="(userName, index2) in item.userNames"
|
||||
:key="index2"
|
||||
>{{ userName }}</span
|
||||
>
|
||||
{{ item.des }}
|
||||
</div>
|
||||
</a-card>
|
||||
</a-timeline-item>
|
||||
</a-timeline>
|
||||
</div>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</a-layout-content>
|
||||
<div :style="footerStyle">
|
||||
<a-tabs v-if="props.isRead == 0" v-model:activeKey="auditName">
|
||||
<a-tab-pane key="audit" :tab="auditTitleVal">
|
||||
<div class="approval-column">
|
||||
<a-form
|
||||
ref="formRef"
|
||||
:rules="rules"
|
||||
:model="formData"
|
||||
size="small"
|
||||
labelAlign="left"
|
||||
:label-col="2"
|
||||
:wrapper-col="22"
|
||||
>
|
||||
<!-- <a-form-item :label="auditNameVal" /> -->
|
||||
<!-- <div style="margin-bottom: 20px">某某【退回】 ： {{ backDescription }}</div> -->
|
||||
<a-form-item :label="auditNameVal">
|
||||
<a-textarea
|
||||
v-model:value="formData.des"
|
||||
placeholder="请输入"
|
||||
:auto-size="{ minRows: 2, maxRows: 8 }"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label=""
|
||||
:class="btnVisble ? 'l-task-btns' : 'l-task-btns btn-hidden'"
|
||||
>
|
||||
<a-button
|
||||
v-for="(btn, index) in designerData.taskBtns"
|
||||
:key="index"
|
||||
:color="btn.type"
|
||||
:type="btn.type ? btn.type : 'primary'"
|
||||
@click="handleBtnClick(btn)"
|
||||
>{{ btn.name }}</a-button
|
||||
>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
<!-- <auditInfo :data="designerData.userLogs" /> -->
|
||||
</div>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="record" tab="流转信息" force-render>
|
||||
<div :style="'padding:10px 0 40px 0;overflow:auto; height:220px'">
|
||||
<a-timeline>
|
||||
<a-timeline-item
|
||||
v-for="(item, index) in designerData.logs"
|
||||
:key="index"
|
||||
:color="item.type"
|
||||
>
|
||||
<div class="title">{{ item.time }}</div>
|
||||
<a-card hoverable size="small">
|
||||
<div class="type-title">{{ item.name }}</div>
|
||||
<div class="content">
|
||||
<span
|
||||
class="link"
|
||||
v-for="(userName, index2) in item.userNames"
|
||||
:key="index2"
|
||||
>{{ userName }}</span
|
||||
>
|
||||
{{ item.des }}
|
||||
</div>
|
||||
</a-card>
|
||||
</a-timeline-item>
|
||||
</a-timeline>
|
||||
</div>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</div>
|
||||
</a-layout>
|
||||
</a-layout>
|
||||
</div>
|
||||
<!-- 节点记录信息 -->
|
||||
<div class="info-box" v-if="designerData.nodeLogs.length > 0">
|
||||
<a-drawer v-model:open="infoOpen" class="custom-class" title="记录信息" placement="right">
|
||||
<a-timeline>
|
||||
<a-timeline-item
|
||||
v-for="(item, index) in designerData.nodeLogs"
|
||||
:key="index"
|
||||
:color="item.type"
|
||||
>
|
||||
<div class="title">{{ item.time }}</div>
|
||||
<a-card hoverable size="small">
|
||||
<div class="type-title">{{ item.name }}</div>
|
||||
<div class="content">
|
||||
<span class="link" v-for="(userName, index2) in item.userNames" :key="index2">{{
|
||||
userName
|
||||
}}</span>
|
||||
{{ item.des }}
|
||||
</div>
|
||||
</a-card>
|
||||
</a-timeline-item>
|
||||
</a-timeline>
|
||||
</a-drawer>
|
||||
</div>
|
||||
<a-modal
|
||||
v-model:open="rejectOpen"
|
||||
width="50%"
|
||||
title="驳回节点选择"
|
||||
@ok="rejectHandleOk"
|
||||
:destroyOnClose="true"
|
||||
>
|
||||
<div class="l-from-body">
|
||||
<a-form
|
||||
ref="rejectFormRef"
|
||||
:model="reject"
|
||||
labelAlign="left"
|
||||
:label-col="rejectLabelCol"
|
||||
:wrapper-col="rejectWrapperCol"
|
||||
:rules="rejectRules"
|
||||
>
|
||||
<a-form-item label="驳回到" name="nextId">
|
||||
<a-select
|
||||
v-model:value="reject.nextId"
|
||||
placeholder="驳回节点选择"
|
||||
:field-names="{ label: 'unitName', value: 'unitId' }"
|
||||
:options="rejectRelations"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
<a-spin :spinning="spinning" style="width: 100%; height: 100%;">
|
||||
<div class="btn-box">
|
||||
<a-button type="primary" @click="confimReading" class="ml-2" v-if="props.isRead == 1"
|
||||
>确认阅读
|
||||
</a-button>
|
||||
<a-button type="primary" @click="closePage" class="ml-2" danger>关闭 </a-button>
|
||||
</div>
|
||||
</a-modal>
|
||||
|
||||
<div class="maper-container" v-if="mapConfig?.isShowMap">
|
||||
<MapboxMap
|
||||
:mapConfig="mapConfig"
|
||||
:geomsList="geomsList"
|
||||
@handlerDrawComplete="handlerDrawComplete"
|
||||
@mapOnLoad="onMapboxLoad"
|
||||
ref="MapboxComponent"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div
|
||||
id="form-container"
|
||||
@mousemove="onFormContainerMouseOver"
|
||||
style="position: relative"
|
||||
:class="mapConfig?.isShowMap ? 'form-container' : ''"
|
||||
>
|
||||
<a-layout>
|
||||
<a-layout>
|
||||
<a-layout-content>
|
||||
<a-tabs
|
||||
v-model:activeKey="activeName"
|
||||
tabPosition="bottom"
|
||||
@change="changeActive"
|
||||
type="card"
|
||||
>
|
||||
<a-tab-pane
|
||||
key="form"
|
||||
:tab="
|
||||
designerData.formCurrentNode.formTitle
|
||||
? designerData.formCurrentNode.formTitle
|
||||
: '表单信息'
|
||||
"
|
||||
v-if="formVisble"
|
||||
>
|
||||
<div id="process-form-container">
|
||||
<ImagePreview
|
||||
style="width: 100%; height:"
|
||||
v-if="isShowImagePreview"
|
||||
:globalImagePreviewUrl="globalImagePreviewUrl"
|
||||
:globalImagePreviewList="globalImagePreviewList"
|
||||
@closeImagePreview="closeImagePreview"
|
||||
/>
|
||||
|
||||
<FormViewer
|
||||
ref="formBoxRef"
|
||||
:formConfig="formConfig"
|
||||
:processId="designerData.process.id"
|
||||
:formVerison="designerData.formCurrentNode.formVerison"
|
||||
:formRelationId="designerData.formCurrentNode.formRelationId"
|
||||
:instanceInfo="designerData.process.instanceInfo"
|
||||
@getFormSuccess="getFormSuccess"
|
||||
v-if="formVisble"
|
||||
/>
|
||||
</div>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane
|
||||
key="form"
|
||||
:tab="
|
||||
designerData.formCurrentNode.formTitle
|
||||
? designerData.formCurrentNode.formTitle
|
||||
: '系统表单信息'
|
||||
"
|
||||
v-if="formUrlVisble"
|
||||
>
|
||||
<AsyncComponent ref="pcForm" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="flow" tab="流程模板" force-render v-if="false">
|
||||
<div class="process-design" style="display: flex; height: calc(100vh - 350px)">
|
||||
<process-viewer
|
||||
v-if="processVisble"
|
||||
:key="`designer-${id}`"
|
||||
:events="['element.click']"
|
||||
@element-click="elementClick"
|
||||
:xml="flowContent"
|
||||
:flowViewer="flowViewer"
|
||||
/>
|
||||
</div>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="record" tab="操作记录" force-render v-if="false">
|
||||
<div :style="'padding:10px 0 40px 0;overflow:auto; height:' + designerData.height">
|
||||
<a-timeline>
|
||||
<a-timeline-item
|
||||
v-for="(item, index) in designerData.logs"
|
||||
:key="index"
|
||||
:color="item.type"
|
||||
>
|
||||
<div class="title">{{ item.time }}</div>
|
||||
<a-card hoverable size="small">
|
||||
<div class="type-title">{{ item.name }}</div>
|
||||
<div class="content">
|
||||
<span
|
||||
class="link"
|
||||
v-for="(userName, index2) in item.userNames"
|
||||
:key="index2"
|
||||
>{{ userName }}</span
|
||||
>
|
||||
{{ item.des }}
|
||||
</div>
|
||||
</a-card>
|
||||
</a-timeline-item>
|
||||
</a-timeline>
|
||||
</div>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</a-layout-content>
|
||||
<div :style="footerStyle">
|
||||
<a-tabs v-if="props.isRead == 0" v-model:activeKey="auditName">
|
||||
<a-tab-pane key="audit" :tab="auditTitleVal">
|
||||
<div class="approval-column">
|
||||
<a-form
|
||||
ref="formRef"
|
||||
:rules="rules"
|
||||
:model="formData"
|
||||
size="small"
|
||||
labelAlign="left"
|
||||
:label-col="2"
|
||||
:wrapper-col="22"
|
||||
>
|
||||
<!-- <a-form-item :label="auditNameVal" /> -->
|
||||
<!-- <div style="margin-bottom: 20px">某某【退回】 ： {{ backDescription }}</div> -->
|
||||
<a-form-item :label="auditNameVal">
|
||||
<a-textarea
|
||||
v-model:value="formData.des"
|
||||
placeholder="请输入"
|
||||
:auto-size="{ minRows: 2, maxRows: 8 }"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label=""
|
||||
:class="btnVisble ? 'l-task-btns' : 'l-task-btns btn-hidden'"
|
||||
>
|
||||
<a-button
|
||||
v-for="(btn, index) in designerData.taskBtns"
|
||||
:key="index"
|
||||
:color="btn.type"
|
||||
:type="btn.type ? btn.type : 'primary'"
|
||||
@click="handleBtnClick(btn)"
|
||||
>{{ btn.name }}</a-button
|
||||
>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
<!-- <auditInfo :data="designerData.userLogs" /> -->
|
||||
</div>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="record" tab="流转信息" force-render>
|
||||
<div :style="'padding:10px 0 40px 0;overflow:auto; height:220px'">
|
||||
<a-timeline>
|
||||
<a-timeline-item
|
||||
v-for="(item, index) in designerData.logs"
|
||||
:key="index"
|
||||
:color="item.type"
|
||||
>
|
||||
<div class="title">{{ item.time }}</div>
|
||||
<a-card hoverable size="small">
|
||||
<div class="type-title">{{ item.name }}</div>
|
||||
<div class="content">
|
||||
<span
|
||||
class="link"
|
||||
v-for="(userName, index2) in item.userNames"
|
||||
:key="index2"
|
||||
>{{ userName }}</span
|
||||
>
|
||||
{{ item.des }}
|
||||
</div>
|
||||
</a-card>
|
||||
</a-timeline-item>
|
||||
</a-timeline>
|
||||
</div>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</div>
|
||||
</a-layout>
|
||||
</a-layout>
|
||||
</div>
|
||||
<!-- 节点记录信息 -->
|
||||
<div class="info-box" v-if="designerData.nodeLogs.length > 0">
|
||||
<a-drawer v-model:open="infoOpen" class="custom-class" title="记录信息" placement="right">
|
||||
<a-timeline>
|
||||
<a-timeline-item
|
||||
v-for="(item, index) in designerData.nodeLogs"
|
||||
:key="index"
|
||||
:color="item.type"
|
||||
>
|
||||
<div class="title">{{ item.time }}</div>
|
||||
<a-card hoverable size="small">
|
||||
<div class="type-title">{{ item.name }}</div>
|
||||
<div class="content">
|
||||
<span class="link" v-for="(userName, index2) in item.userNames" :key="index2">{{
|
||||
userName
|
||||
}}</span>
|
||||
{{ item.des }}
|
||||
</div>
|
||||
</a-card>
|
||||
</a-timeline-item>
|
||||
</a-timeline>
|
||||
</a-drawer>
|
||||
</div>
|
||||
<a-modal
|
||||
v-model:open="rejectOpen"
|
||||
width="50%"
|
||||
title="驳回节点选择"
|
||||
@ok="rejectHandleOk"
|
||||
:destroyOnClose="true"
|
||||
>
|
||||
<div class="l-from-body">
|
||||
<a-form
|
||||
ref="rejectFormRef"
|
||||
:model="reject"
|
||||
labelAlign="left"
|
||||
:label-col="rejectLabelCol"
|
||||
:wrapper-col="rejectWrapperCol"
|
||||
:rules="rejectRules"
|
||||
>
|
||||
<a-form-item label="驳回到" name="nextId">
|
||||
<a-select
|
||||
v-model:value="reject.nextId"
|
||||
placeholder="驳回节点选择"
|
||||
:field-names="{ label: 'unitName', value: 'unitId' }"
|
||||
:options="rejectRelations"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</div>
|
||||
</a-modal>
|
||||
</a-spin>
|
||||
</PageWrapper>
|
||||
</template>
|
||||
|
||||
|
|
@ -264,6 +266,8 @@
|
|||
import { buildGUID } from '@/utils/uuid';
|
||||
import { settings } from 'nprogress';
|
||||
const MapboxMap = defineAsyncComponent(() => import('@/components/MapboxMaps/MapComponent.vue'));
|
||||
const spinning = ref(false)
|
||||
const quickClick = ref<any>(null)
|
||||
const geomsList = ref();
|
||||
const mapConfig = ref({ isShowMap: false });
|
||||
const MapboxComponent = ref();
|
||||
|
|
@ -679,6 +683,13 @@
|
|||
designerData.taskBtns = btns;
|
||||
}
|
||||
async function handleBtnClick(btn) {
|
||||
if(quickClick.value !== null){
|
||||
clearTimeout(quickClick.value)
|
||||
quickClick.value = setTimeout(() => {}, 100)
|
||||
return
|
||||
}else{
|
||||
quickClick.value = setTimeout(() => {}, 100)
|
||||
}
|
||||
const instanceInfo = designerData.process.instanceInfo;
|
||||
// 验证审批栏必填项
|
||||
// const data = await validateForm();
|
||||
|
|
@ -724,7 +735,9 @@
|
|||
console.log('审核提交');
|
||||
setTimeout(async () => {
|
||||
querys.data = JSON.stringify(res);
|
||||
spinning.value = true
|
||||
const formValue = await functionsaveForm(querys);
|
||||
spinning.value = false
|
||||
if (formValue) {
|
||||
if (btn.code == 'zancun') {
|
||||
createMessage.success('暂存成功');
|
||||
|
|
@ -736,6 +749,7 @@
|
|||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
spinning.value = false
|
||||
console.log(error);
|
||||
activeName.value = 'form';
|
||||
return;
|
||||
|
|
@ -755,10 +769,17 @@
|
|||
let res: any;
|
||||
switch (btn.code) {
|
||||
case 'hc_create':
|
||||
res = await createAgain({
|
||||
processId: props.processId,
|
||||
des: `重新提交${formData.value.des ? '-' : ''}${formData.value.des}`,
|
||||
});
|
||||
try{
|
||||
spinning.value = true
|
||||
res = await createAgain({
|
||||
processId: props.processId,
|
||||
des: `重新提交${formData.value.des ? '-' : ''}${formData.value.des}`,
|
||||
});
|
||||
spinning.value = false
|
||||
}catch(e){
|
||||
spinning.value = false
|
||||
console.log(e);
|
||||
}
|
||||
break;
|
||||
case 'hc_sign':
|
||||
designerData.tUserType = 2;
|
||||
|
|
@ -771,11 +792,18 @@
|
|||
default:
|
||||
if (designerData.task.type == 6) {
|
||||
// 加签审核
|
||||
res = await signAudit(props.taskId, {
|
||||
code: btn.code,
|
||||
name: btn.name,
|
||||
des: formData.value.des,
|
||||
});
|
||||
try{
|
||||
spinning.value = true
|
||||
res = await signAudit(props.taskId, {
|
||||
code: btn.code,
|
||||
name: btn.name,
|
||||
des: formData.value.des,
|
||||
});
|
||||
spinning.value = false
|
||||
}catch(e){
|
||||
spinning.value = false
|
||||
console.log(e);
|
||||
}
|
||||
} else {
|
||||
if (designerData.currentNode.rejectType == '2' && btn.code == 'disagree') {
|
||||
designerData.selectRejectNodeVisible = true;
|
||||
|
|
@ -807,10 +835,12 @@
|
|||
btnVisble.value = false;
|
||||
// 获取接下来节点审核人
|
||||
if (designerData.currentBtn.isNextAuditor) {
|
||||
spinning.value = true
|
||||
const res = await getLoadNextAuditors({
|
||||
processId: props.processId,
|
||||
nodeId: designerData.currentNode.id,
|
||||
});
|
||||
spinning.value = false
|
||||
const nodeUserMap = res.data.data;
|
||||
const nodeUsers: nodeUsersType[] = [];
|
||||
for (let key in nodeUserMap) {
|
||||
|
|
@ -833,11 +863,13 @@
|
|||
return;
|
||||
}
|
||||
}
|
||||
spinning.value = true
|
||||
const data = await audit(props.taskId, {
|
||||
code: designerData.currentBtn.code,
|
||||
name: designerData.currentBtn.name,
|
||||
des: formData.value.des,
|
||||
});
|
||||
spinning.value = false
|
||||
if (data) {
|
||||
btnVisble.value = false;
|
||||
closePage();
|
||||
|
|
@ -965,12 +997,14 @@
|
|||
return false;
|
||||
});
|
||||
if (res) {
|
||||
spinning.value = true
|
||||
const data = await audit(props.taskId, {
|
||||
code: designerData.currentBtn.code,
|
||||
name: designerData.currentBtn.name,
|
||||
des: formData.value.des,
|
||||
NextId: reject.value.nextId,
|
||||
});
|
||||
spinning.value = false
|
||||
if (data) {
|
||||
closePage();
|
||||
rejectOpen.value = false;
|
||||
|
|
@ -1015,6 +1049,12 @@
|
|||
function onFormContainerMouseOver(event) {}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
:deep(.ant-spin-nested-loading){
|
||||
height: 100%;
|
||||
.ant-spin-container{
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
::v-deep .ant-tabs-nav-wrap {
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue