From e32af94f41a414960454d3bf39c1e27674fbede5 Mon Sep 17 00:00:00 2001
From: hanbaoshan <hanbaoshan@aiotlink.com>
Date: 星期四, 21 一月 2021 19:55:36 +0800
Subject: [PATCH] shuohuang首页tab2静态页完善,页面优化

---
 src/assets/css/common.scss |  777 ++++++++++++++++++++++++++++++++++++++++++++--------------
 1 files changed, 583 insertions(+), 194 deletions(-)

diff --git a/src/assets/css/common.scss b/src/assets/css/common.scss
index 1de9cbf..da30024 100644
--- a/src/assets/css/common.scss
+++ b/src/assets/css/common.scss
@@ -1,208 +1,569 @@
-
 /*瀹氫綅*/
-.tl{text-align: left;}
-.tc{text-align: center;}
-.tr{text-align: right;}
-.bc{margin-left: auto;margin-right: auto;}
-.fl{float: left; display:inline;}
-.fr{float: right; display:inline;}
-.cb{clear:both;}
-.cl{clear: left;}
-.cr{clear: right;}
+.tl {
+  text-align: left;
+}
+.tc {
+  text-align: center;
+}
+.tr {
+  text-align: right;
+}
+.bc {
+  margin-left: auto;
+  margin-right: auto;
+}
+.fl {
+  float: left;
+  display: inline;
+}
+.fr {
+  float: right;
+  display: inline;
+}
+.cb {
+  clear: both;
+}
+.cl {
+  clear: left;
+}
+.cr {
+  clear: right;
+}
 
+/*鏂囧瓧鎺掔増*/
+.f12 {
+  font-size: 12px;
+}
+.f13 {
+  font-size: 13px;
+}
+.f14 {
+  font-size: 14px;
+}
+.f16 {
+  font-size: 16px;
+}
+.f18 {
+  font-size: 18px;
+}
+.f20 {
+  font-size: 20px;
+}
+.f22 {
+  font-size: 23px;
+}
+.f25 {
+  font-size: 25px;
+}
+.f30 {
+  font-size: 30px;
+}
+.f35 {
+  font-size: 35px;
+}
+.f40 {
+  font-size: 40px;
+}
+.f45 {
+  font-size: 45px;
+}
+.f50 {
+  font-size: 50px;
+}
+.f55 {
+  font-size: 55px;
+}
+.f60 {
+  font-size: 60px;
+}
+.f65 {
+  font-size: 65px;
+}
+.fb {
+  font-weight: bold;
+}
+.fn {
+  font-weight: normal;
+}
+.t2 {
+  text-indent: 2em;
+}
+.lh150 {
+  line-height: 150%;
+}
+.lh180 {
+  line-height: 180%;
+}
+.lh200 {
+  line-height: 200%;
+}
+.unl {
+  text-decoration: underline;
+}
+.no_unl {
+  text-decoration: none;
+}
 
- /*鏂囧瓧鎺掔増*/
- .f12{font-size: 12px;}
- .f13{font-size: 13px;}
- .f14{font-size: 14px;}
- .f16{font-size: 16px;}
- .f18{font-size: 18px;}
- .f20{font-size: 20px;}
- .f22{font-size: 23px;}
- .f25{font-size: 25px;}
- .f30{font-size: 30px;}
- .f35{font-size: 35px;}
- .f40{font-size: 40px;}
- .f45{font-size: 45px;}
- .f50{font-size: 50px;}
- .f55{font-size: 55px;}
- .f60{font-size: 60px;}
- .f65{font-size: 65px;}
- .fb{font-weight: bold;}
- .fn{font-weight: normal;}
- .t2{text-indent: 2em;}
- .lh150{line-height:150%;}
- .lh180{line-height:180%;}
- .lh200{line-height:200%;}
- .unl{text-decoration: underline;}
- .no_unl{text-decoration: none;}
+.clearfix:after {
+  display: block;
+  content: '';
+  clear: both;
+}
+.clearfix {
+  zoom: 1;
+}
+.vm {
+  vertical-align: middle;
+}
 
-
-.clearfix:after{ display:block; content:''; clear:both;}
-.clearfix{ zoom:1;}
-.vm{vertical-align: middle;}
-
-.pr{position: relative;}
-.pa{position: absolute;}
-.pa100{position: absolute;left: 0;top: 0;right: 0;bottom: 0;}
-.zoom{zoom:1;}
-.hidden{visibility: hidden;}
-.none{display: none}
+.pr {
+  position: relative;
+}
+.pa {
+  position: absolute;
+}
+.pa100 {
+  position: absolute;
+  left: 0;
+  top: 0;
+  right: 0;
+  bottom: 0;
+}
+.zoom {
+  zoom: 1;
+}
+.hidden {
+  visibility: hidden;
+}
+.none {
+  display: none;
+}
 /*闀垮害楂樺害*/
-.w10{width: 10px;}
-.w20{width: 20px;}
-.w30{width: 30px;}
-.w40{width: 40px;}
-.w50{width: 50px;}
-.w70{width: 70px;}
-.w90{width: 90px;}
-.w100{width: 100px;}
-.w300{width: 300px;}
-.w500{width: 500px;}
-.w600{width: 600px;}
-.w700{width: 700px;}
-.w800{width: 800px;}
-.w{width: 100%;}
-.h50{height: 50px;}
-.h100{height: 100px;}
-.h200{height: 200px;}
-.h{height: 100%;}
+.w10 {
+  width: 10px;
+}
+.w20 {
+  width: 20px;
+}
+.w30 {
+  width: 30px;
+}
+.w40 {
+  width: 40px;
+}
+.w50 {
+  width: 50px;
+}
+.w70 {
+  width: 70px;
+}
+.w90 {
+  width: 90px;
+}
+.w100 {
+  width: 100px;
+}
+.w300 {
+  width: 300px;
+}
+.w500 {
+  width: 500px;
+}
+.w600 {
+  width: 600px;
+}
+.w700 {
+  width: 700px;
+}
+.w800 {
+  width: 800px;
+}
+.w {
+  width: 100%;
+}
+.h50 {
+  height: 50px;
+}
+.h100 {
+  height: 100px;
+}
+.h200 {
+  height: 200px;
+}
+.h {
+  height: 100%;
+}
 
 /*缂栧墽*/
-.ma{margin: auto;}
-.m10{margin:10px;}
-.m15{margin:15px;}
-.m30{margin:30px;}
-.mt5{margin-top:5px;}
-.mt10{margin-top:10px;}
-.mt15{margin-top:15px;}
-.mt20{margin-top:20px;}
-.mt30{margin-top:30px;}
-.mt50{margin-top:50px;}
-.mt100{margin-top:100px;}
-.mb5{margin-bottom: 5px;}
-.mb10{margin-bottom: 10px;}
-.mb15{margin-bottom: 15px;}
-.mb20{margin-bottom: 20px;}
-.mb30{margin-bottom: 30px;}
-.mb50{margin-bottom: 50px;}
-.mb100{margin-bottom: 100px;}
-.ml5{margin-left: 5px;}
-.ml10{margin-left: 10px;}
-.ml15{margin-left: 15px;}
-.ml20{margin-left: 20px;}
-.ml30{margin-left: 30px;}
-.ml50{margin-left: 50px;}
-.ml100{margin-left: 100px;}
-.mr5{margin-right: 5px;}
-.mr10{margin-right:10px;}
-.mr15{margin-right: 15px;}
-.mr20{margin-right: 20px;}
-.mr30{margin-right: 30px;}
-.mr50{margin-right: 50px;}
-.mr100{margin-right: 100px;}
-.p5{padding: 5px;}
-.p10{padding:10px;}
-.p15{padding: 15px;}
-.p20{padding: 20px;}
-.p30{padding: 30px;}
-.p50{padding: 50px;}
-.p100{padding: 100px;}
-.pt5{padding-top: 5px;}
-.pt10{padding-top:10px;}
-.pt15{padding-top: 15px;}
-.pt20{padding-top: 20px;}
-.pt30{padding-top: 30px;}
-.pt50{padding-top: 50px;}
-.pt100{padding-top: 100px;}
-.pb5{padding-bottom: 5px;}
-.pb10{padding-bottom:10px;}
-.pb15{padding-bottom: 15px;}
-.pb20{padding-bottom: 20px;}
-.pb30{padding-bottom: 30px;}
-.pb50{padding-bottom: 50px;}
-.pb100{padding-bottom: 100px;}
-.pl5{padding-left: 5px;}
-.pl10{padding-left:10px;}
-.pl15{padding-left: 15px;}
-.pl20{padding-left: 20px;}
-.pl30{padding-left: 30px;}
-.pl50{padding-left: 50px;}
-.pl60{padding-left: 60px;}
-.pl100{padding-left: 100px;}
-.pr5{padding-right: 5px;}
-.pr10{padding-right:10px;}
-.pr15{padding-right: 15px;}
-.pr20{padding-right: 20px;}
-.pr30{padding-right: 30px;}
-.pr50{padding-right: 50px;}
-.pr100{padding-right: 100px;}
-.pl-checkbox{padding-left:44px;}
-.pd10{padding:10px;}
-.pd20{padding:20px;}
-
-.mg10{margin:10px;}
-.mg20{margin:20px;}
-.mg30{margin:30px;}
-.p0m0{padding:0; margin: 0;}
-.cursor-pointer{cursor: pointer;}
-.dis-inleblock{ display: inline-block; }
-.dis-inline{ display: inline; }
-.dis-block{ display: block; }
-.text-overflow{
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
+.ma {
+  margin: auto;
 }
-.overflow-y{overflow-y: auto;overflow-x:hidden;}
-.overflow-x{overflow-x: auto;overflow-y:hidden;}
-.overflow-auto{overflow: auto;}
-.overflow-hidden{overflow:hidden;}
-
-.text-center{text-align: center;}
-.text-left{text-align: left;}
-.text-right{text-align: right;}
-
-.vertical-top{vertical-align: top;}
-.vertical-middle{vertical-align: middle;}
-.vertical-bottom{vertical-align: bottom;}
-.border-box{box-sizing: border-box;}
-.flex-center{
-    display:flex;
-    align-items:center;
-    justify-content:center;
+.m10 {
+  margin: 10px;
 }
-.width100{width: 100%;}
-.width50{width: 50%;}
-.width60{width: 60%;}
-.width70{width: 70%;}
+.m15 {
+  margin: 15px;
+}
+.m30 {
+  margin: 30px;
+}
+.mt5 {
+  margin-top: 5px;
+}
+.mt10 {
+  margin-top: 10px;
+}
+.mt15 {
+  margin-top: 15px;
+}
+.mt20 {
+  margin-top: 20px;
+}
+.mt30 {
+  margin-top: 30px;
+}
+.mt50 {
+  margin-top: 50px;
+}
+.mt100 {
+  margin-top: 100px;
+}
+.mb5 {
+  margin-bottom: 5px;
+}
+.mb10 {
+  margin-bottom: 10px;
+}
+.mb15 {
+  margin-bottom: 15px;
+}
+.mb20 {
+  margin-bottom: 20px;
+}
+.mb30 {
+  margin-bottom: 30px;
+}
+.mb50 {
+  margin-bottom: 50px;
+}
+.mb100 {
+  margin-bottom: 100px;
+}
+.ml5 {
+  margin-left: 5px;
+}
+.ml10 {
+  margin-left: 10px;
+}
+.ml15 {
+  margin-left: 15px;
+}
+.ml20 {
+  margin-left: 20px;
+}
+.ml30 {
+  margin-left: 30px;
+}
+.ml50 {
+  margin-left: 50px;
+}
+.ml100 {
+  margin-left: 100px;
+}
+.mr5 {
+  margin-right: 5px;
+}
+.mr10 {
+  margin-right: 10px;
+}
+.mr15 {
+  margin-right: 15px;
+}
+.mr20 {
+  margin-right: 20px;
+}
+.mr30 {
+  margin-right: 30px;
+}
+.mr50 {
+  margin-right: 50px;
+}
+.mr100 {
+  margin-right: 100px;
+}
+.p5 {
+  padding: 5px;
+}
+.p10 {
+  padding: 10px;
+}
+.p15 {
+  padding: 15px;
+}
+.p20 {
+  padding: 20px;
+}
+.p30 {
+  padding: 30px;
+}
+.p50 {
+  padding: 50px;
+}
+.p100 {
+  padding: 100px;
+}
+.pt5 {
+  padding-top: 5px;
+}
+.pt10 {
+  padding-top: 10px;
+}
+.pt15 {
+  padding-top: 15px;
+}
+.pt20 {
+  padding-top: 20px;
+}
+.pt30 {
+  padding-top: 30px;
+}
+.pt50 {
+  padding-top: 50px;
+}
+.pt100 {
+  padding-top: 100px;
+}
+.pb5 {
+  padding-bottom: 5px;
+}
+.pb10 {
+  padding-bottom: 10px;
+}
+.pb15 {
+  padding-bottom: 15px;
+}
+.pb20 {
+  padding-bottom: 20px;
+}
+.pb30 {
+  padding-bottom: 30px;
+}
+.pb50 {
+  padding-bottom: 50px;
+}
+.pb100 {
+  padding-bottom: 100px;
+}
+.pl5 {
+  padding-left: 5px;
+}
+.pl10 {
+  padding-left: 10px;
+}
+.pl15 {
+  padding-left: 15px;
+}
+.pl20 {
+  padding-left: 20px;
+}
+.pl30 {
+  padding-left: 30px;
+}
+.pl50 {
+  padding-left: 50px;
+}
+.pl60 {
+  padding-left: 60px;
+}
+.pl100 {
+  padding-left: 100px;
+}
+.pr5 {
+  padding-right: 5px;
+}
+.pr10 {
+  padding-right: 10px;
+}
+.pr15 {
+  padding-right: 15px;
+}
+.pr20 {
+  padding-right: 20px;
+}
+.pr30 {
+  padding-right: 30px;
+}
+.pr50 {
+  padding-right: 50px;
+}
+.pr100 {
+  padding-right: 100px;
+}
+.pl-checkbox {
+  padding-left: 44px;
+}
+.pd10 {
+  padding: 10px;
+}
+.pd20 {
+  padding: 20px;
+}
 
-.height100{height: 100%}
-.height40{height: 40%}
-.height50{height: 50%}
-.height60{height: 60%}
-.height70{height: 70%}
-.height80{height: 80%}
+.mg10 {
+  margin: 10px;
+}
+.mg20 {
+  margin: 20px;
+}
+.mg30 {
+  margin: 30px;
+}
+.p0m0 {
+  padding: 0;
+  margin: 0;
+}
+.cursor-pointer {
+  cursor: pointer;
+}
+.dis-inleblock {
+  display: inline-block;
+}
+.dis-inline {
+  display: inline;
+}
+.dis-block {
+  display: block;
+}
+.text-overflow {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.overflow-y {
+  overflow-y: auto;
+  overflow-x: hidden;
+}
+.overflow-x {
+  overflow-x: auto;
+  overflow-y: hidden;
+}
+.overflow-auto {
+  overflow: auto;
+}
+.overflow-hidden {
+  overflow: hidden;
+}
 
-.height50-10{height: calc(50% - 10px);}
-.height40-10{height: calc(40% - 10px);}
-.height30-10{height: calc(30% - 10px);}
-.height100-10{height: calc(100% - 10px);}
-.height100-20{height: calc(100% - 20px);}
-.height100-25{height: calc(100% - 25px);}
-.height100-30{height: calc(100% - 30px);}
-.height100-40{height: calc(100% - 40px);}
-.height100-45{height: calc(100% - 45px);}
-.height100-50{height: calc(100% - 50px);}
-.height100-55{height: calc(100% - 55px);}
-.height100-60{height: calc(100% - 60px);}
-.height100-65{height: calc(100% - 65px);}
-.height100-70{height: calc(100% - 70px);}
+.text-center {
+  text-align: center;
+}
+.text-left {
+  text-align: left;
+}
+.text-right {
+  text-align: right;
+}
+
+.vertical-top {
+  vertical-align: top;
+}
+.vertical-middle {
+  vertical-align: middle;
+}
+.vertical-bottom {
+  vertical-align: bottom;
+}
+.border-box {
+  box-sizing: border-box;
+}
+.flex-center {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.width100 {
+  width: 100%;
+}
+.width50 {
+  width: 50%;
+}
+.width60 {
+  width: 60%;
+}
+.width70 {
+  width: 70%;
+}
+
+.height100 {
+  height: 100%;
+}
+.height40 {
+  height: 40%;
+}
+.height50 {
+  height: 50%;
+}
+.height60 {
+  height: 60%;
+}
+.height70 {
+  height: 70%;
+}
+.height80 {
+  height: 80%;
+}
+
+.height50-10 {
+  height: calc(50% - 10px);
+}
+.height40-10 {
+  height: calc(40% - 10px);
+}
+.height30-10 {
+  height: calc(30% - 10px);
+}
+.height100-10 {
+  height: calc(100% - 10px);
+}
+.height100-20 {
+  height: calc(100% - 20px);
+}
+.height100-25 {
+  height: calc(100% - 25px);
+}
+.height100-30 {
+  height: calc(100% - 30px);
+}
+.height100-40 {
+  height: calc(100% - 40px);
+}
+.height100-45 {
+  height: calc(100% - 45px);
+}
+.height100-50 {
+  height: calc(100% - 50px);
+}
+.height100-55 {
+  height: calc(100% - 55px);
+}
+.height100-60 {
+  height: calc(100% - 60px);
+}
+.height100-65 {
+  height: calc(100% - 65px);
+}
+.height100-70 {
+  height: calc(100% - 70px);
+}
 .height100-75 {
   height: calc(100% - 75px);
 }
-.height100-80{height: calc(100% - 80px);}
-.height100-85{height: calc(100% - 85px);}
+.height100-80 {
+  height: calc(100% - 80px);
+}
+.height100-85 {
+  height: calc(100% - 85px);
+}
 .height100-90 {
   height: calc(100% - 90px);
 }
@@ -212,17 +573,19 @@
 .height100-100 {
   height: calc(100% - 100px);
 }
-.height100-120{height: calc(100% - 120px);}
+.height100-120 {
+  height: calc(100% - 120px);
+}
 .is-always-shadow {
   -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
   box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
 }
 
-.bg-card-blue{
+.bg-card-blue {
   background: #f4fcff;
 }
 
-.radius-circle{
+.radius-circle {
   border-radius: 50%;
   overflow: hidden;
 }
@@ -330,3 +693,29 @@
 //   border-color: #3d68e1;
 //   background-color: #3d68e1;
 // }
+.table-area {
+  .el-table {
+    border: 1px solid #ddd !important;
+    thead {
+      color: #111 !important;
+      th {
+        background: #f4f4f4;
+      }
+    }
+    // thead th {
+    //   padding: 8px 0;
+    //   font-family: PingFangSC-Regular, PingFang SC;
+    // }
+    .cell {
+      padding-left: 30px;
+    }
+
+    .operation {
+      span {
+        font-size: 14px;
+        color: #1a99ff;
+        padding-right: 10px;
+      }
+    }
+  }
+}

--
Gitblit v1.8.0