Browse Source

Merge branch 'v3'

liwenxuan_v2
超级管理员 2 years ago
parent
commit
e51c6341bf
  1. 25
      src/api/displayboardapi/indexapi.ts
  2. 12
      src/api/workflowapi/index.ts
  3. 19
      src/api/workflowapi/types.ts
  4. 6
      src/components/workflow/addNode.vue
  5. 33
      src/components/workflow/dialog/common.ts
  6. 135
      src/components/workflow/dialog/formWord.vue
  7. 104
      src/components/workflow/dialog/positionDialog.vue
  8. 160
      src/components/workflow/drwer/approverDrawer.vue
  9. 387
      src/components/workflow/drwer/conditionDrawer.vue
  10. 23
      src/components/workflow/selectBoxs.vue
  11. 16
      src/components/workflow/selectResult.vue
  12. 3
      src/styles/workflowcss/workflow.scss
  13. 5
      src/utils/workflow/const.ts
  14. 29
      src/utils/workflow/index.ts
  15. 233
      src/views/sysworkflow/codepage/index.vue
  16. 277
      src/views/sysworkflow/flow/flowDrawingBoard.vue
  17. 168
      src/views/sysworkflow/flow/index.vue
  18. 160
      vite.config.ts.timestamp-1697610303012-42c6e5d26ab95.mjs

25
src/api/displayboardapi/indexapi.ts

@ -86,3 +86,28 @@ export const getRoles = (data?: any) => {
data: data
})
}
//搜索角色(新版)
export const SearchPositionUnify = (data?: any) => {
return request({
url: '/kpiapi/powerpc/search_position_unify',
method: 'post',
data: data
})
}
//获取统一岗位
export const GetPositionUnify = (data?: any) => {
return request({
url: '/kpiapi/powerpc/get_position_unify',
method: 'post',
data: data
})
}
//获取审批节点或条件节点
export const gainNodeFactor = (data?: any) => {
return request({
url: '/systemapi/task_flow/gain_node_factor',
method: 'post',
data: data
})
}

12
src/api/workflowapi/index.ts

@ -2,7 +2,9 @@ import request from '@/utils/request';
import { AxiosPromise } from 'axios';
import {
formTableName
formTableName,
flowversion,
publicid
} from '@/api/workflowapi/types'
//初始化工作流
@ -45,3 +47,11 @@ export function judgeOptionalNode(data: any) {
data: data
});
}
//获取工作流版本列表
export function gainFlowVersionList(data: publicid): AxiosPromise<flowversion> {
return request({
url: '/systemapi/task_flow/gain_flow_version_list',
method: 'post',
data: data
});
}

19
src/api/workflowapi/types.ts

@ -1,9 +1,26 @@
export interface publicid{
id?: string;
}
//表单名称
export interface formTableName{
name?: string;
}
//错误提示
export interface tipListStrucr{
export interface flowversion{
id:string;
version:string;
state:number;
key:string;
}
//工作流判断条件
export interface flowFactorCont{
id:number;
factorid:string;
options:optionsInfo[]
}
export interface optionsInfo{
label:string;
value:string;
}

6
src/components/workflow/addNode.vue

@ -66,7 +66,8 @@ const addType = (type:any)=> {
"nodeUserList": [],
"fromNode": fromNodeNumber,
"gotoNode":[gotoNodeNumber],
"sendBackNode":"beginnode"
"sendBackNode":"beginnode",
"attribute":1
}
// console.log("p4",data)
} else if (type == 2) {
@ -98,7 +99,8 @@ const addType = (type:any)=> {
"nodeUserList": [],
"fromNode": fromNodeNumber,
"gotoNode":[gotoNodeNumber],
"sendBackNode":"beginnode"
"sendBackNode":"beginnode",
"attribute":1
}
// console.log("p6",data)
}

33
src/components/workflow/dialog/common.ts

@ -1,12 +1,14 @@
import $func from '@/utils/workflow/index'
import { outputOrgAndUser } from '@/api/displayboardapi/types'
import { getBasisOrgChiled,getEmployees,getRoles } from '@/api/displayboardapi/indexapi'
import { getBasisOrgChiled,getEmployees,getRoles,SearchPositionUnify,GetPositionUnify,gainNodeFactor } from '@/api/displayboardapi/indexapi'
export let searchVal = ref<any>('')
export let departments = ref<any>()
export let roles = ref({})
export let positionList = ref<any>()
export let formWordList = ref<any>()
//获取行政组织及人员
export let getDepartmentList = async (parentId:any = 0) => {
@ -39,8 +41,37 @@ export let getDebounceData = (event:any, type = 1) => {
}
})()
}
export let searchPostName =async (event:any, type = 1) => {
let sendData ={
name:event.target.value
}
console.log("searchPostName",sendData)
let { data } = await SearchPositionUnify(sendData);
positionList.value = data;
}
//角色列表
export let getRoleList = async () => {
let { data: { list } } = await getRoles()
roles.value = list;
}
export let getPostList = async () => {
let { data } = await GetPositionUnify()
console.log("getPostList",data);
positionList.value = data;
}
//获取表单字段
export let gainFormTableWorde = async (id:string,types:number) => {
let sendData ={
id:id,
types:types
}
console.log("gainFormTableWorde--->",sendData);
let { data } = await gainNodeFactor(sendData)
console.log("gainFormTableWorde",data);
formWordList.value = data;
}

135
src/components/workflow/dialog/formWord.vue

@ -0,0 +1,135 @@
<!--
@ 作者: 秦东
@ 时间: 2023-10-20 13:32:10
@ 备注: 表单字段
-->
<script lang='ts' setup>
import { formWordList, gainFormTableWorde, searchVal } from '@/components/workflow/dialog/common'
import $func from '@/utils/workflow/index'
//
import '@/styles/workflowcss/dialog.scss'
//
import selectBox from '@/components/workflow/selectBoxs.vue'
import selectResult from '@/components/workflow/selectResult.vue'
let props = defineProps({
visible: {
type: Boolean,
default: false
},
data: {
type: Array,
default: () => []
},
formid:{
type:String,
default:""
},
formtype:{
type:Number,
default:1
}
});
let checkedFormList = ref([])
let emits = defineEmits(['update:visible', 'change'])
let list = computed(() => {
if(props.formtype == 1){
return [{
type: 'formword',
not: false,
data: formWordList.value,
isActive: (item) => $func.toggleClass(checkedFormList.value, item, 'id'),
change: (item) => {
checkedFormList.value = [item]
}
}]
}else{
return [{
type: 'formword',
not: true,
data: formWordList.value,
isActive: (item) => $func.toggleClass(checkedFormList.value, item, 'id'),
change: (item)=> $func.toChecked(checkedFormList.value, item),
}]
}
})
let resList = computed(() => {
if(props.formtype == 1){
return [{
type: 'formword',
data: checkedFormList.value,
cancel: (item) => $func.removeEle(checkedFormList.value, item, 'id')
}]
}else{
return [{
type: 'formword',
data: checkedFormList.value,
cancel: (item)=> $func.removeEle(checkedFormList.value, item)
}]
}
})
//
const closeDialog = () => {
emits('update:visible', false)
}
let isShow = computed({
get() {
return props.visible
},
set(val) {
closeDialog()
}
})
watch(() => props.visible, (val) => {
if (val) {
gainFormTableWorde(props.formid,props.formtype);
searchVal.value = "";
checkedFormList.value = props.data.map(({ name, id,options,isCheckbox }) => ({
name: name,
id: id,
options:options,
isCheckbox:isCheckbox
}));
}
})
let total = computed(() => checkedFormList.value.length)
const saveDialog = () => {
let checkedList = checkedFormList.value.map(item => ({
type: props.formtype,
name: item.name,
id: item.id,
options:item.options,
isCheckbox:item.isCheckbox
}))
emits('change', checkedList)
}
const delList = () => {
checkedFormList.value = [];
}
</script>
<template>
<el-dialog v-model="isShow" title="选择人力资源字段" :width="600" append-to-body class="promoter_person">
<div class="person_body clear">
<el-row>
<el-col :span="12">
<div class="person_tree l">
<selectBox :list="list"/>
</div>
</el-col>
<el-col :span="12">
<selectResult :list="resList" :total="total" @del="delList"/>
</el-col>
</el-row>
</div>
<template #footer>
<el-button @click="closeDialog"> </el-button>
<el-button type="primary" @click="saveDialog"> </el-button>
</template>
</el-dialog>
</template>
<style lang='scss' scoped>
</style>

104
src/components/workflow/dialog/positionDialog.vue

@ -0,0 +1,104 @@
<!--
@ 作者: 秦东
@ 时间: 2023-10-19 08:13:15
@ 备注: 行政岗位
-->
<script lang='ts' setup>
import { positionList, searchPostName, getPostList, searchVal } from '@/components/workflow/dialog/common'
import $func from '@/utils/workflow/index'
//
import '@/styles/workflowcss/dialog.scss'
//
import selectBox from '@/components/workflow/selectBoxs.vue'
import selectResult from '@/components/workflow/selectResult.vue'
let props = defineProps({
visible: {
type: Boolean,
default: false
},
data: {
type: Array,
default: () => []
}
});
let checkedRoleList = ref([])
let emits = defineEmits(['update:visible', 'change'])
let list = computed(() => {
return [{
type: 'position',
data: positionList.value,
isActive: (item) => $func.toggleClass(checkedRoleList.value, item, 'id'),
// change: (item) => {
// checkedRoleList.value = [item]
// }
change: (item)=> $func.toChecked(checkedRoleList.value, item),
}]
})
let resList = computed(() => {
return [{
type: 'position',
data: checkedRoleList.value,
// cancel: (item) => $func.removeEle(checkedRoleList.value, item, 'id')
cancel: (item)=> $func.removeEle(checkedRoleList.value, item)
}]
})
let visibleDialog = computed({
get() {
return props.visible
},
set(val) {
closeDialog()
}
})
watch(() => props.visible, (val) => {
if (val) {
getPostList();
searchVal.value = "";
checkedRoleList.value = props.data.map(({ name, targetId }) => ({
name: name,
id: targetId
}));
}
})
let total = computed(() => checkedRoleList.value.length)
const saveDialog = () => {
let checkedList = checkedRoleList.value.map(item => ({
type: "position",
targetId: item.id,
name: item.name
}))
emits('change', checkedList)
}
const delList = () => {
checkedRoleList.value = [];
}
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">
<el-row>
<el-col :span="12">
<div class="person_tree l">
<input v-model="searchVal" type="text" placeholder="搜索岗位" @input="searchPostName($event,2)">
<selectBox :list="list"/>
</div>
</el-col>
<el-col :span="12">
<selectResult :list="resList" :total="total" @del="delList"/>
</el-col>
</el-row>
</div>
<template #footer>
<el-button @click="closeDialog"> </el-button>
<el-button type="primary" @click="saveDialog"> </el-button>
</template>
</el-dialog>
</template>
<style lang='scss' scoped>
</style>

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

@ -9,6 +9,9 @@ import { setTypes, selectModes, selectRanges } from '@/utils/workflow/const'
import { useStore } from '@/store/workflow/index'
import { getAllParentNode,judgeOptionalNode } from '@/api/workflowapi/index'
import PositionDialog from '@/components/workflow/dialog/positionDialog.vue'
import FormWord from '@/components/workflow/dialog/formWord.vue'
let props = defineProps({
nodeConfig:{
type: Object,
@ -17,15 +20,28 @@ let props = defineProps({
directormaxlevel: {
type: Number,
default: 4
}
},
isFormFlow:{
type:Boolean,
default:true
},
customerFormKey:{
type:String,
default:""
},
});
const isExecutor = ref(false)
const nodeTitle = ref<string>("审批人设置")
const nodeOptional = ref<any[]>() //线
const nodeAllVerify = ref<any[]>()
let approverConfig = ref<any>({})
let approverVisible = ref(false)
let approverRoleVisible = ref(false)
let checkedRoleList = ref<any[]>([])
let appPosistonVisible = ref(false)
let appFormTableVisible = ref(false)
let checkedRoleList = ref<any[]>([]) //
let checkedPostList = ref<any[]>([]) //
let checkedFormList = ref<any[]>([]) //
let checkedList = ref<any[]>([])
let store = useStore()
let { setApproverConfig, setApprover } = store
@ -40,30 +56,46 @@ let visible = computed({
}
})
watch(visible,(val:any)=>{
// if(val)
})
watch(approverConfig1, (val:any)=>{
// console.log("directormaxlevel",props.directormaxlevel)
console.log("directormaxlevel",visible.value)
approverConfig.value = val.value
if(val.type == 3){
nodeTitle.value = "执行人设置"
}else{
nodeTitle.value = "审批人设置"
}
isExecutor.value = false
judgeOptionalNode(props.nodeConfig)
.then((data)=>{
if(visible.value){
judgeOptionalNode(props.nodeConfig)
.then((data:any)=>{
if(data.code == 0){
let sendData = {
id:val.value.fromNode,
allcont:data.data.allcont
}
getAllParentNode(sendData)
.then((data)=>{
.then((data:any)=>{
if(data.code == 0){
nodeOptional.value = data.data.allcont
if(data.data.allcont && data.data.allcont.length > 0){
data.data.allcont.forEach(item => {
if(item.type == 3){
isExecutor.value = true
return
}
});
}
}
})
}
})
}
})
@ -91,6 +123,14 @@ const addRoleApprover = ()=> {
approverRoleVisible.value = true;
checkedRoleList.value = approverConfig.value.nodeUserList
}
const addApproverPost = ()=> {
appPosistonVisible.value = true;
checkedPostList.value = approverConfig.value.nodeUserList
}
const surePostApprover = (data:any)=> {
appPosistonVisible.value = false;
approverConfig.value.nodeUserList = data;
}
const sureApprover = (data:any)=> {
approverConfig.value.nodeUserList = data;
approverVisible.value = false;
@ -110,16 +150,39 @@ const saveApprover = ()=> {
}
const closeDrawer = ()=> {
setApprover(false)
isExecutor.value = false
}
//
const isShowRatify = (id:number)=>{
if(id == 8){
return props.isFormFlow
}else{
return true
}
}
//
const formTableField = ()=> {
appFormTableVisible.value = true;
checkedFormList.value = approverConfig.value.nodeUserList
}
const sureFormTableApprover = (data:any)=> {
approverConfig.value.nodeUserList = data;
appFormTableVisible.value = false;
}
</script>
<template>
<el-drawer v-model="visible" :append-to-body="true" :title="nodeTitle" 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" style="width:auto">{{label}}=>{{value}}</el-radio>
<template v-for="({value, label}) in setTypes" :key="value">
<el-radio v-if="isShowRatify(value)" :label="value" style="width:auto">{{label}}=>{{value}}</el-radio>
</template>
</el-radio-group>
</div>
<!--指定成员-->
@ -133,14 +196,42 @@ const closeDrawer = ()=> {
<!--主管-->
<div v-if="approverConfig.settype==2" class="approver_manager">
<p>
<span>发起人的</span>
<select v-model="approverConfig.directorLevel">
<option v-for="item in props.directormaxlevel" :key="item" :value="item">{{item==1?'直接':''+item+''}}主管</option>
</select>
<el-row :gutter="10">
<el-col :span="6">
<select v-model="approverConfig.attribute" style="width:100%">
<option value="1">发起人</option>
<option v-if="isExecutor" value="2">执行人</option>
</select>
</el-col>
<el-col :span="18">
<select v-model="approverConfig.directorLevel">
<option v-for="item in props.directormaxlevel" :key="item" :value="item">{{item==1?'直接':''+item+''}}主管</option>
</select>
</el-col>
</el-row>
</p>
<p class="tip">找不到主管时由上级主管代审批</p>
</div>
<!--行政岗位-->
<div v-if="approverConfig.settype==3" class="approver_manager">
<p>指定行政岗位</p>
<el-row>
<el-col :span="18">
<el-button type="primary" @click="addApproverPost">添加/修改行政岗位</el-button>
</el-col>
<el-col :span="6">
<select v-model="approverConfig.attribute" style="width:100%">
<option value="1">发起人</option>
<option v-if="isExecutor" value="2">执行人</option>
</select>
</el-col>
</el-row>
<p class="selected_list">
<el-tag v-for="(item,index) in approverConfig.nodeUserList" :key="index" closable type="info" effect="plain" class="tag_us" @close="$func.removeEle(approverConfig.nodeUserList,item,'targetId')">{{item.name}}</el-tag>
<el-tag v-if="approverConfig.nodeUserList.length!=0" type="danger" effect="dark" @click="approverConfig.nodeUserList=[]">清除</el-tag>
</p>
</div>
<!--发起人自选-->
<div v-show="approverConfig.settype==4" class="approver_self_select">
<el-radio-group v-model="approverConfig.selectMode" style="width: 100%;">
@ -167,10 +258,20 @@ const closeDrawer = ()=> {
<div v-if="approverConfig.settype==6" class="approver_manager">
<p>审批终点</p>
<p style="padding-bottom:20px">
<span>发起人的</span>
<select v-model="approverConfig.examineEndDirectorLevel">
<option v-for="item in props.directormaxlevel" :key="item" :value="item">{{item==1?'直接':''+item}}层级主管</option>
</select>
<el-row :gutter="10">
<el-col :span="6">
<select v-model="approverConfig.attribute" style="width:100%">
<option value="1">发起人</option>
<option v-if="isExecutor" value="2">执行人</option>
</select>
</el-col>
<el-col :span="10">
<select v-model="approverConfig.directorLevel">
<option v-for="item in props.directormaxlevel" :key="item" :value="item">{{item==1?'直接':''+item+''}}主管</option>
</select>
</el-col>
</el-row>
</p>
</div>
<!--指定审批节点为本节点设置审批人-->
@ -182,9 +283,16 @@ const closeDrawer = ()=> {
</el-radio-group>
</div>
<div v-if="approverConfig.settype==8" class="approver_manager">
<p>指定审批字段</p>
<el-button type="primary" @click="formTableField">添加/修改审批字段</el-button>
<p class="selected_list">
<el-tag v-for="(item,index) in approverConfig.nodeUserList" :key="index" closable type="info" effect="plain" class="tag_us" @close="$func.removeEle(approverConfig.nodeUserList,item,'targetId')">{{item.name}}</el-tag>
<el-tag v-if="approverConfig.nodeUserList.length!=0" type="danger" effect="dark" @click="approverConfig.nodeUserList=[]">清除</el-tag>
</p>
</div>
<!--补充审批信息-->
<div v-if="(approverConfig.settype==1&&approverConfig.nodeUserList.length>1)||approverConfig.settype==2||(approverConfig.settype==4&&approverConfig.selectMode==2)" class="approver_some">
<div v-if="(approverConfig.settype==1&&approverConfig.nodeUserList.length>1)||approverConfig.settype==2||approverConfig.settype==6||(approverConfig.settype==4&&approverConfig.selectMode==2)||approverConfig.settype==8" class="approver_some">
<p>多人审批时采用的审批方式</p>
<el-radio-group v-model="approverConfig.examineMode" class="clear">
<el-radio :label="1">依次审批</el-radio>
@ -229,8 +337,20 @@ const closeDrawer = ()=> {
:data="checkedRoleList"
@change="sureRoleApprover"
/>
<!--选择岗位-->
<PositionDialog
v-model:visible="appPosistonVisible"
:data="checkedPostList"
@change="surePostApprover"
/>
<!--表单字段-->
<FormWord
v-model:visible="appFormTableVisible"
:data="checkedFormList"
:formid="props.customerFormKey"
:formtype="1"
@change="sureFormTableApprover"
/>
</div>
</el-drawer>

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

@ -6,8 +6,26 @@
<script lang='ts' setup>
import $func from '@/utils/workflow/index'
import { useStore } from '@/store/workflow/index'
import { optTypes, opt1s } from '@/utils/workflow/const'
import { optTypes, opt1s,flowFactor } from '@/utils/workflow/const'
import { flowFactorCont } from '@/api/workflowapi/types'
import { getConditions } from '@/api/workflowapi/index'
import { gainNodeFactor } from '@/api/displayboardapi/indexapi'
let props = defineProps({
isFormFlow:{
type:Boolean,
default:true
},
customerFormKey:{
type:String,
default:""
},
});
const flowFactorList = ref<any[]>([]);
let conditionVisible = ref(false)
let conditionsConfig = ref({
conditionNodes: [],
@ -33,7 +51,6 @@ let visible = computed({
}
})
watch(conditionsConfig1, (val:any) => {
// console.log("val.priorityLevel",val.priorityLevel)
conditionsConfig.value = val.value;
PriorityLevel.value = val.priorityLevel
conditionConfig.value = val.priorityLevel
@ -41,130 +58,175 @@ watch(conditionsConfig1, (val:any) => {
: { nodeUserList: [], conditionList: [] }
})
const changeOptType = (item) => {
if (item.optType == 1) {
item.zdy1 = 2;
} else {
item.zdy1 = 1;
item.zdy2 = 2;
}
watch(visible,(val:any)=>{
if(val){
if(flowFactor.length>0){
flowFactor.forEach(ites=>{
flowFactorList.value.push({
id:ites.id,
name:ites.name,
keyid:ites.keyid,
type:ites.type,
isok:ites.isok,
isCheckbox:ites.isCheckbox,
options:ites.options
})
})
}
if(props.isFormFlow){
let sendData ={
id:props.customerFormKey,
types:2
}
gainNodeFactor(sendData)
.then(({data}) =>{
console.log("......>",data)
if(data.length > 0){
data.forEach(item=>{
flowFactorList.value.push({
id:flowFactorList.value.length+1,
name:item.name,
keyid:item.id,
type:3,
isok:false,
isCheckbox:item.isCheckbox,
options:item.options
})
})
}
})
}
}else{
flowFactorList.value = []
}
})
const closeDrawer = (val?:any) => {
initFactor()
setCondition(false)
}
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 isDelField = ref(false)
const tableList = ref<any[]>([])
const maxFactor = ref(false)
const tiaoJianAry = ref<any>()
//
const pickFactor = (val:any) => {
let tableKeyAry = new Array
tableList.value.forEach(item=>{
tableKeyAry.push(item.factorid)
})
let types = 0
let options = new Array
let isCheckbox = false
flowFactorList.value.forEach(item=>{
if(item.keyid == val){
item.isok=true
types = item.type
options = item.options
isCheckbox = item.isCheckbox
}else{
if(tableKeyAry.length>0){
if(tableKeyAry.includes(item.keyid)){
item.isok=true
}else{
item.isok=false
}
}
}
})
tableList.value.forEach(item=>{
if(item.factorid == val){
item.type = types
item.options = options
item.isCheckbox = isCheckbox
}
})
console.log("tableList--->",tableList.value,val,types);
}
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 addFactorCondition = () => {
let currLent = tableList.value.length
if(currLent < flowFactorList.value.length){
tableList.value.push({id:currLent+1,factorid:"",type:0})
if(currLent+1 >= flowFactorList.value.length){
maxFactor.value = true
}else{
maxFactor.value = false
}
}else{
maxFactor.value = true
}
if(tableList.value.length > 1){
isDelField.value = true
}else{
isDelField.value = false
}
}
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 initFactor = () => {
maxFactor.value = false
if(tableList.value.length>0){
tableList.value = []
}
if(flowFactorList.value.length>0){
flowFactorList.value = []
}
}
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 delTiaoJian = (val:any) => {
let currLent = tableList.value.length
if(currLent>0){
let guoduTable = []
tableList.value.forEach(item=>{
if(item.factorid != val.factorid){
guoduTable.push(item)
}
})
tableList.value = guoduTable
}
flowFactorList.value.forEach(item=>{
if(item.keyid == val.factorid){
item.isok=false
}
})
if(currLent < flowFactorList.value.length){
maxFactor.value = false
}
if(tableList.value.length > 1){
isDelField.value = true
}else{
isDelField.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?:any) => {
setCondition(false)
conditionConfig.conditionList = tableList.value
console.log("conditionConfig.conditionList--->",conditionConfig.conditionList,tableList);
// 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
// })
closeDrawer()
}
</script>
<template>
@ -178,8 +240,69 @@ const closeDrawer = (val?:any) => {
<div class="demo-drawer__content">
<div class="condition_content drawer_content">
<p class="tip">当审批单同时满足以下条件时进入此流程</p>
<el-row v-for="itemw in tableList" :key="itemw.id" :gutter="10" class="condition_row">
<el-col :span="7">
<div class="left_right_cont">
<el-select v-model="itemw.factorid" placeholder="请选择" class="selectInfo" @change="pickFactor">
<el-option
v-for="item in flowFactorList"
:key="item.keyid"
:label="item.name"
:value="item.keyid"
:disabled="item.isok"
>
</el-option>
</el-select>
<span></span>
</div>
</el-col>
<el-col :span="16">
<template v-if="itemw.type==1">
<el-button type="primary" style="margin-bottom:0px" >添加/修改成员</el-button>
<p class="selected_list">
<el-tag closable type="info" effect="plain" class="tag_us">演员1</el-tag><el-tag closable type="info" effect="plain" class="tag_us">1</el-tag><el-tag closable type="info" effect="plain" class="tag_us">1</el-tag><el-tag closable type="info" effect="plain" class="tag_us">1</el-tag><el-tag closable type="info" effect="plain" class="tag_us">1</el-tag><el-tag closable type="info" effect="plain" class="tag_us">1</el-tag><el-tag closable type="info" effect="plain" class="tag_us">1</el-tag><el-tag closable type="info" effect="plain" class="tag_us">1</el-tag><el-tag closable type="info" effect="plain" class="tag_us">1</el-tag><el-tag closable type="info" effect="plain" class="tag_us">1</el-tag>
</p>
</template>
<template v-if="itemw.type==2">
<el-row v-for="(itemCustomFields,index) in itemw" :key="index" :gutter="5">
<el-col :span="6">
<el-input v-model="itemCustomFields.wordfield" placeholder="判断关键字"></el-input>
</el-col>
<el-col :span="itemCustomFields.optType != 6?7:16">
<el-select v-model="itemCustomFields.optType" class="selectInfo" @change="myoptChhange($event,itemCustomFields)">
<el-option
v-for="itemSel in optTypes"
:key="itemSel.value"
:label="itemSel.label"
:value="itemSel.value"
>
</el-option>
</el-select>
</el-col>
<el-col v-if="itemCustomFields.optType != 6" :span="9">
<el-input v-model="itemCustomFields.leftval" placeholder="请输入值"></el-input>
</el-col>
</el-row>
<el-button type="warning" style="margin-top:10px" >添加条件</el-button>
</template>
<template v-if="itemw.type==3">
<el-radio-group v-if="!itemw.isCheckbox" v-model="itemw.answers">
<el-radio v-for="optVal in itemw.options" :key="optVal.value" :label="optVal.value">{{optVal.label}}</el-radio>
</el-radio-group>
<el-checkbox-group v-if="itemw.isCheckbox" v-model="itemw.answers">
<el-checkbox v-for="optVal in itemw.options" :key="optVal.value" :label="optVal.value">{{ optVal.label }}</el-checkbox>
</el-checkbox-group>
</template>
</el-col>
<el-col :span="1"><el-icon v-if="isDelField" color="#FF0000" size="20px" class="delIcon" @click="delTiaoJian(itemw)"><CircleClose /></el-icon></el-col>
</el-row>
<el-button :disabled="maxFactor" type="primary" @click="addFactorCondition" >添加条件</el-button>
</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>
@ -203,7 +326,17 @@ const closeDrawer = (val?:any) => {
.condition_content {
padding: 20px 20px 0;
.condition_row{
margin-bottom:15px;
.left_right_cont{
display: flex;
justify-content: space-between;
align-items: center;
.selectInfo{
margin-right:5px;
}
}
}
p.tip {
margin: 20px 0;
width: 510px;
@ -301,4 +434,14 @@ const closeDrawer = (val?:any) => {
}
}
}
.delIcon{
margin-top:6px;
}
.selected_list{
margin: 0;
span{
margin:5px 5px 4px 0px;
}
}
</style>

23
src/components/workflow/selectBoxs.vue

@ -50,6 +50,29 @@ defineProps({
</div>
</li>
</template>
<!--岗位信息遍历-->
<template v-if="elem.type === 'position'">
<li v-for="item in elem.data" :key="item.id" class="check_box not" :class="{not: !elem.not}">
<div :class="elem.isActive(item) && 'active'">
<a :title="item.departmentNames" @click="elem.change(item)">
<span></span>
<img src="@/assets/images/icon_role.png">
{{item.name}}
</a>
</div>
</li>
</template>
<!--岗位信息遍历-->
<template v-if="elem.type === 'formword'">
<li v-for="item in elem.data" :key="item.roleId" class="check_box" :class="{not: !elem.isDepartment}">
<div :class="elem.isActive(item) && 'active'">
<a :title="item.departmentNames" @click="elem.change(item)">
<img src="@/assets/images/icon_role.png">{{item.name}}
</a>
</div>
</li>
</template>
</template>
</ul>
</template>

16
src/components/workflow/selectResult.vue

@ -11,7 +11,7 @@ let props = defineProps({
},
list: {
type: Array,
default: () => [{ type: 'role', data, cancel }]
default: () => [{ type: 'role', data:[], cancel:()=>{} }]
}
})
let emits = defineEmits(['del'])
@ -49,6 +49,20 @@ let emits = defineEmits(['del'])
</li>
</template>
<template v-if="type === 'position'">
<li v-for="item in data" :key="item.roleId">
<img src="@/assets/images/icon_role.png">
<span>{{item.name}}</span>
<img src="@/assets/images/cancel.png" @click="cancel(item)">
</li>
</template>
<template v-if="type === 'formword'">
<li v-for="item in data" :key="item.roleId">
<img src="@/assets/images/icon_role.png">
<span>{{item.name}}</span>
<img src="@/assets/images/cancel.png" @click="cancel(item)">
</li>
</template>
</template>
</ul>
</div>

3
src/styles/workflowcss/workflow.scss

@ -1063,7 +1063,8 @@ html {
.fd-nav-content-new {
position: relative;
width: initial;
height: 100%;
// height: 100%;
height: calc(100% - 60px);
overflow-x: hidden;
overflow-y: auto;
padding-bottom: 30px

5
src/utils/workflow/const.ts

@ -39,3 +39,8 @@ export let opt1s = [
{value: '<', label: '<'},
{value: '≤', label: '≤'},
]
//工作流判断条件(类型:1、申请人;2、自定义字段;3、单选;4、多选;5、开关)
export let flowFactor = [
{id:1,name:"申请人",keyid:"applicant",type:1,isok:false,isCheckbox:true,options:[]},
{id:2,name:"自定义字段",keyid:"customFields",type:2,isok:false,isCheckbox:false,options:[]}
]

29
src/utils/workflow/index.ts

@ -71,15 +71,26 @@ All.prototype = {
}else if (nodeConfig.examineMode == 3) {
return nodeConfig.nodeUserList.length + "人非会签"
}
}
}else{
// return "指定成员"
}
} else if (nodeConfig.settype == 2) {
let level = nodeConfig.directorLevel == 1 ? '直接主管' : '第' + nodeConfig.directorLevel + '级主管'
if (nodeConfig.examineMode == 1) {
return level
} else if (nodeConfig.examineMode == 2) {
return level + "会签"
}
} else if (nodeConfig.settype == 4) {
}else if (nodeConfig.examineMode == 3) {
return level + + "非会签"
}
} else if (nodeConfig.settype == 3) {
console.log("nodeConfig==会签==>",nodeConfig)
if (nodeConfig.nodeUserList.length == 1) {
return nodeConfig.nodeUserList[0].name
}else{
return "指定行政岗位"
}
} else if (nodeConfig.settype == 4) {
console.log("nodeConfig.selectRange",nodeConfig.selectRange,nodeConfig.nodeUserList);
if (nodeConfig.selectRange == 1) {
return "发起人自选"
@ -100,6 +111,18 @@ All.prototype = {
return '从直接主管到通讯录中级别最高的第' + nodeConfig.examineEndDirectorLevel + '个层级主管'
}else if (nodeConfig.settype == 7){
return "指定前置审批为本节点设置审批人"
}else if (nodeConfig.settype == 8){
console.log("checkedFormList--1111->",nodeConfig)
if(nodeConfig.nodeUserList.length > 0){
if (nodeConfig.examineMode == 1) {
return nodeConfig.nodeUserList[0].name + "依次审批"
} else if (nodeConfig.examineMode == 2) {
return nodeConfig.nodeUserList[0].name + "会签"
}else if (nodeConfig.examineMode == 3) {
return nodeConfig.nodeUserList[0].name + "非会签"
}
}
}
},
dealStr(str:any, obj:any) {

233
src/views/sysworkflow/codepage/index.vue

@ -11,6 +11,8 @@ import CreateForm from '@/views/sysworkflow/codepage/createform.vue'
import SetupConfig from '@/views/sysworkflow/codepage/setupconfig.vue'
import DataTableStructure from '@/views/sysworkflow/codepage/datatablestructure.vue'
import FlowDrawingBoard from '@/views/sysworkflow/flow/flowDrawingBoard.vue'
const contbody = ref()
const queryParams = reactive<SearchForm>({
page: 1,
@ -143,121 +145,150 @@ const openDataTableStructure = (cont:customerFormCont) =>{
dataTableIsShow.value = true;
// console.log("",cont)
}
//
const drawer = ref(false)
const drawerWidht = ref()
const isFormFlow = ref(false)
const customerFormKey = ref<string>()
const customerFormName = ref<string>()
const flowKey = ref<string>()
const setupWorkFlow = (cont:customerFormCont) => {
drawerWidht.value = contbody.value?.clientWidth
// console.log("clientHeight--->",drawerWidht.value)
drawer.value = true
isFormFlow.value = true;
customerFormName.value = cont.name
customerFormKey.value = cont.id.toString()
flowKey.value = cont.flowkey.toString()
}
</script>
<template>
<div ref="contbody" class="app-container">
<div class="search">
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
<el-form-item label="关键字" prop="keywords">
<el-input
v-model="queryParams.keywords"
placeholder="表单名称"
clearable
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="handleQuery">
<template #icon><i-ep-search /></template>搜索
</el-button>
<el-button @click="resetQuery">
<template #icon>
<i-ep-refresh /></template>重置
<div ref="contbody">
<div class="app-container">
<div class="search">
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
<el-form-item label="关键字" prop="keywords">
<el-input
v-model="queryParams.keywords"
placeholder="表单名称"
clearable
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="handleQuery">
<template #icon><i-ep-search /></template>搜索
</el-button>
</el-form-item>
</el-form>
</div>
<el-card shadow="never">
<template #header>
<el-button type="success" @click="openDialog()"><i-ep-plus />新增表单</el-button>
<el-button
type="danger"
:disabled="ids.length === 0"
@click="handleDelete()"
<el-button @click="resetQuery">
<template #icon>
<i-ep-refresh /></template>重置
</el-button>
</el-form-item>
</el-form>
</div>
<el-card shadow="never">
<template #header>
<el-button type="success" @click="openDialog()"><i-ep-plus />新增表单</el-button>
<el-button
type="danger"
:disabled="ids.length === 0"
@click="handleDelete()"
>
<i-ep-delete />删除表单
</el-button>
</template>
<el-table
v-loading="loading"
highlight-current-row
:data="contList"
border
@selection-change="handleSelectionChange"
>
<i-ep-delete />删除表单
</el-button>
</template>
<el-table
v-loading="loading"
highlight-current-row
:data="contList"
border
@selection-change="handleSelectionChange"
>
<el-table-column fixed type="selection" width="55" align="center" />
<el-table-column fixed label="表单名称" prop="name" width="350" />
<el-table-column label="分类" align="center" width="150">
<template #default="scope">
<el-tag v-if="scope.row.classify === 1" effect="plain">表单</el-tag>
<el-tag v-else effect="plain">流程表单</el-tag>
</template>
</el-table-column>
<el-table-column label="状态" align="center" width="100">
<template #default="scope">
<el-tag v-if="scope.row.states === 1" type="success">启用</el-tag>
<el-tag v-else type="info">禁用</el-tag>
</template>
</el-table-column>
<el-table-column label="创建人" prop="creatername" width="140" />
<el-table-column label="创建时间" prop="creatertime" />
<el-table-column fixed="right" label="操作" align="center" width="350">
<template #default="scope">
<!-- <el-button
type="success"
link
size="small"
@click.stop="setupCustomerForm(scope.row)"
><i-ep-Share />版本</el-button> -->
<el-button
<el-table-column fixed type="selection" width="55" align="center" />
<el-table-column fixed label="表单名称" prop="name" width="350" />
<el-table-column label="分类" align="center" width="150">
<template #default="scope">
<el-tag v-if="scope.row.classify === 1" effect="plain">表单</el-tag>
<el-tag v-else effect="plain">流程表单</el-tag>
</template>
</el-table-column>
<el-table-column label="状态" align="center" width="100">
<template #default="scope">
<el-tag v-if="scope.row.states === 1" type="success">启用</el-tag>
<el-tag v-else type="info">禁用</el-tag>
</template>
</el-table-column>
<el-table-column label="创建人" prop="creatername" width="140" />
<el-table-column label="创建时间" prop="creatertime" />
<el-table-column fixed="right" label="操作" align="center" width="350">
<template #default="scope">
<!-- <el-button
type="success"
link
size="small"
@click.stop="setupCustomerForm(scope.row)"
>
<i-ep-Setting />设置
</el-button>
<el-button
type="warning"
link
size="small"
@click.stop="openDataTableStructure(scope.row)"
>
<i-ep-MessageBox />数据结构
</el-button>
<el-button
type="primary"
link
size="small"
@click.stop="editCustomerForm(scope.row)"
>
<i-ep-edit />编辑
</el-button>
<el-button
type="danger"
link
size="small"
@click.stop="editCustomerFormState(scope.row)"
>
<i-ep-delete />删除
</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-if="total > 0"
v-model:total="total"
v-model:page="queryParams.page"
v-model:limit="queryParams.pagesize"
@pagination="handleQuery"
/>
</el-card>
><i-ep-Share />版本</el-button> -->
<el-button
type="success"
link
size="small"
@click.stop="setupCustomerForm(scope.row)"
>
<i-ep-Setting />设置
</el-button>
<el-button
type="warning"
link
size="small"
@click.stop="openDataTableStructure(scope.row)"
>
<i-ep-MessageBox />数据结构
</el-button>
<el-button
type="primary"
link
size="small"
@click.stop="editCustomerForm(scope.row)"
>
<i-ep-edit />编辑
</el-button>
<el-button
type="danger"
link
size="small"
@click.stop="editCustomerFormState(scope.row)"
>
<i-ep-delete />删除
</el-button>
<el-button
type="info"
link
size="small"
@click.stop="setupWorkFlow(scope.row)"
>
<i-ep-operation />流程
</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-if="total > 0"
v-model:total="total"
v-model:page="queryParams.page"
v-model:limit="queryParams.pagesize"
@pagination="handleQuery"
/>
</el-card>
</div>
</div>
<el-drawer v-model="drawerOpenOrClose" title="设置/编辑自定义表单" :with-header="false" :close-on-click-modal="false" :close-on-press-escape="false" :destroy-on-close="true" :size="drawerWith" class="drawerClass">
<CreateForm v-model:draweropenclose="drawerOpenOrClose" :formid="formId" :formconfigcont="formConfigCont" @handlequery="handleQuery" />
</el-drawer>
<SetupConfig v-model:show="show" :editid="editid" @handle_query="handleQuery" />
<DataTableStructure v-model:isshow="dataTableIsShow" :formcont="formCont" />
<FlowDrawingBoard v-model:open-drawer="drawer" :drawer-widht="drawerWidht" :is-form-flow="isFormFlow" :customer-form-name="customerFormName" :customer-form-key="customerFormKey" :flow-key="flowKey" />
</template>
<style lang='scss' scoped>
.drawerClass{

277
src/views/sysworkflow/flow/flowDrawingBoard.vue

@ -4,11 +4,284 @@
@ 备注: 工作流画板
-->
<script lang='ts' setup>
import '@/styles/workflowcss/workflow.scss'
import { useStore } from '@/store/workflow/index'
import { tipListStrucr,flowversion } from '@/api/workflowapi/types'
import { initializeWorkFlow,setWorkFlowData,gainFlowVersionList } 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 props = defineProps({
openDrawer:{
type:Boolean,
default:true
},
drawerWidht:{
type:Number,
default:100
},
isFormFlow:{
type:Boolean,
default:true
},
customerFormKey:{
type:String,
default:""
},
customerFormName:{
type:String,
default:""
},
flowKey:{
type:String,
default:""
}
})
const emits = defineEmits(["update:openDrawer"]);
const isShow = computed({
get: () => props.openDrawer,
set: (val) => {
emits("update:openDrawer", val);
},
});
let { setTableId, setIsTried } = useStore()
let tipList = ref<any>([]);
let tipVisible = ref(false);
let nowVal = ref(100); //
let processConfig = ref<any>({});
let nodeConfig = ref({});
let workFlowDef = ref({});
let flowPermission = ref([]);
let directorMaxLeveling = ref<number>(0);
const shenPiTitle = ref<string>("")
const activeTabs = ref<string>(""); //
const versionList = ref<flowversion[]>(); //
//
const getFlowVerList = ()=>{
gainFlowVersionList({id:props.flowKey.toString()})
.then(({data})=>{
if(data){
if(data.length>0){
versionList.value = data;
data.forEach(item=>{
if(item.state == 1){
activeTabs.value = item.version
}
})
}
}
})
}
//
onMounted(async ()=>{
})
//
const initWorkFlowData = async() => {
let { data } = await initializeWorkFlow({name:""})
// console.log("data-=------>",data)
let {
nodeConfig: nodes,
flowPermission: flows,
directorMaxLevel: directorMaxLevel,
workFlowDef: works,
tableId,
} = data;
nodeConfig.value = nodes;
flowPermission.value = flows;
directorMaxLeveling = directorMaxLevel;
workFlowDef.value = works;
setTableId(tableId);
// console.log("max--->",flowPermission.value)
}
//
const reErr = ({ childNode }:any) => {
if (childNode) {
let { type, error, nodeName, conditionNodes } = childNode;
if (type == 1 || type == 2 || type == 3) {
if (error) {
tipList.value.push({
name: nodeName,
type: ["", "审核人", "抄送人", "执行人"][type],
});
}
reErr(childNode);
} else if (type == 4) {
reErr(childNode);
} else if (type == 5) {
reErr(childNode);
for (var i = 0; i < conditionNodes.length; i++) {
if (conditionNodes[i].error) {
tipList.value.push({ name: conditionNodes[i].nodeName, type: "条件" });
}
reErr(conditionNodes[i]);
}
}
} else {
childNode = null;
}
};
//
const saveSet = async () => {
setIsTried(true);
tipList.value = [];
processConfig.value.flowPermission = flowPermission.value;
// eslint-disable-next-line no-console
// console.log("processConfig",JSON.stringify(nodeConfig.value));
// console.log("processConfig",nodeConfig.value);
reErr(nodeConfig.value);
if (tipList.value.length != 0) {
tipVisible.value = true;
return;
}
let res = await setWorkFlowData(processConfig.value);
if (res.code == 200) {
ElMessage.success("设置成功")
setTimeout(function () {
window.location.href = "";
}, 200);
}
};
//
const zoomSize = (type:number) => {
if (type == 1) {
if (nowVal.value == 50) {
return;
}
nowVal.value -= 10;
} else {
if (nowVal.value == 300) {
return;
}
nowVal.value += 10;
}
};
//
const clearCanvas = () =>{
ElMessageBox.confirm('确定要清空画布?')
.then(() => {
initWorkFlowData()
setIsTried(false);
tipList.value = []
})
}
watch(()=>props.openDrawer,(val)=>{
if(val){
if(props.flowKey != ""){
getFlowVerList()
}else{
}
initWorkFlowData()
shenPiTitle.value = props.customerFormName
}else{
setIsTried(false);
tipList.value = []
}
})
//
const clickFormTable = (val:any) =>{
// console.log("",val,formTableIndex.value)
// getTableFieldList(versionIndex.value,val)
}
</script>
<template>
<div></div>
<el-drawer v-model="isShow" :size="props.drawerWidht" :show-close="false">
<template #header="{ close, titleId, titleClass }">
<div style="display: flex; width:50%">
<div class="right_kongx"><h4 :id="titleId" :class="titleClass">{{ shenPiTitle }}审批流程</h4></div>
</div>
<el-button type="warning" @click="clearCanvas">
<el-icon class="el-icon--left"><Delete /></el-icon>
清空
</el-button>
<el-button type="primary" @click="saveSet">
<el-icon class="el-icon--left"><Promotion /></el-icon>
发布
</el-button>
<el-button type="danger" @click="close">
<el-icon class="el-icon--left"><CircleCloseFilled /></el-icon>
关闭
</el-button>
</template>
<div class="canvas_body">
<el-row v-if="props.flowKey!=''" :gutter="20">
<el-col :span="20">
<el-tabs v-model="activeTabs" class="flow_version" @tab-change="clickFormTable">
<el-tab-pane v-for="item in versionList" :key="item.id">
<template #label>
<span class="custom-tabs-label">
<span>{{ item.version }}}</span>
</span>
</template>
</el-tab-pane>
</el-tabs>
</el-col>
<el-col :span="3" style="text-align: center;">
<el-button type="primary" round>启用</el-button>
</el-col>
</el-row>
<div class="fd-nav-content-new">
<!--画板-->
<section class="dingflow-design">
<div class="zoom">
<div class="zoom-out" :class="nowVal == 50 && 'disabled'" @click="zoomSize(1)"></div>
<span>{{ nowVal }}%</span>
<div class="zoom-in" :class="nowVal == 300 && 'disabled'" @click="zoomSize(2)"></div>
</div>
<div class="box-scale" :style="`transform: scale(${ nowVal / 100});`">
<nodeWrap v-model:nodeConfig="nodeConfig" v-model:flowPermission="flowPermission" />
<div class="end-node">
<div class="end-node-circle"></div>
<div class="end-node-text">流程结束</div>
</div>
</div>
</section>
</div>
<errorDialog v-model:visible="tipVisible" :list="tipList" />
<promoterDrawer />
<approverDrawer :directormaxlevel="directorMaxLeveling" :node-config="nodeConfig" :is-form-flow="props.isFormFlow" :customer-form-key="props.customerFormKey" />
<copyerDrawer />
<conditionDrawer :is-form-flow="props.isFormFlow" :customer-form-key="props.customerFormKey" />
</div>
</el-drawer>
</template>
<style lang='scss' scoped>
<style>
.canvas_body{
height: 100%;
width: inherit;
}
.flow_version{
}
.flow_version > .el-tabs__content{
padding: 0px;
height:0px;
}
.flow_version > .el-tabs__header{
margin:0px;
}
.flow_version .custom-tabs-label span {
padding:0 10px;
}
.right_kongx{
margin-right:50px
}
</style>

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

@ -4,19 +4,8 @@
@ 备注:
-->
<script lang='ts' setup>
import '@/styles/workflowcss/workflow.scss'
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";
import FlowDrawingBoard from '@/views/sysworkflow/flow/flowDrawingBoard.vue'
//
const flowcont = ref()
const drawer = ref(false)
const drawerWidht = ref()
@ -25,157 +14,16 @@ const openfloaw = ()=>{
// console.log("clientHeight--->",drawerWidht.value)
drawer.value = true
}
let { setTableId, setIsTried } = useStore()
let tipList = ref<any>([]);
let tipVisible = ref(false);
let nowVal = ref(100); //
let processConfig = ref<any>({});
let nodeConfig = ref({});
let workFlowDef = ref({});
let flowPermission = ref([]);
let directorMaxLeveling = ref<number>(0);
//
onMounted(async ()=>{
initWorkFlowData()
})
//
const initWorkFlowData = async() => {
let { data } = await initializeWorkFlow({name:""})
// console.log("data-=------>",data)
let {
nodeConfig: nodes,
flowPermission: flows,
directorMaxLevel: directorMaxLevel,
workFlowDef: works,
tableId,
} = data;
nodeConfig.value = nodes;
flowPermission.value = flows;
directorMaxLeveling = directorMaxLevel;
workFlowDef.value = works;
setTableId(tableId);
// console.log("max--->",flowPermission.value)
}
//
const reErr = ({ childNode }:any) => {
if (childNode) {
let { type, error, nodeName, conditionNodes } = childNode;
if (type == 1 || type == 2 || type == 3) {
if (error) {
tipList.value.push({
name: nodeName,
type: ["", "审核人", "抄送人", "执行人"][type],
});
}
reErr(childNode);
} else if (type == 4) {
reErr(childNode);
} else if (type == 5) {
reErr(childNode);
for (var i = 0; i < conditionNodes.length; i++) {
if (conditionNodes[i].error) {
tipList.value.push({ name: conditionNodes[i].nodeName, type: "条件" });
}
reErr(conditionNodes[i]);
}
}
} else {
childNode = null;
}
};
//
const saveSet = async () => {
setIsTried(true);
tipList.value = [];
processConfig.value.flowPermission = flowPermission.value;
// eslint-disable-next-line no-console
// console.log("processConfig",JSON.stringify(nodeConfig.value));
// console.log("processConfig",nodeConfig.value);
reErr(nodeConfig.value);
if (tipList.value.length != 0) {
tipVisible.value = true;
return;
}
let res = await setWorkFlowData(processConfig.value);
if (res.code == 200) {
ElMessage.success("设置成功")
setTimeout(function () {
window.location.href = "";
}, 200);
}
};
//
const zoomSize = (type:number) => {
if (type == 1) {
if (nowVal.value == 50) {
return;
}
nowVal.value -= 10;
} else {
if (nowVal.value == 300) {
return;
}
nowVal.value += 10;
}
};
//
const clearCanvas = () =>{
ElMessageBox.confirm('确定要清空画布?')
.then(() => {
initWorkFlowData()
setIsTried(false);
tipList.value = []
})
}
const isFormFlow = ref(false)
const customerFormKey = ref<string>()
</script>
<template>
<div ref="flowcont">
<el-button type="primary" @click="openfloaw">添加</el-button>
<el-drawer v-model="drawer" :size="drawerWidht" :show-close="false">
<template #header="{ close, titleId, titleClass }">
<h4 :id="titleId" :class="titleClass">创建流程</h4>
<el-button type="warning" @click="clearCanvas">
<el-icon class="el-icon--left"><Delete /></el-icon>
清空
</el-button>
<el-button type="primary" @click="saveSet">
<el-icon class="el-icon--left"><Promotion /></el-icon>
发布
</el-button>
<el-button type="danger" @click="close">
<el-icon class="el-icon--left"><CircleCloseFilled /></el-icon>
关闭
</el-button>
</template>
<div class="canvas_body">
<div class="fd-nav-content-new">
<!--画板-->
<section class="dingflow-design">
<div class="zoom">
<div class="zoom-out" :class="nowVal == 50 && 'disabled'" @click="zoomSize(1)"></div>
<span>{{ nowVal }}%</span>
<div class="zoom-in" :class="nowVal == 300 && 'disabled'" @click="zoomSize(2)"></div>
</div>
<div class="box-scale" :style="`transform: scale(${ nowVal / 100});`">
<nodeWrap v-model:nodeConfig="nodeConfig" v-model:flowPermission="flowPermission" />
<div class="end-node">
<div class="end-node-circle"></div>
<div class="end-node-text">流程结束</div>
</div>
</div>
</section>
</div>
<errorDialog v-model:visible="tipVisible" :list="tipList" />
<promoterDrawer />
<approverDrawer :directormaxlevel="directorMaxLeveling" :node-config="nodeConfig" />
<copyerDrawer />
<conditionDrawer />
</div>
</el-drawer>
<FlowDrawingBoard v-model:open-drawer="drawer" :drawer-widht = "drawerWidht" :is-form-flow="isFormFlow" :customer-form-key="customerFormKey" />
</div>
</template>
<style lang='scss' scoped>

160
vite.config.ts.timestamp-1697610303012-42c6e5d26ab95.mjs

File diff suppressed because one or more lines are too long
Loading…
Cancel
Save