添加操作权限

This commit is contained in:
caixiaofeng 2023-10-12 16:48:52 +08:00
parent f576929a91
commit 556aef3fd1
5 changed files with 164 additions and 3 deletions

View File

@ -69,7 +69,14 @@ const useNode = (node: FlowNode) => {
multi: 'sequential',
choice: false,
self: false,
nobody: 'reject'
nobody: 'reject',
operations: {
complete: true,
refuse: true,
transfer: false,
addMulti: false,
minusMulti: false
}
} as ApprovalNode
if (child) {
child.pid = id

View File

@ -17,4 +17,17 @@ export interface ApprovalNode extends FlowNode {
multi: "sequential" | "joint" | "single"
// 审批人为空时处理方式reject-驳回admin-管理员pass-通过
nobody: 'reject' | 'pass'
// 操作权限
operations: {
// 同意
complete: boolean
// 拒绝
refuse: boolean
// 转办
transfer: boolean
// 加签
addMulti: boolean
// 减签
minusMulti: boolean
}
}

View File

@ -12,6 +12,7 @@ export interface NodeProps {
color?: string
readOnly?: boolean
close?: boolean
arrow?: boolean
}
const icons: Record<string, Component> = {
@ -23,7 +24,8 @@ const icons: Record<string, Component> = {
const $props = withDefaults(defineProps<NodeProps>(), {
readOnly: false,
close: true
close: true,
arrow: true
})
const $emits = defineEmits<{
(e: 'update:node', title: string): void
@ -168,5 +170,19 @@ const onClickOutside = () => {
}
}
}
.arrow{
/* &:before{
content: '';
position: absolute;
top: -13px;
left: 50%;
transform: translateX(-50%);
width: 0;
border-style: solid;
border-width: 8px 6px 0;
border-color: var(--el-border-color) transparent transparent;
background-color: var(--el-bg-color);
}*/
}
}
</style>

View File

@ -13,6 +13,7 @@ withDefaults(defineProps<StartProps>(), {})
<template>
<div class="start-box">
<Node icon="List"
:arrow="false"
:close="false"
color="#8c7cf3"
:node="node">

View File

@ -3,6 +3,7 @@ import Segmented from '~/components/Segmented'
import {useVModels} from '@vueuse/core'
import {ApprovalNode} from '../nodes/Approval/index'
import {ref} from "vue";
import {CircleCheck, CircleClose,Switch,Plus,Minus} from "@element-plus/icons-vue";
const activeName = ref('properties')
@ -89,7 +90,106 @@ const {node} = useVModels($props, $emits)
待添加...
</el-tab-pane>
<el-tab-pane label="操作权限" name="operationPermissions">
待添加...
<div class="flow-opt-item">
<el-icon :size="32" class="flow-opt-item__icon">
<CircleCheck/>
</el-icon>
<div class="flow-opt-item__content">
<el-text tag="b">
同意
</el-text>
<div class="flow-opt-item__second">
同意描述同意描述同意描述同意描述同意描述同意描述
</div>
</div>
<el-switch
v-model="node.operations.complete"
inline-prompt
active-text="开"
inactive-text="关"
/>
</div>
<el-divider/>
<div class="flow-opt-item">
<el-icon :size="32" class="flow-opt-item__icon">
<CircleClose/>
</el-icon>
<div class="flow-opt-item__content">
<el-text tag="b">
拒绝
</el-text>
<div class="flow-opt-item__second">
拒绝描述拒绝描述拒绝描述拒绝描述拒绝描述拒绝描述
</div>
</div>
<el-switch
v-model="node.operations.refuse"
inline-prompt
active-text="开"
inactive-text="关"
/>
</div>
<el-divider/>
<div class="flow-opt-item">
<el-icon :size="32" class="flow-opt-item__icon">
<Switch/>
</el-icon>
<div class="flow-opt-item__content">
<el-text tag="b">
转办
</el-text>
<div class="flow-opt-item__second">
转办描述转办描述转办描述转办描述转办描述转办描述
</div>
</div>
<el-switch
v-model="node.operations.transfer"
inline-prompt
active-text="开"
inactive-text="关"
/>
</div>
<el-divider/>
<div class="flow-opt-item">
<el-icon :size="32" class="flow-opt-item__icon">
<Plus/>
</el-icon>
<div class="flow-opt-item__content">
<el-text tag="b">
加签
</el-text>
<div class="flow-opt-item__second">
加签描述加签描述加签描述加签描述加签描述加签描述
</div>
</div>
<el-switch
v-model="node.operations.addMulti"
inline-prompt
active-text="开"
inactive-text="关"
/>
</div>
<el-divider/>
<div class="flow-opt-item">
<el-icon :size="32" class="flow-opt-item__icon">
<Minus/>
</el-icon>
<div class="flow-opt-item__content">
<el-text tag="b">
减签
</el-text>
<div class="flow-opt-item__second">
减签描述减签描述减签描述减签描述减签描述减签描述
</div>
</div>
<el-switch
v-model="node.operations.minusMulti"
inline-prompt
active-text="开"
inactive-text="关"
/>
</div>
<el-divider/>
</el-tab-pane>
</segmented>
</template>
@ -100,4 +200,28 @@ const {node} = useVModels($props, $emits)
align-items: flex-start !important;
flex-direction: column !important;
}
.flow-opt-item {
display: flex;
align-items: center;
.flow-opt-item__icon {
background: var(--el-color-primary);
color: #fff;
border-radius: 7px;
padding: 3px;
}
.flow-opt-item__content {
box-sizing: border-box;
flex: 1;
margin-left: 20px;
font-size: 14px;
.flow-opt-item__second {
margin-top: 3px;
font-size: 12px;
color: var(--el-text-color-placeholder);
}
}
}
</style>