clay
/
workflow-engine-web
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Compare commits

base: clay:9fb0524c6b197215cdec70b6987ebdaa3e705341
Branches Tags
clay:master
clay:pro
clay:DJ
clay:chatGPT
clay:master-back
clay:clay
..
compare: clay:72fd575dde721d6ae9a8e62a30ef194be3988857
Branches Tags
clay:pro
clay:master
clay:DJ
clay:chatGPT
clay:master-back
clay:clay

No commits in common. "9fb0524c6b197215cdec70b6987ebdaa3e705341" and "72fd575dde721d6ae9a8e62a30ef194be3988857" have entirely different histories.
9fb0524c6b ... 72fd575dde

7 changed files with 77 additions and 151 deletions
Show Stats Expand all files Collapse all files

45
flowable-engine-web/src/components/common/AvatarEllipsis.vue
View File

@ -4,8 +4,9 @@
:style="{'--row':row}"> :style="{'--row':row}">
<slot name="pre"></slot> <slot name="pre"></slot>
<div style="display: flex;"> <div style="display: flex;">
<div v-for="(user,index) in userInfo" :key="index" class="avatar_name"> <div v-for="(user,index) in userInfo" :key="index">
<el-avatar size="large" <div>
<el-avatar style="margin-right: 5px;" size="large"
:src="user.avatar"></el-avatar> :src="user.avatar"></el-avatar>
<div v-if="user.icon" <div v-if="user.icon"
class="el-timeline-item__node" :style="{ class="el-timeline-item__node" :style="{
@ -16,9 +17,8 @@
:class="user.icon" :class="user.icon"
></i> ></i>
</div> </div>
<el-tooltip class="item" effect="dark" :content="user.name" placement="bottom-start"> </div>
<span class="item_name">{{ user.name }}</span> <div>{{user.name}}</div>
</el-tooltip>
</div> </div>
</div> </div>
</div> </div>
@ -27,20 +27,20 @@
<script> <script>
export default { export default {
name: "AvatarEllipsis", name: "AvatarEllipsis",
install(Vue) { install(Vue){
Vue.component('avatarEllipsis', this) Vue.component('avatarEllipsis', this)
}, },
components: {}, components: {},
props: { props:{
row: { row: {
type: Number, type: Number,
default: 1 default: 1
}, },
hoverTip: { hoverTip:{
type: Boolean, type: Boolean,
default: false default: false
}, },
userInfo: { userInfo:{
type: Array, type: Array,
default: [] default: []
} }
@ -52,7 +52,7 @@ export default {
return {} return {}
}, },
methods: { methods: {
init() { init(){
for (let user of this.userInfo) { for (let user of this.userInfo) {
this.initUser(user) this.initUser(user)
} }
@ -60,26 +60,26 @@ export default {
initUser(user) { initUser(user) {
let state = user.state let state = user.state
//创建节点 //创建节点
if (state === 'CREATE') { if (state === 'create') {
this.$set(user, "icon", "el-icon-check") this.$set(user, "icon", "el-icon-check")
this.$set(user, "color", "#0bbd87") this.$set(user, "color", "#0bbd87")
} }
//审批通过 //审批通过
if (state === 'AGREE') { if (state === 'agree') {
this.$set(user, "icon", "el-icon-check") this.$set(user, "icon", "el-icon-check")
this.$set(user, "color", "#0bbd87") this.$set(user, "color", "#0bbd87")
} }
//审批处理中 //审批处理中
if (state === 'RUNNING') { if (state === 'running') {
this.$set(user, "icon", "el-icon-loading") this.$set(user, "icon", "el-icon-loading")
this.$set(user, "color", "#f78f5f") this.$set(user, "color", "#f78f5f")
} }
//拒绝后评论 //拒绝后评论
if (state === 'REFUSE') { if (state === 'refuse') {
this.$set(user, "icon", "el-icon-close") this.$set(user, "icon", "el-icon-close")
this.$set(user, "color", "#f56c6c") this.$set(user, "color", "#f56c6c")
} }
if (state === 'PASS') { if (state === 'pass'){
this.$set(user, "icon", "el-icon-more") this.$set(user, "icon", "el-icon-more")
this.$set(user, "color", "#c0c4cc") this.$set(user, "color", "#c0c4cc")
} }
@ -90,18 +90,5 @@ export default {
</script> </script>
<style scoped> <style scoped>
.avatar_name {
display: flex;
flex-direction: column;
align-items: center;
margin-right: 5px;
/*width: 45px;*/
}
.item_name{
width: 45px;
text-align: center;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden
}
</style> </style>

49
flowable-engine-web/src/components/common/UserPicker.vue
View File

@ -19,6 +19,7 @@
<el-tree :data="dataList" ref="tree" :props="defaultProps" empty-text="" node-key="value" <el-tree :data="dataList" ref="tree" :props="defaultProps" empty-text="" node-key="value"
:default-expanded-keys="expandedKeys" :default-expanded-keys="expandedKeys"
@node-click="handleChange" @node-click="handleChange"
:filter-node-method="filterNode"
> >
<div class="tree-node" slot-scope="{ node,data }"> <div class="tree-node" slot-scope="{ node,data }">
<div v-if="data.type === 0" style="display: flex;align-items: center"> <div v-if="data.type === 0" style="display: flex;align-items: center">
@ -69,12 +70,6 @@ export default {
return []; return [];
} }
}, },
selected: {
type: Array,
default: () => {
return [];
}
},
multiple: { //是否多选 multiple: { //是否多选
default: true, default: true,
type: Boolean type: Boolean
@ -132,43 +127,33 @@ export default {
}, },
getList() { getList() {
getUserTree(this.radio, this.chooseId).then(res => { getUserTree(this.radio, this.chooseId).then(res => {
console.log('人员', res.data) if (res.data) {
// if (res.data) {
if (this.selectItem.type === -1 || this.selectItem.type === -2) { if (this.selectItem.type === -1 || this.selectItem.type === -2) {
this.dataList = res.data this.dataList = this.setData(res.data)
} } else if (this.selectItem.type === 1) {
else if (this.selectItem.type === 1) {
this.selectItem.children = res.data this.selectItem.children = res.data
} else if (this.selectItem.type === 2) { } else if (this.selectItem.type === 2) {
this.selectItem.children = res.data this.selectItem.children = this.setData(res.data)
}
} }
// }
}); });
}, },
setData(source) { setData(source) {
// for (let item of source) { for (let item of source) {
// this.$set(item, "value", this.selectItem.value + "-" + item.id) this.$set(item, "value", this.selectItem.value + "-" + item.id)
// } this.$set(item, "children", [])
}
return source; return source;
}, },
//通过关键字过滤树节点 //通过关键字过滤树节点
// filterNode(value, data) { filterNode(value, data) {
// if (!value) return true; if (!value) return true;
// return data.name.indexOf(value) !== -1; return data.name.indexOf(value) !== -1;
// }, },
//用于用户选择 //用于用户选择
showUserPicker() { showUserPicker() {
this.selectItem = {
type: -1,
value: '0',
}
this.dataList = []
// this.selectList = []
this.chooseId = 0
this.radio = 0
this.visible = true;
this.getList(); this.getList();
this.visible = true;
}, },
//渲染子节点用户或部门及用户数据 //渲染子节点用户或部门及用户数据
handleChange(item, check) { handleChange(item, check) {
@ -177,8 +162,8 @@ export default {
if (item.type !== 0) { if (item.type !== 0) {
this.chooseId = item.id this.chooseId = item.id
this.getList() this.getList()
return
} }
if (!item.children) {
if (this.multiple) { if (this.multiple) {
//不添加重复的数据到右边 //不添加重复的数据到右边
for (let i = 0; i < this.selectList.length; i++) { for (let i = 0; i < this.selectList.length; i++) {
@ -191,6 +176,7 @@ export default {
} else { } else {
this.selectList = [item]; this.selectList = [item];
} }
}
// this._value = this.selectList // this._value = this.selectList
}, },
//右侧的× //右侧的×
@ -216,7 +202,6 @@ export default {
//确定按钮 //确定按钮
selectConfirm() { selectConfirm() {
this.$emit("ok", this.selectList); this.$emit("ok", this.selectList);
// this.dataList = []
this.visible = false; this.visible = false;
} }
} }

2
flowable-engine-web/src/views/common/form/components/UserPicker.vue
View File

@ -9,7 +9,7 @@
<el-button icon="el-icon-user" type="primary" size="mini" round @click="$refs.userPicker.showUserPicker()"> <el-button icon="el-icon-user" type="primary" size="mini" round @click="$refs.userPicker.showUserPicker()">
选择人员 选择人员
</el-button> </el-button>
<user-select :multiple="multiple" ref="userPicker" title="请选择系统用户" :v-mode="_value" @ok="selected"/> <user-select type="user" :multiple="multiple" ref="userPicker" :selected="_value" @ok="selected"/>
<span class="placeholder"> {{ placeholder }}</span> <span class="placeholder"> {{ placeholder }}</span>
<div style="display: flex;"> <div style="display: flex;">
<div class="userStyle" v-for="(user, i) in _value" :key="i"> <div class="userStyle" v-for="(user, i) in _value" :key="i">

57
flowable-engine-web/src/views/common/operation/OperationRender.vue
View File

@ -9,11 +9,11 @@
placement="top"> placement="top">
<el-card> <el-card>
<div style="display: flex;"> <div style="display: flex;">
<div v-for="(user,index) in operation.userInfo" :key="index" class="avatar_name"> <div v-for="(user,index) in operation.userInfo" :key="index">
<el-avatar size="large" <el-avatar style="margin-right: 5px;" size="large"
:src="user.avatar"></el-avatar> :src="user.avatar"></el-avatar>
<div v-if="!$slots.dot && operation.userInfo.length > 1" <div v-if="!$slots.dot && operation.userInfo.length > 1"
class="el-timeline-item__node avatar_icon" :style="{ class="el-timeline-item__node" :style="{
backgroundColor: user.color backgroundColor: user.color
}"> }">
<i v-if="user.icon" <i v-if="user.icon"
@ -21,9 +21,6 @@
:class="user.icon" :class="user.icon"
></i> ></i>
</div> </div>
<el-tooltip effect="dark" :content="user.name" placement="bottom-start">
<span class="username">{{ user.name }}</span>
</el-tooltip>
</div> </div>
<div style="margin-left: 10px;"> <div style="margin-left: 10px;">
<div style="color: #c0bebe">{{ operation.operationName }}</div> <div style="color: #c0bebe">{{ operation.operationName }}</div>
@ -148,26 +145,26 @@ export default {
initUser(user) { initUser(user) {
let state = user.state let state = user.state
//创建节点 //创建节点
if (state === 'CREATE') { if (state === 'create') {
this.$set(user, "icon", "el-icon-check") this.$set(user, "icon", "el-icon-check")
this.$set(user, "color", "#0bbd87") this.$set(user, "color", "#0bbd87")
} }
//审批通过 //审批通过
if (state === 'AGREE') { if (state === 'agree') {
this.$set(user, "icon", "el-icon-check") this.$set(user, "icon", "el-icon-check")
this.$set(user, "color", "#0bbd87") this.$set(user, "color", "#0bbd87")
} }
//审批处理中 //审批处理中
if (state === 'RUNNING') { if (state === 'running') {
this.$set(user, "icon", "el-icon-loading") this.$set(user, "icon", "el-icon-loading")
this.$set(user, "color", "#f78f5f") this.$set(user, "color", "#f78f5f")
} }
//拒绝后评论 //拒绝后评论
if (state === 'REFUSE') { if (state === 'refuse') {
this.$set(user, "icon", "el-icon-close") this.$set(user, "icon", "el-icon-close")
this.$set(user, "color", "#f56c6c") this.$set(user, "color", "#f56c6c")
} }
if (state === 'PASS'){ if (state === 'pass'){
this.$set(user, "icon", "el-icon-more") this.$set(user, "icon", "el-icon-more")
this.$set(user, "color", "#c0c4cc") this.$set(user, "color", "#c0c4cc")
} }
@ -177,47 +174,47 @@ export default {
let state = operation.state let state = operation.state
let type = operation.operation let type = operation.operation
//创建节点 //创建节点
if (state === 'CREATE') { if (state === 'create') {
this.$set(operation, "icon", "el-icon-check") this.$set(operation, "icon", "el-icon-check")
this.$set(operation, "color", "#0bbd87") this.$set(operation, "color", "#0bbd87")
this.$set(operation, "remark", operation.userInfo.name) this.$set(operation, "remark", operation.userInfo.name)
} }
//审批通过 //审批通过
if (state === 'AGREE') { if (state === 'agree') {
this.$set(operation, "icon", "el-icon-check") this.$set(operation, "icon", "el-icon-check")
this.$set(operation, "color", "#0bbd87") this.$set(operation, "color", "#0bbd87")
this.$set(operation, "remark", operation.userInfo.name + ' (已同意)') this.$set(operation, "remark", operation.userInfo.name + ' (已同意)')
} }
if (state === 'PASS'){ if (state === 'pass'){
this.$set(operation, "icon", "el-icon-more") this.$set(operation, "icon", "el-icon-more")
this.$set(operation, "color", "#c0c4cc") this.$set(operation, "color", "#c0c4cc")
} }
//审批处理中 //审批处理中
if (state === 'RUNNING') { if (state === 'running') {
this.$set(operation, "icon", "el-icon-loading") this.$set(operation, "icon", "el-icon-loading")
this.$set(operation, "color", "#f78f5f") this.$set(operation, "color", "#f78f5f")
this.$set(operation, "remark", operation.userInfo.name + ' (处理中)') this.$set(operation, "remark", operation.userInfo.name + ' (处理中)')
} }
//抄送 //抄送
if (type === 'CC') { if (type === 'cc') {
this.$set(operation, "icon", "el-icon-s-promotion") this.$set(operation, "icon", "el-icon-s-promotion")
this.$set(operation, "color", "#3395f8") this.$set(operation, "color", "#3395f8")
this.$set(operation, "remark", operation.userInfo.name + ' (抄送成功)') this.$set(operation, "remark", operation.userInfo.name + ' (抄送成功)')
} }
//评论 //评论
if (state === 'COMMENT') { if (state === 'comment') {
this.$set(operation, "icon", "el-icon-chat-dot-round") this.$set(operation, "icon", "el-icon-chat-dot-round")
this.$set(operation, "color", "#0bbd87") this.$set(operation, "color", "#0bbd87")
this.$set(operation, "remark", operation.userInfo.name + ' (添加了评论)') this.$set(operation, "remark", operation.userInfo.name + ' (添加了评论)')
} }
//拒绝后评论 //拒绝后评论
if (state === 'REFUSE' && type === 'COMMENT') { if (state === 'refuse' && type === 'comment') {
this.$set(operation, "icon", "el-icon-chat-dot-round") this.$set(operation, "icon", "el-icon-chat-dot-round")
this.$set(operation, "color", "#f56c6c") this.$set(operation, "color", "#f56c6c")
this.$set(operation, "remark", operation.userInfo.name + ' (填写拒绝理由)') this.$set(operation, "remark", operation.userInfo.name + ' (填写拒绝理由)')
} }
//拒绝操作 //拒绝操作
if (state === 'REFUSE' && type === 'OPINION') { if (state === 'refuse' && type === 'opinion') {
this.$set(operation, "icon", "el-icon-close") this.$set(operation, "icon", "el-icon-close")
this.$set(operation, "color", "#f56c6c") this.$set(operation, "color", "#f56c6c")
this.$set(operation, "remark", operation.userInfo.name + ' (拒绝)') this.$set(operation, "remark", operation.userInfo.name + ' (拒绝)')
@ -233,25 +230,5 @@ export default {
/deep/ .el-card__body, .el-main { /deep/ .el-card__body, .el-main {
padding: 10px; padding: 10px;
} }
.avatar_name{
width: 45px;
display: flex;
flex-direction: column;
align-items: center;
position: relative;
margin-right: 5px;
}
.avatar_icon{
position: absolute;
bottom: 16px;
right: -2px;
}
.username{
width: 45px;
padding-top: 2px;
text-align: center;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden
}
</style> </style>

2
flowable-engine-web/src/views/common/process/nodes/CcNode.vue
View File

@ -27,7 +27,7 @@ export default {
computed:{ computed:{
selectUser(){ selectUser(){
return { return {
show: this.config.props.assignedType !== 'ASSIGN_USER', show: this.config.props.shouldAdd,
multiple: true multiple: true
}; };
}, },

35
flowable-engine-web/src/views/common/process/nodes/Node.vue
View File

@ -11,10 +11,8 @@
<div class="node-body-content"> <div class="node-body-content">
<i :class="leftIcon" v-if="leftIcon"></i> <i :class="leftIcon" v-if="leftIcon"></i>
<template v-if="viewer && selectUser.show"> <template v-if="viewer && selectUser.show">
<div class="avatar_button">
<avatar-ellipsis :row="3" v-if="userInfo.length > 0" :user-info="userInfo"/>
<el-button type="primary" icon="el-icon-plus" circle @click="$refs.userPicker.showUserPicker()"/> <el-button type="primary" icon="el-icon-plus" circle @click="$refs.userPicker.showUserPicker()"/>
</div> <avatar-ellipsis :row="3" v-if="userInfo.length > 0" :user-info="userInfo"/>
</template> </template>
<template v-else-if="showAvatar"> <template v-else-if="showAvatar">
<span class="placeholder" v-if="userInfo.length === 0">{{ placeholder }}</span> <span class="placeholder" v-if="userInfo.length === 0">{{ placeholder }}</span>
@ -42,8 +40,8 @@
@insertNode="type => $emit('insertNode', type)"></insert-button> @insertNode="type => $emit('insertNode', type)"></insert-button>
</div> </div>
</div> </div>
<user-picker v-if="selectUser.show" title="请选择系统用户" :multiple="selectUser.multiple" ref="userPicker" <user-picker v-if="selectUser.show" title="请选择系统角色" :multiple="selectUser.multiple" ref="userPicker"
:selected="_userInfo" :v-model="userInfo"
@ok="selectedUser"/> @ok="selectedUser"/>
</div> </div>
</template> </template>
@ -79,7 +77,7 @@ export default {
//节点内容区域文字 //节点内容区域文字
userInfo: { userInfo: {
type: Array, type: Array,
default() { default(){
return [] return []
} }
}, },
@ -131,20 +129,12 @@ export default {
}, },
}, },
data() { data() {
return {} return{}
}, },
computed: { computed: {
viewer() { viewer() {
return this.$store.state.diagramMode === 'viewer' return this.$store.state.diagramMode === 'viewer'
}, },
_userInfo: {
get() {
return this.userInfo
},
set(val) {
this.userInfo = val
}
},
}, },
methods: { methods: {
selectedUser(select) { selectedUser(select) {
@ -157,9 +147,8 @@ export default {
} }
userInfoList.push(userInfo) userInfoList.push(userInfo)
} }
//todo 确认是会包错,邓洁处理 this.userInfo = userInfoList
this._userInfo = userInfoList this.$store.state.selectUserMap.set(this.$store.state.selectedNode.id,userInfoList)
this.$store.state.selectUserMap.set(this.$store.state.selectedNode.id, userInfoList)
}, },
} }
} }
@ -240,16 +229,6 @@ export default {
color: #656363; color: #656363;
font-size: 14px; font-size: 14px;
.avatar_button {
display: flex;
button {
height: 40px;
flex-shrink: 0;
flex-grow: 0;
}
}
i { i {
position: absolute; position: absolute;
top: 55%; top: 55%;

4
flowable-engine-web/src/views/workspace/WorkSpace.vue
View File

@ -120,12 +120,10 @@ export default {
// todo 提交流程测试 // todo 提交流程测试
submitForm(){ submitForm(){
let processInstance = this.$refs.processInstance; let processInstance = this.$refs.processInstance;
let selectUserMap = {}
this.$store.state.selectUserMap.forEach(((value, key) => {selectUserMap[key]=value}))
let paramsData = { let paramsData = {
processDefinitionId: this.selectForm.processDefinitionId, processDefinitionId: this.selectForm.processDefinitionId,
formData: JSON.stringify(processInstance.formData), formData: JSON.stringify(processInstance.formData),
optionalUser: selectUserMap selectUserMap: this.$store.state.selectUserMap
} }
processInstance.validate(valid => { processInstance.validate(valid => {
if (valid) { if (valid) {