11 changed files with 1490 additions and 994 deletions
@ -0,0 +1,371 @@ |
|||
<!-- |
|||
@ 作者: 秦东 |
|||
@ 时间: 2025-05-26 14:59:22 |
|||
@ 备注: 新版抄送节点 |
|||
--> |
|||
<script lang="ts" setup> |
|||
import $func from "@/utils/workflow/index"; |
|||
import { setTypes, selectModes, selectRanges } from "@/utils/workflow/const"; |
|||
import { useStore } from "@/store/workflow/index"; |
|||
import { matrixInfo } from "@/api/matrixapi/type"; |
|||
|
|||
let props = defineProps({ |
|||
isFormFlow: { |
|||
type: Boolean, |
|||
default: true, |
|||
}, |
|||
directormaxlevel: { |
|||
type: Number, |
|||
default: 4, |
|||
}, |
|||
}); |
|||
const isExecutor = ref(false); |
|||
let ccSelfSelectFlag = ref([]); |
|||
let copyerConfig = ref({}); |
|||
let store = useStore(); |
|||
let { setCopyerConfig, setCopyer } = store; |
|||
let copyerDrawer = computed(() => store.copyerDrawer); |
|||
let copyerConfig1 = computed(() => store.copyerConfig1); |
|||
let checkedList = ref<any[]>([]); //选中得指定成员过度用 |
|||
let visible = computed({ |
|||
get() { |
|||
return copyerDrawer.value; |
|||
}, |
|||
set() { |
|||
closeDrawer(); |
|||
}, |
|||
}); |
|||
const matrixFieldList = ref<matrixInfo>(); |
|||
const nodeSendSetUp = ref("first"); |
|||
watch(copyerConfig1, (val) => { |
|||
if (val.settype == 0) { |
|||
copyerConfig.value.settype = 1; |
|||
} |
|||
copyerConfig.value = val.value; |
|||
ccSelfSelectFlag.value = |
|||
copyerConfig.value.ccSelfSelectFlag == 0 ? [] : [copyerConfig.value.ccSelfSelectFlag]; |
|||
}); |
|||
onMounted(() => { |
|||
console.log("预加载数据建军节--------》", copyerConfig1.value); |
|||
if (copyerConfig1.settype == 0) { |
|||
copyerConfig.value.settype = 1; |
|||
} |
|||
}); |
|||
//监听审批人设置选项 |
|||
watch( |
|||
() => copyerConfig.value.settype, |
|||
(val: any) => { |
|||
console.log("监听审批人设置选项", copyerConfig.value); |
|||
switch (val) { |
|||
case 10: |
|||
let sendOrg = { |
|||
id: 313, |
|||
idstr: "313", |
|||
level: 4, |
|||
all: 1, |
|||
}; |
|||
govthree(sendOrg).then(({ data }) => { |
|||
// console.log("监听审批人设置选项",data) |
|||
orgList.value = data; |
|||
nextTick(() => { |
|||
setOrgTree(copyerConfig.value.orgList); |
|||
}); |
|||
}); |
|||
break; |
|||
case 0: |
|||
copyerConfig.value.settype = 1; |
|||
break; |
|||
default: |
|||
break; |
|||
} |
|||
}, |
|||
{ |
|||
deep: true, |
|||
} |
|||
); |
|||
/** |
|||
@ 作者: 秦东 |
|||
@ 时间: 2025-05-26 15:23:01 |
|||
@ 功能: 写入数据 |
|||
*/ |
|||
const saveCopyer = () => {}; |
|||
//关闭抽屉 |
|||
const closeDrawer = () => { |
|||
setCopyer(false); |
|||
}; |
|||
/** |
|||
@ 作者: 秦东 |
|||
@ 时间: 2025-05-26 16:23:35 |
|||
@ 功能: 属性选择 |
|||
*/ |
|||
const changeType = (val: any) => { |
|||
copyerConfig.value.nodeUserList = []; |
|||
copyerConfig.value.examineMode = 1; |
|||
copyerConfig.value.noHanderAction = 2; |
|||
console.log("属性选择--->", val); |
|||
switch (val) { |
|||
case 2: |
|||
copyerConfig.value.directorLevel = 1; //审批终点 最高层主管数 |
|||
break; |
|||
case 7: |
|||
copyerConfig.value.examineEndDirectorLevel = 1; //审批终点 第n层主管 |
|||
break; |
|||
case 9: |
|||
matrixFieldList.value = copyerConfig.value.matrix; //矩阵信息 |
|||
break; |
|||
default: |
|||
} |
|||
}; |
|||
//判断审批设置是否显示 |
|||
const isShowRatify = (id: number) => { |
|||
if (id == 8) { |
|||
return props.isFormFlow; |
|||
} else if (id == 4) { |
|||
return false; |
|||
} else { |
|||
return true; |
|||
} |
|||
}; |
|||
/** |
|||
@ 作者: 秦东 |
|||
@ 时间: 2025-05-27 14:19:31 |
|||
@ 功能: 添加指定成员 |
|||
*/ |
|||
let approverVisible = ref(false); |
|||
const addApprover = () => { |
|||
approverVisible.value = true; |
|||
checkedList.value = copyerConfig.value.nodeUserList; |
|||
}; |
|||
/** |
|||
@ 作者: 秦东 |
|||
@ 时间: 2025-05-27 15:25:07 |
|||
@ 功能: 更新指定成员数据 |
|||
*/ |
|||
const sureApprover = (data: any) => { |
|||
copyerConfig.value.nodeUserList = data; |
|||
approverVisible.value = false; |
|||
}; |
|||
</script> |
|||
<template> |
|||
<el-drawer |
|||
v-model="visible" |
|||
:append-to-body="true" |
|||
title="抄送人设置" |
|||
class="set_promoter" |
|||
:show-close="false" |
|||
:size="550" |
|||
:before-close="saveCopyer" |
|||
>{{ props }} |
|||
<div class="demo-drawer__content"> |
|||
<div class="drawer_content drawer_content"> |
|||
{{ copyerConfig }} |
|||
<el-tabs v-model="nodeSendSetUp" class="demo-tabs"> |
|||
<el-tab-pane name="first"> |
|||
<template #label> |
|||
<span class="wordKeyCss">属性设置</span> |
|||
</template> |
|||
<div class="info_box"> |
|||
<div class="approver_content"> |
|||
<el-radio-group |
|||
v-model="copyerConfig.settype" |
|||
class="clear" |
|||
@change="changeType" |
|||
> |
|||
<template v-for="{ value, label } in setTypes" :key="value"> |
|||
<el-radio |
|||
v-if="isShowRatify(value)" |
|||
:label="value" |
|||
style="width: auto" |
|||
>{{ label }}</el-radio |
|||
> |
|||
</template> |
|||
</el-radio-group> |
|||
</div> |
|||
|
|||
<!--指定成员--> |
|||
<el-divider v-if="copyerConfig.settype == 1" content-position="left" |
|||
>指定成员</el-divider |
|||
> |
|||
|
|||
<div v-if="copyerConfig.settype == 1" class="approver_manager"> |
|||
<el-button type="primary" @click="addApprover">添加/修改成员</el-button> |
|||
<p class="selected_list"> |
|||
<el-tag |
|||
v-for="(item, index) in copyerConfig.nodeUserList" |
|||
:key="index" |
|||
closable |
|||
type="info" |
|||
effect="plain" |
|||
class="tag_us" |
|||
@close="$func.removeEle(copyerConfig.nodeUserList, item, 'targetId')" |
|||
>{{ item.name }}</el-tag |
|||
> |
|||
<el-tag |
|||
v-if="copyerConfig.nodeUserList.length != 0" |
|||
type="danger" |
|||
effect="dark" |
|||
@click="copyerConfig.nodeUserList = []" |
|||
>清除</el-tag |
|||
> |
|||
</p> |
|||
</div> |
|||
|
|||
<!--主管--> |
|||
<el-divider v-if="copyerConfig.settype == 2" content-position="left" |
|||
>主管</el-divider |
|||
> |
|||
<div v-if="copyerConfig.settype == 2" class="approver_manager"> |
|||
<p> |
|||
<el-row :gutter="10"> |
|||
<el-col v-if="isExecutor" :span="6"> |
|||
<select v-model="copyerConfig.attribute" style="width: 100%"> |
|||
<option value="1">发起人</option> |
|||
<option value="2">执行人</option> |
|||
</select> |
|||
</el-col> |
|||
<el-col :span="18"> |
|||
<select v-model="copyerConfig.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> |
|||
|
|||
<el-checkbox-group v-model="ccSelfSelectFlag" class="clear"> |
|||
<el-checkbox :label="1">允许发起人自选抄送人</el-checkbox> |
|||
</el-checkbox-group> |
|||
</div> |
|||
</el-tab-pane> |
|||
<el-tab-pane name="helpInstructions"> |
|||
<template #label> |
|||
<span class="wordKeyCss">帮助说明</span> |
|||
</template> |
|||
<div class="info_box"> |
|||
<QuillEditor v-model="copyerConfig.helpTips" height="400px" /> |
|||
</div> |
|||
</el-tab-pane> |
|||
</el-tabs> |
|||
</div> |
|||
<div class="demo-drawer__footer clear"> |
|||
<el-button type="primary" @click="saveCopyer">确 定</el-button> |
|||
<el-button @click="closeDrawer">取 消</el-button> |
|||
</div> |
|||
</div> |
|||
|
|||
<!--选择成员--> |
|||
<employees-dialog |
|||
v-model:visible="approverVisible" |
|||
:data="checkedList" |
|||
@change="sureApprover" |
|||
/> |
|||
</el-drawer> |
|||
</template> |
|||
<style lang="scss" scoped> |
|||
.approver_some .el-radio-group { |
|||
display: block; |
|||
} |
|||
.approver_manager .el-radio-group { |
|||
display: block; |
|||
} |
|||
|
|||
.approver_some .el-radio { |
|||
display: block; |
|||
} |
|||
.set_promoter { |
|||
.approver_content { |
|||
padding-bottom: 10px; |
|||
border-bottom: 0px solid #f2f2f2; |
|||
.el-radio { |
|||
width: auto; |
|||
} |
|||
} |
|||
.approver_manager, |
|||
.approver_self_select, |
|||
.approver_some, |
|||
.approver_self { |
|||
border-top: 0px 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 20px 20px; |
|||
} |
|||
.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; |
|||
} |
|||
} |
|||
.selected_list { |
|||
margin: 0; |
|||
line-height: 0; |
|||
.tag_us { |
|||
margin-right: 10px; |
|||
} |
|||
span { |
|||
margin-top: 10px; |
|||
} |
|||
a { |
|||
margin-top: 15px; |
|||
} |
|||
} |
|||
.info_box { |
|||
padding: 0 20px; |
|||
} |
|||
.wordKeyCss { |
|||
padding: 0 20px; |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue