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