152 lines
4.1 KiB
Vue
152 lines
4.1 KiB
Vue
<template>
|
||
<div>
|
||
<el-container style="height: 1000px">
|
||
<el-aside>
|
||
<el-tree :data="assetStructureList"
|
||
:props="defaultProps"
|
||
@node-click="handleNodeClick">
|
||
|
||
</el-tree>
|
||
</el-aside>
|
||
|
||
<el-main>
|
||
<AssetsBasic v-if="!infoOpen" :info-open="infoOpen" :fund-data-num="fundDataNum"></AssetsBasic>
|
||
<AssetsModel v-if="this.tableInfoList.length!==0" :name="vueName" :dictList="dictList" :tableInfoList="tableInfoList"></AssetsModel>
|
||
|
||
<TableInfoModel v-if="this.tableInfoList.length===0" :table-info="tableInfoForm"></TableInfoModel>
|
||
</el-main>
|
||
|
||
</el-container>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
|
||
import {getDict,getTableTree} from "@/api/etl/etl";
|
||
import AssetsBasic from "@/views/etl/construction/AssetsBasic.vue";
|
||
import AssetsModel from "@/views/etl/construction/AssetsModel.vue";
|
||
import TableInfoModel from "@/views/etl/construction/TableInfoModel.vue";
|
||
|
||
export default {
|
||
name:'construction',
|
||
|
||
components:{TableInfoModel, AssetsModel, AssetsBasic },
|
||
|
||
data() {
|
||
return {
|
||
vueName:null,
|
||
//表详情页面
|
||
tableInfoOpen: false,
|
||
//结构标题
|
||
title: null,
|
||
//查看详细资产结构
|
||
infoOpen: false,
|
||
//资产结构与数据结构载体
|
||
tableInfoForm: {},
|
||
//当前数据库列表
|
||
tableInfoList: [],
|
||
//结构数据量
|
||
fundDataNum: {
|
||
basicNum: null,
|
||
tableNum: null,
|
||
structureNum: null,
|
||
},
|
||
childrenList: [],
|
||
//树级结构
|
||
assetStructureList: [],
|
||
//树级结构展示模版
|
||
defaultProps: {
|
||
children: 'children',
|
||
label: 'tableName'
|
||
},
|
||
|
||
//数据字典
|
||
dictList: [],
|
||
}
|
||
},
|
||
created() {
|
||
this.getList()
|
||
},
|
||
methods: {
|
||
//获取数据
|
||
getList() {
|
||
this.fundDataNum = {
|
||
basicNum: 0,
|
||
tableNum: 0,
|
||
structureNum: 0,
|
||
}
|
||
//树级结构内信息
|
||
getTableTree().then(response => {
|
||
this.data = []
|
||
response.data.forEach(data => {
|
||
//几个链接（资产接入）
|
||
this.fundDataNum.basicNum += 1
|
||
let child = [];
|
||
let info = data.basicConfigInfo;
|
||
data.children.forEach(tableInfo => {
|
||
//几张表（资产模型）
|
||
this.fundDataNum.tableNum += 1
|
||
//多少字段（资产结构）
|
||
this.fundDataNum.structureNum += tableInfo.structureList.length
|
||
child.push({
|
||
'tableName': tableInfo.tableName,
|
||
'info': tableInfo
|
||
})
|
||
})
|
||
//子级存入
|
||
this.assetStructureList.push({
|
||
'info': info,
|
||
'tableName': info.dataResourceName + '('+ info.databaseName + '-' + info.dataSourcesSystemName+')',
|
||
'children': child,
|
||
})
|
||
|
||
})
|
||
|
||
})
|
||
console.log(this.assetStructureList)
|
||
},
|
||
//获取具体表相关数据
|
||
|
||
handleNodeClick(data) {
|
||
// console.log(data)
|
||
console.log(data)
|
||
//undefined
|
||
// console.log(data.children)
|
||
this.infoOpen = true
|
||
//先将对象存入infoForm对象
|
||
this.tableInfoForm = data
|
||
//如果判断对象不存在，重新给form 和 list 赋值
|
||
|
||
if (data.children !== undefined) {
|
||
this.vueName = data.tableName
|
||
this.tableInfoList = data.children
|
||
this.tableInfoForm = data.children[0]
|
||
console.log(data.info.id)
|
||
getDict(data.info.id).then(response => {
|
||
console.log(response)
|
||
this.dictList = response.data
|
||
})
|
||
}else {
|
||
|
||
// this.tableInfoList = this.assetStructureList.find(assent =>
|
||
// assent.info.id === this.tableInfoForm.info.basicId
|
||
// ).children
|
||
this.tableInfoList = []
|
||
}
|
||
console.log('tableList')
|
||
console.log(this.tableInfoList)
|
||
console.log('tableForm')
|
||
console.log(this.tableInfoForm)
|
||
},
|
||
}
|
||
};
|
||
</script>
|
||
<style>
|
||
|
||
|
||
body > {
|
||
margin-bottom: 40px;
|
||
}
|
||
|
||
</style>
|