feat:优化H5界面布局，优化点赞

@@ -24,6 +24,13 @@ export struct WdWebComponent {
   @Link isPageEnd: boolean
   @Link isPageEnd: boolean
   @State subjectData : string = ''
   @State subjectData : string = ''
 
 
+  @StorageProp('currentBreakpoint') @Watch("currentChanged")currentBreakpoint: string = 'sm';
+
+  currentChanged(){
+    ///折叠屏转换
+    this.webviewControl.refresh()
+  }
+
   build() {
   build() {
     Column() {
     Column() {
       Web({ src: this.webUrl, controller: this.webviewControl })
       Web({ src: this.webUrl, controller: this.webviewControl })

@@ -61,22 +61,20 @@ export struct H5NewsWebPageComponent {
   private navTitle = '人民日报';
   private navTitle = '人民日报';
 
 
   build() {
   build() {
-    Column() {
-      Blank().height(`${this.topSafeHeight}px`)
-      //标题栏目
-      CustomTitleUI({ titleName: this.navTitle })
-      Stack({ alignContent: Alignment.Bottom }) {
-        Column() {
+    Stack({ alignContent: Alignment.Top }){
+      Stack(){
+        Column(){
+          CustomTitleUI({ titleName: this.navTitle })
           WdWebComponent({
           WdWebComponent({
             webviewControl: this.webviewControl,
             webviewControl: this.webviewControl,
             webUrl: this.webUrl,
             webUrl: this.webUrl,
             isPageEnd: $isPageEnd
             isPageEnd: $isPageEnd
           })
           })
-        }
-        .width(CommonConstants.FULL_WIDTH)
-        .height(CommonConstants.FULL_HEIGHT)
-        .padding({ bottom: 150})
+        }.width(CommonConstants.FULL_WIDTH)
+        .height(`calc(85% - ${ this.topSafeHeight + 'px'})`)
+      }
 
 
+      Stack(){
         //底部交互区
         //底部交互区
         OperRowListView({
         OperRowListView({
           contentDetailData: this.contentDetailData,
           contentDetailData: this.contentDetailData,
@@ -87,21 +85,15 @@ export struct H5NewsWebPageComponent {
             this.showCommentList = true
             this.showCommentList = true
           }
           }
         })
         })
+      }
+      .alignContent(Alignment.Top)
+          .position({y:'85%'})
           .width(CommonConstants.FULL_WIDTH)
           .width(CommonConstants.FULL_WIDTH)
           .backgroundColor(Color.White)
           .backgroundColor(Color.White)
           .height(150)
           .height(150)
 
 
-        //全部评论
-        CommentDialogView({
-          index: $index,
-          currentIndex: $currentIndex,
-          showCommentList: $showCommentList,
-          publishCommentModel: $publishCommentModel,
-          interactData: $interactData,
-        }).visibility(this.showComment ? Visibility.Visible : Visibility.Hidden)
-      }
-
     }
     }
+    .margin({top: `${this.topSafeHeight}px`, bottom: `${this.bottomSafeHeight}px`})
     .width(CommonConstants.FULL_WIDTH)
     .width(CommonConstants.FULL_WIDTH)
     .height(CommonConstants.FULL_HEIGHT)
     .height(CommonConstants.FULL_HEIGHT)
   }
   }

@@ -99,6 +99,9 @@ export struct LikeComponent {
     } else if (this.componentType == 5) {
     } else if (this.componentType == 5) {
       // 图集点赞，展示标识
       // 图集点赞，展示标识
       this.likeCompStyle5()
       this.likeCompStyle5()
+    }else if (this.componentType == 6) {
+      // H5
+      this.likeCompStyle6()
     } else {
     } else {
       //1: 底部栏目样式  默认样式
       //1: 底部栏目样式  默认样式
       this.likeCompStyle1()
       this.likeCompStyle1()
@@ -342,6 +345,58 @@ export struct LikeComponent {
 
 
   }
   }
 
 
+
+  @Builder
+  likeCompStyle6() {
+    //1:H5 底部栏目样式  默认样式
+    Stack({ alignContent: Alignment.Bottom }) {
+      Image(this.transLikeStyle().url)
+        .width(24)
+        .height(24)
+      if (this.likeCount > 0){
+        RelativeContainer() {
+          Image(this.likeStatus ? $r('app.media.ic_like_white_Select') : $r('app.media.ic_like_back'))
+            .objectFit(ImageFit.Fill)
+            .resizable({
+              slice: {
+                top: 1,
+                left: 20,
+                right: 1,
+                bottom: 1
+              }
+            })
+            .alignRules({
+              top: { anchor: "Text", align: VerticalAlign.Top },
+              left: { anchor: "Text", align: HorizontalAlign.Start },
+              right: { anchor: "Text", align: HorizontalAlign.End },
+              bottom: { anchor: "Text", align: VerticalAlign.Bottom },
+            })
+            .id("Image")
+
+          Text(NumberFormatterUtils.formatNumberWithWan(this.likeCount || ''))// Text("44444444")
+            .fontSize(8)
+            .fontColor('#ffffff')// .backgroundColor('#ED2800')
+            .height(12)
+            .textAlign(TextAlign.Center)
+            .alignRules({
+              top: { anchor: "__container__", align: VerticalAlign.Top },
+              left: { anchor: "__container__", align: HorizontalAlign.Start }
+            })/*动态计算文字宽度*/
+            .width(this.getMeasureText(NumberFormatterUtils.formatNumberWithWan(this.likeCount || '')) +
+              12)// .backgroundColor(Color.Green)
+            .id("Text")
+            .visibility(this.likeCount > 0 ? Visibility.Visible : Visibility.Hidden)
+        }
+        .offset({
+          x: 12
+        })
+      }
+    }.width(24).height(24).onClick(() => {
+      this.clickButtonEvent()
+    })
+    .visibility(this.likesStyle == 4 || this.likesStyle == 'empty' || !this.openLikes ? Visibility.None : Visibility.Visible)
+  }
+
   async clickButtonEvent() {
   async clickButtonEvent() {
     console.log(TAG, '点赞点击')
     console.log(TAG, '点赞点击')
     // 未登录，跳转登录
     // 未登录，跳转登录

@@ -325,7 +325,7 @@ export struct OperRowListView {
       LikeComponent({
       LikeComponent({
         data: this.likeBean,
         data: this.likeBean,
         styleType: this.styleType,
         styleType: this.styleType,
-        componentType: 5,
+        componentType: 6,
         pageComponentType: this.pageComponentType
         pageComponentType: this.pageComponentType
       })
       })
     }
     }