Skip to content

D
dsk-operate-sys-cscec
Commit 0fa8ec63 authored by tianhongyang's avatar tianhongyang
Browse files
Options

fix bug

parent 7d07c1ce
Hide whitespace changes
Inline Side-by-side
Showing with 1290 additions and 1057 deletions
dsk-operate-ui/.env.development
View file @ 0fa8ec63
......@@ -9,3 +9,8 @@ VUE_APP_BASE_API = '/prod-api'
# 路由懒加载
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
dsk-operate-ui/.env.production
View file @ 0fa8ec63
......@@ -6,3 +6,6 @@ ENV = 'production'
# 数字化经营履约全生命链路管理系统/生产环境
VUE_APP_BASE_API = 'https://szhapi.jiansheku.com/'
# 子系统地址
VUE_APP_SUB_SYSTEM_ADDRESS = "https://plug.jiansheku.com"
dsk-operate-ui/.env.test
View file @ 0fa8ec63
......@@ -9,4 +9,7 @@ ENV = 'test'
# 数字化经营履约全生命链路管理系统/测试环境
VUE_APP_BASE_API = '/prod-api'
\ No newline at end of file
VUE_APP_BASE_API = '/prod-api'
# 子系统地址
VUE_APP_SUB_SYSTEM_ADDRESS = "https://pre-plug.jiansheku.com"
\ No newline at end of file
dsk-operate-ui/babel.config.js
View file @ 0fa8ec63
module.exports = {
presets: [
// 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': {
'development': {
......@@ -10,4 +11,4 @@ module.exports = {
'plugins': ['dynamic-import-node']
}
}
}
\ No newline at end of file
};
\ No newline at end of file
dsk-operate-ui/package.json
View file @ 0fa8ec63
......@@ -70,6 +70,8 @@
"vuex": "3.6.0"
},
"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-eslint": "4.4.6",
"@vue/cli-service": "4.4.6",
......@@ -87,6 +89,7 @@
"sass-loader": "10.1.1",
"script-ext-html-webpack-plugin": "2.1.5",
"svg-sprite-loader": "5.1.1",
"vue-styled-components": "^1.6.0",
"vue-template-compiler": "2.6.12"
},
"engines": {
......
dsk-operate-ui/src/components/JsComponents/MaxPageSizeTip.js 0 → 100644
View file @ 0fa8ec63
/*
* @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;
dsk-operate-ui/src/plugins/index.js
View file @ 0fa8ec63
import tab from './tab'
import auth from './auth'
import cache from './cache'
import modal from './modal'
import download from './download'
import tab from './tab';
import auth from './auth';
import cache from './cache';
import modal from './modal';
import download from './download';
import msgBox from "@/components/JsComponents/MaxPageSizeTip.js";
export default {
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;
}
}
};
dsk-operate-ui/src/utils/postMessageBridge/bridge/index.js
View file @ 0fa8ec63
......@@ -2,12 +2,44 @@
* @Author: thy
* @Date: 2023-10-26 14:56:41
* @LastEditors: thy
* @LastEditTime: 2023-10-30 14:26:31
* @LastEditTime: 2023-10-31 09:28:26
* @Description: file content
* @FilePath: \dsk-operate-ui\src\utils\postMessageBridge\bridge\index.js
*/
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
dsk-operate-ui/src/views/detail/party-a/overview/component/busclue.vue
View file @ 0fa8ec63
......@@ -7,29 +7,17 @@
</el-tabs>
<skeleton style="margin-left:16px;" v-if="isSkeleton"></skeleton>
<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">
<el-table
v-if="viewData.length>0"
:data="viewData"
border
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 v-if="viewData.length>0" :data="viewData" border 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
prop="percent"
align="right"
label="占比（%）">
<el-table-column prop="percent" align="right" label="占比（%）">
</el-table-column>
</el-table>
</div>
......@@ -38,71 +26,73 @@
</div>
</div>
<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>
</template>
<script>
import skeleton from '@/views/project/projectList/component/skeleton'
import {projectTenderDataGroup} from '@/api/detail/party-a/overview'
import * as echarts from 'echarts'
import {changePath} from "@/assets/js/common"
import NoData from '../../component/noData'
import skeleton from '@/views/project/projectList/component/skeleton';
import { projectTenderDataGroup } from '@/api/detail/party-a/overview';
import * as echarts from 'echarts';
import { changePath } from "@/assets/js/common";
import NoData from '../../component/noData';
export default {
name: 'Busclue',
props: ['companyId', 'statistic'],
components: {
NoData,skeleton
NoData, skeleton
},
data() {
return {
viewData:[],
isSkeleton:true,
activeIndex:0,
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: '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: '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: '标讯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")},
]
}
viewData: [],
isSkeleton: true,
activeIndex: 0,
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: '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: '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: '标讯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") },
],
childStatistic: {}
};
},
created() {
this.handleQuery()
this.handleQuery();
},
mounted() {
},
methods: {
async handleQuery(){
async handleQuery() {
this.isSkeleton = true;
let res = await projectTenderDataGroup({cid: this.companyId, type: this.activeIndex})
if(res.code==200 && res.data){
let res = await projectTenderDataGroup({ cid: this.companyId, type: this.activeIndex });
if (res.code == 200 && res.data) {
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 => {
let it = {name:item.name, value:item.value, percent:parseFloat(Number(Number(item.value)/Number(totalVal)*100).toFixed(2))}
return it
})
if(this.viewData.length>0){
let it = { name: item.name, value: item.value, percent: parseFloat(Number(Number(item.value) / Number(totalVal) * 100).toFixed(2)) };
return it;
});
if (this.viewData.length > 0) {
this.$nextTick(() => {
this.getDT()
})
this.getDT();
});
}
}
},
getDT(val){
let myChart = echarts.init(document.getElementById("echartsClue")), data = val ? val : this.viewData
getDT(val) {
let myChart = echarts.init(document.getElementById("echartsClue")), data = val ? val : this.viewData;
let option = {
tooltip: {
trigger: 'item',
borderWidth:0,
backgroundColor:"rgba(255, 255, 255, 0.8)",
borderWidth: 0,
backgroundColor: "rgba(255, 255, 255, 0.8)",
formatter: '{b}<br/>{d}%',
extraCssText:'width:100px!important;',
extraCssText: 'width:100px!important;',
},
legend: {
type: 'scroll',
......@@ -123,7 +113,7 @@ export default {
data: data,
pageButtonPosition: 'end',
},
color: ['#8A82F3','#5B9CF7','#43BBE0','#8ECF95','#FFDC6B'],
color: ['#8A82F3', '#5B9CF7', '#43BBE0', '#8ECF95', '#FFDC6B'],
series: [
{
type: 'pie',
......@@ -149,26 +139,27 @@ export default {
}
}
]
}
myChart.setOption(option)
};
myChart.setOption(option);
},
handleStatistic() {
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[3].count = 10 //写死代表有数据，英文统计里面没这项
},
handleType(it, idx){
if(it.count){
changePath(this, it.pathName)
handleType(it, idx) {
if (it.count) {
changePath(this, it.pathName);
}
}
},
watch: {
statistic(newVal, oldVal) {
if(newVal){
this.handleStatistic()
this.childStatistic = newVal;
if (newVal) {
this.handleStatistic();
}
}
}
......@@ -176,64 +167,64 @@ export default {
</script>
<style lang="scss" scoped>
.clue-container{
margin: 0;
padding: 24px 16px;
background: #FFFFFF;
border-radius: 4px;
.selfTab{
margin: 24px 0 0 -12px;
::v-deep .el-tabs__nav-wrap::after{
display: none;
}
::v-deep .el-tabs__item{
height: 30px;
line-height: 30px;
padding: 0 12px;
}
.clue-container {
margin: 0;
padding: 24px 16px;
background: #ffffff;
border-radius: 4px;
.selfTab {
margin: 24px 0 0 -12px;
::v-deep .el-tabs__nav-wrap::after {
display: none;
}
.clue-box{
::v-deep .el-tabs__item {
height: 30px;
line-height: 30px;
padding: 0 12px;
}
}
.clue-box {
width: 100%;
justify-content: space-between;
margin: 8px 0 24px 0;
.clue-echarts {
width: calc(50% - 8px);
}
.busc-no-data {
width: 100%;
justify-content: space-between;
margin: 8px 0 24px 0;
.clue-echarts{
width: calc(50% - 8px);
}
.table-item {
width: calc(50% - 8px);
::v-deep .el-table--border .el-table__cell {
border-bottom: 0;
}
.busc-no-data{
width: 100%;
}
}
.clue-type {
width: 100%;
justify-content: space-between;
border-top: 1px solid #eeeeee;
padding-top: 22px;
margin-right: -16px;
margin-left: -16px;
padding-left: 16px;
padding-right: 16px;
.clue-type-item {
font-size: 14px;
color: #232323;
cursor: pointer;
&:hover {
color: #0081ff;
}
.table-item{
width: calc(50% - 8px);
::v-deep .el-table--border .el-table__cell{
border-bottom: 0;
}
&.disab {
color: rgba(35, 35, 35, 0.4);
}
}
.clue-type{
width: 100%;
justify-content: space-between;
border-top: 1px solid #EEEEEE;
padding-top: 22px;
margin-right: -16px;
margin-left: -16px;
padding-left: 16px;
padding-right: 16px;
.clue-type-item{
font-size: 14px;
color: #232323;
cursor: pointer;
&:hover{
color: #0081FF;
}
&.disab{
color: rgba(35,35,35,0.4);
}
img{
width: 40px;
height: 40px;
margin-right: 8px;
}
img {
width: 40px;
height: 40px;
margin-right: 8px;
}
}
}
}
</style>
dsk-operate-ui/src/views/detail/party-a/overview/component/infoheader.vue
View file @ 0fa8ec63
......@@ -6,40 +6,37 @@
<img :src="companyInfo.logoUrl" :alt="companyInfo.companyName" :title="companyInfo.companyName" v-if="companyInfo.logoUrl">
<span
: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-html="companyInfo.nameSimple"></span>
v-else-if="companyInfo.nameSimple" v-html="companyInfo.nameSimple"></span>
<img :src="require('@/assets/images/detail/overview/logo@2x.png')" :alt="companyInfo.companyName" :title="companyInfo.companyName" v-else>
</div>
<div class="company-title">
<div class="company-name flex-box" @mouseenter="ifShow=!ifShow" @mouseleave="ifShow=!ifShow">
<div class="company-name flex-box" @mouseenter="ifShow=!ifShow" @mouseleave="ifShow=!ifShow">
<div v-clipboard:copy="companyInfo.companyName" v-clipboard:success="clipboardSuccess">{{companyInfo.companyName || '--'}}</div>
<span v-clipboard:copy="companyInfo.companyName" v-clipboard:success="clipboardSuccess" v-if="companyInfo.companyName && ifShow">复制</span>
</div>
<div class="company-tag">
<div style="float: left;margin-top: 8px;" class="company-history" v-if="companyInfo.historyNames && companyInfo.historyNames.length>0">
<el-popover
placement="bottom-start"
popper-class="enterpriseLabel-item"
trigger="hover">
<el-popover placement="bottom-start" popper-class="enterpriseLabel-item" trigger="hover">
<el-button slot="reference">曾用名 <i class="el-icon-caret-bottom"></i></el-button>
<ul class="history-item">
<li v-for="(item, index) in companyInfo.historyNames" :key="index">{{item.value}}</li>
</ul>
</el-popover>
</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;" :style="'background:'+item.bgColor+';color:'+item.fontColor" v-for="(item, index) in labelList" :key="index">{{item.labelName}}</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> -->
<template v-if="enterpriseLabel.length > 0">
<template v-for="(item,index) in enterpriseLabel">
<template v-if="item.children.length > 0">
<div class="enterpriseLabel-highTech company-highTech">
<el-popover
placement="bottom-start"
popper-class="enterpriseLabel-item"
trigger="hover">
<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>
<el-popover placement="bottom-start" popper-class="enterpriseLabel-item" trigger="hover">
<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">
<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>
</el-popover>
</div>
......@@ -47,17 +44,16 @@
<template v-else>
<template v-if="item.remark">
<div class="enterpriseLabel-highTech company-highTech">
<el-popover
width="280"
placement="bottom-start"
popper-class="enterpriseLabel-item"
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>
<el-popover width="280" placement="bottom-start" popper-class="enterpriseLabel-item" 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>
</el-popover>
</div>
</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>
......@@ -65,8 +61,10 @@
</div>
</div>
<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 @click="handleClaim" v-else class="claim" v-loading="claimLoading"><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>
<el-button @click="handleClaim" v-else class="claim" v-loading="claimLoading"><i class="el-ico-claim" alt="认领客户" title="认领客户"></i>
认领客户</el-button>
</div>
<div class="company-info">
......@@ -79,39 +77,40 @@
<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.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 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>
<div class="info-item flex-box" >
<div class="flex-box item item-line" >
<span ref="companyQybj" class="text-cl1" :class="showMore&&showState?'item-all':'item-more'">
<label>企业背景：</label>{{companyInfo.introduction || ''}}
</span>
<span class="item-link ml-4" v-if="companyInfo.introduction&&showMore" @click="handleDetail">{{showState?'收起':'展开'}}</span>
<div class="info-item flex-box">
<div class="flex-box item item-line">
<span ref="companyQybj" class="text-cl1" :class="showMore&&showState?'item-all':'item-more'">
<label>企业背景：</label>{{companyInfo.introduction || ''}}
</span>
<span class="item-link ml-4" v-if="companyInfo.introduction&&showMore" @click="handleDetail">{{showState?'收起':'展开'}}</span>
</div>
</div>
</div>
<div class="company-swiper">
<div class="swiper-containers swiper-info" :style="graphList.length<=6?'margin-left:0px; width: 100%;':''">
<ul class="swiper-wrapper">
<template v-for="(item, index) in graphList" >
<template v-for="(item, index) in graphList">
<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">
<div class="swiper-item" >
<el-popover v-if="statistic.combineMember.companyName.length>9" trigger="hover" :content="'所属集团-'+statistic.combineMember.companyName">
<span class="swiper-name" slot="reference">
所属集团-{{ statistic.combineMember.companyName }}
</span>
</el-popover>
<span v-else class="swiper-name">所属集团-{{statistic.combineMember.companyName}}</span>
<div >
<span >集团成员：</span><i class="num" >{{statistic.combineMember.memberNum}}</i>
</div>
<div class="swiper-item">
<el-popover v-if="childStatistic.combineMember.companyName.length>9" trigger="hover"
:content="'所属集团-'+childStatistic.combineMember.companyName">
<span class="swiper-name" slot="reference">
所属集团-{{ childStatistic.combineMember.companyName }}
</span>
</el-popover>
<span v-else class="swiper-name">所属集团-{{childStatistic.combineMember.companyName}}</span>
<div>
<span>集团成员：</span><i class="num">{{childStatistic.combineMember.memberNum}}</i>
</div>
</div>
</div>
<div class="flex-box" v-else @click="handleGraph(item)">
......@@ -122,7 +121,8 @@
</span>
<template v-for="(it, idx) in item.intro">
<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>
</template>
</div>
......@@ -136,13 +136,7 @@
</div>
<!-- 分条件：滚动与不滚动 -->
</div>
<el-dialog
title=""
:visible.sync="dialogVisible"
:modal="false"
custom-class='dialog-renlin'
:show-close="false"
width="244px">
<el-dialog title="" :visible.sync="dialogVisible" :modal="false" custom-class='dialog-renlin' :show-close="false" width="244px">
<span>认领成功，是否完善客户信息？</span>
<div slot="footer" class="dialog-footer">
<span class="dialog-footer-btn1" type="primary" @click="renlin()">立即完善</span>
......@@ -156,110 +150,105 @@
<span class="dialog-footer-btn2" @click="dialogVisible2 = false">关闭</span>
</div>
</el-dialog>
<el-dialog
title="取消认领"
:visible.sync="dialogVisible1"
:modal="false"
custom-class='dialog-renlin'
:show-close="false"
width="344px">
<span>是否取消认领客户？客户信息将放入“历史客户”。</span>
<div slot="footer" class="dialog-footer">
<span class="dialog-footer-btn1" type="primary" @click="confirm()" >
<el-dialog title="取消认领" :visible.sync="dialogVisible1" :modal="false" custom-class='dialog-renlin' :show-close="false" width="344px">
<span>是否取消认领客户？客户信息将放入“历史客户”。</span>
<div slot="footer" class="dialog-footer">
<span class="dialog-footer-btn1" type="primary" @click="confirm()">
确认
</span>
<span class="dialog-footer-btn2" @click="dialogVisible1 = false">关闭</span>
</div>
</el-dialog>
<span class="dialog-footer-btn2" @click="dialogVisible1 = false">关闭</span>
</div>
</el-dialog>
</div>
</template>
<script>
import ClipboardJS from 'clipboard'
import { changePath,encodeStr } from '@/assets/js/common'
var Swiper = require('@/assets/lib/swiper/swiper-bundle.min.js')
import "@/assets/lib/swiper/swiper-bundle.css"
import { claim } from "@/api/common"
import api from "@/api/enterpriseData/enterpriseData.js"
import ClipboardJS from 'clipboard';
import { changePath, encodeStr } from '@/assets/js/common';
var Swiper = require('@/assets/lib/swiper/swiper-bundle.min.js');
import "@/assets/lib/swiper/swiper-bundle.css";
import { claim } from "@/api/common";
import api from "@/api/enterpriseData/enterpriseData.js";
export default {
name: 'Infoheader',
props: ['companyId', 'companyInfo', 'statistic'],
data() {
return {
encodeStr,
ifShow:false,
ifShow: false,
newStatic: null,
labelList: [], //企业标签
customerId:'',
customerId: '',
claimLoading: false,
ifClaim: 0, //是否认领
showMore: false,
showState: false,
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: 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: 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: 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: 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: 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: 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: 7, name: '工商信息', isShow: true, intro: [{ id: 701, name: '企业基础工商登记信息' }], ico: require('@/assets/images/detail/overview/company_gsxx.png') }
], //企业链图
//风险扫描
labelArr:['失信联合惩戒企业','司法纠纷','注销'], //负向经营状态
enterpriseLabel:[],//企业标签
labelArr: ['失信联合惩戒企业', '司法纠纷', '注销'], //负向经营状态
enterpriseLabel: [],//企业标签
dialogVisible: false,
dialogVisible1: false,
dialogVisible2: false,
}
childStatistic: this.statistic
};
},
created() {
},
mounted() {
this.handleWidth() //企业背景是否收起
if(this.statistic.combineMember){
this.graphList.unshift({
id:0,name:'所属集团-'+this.statistic.combineMember.companyName,isShow:true,intro:[],ico:require('@/assets/images/detail/overview/company_ssjt.png')
})
}
this.companySwiper() //swiper滚动板块
api.label({companyId:this.companyId}).then(res=>{
if(res.code==200){
this.enterpriseLabel = res.data
this.handleWidth(); //企业背景是否收起
if (this.childStatistic.combineMember) {
this.graphList.unshift({
id: 0, name: '所属集团-' + this.childStatistic.combineMember.companyName, isShow: true, intro: [], ico: require('@/assets/images/detail/overview/company_ssjt.png')
});
}
this.companySwiper(); //swiper滚动板块
api.label({ companyId: this.companyId }).then(res => {
if (res.code == 200) {
this.enterpriseLabel = res.data;
}
})
});
},
methods: {
//认领
async handleClaim(){
let res = await api.customerStatus(this.companyInfo.companyName)
if(res.data === 1){
this.claimLoading = false
this.dialogVisible2=true;
}else{
if(this.companyInfo.uipId){
this.claimLoading = true
async handleClaim() {
let res = await api.customerStatus(this.companyInfo.companyName);
if (res.data === 1) {
this.claimLoading = false;
this.dialogVisible2 = true;
} else {
if (this.companyInfo.uipId) {
this.claimLoading = true;
let param = {
companyId:this.companyId,
uipId:this.companyInfo.uipId,
companyName:this.companyInfo.companyName,
creditLevel:this.companyInfo.bratingSubjectLevel || '',
legalPerson:this.companyInfo.corporatePerson || '',
registerCapital:this.companyInfo.registeredCapital || '',
provinceId:this.companyInfo.provinceId || '',
cityId:this.companyInfo.cityId || '',
districtId:this.companyInfo.districtCode || '',
registerAddress:this.companyInfo.provinceName+(this.companyInfo.cityName?'-'+this.companyInfo.cityName:'')+(this.companyInfo.districtName?'-'+this.companyInfo.districtName:''),
creditCode:this.companyInfo.creditCode
}
let res = await claim(param)
this.claimLoading = false
if(res.code==200){
this.dialogVisible=true
this.companyInfo.claimStatus = 0
this.customerId = res.data.customerId
companyId: this.companyId,
uipId: this.companyInfo.uipId,
companyName: this.companyInfo.companyName,
creditLevel: this.companyInfo.bratingSubjectLevel || '',
legalPerson: this.companyInfo.corporatePerson || '',
registerCapital: this.companyInfo.registeredCapital || '',
provinceId: this.companyInfo.provinceId || '',
cityId: this.companyInfo.cityId || '',
districtId: this.companyInfo.districtCode || '',
registerAddress: this.companyInfo.provinceName + (this.companyInfo.cityName ? '-' + this.companyInfo.cityName : '') + (this.companyInfo.districtName ? '-' + this.companyInfo.districtName : ''),
creditCode: this.companyInfo.creditCode
};
let res = await claim(param);
this.claimLoading = false;
if (res.code == 200) {
this.dialogVisible = true;
this.companyInfo.claimStatus = 0;
this.customerId = res.data.customerId;
}
}else{
this.$message.warning('对不起，当前不能认领')
} else {
this.$message.warning('对不起，当前不能认领');
}
}
},
......@@ -268,32 +257,32 @@ export default {
this.$modal.msgSuccess("复制成功");
},
//取消认领
cancelClaimClick(){
cancelClaimClick() {
this.dialogVisible1 = true;
},
async handleHistoryClaim(){
let res = await api.historyClaim(this.companyInfo.companyName)
if(res.code==200){
this.dialogVisible2 = false;
this.companyInfo.claimStatus = 0
}else{
this.$message.error(res.msg)
}
async handleHistoryClaim() {
let res = await api.historyClaim(this.companyInfo.companyName);
if (res.code == 200) {
this.dialogVisible2 = false;
this.companyInfo.claimStatus = 0;
} else {
this.$message.error(res.msg);
}
},
async confirm(){
let res = await api.cancelClaim(this.companyInfo.companyName)
if(res.code==200){
this.dialogVisible1 = false;
this.companyInfo.claimStatus = 1
}else{
this.$message.error(res.msg)
}
async confirm() {
let res = await api.cancelClaim(this.companyInfo.companyName);
if (res.code == 200) {
this.dialogVisible1 = false;
this.companyInfo.claimStatus = 1;
} else {
this.$message.error(res.msg);
}
// api.cancelClaim(this.companyInfo.companyName).then(res=>{
// })
},
companySwiper(){
companySwiper() {
new Swiper('.swiper-info', {
slidesPerView: 6,
// 设置点击箭头
......@@ -301,122 +290,123 @@ export default {
nextEl: '.swiper-info-next',
prevEl: '.swiper-info-prev',
}
})
});
},
getCompanyInfo(){
if(this.companyInfo.historyNames && typeof this.companyInfo.historyNames=='string'){ //曾用名)
this.companyInfo.historyNames = JSON.parse(this.companyInfo.historyNames)
getCompanyInfo() {
if (this.companyInfo.historyNames && typeof this.companyInfo.historyNames == 'string') { //曾用名)
this.companyInfo.historyNames = JSON.parse(this.companyInfo.historyNames);
}
},
handleStatistic() {
this.graphList.forEach((item, index) => {
let number = null
if(item.intro){
let number = null;
if (item.intro) {
item.intro.forEach((it, idx) => {
if(it.category || it.field){
it.val = this.statistic[it.category]?this.statistic[it.category][it.field]:0
number +=it.val
if (it.category || it.field) {
it.val = this.childStatistic[it.category] ? this.childStatistic[it.category][it.field] : 0;
number += it.val;
}
})
});
}
if(number===0){
item.isShow = false
if (number === 0) {
item.isShow = false;
}
})
this.graphList = this.graphList.filter(item => item.isShow)
if(this.statistic.combineMember){
});
this.graphList = this.graphList.filter(item => item.isShow);
if (this.childStatistic.combineMember) {
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(){
this.ifClaim = this.companyInfo.claimStatus
getClaimStatus() {
this.ifClaim = this.companyInfo.claimStatus;
},
handleWidth(){
if(this.companyInfo.introduction){
handleWidth() {
if (this.companyInfo.introduction) {
this.$nextTick(() => {
this.showMore = this.$refs.companyQybj.scrollWidth - this.$refs.companyQybj.clientWidth
})
this.showMore = this.$refs.companyQybj.scrollWidth - this.$refs.companyQybj.clientWidth;
});
}
},
handleDetail(){
this.showState = !this.showState
handleDetail() {
this.showState = !this.showState;
},
jumpToLt(item){
this.$router.push({ path: '/structure/graph', query: {eid:this.companyInfo.eid, typeId:item.id} })
jumpToLt(item) {
this.$router.push({ path: '/structure/graph', query: { eid: this.companyInfo.eid, typeId: item.id } });
},
//swiper项点击
handleGraph(item,it){
handleGraph(item, it) {
switch (item.id) {
case 4:
changePath(this, 'overseas')
break
changePath(this, 'overseas');
break;
case 5:
this.jumpToLt(item)
break
this.jumpToLt(item);
break;
case 6:
this.jumpToLt(item)
break
this.jumpToLt(item);
break;
case 7:
changePath(this, 'businfo')
break
changePath(this, 'businfo');
break;
}
},
linkTo(item){
this.$router.push({path:`/groupAccount/${item.companyId}?name=${item.companyName}`})
linkTo(item) {
this.$router.push({ path: `/groupAccount/${item.companyId}?name=${item.companyName}` });
},
//swiper子项点击
handleGraphChild(item, it){
if(it.id==101 && it.val){
changePath(this, 'custom')
handleGraphChild(item, it) {
if (it.id == 101 && it.val) {
changePath(this, 'custom');
}
if(it.id==102 && it.val){
changePath(this, 'supplier')
if (it.id == 102 && it.val) {
changePath(this, 'supplier');
}
if(it.id==201 && it.val){
changePath(this, 'bond')
if (it.id == 201 && it.val) {
changePath(this, 'bond');
}
if(it.id==202 && it.val){
changePath(this, 'biddingplan')
if (it.id == 202 && it.val) {
changePath(this, 'biddingplan');
}
if(it.id==301 && it.val){
changePath(this, 'landtransaction')
if (it.id == 301 && it.val) {
changePath(this, 'landtransaction');
}
if(it.id==302 && it.val){
changePath(this, 'administrative')
if (it.id == 302 && it.val) {
changePath(this, 'administrative');
}
},
renlin(){
this.dialogVisible=false;
renlin() {
this.dialogVisible = false;
// window.location.href = window.location.origin+window.location.pathname+'?customerId='+this.customerId+'&path=business'
this.$router.replace({
path: '/enterprise/'+encodeStr(this.companyId),
path: '/enterprise/' + encodeStr(this.companyId),
query: {
'customerId': this.customerId,
'path':'business'
} ,
})
this.$nextTick(()=>{
this.$tab.refreshPage();
})
'path': 'business'
},
});
this.$nextTick(() => {
this.$tab.refreshPage();
});
// 跳转地址
},
renHide(){
this.dialogVisible=false;
renHide() {
this.dialogVisible = false;
}
},
watch: {
companyInfo(newVal, oldVal) {
this.getCompanyInfo() //处理曾用名
this.handleWidth()
this.getClaimStatus() //获取企业认领状态
this.getCompanyInfo(); //处理曾用名
this.handleWidth();
this.getClaimStatus(); //获取企业认领状态
},
statistic(newVal, oldVal) {
if(newVal){
this.handleStatistic()
if (newVal) {
this.childStatistic = newVal;
this.handleStatistic();
}
}
}
......@@ -424,431 +414,436 @@ export default {
</script>
<style lang="scss" scoped>
.info-container{
margin: 0;
padding: 24px 16px 10px 16px;
background: #FFFFFF;
border-radius: 4px;
.company-swiper{
position: relative;
.swiper-info{
width: calc(100% - 38px);
height: 56px;
margin-top: 13px;
margin-left: 25px;
overflow: hidden;
.swiper-slide{
min-width: 242px;
padding: 7px 4px 9px 0;
box-sizing: border-box;
&.swiper-disn{
display: none;
}
>div{
width: 100%;
height: 100%;
cursor: pointer;
align-items: normal;
.swiper-item{
.swiper-name{
display: block;
font-size: 14px;
.info-container {
margin: 0;
padding: 24px 16px 10px 16px;
background: #ffffff;
border-radius: 4px;
.company-swiper {
position: relative;
.swiper-info {
width: calc(100% - 38px);
height: 56px;
margin-top: 13px;
margin-left: 25px;
overflow: hidden;
.swiper-slide {
min-width: 242px;
padding: 7px 4px 9px 0;
box-sizing: border-box;
&.swiper-disn {
display: none;
}
> div {
width: 100%;
height: 100%;
cursor: pointer;
align-items: normal;
.swiper-item {
.swiper-name {
display: block;
font-size: 14px;
color: #232323;
width: 200px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
div {
display: inline-block;
font-size: 12px;
padding-top: 3px;
span {
color: #232323;
width: 200px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
div{
display: inline-block;
font-size: 12px;
padding-top: 3px;
span{
color: #232323;
}
i{
font-style: normal;
color: #0081FF;
&.num{
margin-right: 8px;
}
i {
font-style: normal;
color: #0081ff;
&.num {
margin-right: 8px;
}
}
}
.swiper-img{
width: 40px;
height: 40px;
margin-right: 6px;
}
}
.swiper-img {
width: 40px;
height: 40px;
margin-right: 6px;
}
}
}
.swiper-info-prev, .swiper-info-next{
width: 16px;
height: 40px;
background: #F0F5FC;
top: 8px;
margin-top: 0;
&.swiper-button-disabled{
opacity: 1;
color:#AAAAAA;
background: #F5F5F5;
}
i{
color: #AAAAAA;
}
&:hover i{
color:#667199;
}
&:after{
content: "";
}
}
.swiper-info-prev,
.swiper-info-next {
width: 16px;
height: 40px;
background: #f0f5fc;
top: 8px;
margin-top: 0;
&.swiper-button-disabled {
opacity: 1;
color: #aaaaaa;
background: #f5f5f5;
}
i {
color: #aaaaaa;
}
&:hover i {
color: #667199;
}
&:after {
content: "";
}
}
.company-box{
width: 100%;
position: relative;
.company-nav{
align-items: normal;
.company-left{
width: 64px;
height: 64px;
margin-right: 12px;
flex-shrink: 0;
img{
width: 100%;
height: 100%;
border-radius: 4px;
overflow: hidden;
}
.company-box {
width: 100%;
position: relative;
.company-nav {
align-items: normal;
.company-left {
width: 64px;
height: 64px;
margin-right: 12px;
flex-shrink: 0;
img {
width: 100%;
height: 100%;
border-radius: 4px;
overflow: hidden;
}
.conenctLogo {
width: 100%;
height: 100%;
color: #ffffff;
border-radius: 4px;
overflow: hidden;
text-align: center;
display: block;
&.textOne {
font-size: 18px;
line-height: 64px;
}
.conenctLogo{
width: 100%;
height: 100%;
color: #FFFFFF;
border-radius: 4px;
overflow: hidden;
text-align: center;
display: block;
&.textOne{
font-size: 18px;
line-height: 64px;
}
&.textTwo{
font-size: 18px;
padding: 9px 10px;
line-height: 24px;
}
&.bg1{
background: #99BE81;
}
&.bg2{
background: #76B4D4;
}
&.bg3{
background: #7A91D9;
}
&.bg4{
background: #8F8DD2;
}
&.bg5{
background: #C4A89F;
}
&.textTwo {
font-size: 18px;
padding: 9px 10px;
line-height: 24px;
}
p{
font-size: 12px;
color: #999999;
text-align: center;
margin-top: 7px;
&.bg1 {
background: #99be81;
}
&.bg2 {
background: #76b4d4;
}
&.bg3 {
background: #7a91d9;
}
&.bg4 {
background: #8f8dd2;
}
&.bg5 {
background: #c4a89f;
}
}
p {
font-size: 12px;
color: #999999;
text-align: center;
margin-top: 7px;
}
.company-title{
.company-name{
font-size: 20px;
color: #000000;
font-weight: bold;
margin-right: 100px;
}
.company-title {
.company-name {
font-size: 20px;
color: #000000;
font-weight: bold;
margin-right: 100px;
cursor: pointer;
align-items: center;
span {
width: 44px;
height: 22px;
font-size: 12px;
line-height: 22px;
color: #666666;
text-align: center;
font-weight: 400;
display: inline-block;
border: 1px solid #eeeeee;
border-radius: 2px;
cursor: pointer;
align-items: center;
span{
width: 44px;
height: 22px;
font-size: 12px;
line-height: 22px;
color: #666666;
text-align: center;
font-weight: 400;
display: inline-block;
border: 1px solid #EEEEEE;
border-radius: 2px;
cursor: pointer;
margin-left: 16px;
&:hover{
background: #E9F4FF;
color: #0081FF;
border: 1px solid #0081FF;
}
margin-left: 16px;
&:hover {
background: #e9f4ff;
color: #0081ff;
border: 1px solid #0081ff;
}
}
.company-tag{
overflow: hidden;
font-size: 12px;
padding: 2px 0 10px 0;
::v-deep .enterpriseLabel-item{
padding: 0;
//width: 100%;
max-width: 276px;
margin-top: 8px !important;
.highTech-item{
padding: 10px 12px 0;
font-size: 12px;
color: #333333;
.enterpriseLabel-children-span{
display: inline-block;
padding-right: 8px;
margin-right: 8px;
margin-bottom: 8px;
border-right: 1px solid #E1E1E1;
//cursor:pointer;
}
.enterpriseLabel-children-span:last-child{
padding-right: 0;
margin-right: 0;
border-right: 0;
}
}
}
.company-history, .company-highTech{
display: inline-block;
height: 22px;
background: #EFEFEF;
border-radius: 2px;
margin-right: 8px;
margin-left: 0;
button{
height: 22px;
line-height: 22px;
font-size: 12px;
padding: 0 8px;
background: #EFEFEF;
color: #838383;
border: 1px solid #EFEFEF;
border-radius: 2px;
}
}
.company-highTech{
button{
background: #DFEAFE;
color: #0065F9;
}
.company-tag {
overflow: hidden;
font-size: 12px;
padding: 2px 0 10px 0;
::v-deep .enterpriseLabel-item {
padding: 0;
//width: 100%;
max-width: 276px;
margin-top: 8px !important;
.highTech-item {
padding: 10px 12px 0;
font-size: 12px;
color: #333333;
.enterpriseLabel-children-span {
display: inline-block;
padding-right: 8px;
margin-right: 8px;
margin-bottom: 8px;
border-right: 1px solid #e1e1e1;
//cursor:pointer;
}
}
.enterpriseLabel-highTech{
background: #ffffff;
margin-top: 8px;
margin-right: 8px;
float: left;
}
>span{
display: inline-block;
height: 22px;
line-height: 22px;
padding: 0 8px;
border-radius: 2px;
margin-right: 8px;
margin-top: 8px;
&:last-child{
.enterpriseLabel-children-span:last-child {
padding-right: 0;
margin-right: 0;
border-right: 0;
}
}
.enterpriseLabel-span{
display: inline-block;
}
.company-history,
.company-highTech {
display: inline-block;
height: 22px;
background: #efefef;
border-radius: 2px;
margin-right: 8px;
margin-left: 0;
button {
height: 22px;
line-height: 22px;
font-size: 12px;
padding: 0 8px;
background: #efefef;
color: #838383;
border: 1px solid #efefef;
border-radius: 2px;
margin-right: 8px;
margin-top: 8px;
float: left;
}
.label-bg1{
background: #ECF6E7;
color: #54BC7E;
}
.label-bg2{
background: #DFEAFE;
color: #0065F9;
}
.company-highTech {
button {
background: #dfeafe;
color: #0065f9;
}
.label-bg3{
background: #fbf2f1;
color: #fa5640;
}
.enterpriseLabel-highTech {
background: #ffffff;
margin-top: 8px;
margin-right: 8px;
float: left;
}
> span {
display: inline-block;
height: 22px;
line-height: 22px;
padding: 0 8px;
border-radius: 2px;
margin-right: 8px;
margin-top: 8px;
&:last-child {
margin-right: 0;
}
}
}
}
.company-menu{
position: absolute;
right: 0;
top: 0;
font-size: 14px;
.claim{
border: 1px solid #0081FF;
border-radius: 2px;
color:#0081FF;
background: #FFFFFF;
.el-ico-claim{
background: url("~@/assets/images/detail/overview/company_rl.png") no-repeat;
background-size: 16px 16px;
.enterpriseLabel-span {
display: inline-block;
height: 22px;
line-height: 22px;
padding: 0 8px;
border-radius: 2px;
margin-right: 8px;
margin-top: 8px;
float: left;
}
}
.claim:hover{
border: 1px solid #006AD1;
border-radius: 2px;
color:#006AD1;
background: #FFFFFF;
.el-ico-claim{
background: url("~@/assets/images/detail/overview/company_hrl.png") no-repeat;
background-size: 16px 16px;
.label-bg1 {
background: #ecf6e7;
color: #54bc7e;
}
}
.hasClaim{
border: 1px solid rgba(0,129,255,0.5);
border-radius: 2px;
color:rgba(0,129,255,0.5);
background: #FFFFFF;
.el-ico-claim{
background: url("~@/assets/images/detail/overview/company_yrl.png") no-repeat;
background-size: 16px 16px;
.label-bg2 {
background: #dfeafe;
color: #0065f9;
}
}
button {
padding: 6px 11px;
position: relative;
i{
display: inline-block;
width: 16px;
height: 16px;
margin-bottom: -2px;
.label-bg3 {
background: #fbf2f1;
color: #fa5640;
}
}
}
.company-info{
background: #F5F9FE;
}
.company-menu {
position: absolute;
right: 0;
top: 0;
font-size: 14px;
.claim {
border: 1px solid #0081ff;
border-radius: 2px;
padding: 12px 10px 12px 16px;
.info-item{
margin-bottom: 12px;
&:last-child{
margin-bottom: 0;
color: #0081ff;
background: #ffffff;
.el-ico-claim {
background: url("~@/assets/images/detail/overview/company_rl.png")
no-repeat;
background-size: 16px 16px;
}
}
.claim:hover {
border: 1px solid #006ad1;
border-radius: 2px;
color: #006ad1;
background: #ffffff;
.el-ico-claim {
background: url("~@/assets/images/detail/overview/company_hrl.png")
no-repeat;
background-size: 16px 16px;
}
}
.hasClaim {
border: 1px solid rgba(0, 129, 255, 0.5);
border-radius: 2px;
color: rgba(0, 129, 255, 0.5);
background: #ffffff;
.el-ico-claim {
background: url("~@/assets/images/detail/overview/company_yrl.png")
no-repeat;
background-size: 16px 16px;
}
}
button {
padding: 6px 11px;
position: relative;
i {
display: inline-block;
width: 16px;
height: 16px;
margin-bottom: -2px;
}
}
}
.company-info {
background: #f5f9fe;
border-radius: 2px;
padding: 12px 10px 12px 16px;
.info-item {
margin-bottom: 12px;
&:last-child {
margin-bottom: 0;
}
.item-link {
color: #0081ff;
cursor: pointer;
font-size: 12px;
line-height: 20px;
&:hover {
color: #0069d0;
text-decoration: none;
}
.item-link{
color: #0081FF;
cursor: pointer;
font-size: 12px;
line-height: 20px;
&:hover{
color: #0069D0;
text-decoration: none;
}
}
.item {
font-size: 14px;
color: #333333;
&:first-child {
width: 280px;
}
.item{
font-size: 14px;
color: #333333;
&:first-child{
width: 280px;
}
&:nth-child(2){
width: 350px;
}
&.item-line{
width: 100%;
align-items: flex-end;
.item-all{
width: calc(100% - 50px);
text-overflow: initial;
white-space: initial;
overflow: initial;
}
.item-more{
width: calc(100% - 50px);
}
}
label{
color: #666666;
flex-shrink: 0;
&:nth-child(2) {
width: 350px;
}
&.item-line {
width: 100%;
align-items: flex-end;
.item-all {
width: calc(100% - 50px);
text-overflow: initial;
white-space: initial;
overflow: initial;
}
span{
display: inline-block;
.item-more {
width: calc(100% - 50px);
}
}
label {
color: #666666;
flex-shrink: 0;
}
span {
display: inline-block;
}
}
}
}
.history-item{
padding: 8px 8px;
li{
font-size: 12px;
color: #333333;
padding: 2px 0;
}
}
.enterpriseLabel-item{
padding: 0;
//width: 100%;
max-width: 276px;
margin-top: 8px !important;
}
.ml-4{
margin-left: 4px;
}
.history-item {
padding: 8px 8px;
li {
font-size: 12px;
color: #333333;
padding: 2px 0;
}
}
::v-deep .dialog-renlin{
margin-top:40vh !important;
.el-dialog__body{
padding: 0;
text-align: center;
padding-bottom: 24px;
.enterpriseLabel-item {
padding: 0;
//width: 100%;
max-width: 276px;
margin-top: 8px !important;
}
.ml-4 {
margin-left: 4px;
}
}
::v-deep .dialog-renlin {
margin-top: 40vh !important;
.el-dialog__body {
padding: 0;
text-align: center;
padding-bottom: 24px;
}
.el-dialog__header {
text-align: center;
.el-dialog__title {
font-size: 16px;
}
.el-dialog__header{
text-align: center;
.el-dialog__title{
font-size: 16px;
}
.el-dialog__footer {
padding: 0px;
padding-bottom: 24px;
.dialog-footer {
display: inline-flex;
align-items: center;
justify-content: center;
width: 100%;
.dialog-footer-btn1 {
cursor: pointer;
width: 72px;
height: 28px;
background: #0081ff;
border-radius: 2px 2px 2px 2px;
font-size: 12px;
font-weight: 400;
color: #ffffff;
line-height: 28px;
text-align: center;
margin-right: 8px;
}
}
.el-dialog__footer{
padding: 0px;
padding-bottom: 24px;
.dialog-footer{
display: inline-flex;
align-items: center;
justify-content: center;
width: 100%;
.dialog-footer-btn1{
cursor: pointer;
width: 72px;
height: 28px;
background: #0081FF;
border-radius: 2px 2px 2px 2px;
font-size: 12px;
font-weight: 400;
color: #FFFFFF;
line-height: 28px;
text-align: center;
margin-right: 8px;
}
.dialog-footer-btn2{
cursor: pointer;
width: 72px;
height: 28px;
border-radius: 2px 2px 2px 2px;
border: 1px solid #CCCCCC;
line-height: 28px;
text-align: center;
font-size: 12px;
font-weight: 400;
color: rgba(35,35,35,0.8);
}
.dialog-footer-btn2 {
cursor: pointer;
width: 72px;
height: 28px;
border-radius: 2px 2px 2px 2px;
border: 1px solid #cccccc;
line-height: 28px;
text-align: center;
font-size: 12px;
font-weight: 400;
color: rgba(35, 35, 35, 0.8);
}
}
}
}
</style>
dsk-operate-ui/src/views/detail/party-a/overview/component/operations.vue
View file @ 0fa8ec63
......@@ -10,7 +10,8 @@
<div class="operations-title">{{item.bratingSubjectLevel}}-<span>{{item.ratingDate}}</span></div>
<div class="flex-box operations-info">
<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>
</li>
......@@ -32,38 +33,39 @@
</template>
<script>
import {bondCreditRating} from '@/api/detail/party-a/overview'
var Swiper = require('@/assets/lib/swiper/swiper-bundle.min.js')
import skeleton from '@/views/project/projectList/component/skeleton'
import "@/assets/lib/swiper/swiper-bundle.css"
import NoData from '../../component/noData'
import { bondCreditRating } from '@/api/detail/party-a/overview';
var Swiper = require('@/assets/lib/swiper/swiper-bundle.min.js');
import skeleton from '@/views/project/projectList/component/skeleton';
import "@/assets/lib/swiper/swiper-bundle.css";
import NoData from '../../component/noData';
export default {
name: 'Overview',
props: ['companyId', 'financial'],
components: {
NoData,skeleton
NoData, skeleton
},
data() {
return {
operList: [],
isSkeleton:true,
isSkeleton: true,
gsjyList: [
{ 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_ico3.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_ico1.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_ico4.png'), amount: '' },
{ name: '总负债', ico: require('@/assets/images/detail/overview/gsjy_ico5.png'), amount: '' }
],
}
childFinancial: {}
};
},
created() {
this.handleQuery()
this.handleQuery();
},
mounted() {
this.companySwiper()
this.companySwiper();
},
methods: {
companySwiper(){
companySwiper() {
new Swiper('.swiper-oper', {
slidesPerView: 6,
// 设置点击箭头
......@@ -71,136 +73,139 @@ export default {
nextEl: '.swiper-oper-next',
prevEl: '.swiper-oper-prev',
}
})
});
},
async handleQuery() {
this.isSkeleton = true;
let res = await bondCreditRating({cid: this.companyId})
if(res.code==200){
let res = await bondCreditRating({ cid: this.companyId });
if (res.code == 200) {
this.isSkeleton = false;
this.operList = res.data || []
this.operList = res.data || [];
this.$nextTick(() => {
this.companySwiper()
})
this.companySwiper();
});
}
},
handleFinancial(){
if(this.financial){
let { totalAssets, belongNetAssets, creditBalance, operatingIncome, totalLiabilities } = this.financial
let jyqkObj = { totalAssets, belongNetAssets, creditBalance, operatingIncome, totalLiabilities }
handleFinancial() {
if (this.childFinancial) {
let { totalAssets, belongNetAssets, creditBalance, operatingIncome, totalLiabilities } = this.childFinancial;
let jyqkObj = { totalAssets, belongNetAssets, creditBalance, operatingIncome, totalLiabilities };
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: {
financial(newVal, oldVal) {
this.handleFinancial()
this.childFinancial = newVal;
this.handleFinancial();
}
}
}
</script>
<style lang="scss" scoped>
.operations-container{
margin: 0;
padding: 24px 16px;
background: #FFFFFF;
border-radius: 4px;
.part-swiper{
position: relative;
margin-top: 16px;
.swiper-oper{
width: calc(100% - 38px);
height: 96px;
margin-top: 8px;
margin-left: 25px;
overflow: hidden;
.swiper-slide{
.swiper-div{
width: calc(100% - 12px);
height: 96px;
background: url("~@/assets/images/detail/overview/swiper_bg.png") no-repeat;
background-size: 100% 100%;
.operations-title{
margin-right: 22px;
font-weight: bold;
font-size: 20px;
color: #232323;
padding: 24px 16px 0 16px;
span{
font-size: 16px;
}
.operations-container {
margin: 0;
padding: 24px 16px;
background: #ffffff;
border-radius: 4px;
.part-swiper {
position: relative;
margin-top: 16px;
.swiper-oper {
width: calc(100% - 38px);
height: 96px;
margin-top: 8px;
margin-left: 25px;
overflow: hidden;
.swiper-slide {
.swiper-div {
width: calc(100% - 12px);
height: 96px;
background: url("~@/assets/images/detail/overview/swiper_bg.png")
no-repeat;
background-size: 100% 100%;
.operations-title {
margin-right: 22px;
font-weight: bold;
font-size: 20px;
color: #232323;
padding: 24px 16px 0 16px;
span {
font-size: 16px;
}
.operations-info{
padding: 14px 16px 10px 16px;
justify-content: space-between;
font-size: 14px;
color: #232323;
div{
flex-shrink: 0;
}
span{
font-size: 12px;
margin-left: 6px;
img{
width: 10px;
height: 10px;
margin-right: 3px;
}
}
.operations-info {
padding: 14px 16px 10px 16px;
justify-content: space-between;
font-size: 14px;
color: #232323;
div {
flex-shrink: 0;
}
span {
font-size: 12px;
margin-left: 6px;
img {
width: 10px;
height: 10px;
margin-right: 3px;
}
}
}
}
}
.swiper-oper-prev, .swiper-oper-next{
width: 16px;
height: 96px;
background: #F0F5FC;
top: 0;
margin-top: 0;
&.swiper-button-disabled{
opacity: 1;
color:#AAAAAA;
background: #F5F5F5;
}
i{
color: #AAAAAA;
}
&:hover i{
color:#667199;
}
&:after{
content: "";
}
}
.swiper-oper-prev,
.swiper-oper-next {
width: 16px;
height: 96px;
background: #f0f5fc;
top: 0;
margin-top: 0;
&.swiper-button-disabled {
opacity: 1;
color: #aaaaaa;
background: #f5f5f5;
}
i {
color: #aaaaaa;
}
&:hover i {
color: #667199;
}
&:after {
content: "";
}
}
.operations-list{
flex-wrap: wrap;
justify-content: space-between;
.list-item{
width: calc(20% - 12px);
height: 88px;
padding: 18px;
margin-top: 14px;
font-size: 14px;
color: #232323;
border: 1px solid #E2E7EE;
text-align: center;
.list-item-all{
justify-content: center;
img{
width: 24px;
height: 24px;
margin-right: 4px;
}
}
.list-item-amount{
padding-top: 6px;
font-weight: bold;
}
.operations-list {
flex-wrap: wrap;
justify-content: space-between;
.list-item {
width: calc(20% - 12px);
height: 88px;
padding: 18px;
margin-top: 14px;
font-size: 14px;
color: #232323;
border: 1px solid #e2e7ee;
text-align: center;
.list-item-all {
justify-content: center;
img {
width: 24px;
height: 24px;
margin-right: 4px;
}
}
.list-item-amount {
padding-top: 6px;
font-weight: bold;
}
}
}
}
</style>
dsk-operate-ui/src/views/detail/party-a/overview/component/relationship.vue
View file @ 0fa8ec63
......@@ -8,14 +8,15 @@
</el-tabs>
<skeleton style="margin-left:16px;" v-if="isSkeleton"></skeleton>
<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-column label="序号" width="55" align="left" fixed>
<template slot-scope="scope">{{ holderParams.pageNum * holderParams.pageSize - holderParams.pageSize + scope.$index + 1 }}</template>
</el-table-column>
<el-table-column min-width="140" label="股东名称">
<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>
</template>
</el-table-column>
......@@ -43,10 +44,12 @@
</el-table-column>
<el-table-column min-width="140" label="被投资企业名称">
<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 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>
</div>
</template>
......@@ -65,14 +68,16 @@
</template>
</el-table-column>
</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-column label="序号" width="55" align="left" >
<template slot-scope="scope">{{ affiliatesParams.pageNum * affiliatesParams.pageSize - affiliatesParams.pageSize + scope.$index + 1 }}</template>
<el-table-column label="序号" width="55" align="left">
<template
slot-scope="scope">{{ affiliatesParams.pageNum * affiliatesParams.pageSize - affiliatesParams.pageSize + scope.$index + 1 }}</template>
</el-table-column>
<el-table-column min-width="140" label="被投资企业名称">
<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 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>
......@@ -85,172 +90,180 @@
<el-table-column prop="operName" label="负责人"></el-table-column>
<el-table-column label="地区">
<template slot-scope="scope">
{{scope.row.provinceName}}
<template v-if="scope.row.cityName">
-
</template>
{{scope.row.cityName}}
<template v-if="scope.row.districtName">
-
</template>
{{scope.row.districtName}}
</template>
{{scope.row.provinceName}}
<template v-if="scope.row.cityName">
-
</template>
{{scope.row.cityName}}
<template v-if="scope.row.districtName">
-
</template>
{{scope.row.districtName}}
</template>
</el-table-column>
<el-table-column prop="startDate" label="成立日期"></el-table-column>
</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=='third'&& affiliatesTotal>affiliatesParams.pageSize"><span class="a-link" @click="handlePath1">查看更多数据 ></span></div>
<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=='third'&& affiliatesTotal>affiliatesParams.pageSize"><span class="a-link" @click="handlePath1">查看更多数据
></span></div>
</div>
</div>
</template>
<script>
import {encodeStr, changePath} from "@/assets/js/common"
import {bestStockPage, investment,affiliates} from '@/api/detail/party-a/overview'
import NoData from '../../component/noData'
import skeleton from '@/views/project/projectList/component/skeleton'
import { encodeStr, changePath } from "@/assets/js/common";
import { bestStockPage, investment, affiliates } from '@/api/detail/party-a/overview';
import NoData from '../../component/noData';
import skeleton from '@/views/project/projectList/component/skeleton';
export default {
name: 'Relationship',
props: ['companyId', 'financial'],
components: {
NoData,skeleton
NoData, skeleton
},
data() {
return {
isSkeleton:true,
isSkeleton: true,
encodeStr,
activeName:'first',
activeName: 'first',
//表格数据
holderData:[],
holderData: [],
holderParams: {
cid: this.companyId,
isHistory: 0,
pageNum: 1,
pageSize: 100
},
shipData:[],
shipData: [],
shipParams: {
cid: this.companyId,
pageNum: 1,
pageSize: 5
},
shipTotal: 0,
affiliatesData:[],
affiliatesData: [],
affiliatesParams: {
cid: this.companyId,
pageNum: 1,
pageSize: 5
},
affiliatesTotal: 0,
labelArr:['失信联合惩戒企业','严重行政处罚','司法纠纷','注销', '注销企业']
labelArr: ['失信联合惩戒企业', '严重行政处罚', '司法纠纷', '注销', '注销企业'],
childFinancial: {}
};
},
watch: {
financial(newValue) {
this.childFinancial = newValue;
}
},
created() {
this.handleQuery()
this.handleInvest()
this.getAffiliatesData()
this.handleQuery();
this.handleInvest();
this.getAffiliatesData();
},
mounted() {
},
methods: {
async handleQuery(){
async handleQuery() {
this.isSkeleton = true;
let res = await bestStockPage(this.holderParams)
if(res.code==200){
let res = await bestStockPage(this.holderParams);
if (res.code == 200) {
this.isSkeleton = false;
if(res.rows&&res.rows.length>0){
if (res.rows && res.rows.length > 0) {
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(){
let res = await investment(this.shipParams)
if(res.code==200){
if(res.rows&&res.rows.length>0){
async handleInvest() {
let res = await investment(this.shipParams);
if (res.code == 200) {
if (res.rows && res.rows.length > 0) {
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.shipTotal = res.total
this.shipData = res.rows;
this.shipTotal = res.total;
}
},
async getAffiliatesData(){
let res = await affiliates(this.affiliatesParams)
if(res.code==200){
this.affiliatesData = res.rows
this.affiliatesTotal = res.total
async getAffiliatesData() {
let res = await affiliates(this.affiliatesParams);
if (res.code == 200) {
this.affiliatesData = res.rows;
this.affiliatesTotal = res.total;
}
},
handleClick(){
handleClick() {
},
handlePath(){
changePath(this, 'overseas')
handlePath() {
changePath(this, 'overseas');
},
handlePath1(){
changePath(this, 'branch')
handlePath1() {
changePath(this, 'branch');
}
}
}
</script>
<style lang="scss" scoped>
.rela-container{
margin: 0;
padding: 24px 16px;
background: #FFFFFF;
border-radius: 4px;
.selfTab{
margin: 24px 0 0 -12px;
::v-deep .el-tabs__nav-wrap::after{
display: none;
}
::v-deep .el-tabs__item{
height: 30px;
line-height: 30px;
padding: 0 12px;
}
.rela-container {
margin: 0;
padding: 24px 16px;
background: #ffffff;
border-radius: 4px;
.selfTab {
margin: 24px 0 0 -12px;
::v-deep .el-tabs__nav-wrap::after {
display: none;
}
::v-deep .el-tabs__item {
height: 30px;
line-height: 30px;
padding: 0 12px;
}
.table-item{
margin-top: 16px;
.tags{
.tag{
display: inline-block;
border-radius: 2px;
padding: 1px 7px;
margin: 4px 8px 0 0;
&.style1{
background: #E4F3FD;
color: #41A1FD;
}
&.style2{
background: #FFF1F1;
color: #FF3C3C;
}
}
.table-item {
margin-top: 16px;
.tags {
.tag {
display: inline-block;
border-radius: 2px;
padding: 1px 7px;
margin: 4px 8px 0 0;
&.style1 {
background: #e4f3fd;
color: #41a1fd;
}
&.style2 {
background: #fff1f1;
color: #ff3c3c;
}
}
::v-deep .el-table--border .el-table__cell{
border-bottom: 0;
}
}
.rela-person{
width: 100%;
height: 24px;
line-height: 24px;
font-size: 12px;
color: #3D3D3D;
padding: 0 8px;
background: #FDF8E9;
::v-deep .el-table--border .el-table__cell {
border-bottom: 0;
}
.rela-more{
padding-top: 16px;
text-align: center;
span{
cursor: pointer;
}
}
.rela-person {
width: 100%;
height: 24px;
line-height: 24px;
font-size: 12px;
color: #3d3d3d;
padding: 0 8px;
background: #fdf8e9;
}
.rela-more {
padding-top: 16px;
text-align: center;
span {
cursor: pointer;
}
}
}
</style>
dsk-operate-ui/src/views/detail/party-a/overview/component/risk.vue
View file @ 0fa8ec63
......@@ -2,28 +2,18 @@
<div class="app-container clue-container">
<div class="common-title">风险概览</div>
<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">
<el-table
:data="viewData"
border
style="width: 100%"
>
<el-table-column
prop="name"
label="风险纬度分布"></el-table-column>
<el-table-column
prop="value"
align="right"
label="数量">
<el-table :data="viewData" border style="width: 100%">
<el-table-column prop="name" label="风险纬度分布"></el-table-column>
<el-table-column prop="value" align="right" label="数量">
<template slot-scope="scope">
<span>{{ scope.row.value }}</span>
</template>
</el-table-column>
<el-table-column
prop="bl"
align="right"
label="占比（%）">
<el-table-column prop="bl" align="right" label="占比（%）">
<template slot-scope="scope">
<span>{{ scope.row.bl }}</span>
</template>
......@@ -31,13 +21,13 @@
</el-table>
</div>
</div>
<no-data v-else/>
<no-data v-else />
</div>
</template>
<script>
import * as echarts from 'echarts'
import NoData from '../../component/noData'
import * as echarts from 'echarts';
import NoData from '../../component/noData';
export default {
name: 'Risk',
props: ['statistic'],
......@@ -46,14 +36,14 @@ export default {
},
data() {
return {
viewData:[
viewData: [
{
name:'开庭公告',
value:'',
category:'credit',
field:'openAnnouncement',
tz:'',
bl:''
name: '开庭公告',
value: '',
category: 'credit',
field: 'openAnnouncement',
tz: '',
bl: ''
},
/*{
name:'企业公告',
......@@ -80,12 +70,12 @@ export default {
bl:''
},*/
{
name:'法院公告',
value:'',
category:'credit',
field:'courtAnnouncement',
tz:'',
bl:''
name: '法院公告',
value: '',
category: 'credit',
field: 'courtAnnouncement',
tz: '',
bl: ''
},
/*{
name:'立案信息',
......@@ -96,75 +86,76 @@ export default {
bl:''
},*/
{
name:'被执行人',
value:'',
category:'credit',
field:'dishonestExecutee',
tz:'',
bl:''
name: '被执行人',
value: '',
category: 'credit',
field: 'dishonestExecutee',
tz: '',
bl: ''
},
{
name:'失信被执行人',
value:'',
category:'credit',
field:'dishonestExecutor',
tz:'',
bl:''
name: '失信被执行人',
value: '',
category: 'credit',
field: 'dishonestExecutor',
tz: '',
bl: ''
},
{
name:'行政处罚',
value:'',
category:'credit',
field:'adminSanction',
tz:'',
bl:''
name: '行政处罚',
value: '',
category: 'credit',
field: 'adminSanction',
tz: '',
bl: ''
},
],
}
childStatistic: {}
};
},
created() {
},
mounted() {
},
methods: {
handView(){
handView() {
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
return number
}).reduce((prev, cur) => prev + cur)
let number = this.childStatistic[item.category] && this.childStatistic[item.category][item.field] ? this.childStatistic[item.category][item.field] : 0;
return number;
}).reduce((prev, cur) => prev + cur);
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 bl = number ? parseFloat(Number(Number(number)/Number(totalVal)*100).toFixed(2)) : 0
let it = {name:item.name, value:number, tz: '', bl:bl}
return it
})
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 it = { name: item.name, value: number, tz: '', bl: bl };
return it;
});
this.viewData.sort((a, b) => {
return a.value < b.value ? 1 : -1;
})
this.$nextTick(()=>{
if(this.viewData[0].value>0){
});
this.$nextTick(() => {
if (this.viewData[0].value > 0) {
this.getDT();
}
})
});
},
getDT(){
let myChart = echarts.init(document.getElementById("echartsRisk"))
getDT() {
let myChart = echarts.init(document.getElementById("echartsRisk"));
let option = {
tooltip: {
trigger: 'item',
borderWidth:0,
backgroundColor:"rgba(255, 255, 255, 0.8)",
borderWidth: 0,
backgroundColor: "rgba(255, 255, 255, 0.8)",
formatter: function (params) {
var result = ''
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>'
if(params.data.tz){
result+='<p style="color: rgba(35,35,35,0.8);padding: 0;margin: 0;" >'+ params.data.tz +'亿元</p>'
var result = '';
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>';
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.bl+'%</p>'
result += '<p style="color: rgba(35,35,35,0.8);padding: 0;margin: 0;">' + params.data.bl + '%</p>';
return result;
},
extraCssText:'width:150px!important;',
extraCssText: 'width:150px!important;',
},
legend: {
type: 'scroll',
......@@ -172,10 +163,10 @@ export default {
bottom: 20,
data: this.viewData,
pageButtonPosition: 'end',
itemWidth:12,
itemHeight:8,
itemWidth: 12,
itemHeight: 8,
},
color: ['#8A82F3','#5B9CF7','#43BBE0','#8ECF95','#FFDC6B', '#FE9C77', '#E8649B', '#8A82F3'],
color: ['#8A82F3', '#5B9CF7', '#43BBE0', '#8ECF95', '#FFDC6B', '#FE9C77', '#E8649B', '#8A82F3'],
series: [
{
type: 'pie',
......@@ -191,14 +182,15 @@ export default {
}
}
]
}
myChart.setOption(option)
};
myChart.setOption(option);
}
},
watch: {
statistic(newVal, oldVal) {
if(newVal){
this.handView()
this.childStatistic = newVal;
if (newVal) {
this.handView();
}
}
}
......@@ -206,24 +198,24 @@ export default {
</script>
<style lang="scss" scoped>
.clue-container{
margin: 0;
padding: 24px 16px;
background: #FFFFFF;
border-radius: 4px;
.clue-box{
width: 100%;
justify-content: space-between;
margin-top: 20px;
.clue-echarts{
width: calc(50% - 8px);
}
.table-item{
width: calc(50% - 8px);
::v-deep .el-table--border .el-table__cell{
border-bottom: 0;
}
.clue-container {
margin: 0;
padding: 24px 16px;
background: #ffffff;
border-radius: 4px;
.clue-box {
width: 100%;
justify-content: space-between;
margin-top: 20px;
.clue-echarts {
width: calc(50% - 8px);
}
.table-item {
width: calc(50% - 8px);
::v-deep .el-table--border .el-table__cell {
border-bottom: 0;
}
}
}
}
</style>
dsk-operate-ui/src/views/market/index.vue
View file @ 0fa8ec63
<template>
<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" />
<transition name="fade" mode="out-in" appear>
<max-page-size-tip v-if="showMaxPageTip" @closeMaxTip="showMaxPageTip = false"></max-page-size-tip>
</transition>
</div>
</template>
......@@ -39,13 +35,7 @@ export default {
};
},
created() {
if (window.location.host === 'http://szh.jiansheku.com' || window.location.host === 'szh.jiansheku.com') {
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.domain = process.env.VUE_APP_SUB_SYSTEM_ADDRESS;
this.gettokens();
this.iframeObserver();
let that = this;
......@@ -63,7 +53,7 @@ export default {
window.removeEventListener("message", this.pagecapListener, { passive: true });
window.removeEventListener("message", this.linkListener);
// 移除layout样式
this.iframeIns.contentWindow.postMessage("removeHtmlLayoutStyle", { targetOrigin: this.domain, });
this.iframeIns?.contentWindow ? this.iframeIns.contentWindow.postMessage("removeHtmlLayoutStyle", { targetOrigin: this.domain, }) : null;
},
methods: {
linkListener(event) {
......@@ -102,7 +92,9 @@ export default {
const { origin, data } = e;
if (origin != this.domain) return;
if (data == "pageCurrentMaxSize") {
this.showMaxPageTip = true;
this.$maxTip("您可通过筛选工具来查询数据～若有更多需求请联系客服 0262798729！").then(({ done, uid }) => {
done();
});
}
},
gettokens() {
......
dsk-operate-ui/src/views/subsystem/index.vue 0 → 100644
View file @ 0fa8ec63
<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