|
@@ -45,31 +45,58 @@
|
|
|
>审批人
|
|
|
</div>
|
|
|
<div v-if="node.type === 'PROCESS'" class="flow-node-content">
|
|
|
- <div v-if="node.property.approveUserType === 'USER'">
|
|
|
+ <template v-if="!IS_APPROVE_SET">
|
|
|
+ <div v-if="node.property.approveUserType === 'USER'">
|
|
|
+ <p>
|
|
|
+ {{
|
|
|
+ node.property.approveUsers
|
|
|
+ .map(item => item.name)
|
|
|
+ .join(",")
|
|
|
+ }}
|
|
|
+ </p>
|
|
|
+ <p v-if="node.property.copyForUsers.length">
|
|
|
+ 抄送:{{
|
|
|
+ node.property.copyForUsers
|
|
|
+ .map(item => item.name)
|
|
|
+ .join(",")
|
|
|
+ }}
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ <div v-else>
|
|
|
+ <p>
|
|
|
+ {{
|
|
|
+ node.property.approveRoles
|
|
|
+ .map(item => item.name)
|
|
|
+ .join(",")
|
|
|
+ }}
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template
|
|
|
+ v-if="IS_APPROVE_SET && node.property.approveUserCountType"
|
|
|
+ >
|
|
|
<p>
|
|
|
- {{
|
|
|
- node.property.approveUsers
|
|
|
- .map(item => item.name)
|
|
|
- .join(",")
|
|
|
+ 方式:{{
|
|
|
+ APPROVE_USER_COUNT_TYPE[
|
|
|
+ node.property.approveUserCountType
|
|
|
+ ]
|
|
|
}}
|
|
|
</p>
|
|
|
- <p v-if="node.property.copyForUsers.length">
|
|
|
- 抄送:{{
|
|
|
- node.property.copyForUsers
|
|
|
- .map(item => item.name)
|
|
|
- .join(",")
|
|
|
+ <p>
|
|
|
+ 范围:{{
|
|
|
+ APPROVE_USER_SELECT_RANGE[
|
|
|
+ node.property.approveUserSelectRange
|
|
|
+ ]
|
|
|
}}
|
|
|
</p>
|
|
|
- </div>
|
|
|
- <div v-else>
|
|
|
- <p>
|
|
|
- {{
|
|
|
- node.property.approveRoles
|
|
|
+ <p v-if="node.property.approveUserSelectRange === 'ROLE'">
|
|
|
+ 角色:{{
|
|
|
+ node.property.approveUserSelectRoles
|
|
|
.map(item => item.name)
|
|
|
.join(",")
|
|
|
}}
|
|
|
</p>
|
|
|
- </div>
|
|
|
+ </template>
|
|
|
</div>
|
|
|
<div v-else class="flow-node-content">
|
|
|
<span><i :class="nodeIcons[node.type]"></i></span>
|
|
@@ -86,7 +113,8 @@
|
|
|
<div class="flow-property">
|
|
|
<div v-if="curNode.id" class="flow-property-main" :key="curNode.id">
|
|
|
<h3 class="flow-property-title">节点属性</h3>
|
|
|
- <div class="property-part">
|
|
|
+ <!-- 管理员指定审批人 -->
|
|
|
+ <div v-if="!IS_APPROVE_SET" class="property-part">
|
|
|
<h4 class="property-part-title">设置审批人</h4>
|
|
|
<div class="flow-radio">
|
|
|
<el-radio-group
|
|
@@ -102,6 +130,7 @@
|
|
|
>
|
|
|
</el-radio-group>
|
|
|
</div>
|
|
|
+ <!-- 添加成员 -->
|
|
|
<div
|
|
|
v-if="curNode.property.approveUserType === 'USER'"
|
|
|
class="flow-users"
|
|
@@ -120,7 +149,7 @@
|
|
|
size="small"
|
|
|
closable
|
|
|
:disable-transitions="false"
|
|
|
- @close="deleteApproveUser(user)"
|
|
|
+ @close="deleteApproveUser('approveUsers', user)"
|
|
|
>
|
|
|
{{ user.name }}
|
|
|
</el-tag>
|
|
@@ -129,13 +158,17 @@
|
|
|
type="danger"
|
|
|
size="mini"
|
|
|
plain
|
|
|
- @click="clearApproveUsers"
|
|
|
+ @click="clearApproveUsers('approveUsers')"
|
|
|
>清空</el-button
|
|
|
>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <!-- 添加角色 -->
|
|
|
<div v-else class="flow-users">
|
|
|
- <el-button size="small" type="primary" @click="toAddApproveRole"
|
|
|
+ <el-button
|
|
|
+ size="small"
|
|
|
+ type="primary"
|
|
|
+ @click="toAddApproveRole('approveRoles')"
|
|
|
>添加角色</el-button
|
|
|
>
|
|
|
<div class="user-list">
|
|
@@ -145,7 +178,7 @@
|
|
|
size="small"
|
|
|
closable
|
|
|
:disable-transitions="false"
|
|
|
- @close="deleteApproveRole(role)"
|
|
|
+ @close="deleteApproveRole('approveRoles', role)"
|
|
|
>
|
|
|
{{ role.name }}
|
|
|
</el-tag>
|
|
@@ -154,12 +187,82 @@
|
|
|
type="danger"
|
|
|
size="mini"
|
|
|
plain
|
|
|
- @click="clearApproveRole"
|
|
|
+ @click="clearApproveRole('approveRoles')"
|
|
|
>清空</el-button
|
|
|
>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <!-- 发起人指定审批人 -->
|
|
|
+ <div v-else class="property-part">
|
|
|
+ <h4 class="property-part-title">设置审批人</h4>
|
|
|
+ <el-form label-width="80px">
|
|
|
+ <el-form-item label="选择方式:">
|
|
|
+ <el-select
|
|
|
+ v-model="curNode.property.approveUserCountType"
|
|
|
+ class="width-full"
|
|
|
+ placeholder="请选择方式"
|
|
|
+ :disabled="curNodeIsLast"
|
|
|
+ @change="curNodeChange"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="(val, key) in APPROVE_USER_COUNT_TYPE"
|
|
|
+ :key="key"
|
|
|
+ :value="key"
|
|
|
+ :label="val"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="选择范围:">
|
|
|
+ <el-select
|
|
|
+ v-model="curNode.property.approveUserSelectRange"
|
|
|
+ class="width-full"
|
|
|
+ placeholder="请选择范围"
|
|
|
+ :disabled="curNodeIsLast"
|
|
|
+ @change="curNodeChange"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="(val, key) in APPROVE_USER_SELECT_RANGE"
|
|
|
+ :key="key"
|
|
|
+ :value="key"
|
|
|
+ :label="val"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item
|
|
|
+ v-if="curNode.property.approveUserSelectRange === 'ROLE'"
|
|
|
+ label="指定角色:"
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ size="small"
|
|
|
+ type="primary"
|
|
|
+ @click="toAddApproveRole('approveUserSelectRoles')"
|
|
|
+ >添加角色</el-button
|
|
|
+ >
|
|
|
+ <div class="user-list">
|
|
|
+ <el-tag
|
|
|
+ v-for="role in curNode.property.approveUserSelectRoles"
|
|
|
+ :key="role.id"
|
|
|
+ size="small"
|
|
|
+ closable
|
|
|
+ :disable-transitions="false"
|
|
|
+ @close="deleteApproveRole('approveUserSelectRoles', role)"
|
|
|
+ >
|
|
|
+ {{ role.name }}
|
|
|
+ </el-tag>
|
|
|
+ <el-button
|
|
|
+ class="user-clear"
|
|
|
+ type="danger"
|
|
|
+ size="mini"
|
|
|
+ plain
|
|
|
+ @click="clearApproveRole('approveUserSelectRoles')"
|
|
|
+ >清空</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <!-- 抄送人 -->
|
|
|
<div
|
|
|
v-if="curNode.property.approveUserType === 'USER'"
|
|
|
class="property-part"
|
|
@@ -180,7 +283,7 @@
|
|
|
closable
|
|
|
size="small"
|
|
|
:disable-transitions="false"
|
|
|
- @close="deleteCopyForUser(user)"
|
|
|
+ @close="deleteApproveUser('copyForUsers', user)"
|
|
|
>
|
|
|
{{ user.name }}
|
|
|
</el-tag>
|
|
@@ -189,12 +292,13 @@
|
|
|
type="danger"
|
|
|
size="mini"
|
|
|
plain
|
|
|
- @click="clearCopyForUsers"
|
|
|
+ @click="clearApproveUsers('copyForUsers')"
|
|
|
>清空</el-button
|
|
|
>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <!-- 高级设置 -->
|
|
|
<div class="property-part">
|
|
|
<h4 class="property-part-title">高级设置</h4>
|
|
|
<p class="property-desc">多人审批时采用的审批方式</p>
|
|
@@ -213,6 +317,7 @@
|
|
|
</el-radio-group>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <!-- 驳回设置 -->
|
|
|
<div class="property-part">
|
|
|
<h4 class="property-part-title">驳回设置</h4>
|
|
|
<p class="property-desc">允许驳回节点</p>
|
|
@@ -275,24 +380,35 @@ import { flowDetail, updateFlowDetail } from "../api";
|
|
|
import SelectUserDialog from "./SelectUserDialog";
|
|
|
import SelectRoleDialog from "./SelectRoleDialog";
|
|
|
|
|
|
+const initFlowInfo = {
|
|
|
+ id: null,
|
|
|
+ name: "",
|
|
|
+ type: "ELECTRON_FLOW",
|
|
|
+ modelType: "USER_FIXED"
|
|
|
+};
|
|
|
+
|
|
|
const DEFAULT_NODE = {
|
|
|
id: "",
|
|
|
- type: "PROCESS",
|
|
|
+ type: "PROCESS", // 节点类型,START:开始节点,PROCESS:过程节点,END:结束节点
|
|
|
content: "",
|
|
|
w: 150,
|
|
|
h: 40,
|
|
|
x: 0,
|
|
|
y: 0,
|
|
|
property: {
|
|
|
- approveUserType: "USER",
|
|
|
- approveUsers: [],
|
|
|
- approveRoles: [],
|
|
|
- copyForUsers: [],
|
|
|
- multipleUserApproveType: "ORDER",
|
|
|
- rejectType: "PREV",
|
|
|
- rejectResubmitType: "NORMAL"
|
|
|
+ approveUserType: "USER", // 审批用户类型,USER:成员,ROLE:角色
|
|
|
+ approveUsers: [], // 审批用户列表
|
|
|
+ approveRoles: [], // 审批角色列表
|
|
|
+ copyForUsers: [], // 抄送用户列表
|
|
|
+ multipleUserApproveType: "ORDER", // 审批用户类别,ORDER:依次审批,ALL:会签(所有人必须审批),SOME:或签(一名审批人同意或拒绝即可)
|
|
|
+ rejectType: "PREV", // 驳回类型,PREV:上一节点,START:发起人节点,PREV_ALL:该节点前全部节点
|
|
|
+ rejectResubmitType: "NORMAL", // 驳回再提交类型,NORMAL:按正常流程提交,PREV_STEP:提交到驳回节点
|
|
|
+ approveUserCountType: "ONE", // 选择方式,ONE:一个,MORE:多个
|
|
|
+ approveUserSelectRange: "ALL", // 选择范围,ALL:全单位,ROLE:角色
|
|
|
+ approveUserSelectRoles: [] // 指定角色范围
|
|
|
}
|
|
|
};
|
|
|
+// 详细参数:https://doc.qmth.com.cn/pages/viewpage.action?pageId=40435764
|
|
|
|
|
|
export default {
|
|
|
name: "modify-flow-detail",
|
|
@@ -331,11 +447,14 @@ export default {
|
|
|
property: null
|
|
|
}
|
|
|
],
|
|
|
+ flowInfo: { ...initFlowInfo },
|
|
|
nodes: [],
|
|
|
curNode: {},
|
|
|
+ curNodeIsLast: false,
|
|
|
curAddUsers: [],
|
|
|
- curAddRoles: [],
|
|
|
curAddUserType: "",
|
|
|
+ curAddRoles: [],
|
|
|
+ curAddRoleType: "",
|
|
|
nodeIcons: {
|
|
|
START: "el-icon-video-play",
|
|
|
END: "el-icon-switch-button",
|
|
@@ -358,19 +477,37 @@ export default {
|
|
|
REJECT_RESUBMIT_TYPE: {
|
|
|
NORMAL: "按正常流程提交",
|
|
|
PREV_STEP: "提交到驳回节点"
|
|
|
+ },
|
|
|
+ APPROVE_USER_COUNT_TYPE: {
|
|
|
+ ONE: "一次选择一个人",
|
|
|
+ MORE: "一次选择多个人"
|
|
|
+ },
|
|
|
+ APPROVE_USER_SELECT_RANGE: {
|
|
|
+ ALL: "全单位",
|
|
|
+ ROLE: "指定角色"
|
|
|
}
|
|
|
};
|
|
|
},
|
|
|
+ computed: {
|
|
|
+ IS_APPROVE_SET() {
|
|
|
+ return this.flowInfo.modelType === "APPROVE_SET";
|
|
|
+ }
|
|
|
+ },
|
|
|
methods: {
|
|
|
async initData(val) {
|
|
|
if (val.id) {
|
|
|
const data = await flowDetail(val.id);
|
|
|
+ this.flowInfo = this.$objAssign(initFlowInfo, data);
|
|
|
+ this.flowInfo.id = data.customFlowId;
|
|
|
this.nodes = data.customFlowLists;
|
|
|
this.toSelectNode(this.nodes[1]);
|
|
|
} else {
|
|
|
+ this.flowInfo = this.$objAssign(initFlowInfo, val);
|
|
|
this.nodes = deepCopy(this.initNodes);
|
|
|
// this.toSelectNode(this.nodes[1]);
|
|
|
this.toAddNode(this.nodes[0].id);
|
|
|
+ // 发起人自选模式,默认新增两个节点
|
|
|
+ if (this.IS_APPROVE_SET) this.toAddNode(this.nodes[0].id);
|
|
|
}
|
|
|
},
|
|
|
visibleChange() {
|
|
@@ -414,13 +551,25 @@ export default {
|
|
|
return;
|
|
|
}
|
|
|
this.curNode = node ? deepCopy(node) : {};
|
|
|
+ if (!this.IS_APPROVE_SET) return;
|
|
|
+
|
|
|
+ // 发起人自选模式,最后一个节点禁止编辑审批人
|
|
|
+ const pos = this.nodes.findIndex(item => item.id === node.id);
|
|
|
+ this.curNodeIsLast = pos === this.nodes.length - 2;
|
|
|
+ if (this.curNodeIsLast) {
|
|
|
+ this.curNode.property.approveUserCountType = null;
|
|
|
+ this.curNode.property.approveUserSelectRange = null;
|
|
|
+ this.curNode.property.approveUserSelectRoles = [];
|
|
|
+ this.curNodeChange();
|
|
|
+ }
|
|
|
},
|
|
|
curNodeChange() {
|
|
|
const pos = this.nodes.findIndex(node => node.id === this.curNode.id);
|
|
|
this.nodes.splice(pos, 1, deepCopy(this.curNode));
|
|
|
},
|
|
|
- toAddUser(type) {
|
|
|
- this.curAddUserType = type;
|
|
|
+ // approveUser
|
|
|
+ toAddUser(curAddUserType) {
|
|
|
+ this.curAddUserType = curAddUserType;
|
|
|
this.curAddUsers = this.curNode.property[this.curAddUserType];
|
|
|
this.$refs.SelectUserDialog.open();
|
|
|
},
|
|
@@ -428,46 +577,37 @@ export default {
|
|
|
this.curNode.property[this.curAddUserType] = users;
|
|
|
this.curNodeChange();
|
|
|
},
|
|
|
- deleteApproveUser(user) {
|
|
|
+ deleteApproveUser(curAddUserType, user) {
|
|
|
console.log(user);
|
|
|
- const pos = this.curNode.property.approveUsers.findIndex(
|
|
|
+ const pos = this.curNode.property[curAddUserType].findIndex(
|
|
|
item => item.id === user.id
|
|
|
);
|
|
|
- this.curNode.property.approveUsers.splice(pos, 1);
|
|
|
+ this.curNode.property[curAddUserType].splice(pos, 1);
|
|
|
this.curNodeChange();
|
|
|
},
|
|
|
- clearApproveUsers() {
|
|
|
- this.curNode.property.approveUsers = [];
|
|
|
+ clearApproveUsers(curAddUserType) {
|
|
|
+ this.curNode.property[curAddUserType] = [];
|
|
|
this.curNodeChange();
|
|
|
},
|
|
|
- deleteCopyForUser(user) {
|
|
|
- const pos = this.curNode.property.copyForUsers.findIndex(
|
|
|
- item => item.id === user.id
|
|
|
- );
|
|
|
- this.curNode.property.copyForUsers.splice(pos, 1);
|
|
|
- this.curNodeChange();
|
|
|
- },
|
|
|
- clearCopyForUsers() {
|
|
|
- this.curNode.property.copyForUsers = [];
|
|
|
- this.curNodeChange();
|
|
|
- },
|
|
|
- toAddApproveRole() {
|
|
|
- this.curAddRoles = this.curNode.property.approveRoles;
|
|
|
+ // approveRole
|
|
|
+ toAddApproveRole(curAddRoleType) {
|
|
|
+ this.curAddRoleType = curAddRoleType;
|
|
|
+ this.curAddRoles = this.curNode.property[this.curAddRoleType];
|
|
|
this.$refs.SelectRoleDialog.open();
|
|
|
},
|
|
|
roleModified(roles) {
|
|
|
- this.curNode.property.approveRoles = roles;
|
|
|
+ this.curNode.property[this.curAddRoleType] = roles;
|
|
|
this.curNodeChange();
|
|
|
},
|
|
|
- deleteApproveRole(role) {
|
|
|
- const pos = this.curNode.property.approveRoles.findIndex(
|
|
|
+ deleteApproveRole(curAddRoleType, role) {
|
|
|
+ const pos = this.curNode.property[curAddRoleType].findIndex(
|
|
|
item => item.id === role.id
|
|
|
);
|
|
|
- this.curNode.property.approveRoles.splice(pos, 1);
|
|
|
+ this.curNode.property[curAddRoleType].splice(pos, 1);
|
|
|
this.curNodeChange();
|
|
|
},
|
|
|
- clearApproveRole() {
|
|
|
- this.curNode.property.approveRoles = [];
|
|
|
+ clearApproveRole(curAddRoleType) {
|
|
|
+ this.curNode.property[curAddRoleType] = [];
|
|
|
this.curNodeChange();
|
|
|
},
|
|
|
checkData() {
|
|
@@ -476,22 +616,38 @@ export default {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
- const nodeUserValid = !this.nodes
|
|
|
- .filter(node => node.type === "PROCESS")
|
|
|
- .some(node => {
|
|
|
- if (node.property.approveUserType === "USER") {
|
|
|
- return !node.property.approveUsers.length;
|
|
|
- // return !(
|
|
|
- // node.property.approveUsers.length &&
|
|
|
- // node.property.copyForUsers.length
|
|
|
- // );
|
|
|
- } else {
|
|
|
- return !node.property.approveRoles.length;
|
|
|
- }
|
|
|
- });
|
|
|
- if (!nodeUserValid) {
|
|
|
- this.$message.error("请完成节点设置");
|
|
|
- return;
|
|
|
+ if (this.IS_APPROVE_SET) {
|
|
|
+ const nodeUserValid = !this.nodes
|
|
|
+ .filter(node => node.type === "PROCESS")
|
|
|
+ .some(node => {
|
|
|
+ if (node.property.approveUserSelectRange === "ROLE") {
|
|
|
+ return !node.property.approveUserSelectRoles.length;
|
|
|
+ } else {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ if (!nodeUserValid) {
|
|
|
+ this.$message.error("请完成节点设置");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ const nodeUserValid = !this.nodes
|
|
|
+ .filter(node => node.type === "PROCESS")
|
|
|
+ .some(node => {
|
|
|
+ if (node.property.approveUserType === "USER") {
|
|
|
+ return !node.property.approveUsers.length;
|
|
|
+ // return !(
|
|
|
+ // node.property.approveUsers.length &&
|
|
|
+ // node.property.copyForUsers.length
|
|
|
+ // );
|
|
|
+ } else {
|
|
|
+ return !node.property.approveRoles.length;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ if (!nodeUserValid) {
|
|
|
+ this.$message.error("请完成节点设置");
|
|
|
+ return;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
return true;
|
|
@@ -521,11 +677,17 @@ export default {
|
|
|
let nnode = deepCopy(node);
|
|
|
nnode.id = index + 1;
|
|
|
if (node.property) {
|
|
|
- if (node.property.approveUserType === "USER") {
|
|
|
- nnode.approveRoles = [];
|
|
|
+ if (this.IS_APPROVE_SET) {
|
|
|
+ if (node.property.approveUserSelectRange === "ALL") {
|
|
|
+ node.property.approveUserSelectRoles = [];
|
|
|
+ }
|
|
|
} else {
|
|
|
- nnode.approveUsers = [];
|
|
|
- nnode.copyForUsers = [];
|
|
|
+ if (node.property.approveUserType === "USER") {
|
|
|
+ nnode.approveRoles = [];
|
|
|
+ } else {
|
|
|
+ nnode.approveUsers = [];
|
|
|
+ nnode.copyForUsers = [];
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
|
|
@@ -535,9 +697,10 @@ export default {
|
|
|
this.isSubmit = true;
|
|
|
|
|
|
const res = await updateFlowDetail({
|
|
|
- customFlowId: this.instance.id,
|
|
|
- name: this.instance.name,
|
|
|
- type: this.instance.type,
|
|
|
+ customFlowId: this.flowInfo.id,
|
|
|
+ name: this.flowInfo.name,
|
|
|
+ type: this.flowInfo.type,
|
|
|
+ modelType: this.flowInfo.modelType,
|
|
|
publish: true,
|
|
|
customFlowLists: nodes
|
|
|
}).catch(() => {});
|