修改评论弹窗能够挡住导航

@@ -118,16 +118,15 @@ export struct CommentComponent {
       }
       .margin({ left: 16 })
 
-      Row() {
-        Image($r('app.media.close_button'))
-          .height(16)
-          .width(3)
-          .margin({ right: 16 })
-          .visibility(this.showCloseIcon ? Visibility.Visible : Visibility.Hidden)
-          .onClick(() => {
-            this.onCloseClick()
-          })
-      }
+
+      Image($r('app.media.close_button'))
+        .height(16)
+        .width(16)
+        .margin({ right: 16 })
+        .visibility(this.showCloseIcon ? Visibility.Visible : Visibility.Hidden)
+        .onClick(() => {
+          this.onCloseClick()
+        })
 
     }
     .height(44)

@@ -213,7 +213,8 @@ export struct OperRowListView {
     }
     .layoutWeight(1)
     .margin({
-      right: this.pageComponentType === 1 ? 22 : 0,
+      right: this.pageComponentType === 1 ? 20 : 0,
+      left: 16
     })
 
     if (this.showCommentIcon) {

@@ -15,8 +15,7 @@ import { HttpUtils } from 'wdNetwork/Index';
 import { DateTimeUtils, WindowModel } from 'wdKit/Index';
 import { PlayerBottomView } from '../view/PlayerBottomView';
 import { PlayerRightView } from '../view/PlayerRightView';
-import { CommentComponentPage } from '../view/CommentComponentPage';
-import { window } from '@kit.ArkUI';
+import { CommentDialogView } from '../view/CommentDialogView';
 import { DisplayDirection } from 'wdConstant/Index';
 
 const TAG = 'DetailPlayShortVideoPage';
@@ -39,7 +38,7 @@ export struct DetailPlayShortVideoPage {
   @Provide followStatus: string = '0' // 关注状态
   @Provide isOpenDetail: boolean = false // 查看详情按钮点击
   @Provide isDragging: boolean = false // 拖动时间进度条
-  @Provide showCommentList: boolean = false
+  @Consume showCommentList: boolean
   @Consume displayDirection: DisplayDirection
   @Consume @Watch('videoStatusChange') switchVideoStatus: boolean
   @Consume @Watch('pageShowChange') pageShow: number
@@ -225,15 +224,7 @@ export struct DetailPlayShortVideoPage {
       .height('100%')
       .width('100%')
 
-      // .padding({
-      //   top: this.displayDirection === DisplayDirection.VIDEO_HORIZONTAL ? 0 : this.topSafeHeight + 'px'
-      // })
-
-      if (this.showCommentList) {
-        CommentComponentPage({})
-          .position({ y: '100%' })
-          .markAnchor({ y: '100%' })
-      }
+      CommentDialogView({ publishCommentModel: this.publishCommentModel })
     }
     .height('100%')
     .width('100%')

@@ -28,6 +28,7 @@ export struct DetailVideoListPage {
   @Provide pageHide: number = -1
   @Provide switchVideoStatus: boolean = true
   @Provide displayDirection: DisplayDirection = DisplayDirection.VERTICAL
+  @Provide showCommentList: boolean = false
   @State data: ContentDetailDTO[] = []
   @State currentIndex: number = 0
   @State netStatus: number | undefined = undefined // 存储网络状态用来展示缺省图
@@ -184,8 +185,8 @@ export struct DetailVideoListPage {
           center: { anchor: "__container__", align: VerticalAlign.Center },
           middle: { anchor: "__container__", align: HorizontalAlign.Center }
         })
-    }else{
-       Column() {
+    } else {
+      Column() {
         Swiper(this.swiperController) {
           ForEach(this.data, (item: ContentDetailDTO, index: number) => {
             DetailPlayShortVideoPage({
@@ -196,7 +197,8 @@ export struct DetailVideoListPage {
             })
           }, (item: ContentDetailDTO) => item.newsId + '')
         }
-        .disableSwipe(this.displayDirection === DisplayDirection.VERTICAL || !this.showComment ? false : true)
+        .disableSwipe(this.displayDirection === DisplayDirection.VERTICAL || this.showCommentList ?
+          false : true)
         .indicator(false)
         .vertical(true)
         .loop(false)
@@ -219,8 +221,7 @@ export struct DetailVideoListPage {
       // .padding({
       //   bottom: this.bottomSafeHeight + 'px'
       // })
-      }
-      
     }
-   
+
+  }
 }
\ No newline at end of file

@@ -45,13 +45,15 @@ export struct VideoChannelDetail {
   @Consume barBackgroundColor: Color
   private swiperController: SwiperController = new SwiperController()
   @Provide showComment: boolean = false
-  @Provide topSafeHeight: number = AppStorage.get<number>('topSafeHeight') || 0
   @Provide windowWidth: number = AppStorage.get<number>('windowWidth') || 0
   @Provide windowHeight: number = AppStorage.get<number>('windowHeight') || 0
+  @Provide bottomSafeHeight: number = AppStorage.get<number>('bottomSafeHeight') || 0
+  @Provide topSafeHeight: number = AppStorage.get<number>('topSafeHeight') || 0
   @Consume @Watch('pageShowChange') pageShow: number
   @Consume @Watch('pageHideChange') pageHide: number
   @Provide switchVideoStatus: boolean = true
   @Provide displayDirection: DisplayDirection = DisplayDirection.VERTICAL
+  @Provide showCommentList: boolean = false
   @State data: ContentDetailDTO[] = []
   @State currentIndex: number = 0
   @State interactDataList: InteractDataDTO[] = []
@@ -267,8 +269,8 @@ export struct VideoChannelDetail {
           }, (item: ContentDetailDTO) => item.newsId + '')
         }
         .displayCount(1, true)
-        .disableSwipe(this.displayDirection === DisplayDirection.VERTICAL || !this.showComment ? false : true)
-        .visibility(this.isMouted ? Visibility.Visible : Visibility.None)
+        .disableSwipe(this.displayDirection === DisplayDirection.VERTICAL || this.showCommentList ? false : true)
+        .visibility(this.isMouted ? Visibility.Visible : Visibility.Hidden)
         .indicator(false)
         .vertical(true)
         .loop(false)

@@ -6,44 +6,75 @@ import {
 import { CommentComponent } from '../../../../../wdComponent/src/main/ets/components/comment/view/CommentComponent'
 import { OperRowListView } from '../../../../../wdComponent/src/main/ets/components/view/OperRowListView'
 
+
 @Component
 export struct CommentDialogView {
+  @Prop publishCommentModel: publishCommentModel
+  @Consume windowWidth: number
+  @Consume windowHeight: number
+  @Consume bottomSafeHeight: number
+  @Consume topSafeHeight: number
+  @Consume contentDetailData: ContentDetailDTO
+  @Consume @Watch('showCommentListChange') showCommentList: boolean
+  @State dialogOffsetY: number = 0 // (this.windowHeight - this.windowWidth * 9 / 16)
+  @State modifier: DrawModifier = new DrawModifier();
   private dialogController: CustomDialogController = new CustomDialogController({
-    builder: this.commentBuilder(),
-    autoCancel: true,
+    builder: DetailDialog({
+      publishCommentModel: this.publishCommentModel,
+      dialogOffsetY: $dialogOffsetY
+    }),
+    autoCancel: false,
     customStyle: true,
     alignment: DialogAlignment.Bottom,
-    height: (this.windowHeight - this.windowWidth / 16 / 9) + 'px' as Dimension
+    // onWillDismiss: (dismissDialogAction: DismissDialogAction) => {
+    //   this.showCommentList = false
+    //   dismissDialogAction.dismiss()
+    // },
+    openAnimation: { duration: 0 },
+    closeAnimation: { duration: 0 },
   })
-  @Provide windowWidth: number = AppStorage.get<number>('windowWidth') || 0
-  @Provide windowHeight: number = AppStorage.get<number>('windowHeight') || 0
-  @Consume contentDetailData: ContentDetailDTO
-  @Consume showCommentList: boolean
-  @State publishCommentModel: publishCommentModel = new publishCommentModel()
 
-  aboutToAppear(): void {
+  /**
+   * 问题：弹窗从底部到上动画无法添加
+   */
 
-    this.publishCommentModel.targetId = String(this.contentDetailData?.newsId || '')
-    this.publishCommentModel.targetRelId = String(this.contentDetailData?.reLInfo?.relId || '')
-    this.publishCommentModel.targetTitle = this.contentDetailData?.newsTitle
-    this.publishCommentModel.targetRelType = String(this.contentDetailData?.reLInfo?.relType || '')
-    this.publishCommentModel.targetRelObjectId = String(this.contentDetailData?.reLInfo?.relObjectId || '')
-    this.publishCommentModel.keyArticle = String(this.contentDetailData?.keyArticle || '')
-    this.publishCommentModel.targetType = String(this.contentDetailData?.newsType || '')
-    this.publishCommentModel.visitorComment = String(this.contentDetailData?.visitorComment || '')
+  showCommentListChange(val: boolean) {
+    if (this.showCommentList) {
+      this.dialogController.open()
+      console.log('open')
+      // animateTo({ duration: 10000, expectedFrameRateRange: { min: 60, max: 60, expected: 60 } }, () => {
+      //   this.dialogOffsetY = 500
+      //   this.modifier.invalidate()
+      // })
+    } else {
+      this.dialogController.close()
+      console.log('close')
+    }
+  }
 
-    this.dialogController.open()
+  build() {
   }
+}
+
+@CustomDialog
+export struct DetailDialog {
+  controller: CustomDialogController
+  @Prop publishCommentModel: publishCommentModel
+  @Link dialogOffsetY: number
+  @Consume contentDetailData: ContentDetailDTO
+  @Consume showCommentList: boolean
+  @Consume windowWidth: number
+  @Consume windowHeight: number
 
-  @Builder
-  commentBuilder() {
+  build() {
     Column() {
       CommentComponent({
         publishCommentModel: this.publishCommentModel,
         showCloseIcon: true,
         onCloseClick: () => {
-          this.dialogController.close()
+          console.log('onCloseClick')
           this.showCommentList = false
+          this.controller.close()
         }
       })
         .layoutWeight(1)
@@ -60,13 +91,9 @@ export struct CommentDialogView {
         }
       })
     }
+    .height(this.windowHeight - this.windowWidth * 9 / 16 + 'px')
+    // .margin({ top: this.dialogOffsetY + 'px' })
     .zIndex(1000)
     .backgroundColor(Color.White)
-    .height('60%')
-  }
-
-  build() {
-
-
   }
 }
\ No newline at end of file

@@ -68,6 +68,8 @@ export struct PlayerProgressView {
           console.log('slider onChange:', value, mode)
 
         })
-    }.visibility(this.isOpenDetail ? Visibility.None : Visibility.Visible)
+    }
+    .margin({ top: 40 })
+    .visibility(this.isOpenDetail ? Visibility.None : Visibility.Visible)
   }
 }
\ No newline at end of file