2023-10-27

src/HDrpManagement/customerData/index.vue

@@ -3,7 +3,7 @@
   <normalLayout>
     <template #refresh>
       <div style="margin-right:15px">
-        <el-button type="text" size="small" @click="$refs.scroll.wrap.scrollTop=0">返回顶部</el-button>
+        <el-button style="font-size:14px !important" type="text" size="small" @click="$refs.scroll.wrap.scrollTop=0">返回顶部</el-button>
       </div>
       <!-- <i class="el-icon-refresh-right" @click="refresh" v-loading.fullscreen.lock="fullscreenLoading"></i> -->
     </template>
@@ -24,11 +24,11 @@
               ></el-cascader>
             </div>
             <div class="data-all">
-              <div>客户</div>
+              <div style="margin-bottom:20px">客户</div>
               <div class="data-all-wrapper">
                 <div class="data-left">
                   <div class="data-item">
-                    <p>{{ tool.formatAmount(dataAll.total) }}</p>
+                    <p>{{ tool.formatAmount(dataAll.total)|| 0 }}</p>
                     <p>客户总数</p>
                   </div>
                   <div class="data-item">
@@ -152,7 +152,7 @@
                 </div>
               </div>
               <div class="panel-content">
-                <div ref="customerTypeEl" style="width:430rem"></div>
+                <div ref="customerTypeEl" style="width:450rem"></div>
                 <div class="panel-table" style="width:1151rem">
                   <pageTable
                     ref="customerTypeTable"
@@ -976,6 +976,7 @@ export default {
       let res = await this.$api.requested(this.chartParam2)
       console.log(res.data,'近12月跟进');
       this.chartMapData = res.data
+      this.chartMapData.tbzzl.forEach(item => item.key = '同比增长率(%)')
       if (init) {
         this.chartMap = new DualAxes(this.$refs.chart2, {
           data: [this.chartMapData.followup, this.chartMapData.tbzzl],
@@ -1013,8 +1014,13 @@ export default {
           colorField: 'key',
           radius: 1,
           innerRadius: 0.64,
+          meta: {
+            value: {
+              formatter: (v) => `${v} ¥`,
+            },
+          },
           label:{
-            formatter: (datum) => `${datum.ratio * 100}%`
+            formatter: (datum) => `${datum.ratio}%`
           },
           statistic: {
             title: {
@@ -1033,7 +1039,7 @@ export default {
               },
               customHtml: (container, view, datum, data) => {
                 const { width } = container.getBoundingClientRect();
-                const text = datum ? `${datum.value}` : data[0] ? data[0].totalqty : 0;
+                const text = datum ? `${datum.ratio}%` : data[0].totalqty;
                 return this.renderStatistic(width, text, { fontSize: 32 });
               },
             },
@@ -1042,15 +1048,15 @@ export default {
             position:'left'
           },
           // 添加 中心统计文本 交互
-          interactions: [{ type: 'element-single-selected' },{ type: 'element-active' },{ type: 'element-click' }],
+          interactions: [{ type: 'element-single-selected' }, { type: 'element-active' }, { type: 'pie-statistic-active' }],
         });
         this.customerTypeMap.on('element:click',(v) => {
-          if (v.data.data.key != this.typeTableParam.content.where.customerstype) {
-            this.typeTableParam.content.where.customerstype = v.data.data.key
-            this.$refs.customerTypeTable.listData()
+          if (v.data.data.key != this.gradTableParam.content.where.grade) {
+            this.gradTableParam.content.where.grade = v.data.data.key
+            this.$refs.customerGradTable.listData()
           } else {
-            this.typeTableParam.content.where.customerstype = ''
-            this.$refs.customerTypeTable.listData()
+            this.gradTableParam.content.where.grade = ''
+            this.$refs.customerGradTable.listData()
           }
         })
         this.customerTypeMap.render();
@@ -1078,7 +1084,7 @@ export default {
             },
           },
           label:{
-            formatter: (datum) => `${datum.ratio * 100}%`
+            formatter: (datum) => `${datum.ratio}%`
           },
           statistic: {
             title: {
@@ -1097,7 +1103,7 @@ export default {
               },
               customHtml: (container, view, datum, data) => {
                 const { width } = container.getBoundingClientRect();
-                const text = datum ? `${datum.value}` : data[0].totalqty;
+                const text = datum ? `${datum.ratio}%` : data[0].totalqty;
                 return this.renderStatistic(width, text, { fontSize: 32 });
               },
             },
@@ -1142,7 +1148,7 @@ export default {
             },
           },
           label:{
-            formatter: (datum) => `${datum.ratio * 100}%`
+            formatter: (datum) => `${datum.ratio}%`
           },
           statistic: {
             title: {
@@ -1161,7 +1167,7 @@ export default {
               },
               customHtml: (container, view, datum, data) => {
                 const { width } = container.getBoundingClientRect();
-                const text = datum ? `${datum.value}` : data[0].totalqty;
+                const text = datum ? `${datum.ratio}%` : data[0].totalqty;
                 return this.renderStatistic(width, text, { fontSize: 32 });
               },
             },
@@ -1206,7 +1212,7 @@ export default {
             },
           },
           label:{
-            formatter: (datum) => `${datum.ratio * 100}%`
+            formatter: (datum) => `${datum.ratio}%`
           },
           statistic: {
             title: {
@@ -1225,7 +1231,7 @@ export default {
               },
               customHtml: (container, view, datum, data) => {
                 const { width } = container.getBoundingClientRect();
-                const text = datum ? `${datum.value}` : data[0].totalqty;
+                const text = datum ? `${datum.ratio}%` : data[0].totalqty;
                 return this.renderStatistic(width, text, { fontSize: 32 });
               },
             },
@@ -1270,7 +1276,7 @@ export default {
             },
           },
           label:{
-            formatter: (datum) => `${datum.ratio * 100}%`
+            formatter: (datum) => `${datum.ratio}%`
           },
           statistic: {
             title: {
@@ -1290,7 +1296,7 @@ export default {
               customHtml: (container, view, datum, data) => {
                 const { width } = container.getBoundingClientRect();
                 console.log(data,'总数',datum,'当前');
-                const text = datum ? `${datum.value}` : data[0].totalqty;
+                const text = datum ? `${datum.ratio}%` : data[0].totalqty;
                 return this.renderStatistic(width, text, { fontSize: 32 });
               },
             },
@@ -1640,9 +1646,8 @@ export default {
   padding: 24rem 20rem;
   width: 100%;
   border-radius: 5rem;
-  height: 148rem;
   border: 1rem;
-  box-shadow: rgb(136, 136, 136) 0rem 0rem 5rem 0rem;
+  box-shadow: 0rem 2rem 5rem 0rem rgba(0, 0, 0, 0.15);
   margin-top: 10rem;
 }
 .data-all .data-left {
@@ -1656,13 +1661,19 @@ export default {
 }
 .data-all .data-item {
   width: 186rem;
+  margin-bottom: 20px;
 }
 .data-all .data-item p:nth-child(1) {
-  font-size: 26rem;
-  font-weight: bold;
+  font-size: 26px;
+  font-weight: 5px;
+  font-family: 'ArialMT', 'Arial', sans-serif;
+  color: rgba(0, 0, 0, 0.85);
 }
 .data-all .data-item p:nth-child(2) {
-  font-size: 16rem;
+  font-size: 14px;
+  font-weight: 5px;
+  font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
+  color: rgba(0, 0, 0, 0.65)
 }
 .data-all .data-all-wrapper {
   display: flex;

src/HDrpManagement/projectChange/modules/modules/contacts/components/add.vue

@@ -23,7 +23,6 @@
                     <el-tab-pane label="企业联系人" name="first">
                       <el-table
                           border
-                          height="200px"
                           :data="enterpriseContact.listData"
                           height="500px"
                           @row-click="enterpriseContactSelect"
@@ -96,11 +95,7 @@
                           border
                           :data="myContacts.listData"
                           @row-click="myContactSelect"
-<<<<<<< HEAD
-                          height="200px"
-=======
                           height="500px"
->>>>>>> 8eb449d3415824dc4dafe5f2e91751f80bcacae8
                           :header-cell-style="{background:'#EEEEEE',color:'#333'}"
                           size="mini">
                         <el-table-column width="80" label="姓名">
@@ -232,7 +227,6 @@
                           :data="associatedCustomers.listData"
                           height="500px"
                           style="margin-top: 10px"
-                          height="200px"
                           @row-click="associatedCustomersSelect"
                           :header-cell-style="{background:'#EEEEEE',color:'#333'}"
                           size="mini">

src/HDrpManagement/projectChange/modules/modules/contacts/components/edit.vue

@@ -25,7 +25,6 @@
                           border
                           height="500px"
                           :data="enterpriseContact.listData"
-                          height="200px"
                           @row-click="enterpriseContactSelect"
                           :header-cell-style="{background:'#EEEEEE',color:'#333'}"
                           size="mini">
@@ -97,7 +96,6 @@
                           height="500px"
                           :data="myContacts.listData"
                           @row-click="myContactSelect"
-                          height="200px"
                           :header-cell-style="{background:'#EEEEEE',color:'#333'}"
                           size="mini">
                         <el-table-column width="80" label="姓名">
@@ -231,7 +229,6 @@
                           height="500px"
                           :data="associatedCustomers.listData"
                           style="margin-top: 10px"
-                          height="200px"
                           @row-click="associatedCustomersSelect"
                           :header-cell-style="{background:'#EEEEEE',color:'#333'}"
                           size="mini">
@@ -266,51 +263,7 @@
                         </div>
                         <slot name="footerLeft"></slot>
                       </div>
-<<<<<<< HEAD
                 
-=======
-                    </el-tab-pane>
-                    <el-tab-pane label="我的客户" >
-                      <el-table
-                          border
-                          height="500px"
-                          :data="myCustomers.listData"
-                          @row-click="myCustomersSelect"
-                          :header-cell-style="{background:'#EEEEEE',color:'#333'}"
-                          size="mini">
-                        <el-table-column width="80" label="单位编号">
-                          <template slot-scope="scope">
-                            <span >{{ scope.row.sys_enterpriseid?scope.row.sys_enterpriseid:'--' }}</span>
-                          </template>
-                        </el-table-column>
-                        <el-table-column width="190" label="单位名称">
-                          <template slot-scope="scope">
-                            <span >{{ scope.row.enterprisename?scope.row.enterprisename:'--' }}</span>
-                          </template>
-                        </el-table-column>
-                        <el-table-column  label="单位地址">
-                          <template slot-scope="scope">
-                            <span >{{ scope.row.address?scope.row.address:'--' }}</span>
-                          </template>
-                        </el-table-column>
-                      </el-table>
-                      <div style="display:flex;align-items:center;flex-direction:row-reverse;justify-content:space-between">
-                        <div class="container normal-panel" style="text-align:right">
-                          <el-pagination
-                              background
-                              @size-change="handleSizeMyCustomers"
-                              @current-change="handleCurrentMyCustomers"
-                              :current-page="myCustomers.currentPage"
-                              :page-sizes="[20, 50, 100, 200]"
-                              :page-size="20"
-                              layout="total,sizes, prev, pager, next, jumper"
-                              :total="myCustomers.total">
-                          </el-pagination>
-                        </div>
-                        <slot name="footerLeft"></slot>
-                      </div>
-                    </el-tab-pane>
->>>>>>> 8eb449d3415824dc4dafe5f2e91751f80bcacae8
                   </el-tabs>
                   <el-input  slot="reference" :disabled="form.contactsid !== 0"  autosize v-model="form.enterprisename" placeholder="请输入单位" @input="changeTabCustomers"></el-input>
                 </el-popover>

src/HDrpManagement/projectData/components/table.vue

@@ -0,0 +1,66 @@
+<template>
+  <div>
+    <!-- :header-cell-style="{background:'#EEEEEE',color:'#333'}" -->
+    <el-table ref="table" :row-class-name="tableClassName" highlight-current-row :data="data"  size="mini" :header-cell-style="{height:'40px',color:'#606266',fontWeight:'400',fontSize:'14px'}"
+              :cell-style="{height:'40px',color:'#666666',fontWeight:'400'}" border @selection-change="selectionChange">
+      <el-table-column
+          type="selection"
+          width="35" fixed v-if="checkbox">
+      </el-table-column>
+      <el-table-column v-for="col in layout" :key="col.tablecolid" :prop="col.columnname" :label="col.title" :width="width && col.width === 0 ? 150 : col.width" :fixed="fixedName ? fixedName.indexOf(col.columnname)!= -1?redirect ? redirect : 'right' :false : false">
+        <template v-slot:header="{ column,$index }" v-if="customHeader">
+          <slot name="header" :data="column"></slot>
+        </template>
+        <template slot-scope="scope">
+          <div class="table-panel">
+            <!-- 自定义表格显示内容 -->
+            <slot v-if="custom" name="customcol" :column="{data:scope.row,columnname:col.columnname}"></slot>
+            <!-- 否则就是默认 -->
+            <span v-else>{{scope.row[col.columnname]}}</span>
+            <!-- 操作结构内容 -->
+            <slot v-if="col.columnname === 'operation'" name="opreation" :data="scope.row"></slot>
+          </div>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+
+<script>
+import {mapGetters} from "vuex"
+export default {
+  /*
+    layout:表结构数据;
+    data:表渲染数据;
+    custom:是否启用自定义结构;
+    opwidth:操作列宽度
+  */
+  props:['layout','data','custom','height','fixedName','width','checkbox','redirect','customHeader'],
+  data () {
+    return {
+      list:[],
+    }
+  },
+  computed:{
+    ...mapGetters({
+      loading:'loading'
+    })
+  },
+  methods:{
+    rowClick (row) {
+      this.$emit('rowClick',row)
+    },
+    tableClassName ({row,rowIndex}) {
+      row.index = rowIndex
+    },
+    selectionChange(row){
+      this.$emit('selectionChange',row)
+    }
+  },
+  mounted () {
+  }
+}
+
+</script>
+<style>
+</style>

src/HDrpManagement/projectData/index.vue

@@ -3,7 +3,7 @@
   <normalLayout>
     <template #refresh>
       <div style="margin-right:15px">
-        <el-button type="text" size="small" @click="$refs.scroll.wrap.scrollTop=0">返回顶部</el-button>
+        <el-button style="font-size:14px !important" type="text" size="small" @click="$refs.scroll.wrap.scrollTop=0">返回顶部</el-button>
       </div>
       <!-- <i class="el-icon-refresh-right" @click="refresh" v-loading.fullscreen.lock="fullscreenLoading"></i> -->
     </template>
@@ -26,7 +26,7 @@
               ></el-cascader>
             </div>
             <div class="data-all">
-              <div>客户</div>
+              <div style="margin-bottom:20px">项目</div>
               <div class="data-all-wrapper">
                 <div class="data-left">
                   <div class="data-item">
@@ -61,7 +61,7 @@
                     </p>
                   </div>
                   <div class="data-item">
-                    <p>{{ dataAll.cjl * 100 }}%</p>
+                    <p>{{ dataAll.cjl }}%</p>
                     <p>
                       项目成交率
                       <el-tooltip class="item" effect="dark" content="项目成交率=有关联审核订单的项目数÷项目总数×100%" placement="top">
@@ -124,9 +124,12 @@
                       </el-option>
                     </el-select>
                   </div>
+                  <div class="mt-10 inline-16" style="margin-left:10px">
+                    <FullScroll domId="projectType"></FullScroll>
+                  </div>
                 </div>
               </div>
-              <div class="panel-content">
+              <div class="panel-content" id="projectType">
                 <div ref="typeEl" style="width:430rem"></div>
                 <div class="panel-table" style="width:1151rem;">
                   <pageTable
@@ -881,7 +884,7 @@
               </div>
               <div class="progress">
                   <div class="progress-item" :style="[{'--bg':colorArr[index]},{'--width':item.avg}]" v-for="(item,index) in dateList" :key="index">
-                    <div class="day">平均周期:{{ item.dateavg.toFixed(2) }}</div>
+                    <div class="day">平均周期:{{ item.dateavg.toFixed(2) }}天</div>
                     <div class="start" v-if="index == 0">
                       <span>{{ item.start }}</span>
                       <span v-if="item.end == '立项'">项目立项</span>
@@ -1002,8 +1005,9 @@ import { DualAxes,Pie,measureTextWidth,Column,Line,Bar  } from '@antv/g2plot'
 import pageTable from './components/pageTable.vue'
 import selectProject from './components/selectProject.vue'
 import borderTemp from '@/HDrpManagement/dataanalysis/components/border.vue'
+import FullScroll from '@/components/fullScroll/index.vue'
 export default {
-  components:{borderTemp,pageTable,selectProject},
+  components:{borderTemp,pageTable,selectProject,FullScroll},
   data () {
     return {
       colorArr:['#3874f6','#00b32b','#ffae02','#f53f3f','#f2f2f2'],
@@ -1388,8 +1392,13 @@ export default {
           colorField: 'key',
           radius: 1,
           innerRadius: 0.64,
+          meta: {
+            value: {
+              formatter: (v) => `${v} ¥`,
+            },
+          },
           label:{
-            formatter: (datum) => `${(datum.ratio * 100).toFixed(2)}%`
+            formatter: (datum) => `${datum.ratio}%`
           },
           statistic: {
             title: {
@@ -1404,11 +1413,11 @@ export default {
             content: {
               offsetY: 4,
               style: {
-                fontSize: '32px',
+                fontSize: '24px',
               },
               customHtml: (container, view, datum, data) => {
                 const { width } = container.getBoundingClientRect();
-                const text = datum ? `${datum.qty}` : data[0] ? data[0].qty : 0;
+                const text = datum ? `${datum.ratio}%` : data[0] ? data[0].qty : 0;
                 return this.renderStatistic(width, text, { fontSize: 32 });
               },
             },
@@ -1417,7 +1426,7 @@ export default {
             position:'left'
           },
           // 添加 中心统计文本 交互
-          interactions: [{ type: 'element-single-selected' },{ type: 'element-active' },{ type: 'element-click' }],
+          interactions: [{ type: 'element-single-selected' },{ type: 'element-active' },{ type: 'pie-statistic-active' }],
         });
         this.typeMap.on('element:click',(v) => {
           if (v.data.data.value != this.typeTableParam.content.where.projecttype) {
@@ -1448,7 +1457,7 @@ export default {
           radius: 1,
           innerRadius: 0.64,
           label:{
-            formatter: (datum) => `${(datum.ratio * 100).toFixed(2)}%`
+            formatter: (datum) => `${datum.ratio}%`
           },
           statistic: {
             title: {
@@ -1463,11 +1472,11 @@ export default {
             content: {
               offsetY: 4,
               style: {
-                fontSize: '32px',
+                fontSize: '24px',
               },
               customHtml: (container, view, datum, data) => {
                 const { width } = container.getBoundingClientRect();
-                const text = datum ? `${datum.qty}` : data[0] ? data[0].qty : 0;
+                const text = datum ? `${datum.ratio}%` : data[0] ? data[0].qty : 0;
                 return this.renderStatistic(width, text, { fontSize: 32 });
               },
             },
@@ -1476,7 +1485,7 @@ export default {
             position:'left'
           },
           // 添加 中心统计文本 交互
-          interactions: [{ type: 'element-selected' },{ type: 'element-active' },{ type: 'element-click' }],
+          interactions: [{ type: 'element-selected' },{ type: 'element-active' },{ type: 'pie-statistic-active' }],
         });
         this.gradMap.on('element:click',(v) => {
           if (v.data.data.key != this.gradTableParam.content.where.grade) {
@@ -1580,6 +1589,7 @@ export default {
     async fllowFun (init) {
       let res = await this.$api.requested(this.fllowParam)
       this.fllowData = res.data
+      this.fllowData.tbzzl.forEach(item => item.key = '同比增长率(%)')
       console.log(res.data,'跟进数据');
       if (init) {
         this.fllowMap = new DualAxes(this.$refs.fllowEl, {
@@ -1644,7 +1654,7 @@ export default {
           radius: 1,
           innerRadius: 0.64,
           label:{
-            formatter: (datum) => `${(datum.ratio * 100).toFixed(2)}%`
+            formatter: (datum) => `${datum.ratio}%`
           },
           statistic: {
             title: {
@@ -1659,11 +1669,11 @@ export default {
             content: {
               offsetY: 4,
               style: {
-                fontSize: '32px',
+                fontSize: '24px',
               },
               customHtml: (container, view, datum, data) => {
                 const { width } = container.getBoundingClientRect();
-                const text = datum ? `${datum.value}` : data[0] ? data[0].totalqty : 0;
+                const text = datum ? `${datum.ratio}%` : data[0] ? data[0].totalqty : 0;
                 return this.renderStatistic(width, text, { fontSize: 32 });
               },
             },
@@ -1672,7 +1682,7 @@ export default {
             position:'left'
           },
           // 添加 中心统计文本 交互
-          interactions: [{ type: 'element-selected' },{ type: 'element-active' },{ type: 'element-click' }],
+          interactions: [{ type: 'element-selected' },{ type: 'element-active' },{ type: 'pie-statistic-active' }],
         });
         this.projectFllowMap.on('element:click',(v) => {
           if (v.data.data.value != this.fllowTableParam.content.where.isfollowup) {
@@ -1703,7 +1713,7 @@ export default {
           radius: 1,
           innerRadius: 0.64,
           label:{
-            formatter: (datum) => `${(datum.ratio * 100).toFixed(2)}%`
+            formatter: (datum) => `${datum.ratio}%`
           },
           statistic: {
             title: {
@@ -1718,11 +1728,11 @@ export default {
             content: {
               offsetY: 4,
               style: {
-                fontSize: '32px',
+                fontSize: '24px',
               },
               customHtml: (container, view, datum, data) => {
                 const { width } = container.getBoundingClientRect();
-                const text = datum ? `${datum.value}` : data[0] ? data[0].totalqty : 0;
+                const text = datum ? `${datum.ratio}%` : data[0] ? data[0].totalqty : 0;
                 return this.renderStatistic(width, text, { fontSize: 32 });
               },
             },
@@ -1731,7 +1741,7 @@ export default {
             position:'left'
           },
           // 添加 中心统计文本 交互
-          interactions: [{ type: 'element-selected' },{ type: 'element-active' },{ type: 'element-click' }],
+          interactions: [{ type: 'element-selected' },{ type: 'element-active' },{ type: 'pie-statistic-active' }],
         });
         this.projectContactMap.on('element:click',(v) => {
           if (v.data.data.key != this.contactTableParam.content.where.iscontacts) {
@@ -1762,7 +1772,7 @@ export default {
           radius: 1,
           innerRadius: 0.64,
           label:{
-            formatter: (datum) => `${(datum.ratio * 100).toFixed(2)}%`
+            formatter: (datum) => `${datum.ratio}%`
           },
           statistic: {
             title: {
@@ -1777,11 +1787,11 @@ export default {
             content: {
               offsetY: 4,
               style: {
-                fontSize: '32px',
+                fontSize: '24px',
               },
               customHtml: (container, view, datum, data) => {
                 const { width } = container.getBoundingClientRect();
-                const text = datum ? `${datum.value}` : data[0] ? data[0].totalqty : 0;
+                const text = datum ? `${datum.ratio}%` : data[0] ? data[0].totalqty : 0;
                 return this.renderStatistic(width, text, { fontSize: 32 });
               },
             },
@@ -1790,7 +1800,7 @@ export default {
             position:'left'
           },
           // 添加 中心统计文本 交互
-          interactions: [{ type: 'element-selected' },{ type: 'element-active' },{ type: 'element-click' }],
+          interactions: [{ type: 'element-selected' },{ type: 'element-active' },{ type: 'pie-statistic-active' }],
         });
         this.projectCustomerMap.on('element:click',(v) => {
           if (v.data.data.key != this.customerTableParam.content.where.iscustomers) {
@@ -1821,7 +1831,7 @@ export default {
           radius: 1,
           innerRadius: 0.64,
           label:{
-            formatter: (datum) => `${(datum.ratio * 100).toFixed(2)}%`
+            formatter: (datum) => `${datum.ratio}%`
           },
           statistic: {
             title: {
@@ -1836,11 +1846,11 @@ export default {
             content: {
               offsetY: 4,
               style: {
-                fontSize: '32px',
+                fontSize: '24px',
               },
               customHtml: (container, view, datum, data) => {
                 const { width } = container.getBoundingClientRect();
-                const text = datum ? `${datum.value}` : data[0] ? data[0].totalqty : 0;
+                const text = datum ? `${datum.ratio}%` : data[0] ? data[0].totalqty : 0;
                 return this.renderStatistic(width, text, { fontSize: 32 });
               },
             },
@@ -1849,7 +1859,7 @@ export default {
             position:'left'
           },
           // 添加 中心统计文本 交互
-          interactions: [{ type: 'element-selected' },{ type: 'element-active' },{ type: 'element-click' }],
+          interactions: [{ type: 'element-selected' },{ type: 'element-active' },{ type: 'pie-statistic-active' }],
         });
         this.projectScoreMap.on('element:click',(v) => {
           if (v.data.data.key != this.scoreTableParam.content.where.istask) {
@@ -2184,12 +2194,16 @@ export default {
 *{
   box-sizing: border-box;
 }
+.panel-select {
+  display: flex;
+  align-items: center;
+}
 .data-all {
   padding: 24rem 20rem;
   width: 100%;
   border-radius: 5rem;
   border: 1rem;
-  box-shadow: rgb(136, 136, 136) 0rem 0rem 5rem 0rem;
+  box-shadow: 0rem 2rem 5rem 0rem rgba(0, 0, 0, 0.15);
   margin-top: 10rem;
 }
 .data-all .data-left {
@@ -2198,7 +2212,7 @@ export default {
   flex-wrap: wrap;
 }
 .data-all .data-right {
-  padding-left: 50rem;
+  padding-left: 100rem;
   display: flex;
   flex-wrap: wrap;
 }
@@ -2207,13 +2221,19 @@ export default {
 }
 .data-all .data-item {
   width: 186rem;
+  margin-bottom: 20px;
 }
 .data-all .data-item p:nth-child(1) {
-  font-size: 26rem;
-  font-weight: bold;
+  font-size: 26px;
+  font-weight: 5px;
+  font-family: 'ArialMT', 'Arial', sans-serif;
+  color: rgba(0, 0, 0, 0.85);
 }
 .data-all .data-item p:nth-child(2) {
-  font-size: 16rem;
+  font-size: 14px;
+  font-weight: 5px;
+  font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
+  color: rgba(0, 0, 0, 0.65)
 }
 .data-all .data-all-wrapper {
   display: flex;
@@ -2239,6 +2259,7 @@ export default {
   display: flex;
   align-items: center;
   justify-content: space-between;
+  background:#ffffff;
 }
 .panel-content div:first-child { 
   padding: 0 5px;

src/components/fullScroll/index.vue

@@ -0,0 +1,76 @@
+<template>
+  <div>
+    <img style="width: 16px; height: 16px;" @click="enterFullscreen" src="@/assets/icons/fullScroll.svg" title="全屏">
+  </div>
+</template>
+
+<script>
+export default {
+  name:'fullScroll',
+  data() {
+    return {
+      fullscreen:false
+    }
+  },
+  props:['domId'],
+  methods: {
+    enterFullscreen () {
+      if (this.fullscreen) {
+        if (document.exitFullscreen) {
+            document.exitFullscreen();
+        } else if (document.webkitCancelFullScreen) {
+            document.webkitCancelFullScreen();
+        } else if (document.mozCancelFullScreen) {
+            document.mozCancelFullScreen();
+        } else if (document.msExitFullscreen) {
+            document.msExitFullscreen();
+        }
+        this.fullscreen = false
+      } else {
+        /* 获取(<html>)元素以全屏显示页面 */
+        const full = document.getElementById(this.domId)
+        if (full.RequestFullScreen) {
+            full.RequestFullScreen()
+            //兼容Firefox
+        } else if (full.mozRequestFullScreen) {
+            full.mozRequestFullScreen()
+            //兼容Chrome, Safari and Opera等
+        } else if (full.webkitRequestFullScreen) {
+            full.webkitRequestFullScreen()
+            //兼容IE/Edge
+        } else if (full.msRequestFullscreen) {
+            full.msRequestFullscreen()
+        }
+        this.fullscreen = true
+      }
+      
+    },
+    exitFullscreen () {
+      
+    },
+    handleFullscreenChange () {
+      if (document.fullscreenElement || document.mozFullScreenElement || document.webkitFullscreenElement || document.msFullscreenElement) {
+        // 全屏模式激活
+        console.log('全屏模式已激活');
+        this.fullscreen = true
+      } else {
+        // 全屏模式退出
+        this.fullscreen = false
+        console.log('全屏模式已退出');
+      }
+    }
+  },
+  mounted () {
+    document.addEventListener('fullscreenchange', this.handleFullscreenChange);
+    document.addEventListener('mozfullscreenchange', this.handleFullscreenChange);
+    document.addEventListener('webkitfullscreenchange', this.handleFullscreenChange);
+    document.addEventListener('MSFullscreenChange',this.handleFullscreenChange)
+  }
+}
+</script>
+
+<style scoped>
+  img {
+    cursor: pointer;
+  }
+</style>