[update] 设备管理

src/assets/less/common.less

@@ -1,4 +1,7 @@
 @import "./modifyLessVars.less";
+@custom-cyan: #2EE4FD;
+@custom-red: #FF5353;
+
 /*列表上方操作按钮区域*/
 .ant-card-body .table-operator {
   //margin-bottom: 8px;
@@ -106,6 +109,21 @@
   border-radius: 0;
 }
 .ant-table td { white-space: nowrap; }
+// 表头边框错位
+.ant-table.ant-table-fixed-header .ant-table-scroll .ant-table-header {
+  margin-right: -11px;
+}
+// 表头字体
+.ant-table .ant-table-thead tr > th {
+  font-family: Alimama ShuHeiTi, Alimama ShuHeiTi, sans-serif;
+  font-weight: bold;
+  font-size: 14px;
+  line-height: 20px;
+}
+.ant-table.ant-table-bordered.ant-table-fixed-header .ant-table-scroll .ant-table-header.ant-table-hide-scrollbar .ant-table-thead > tr:only-child > th:last-child {
+  border-right-color: @primary-color;
+  border-radius: 0;
+}
 /* 表格样式end */
 
 /* 复选框begin */
@@ -200,28 +218,61 @@
 .ant-input,
 .ant-select-selection
 {
-  background: url("~@assets/images/componentImg/input.png") no-repeat center center !important;
-  background-size: 110% calc(@btn-height-base + 2px) !important;
+  //background: url("~@assets/images/componentImg/input.png") no-repeat center center !important;
+  //background-size: 110% calc(100% + 4px) !important;
+  background: linear-gradient(to bottom, rgba(0, 89, 153, 0) 0%, rgba(0, 148, 255, 0.2) 100%) !important;
 }
-// 搜索按钮
-.search-btn {
-  border: none !important;
-  width: 88px !important;
-  background: url("~@assets/images/componentImg/btn.png") no-repeat center center !important;
-  background-size: 100% @btn-height-base !important;
-  font-size: 0;
+// 按钮样式
+.custom-btns-box {
+
+  .btn-icon {
+    margin-right: 3px;
+    margin-bottom: 3px;
+    width: 14px;
+  }
+  .btn-text {
+    font-family: PingFang SC, PingFang SC, sans-serif;
+    font-weight: 500;
+    font-size: 14px;
+    color: #FFFFFF;
+    line-height: 16px;
+  }
+  // 蓝色按钮
+  .btn-blue {
+    background: url("~@assets/images/componentImg/btn-blue.png") no-repeat center center !important;
+  }
+  // 青色按钮
+  .btn-cyan {
+    background: url("~@assets/images/componentImg/btn-cyan.png") no-repeat center center !important;
+  }
+  // 按钮公共样式
+  .btn-blue,
+  .btn-cyan {
+    border: none !important;
+    width: 88px !important;
+    background-size: 100% @btn-height-base !important;
+  }
 }
-.search-btn-icon {
-  margin-right: 3px;
-  margin-bottom: 3px;
-  width: 14px;
+
+.ant-btn.primary-btn,
+.ant-btn.primary-btn:hover,
+.ant-btn.primary-btn:focus {
+  width: 88px;
+  height: 32px;
+  background: linear-gradient( 180deg, rgba(0,148,255,0) 0%, rgba(0,148,255,0.6) 100%);
+  border-radius: 2px 2px 2px 2px;
+  border: 1px solid #0094FF;
+  color: @text-color;
 }
-.search-btn-text {
-  font-family: PingFang SC, PingFang SC, sans-serif;
-  font-weight: 500;
-  font-size: 14px;
-  color: #FFFFFF;
-  line-height: 16px;
+.ant-btn.danger-btn,
+.ant-btn.danger-btn:hover,
+.ant-btn.danger-btn:focus {
+  width: 88px;
+  height: 32px;
+  background: linear-gradient( 0deg, rgba(255,83,83,0.6) 00%, rgba(255,83,83,0) 100%);
+  border-radius: 2px 2px 2px 2px;
+  border: 1px solid #FF5353;
+  color: @text-color;
 }
 /* 部分组件end */
 
@@ -301,23 +352,92 @@
   background-color: #FF5353;
 }
 
-.ant-btn.primary-btn,
-.ant-btn.primary-btn:hover,
-.ant-btn.primary-btn:focus {
-  width: 88px;
-  height: 32px;
-  background: linear-gradient( 180deg, rgba(0,148,255,0) 0%, rgba(0,148,255,0.6) 100%);
-  border-radius: 2px 2px 2px 2px;
-  border: 1px solid #0094FF;
-  color: @text-color;
+// 特殊大数字
+.big-number {
+  font-family: Audiowide, Audiowide, sans-serif;
+  font-weight: 400;
+  font-size: 24px;
+  line-height: 32px;
+  margin-right: 8px;
+  background: linear-gradient(90deg, #FFFFFF 0%, #96D0F9 100%);
+  -webkit-background-clip: text;
 }
-.ant-btn.danger-btn,
-.ant-btn.danger-btn:hover,
-.ant-btn.danger-btn:focus {
-  width: 88px;
-  height: 32px;
-  background: linear-gradient( 0deg, rgba(255,83,83,0.6) 00%, rgba(255,83,83,0) 100%);
-  border-radius: 2px 2px 2px 2px;
-  border: 1px solid #FF5353;
+
+// 标题加渐变背景
+.title-background {
+  margin-bottom: 14px;
+  font-family: DingTalk JinBuTi, DingTalk JinBuTi, sans-serif;
+  font-weight: 400;
+  font-size: 15px;
   color: @text-color;
+  line-height: 18px;
+  display: inline-block;
+  position: relative;
+
+  &::before {
+    content: '';
+    display: block;
+    position: absolute;
+    top: 6px;
+    left: 0;
+    width: 100%;
+    height: 16px;
+    background: linear-gradient( 90deg, rgba(0,116,202,0.1) 0%, #0074CA 50%, rgba(0,116,202,0) 100%);
+  }
+
+  .title-background-text {
+    padding: 0 4px;
+    position: relative;
+    height: 22px;
+  }
+}
+
+// 青色
+.text-cyan { color: @custom-cyan; }
+
+// 红色
+.text-red { color: @custom-red; }
+
+/* a标签按钮样式 */
+.operation-btns {
+  .primary,
+  .primary:hover {
+    color: @custom-cyan;
+  }
+  .danger,
+  .danger:hover {
+    color: @custom-red
+  }
+  & > a:not(:last-child) {
+    margin-right: 10px;
+  }
+}
+
+/* 表单begin */
+.custom-vertical-form {
+  .ant-form-item-label {
+    line-height: 22px;
+    margin-bottom: 4px;
+  }
+  .ant-form-item {
+    margin-bottom: 18px;
+  }
+  .ant-form-item-label > label::after {
+    display: none;
+  }
+}
+/* 表单end */
+
+// flex居中
+.flex-center {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+// flex纵向
+.flex-column-between {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
 }

src/assets/less/modifyLessVars.js

@@ -23,5 +23,8 @@ module.exports = {
 
   // 高度调整
   'btn-height-base': '36px',
-  'input-height-base': '36px'
+  'input-height-base': '36px',
+
+  // 其他
+  'red-6': '#FF5353'
 }

src/assets/less/modifyLessVars.less

@@ -23,4 +23,7 @@
 
 /* 按钮 */
 @btn-height-base: 36px;
-@input-height-base: 36px;
+@input-height-base: 36px;
+
+/* 其他 */
+@red-6: #FF5353;