code review 修改

This commit is contained in:
jason 2024-04-18 15:56:49 +08:00
parent 12548b0af2
commit 2589fbe560
8 changed files with 91 additions and 73 deletions

View File

@ -71,18 +71,15 @@ let props = defineProps({
type:Boolean, type:Boolean,
default:true default:true
}, },
defaultFieldsPermission : {
type: Array,
default: () => ([])
}
}) })
let emits = defineEmits(['update:childNodeP']) let emits = defineEmits(['update:childNodeP'])
let visible = ref(false) let visible = ref(false)
const defaultFieldsPermission = inject('defaultFieldsPermission')
const addType = (type: number) => { const addType = (type: number) => {
visible.value = false visible.value = false
// //
if (type === NodeType.APPROVE_USER_NODE) { if (type === NodeType.APPROVE_USER_NODE) {
console.log("props.defaultFieldsPermission", props.defaultFieldsPermission)
const data = { const data = {
name: '审核人', name: '审核人',
error: true, error: true,
@ -92,7 +89,7 @@ const addType = (type: number) => {
approveMethod: undefined, approveMethod: undefined,
candidateStrategy: undefined, candidateStrategy: undefined,
candidateParam: undefined, candidateParam: undefined,
fieldsPermission: props.defaultFieldsPermission, fieldsPermission: defaultFieldsPermission,
}, },
childNode: props.childNodeP childNode: props.childNodeP
} }

View File

@ -162,7 +162,7 @@
</el-form> </el-form>
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="设置字段权限"> <el-tab-pane label="设置字段权限" v-if ="formType === 10">
<div class="field-setting-pane h-full w-full flex flex-col"> <div class="field-setting-pane h-full w-full flex flex-col">
<div class="field-setting-content mr-2 overflow-auto py-4 pr-2"> <div class="field-setting-content mr-2 overflow-auto py-4 pr-2">
<div class="field-container flex flex-col flex-items-start"> <div class="field-container flex flex-col flex-items-start">
@ -175,30 +175,43 @@
<span class="setting-title-label">只读</span> <span class="setting-title-label">只读</span>
<span class="setting-title-label">隐藏</span> <span class="setting-title-label">隐藏</span>
</div> </div>
<div class="field-setting-item"> <!-- <div class="field-setting-item">
<span class="field-setting-item-label">全选</span> <span class="field-setting-item-label">全选</span>
<span class="all-checkbox-wrap"> <span class="all-checkbox-wrap">
<el-checkbox label="" size="large" /> <el-checkbox
label=""
size="large"
/>
</span> </span>
<span class="all-checkbox-wrap"> <span class="all-checkbox-wrap">
<el-checkbox label="" size="large" /> <el-checkbox
label=""
size="large"
/>
</span> </span>
<span class="all-checkbox-wrap"> <span class="all-checkbox-wrap">
<el-checkbox label="" size="large" /> <el-checkbox
label=""
size="large"
/>
</span> </span>
</div> </div> -->
<div class="field-setting-item-check"> <div class="field-setting-item-check">
<div class="field-setting-item" v-for="(item,index) in candidateConfig.fieldsPermission" :key="index"> <div
class="field-setting-item"
v-for="(item, index) in candidateConfig.fieldsPermission"
:key="index"
>
<span class="field-setting-item-label"> {{ item.title }}</span> <span class="field-setting-item-label"> {{ item.title }}</span>
<el-radio-group v-model="item.permission" > <el-radio-group v-model="item.permission">
<div class="item-radio-wrap"> <div class="item-radio-wrap">
<el-radio value="1" size="large" label="1"/> <el-radio value="1" size="large" label="1" />
</div> </div>
<div class="item-radio-wrap"> <div class="item-radio-wrap">
<el-radio value="2" size="large" label="2"/> <el-radio value="2" size="large" label="2" />
</div> </div>
<div class="item-radio-wrap"> <div class="item-radio-wrap">
<el-radio value="3" size="large" label="3"/> <el-radio value="3" size="large" label="3" />
</div> </div>
</el-radio-group> </el-radio-group>
</div> </div>
@ -223,8 +236,8 @@
<script lang="ts" setup> <script lang="ts" setup>
import { ref, watch, computed, toRaw } from 'vue' import { ref, watch, computed, toRaw } from 'vue'
import { approveMethods } from '../util' import { approveMethods } from '../util'
import { useWorkFlowStoreWithOut } from '@/store/modules/simpleWorkflow' import { useWorkFlowStoreWithOut } from '@/store/modules/bpm/simpleWorkflow'
import { DICT_TYPE, getIntDictOptions, getDictLabel } from '@/utils/dict' import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
import { defaultProps, handleTree } from '@/utils/tree' import { defaultProps, handleTree } from '@/utils/tree'
import * as RoleApi from '@/api/system/role' import * as RoleApi from '@/api/system/role'
import * as DeptApi from '@/api/system/dept' import * as DeptApi from '@/api/system/dept'
@ -241,15 +254,14 @@ const candidateConfig = ref({
candidateStrategy: undefined, candidateStrategy: undefined,
candidateParam: [], candidateParam: [],
approveMethod: undefined, approveMethod: undefined,
fieldsPermission:[] fieldsPermission: []
}) })
// let approverConfig = ref({}) const store = useWorkFlowStoreWithOut()
let store = useWorkFlowStoreWithOut()
let { setApproverDrawer, setUserTaskConfig } = store let { setApproverDrawer, setUserTaskConfig } = store
// let approverConfig1 = computed(() => store.approverConfig1) // let approverConfig1 = computed(() => store.approverConfig1)
let approverDrawer = computed(() => store.approverDrawer) let approverDrawer = computed(() => store.approverDrawer)
const userTaskConfig = computed(() => store.userTaskConfig) const userTaskConfig = computed(() => store.userTaskConfig)
const formType = inject('formType')
let visible = computed({ let visible = computed({
get() { get() {
return approverDrawer.value return approverDrawer.value
@ -280,7 +292,9 @@ watch(userTaskConfig, (val) => {
const saveConfig = () => { const saveConfig = () => {
const rawConfig = toRaw(userTaskConfig.value) const rawConfig = toRaw(userTaskConfig.value)
const { approveMethod, candidateStrategy, candidateParam, fieldsPermission } = toRaw(candidateConfig.value) const { approveMethod, candidateStrategy, candidateParam, fieldsPermission } = toRaw(
candidateConfig.value
)
const candidateParamStr = candidateParam.join(',') const candidateParamStr = candidateParam.join(',')
rawConfig.value.attributes = { rawConfig.value.attributes = {
approveMethod, approveMethod,
@ -309,6 +323,24 @@ const closeDrawer = () => {
const changecandidateStrategy = () => { const changecandidateStrategy = () => {
candidateConfig.value.candidateParam = [] candidateConfig.value.candidateParam = []
} }
const handleAllCheck = (event, type) => {
console.log('event', event);
console.log('type', type);
event.target.checked = true;
let permission = '1'
if (type === 'edit' && editAllChecked.value) {
permission = '1'
}
if (type === 'read' && readAllChecked.value) {
permission = '2'
}
if (type === 'hide' && hideAllChecked.value) {
permission = '3'
}
candidateConfig.value.fieldsPermission.forEach((item) => {
item.permission = permission
})
}
onMounted(async () => { onMounted(async () => {
// //
roleOptions.value = await RoleApi.getSimpleRoleList() roleOptions.value = await RoleApi.getSimpleRoleList()
@ -321,7 +353,6 @@ onMounted(async () => {
deptTreeOptions.value = handleTree(deptOptions, 'id') deptTreeOptions.value = handleTree(deptOptions, 'id')
// //
userGroupOptions.value = await UserGroupApi.getUserGroupSimpleList() userGroupOptions.value = await UserGroupApi.getUserGroupSimpleList()
}) })
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -387,7 +418,6 @@ onMounted(async () => {
padding-left: 6px; padding-left: 6px;
text-align: center; text-align: center;
} }
} }
::v-deep(.el-radio__label) { ::v-deep(.el-radio__label) {

View File

@ -144,7 +144,7 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { ref, watch, computed, toRaw } from 'vue' import { ref, watch, computed, toRaw } from 'vue'
import { useWorkFlowStoreWithOut } from '@/store/modules/simpleWorkflow' import { useWorkFlowStoreWithOut } from '@/store/modules/bpm/simpleWorkflow'
import { DICT_TYPE, getIntDictOptions, getDictLabel } from '@/utils/dict' import { DICT_TYPE, getIntDictOptions, getDictLabel } from '@/utils/dict'
import { defaultProps, handleTree } from '@/utils/tree' import { defaultProps, handleTree } from '@/utils/tree'
import * as RoleApi from '@/api/system/role' import * as RoleApi from '@/api/system/role'

View File

@ -22,7 +22,7 @@
class="ant-input editable-title-input" class="ant-input editable-title-input"
@blur="blurEvent(-1)" @blur="blurEvent(-1)"
@focus="$event.currentTarget?.select()" @focus="$event.currentTarget?.select()"
v-mountedFoucs v-mountedFocus
v-model="nodeConfig.name" v-model="nodeConfig.name"
:placeholder="defaultText" :placeholder="defaultText"
/> />
@ -44,7 +44,7 @@
<i class="anticon anticon-exclamation-circle"></i> <i class="anticon anticon-exclamation-circle"></i>
</div> </div>
</div> </div>
<addNode v-model:childNodeP="nodeConfig.childNode" :default-fields-permission="props.defaultFieldsPermission" /> <addNode v-model:childNodeP="nodeConfig.childNode" />
</div> </div>
<div class="branch-wrap" v-if="nodeConfig.type == 4"> <div class="branch-wrap" v-if="nodeConfig.type == 4">
<div class="branch-box-wrap"> <div class="branch-box-wrap">
@ -60,7 +60,7 @@
class="ant-input editable-title-input" class="ant-input editable-title-input"
@blur="blurEvent(index)" @blur="blurEvent(index)"
@focus="$event.currentTarget?.select()" @focus="$event.currentTarget?.select()"
v-mountedFoucs v-mountedFocus
v-model="item.name" v-model="item.name"
/> />
<span v-else class="editable-title" @click="clickEvent(index)">{{ <span v-else class="editable-title" @click="clickEvent(index)">{{
@ -92,10 +92,10 @@
<i class="anticon anticon-exclamation-circle"></i> <i class="anticon anticon-exclamation-circle"></i>
</div> </div>
</div> </div>
<addNode v-model:childNodeP="item.childNode" :default-fields-permission="props.defaultFieldsPermission"/> <addNode v-model:childNodeP="item.childNode" />
</div> </div>
</div> </div>
<nodeWrap v-if="item.childNode" v-model:nodeConfig="item.childNode" :default-fields-permission="props.defaultFieldsPermission"/> <nodeWrap v-if="item.childNode" v-model:nodeConfig="item.childNode" />
<template v-if="index == 0"> <template v-if="index == 0">
<div class="top-left-cover-line"></div> <div class="top-left-cover-line"></div>
<div class="bottom-left-cover-line"></div> <div class="bottom-left-cover-line"></div>
@ -106,7 +106,7 @@
</template> </template>
</div> </div>
</div> </div>
<addNode v-model:childNodeP="nodeConfig.childNode" :default-fields-permission="props.defaultFieldsPermission"/> <addNode v-model:childNodeP="nodeConfig.childNode" />
</div> </div>
</div> </div>
<div class="branch-wrap" v-if="nodeConfig.type == 5"> <div class="branch-wrap" v-if="nodeConfig.type == 5">
@ -123,7 +123,7 @@
class="ant-input editable-title-input" class="ant-input editable-title-input"
@blur="blurEvent(index)" @blur="blurEvent(index)"
@focus="$event.currentTarget?.select()" @focus="$event.currentTarget?.select()"
v-mountedFoucs v-mountedFocus
v-model="item.name" v-model="item.name"
/> />
<span v-else class="editable-title" @click="clickEvent(index)">{{ <span v-else class="editable-title" @click="clickEvent(index)">{{
@ -137,10 +137,10 @@
<i class="anticon anticon-exclamation-circle"></i> <i class="anticon anticon-exclamation-circle"></i>
</div> </div>
</div> </div>
<addNode v-model:childNodeP="item.childNode" :default-fields-permission="props.defaultFieldsPermission"/> <addNode v-model:childNodeP="item.childNode" />
</div> </div>
</div> </div>
<nodeWrap v-if="item.childNode" v-model:nodeConfig="item.childNode" :default-fields-permission="props.defaultFieldsPermission" /> <nodeWrap v-if="item.childNode" v-model:nodeConfig="item.childNode" />
<template v-if="index == 0"> <template v-if="index == 0">
<div class="top-left-cover-line"></div> <div class="top-left-cover-line"></div>
<div class="bottom-left-cover-line"></div> <div class="bottom-left-cover-line"></div>
@ -151,7 +151,7 @@
</template> </template>
</div> </div>
</div> </div>
<addNode v-model:childNodeP="nodeConfig.childNode" :show-add-button="false" :default-fields-permission="props.defaultFieldsPermission"/> <addNode v-model:childNodeP="nodeConfig.childNode" :show-add-button="false" />
</div> </div>
</div> </div>
<div class="branch-wrap" v-if="nodeConfig.type == 7"> <div class="branch-wrap" v-if="nodeConfig.type == 7">
@ -168,7 +168,7 @@
class="ant-input editable-title-input" class="ant-input editable-title-input"
@blur="blurEvent(index)" @blur="blurEvent(index)"
@focus="$event.currentTarget?.select()" @focus="$event.currentTarget?.select()"
v-mountedFoucs v-mountedFocus
v-model="item.name" v-model="item.name"
/> />
<span v-else class="editable-title" @click="clickEvent(index)"> <span v-else class="editable-title" @click="clickEvent(index)">
@ -186,10 +186,10 @@
<i class="anticon anticon-exclamation-circle"></i> <i class="anticon anticon-exclamation-circle"></i>
</div> </div>
</div> </div>
<addNode v-model:childNodeP="item.childNode" :default-fields-permission="props.defaultFieldsPermission"/> <addNode v-model:childNodeP="item.childNode" />
</div> </div>
</div> </div>
<nodeWrap v-if="item.childNode" v-model:nodeConfig="item.childNode" :default-fields-permission="props.defaultFieldsPermission" /> <nodeWrap v-if="item.childNode" v-model:nodeConfig="item.childNode" />
<template v-if="index == 0"> <template v-if="index == 0">
<div class="top-left-cover-line"></div> <div class="top-left-cover-line"></div>
<div class="bottom-left-cover-line"></div> <div class="bottom-left-cover-line"></div>
@ -200,7 +200,7 @@
</template> </template>
</div> </div>
</div> </div>
<addNode v-model:childNodeP="nodeConfig.childNode" :show-add-button="false" :default-fields-permission="props.defaultFieldsPermission" /> <addNode v-model:childNodeP="nodeConfig.childNode" :show-add-button="false" />
</div> </div>
</div> </div>
<div class="node-wrap" v-if="nodeConfig.type === NodeType.PARALLEL_NODE_JOIN || nodeConfig.type === NodeType.INCLUSIVE_NODE_JOIN"> <div class="node-wrap" v-if="nodeConfig.type === NodeType.PARALLEL_NODE_JOIN || nodeConfig.type === NodeType.INCLUSIVE_NODE_JOIN">
@ -209,9 +209,9 @@
<div class="text">聚合</div> <div class="text">聚合</div>
</div> </div>
</div> </div>
<addNode v-model:childNodeP="nodeConfig.childNode" :default-fields-permission="props.defaultFieldsPermission" /> <addNode v-model:childNodeP="nodeConfig.childNode" />
</div> </div>
<nodeWrap v-if="nodeConfig.childNode" v-model:nodeConfig="nodeConfig.childNode" :default-fields-permission="props.defaultFieldsPermission" /> <nodeWrap v-if="nodeConfig.childNode" v-model:nodeConfig="nodeConfig.childNode" />
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import addNode from './addNode.vue' import addNode from './addNode.vue'
@ -225,17 +225,13 @@ import {
getApproverShowText getApproverShowText
} from './util' } from './util'
import { WorkFlowNode, NodeType } from './consts' import { WorkFlowNode, NodeType } from './consts'
import { useWorkFlowStoreWithOut } from '@/store/modules/simpleWorkflow' import { useWorkFlowStoreWithOut } from '@/store/modules/bpm/simpleWorkflow'
let _uid = getCurrentInstance().uid let _uid = getCurrentInstance().uid
import { generateUUID } from '@/utils' import { generateUUID } from '@/utils'
let props = defineProps({ let props = defineProps({
nodeConfig: { nodeConfig: {
type: Object as () => WorkFlowNode, type: Object as () => WorkFlowNode,
default: () => ({}) as WorkFlowNode default: () => ({}) as WorkFlowNode
},
defaultFieldsPermission : {
type: Array,
default: () => ([])
} }
}) })

View File

@ -12,12 +12,11 @@ export const setupAuth = (app: App<Element>) => {
hasPermi(app) hasPermi(app)
} }
// TODO @jason拼写是不是 Focus 聚焦?
/** /**
* v-mountedFoucs * v-mountedFocus
*/ */
export const setupMountedFoucs = (app: App<Element>) => { export const setupMountedFocus = (app: App<Element>) => {
app.directive('mountedFoucs', { app.directive('mountedFocus', {
mounted(el) { mounted(el) {
el.focus() el.focus()
} }

View File

@ -29,7 +29,7 @@ import '@/plugins/animate.css'
import router, { setupRouter } from '@/router' import router, { setupRouter } from '@/router'
// 其它指令 // 其它指令
import { setupAuth, setupMountedFoucs } from '@/directives' import { setupAuth, setupMountedFocus } from '@/directives'
import { createApp } from 'vue' import { createApp } from 'vue'
@ -60,7 +60,7 @@ const setupAll = async () => {
setupAuth(app) setupAuth(app)
setupMountedFoucs(app) setupMountedFocus(app)
await router.isReady() await router.isReady()

View File

@ -1,5 +1,4 @@
// TODO @jason这个放到 store/modules/bpm/simpleWorkflow.ts import { store } from '../../index'
import { store } from '../index'
import { defineStore } from 'pinia' import { defineStore } from 'pinia'
export const useWorkFlowStore = defineStore('simpleWorkflow', { export const useWorkFlowStore = defineStore('simpleWorkflow', {

View File

@ -1,22 +1,16 @@
<template> <template>
<div> <div>
<section class="dingflow-design"> <section class="dingflow-design">
<el-row> <div class="sticky right-0 top-0 z-10 w-full flex justify-end bg-white p-2 pr-4">
<el-col :span="20" /> <el-button type="primary" size="small" @click="test">保存(测试中待完善)</el-button>
<el-col :span="4"> </div>
<el-button type="primary" size="small" @click="test">保存(用于测试还未完成)</el-button>
</el-col>
</el-row>
<div class="box-scale"> <div class="box-scale">
<div class="start-event-node"> <div class="start-event-node">
<div class="start-event-node-circle">开始</div> <div class="start-event-node-circle">开始</div>
</div> </div>
<div class="start-event-node-line"></div> <div class="start-event-node-line"></div>
<nodeWrap v-model:nodeConfig="nodeConfig" :defaultFieldsPermission="defaultFieldsPermission" /> <nodeWrap v-model:nodeConfig="nodeConfig"/>
<!-- <div class="end-node">
<div class="end-node-circle"></div>
<div class="end-node-text">流程结束</div>
</div> -->
<div class="end-event"> <div class="end-event">
<div class="end-event-circle">结束</div> <div class="end-event-circle">结束</div>
</div> </div>
@ -51,6 +45,9 @@ const nodeConfig = ref<WorkFlowNode>({
}) })
// //
const defaultFieldsPermission: any[] = [] const defaultFieldsPermission: any[] = []
const formType = ref(20);
provide('defaultFieldsPermission', defaultFieldsPermission)
provide('formType', formType)
const test = async () => { const test = async () => {
if (!modelId) { if (!modelId) {
message.error('缺少模型 modelId 编号') message.error('缺少模型 modelId 编号')
@ -83,8 +80,8 @@ const close = () => {
onMounted(async () => { onMounted(async () => {
const bpmnModel = await getModel(modelId) const bpmnModel = await getModel(modelId)
if (bpmnModel) { if (bpmnModel) {
const formType = bpmnModel.formType formType.value = bpmnModel.formType
if (formType === 10) { if (formType.value === 10) {
const bpmnForm = await getForm(bpmnModel.formId) as unknown as FormVO const bpmnForm = await getForm(bpmnModel.formId) as unknown as FormVO
const formFields = bpmnForm?.fields const formFields = bpmnForm?.fields
if (formFields) { if (formFields) {