page.vue 2.94 KB
Newer Older
乐宝呗666's avatar
乐宝呗666 committed
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93
<template>
  <d2-container class="mainPage">
      <headerLayout></headerLayout>
      <div class="section">
         <div style="position: absolute; width: 250px; left: 630px; z-index: 1; top: 20px">
              <el-button @click="getData(1)">客户</el-button>
              <el-button @click="getData(2)">商机</el-button>
              <el-button @click="getData(3)">项目</el-button>
            </div>
          <mapChina :message="mapChina" idstr="mapChina" class="mapChina"></mapChina>
          <div class="leftBlock">
              <deptIntroduction class="deptIntroduction"></deptIntroduction>
              <deptOperation class="deptOperation"></deptOperation>
          </div>
          <clientDistributed class="clientDistributed"></clientDistributed>
          <div class="rightBlock">
              <knowledgeGraph class="knowledgeGraph"></knowledgeGraph>
              <companyNews class="companyNews"></companyNews>
              <companyHotWord class="companyHotWord"></companyHotWord>
          </div>
      </div>
  </d2-container>
</template>

<script>
import headerLayout from './components/headerLayout' // 公共头部
import mapChina from './components/mainPageEcharts/mapChina' // 地图
import deptIntroduction from './components/deptIntroduction'// 部门介绍
import deptOperation from './components/deptOperation'// 部门运营
import clientDistributed from './components/clientDistributed'// 客户增长分布
import knowledgeGraph from './components/knowledgeGraph'// 知识图谱
import companyNews from './components/companyNews'// 公司新闻
import companyHotWord from './components/companyHotWord'// 企业热词
  import * as API_BASIC from '@/api/sys.basic.js'

export default {
  components: { headerLayout, mapChina, deptIntroduction, deptOperation, clientDistributed, knowledgeGraph, companyNews, companyHotWord },
  data () {
    return {
      newData: [],
      mapChina: [],
      type : 1
    }
  },
  mounted () {
    this.GET_MapChina()
  },
  methods: {
    getData(type) {
      this.type = type
      this.GET_MapChina();
    },
    GET_MapChina() {
      const type = this.type
      API_BASIC.GetMapChina(type).then(res => {
        this.newData = res.data
        this.newData.forEach(e => {
            var arr = { 'name': e['area'], 'value': e['num'] }    
              this.mapChina.push(arr)
        });
      })
    },
    // 方法
    handleSure () {
      deleteKmz({
        'kmzId': this.delMsg.deleteId,
        'userId': this.delMsg.userId
      }).then(res => {
        console.log(res)
        if (res.code == 200) {
          this.$message.success('success')
        } else {
          this.$message.error(res.message)
        }
      }).catch(err => {
        console.log('err', err)
      })
    }

  }
}
</script>

<style lang="scss" scoped>
  @import '~@/assets/style/mainPage.scss';
</style>
<style  lang="scss">
  .mainPage{
    .el-tabs__active-bar,.el-tabs__nav-wrap::after{
      height: 0 !important;
    }
  }
</style>