Browse Source

调整首页(原统计页面)样式和统计信息

zhourj 5 days ago
parent
commit
b9d341a66d
2 changed files with 122 additions and 63 deletions
  1. 11 13
      src/views/tj/compoent/DoughnutData.vue
  2. 111 50
      src/views/tj/sjtjModules.vue

+ 11 - 13
src/views/tj/compoent/DoughnutData.vue

@@ -42,23 +42,21 @@ export default {
           _this.$emit('visibleCard', {wjlx:"合同,文件,无",sfsb:"3"});
           _this.$emit('visibleZs', {zslx:"无,无权属证明材料,文件合同等权属证明材料",sfsb:"3"});
         }
-
-
-
       })
       // 指定图表的配置项和数据
       var option = {
         //标题
-        // title: {
-        //   text: this.titleText,
-        //   x: 'left' ,              //标题位置
-        //   // textStyle: { //标题内容的样式
-        //   //   color: '#000',
-        //   //   fontStyle: 'normal',
-        //   //   fontWeight: 100,
-        //   //   fontSize: 16 //主题文字字体大小,默认为18px
-        //   // },
-        // },
+        title: {
+          text: this.titleText,
+          x: 'left' ,              //标题位置
+          textStyle: { //标题内容的样式
+            // color: '#000',
+            // fontStyle: 'normal',
+            // fontWeight: 100,
+            fontFamily: 'DingTalk_JinBuTi_Regular',
+            fontSize: 14 //主题文字字体大小,默认为18px
+          },
+        },
         // stillShowZeroSum: true,
         //鼠标划过时饼状图上显示的数据
         tooltip: {

+ 111 - 50
src/views/tj/sjtjModules.vue

@@ -353,23 +353,30 @@
 <!--          右侧列-->
           <div style="width: calc(25% - 0px);">
             <div style="display: flex; width: calc(100% - 0px);height:40px;line-height: 40px; background-color: #02A7F0;">
-            <div style="text-indent: 10px; font-size: 16px;  font-family:'DingTalk_JinBuTi_Regular';height:40px;line-height: 40px; background-color: #02A7F0; color: white ">
-              省属企业权证登记占比
-            </div>
+              <div style="width: calc(100% - 0px); text-indent: 10px; font-size: 16px;  font-family:'DingTalk_JinBuTi_Regular';height:40px;line-height: 40px; background-color: #02A7F0; color: white ">
+                省属企业权证登记占比
+              </div>
               <div class="cr-tj-btnlist">
-                <button :class="type === 'ssqy' ? ['cr-tj-btn', 'cr-tj-btn-select'] : 'cr-tj-btn'" @click.stop.prevent="handleSubmitSsqy">
+                <button :class="type === 'ssqy' ? ['cr-tj-btn', 'cr-tj-btn-select'] : 'cr-tj-btn'" @click="SSQZDJKEY='SL'">
                   数量
                 </button>
-                <button :class="type === 'szdw' ? ['cr-tj-btn', 'cr-tj-btn-select'] : 'cr-tj-btn'" @click.stop.prevent="handleSubmitSzdw">
+                <button :class="type === 'szdw' ? ['cr-tj-btn', 'cr-tj-btn-select'] : 'cr-tj-btn'" @click="SSQZDJKEY='MJ'">
                   面积
                 </button>
               </div>
             </div>
             <div>
               <a-card style="margin-bottom: 0.5rem;width:100%;height: 18rem">
-                <DoughnutData
-                  :titleText="this.tem_xzqhmc ? this.tem_xzqhmc + '省属企业权证登记比例情况' : '省属企业权证登记比例情况'"
-                  :result-data="this.DoughnutData1"
+                <DoughnutData v-if="SSQZDJKEY==='SL'"
+                  :titleText="this.tem_xzqhmc ? this.tem_xzqhmc + '地块数量' : '地块数量'"
+                  :result-data="this.DoughnutDataNum"
+                  :pie-color="this.color1"
+                  @visibleCard="visibleInfo"
+                >
+                </DoughnutData>
+                <DoughnutData v-if="SSQZDJKEY==='MJ'"
+                  :titleText="this.tem_xzqhmc ? this.tem_xzqhmc + '地块面积' : '地块面积'"
+                  :result-data="this.DoughnutDataArea"
                   :pie-color="this.color1"
                   @visibleCard="visibleInfo"
                 >
@@ -377,25 +384,34 @@
               </a-card>
             </div>
             <div style="display: flex; width: calc(100% - 0px);height:40px;line-height: 40px; background-color: #02A7F0;">
-            <div style="width: calc(100% - 0px);text-indent: 10px; font-size: 16px;  font-family:'DingTalk_JinBuTi_Regular';height:40px;line-height: 40px; background-color: #02A7F0; color: white ">省属企业土地使用现状占比</div>
+            <div style="width: calc(100% - 0px);text-indent: 10px; font-size: 16px;  font-family:'DingTalk_JinBuTi_Regular';height:40px;line-height: 40px; background-color: #02A7F0; color: white ">
+              省属企业土地使用现状占比
+            </div>
               <div class="cr-tj-btnlist">
-                <button :class="type === 'ssqy' ? ['cr-tj-btn', 'cr-tj-btn-select'] : 'cr-tj-btn'" @click.stop.prevent="handleSubmitSsqy">
+                <button :class="type === 'ssqy' ? ['cr-tj-btn', 'cr-tj-btn-select'] : 'cr-tj-btn'"  @click="SSQYTDSYXZKEY='SL'">
                   数量
                 </button>
-                <button :class="type === 'szdw' ? ['cr-tj-btn', 'cr-tj-btn-select'] : 'cr-tj-btn'" @click.stop.prevent="handleSubmitSzdw">
+                <button :class="type === 'szdw' ? ['cr-tj-btn', 'cr-tj-btn-select'] : 'cr-tj-btn'"  @click="SSQYTDSYXZKEY='MJ'">
                   面积
                 </button>
               </div>
             </div>
             <div>
               <a-card style="margin-bottom: 0.5rem;width:100%;height: 18rem">
-                <DoughnutData
-                  :titleText="this.tem_xzqh ? this.tem_xzqhmc + '省属企业土地使用现状占比' : '省属企业土地使用现状占比'"
-                  :result-data="this.DoughnutData2"
+                <DoughnutData v-if="SSQYTDSYXZKEY==='SL'"
+                  :titleText="this.tem_xzqh ? this.tem_xzqhmc + '地块数量' : '地块数量'"
+                  :result-data="this.DoughnutData2Num"
                   :PieColor="this.color"
                   @visible="visibleInfo"
                 >
                 </DoughnutData>
+                <DoughnutData v-if="SSQYTDSYXZKEY==='MJ'"
+                              :titleText="this.tem_xzqh ? this.tem_xzqhmc + '地块面积' : '地块面积'"
+                              :result-data="this.DoughnutData2Area"
+                              :PieColor="this.color"
+                              @visible="visibleInfo"
+                >
+                </DoughnutData>
               </a-card>
             </div>
           </div>
@@ -403,13 +419,15 @@
 <!--        第二行布局-->
         <div style="display: flex;">
           <div style="width: calc(50% - 10px); margin-right: 10px;">
-            <div style="width: calc(100% - 0px); text-indent: 10px; font-size: 16px;  font-family:'DingTalk_JinBuTi_Regular';height:40px;line-height: 40px; background-color: #02A7F0; color: white ">省属企业土地实际用途</div>
+            <div style="width: calc(100% - 0px); text-indent: 10px; font-size: 16px;  font-family:'DingTalk_JinBuTi_Regular';height:40px;line-height: 40px; background-color: #02A7F0; color: white ">
+              省属企业土地实际用途【地块数量】
+            </div>
             <div>
               <a-card style="margin-bottom: 1rem;width:100%;height: 21rem">
                 <a-col :sm="24" :md="12" :xl="24">
                   <BarTdsjyt
                     :titleText="this.tem_xzqhmc ? this.tem_xzqhmc + '省属企业土地实际用途情况' : '省属企业土地实际用途情况'"
-                    :result-x-data="this.resYData"
+                    :result-x-data="this.resTDSJYTDataNum"
                     :dw="this.dw2"
                     :seriesName="'地块数量'"
                     @visible="visibleInfo"
@@ -420,15 +438,17 @@
             </div>
           </div>
           <div style="width: calc(50% - 0px);">
-            <div style="width: calc(100% - 5px);text-indent: 10px; font-size: 16px;  font-family:'DingTalk_JinBuTi_Regular';height:40px;line-height: 40px; background-color: #02A7F0; color: white ">省属企业占用面积</div>
+            <div style="width: calc(100% - 5px);text-indent: 10px; font-size: 16px;  font-family:'DingTalk_JinBuTi_Regular';height:40px;line-height: 40px; background-color: #02A7F0; color: white ">
+              省属企业土地实际用途【地块面积】
+            </div>
             <div>
               <a-card style="margin-bottom: 1rem;width:100%;height: 21rem">
                 <a-col :sm="24" :md="12" :xl="24">
                   <BarTdsjyt
                     :titleText="this.tem_xzqhmc ? this.tem_xzqhmc + '省属企业土地实际用途情况' : '省属企业土地实际用途情况'"
-                    :result-x-data="this.resYData"
-                    :dw="this.dw2"
-                    :seriesName="'地块数量'"
+                    :result-x-data="this.resTDSJYTDataArea"
+                    :dw="this.dw"
+                    :seriesName="'地块面积'"
                     @visible="visibleInfo"
                   >
                   </BarTdsjyt>
@@ -440,13 +460,31 @@
 <!--        第三行布局-->
         <div style="display: flex;">
           <div style="width: calc(100% - 0px);">
-          <div style="width: calc(100% - 0px);text-indent: 10px; font-size: 16px;  font-family:'DingTalk_JinBuTi_Regular';height:40px;line-height: 40px; background-color: #02A7F0; color: white ">山东省各地市土地情况</div>
+          <div style="display: flex; width: calc(100% - 0px);height:40px;line-height: 40px; background-color: #02A7F0;">
+            <div style="width: calc(100% - 0px);text-indent: 10px; font-size: 16px;  font-family:'DingTalk_JinBuTi_Regular';height:40px;line-height: 40px; background-color: #02A7F0; color: white ">
+              山东省各地市土地情况
+            </div>
+            <div class="cr-tj-btnlist">
+              <button :class="type === 'ssqy' ? ['cr-tj-btn', 'cr-tj-btn-select'] : 'cr-tj-btn'" @click="GDSTDKEY='SL'">
+                数量
+              </button>
+              <button :class="type === 'szdw' ? ['cr-tj-btn', 'cr-tj-btn-select'] : 'cr-tj-btn'" @click="GDSTDKEY='MJ'">
+                面积
+              </button>
+            </div>
+          </div>
           <div>
             <a-card style="margin-bottom: 1rem;width:100%;height: 21rem">
-              <BarDobuleData
-                :titleText="this.tem_xzqhmc ? this.tem_xzqhmc + '省属企业实际占用面积' : '省属企业实际占用面积'"
-                :result-x-data="resBarSsData"
-                @visible="visibleInfoXzqh"
+              <BarDobuleData  v-if="GDSTDKEY==='SL'"
+                              :titleText="this.tem_xzqhmc ? this.tem_xzqhmc + '省属企业实际占用面积' : '省属企业实际占用面积'"
+                              :result-x-data="resBarSsData"
+                              visible="visibleInfoXzqh"
+              >
+              </BarDobuleData>
+              <BarDobuleData  v-if="GDSTDKEY==='MJ'"
+                              :titleText="this.tem_xzqhmc ? this.tem_xzqhmc + '省属企业实际占用面积' : '省属企业实际占用面积'"
+                              :result-x-data="resBarSsData"
+                              visible="visibleInfoXzqh"
               >
               </BarDobuleData>
             </a-card>
@@ -457,25 +495,36 @@
         <div style="display: flex;">
           <div style="width: calc(100% - 0px);">
             <div style="display: flex; width: calc(100% - 0px);height:40px;line-height: 40px; background-color: #02A7F0;">
-            <div style="width: calc(100% - 0px);text-indent: 10px; font-size: 16px;  font-family:'DingTalk_JinBuTi_Regular';height:40px;line-height: 40px; background-color: #02A7F0; color: white ">一级单位用地面积汇总</div>
-            <div class="cr-tj-btnlist">
-              <button :class="type === 'ssqy' ? ['cr-tj-btn', 'cr-tj-btn-select'] : 'cr-tj-btn'" @click.stop.prevent="handleSubmitSsqy">
-                数量
-              </button>
-              <button :class="type === 'szdw' ? ['cr-tj-btn', 'cr-tj-btn-select'] : 'cr-tj-btn'" @click.stop.prevent="handleSubmitSzdw">
-                面积
-              </button>
+              <div style="width: calc(100% - 0px);text-indent: 10px; font-size: 16px;  font-family:'DingTalk_JinBuTi_Regular';height:40px;line-height: 40px; background-color: #02A7F0; color: white ">
+              一级单位用地面积汇总
+              </div>
+              <div class="cr-tj-btnlist">
+                <button :class="type === 'ssqy' ? ['cr-tj-btn', 'cr-tj-btn-select'] : 'cr-tj-btn'" @click="YJDWKEY='SL'">
+                  数量
+                </button>
+                <button :class="type === 'szdw' ? ['cr-tj-btn', 'cr-tj-btn-select'] : 'cr-tj-btn'" @click="YJDWKEY='MJ'">
+                  面积
+                </button>
+              </div>
             </div>
-          </div>
             <div>
               <a-card style="margin-bottom: 1rem;width:100%;height: 21rem">
-                <BarData
-                  :titleText="this.tem_xzqhmc ? this.tem_xzqhmc + '一级单位用地面积汇总' : '一级单位用地面积汇总'"
-                  :result-x-data="this.resYDatas"
-                  :seriesName="'地块面积(亩)'"
-                  :dw="this.dw"
-                  @visible="visibleInfoYjdw"
-                  style="width:calc(100% - 0px);height:300px;"
+                <BarDataNum v-if="YJDWKEY==='SL'"
+                         :titleText="this.tem_xzqhmc ? this.tem_xzqhmc + '一级单位用地面积汇总' : '一级单位用地面积汇总'"
+                         :result-x-data="this.YJDWYDatas"
+                         :seriesName="'地块数量'"
+                         :dw="this.dw2"
+                         @visible="visibleInfoYjdw"
+                         style="width:calc(100% - 0px);height:19rem;"
+                >
+                </BarDataNum>
+                <BarData v-if="YJDWKEY==='MJ'"
+                         :titleText="this.tem_xzqhmc ? this.tem_xzqhmc + '一级单位用地面积汇总' : '一级单位用地面积汇总'"
+                         :result-x-data="this.YJDWYDatas"
+                         :seriesName="'地块面积(亩)'"
+                         :dw="this.dw"
+                         @visible="visibleInfoYjdw"
+                         style="width:calc(100% - 0px);height:19rem;"
                 >
                 </BarData>
               </a-card>
@@ -516,6 +565,7 @@ import PieData from '@views/tj/compoent/PieData'
 import PieQdfsMj from '@views/tj/compoent/PieQdfsMj'
 import DoughnutData from '@views/tj/compoent/DoughnutData'
 import BarData from '@views/tj/compoent/BarData'
+import BarDataNum from '@views/tj/compoent/BarDataNum'
 import BarTdsjyt from '@views/tj/compoent/BarTdsjyt'
 import BarDobuleData from '@views/tj/compoent/BarDobuleData'
 import WaterWorld from '@views/tj/compoent/WaterWorld'
@@ -532,6 +582,17 @@ export default {
   name: 'sjtj',
   data() {
     return {
+      SSQZDJKEY:'SL',
+      DoughnutDataArea: [],
+      DoughnutDataNum: [],
+      SSQYTDSYXZKEY:'SL',
+      DoughnutData2Area: [],
+      DoughnutData2Num: [],
+      resTDSJYTDataArea: [],
+      resTDSJYTDataNum: [],
+      GDSTDKEY:'SL',
+      YJDWKEY:'SL',
+      YJDWYDatas: [],
       SUMSS: '',
       SUMSSXZDX: '',
       visible: false,
@@ -550,11 +611,7 @@ export default {
         title: '省属企业地块统计',
         orgCode: 'A04'
       },
-      DoughnutData1: [],
-      DoughnutData2: [],
       resXData: [],
-      resYData: [],
-      resYDatas: [],
       visibleQy: false,
       dw: '单位(亩)',
       dw2: '单位(块)',
@@ -642,6 +699,7 @@ export default {
     mapData,
     DoughnutData,
     BarData,
+    BarDataNum,
     BarTdsjyt,
     WaterWorld,
     NightingaleCharData,
@@ -869,7 +927,8 @@ export default {
     getDougatasz() {
       getAction('/qcsb.qyxx/qcQyxx/qzdjblsz', { xzqh: this.tem_xzqh }).then(res => {
         if (res.code == 200) {
-          this.DoughnutData1 = res.result
+          this.DoughnutDataArea = res.result.area;
+          this.DoughnutDataNum = res.result.num;
         }
       })
     },
@@ -877,7 +936,8 @@ export default {
     getTdsyxzDougatasz() {
       getAction('/qcsb.qyxx/qcQyxx/tdsyxzzb', { xzqh: this.tem_xzqh }).then(res => {
         if (res.code == 200) {
-          this.DoughnutData2 = res.result
+          this.DoughnutData2Area = res.result.zyArea;
+          this.DoughnutData2Num = res.result.zySum;
         }
       })
     },
@@ -893,12 +953,13 @@ export default {
     getBarss() {
       getAction('/qcsb.qyxx/qcQyxx/sjyttjss', { xzqh: this.tem_xzqh }).then(res => {
         if (res.code == 200) {
-          this.resYData = res.result
+          this.resTDSJYTDataArea= res.result.zyArea;
+          this.resTDSJYTDataNum= res.result.zyNum;
         }
       }),
         getAction('/qcsb.qyxx/qcQyxx/yjdwmjhz', { xzqh: this.tem_xzqh }).then(res => {
           if (res.code == 200) {
-            this.resYDatas = res.result
+            this.YJDWYDatas = res.result;
           }
         })
     },
@@ -1006,7 +1067,7 @@ export default {
     border-color: rgba(52, 140, 238, 1);
     background: rgb(91, 145, 252,1);
     color: rgb(255, 255, 255);
-    pointer-events: none;
+    //pointer-events: none;
     user-select: none;
   }
 }