pal关联模型dialog+pal关联组织架构dialog实现筛选
This commit is contained in:
446052889@qq.com
parent
ad8d808eba
commit
9e417c85a7
@ -23,7 +23,7 @@
|
|||||||
<% }%>
|
<% }%>
|
||||||
<script>
|
<script>
|
||||||
<%if (process.env.NODE_ENV === "development") {%>
|
<%if (process.env.NODE_ENV === "development") {%>
|
||||||
var wsId = '4645328c-d20e-4a3c-bcb0-4518c9abdd93';
|
var wsId = '497710ef-5514-4ff1-89af-3054380f7b43';
|
||||||
var teamId = '';
|
var teamId = '';
|
||||||
var levelSelect = [{
|
var levelSelect = [{
|
||||||
value: 1,
|
value: 1,
|
||||||
|
|||||||
@ -0,0 +1 @@
|
|||||||
|
说明：调用aws平台的部门、人员、角色组件
|
||||||
@ -0,0 +1,352 @@
|
|||||||
|
<template>
|
||||||
|
<el-container>
|
||||||
|
<el-dialog
|
||||||
|
id="bpmOrgAddress"
|
||||||
|
:title="title"
|
||||||
|
:visible.sync="dialogVisible"
|
||||||
|
:destroy-on-close=true
|
||||||
|
:width="width"
|
||||||
|
:modal-append-to-body=false
|
||||||
|
:append-to-body=true
|
||||||
|
:close-on-click-modal=false
|
||||||
|
:before-close="handleClose">
|
||||||
|
<template v-if="refresh">
|
||||||
|
<div
|
||||||
|
v-loading="loading"
|
||||||
|
element-loading-text="拼命加载中">
|
||||||
|
<!-- <el-autocomplete-->
|
||||||
|
<!-- v-model="treeSearchKey"-->
|
||||||
|
<!-- size="small"-->
|
||||||
|
<!-- :fetch-suggestions="treeSearch"-->
|
||||||
|
<!-- @select="treeSearchSelect"-->
|
||||||
|
<!-- suffix-icon="el-icon-search"-->
|
||||||
|
<!-- placeholder="快速查询"-->
|
||||||
|
<!-- :trigger-on-focus=false-->
|
||||||
|
<!-- style="width:100%;">-->
|
||||||
|
<!-- <template slot-scope="{ item }">-->
|
||||||
|
<!-- <el-tooltip class="item" placement="bottom">-->
|
||||||
|
<!-- <div slot="content">{{item.pathName}}</div>-->
|
||||||
|
<!-- <span>{{ item.name }}</span>-->
|
||||||
|
<!-- </el-tooltip>-->
|
||||||
|
<!-- </template>-->
|
||||||
|
<!-- </el-autocomplete>-->
|
||||||
|
<div style="height: 300px;overflow: auto;border: 1px solid #f2f2f2;">
|
||||||
|
<div class="tree">
|
||||||
|
<el-tree
|
||||||
|
ref="tree"
|
||||||
|
:props="treeProps"
|
||||||
|
:show-checkbox="multiple"
|
||||||
|
:expand-on-click-node=false
|
||||||
|
:check-strictly=true
|
||||||
|
:highlight-current=true
|
||||||
|
@node-click="openNode"
|
||||||
|
@node-expand="expandNode"
|
||||||
|
@node-collapse="closeNode"
|
||||||
|
node-key="id"
|
||||||
|
lazy
|
||||||
|
:load="loadNode">
|
||||||
|
<span slot-scope="{node, data}">
|
||||||
|
<i class="awsui-iconfont tree-content-icon tree-content-icon-padding" :style="{'color': node.data.icon.color}" v-html="node.data.icon.icon"></i>
|
||||||
|
<span>{{node.label}}</span>
|
||||||
|
</span>
|
||||||
|
</el-tree>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<span slot="footer" class="dialog-footer">
|
||||||
|
<awsui-button class="button-general-color" type="primary" @click="submit">确定</awsui-button>
|
||||||
|
<awsui-button @click="cancel">取消</awsui-button>
|
||||||
|
</span>
|
||||||
|
</el-dialog>
|
||||||
|
</el-container>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import awsuiAxios from "../../../awsuiAxios";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "BpmOrgAddress",
|
||||||
|
props: {
|
||||||
|
visible: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
addressType: {// 地址簿类型，默认部门地址簿，可进行部门department、用户user、角色role组合，逗号分隔
|
||||||
|
type: String,
|
||||||
|
default: 'department'
|
||||||
|
},
|
||||||
|
multiple: {// 是否多选
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
rootDeptId: {// 默认根部门,为空则默认当前人所属单位为根节点
|
||||||
|
type: String,
|
||||||
|
default: ''
|
||||||
|
},
|
||||||
|
highSecurityFilter: {// 地址簿过滤三员用户类型 三员开启模式并且地址簿类型包含用户user时有效，系统管理员sysAdmin、安全保密员secAdmin、安全审计员auditor，逗号分割
|
||||||
|
type: String,
|
||||||
|
default: ''// 例如值为sysAdmin,auditor，则开启三员之后该地址簿不显示系统管理员和安全审计员
|
||||||
|
},
|
||||||
|
title: {// 标题
|
||||||
|
type: String,
|
||||||
|
default: ''
|
||||||
|
},
|
||||||
|
selected: {// 默认选中，比如{'department':[],'user':[],'role':[],'position':[]}，不区分单多选，单选只取第一个值
|
||||||
|
type: Object,
|
||||||
|
default: function () {
|
||||||
|
return {'department':[],'user':[],'role':[],'position':[]}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
refresh: false,
|
||||||
|
dialogVisible: false,
|
||||||
|
loading: false,
|
||||||
|
searchKey: '',
|
||||||
|
treeSearchKey: '',
|
||||||
|
timeout: null,
|
||||||
|
pid: '',
|
||||||
|
width: '500px',
|
||||||
|
treeProps: {
|
||||||
|
label: 'name',
|
||||||
|
isLeaf: 'leaf'
|
||||||
|
}
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
handleClose(done) {
|
||||||
|
this.closeDlalog('cancel');
|
||||||
|
done();
|
||||||
|
},
|
||||||
|
cancel() {
|
||||||
|
this.closeDlalog('cancel');
|
||||||
|
this.dialogVisible = false;
|
||||||
|
},
|
||||||
|
submit() {
|
||||||
|
this.closeDlalog('save');
|
||||||
|
this.dialogVisible = false;
|
||||||
|
},
|
||||||
|
closeDlalog(type) {// 取消/确定之后的关闭
|
||||||
|
if (type == 'save') {
|
||||||
|
let result = [];
|
||||||
|
if (this.multiple) {// 多选
|
||||||
|
result = this.$refs.tree.getCheckedNodes();
|
||||||
|
} else {// 单选
|
||||||
|
const node = this.$refs.tree.getCurrentNode();
|
||||||
|
if (node != null) {
|
||||||
|
result.push(node);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.$emit('getResult', JSON.parse(JSON.stringify(result)));
|
||||||
|
} else {
|
||||||
|
this.$emit('cancel');
|
||||||
|
}
|
||||||
|
// 清空所有数据
|
||||||
|
},
|
||||||
|
handleNodeClick(data) {
|
||||||
|
// console.log(data);
|
||||||
|
},
|
||||||
|
openNode(obj, node, tree) {// 打开一只模型文件
|
||||||
|
|
||||||
|
},
|
||||||
|
treeSearchSelect(item) {
|
||||||
|
this.queryTreeByIdAndPath(item.id, item.path);
|
||||||
|
},
|
||||||
|
treeSearch(key, cb) {
|
||||||
|
const that = this;
|
||||||
|
if (key != undefined && key.trim() != '') {
|
||||||
|
// that.loading = true;
|
||||||
|
const data = {
|
||||||
|
url:'jd',
|
||||||
|
data:{
|
||||||
|
cmd: 'com.actionsoft.apps.coe.pal_repository_tree_component_search',
|
||||||
|
addressType: that.addressType,
|
||||||
|
rootDeptId: that.rootDeptId,
|
||||||
|
name: key
|
||||||
|
}
|
||||||
|
};
|
||||||
|
// 查询数据
|
||||||
|
awsuiAxios.post(data).then(function (ro) {
|
||||||
|
if (ro.result == 'ok') {
|
||||||
|
if (ro.data.length > 0) {
|
||||||
|
clearTimeout(that.timeout);
|
||||||
|
that.timeout = setTimeout(() => {
|
||||||
|
cb(ro.data);
|
||||||
|
}, 3000 * Math.random());
|
||||||
|
} else {
|
||||||
|
clearTimeout(that.timeout);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
clearTimeout(that.timeout);
|
||||||
|
}
|
||||||
|
}).catch(error=>{
|
||||||
|
console.log(error);
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
clearTimeout(that.timeout);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
queryTreeByIdAndPath(id, path) {// 定位展开某节点
|
||||||
|
const that= this;
|
||||||
|
const tree = that.$refs.tree;
|
||||||
|
// 分隔字符串
|
||||||
|
const pathArr = path.split(',');
|
||||||
|
let index = 1;
|
||||||
|
for (let i = 0; i < pathArr.length; i++) {// 依次展开
|
||||||
|
if (i > 0) {
|
||||||
|
if (tree.getNode(pathArr[i-1]) != null) {
|
||||||
|
setTimeout(that._expandNode(tree, pathArr[i-1]), index * 300);
|
||||||
|
index++;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
setTimeout(function() {
|
||||||
|
if (tree.getNode(id) != null) {
|
||||||
|
tree.setCurrentKey(id);
|
||||||
|
}
|
||||||
|
}, index * 300);
|
||||||
|
},
|
||||||
|
_expandNode(tree, id) {
|
||||||
|
return function() {
|
||||||
|
tree.getNode(id).expand();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
loadNode(node, resolve) {// `动态`加载
|
||||||
|
const that = this;
|
||||||
|
that.loading = true;
|
||||||
|
const data = {
|
||||||
|
url:'jd',
|
||||||
|
data:{
|
||||||
|
cmd: 'com.actionsoft.apps.coe.pal_bpm_org_address_component_subjson',
|
||||||
|
addressType: that.addressType,
|
||||||
|
pid: '',
|
||||||
|
highSecurityFilter: that.highSecurityFilter
|
||||||
|
}
|
||||||
|
};
|
||||||
|
if (node.level === 0) {
|
||||||
|
// 获取根目录
|
||||||
|
data.data.pid = that.pid;
|
||||||
|
data.data.parentType = '';
|
||||||
|
} else {
|
||||||
|
// 获取其他目录
|
||||||
|
data.data.pid = node.data.id;
|
||||||
|
data.data.parentType = node.data.type;
|
||||||
|
}
|
||||||
|
// 查询数据
|
||||||
|
awsuiAxios.post(data).then(function (ro) {
|
||||||
|
// 设置是否可选中
|
||||||
|
if (that.multiple) {// 多选
|
||||||
|
const isDept = that.addressType.indexOf('department') > -1;
|
||||||
|
const isUser = that.addressType.indexOf('user') > -1;
|
||||||
|
const isRole = that.addressType.indexOf('role') > -1;
|
||||||
|
const isPosition = that.addressType.indexOf('position') > -1;
|
||||||
|
for (let i = 0; i < ro.data.length; i++) {
|
||||||
|
const curr = ro.data[i];
|
||||||
|
if (curr.type == 'company' || curr.type == 'roleRoot' || curr.type == 'roleGroup' || curr.type == 'positionRoot' || curr.type == 'positionGroup') {
|
||||||
|
curr.disabled = true;
|
||||||
|
} else {
|
||||||
|
if (isDept && curr.type == 'department') curr.disabled = false;
|
||||||
|
if (!isDept && curr.type == 'department') curr.disabled = true;
|
||||||
|
if (isUser && curr.type == 'user') curr.disabled = false;
|
||||||
|
if (!isUser && curr.type == 'user') curr.disabled = true;
|
||||||
|
if (isRole && curr.type == 'role') curr.disabled = false;
|
||||||
|
if (!isRole && curr.type == 'role') curr.disabled = true;
|
||||||
|
if (isPosition && curr.type == 'position') curr.disabled = false;
|
||||||
|
if (!isPosition && curr.type == 'position') curr.disabled = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
resolve(ro.data);
|
||||||
|
that.loading = false;
|
||||||
|
if (node.level == 0 && ro.data.length > 0) {
|
||||||
|
const tree = that.$refs.tree;
|
||||||
|
tree.getNode(ro.data[0].id).expand();
|
||||||
|
setTimeout(function(){
|
||||||
|
const childNode = tree.getNode(ro.data[0].id).childNodes[0];
|
||||||
|
if (childNode != null) {
|
||||||
|
childNode.expand();
|
||||||
|
}
|
||||||
|
}, 500);
|
||||||
|
}
|
||||||
|
}).catch(error=>{
|
||||||
|
console.log(error);
|
||||||
|
})
|
||||||
|
},
|
||||||
|
expandNode(obj, node, tree) {// 展开节点
|
||||||
|
|
||||||
|
},
|
||||||
|
closeNode(obj, node, tree) {// 关闭时清空，下次展开重新请求动态加载
|
||||||
|
node.childNodes = [];
|
||||||
|
node.loaded = false;
|
||||||
|
},
|
||||||
|
refreshNode(id) {// 刷新当前选中节点的子节点，即关闭当前节点后重新打开，会执行loadNode进行自动加载
|
||||||
|
if (id == undefined) {// 未指定节点，默认刷新当前选中
|
||||||
|
const nodeData = this.$refs.tree.getCurrentNode();
|
||||||
|
if (nodeData != null) {
|
||||||
|
if (this.$refs.tree.store.nodesMap[nodeData.id] != undefined) {
|
||||||
|
this.$refs.tree.store.nodesMap[nodeData.id].expanded = false;
|
||||||
|
}
|
||||||
|
const node = this.$refs.tree.getNode(nodeData.id);
|
||||||
|
this.closeNode(null, node, null);
|
||||||
|
node.expand();
|
||||||
|
}
|
||||||
|
} else {// 指定刷新某节点
|
||||||
|
if (this.$refs.tree.store.nodesMap[id] != undefined) {
|
||||||
|
this.$refs.tree.store.nodesMap[id].expanded = false;
|
||||||
|
}
|
||||||
|
const node = this.$refs.tree.getNode(id);
|
||||||
|
if (node != null) {
|
||||||
|
this.closeNode(null, node, null);
|
||||||
|
node.expand();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
visible(val) {
|
||||||
|
this.dialogVisible = val;
|
||||||
|
if (val) {// 打开
|
||||||
|
if (this.addressType.indexOf('department') > 0) {
|
||||||
|
this.pid = this.rootDeptId;
|
||||||
|
}
|
||||||
|
this.refresh = true;
|
||||||
|
} else {// 关闭
|
||||||
|
this.refresh = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
#bpmOrgAddress >>> .el-dialog__body {
|
||||||
|
padding: 10px 20px;
|
||||||
|
color: #606266;
|
||||||
|
font-size: 14px;
|
||||||
|
word-break: break-all;
|
||||||
|
}
|
||||||
|
#bpmOrgAddress >>> .el-input__inner {
|
||||||
|
border-radius: 0px;
|
||||||
|
}
|
||||||
|
#bpmOrgAddress >>> .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
|
||||||
|
background-color: #F5F7FA;
|
||||||
|
color: #4E7FF9;
|
||||||
|
}
|
||||||
|
#bpmOrgAddress >>> .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content .awsui-iconfont {
|
||||||
|
color: #4E7FF9 !important;
|
||||||
|
}
|
||||||
|
/*#bpmOrgAddress >>> .el-tree .el-tree-node>.el-tree-node__children{*/
|
||||||
|
/* overflow: visible;*/
|
||||||
|
/*}*/
|
||||||
|
.tree{
|
||||||
|
overflow: auto;
|
||||||
|
width:458px;
|
||||||
|
height: 300px;
|
||||||
|
}
|
||||||
|
#bpmOrgAddress >>> .el-tree {
|
||||||
|
min-width: 100%;
|
||||||
|
display:inline-block !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,7 @@
|
|||||||
|
import BPMOrgAddress from './component'
|
||||||
|
|
||||||
|
BPMOrgAddress.install = function(Vue) {
|
||||||
|
Vue.component(BPMOrgAddress.name, BPMOrgAddress);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default BPMOrgAddress;
|
||||||
@ -0,0 +1 @@
|
|||||||
|
说明：PAL模型树组件
|
||||||
@ -0,0 +1,338 @@
|
|||||||
|
<template>
|
||||||
|
<el-container>
|
||||||
|
<el-dialog
|
||||||
|
id="palRepositoryTree"
|
||||||
|
:title="title"
|
||||||
|
:visible.sync="dialogVisible"
|
||||||
|
:destroy-on-close=true
|
||||||
|
:width="width"
|
||||||
|
:modal-append-to-body=false
|
||||||
|
:append-to-body=true
|
||||||
|
:close-on-click-modal=false
|
||||||
|
:before-close="handleClose">
|
||||||
|
<template v-if="refresh">
|
||||||
|
<div
|
||||||
|
v-loading="loading"
|
||||||
|
element-loading-text="拼命加载中">
|
||||||
|
<el-autocomplete
|
||||||
|
v-model="treeSearchKey"
|
||||||
|
size="small"
|
||||||
|
:fetch-suggestions="treeSearch"
|
||||||
|
@select="treeSearchSelect"
|
||||||
|
suffix-icon="el-icon-search"
|
||||||
|
placeholder="快速查询"
|
||||||
|
:trigger-on-focus=false
|
||||||
|
style="width:100%;"
|
||||||
|
>
|
||||||
|
<template slot-scope="{ item }">
|
||||||
|
<el-tooltip class="item" placement="bottom-start">
|
||||||
|
<div slot="content">{{item.pathName}}</div>
|
||||||
|
<span>{{ item.name }}</span>
|
||||||
|
</el-tooltip>
|
||||||
|
</template>
|
||||||
|
</el-autocomplete>
|
||||||
|
<div style="height: 300px;overflow: auto;border: 1px solid #f2f2f2;">
|
||||||
|
<div class="tree">
|
||||||
|
<el-tree
|
||||||
|
ref="tree"
|
||||||
|
:props="treeProps"
|
||||||
|
:expand-on-click-node=false
|
||||||
|
:highlight-current=true
|
||||||
|
@node-click="openNode"
|
||||||
|
@node-expand="expandNode"
|
||||||
|
@node-collapse="closeNode"
|
||||||
|
:show-checkbox=multiple
|
||||||
|
node-key="id"
|
||||||
|
lazy
|
||||||
|
:load="loadNode">
|
||||||
|
<span slot-scope="{node, data}">
|
||||||
|
<i class="awsui-iconfont tree-content-icon tree-content-icon-padding" :style="{'color': node.data.icon.color}" v-html="node.data.icon.icon"></i>
|
||||||
|
<span>{{node.label}}</span>
|
||||||
|
</span>
|
||||||
|
</el-tree>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<span slot="footer" class="dialog-footer">
|
||||||
|
<awsui-button class="button-general-color" type="primary" @click="submit">确定</awsui-button>
|
||||||
|
<awsui-button @click="cancel">取消</awsui-button>
|
||||||
|
</span>
|
||||||
|
</el-dialog>
|
||||||
|
</el-container>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import awsuiAxios from "../../../awsuiAxios";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "PALRepositoryTree",
|
||||||
|
props: {
|
||||||
|
visible: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
wsId: {// 资产库ID
|
||||||
|
type: String,
|
||||||
|
default: '',
|
||||||
|
required: true
|
||||||
|
},
|
||||||
|
teamId: {// 小组ID
|
||||||
|
type: String,
|
||||||
|
default: ''
|
||||||
|
},
|
||||||
|
categorys: {// 建模大类,多个则逗号分隔
|
||||||
|
type: String,
|
||||||
|
default: ''
|
||||||
|
},
|
||||||
|
rootId: {// 父节点，为空则查询根节点
|
||||||
|
type: String,
|
||||||
|
default: ''
|
||||||
|
},
|
||||||
|
multiple: {// 是否多选
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
title: {// 标题
|
||||||
|
type: String,
|
||||||
|
default: '请选择'
|
||||||
|
},
|
||||||
|
// width: {// 宽度
|
||||||
|
// type: String,
|
||||||
|
// default: '500px'
|
||||||
|
// },
|
||||||
|
selected: {// 默认选中，比如[]，不区分单多选，单选只取第一个值
|
||||||
|
type: Array,
|
||||||
|
default: function () {
|
||||||
|
return []
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
refresh: false,
|
||||||
|
dialogVisible: false,
|
||||||
|
loading: false,
|
||||||
|
searchKey: '',
|
||||||
|
treeSearchKey: '',
|
||||||
|
timeout: null,
|
||||||
|
pid: '',
|
||||||
|
width: '500px',
|
||||||
|
treeProps: {
|
||||||
|
label: 'name',
|
||||||
|
isLeaf: 'leaf'
|
||||||
|
}
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
handleClose(done) {
|
||||||
|
this.closeDlalog('cancel');
|
||||||
|
done();
|
||||||
|
},
|
||||||
|
cancel() {
|
||||||
|
this.closeDlalog('cancel');
|
||||||
|
this.dialogVisible = false;
|
||||||
|
},
|
||||||
|
submit() {
|
||||||
|
this.closeDlalog('save');
|
||||||
|
this.dialogVisible = false;
|
||||||
|
},
|
||||||
|
closeDlalog(type) {// 取消/确定之后的关闭
|
||||||
|
if (type == 'save') {
|
||||||
|
let result = [];
|
||||||
|
if (this.checkbox) {// 多选
|
||||||
|
result = this.$refs.tree.getCheckedNodes();
|
||||||
|
} else {// 单选
|
||||||
|
const node = this.$refs.tree.getCurrentNode();
|
||||||
|
if (node != null) {
|
||||||
|
result.push(node);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.$emit('getResult', result);
|
||||||
|
} else {
|
||||||
|
this.$emit('cancel');
|
||||||
|
}
|
||||||
|
// 清空所有数据
|
||||||
|
},
|
||||||
|
handleNodeClick(data) {
|
||||||
|
console.log(data);
|
||||||
|
},
|
||||||
|
openNode(obj, node, tree) {// 打开一只模型文件
|
||||||
|
|
||||||
|
},
|
||||||
|
treeSearchSelect(item) {
|
||||||
|
this.queryTreeByIdAndPath(item.id, item.versionId, item.path);
|
||||||
|
},
|
||||||
|
treeSearch(key, cb) {
|
||||||
|
const that = this;
|
||||||
|
if (key != undefined && key.trim() != '') {
|
||||||
|
// that.loading = true;
|
||||||
|
const data = {
|
||||||
|
url:'jd',
|
||||||
|
data:{
|
||||||
|
cmd: 'com.actionsoft.apps.coe.pal_repository_tree_component_search',
|
||||||
|
wsId: that.wsId,
|
||||||
|
teamId: that.teamId,
|
||||||
|
categorys: that.categorys,
|
||||||
|
rootId: that.rootId,
|
||||||
|
name: key
|
||||||
|
}
|
||||||
|
};
|
||||||
|
// 查询数据
|
||||||
|
awsuiAxios.post(data).then(function (ro) {
|
||||||
|
if (ro.result == 'ok') {
|
||||||
|
if (ro.data.length > 0) {
|
||||||
|
clearTimeout(that.timeout);
|
||||||
|
that.timeout = setTimeout(() => {
|
||||||
|
cb(ro.data);
|
||||||
|
}, 3000 * Math.random());
|
||||||
|
} else {
|
||||||
|
clearTimeout(that.timeout);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
clearTimeout(that.timeout);
|
||||||
|
}
|
||||||
|
}).catch(error=>{
|
||||||
|
console.log(error);
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
clearTimeout(that.timeout);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
queryTreeByIdAndPath(id, versionId, path) {// 定位展开某节点
|
||||||
|
const that= this;
|
||||||
|
const tree = that.$refs.tree;
|
||||||
|
// 分隔字符串
|
||||||
|
const pathArr = path.split(',');
|
||||||
|
let index = 1;
|
||||||
|
for (let i = 0; i < pathArr.length; i++) {// 依次展开
|
||||||
|
if (i > 0) {
|
||||||
|
if (tree.getNode(pathArr[i-1]) != null) {
|
||||||
|
setTimeout(that._expandNode(tree, pathArr[i-1]), index * 300);
|
||||||
|
index++;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
setTimeout(function() {
|
||||||
|
if (tree.getNode(versionId) != null) {
|
||||||
|
tree.setCurrentKey(versionId);
|
||||||
|
}
|
||||||
|
}, index * 300);
|
||||||
|
},
|
||||||
|
_expandNode(tree, versionId) {
|
||||||
|
return function() {
|
||||||
|
tree.getNode(versionId).expand();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
loadNode(node, resolve) {// `动态`加载
|
||||||
|
const that = this;
|
||||||
|
that.loading = true;
|
||||||
|
const data = {
|
||||||
|
url:'jd',
|
||||||
|
data:{
|
||||||
|
cmd: 'com.actionsoft.apps.coe.pal_repository_tree_component_subjson',
|
||||||
|
wsId: that.wsId,
|
||||||
|
teamId: that.teamId,
|
||||||
|
categorys: that.categorys,
|
||||||
|
pid: ''
|
||||||
|
}
|
||||||
|
};
|
||||||
|
if (node.level === 0) {
|
||||||
|
// 获取根目录
|
||||||
|
data.data.pid = that.pid;
|
||||||
|
} else {
|
||||||
|
// 获取其他目录
|
||||||
|
data.data.pid = node.data.id;
|
||||||
|
}
|
||||||
|
// 查询数据
|
||||||
|
awsuiAxios.post(data).then(function (ro) {
|
||||||
|
resolve(ro.data);
|
||||||
|
that.loading = false;
|
||||||
|
if (node.level == 0 && ro.data.length > 0) {
|
||||||
|
const tree = that.$refs.tree;
|
||||||
|
tree.getNode(ro.data[0].id).expand();
|
||||||
|
setTimeout(function(){
|
||||||
|
const childNode = tree.getNode(ro.data[0].id).childNodes[0];
|
||||||
|
if (childNode != null) {
|
||||||
|
childNode.expand();
|
||||||
|
}
|
||||||
|
}, 500);
|
||||||
|
}
|
||||||
|
}).catch(error=>{
|
||||||
|
console.log(error);
|
||||||
|
})
|
||||||
|
},
|
||||||
|
expandNode(obj, node, tree) {// 展开节点
|
||||||
|
|
||||||
|
},
|
||||||
|
closeNode(obj, node, tree) {// 关闭时清空，下次展开重新请求动态加载
|
||||||
|
node.childNodes = [];
|
||||||
|
node.loaded = false;
|
||||||
|
},
|
||||||
|
refreshNode(id) {// 刷新当前选中节点的子节点，即关闭当前节点后重新打开，会执行loadNode进行自动加载
|
||||||
|
if (id == undefined) {// 未指定节点，默认刷新当前选中
|
||||||
|
const nodeData = this.$refs.tree.getCurrentNode();
|
||||||
|
if (nodeData != null) {
|
||||||
|
if (this.$refs.tree.store.nodesMap[nodeData.id] != undefined) {
|
||||||
|
this.$refs.tree.store.nodesMap[nodeData.id].expanded = false;
|
||||||
|
}
|
||||||
|
const node = this.$refs.tree.getNode(nodeData.id);
|
||||||
|
this.closeNode(null, node, null);
|
||||||
|
node.expand();
|
||||||
|
}
|
||||||
|
} else {// 指定刷新某节点
|
||||||
|
if (this.$refs.tree.store.nodesMap[id] != undefined) {
|
||||||
|
this.$refs.tree.store.nodesMap[id].expanded = false;
|
||||||
|
}
|
||||||
|
const node = this.$refs.tree.getNode(id);
|
||||||
|
if (node != null) {
|
||||||
|
this.closeNode(null, node, null);
|
||||||
|
node.expand();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
visible(val) {
|
||||||
|
this.dialogVisible = val;
|
||||||
|
if (val) {// 打开
|
||||||
|
this.pid = this.rootId;
|
||||||
|
this.refresh = true;
|
||||||
|
} else {// 关闭
|
||||||
|
this.refresh = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
#palRepositoryTree >>> .el-dialog__body {
|
||||||
|
padding: 10px 20px;
|
||||||
|
color: #606266;
|
||||||
|
font-size: 14px;
|
||||||
|
word-break: break-all;
|
||||||
|
}
|
||||||
|
#palRepositoryTree >>> .el-input__inner {
|
||||||
|
border-radius: 0px;
|
||||||
|
}
|
||||||
|
#palRepositoryTree >>> .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
|
||||||
|
background-color: #F5F7FA;
|
||||||
|
color: #4E7FF9;
|
||||||
|
}
|
||||||
|
#palRepositoryTree >>> .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content .awsui-iconfont {
|
||||||
|
color: #4E7FF9 !important;
|
||||||
|
}
|
||||||
|
/*#palRepositoryTree >>> .el-tree .el-tree-node>.el-tree-node__children{*/
|
||||||
|
/* overflow: visible;*/
|
||||||
|
/*}*/
|
||||||
|
.tree{
|
||||||
|
overflow: auto;
|
||||||
|
width:458px;
|
||||||
|
height: 300px;
|
||||||
|
}
|
||||||
|
#palRepositoryTree >>> .el-tree {
|
||||||
|
min-width: 100%;
|
||||||
|
display:inline-block !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,7 @@
|
|||||||
|
import PALRepositoryTree from './component'
|
||||||
|
|
||||||
|
PALRepositoryTree.install = function(Vue) {
|
||||||
|
Vue.component(PALRepositoryTree.name, PALRepositoryTree);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default PALRepositoryTree;
|
||||||
@ -0,0 +1 @@
|
|||||||
|
说明：调用pal的组织、数据、控制等关联属性，包括前后置流程
|
||||||
@ -0,0 +1,975 @@
|
|||||||
|
<template>
|
||||||
|
<el-container>
|
||||||
|
<el-dialog
|
||||||
|
id="palRelationAddress"
|
||||||
|
:title="title"
|
||||||
|
:visible.sync="dialogVisible"
|
||||||
|
width="800px"
|
||||||
|
:modal-append-to-body=false
|
||||||
|
:destroy-on-close=true
|
||||||
|
:append-to-body=true
|
||||||
|
:close-on-click-modal=false
|
||||||
|
:before-close="handleClose">
|
||||||
|
<template>
|
||||||
|
<div v-if="dialogVisible" style="width:100%; height: 400px; border:1px solid #f2f2f2;">
|
||||||
|
<div class="div-left" :style="{'width': (relationType == 'file' ? '373px' : '249px')}">
|
||||||
|
<div style="width: 100%;height: 32px;">
|
||||||
|
<el-autocomplete
|
||||||
|
v-model="treeSearchKey"
|
||||||
|
size="small"
|
||||||
|
:fetch-suggestions="treeSearch"
|
||||||
|
@select="treeSearchSelect"
|
||||||
|
suffix-icon="el-icon-search"
|
||||||
|
placeholder="快速查询"
|
||||||
|
:trigger-on-focus=false
|
||||||
|
:style="{'width': (relationType == 'file' ? '373px' : '249px')}"
|
||||||
|
>
|
||||||
|
<template slot-scope="{ item }">
|
||||||
|
<el-tooltip class="item" placement="bottom-start">
|
||||||
|
<div slot="content">{{item.pathName}}</div>
|
||||||
|
<span>{{ item.name }}</span>
|
||||||
|
</el-tooltip>
|
||||||
|
</template>
|
||||||
|
</el-autocomplete>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<div style="height: 368px;overflow: auto;">
|
||||||
|
<div style="margin: 0px;">
|
||||||
|
<el-tree
|
||||||
|
ref="tree"
|
||||||
|
empty-text="无数据"
|
||||||
|
:expand-on-click-node=false
|
||||||
|
:props="treeProps"
|
||||||
|
:show-checkbox="isTreeCheckbox"
|
||||||
|
:check-strictly=true
|
||||||
|
:highlight-current=true
|
||||||
|
@node-expand="expandNode"
|
||||||
|
@node-collapse="closeNode"
|
||||||
|
@check-change="handleNodeCheckChange"
|
||||||
|
node-key="id"
|
||||||
|
lazy
|
||||||
|
:load="loadNode"
|
||||||
|
@node-click="handleNodeClick">
|
||||||
|
<span slot-scope="{node, data}">
|
||||||
|
<i class="awsui-iconfont tree-content-icon tree-content-icon-padding" :style="{'color': node.data.icon.color}" v-html="node.data.icon.icon"></i>
|
||||||
|
<span>{{node.label}}</span>
|
||||||
|
</span>
|
||||||
|
</el-tree>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div v-if="relationType != 'file'" class="div-middle">
|
||||||
|
<div style="width: 100%;height: 32px;">
|
||||||
|
<el-input
|
||||||
|
size="small"
|
||||||
|
placeholder="快速查询"
|
||||||
|
suffix-icon="el-icon-search"
|
||||||
|
v-model="shapeSearchKey"
|
||||||
|
@input="shapeSearch"
|
||||||
|
width="249px">
|
||||||
|
</el-input>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<div style="height: 368px;overflow: auto;">
|
||||||
|
<div style="margin: 0px;">
|
||||||
|
<template v-if="multiple">
|
||||||
|
<el-checkbox-group style="margin: 5px 0px 5px 5px;" v-model="shapeChecked" @change="handleChangeCheckShape">
|
||||||
|
<el-checkbox class="checkbox-item" v-for="item in shapeData" :label="item.id" :key="item.id" :disabled="item.isDisabled">{{item.name}}</el-checkbox>
|
||||||
|
</el-checkbox-group>
|
||||||
|
</template>
|
||||||
|
<template v-else>
|
||||||
|
<el-radio-group style="margin: 5px 0px 5px 5px;" v-model="shapeSelected" @change="handleChangeRadioShape">
|
||||||
|
<el-radio class="redio-item" v-for="item in shapeData" :label="item.id" :key="item.id" :disabled="item.isDisabled">{{item.name}}</el-radio>
|
||||||
|
</el-radio-group>
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="div-right" :style="{'width': (relationType == 'file' ? '373px' : '249px')}">
|
||||||
|
<div style="height: 100%;">
|
||||||
|
<template>
|
||||||
|
<el-table
|
||||||
|
:data="tableData"
|
||||||
|
:show-header=false
|
||||||
|
empty-text="请在左侧选择数据"
|
||||||
|
size="mini"
|
||||||
|
height="400px"
|
||||||
|
style="width: 100%">
|
||||||
|
<el-table-column
|
||||||
|
prop="name"
|
||||||
|
label="名称">
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="address"
|
||||||
|
label="操作"
|
||||||
|
width="40">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<div class="icon-delete-display">
|
||||||
|
<i class="iconfont" style="cursor: pointer;" @click="remove(scope.row.id)"></i>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<span slot="footer" class="dialog-footer">
|
||||||
|
<awsui-button class="button-general-color" type="primary" @click="submit">确定</awsui-button>
|
||||||
|
<awsui-button @click="cancel">取消</awsui-button>
|
||||||
|
</span>
|
||||||
|
</el-dialog>
|
||||||
|
</el-container>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import awsuiAxios from "../../../awsuiAxios";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "PalRelationAddress",
|
||||||
|
props: {
|
||||||
|
visible: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
relationType: {// 关联组件类型，shape/file，关联形状/文件，默认形状
|
||||||
|
type: String,
|
||||||
|
default: 'shape'
|
||||||
|
},
|
||||||
|
multiple: {// 选值类型，单选single，多选multiple，默认单选
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
title: {// 标题
|
||||||
|
type: String,
|
||||||
|
default: ''
|
||||||
|
},
|
||||||
|
selectFileId: {// 选择的文件id，多个以逗号分隔
|
||||||
|
type: String,
|
||||||
|
default: ''
|
||||||
|
},
|
||||||
|
selectShapeId: {// 选择的形状id，多个以逗号分隔
|
||||||
|
type: String,
|
||||||
|
default: ''
|
||||||
|
},
|
||||||
|
wsId: {// 资产库ID
|
||||||
|
type: String,
|
||||||
|
default: '',
|
||||||
|
required: true
|
||||||
|
},
|
||||||
|
teamId: {// 小组ID
|
||||||
|
type: String,
|
||||||
|
default: ''
|
||||||
|
},
|
||||||
|
categorys: {// 建模大类,多个则逗号分隔
|
||||||
|
type: String,
|
||||||
|
default: ''
|
||||||
|
},
|
||||||
|
methods: {// 建模分类，多个则逗号分隔，空值默认可选所有建模方法数据，非空则只能选择范围内的数据，数据显示不控制
|
||||||
|
type: String,
|
||||||
|
default: ''
|
||||||
|
},
|
||||||
|
rootId: {// 指定根节点，为空则查询根节点
|
||||||
|
type: String,
|
||||||
|
default: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
dialogVisible: false,
|
||||||
|
pid: '',
|
||||||
|
shapeSearchKey: '',
|
||||||
|
shapeChecked: [],
|
||||||
|
shapeSelected: '',
|
||||||
|
shapeRecords: {},
|
||||||
|
treeProps: {
|
||||||
|
label: 'name',
|
||||||
|
isLeaf: 'leaf'
|
||||||
|
},
|
||||||
|
tableData: [],
|
||||||
|
shapeData: [],
|
||||||
|
shapeTempData: [],
|
||||||
|
treeSearchKey: '',
|
||||||
|
timeout: null,
|
||||||
|
result: [],// [{id:xxx,versionId:xxx,name:xxxx,children:[{shapeId:xxx,name:xxx},{shapeId:xxx,name:xxx}]}]
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
isTreeCheckbox() {
|
||||||
|
if(this.relationType == 'file' && this.multiple) {
|
||||||
|
return true
|
||||||
|
} else if(this.relationType == 'shapeAndFile') {
|
||||||
|
return true
|
||||||
|
} else {
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
clearAllParam() {
|
||||||
|
this.pid = '';
|
||||||
|
this.shapeSearchKey = '';
|
||||||
|
this.shapeChecked = [];
|
||||||
|
this.shapeSelected = '';
|
||||||
|
this.shapeRecords = {};
|
||||||
|
this.tableData = [];
|
||||||
|
this.shapeData = [];
|
||||||
|
this.shapeTempData = [];
|
||||||
|
this.treeSearchKey = '';
|
||||||
|
this.timeout = null;
|
||||||
|
this.result = [];
|
||||||
|
},
|
||||||
|
shapeSearch() {// 形状搜索
|
||||||
|
if (this.shapeSearchKey && this.shapeSearchKey.trim() != '') {
|
||||||
|
const key = this.shapeSearchKey.trim().toLocaleLowerCase();
|
||||||
|
const shapeData = [];
|
||||||
|
for (let i = 0; i < this.shapeTempData.length; i++) {
|
||||||
|
const shape = this.shapeTempData[i];
|
||||||
|
if (shape.name != '') {
|
||||||
|
let name = (shape.name + '').toLocaleLowerCase();
|
||||||
|
if (name.indexOf(key) != -1) {
|
||||||
|
shapeData.push(JSON.parse(JSON.stringify(shape)));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.shapeData = shapeData;
|
||||||
|
} else {
|
||||||
|
this.shapeData = JSON.parse(JSON.stringify(this.shapeTempData));
|
||||||
|
}
|
||||||
|
},
|
||||||
|
treeSearchSelect(item) {
|
||||||
|
this.queryTreeByIdAndPath(item.id, item.path);
|
||||||
|
},
|
||||||
|
treeSearch(key, cb) {
|
||||||
|
const that = this;
|
||||||
|
if (key != undefined && key.trim() != '') {
|
||||||
|
const data = {
|
||||||
|
url:'jd',
|
||||||
|
data:{
|
||||||
|
cmd: 'com.actionsoft.apps.coe.pal_repository_tree_component_search',
|
||||||
|
wsId: that.wsId,
|
||||||
|
teamId: that.teamId,
|
||||||
|
categorys: that.categorys,
|
||||||
|
rootId: that.rootId,
|
||||||
|
name: key
|
||||||
|
}
|
||||||
|
};
|
||||||
|
// 查询数据
|
||||||
|
awsuiAxios.post(data).then(function (ro) {
|
||||||
|
if (ro.result == 'ok') {
|
||||||
|
if (ro.data.length > 0) {
|
||||||
|
clearTimeout(that.timeout);
|
||||||
|
that.timeout = setTimeout(() => {
|
||||||
|
cb(ro.data);
|
||||||
|
}, 3000 * Math.random());
|
||||||
|
} else {
|
||||||
|
clearTimeout(that.timeout);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
clearTimeout(that.timeout);
|
||||||
|
}
|
||||||
|
}).catch(error=>{
|
||||||
|
console.log(error);
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
clearTimeout(that.timeout);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
queryTreeByIdAndPath(id, path) {// 定位展开某节点
|
||||||
|
const that= this;
|
||||||
|
const tree = that.$refs.tree;
|
||||||
|
// 分隔字符串
|
||||||
|
const pathArr = path.split(',');
|
||||||
|
let index = 1;
|
||||||
|
for (let i = 0; i < pathArr.length; i++) {// 依次展开
|
||||||
|
if (i > 0) {
|
||||||
|
if (tree.getNode(pathArr[i-1]) != null) {
|
||||||
|
setTimeout(that._expandNode(tree, pathArr[i-1]), index * 300);
|
||||||
|
index++;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
setTimeout(function() {
|
||||||
|
if (tree.getNode(id) != null) {
|
||||||
|
tree.setCurrentKey(id);
|
||||||
|
}
|
||||||
|
}, index * 300);
|
||||||
|
},
|
||||||
|
_expandNode(tree, id) {
|
||||||
|
return function() {
|
||||||
|
tree.getNode(id).expand();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
loadNode(node, resolve) {// `动态`加载
|
||||||
|
const that = this;
|
||||||
|
// that.loading = true;
|
||||||
|
const data = {
|
||||||
|
url:'jd',
|
||||||
|
data:{
|
||||||
|
cmd: 'com.actionsoft.apps.coe.pal_repository_tree_component_subjson',
|
||||||
|
wsId: that.wsId,
|
||||||
|
teamId: that.teamId,
|
||||||
|
categorys: that.categorys,
|
||||||
|
pid: ''
|
||||||
|
}
|
||||||
|
};
|
||||||
|
if (node.level === 0) {
|
||||||
|
// 获取根目录
|
||||||
|
data.data.pid = that.pid;
|
||||||
|
} else {
|
||||||
|
// 获取其他目录
|
||||||
|
data.data.pid = node.data.id;
|
||||||
|
}
|
||||||
|
// 查询数据
|
||||||
|
awsuiAxios.post(data).then(function (ro) {
|
||||||
|
for (let i = 0; i < ro.data.length; i++) {
|
||||||
|
if (ro.data[i].id.length < 36) {
|
||||||
|
ro.data[i].disabled = true;
|
||||||
|
} else {
|
||||||
|
if (that.categorys != '' && that.methods != '') {
|
||||||
|
if (that.methods.indexOf(ro.data[i].plMethodId) > -1) {
|
||||||
|
ro.data[i].disabled = false;
|
||||||
|
} else {
|
||||||
|
ro.data[i].disabled = true;
|
||||||
|
}
|
||||||
|
} else if (that.categorys != '') {
|
||||||
|
if (that.categorys.indexOf(ro.data[i].plCategory) > -1) {
|
||||||
|
ro.data[i].disabled = false;
|
||||||
|
} else {
|
||||||
|
ro.data[i].disabled = true;
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
if (that.methods.indexOf(ro.data[i].plMethodId) > -1) {
|
||||||
|
ro.data[i].disabled = false;
|
||||||
|
} else {
|
||||||
|
ro.data[i].disabled = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
resolve(ro.data);
|
||||||
|
that.initTreeCheck();
|
||||||
|
// that.loading = false;
|
||||||
|
if (node.level == 0 && ro.data.length > 0) {
|
||||||
|
const tree = that.$refs.tree;
|
||||||
|
tree.getNode(ro.data[0].id).expand();
|
||||||
|
setTimeout(function(){
|
||||||
|
const childNode = tree.getNode(ro.data[0].id).childNodes[0];
|
||||||
|
if (childNode != null) {
|
||||||
|
childNode.expand();
|
||||||
|
}
|
||||||
|
}, 500);
|
||||||
|
}
|
||||||
|
}).catch(error=>{
|
||||||
|
console.log(error);
|
||||||
|
})
|
||||||
|
},
|
||||||
|
expandNode(obj, node, tree) {// 展开节点
|
||||||
|
|
||||||
|
},
|
||||||
|
closeNode(obj, node, tree) {// 关闭时清空，下次展开重新请求动态加载
|
||||||
|
node.childNodes = [];
|
||||||
|
node.loaded = false;
|
||||||
|
},
|
||||||
|
// 初始化树选中节点
|
||||||
|
initTreeCheck() {
|
||||||
|
const relationType = this.relationType;
|
||||||
|
if (relationType == 'file') {// 文件类型
|
||||||
|
if (this.multiple) {// 多选
|
||||||
|
const result = this.result;
|
||||||
|
const tree = this.$refs.tree;
|
||||||
|
for (let i = 0; i < result.length; i++) {
|
||||||
|
if (tree.getNode(result[i].id) != null) {
|
||||||
|
tree.setChecked(result[i].id, true);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} else {// 单选
|
||||||
|
const result = this.result;
|
||||||
|
const tree = this.$refs.tree;
|
||||||
|
for (let i = 0; i < result.length; i++) {
|
||||||
|
if (tree.getNode(result[i].id) != null) {
|
||||||
|
tree.setCurrentKey(result[i].id);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} else if (relationType == 'shapeAndFile'){
|
||||||
|
const result = this.result;
|
||||||
|
const tree = this.$refs.tree;
|
||||||
|
for (let i = 0; i < result.length; i++) {
|
||||||
|
if (result[i].children.length == 0 && tree.getNode(result[i].id) != null) {
|
||||||
|
tree.setChecked(result[i].id, true);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 树节点check file shapeAndFile
|
||||||
|
handleNodeCheckChange(data, isCheck) {
|
||||||
|
if(this.relationType == 'file' || (this.relationType == 'shapeAndFile' && this.multiple)) { // 关联文件 和 关联形状和文件多选
|
||||||
|
if (isCheck) {// 选中
|
||||||
|
const result = this.result;
|
||||||
|
if (!this.isFileExist(result,data.id, data.versionId)) {
|
||||||
|
const tempObj = {};
|
||||||
|
tempObj.id = data.id;
|
||||||
|
tempObj.versionId = data.versionId;
|
||||||
|
tempObj.name = data.name;
|
||||||
|
tempObj.children = [];
|
||||||
|
result.push(tempObj);
|
||||||
|
this.initTableData();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else {// 取消选中
|
||||||
|
this.remove(data.id);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else { // 关联形状和文件单选
|
||||||
|
if (isCheck) {
|
||||||
|
const result = this.result;
|
||||||
|
this.shapeSelected = ''
|
||||||
|
for (let i = 0; i < result.length; i++) {
|
||||||
|
if (result[i].children.length == 0) {
|
||||||
|
this.remove(result[i].id)
|
||||||
|
} else {
|
||||||
|
let children = result[i].children
|
||||||
|
for (let j = 0; j < children.length; j++) {
|
||||||
|
this.remove(children[j].shapeId)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (!this.isFileExist(result,data.id, data.versionId)) {
|
||||||
|
const tempObj = {};
|
||||||
|
tempObj.id = data.id;
|
||||||
|
tempObj.versionId = data.versionId;
|
||||||
|
tempObj.name = data.name;
|
||||||
|
tempObj.children = [];
|
||||||
|
result.push(tempObj);
|
||||||
|
this.initTableData();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
this.remove(data.id);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
handleClose(done) {
|
||||||
|
this.closeDlalog('cancel');
|
||||||
|
done();
|
||||||
|
},
|
||||||
|
cancel() {
|
||||||
|
this.closeDlalog('cancel');
|
||||||
|
this.dialogVisible = false;
|
||||||
|
},
|
||||||
|
submit() {
|
||||||
|
this.closeDlalog('save');
|
||||||
|
this.dialogVisible = false;
|
||||||
|
},
|
||||||
|
closeDlalog(type) {// 取消/确定之后的关闭
|
||||||
|
if (type == 'save') {
|
||||||
|
const result = JSON.parse(JSON.stringify(this.result));
|
||||||
|
if (this.relationType == 'file') {
|
||||||
|
for (let i = 0; i < result.length; i++) {
|
||||||
|
delete result[i].children;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.$emit('getResult', result);
|
||||||
|
} else {
|
||||||
|
this.$emit('cancel');
|
||||||
|
}
|
||||||
|
// 清空所有数据
|
||||||
|
this.clearAllParam();
|
||||||
|
},
|
||||||
|
// 树节点点击
|
||||||
|
handleNodeClick(data) {
|
||||||
|
const that = this;
|
||||||
|
const relationType = this.relationType;
|
||||||
|
if (relationType == 'file') {// 关联类型是文件
|
||||||
|
if (!this.multiple) {// 单选处理，单选为选中
|
||||||
|
// 判断
|
||||||
|
if (that.categorys != '' && that.methods != '') {
|
||||||
|
if (that.methods.indexOf(data.plMethodId) == -1) {
|
||||||
|
// 不支持
|
||||||
|
that.$message({message: '不支持关联的模型',type: 'warning'});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
} else if (that.categorys != '') {
|
||||||
|
if (that.categorys.indexOf(data.plCategory) == -1) {
|
||||||
|
that.$message({message: '不支持关联的模型',type: 'warning'});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
if (that.methods.indexOf(data.plMethodId) == -1) {
|
||||||
|
that.$message({message: '不支持关联的模型',type: 'warning'});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.result = [];// 清空
|
||||||
|
const result = this.result;
|
||||||
|
const tempObj = {};
|
||||||
|
tempObj.id = data.id;
|
||||||
|
tempObj.versionId = data.versionId;
|
||||||
|
tempObj.name = data.name;
|
||||||
|
tempObj.children = [];
|
||||||
|
result.push(tempObj);
|
||||||
|
this.initTableData();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else {// 关联类型是形状
|
||||||
|
// 查询节点列表
|
||||||
|
const that = this;
|
||||||
|
that.shapeSearchKey = '';
|
||||||
|
const params = {
|
||||||
|
url:'jd',
|
||||||
|
data:{
|
||||||
|
cmd: 'com.actionsoft.apps.coe.pal_repository_tree_component_shapejson',
|
||||||
|
id: data.id
|
||||||
|
}
|
||||||
|
};
|
||||||
|
let isDisabled = true;
|
||||||
|
if (that.categorys != '' && that.methods != '') {
|
||||||
|
if (that.methods.indexOf(data.plMethodId) > -1) {
|
||||||
|
isDisabled = false;
|
||||||
|
} else {
|
||||||
|
isDisabled = true;
|
||||||
|
}
|
||||||
|
} else if (that.categorys != '') {
|
||||||
|
if (that.categorys.indexOf(data.plCategory) > -1) {
|
||||||
|
isDisabled = false;
|
||||||
|
} else {
|
||||||
|
isDisabled = true;
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
if (that.methods.indexOf(data.plMethodId) > -1) {
|
||||||
|
isDisabled = false;
|
||||||
|
} else {
|
||||||
|
isDisabled = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 查询数据
|
||||||
|
awsuiAxios.post(params).then(function (ro) {
|
||||||
|
if (ro.result == 'ok') {
|
||||||
|
const list = ro.data.list;
|
||||||
|
const tempData = [];
|
||||||
|
for (let i = 0; i < list.length; i++) {
|
||||||
|
const obj = {
|
||||||
|
id: list[i].id,
|
||||||
|
name: list[i].name,
|
||||||
|
fileId: list[i].fileId,
|
||||||
|
fileName: list[i].fileName,
|
||||||
|
versionId: list[i].versionId,
|
||||||
|
isDisabled: isDisabled
|
||||||
|
}
|
||||||
|
|
||||||
|
tempData.push(obj);
|
||||||
|
that.shapeRecords[list[i].id] = obj;
|
||||||
|
}
|
||||||
|
that.shapeData = tempData;
|
||||||
|
that.shapeTempData = JSON.parse(JSON.stringify(that.shapeData));// 拷贝一份临时数据
|
||||||
|
}
|
||||||
|
}).catch(error=>{
|
||||||
|
console.log(error);
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 初始化最右侧表格
|
||||||
|
initTableData() {
|
||||||
|
const relationType = this.relationType;
|
||||||
|
if (relationType == 'file') {
|
||||||
|
const result = this.result;
|
||||||
|
const tempData = [];
|
||||||
|
for (let i = 0; i < result.length; i++) {
|
||||||
|
const tempObj = {
|
||||||
|
id: result[i].id,
|
||||||
|
name: result[i].name,
|
||||||
|
versionId: result[i].versionId
|
||||||
|
}
|
||||||
|
tempData.push(tempObj);
|
||||||
|
}
|
||||||
|
this.tableData = tempData;
|
||||||
|
}
|
||||||
|
else if (relationType == 'shapeAndFile') {
|
||||||
|
const result = this.result;
|
||||||
|
const tempData = [];
|
||||||
|
for (let i = 0; i < result.length; i++) {
|
||||||
|
const currFile = result[i];
|
||||||
|
const children = currFile.children;
|
||||||
|
if(children.length == 0) {
|
||||||
|
const tempObj = {
|
||||||
|
id: result[i].id,
|
||||||
|
name: result[i].name,
|
||||||
|
versionId: result[i].versionId
|
||||||
|
}
|
||||||
|
tempData.push(tempObj);
|
||||||
|
} else {
|
||||||
|
for (let j = 0; j < children.length; j++) {
|
||||||
|
const currShape = children[j];
|
||||||
|
const tempObj = {
|
||||||
|
id: currShape.shapeId,
|
||||||
|
name: currShape.name,
|
||||||
|
fileId: currFile.id,
|
||||||
|
fileName: currFile.name,
|
||||||
|
versionId: currFile.versionId
|
||||||
|
}
|
||||||
|
tempData.push(tempObj);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.tableData = tempData;
|
||||||
|
}
|
||||||
|
else {// 关联类型是形状
|
||||||
|
const result = this.result;
|
||||||
|
const tempData = [];
|
||||||
|
for (let i = 0; i < result.length; i++) {
|
||||||
|
const currFile = result[i];
|
||||||
|
const children = currFile.children;
|
||||||
|
for (let j = 0; j < children.length; j++) {
|
||||||
|
const currShape = children[j];
|
||||||
|
const tempObj = {
|
||||||
|
id: currShape.shapeId,
|
||||||
|
name: currShape.name,
|
||||||
|
fileId: currFile.id,
|
||||||
|
fileName: currFile.name,
|
||||||
|
versionId: currFile.versionId
|
||||||
|
}
|
||||||
|
tempData.push(tempObj);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.tableData = tempData;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 文件是否存在于结果中
|
||||||
|
isFileExist(result, fileId, versionId){
|
||||||
|
for (let i = 0; i < result.length; i++) {
|
||||||
|
const file = result[i];
|
||||||
|
if (file.versionId == versionId) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return false;
|
||||||
|
},
|
||||||
|
// 右侧表格删除
|
||||||
|
remove(id) {
|
||||||
|
const relationType = this.relationType;
|
||||||
|
if (relationType == 'file') {
|
||||||
|
const result = this.result;
|
||||||
|
for (let i = 0; i < result.length; i++) {
|
||||||
|
const obj = result[i];
|
||||||
|
if (obj.id == id) {
|
||||||
|
result.splice(i, 1);
|
||||||
|
if (this.multiple) {
|
||||||
|
this.$refs.tree.setChecked(id, false);
|
||||||
|
} else {
|
||||||
|
this.$refs.tree.setCurrentKey(null);
|
||||||
|
}
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else if(relationType == 'shapeAndFile') {
|
||||||
|
const result = this.result;
|
||||||
|
for (let i = 0; i < result.length; i++) {
|
||||||
|
const obj = result[i];
|
||||||
|
if (obj.id == id) {
|
||||||
|
this.$refs.tree.setChecked(id, false);
|
||||||
|
result.splice(i, 1);
|
||||||
|
break
|
||||||
|
} else {
|
||||||
|
let data = this.shapeRecords[id]
|
||||||
|
let children = result[i].children
|
||||||
|
if (data && obj.id == data.fileId) {
|
||||||
|
for (let j = 0; j < children.length; j++) {
|
||||||
|
if (children[j].shapeId == id) {
|
||||||
|
children.splice(j, 1);
|
||||||
|
if (children.length == 0) {
|
||||||
|
result.splice(i, 1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if(this.multiple) {
|
||||||
|
// 删除选中形状
|
||||||
|
for (let i = 0; i < this.shapeChecked.length; i++) {
|
||||||
|
if (this.shapeChecked[i] == id) {
|
||||||
|
this.shapeChecked.splice(i, 1);
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
this.shapeSelected = '';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else {// 形状
|
||||||
|
if (this.multiple) {// 多选
|
||||||
|
const data = this.shapeRecords[id];
|
||||||
|
if (data) {
|
||||||
|
const result = this.result;
|
||||||
|
const shapeId = data.id;
|
||||||
|
const name = data.name;
|
||||||
|
const fileId = data.fileId;
|
||||||
|
const fileName = data.fileName;
|
||||||
|
const fileVersionId = data.versionId;
|
||||||
|
for (let i = 0; i < result.length; i++) {
|
||||||
|
const file = result[i];
|
||||||
|
if (file.id == fileId) {
|
||||||
|
const children = file.children;
|
||||||
|
for (let j = 0; j < children.length; j++) {
|
||||||
|
if (children[j].shapeId == id) {
|
||||||
|
children.splice(j, 1);
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (children.length == 0) {
|
||||||
|
result.splice(i, 1);
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 删除选中节点
|
||||||
|
for (let i = 0; i < this.shapeChecked.length; i++) {
|
||||||
|
if (this.shapeChecked[i] == id) {
|
||||||
|
this.shapeChecked.splice(i, 1);
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} else {// 单选
|
||||||
|
this.result = [];
|
||||||
|
this.shapeSelected = '';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.initTableData();
|
||||||
|
},
|
||||||
|
// 形状单选变化事件
|
||||||
|
handleChangeRadioShape(id) {
|
||||||
|
const data = this.shapeRecords[id];
|
||||||
|
if (data) {
|
||||||
|
const shapeId = data.id;
|
||||||
|
const name = data.name;
|
||||||
|
const fileId = data.fileId;
|
||||||
|
const fileName = data.fileName;
|
||||||
|
const fileVersionId = data.versionId;
|
||||||
|
if (this.relationType == 'shapeAndFile') {
|
||||||
|
for (let i = 0; i < this.result.length; i++) {
|
||||||
|
if (this.result[i].children.length == 0) {
|
||||||
|
this.remove(this.result[i].id)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.result = [];
|
||||||
|
const result = this.result;
|
||||||
|
const tempObj = {};
|
||||||
|
tempObj.id = fileId;
|
||||||
|
tempObj.versionId = fileVersionId;
|
||||||
|
tempObj.name = fileName;
|
||||||
|
tempObj.children = [];
|
||||||
|
const children = {
|
||||||
|
shapeId: shapeId,
|
||||||
|
name: name
|
||||||
|
};
|
||||||
|
tempObj.children.push(children);
|
||||||
|
result.push(tempObj);
|
||||||
|
this.initTableData();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 形状多选变化事件
|
||||||
|
handleChangeCheckShape(ids) {
|
||||||
|
if (this.relationType == 'shapeAndFile') {
|
||||||
|
for (let i = 0; i < this.result.length; i++) {
|
||||||
|
if (this.result[i].children.length > 0) {
|
||||||
|
this.result.splice(i,1)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
this.result = []
|
||||||
|
}
|
||||||
|
const result = this.result;
|
||||||
|
for (let i = 0; i < ids.length; i++) {
|
||||||
|
const id = ids[i];
|
||||||
|
const data = this.shapeRecords[id];
|
||||||
|
if (data) {
|
||||||
|
const shapeId = data.id;
|
||||||
|
const name = data.name;
|
||||||
|
const fileId = data.fileId;
|
||||||
|
const fileName = data.fileName;
|
||||||
|
const fileVersionId = data.versionId;
|
||||||
|
let fileExist = false;
|
||||||
|
for (let j = 0; j < result.length; j++) {
|
||||||
|
const file = result[j];
|
||||||
|
if (file.id == fileId) {
|
||||||
|
fileExist = true;
|
||||||
|
const children = {
|
||||||
|
shapeId: shapeId,
|
||||||
|
name: name
|
||||||
|
}
|
||||||
|
if (file.children.findIndex(item => item.shapeId == shapeId) === -1) {
|
||||||
|
file.children.push(children);
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (!fileExist) {
|
||||||
|
const tempObj = {};
|
||||||
|
tempObj.id = fileId;
|
||||||
|
tempObj.versionId = fileVersionId;
|
||||||
|
tempObj.name = fileName;
|
||||||
|
tempObj.children = [];
|
||||||
|
const children = {
|
||||||
|
shapeId: shapeId,
|
||||||
|
name: name
|
||||||
|
};
|
||||||
|
tempObj.children.push(children);
|
||||||
|
result.push(tempObj);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.initTableData();
|
||||||
|
},
|
||||||
|
initData() {// 初始化传递进来的数据
|
||||||
|
// 已选中的数据初始化到result、shapeSelected、shapeChecked里面
|
||||||
|
const that = this;
|
||||||
|
if (that.relationType == 'file') {
|
||||||
|
if (that.selectFileId != '') {
|
||||||
|
// 查询数据
|
||||||
|
const data = {
|
||||||
|
url:'jd',
|
||||||
|
data:{
|
||||||
|
cmd: 'com.actionsoft.apps.coe.pal_repository_tree_component_file_query',
|
||||||
|
versionIds: that.selectFileId
|
||||||
|
}
|
||||||
|
};
|
||||||
|
// 查询数据
|
||||||
|
awsuiAxios.post(data).then(function (ro) {
|
||||||
|
if (ro.result == 'ok') {
|
||||||
|
const result = [];
|
||||||
|
for (let i = 0; i < ro.data.length; i++) {
|
||||||
|
const currData = ro.data[i];
|
||||||
|
const tempObj = {};
|
||||||
|
tempObj.id = currData.id;
|
||||||
|
tempObj.versionId = currData.versionId;
|
||||||
|
tempObj.name = currData.name;
|
||||||
|
tempObj.children = [];
|
||||||
|
result.push(tempObj);
|
||||||
|
}
|
||||||
|
that.result = result;
|
||||||
|
that.initTableData();
|
||||||
|
}
|
||||||
|
}).catch(error=>{
|
||||||
|
console.log(error);
|
||||||
|
})
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
if (that.selectFileId != '' && that.selectShapeId != '') {
|
||||||
|
// 查询数据
|
||||||
|
const data = {
|
||||||
|
url:'jd',
|
||||||
|
data:{
|
||||||
|
cmd: 'com.actionsoft.apps.coe.pal_repository_tree_component_file_shape_query',
|
||||||
|
fileIds: that.selectFileId,
|
||||||
|
shapeIds: that.selectShapeId
|
||||||
|
}
|
||||||
|
};
|
||||||
|
// 查询数据
|
||||||
|
awsuiAxios.post(data).then(function (ro) {
|
||||||
|
if (ro.result == 'ok') {
|
||||||
|
if (ro.data.data.length > 0) {
|
||||||
|
that.shapeRecords = ro.data.shapes;
|
||||||
|
if (that.multiple) {
|
||||||
|
that.result = ro.data.data;
|
||||||
|
for (let i = 0; i < that.result.length; i++) {
|
||||||
|
const children = that.result[i].children;
|
||||||
|
for (let j = 0; j < children.length; j++) {
|
||||||
|
that.shapeChecked.push(children[j].shapeId);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
that.result = ro.data.data;
|
||||||
|
for (let i = 0; i < that.result.length; i++) {
|
||||||
|
const children = that.result[i].children;
|
||||||
|
for (let j = 0; j < children.length; j++) {
|
||||||
|
that.shapeSelected = children[j].shapeId;// 取任意一个
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
that.initTableData();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}).catch(error=>{
|
||||||
|
console.log(error);
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
visible(val) {
|
||||||
|
this.dialogVisible = val;
|
||||||
|
if (val) {// 打开
|
||||||
|
this.clearAllParam();
|
||||||
|
this.pid = this.rootId;
|
||||||
|
this.initData();
|
||||||
|
} else {// 关闭
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
#palRelationAddress >>> .el-dialog__body {
|
||||||
|
padding: 10px 20px;
|
||||||
|
color: #606266;
|
||||||
|
font-size: 14px;
|
||||||
|
word-break: break-all;
|
||||||
|
}
|
||||||
|
#palRelationAddress >>> .el-input__inner {
|
||||||
|
border-radius: 0px;
|
||||||
|
}
|
||||||
|
#palRelationAddress >>> .el-tree {
|
||||||
|
min-width: 100%;
|
||||||
|
display:inline-block !important;
|
||||||
|
}
|
||||||
|
.checkbox-item {
|
||||||
|
margin: 10px 0px;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.redio-item {
|
||||||
|
margin: 10px 0px;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.div-left {
|
||||||
|
float:left;
|
||||||
|
width:249px;
|
||||||
|
height:400px;
|
||||||
|
border-right: 1px dashed #f2f2f2;
|
||||||
|
}
|
||||||
|
.div-middle {
|
||||||
|
float:left;
|
||||||
|
width: 248px;
|
||||||
|
height:400px;
|
||||||
|
border-right: 1px dashed #f2f2f2;
|
||||||
|
}
|
||||||
|
.div-right {
|
||||||
|
float: right;
|
||||||
|
width: 249px;
|
||||||
|
height:400px;
|
||||||
|
background-color: #2a85a0;
|
||||||
|
}
|
||||||
|
#palRelationAddress >>> .el-table__row .icon-delete-display{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
#palRelationAddress >>> .el-table__row:hover .icon-delete-display{
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
|
#palRelationAddress >>> .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
|
||||||
|
background-color: #F5F7FA;
|
||||||
|
color: #4E7FF9;
|
||||||
|
}
|
||||||
|
#palRelationAddress >>> .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content .awsui-iconfont {
|
||||||
|
color: #4E7FF9 !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,7 @@
|
|||||||
|
import PalRelationAddress from './component'
|
||||||
|
|
||||||
|
PalRelationAddress.install = function(Vue) {
|
||||||
|
Vue.component(PalRelationAddress.name, PalRelationAddress);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default PalRelationAddress;
|
||||||
@ -13,6 +13,7 @@
|
|||||||
<div class="head-title" style="float:left;width:200px;">
|
<div class="head-title" style="float:left;width:200px;">
|
||||||
<awsui-select id="levelSelect" v-model="levelValue" collapse-tags placeholder="请选择流程层级" :options="levelOptions" multiple @change="searchProcessList(false)"></awsui-select>
|
<awsui-select id="levelSelect" v-model="levelValue" collapse-tags placeholder="请选择流程层级" :options="levelOptions" multiple @change="searchProcessList(false)"></awsui-select>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="head-title" style="float:right;width: 240px;">
|
<div class="head-title" style="float:right;width: 240px;">
|
||||||
<awsui-button class="button-general-color button_fixed_width" type="primary" @click="exportProcessList">导出</awsui-button>
|
<awsui-button class="button-general-color button_fixed_width" type="primary" @click="exportProcessList">导出</awsui-button>
|
||||||
<el-tooltip class="item" effect="dark" content="重置筛选条件" placement="bottom-end" :hide-after="1000">
|
<el-tooltip class="item" effect="dark" content="重置筛选条件" placement="bottom-end" :hide-after="1000">
|
||||||
@ -23,11 +24,57 @@
|
|||||||
<i class="el-icon-circle-plus custom_table_dlg_icon" @click="customTableDlg = true"></i>
|
<i class="el-icon-circle-plus custom_table_dlg_icon" @click="customTableDlg = true"></i>
|
||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="head-title" style="float:right;width: 80px;">
|
||||||
|
<awsui-button class="button-general-color button_fixed_width" type="primary" @click="searchProcessList(false)">查询</awsui-button>
|
||||||
|
</div>
|
||||||
<div class="head-title" style="float:right;width:220px;padding-right: 20px;">
|
<div class="head-title" style="float:right;width:220px;padding-right: 20px;">
|
||||||
<awsui-input v-model="searchInput" size="large" prefixIcon="" placeholder="请输入流程名称进行搜索" clearable @input="searchProcessList(false)"></awsui-input>
|
<awsui-input v-model="searchInput" size="large" suffixIcon="" placeholder="请输入流程名称进行搜索" clearable @input="searchProcessList(false)"></awsui-input>
|
||||||
|
</div>
|
||||||
|
<!-- <!– 流程架构3 –>-->
|
||||||
|
<!-- <div class="head-title" style="float: right;width: 200px;padding-right: 20px;">-->
|
||||||
|
<!-- <awsui-input v-model="searchInput" size="large" prefixIcon="" placeholder="流程架构3" clearable @input="searchProcessList(false)"></awsui-input>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- <!– 流程架构2 –>-->
|
||||||
|
<!-- <div class="head-title" style="float: right;width: 200px;padding-right: 20px;">-->
|
||||||
|
<!-- <awsui-input v-model="searchInput" size="large" prefixIcon="" placeholder="流程架构2" clearable @input="searchProcessList(false)"></awsui-input>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- <!– 流程架构1 –>-->
|
||||||
|
<!-- <div class="head-title" style="float: right;width: 200px;padding-right: 20px;">-->
|
||||||
|
<!-- <awsui-input v-model="searchInput" size="large" prefixIcon="" placeholder="流程架构1" clearable @input="searchProcessList(false)"></awsui-input>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- 流程架构 -->
|
||||||
|
<div class="head-title" style="float: right;width: 200px;padding-right: 20px;">
|
||||||
|
<awsui-input v-model="frameworkSearchInput" size="large" suffixIcon="" readonly placeholder="请选择流程架构" @click.native="choiceRelationComponent('')"></awsui-input>
|
||||||
|
</div>
|
||||||
|
<div class="head-title" style="float: right;">
|
||||||
|
<el-checkbox-group v-model="frameworkSelect" size="small">
|
||||||
|
<el-checkbox-button v-for="item in frameworkOpts" :label="item" :key="item">{{item}}</el-checkbox-button>
|
||||||
|
</el-checkbox-group>
|
||||||
|
</div>
|
||||||
|
<!-- 发布部门 -->
|
||||||
|
<div class="head-title" style="float: right;width: 200px;padding-right: 20px;">
|
||||||
|
<awsui-input v-model="issuingDeptment" size="large" suffixIcon="" readonly placeholder="请选择发布部门" @click.native="choiceAwsOrgComponent()"></awsui-input>
|
||||||
</div>
|
</div>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
|
<!-- <el-row>-->
|
||||||
|
<!-- <!– 流程架构 –>-->
|
||||||
|
<!-- <div class="head-title" style="float: right;width: 200px;padding-right: 20px;">-->
|
||||||
|
<!-- <awsui-input v-model="frameworkSearchInput" size="large" suffixIcon="" readonly placeholder="请选择流程架构" @click.native="choiceRelationComponent('')"></awsui-input>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- <div class="head-title" style="float: right;">-->
|
||||||
|
<!-- <el-checkbox-group v-model="frameworkSelect" size="small">-->
|
||||||
|
<!-- <el-checkbox-button v-for="item in frameworkOpts" :label="item" :key="item">{{item}}</el-checkbox-button>-->
|
||||||
|
<!-- </el-checkbox-group>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- <!– 发布部门 –>-->
|
||||||
|
<!-- <div class="head-title" style="float: right;width: 200px;padding-right: 20px;">-->
|
||||||
|
<!-- <awsui-input v-model="issuingDeptment" size="large" suffixIcon="" readonly placeholder="请选择发布部门" @click.native="choiceAwsOrgComponent()"></awsui-input>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- <div class="head-title" style="float:right;width: 80px;">-->
|
||||||
|
<!-- <awsui-button class="button-general-color button_fixed_width" type="primary" @click="searchProcessList(false)">查询</awsui-button>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- </el-row>-->
|
||||||
</awsui-header>
|
</awsui-header>
|
||||||
<awsui-main style="padding-right: 0;padding-bottom: 0;" id="processlistMain">
|
<awsui-main style="padding-right: 0;padding-bottom: 0;" id="processlistMain">
|
||||||
<el-table
|
<el-table
|
||||||
@ -144,6 +191,32 @@
|
|||||||
</div>
|
</div>
|
||||||
</awsui-sidebar>
|
</awsui-sidebar>
|
||||||
<iframe style="display: none" id='downloadIframe' ></iframe>
|
<iframe style="display: none" id='downloadIframe' ></iframe>
|
||||||
|
<!-- 选择流程架构 -->
|
||||||
|
<pal-relation-address
|
||||||
|
ref="palRelationAddress"
|
||||||
|
:visible.sync="palRelationAddressVisible"
|
||||||
|
v-on:cancel="palRelationAddressVisible = false"
|
||||||
|
v-on:getResult="saveRelationResult"
|
||||||
|
:title="relation.title"
|
||||||
|
:selectFileId="relation.selectFileId"
|
||||||
|
:selectShapeId="relation.selectShapeId"
|
||||||
|
:relationType="relation.relationType"
|
||||||
|
:categorys="relation.category"
|
||||||
|
:methods="relation.method"
|
||||||
|
:wsId="relation.wsId"
|
||||||
|
:teamId="relation.teamId"
|
||||||
|
:multiple = relation.multiple
|
||||||
|
/>
|
||||||
|
<BPMOrgAddress
|
||||||
|
ref="palAwsOrgAddress"
|
||||||
|
:visible.sync="bpmOrgAddress.visible"
|
||||||
|
:addressType="bpmOrgAddress.addressType"
|
||||||
|
v-on:cancel="bpmOrgAddress.visible = false"
|
||||||
|
v-on:getResult="saveBpmOrgAddressResult"
|
||||||
|
multiple
|
||||||
|
:title="bpmOrgAddress.title"
|
||||||
|
:multiple="bpmOrgAddress.multiple"
|
||||||
|
/>
|
||||||
</awsui-layout>
|
</awsui-layout>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -151,17 +224,20 @@
|
|||||||
import draggable from "vuedraggable";
|
import draggable from "vuedraggable";
|
||||||
import awsuiAxios from "../awsuiAxios";
|
import awsuiAxios from "../awsuiAxios";
|
||||||
import {openDesigner} from "../api/commonFun";
|
import {openDesigner} from "../api/commonFun";
|
||||||
|
import PalRelationAddress from "@/components/common/PalRelationAddress/index.js";
|
||||||
|
import BPMOrgAddress from "@/components/common/BPMOrgAddress/index.js";// pal平台组织架构地址簿，调用平台部门人员角色
|
||||||
let levelOptions = levelSelect;
|
let levelOptions = levelSelect;
|
||||||
let levelValue = defaultSelectVal;
|
let levelValue = defaultSelectVal;
|
||||||
// 配置临时记录
|
// 配置临时记录
|
||||||
let tempMoreAttrCheckedConfig = [];
|
let tempMoreAttrCheckedConfig = [];
|
||||||
let tempMoreAttrUnCheckedConfig = [];
|
let tempMoreAttrUnCheckedConfig = [];
|
||||||
let tempTableFilterObj = {};
|
let tempTableFilterObj = {};
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "ProcesslistHome",
|
name: "ProcesslistHome",
|
||||||
components: {
|
components: {
|
||||||
draggable
|
draggable,
|
||||||
|
PalRelationAddress,
|
||||||
|
BPMOrgAddress
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
@ -182,7 +258,31 @@
|
|||||||
customTableCheckedData: [],
|
customTableCheckedData: [],
|
||||||
customTableUncheckedData: [],
|
customTableUncheckedData: [],
|
||||||
dataLoaded: false,
|
dataLoaded: false,
|
||||||
serialNumber: 0 // 当前序号
|
serialNumber: 0, // 当前序号
|
||||||
|
frameworkOpts: ['L1','L2','L3'],
|
||||||
|
frameworkSelect: ['L1'],
|
||||||
|
frameworkSearchInput: 'aaa',
|
||||||
|
issuingDeptment: 'xxxx',
|
||||||
|
palRelationAddressVisible: false,
|
||||||
|
relation: {
|
||||||
|
title: '选择流程',
|
||||||
|
selectFileId: '',
|
||||||
|
selectShapeId: '',
|
||||||
|
relationType: 'file',
|
||||||
|
category: 'process',
|
||||||
|
method: '',
|
||||||
|
wsId: wsId,
|
||||||
|
teamId: teamId,
|
||||||
|
multiple: true,
|
||||||
|
isRequired: false
|
||||||
|
},
|
||||||
|
bpmOrgAddress: {
|
||||||
|
title: '选择发布部门',
|
||||||
|
visible: false,
|
||||||
|
addressType: "department",
|
||||||
|
multiple: true,
|
||||||
|
isRequired: false
|
||||||
|
},
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods : {
|
methods : {
|
||||||
@ -431,7 +531,32 @@
|
|||||||
that.customTableCheckedData = [];
|
that.customTableCheckedData = [];
|
||||||
that.customTableUncheckedData = [];
|
that.customTableUncheckedData = [];
|
||||||
that.saveTableColumnConfig();
|
that.saveTableColumnConfig();
|
||||||
|
},
|
||||||
|
choiceRelationComponent(fileIds) {// PAL模型/形状选择组件
|
||||||
|
this.relation.selectFileId = fileIds;// 已选中文件id
|
||||||
|
this.palRelationAddressVisible = true;
|
||||||
|
},
|
||||||
|
// 调用关联组件保存函数
|
||||||
|
saveRelationResult(data) {
|
||||||
|
console.log(data)
|
||||||
|
this.palRelationAddressVisible = false;
|
||||||
|
},
|
||||||
|
choiceAwsOrgComponent() {// AWS平台部门/人员/角色组件
|
||||||
|
this.bpmOrgAddress.visible = true;
|
||||||
|
},
|
||||||
|
saveBpmOrgAddressResult(data) {
|
||||||
|
this.bpmOrgAddress.visible = false;
|
||||||
|
if (this.bpmOrgAddress.isRequired && data.length == 0) {
|
||||||
|
this.$message({message: `[${this.currPropertyLabel}]不允许为空`,type: 'warning'});
|
||||||
|
return false;
|
||||||
}
|
}
|
||||||
|
// 保存
|
||||||
|
const params = [];
|
||||||
|
for (let i = 0; i < data.length; i++) {
|
||||||
|
params.push({name: data[i].name, id: data[i].id, type: data[i].type})
|
||||||
|
}
|
||||||
|
this.saveCustomPropToDb(this.currPropertyId, JSON.stringify(params));
|
||||||
|
},
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user