7 changed files with 812 additions and 118 deletions
@ -0,0 +1,499 @@ |
|||||
|
<template> |
||||
|
<j-modal class="approval-new-dialog" :title="title" :width="width" :visible="visible" @cancel="handleCancel" |
||||
|
:footer="null"> |
||||
|
<!-- <template slot="footer"> |
||||
|
<w-button type="primary" @click="handleCancel">关闭</w-button> |
||||
|
</template> --> |
||||
|
<a-spin :spinning="loading"> |
||||
|
<div v-if="type === 'submit'"> |
||||
|
<div> |
||||
|
<div class="topArea"> |
||||
|
<div class="topArea_box"> |
||||
|
<div class="topArea_theme"> |
||||
|
<div class="topArea_theme_label"> |
||||
|
主题 |
||||
|
</div> |
||||
|
<w-input style="width: 300px;" v-model="themeTitle" /> |
||||
|
</div> |
||||
|
<div class="buttonArea"> |
||||
|
<w-button v-for="item in buttonList" :key="item.name" type="primary" @click="openFlowModal(item)">{{ |
||||
|
item.name }}</w-button> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div> |
||||
|
<w-tabs v-model="activeKey" type="card" style="width: 100%" size="mini"> |
||||
|
<w-tab-pane tab="流程表格" key="flowTable" :forceRender="true"> |
||||
|
<a-table ref="table" :columns="submitColumns" :pagination="false" :dataSource="dataSource" bordered |
||||
|
size="middle" row-key="id" class="j-table-force-nowrap"> |
||||
|
<span slot="operator" slot-scope="text, record"> |
||||
|
<span v-if="record.showType === 'text'">{{ record.handlerNames }} </span> |
||||
|
<!-- <w-input v-else-if="record.showType === 'input'" v-model="operator" /> --> |
||||
|
<AppprovalUserSelect v-model="record.operator" :disabled="record.disabled" |
||||
|
v-else-if="record.showType === 'input'" @change="(data) => getOperator(data, record)" /> |
||||
|
<span v-else></span> |
||||
|
</span> |
||||
|
</a-table> |
||||
|
</w-tab-pane> |
||||
|
</w-tabs> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div v-if="type === 'audit'"> |
||||
|
<div> |
||||
|
<div class="topArea"> |
||||
|
<div class="topArea_box"> |
||||
|
<div class="topArea_theme"> |
||||
|
<!-- <div class="topArea_theme_label"> |
||||
|
主题 |
||||
|
</div> --> |
||||
|
<div> |
||||
|
{{ themeTitle }} |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="buttonArea"> |
||||
|
<!-- 遍历 --> |
||||
|
<w-button v-for="(item, index) in buttonList" :key="item.name" :type="index === 0 ? 'primary' : ''" |
||||
|
@click="openFlowModal(item)">{{ |
||||
|
item.name }}</w-button> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div> |
||||
|
<w-tabs v-model="activeKey" type="card" style="width: 100%" size="mini"> |
||||
|
<w-tab-pane tab="审批记录" key="auditRecord" :forceRender="true"> |
||||
|
<a-table ref="table" :columns="auditColumns" :pagination="false" :dataSource="dataSource" bordered |
||||
|
size="middle" row-key="id" class="j-table-force-nowrap" /> |
||||
|
</w-tab-pane> |
||||
|
<w-tab-pane tab="日志" key="auditLog" :forceRender="true"> |
||||
|
<a-table ref="table" :columns="auditColumns" :pagination="false" :dataSource="logList" bordered |
||||
|
size="middle" row-key="id" class="j-table-force-nowrap" /> |
||||
|
</w-tab-pane> |
||||
|
</w-tabs> |
||||
|
</div> |
||||
|
</div> |
||||
|
</a-spin> |
||||
|
<passModal ref="passModal" @ok="hanledOK" /> |
||||
|
</j-modal> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import { postAction } from '@/api/manage'; |
||||
|
import passModal from './components/passModal.vue'; |
||||
|
import { mapGetters } from 'vuex'; |
||||
|
import AppprovalUserSelect from '@/components/AppprovalUserSelect/index'; |
||||
|
export default { |
||||
|
name: "ApprovalProgressTemplate", |
||||
|
components: { |
||||
|
passModal, |
||||
|
AppprovalUserSelect |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
loading: false, |
||||
|
type: 'submit', |
||||
|
activeKey: 'flowTable', |
||||
|
title: "提交", |
||||
|
width: 800, |
||||
|
visible: false, |
||||
|
themeTitle: '', |
||||
|
// 业务id |
||||
|
businessId: '', |
||||
|
// 流程id |
||||
|
flowId: "", |
||||
|
// 操作人 |
||||
|
operator: "", |
||||
|
operatorName: '', |
||||
|
submitColumns: [ |
||||
|
{ |
||||
|
title: '序号', |
||||
|
dataIndex: 'nodeId', |
||||
|
key: 'nodeId', |
||||
|
width: 60, |
||||
|
align: 'center', |
||||
|
}, |
||||
|
{ |
||||
|
title: '节点', |
||||
|
align: 'center', |
||||
|
dataIndex: 'nodeName', |
||||
|
ellipsis: true, |
||||
|
width: 200, |
||||
|
}, |
||||
|
{ |
||||
|
title: '处理人', |
||||
|
align: 'center', |
||||
|
width: 300, |
||||
|
dataIndex: 'operator', |
||||
|
ellipsis: true, |
||||
|
scopedSlots: { customRender: 'operator' }, |
||||
|
}, |
||||
|
{ |
||||
|
title: '类型', |
||||
|
align: 'center', |
||||
|
dataIndex: 'processType', |
||||
|
ellipsis: true, |
||||
|
}, |
||||
|
], |
||||
|
auditColumns: [ |
||||
|
{ |
||||
|
title: '节点', |
||||
|
align: 'center', |
||||
|
dataIndex: 'fdNodeId', |
||||
|
ellipsis: true, |
||||
|
width: 100, |
||||
|
}, |
||||
|
{ |
||||
|
title: '节点名称', |
||||
|
align: 'center', |
||||
|
dataIndex: 'fdNodeName', |
||||
|
ellipsis: true, |
||||
|
width: 100, |
||||
|
}, |
||||
|
{ |
||||
|
title: '操作人', |
||||
|
align: 'center', |
||||
|
width: 100, |
||||
|
dataIndex: 'fdHandlerName', |
||||
|
ellipsis: true, |
||||
|
}, |
||||
|
{ |
||||
|
title: '操作', |
||||
|
align: 'center', |
||||
|
dataIndex: 'fdOperationName', |
||||
|
ellipsis: true, |
||||
|
width: 100, |
||||
|
}, |
||||
|
{ |
||||
|
title: '附件/审批意见', |
||||
|
align: 'center', |
||||
|
dataIndex: 'fdAuditeInfo', |
||||
|
ellipsis: true, |
||||
|
width: 200, |
||||
|
}, |
||||
|
// { |
||||
|
// title: '时间', |
||||
|
// align: 'center', |
||||
|
// dataIndex: 'time', |
||||
|
// ellipsis: true, |
||||
|
// width: 100, |
||||
|
// }, |
||||
|
], |
||||
|
dataSource: [], |
||||
|
url: { |
||||
|
// 流程初始化 |
||||
|
initProcess: '/flow/common/initProcess', |
||||
|
// 按钮list |
||||
|
optionList: '/flow/common/optionList', |
||||
|
// 流程list |
||||
|
flowList: '/flow/common/info/table', |
||||
|
// 提交 |
||||
|
submit: '/flow/common/submit', |
||||
|
// 审核 |
||||
|
approve: '/flow/common/approve', |
||||
|
// 审批记录 |
||||
|
auditeNote: '/flow/common/auditeNote', |
||||
|
// 补充审批记录 |
||||
|
auditeNoteSupply: '/flow/common/info/process', |
||||
|
// 日志 |
||||
|
logList: '/flow/common/log/list', |
||||
|
// 驳回节点列表 |
||||
|
refuseNode: '/flow/common/refuseNode/process', |
||||
|
// 查询 |
||||
|
getFdTemplateCodeApi: '/merger/mergerGoods/v1/check-merger-goods-by-id', |
||||
|
}, |
||||
|
buttonList: [], |
||||
|
fdActivityType: '', |
||||
|
taskId: "", |
||||
|
nodeInstanceId: '', |
||||
|
refuseNodeList: [], |
||||
|
logList: [], |
||||
|
fdTemplateCode: 'mergerApply' |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
...mapGetters(['userInfo']), |
||||
|
async getFlowList() { |
||||
|
const res = await postAction(this.url.optionList, { |
||||
|
fdId: this.flowId, |
||||
|
loginName: this.userInfo().username, |
||||
|
}); |
||||
|
const resp = await postAction(this.url.flowList, { |
||||
|
fdId: this.flowId, |
||||
|
loginName: this.userInfo().username, |
||||
|
fdTemplateCode: this.fdTemplateCode, |
||||
|
}); |
||||
|
if (res.success) { |
||||
|
if (res.result.length) { |
||||
|
this.buttonList = res.result[0].operationList.filter(item => !['沟通', '废弃'].includes(item.name)); |
||||
|
this.buttonList = this.buttonList.sort((a, b) => a.order - b.order); |
||||
|
} else { |
||||
|
this.buttonList = []; |
||||
|
} |
||||
|
} else { |
||||
|
this.$message.error(res.message); |
||||
|
this.loading = false; |
||||
|
} |
||||
|
if (resp.success) { |
||||
|
this.dataSource = resp.result.processNodes || []; |
||||
|
this.dataSource.forEach((item) => { |
||||
|
this.$set(item, 'showType', 'text'); |
||||
|
if (item.activityType === 'approveNode') { |
||||
|
item.showType = 'input'; |
||||
|
item.disabled = !(item.mustSelected || item.canSelected); |
||||
|
item.operator = item.handlers && item.handlers.length ? item.handlers[0].id : this.operator; |
||||
|
} |
||||
|
}); |
||||
|
} else { |
||||
|
this.$message.error(res.message); |
||||
|
this.loading = false; |
||||
|
} |
||||
|
setTimeout(() => { |
||||
|
this.loading = false |
||||
|
}, 100); |
||||
|
}, |
||||
|
async getLogList() { |
||||
|
const res = await postAction(this.url.optionList, { |
||||
|
fdId: this.flowId, |
||||
|
loginName: this.userInfo().username, |
||||
|
}) |
||||
|
if (res.success) { |
||||
|
if (res.result.length) { |
||||
|
this.buttonList = res.result[0].operationList.filter(item => !['沟通', '废弃'].includes(item.name)); |
||||
|
this.buttonList = this.buttonList.sort((a, b) => a.order - b.order); |
||||
|
} else { |
||||
|
this.buttonList = []; |
||||
|
} |
||||
|
} else { |
||||
|
this.$message.error(res.message); |
||||
|
this.loading = false; |
||||
|
} |
||||
|
const resp = await postAction(this.url.auditeNote, { |
||||
|
bsId: this.businessId, |
||||
|
fdId: this.flowId, |
||||
|
loginName: this.userInfo().username, |
||||
|
fdTemplateCode: this.fdTemplateCode, |
||||
|
}) |
||||
|
const resppp = await postAction(this.url.logList, { |
||||
|
bsId: this.businessId, |
||||
|
fdId: this.flowId, |
||||
|
loginName: this.userInfo().username, |
||||
|
fdTemplateCode: this.fdTemplateCode, |
||||
|
}) |
||||
|
this.logList = JSON.parse(resppp.result); |
||||
|
if (resp.success) { |
||||
|
this.dataSource = resp.result; |
||||
|
const response = await postAction(this.url.auditeNoteSupply, { |
||||
|
// bsId: this.businessId, |
||||
|
fdId: this.flowId, |
||||
|
loginName: this.userInfo().username, |
||||
|
fdTemplateCode: this.fdTemplateCode, |
||||
|
}) |
||||
|
if (response.result.currNodes && response.result.currNodes.length > 0) { |
||||
|
this.themeTitle = response.result.subject; |
||||
|
this.nodeInstanceId = response.result.currNodes[0].nodeInstanceId; |
||||
|
this.dataSource.push({ |
||||
|
fdNodeId: response.result.currNodeIds, |
||||
|
fdNodeName: response.result.currNodes[0].nodeName, |
||||
|
fdHandlerName: response.result.currNodes[0].handlers[0].name, |
||||
|
fdOperationName: response.result.fdStatus, |
||||
|
fdAuditeInfo: response.result.nodeDesc, |
||||
|
}) |
||||
|
} |
||||
|
} else { |
||||
|
this.$message.error(res.message); |
||||
|
this.loading = false; |
||||
|
} |
||||
|
setTimeout(() => { |
||||
|
this.loading = false; |
||||
|
}, 100); |
||||
|
}, |
||||
|
async openFlowModal(obj) { |
||||
|
this.operationFlag = obj.operationType; |
||||
|
this.taskId = obj.operationTaskList[0].fdTaskId; |
||||
|
this.fdActivityType = obj.operationTaskList[0].fdActivityType; |
||||
|
let title = ''; |
||||
|
if (this.operationFlag === 'handler_pass') { |
||||
|
title = '通过'; |
||||
|
} else if (this.operationFlag === 'draft_submit') { |
||||
|
title = '提交'; |
||||
|
if (!this.operator) { |
||||
|
return this.$message.info('请先选择处理人') |
||||
|
} |
||||
|
} else if (this.operationFlag === 'handler_commission') { |
||||
|
title = '转办'; |
||||
|
} else if (this.operationFlag === 'handler_refuse') { |
||||
|
title = '驳回'; |
||||
|
const res = await postAction(this.url.refuseNode, { |
||||
|
fdId: this.flowId, |
||||
|
loginName: this.userInfo().username, |
||||
|
nodeInstanceId: this.nodeInstanceId |
||||
|
}) |
||||
|
this.refuseNodeList = res.result; |
||||
|
} else if (['draft_abandon', 'handler_abandon'].includes(this.operationFlag)) { |
||||
|
title = '废弃'; |
||||
|
} else if (this.operationFlag === 'handler_communicate') { |
||||
|
title = '沟通'; |
||||
|
} |
||||
|
this.$refs.passModal.show({ |
||||
|
title, |
||||
|
flag: this.operationFlag, |
||||
|
refuseNodeList: this.refuseNodeList |
||||
|
}) |
||||
|
}, |
||||
|
async show(obj) { |
||||
|
this.type = obj.type; |
||||
|
this.activeKey = this.type === 'submit' ? 'flowTable' : 'auditRecord'; |
||||
|
this.businessId = obj.id; |
||||
|
this.visible = true; |
||||
|
this.flowId = obj.flowId; |
||||
|
this.operator = obj.defaultverifyBy || ''; |
||||
|
this.fdTemplateCode = obj.mergerApplyFactory || 'mergerApplyFactory'; |
||||
|
this.loading = true; |
||||
|
this.themeTitle = obj.title || ''; |
||||
|
if (this.type === 'submit') { |
||||
|
if (this.flowId) { |
||||
|
this.getFlowList(); |
||||
|
} else { |
||||
|
const res = await postAction(this.url.initProcess, { |
||||
|
fdTemplateCode: this.fdTemplateCode, |
||||
|
loginName: this.userInfo().username, |
||||
|
id: this.businessId |
||||
|
}) |
||||
|
if (res.success) { |
||||
|
this.flowId = res.result; |
||||
|
this.getFlowList(); |
||||
|
} else { |
||||
|
this.$message.error(res.message); |
||||
|
this.loading = false; |
||||
|
} |
||||
|
} |
||||
|
} else { |
||||
|
this.title = '审核'; |
||||
|
this.flowId = obj.flowId; |
||||
|
this.getLogList(); |
||||
|
} |
||||
|
}, |
||||
|
handleCancel() { |
||||
|
this.visible = false; |
||||
|
this.operator = ''; |
||||
|
}, |
||||
|
getOperator(data, row) { |
||||
|
if (data && data.length > 0) { |
||||
|
row.operatorName = data[0].userName; |
||||
|
} else { |
||||
|
row.operatorName = ''; |
||||
|
} |
||||
|
}, |
||||
|
async hanledOK(obj) { |
||||
|
// 提交 |
||||
|
if (this.operationFlag === 'draft_submit') { |
||||
|
let fdUrl = ''; |
||||
|
if (this.fdTemplateCode === 'mergerApplyFactory') { |
||||
|
const env = process.env.NODE_ENV === 'prod' ? '' : process.env.NODE_ENV; |
||||
|
fdUrl = `https://gcs${env ? String(env).toLocaleLowerCase() : ''}.midea.com/#/iflowPage/classifyFactoryApproval`; |
||||
|
// fdUrl = `https://gcssit.midea.com/#/iflowPage/classifyFactoryApproval`; |
||||
|
} |
||||
|
const nodeList = this.dataSource.filter(item => item.activityType === 'approveNode'); |
||||
|
|
||||
|
const res = await postAction(this.url.submit, { |
||||
|
bsId: this.businessId, |
||||
|
loginName: this.userInfo().username, |
||||
|
docSubject: this.themeTitle, |
||||
|
fdId: this.flowId, |
||||
|
fdTemplateCode: this.fdTemplateCode, |
||||
|
auditNote: obj.remark, |
||||
|
processParam: { |
||||
|
changeNodeHandler: nodeList.map(i => { |
||||
|
return { |
||||
|
nodeId: i.nodeId, |
||||
|
handlers: [ |
||||
|
{ |
||||
|
type: "USER", |
||||
|
id: i.operator, |
||||
|
name: i.operatorName |
||||
|
} |
||||
|
] |
||||
|
} |
||||
|
}), |
||||
|
taskId: this.taskId, |
||||
|
activityType: this.fdActivityType, |
||||
|
operationType: this.operationFlag, |
||||
|
}, |
||||
|
formParam: { |
||||
|
formInstanceId: this.businessId, |
||||
|
fdUrl: fdUrl |
||||
|
} |
||||
|
}) |
||||
|
if (res.success) { |
||||
|
this.$refs.passModal.handleCancel(); |
||||
|
this.$refs.passModal.remark = ''; |
||||
|
this.visible = false; |
||||
|
this.$refs.passModal.loading = false; |
||||
|
this.$emit('ok'); |
||||
|
} else { |
||||
|
this.$refs.passModal.loading = false; |
||||
|
this.$message.error(res.message); |
||||
|
} |
||||
|
} |
||||
|
// 审核 |
||||
|
else { |
||||
|
const res = await postAction(this.url.approve, { |
||||
|
fdId: this.flowId, |
||||
|
auditNote: obj.remark, |
||||
|
fdTemplateCode: this.fdTemplateCode, |
||||
|
bsId: this.businessId, |
||||
|
loginName: this.userInfo().username, |
||||
|
processParam: { |
||||
|
jumpToNodeId: obj.node, |
||||
|
refusePassedToThisNode: obj.refusePassedToThisNode, |
||||
|
refusePassedToAllApprover: obj.refusePassedToAllApprover, |
||||
|
toOtherPersons: this.operationFlag === 'handler_commission' ? obj.operator : '', |
||||
|
toOtherPersonsName: this.operationFlag === 'handler_commission' ? obj.operatorName : '', |
||||
|
changeNodeHandler: [], |
||||
|
taskId: this.taskId, |
||||
|
activityType: this.fdActivityType, |
||||
|
operationType: this.operationFlag, |
||||
|
} |
||||
|
}) |
||||
|
if (res.success) { |
||||
|
this.$refs.passModal.handleCancel(); |
||||
|
this.$refs.passModal.remark = ''; |
||||
|
this.visible = false; |
||||
|
this.$refs.passModal.loading = false; |
||||
|
this.$emit('ok'); |
||||
|
} else { |
||||
|
this.$message.error(res.message); |
||||
|
this.$refs.passModal.loading = false; |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
this.operator = ''; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="less"> |
||||
|
.approval-new-dialog { |
||||
|
.topArea { |
||||
|
.topArea_box { |
||||
|
.topArea_theme { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
margin-bottom: 20px; |
||||
|
|
||||
|
.topArea_theme_label { |
||||
|
margin-right: 20px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.buttonArea { |
||||
|
margin-bottom: 20px; |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
Loading…
Reference in new issue