style:首页修改

@@ -11,74 +11,75 @@
 </template>
 </template>
 
 
 <script>
 <script>
-  import maps from "@/components/Echart/Map";
-  import brokenline from "@/components/Echart/Brokenline";
-  export default {
-    data () {
-      return {};
-    },
-    components: { maps, brokenline },
-    mounted () { },
-    beforeDestroy () { },
-    methods: {},
-  };
+import maps from "@/components/Echart/Map";
+import brokenline from "@/components/Echart/Brokenline";
+export default {
+  data () {
+    return {};
+  },
+  components: { maps, brokenline },
+  mounted () { },
+  beforeDestroy () { },
+  methods: {},
+};
 </script>
 </script>
 
 
 <style lang="scss" scoped>
 <style lang="scss" scoped>
-  .centercard {
-    width: 44%;
-    height: calc(100vh - 114px);
-    box-sizing: border-box;
-    padding: 0 0.0521rem;
-    display: flex;
-    flex-direction: column;
+.centercard {
+  width: 40%;
+  height: calc(100vh - 114px);
+  box-sizing: border-box;
+  padding: 0 0.0521rem;
+  display: flex;
+  flex-direction: column;
 
 
-    .card1 {
-      width: 100%;
-      background: url("~@/image/mapcenter.png") no-repeat;
-      background-size: 100% 100%;
-      position: relative;
-      height: 64%;
+  .card1 {
+    width: 100%;
+    background: url("~@/image/mapcenter.png") no-repeat;
+    background-size: 100% 100%;
+    position: relative;
+    height: 64%;
 
 
-      .title {
-        position: absolute;
-        font-weight: bold;
-        color: #02d9fd;
-        line-height: 0.1354rem;
-        font-size: 0.1146rem;
-        position: absolute;
-        left: 0;
-        right: 0;
-        top: 0.0365rem;
-        text-align: right;
-        padding-right: 15%;
-      }
+    .title {
+      position: absolute;
+      font-weight: bold;
+      color: #02d9fd;
+      line-height: 0.1354rem;
+      font-size: 0.1146rem;
+      position: absolute;
+      left: 0;
+      right: 0;
+      top: 0.0365rem;
+      text-align: right;
+      padding-right: 15%;
     }
     }
+  }
 
 
-    .card2 {
-      width: 100%;
-      background: url("~@/image/sjqs.png") no-repeat;
-      background-size: 100% 100%;
-      position: relative;
-      flex: 1;
+  .card2 {
+    width: 100%;
+    background: url("~@/image/sjqs.png") no-repeat;
+    background-size: 100% 100%;
+    position: relative;
+    flex: 1;
 
 
-      .title {
-        position: absolute;
-        font-weight: bold;
-        color: #02d9fd;
-        line-height: 0.1354rem;
-        font-size: 0.1146rem;
-        position: absolute;
-        left: 0;
-        right: 0;
-        top: 0.0365rem;
-        text-align: center;
-        margin-bottom: 0.0521rem;
-      }
-      .brokenline {
-        margin: auto;
-        width: 100%;
-      }
+    .title {
+      position: absolute;
+      font-weight: bold;
+      color: #02d9fd;
+      line-height: 0.1354rem;
+      font-size: 0.1146rem;
+      position: absolute;
+      left: 0;
+      right: 0;
+      top: 0.0365rem;
+      text-align: center;
+      margin-bottom: 0.0521rem;
+    }
+
+    .brokenline {
+      margin: auto;
+      width: 100%;
     }
     }
   }
   }
+}
 </style>
 </style>

@@ -19,153 +19,156 @@
 </template>
 </template>
 
 
 <script>
 <script>
-  import columnarsmat from "@/components/Echart/Columnarsmat";
-  import Rose from "@/components/Echart/Rose";
-  import work from "@/api/work";
-  export default {
-    data () {
-      return {
-        config: {
-          headerBGC: '#016AC5',
-          oddRowBGC: '#154295',
-          evenRowBGC: '#154295',
-          header: ['序号', '业务名称', '登记业务量'],
-          columnWidth: [120, 270, 140],
-          data: [],
-          key: 0
-        }
+import columnarsmat from "@/components/Echart/Columnarsmat";
+import Rose from "@/components/Echart/Rose";
+import work from "@/api/work";
+export default {
+  data () {
+    return {
+      config: {
+        headerBGC: '#016AC5',
+        oddRowBGC: '#154295',
+        evenRowBGC: '#154295',
+        header: ['序号', '业务名称', '登记业务量'],
+        columnWidth: [120, 270, 140],
+        data: [],
+        key: 0
       }
       }
-    },
-    components: { columnarsmat, Rose },
-    mounted () {
+    }
+  },
+  components: { columnarsmat, Rose },
+  mounted () {
+    this.getdjywltotal();
+    window.addEventListener("resize", () => {
+      this.cdata.seriesData = [];
       this.getdjywltotal();
       this.getdjywltotal();
-      window.addEventListener("resize", () => {
-        this.cdata.seriesData = [];
-        this.getdjywltotal();
-      });
-      // scroll(tableref.value.$refs.bodyWrapper);//设置滚动
-    },
-    methods: {
-      // 获取登记业务量玫瑰图数据
-      async getdjywltotal () {
-        try {
-          let p = {
-            DJLX: "",
-            QLLX: "",
-            XZQDM: "",
-          };
-
-          let res = await work.getdjywltotal(p);
-          res.result.map((item, index) => {
-            this.config.data.push([index, item.AREACODE, item.ywtotal])
-
-          });
-
-          // 遍历修改数组键，作为echars图表的参数
-
-
-        } catch (error) {
-          console.log(error);
-        }
+    });
+    // scroll(tableref.value.$refs.bodyWrapper);//设置滚动
+  },
+  methods: {
+    // 获取登记业务量玫瑰图数据
+    async getdjywltotal () {
+      try {
+        let p = {
+          DJLX: "",
+          QLLX: "",
+          XZQDM: "",
+        };
+
+        let res = await work.getdjywltotal(p);
+        res.result.map((item, index) => {
+          this.config.data.push([index, item.AREACODE, item.ywtotal])
+
+        });
+
+        // 遍历修改数组键，作为echars图表的参数
+
+
+      } catch (error) {
+        console.log(error);
+      }
 
 
-      },
     },
     },
-  }
+  },
+}
 </script>
 </script>
 <style lang="scss" scoped>
 <style lang="scss" scoped>
-  /deep/.row-item:not(:last-child) {
-    margin-bottom: 0.026rem;
+/deep/.row-item:not(:last-child) {
+  margin-bottom: 0.026rem;
+}
+
+.rightcard {
+  width: 30%;
+  display: flex;
+  height: calc(100vh - 114px);
+  flex-direction: column;
+
+  .cardhead {
+    font-size: 0.1042rem;
+    font-weight: bold;
+    color: #02d9fd;
+    text-align: center;
+    position: absolute;
+    left: 0;
+    right: 0;
+    top: 0.0625rem;
+    text-align: center;
   }
   }
 
 
-  .rightcard {
-    width: 32%;
-    display: flex;
-    height: calc(100vh - 114px);
-    flex-direction: column;
+  .cardcontent {
+    width: 100%;
+    height: 100%;
+    display: -webkit-box;
+    overflow: hidden;
 
 
-    .cardhead {
+    .nodata {
       font-size: 0.1042rem;
       font-size: 0.1042rem;
-      font-weight: bold;
       color: #02d9fd;
       color: #02d9fd;
-      text-align: center;
-      position: absolute;
-      left: 0;
-      right: 0;
-      top: 0.0625rem;
-      text-align: center;
+      font-weight: bold;
+      margin: auto;
+      margin-top: 120px;
     }
     }
+  }
 
 
-    .cardcontent {
-      width: 100%;
-      height: 100%;
-      display: -webkit-box;
-      overflow: hidden;
-
-      .nodata {
-        font-size: 0.1042rem;
-        color: #02d9fd;
-        font-weight: bold;
-        margin: auto;
-        margin-top: 120px;
+  .cardCon {
+    padding: 0.0521rem 0.026rem;
+    position: relative;
+    text-align: center;
+    width: 100%;
+  }
+
+  .card1 {
+    height: 33%;
+    background: url("~@/image/xjgyfwxx.png") no-repeat;
+    background-size: 100% 100%;
+
+    /deep/.dv-scroll-board {
+      .header {
+        height: 0.1875rem;
+        align-items: center;
       }
       }
     }
     }
 
 
-    .cardCon {
-      padding: 0.0521rem 0.026rem;
-      position: relative;
-      text-align: center;
-      width: 100%;
-    }
+    .board {
+      width: 90%;
+      margin: 0 auto;
+      height: 1.1031rem;
+      margin-top: 0.0521rem;
 
 
-    .card1 {
-      height: 33%;
-      background: url("~@/image/xjgyfwxx.png") no-repeat;
-      background-size: 100% 100%;
-      /deep/.dv-scroll-board {
-        .header {
-          height: 0.1875rem;
-          align-items: center;
-        }
+      /deep/.header {
+        font-size: 0.0738rem;
       }
       }
-      .board {
-        width: 90%;
-        margin: 0 auto;
-        height: 1.1031rem;
-        margin-top: 0.0521rem;
-        /deep/.header {
+
+      /deep/.rows {
+        .ceil {
           font-size: 0.0738rem;
           font-size: 0.0738rem;
-        }
-        /deep/.rows {
-          .ceil {
-            font-size: 0.0738rem;
-            color: #6bc1fc;
-          }
+          color: #6bc1fc;
         }
         }
       }
       }
     }
     }
+  }
 
 
-    .card2 {
-      height: 33%;
-      background: url("~@/image/djywl.png") no-repeat;
-      background-size: 100% 100%;
-      padding: 0.3825rem 0 0 0;
-      overflow: hidden;
-    }
-
-    .card3 {
-      height: 33%;
-      flex: 1;
-      background: url("~@/image/djlxzl.png") no-repeat;
-      background-size: 100% 100%;
-      padding-bottom: 0;
+  .card2 {
+    height: 33%;
+    background: url("~@/image/djywl.png") no-repeat;
+    background-size: 100% 100%;
+    padding: 0.3825rem 0 0 0;
+    overflow: hidden;
+  }
 
 
-      .cardhead {
-        top: 0.0417rem;
-      }
-    }
+  .card3 {
+    height: 33%;
+    flex: 1;
+    background: url("~@/image/djlxzl.png") no-repeat;
+    background-size: 100% 100%;
+    padding-bottom: 0;
 
 
     .cardhead {
     .cardhead {
-      position: absolute;
+      top: 0.0417rem;
     }
     }
   }
   }
-</style>
+
+  .cardhead {
+    position: absolute;
+  }
+}</style>