Browse Source

工作流初始化相关配置组件

local_v3_liwenxuan
超级管理员 2 years ago
parent
commit
1390c056df
  1. 8
      src/api/workflowapi/index.ts
  2. 55
      src/components/workflow/dialog/employeesDialog.vue
  3. 72
      src/components/workflow/dialog/errorDialog.vue
  4. 226
      src/components/workflow/drwer/approverDrawer.vue
  5. 304
      src/components/workflow/drwer/conditionDrawer.vue
  6. 88
      src/components/workflow/drwer/copyerDrawer.vue
  7. 87
      src/components/workflow/drwer/promoterDrawer.vue
  8. 34
      src/components/workflow/nodeWrap.vue
  9. 15
      src/views/sysworkflow/flow/index.vue

8
src/api/workflowapi/index.ts

@ -21,3 +21,11 @@ export function setWorkFlowData(data: any):any {
data: data
});
}
//保存工作流
export function getConditions(data: any):any {
return request({
url: '/systemapi/task_flow/init_workflow',
method: 'post',
data: data
});
}

55
src/components/workflow/dialog/employeesDialog.vue

@ -0,0 +1,55 @@
<!--
@ 作者: 秦东
@ 时间: 2023-10-11 09:47:32
@ 备注: 人员选择
-->
<script lang='ts' setup>
let props = defineProps({
visible: {
type: Boolean,
default: false
},
data:{
type: Array,
default: ()=> []
},
isdepartment: {
type: Boolean,
default: false
},
});
let emits = defineEmits(['update:visible', 'change'])
let visibleDialog = computed({
get(){
return props.visible
},
set(){
closeDialog()
}
});
let checkedDepartmentList = ref([])
let checkedEmployessList = ref([])
let saveDialog = ()=> {
}
const closeDialog = ()=> {
emits('update:visible', false)
}
</script>
<template>
<el-dialog v-model="visibleDialog" title="选择成员" :width="600" append-to-body class="promoter_person">
<div class="person_body clear">
<div class="person_tree l">
</div>
</div>
<template #footer>
<el-button @click="$emit('update:visible',false)"> </el-button>
<el-button type="primary" @click="saveDialog"> </el-button>
</template>
</el-dialog>
</template>
<style lang='scss' scoped>
</style>

72
src/components/workflow/dialog/errorDialog.vue

@ -0,0 +1,72 @@
<!--
@ 作者: 秦东
@ 时间: 2023-10-11 08:29:47
@ 备注: 流程检查错误信息
-->
<script lang='ts' setup>
let props = defineProps({
list: {
type: Array,
default: () => []
},
visible: {
type: Boolean,
default: false
}
})
let emits = defineEmits(['update:visible'])
let visibleDialog = computed({
get() {
return props.visible
},
set(val) {
emits('update:visible', val)
}
})
</script>
<template>
<el-dialog v-model="visibleDialog" title="提示" :width="520">
<div class="ant-confirm-body">
<i class="anticon anticon-close-circle" style="color: #f00;"></i>
<span class="ant-confirm-title">当前无法发布</span>
<div class="ant-confirm-content">
<div>
<p class="error-modal-desc">以下内容不完善需进行修改</p>
<div class="error-modal-list">
<div v-for="(item,index) in list" :key="index" class="error-modal-item">
<div class="error-modal-item-label">流程设计</div>
<div class="error-modal-item-content">{{item.name}} 未选择{{item.type}}</div>
</div>
</div>
</div>
</div>
</div>
<template #footer>
<el-button type="primary" @click="visibleDialog = false">前往修改</el-button>
</template>
</el-dialog>
</template>
<style lang='scss' scoped>
.ant-confirm-body .ant-confirm-title {
color: rgba(0, 0, 0, .85);
font-weight: 500;
font-size: 16px;
line-height: 1.4;
display: block;
overflow: hidden
}
.ant-confirm-body .ant-confirm-content {
margin-left: 38px;
font-size: 14px;
color: rgba(0, 0, 0, .65);
margin-top: 8px
}
.ant-confirm-body>.anticon {
font-size: 22px;
margin-right: 16px;
float: left
}
</style>

226
src/components/workflow/drwer/approverDrawer.vue

@ -0,0 +1,226 @@
<!--
@ 作者: 秦东
@ 时间: 2023-10-11 09:54:58
@ 备注: 审批人设置
-->
<script lang='ts' setup>
import $func from '@/utils/workflow/index'
import { setTypes, selectModes, selectRanges } from '@/utils/workflow/const'
import { useStore } from '@/store/workflow/index'
let props = defineProps({
directormaxlevel: {
type: Number,
default: 0
}
});
let approverConfig = ref({})
let approverVisible = ref(false)
let approverRoleVisible = ref(false)
let checkedRoleList = ref([])
let checkedList = ref([])
let store = useStore()
let { setApproverConfig, setApprover } = store
let approverConfig1 = computed(()=> store.approverConfig1)
let approverDrawer = computed(()=> store.approverDrawer)
let visible = computed({
get(){
return approverDrawer.value
},
set(){
closeDrawer()
}
})
watch(approverConfig1, (val)=>{
approverConfig.value = val.value
})
let changeRange = ()=> {
approverConfig.value.nodeUserList = [];
}
const changeType = (val)=> {
approverConfig.value.nodeUserList = [];
approverConfig.value.examineMode = 1;
approverConfig.value.noHanderAction = 2;
if (val == 2) {
approverConfig.value.directorLevel = 1;
} else if (val == 4) {
approverConfig.value.selectMode = 1;
approverConfig.value.selectRange = 1;
} else if (val == 7) {
approverConfig.value.examineEndDirectorLevel = 1
}
}
const addApprover = ()=> {
approverVisible.value = true;
checkedList.value = approverConfig.value.nodeUserList
}
const addRoleApprover = ()=> {
approverRoleVisible.value = true;
checkedRoleList.value = approverConfig.value.nodeUserList
}
const sureApprover = (data)=> {
approverConfig.value.nodeUserList = data;
approverVisible.value = false;
}
const sureRoleApprover = (data)=> {
approverConfig.value.nodeUserList = data;
approverRoleVisible.value = false;
}
const saveApprover = ()=> {
approverConfig.value.error = !$func.setApproverStr(approverConfig.value)
setApproverConfig({
value: approverConfig.value,
flag: true,
id: approverConfig1.value.id
})
closeDrawer()
}
const closeDrawer = ()=> {
setApprover(false)
}
</script>
<template>
<el-drawer v-model="visible" :append-to-body="true" title="审批人设置" class="set_promoter" :show-close="false" :size="550" :before-close="saveApprover">
<div class="demo-drawer__content">
<!--审批人设置主体-->
<div class="drawer_content">
<div class="approver_content">
<el-radio-group v-model="approverConfig.settype" class="clear" @change="changeType">
<el-radio v-for="({value, label}) in setTypes" :key="value" :label="value">{{label}}</el-radio>
</el-radio-group>
<el-button v-if="approverConfig.settype==1" type="primary" @click="addApprover">添加/修改成员</el-button>
<p v-if="approverConfig.settype==1" class="selected_list">
<span v-for="(item,index) in approverConfig.nodeUserList" :key="index">{{item.name}}
<img src="@/assets/images/add-close1.png" @click="$func.removeEle(approverConfig.nodeUserList,item,'targetId')">
</span>
<a v-if="approverConfig.nodeUserList.length!=0" @click="approverConfig.nodeUserList=[]">清除</a>
</p>
</div>
<div v-if="approverConfig.settype==2" class="approver_manager">
<p>
<span>发起人的</span>
<select v-model="approverConfig.directorLevel">
<option v-for="item in directorMaxLevel" :key="item" :value="item">{{item==1?'直接':''+item+''}}主管</option>
</select>
</p>
<p class="tip">找不到主管时由上级主管代审批</p>
</div>
<div v-if="approverConfig.settype==5" class="approver_self">
<p>该审批节点设置发起人自己审批人默认为发起人</p>
</div>
<div v-show="approverConfig.settype==4" class="approver_self_select">
<el-radio-group v-model="approverConfig.selectMode" style="width: 100%;">
<el-radio v-for="({value, label}) in selectModes" :key="value" :label="value">{{label}}</el-radio>
</el-radio-group>
<h3>选择范围</h3>
<el-radio-group v-model="approverConfig.selectRange" style="width: 100%;" @change="changeRange">
<el-radio v-for="({value, label}) in selectRanges" :key="value" :label="value" >{{label}}</el-radio>
</el-radio-group>
<template v-if="approverConfig.selectRange==2||approverConfig.selectRange==3">
<el-button v-if="approverConfig.selectRange==2" type="primary" @click="addApprover">添加/修改成员</el-button>
<el-button v-else type="primary" @click="addRoleApprover">添加/修改角色</el-button>
<p class="selected_list">
<span v-for="(item,index) in approverConfig.nodeUserList" :key="index">{{item.name}}
<img src="@/assets/images/add-close1.png" @click="$func.removeEle(approverConfig.nodeUserList,item,'targetId')">
</span>
<a v-if="approverConfig.nodeUserList.length!=0&&approverConfig.selectRange!=1" @click="approverConfig.nodeUserList=[]">清除</a>
</p>
</template>
</div>
<div v-if="approverConfig.settype==7" class="approver_manager">
<p>审批终点</p>
<p style="padding-bottom:20px">
<span>发起人的</span>
<select v-model="approverConfig.examineEndDirectorLevel">
<option v-for="item in directorMaxLevel" :key="item" :value="item">{{item==1?'最高':''+item}}层级主管</option>
</select>
</p>
</div>
<div v-if="(approverConfig.settype==1&&approverConfig.nodeUserList.length>1)||approverConfig.settype==2||(approverConfig.settype==4&&approverConfig.selectMode==2)" class="approver_some">
<p>多人审批时采用的审批方式</p>
<el-radio-group v-model="approverConfig.examineMode" class="clear">
<el-radio :label="1">依次审批</el-radio>
<br/>
<el-radio v-if="approverConfig.settype!=2" :label="2">会签(须所有审批人同意)</el-radio>
</el-radio-group>
</div>
<div v-if="approverConfig.settype==2||approverConfig.settype==7" class="approver_some">
<p>审批人为空时</p>
<el-radio-group v-model="approverConfig.noHanderAction" class="clear">
<el-radio :label="1">自动审批通过/不允许发起</el-radio>
<br/>
<el-radio :label="2">转交给审核管理员</el-radio>
</el-radio-group>
</div>
</div>
<div class="demo-drawer__footer clear">
<el-button type="primary" @click="saveApprover"> </el-button>
<el-button @click="closeDrawer"> </el-button>
</div>
</div>
</el-drawer>
</template>
<style lang='scss' scoped>
.set_promoter{
.approver_content {
padding-bottom: 10px;
border-bottom: 1px solid #f2f2f2;
}
.approver_self_select,
.approver_content{
.el-button{
margin-bottom: 20px;
}
}
.approver_content,
.approver_some,
.approver_self_select{
.el-radio-group{
display: unset;
}
.el-radio{
width: 27%;
margin-bottom: 20px;
height: 16px;
}
}
.approver_manager p {
line-height: 32px;
}
.approver_manager select {
width: 420px;
height: 32px;
background: rgba(255, 255, 255, 1);
border-radius: 4px;
border: 1px solid rgba(217, 217, 217, 1);
}
.approver_manager p.tip {
margin: 10px 0 22px 0;
font-size: 12px;
line-height: 16px;
color: #f8642d;
}
.approver_self {
padding: 28px 20px;
}
.approver_self_select,
.approver_manager,
.approver_content,
.approver_some {
padding: 20px 20px 0;
}
.approver_manager p:first-of-type,
.approver_some p {
line-height: 19px;
font-size: 14px;
margin-bottom: 14px;
}
.approver_self_select h3 {
margin: 5px 0 20px;
font-size: 14px;
font-weight: bold;
line-height: 19px;
}
}
</style>

304
src/components/workflow/drwer/conditionDrawer.vue

@ -0,0 +1,304 @@
<!--
@ 作者: 秦东
@ 时间: 2023-10-11 11:05:45
@ 备注: 条件设置
-->
<script lang='ts' setup>
import $func from '@/utils/workflow/index'
import { useStore } from '@/store/workflow/index'
import { optTypes, opt1s } from '@/utils/workflow/const'
import { getConditions } from '@/api/workflowapi/index'
let conditionVisible = ref(false)
let conditionsConfig = ref({
conditionNodes: [],
})
let conditionConfig = ref({})
let PriorityLevel = ref('')
let conditions = ref([])
let conditionList = ref([])
let checkedList = ref([])
let conditionRoleVisible = ref(false)
let store = useStore()
let { setCondition, setConditionsConfig } = store
let tableId = computed(()=> store.tableId)
let conditionsConfig1 = computed(()=> store.conditionsConfig1)
let conditionDrawer = computed(()=> store.conditionDrawer)
let visible = computed({
get() {
return conditionDrawer.value
},
set() {
closeDrawer()
}
})
watch(conditionsConfig1, (val) => {
console.log("val.priorityLevel",val.priorityLevel)
conditionsConfig.value = val.value;
PriorityLevel.value = val.priorityLevel
conditionConfig.value = val.priorityLevel
? conditionsConfig.value.conditionNodes[val.priorityLevel - 1]
: { nodeUserList: [], conditionList: [] }
})
const changeOptType = (item) => {
if (item.optType == 1) {
item.zdy1 = 2;
} else {
item.zdy1 = 1;
item.zdy2 = 2;
}
}
const toStrChecked = (item, key) => {
let a = item.zdy1 ? item.zdy1.split(",") : []
var isIncludes = $func.toggleStrClass(item, key);
if (!isIncludes) {
a.push(key)
item.zdy1 = a.toString()
} else {
removeStrEle(item, key);
}
}
const removeStrEle = (item, key) => {
let a = item.zdy1 ? item.zdy1.split(",") : []
var includesIndex;
a.map((item, index) => {
if (item == key) {
includesIndex = index
}
});
a.splice(includesIndex, 1);
item.zdy1 = a.toString()
}
const addCondition = async () => {
conditionList.value = [];
conditionVisible.value = true;
let { data } = await getConditions({ tableId: tableId.value })
conditions.value = data;
if (conditionConfig.value.conditionList) {
for (var i = 0; i < conditionConfig.value.conditionList.length; i++) {
var { columnId } = conditionConfig.value.conditionList[i]
if (columnId == 0) {
conditionList.value.push({ columnId: 0 })
} else {
conditionList.value.push(conditions.value.filter(item => { return item.columnId == columnId; })[0])
}
}
}
}
const sureCondition = () => {
//1.+
//2.
for (var i = 0; i < conditionList.value.length; i++) {
var { columnId, showName, columnName, showType, columnType, fixedDownBoxValue } = conditionList.value[i];
if ($func.toggleClass(conditionConfig.value.conditionList, conditionList.value[i], "columnId")) {
continue;
}
if (columnId == 0) {
conditionConfig.value.nodeUserList = [];
conditionConfig.value.conditionList.push({
"type": 1,
"columnId": columnId,
"showName": '发起人'
});
} else {
if (columnType == "Double") {
conditionConfig.value.conditionList.push({
"showType": showType,
"columnId": columnId,
"type": 2,
"showName": showName,
"optType": "1",
"zdy1": "2",
"opt1": "<",
"zdy2": "",
"opt2": "<",
"columnDbname": columnName,
"columnType": columnType,
})
} else if (columnType == "String" && showType == "3") {
conditionConfig.value.conditionList.push({
"showType": showType,
"columnId": columnId,
"type": 2,
"showName": showName,
"zdy1": "",
"columnDbname": columnName,
"columnType": columnType,
"fixedDownBoxValue": fixedDownBoxValue
})
}
}
}
//3.-
for (let i = conditionConfig.value.conditionList.length - 1; i >= 0; i--) {
if (!$func.toggleClass(conditionList.value, conditionConfig.value.conditionList[i], "columnId")) {
conditionConfig.value.conditionList.splice(i, 1);
}
}
conditionConfig.value.conditionList.sort(function (a, b) { return a.columnId - b.columnId; });
conditionVisible.value = false;
}
const saveCondition = () => {
closeDrawer()
var a = conditionsConfig.value.conditionNodes.splice(PriorityLevel.value - 1, 1)//
conditionsConfig.value.conditionNodes.splice(conditionConfig.value.priorityLevel - 1, 0, a[0])//
conditionsConfig.value.conditionNodes.map((item, index) => {
item.priorityLevel = index + 1
});
for (var i = 0; i < conditionsConfig.value.conditionNodes.length; i++) {
conditionsConfig.value.conditionNodes[i].error = $func.conditionStr(conditionsConfig.value, i) == "请设置条件" && i != conditionsConfig.value.conditionNodes.length - 1
}
setConditionsConfig({
value: conditionsConfig.value,
flag: true,
id: conditionsConfig1.value.id
})
}
const addConditionRole = () => {
conditionRoleVisible.value = true;
checkedList.value = conditionConfig.value.nodeUserList
}
const sureConditionRole = (data) => {
conditionConfig.value.nodeUserList = data;
conditionRoleVisible.value = false;
}
const closeDrawer = (val) => {
setCondition(false)
}
</script>
<template>
<el-drawer v-model="visible" :append-to-body="true" title="条件设置" class="condition_copyer" :show-close="false" :size="550" :before-close="saveCondition">
<template #header="{ titleId, titleClass }">
<h3 :id="titleId" :class="titleClass">条件设置</h3>
<select v-model="conditionConfig.priorityLevel" class="priority_level">
<option v-for="item in conditionsConfig.conditionNodes.length" :key="item" :value="item">优先级{{item}}</option>
</select>
</template>
<div class="demo-drawer__content">
<div class="condition_content drawer_content">
<p class="tip">当审批单同时满足以下条件时进入此流程</p>
</div>
<el-button type="primary" @click="addCondition">添加条件</el-button>
<div class="demo-drawer__footer clear">
<el-button type="primary" @click="saveCondition"> </el-button>
<el-button @click="closeDrawer"> </el-button>
</div>
</div>
</el-drawer>
</template>
<style lang="less">
.condition_copyer {
.priority_level {
position: absolute;
top: 11px;
right: 30px;
width: 100px;
height: 32px;
background: rgba(255, 255, 255, 1);
border-radius: 4px;
border: 1px solid rgba(217, 217, 217, 1);
font-size: 12px;
}
.condition_content {
padding: 20px 20px 0;
p.tip {
margin: 20px 0;
width: 510px;
text-indent: 17px;
line-height: 45px;
background: rgba(241, 249, 255, 1);
border: 1px solid rgba(64, 163, 247, 1);
color: #46a6fe;
font-size: 14px;
}
ul {
max-height: 500px;
overflow-y: scroll;
margin-bottom: 20px;
li {
&>span {
float: left;
margin-right: 8px;
width: 70px;
line-height: 32px;
text-align: right;
}
&>div {
display: inline-block;
width: 370px;
&>p:not(:last-child) {
margin-bottom: 10px;
}
}
&:not(:last-child)>div>p {
margin-bottom: 20px;
}
&>a {
float: right;
margin-right: 10px;
margin-top: 7px;
}
select,
input {
width: 100%;
height: 32px;
background: rgba(255, 255, 255, 1);
border-radius: 4px;
border: 1px solid rgba(217, 217, 217, 1);
}
select+input {
width: 260px;
}
select {
margin-right: 10px;
width: 100px;
}
p.selected_list {
padding-left: 10px;
border-radius: 4px;
min-height: 32px;
border: 1px solid rgba(217, 217, 217, 1);
word-break: break-word;
}
p.check_box {
line-height: 32px;
}
}
}
.el-button {
margin-bottom: 20px;
}
}
}
.condition_list {
.el-dialog__body {
padding: 16px 26px;
}
p {
color: #666666;
margin-bottom: 10px;
&>.check_box {
margin-bottom: 0;
line-height: 36px;
}
}
}
</style>

88
src/components/workflow/drwer/copyerDrawer.vue

@ -0,0 +1,88 @@
<!--
@ 作者: 秦东
@ 时间: 2023-10-11 11:02:24
@ 备注: 抄送配置
-->
<script lang='ts' setup>
import $func from '@/utils/workflow/index'
import { useStore } from '@/store/workflow/index'
let copyerConfig = ref({})
let ccSelfSelectFlag = ref([])
let copyerVisible = ref(false)
let checkedList = ref([])
let store = useStore()
let { setCopyerConfig, setCopyer } = store
let copyerDrawer = computed(()=> store.copyerDrawer)
let copyerConfig1 = computed(()=> store.copyerConfig1)
let visible = computed({
get() {
return copyerDrawer.value
},
set() {
closeDrawer()
}
})
watch(copyerConfig1, (val) => {
copyerConfig.value = val.value;
ccSelfSelectFlag.value = copyerConfig.value.ccSelfSelectFlag == 0 ? [] : [copyerConfig.value.ccSelfSelectFlag]
})
const addCopyer = () => {
copyerVisible.value = true;
checkedList.value = copyerConfig.value.nodeUserList
}
const sureCopyer = (data) => {
copyerConfig.value.nodeUserList = data;
copyerVisible.value = false;
}
const saveCopyer = () => {
copyerConfig.value.ccSelfSelectFlag = ccSelfSelectFlag.value.length == 0 ? 0 : 1;
copyerConfig.value.error = !$func.copyerStr(copyerConfig.value);
setCopyerConfig({
value: copyerConfig.value,
flag: true,
id: copyerConfig1.value.id
})
closeDrawer();
}
const closeDrawer = () => {
setCopyer(false)
}
</script>
<template>
<el-drawer v-model="visible" :append-to-body="true" title="抄送人设置" class="set_copyer" :show-close="false" :size="550" :before-close="saveCopyer">
<div class="demo-drawer__content">
<div class="copyer_content drawer_content">
<el-button type="primary" @click="addCopyer">添加成员</el-button>
<p class="selected_list">
<span v-for="(item,index) in copyerConfig.nodeUserList" :key="index">{{item.name}}
<img src="@/assets/images/add-close1.png" @click="$func.removeEle(copyerConfig.nodeUserList,item,'targetId')">
</span>
<a v-if="copyerConfig.nodeUserList&&copyerConfig.nodeUserList.length!=0" @click="copyerConfig.nodeUserList=[]">清除</a>
</p>
<el-checkbox-group v-model="ccSelfSelectFlag" class="clear">
<el-checkbox :label="1">允许发起人自选抄送人</el-checkbox>
</el-checkbox-group>
</div>
<div class="demo-drawer__footer clear">
<el-button type="primary" @click="saveCopyer"> </el-button>
<el-button @click="closeDrawer"> </el-button>
</div>
</div>
</el-drawer>
</template>
<style lang='scss' scoped>
.set_copyer {
.copyer_content {
padding: 20px 20px 0;
.el-button {
margin-bottom: 20px;
}
.el-checkbox {
margin-bottom: 20px;
}
}
}
</style>

87
src/components/workflow/drwer/promoterDrawer.vue

@ -0,0 +1,87 @@
<!--
@ 作者: 秦东
@ 时间: 2023-10-11 08:39:10
@ 备注: 发起人节点操作
-->
<script lang='ts' setup>
import employeesDialog from '@/components/workflow/dialog/employeesDialog.vue'
import $func from '@/utils/workflow/index'
import { useStore } from '@/store/workflow/index'
let flowPermission = ref([])
let promoterVisible = ref(false)
let checkedList = ref([])
let store = useStore()
let { setPromoter, setFlowPermission } = store
let promoterDrawer = computed(()=> store.promoterDrawer)
let flowPermission1 = computed(()=> store.flowPermission1)
let visible = computed({
get() {
return promoterDrawer.value
},
set() {
closeDrawer()
}
})
watch(flowPermission1, (val) => {
flowPermission.value = val.value
})
const addPromoter = () => {
checkedList.value = flowPermission.value
promoterVisible.value = true;
}
const surePromoter = (data) => {
flowPermission.value = data;
promoterVisible.value = false;
}
const savePromoter = () => {
setFlowPermission({
value: flowPermission.value,
flag: true,
id: flowPermission1.value.id
})
closeDrawer()
}
const closeDrawer = () => {
setPromoter(false)
}
</script>
<template>
<el-drawer v-model="visible" :append-to-body="true" title="发起人" class="set_promoter" :show-close="false" :size="550" :before-close="savePromoter">
<div class="demo-drawer__content">
<div class="promoter_content drawer_content">
<p>{{ $func.arrToStr(flowPermission) || '所有人' }}</p>
<el-button type="primary" @click="addPromoter">添加/修改发起人</el-button>
</div>
<div class="demo-drawer__footer clear">
<el-button type="primary" @click="savePromoter"> </el-button>
<el-button @click="closeDrawer"> </el-button>
</div>
<employees-dialog
v-model:visible="promoterVisible"
:isdepartment="true"
:data="checkedList"
@change="surePromoter"
/>
</div>
</el-drawer>
</template>
<style lang='scss' scoped>
.set_promoter {
.promoter_content {
padding: 0 20px;
.el-button {
margin-bottom: 20px;
}
p {
padding: 18px 0;
font-size: 14px;
line-height: 20px;
color: #000000;
}
}
}
</style>

34
src/components/workflow/nodeWrap.vue

@ -130,7 +130,7 @@ const setPerson = (priorityLevel) => {
flag: false,
id: _uid,
});
} else if (type == 1) {
} else if (type == 1 || type == 3) {
setApprover(true);
setApproverConfig({
value: {
@ -215,16 +215,8 @@ onMounted(() => {
<span v-if="nodeConfig.type == 0">{{ nodeConfig.nodeName }}</span>
<template v-else>
<span class="iconfont">{{nodeConfig.type == 1?'':''}}</span>
<input
v-if="isInput"
v-model="nodeConfig.nodeName"
type="text"
class="ant-input editable-title-input"
@blur="blurEvent()"
@focus="$event.currentTarget.select()"
v-focus
:placeholder="defaultText"
/>
<!--eslint-disable-next-line vue/no-mutating-props-->
<input v-if="isInput" v-model="nodeConfig.nodeName" v-focus :placeholder="defaultText" type="text" class="ant-input editable-title-input" @blur="blurEvent()" @focus="$event.currentTarget.select()" />
<span v-else class="editable-title" @click="clickEvent()">{{ nodeConfig.nodeName }}</span>
<i class="anticon anticon-close close" @click="delNode"></i>
</template>
@ -232,16 +224,17 @@ onMounted(() => {
<!--标签主体-->
<div class="content" @click="setPerson">
<div class="text">
<span class="placeholder" v-if="!showText">请选择{{defaultText}}</span>
<span v-if="!showText" class="placeholder">请选择{{defaultText}}</span>
{{showText}}
</div>
<i class="anticon anticon-right arrow"></i>
</div>
<!--标签错误提示-->
<div class="error_tip" v-if="isTried && nodeConfig.error">
<div v-if="isTried && nodeConfig.error" class="error_tip">
<i class="anticon anticon-exclamation-circle"></i>
</div>
</div>
<!--eslint-disable-next-line vue/no-mutating-props-->
<addNode v-model:childNodeP="nodeConfig.childNode" />
</div>
<!--路由模块-->
@ -249,28 +242,29 @@ onMounted(() => {
<div class="branch-box-wrap">
<div class="branch-box">
<button class="add-branch" @click="addTerm">添加条件</button>
<div class="col-box" v-for="(item, index) in nodeConfig.conditionNodes" :key="index">
<div v-for="(item, index) in nodeConfig.conditionNodes" :key="index" class="col-box" >
<div class="condition-node">
<div class="condition-node-box">
<div class="auto-judge" :class="isTried && item.error ? 'error active' : ''">
<div class="sort-left" v-if="index != 0" @click="arrTransfer(index, -1)">&lt;</div>
<div v-if="index != 0" class="sort-left" @click="arrTransfer(index, -1)">&lt;</div>
<div class="title-wrapper">
<input
v-if="isInputList[index]"
v-model="item.nodeName"
v-focus
type="text"
class="ant-input editable-title-input"
@blur="blurEvent(index)"
@focus="$event.currentTarget.select()"
v-focus
v-model="item.nodeName"
/>
<span v-else class="editable-title" @click="clickEvent(index)">{{ item.nodeName }}</span>
<span class="priority-title" @click="setPerson(item.priorityLevel)">优先级{{ item.priorityLevel }}</span>
<i class="anticon anticon-close close" @click="delTerm(index)"></i>
</div>
<div class="sort-right" v-if="index != nodeConfig.conditionNodes.length - 1" @click="arrTransfer(index)">&gt;</div>
<div v-if="index != nodeConfig.conditionNodes.length - 1" class="sort-right" @click="arrTransfer(index)">&gt;</div>
<div class="content" @click="setPerson(item.priorityLevel)">{{ $func.conditionStr(nodeConfig, index) }}</div>
<div class="error_tip" v-if="isTried && item.error">
<div v-if="isTried && item.error" class="error_tip" >
<i class="anticon anticon-exclamation-circle"></i>
</div>
</div>
@ -288,10 +282,12 @@ onMounted(() => {
</template>
</div>
</div>
<!--eslint-disable-next-line vue/no-mutating-props-->
<addNode v-model:childNodeP="nodeConfig.childNode" />
</div>
</div>
<!--循环组件-->
<!--eslint-disable-next-line vue/no-mutating-props-->
<nodeWrap v-if="nodeConfig.childNode" v-model:nodeConfig="nodeConfig.childNode"/>
</template>
<style lang='scss' scoped>

15
src/views/sysworkflow/flow/index.vue

@ -10,6 +10,12 @@ import { useStore } from '@/store/workflow/index'
import { tipListStrucr } from '@/api/workflowapi/types'
import { initializeWorkFlow,setWorkFlowData } from '@/api/workflowapi/index'
//
import errorDialog from "@/components/workflow/dialog/errorDialog.vue";
import promoterDrawer from "@/components/workflow/drwer/promoterDrawer.vue";
import approverDrawer from "@/components/workflow/drwer/approverDrawer.vue";
import copyerDrawer from "@/components/workflow/drwer/copyerDrawer.vue";
import conditionDrawer from "@/components/workflow/drwer/conditionDrawer.vue";
const flowcont = ref()
const drawer = ref(false)
@ -130,11 +136,11 @@ const clearCanvas = () =>{
<template #header="{ close, titleId, titleClass }">
<h4 :id="titleId" :class="titleClass">创建流程</h4>
<el-button type="warning" @click="clearCanvas">
<el-icon class="el-icon--left"><CircleCloseFilled /></el-icon>
<el-icon class="el-icon--left"><Delete /></el-icon>
清空
</el-button>
<el-button type="primary" @click="saveSet">
<el-icon class="el-icon--left"><CircleCloseFilled /></el-icon>
<el-icon class="el-icon--left"><Promotion /></el-icon>
发布
</el-button>
<el-button type="danger" @click="close">
@ -160,6 +166,11 @@ const clearCanvas = () =>{
</div>
</section>
</div>
<errorDialog v-model:visible="tipVisible" :list="tipList" />
<promoterDrawer />
<approverDrawer :directormaxlevel="directorMaxLevel" />
<copyerDrawer />
<conditionDrawer />
</div>
</el-drawer>
</div>

Loading…
Cancel
Save