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

Compare commits

base: clay:33e09c372701ab7e4de20b030475286fdf47adfe
Branches Tags
clay:master
clay:pro
clay:DJ
clay:chatGPT
clay:master-back
clay:clay
..
compare: clay:493bcbe6f95b21d3f4bb895566e966d24fc3bd46
Branches Tags
clay:pro
clay:master
clay:DJ
clay:chatGPT
clay:master-back
clay:clay

No commits in common. "33e09c372701ab7e4de20b030475286fdf47adfe" and "493bcbe6f95b21d3f4bb895566e966d24fc3bd46" have entirely different histories.
33e09c3727 ... 493bcbe6f9

10 changed files with 126 additions and 446 deletions
Show Stats Expand all files Collapse all files

161
flowable-engine-web/src/components/common/Comment.vue
View File

@ -1,161 +0,0 @@
<template>
<w-dialog :border="false" closeFree width="500px" :title="title" v-model="visible">
<div class="el-textarea">
<el-input
type="textarea"
:rows="4"
maxlength="255"
show-word-limit
placeholder="评论内容"
v-model="textarea">
</el-input>
</div>
<div style="margin: 20px 0">
<el-upload :file-list="fileList" action="#"
:limit="maxSize" with-credentials
:multiple="maxSize > 0"
:data="uploadParams"
list-type="picture-card"
:action="uploadFileUrl"
:headers="headers"
:auto-upload="false"
:on-success="handleUploadSuccess"
:before-upload="beforeUpload">
<i slot="default" class="el-icon-plus"></i>
<div slot="file" slot-scope="{file}" style="width: 65px;height: 65px">
<img style="width: 100%;height: 100%" :src="file.url" alt="">
<label class="el-upload-list__item-status-label">
<i class="el-icon-upload-success el-icon-check"></i>
</label>
<span class="el-upload-list__item-actions">
<span v-if="!disabled" class="el-upload-list__item-delete" @click="handleRemove(file)">
<i class="el-icon-delete"></i>
</span>
</span>
</div>
<div slot="tip" class="el-upload__tip">添加图片 {{ sizeTip }}</div>
</el-upload>
</div>
<el-upload :file-list="attachmentList"
:limit="attachmentMaxSize" with-credentials
:multiple="attachmentMaxSize > 0"
:action="uploadFileUrl"
:headers="headers"
:auto-upload="false"
:on-success="handleUploadSuccess"
:before-upload="beforeUpload"
>
<el-button size="small" round>
<i class="el-icon-paperclip"></i>
<span>选择文件</span>
</el-button>
<div slot="tip" class="el-upload__tip"> 添加附件 {{ attachmentTip }}</div>
</el-upload>
</w-dialog>
</template>
<script>
import {deleteFile} from "@/api/common";
export default {
name: "Comment",
props: {
value: {
type: Array,
default: () => {
return [];
}
},
maxSize: {
type: Number,
default: 10
},
attachmentMaxSize: {
type: Number,
default: 100
}
},
computed: {
sizeTip() {
return this.maxSize > 0 ? `| 每张图不超过${this.maxSize}MB` : "";
},
attachmentTip() {
return this.attachmentMaxSize > 0 ? `| 单个附件不超过${this.attachmentMaxSize}MB` : "";
}
},
created() {
this.fileList = this._value;
console.log(this.value, "images");
},
data() {
return {
visible: false,
title: "添加评论",
fileList: [],
attachmentList: [],
disabled: false,
uploadParams: {},
uploadFileUrl: "http://security-react.mytwins.top/flowable/process/file",
headers: {
authorization: localStorage.getItem("token")
},
textarea:''
};
},
methods: {
handleChange(file, fileList) {
this.fileList = fileList.slice(-3);
},
handleUploadSuccess(res, file) {
if (res.code !== 1000) {
this.$message.error("上传失败");
}
let data = res.data;
this.fileList.push(data);
this.$emit("input", this.fileList);
console.log(res, file, this.fileList);
},
beforeUpload(file) {
const alows = ["image/jpeg", "image/png", "image/gif", "image/jpg"];
if (alows.indexOf(file.type) === -1) {
this.$message.warning("存在不支持的图片格式");
} else if (this.maxSize > 0 && file.size / 1024 / 1024 > this.maxSize) {
this.$message.warning(`单张图片最大不超过 ${this.maxSize}MB`);
} else {
return true;
}
return false;
},
handlePictureCardPreview(file) {
console.log(file, this._value);
},
handleDownload(file) {
console.log(file);
},
handleRemove(file, fileList) {
deleteFile(file.id).then(res => {
this.$message.success("删除成功");
});
}
}
};
</script>
<style lang="less" scoped>
/deep/ .el-upload--picture-card {
width: 65px;
height: 65px;
line-height: 70px;
}
/deep/ .el-upload-list--picture-card{
.is-ready {
width: 65px!important;
height: 65px!important;
}
}
.el-upload-list__item-status-label {
display: block;
}
</style>

215
flowable-engine-web/src/components/common/DeptPicker.vue
View File

@ -1,37 +1,34 @@
<template>
<w-dialog :border="false" closeFree width="600px" @ok="selectConfirm" :title="title" v-model="visible">
<div>
<div class="picker">
<div class="candidate" v-loading="loading">
<div style="padding: 5px 8px;">
<el-input v-model="filterText" style="width: 100%;" size="small"
clearable placeholder="输入关键字进行过滤" prefix-icon="el-icon-search"/>
</div>
<!-- 部门 -->
<el-empty :image-size="100" description="似乎没有数据" v-show="deptList.length === 0"/>
<el-scrollbar style="height:350px">
<el-tree :data="deptList" ref="tree" empty-text="" node-key="value" default-expand-all
:show-checkbox="showCheckbox" check-strictly highlight-current
@check-change="handleCheckChange" @node-click="(node,check)=>handle(node,check)" :filter-node-method="filterNode">
<div class="custom-tree-node" slot-scope="{ node, data }" style="width: 100%">
<i class="el-icon-folder-opened" style="margin-right: 5px"></i>{{ node.label }}
</div>
</el-tree>
</el-scrollbar>
<div class="picker">
<div class="candidate" v-loading="loading">
<div style="padding: 5px 8px;">
<el-input v-model="filterText" style="width: 100%;" size="small"
clearable placeholder="输入关键字进行过滤" prefix-icon="el-icon-search"/>
</div>
<!-- 部门 -->
<el-empty :image-size="100" description="似乎没有数据" v-show="deptList.length === 0"/>
<el-scrollbar style="height:350px">
<el-tree :data="deptList" ref="tree" empty-text="" node-key="value" default-expand-all
:show-checkbox="showCheckbox"
@check="handleCheckChange" :filter-node-method="filterNode">
<span class="custom-tree-node" slot-scope="{ node, data }">
<i class="el-icon-folder-opened" style="margin-right: 5px"></i>{{ node.label }}
</span>
</el-tree>
</el-scrollbar>
</div>
<div class="selected">
<div class="count">
<span>已选 {{ selectList.length }} 项</span>
<span @click="clearSelected">清空</span>
</div>
<div class="org-items" style="height: 350px;">
<el-empty :image-size="100" description="请点击左侧列表选择数据" v-show="selectList.length === 0"/>
<div v-for="(selectItem, selectIndex) in selectList" :key="selectIndex" class="org-item">
<i class="el-icon-folder-opened"></i>
<span>{{ selectItem.label }}</span>
<i class="el-icon-close" @click="noSelected(selectItem)" v-if="showCheckbox===false"></i>
</div>
<div class="selected">
<div class="count">
<span>已选 {{ selectList.length }} 项</span>
<span @click="clearSelected">清空</span>
</div>
<div class="org-items" style="height: 350px;">
<el-empty :image-size="100" description="请点击左侧列表选择数据" v-show="selectList.length === 0"/>
<div v-for="(org, index) in selectList" :key="index" class="org-item">
<i class="el-icon-folder-opened"></i>
<span>{{ org.label }}</span>
</div>
</div>
</div>
@ -44,66 +41,16 @@ import {getDepartmentTree} from "@/api/org";
export default {
name: "departmentPicker",
props: {
value: {
type: Array,
default: () => {
return [];
}
},
multiple: { //是否多选
default: true,
type: Boolean
},
showCheckbox: { //是否显示左侧选择框
default: true,
type: Boolean
}
},
data() {
return {
visible: false,
loading: false,
title: "请选择",
multiple: true,//是否多选
showCheckbox: true,//是否显示左侧选择框
selectList: [],
filterText: "",
deptList: [
{
value: 1,
label: '一级 1',
children: [{
value: 4,
label: '二级 1-1',
children: [{
value: 9,
label: '31'
}, {
value: 10,
label: '三级 1-1-2'
}]
}]
}, {
value: 2,
label: '一级 2',
children: [{
value: 5,
label: '二级 2-1'
}, {
value: 6,
label: '二级 2-2'
}]
}, {
value: 3,
label: '一级 3',
children: [{
value: 7,
label: '二级 3-1'
}, {
value: 8,
label: '二级 3-2'
}]
}
]
deptList: []
};
},
watch: {
@ -114,16 +61,6 @@ export default {
created() {
this.getDepartmentTree();
},
computed: {
_value: {
get() {
return this.value
},
set(val) {
this.$emit("input", val)
}
}
},
methods: {
//获取部门信息
getDepartmentTree() {
@ -141,84 +78,40 @@ export default {
showDeptPicker() {
this.visible = true;
},
/**
* 选中部门
* @param data 选择的每个节点item
* @param checked 是否选中
*/
//选中部门
handleCheckChange(data, checked) {
// 左侧有选择框
if (this.showCheckbox) {
// 左侧有选择框 + 多选
if (this.multiple) {
//不添加重复的数据到右边
for (let i = 0; i < this.selectList.length; i++) {
if (this.selectList[i].value === data.value) {
this.selectList.splice(i, 1);
break;
}
}
// checked= true;
// this.selectList.push(data);
if (checked) {
this.selectList.push(data);
} else if(data==='1') {
this.$refs.tree.setCheckedKeys([]);
this.selectList = [];
} else {
// this.$refs.tree.setCheckedKeys(data);
}
} else {// 左侧有选择框 + 单选
//不添加重复的数据到右边
for (let i = 0; i < this.selectList.length; i++) {
if (this.selectList[i].value === data.value) {
this.selectList.splice(i, 1);
break;
}
}
if (checked) {
this.$refs.tree.setCheckedNodes([data]);
this.selectList = [data];
} else if(data==='1') {
} else {
this.$refs.tree.setCheckedKeys([]);
this.selectList = [];
}
}
}
// this._value = this.selectList
},
}else {// 左侧没有选择框
// 左侧没有选择框 + 多选
if (this.multiple) {
}else {// 左侧没有选择框 + 单选
//左侧没有选择框时,点击tree-item
/**
* 可以点击树节点label,进行选择
* @param node 选择的每个节点item
* @param check checked(checkbox选择框)是否选中
*/
handle(node,check) {
if(this.multiple){
//不添加重复的数据到右边
for (let i = 0; i < this.selectList.length; i++) {
if (this.selectList[i].value === node.value) {
this.selectList.splice(i, 1);
break;
}
}
check.checked=true
this.selectList.push(node);
}else {
check.checked=true
this.selectList=[node];
}
},
//左侧无选择框时,右侧显示×
noSelected(selectItem) {
for (let i = 0; i < this.selectList.length; i++) {
if (this.selectList[i].value === selectItem.value) {
this.selectList.splice(i, 1);
this.$refs.tree.setCheckedKeys(i);
break;
}
}
if (this.showCheckbox) {
// 左侧有选择框 + 单选
if (this.multiple===false) {
this.$refs.tree.setCheckedKeys([]);
}
}
},
@ -229,17 +122,20 @@ export default {
cancelButtonText: "取消",
type: "warning"
}).then(() => {
this.handleCheckChange("1");
if(!this.showCheckbox){
this.selectList=[]
}
this.handleCheckChange("", false);
});
},
//确定按钮
selectConfirm() {
// this.$emit("input", this.selectList)
// this.$emit("dengjie")
// this.$emit("ok", Object.assign([], this.select.map(v => {
// v.avatar = undefined;
// return v;
// })));
// this.visible = false;
// this.recover();
}
}
};
</script>
@ -247,11 +143,10 @@ export default {
<style lang="less" scoped>
@containWidth: 278px;
/deep/ .el-tree-node {
/deep/.el-tree-node {
.is-leaf + .el-checkbox .el-checkbox__inner {
display: inline-block;
}
.el-checkbox .el-checkbox__inner {
display: none;
}
@ -304,13 +199,6 @@ export default {
overflow-y: auto;
height: 350px;
.el-icon-close {
position: absolute;
right: 5px;
cursor: pointer;
font-size: larger;
}
.org-item {
margin: 0 5px;
border-radius: 5px;
@ -318,7 +206,6 @@ export default {
padding: 7px 5px;
display: flex;
align-items: center;
cursor: pointer;
&:hover {

176
flowable-engine-web/src/components/common/Test.vue → flowable-engine-web/src/components/common/OrgPicker.vue
View File

@ -1,43 +1,46 @@
<template>
<w-dialog :border="false" closeFree width="600px" @ok="selectConfirm" :title="title" v-model="visible">
<div>
<div class="picker">
<div class="candidate" v-loading="loading">
<div style="padding: 5px 8px;">
<el-input v-model="filterText" style="width: 100%;" size="small"
clearable placeholder="输入关键字进行过滤" prefix-icon="el-icon-search"/>
</div>
<!-- 部门 -->
<el-empty :image-size="100" description="似乎没有数据" v-show="deptList.length === 0"/>
<el-scrollbar style="height:350px">
<el-tree :data="deptList" ref="tree" empty-text="" node-key="value" default-expand-all
:show-checkbox="showCheckbox" check-strictly highlight-current
@check-change="handleCheckChange" @node-click="(node,check)=>handle(node,check)" :filter-node-method="filterNode">
<div class="custom-tree-node" slot-scope="{ node, data }" style="width: 100%">
<i class="el-icon-folder-opened" style="margin-right: 5px"></i>{{ node.label }}
</div>
</el-tree>
</el-scrollbar>
<!-- <w-dialog :border="false" closeFree width="600px" @ok="selectConfirm" :title="title" v-model="visible">-->
<div>
<div class="picker">
<div class="candidate" v-loading="loading">
<div style="padding: 5px 8px;">
<el-input v-model="filterText" style="width: 100%;" size="small"
clearable placeholder="输入关键字进行过滤" prefix-icon="el-icon-search"/>
</div>
<!-- 部门 -->
<el-empty :image-size="100" description="似乎没有数据" v-show="deptList.length === 0"/>
<el-scrollbar style="height:350px">
<el-tree :data="deptList" ref="tree" empty-text="" node-key="value" default-expand-all
:show-checkbox="showCheckbox"
@check="handleCheckChange" :filter-node-method="filterNode">
<span class="custom-tree-node" slot-scope="{ node, data }">
<i class="el-icon-folder-opened" style="margin-right: 5px"></i>{{ node.label }}
</span>
</el-tree>
</el-scrollbar>
</div>
<div class="selected">
<div class="count">
<span>已选 {{ selectList.length }} 项</span>
<span @click="clearSelected">清空</span>
</div>
<div class="org-items" style="height: 350px;">
<el-empty :image-size="100" description="请点击左侧列表选择数据" v-show="selectList.length === 0"/>
<div v-for="(selectItem, selectIndex) in selectList" :key="selectIndex" class="org-item">
<i class="el-icon-folder-opened"></i>
<span>{{ selectItem.label }}</span>
<i class="el-icon-close" @click="noSelected(selectItem)" v-if="showCheckbox===false"></i>
</div>
<div class="selected">
<div class="count">
<span>已选 {{ selectList.length }} 项</span>
<span @click="clearSelected">清空</span>
</div>
<div class="org-items" style="height: 350px;">
<el-empty :image-size="100" description="请点击左侧列表选择数据" v-show="selectList.length === 0"/>
<div v-for="(org, index) in selectList" :key="index" class="org-item">
<i class="el-icon-folder-opened"></i>
<span>{{ org.label }}</span>
<i class="el-icon-close" @click="noSelected(org)"></i>
</div>
</div>
</div>
</div>
</w-dialog>
</template>
<div slot="footer">
<el-button size="mini" @click="selectConfirm">确认</el-button>
</div>
</div>
<!-- </w-dialog>-->
</template>//
<script>
import {getDepartmentTree} from "@/api/org";
@ -51,20 +54,14 @@ export default {
return [];
}
},
multiple: { //是否多选
default: true,
type: Boolean
},
showCheckbox: { //是否显示左侧选择框
default: true,
type: Boolean
}
},
data() {
return {
visible: false,
loading: false,
title: "请选择",
multiple: true,//是否多选
showCheckbox: true,//是否显示左侧选择框
selectList: [],
filterText: "",
deptList: [
@ -72,35 +69,23 @@ export default {
value: 1,
label: '一级 1',
children: [{
value: 4,
value: 2,
label: '二级 1-1',
children: [{
value: 9,
label: '31'
}, {
value: 10,
label: '三级 1-1-2'
value: 3,
label: '三级 1-1-1'
}]
}]
}, {
value: 2,
value: 4,
label: '一级 2',
children: [{
value: 5,
label: '二级 2-1'
}, {
value: 6,
label: '二级 2-2'
}]
}, {
value: 3,
label: '一级 3',
children: [{
value: 7,
label: '二级 3-1'
}, {
value: 8,
label: '二级 3-2'
label: '二级 2-1',
children: [{
value: 6,
label: '三级 2-1-1'
}]
}]
}
]
@ -143,8 +128,8 @@ export default {
},
/**
* 选中部门
* @param data 选择的每个节点item
* @param checked 是否选中
* @param data
* @param checked
*/
handleCheckChange(data, checked) {
// 左侧有选择框
@ -160,67 +145,39 @@ export default {
}
if (checked) {
this.selectList.push(data);
} else if(data==='1') {
} else {
// this.$refs.tree.setCheckedKeys(data);
this.$refs.tree.setCheckedKeys([]);
this.selectList = [];
}
} else {// 左侧有选择框 + 单选
//不添加重复的数据到右边
for (let i = 0; i < this.selectList.length; i++) {
if (this.selectList[i].value === data.value) {
this.selectList.splice(i, 1);
break;
}
}
if (checked) {
this.$refs.tree.setCheckedNodes([data]);
this.selectList = [data];
} else if(data==='1') {
} else {
this.$refs.tree.setCheckedKeys([]);
this.selectList = [];
}
}
}
// this._value = this.selectList
},
} else {// 左侧没有选择框
// 左侧没有选择框 + 多选
if (this.multiple) {
} else {// 左侧没有选择框 + 单选
//左侧没有选择框时,点击tree-item
/**
* 可以点击树节点label,进行选择
* @param node 选择的每个节点item
* @param check checked(checkbox选择框)是否选中
*/
handle(node,check) {
if(this.multiple){
//不添加重复的数据到右边
for (let i = 0; i < this.selectList.length; i++) {
if (this.selectList[i].value === node.value) {
this.selectList.splice(i, 1);
break;
}
}
check.checked=true
this.selectList.push(node);
}else {
check.checked=true
this.selectList=[node];
}
this._value = this.selectList
},
//左侧无选择框时,右侧显示×
noSelected(selectItem) {
//右侧的×
noSelected(org) {
for (let i = 0; i < this.selectList.length; i++) {
if (this.selectList[i].value === selectItem.value) {
if (this.selectList[i].value === org.value) {
this.selectList.splice(i, 1);
this.$refs.tree.setCheckedKeys(i);
break;
}
}
if (this.showCheckbox) {
// 左侧有选择框 + 单选
if (this.multiple===false) {
this.$refs.tree.setCheckedKeys([]);
}
}
org.selected = false;
},
//清空
clearSelected() {
@ -229,16 +186,13 @@ export default {
cancelButtonText: "取消",
type: "warning"
}).then(() => {
this.handleCheckChange("1");
if(!this.showCheckbox){
this.selectList=[]
}
this.handleCheckChange("", false);
});
},
//确定按钮
selectConfirm() {
// this.$emit("input", this.selectList)
// this.$emit("dengjie")
this.$emit("input", this.selectList)
this.$emit("dengjie")
}
}
};

8
flowable-engine-web/src/views/Index.vue
View File

@ -32,19 +32,19 @@
</div>
<test type="user" ref="orgPicker" :v-model="select" :value="select" @dengjie="dengjie"
@ok="selected"></test>
<org-picker type="user" ref="orgPicker" :v-model="select" :value="select" @dengjie="dengjie"
@ok="selected"></org-picker>
</div>
</template>
<script>
import Test from "@/components/common/Test";
import OrgPicker from "@/components/common/OrgPicker";
export default {
name: "Index",
components: {Test},
components: {OrgPicker},
data() {
return {
select: [],

2
flowable-engine-web/src/views/admin/layout/FormBaseSetting.vue
View File

@ -60,7 +60,7 @@
</template>
<script>
import OrgPicker from "@/components/common/Test";
import OrgPicker from "@/components/common/OrgPicker";
import iconfont from '@/assets/iconfont/iconfont.json'
export default {

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

@ -25,7 +25,7 @@
<script>
import componentMinxins from '../ComponentMinxins'
import OrgPicker from "@/components/common/Test";
import OrgPicker from "@/components/common/OrgPicker";
export default {
mixins: [componentMinxins],

2
flowable-engine-web/src/views/common/process/config/ApprovalNodeConfig.vue
View File

@ -140,7 +140,7 @@
</template>
<script>
import OrgPicker from "@/components/common/Test";
import OrgPicker from "@/components/common/OrgPicker";
import RolePickerMe from "../../../../components/common/RolePickerMe";
import RoleItems from "../RoleItems";
import OrgItems from "../OrgItems";

2
flowable-engine-web/src/views/common/process/config/CcNodeConfig.vue
View File

@ -10,7 +10,7 @@
</template>
<script>
import OrgPicker from "@/components/common/Test";
import OrgPicker from "@/components/common/OrgPicker";
import OrgItems from "../OrgItems";
export default {

2
flowable-engine-web/src/views/common/process/config/ConditionGroupItemConfig.vue
View File

@ -84,7 +84,7 @@
</template>
<script>
import OrgPicker from "@/components/common/Test";
import OrgPicker from "@/components/common/OrgPicker";
import OrgItems from '../OrgItems'
import {ValueType} from '@/views/common/form/ComponentsConfigExport'

2
flowable-engine-web/src/views/common/process/config/RootNodeConfig.vue
View File

@ -8,7 +8,7 @@
</template>
<script>
import OrgPicker from "@/components/common/Test";
import OrgPicker from "@/components/common/OrgPicker";
import OrgItems from "../OrgItems";
export default {