*

dsk-operate-ui/src/api/common.js

+import request from '@/utils/request'
+
+// id解密
+export const idRemark = (data) => {
+  return request({
+    url: '/user/jsk/change/remark',
+    method: 'post',
+    data: data
+  })
+}

dsk-operate-ui/src/api/detail/party-a/index.js

+import request from "@/utils/request";
+
+// 企业头部信息
+export function infoHeader(data) {
+  return request({
+    url: '/api-module-data/enterprise/infoHeader',
+    method: 'post',
+    data: data
+  })
+}

dsk-operate-ui/src/assets/js/common.js

+// companyId加密
+let encodeStr = function(str, secondary) {
+  const table = 'VyB2Kz79QWYjpiD5lRCIMwJEhqFSx0GN1cveZfU4gs6rk8dPbLtAomOnT3'
+  const ss = [2, 7, 5, 1, 4, 8, 3, 0, 6]
+  const xor = 177451812
+  const add = 8728348608
+  const mp2 = new Map()
+  let content = secondary ? str : '         '
+  let result = '' // 最终加密id
+  if (!secondary) {
+    let s = parseInt(str)
+    s = (s ^ xor) + add
+    for (let i = 0; i < table.length; i++) {
+      const s1 = table.substring(i, i + 1)
+      mp2.set(i, s1)
+    }
+    for (let i = 0; i < 9; i++) {
+      const r = mp2.get(parseInt(s / power(58, i) % 58))
+      content = changeStr(content, ss[i], r)
+    }
+  }
+  // 二次加密
+  const idArr = content.split('')
+  for (var i = 0; i < idArr.length; i++) {
+    const hex = idArr[i].charCodeAt().toString(16)
+    result = result + hex
+  }
+  return result
+}
+
+function power(a, b) {
+  let power = 1
+  for (let c = 0; c < b; c++) {
+    power *= a
+  }
+  return power
+}
+
+function changeStr(str, index, changeStr) {
+  return str.substr(0, index) + changeStr + str.substr(index + changeStr.length)
+}
+
+export {
+  encodeStr
+}

dsk-operate-ui/src/views/detail/party-a/component/Header.vue

@@ -2,8 +2,8 @@
   <div class="header-container">
     <div class="bread-crumb">
       <el-breadcrumb separator="/">
-        <el-breadcrumb-item :to="{ path: '/' }">企业数据</el-breadcrumb-item>
-        <el-breadcrumb-item><a href="/">查企业</a></el-breadcrumb-item>
+        <el-breadcrumb-item :to="{ path: '/enterpriseData' }">企业数据</el-breadcrumb-item>
+        <el-breadcrumb-item :to="{ path: '/enterpriseData?tag=1' }">查企业</el-breadcrumb-item>
         <el-breadcrumb-item>中铁一建</el-breadcrumb-item>
       </el-breadcrumb>
     </div>
@@ -15,15 +15,25 @@
 </template>
 
 <script>
+import { infoHeader } from '@/api/detail/party-a/index'
 export default {
   name: 'Header',
+  props: ['companyId'],
   data() {
     return {
+      enterprise: {}
     }
   },
   created() {
+    this.getInfoHeader()
   },
   methods: {
+    async getInfoHeader(){
+      let { data } = await infoHeader({companyId:this.companyId})
+      if( data.code == 200){
+        this.enterprise = data.data
+      }
+    }
   }
 }
 </script>

dsk-operate-ui/src/views/detail/party-a/financial/index.vue

@@ -57,8 +57,10 @@
 import * as echarts from 'echarts';
 export default {
   name: 'Financial',
+  props: ['companyId'],
   data() {
     return {
+      // 资产情况
       zcqkList: [
         { name: '总资产', ico: require('@/assets/images/detail/financial/zcqk_ico1.png'), intro: '总资产越大，表示企业规模越大', amount: '99213', unit: '亿元'},
         { name: '净资产', ico: require('@/assets/images/detail/financial/zcqk_ico2.png'), intro: '该指标越大说明企业实力越强', amount: '99213', unit: '亿元'},
@@ -70,12 +72,20 @@ export default {
         { name: '应收类款项来自政府占比', ico: require('@/assets/images/detail/financial/zcqk_ico8.png'), intro: '该指标越大，说明企业资质及信用越好', amount: '99213', unit: '亿元'},
         { name: '政府补助', ico: require('@/assets/images/detail/financial/zcqk_ico9.png'), intro: '该指标越大，说明企业越被政府看好与扶持', amount: '99213', unit: '亿元'}
       ],
+      // 负债情况及偿债能力
       zwqkList: [
         { name: '借款总额', ico: require('@/assets/images/detail/financial/zwqk_ico1.png'), intro: '借款/有息债务', introPro: '95.19%', amount: '1699.7', unit: '亿元'},
         { name: '债券余额', ico: require('@/assets/images/detail/financial/zwqk_ico2.png'), intro: '债券余额/有息债务', introPro: '95.19%', amount: '1699.7', unit: '亿元'},
         { name: '非标余额', ico: require('@/assets/images/detail/financial/zwqk_ico3.png'), intro: '非标余额/有息债务', introPro: '95.19%', amount: '1699.7', unit: '亿元'},
         { name: '对外担保金额', ico: require('@/assets/images/detail/financial/zwqk_ico4.png'), intro: '对外担保比例', introPro: '95.19%', amount: '1699.7', unit: '亿元'}
       ],
+      echartsData: [
+        { value: 1048, name: '有息债务' },
+        { value: 735, name: '有息债务/总债务' },
+        { value: 580, name: '综合融资成本' },
+        { value: 484, name: 'EBITDA保障倍数' }
+      ],
+      // 资金情况
       zjqkList: [
         { name: '经营现金流', ico: require('@/assets/images/detail/financial/zjqk_ico1.png'), intro: '该指标越高，说明经营活动的造血能力越强', amount: '99213', unit: '亿元'},
         { name: '现金比率', ico: require('@/assets/images/detail/financial/zjqk_ico2.png'), intro: '该指标越高，风险越低', amount: '0.8', unit: '%'},
@@ -83,16 +93,11 @@ export default {
         { name: '现金流量比率', ico: require('@/assets/images/detail/financial/zjqk_ico4.png'), intro: '该指标越高，风险越低', amount: '0.8', unit: '%'},
         { name: '投资现金流', ico: require('@/assets/images/detail/financial/zjqk_ico5.png'), intro: '该指标越高，说明投资带来的收益越高', amount: '99213', unit: '亿元'},
         { name: '现金到期债务比', ico: require('@/assets/images/detail/financial/zjqk_ico6.png'), intro: '该指标越高，风险越低', amount: '0.8', unit: '%'}
-      ],
-      echartsData: [
-        { value: 1048, name: '有息债务' },
-        { value: 735, name: '有息债务/总债务' },
-        { value: 580, name: '综合融资成本' },
-        { value: 484, name: 'EBITDA保障倍数' }
       ]
     }
   },
   computed: {
+    //判断奇偶
     parity() {
       return function(val) {
         let flag = true

dsk-operate-ui/src/views/detail/party-a/index.vue

 <template>
   <div class="app-container part-container">
-    <Header />
+    <Header :company-id="companyId" v-if="companyId" />
     <div class="flex-box part-main">
       <div class="part-left">
         <side-bar @currentPath="showPartPage" :partBoxHeight="partBoxHeight" />
       </div>
       <div class="part-right">
-        <div id="partBox">
+        <div id="partBox" v-if="companyId">
           <Overview v-if="currentPath.pathName=='overview'" />
           <Businfo v-if="currentPath.pathName=='businfo'" />
           <Holderinfo v-if="currentPath.pathName=='holderinfo'" />
           <Execuinfo v-if="currentPath.pathName=='execuinfo'" />
           <Overseas v-if="currentPath.pathName=='overseas'" />
           <Branch v-if="currentPath.pathName=='branch'" />
-          <Financial v-if="currentPath.pathName=='financial'" />
+          <Financial v-if="currentPath.pathName=='financial'" :company-id="companyId" />
           <Business v-if="currentPath.pathName=='business'" />
         </div>
       </div>
@@ -22,6 +22,7 @@
 </template>
 
 <script>
+import { idRemark } from '@/api/common'
 import elementResizeDetectorMaker from "element-resize-detector"
 import Header from "./component/Header"
 import SideBar from "./component/Sidebar"
@@ -32,7 +33,7 @@ import Execuinfo from "./overview/execuinfo"   //企业概览-高管信息
 import Overseas from "./overview/overseas"   //企业概览-对外投资
 import Branch from "./overview/branch"   //企业概览-分支机构
 import Financial from "./financial" //财务简析
-import Business from "./business" //商务信息
+import Business from "./business"
 export default {
   name: 'PartyA',
   components: {
@@ -49,6 +50,7 @@ export default {
   },
   data() {
     return {
+      companyId: 3068,  //企业Id（测试默认3068）
       currentPath: {
         pathName: 'overview'  //默认展示页
       },
@@ -56,6 +58,13 @@ export default {
     }
   },
   created() {
+    if (this.$route.query.companyId) { // 获取companyId
+      let id = this.$route.query.companyId
+      this.getCompanyId(id)
+    }
+    if (this.$route.query.path) { // 获取跳转对应板块
+      this.currentPath.pathName = this.$route.query.path
+    }
   },
   mounted() {
     const _this = this, erd = elementResizeDetectorMaker(), partBox = document.getElementById("partBox")
@@ -68,6 +77,13 @@ export default {
   methods: {
     showPartPage(e){
       this.currentPath = e
+    },
+    // 解密
+    async getCompanyId(companyId){
+      let { data } = await idRemark({companyId})
+      if( data.code == 200){
+        this.companyId = data.data
+      }
     }
   }
 }

dsk-operate-ui/src/views/detail/party-a/overview/component/bidding.vue

@@ -123,6 +123,10 @@ export default {
           axisPointer:{ //悬浮于圆点展示标签
             type:'axis'
           },
+          borderWidth:0,
+          backgroundColor:"rgba(255, 255, 255, 0.8)",
+          formatter: '{a}<br/>{c}',
+          extraCssText:'width:100px!important;',
         },
         series: [
           {
@@ -254,6 +258,7 @@ export default {
         position: relative;
         font-weight: bold;
         margin-top: 35px;
+        font-size: 14px;
         .labels{
           width: 120px;
           height: 22px;

dsk-operate-ui/src/views/detail/party-a/overview/component/busclue.vue

@@ -9,7 +9,7 @@
       <div class="clue-echarts"><div id="echartsClue" style="width: 100%;height:300px; margin: 0 auto;"></div></div>
       <div class="table-item">
         <el-table
-          :data="tableData"
+          :data="activeName=='first'?viewData:projectData"
           border
           style="width: 100%"
           :default-sort = "{prop: 'date', order: 'descending'}"
@@ -18,24 +18,24 @@
             prop="name"
             label="名称"></el-table-column>
           <el-table-column
-            prop="number"
+            prop="value"
             label="数量">
             <template slot-scope="scope">
-              <div style="text-align: right">{{ scope.row.number }}</div>
+              <div style="text-align: right">{{ scope.row.value }}</div>
             </template>
           </el-table-column>
           <el-table-column
-            prop="amount"
+            prop="percent"
             label="占比">
             <template slot-scope="scope">
-              <div style="text-align: right">{{ scope.row.amount }}</div>
+              <div style="text-align: right">{{ scope.row.percent }}</div>
             </template>
           </el-table-column>
         </el-table>
       </div>
     </div>
     <div class="flex-box clue-type">
-      <div class="flex-box clue-type-item" :class="{'on':typeName==index}" v-for="(item, index) in typeList" :key="index" @click="handleType(index)"><img :src="item.ico">{{item.name}}</div>
+      <div class="flex-box clue-type-item" :class="typeName==index&&!item.disabled?'on':item.disabled?'disab':''" v-for="(item, index) in typeList" :key="index" @click="handleType(item, index)"><img :src="item.disabled?item.dis_ico:item.ico">{{item.name}}</div>
     </div>
   </div>
 </template>
@@ -49,43 +49,67 @@ export default {
       viewData:[
         {
           name:'7亿~12亿',
-          value:'12'
+          value:'12',
+          percent: '12%'
         },
         {
           name:'4亿~6亿',
-          value:'2'
+          value:'2',
+          percent: '12%'
         },
         {
           name:'1亿~3亿',
-          value:'42'
+          value:'42',
+          percent: '12%'
         },
         {
           name:'5000万~1亿',
-          value:'2'
+          value:'2',
+          percent: '12%'
         },
         {
           name:'5000万以下',
-          value:'2'
+          value:'2',
+          percent: '12%'
+        },
+      ],
+      projectData:[
+        {
+          name:'公路工程',
+          value:'22',
+          percent: '12%'
+        },
+        {
+          name:'房建工程',
+          value:'12',
+          percent: '12%'
+        },
+        {
+          name:'水利工程',
+          value:'32',
+          percent: '12%'
+        },
+        {
+          name:'铁路工程',
+          value:'16',
+          percent: '12%'
+        },
+        {
+          name:'市政工程',
+          value:'8',
+          percent: '12%'
         },
       ],
       activeName:'first',
       typeName: 0,
-      //表格数据
-      tableData:[
-        {name: '7亿～10亿', number: '2', amount: '0.19%'},
-        {name: '4亿~6亿', number: '2', amount: '0.19%'},
-        {name: '1亿~3亿', number: '2', amount: '0.19%'},
-        {name: '5000万~1亿', number: '2', amount: '0.19%'},
-        {name: '5000万以下', number: '2', amount: '0.19%'}
-      ],
       typeList:[
-        {name: '土地交易', ico: require("@/assets/images/detail/overview/clue_ico1.png")},
-        {name: '拟建项目', ico: require("@/assets/images/detail/overview/clue_ico2.png")},
-        {name: '专项债项目', ico: require("@//assets/images/detail/overview/clue_ico3.png")},
-        {name: '招标计划', ico: require("@/assets/images/detail/overview/clue_ico4.png")},
-        {name: '招标公告', ico: require("@/assets/images/detail/overview/clue_ico5.png")},
-        {name: '标讯Pro', ico: require("@/assets/images/detail/overview/clue_ico6.png")},
-        {name: '行政许可', ico: require("@/assets/images/detail/overview/clue_ico7.png")},
+        {name: '土地交易', ico: require("@/assets/images/detail/overview/clue_ico1.png"), disabled: false, dis_ico: require("@/assets/images/detail/overview/clue_dis_ico1.png")},
+        {name: '拟建项目', ico: require("@/assets/images/detail/overview/clue_ico2.png"), disabled: false, dis_ico: require("@/assets/images/detail/overview/clue_dis_ico2.png")},
+        {name: '专项债项目', ico: require("@//assets/images/detail/overview/clue_ico3.png"), disabled: true, dis_ico: require("@/assets/images/detail/overview/clue_dis_ico3.png")},
+        {name: '招标计划', ico: require("@/assets/images/detail/overview/clue_ico4.png"), disabled: false, dis_ico: require("@/assets/images/detail/overview/clue_dis_ico4.png")},
+        {name: '招标公告', ico: require("@/assets/images/detail/overview/clue_ico5.png"), disabled: true, dis_ico: require("@/assets/images/detail/overview/clue_dis_ico5.png")},
+        {name: '标讯Pro', ico: require("@/assets/images/detail/overview/clue_ico6.png"), disabled: false, dis_ico: require("@/assets/images/detail/overview/clue_dis_ico6.png")},
+        {name: '行政许可', ico: require("@/assets/images/detail/overview/clue_ico7.png"), disabled: false, dis_ico: require("@/assets/images/detail/overview/clue_dis_ico7.png")},
       ]
     }
   },
@@ -97,20 +121,21 @@ export default {
     })
   },
   methods: {
-    getDT(){
-      let myChart = echarts.init(document.getElementById("echartsClue"))
+    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)",
           formatter: '{b}<br/>{d}%',
+          extraCssText:'width:100px!important;',
         },
         legend: {
           type: 'scroll',
           orient: 'horizontal',
           bottom: 20,
-          data: this.viewData,
+          data: data,
           pageButtonPosition: 'end',
         },
         color: ['#8A82F3','#5B9CF7','#43BBE0','#8ECF95','#FFDC6B'],
@@ -119,7 +144,7 @@ export default {
             type: 'pie',
             radius: '55%',
             center: ['50%', '40%'],
-            data: this.viewData,
+            data: data,
             emphasis: {
               itemStyle: {
                 shadowBlur: 10,
@@ -133,10 +158,16 @@ export default {
       myChart.setOption(option)
     },
     handleClick(){
-
+      if(this.activeName=='first'){
+        this.getDT(this.viewData)
+      }else{
+        this.getDT(this.projectData)
+      }
     },
-    handleType(idx){
-      this.typeName = idx
+    handleType(it, idx){
+      if(!it.disabled){
+        this.typeName = idx
+      }
     }
   }
 }
@@ -148,7 +179,7 @@ export default {
     padding: 24px 16px;
     background: #FFFFFF;
     .selfTab{
-      margin: 30px 0 0 -12px;
+      margin: 24px 0 0 -12px;
       ::v-deep .el-tabs__nav-wrap::after{
         display: none;
       }
@@ -168,7 +199,9 @@ export default {
       }
       .table-item{
         width: calc(50% - 8px);
-        margin-top:15px;
+        ::v-deep .el-table--border .el-table__cell{
+          border-bottom: 0;
+        }
       }
     }
     .clue-type{
@@ -186,6 +219,9 @@ export default {
         &.on{
           color: #0081FF;
         }
+        &.disable{
+          color: rgba(35,35,35,0.4);
+        }
         img{
           width: 40px;
           height: 40px;

dsk-operate-ui/src/views/detail/party-a/overview/component/relationship.vue

+<template>
+  <div class="app-container rela-container">
+    <div class="common-title">关系企业</div>
+    <el-tabs v-model="activeName" @tab-click="handleClick" class="tabpane selfTab">
+      <el-tab-pane label="股东" name="first"></el-tab-pane>
+      <el-tab-pane label="对外投资" name="second"></el-tab-pane>
+    </el-tabs>
+    <div class="table-item">
+      <div class="rela-person" v-if="activeName=='first'">实际控制人：<router-link to="" tag="a" class="a-link">重庆市国有资产监督管理委员会</router-link></div>
+      <el-table :data="holderData" border style="width: 100%" :default-sort = "{prop: 'date', order: 'descending'}" v-if="activeName=='first'">
+        <el-table-column label="序号" width="55" align="left" fixed>
+          <template slot-scope="scope">{{ pageIndex * pageSize - pageSize + scope.$index + 1 }}</template>
+        </el-table-column>
+        <el-table-column prop="name" min-width="140" label="股东名称"></el-table-column>
+        <el-table-column prop="cgsl" label="持股数量（亿）"></el-table-column>
+        <el-table-column prop="cgbl" label="持股比例"></el-table-column>
+        <el-table-column prop="fddbr" label="法定代表人"></el-table-column>
+        <el-table-column prop="clrq" label="成立日期"></el-table-column>
+      </el-table>
+      <el-table :data="shipData" border style="width: 100%" :default-sort = "{prop: 'date', order: 'descending'}" v-else>
+        <el-table-column label="序号" width="55" align="left" fixed>
+          <template slot-scope="scope">{{ pageIndex * pageSize - pageSize + scope.$index + 1 }}</template>
+        </el-table-column>
+        <el-table-column prop="name" min-width="140" label="被投资企业名称">
+          <template slot-scope="scope">
+            <router-link to="" tag="a" class="a-link">{{ scope.row.name }}</router-link>
+            <div class="tags" v-if="scope.row.nAjlx">
+              <span class="tag style1">{{scope.row.nAjlx}}</span>
+              <span class="tag style1">{{scope.row.nAjlx}}</span>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column prop="fddbr" label="法定代表人"></el-table-column>
+        <el-table-column prop="zczb" label="注册资本（万元）">
+          <template slot-scope="scope">
+            <div style="text-align: right">{{ scope.row.zczb }}</div>
+          </template>
+        </el-table-column>
+        <el-table-column prop="clrq" label="成立日期"></el-table-column>
+        <el-table-column prop="gqzb" label="股权占比">
+          <template slot-scope="scope">
+            <div style="text-align: right">{{ scope.row.gqzb }}</div>
+          </template>
+        </el-table-column>
+        <el-table-column prop="rjcze" label="认缴出资额（万元）">
+          <template slot-scope="scope">
+            <div style="text-align: right">{{ scope.row.rjcze }}</div>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="rela-more" v-if="activeName=='second'"><router-link to="" tag="a" class="a-link">查看更多数据 ></router-link></div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Relationship',
+  data() {
+    return {
+      activeName:'first',
+      //表格数据
+      holderData:[
+        {name: '重庆城市交通开发投资 (集团)有限公司', cgsl: '60.00', cgbl: '100%', fddbr: '李方宇', clrq: '1994-11-09'},
+        {name: '重庆城市交通开发投资 (集团)有限公司', cgsl: '60.00', cgbl: '100%', fddbr: '李方宇', clrq: '1994-11-09'}
+      ],
+      shipData:[
+        {name: '深圳市地铁集团有限建设总部', nAjlx: '招标', fddbr: '雷江松', zczb: '15100', clrq: '1920-02-21', gqzb: '35%', rjcze: '2133'},
+        {name: '深圳市地铁集团有限建设总部', nAjlx: '招标', fddbr: '雷江松', zczb: '15100', clrq: '1920-02-21', gqzb: '35%', rjcze: '2133'},
+        {name: '深圳市地铁集团有限建设总部', nAjlx: '招标', fddbr: '雷江松', zczb: '15100', clrq: '1920-02-21', gqzb: '35%', rjcze: '2133'},
+        {name: '深圳市地铁集团有限建设总部', nAjlx: '招标', fddbr: '雷江松', zczb: '15100', clrq: '1920-02-21', gqzb: '35%', rjcze: '2133'},
+        {name: '深圳市地铁集团有限建设总部', nAjlx: '招标', fddbr: '雷江松', zczb: '15100', clrq: '1920-02-21', gqzb: '35%', rjcze: '2133'}
+      ],
+      pageIndex: 1,
+      pageSize: 10
+    }
+  },
+  created() {
+  },
+  mounted() {
+  },
+  methods: {
+    handleClick(){
+
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .rela-container{
+    margin: 0;
+    padding: 24px 16px;
+    background: #FFFFFF;
+    .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;
+          }
+        }
+      }
+      ::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;
+    }
+    .rela-more{
+      padding-top: 16px;
+      text-align: center;
+    }
+  }
+</style>

dsk-operate-ui/src/views/detail/party-a/overview/component/risk.vue

+<template>
+  <div class="app-container clue-container">
+    <div class="common-title">风险概览</div>
+    <div class="flex-box clue-box">
+      <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%"
+          :default-sort = "{prop: 'date', order: 'descending'}"
+        >
+          <el-table-column
+            prop="name"
+            label="风险纬度分布"></el-table-column>
+          <el-table-column
+            prop="value"
+            label="数量">
+            <template slot-scope="scope">
+              <div style="text-align: right">{{ scope.row.value }}</div>
+            </template>
+          </el-table-column>
+          <el-table-column
+            prop="bl"
+            label="占比">
+            <template slot-scope="scope">
+              <div style="text-align: right">{{ scope.row.bl }}</div>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import * as echarts from 'echarts'
+export default {
+  name: 'Risk',
+  data() {
+    return {
+      viewData:[
+        {
+          name:'开庭公告',
+          value:'2',
+          tz:'50.01',
+          bl:'0.19%'
+        },
+        {
+          name:'企业公告',
+          value:'2',
+          tz:'50.01',
+          bl:'0.19%'
+        },
+        {
+          name:'送达公告',
+          value:'2',
+          tz:'50.01',
+          bl:'0.19%'
+        },
+        {
+          name:'对外投资变更',
+          value:'7',
+          tz:'50.01',
+          bl:'0.19%'
+        },
+        {
+          name:'法院公告',
+          value:'2',
+          tz:'50.01',
+          bl:'0.19%'
+        },
+        {
+          name:'立案信息',
+          value:'3',
+          tz:'50.01',
+          bl:'0.19%'
+        },
+        {
+          name:'被执行人',
+          value:'5',
+          tz:'50.01',
+          bl:'0.19%'
+        },
+        {
+          name:'行政处罚',
+          value:'11',
+          tz:'50.01',
+          bl:'0.19%'
+        },
+      ]
+    }
+  },
+  created() {
+  },
+  mounted() {
+    this.$nextTick(()=>{
+      this.getDT()
+    })
+  },
+  methods: {
+    getDT(){
+      let myChart = echarts.init(document.getElementById("echartsRisk"))
+      let option = {
+        tooltip: {
+          trigger: 'item',
+          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>'
+            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>'
+            return result;
+          },
+          extraCssText:'width:150px!important;',
+        },
+        legend: {
+          type: 'scroll',
+          orient: 'horizontal',
+          bottom: 20,
+          data: this.viewData,
+          pageButtonPosition: 'end',
+        },
+        color: ['#8A82F3','#5B9CF7','#43BBE0','#8ECF95','#FFDC6B', '#FE9C77', '#E8649B', '#8A82F3'],
+        series: [
+          {
+            type: 'pie',
+            radius: '55%',
+            center: ['50%', '40%'],
+            data: this.viewData,
+            emphasis: {
+              itemStyle: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
+              }
+            }
+          }
+        ]
+      }
+      myChart.setOption(option)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .clue-container{
+    margin: 0;
+    padding: 24px 16px;
+    background: #FFFFFF;
+    .clue-box{
+      width: 100%;
+      justify-content: space-between;
+      align-items: normal;
+      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/detail/party-a/overview/component/senior.vue

+<template>
+  <div class="app-container rela-container">
+    <div class="common-title">高管</div>
+    <div class="table-item">
+      <el-table
+        :data="tableData"
+        border
+        style="width: 100%"
+        :default-sort = "{prop: 'date', order: 'descending'}"
+      >
+        <el-table-column label="序号" width="55" align="left" fixed>
+          <template slot-scope="scope">{{ pageIndex * pageSize - pageSize + scope.$index + 1 }}</template>
+        </el-table-column>
+        <el-table-column
+          prop="name"
+          label="姓名"></el-table-column>
+        <el-table-column
+          prop="zw"
+          label="职务"></el-table-column>
+      </el-table>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Senior',
+  data() {
+    return {
+      //表格数据
+      tableData:[
+        {name: '重庆城市交通开发投资 (集团)有限公司', zw: '董事'}
+      ],
+      pageIndex: 1,
+      pageSize: 10
+    }
+  },
+  created() {
+  },
+  mounted() {
+  },
+  methods: {
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .rela-container{
+    margin: 0;
+    padding: 24px 16px;
+    background: #FFFFFF;
+    .table-item{
+      margin-top: 16px;
+      ::v-deep .el-table--border .el-table__cell{
+        border-bottom: 0;
+      }
+    }
+  }
+</style>

dsk-operate-ui/src/views/detail/party-a/overview/component/tender.vue

+<template>
+  <div class="flex-box app-container part-container">
+    <div class="tender-list">
+      <div class="common-title">招标公告</div>
+      <div class="tender-item" v-for="(item, index) in zbggList" :key="index">
+        <div class="flex-box tender-title">{{item.name}}<span :class="item.tag=='项目动态'?'style2':item.tag=='招投标'?'style4':'style1'">{{item.tag}}</span></div>
+        <span class="tender-time">{{item.tip}} {{item.time}}</span>
+      </div>
+    </div>
+    <div class="tender-list">
+      <div class="common-title">企业动态</div>
+      <div class="tender-item" v-for="(item, index) in trendList" :key="index">
+        <div class="flex-box tender-title">{{item.name}}<span :class="item.tag=='新增分支机构'?'style2':item.tag=='新增施工工法'?'style3':'style1'">{{item.tag}}</span></div>
+        <span class="tender-time">{{item.time}}</span>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Tender',
+  data() {
+    return {
+      //招标公告数据
+      zbggList:[
+        {name: '深圳北站片区正建超大型商场，预计2026年建成', tag: '公司经营', tip: '通信信息报', time: '03-21'},
+        {name: '深圳北站片区正建超大型商场，预计2026年建成', tag: '项目动态', tip: '通信信息报', time: '03-21'},
+        {name: '深圳北站片区正建超大型商场，预计2026年建成', tag: '公司经营', tip: '通信信息报', time: '03-21'},
+        {name: '深圳北站片区正建超大型商场，预计2026年建成', tag: '招投标', tip: '通信信息报', time: '03-21'},
+        {name: '深圳北站片区正建超大型商场，预计2026年建成', tag: '公司经营', tip: '通信信息报', time: '03-21'}
+      ],
+      //企业动态数据
+      trendList:[
+        {name: '深圳北站片区正建超大型商场，预计2026年建成', tag: '对外投资变更', time: '03-21'},
+        {name: '深圳北站片区正建超大型商场，预计2026年建成', tag: '新增分支机构', time: '03-21'},
+        {name: '深圳北站片区正建超大型商场，预计2026年建成', tag: '新增分支机构', time: '03-21'},
+        {name: '深圳北站片区正建超大型商场，预计2026年建成', tag: '新增施工工法', time: '03-21'},
+        {name: '深圳北站片区正建超大型商场，预计2026年建成', tag: '新增施工工法', time: '03-21'}
+      ]
+    }
+  },
+  created() {
+  },
+  mounted() {
+  },
+  methods: {
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .part-container{
+    margin: 0;
+    padding: 0;
+    justify-content: space-between;
+    align-items: normal;
+    .tender-list{
+      width: calc(50% - 8px);
+      padding: 24px 16px;
+      background: #FFFFFF;
+      overflow: hidden;
+      .common-title{
+        margin-bottom: 10px;
+      }
+      .tender-item{
+        padding: 16px 0;
+        border-bottom: 1px solid #EEEEEE;
+        .tender-title{
+          color: #232323;
+          justify-content: space-between;
+          align-items: normal;
+          span{
+            height: 22px;
+            line-height: 22px;
+            padding: 1px 7px;
+            border-radius: 2px;
+            flex-shrink: 0;
+            margin-left: 20px;
+            margin-top: 3px;
+            &.style1{
+              background: #E4F3FD;
+              font-size: 12px;
+              color: #41A1FD;
+            }
+            &.style2{
+              background: #F3F3FF;
+              font-size: 12px;
+              color: #8491E8;
+            }
+            &.style3{
+              background: #ECF6E7;
+              font-size: 12px;
+              color: #54BC7E;
+            }
+            &.style4{
+              background: #E5EEFC;
+              font-size: 12px;
+              color: #006EE4;
+            }
+          }
+        }
+        .tender-time{
+          display: block;
+          padding-top: 8px;
+          color: rgba(35,35,35,0.4);
+        }
+      }
+    }
+  }
+</style>

dsk-operate-ui/src/views/detail/party-a/overview/overview.vue

 <template>
   <div class="app-container part-container">
     企业速览
-    <div class="view-content"><Operations /></div>
-    <div class="view-content"><Bidding /></div>
-    <div class="view-content"><Busclue /></div>
+    <div class="view-content"><Operations /></div><!-- 公司经营 -->
+    <div class="view-content"><Bidding /></div><!--招标偏好、业务往来-->
+    <div class="view-content"><Busclue /></div><!--商机线索-->
+    <div class="view-content"><Relationship /></div><!--关系企业-->
+    <div class="view-content"><Senior /></div><!--高管-->
+    <div class="view-content"><Risk /></div><!--风险概览-->
+    <div class="view-content"><Tender /></div><!--招标公告、企业动态-->
   </div>
 </template>
 
@@ -11,12 +15,21 @@
 import Operations from "./component/operations"
 import Bidding from "./component/bidding"
 import Busclue from './component/busclue'
+import Relationship from './component/relationship'
+import Senior from './component/senior'
+import Risk from './component/risk'
+import Tender from "./component/tender"
 export default {
   name: 'Overview',
+  props: ['companyId'],
   components: {
     Operations,
     Bidding,
-    Busclue
+    Busclue,
+    Relationship,
+    Senior,
+    Risk,
+    Tender
   },
   data() {
     return {

dsk-operate-ui/src/views/detail/party-b/index.vue

@@ -13,7 +13,6 @@ export default {
   data() {
     return {
       loading: false, // 是否加载中
-      companyId: null, // 企业ID
       iframeHight: window.innerHeight, // iframe高度
       scrollTop: 0, // 滚动条距离内部页面顶部距离
       token: this.$store.getters.token // 需要携带的token
@@ -22,10 +21,8 @@ export default {
   created() {
     if (this.$route.query.companyId) { // 获取companyId
       this.loading = true
-      this.companyId = this.encodeStr(window.atob(this.$route.query.companyId))
-      this.src = `https://pre-plug.jiansheku.com/enterprise/${this.companyId}?token=${this.token}`
+      this.src = `https://pre-plug.jiansheku.com/enterprise/${this.$route.query.companyId}?token=${this.token}`
     }
-    // 示例传参：?companyId=window.btoa('6034')
   },
   mounted() {
     this.getInframeHight() // 实时控制iframe高度
@@ -66,45 +63,6 @@ export default {
         const ifa = this.$refs.companyIframe
         ifa.contentWindow.postMessage({ 'scrollTop': this.scrollTop }, '*')
       })
-    },
-    // companyId加密
-    encodeStr(str, secondary) {
-      const table = 'VyB2Kz79QWYjpiD5lRCIMwJEhqFSx0GN1cveZfU4gs6rk8dPbLtAomOnT3'
-      const ss = [2, 7, 5, 1, 4, 8, 3, 0, 6]
-      const xor = 177451812
-      const add = 8728348608
-      const mp2 = new Map()
-      let content = secondary ? str : '         '
-      let result = '' // 最终加密id
-      if (!secondary) {
-        let s = parseInt(str)
-        s = (s ^ xor) + add
-        for (let i = 0; i < table.length; i++) {
-          const s1 = table.substring(i, i + 1)
-          mp2.set(i, s1)
-        }
-        for (let i = 0; i < 9; i++) {
-          const r = mp2.get(parseInt(s / this.power(58, i) % 58))
-          content = this.changeStr(content, ss[i], r)
-        }
-      }
-      // 二次加密
-      const idArr = content.split('')
-      for (var i = 0; i < idArr.length; i++) {
-        const hex = idArr[i].charCodeAt().toString(16)
-        result = result + hex
-      }
-      return result
-    },
-    power(a, b) {
-      let power = 1
-      for (let c = 0; c < b; c++) {
-        power *= a
-      }
-      return power
-    },
-    changeStr(str, index, changeStr) {
-      return str.substr(0, index) + changeStr + str.substr(index + changeStr.length)
     }
   }
 }