<template>
|
<el-dialog v-dialogDrag
|
:append-to-body="true"
|
:close-on-click-modal="false"
|
:destroy-on-close="true"
|
:title="dialog.title"
|
:visible.sync="dialog.showDialog"
|
class="avue-dialog"
|
width="1200px"
|
@close="cancelDialog">
|
<el-container style="height: 580px">
|
<el-aside style="width: 380px">
|
<basic-container v-loading="leftLoading" style="height: 530px">
|
<h3 style="margin: 0 0 10px 0">业务类型</h3>
|
<div style="height: 435px">
|
<avue-tree ref="tree" :data="treeData" :option="treeOption" @node-click="nodeClick">
|
<span slot-scope="{ node, data }" class="el-tree-node__label">
|
<span>
|
{{ (node || {}).label }}
|
</span>
|
</span>
|
</avue-tree>
|
</div>
|
</basic-container>
|
</el-aside>
|
|
<el-main>
|
<basic-container v-loading="rightLoading" style="height: 530px">
|
<div style="height: 490px;">
|
<avue-tree ref="uiTree" :data="uiTreeData" :option="uiTreeOption" @check-change="checkChange">
|
<span slot-scope="{ node, data }" class="el-tree-node__label">
|
<span>
|
<i :class="data.icon"></i>
|
{{ (node || {}).label }}
|
</span>
|
</span>
|
</avue-tree>
|
</div>
|
</basic-container>
|
</el-main>
|
</el-container>
|
<div class="dialog-footer avue-dialog__footer">
|
<el-button size="small" type="primary" @click="submitDialog">保 存</el-button>
|
<el-button size="small" @click="cancelDialog">取 消</el-button>
|
</div>
|
</el-dialog>
|
</template>
|
|
<script>
|
import {getBizTree, getAllLevelTreeByBtm, clonePageDef, clonetabPage, cloneTabButton} from "@/api/UI/uiDefine";
|
|
export default {
|
name: "cloneDialog",
|
props: ['fromOid', 'type', 'sourceOId','paramsType'],
|
data() {
|
return {
|
leftLoading: false,
|
rightLoading: false,
|
dialog: {
|
showDialog: false,
|
title: "克隆目标",
|
loading: false,
|
type: "clone",
|
},
|
treeOption: {
|
menu: false,
|
addBtn: false,
|
props: {
|
label: 'text',
|
value: 'oid',
|
children: 'children'
|
}
|
},
|
nodeRow: {},
|
treeData: [],
|
defaultExpandKeys: [],
|
uiTreeOption: {
|
nodeKey: 'oid',
|
checkOnClickNode: true,
|
defaultExpandedKeys: [],
|
multiple: false,
|
menu: false,
|
addBtn: false,
|
filter: false,
|
props: {
|
label: 'text',
|
value: 'oid',
|
children: 'children'
|
}
|
},
|
uiTreeData: [],
|
};
|
},
|
methods: {
|
openDialog(data) {
|
this.dialog.showDialog = true;
|
this.getTreeList()
|
this.uiTreeData = [];
|
},
|
cancelDialog() {
|
this.dialog.loading = false;
|
this.dialog.showDialog = false;
|
},
|
submitDialog() {
|
const node = this.$refs.uiTree.getCurrentNode();
|
console.log(node);
|
if (!node.leaf) {
|
this.$message.error('请选择最下层子节点进行克隆');
|
return;
|
}
|
let params = {};
|
if (node) {
|
params = {
|
fromOid: this.fromOid,
|
toOid: node.oid,
|
cloneParam: {
|
sourceOId: this.sourceOId
|
}
|
}
|
}
|
console.log(params);
|
const saveFunction = {
|
'pageDef': clonePageDef,
|
'tabPage': clonetabPage,
|
'tabButton': cloneTabButton
|
};
|
saveFunction[this.type](params).then(res => {
|
if(res.data.code == 200){
|
this.$message.success(res.data.obj);
|
this.cancelDialog();
|
}
|
})
|
},
|
getTreeList() {
|
this.leftLoading = true;
|
getBizTree().then(res => {
|
this.treeData = res.data.obj.children;
|
this.leftLoading = false;
|
}).catch(error => {
|
this.leftLoading = false;
|
})
|
},
|
// 角色点击
|
nodeClick(row, node) {
|
this.nodeRow = row;
|
this.rightLoading = true;
|
const params = {
|
btmName: this.nodeRow.attributes.name,
|
level: this.paramsType
|
}
|
this.defaultExpandKeys = ['root'];
|
console.log(row);
|
getAllLevelTreeByBtm(params).then(res => {
|
this.uiTreeOption.defaultExpandedKeys = [res.data.obj.oid];
|
this.uiTreeData = [res.data.obj];
|
console.log(res);
|
this.rightLoading = false;
|
}).catch(error => {
|
this.rightLoading = false;
|
})
|
},
|
|
//处理树
|
processChildren(item) {
|
if (item.children && item.children.length > 0) {
|
item.children = item.children.map(child => {
|
if (child.level < 4) {
|
this.defaultExpandKeys.push(child.oid)
|
}
|
if (child.level == 1) {
|
child.icon = 'el-icon-s-promotion';
|
child.label = child.data.label + '(' + child.data.name + ')'
|
} else if (child.level == 2) {
|
child.icon = 'el-icon-s-order';
|
child.label = child.text
|
} else if (child.level == 3) {
|
child.icon = 'el-icon-office-building';
|
child.label = child.text
|
} else if (child.level == 4) {
|
child.icon = 'el-icon-document';
|
child.label = child.text
|
} else if (child.level == 5) {
|
child.icon = 'el-icon-s-tools';
|
child.label = child.text
|
}
|
this.processChildren(child); // 递归处理每个子节点
|
return child; // 只返回子节点的 attributes
|
});
|
}
|
},
|
},
|
}
|
</script>
|
|
<style scoped>
|
|
</style>
|
