样式修改

src/app.scss

@@ -8,3 +8,8 @@ page {
   width: 100%;
   height: 100%;
 }
+
+.at-tabs .at-tabs__item {
+  font-size: 30px;
+  color: #999;
+}

src/app.tsx

@@ -66,6 +66,7 @@ class App extends Component {
     },
     tabBar: {
       selectedColor: '#FF9110',
+      color: '#999',
       list: [
         {
           pagePath: 'pages/home/device/index',

src/conpoments/device_item/index.scss

@@ -26,24 +26,42 @@
     flex: 1;
     display: flex;
     padding-left: 40px;
-    padding-top: 12px;
+    padding-top: 30px;
     flex-direction: column;
 
     .device-item-info-name {
       font-size: 32px;
       color: #333;
       font-weight: bold;
-      margin-bottom: 77px;
+      margin-bottom: 57px;
     }
 
     .device-item-info-state {
       font-size: 26px;
       color: #666;
+      position: relative;
+      padding-left: 25px;
+
+      .dian {
+        display: inline-block;
+        content: '';
+        background: #ccc;
+        position: absolute;
+        height: 18px;
+        left: 0;
+        top: 8px;
+        width: 18px;
+        border-radius: 50%;
+      }
     }
 
     .device-item-info-state-active {
       font-size: 26px;
       color: #5ff054;
+
+      .dian {
+        background: #5ff054;
+      }
     }
   }
 }

src/conpoments/device_item/index.tsx

@@ -30,15 +30,16 @@ class DeviceItem extends Component {
         </View>
         <View className="device-item-info">
           <Text className="device-item-info-name">{equipmentName}</Text>
-          <Text
+          <View
             className={
               equipmentState === 'ONLINE'
                 ? 'device-item-info-state device-item-info-state-active'
                 : 'device-item-info-state '
             }
           >
+            <Text className="dian" />
             {equipmentState === 'ONLINE' ? '在线' : '离线'}
-          </Text>
+          </View>
         </View>
       </View>
     )

src/pages/home/device/index.scss

@@ -9,4 +9,5 @@
 
 .at-tabs__item--active {
   color: #ff9110 !important;
+  font-size: 38px !important;
 }

src/pages/home/tempaltes/scss/temp-type.scss

@@ -6,7 +6,6 @@
   position: relative;
   flex-direction: column;
   background-color: white;
-  padding-top: 34px;
 
   &-scroll {
     flex: 1;
@@ -22,6 +21,7 @@
     padding: 20px;
 
     &-title {
+      padding-top: 54px;
       font-size: 38px;
       color: #000;
     }
@@ -40,6 +40,10 @@
       color: #666;
       border: none;
       line-height: 56px;
+
+      &::after {
+        display: none;
+      }
     }
 
     &-list {

src/pages/home/tempaltes/scss/type_detail.scss

@@ -28,6 +28,11 @@
         box-shadow: none;
         // box-shadow: 0 7px 12px 0 rgba(159, 87, 2, 0.17);
         border-radius: 3px;
+
+        &::after {
+          display: none;
+        }
+
         color: #666;
         border: none;
         line-height: 56px;
@@ -51,7 +56,7 @@
 
     &-item {
       display: inline-block;
-      margin-right: 20px;
+      // margin-right: 20px;
       font-size: 30px !important;
       background: transparent;
       color: #999;

src/pages/home/tempaltes/template_type_detail.tsx

@@ -229,7 +229,7 @@ class TemplateTypeDetail extends Component {
           <View className="type-list">
             {typeData.map(item => {
               return (
-                <Button
+                <Text
                   size="mini"
                   className={
                     item.typeName === templateShow
@@ -243,7 +243,7 @@ class TemplateTypeDetail extends Component {
                   }}
                 >
                   {SHOWTYPE[item.typeName]}
-                </Button>
+                </Text>
               )
             })}
           </View>