Commit 0fa8ec63 authored by tianhongyang's avatar tianhongyang

fix bug

parent 7d07c1ce
...@@ -9,3 +9,8 @@ VUE_APP_BASE_API = '/prod-api' ...@@ -9,3 +9,8 @@ VUE_APP_BASE_API = '/prod-api'
# 路由懒加载 # 路由懒加载
VUE_CLI_BABEL_TRANSPILE_MODULES = true VUE_CLI_BABEL_TRANSPILE_MODULES = true
# 子系统地址
VUE_APP_SUB_SYSTEM_ADDRESS = "https://pre-plug.jiansheku.com"
# VUE_APP_SUB_SYSTEM_ADDRESS = "http://192.168.60.104:3400"
\ No newline at end of file
...@@ -6,3 +6,6 @@ ENV = 'production' ...@@ -6,3 +6,6 @@ ENV = 'production'
# 数字化经营履约全生命链路管理系统/生产环境 # 数字化经营履约全生命链路管理系统/生产环境
VUE_APP_BASE_API = 'https://szhapi.jiansheku.com/' VUE_APP_BASE_API = 'https://szhapi.jiansheku.com/'
# 子系统地址
VUE_APP_SUB_SYSTEM_ADDRESS = "https://plug.jiansheku.com"
...@@ -10,3 +10,6 @@ ENV = 'test' ...@@ -10,3 +10,6 @@ ENV = 'test'
# 数字化经营履约全生命链路管理系统/测试环境 # 数字化经营履约全生命链路管理系统/测试环境
VUE_APP_BASE_API = '/prod-api' VUE_APP_BASE_API = '/prod-api'
# 子系统地址
VUE_APP_SUB_SYSTEM_ADDRESS = "https://pre-plug.jiansheku.com"
\ No newline at end of file
module.exports = { module.exports = {
presets: [ presets: [
// https://github.com/vuejs/vue-cli/tree/master/packages/@vue/babel-preset-app // https://github.com/vuejs/vue-cli/tree/master/packages/@vue/babel-preset-app
'@vue/cli-plugin-babel/preset' '@vue/cli-plugin-babel/preset',
['@vue/babel-preset-jsx', { 'injectH': false }]
], ],
'env': { 'env': {
'development': { 'development': {
...@@ -10,4 +11,4 @@ module.exports = { ...@@ -10,4 +11,4 @@ module.exports = {
'plugins': ['dynamic-import-node'] 'plugins': ['dynamic-import-node']
} }
} }
} };
\ No newline at end of file \ No newline at end of file
...@@ -70,6 +70,8 @@ ...@@ -70,6 +70,8 @@
"vuex": "3.6.0" "vuex": "3.6.0"
}, },
"devDependencies": { "devDependencies": {
"@vue/babel-helper-vue-jsx-merge-props": "^1.4.0",
"@vue/babel-preset-jsx": "^1.4.0",
"@vue/cli-plugin-babel": "4.4.6", "@vue/cli-plugin-babel": "4.4.6",
"@vue/cli-plugin-eslint": "4.4.6", "@vue/cli-plugin-eslint": "4.4.6",
"@vue/cli-service": "4.4.6", "@vue/cli-service": "4.4.6",
...@@ -87,6 +89,7 @@ ...@@ -87,6 +89,7 @@
"sass-loader": "10.1.1", "sass-loader": "10.1.1",
"script-ext-html-webpack-plugin": "2.1.5", "script-ext-html-webpack-plugin": "2.1.5",
"svg-sprite-loader": "5.1.1", "svg-sprite-loader": "5.1.1",
"vue-styled-components": "^1.6.0",
"vue-template-compiler": "2.6.12" "vue-template-compiler": "2.6.12"
}, },
"engines": { "engines": {
......
/*
* @Author: thy
* @Date: 2023-10-31 09:33:14
* @LastEditors: thy
* @LastEditTime: 2023-11-02 17:17:32
* @Description: file content
* @FilePath: \dsk-operate-ui\src\components\JsComponents\MaxPageSizeTip.js
*/
import styled from "vue-styled-components";
import Vue from "vue";
import { v4 } from "uuid";
import maxTipTitleIcon from "@/assets/images/market/max-tip-title-icon.svg";
import closeMaxTipIcon from "@/assets/images/market/close-max-tip-icon.svg";
const maxPageSizeTipContainer = styled.div`
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.6);
z-index: 1200;
`;
const maxPageTipContainer = styled.div`
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 340px;
height: 112px;
background: #ffffff;
border: 1px solid #e5e6eb;
box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.1);
border-radius: 4px;
padding: 20px;
box-sizing: border-box;
.top-title-container {
display: flex;
align-items: center;
.max-tip-icon {
width: 24px;
height: 24px;
}
.tip-title {
color: #1d2129;
font-size: 16px;
line-height: 24px;
font-weight: 400;
margin-left: 16px;
margin-right: 16px;
width: 228px;
}
.max-tip-close-icon {
width: 16px;
height: 16px;
align-self: flex-start;
cursor: pointer;
}
}
.max-page-tip-content {
margin-top: 4px;
padding-left: 40px;
padding-right: 32px;
box-sizing: border-box;
.max-page-content-inner {
color: #1d2129;
font-size: 14px;
line-height: 22px;
}
}
`;
const MaxPageSizeTip = {
name: "maxPageSizeTip",
render(createElement) {
return (
<transition name="fade" mode="out-in" appear>
<maxPageSizeTipContainer vOn:click_stop={this.closeMaxTip.bind()} class="max-page-size-tip">
<maxPageTipContainer vOn:click_stop={""}>
<div class="max-page-tip-inner">
<div class="top-title-container">
<img src={maxTipTitleIcon} alt="" class="max-tip-icon"></img>
<span class="tip-title">数据查询已达到上限</span>
<img src={closeMaxTipIcon} alt="" class="max-tip-close-icon" vOn:click_stop={this.closeMaxTip.bind()}></img>
</div>
<div class="max-page-tip-content">
<div class="max-page-content-inner">
{this.msg}
</div>
</div>
</div>
</maxPageTipContainer>
</maxPageSizeTipContainer>
</transition>
);
},
};
/**
*
* @param {string} msg 展示的信息
* @param {Function} closeHandle 关闭弹窗的回调
* @returns
*/
function showMaxPageSizeTip(msg = "") {
return new Promise((resolve, reject) => {
try {
// 生成构造函数
const maxMsgBox = Vue.extend(MaxPageSizeTip);
// 实例化
const instance = new maxMsgBox({
data() {
return {
msg
};
},
methods: {
// 关闭弹窗
closeMaxTip() {
resolve({
uid: v4(),
done: this.doneHandle
});
},
// 关闭回调
doneHandle() {
// 卸载组件
instance.$destroy();
instance.$el.remove();
}
},
});
// 初始化组件
instance.$mount();
// 添加到body中
document.body.appendChild(instance.$el);
} catch (error) {
reject(error);
}
});
}
export default showMaxPageSizeTip;
import tab from './tab' import tab from './tab';
import auth from './auth' import auth from './auth';
import cache from './cache' import cache from './cache';
import modal from './modal' import modal from './modal';
import download from './download' import download from './download';
import msgBox from "@/components/JsComponents/MaxPageSizeTip.js";
export default { export default {
install(Vue) { install(Vue) {
// 页签操作 // 页签操作
Vue.prototype.$tab = tab Vue.prototype.$tab = tab;
// 认证对象 // 认证对象
Vue.prototype.$auth = auth Vue.prototype.$auth = auth;
// 缓存对象 // 缓存对象
Vue.prototype.$cache = cache Vue.prototype.$cache = cache;
// 模态框对象 // 模态框对象
Vue.prototype.$modal = modal Vue.prototype.$modal = modal;
// 下载文件 // 下载文件
Vue.prototype.$download = download Vue.prototype.$download = download;
// 页码超出限制提示
Vue.prototype.$maxTip = msgBox;
} }
} };
...@@ -2,12 +2,44 @@ ...@@ -2,12 +2,44 @@
* @Author: thy * @Author: thy
* @Date: 2023-10-26 14:56:41 * @Date: 2023-10-26 14:56:41
* @LastEditors: thy * @LastEditors: thy
* @LastEditTime: 2023-10-30 14:26:31 * @LastEditTime: 2023-10-31 09:28:26
* @Description: file content * @Description: file content
* @FilePath: \dsk-operate-ui\src\utils\postMessageBridge\bridge\index.js * @FilePath: \dsk-operate-ui\src\utils\postMessageBridge\bridge\index.js
*/ */
class PostMessageBridge { class PostMessageBridge {
constructor() { // 当前系统
_currenySystem = null;
// 目标系统
_targetSystem = null;
// 目标域
_targetOriginUrl = null;
// 事件调度中心
_eventHandlers = new Map();
/**
*
* @param {{
* currenySystem : Window || undefined;
* targetSystem : Window || undefined;
* targetOriginUrl : string || undefined;
* }} options
*/
constructor(options) {
this._currenySystem = options.currenySystem;
this._targetSystem = options.targetSystem;
this._targetOriginUrl = options.targetOriginUrl || "*";
}
/**
* 订阅消息
* @param {{
* id : string;
* method : string;
* params : object;
* }} messageEvent
*/
receiveMessage(messageEvent) {
} }
} }
\ No newline at end of file
...@@ -7,29 +7,17 @@ ...@@ -7,29 +7,17 @@
</el-tabs> </el-tabs>
<skeleton style="margin-left:16px;" v-if="isSkeleton"></skeleton> <skeleton style="margin-left:16px;" v-if="isSkeleton"></skeleton>
<div class="flex-box clue-box" v-else> <div class="flex-box clue-box" v-else>
<div class="clue-echarts" v-if="viewData.length>0"><div id="echartsClue" style="width: 100%;height:300px; margin: 0 auto;"></div></div> <div class="clue-echarts" v-if="viewData.length>0">
<div id="echartsClue" style="width: 100%;height:300px; margin: 0 auto;"></div>
</div>
<div class="table-item" v-if="viewData.length>0"> <div class="table-item" v-if="viewData.length>0">
<el-table <el-table v-if="viewData.length>0" :data="viewData" border max-height="231" style="width: 100%"
v-if="viewData.length>0" :default-sort="{prop: 'date', order: 'descending'}">
:data="viewData" <el-table-column prop="name" label="名称"></el-table-column>
border <el-table-column prop="value" align="right" label="数量">
max-height="231"
style="width: 100%"
:default-sort = "{prop: 'date', order: 'descending'}"
>
<el-table-column
prop="name"
label="名称"></el-table-column>
<el-table-column
prop="value"
align="right"
label="数量">
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="percent" align="right" label="占比(%)">
prop="percent"
align="right"
label="占比(%)">
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
...@@ -38,71 +26,73 @@ ...@@ -38,71 +26,73 @@
</div> </div>
</div> </div>
<div class="flex-box clue-type"> <div class="flex-box clue-type">
<div class="flex-box clue-type-item" :class="!item.count?'disab':''" v-for="(item, index) in typeList" :key="index" @click="handleType(item, index)"><img :src="!item.count?item.dis_ico:item.ico">{{item.name}}</div> <div class="flex-box clue-type-item" :class="!item.count?'disab':''" v-for="(item, index) in typeList" :key="index"
@click="handleType(item, index)"><img :src="!item.count?item.dis_ico:item.ico">{{item.name}}</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import skeleton from '@/views/project/projectList/component/skeleton' import skeleton from '@/views/project/projectList/component/skeleton';
import {projectTenderDataGroup} from '@/api/detail/party-a/overview' import { projectTenderDataGroup } from '@/api/detail/party-a/overview';
import * as echarts from 'echarts' import * as echarts from 'echarts';
import {changePath} from "@/assets/js/common" import { changePath } from "@/assets/js/common";
import NoData from '../../component/noData' import NoData from '../../component/noData';
export default { export default {
name: 'Busclue', name: 'Busclue',
props: ['companyId', 'statistic'], props: ['companyId', 'statistic'],
components: { components: {
NoData,skeleton NoData, skeleton
}, },
data() { data() {
return { return {
viewData:[], viewData: [],
isSkeleton:true, isSkeleton: true,
activeIndex:0, activeIndex: 0,
typeList:[ typeList: [
{name: '土地交易', pathName: 'landtransaction', ico: require("@/assets/images/detail/overview/clue_ico1.png"), count: 0, category:'global', field:'landInfo', dis_ico: require("@/assets/images/detail/overview/clue_dis_ico1.png")}, { name: '土地交易', pathName: 'landtransaction', ico: require("@/assets/images/detail/overview/clue_ico1.png"), count: 0, category: 'global', field: 'landInfo', dis_ico: require("@/assets/images/detail/overview/clue_dis_ico1.png") },
{name: '拟建项目', pathName: 'proposed', ico: require("@/assets/images/detail/overview/clue_ico2.png"), count: 0, category:'global', field:'proposedProject', dis_ico: require("@/assets/images/detail/overview/clue_dis_ico2.png")}, { name: '拟建项目', pathName: 'proposed', ico: require("@/assets/images/detail/overview/clue_ico2.png"), count: 0, category: 'global', field: 'proposedProject', dis_ico: require("@/assets/images/detail/overview/clue_dis_ico2.png") },
{name: '专项债项目', pathName: 'bond', ico: require("@//assets/images/detail/overview/clue_ico3.png"), count: 0, category:'performance', field:'specialDebt', dis_ico: require("@/assets/images/detail/overview/clue_dis_ico3.png")}, { name: '专项债项目', pathName: 'bond', ico: require("@//assets/images/detail/overview/clue_ico3.png"), count: 0, category: 'performance', field: 'specialDebt', dis_ico: require("@/assets/images/detail/overview/clue_dis_ico3.png") },
{name: '招标计划', pathName: 'biddingplan', ico: require("@/assets/images/detail/overview/clue_ico4.png"), count: 0, category:'performance', field:'bidPlan', dis_ico: require("@/assets/images/detail/overview/clue_dis_ico4.png")}, { name: '招标计划', pathName: 'biddingplan', ico: require("@/assets/images/detail/overview/clue_ico4.png"), count: 0, category: 'performance', field: 'bidPlan', dis_ico: require("@/assets/images/detail/overview/clue_dis_ico4.png") },
{name: '招标公告', pathName: 'announcement', ico: require("@/assets/images/detail/overview/clue_ico5.png"), count: 0, category:'business', field:'biddingAnnouncement', dis_ico: require("@/assets/images/detail/overview/clue_dis_ico5.png")}, { name: '招标公告', pathName: 'announcement', ico: require("@/assets/images/detail/overview/clue_ico5.png"), count: 0, category: 'business', field: 'biddingAnnouncement', dis_ico: require("@/assets/images/detail/overview/clue_dis_ico5.png") },
{name: '标讯Pro', pathName: 'tencent', ico: require("@/assets/images/detail/overview/clue_ico6.png"), count: 0, category:'business', field:'proBiddingAnnouncement', dis_ico: require("@/assets/images/detail/overview/clue_dis_ico6.png")}, { name: '标讯Pro', pathName: 'tencent', ico: require("@/assets/images/detail/overview/clue_ico6.png"), count: 0, category: 'business', field: 'proBiddingAnnouncement', dis_ico: require("@/assets/images/detail/overview/clue_dis_ico6.png") },
{name: '行政许可', pathName: 'administrative', ico: require("@/assets/images/detail/overview/clue_ico7.png"), count: 0, category:'business', field:'adminLicensing', dis_ico: require("@/assets/images/detail/overview/clue_dis_ico7.png")}, { name: '行政许可', pathName: 'administrative', ico: require("@/assets/images/detail/overview/clue_ico7.png"), count: 0, category: 'business', field: 'adminLicensing', dis_ico: require("@/assets/images/detail/overview/clue_dis_ico7.png") },
] ],
} childStatistic: {}
};
}, },
created() { created() {
this.handleQuery() this.handleQuery();
}, },
mounted() { mounted() {
}, },
methods: { methods: {
async handleQuery(){ async handleQuery() {
this.isSkeleton = true; this.isSkeleton = true;
let res = await projectTenderDataGroup({cid: this.companyId, type: this.activeIndex}) let res = await projectTenderDataGroup({ cid: this.companyId, type: this.activeIndex });
if(res.code==200 && res.data){ if (res.code == 200 && res.data) {
this.isSkeleton = false; this.isSkeleton = false;
let data = res.data, totalVal = data.map(item => item.value).reduce((prev, cur) => prev + cur) let data = res.data, totalVal = data.map(item => item.value).reduce((prev, cur) => prev + cur);
this.viewData = data.map(item => { this.viewData = data.map(item => {
let it = {name:item.name, value:item.value, percent:parseFloat(Number(Number(item.value)/Number(totalVal)*100).toFixed(2))} let it = { name: item.name, value: item.value, percent: parseFloat(Number(Number(item.value) / Number(totalVal) * 100).toFixed(2)) };
return it return it;
}) });
if(this.viewData.length>0){ if (this.viewData.length > 0) {
this.$nextTick(() => { this.$nextTick(() => {
this.getDT() this.getDT();
}) });
} }
} }
}, },
getDT(val){ getDT(val) {
let myChart = echarts.init(document.getElementById("echartsClue")), data = val ? val : this.viewData let myChart = echarts.init(document.getElementById("echartsClue")), data = val ? val : this.viewData;
let option = { let option = {
tooltip: { tooltip: {
trigger: 'item', trigger: 'item',
borderWidth:0, borderWidth: 0,
backgroundColor:"rgba(255, 255, 255, 0.8)", backgroundColor: "rgba(255, 255, 255, 0.8)",
formatter: '{b}<br/>{d}%', formatter: '{b}<br/>{d}%',
extraCssText:'width:100px!important;', extraCssText: 'width:100px!important;',
}, },
legend: { legend: {
type: 'scroll', type: 'scroll',
...@@ -123,7 +113,7 @@ export default { ...@@ -123,7 +113,7 @@ export default {
data: data, data: data,
pageButtonPosition: 'end', pageButtonPosition: 'end',
}, },
color: ['#8A82F3','#5B9CF7','#43BBE0','#8ECF95','#FFDC6B'], color: ['#8A82F3', '#5B9CF7', '#43BBE0', '#8ECF95', '#FFDC6B'],
series: [ series: [
{ {
type: 'pie', type: 'pie',
...@@ -149,26 +139,27 @@ export default { ...@@ -149,26 +139,27 @@ export default {
} }
} }
] ]
} };
myChart.setOption(option) myChart.setOption(option);
}, },
handleStatistic() { handleStatistic() {
this.typeList.forEach((item, index) => { this.typeList.forEach((item, index) => {
item.count = this.statistic[item.category]?this.statistic[item.category][item.field]:0 item.count = this.childStatistic[item.category] ? this.childStatistic[item.category][item.field] : 0;
}) });
//this.typeList[2].count = 10 //写死代表有数据,英文统计里面没这项 //this.typeList[2].count = 10 //写死代表有数据,英文统计里面没这项
//this.typeList[3].count = 10 //写死代表有数据,英文统计里面没这项 //this.typeList[3].count = 10 //写死代表有数据,英文统计里面没这项
}, },
handleType(it, idx){ handleType(it, idx) {
if(it.count){ if (it.count) {
changePath(this, it.pathName) changePath(this, it.pathName);
} }
} }
}, },
watch: { watch: {
statistic(newVal, oldVal) { statistic(newVal, oldVal) {
if(newVal){ this.childStatistic = newVal;
this.handleStatistic() if (newVal) {
this.handleStatistic();
} }
} }
} }
...@@ -176,64 +167,64 @@ export default { ...@@ -176,64 +167,64 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.clue-container{ .clue-container {
margin: 0; margin: 0;
padding: 24px 16px; padding: 24px 16px;
background: #FFFFFF; background: #ffffff;
border-radius: 4px; border-radius: 4px;
.selfTab{ .selfTab {
margin: 24px 0 0 -12px; margin: 24px 0 0 -12px;
::v-deep .el-tabs__nav-wrap::after{ ::v-deep .el-tabs__nav-wrap::after {
display: none; display: none;
} }
::v-deep .el-tabs__item{ ::v-deep .el-tabs__item {
height: 30px; height: 30px;
line-height: 30px; line-height: 30px;
padding: 0 12px; padding: 0 12px;
} }
} }
.clue-box{ .clue-box {
width: 100%; width: 100%;
justify-content: space-between; justify-content: space-between;
margin: 8px 0 24px 0; margin: 8px 0 24px 0;
.clue-echarts{ .clue-echarts {
width: calc(50% - 8px); width: calc(50% - 8px);
} }
.busc-no-data{ .busc-no-data {
width: 100%; width: 100%;
} }
.table-item{ .table-item {
width: calc(50% - 8px); width: calc(50% - 8px);
::v-deep .el-table--border .el-table__cell{ ::v-deep .el-table--border .el-table__cell {
border-bottom: 0; border-bottom: 0;
} }
} }
} }
.clue-type{ .clue-type {
width: 100%; width: 100%;
justify-content: space-between; justify-content: space-between;
border-top: 1px solid #EEEEEE; border-top: 1px solid #eeeeee;
padding-top: 22px; padding-top: 22px;
margin-right: -16px; margin-right: -16px;
margin-left: -16px; margin-left: -16px;
padding-left: 16px; padding-left: 16px;
padding-right: 16px; padding-right: 16px;
.clue-type-item{ .clue-type-item {
font-size: 14px; font-size: 14px;
color: #232323; color: #232323;
cursor: pointer; cursor: pointer;
&:hover{ &:hover {
color: #0081FF; color: #0081ff;
} }
&.disab{ &.disab {
color: rgba(35,35,35,0.4); color: rgba(35, 35, 35, 0.4);
} }
img{ img {
width: 40px; width: 40px;
height: 40px; height: 40px;
margin-right: 8px; margin-right: 8px;
} }
} }
} }
} }
</style> </style>
...@@ -6,8 +6,7 @@ ...@@ -6,8 +6,7 @@
<img :src="companyInfo.logoUrl" :alt="companyInfo.companyName" :title="companyInfo.companyName" v-if="companyInfo.logoUrl"> <img :src="companyInfo.logoUrl" :alt="companyInfo.companyName" :title="companyInfo.companyName" v-if="companyInfo.logoUrl">
<span <span
:class="companyInfo.nameSimple&&companyInfo.nameSimple.length<3?'conenctLogo textOne bg'+companyInfo.nameSimple.length:'conenctLogo textTwo bg'+companyInfo.nameSimple.length" :class="companyInfo.nameSimple&&companyInfo.nameSimple.length<3?'conenctLogo textOne bg'+companyInfo.nameSimple.length:'conenctLogo textTwo bg'+companyInfo.nameSimple.length"
v-else-if="companyInfo.nameSimple" v-else-if="companyInfo.nameSimple" v-html="companyInfo.nameSimple"></span>
v-html="companyInfo.nameSimple"></span>
<img :src="require('@/assets/images/detail/overview/logo@2x.png')" :alt="companyInfo.companyName" :title="companyInfo.companyName" v-else> <img :src="require('@/assets/images/detail/overview/logo@2x.png')" :alt="companyInfo.companyName" :title="companyInfo.companyName" v-else>
</div> </div>
<div class="company-title"> <div class="company-title">
...@@ -17,29 +16,27 @@ ...@@ -17,29 +16,27 @@
</div> </div>
<div class="company-tag"> <div class="company-tag">
<div style="float: left;margin-top: 8px;" class="company-history" v-if="companyInfo.historyNames && companyInfo.historyNames.length>0"> <div style="float: left;margin-top: 8px;" class="company-history" v-if="companyInfo.historyNames && companyInfo.historyNames.length>0">
<el-popover <el-popover placement="bottom-start" popper-class="enterpriseLabel-item" trigger="hover">
placement="bottom-start"
popper-class="enterpriseLabel-item"
trigger="hover">
<el-button slot="reference">曾用名 <i class="el-icon-caret-bottom"></i></el-button> <el-button slot="reference">曾用名 <i class="el-icon-caret-bottom"></i></el-button>
<ul class="history-item"> <ul class="history-item">
<li v-for="(item, index) in companyInfo.historyNames" :key="index">{{item.value}}</li> <li v-for="(item, index) in companyInfo.historyNames" :key="index">{{item.value}}</li>
</ul> </ul>
</el-popover> </el-popover>
</div> </div>
<span style="float: left;" :class="!labelArr.includes(companyInfo.businessStatus)?'label-bg1':'label-bg3'" v-if="companyInfo.businessStatus">{{companyInfo.businessStatus}}</span> <span style="float: left;" :class="!labelArr.includes(companyInfo.businessStatus)?'label-bg1':'label-bg3'"
v-if="companyInfo.businessStatus">{{companyInfo.businessStatus}}</span>
<!-- <span style="float: left;" :style="'background:'+item.bgColor+';color:'+item.fontColor" v-for="(item, index) in labelList" :key="index">{{item.labelName}}</span> --> <!-- <span style="float: left;" :style="'background:'+item.bgColor+';color:'+item.fontColor" v-for="(item, index) in labelList" :key="index">{{item.labelName}}</span> -->
<template v-if="enterpriseLabel.length > 0"> <template v-if="enterpriseLabel.length > 0">
<template v-for="(item,index) in enterpriseLabel"> <template v-for="(item,index) in enterpriseLabel">
<template v-if="item.children.length > 0"> <template v-if="item.children.length > 0">
<div class="enterpriseLabel-highTech company-highTech"> <div class="enterpriseLabel-highTech company-highTech">
<el-popover <el-popover placement="bottom-start" popper-class="enterpriseLabel-item" trigger="hover">
placement="bottom-start" <el-button slot="reference"
popper-class="enterpriseLabel-item" :style="'background:'+item.bgColor+';color:'+item.fontColor+';border:1px solid '+item.bgColor+';margin: 0;'">{{item.labelName}}
trigger="hover"> <span>{{ item.children.length }}</span><i class="el-icon-arrow-right"></i></el-button>
<el-button slot="reference" :style="'background:'+item.bgColor+';color:'+item.fontColor+';border:1px solid '+item.bgColor+';margin: 0;'">{{item.labelName}} <span>{{ item.children.length }}</span><i class="el-icon-arrow-right"></i></el-button>
<p class="highTech-item"> <p class="highTech-item">
<span v-for="(v,i) in item.children" :key="i" class="enterpriseLabel-children-span" :style="i==item.children.length-1?'':'border-right: 1px solid #E1E1E1;padding-right: 8px;margin-right: 8px;'">{{ v.labelName }}</span> <span v-for="(v,i) in item.children" :key="i" class="enterpriseLabel-children-span"
:style="i==item.children.length-1?'':'border-right: 1px solid #E1E1E1;padding-right: 8px;margin-right: 8px;'">{{ v.labelName }}</span>
</p> </p>
</el-popover> </el-popover>
</div> </div>
...@@ -47,17 +44,16 @@ ...@@ -47,17 +44,16 @@
<template v-else> <template v-else>
<template v-if="item.remark"> <template v-if="item.remark">
<div class="enterpriseLabel-highTech company-highTech"> <div class="enterpriseLabel-highTech company-highTech">
<el-popover <el-popover width="280" placement="bottom-start" popper-class="enterpriseLabel-item" trigger="hover">
width="280" <el-button slot="reference"
placement="bottom-start" :style="'background:'+item.bgColor+';color:'+item.fontColor+';border:1px solid '+item.bgColor+';margin: 0;'">{{item.labelName}}
popper-class="enterpriseLabel-item" <i class="el-icon-arrow-down"></i></el-button>
trigger="hover">
<el-button slot="reference" :style="'background:'+item.bgColor+';color:'+item.fontColor+';border:1px solid '+item.bgColor+';margin: 0;'">{{item.labelName}} <i class="el-icon-arrow-down"></i></el-button>
<p class="highTech-item" style="margin-bottom: 8px">{{item.remark}}</p> <p class="highTech-item" style="margin-bottom: 8px">{{item.remark}}</p>
</el-popover> </el-popover>
</div> </div>
</template> </template>
<span v-else class="enterpriseLabel-span" :style="{'background':item.bgColor,'color':item.fontColor,'cursor':item.linkUri ? 'pointer' : ''}">{{item.labelName}}</span> <span v-else class="enterpriseLabel-span"
:style="{'background':item.bgColor,'color':item.fontColor,'cursor':item.linkUri ? 'pointer' : ''}">{{item.labelName}}</span>
</template> </template>
</template> </template>
</template> </template>
...@@ -65,8 +61,10 @@ ...@@ -65,8 +61,10 @@
</div> </div>
</div> </div>
<div class="company-menu"> <div class="company-menu">
<el-button v-if="companyInfo.claimStatus==0" @click="cancelClaimClick()" class="hasClaim"><i class="el-ico-claim" alt="已认领" title="已认领"></i> 已认领</el-button> <el-button v-if="companyInfo.claimStatus==0" @click="cancelClaimClick()" class="hasClaim"><i class="el-ico-claim" alt="已认领" title="已认领"></i>
<el-button @click="handleClaim" v-else class="claim" v-loading="claimLoading"><i class="el-ico-claim" alt="认领客户" title="认领客户"></i> 认领客户</el-button> 已认领</el-button>
<el-button @click="handleClaim" v-else class="claim" v-loading="claimLoading"><i class="el-ico-claim" alt="认领客户" title="认领客户"></i>
认领客户</el-button>
</div> </div>
<div class="company-info"> <div class="company-info">
...@@ -79,14 +77,14 @@ ...@@ -79,14 +77,14 @@
<div class="flex-box item"><label>成立日期:</label><span class="text-cl1">{{companyInfo.registeredDate || '--'}}</span></div> <div class="flex-box item"><label>成立日期:</label><span class="text-cl1">{{companyInfo.registeredDate || '--'}}</span></div>
<div class="flex-box item"><label>类型:</label><span class="text-cl1">{{companyInfo.econKind || '--'}}</span></div> <div class="flex-box item"><label>类型:</label><span class="text-cl1">{{companyInfo.econKind || '--'}}</span></div>
<div class="flex-box item"><label>注册地址:</label><span class="text-cl1">{{companyInfo.addressDetail || '--'}}</span></div> <div class="flex-box item"><label>注册地址:</label><span class="text-cl1">{{companyInfo.addressDetail || '--'}}</span></div>
<!-- <div class="item"><label>企业邮箱:</label><span>{{companyInfo.regCapital || '&#45;&#45;'}}</span></div>--> <!-- <div class="item"><label>企业邮箱:</label><span>{{companyInfo.regCapital || '&#45;&#45;'}}</span></div>-->
</div> </div>
<div class="info-item flex-box"> <div class="info-item flex-box">
<!-- <div class="item"><label>官网:</label><span>{{companyInfo.regCapital || '&#45;&#45;'}}</span></div>--> <!-- <div class="item"><label>官网:</label><span>{{companyInfo.regCapital || '&#45;&#45;'}}</span></div>-->
<div class="flex-box item item-line"><label>通信地址:</label><span class="text-cl1">{{companyInfo.addressDetail || '--'}}</span></div> <div class="flex-box item item-line"><label>通信地址:</label><span class="text-cl1">{{companyInfo.addressDetail || '--'}}</span></div>
</div> </div>
<div class="info-item flex-box" > <div class="info-item flex-box">
<div class="flex-box item item-line" > <div class="flex-box item item-line">
<span ref="companyQybj" class="text-cl1" :class="showMore&&showState?'item-all':'item-more'"> <span ref="companyQybj" class="text-cl1" :class="showMore&&showState?'item-all':'item-more'">
<label>企业背景:</label>{{companyInfo.introduction || ''}} <label>企业背景:</label>{{companyInfo.introduction || ''}}
</span> </span>
...@@ -98,19 +96,20 @@ ...@@ -98,19 +96,20 @@
<div class="swiper-containers swiper-info" :style="graphList.length<=6?'margin-left:0px; width: 100%;':''"> <div class="swiper-containers swiper-info" :style="graphList.length<=6?'margin-left:0px; width: 100%;':''">
<ul class="swiper-wrapper"> <ul class="swiper-wrapper">
<template v-for="(item, index) in graphList" > <template v-for="(item, index) in graphList">
<li class="swiper-slide" :key="index"> <li class="swiper-slide" :key="index">
<div class="flex-box" v-if="item.id==0" @click="linkTo(statistic.combineMember)"> <div class="flex-box" v-if="item.id==0" @click="linkTo(childStatistic.combineMember)">
<img :src="`${item.ico}`" :alt="item.name" :title="item.name" class="swiper-img"> <img :src="`${item.ico}`" :alt="item.name" :title="item.name" class="swiper-img">
<div class="swiper-item" > <div class="swiper-item">
<el-popover v-if="statistic.combineMember.companyName.length>9" trigger="hover" :content="'所属集团-'+statistic.combineMember.companyName"> <el-popover v-if="childStatistic.combineMember.companyName.length>9" trigger="hover"
:content="'所属集团-'+childStatistic.combineMember.companyName">
<span class="swiper-name" slot="reference"> <span class="swiper-name" slot="reference">
所属集团-{{ statistic.combineMember.companyName }} 所属集团-{{ childStatistic.combineMember.companyName }}
</span> </span>
</el-popover> </el-popover>
<span v-else class="swiper-name">所属集团-{{statistic.combineMember.companyName}}</span> <span v-else class="swiper-name">所属集团-{{childStatistic.combineMember.companyName}}</span>
<div > <div>
<span >集团成员:</span><i class="num" >{{statistic.combineMember.memberNum}}</i> <span>集团成员:</span><i class="num">{{childStatistic.combineMember.memberNum}}</i>
</div> </div>
</div> </div>
</div> </div>
...@@ -122,7 +121,8 @@ ...@@ -122,7 +121,8 @@
</span> </span>
<template v-for="(it, idx) in item.intro"> <template v-for="(it, idx) in item.intro">
<div :key="idx" @click.stop="handleGraphChild(item, it)"> <div :key="idx" @click.stop="handleGraphChild(item, it)">
<span v-html="it.name"></span> <i :class="[idx!=item.intro.length-1?'num':'']" :style="it.val>0?'':{color: '#999999',cursor: 'not-allowed'}">{{it.val}}</i> <span v-html="it.name"></span> <i :class="[idx!=item.intro.length-1?'num':'']"
:style="it.val>0?'':{color: '#999999',cursor: 'not-allowed'}">{{it.val}}</i>
</div> </div>
</template> </template>
</div> </div>
...@@ -136,13 +136,7 @@ ...@@ -136,13 +136,7 @@
</div> </div>
<!-- 分条件:滚动与不滚动 --> <!-- 分条件:滚动与不滚动 -->
</div> </div>
<el-dialog <el-dialog title="" :visible.sync="dialogVisible" :modal="false" custom-class='dialog-renlin' :show-close="false" width="244px">
title=""
:visible.sync="dialogVisible"
:modal="false"
custom-class='dialog-renlin'
:show-close="false"
width="244px">
<span>认领成功,是否完善客户信息?</span> <span>认领成功,是否完善客户信息?</span>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<span class="dialog-footer-btn1" type="primary" @click="renlin()">立即完善</span> <span class="dialog-footer-btn1" type="primary" @click="renlin()">立即完善</span>
...@@ -156,16 +150,10 @@ ...@@ -156,16 +150,10 @@
<span class="dialog-footer-btn2" @click="dialogVisible2 = false">关闭</span> <span class="dialog-footer-btn2" @click="dialogVisible2 = false">关闭</span>
</div> </div>
</el-dialog> </el-dialog>
<el-dialog <el-dialog title="取消认领" :visible.sync="dialogVisible1" :modal="false" custom-class='dialog-renlin' :show-close="false" width="344px">
title="取消认领"
:visible.sync="dialogVisible1"
:modal="false"
custom-class='dialog-renlin'
:show-close="false"
width="344px">
<span>是否取消认领客户?客户信息将放入“历史客户”。</span> <span>是否取消认领客户?客户信息将放入“历史客户”。</span>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<span class="dialog-footer-btn1" type="primary" @click="confirm()" > <span class="dialog-footer-btn1" type="primary" @click="confirm()">
确认 确认
</span> </span>
<span class="dialog-footer-btn2" @click="dialogVisible1 = false">关闭</span> <span class="dialog-footer-btn2" @click="dialogVisible1 = false">关闭</span>
...@@ -175,91 +163,92 @@ ...@@ -175,91 +163,92 @@
</template> </template>
<script> <script>
import ClipboardJS from 'clipboard' import ClipboardJS from 'clipboard';
import { changePath,encodeStr } from '@/assets/js/common' import { changePath, encodeStr } from '@/assets/js/common';
var Swiper = require('@/assets/lib/swiper/swiper-bundle.min.js') var Swiper = require('@/assets/lib/swiper/swiper-bundle.min.js');
import "@/assets/lib/swiper/swiper-bundle.css" import "@/assets/lib/swiper/swiper-bundle.css";
import { claim } from "@/api/common" import { claim } from "@/api/common";
import api from "@/api/enterpriseData/enterpriseData.js" import api from "@/api/enterpriseData/enterpriseData.js";
export default { export default {
name: 'Infoheader', name: 'Infoheader',
props: ['companyId', 'companyInfo', 'statistic'], props: ['companyId', 'companyInfo', 'statistic'],
data() { data() {
return { return {
encodeStr, encodeStr,
ifShow:false, ifShow: false,
newStatic: null, newStatic: null,
labelList: [], //企业标签 labelList: [], //企业标签
customerId:'', customerId: '',
claimLoading: false, claimLoading: false,
ifClaim: 0, //是否认领 ifClaim: 0, //是否认领
showMore: false, showMore: false,
showState: false, showState: false,
graphList: [ graphList: [
{id: 1, name:'业务往来', isShow:true, intro:[{id: 101, name:'客户', val:0, category:'global', field:'customer'},{id: 102, name:'供应商', val:0, category:'global', field:'supplier'}], ico:require('@/assets/images/detail/overview/company_ywwl.png')}, { id: 1, name: '业务往来', isShow: true, intro: [{ id: 101, name: '客户', val: 0, category: 'global', field: 'customer' }, { id: 102, name: '供应商', val: 0, category: 'global', field: 'supplier' }], ico: require('@/assets/images/detail/overview/company_ywwl.png') },
{id: 2, name:'商机线索', isShow:true, intro:[{id: 201, name:'专项债项目', val:0, category:'performance', field:'specialDebt'},{id: 202, name:'招标计划', val:0, category:'performance', field:'bidPlan'}], ico:require('@/assets/images/detail/overview/company_sjxs.png')}, { id: 2, name: '商机线索', isShow: true, intro: [{ id: 201, name: '专项债项目', val: 0, category: 'performance', field: 'specialDebt' }, { id: 202, name: '招标计划', val: 0, category: 'performance', field: 'bidPlan' }], ico: require('@/assets/images/detail/overview/company_sjxs.png') },
{id: 3, name:'城投拿地', isShow:true, intro:[{id: 301, name:'土地交易', val:0, category:'global', field:'landInfo'},{id: 302, name:'行政许可', val:0, category:'business', field:'adminLicensing'}], ico:require('@/assets/images/detail/overview/company_ctnd.png')}, { id: 3, name: '城投拿地', isShow: true, intro: [{ id: 301, name: '土地交易', val: 0, category: 'global', field: 'landInfo' }, { id: 302, name: '行政许可', val: 0, category: 'business', field: 'adminLicensing' }], ico: require('@/assets/images/detail/overview/company_ctnd.png') },
{id: 4, name:'对外投资', isShow:true, intro:[{id: 401, name:'企业经营实力展现'}], ico:require('@/assets/images/detail/overview/company_dwtz.png')}, { id: 4, name: '对外投资', isShow: true, intro: [{ id: 401, name: '企业经营实力展现' }], ico: require('@/assets/images/detail/overview/company_dwtz.png') },
{id: 5, name:'股权穿透', isShow:true, intro:[{id: 501, name:'瞬息掌握企业关系'}], ico:require('@/assets/images/detail/overview/company_gqct.png')}, { id: 5, name: '股权穿透', isShow: true, intro: [{ id: 501, name: '瞬息掌握企业关系' }], ico: require('@/assets/images/detail/overview/company_gqct.png') },
{id: 6, name:'企业架构', isShow:true, intro:[{id: 601, name:'企业架构关联图'}], ico:require('@/assets/images/detail/overview/company_qyjg.png')}, { id: 6, name: '企业架构', isShow: true, intro: [{ id: 601, name: '企业架构关联图' }], ico: require('@/assets/images/detail/overview/company_qyjg.png') },
{id: 7, name:'工商信息', isShow:true, intro:[{id: 701, name:'企业基础工商登记信息'}], ico:require('@/assets/images/detail/overview/company_gsxx.png')} { id: 7, name: '工商信息', isShow: true, intro: [{ id: 701, name: '企业基础工商登记信息' }], ico: require('@/assets/images/detail/overview/company_gsxx.png') }
], //企业链图 ], //企业链图
//风险扫描 //风险扫描
labelArr:['失信联合惩戒企业','司法纠纷','注销'], //负向经营状态 labelArr: ['失信联合惩戒企业', '司法纠纷', '注销'], //负向经营状态
enterpriseLabel:[],//企业标签 enterpriseLabel: [],//企业标签
dialogVisible: false, dialogVisible: false,
dialogVisible1: false, dialogVisible1: false,
dialogVisible2: false, dialogVisible2: false,
} childStatistic: this.statistic
};
}, },
created() { created() {
}, },
mounted() { mounted() {
this.handleWidth() //企业背景是否收起 this.handleWidth(); //企业背景是否收起
if(this.statistic.combineMember){ if (this.childStatistic.combineMember) {
this.graphList.unshift({ this.graphList.unshift({
id:0,name:'所属集团-'+this.statistic.combineMember.companyName,isShow:true,intro:[],ico:require('@/assets/images/detail/overview/company_ssjt.png') id: 0, name: '所属集团-' + this.childStatistic.combineMember.companyName, isShow: true, intro: [], ico: require('@/assets/images/detail/overview/company_ssjt.png')
}) });
} }
this.companySwiper() //swiper滚动板块 this.companySwiper(); //swiper滚动板块
api.label({companyId:this.companyId}).then(res=>{ api.label({ companyId: this.companyId }).then(res => {
if(res.code==200){ if (res.code == 200) {
this.enterpriseLabel = res.data this.enterpriseLabel = res.data;
} }
}) });
}, },
methods: { methods: {
//认领 //认领
async handleClaim(){ async handleClaim() {
let res = await api.customerStatus(this.companyInfo.companyName) let res = await api.customerStatus(this.companyInfo.companyName);
if(res.data === 1){ if (res.data === 1) {
this.claimLoading = false this.claimLoading = false;
this.dialogVisible2=true; this.dialogVisible2 = true;
}else{ } else {
if(this.companyInfo.uipId){ if (this.companyInfo.uipId) {
this.claimLoading = true this.claimLoading = true;
let param = { let param = {
companyId:this.companyId, companyId: this.companyId,
uipId:this.companyInfo.uipId, uipId: this.companyInfo.uipId,
companyName:this.companyInfo.companyName, companyName: this.companyInfo.companyName,
creditLevel:this.companyInfo.bratingSubjectLevel || '', creditLevel: this.companyInfo.bratingSubjectLevel || '',
legalPerson:this.companyInfo.corporatePerson || '', legalPerson: this.companyInfo.corporatePerson || '',
registerCapital:this.companyInfo.registeredCapital || '', registerCapital: this.companyInfo.registeredCapital || '',
provinceId:this.companyInfo.provinceId || '', provinceId: this.companyInfo.provinceId || '',
cityId:this.companyInfo.cityId || '', cityId: this.companyInfo.cityId || '',
districtId:this.companyInfo.districtCode || '', districtId: this.companyInfo.districtCode || '',
registerAddress:this.companyInfo.provinceName+(this.companyInfo.cityName?'-'+this.companyInfo.cityName:'')+(this.companyInfo.districtName?'-'+this.companyInfo.districtName:''), registerAddress: this.companyInfo.provinceName + (this.companyInfo.cityName ? '-' + this.companyInfo.cityName : '') + (this.companyInfo.districtName ? '-' + this.companyInfo.districtName : ''),
creditCode:this.companyInfo.creditCode creditCode: this.companyInfo.creditCode
} };
let res = await claim(param) let res = await claim(param);
this.claimLoading = false this.claimLoading = false;
if(res.code==200){ if (res.code == 200) {
this.dialogVisible=true this.dialogVisible = true;
this.companyInfo.claimStatus = 0 this.companyInfo.claimStatus = 0;
this.customerId = res.data.customerId this.customerId = res.data.customerId;
} }
}else{ } else {
this.$message.warning('对不起,当前不能认领') this.$message.warning('对不起,当前不能认领');
} }
} }
}, },
...@@ -268,32 +257,32 @@ export default { ...@@ -268,32 +257,32 @@ export default {
this.$modal.msgSuccess("复制成功"); this.$modal.msgSuccess("复制成功");
}, },
//取消认领 //取消认领
cancelClaimClick(){ cancelClaimClick() {
this.dialogVisible1 = true; this.dialogVisible1 = true;
}, },
async handleHistoryClaim(){ async handleHistoryClaim() {
let res = await api.historyClaim(this.companyInfo.companyName) let res = await api.historyClaim(this.companyInfo.companyName);
if(res.code==200){ if (res.code == 200) {
this.dialogVisible2 = false; this.dialogVisible2 = false;
this.companyInfo.claimStatus = 0 this.companyInfo.claimStatus = 0;
}else{ } else {
this.$message.error(res.msg) this.$message.error(res.msg);
} }
}, },
async confirm(){ async confirm() {
let res = await api.cancelClaim(this.companyInfo.companyName) let res = await api.cancelClaim(this.companyInfo.companyName);
if(res.code==200){ if (res.code == 200) {
this.dialogVisible1 = false; this.dialogVisible1 = false;
this.companyInfo.claimStatus = 1 this.companyInfo.claimStatus = 1;
}else{ } else {
this.$message.error(res.msg) this.$message.error(res.msg);
} }
// api.cancelClaim(this.companyInfo.companyName).then(res=>{ // api.cancelClaim(this.companyInfo.companyName).then(res=>{
// }) // })
}, },
companySwiper(){ companySwiper() {
new Swiper('.swiper-info', { new Swiper('.swiper-info', {
slidesPerView: 6, slidesPerView: 6,
// 设置点击箭头 // 设置点击箭头
...@@ -301,122 +290,123 @@ export default { ...@@ -301,122 +290,123 @@ export default {
nextEl: '.swiper-info-next', nextEl: '.swiper-info-next',
prevEl: '.swiper-info-prev', prevEl: '.swiper-info-prev',
} }
}) });
}, },
getCompanyInfo(){ getCompanyInfo() {
if(this.companyInfo.historyNames && typeof this.companyInfo.historyNames=='string'){ //曾用名) if (this.companyInfo.historyNames && typeof this.companyInfo.historyNames == 'string') { //曾用名)
this.companyInfo.historyNames = JSON.parse(this.companyInfo.historyNames) this.companyInfo.historyNames = JSON.parse(this.companyInfo.historyNames);
} }
}, },
handleStatistic() { handleStatistic() {
this.graphList.forEach((item, index) => { this.graphList.forEach((item, index) => {
let number = null let number = null;
if(item.intro){ if (item.intro) {
item.intro.forEach((it, idx) => { item.intro.forEach((it, idx) => {
if(it.category || it.field){ if (it.category || it.field) {
it.val = this.statistic[it.category]?this.statistic[it.category][it.field]:0 it.val = this.childStatistic[it.category] ? this.childStatistic[it.category][it.field] : 0;
number +=it.val number += it.val;
} }
}) });
} }
if(number===0){ if (number === 0) {
item.isShow = false item.isShow = false;
} }
}) });
this.graphList = this.graphList.filter(item => item.isShow) this.graphList = this.graphList.filter(item => item.isShow);
if(this.statistic.combineMember){ if (this.childStatistic.combineMember) {
this.graphList.unshift({ this.graphList.unshift({
id:0,name:'所属集团-'+this.statistic.combineMember.companyName,isShow:true,intro:[],ico:require('@/assets/images/detail/overview/company_ssjt.png') id: 0, name: '所属集团-' + this.childStatistic.combineMember.companyName, isShow: true, intro: [], ico: require('@/assets/images/detail/overview/company_ssjt.png')
}) });
} }
this.companySwiper() //swiper滚动板块 this.companySwiper(); //swiper滚动板块
}, },
//获取认领状态 //获取认领状态
getClaimStatus(){ getClaimStatus() {
this.ifClaim = this.companyInfo.claimStatus this.ifClaim = this.companyInfo.claimStatus;
}, },
handleWidth(){ handleWidth() {
if(this.companyInfo.introduction){ if (this.companyInfo.introduction) {
this.$nextTick(() => { this.$nextTick(() => {
this.showMore = this.$refs.companyQybj.scrollWidth - this.$refs.companyQybj.clientWidth this.showMore = this.$refs.companyQybj.scrollWidth - this.$refs.companyQybj.clientWidth;
}) });
} }
}, },
handleDetail(){ handleDetail() {
this.showState = !this.showState this.showState = !this.showState;
}, },
jumpToLt(item){ jumpToLt(item) {
this.$router.push({ path: '/structure/graph', query: {eid:this.companyInfo.eid, typeId:item.id} }) this.$router.push({ path: '/structure/graph', query: { eid: this.companyInfo.eid, typeId: item.id } });
}, },
//swiper项点击 //swiper项点击
handleGraph(item,it){ handleGraph(item, it) {
switch (item.id) { switch (item.id) {
case 4: case 4:
changePath(this, 'overseas') changePath(this, 'overseas');
break break;
case 5: case 5:
this.jumpToLt(item) this.jumpToLt(item);
break break;
case 6: case 6:
this.jumpToLt(item) this.jumpToLt(item);
break break;
case 7: case 7:
changePath(this, 'businfo') changePath(this, 'businfo');
break break;
} }
}, },
linkTo(item){ linkTo(item) {
this.$router.push({path:`/groupAccount/${item.companyId}?name=${item.companyName}`}) this.$router.push({ path: `/groupAccount/${item.companyId}?name=${item.companyName}` });
}, },
//swiper子项点击 //swiper子项点击
handleGraphChild(item, it){ handleGraphChild(item, it) {
if(it.id==101 && it.val){ if (it.id == 101 && it.val) {
changePath(this, 'custom') changePath(this, 'custom');
} }
if(it.id==102 && it.val){ if (it.id == 102 && it.val) {
changePath(this, 'supplier') changePath(this, 'supplier');
} }
if(it.id==201 && it.val){ if (it.id == 201 && it.val) {
changePath(this, 'bond') changePath(this, 'bond');
} }
if(it.id==202 && it.val){ if (it.id == 202 && it.val) {
changePath(this, 'biddingplan') changePath(this, 'biddingplan');
} }
if(it.id==301 && it.val){ if (it.id == 301 && it.val) {
changePath(this, 'landtransaction') changePath(this, 'landtransaction');
} }
if(it.id==302 && it.val){ if (it.id == 302 && it.val) {
changePath(this, 'administrative') changePath(this, 'administrative');
} }
}, },
renlin(){ renlin() {
this.dialogVisible=false; this.dialogVisible = false;
// window.location.href = window.location.origin+window.location.pathname+'?customerId='+this.customerId+'&path=business' // window.location.href = window.location.origin+window.location.pathname+'?customerId='+this.customerId+'&path=business'
this.$router.replace({ this.$router.replace({
path: '/enterprise/'+encodeStr(this.companyId), path: '/enterprise/' + encodeStr(this.companyId),
query: { query: {
'customerId': this.customerId, 'customerId': this.customerId,
'path':'business' 'path': 'business'
} , },
}) });
this.$nextTick(()=>{ this.$nextTick(() => {
this.$tab.refreshPage(); this.$tab.refreshPage();
}) });
// 跳转地址 // 跳转地址
}, },
renHide(){ renHide() {
this.dialogVisible=false; this.dialogVisible = false;
} }
}, },
watch: { watch: {
companyInfo(newVal, oldVal) { companyInfo(newVal, oldVal) {
this.getCompanyInfo() //处理曾用名 this.getCompanyInfo(); //处理曾用名
this.handleWidth() this.handleWidth();
this.getClaimStatus() //获取企业认领状态 this.getClaimStatus(); //获取企业认领状态
}, },
statistic(newVal, oldVal) { statistic(newVal, oldVal) {
if(newVal){ if (newVal) {
this.handleStatistic() this.childStatistic = newVal;
this.handleStatistic();
} }
} }
} }
...@@ -424,33 +414,33 @@ export default { ...@@ -424,33 +414,33 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.info-container{ .info-container {
margin: 0; margin: 0;
padding: 24px 16px 10px 16px; padding: 24px 16px 10px 16px;
background: #FFFFFF; background: #ffffff;
border-radius: 4px; border-radius: 4px;
.company-swiper{ .company-swiper {
position: relative; position: relative;
.swiper-info{ .swiper-info {
width: calc(100% - 38px); width: calc(100% - 38px);
height: 56px; height: 56px;
margin-top: 13px; margin-top: 13px;
margin-left: 25px; margin-left: 25px;
overflow: hidden; overflow: hidden;
.swiper-slide{ .swiper-slide {
min-width: 242px; min-width: 242px;
padding: 7px 4px 9px 0; padding: 7px 4px 9px 0;
box-sizing: border-box; box-sizing: border-box;
&.swiper-disn{ &.swiper-disn {
display: none; display: none;
} }
>div{ > div {
width: 100%; width: 100%;
height: 100%; height: 100%;
cursor: pointer; cursor: pointer;
align-items: normal; align-items: normal;
.swiper-item{ .swiper-item {
.swiper-name{ .swiper-name {
display: block; display: block;
font-size: 14px; font-size: 14px;
color: #232323; color: #232323;
...@@ -459,23 +449,23 @@ export default { ...@@ -459,23 +449,23 @@ export default {
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
} }
div{ div {
display: inline-block; display: inline-block;
font-size: 12px; font-size: 12px;
padding-top: 3px; padding-top: 3px;
span{ span {
color: #232323; color: #232323;
} }
i{ i {
font-style: normal; font-style: normal;
color: #0081FF; color: #0081ff;
&.num{ &.num {
margin-right: 8px; margin-right: 8px;
} }
} }
} }
} }
.swiper-img{ .swiper-img {
width: 40px; width: 40px;
height: 40px; height: 40px;
margin-right: 6px; margin-right: 6px;
...@@ -483,93 +473,94 @@ export default { ...@@ -483,93 +473,94 @@ export default {
} }
} }
} }
.swiper-info-prev, .swiper-info-next{ .swiper-info-prev,
.swiper-info-next {
width: 16px; width: 16px;
height: 40px; height: 40px;
background: #F0F5FC; background: #f0f5fc;
top: 8px; top: 8px;
margin-top: 0; margin-top: 0;
&.swiper-button-disabled{ &.swiper-button-disabled {
opacity: 1; opacity: 1;
color:#AAAAAA; color: #aaaaaa;
background: #F5F5F5; background: #f5f5f5;
} }
i{ i {
color: #AAAAAA; color: #aaaaaa;
} }
&:hover i{ &:hover i {
color:#667199; color: #667199;
} }
&:after{ &:after {
content: ""; content: "";
} }
} }
} }
.company-box{ .company-box {
width: 100%; width: 100%;
position: relative; position: relative;
.company-nav{ .company-nav {
align-items: normal; align-items: normal;
.company-left{ .company-left {
width: 64px; width: 64px;
height: 64px; height: 64px;
margin-right: 12px; margin-right: 12px;
flex-shrink: 0; flex-shrink: 0;
img{ img {
width: 100%; width: 100%;
height: 100%; height: 100%;
border-radius: 4px; border-radius: 4px;
overflow: hidden; overflow: hidden;
} }
.conenctLogo{ .conenctLogo {
width: 100%; width: 100%;
height: 100%; height: 100%;
color: #FFFFFF; color: #ffffff;
border-radius: 4px; border-radius: 4px;
overflow: hidden; overflow: hidden;
text-align: center; text-align: center;
display: block; display: block;
&.textOne{ &.textOne {
font-size: 18px; font-size: 18px;
line-height: 64px; line-height: 64px;
} }
&.textTwo{ &.textTwo {
font-size: 18px; font-size: 18px;
padding: 9px 10px; padding: 9px 10px;
line-height: 24px; line-height: 24px;
} }
&.bg1{ &.bg1 {
background: #99BE81; background: #99be81;
} }
&.bg2{ &.bg2 {
background: #76B4D4; background: #76b4d4;
} }
&.bg3{ &.bg3 {
background: #7A91D9; background: #7a91d9;
} }
&.bg4{ &.bg4 {
background: #8F8DD2; background: #8f8dd2;
} }
&.bg5{ &.bg5 {
background: #C4A89F; background: #c4a89f;
} }
} }
p{ p {
font-size: 12px; font-size: 12px;
color: #999999; color: #999999;
text-align: center; text-align: center;
margin-top: 7px; margin-top: 7px;
} }
} }
.company-title{ .company-title {
.company-name{ .company-name {
font-size: 20px; font-size: 20px;
color: #000000; color: #000000;
font-weight: bold; font-weight: bold;
margin-right: 100px; margin-right: 100px;
cursor: pointer; cursor: pointer;
align-items: center; align-items: center;
span{ span {
width: 44px; width: 44px;
height: 22px; height: 22px;
font-size: 12px; font-size: 12px;
...@@ -578,76 +569,77 @@ export default { ...@@ -578,76 +569,77 @@ export default {
text-align: center; text-align: center;
font-weight: 400; font-weight: 400;
display: inline-block; display: inline-block;
border: 1px solid #EEEEEE; border: 1px solid #eeeeee;
border-radius: 2px; border-radius: 2px;
cursor: pointer; cursor: pointer;
margin-left: 16px; margin-left: 16px;
&:hover{ &:hover {
background: #E9F4FF; background: #e9f4ff;
color: #0081FF; color: #0081ff;
border: 1px solid #0081FF; border: 1px solid #0081ff;
} }
} }
} }
.company-tag{ .company-tag {
overflow: hidden; overflow: hidden;
font-size: 12px; font-size: 12px;
padding: 2px 0 10px 0; padding: 2px 0 10px 0;
::v-deep .enterpriseLabel-item{ ::v-deep .enterpriseLabel-item {
padding: 0; padding: 0;
//width: 100%; //width: 100%;
max-width: 276px; max-width: 276px;
margin-top: 8px !important; margin-top: 8px !important;
.highTech-item{ .highTech-item {
padding: 10px 12px 0; padding: 10px 12px 0;
font-size: 12px; font-size: 12px;
color: #333333; color: #333333;
.enterpriseLabel-children-span{ .enterpriseLabel-children-span {
display: inline-block; display: inline-block;
padding-right: 8px; padding-right: 8px;
margin-right: 8px; margin-right: 8px;
margin-bottom: 8px; margin-bottom: 8px;
border-right: 1px solid #E1E1E1; border-right: 1px solid #e1e1e1;
//cursor:pointer; //cursor:pointer;
} }
.enterpriseLabel-children-span:last-child{ .enterpriseLabel-children-span:last-child {
padding-right: 0; padding-right: 0;
margin-right: 0; margin-right: 0;
border-right: 0; border-right: 0;
} }
} }
} }
.company-history, .company-highTech{ .company-history,
.company-highTech {
display: inline-block; display: inline-block;
height: 22px; height: 22px;
background: #EFEFEF; background: #efefef;
border-radius: 2px; border-radius: 2px;
margin-right: 8px; margin-right: 8px;
margin-left: 0; margin-left: 0;
button{ button {
height: 22px; height: 22px;
line-height: 22px; line-height: 22px;
font-size: 12px; font-size: 12px;
padding: 0 8px; padding: 0 8px;
background: #EFEFEF; background: #efefef;
color: #838383; color: #838383;
border: 1px solid #EFEFEF; border: 1px solid #efefef;
border-radius: 2px; border-radius: 2px;
} }
} }
.company-highTech{ .company-highTech {
button{ button {
background: #DFEAFE; background: #dfeafe;
color: #0065F9; color: #0065f9;
} }
} }
.enterpriseLabel-highTech{ .enterpriseLabel-highTech {
background: #ffffff; background: #ffffff;
margin-top: 8px; margin-top: 8px;
margin-right: 8px; margin-right: 8px;
float: left; float: left;
} }
>span{ > span {
display: inline-block; display: inline-block;
height: 22px; height: 22px;
line-height: 22px; line-height: 22px;
...@@ -655,11 +647,11 @@ export default { ...@@ -655,11 +647,11 @@ export default {
border-radius: 2px; border-radius: 2px;
margin-right: 8px; margin-right: 8px;
margin-top: 8px; margin-top: 8px;
&:last-child{ &:last-child {
margin-right: 0; margin-right: 0;
} }
} }
.enterpriseLabel-span{ .enterpriseLabel-span {
display: inline-block; display: inline-block;
height: 22px; height: 22px;
line-height: 22px; line-height: 22px;
...@@ -669,60 +661,63 @@ export default { ...@@ -669,60 +661,63 @@ export default {
margin-top: 8px; margin-top: 8px;
float: left; float: left;
} }
.label-bg1{ .label-bg1 {
background: #ECF6E7; background: #ecf6e7;
color: #54BC7E; color: #54bc7e;
} }
.label-bg2{ .label-bg2 {
background: #DFEAFE; background: #dfeafe;
color: #0065F9; color: #0065f9;
} }
.label-bg3{ .label-bg3 {
background: #fbf2f1; background: #fbf2f1;
color: #fa5640; color: #fa5640;
} }
} }
} }
} }
.company-menu{ .company-menu {
position: absolute; position: absolute;
right: 0; right: 0;
top: 0; top: 0;
font-size: 14px; font-size: 14px;
.claim{ .claim {
border: 1px solid #0081FF; border: 1px solid #0081ff;
border-radius: 2px; border-radius: 2px;
color:#0081FF; color: #0081ff;
background: #FFFFFF; background: #ffffff;
.el-ico-claim{ .el-ico-claim {
background: url("~@/assets/images/detail/overview/company_rl.png") no-repeat; background: url("~@/assets/images/detail/overview/company_rl.png")
no-repeat;
background-size: 16px 16px; background-size: 16px 16px;
} }
} }
.claim:hover{ .claim:hover {
border: 1px solid #006AD1; border: 1px solid #006ad1;
border-radius: 2px; border-radius: 2px;
color:#006AD1; color: #006ad1;
background: #FFFFFF; background: #ffffff;
.el-ico-claim{ .el-ico-claim {
background: url("~@/assets/images/detail/overview/company_hrl.png") no-repeat; background: url("~@/assets/images/detail/overview/company_hrl.png")
no-repeat;
background-size: 16px 16px; background-size: 16px 16px;
} }
} }
.hasClaim{ .hasClaim {
border: 1px solid rgba(0,129,255,0.5); border: 1px solid rgba(0, 129, 255, 0.5);
border-radius: 2px; border-radius: 2px;
color:rgba(0,129,255,0.5); color: rgba(0, 129, 255, 0.5);
background: #FFFFFF; background: #ffffff;
.el-ico-claim{ .el-ico-claim {
background: url("~@/assets/images/detail/overview/company_yrl.png") no-repeat; background: url("~@/assets/images/detail/overview/company_yrl.png")
no-repeat;
background-size: 16px 16px; background-size: 16px 16px;
} }
} }
button { button {
padding: 6px 11px; padding: 6px 11px;
position: relative; position: relative;
i{ i {
display: inline-block; display: inline-block;
width: 16px; width: 16px;
height: 16px; height: 16px;
...@@ -730,125 +725,125 @@ export default { ...@@ -730,125 +725,125 @@ export default {
} }
} }
} }
.company-info{ .company-info {
background: #F5F9FE; background: #f5f9fe;
border-radius: 2px; border-radius: 2px;
padding: 12px 10px 12px 16px; padding: 12px 10px 12px 16px;
.info-item{ .info-item {
margin-bottom: 12px; margin-bottom: 12px;
&:last-child{ &:last-child {
margin-bottom: 0; margin-bottom: 0;
} }
.item-link{ .item-link {
color: #0081FF; color: #0081ff;
cursor: pointer; cursor: pointer;
font-size: 12px; font-size: 12px;
line-height: 20px; line-height: 20px;
&:hover{ &:hover {
color: #0069D0; color: #0069d0;
text-decoration: none; text-decoration: none;
} }
} }
.item{ .item {
font-size: 14px; font-size: 14px;
color: #333333; color: #333333;
&:first-child{ &:first-child {
width: 280px; width: 280px;
} }
&:nth-child(2){ &:nth-child(2) {
width: 350px; width: 350px;
} }
&.item-line{ &.item-line {
width: 100%; width: 100%;
align-items: flex-end; align-items: flex-end;
.item-all{ .item-all {
width: calc(100% - 50px); width: calc(100% - 50px);
text-overflow: initial; text-overflow: initial;
white-space: initial; white-space: initial;
overflow: initial; overflow: initial;
} }
.item-more{ .item-more {
width: calc(100% - 50px); width: calc(100% - 50px);
} }
} }
label{ label {
color: #666666; color: #666666;
flex-shrink: 0; flex-shrink: 0;
} }
span{ span {
display: inline-block; display: inline-block;
} }
} }
} }
} }
} }
.history-item{ .history-item {
padding: 8px 8px; padding: 8px 8px;
li{ li {
font-size: 12px; font-size: 12px;
color: #333333; color: #333333;
padding: 2px 0; padding: 2px 0;
} }
} }
.enterpriseLabel-item{ .enterpriseLabel-item {
padding: 0; padding: 0;
//width: 100%; //width: 100%;
max-width: 276px; max-width: 276px;
margin-top: 8px !important; margin-top: 8px !important;
} }
.ml-4{ .ml-4 {
margin-left: 4px; margin-left: 4px;
} }
} }
::v-deep .dialog-renlin{ ::v-deep .dialog-renlin {
margin-top:40vh !important; margin-top: 40vh !important;
.el-dialog__body{ .el-dialog__body {
padding: 0; padding: 0;
text-align: center; text-align: center;
padding-bottom: 24px; padding-bottom: 24px;
} }
.el-dialog__header{ .el-dialog__header {
text-align: center; text-align: center;
.el-dialog__title{ .el-dialog__title {
font-size: 16px; font-size: 16px;
} }
} }
.el-dialog__footer{ .el-dialog__footer {
padding: 0px; padding: 0px;
padding-bottom: 24px; padding-bottom: 24px;
.dialog-footer{ .dialog-footer {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
width: 100%; width: 100%;
.dialog-footer-btn1{ .dialog-footer-btn1 {
cursor: pointer; cursor: pointer;
width: 72px; width: 72px;
height: 28px; height: 28px;
background: #0081FF; background: #0081ff;
border-radius: 2px 2px 2px 2px; border-radius: 2px 2px 2px 2px;
font-size: 12px; font-size: 12px;
font-weight: 400; font-weight: 400;
color: #FFFFFF; color: #ffffff;
line-height: 28px; line-height: 28px;
text-align: center; text-align: center;
margin-right: 8px; margin-right: 8px;
} }
.dialog-footer-btn2{ .dialog-footer-btn2 {
cursor: pointer; cursor: pointer;
width: 72px; width: 72px;
height: 28px; height: 28px;
border-radius: 2px 2px 2px 2px; border-radius: 2px 2px 2px 2px;
border: 1px solid #CCCCCC; border: 1px solid #cccccc;
line-height: 28px; line-height: 28px;
text-align: center; text-align: center;
font-size: 12px; font-size: 12px;
font-weight: 400; font-weight: 400;
color: rgba(35,35,35,0.8); color: rgba(35, 35, 35, 0.8);
}
} }
} }
} }
}
</style> </style>
...@@ -10,7 +10,8 @@ ...@@ -10,7 +10,8 @@
<div class="operations-title">{{item.bratingSubjectLevel}}-<span>{{item.ratingDate}}</span></div> <div class="operations-title">{{item.bratingSubjectLevel}}-<span>{{item.ratingDate}}</span></div>
<div class="flex-box operations-info"> <div class="flex-box operations-info">
<div>{{item.bondType || '--'}}</div> <div>{{item.bondType || '--'}}</div>
<span class="text-cl1" :title="item.creditRatingAgency"><img src="@/assets/images/detail/overview/oper_source.png">{{item.creditRatingAgency || '--'}}</span> <span class="text-cl1" :title="item.creditRatingAgency"><img
src="@/assets/images/detail/overview/oper_source.png">{{item.creditRatingAgency || '--'}}</span>
</div> </div>
</div> </div>
</li> </li>
...@@ -32,38 +33,39 @@ ...@@ -32,38 +33,39 @@
</template> </template>
<script> <script>
import {bondCreditRating} from '@/api/detail/party-a/overview' import { bondCreditRating } from '@/api/detail/party-a/overview';
var Swiper = require('@/assets/lib/swiper/swiper-bundle.min.js') var Swiper = require('@/assets/lib/swiper/swiper-bundle.min.js');
import skeleton from '@/views/project/projectList/component/skeleton' import skeleton from '@/views/project/projectList/component/skeleton';
import "@/assets/lib/swiper/swiper-bundle.css" import "@/assets/lib/swiper/swiper-bundle.css";
import NoData from '../../component/noData' import NoData from '../../component/noData';
export default { export default {
name: 'Overview', name: 'Overview',
props: ['companyId', 'financial'], props: ['companyId', 'financial'],
components: { components: {
NoData,skeleton NoData, skeleton
}, },
data() { data() {
return { return {
operList: [], operList: [],
isSkeleton:true, isSkeleton: true,
gsjyList: [ gsjyList: [
{ name: '总资产', ico: require('@/assets/images/detail/overview/gsjy_ico1.png'), amount: ''}, { name: '总资产', ico: require('@/assets/images/detail/overview/gsjy_ico1.png'), amount: '' },
{ name: '净资产', ico: require('@/assets/images/detail/overview/gsjy_ico2.png'), amount: ''}, { name: '净资产', ico: require('@/assets/images/detail/overview/gsjy_ico2.png'), amount: '' },
{ name: '授信余额', ico: require('@/assets/images/detail/overview/gsjy_ico3.png'), amount: ''}, { name: '授信余额', ico: require('@/assets/images/detail/overview/gsjy_ico3.png'), amount: '' },
{ name: '营业收入', ico: require('@/assets/images/detail/overview/gsjy_ico4.png'), amount: ''}, { name: '营业收入', ico: require('@/assets/images/detail/overview/gsjy_ico4.png'), amount: '' },
{ name: '总负债', ico: require('@/assets/images/detail/overview/gsjy_ico5.png'), amount: ''} { name: '总负债', ico: require('@/assets/images/detail/overview/gsjy_ico5.png'), amount: '' }
], ],
} childFinancial: {}
};
}, },
created() { created() {
this.handleQuery() this.handleQuery();
}, },
mounted() { mounted() {
this.companySwiper() this.companySwiper();
}, },
methods: { methods: {
companySwiper(){ companySwiper() {
new Swiper('.swiper-oper', { new Swiper('.swiper-oper', {
slidesPerView: 6, slidesPerView: 6,
// 设置点击箭头 // 设置点击箭头
...@@ -71,80 +73,82 @@ export default { ...@@ -71,80 +73,82 @@ export default {
nextEl: '.swiper-oper-next', nextEl: '.swiper-oper-next',
prevEl: '.swiper-oper-prev', prevEl: '.swiper-oper-prev',
} }
}) });
}, },
async handleQuery() { async handleQuery() {
this.isSkeleton = true; this.isSkeleton = true;
let res = await bondCreditRating({cid: this.companyId}) let res = await bondCreditRating({ cid: this.companyId });
if(res.code==200){ if (res.code == 200) {
this.isSkeleton = false; this.isSkeleton = false;
this.operList = res.data || [] this.operList = res.data || [];
this.$nextTick(() => { this.$nextTick(() => {
this.companySwiper() this.companySwiper();
}) });
} }
}, },
handleFinancial(){ handleFinancial() {
if(this.financial){ if (this.childFinancial) {
let { totalAssets, belongNetAssets, creditBalance, operatingIncome, totalLiabilities } = this.financial let { totalAssets, belongNetAssets, creditBalance, operatingIncome, totalLiabilities } = this.childFinancial;
let jyqkObj = { totalAssets, belongNetAssets, creditBalance, operatingIncome, totalLiabilities } let jyqkObj = { totalAssets, belongNetAssets, creditBalance, operatingIncome, totalLiabilities };
this.gsjyList.forEach((item, index) => { this.gsjyList.forEach((item, index) => {
item.amount = jyqkObj[Object.keys(jyqkObj)[index]]?parseFloat(jyqkObj[Object.keys(jyqkObj)[index]].toFixed(2)):0 item.amount = jyqkObj[Object.keys(jyqkObj)[index]] ? parseFloat(jyqkObj[Object.keys(jyqkObj)[index]].toFixed(2)) : 0;
}) });
} }
} }
}, },
watch: { watch: {
financial(newVal, oldVal) { financial(newVal, oldVal) {
this.handleFinancial() this.childFinancial = newVal;
this.handleFinancial();
} }
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.operations-container{ .operations-container {
margin: 0; margin: 0;
padding: 24px 16px; padding: 24px 16px;
background: #FFFFFF; background: #ffffff;
border-radius: 4px; border-radius: 4px;
.part-swiper{ .part-swiper {
position: relative; position: relative;
margin-top: 16px; margin-top: 16px;
.swiper-oper{ .swiper-oper {
width: calc(100% - 38px); width: calc(100% - 38px);
height: 96px; height: 96px;
margin-top: 8px; margin-top: 8px;
margin-left: 25px; margin-left: 25px;
overflow: hidden; overflow: hidden;
.swiper-slide{ .swiper-slide {
.swiper-div{ .swiper-div {
width: calc(100% - 12px); width: calc(100% - 12px);
height: 96px; height: 96px;
background: url("~@/assets/images/detail/overview/swiper_bg.png") no-repeat; background: url("~@/assets/images/detail/overview/swiper_bg.png")
no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
.operations-title{ .operations-title {
margin-right: 22px; margin-right: 22px;
font-weight: bold; font-weight: bold;
font-size: 20px; font-size: 20px;
color: #232323; color: #232323;
padding: 24px 16px 0 16px; padding: 24px 16px 0 16px;
span{ span {
font-size: 16px; font-size: 16px;
} }
} }
.operations-info{ .operations-info {
padding: 14px 16px 10px 16px; padding: 14px 16px 10px 16px;
justify-content: space-between; justify-content: space-between;
font-size: 14px; font-size: 14px;
color: #232323; color: #232323;
div{ div {
flex-shrink: 0; flex-shrink: 0;
} }
span{ span {
font-size: 12px; font-size: 12px;
margin-left: 6px; margin-left: 6px;
img{ img {
width: 10px; width: 10px;
height: 10px; height: 10px;
margin-right: 3px; margin-right: 3px;
...@@ -154,53 +158,54 @@ export default { ...@@ -154,53 +158,54 @@ export default {
} }
} }
} }
.swiper-oper-prev, .swiper-oper-next{ .swiper-oper-prev,
.swiper-oper-next {
width: 16px; width: 16px;
height: 96px; height: 96px;
background: #F0F5FC; background: #f0f5fc;
top: 0; top: 0;
margin-top: 0; margin-top: 0;
&.swiper-button-disabled{ &.swiper-button-disabled {
opacity: 1; opacity: 1;
color:#AAAAAA; color: #aaaaaa;
background: #F5F5F5; background: #f5f5f5;
} }
i{ i {
color: #AAAAAA; color: #aaaaaa;
} }
&:hover i{ &:hover i {
color:#667199; color: #667199;
} }
&:after{ &:after {
content: ""; content: "";
} }
} }
} }
.operations-list{ .operations-list {
flex-wrap: wrap; flex-wrap: wrap;
justify-content: space-between; justify-content: space-between;
.list-item{ .list-item {
width: calc(20% - 12px); width: calc(20% - 12px);
height: 88px; height: 88px;
padding: 18px; padding: 18px;
margin-top: 14px; margin-top: 14px;
font-size: 14px; font-size: 14px;
color: #232323; color: #232323;
border: 1px solid #E2E7EE; border: 1px solid #e2e7ee;
text-align: center; text-align: center;
.list-item-all{ .list-item-all {
justify-content: center; justify-content: center;
img{ img {
width: 24px; width: 24px;
height: 24px; height: 24px;
margin-right: 4px; margin-right: 4px;
} }
} }
.list-item-amount{ .list-item-amount {
padding-top: 6px; padding-top: 6px;
font-weight: bold; font-weight: bold;
} }
} }
} }
} }
</style> </style>
...@@ -8,14 +8,15 @@ ...@@ -8,14 +8,15 @@
</el-tabs> </el-tabs>
<skeleton style="margin-left:16px;" v-if="isSkeleton"></skeleton> <skeleton style="margin-left:16px;" v-if="isSkeleton"></skeleton>
<div class="table-item" v-else> <div class="table-item" v-else>
<div class="rela-person" v-show="activeName=='first'">实际控制人:{{financial&&financial.actualController || '--'}}</div> <div class="rela-person" v-show="activeName=='first'">实际控制人:{{childFinancial&&childFinancial.actualController || '--'}}</div>
<el-table :data="holderData" border style="width: 100%" v-show="activeName=='first'"> <el-table :data="holderData" border style="width: 100%" v-show="activeName=='first'">
<el-table-column label="序号" width="55" align="left" fixed> <el-table-column label="序号" width="55" align="left" fixed>
<template slot-scope="scope">{{ holderParams.pageNum * holderParams.pageSize - holderParams.pageSize + scope.$index + 1 }}</template> <template slot-scope="scope">{{ holderParams.pageNum * holderParams.pageSize - holderParams.pageSize + scope.$index + 1 }}</template>
</el-table-column> </el-table-column>
<el-table-column min-width="140" label="股东名称"> <el-table-column min-width="140" label="股东名称">
<template slot-scope="scope"> <template slot-scope="scope">
<router-link :to="scope.row.uipId?`/enterprise/${encodeStr(scope.row.stockId)}`:`/company/${encodeStr(scope.row.stockId)}`" tag="a" class="a-link" v-if="scope.row.stockId&&scope.row.stockName" v-html="scope.row.stockName"></router-link> <router-link :to="scope.row.uipId?`/enterprise/${encodeStr(scope.row.stockId)}`:`/company/${encodeStr(scope.row.stockId)}`" tag="a"
class="a-link" v-if="scope.row.stockId&&scope.row.stockName" v-html="scope.row.stockName"></router-link>
<div v-else v-html="scope.row.stockName || '--'"></div> <div v-else v-html="scope.row.stockName || '--'"></div>
</template> </template>
</el-table-column> </el-table-column>
...@@ -43,10 +44,12 @@ ...@@ -43,10 +44,12 @@
</el-table-column> </el-table-column>
<el-table-column min-width="140" label="被投资企业名称"> <el-table-column min-width="140" label="被投资企业名称">
<template slot-scope="scope"> <template slot-scope="scope">
<router-link :to="scope.row.uipId?`/enterprise/${encodeStr(scope.row.id)}`:`/company/${encodeStr(scope.row.id)}`" tag="a" class="a-link" v-if="scope.row.id&&scope.row.investName" v-html="scope.row.investName"></router-link> <router-link :to="scope.row.uipId?`/enterprise/${encodeStr(scope.row.id)}`:`/company/${encodeStr(scope.row.id)}`" tag="a" class="a-link"
v-if="scope.row.id&&scope.row.investName" v-html="scope.row.investName"></router-link>
<div v-else v-html="scope.row.investName || '--'"></div> <div v-else v-html="scope.row.investName || '--'"></div>
<div class="tags" v-if="scope.row.businessStatus || scope.row.biddingAnnouncement"> <div class="tags" v-if="scope.row.businessStatus || scope.row.biddingAnnouncement">
<span class="tag" :class="labelArr.includes(scope.row.businessStatus)?'style2':'style1'" v-if="scope.row.businessStatus">{{scope.row.businessStatus}}</span> <span class="tag" :class="labelArr.includes(scope.row.businessStatus)?'style2':'style1'"
v-if="scope.row.businessStatus">{{scope.row.businessStatus}}</span>
<span class="tag style1" v-if="scope.row.biddingCount">招标数{{scope.row.biddingCount}}</span> <span class="tag style1" v-if="scope.row.biddingCount">招标数{{scope.row.biddingCount}}</span>
</div> </div>
</template> </template>
...@@ -65,14 +68,16 @@ ...@@ -65,14 +68,16 @@
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<no-data v-if="activeName=='second'&&shipData.length<1"/> <no-data v-if="activeName=='second'&&shipData.length<1" />
<el-table :data="affiliatesData" border style="width: 100%" v-show="activeName=='third'"> <el-table :data="affiliatesData" border style="width: 100%" v-show="activeName=='third'">
<el-table-column label="序号" width="55" align="left" > <el-table-column label="序号" width="55" align="left">
<template slot-scope="scope">{{ affiliatesParams.pageNum * affiliatesParams.pageSize - affiliatesParams.pageSize + scope.$index + 1 }}</template> <template
slot-scope="scope">{{ affiliatesParams.pageNum * affiliatesParams.pageSize - affiliatesParams.pageSize + scope.$index + 1 }}</template>
</el-table-column> </el-table-column>
<el-table-column min-width="140" label="被投资企业名称"> <el-table-column min-width="140" label="被投资企业名称">
<template slot-scope="scope"> <template slot-scope="scope">
<router-link :to="scope.row.uipId?`/enterprise/${encodeStr(scope.row.id)}`:`/company/${encodeStr(scope.row.id)}`" tag="a" class="a-link" v-if="scope.row.id&&scope.row.name" v-html="scope.row.name"></router-link> <router-link :to="scope.row.uipId?`/enterprise/${encodeStr(scope.row.id)}`:`/company/${encodeStr(scope.row.id)}`" tag="a" class="a-link"
v-if="scope.row.id&&scope.row.name" v-html="scope.row.name"></router-link>
<div v-else v-html="scope.row.name || '--'"></div> <div v-else v-html="scope.row.name || '--'"></div>
<div class="tags" v-if="scope.row.status || scope.row.biddingCount|| scope.row.landInfoCount|| scope.row.proposedProjectCount"> <div class="tags" v-if="scope.row.status || scope.row.biddingCount|| scope.row.landInfoCount|| scope.row.proposedProjectCount">
<span class="tag" :class="labelArr.includes(scope.row.status)?'style2':'style1'" v-if="scope.row.status">{{scope.row.status}}</span> <span class="tag" :class="labelArr.includes(scope.row.status)?'style2':'style1'" v-if="scope.row.status">{{scope.row.status}}</span>
...@@ -98,159 +103,167 @@ ...@@ -98,159 +103,167 @@
</el-table-column> </el-table-column>
<el-table-column prop="startDate" label="成立日期"></el-table-column> <el-table-column prop="startDate" label="成立日期"></el-table-column>
</el-table> </el-table>
<div class="rela-more" v-show="activeName=='second'&& shipTotal>shipParams.pageSize"><span class="a-link" @click="handlePath">查看更多数据 ></span></div> <div class="rela-more" v-show="activeName=='second'&& shipTotal>shipParams.pageSize"><span class="a-link" @click="handlePath">查看更多数据 ></span>
<div class="rela-more" v-show="activeName=='third'&& affiliatesTotal>affiliatesParams.pageSize"><span class="a-link" @click="handlePath1">查看更多数据 ></span></div> </div>
<div class="rela-more" v-show="activeName=='third'&& affiliatesTotal>affiliatesParams.pageSize"><span class="a-link" @click="handlePath1">查看更多数据
></span></div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import {encodeStr, changePath} from "@/assets/js/common" import { encodeStr, changePath } from "@/assets/js/common";
import {bestStockPage, investment,affiliates} from '@/api/detail/party-a/overview' import { bestStockPage, investment, affiliates } from '@/api/detail/party-a/overview';
import NoData from '../../component/noData' import NoData from '../../component/noData';
import skeleton from '@/views/project/projectList/component/skeleton' import skeleton from '@/views/project/projectList/component/skeleton';
export default { export default {
name: 'Relationship', name: 'Relationship',
props: ['companyId', 'financial'], props: ['companyId', 'financial'],
components: { components: {
NoData,skeleton NoData, skeleton
}, },
data() { data() {
return { return {
isSkeleton:true, isSkeleton: true,
encodeStr, encodeStr,
activeName:'first', activeName: 'first',
//表格数据 //表格数据
holderData:[], holderData: [],
holderParams: { holderParams: {
cid: this.companyId, cid: this.companyId,
isHistory: 0, isHistory: 0,
pageNum: 1, pageNum: 1,
pageSize: 100 pageSize: 100
}, },
shipData:[], shipData: [],
shipParams: { shipParams: {
cid: this.companyId, cid: this.companyId,
pageNum: 1, pageNum: 1,
pageSize: 5 pageSize: 5
}, },
shipTotal: 0, shipTotal: 0,
affiliatesData:[], affiliatesData: [],
affiliatesParams: { affiliatesParams: {
cid: this.companyId, cid: this.companyId,
pageNum: 1, pageNum: 1,
pageSize: 5 pageSize: 5
}, },
affiliatesTotal: 0, affiliatesTotal: 0,
labelArr:['失信联合惩戒企业','严重行政处罚','司法纠纷','注销', '注销企业'] labelArr: ['失信联合惩戒企业', '严重行政处罚', '司法纠纷', '注销', '注销企业'],
childFinancial: {}
};
},
watch: {
financial(newValue) {
this.childFinancial = newValue;
} }
}, },
created() { created() {
this.handleQuery() this.handleQuery();
this.handleInvest() this.handleInvest();
this.getAffiliatesData() this.getAffiliatesData();
}, },
mounted() { mounted() {
}, },
methods: { methods: {
async handleQuery(){ async handleQuery() {
this.isSkeleton = true; this.isSkeleton = true;
let res = await bestStockPage(this.holderParams) let res = await bestStockPage(this.holderParams);
if(res.code==200){ if (res.code == 200) {
this.isSkeleton = false; this.isSkeleton = false;
if(res.rows&&res.rows.length>0){ if (res.rows && res.rows.length > 0) {
res.rows.forEach(item => { res.rows.forEach(item => {
item.stockPercent?item.stockPercent = parseFloat(Number(item.stockPercent*100).toFixed(4))+'%':'' item.stockPercent ? item.stockPercent = parseFloat(Number(item.stockPercent * 100).toFixed(4)) + '%' : '';
}) });
} }
this.holderData = res.rows this.holderData = res.rows;
} }
}, },
async handleInvest(){ async handleInvest() {
let res = await investment(this.shipParams) let res = await investment(this.shipParams);
if(res.code==200){ if (res.code == 200) {
if(res.rows&&res.rows.length>0){ if (res.rows && res.rows.length > 0) {
res.rows.forEach(item => { res.rows.forEach(item => {
item.stockPercentage?item.stockPercentage = parseFloat(Number(item.stockPercentage*100).toFixed(4))+'%':'' item.stockPercentage ? item.stockPercentage = parseFloat(Number(item.stockPercentage * 100).toFixed(4)) + '%' : '';
}) });
} }
this.shipData = res.rows this.shipData = res.rows;
this.shipTotal = res.total this.shipTotal = res.total;
} }
}, },
async getAffiliatesData(){ async getAffiliatesData() {
let res = await affiliates(this.affiliatesParams) let res = await affiliates(this.affiliatesParams);
if(res.code==200){ if (res.code == 200) {
this.affiliatesData = res.rows this.affiliatesData = res.rows;
this.affiliatesTotal = res.total this.affiliatesTotal = res.total;
} }
}, },
handleClick(){ handleClick() {
}, },
handlePath(){ handlePath() {
changePath(this, 'overseas') changePath(this, 'overseas');
}, },
handlePath1(){ handlePath1() {
changePath(this, 'branch') changePath(this, 'branch');
} }
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.rela-container{ .rela-container {
margin: 0; margin: 0;
padding: 24px 16px; padding: 24px 16px;
background: #FFFFFF; background: #ffffff;
border-radius: 4px; border-radius: 4px;
.selfTab{ .selfTab {
margin: 24px 0 0 -12px; margin: 24px 0 0 -12px;
::v-deep .el-tabs__nav-wrap::after{ ::v-deep .el-tabs__nav-wrap::after {
display: none; display: none;
} }
::v-deep .el-tabs__item{ ::v-deep .el-tabs__item {
height: 30px; height: 30px;
line-height: 30px; line-height: 30px;
padding: 0 12px; padding: 0 12px;
} }
} }
.table-item{ .table-item {
margin-top: 16px; margin-top: 16px;
.tags{ .tags {
.tag{ .tag {
display: inline-block; display: inline-block;
border-radius: 2px; border-radius: 2px;
padding: 1px 7px; padding: 1px 7px;
margin: 4px 8px 0 0; margin: 4px 8px 0 0;
&.style1{ &.style1 {
background: #E4F3FD; background: #e4f3fd;
color: #41A1FD; color: #41a1fd;
} }
&.style2{ &.style2 {
background: #FFF1F1; background: #fff1f1;
color: #FF3C3C; color: #ff3c3c;
} }
} }
} }
::v-deep .el-table--border .el-table__cell{ ::v-deep .el-table--border .el-table__cell {
border-bottom: 0; border-bottom: 0;
} }
} }
.rela-person{ .rela-person {
width: 100%; width: 100%;
height: 24px; height: 24px;
line-height: 24px; line-height: 24px;
font-size: 12px; font-size: 12px;
color: #3D3D3D; color: #3d3d3d;
padding: 0 8px; padding: 0 8px;
background: #FDF8E9; background: #fdf8e9;
} }
.rela-more{ .rela-more {
padding-top: 16px; padding-top: 16px;
text-align: center; text-align: center;
span{ span {
cursor: pointer; cursor: pointer;
} }
} }
} }
</style> </style>
...@@ -2,28 +2,18 @@ ...@@ -2,28 +2,18 @@
<div class="app-container clue-container"> <div class="app-container clue-container">
<div class="common-title">风险概览</div> <div class="common-title">风险概览</div>
<div class="flex-box clue-box" v-if="viewData[0].value>0"> <div class="flex-box clue-box" v-if="viewData[0].value>0">
<div class="clue-echarts"><div id="echartsRisk" style="width: 100%;height:300px; margin: 0 auto;"></div></div> <div class="clue-echarts">
<div id="echartsRisk" style="width: 100%;height:300px; margin: 0 auto;"></div>
</div>
<div class="table-item"> <div class="table-item">
<el-table <el-table :data="viewData" border style="width: 100%">
:data="viewData" <el-table-column prop="name" label="风险纬度分布"></el-table-column>
border <el-table-column prop="value" align="right" label="数量">
style="width: 100%"
>
<el-table-column
prop="name"
label="风险纬度分布"></el-table-column>
<el-table-column
prop="value"
align="right"
label="数量">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ scope.row.value }}</span> <span>{{ scope.row.value }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="bl" align="right" label="占比(%)">
prop="bl"
align="right"
label="占比(%)">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ scope.row.bl }}</span> <span>{{ scope.row.bl }}</span>
</template> </template>
...@@ -31,13 +21,13 @@ ...@@ -31,13 +21,13 @@
</el-table> </el-table>
</div> </div>
</div> </div>
<no-data v-else/> <no-data v-else />
</div> </div>
</template> </template>
<script> <script>
import * as echarts from 'echarts' import * as echarts from 'echarts';
import NoData from '../../component/noData' import NoData from '../../component/noData';
export default { export default {
name: 'Risk', name: 'Risk',
props: ['statistic'], props: ['statistic'],
...@@ -46,14 +36,14 @@ export default { ...@@ -46,14 +36,14 @@ export default {
}, },
data() { data() {
return { return {
viewData:[ viewData: [
{ {
name:'开庭公告', name: '开庭公告',
value:'', value: '',
category:'credit', category: 'credit',
field:'openAnnouncement', field: 'openAnnouncement',
tz:'', tz: '',
bl:'' bl: ''
}, },
/*{ /*{
name:'企业公告', name:'企业公告',
...@@ -80,12 +70,12 @@ export default { ...@@ -80,12 +70,12 @@ export default {
bl:'' bl:''
},*/ },*/
{ {
name:'法院公告', name: '法院公告',
value:'', value: '',
category:'credit', category: 'credit',
field:'courtAnnouncement', field: 'courtAnnouncement',
tz:'', tz: '',
bl:'' bl: ''
}, },
/*{ /*{
name:'立案信息', name:'立案信息',
...@@ -96,75 +86,76 @@ export default { ...@@ -96,75 +86,76 @@ export default {
bl:'' bl:''
},*/ },*/
{ {
name:'被执行人', name: '被执行人',
value:'', value: '',
category:'credit', category: 'credit',
field:'dishonestExecutee', field: 'dishonestExecutee',
tz:'', tz: '',
bl:'' bl: ''
}, },
{ {
name:'失信被执行人', name: '失信被执行人',
value:'', value: '',
category:'credit', category: 'credit',
field:'dishonestExecutor', field: 'dishonestExecutor',
tz:'', tz: '',
bl:'' bl: ''
}, },
{ {
name:'行政处罚', name: '行政处罚',
value:'', value: '',
category:'credit', category: 'credit',
field:'adminSanction', field: 'adminSanction',
tz:'', tz: '',
bl:'' bl: ''
}, },
], ],
} childStatistic: {}
};
}, },
created() { created() {
}, },
mounted() { mounted() {
}, },
methods: { methods: {
handView(){ handView() {
let totalVal = this.viewData.map(item => { let totalVal = this.viewData.map(item => {
let number = this.statistic[item.category]&&this.statistic[item.category][item.field]?this.statistic[item.category][item.field]:0 let number = this.childStatistic[item.category] && this.childStatistic[item.category][item.field] ? this.childStatistic[item.category][item.field] : 0;
return number return number;
}).reduce((prev, cur) => prev + cur) }).reduce((prev, cur) => prev + cur);
this.viewData = this.viewData.map(item => { this.viewData = this.viewData.map(item => {
let number = this.statistic[item.category]&&this.statistic[item.category][item.field]?this.statistic[item.category][item.field]:0 let number = this.childStatistic[item.category] && this.childStatistic[item.category][item.field] ? this.childStatistic[item.category][item.field] : 0;
let bl = number ? parseFloat(Number(Number(number)/Number(totalVal)*100).toFixed(2)) : 0 let bl = number ? parseFloat(Number(Number(number) / Number(totalVal) * 100).toFixed(2)) : 0;
let it = {name:item.name, value:number, tz: '', bl:bl} let it = { name: item.name, value: number, tz: '', bl: bl };
return it return it;
}) });
this.viewData.sort((a, b) => { this.viewData.sort((a, b) => {
return a.value < b.value ? 1 : -1; return a.value < b.value ? 1 : -1;
}) });
this.$nextTick(()=>{ this.$nextTick(() => {
if(this.viewData[0].value>0){ if (this.viewData[0].value > 0) {
this.getDT(); this.getDT();
} }
}) });
}, },
getDT(){ getDT() {
let myChart = echarts.init(document.getElementById("echartsRisk")) let myChart = echarts.init(document.getElementById("echartsRisk"));
let option = { let option = {
tooltip: { tooltip: {
trigger: 'item', trigger: 'item',
borderWidth:0, borderWidth: 0,
backgroundColor:"rgba(255, 255, 255, 0.8)", backgroundColor: "rgba(255, 255, 255, 0.8)",
formatter: function (params) { formatter: function (params) {
var result = '' var result = '';
result+='<h3 style="color: #232226;padding: 0 0 5px 0;margin: 0;">'+ params.data.name +'</h3>' result += '<h3 style="color: #232226;padding: 0 0 5px 0;margin: 0;">' + params.data.name + '</h3>';
result+='<p style="color: rgba(35,35,35,0.8);padding: 0;margin: 0;">'+ params.data.value +'个</p>' result += '<p style="color: rgba(35,35,35,0.8);padding: 0;margin: 0;">' + params.data.value + '个</p>';
if(params.data.tz){ if (params.data.tz) {
result+='<p style="color: rgba(35,35,35,0.8);padding: 0;margin: 0;" >'+ params.data.tz +'亿元</p>' result += '<p style="color: rgba(35,35,35,0.8);padding: 0;margin: 0;" >' + params.data.tz + '亿元</p>';
} }
result+='<p style="color: rgba(35,35,35,0.8);padding: 0;margin: 0;">'+ params.data.bl+'%</p>' result += '<p style="color: rgba(35,35,35,0.8);padding: 0;margin: 0;">' + params.data.bl + '%</p>';
return result; return result;
}, },
extraCssText:'width:150px!important;', extraCssText: 'width:150px!important;',
}, },
legend: { legend: {
type: 'scroll', type: 'scroll',
...@@ -172,10 +163,10 @@ export default { ...@@ -172,10 +163,10 @@ export default {
bottom: 20, bottom: 20,
data: this.viewData, data: this.viewData,
pageButtonPosition: 'end', pageButtonPosition: 'end',
itemWidth:12, itemWidth: 12,
itemHeight:8, itemHeight: 8,
}, },
color: ['#8A82F3','#5B9CF7','#43BBE0','#8ECF95','#FFDC6B', '#FE9C77', '#E8649B', '#8A82F3'], color: ['#8A82F3', '#5B9CF7', '#43BBE0', '#8ECF95', '#FFDC6B', '#FE9C77', '#E8649B', '#8A82F3'],
series: [ series: [
{ {
type: 'pie', type: 'pie',
...@@ -191,14 +182,15 @@ export default { ...@@ -191,14 +182,15 @@ export default {
} }
} }
] ]
} };
myChart.setOption(option) myChart.setOption(option);
} }
}, },
watch: { watch: {
statistic(newVal, oldVal) { statistic(newVal, oldVal) {
if(newVal){ this.childStatistic = newVal;
this.handView() if (newVal) {
this.handView();
} }
} }
} }
...@@ -206,24 +198,24 @@ export default { ...@@ -206,24 +198,24 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.clue-container{ .clue-container {
margin: 0; margin: 0;
padding: 24px 16px; padding: 24px 16px;
background: #FFFFFF; background: #ffffff;
border-radius: 4px; border-radius: 4px;
.clue-box{ .clue-box {
width: 100%; width: 100%;
justify-content: space-between; justify-content: space-between;
margin-top: 20px; margin-top: 20px;
.clue-echarts{ .clue-echarts {
width: calc(50% - 8px); width: calc(50% - 8px);
} }
.table-item{ .table-item {
width: calc(50% - 8px); width: calc(50% - 8px);
::v-deep .el-table--border .el-table__cell{ ::v-deep .el-table--border .el-table__cell {
border-bottom: 0; border-bottom: 0;
} }
} }
} }
} }
</style> </style>
<template> <template>
<div v-loading="loading" class="market-container"> <div v-loading="loading" class="market-container">
<iframe id="companyIframe" class="market-iframe" marginwidth="0" marginheight="0" scrolling="no" frameborder="0" width="100%" :src="src" /> <iframe id="companyIframe" class="market-iframe" marginwidth="0" marginheight="0" scrolling="no" frameborder="0" width="100%" :src="src" />
<transition name="fade" mode="out-in" appear>
<max-page-size-tip v-if="showMaxPageTip" @closeMaxTip="showMaxPageTip = false"></max-page-size-tip>
</transition>
</div> </div>
</template> </template>
...@@ -39,13 +35,7 @@ export default { ...@@ -39,13 +35,7 @@ export default {
}; };
}, },
created() { created() {
if (window.location.host === 'http://szh.jiansheku.com' || window.location.host === 'szh.jiansheku.com') { this.domain = process.env.VUE_APP_SUB_SYSTEM_ADDRESS;
this.domain = 'https://plug.jiansheku.com';
} else {
this.domain = 'https://pre-plug.jiansheku.com';
// this.domain = 'http://192.168.60.8:3400';
// this.domain = 'http://192.168.60.210:3400';
}
this.gettokens(); this.gettokens();
this.iframeObserver(); this.iframeObserver();
let that = this; let that = this;
...@@ -63,7 +53,7 @@ export default { ...@@ -63,7 +53,7 @@ export default {
window.removeEventListener("message", this.pagecapListener, { passive: true }); window.removeEventListener("message", this.pagecapListener, { passive: true });
window.removeEventListener("message", this.linkListener); window.removeEventListener("message", this.linkListener);
// 移除layout样式 // 移除layout样式
this.iframeIns.contentWindow.postMessage("removeHtmlLayoutStyle", { targetOrigin: this.domain, }); this.iframeIns?.contentWindow ? this.iframeIns.contentWindow.postMessage("removeHtmlLayoutStyle", { targetOrigin: this.domain, }) : null;
}, },
methods: { methods: {
linkListener(event) { linkListener(event) {
...@@ -102,7 +92,9 @@ export default { ...@@ -102,7 +92,9 @@ export default {
const { origin, data } = e; const { origin, data } = e;
if (origin != this.domain) return; if (origin != this.domain) return;
if (data == "pageCurrentMaxSize") { if (data == "pageCurrentMaxSize") {
this.showMaxPageTip = true; this.$maxTip("您可通过筛选工具来查询数据~若有更多需求请联系客服 0262798729!").then(({ done, uid }) => {
done();
});
} }
}, },
gettokens() { gettokens() {
......
<template>
<div class="subsystem-iframe-container">
</div>
</template>
<script>
export default {
name: "",
data() {
return {
};
},
//可访问data属性
created() {
},
//计算集
computed: {
},
//方法集
methods: {
},
// 渲染方法
render(createElement) {
}
}
</script>
<style lang="scss" scoped>
.subsystem-iframe-container {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
padding: 16px 24px;
box-sizing: border-box;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment