commit

features/DirectConnect/src/main/ets/components/DirectConnect.ets

-
 @Extend(Button) function CommonButtonStyle() {
   .borderWidth(2)
   .borderColor('#0fa983')
@@ -7,17 +6,16 @@
   .borderRadius(10)
   .type(ButtonType.Normal)
   .height(30)
-  .margin({ left: 10,right: 10 })
+  .margin({ left: 10, right: 10 })
   .stateEffect(true)
 }
 
 @Entry
 @Component
 export struct DirectConnect {
-  @State message: string = 'DirectConnect'
-
   @Builder renderTop() {
     Column() {
+      Flex({ alignItems: ItemAlign.Start, direction: FlexDirection.Column }) {
         Row() {
           Divider()
             .vertical(true)
@@ -29,20 +27,22 @@ export struct DirectConnect {
           Text("扫描信息")
             .fontWeight(FontWeight.Medium)
             .fontSize(14)
-      }
+        }.padding({ top: 8, bottom: 8 })
 
         Row() {
-        Text("连接状态：").fontSize(20)
-        Text("未连接").fontColor("#22b08d").fontSize(21)
-      }.padding({ top: 8, bottom: 8 })
+          Text("连接状态：").fontSize(18)
+          Text("未连接").fontColor("#22b08d").fontSize(19)
+        }.padding({ top: 8, bottom: 8 }).margin({ left: 20 })
 
         Row() {
-        Text("扫描信息：").fontSize(18)
-        Text("请扫描二维码").fontSize(19)
-      }.padding({ top: 8, bottom: 8 })
+          Text("扫描信息：").fontSize(16)
+          Text("请扫描二维码").fontSize(18)
+        }.padding({ top: 8, bottom: 8 }).margin({ left: 20 })
+      }
     }
     .backgroundColor("#fff")
-    .height("20%")
+    .alignItems(HorizontalAlign.Start)
+    .height("15%")
     .width("100%")
     .margin({ top: 25 })
     .borderRadius(15)
@@ -73,8 +73,13 @@ export struct DirectConnect {
           }
         }
       }.margin({ top: 12 })
+
+      Column(){
+        Image($r("app.media.empty")).width('50%')
+        Text("暂无历史扫描信息").fontSize(20)
+      }.margin({top:100})
     }
-    .height("70%")
+    .height("75%")
     .width("100%")
     .backgroundColor("#fff")
     .margin({ top: 25 })
@@ -84,10 +89,11 @@ export struct DirectConnect {
   build() {
     Column() {
       this.renderTop()
+
       this.renderBottom()
-      // BasicTable()
 
-    }.padding({ left: 20, right: 20 }).width("100%").height("100%").linearGradient({
+
+    }.padding({ left: 20, right: 20 }).height("100%").linearGradient({
       direction: GradientDirection.RightBottom,
       repeating: true,
       colors: [[0x36a3c0, 0.0], [0x97c6a6, 1.0], [0xc7d799, 2.0]]