<template>
<div>
<title-bar title="集团及经济依存信息" @clickLef="onClick">
<van-icon slot="left" name="cross" size="24" />
</title-bar>
<van-tabs class="guarTabCls" :active="active" @click="checkMod">
<van-tab title="集团母公司">
<div id="mgs" class="d-flex align-items-center justify-content-center echarts-container-class" v-show="active == 0">
<img v-if="!errorFlag" src="../../../../assets/images/nodata.png" class="no-data-class"/>
</div>
</van-tab>
<van-tab title="集团关系">
<div class="d-flex align-items-center justify-content-center echarts-container-class">
<tree-graph-cmp :data="treeData" :format="formatLabel" v-if="active == '2'"></tree-graph-cmp>
<img v-if="!relationFlag" src="../../../../assets/images/nodata.png" class="no-data-class"/>
</div>
</van-tab>
</van-tabs>
</div>
</template>
<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
import TitleBar from "@/components/general/TitleBar.vue";
import TreeGraphCmp from '@/components/general/TreeGraphCmp.vue';
import { NativeUI } from "@/public/ts/NativeUI";
import nettyApi from "@/constants/api/ms-netty/netty.api";
import Public from "@/public/ts/Public";
/**
* @Description 集团及经济依存信息
* @Author JiangTao
* @Date 2021-11-10 下午 03:15
*/
@Component({
name: "FroupAndEconomicDependenceInformation",
components: {
TitleBar,
TreeGraphCmp
},
})
export default class FroupAndEconomicDependenceInformation extends Vue {
pageTitle = ""; // 页面标题
treeData:any = {};
array:any = {
name: this.$store.getters.getCusInfo.cus_name,
children: []
};
active = 0;
companyArray:any[] = [];
linksArray:any = [];
chartFlag = true;
momCompany = "";
creditcodes = "";
arrayMember:any = {
name: '',
children: []
};
arrayKGZRR:any = {
name: '',
children: []
};
zrPeople = '';
errorFlag = true;
relationFlag = true;
onClick() {
this.$router.back();
}
mounted() {
this.pageTitle = this.$route.meta?.name;
this.active = 0;
this.checkMod();
this.getInfo();
}
formatLabel() {}
/**
* @description: 切换
* @author LiShenghui
* @date 2022/2/18 20:28
*/
checkMod() {
if (this.active == 0) {
this.getInfo();
} else if (this.active == 1) {
this.getInfoMember();
}
}
/**
*
* description：查询集团成员
* ahthor：pd
* 2021年12月13日21:01:38
*/
getInfoMember() {
const parms = {
tc: nettyApi.TRADE_CODE.selectInfoMember,
creditcode: this.creditcodes, //this.$store.getters.getCusInfo.cert_code, //this.$store.getters.getCusInfo.cert_code, //'91510100725399362W','915101002021494601''91110108779517897G'
entid: '',
regno: '',
entname: this.momCompany, //this.$store.getters.getCusInfo.cus_name, //this.$store.getters.getCusInfo.cus_name, //'四川飞森房地产开发有限公司','蓝光投资控股集团有限公司''北京金山奇剑数码科技有限公司'
ProdId: Public.getProdId(),
SvrCode: Public.getSvrCode(nettyApi.TRADE_CODE.selectInfoMember),
ClientNo: this.$store.getters.getCusInfo.cus_id,
pageIndex: '1'
};
NativeUI.showWaiting('正在查询');
return this.$IF.transferDataInter(nettyApi.commonRq, parms).then((res:any) => {
NativeUI.closeWaiting();
if (res.rc == '1') {
this.arrayMember.name = this.momCompany;
if (res.final_out_control && res.final_out_control != '') {
for (let obj of res.final_out_control) {
for (let index in obj.path2.nodes) {
if (obj.path2.nodes[index].innode == true) {
this.zrPeople = obj.path2.nodes[index].name;
// if (index == 0) {
// console.log(this.momCompany);
// this.arrayMember.name = obj.path2.nodes[1].name;
// } else if (index == 1) {
// console.log(this.momCompany);
// this.arrayMember.name = obj.path2.nodes[0].name;
// }
}
}
}
this.arrayKGZRR.name = '最终控股自然人' + this.zrPeople;
let objkg:any = {
name: '控股企业' + '(' + res.final_out_control.length + ')',
children: []
};
for (let index in res.final_out_control) {
if (parseInt(index) < 5) {
let objname:any = {};
objname.name = res.final_out_control[index].entname;
objkg.children.push(objname);
}
}
this.arrayKGZRR.children.push(objkg);
if (res.final_out_legal && res.final_out_legal != '') {
let objFA:any = {
name: '担任法人企业' + '(' + res.final_out_legal.length + ')',
children: []
};
for (let indexs in res.final_out_legal) {
let objcom:any = {};
if (parseInt(indexs) < 5) {
objcom.name = res.final_out_legal[indexs].entname;
objFA.children.push(objcom);
}
}
this.arrayKGZRR.children.push(objFA);
}
this.arrayMember.children.push(this.arrayKGZRR);
}
if (res.parent_and_staff_control && res.parent_and_staff_control != '') {
let objgg:any = {
name: '母公司及其高管共同控制企业' + '(' + res.parent_and_staff_control.length + ')',
children: []
};
for (let objindex in res.parent_and_staff_control) {
if (parseInt(objindex) < 5) {
let obj:any = {};
obj.name = res.parent_and_staff_control[objindex].entname;
objgg.children.push(obj);
}
}
this.arrayMember.children.push(objgg);
}
if (res.staff_out_control && res.staff_out_control != '') {
let objzz:any = {
name: '母公司高管直接控制企业' + '(' + res.staff_out_control.length + ')',
children: []
};
for (let objindex in res.staff_out_control) {
if (parseInt(objindex) < 5) {
let obj:any = {};
obj.name = res.staff_out_control[objindex].entname;
objzz.children.push(obj);
}
}
this.arrayMember.children.push(objzz);
}
if (res.members && res.members != '') {
let objson:any = {
name: '子公司' + '(' + res.members.length + ')',
children: []
};
for (let objindex in res.members) {
if (parseInt(objindex) < 5) {
let obj:any = {};
obj.name = res.members[objindex].entname;
objson.children.push(obj);
}
}
this.arrayMember.children.push(objson);
}
if (res.legal_out_control && res.legal_out_control != '') {
let objdw:any = {
name: '母公司法人对外直接控制' + '(' + res.legal_out_control.length + ')',
children: []
};
for (let objindex in res.legal_out_control) {
if (parseInt(objindex) < 5) {
let obj:any = {};
obj.name = res.legal_out_control[objindex].entname;
objdw.children.push(obj);
}
}
this.arrayMember.children.push(objdw);
}
if (res.parent_and_inv_control && res.parent_and_inv_control != '') {
let objmo:any = {
name: '母公司及主要投资者共同控制' + '(' + res.parent_and_inv_control.length + ')',
children: []
};
for (let objindex in res.parent_and_inv_control) {
if (parseInt(objindex) < 5) {
let obj:any = {};
obj.name = res.parent_and_inv_control[objindex].entname;
objmo.children.push(obj);
}
}
this.arrayMember.children.push(objmo);
}
this.treeData = this.arrayMember;
} else {
this.arrayMember.name = '暂无数据';
this.treeData = this.arrayMember;
this.relationFlag = false;
if (res.ret_code != '4999999') {
NativeUI.toast(res.msg);
}
}
});
}
/**
* 查询集团母公司
* ahthor：pd
* 2021年12月13日20:38:12
* @returns {Promise<void>}
*/
getInfo() {
const parms = {
tc: nettyApi.TRADE_CODE.selectMothCompany,
creditcode: this.$store.getters.getCusInfo.cert_code, //'91510100725399362W',
entname: this.$store.getters.getCusInfo.cus_name, //'四川飞森房地产开发有限公司',
entid: '',
regno: '',
ProdId: Public.getProdId(),
SvrCode: Public.getSvrCode(nettyApi.TRADE_CODE.selectMothCompany),
ClientNo: this.$store.getters.getCusInfo.cus_id
};
NativeUI.showWaiting('正在查询');
return this.$IF.transferDataInter(nettyApi.commonRq, parms).then((res:any) => {
NativeUI.closeWaiting();
if (res.rc == '1') {
let obj:any = {};
obj.name = res.result[0].parent[0].entname;
this.momCompany = res.result[0].parent[0].entname;
this.creditcodes = res.result[0].parent[0].creditcode;
this.companyArray.push(obj);
if (res.result[0].parent[0].path && res.result[0].parent[0].path != '') {
for (let objinfo of res.result[0].parent[0].path) {
if (objinfo.nodes && objinfo.nodes != '') {
for (let objNodes of objinfo.nodes) {
if (objNodes.name == obj.name) {
obj.id = objNodes.id;
}
let objcom:any = {};
if (objNodes.name != obj.name && objNodes.name != this.$store.getters.getCusInfo.cus_name) {
objcom.name = objNodes.name;
objcom.id = objNodes.id;
this.companyArray.push(objcom);
}
if (objNodes.name == this.$store.getters.getCusInfo.cus_name) {
objcom.name = objNodes.name;
objcom.id = objNodes.id;
this.companyArray.push(objcom);
}
}
for (let objLinks of objinfo.links) {
let objLink:any = {};
objLink.source = objLinks.from;
objLink.target = objLinks.to;
if (objLinks.type == 1) {
objLink.relation = '出资比例：' + objLinks.properties[0].conprop * 100 + '%';
} else if (objLinks.type == 2) {
objLink.relation = objLinks.properties[0].position_desc;
} else if (objLinks.type == 13) {
objLink.relation = '持股比例:' + objLinks.properties[0].holderrto + '%';
} else {
objLink.relation = '';
}
this.linksArray.push(objLink);
}
}
}
if (this.chartFlag) {
this.init();
}
}
} else {
if (res.ret_code != '4999999') {
NativeUI.toast(res.msg);
}
this.errorFlag = false;
}
});
}
/**
* 初始化echarts
* anthor：pd
* 2021年12月13日20:38:39
*/
init() {
var chartDom = document.getElementById('mgs');
var myChart = this.$echarts.init(chartDom);
this.chartFlag = false;
var option;
option = {
title: {},
tooltip: {},
animationDurationUpdate: 0,
backgroundColor: '#FFFFFF',
animationEasingUpdate: 'quinticInOut',
color: ['#3FA7DC', '#2BC15D'],
series: [
{
type: 'graph',
layout: 'force',
force: {
repulsion: 200,
gravity: 0.1,
edgeLength: 250,
dataZoom: {
orient: 'horizontal'
}
//layoutAnimation:true
},
draggable: true,
symbolSize: 80,
roam: true,
label: {
show: true,
width: 80,
overflow: 'break',
fontWeight: 14
},
edgeSymbol: ['circle', 'arrow'],
edgeSymbolSize: [4, 10],
edgeLabel: {
fontSize: 20,
normal: {
show: true,
formatter: function(links:any) {
return links.data.relation;
}
}
},
data: this.companyArray,
links: this.linksArray,
lineStyle: {
opacity: 0.9,
width: 2,
curveness: 0
}
}
]
};
myChart.setOption(option);
}
}
</script>
<style scoped>
.guarTabCls {
width: 100%;
}
.echarts-container-class {
height: calc(100vh - 120px);
}
.no-data-class {
width: 40%;
}
::v-deep .van-tab{
font-size: 20px;
line-height: 60px;
}
::v-deep .van-cell__title,
::v-deep .van-field__label {
display: flex;
align-items: center;
width: 20%;
}
::v-deep .van-tabs--line .van-tabs__wrap {
width: 30%;
height: 60px;
}
::v-deep .van-tab--active {
border-bottom: 3px solid #FF574C;
font-weight: bold;
color: #FF574C;
}
::v-deep .van-tabs__line {
height: 0;
background-color: white;
}
::v-deep .van-tabs__content {
height: 100%;
width: 100%;
}
</style>