css

src/pages/modules/home_960/left.vue

@@ -89,7 +89,7 @@
         <p class="txt">A<br>G<br>V<br>过<br>道</p>
       </div>
       <div class="hwpl_wrap_2">
-        <div class="zd-row allHeight flexWrap rowReverse">
+        <div class="zd-row allHeight flexWrap">
           <div class="hw_item hw_item_2" v-for="e in point1" :key="e.point_code" :class="{'hw_item_active': e.point_status === '2'}">
             <div class="hw_item_i">
               <p class="zd-row jcflexcenter hw_p1">{{ e.point_code }}</p>

src/pages/modules/home_960/right.vue

@@ -70,7 +70,7 @@ export default {
     defaultOption1 () {
       return {
         step: 0.3, // 数值越大速度滚动越快
-        limitMoveNum: 3, // 开始无缝滚动的数据量 this.dataList.length
+        limitMoveNum: 7, // 开始无缝滚动的数据量 this.dataList.length
         hoverStop: true, // 是否开启鼠标悬停stop
         direction: 1, // 0向下 1向上 2向左 3向右
         openWatch: true, // 开启数据实时监控刷新dom
@@ -150,7 +150,7 @@ export default {
       })
       let option = {
         grid: {
-          top: 24,
+          top: 20,
           left: 0,
           right: 0,
           bottom: 0,
@@ -162,13 +162,13 @@ export default {
           right: '0',
           textStyle: {
             color: '#9BB9DD',
-            fontSize: 12,
+            fontSize: 8,
             lineHeight: 20,
             padding: [0, 2]
           },
-          itemGap: 20,
+          itemGap: 12,
-          itemWidth: 12,
+          itemWidth: 8,
-          itemHeight: 12,
+          itemHeight: 8,
           data: [{name: '入库', itemStyle: {color: '#67D470'}}, {name: '出库', itemStyle: {color: '#1980EA'}}]
         },
         xAxis: {
@@ -186,8 +186,8 @@ export default {
           axisLabel: {
             interval: 0,
             color: '#7591B2',
-            fontSize: 12,
+            fontSize: 8,
-            lineHeight: 12,
+            lineHeight: 8,
             fontFamily: 'SourceHanSansCN-Regular',
             margin: 5
           },
@@ -204,7 +204,7 @@ export default {
           },
           axisLabel: {
             color: '#B5C5D4',
-            fontSize: 12,
+            fontSize: 8,
             fontFamily: 'SourceHanSansCN-Regular'
           },
           splitLine: {

src/pages/modules/home_960/style.stylus

@@ -4,7 +4,7 @@
   width 100%
   height 100%
   // background center / 100% 100% url('../../../images/bg.jpg') no-repeat
-  padding-top 60px
+  padding-top 55px
   overflow hidden
 .header
   position absolute
@@ -41,12 +41,12 @@ h1
   width 98%
   height 100%
   margin 0 auto
-  padding-bottom 2%
+  padding-bottom 6px
 .l-wrap
-  width 64%
+  width 71%
   height 100%
 .r-wrap
-  width 34.5%
+  width 28%
   height 100%
 .zd-col-8
   width 35%
@@ -55,8 +55,11 @@ h1
   background-color #08225f
   border 1px solid #43b3fa
   // background center / 100% 100% url('../../../images/bg-center.png') no-repeat
-  padding 2.2% 0 2.2% 2.2%
+  padding 8px 0 8px 8px
 .hwpl_wrap_1
+  display flex
+  flex-direction: column
+  justify-content: space-between
   width calc(43.9% - 20px)
   height 100%
 .hwpl_wrap_2
@@ -69,26 +72,26 @@ h1
   width 20px
   height 100%
 .state_wrap
-  margin-bottom 10px
+  // margin-bottom 10px
 .state_icon
-  _wh(10px, 10px)
+  _wh(8px, 8px)
 .state_title
-  _font(12px, 12px, #fff,,)
+  _font(9px, 12px, #fff,,)
-  margin 0 20px 0 5px
+  margin 0 10px 0 3px
 .bg_col_1
-  border-radius 4px
+  // border-radius 4px
   // box-shadow 0px 0px 12px 4px rgba(239, 82, 82, .5)
   border 1px solid #B55F4E
   // background radial-gradient(circle at 50% 100%, rgba(251, 135, 105, 80%), #77200F, #58190E);
   background-color #77200F
 .bg_col_2
-  border-radius 4px
+  // border-radius 4px
   // box-shadow 0px 0px 12px 4px rgba(142, 181, 229, .5)
   border 1px solid rgba(42, 189, 251, 50%)
   // background radial-gradient(circle at 50% 100%, rgba(95, 217, 252, 50%), rgba(14, 82, 140, 50%), rgba(10, 54, 106, 50%));
   background-color rgba(14, 82, 140, 50%)
 .pie_num_wrap
-  margin-bottom 10px
+  // margin-bottom 10px
 .pie_wrap
   width 50px
 .pie_item
@@ -104,7 +107,7 @@ h1
     white-space: nowrap;
     padding-top: 22px;
 .pie_name
-  _font(10px, 20px, #fff,,center)
+  _font(9px, 20px, #fff,,center)
   // transform: scale(0.5);
 .num_wrap
   width 100%
@@ -125,17 +128,17 @@ h1
   // transform: scale(0.5);
   white-space: nowrap;
 .hwpl_wrap_i
-  _wh(100%, calc(100% - 102px))
+  // _wh(100%, calc(100% - 102px))
 .hw_wrap
   align-content: flex-start;
-  height 23.4%
+  // height 23.4%
-  margin-bottom 5%
+  margin-top 12px
-  &:last-child
+  &:first-child
-    margin-bottom 0
+    margin-top 0
 .hw_item
-  _wh(13.6%, 26.6%)
+  _wh(13.6%, 25px)
   padding 2px
-  margin-bottom 1%
+  margin-top 3px
   border-radius 4px
   //background radial-gradient(circle at 50% 100%, rgba(95, 217, 252, 50%), rgba(14, 82, 140, 50%), rgba(10, 54, 106, 50%));
   background-color rgba(14, 82, 140, 50%)
@@ -144,6 +147,7 @@ h1
 .hw_item_2
   width: 10.5%;
   height: 4.92%;
+  margin-top 0
 .hw_item_i
   _wh(100%, 100%)
   // background-image linear-gradient(to bottom, transparent 11px, rgba(22, 62, 113, 20%) 1px), linear-gradient(to right, transparent 11px, rgba(22, 62, 113, 20%) 1px)
@@ -156,20 +160,20 @@ h1
   .hw_item_i
     // background-image linear-gradient(to bottom, transparent 11px, rgba(118, 36, 23, 20%) 1px), linear-gradient(to right, transparent 11px, rgba(118, 36, 23, 20%) 1px)
 .hw_p1
-  _font(6px, 1,#EFF2FF,,)
+  _font(7px, 1,#EFF2FF,,)
   font-family: "SourceHanSansCN-Bold";
   height 50%
-  text-shadow: 0px 1px 1px #A0D4FF;
+  // text-shadow: 0px 1px 1px #A0D4FF;
   // transform: scale(0.5);
   white-space: nowrap;
 .hw_p2
-  _font(6px, 1, #EFF2FF,,center)
+  _font(7px, 1, #EFF2FF,,center)
   font-family: "SourceHanSansCN-Bold";
   height 50%
   // transform: scale(0.5);
   white-space: nowrap;
 .txt
-  _font(12px, 16px, #fff,,center)
+  _font(9px, 16px, #fff,,center)
   font-family: "YouSheBiaoTiHei"
   // transform: scale(0.8);
 .n_container_r
@@ -184,7 +188,7 @@ h1
   background center / 100% 100% url('../../../images/bg-title_1.png') no-repeat
   padding 0 10px 0 15px
   p
-    font-size 12px
+    font-size 9px
     font-family: 'YouSheBiaoTiHei';
     font-weight: 400;
     color: transparent;
@@ -197,16 +201,16 @@ h1
 .data_wrap
   height calc(100% - 20px)
   background center / 100% 100% url('../../../images/bg-m_1.png') no-repeat
-  padding 10px 12px
+  padding 4px 8px
 .data_wrap_1
   padding 5px 12px 10px 12px
 .scroll_tab
-  _wh(100%, 30px)
+  _wh(100%, 16px)
   background center / 100% 100% url('../../../images/table-bg_1.png') no-repeat
   li
     float left
     width 15%
-    _font(12px,30px,#AFBED8,,center)
+    _font(8px,16px,#AFBED8,,center)
     font-family: 'SourceHanSansCN-Regular';
     font-weight: bold;
     font-style: italic;
@@ -217,20 +221,20 @@ h1
     overflow hidden
     box-sizing border-box
     &:nth-child(1)
-      width 30%
+      width 35%
     &:nth-child(2)
-      width 25%
+      width 20%
 .scroll_tab_1
   li
     &:nth-child(1), &:nth-child(2)
       width 50%
 .scroll_container
   width 100%
-  height calc(100% - 30px)
+  height calc(100% - 16px)
   overflow hidden
 .scroll-ul
   li
-    _wh(100%, 30px)
+    _wh(100%, 16px)
     border-bottom 1px solid rgba(122,159,224,0.17)
     &:nth-child(even)
       background rgba(31,46,73,0.7)
@@ -238,20 +242,20 @@ h1
       background rgba(31,46,73,0.55)
   .scroll-item
     float left
-    _wh(15%, 30px)
+    _wh(15%, 16px)
     _fj(row, center)
-    _font(12px, 12px, #B2BBD7,,center)
+    _font(8px, 8px, #B2BBD7,,center)
     font-family: 'SourceHanSansCN-Regular';
     font-style: italic;
     word-wrap break-word
     word-break break-all
-    // white-space nowrap
+    white-space nowrap
-    padding 0 2px
+    padding 0 1px
     overflow hidden
     &:nth-child(1)
-      width 30%
+      width 35%
     &:nth-child(2)
-      width 25%
+      width 20%
 .scroll-ul_1
   li
     .scroll-item