Hooke / vue-flow-editor

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
2b52c39a 1 parent aeb84985

✨ feat(节点属性消息配置): 节点属性提交按钮联动消息通知发送关系

Inline Side-by-side
Showing 1 changed file with 59 additions and 28 deletions
......@@ -267,7 +267,7 @@
<el-button @click="onConfirmMoreAttr(state.more_attr_data)" type="primary" color="#009688" style="width: 100%;">完成</el-button>
<div class="more-attr-switch">
<div class="more-attr-title">{{ state.more_attr_data.label }}</div>
<div><el-switch v-model="state.more_attr_data.show" /></div>
<div><el-switch v-model="state.more_attr_data.show" @change="handleMoreAttr(state.more_attr_data)" /></div>
</div>
<p class="more-attr-tip">{{ state.more_attr_data.desc }}</p>
<div v-if="state.more_attr_data.showBtn">
......@@ -276,33 +276,48 @@
</div>
<div v-if="state.more_attr_data.is_node">
<p style="font-size: 14px; font-weight: bold;">消息配置</p>
<div style="display: flex; justify-content: space-between; align-items: center;">
<div style="font-size: 0.9rem;">开关</div>
<p style="font-size: 13px; color: #525967;">系统默认会发消息通知各节点负责人，可以按需设置节点负责人以外的用户获取消息提醒</p>
<!-- <div style="display: flex; justify-content: space-between; align-items: center;">
<div style="font-size: 0.9rem;">打开配置</div>
<div><el-switch v-model="state.more_attr_data.msg_open" /></div>
</div>
<div>
<div style="font-size: 0.9rem; margin: 0.5rem 0;">接收对象（整个组织用户范围）</div>
<div class="flow-tag__wrapper" @click="openNodeMsgUserForm">
<el-tag
v-if="state.more_attr_data.msg_user.length"
v-for="tag in state.more_attr_data.msg_user"
:key="tag.name"
style="margin: 0 0.25rem 0.5rem 0.25rem;"
>
<el-icon v-if="tag.type === 'dept'" style="height: 13px; display: inline-block; vertical-align: middle; line-height: 10px;"><House /></el-icon>
<el-icon v-if="tag.type === 'user'" style="height: 12px; display: inline-block; vertical-align: middle; line-height: 10px;"><Female /></el-icon>
<el-icon v-if="tag.type === 'role'" style="height: 12px; display: inline-block; vertical-align: middle; line-height: 10px;"><User /></el-icon>
<span style="margin-left: 2px; height: 10px; display: inline-block; vertical-align: middle; line-height: 10px;">{{ tag.name }}</span>
</el-tag>
<div v-else class="text-empty">请选择成员</div>
</div> -->
<div class="msg-config">
<div style="margin-top: 1rem; margin-left: 0.5rem;">
<div style="font-size: 14px;">接收类型</div>
<!-- <el-checkbox-group v-model="state.more_attr_data.msg_type" style="display: flex; flex-direction: column;">
<el-checkbox label="站内信"></el-checkbox>123
<el-checkbox label="微信"></el-checkbox>
</el-checkbox-group> -->
<div style="display: flex; justify-content: space-between; align-items: center;">
<div style="font-size: 14px; margin-left: 5px;">站内信</div>
<div><el-switch v-model="state.more_attr_data.msg_send_mail" /></div>
</div>
<div v-if="state.more_attr_data.msg_send_mail" style="color: red; font-size: 13px; margin-left: 5px;">站内信内容说明</div>
<div style="display: flex; justify-content: space-between; align-items: center;">
<div style="font-size: 14px; margin-left: 5px;">微信</div>
<div><el-switch v-model="state.more_attr_data.msg_send_weixin" /></div>
</div>
<div v-if="state.more_attr_data.msg_send_weixin" style="color: red; font-size: 13px; margin-left: 5px;">微信内容说明</div>
</div>
<div style="margin-left: 0.5rem;">
<div style="font-size: 14px; margin: 0.5rem 0;">接收对象</div>
<div class="flow-tag__wrapper" @click="openNodeMsgUserForm">
<el-tag
v-if="state.more_attr_data.msg_user.length"
v-for="tag in state.more_attr_data.msg_user"
:key="tag.name"
style="margin: 0 0.25rem 0.5rem 0.25rem;"
>
<el-icon v-if="tag.type === 'dept'" style="height: 13px; display: inline-block; vertical-align: middle; line-height: 10px;"><House /></el-icon>
<el-icon v-if="tag.type === 'user'" style="height: 12px; display: inline-block; vertical-align: middle; line-height: 10px;"><Female /></el-icon>
<el-icon v-if="tag.type === 'role'" style="height: 12px; display: inline-block; vertical-align: middle; line-height: 10px;"><User /></el-icon>
<span style="margin-left: 2px; height: 10px; display: inline-block; vertical-align: middle; line-height: 10px;">{{ tag.name }}</span>
</el-tag>
<div v-else class="text-empty">请选择成员</div>
</div>
</div>
</div>
<div>
<div style="font-size: 0.9rem; margin: 0.5rem 0;">消息类型（站内信、微信）</div>
<el-checkbox-group v-model="state.more_attr_data.msg_type">
<el-checkbox label="站内信"></el-checkbox>
<el-checkbox label="微信"></el-checkbox>
</el-checkbox-group>
</div>
</div>
</div>
......@@ -753,7 +768,8 @@ export default {
is_node: false,
msg_open: false,
msg_user: [],
msg_type: [],
msg_send_mail: false,
msg_send_weixin: false,
},
node_name: '', // 节点名称
node_idx: null, // 节点index
......@@ -1736,7 +1752,8 @@ export default {
attr.data.forEach(ele => {
ele.msg_open = false;
ele.msg_user = [{ "id": 107697, "type": "dept", "name": "传灯组" }]
ele.msg_type = []
ele.msg_send_mail = true;
ele.msg_send_weixin = false;
})
}
});
......@@ -2507,6 +2524,18 @@ export default {
state.preview_form_url = null;
}
/**
* 节点属性开关操作回调
* 关闭后 同时关闭消息通知
* @param data
*/
const handleMoreAttr = (data) => {
if (!data.show) {
data.msg_send_mail = false;
data.msg_send_weixin = false;
}
}
return {
state,
rules,
......@@ -2554,6 +2583,8 @@ export default {
handleNodeNameChange,
handleMoreAttr,
openUserForm,
openNextStepUserForm,
openNodeMsgUserForm,
......