From 388c2eeb0522a3dc928cffc5059e9f7da4c84ecb Mon Sep 17 00:00:00 2001
From: zhangxiaoxu123456 <zxx19900626>
Date: 星期二, 26 四月 2022 16:43:34 +0800
Subject: [PATCH] 工伤、失业保险接口

---
 src/pages/show/index/index.vue | 1037 +++++++++++++++++++++++++++------------------------------
 1 files changed, 491 insertions(+), 546 deletions(-)

diff --git a/src/pages/show/index/index.vue b/src/pages/show/index/index.vue
index 0f7d2a0..5a89103 100644
--- a/src/pages/show/index/index.vue
+++ b/src/pages/show/index/index.vue
@@ -4,17 +4,17 @@
       <div class="yanglao-block">
         <img src="../../../assets/images/yanglao-icon1.png" alt="">
         <h1>鍩庨晣鑱屽伐鍏昏�佷繚闄╁弬淇濅汉鏁�</h1>
-        <h2><font class="bigger">{{Insured.card}}</font>涓囦汉</h2>
+        <h2><font class="bigger">{{ Insured.zhigong }}</font>涓囦汉</h2>
       </div>
       <div class="yanglao-block">
         <img src="../../../assets/images/yanglao-icon2.png" alt="">
-        <h1>鍩庨晣鑱屽伐鍏昏�佷繚闄╁弬淇濅汉鏁�</h1>
-        <h2><font class="bigger">{{Insured.jumin}}</font>涓囦汉</h2>
+        <h1>鍩庝埂灞呮皯鍏昏�佷繚闄╁弬淇濅汉鏁�</h1>
+        <h2><font class="bigger">{{ Insured.jumin }}</font>涓囦汉</h2>
       </div>
       <div class="yanglao-block">
         <img src="../../../assets/images/yanglao-icon3.png" alt="">
-        <h1>鍩庨晣鑱屽伐鍏昏�佷繚闄╁弬淇濅汉鏁�</h1>
-        <h2><font class="bigger">{{Insured.zhigong}}</font>涓囦汉</h2>
+        <h1>绀句細淇濋殰鍗℃寔鍗′汉鏁�</h1>
+        <h2><font class="bigger">{{ Insured.card }}</font>涓囦汉</h2>
       </div>
       <div class="yanglao-block">
         <div class="yanglao-block-inside">
@@ -53,12 +53,12 @@
         <div class="yaolao-box">
           <img src="../../../assets/images/yanglao-icon5.png" alt="">
           <h1>鍩庨晣灞呮皯浜哄潎鍙敮閰�</h1>
-          <h2><font class="bigger">27721</font>鍏�</h2>
+          <h2><font class="bigger">{{ Income.chengzhen }}</font>鍏�</h2>
         </div>
         <div class="yaolao-box">
           <img src="../../../assets/images/yanglao-icon6.png" alt="">
           <h1>鍐滄潙灞呮皯浜哄潎鍙敮閰�</h1>
-          <h2><font class="bigger">18676</font>鍏�</h2>
+          <h2><font class="bigger">{{ Income.nongcun }}</font>鍏�</h2>
         </div>
         <div class="fu-biaoti">
           <h1>灞呮皯鏀跺叆</h1>
@@ -70,27 +70,27 @@
             <img src="../../../assets/images/yanglao-icon7.png" alt="">
             <div>
               <h1>娆犺柂绾跨储鎬昏</h1>
-              <h2><font class="bigger">32505</font>鏉�</h2>
+              <h2><font class="bigger">{{ Migrant.zongji }}</font>鏉�</h2>
             </div>
           </div>
           <div class="inside-right">
             <h1>鍔炵粨鐜�</h1>
-            <h2><font class="bigger">96.8</font>%</h2>
+            <h2><font class="bigger">{{ Migrant.zbanjie }}</font>%</h2>
           </div>
         </div>
         <div class="yanglao-block-inside2">
           <div class="inside-left2">
             <h1>鍏ㄥ浗鏍规不娆犺柂绾跨储</h1>
             <div class="danwei-box">
-              <h2 class="rightMargin"><font class="bigger">15132</font>鏉�</h2>
-              <h2 class="rightMargin"><font class="bigger">98.7</font>%</h2>
+              <h2 class="rightMargin"><font class="bigger">{{ Migrant.quanguo }}</font>鏉�</h2>
+              <h2 class="rightMargin"><font class="bigger">{{ Migrant.qbanjie }}</font>%</h2>
             </div>
           </div>
           <div class="inside-left2">
             <h1>甯傜骇娆犺柂绾跨储</h1>
             <div class="danwei-box">
-              <h2 class="rightMargin"><font class="bigger">14992</font>鏉�</h2>
-              <h2 class="rightMargin"><font class="bigger">98.6</font>%</h2>
+              <h2 class="rightMargin"><font class="bigger">{{ Migrant.shiji }}</font>鏉�</h2>
+              <h2 class="rightMargin"><font class="bigger">{{ Migrant.sbanjie }}</font>%</h2>
             </div>
           </div>
         </div>
@@ -104,28 +104,28 @@
             <img src="../../../assets/images/yanglao-icon8.png" alt="">
             <div>
               <h1>鏀捐捶绗旀暟</h1>
-              <h2><font class="bigger">32505</font>绗�</h2>
+              <h2><font class="bigger">{{ Loan.loanNums }}</font>绗�</h2>
             </div>
           </div>
           <div class="inside-box-block">
             <img src="../../../assets/images/yanglao-icon9.png" alt="">
             <div>
               <h1>鏀捐捶閲戦</h1>
-              <h2><font class="bigger">32505</font>浜垮厓</h2>
+              <h2><font class="bigger">{{ Loan.loanAmount }}</font>浜垮厓</h2>
             </div>
           </div>
           <div class="inside-box-block">
             <img src="../../../assets/images/yanglao-icon10.png" alt="">
             <div>
               <h1>鎵舵寔鑷富鍒涗笟</h1>
-              <h2><font class="bigger">32505</font>浜�</h2>
+              <h2><font class="bigger">{{ Loan.supportNums }}</font>浜�</h2>
             </div>
           </div>
           <div class="inside-box-block">
             <img src="../../../assets/images/yanglao-icon11.png" alt="">
             <div>
               <h1>甯﹀姩灏变笟</h1>
-              <h2><font class="bigger">32505</font>浜�</h2>
+              <h2><font class="bigger">{{ Loan.addjobNums }}</font>浜�</h2>
             </div>
           </div>
         </div>
@@ -139,28 +139,28 @@
             <img src="../../../assets/images/yanglao-icon12.png" alt="">
             <div>
               <h1>涓撲笟鎶�鏈汉鎵�</h1>
-              <h2><font class="bigger">50.8</font>涓�</h2>
+              <h2><font class="bigger">{{ Personnel.zhuan }}</font>涓�</h2>
             </div>
           </div>
           <div class="inside-box-block">
             <img src="../../../assets/images/yanglao-icon13.png" alt="">
             <div class="line-center">
-              <h2>A鍗�:<font class="small">835</font>浜�</h2>
-              <h2>B鍗�:<font class="small">32505</font>浜�</h2>
+              <h2>A鍗�:<font class="small">{{ Personnel.personA }}</font>浜�</h2>
+              <h2>B鍗�:<font class="small">{{ Personnel.personB }}</font>浜�</h2>
             </div>
           </div>
           <div class="inside-box-block">
             <img src="../../../assets/images/yanglao-icon14.png" alt="">
             <div>
               <h1>浜彈鐗规畩娲ヨ创</h1>
-              <h2><font class="bigger">264</font>浜�</h2>
+              <h2><font class="bigger">{{ Personnel.jintie }}</font>浜�</h2>
             </div>
           </div>
           <div class="inside-box-block">
             <img src="../../../assets/images/yanglao-icon15.png" alt="">
             <div>
               <h1>楂樻妧鑳戒汉鎵�</h1>
-              <h2><font class="bigger">25.2</font>涓囦汉</h2>
+              <h2><font class="bigger">{{ Personnel.gao }}</font>涓囦汉</h2>
             </div>
           </div>
         </div>
@@ -195,110 +195,118 @@
               </div>
             </div>
             <div class="shuju-scroll">
-              <div class="shuju-table-line2">
+              <div class="shuju-table-line2" v-for="(item,index) in LabourTable" :key="index">
                 <div class="biao-title">
-                  <h1>鍩庨晣鏂板灏变笟锛堜汉锛�</h1>
+                  <el-tooltip placement="top">
+                    <div slot="content">
+                      <h1>{{ item.dataType | dataFilter }}</h1>
+                    </div>
+                    <template>
+                      <div class="content">
+                        <h1>{{ item.dataType | dataFilter }}</h1>
+                      </div>
+                    </template>
+                  </el-tooltip>
                 </div>
                 <div class="title-flex">
                   <div class="title">
-                    <h1>138957</h1>
+                    <h1>{{ item.monthData }}</h1>
                   </div>
                   <div class="title">
-                    <h1>128417</h1>
+                    <h1>{{ item.yearData }}</h1>
                   </div>
                   <div class="title">
-                    <h1 class="fontColor">111.2%</h1>
+                    <h1 class="fontColor">{{ item.finishRate }}</h1>
                   </div>
                   <div class="title">
-                    <h1>125000</h1>
+                    <h1>{{ item.plan }}</h1>
                   </div>
                 </div>
               </div>
-              <div class="shuju-table-line2">
-                <div class="biao-title">
-                  <h1>澶变笟鍐嶅氨涓氾紙浜猴級</h1>
-                </div>
-                <div class="title-flex">
-                  <div class="title">
-                    <h1>138957</h1>
-                  </div>
-                  <div class="title">
-                    <h1>128417</h1>
-                  </div>
-                  <div class="title">
-                    <h1 class="fontColor">111.2%</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                </div>
+              <!--              <div class="shuju-table-line2">
+                              <div class="biao-title">
+                                <h1>澶变笟鍐嶅氨涓氾紙浜猴級</h1>
+                              </div>
+                              <div class="title-flex">
+                                <div class="title">
+                                  <h1>138957</h1>
+                                </div>
+                                <div class="title">
+                                  <h1>128417</h1>
+                                </div>
+                                <div class="title">
+                                  <h1 class="fontColor">111.2%</h1>
+                                </div>
+                                <div class="title">
+                                  <h1>125000</h1>
+                                </div>
+                              </div>
 
-              </div>
-              <div class="shuju-table-line2">
-                <div class="biao-title">
-                  <h1>鍥伴毦鍐嶅氨涓氾紙浜猴級</h1>
-                </div>
-                <div class="title-flex">
-                  <div class="title">
-                    <h1>138957</h1>
-                  </div>
-                  <div class="title">
-                    <h1>128417</h1>
-                  </div>
-                  <div class="title">
-                    <h1 class="fontColor">111.2%</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                </div>
+                            </div>
+                            <div class="shuju-table-line2">
+                              <div class="biao-title">
+                                <h1>鍥伴毦鍐嶅氨涓氾紙浜猴級</h1>
+                              </div>
+                              <div class="title-flex">
+                                <div class="title">
+                                  <h1>138957</h1>
+                                </div>
+                                <div class="title">
+                                  <h1>128417</h1>
+                                </div>
+                                <div class="title">
+                                  <h1 class="fontColor">111.2%</h1>
+                                </div>
+                                <div class="title">
+                                  <h1>125000</h1>
+                                </div>
+                              </div>
 
-              </div>
-              <div class="shuju-table-line2">
-                <div class="biao-title">
-                  <h1>鐧昏澶变笟鐜囷紙%锛�</h1>
-                </div>
-                <div class="title-flex">
-                  <div class="title">
-                    <h1>138957</h1>
-                  </div>
-                  <div class="title">
-                    <h1>128417</h1>
-                  </div>
-                  <div class="title">
-                    <h1 class="fontColor">111.2%</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                </div>
-              </div>
-              <div class="shuju-table-line2">
-                <div class="biao-title">
-                  <h1>闈炲啘灏变笟杞Щ锛堜汉锛�</h1>
-                </div>
-                <div class="title-flex">
-                  <div class="title">
-                    <h1>138957</h1>
-                  </div>
-                  <div class="title">
-                    <h1>128417</h1>
-                  </div>
-                  <div class="title">
-                    <h1 class="fontColor">111.2%</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                </div>
+                            </div>
+                            <div class="shuju-table-line2">
+                              <div class="biao-title">
+                                <h1>鐧昏澶变笟鐜囷紙%锛�</h1>
+                              </div>
+                              <div class="title-flex">
+                                <div class="title">
+                                  <h1>138957</h1>
+                                </div>
+                                <div class="title">
+                                  <h1>128417</h1>
+                                </div>
+                                <div class="title">
+                                  <h1 class="fontColor">111.2%</h1>
+                                </div>
+                                <div class="title">
+                                  <h1>125000</h1>
+                                </div>
+                              </div>
+                            </div>
+                            <div class="shuju-table-line2">
+                              <div class="biao-title">
+                                <h1>闈炲啘灏变笟杞Щ锛堜汉锛�</h1>
+                              </div>
+                              <div class="title-flex">
+                                <div class="title">
+                                  <h1>138957</h1>
+                                </div>
+                                <div class="title">
+                                  <h1>128417</h1>
+                                </div>
+                                <div class="title">
+                                  <h1 class="fontColor">111.2%</h1>
+                                </div>
+                                <div class="title">
+                                  <h1>125000</h1>
+                                </div>
+                              </div>
 
-              </div>
+                            </div>-->
             </div>
 
           </div>
           <div class="shuju-echarts" id="jiuyeshujuEcharts"></div>
         </div>
-
       </div>
       <div class="shu-ju-box">
         <div class="shuju-title-box">
@@ -321,118 +329,118 @@
               </div>
             </div>
             <div class="shuju-scroll">
-              <div class="shuju-table-line2">
+              <div class="shuju-table-line2 chengzhen_scroll" v-for="(item,index) in TownTable" :key="index">
                 <div class="biao-title">
-                  <h1>浜烘暟锛堜竾浜猴級</h1>
+                  <h1>{{ item.name }}</h1>
                 </div>
                 <div class="title-flex">
                   <div class="title">
-                    <h1>277.8</h1>
+                    <h1>{{ item.total }}</h1>
                   </div>
                   <div class="title">
-                    <h1>35.5</h1>
+                    <h1>{{ item.office }}</h1>
                   </div>
                   <div class="title">
-                    <h1>242.3</h1>
+                    <h1>{{ item.enterprise }}</h1>
                   </div>
                 </div>
               </div>
-              <div class="shuju-table-line2 shuju-bj-color">
-                <div class="biao-title">
-                  <h1>鍦ㄨ亴锛堜竾浜猴級</h1>
-                </div>
-                <div class="title-flex">
-                  <div class="title">
-                    <h1>217.8</h1>
-                  </div>
-                  <div class="title">
-                    <h1>13.5</h1>
-                  </div>
-                  <div class="title">
-                    <h1>142.3</h1>
-                  </div>
-                </div>
-              </div>
-              <div class="shuju-table-line2">
-                <div class="biao-title">
-                  <h1>绂婚��浼戯紙涓囦汉锛�</h1>
-                </div>
-                <div class="title-flex">
-                  <div class="title">
-                    <h1>23.8</h1>
-                  </div>
-                  <div class="title">
-                    <h1>16.5</h1>
-                  </div>
-                  <div class="title">
-                    <h1>52.3</h1>
-                  </div>
-                </div>
-              </div>
-              <div class="shuju-table-line2">
-                <div class="biao-title">
-                  <h1>渚涘吇姣�</h1>
-                </div>
-                <div class="title-flex">
-                  <div class="title">
-                    <h1>3.8</h1>
-                  </div>
-                  <div class="title">
-                    <h1>2.5</h1>
-                  </div>
-                  <div class="title">
-                    <h1>1.3</h1>
-                  </div>
-                </div>
-              </div>
-              <div class="shuju-table-line2">
-                <div class="biao-title">
-                  <h1>鏀跺叆锛堜嚎鍏冿級</h1>
-                </div>
-                <div class="title-flex">
-                  <div class="title">
-                    <h1>233.8</h1>
-                  </div>
-                  <div class="title">
-                    <h1>24.5</h1>
-                  </div>
-                  <div class="title">
-                    <h1>341.3</h1>
-                  </div>
-                </div>
-              </div>
-              <div class="shuju-table-line2">
-                <div class="biao-title">
-                  <h1>鏀嚭锛堜嚎鍏冿級</h1>
-                </div>
-                <div class="title-flex">
-                  <div class="title">
-                    <h1>533.8</h1>
-                  </div>
-                  <div class="title">
-                    <h1>84.5</h1>
-                  </div>
-                  <div class="title">
-                    <h1>541.3</h1>
-                  </div>
-                </div>
-              </div>
-              <div class="shuju-table-line2">
-                <div class="biao-title">
-                  <h1>缁撲綑锛堜嚎鍏冿級</h1>
-                </div>
-                <div class="title-flex">
-                  <div class="title">
-                    <h1>33.8</h1>
-                  </div>
-                  <div class="title">
-                    <h1>34.5</h1>
-                  </div>
-                  <div class="title">
-                    <h1>341.3</h1>
-                  </div>
-                </div>
-              </div>
+              <!--              <div class="shuju-table-line2 shuju-bj-color">-->
+              <!--                <div class="biao-title">-->
+              <!--                  <h1>鍦ㄨ亴锛堜竾浜猴級</h1>-->
+              <!--                </div>-->
+              <!--                <div class="title-flex">-->
+              <!--                  <div class="title">-->
+              <!--                    <h1>217.8</h1>-->
+              <!--                  </div>-->
+              <!--                  <div class="title">-->
+              <!--                    <h1>13.5</h1>-->
+              <!--                  </div>-->
+              <!--                  <div class="title">-->
+              <!--                    <h1>142.3</h1>-->
+              <!--                  </div>-->
+              <!--                </div>-->
+              <!--              </div>-->
+              <!--              <div class="shuju-table-line2">-->
+              <!--                <div class="biao-title">-->
+              <!--                  <h1>绂婚��浼戯紙涓囦汉锛�</h1>-->
+              <!--                </div>-->
+              <!--                <div class="title-flex">-->
+              <!--                  <div class="title">-->
+              <!--                    <h1>23.8</h1>-->
+              <!--                  </div>-->
+              <!--                  <div class="title">-->
+              <!--                    <h1>16.5</h1>-->
+              <!--                  </div>-->
+              <!--                  <div class="title">-->
+              <!--                    <h1>52.3</h1>-->
+              <!--                  </div>-->
+              <!--                </div>-->
+              <!--              </div>-->
+              <!--              <div class="shuju-table-line2">-->
+              <!--                <div class="biao-title">-->
+              <!--                  <h1>渚涘吇姣�</h1>-->
+              <!--                </div>-->
+              <!--                <div class="title-flex">-->
+              <!--                  <div class="title">-->
+              <!--                    <h1>3.8</h1>-->
+              <!--                  </div>-->
+              <!--                  <div class="title">-->
+              <!--                    <h1>2.5</h1>-->
+              <!--                  </div>-->
+              <!--                  <div class="title">-->
+              <!--                    <h1>1.3</h1>-->
+              <!--                  </div>-->
+              <!--                </div>-->
+              <!--              </div>-->
+              <!--              <div class="shuju-table-line2">-->
+              <!--                <div class="biao-title">-->
+              <!--                  <h1>鏀跺叆锛堜嚎鍏冿級</h1>-->
+              <!--                </div>-->
+              <!--                <div class="title-flex">-->
+              <!--                  <div class="title">-->
+              <!--                    <h1>233.8</h1>-->
+              <!--                  </div>-->
+              <!--                  <div class="title">-->
+              <!--                    <h1>24.5</h1>-->
+              <!--                  </div>-->
+              <!--                  <div class="title">-->
+              <!--                    <h1>341.3</h1>-->
+              <!--                  </div>-->
+              <!--                </div>-->
+              <!--              </div>-->
+              <!--              <div class="shuju-table-line2">-->
+              <!--                <div class="biao-title">-->
+              <!--                  <h1>鏀嚭锛堜嚎鍏冿級</h1>-->
+              <!--                </div>-->
+              <!--                <div class="title-flex">-->
+              <!--                  <div class="title">-->
+              <!--                    <h1>533.8</h1>-->
+              <!--                  </div>-->
+              <!--                  <div class="title">-->
+              <!--                    <h1>84.5</h1>-->
+              <!--                  </div>-->
+              <!--                  <div class="title">-->
+              <!--                    <h1>541.3</h1>-->
+              <!--                  </div>-->
+              <!--                </div>-->
+              <!--              </div>-->
+              <!--              <div class="shuju-table-line2">-->
+              <!--                <div class="biao-title">-->
+              <!--                  <h1>缁撲綑锛堜嚎鍏冿級</h1>-->
+              <!--                </div>-->
+              <!--                <div class="title-flex">-->
+              <!--                  <div class="title">-->
+              <!--                    <h1>33.8</h1>-->
+              <!--                  </div>-->
+              <!--                  <div class="title">-->
+              <!--                    <h1>34.5</h1>-->
+              <!--                  </div>-->
+              <!--                  <div class="title">-->
+              <!--                    <h1>341.3</h1>-->
+              <!--                  </div>-->
+              <!--                </div>-->
+              <!--              </div>-->
             </div>
           </div>
           <div class="shuju-echarts" id="chengzhenZhigongYanglaoEcharts"></div>
@@ -446,142 +454,7 @@
           <h1>澶变笟淇濋櫓</h1>
         </div>
         <div class="shuju-main-box">
-          <div class="shuju-table">
-            <div class="shuju-table-line">
-              <div class="biao-title"></div>
-              <div class="title-flex">
-                <div class="title">
-                  <h1>鏈湀</h1>
-                </div>
-                <div class="title">
-                  <h1>鏈勾鍚屾湡</h1>
-                </div>
-                <div class="title">
-                  <h1>鍚屾瘮</h1>
-                </div>
-                <div class="title">
-                  <h1>涓婃湀</h1>
-                </div>
-                <div class="title">
-                  <h1>鐜瘮</h1>
-                </div>
-              </div>
-            </div>
-            <div class="shuju-scroll">
-              <div class="shuju-table-line2">
-                <div class="biao-title">
-                  <h1>浜烘暟锛堜竾浜猴級</h1>
-                </div>
-                <div class="title-flex">
-                  <div class="title">
-                    <h1>138957</h1>
-                  </div>
-                  <div class="title">
-                    <h1>128417</h1>
-                  </div>
-                  <div class="title">
-                    <h1 class="fontColor">111.2%</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                </div>
-
-              </div>
-              <div class="shuju-table-line2">
-                <div class="biao-title">
-                  <h1>鏀跺叆锛堜嚎鍏冿級</h1>
-                </div>
-                <div class="title-flex">
-                  <div class="title">
-                    <h1>138957</h1>
-                  </div>
-                  <div class="title">
-                    <h1>128417</h1>
-                  </div>
-                  <div class="title">
-                    <h1 class="fontColor">111.2%</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                </div>
-              </div>
-              <div class="shuju-table-line2">
-                <div class="biao-title">
-                  <h1>鏀嚭锛堜嚎鍏冿級</h1>
-                </div>
-                <div class="title-flex">
-                  <div class="title">
-                    <h1>138957</h1>
-                  </div>
-                  <div class="title">
-                    <h1>128417</h1>
-                  </div>
-                  <div class="title">
-                    <h1 class="fontColor">111.2%</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                </div>
-              </div>
-              <div class="shuju-table-line2">
-                <div class="biao-title">
-                  <h1>鏈湀缁撲綑锛堜嚎鍏冿級</h1>
-                </div>
-                <div class="title-flex">
-                  <div class="title">
-                    <h1>138957</h1>
-                  </div>
-                  <div class="title">
-                    <h1>128417</h1>
-                  </div>
-                  <div class="title">
-                    <h1 class="fontColor">111.2%</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                </div>
-              </div>
-              <div class="shuju-table-line2">
-                <div class="biao-title">
-                  <h1>绱缁撲綑锛堜嚎鍏冿級</h1>
-                </div>
-                <div class="title-flex">
-                  <div class="title">
-                    <h1>138957</h1>
-                  </div>
-                  <div class="title">
-                    <h1>128417</h1>
-                  </div>
-                  <div class="title">
-                    <h1 class="fontColor">111.2%</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                </div>
-              </div>
-            </div>
-
-          </div>
+          <shiyeAndgongshangBaoxian typeString="4"></shiyeAndgongshangBaoxian>
           <div class="shuju-echarts" id="shiyeBaoxianEcharts"></div>
         </div>
 
@@ -591,161 +464,85 @@
           <h1>宸ヤ激淇濋櫓</h1>
         </div>
         <div class="shuju-main-box">
-          <div class="shuju-table">
-            <div class="shuju-table-line">
-              <div class="biao-title"></div>
-              <div class="title-flex">
-                <div class="title">
-                  <h1>鏈湀</h1>
-                </div>
-                <div class="title">
-                  <h1>鏈勾鍚屾瘮</h1>
-                </div>
-                <div class="title">
-                  <h1>鍚屾瘮</h1>
-                </div>
-                <div class="title">
-                  <h1>涓婃湀</h1>
-                </div>
-                <div class="title">
-                  <h1>鐜瘮</h1>
-                </div>
-              </div>
-            </div>
-            <div class="shuju-scroll">
-              <div class="shuju-table-line2">
-                <div class="biao-title">
-                  <h1>浜烘暟锛堜竾浜猴級</h1>
-                </div>
-                <div class="title-flex">
-                  <div class="title">
-                    <h1>138957</h1>
-                  </div>
-                  <div class="title">
-                    <h1>128417</h1>
-                  </div>
-                  <div class="title">
-                    <h1 class="fontColor">111.2%</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                </div>
-              </div>
-              <div class="shuju-table-line2">
-                <div class="biao-title">
-                  <h1>鏀跺叆锛堜嚎鍏冿級</h1>
-                </div>
-                <div class="title-flex">
-                  <div class="title">
-                    <h1>138957</h1>
-                  </div>
-                  <div class="title">
-                    <h1>128417</h1>
-                  </div>
-                  <div class="title">
-                    <h1 class="fontColor">111.2%</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                </div>
-              </div>
-              <div class="shuju-table-line2">
-                <div class="biao-title">
-                  <h1>鏀嚭锛堜嚎鍏冿級</h1>
-                </div>
-                <div class="title-flex">
-                  <div class="title">
-                    <h1>138957</h1>
-                  </div>
-                  <div class="title">
-                    <h1>128417</h1>
-                  </div>
-                  <div class="title">
-                    <h1 class="fontColor">111.2%</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                </div>
-              </div>
-              <div class="shuju-table-line2">
-                <div class="biao-title">
-                  <h1>鏈湀缁撲綑锛堜嚎鍏冿級</h1>
-                </div>
-                <div class="title-flex">
-                  <div class="title">
-                    <h1>138957</h1>
-                  </div>
-                  <div class="title">
-                    <h1>128417</h1>
-                  </div>
-                  <div class="title">
-                    <h1 class="fontColor">111.2%</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                </div>
-              </div>
-              <div class="shuju-table-line2">
-                <div class="biao-title">
-                  <h1>绱缁撲綑锛堜嚎鍏冿級</h1>
-                </div>
-                <div class="title-flex">
-                  <div class="title">
-                    <h1>138957</h1>
-                  </div>
-                  <div class="title">
-                    <h1>128417</h1>
-                  </div>
-                  <div class="title">
-                    <h1 class="fontColor">111.2%</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                  <div class="title">
-                    <h1>125000</h1>
-                  </div>
-                </div>
-              </div>
-            </div>
-
-          </div>
+          <shiyeAndgongshangBaoxian typeString="5"></shiyeAndgongshangBaoxian>
           <div class="shuju-echarts" id="gongshangBaoxianEcharts"></div>
-    </div>
+        </div>
 
-  </div>
-  </div>
+      </div>
+    </div>
   </div>
 </template>
 <script>
 import echarts from "echarts/lib/echarts";
 import nowSize from "../../../libs/nowSize";
-import {getInsured,getInstitution} from "@/api/index";
+import shiyeAndgongshangBaoxian from "../../components/index/shiyeAndgongshangBaoxian";
+import {
+  getInsured,
+  getInstitution,
+  getIncome,
+  getMigrant,
+  getLoan,
+  getPersonnel,
+  getLabourTable,
+  getLabourChart,
+  getInsuranceChart,
+  getTownTable,
+} from "@/api/index";
 
 export default {
   name: "index",
+  components: {
+      shiyeAndgongshangBaoxian
+  },
   data() {
     return {
       // 琚繚闄╀汉
-      Insured:{},
+      Insured: {},
       // 棣栭〉甯傜洿鍗曚綅鏁版嵁
-      Institution:{}
+      Institution: {},
+      // 浜哄潎鍙敮閰嶆敹鍏�
+      Income: {},
+      // 鏌ヨ娆犺柂杩界即
+      Migrant: {},
+      // 鏌ヨ鍒涗笟鎷呬繚璐锋鏁版嵁鎺ュ彛
+      Loan: {},
+      // 23. 鏌ヨ浜烘墠寤鸿鏁版嵁鎺ュ彛
+      Personnel: {},
+      // 24. 鏌ヨ棣栭〉灏变笟鏁版嵁琛ㄦ牸鎺ュ彛
+      LabourTable: {},
+      // 25.棣栭〉灏变笟鏁版嵁鎶樼嚎鍥�
+      JiuYeEchart: {
+        addJob: [],
+        reJob: [],
+        hardJob: [],
+        LabourChartYear: []
+      },
+      // 26. 鏌ヨ棣栭〉鍏昏�併�佸伐浼ゃ�佸け涓氫繚闄╂姌绾垮浘鎺ュ彛
+      // 鍩庨晣鑱屽伐鍏昏��
+      YangLaoEchart: {
+        years: [],
+        shouru: [],
+        zhichu: [],
+        jieyu: []
+      },
+      // 澶变笟淇濋櫓
+      ShiYeEchart: {
+        years: [],
+        shouru: [],
+        zhichu: [],
+        jieyu: []
+      },
+      // 宸ヤ激
+      GongShangEchart: {
+        years: [],
+        shouru: [],
+        zhichu: [],
+        jieyu: []
+      },
+      // 27. 鏌ヨ棣栭〉鍩庨晣鑱屽伐鍏昏�佽〃鏍兼暟鎹帴鍙�
+      TownTable: [],
+      // 28.澶变笟淇濋櫓
+        type:'',
     }
   },
   mounted() {
@@ -755,6 +552,37 @@
     this.gongshangBaoxianEcharts()
     this.getInsured()
     this.getInstitution()
+    this.getIncome()
+    this.getMigrant()
+    this.getLoan()
+    this.getPersonnel()
+    this.getLabourTable()
+    this.getLabourChart()
+    this.getInsuranceChart()
+    this.getTownTable()
+    // this.getshiyeTable()
+    // this.getGongshangTable()
+  },
+  filters: {
+    dataFilter(type) {
+      switch (type) {
+        case '1':
+          return '鍩庨晣鏂板灏变笟浜烘暟'
+          break
+        case '2':
+          return '鍩庨晣澶变笟浜哄憳瀹炵幇鍐嶅氨涓氫汉鏁�'
+          break
+        case '3':
+          return '鍩庨晣灏变笟鍥伴毦浜哄憳瀹炵幇鍐嶅氨涓氫汉鏁�'
+          break
+        case '4':
+          return '鍐滄潙鍔冲姩鍔涘悜闈炲啘浜т笟杞Щ浜烘暟'
+        case '7':
+          return '鍩庨晣鐧昏澶变笟鐜�'
+        default:
+          break
+      }
+    }
   },
   methods: {
     /*灏变笟鏁版嵁*/
@@ -767,7 +595,6 @@
           trigger: 'axis'
         },
         legend: {
-          data: ['鎬绘暟', '鍦ㄨ亴鑱屽伐', '绂婚��浼�'],
           itemWidth: nowSize(24),
           itemHeight: nowSize(4),
           itemGap: nowSize(10),
@@ -780,7 +607,7 @@
         },
         grid: {
           top: '20%',
-          left: '1%',
+          left: '3%',
           right: '5%',
           bottom: '3%',
           containLabel: true
@@ -788,7 +615,7 @@
         xAxis: {
           type: 'category',
           boundaryGap: false,
-          data: ['2021/4', '2021/5', '2021/6', '2021/7', '2021/8', '2021/9', '2021/10'],
+          data: this.JiuYeEchart.LabourChartYear,
           axisLabel: {
             show: true,
             textStyle: {
@@ -810,7 +637,7 @@
         yAxis: {
           type: 'value',
           axisLabel: {
-            show: true,
+            show: false,
             textStyle: {
               color: "#fff",
               fontSize: nowSize(20)
@@ -825,25 +652,27 @@
           },
           splitLine: {
             show: false
+          },
+          // 鍒诲害璁剧疆
+          axisTick: {
+            show: false
           }
         },
-        series: [
+        series: [{
+          name: '鍩庨晣鏂板灏变笟',
+          type: 'line',
+          data: this.JiuYeEchart.addJob
+        },
           {
-            name: '鎬绘暟',
+            name: '澶变笟鍐嶅氨涓�',
             type: 'line',
-            data: [370, 332, 401, 534, 490, 530, 910]
+            data: this.JiuYeEchart.reJob
           },
           {
-            name: '鍦ㄨ亴鑱屽伐',
+            name: '鍥伴毦鍐嶅氨涓�',
             type: 'line',
-            data: [220, 182, 191, 234, 290, 330, 310]
-          },
-          {
-            name: '绂婚��浼�',
-            type: 'line',
-            data: [150, 132, 201, 154, 190, 330, 410]
-          }
-        ]
+            data: this.JiuYeEchart.hardJob
+          }]
       };
       myEchart.setOption(option)
       window.addEventListener('resize', function () {
@@ -860,11 +689,10 @@
           trigger: 'axis'
         },
         legend: {
-          data: ['鎬绘暟', '鍦ㄨ亴鑱屽伐', '绂婚��浼�'],
           itemWidth: nowSize(24),
           itemHeight: nowSize(4),
           itemGap: nowSize(10),
-          right: '0%',
+          right: '10%',
           top: '0%',
           textStyle: {
             color: '#FFFFFF',
@@ -881,7 +709,7 @@
         xAxis: {
           type: 'category',
           boundaryGap: false,
-          data: ['2021/4', '2021/5', '2021/6', '2021/7', '2021/8', '2021/9', '2021/10'],
+          data: this.YangLaoEchart.years,
           axisLabel: {
             show: true,
             textStyle: {
@@ -922,19 +750,19 @@
         },
         series: [
           {
-            name: '鎬绘暟',
+            name: '鏀跺叆',
             type: 'line',
-            data: [370, 332, 401, 534, 490, 530, 910]
+            data: this.YangLaoEchart.shouru
           },
           {
-            name: '鍦ㄨ亴鑱屽伐',
+            name: '鏀嚭',
             type: 'line',
-            data: [220, 182, 191, 234, 290, 330, 310]
+            data: this.YangLaoEchart.zhichu
           },
           {
-            name: '绂婚��浼�',
+            name: '缁撲綑',
             type: 'line',
-            data: [150, 132, 201, 154, 190, 330, 410]
+            data: this.YangLaoEchart.jieyu
           }
         ]
       };
@@ -953,11 +781,10 @@
           trigger: 'axis'
         },
         legend: {
-          data: ['鎬绘暟', '鍦ㄨ亴鑱屽伐', '绂婚��浼�'],
           itemWidth: nowSize(24),
           itemHeight: nowSize(4),
           itemGap: nowSize(1),
-          right: '0%',
+          right: '10%',
           top: '0%',
           textStyle: {
             color: '#FFFFFF',
@@ -974,7 +801,7 @@
         xAxis: {
           type: 'category',
           boundaryGap: false,
-          data: ['2021/4', '2021/5', '2021/6', '2021/7', '2021/8', '2021/9', '2021/10'],
+          data: this.ShiYeEchart.years,
           axisLabel: {
             show: true,
             textStyle: {
@@ -1015,19 +842,19 @@
         },
         series: [
           {
-            name: '鎬绘暟',
+            name: '鏀跺叆',
             type: 'line',
-            data: [370, 332, 401, 534, 490, 530, 910]
+            data: this.ShiYeEchart.shouru
           },
           {
-            name: '鍦ㄨ亴鑱屽伐',
+            name: '鏀嚭',
             type: 'line',
-            data: [220, 182, 191, 234, 290, 330, 310]
+            data: this.ShiYeEchart.zhichu
           },
           {
-            name: '绂婚��浼�',
+            name: '缁撲綑',
             type: 'line',
-            data: [150, 132, 201, 154, 190, 330, 410]
+            data: this.ShiYeEchart.jieyu
           }
         ]
       };
@@ -1046,11 +873,10 @@
           trigger: 'axis'
         },
         legend: {
-          data: ['鎬绘暟', '鍦ㄨ亴鑱屽伐', '绂婚��浼�'],
           itemWidth: nowSize(24),
           itemHeight: nowSize(4),
           itemGap: nowSize(10),
-          right: '0%',
+          right: '10%',
           top: '0%',
           textStyle: {
             color: '#FFFFFF',
@@ -1067,7 +893,7 @@
         xAxis: {
           type: 'category',
           boundaryGap: false,
-          data: ['2021/4', '2021/5', '2021/6', '2021/7', '2021/8', '2021/9', '2021/10'],
+          data: this.GongShangEchart.years,
           axisLabel: {
             show: true,
             textStyle: {
@@ -1108,19 +934,19 @@
         },
         series: [
           {
-            name: '鎬绘暟',
+            name: '鏀跺叆',
             type: 'line',
-            data: [370, 332, 401, 534, 490, 530, 910]
+            data: this.GongShangEchart.shouru
           },
           {
-            name: '鍦ㄨ亴鑱屽伐',
+            name: '鏀嚭',
             type: 'line',
-            data: [220, 182, 191, 234, 290, 330, 310]
+            data: this.GongShangEchart.zhichu
           },
           {
-            name: '绂婚��浼�',
+            name: '缁撲綑',
             type: 'line',
-            data: [150, 132, 201, 154, 190, 330, 410]
+            data: this.GongShangEchart.jieyu
           }
         ]
       };
@@ -1132,23 +958,115 @@
     // 鏌ヨ棣栭〉鍏昏�佷繚闄╁弬淇濅汉鏁帮紝绀句繚鍗′汉鏁�
     getInsured() {
       getInsured().then(res => {
-        if(res.code === 1000) {
+        if (res.code === 1000) {
           this.Insured = res.obj
-        }else{
+        } else {
           this.$message.error('鑾峰彇淇℃伅澶辫触')
         }
       })
     },
     // 鏌ヨ棣栭〉甯傜洿鍗曚綅鏁版嵁鎺ュ彛
-    getInstitution(){
-      getInstitution().then(res=>{
-        if(res.code === 1000){
+    getInstitution() {
+      getInstitution().then(res => {
+        if (res.code === 1000) {
           this.Institution = res.obj
-        }else{
+        } else {
           this.$message.error('鑾峰彇淇℃伅澶辫触')
         }
       })
-    }
+    },
+    // 鏌ヨ浜哄潎鍙敮閰嶆敹鍏ユ暟鎹帴鍙�
+    getIncome() {
+      getIncome().then(res => {
+        if (res.code === 1000) {
+          this.Income = res.obj
+        }
+      })
+    },
+    // 鏌ヨ娆犺柂杩界即鏁版嵁鎺ュ彛
+    getMigrant() {
+      getMigrant().then(res => {
+        if (res.code === 1000) {
+          this.Migrant = res.obj
+        }
+      })
+    },
+    // 鏌ヨ鍒涗笟鎷呬繚璐锋鏁版嵁鎺ュ彛
+    getLoan() {
+      getLoan().then(res => {
+        if (res.code === 1000) {
+          this.Loan = res.obj
+        }
+      })
+    },
+    // 23. 鏌ヨ浜烘墠寤鸿鏁版嵁鎺ュ彛
+    getPersonnel() {
+      getPersonnel().then(res => {
+        if (res.code === 1000) {
+          this.Personnel = res.obj
+        }
+      })
+    },
+    // 24. 鏌ヨ棣栭〉灏变笟鏁版嵁琛ㄦ牸鎺ュ彛
+    getLabourTable() {
+      getLabourTable().then(res => {
+        this.LabourTable = res.list
+      })
+    },
+    // 25. 鏌ヨ棣栭〉灏变笟鏁版嵁鎶樼嚎鍥炬帴鍙�
+    async getLabourChart() {
+      await getLabourChart().then(res => {
+        if (res.code === 1000) {
+          this.JiuYeEchart.LabourChartYear = res.obj.years;
+          this.JiuYeEchart.addJob = res.obj.addJob;
+          this.JiuYeEchart.reJob = res.obj.hardJob;
+          this.JiuYeEchart.hardJob = res.obj.reJob;
+          this.jiuyeshujuEcharts()
+        }
+      })
+    },
+    // 26. 鏌ヨ棣栭〉鍏昏�併�佸伐浼ゃ�佸け涓氫繚闄╂姌绾垮浘鎺ュ彛
+    async getInsuranceChart() {
+      // 鍩庨晣鑱屽伐鍏昏��
+      await getInsuranceChart({type: 1}).then(res => {
+        if (res.code === 1000) {
+          this.YangLaoEchart.shouru = res.obj.shouru
+          this.YangLaoEchart.zhichu = res.obj.zhichu
+          this.YangLaoEchart.jieyu = res.obj.jieyu
+          this.YangLaoEchart.years = res.obj.years
+          this.chengzhenZhigongYanglaoEcharts()
+        }
+      })
+      // 澶变笟淇濋櫓
+      await getInsuranceChart({type: 5}).then(res => {
+        if (res.code === 1000) {
+          this.ShiYeEchart.shouru = res.obj.shouru
+          this.ShiYeEchart.zhichu = res.obj.zhichu
+          this.ShiYeEchart.jieyu = res.obj.jieyu
+          this.ShiYeEchart.years = res.obj.years
+          this.shiyeBaoxianEcharts()
+        }
+      })
+      // 宸ヤ激淇濋櫓
+      await getInsuranceChart({type: 6}).then(res => {
+        if (res.code === 1000) {
+          this.GongShangEchart.shouru = res.obj.shouru
+          this.GongShangEchart.zhichu = res.obj.zhichu
+          this.GongShangEchart.jieyu = res.obj.jieyu
+          this.GongShangEchart.years = res.obj.years
+          this.gongshangBaoxianEcharts()
+        }
+      })
+    },
+    // 27. 鏌ヨ棣栭〉鍩庨晣鑱屽伐鍏昏�佽〃鏍兼暟鎹帴鍙�
+    getTownTable() {
+      getTownTable().then(res => {
+        console.log(res);
+        if (res.code === 1000) {
+          this.TownTable = res.list
+        }
+      })
+    },
   }
 };
 </script>
@@ -1418,16 +1336,11 @@
         box-sizing: border-box;
         display: flex;
 
-        .shuju-table {
-          width: 3.1328125rem /* 802/256 */
-        ;
-          height: 1.2109375rem /* 310/256 */
-        ;
-        }
       }
 
       .shuju-table {
-        width: 100%;
+        width: 3.1328125rem /* 802/256 */;
+        height: 1.2109375rem /* 310/256 */;
         display: flex;
         flex-direction: column;
 
@@ -1436,17 +1349,19 @@
           display: flex;
 
           .biao-title {
-            width: 1.328125rem /* 340/256 */
-          ;
+            width: 0.859375rem /* 220/256 */;
           }
 
           .title-flex {
-            width: 100%;
+            width: calc(100% - 0.859375rem);
             display: flex;
           }
 
           .title {
             flex: 1;
+            display: flex;
+            align-items: center;
+            justify-content: center;
 
             h1 {
               font-size: $fontSize-26;
@@ -1475,6 +1390,9 @@
 
           .title {
             flex: 1;
+            display: flex;
+            align-items: center;
+            justify-content: center;
 
             h1 {
               font-size: $fontSize-26;
@@ -1483,18 +1401,21 @@
               line-height: 1.5;
             }
 
-            .fontColor {
+            .fontColorBlue {
               color: $color-blue;
+            }
+            .fontColorRed {
+              color: #FF3939;
             }
           }
 
           .title-flex {
-            width: 100%;
+            width: calc(100% - 0.859375rem);
             display: flex;
           }
 
           .biao-title {
-            width: 1.328125rem /* 340/256 */
+            width: 0.859375rem /* 220/256 */
           ;
 
             h1 {
@@ -1502,6 +1423,7 @@
               color: $color-white;
               text-align: right;
               line-height: 1.5;
+              @include ellipsis()
             }
 
             .fontColor {
@@ -1509,6 +1431,29 @@
             }
           }
         }
+        // 鍩庡競鑱屽伐鍏昏�佺2锛�3鏉℃暟鎹�
+        .chengzhen_scroll {
+          &:nth-of-type(2) {
+            background: rgba(81, 210, 255, 0.10);
+
+            h1 {
+              font-size: 24px;
+              line-height: 1;
+              color: #999999;
+            }
+          }
+
+          &:nth-of-type(3) {
+            background: rgba(81, 210, 255, 0.10);
+
+            h1 {
+              font-size: 24px;
+              line-height: 1;
+              color: #999999;
+
+            }
+          }
+        }
 
         .shuju-bj-color {
           background: rgba(81, 210, 255, 0.10);

--
Gitblit v1.9.1