fix: 优化评判弹窗以及信号展示组件优化

entry/src/main/ets/pages/Index/BottomMessage.ets

@@ -19,7 +19,7 @@ export default struct BottomMessageComponent {
         Text('授权信息：' + (this.hasAuth ? "已授权" : "未授权")).textCommonStyle()
       }.gesture(
         GestureGroup(GestureMode.Exclusive,
-          TapGesture({ count: 5 })
+          TapGesture({ count: 3 })
             .onAction(() => {
               this.versionClick && this.versionClick()
             })

entry/src/main/ets/pages/Judge.ets

@@ -45,6 +45,7 @@ import { GetSyncData } from '../utils/table/Operation';
 import dayTs from '../utils/Date';
 import { CutArray, FormatTimeFlexible, GetCurrentTime } from '../utils/Common';
 import FileUtils from '../utils/FileUtils';
+import SignalTrajectoryDialog from './Judge/SignalTrajectoryDialog';
 
 
 @Entry
@@ -151,6 +152,12 @@ struct Index {
   @State isErrorMsgEnd: boolean = false
   @State disConnectErrorOpen: boolean = false
   public context = getContext(this) as common.UIAbilityContext;
+  // 信号查看弹窗
+  signalTrajectoryDialog: CustomDialogController = new CustomDialogController({
+    builder: SignalTrajectoryDialog(),
+    customStyle: true,
+    autoCancel: true
+  })
   private judge: Judge = new Judge(this)
 
   async aboutToDisappear() {
@@ -939,7 +946,8 @@ struct Index {
               //   type: 1,
               //   name: 'button_media.wav'
               // })
-              this.signDisplayComVisible = true
+              // this.signDisplayComVisible = true
+              this.signalTrajectoryDialog.open()
             })
 
             Row() {

entry/src/main/ets/pages/Judge/SignalTrajectoryDialog.ets

@@ -0,0 +1,15 @@
+import SignalDisplayComponent from '../compontents/SignalDisplay'
+
+@CustomDialog
+export default struct SignalTrajectoryDialog {
+  private controller?: CustomDialogController
+
+  build() {
+    Row() {
+      SignalDisplayComponent()
+    }.width(1200).height(1200).border({
+      width: 1,
+      color: "red"
+    })
+  }
+}

entry/src/main/ets/pages/SignDisplay.ets

@@ -1,11 +1,50 @@
 import SignalDisplayComponent from './compontents/SignalDisplay';
+import router from '@ohos.router';
+import TabComponent from './compontents/Tab';
 
 @Entry
 @Component
-struct Index {
+struct SignDisplayPage {
+  @State active: number = 0
+
   build() {
-    Column() {
+    Flex({
-      SignalDisplayComponent()
+      direction: FlexDirection.Column,
+      alignItems: ItemAlign.Center,
+      justifyContent: FlexAlign.Center
+    }) {
+      // 头部
+      Flex({
+        alignItems: ItemAlign.Center,
+        justifyContent: FlexAlign.SpaceBetween
+      }) {
+        Row() {
+          // 短logo
+          Image($r('app.media.shortLogo')).height(100).width(150).objectFit(ImageFit.Contain).margin({
+            left: 10,
+            right: 10
+          })
+          TabComponent({
+            isShowTrajectory: true,
+            activeIndex: this.active,
+            onchange: (index: number) => {
+              this.active = index
+            }
+          })
+        }
+
+        Row() {
+          //   返回按钮
+          Image($r('app.media.topB_back')).height(100).onClick(() => {
+            router.back()
+          })
+        }
+      }.width("100%").height(100)
+
+      SignalDisplayComponent({
+        active: this.active,
+        isShowTrajectory: true
+      })
     }
     .width('100%')
     .height('100%')

entry/src/main/ets/pages/compontents/SignalDisplay.ets

@@ -1,4 +1,3 @@
-import router from '@ohos.router'
 import { GPSData, InitialPerLane, SignalData } from '../../mock'
 import { EnvironmentConfigurationType, PerLane, RoadDataType, SignalDataType, WorkerBackMessage } from '../../model'
 import apiJudgeSdk from 'libJudgeSdk.so'
@@ -15,15 +14,13 @@ export default struct SignalDisplayComponent {
   // GPS信号
   @State GPSColum: Array<SignalDataType> = GPSData
   // tab选中
-  @State active: number = 0
+  @Prop active: number = 0
   // 原始数据
   @State rawData: string = "$GPS,,,,,,,,,,,,,,,,,,,,,,,,,,,,,"
   // 车道信息
   @State laneSignal: PerLane = InitialPerLane
-  // 是否显示返回
+  // 是否现实轨迹
-  @State isShowBack: boolean = true
+  @State isShowTrajectory: boolean = false
-  onBackPress: () => void = () => {
-  }
 
   aboutToAppear(): void {
     DifferentialAndSignal.onMsg((data: string) => {
@@ -91,41 +88,9 @@ export default struct SignalDisplayComponent {
 
   build() {
     Column() {
-      //   头部
       Flex({
-        alignItems: ItemAlign.Center,
+        direction: FlexDirection.Column,
-        justifyContent: FlexAlign.SpaceBetween
       }) {
-        Row() {
-          // 短logo
-          Image($r('app.media.shortLogo')).height(100).width(150).objectFit(ImageFit.Contain).margin({
-            left: 10,
-            right: 10
-          })
-          TabComponent({
-            activeIndex: this.active,
-            onchange: (index: number) => {
-              this.active = index
-            }
-          })
-        }
-
-        Row() {
-          if (this.isShowBack) {
-            //   返回按钮
-            Image($r('app.media.topB_back')).height(100).onClick(() => {
-              router.back()
-            })
-          } else {
-            Image($rawfile('judge/close.png')).height(100).onClick(() => {
-              this.onBackPress()
-            })
-          }
-
-        }
-      }.width("100%").height(100)
-
-      Column() {
         // 信号查看
         if (this.active === 0) {
           // GPS信号展示
@@ -133,23 +98,20 @@ export default struct SignalDisplayComponent {
             data: this.signArr
           })
           //   车载信号以及车载坐标
-          Column() {
+          CarComponent({
-            CarComponent({
+            data: this.vehicleSignal
-              data: this.vehicleSignal
+          })
-            })
+          CoordinateComponent({
-            CoordinateComponent({
+            data: this.GPSColum
-              data: this.GPSColum
+          })
-            })
+
-          }.margin({
-            top: 5
-          }).backgroundColor("#282828")
         } else if (this.active === 1) {
           // 原始数据
           Column() {
             Text(this.rawData).fontSize(20).fontColor("#fff")
           }.backgroundColor("#282828").width("100%").height("100%")
         } else {
-          if (!this.isShowBack) {
+          if (this.isShowTrajectory) {
             // 轨迹查看
             Flex() {
               Column() {
@@ -241,38 +203,6 @@ struct trajectoryComponent {
   }
 }
 
-@Component
-struct TabComponent {
-  @State activeIndex: number = 0
-  onchange: (index: number) => void = () => {
-  }
-
-  build() {
-    Row() {
-      TabItemComponent({
-        active: this.activeIndex === 0,
-      }).onClick(() => {
-        this.activeIndex = 0
-        this.onchange(0)
-      })
-      TabItemComponent({
-        label: "原始数据",
-        active: this.activeIndex === 1,
-      }).onClick(() => {
-        this.activeIndex = 1
-        this.onchange(1)
-      })
-      TabItemComponent({
-        label: "轨迹查看",
-        active: this.activeIndex === 2,
-      }).onClick(() => {
-        console.log("轨迹查看")
-        this.activeIndex = 2
-        this.onchange(2)
-      })
-    }
-  }
-}
 
 @Component
 struct LaneComponent {
@@ -327,36 +257,6 @@ struct LaneComponent {
   }
 }
 
-@Component
-struct TabItemComponent {
-  @State label: string = "信号查看"
-  @Prop active: boolean = false
-
-  build() {
-    Row() {
-      Text(this.label).fontColor(this.active ? "#ECAD5C" : "#DDCBAC").fontSize(20).fontWeight(FontWeight.Bold)
-    }
-    .width(180)
-    .height(80)
-    .borderRadius({
-      topLeft: 20,
-      topRight: 20,
-    })
-    .border({
-      width: { top: 1, left: 1, right: 1 },
-      color: this.active ? "#ECAD5C" : "#DDCBAC"
-    })
-    .justifyContent(FlexAlign.Center)
-    .alignItems(VerticalAlign.Center)
-    .margin({
-      left: 10
-    })
-    .shadow({
-      radius: 10,
-      color: this.active ? "#ECAD5C" : "",
-    })
-  }
-}
 
 @Component
 struct GPSComponent {
@@ -435,7 +335,7 @@ struct GPSComponent {
         label: "改正数据长度*数据长度-基准站RTCM改正数类型",
         value: this.data[62] || "-"
       })
-    }.backgroundColor("#282828").width("100%")
+    }.backgroundColor("#282828").width("100%").height(140)
   }
 }
 
@@ -453,7 +353,7 @@ struct CarComponent {
           value: item.value
         })
       })
-    }.width("100%")
+    }.width("100%").backgroundColor("#282828").height(490)
   }
 }
 
@@ -464,9 +364,12 @@ struct CoordinateComponent {
   @State heightNum: number = 65
 
   build() {
-    Column() {
+    Flex({
+      direction: FlexDirection.Column,
+      alignItems: ItemAlign.Center
+    }) {
       Text("GPS坐标").fontColor("#FFB433").fontSize(20).margin({
-        top: 20
+        top: 10
       })
       Flex({
         wrap: FlexWrap.Wrap,
@@ -480,12 +383,11 @@ struct CoordinateComponent {
             value: item.value
           })
         })
-      }.height("100%").width("100%")
+      }.width("100%")
     }
     .width("100%")
-    .height("100%")
+    .height(this.isItHorizontal ? 210 : "100%")
     .backgroundColor("#1A1A1A")
-    .justifyContent(FlexAlign.Center)
   }
 }
 
@@ -494,13 +396,13 @@ struct blockComponent {
   @State label: string = "发送次数"
   @Prop value: string = "1"
   @State widthNum: number = 130
-  @State heightNum: number = 65
+  @State heightNum: number = 70
   @State color: string = "#FDF5E7"
 
   build() {
     Row() {
       Row() {
-        Text(this.label + ":").fontColor(this.color)
+        Text(this.label + ":").fontColor(this.color).fontSize(14)
       }.width(this.widthNum).justifyContent(FlexAlign.End)
 
       Row() {
@@ -508,6 +410,9 @@ struct blockComponent {
       }.width(80).justifyContent(FlexAlign.Start).margin({
         left: 20
       })
-    }.height(this.heightNum).justifyContent(FlexAlign.Center).alignItems(VerticalAlign.Center)
+    }
+    .height(this.heightNum)
+    .justifyContent(FlexAlign.Center)
+    .alignItems(VerticalAlign.Center)
   }
 }

entry/src/main/ets/pages/compontents/Tab.ets

@@ -0,0 +1,67 @@
+@Component
+export default struct TabComponent {
+  @State activeIndex: number = 0
+  @State isShowTrajectory: boolean = false
+  onchange: (index: number) => void = () => {
+  }
+
+  build() {
+    Row() {
+      TabItemComponent({
+        active: this.activeIndex === 0,
+      }).onClick(() => {
+        this.activeIndex = 0
+        this.onchange(0)
+      })
+      TabItemComponent({
+        label: "原始数据",
+        active: this.activeIndex === 1,
+      }).onClick(() => {
+        this.activeIndex = 1
+        this.onchange(1)
+      })
+      if (this.isShowTrajectory) {
+        TabItemComponent({
+          label: "轨迹查看",
+          active: this.activeIndex === 2,
+        }).onClick(() => {
+          console.log("轨迹查看")
+          this.activeIndex = 2
+          this.onchange(2)
+        })
+      }
+
+    }
+  }
+}
+
+@Component
+struct TabItemComponent {
+  @State label: string = "信号查看"
+  @Prop active: boolean = false
+
+  build() {
+    Row() {
+      Text(this.label).fontColor(this.active ? "#ECAD5C" : "#DDCBAC").fontSize(20).fontWeight(FontWeight.Bold)
+    }
+    .width(180)
+    .height(80)
+    .borderRadius({
+      topLeft: 20,
+      topRight: 20,
+    })
+    .border({
+      width: { top: 1, left: 1, right: 1 },
+      color: this.active ? "#ECAD5C" : "#DDCBAC"
+    })
+    .justifyContent(FlexAlign.Center)
+    .alignItems(VerticalAlign.Center)
+    .margin({
+      left: 10
+    })
+    .shadow({
+      radius: 10,
+      color: this.active ? "#ECAD5C" : "",
+    })
+  }
+}