Explorar el Código

feat: 完成首页军事咨询和对应的详情展示

YuJing hace 2 semanas
padre
commit
59ecc41f62

+ 45 - 6
features/feature/src/main/ets/pages/MsgDetailPage.ets

@@ -1,27 +1,66 @@
-import { YTAvoid } from 'basic'
+import { RouterPage, YTAvoid } from 'basic'
 import { _YtHeader } from '../components/YtComp/_YtHeader'
 
 @ComponentV2
+@RouterPage
 struct MsgDetailPage {
   @Local safeTop: number = AppStorage.get(YTAvoid.SAFE_TOP_KEY) as number
+  @Local safeBottom: number = AppStorage.get(YTAvoid.SAFE_BOTTOM_KEY) as number
+
+  @Param title: string = '中国海军新型驱逐舰完成首次远海训练中国海军新型驱逐舰完成首次远海训练中国海军新型驱逐舰完成首次远海训练中国海军新型驱逐舰完成首次远海训练'
 
   build() {
     NavDestination() {
-      Column() {
+      Column({space: 18}) {
         // 注意考虑标题过长的问题
         _YtHeader({
-          title: ''
+          titleComp: () => { this.titleComp() },
+          _padding: 0
         })
+
+        Column(){
+          List(){
+            ListItem(){
+              Text('今夜,让我们一起想象漫步于一座静谧的森林。月光如轻纱般透过交错的枝叶,在你脚下的小径上洒下斑驳的光点。空气清凉而纯净,带着泥土和松针的芬芳。\n' +
+                '\n' +
+                '你深深吸一口气,能闻到树木的清香和雨后湿润的气息。耳边是轻柔的夜风拂过树梢的沙沙声,偶尔传来远处不知名昆虫的唧唧鸣叫,它们仿佛在为你唱着一首轻柔的摇篮曲。\n' +
+                '\n' +
+                '你的脚步很轻,很慢,每一步都让你离喧嚣更远,离内心的平静更近。前方的路柔和地延伸,你知道它是安全的,你可以完全放松下来,将自己交给这片宁静的天地。让森林的宁静包裹你,带你缓缓沉入安详的睡眠。')
+                .fontSize(14)
+                .lineHeight(22)
+                .fontWeight(400)
+            }
+          }
+          .width("100%")
+          .height("100%")
+        }
+        .width("100%")
+        .layoutWeight(1)
+        .borderRadius(20)
+        .padding({ left: 19, top: 18, right: 19, bottom: 18 })
+        .backgroundColor(Color.White)
       }
       .width("100%")
       .height('100%')
+      .backgroundColor('#F4FFF1')
+      .padding({ top: this.safeTop, bottom: this.safeBottom, left: 16, right: 16 })
     }
     .hideTitleBar(true)
-    .padding({ top: this.safeTop })
+  }
+
+  @Builder
+  titleComp(){
+    Text(this.title)
+      .width(270)
+      .maxLines(1)
+      .fontSize(18)
+      .fontWeight(500)
+      .fontColor(Color.Black)
+      .textOverflow({overflow: TextOverflow.Ellipsis})
   }
 }
 
 @Builder
-function MsgDetailPageBuilder() {
+function MsgDetailBuilder() {
   MsgDetailPage()
-}
+}

+ 9 - 0
features/feature/src/main/ets/utils/RouterUtils.ets

@@ -0,0 +1,9 @@
+import { yTRouter } from "basic";
+
+class RouterUtils {
+  router2MsgDetailPage(){
+    yTRouter.pushPathByName("MsgDetailPage", null)
+  }
+}
+
+export const uRouter: RouterUtils = new RouterUtils();

+ 6 - 0
features/feature/src/main/ets/view/MainView.ets

@@ -1,3 +1,4 @@
+import { uRouter } from "../utils/RouterUtils";
 import { MainViewModel } from "../viewModel/MainViewModel";
 
 @ComponentV2
@@ -69,6 +70,10 @@ struct MsgItem{
   @Param description: string = '今日,中国海军某新型驱逐舰圆满完成首次远海实战化训练, 检验多项新型武器装备性能今日,中国海军某新型驱逐舰圆满完成首次远海实战化训练, 检验多项新型武器装备性能...'
   @Param time: string = '2021-09-01'
 
+  routerPage(){
+    uRouter.router2MsgDetailPage()
+  }
+
   build() {
     Column({space: 8}){
       Row({space: 5}){
@@ -107,5 +112,6 @@ struct MsgItem{
     .borderRadius(12)
     .backgroundColor(Color.White)
     .padding({ top: 17, bottom: 10, left: 14, right: 14 })
+    .onClick(() => { this.routerPage() })
   }
 }

+ 5 - 0
features/feature/src/main/resources/base/profile/router_map.json

@@ -4,6 +4,11 @@
       "name": "YTNaviDiaLog",
       "pageSourceFile": "src/main/ets/pages/otherPage/YTNaviDiaLog.ets",
       "buildFunction": "YTNaviDiaLogBuilder"
+    },
+    {
+      "name": "MsgDetailPage",
+      "pageSourceFile": "src/main/ets/pages/MsgDetailPage.ets",
+      "buildFunction": "MsgDetailBuilder"
     }
   ]
 }