早晚报 音频播放

+import { ReLInfo } from './ReLInfo';
+
+export interface AudioDataList {
+  audioUrl: string;
+  coverUrl: string;
+  duration: number;
+  objectId: number;
+  objectType: number;
+  reLInfo: ReLInfo;
+  title: string;
+}

+import { AudioDataList } from './AudioDataList';
 import { OperDataList } from './OperDataList';
 import { OperDataList } from './OperDataList';
 
 
 export interface CompList {
 export interface CompList {
-  // audioDataList: any[];
+  audioDataList: AudioDataList[];
   backgroundImgUrl: string;
   backgroundImgUrl: string;
+
   // bottomNavId?: any;
   // bottomNavId?: any;
   cardItemId: string;
   cardItemId: string;
+
   // cardUpdateStrategy?: any;
   // cardUpdateStrategy?: any;
   compStyle: string;
   compStyle: string;
   compType: string;
   compType: string;
   dataSourceType: string;
   dataSourceType: string;
   expIds: string;
   expIds: string;
   extraData: string;
   extraData: string;
+
   // fullColumnImgUrls: any[];
   // fullColumnImgUrls: any[];
   hasMore: number;
   hasMore: number;
   id: number;
   id: number;
+
   // imageScale?: any;
   // imageScale?: any;
   imgSize: string;
   imgSize: string;
   itemId: string;
   itemId: string;
   itemType: string;
   itemType: string;
   itemTypeCode: string;
   itemTypeCode: string;
   linkUrl: string;
   linkUrl: string;
+
   // localGovernance?: any;
   // localGovernance?: any;
   name: string;
   name: string;
   objectId: string;
   objectId: string;
@@ -27,13 +33,16 @@ export interface CompList {
   objectSummary: string;
   objectSummary: string;
   objectTitle: string;
   objectTitle: string;
   objectType: string;
   objectType: string;
+
   // openComment?: any;
   // openComment?: any;
   // openLikes?: any;
   // openLikes?: any;
   operDataList: OperDataList[];
   operDataList: OperDataList[];
   pageId: string;
   pageId: string;
+
   // position?: any;
   // position?: any;
   posterSize: string;
   posterSize: string;
   posterUrl: string;
   posterUrl: string;
+
   // questionSection?: any;
   // questionSection?: any;
   recommend: number;
   recommend: number;
   relId: number;
   relId: number;
@@ -41,8 +50,10 @@ export interface CompList {
   sortValue: number;
   sortValue: number;
   subSceneId: string;
   subSceneId: string;
   summaryName: string;
   summaryName: string;
+
   // tabOperDataList: any[];
   // tabOperDataList: any[];
   titleShowPolicy: number;
   titleShowPolicy: number;
+
   // topicTemplate?: any;
   // topicTemplate?: any;
   traceId: string;
   traceId: string;
   traceInfo: string;
   traceInfo: string;

+export interface ReLInfo {
+  channelId?: string;
+  relId: string;
+  relObjectId: number;
+  relType: string;
+}

@@ -13,6 +13,7 @@
     "wdBean": "file:../../features/wdBean",
     "wdBean": "file:../../features/wdBean",
     "wdRouter": "file:../../commons/wdRouter",
     "wdRouter": "file:../../commons/wdRouter",
     "wdNetwork": "file:../../commons/wdNetwork",
     "wdNetwork": "file:../../commons/wdNetwork",
+    "wdPlayer": "file:../../features/wdPlayer",
     "wdLogin": "file:../../features/wdLogin"
     "wdLogin": "file:../../features/wdLogin"
   }
   }
 }
 }

 import { AudioDTO } from 'wdBean';
 import { AudioDTO } from 'wdBean';
+import { Logger } from 'wdKit/Index';
 
 
 /**
 /**
  * 早晚报页面音频bar
  * 早晚报页面音频bar
  */
  */
-@Entry
+// @Entry
 @Component
 @Component
 export struct AudioBarView {
 export struct AudioBarView {
   @State audioDataList?: AudioDTO[] = []
   @State audioDataList?: AudioDTO[] = []
+  @Consume isAudioPlaying?: boolean
 
 
   aboutToAppear() {
   aboutToAppear() {
   }
   }
@@ -45,6 +47,11 @@ export struct AudioBarView {
           .height(24)
           .height(24)
           .margin({ left: 10 })// .alignSelf(ItemAlign.Center)
           .margin({ left: 10 })// .alignSelf(ItemAlign.Center)
           .objectFit(ImageFit.Contain)
           .objectFit(ImageFit.Contain)
+          .onClick(() => {
+            Logger.info("TAG", "cj compInfoBean onClick1 = " + this.isAudioPlaying)
+            this.isAudioPlaying = !this.isAudioPlaying
+            Logger.info("TAG", "cj compInfoBean onClick2 = " + this.isAudioPlaying)
+          })
       }
       }
       // .aspectRatio(7 / 4)
       // .aspectRatio(7 / 4)
       .height('100%')
       .height('100%')

 // import { FrontLinkObject, MorningEveningPaperDTO, PageInfoBean } from 'wdBean';
 // import { FrontLinkObject, MorningEveningPaperDTO, PageInfoBean } from 'wdBean';
 import { CompList, PageInfoBean } from 'wdBean';
 import { CompList, PageInfoBean } from 'wdBean';
 import { DateTimeUtils, Logger } from 'wdKit/Index';
 import { DateTimeUtils, Logger } from 'wdKit/Index';
+import { PaperReaderSimpleDialog } from '../../dialog/PaperReaderDialog';
 import { MorningEveningViewModel } from '../../viewmodel/MorningEveningViewModel';
 import { MorningEveningViewModel } from '../../viewmodel/MorningEveningViewModel';
-import { AudioBarView } from './AudioBarView';
+// import { AudioBarView } from './AudioBarView';
 import { PaperTitleComponent } from './PaperTitleComponent';
 import { PaperTitleComponent } from './PaperTitleComponent';
 import { SingleColumn999Component } from './SingleColumn999Component';
 import { SingleColumn999Component } from './SingleColumn999Component';
 import { topicInfoView } from './topicInfoView';
 import { topicInfoView } from './topicInfoView';
+import { WDPlayerController } from 'wdPlayer';
 
 
 const TAG = 'MorningEveningPaperComponent';
 const TAG = 'MorningEveningPaperComponent';
 
 
@@ -17,6 +19,7 @@ export struct MorningEveningPaperComponent {
   @State pageInfoBean: PageInfoBean = {} as PageInfoBean
   @State pageInfoBean: PageInfoBean = {} as PageInfoBean
   // @State compInfoBean: CompInfoBean = {} as CompInfoBean
   // @State compInfoBean: CompInfoBean = {} as CompInfoBean
   @State compListItem: CompList = {} as CompList
   @State compListItem: CompList = {} as CompList
+  @State audioPlayUrl: string = ""
   // @Provide compListItem: CompList = {} as CompList
   // @Provide compListItem: CompList = {} as CompList
   // @State morningEveningPaperDTO: MorningEveningPaperDTO = {
   // @State morningEveningPaperDTO: MorningEveningPaperDTO = {
   //   name: "新闻夜读",
   //   name: "新闻夜读",
@@ -36,6 +39,16 @@ export struct MorningEveningPaperComponent {
   // } as MorningEveningPaperDTO
   // } as MorningEveningPaperDTO
   @Provide title: string = ''
   @Provide title: string = ''
   @Provide subTitle: string = ''
   @Provide subTitle: string = ''
+  @Provide isAudioPlaying: boolean = false
+  private playerController: WDPlayerController = new WDPlayerController();
+  private xComponentController: XComponentController = new XComponentController();
+  simpleAudioDialog: CustomDialogController = new CustomDialogController({
+    builder: PaperReaderSimpleDialog(),
+    autoCancel: false,
+    customStyle: true,
+    alignment: DialogAlignment.CenterStart,
+    offset: { dx: 12, dy: -150 }
+  })
 
 
   async aboutToAppear() {
   async aboutToAppear() {
     console.info(TAG, `aboutToAppear`)
     console.info(TAG, `aboutToAppear`)
@@ -44,7 +57,7 @@ export struct MorningEveningPaperComponent {
     Logger.info(TAG, "currentTime = " + currentTime)
     Logger.info(TAG, "currentTime = " + currentTime)
     Logger.info(TAG, `currentTime = ${currentTime}`)
     Logger.info(TAG, `currentTime = ${currentTime}`)
     try {
     try {
-      let pageInfoBean = await MorningEveningViewModel.getMorningEveningPageInfo("28949")
+      let pageInfoBean = await MorningEveningViewModel.getMorningEveningPageInfo("25091")
       this.pageInfoBean = pageInfoBean;
       this.pageInfoBean = pageInfoBean;
       this.title = this.pageInfoBean?.topicInfo?.title
       this.title = this.pageInfoBean?.topicInfo?.title
       let dateTime = DateTimeUtils.parseDate(this.pageInfoBean?.topicInfo?.topicDate ?? '', DateTimeUtils.PATTERN_DATE_HYPHEN);
       let dateTime = DateTimeUtils.parseDate(this.pageInfoBean?.topicInfo?.topicDate ?? '', DateTimeUtils.PATTERN_DATE_HYPHEN);
@@ -59,9 +72,13 @@ export struct MorningEveningPaperComponent {
       // this.compInfoBean = compInfoBean
       // this.compInfoBean = compInfoBean
       if (compInfoBean?.compList[0]) {
       if (compInfoBean?.compList[0]) {
         this.compListItem = compInfoBean?.compList[0]
         this.compListItem = compInfoBean?.compList[0]
+        if (compInfoBean?.compList[0].audioDataList) {
+          this.audioPlayUrl = compInfoBean?.compList[0].audioDataList[0].audioUrl
+        }
       }
       }
 
 
       Logger.info(TAG, "compInfoBean compStyle = " + compInfoBean.compList[0].compStyle)
       Logger.info(TAG, "compInfoBean compStyle = " + compInfoBean.compList[0].compStyle)
+
     } catch (exception) {
     } catch (exception) {
 
 
     }
     }
@@ -77,12 +94,15 @@ export struct MorningEveningPaperComponent {
           }
           }
 
 
           ListItem() {
           ListItem() {
-            AudioBarView()
+            this.AudioBarView(this.simpleAudioDialog)
           }
           }
         }
         }
 
 
         ListItem() {
         ListItem() {
-          SingleColumn999Component({ compListItem: this.compListItem }).margin({ top: $r('app.float.top_bar_height') })
+          SingleColumn999Component({ compListItem: this.compListItem })
+            .margin({
+              top: this.pageInfoBean?.topicInfo?.frontLinkObject ? 10 : 44
+            })
         }
         }
       }
       }
       // .backgroundColor('#FFF1F3F5')
       // .backgroundColor('#FFF1F3F5')
@@ -104,4 +124,63 @@ export struct MorningEveningPaperComponent {
     // .backgroundColor(Color.Black)
     // .backgroundColor(Color.Black)
     .backgroundColor(this.pageInfoBean?.backgroundColor ?? Color.Black)
     .backgroundColor(this.pageInfoBean?.backgroundColor ?? Color.Black)
   }
   }
+
+  @Builder
+  AudioBarView(dialog: CustomDialogController) {
+    Row() {
+      Stack({ alignContent: Alignment.Start }) {
+        Image($r('app.media.listen_left_bg'))
+          .width('100%')
+          .height('100%')
+          .objectFit(ImageFit.Contain)
+        Image($r('app.media.icon_listen'))
+          .width(24)
+          .height(24)
+          .margin({ left: 10 })
+          .alignSelf(ItemAlign.Start)
+
+        Text('晚上好， 请收听今日新闻播报')
+          .fontSize(14)
+          .margin({ left: 50 })
+          .fontColor(Color.Black)
+          .maxLines(1)
+          .textOverflow({ overflow: TextOverflow.Ellipsis })
+      }
+      .layoutWeight(1)
+      .height('100%')
+
+      Stack({ alignContent: Alignment.Center }) {
+        Image($r('app.media.listen_right_bg'))
+          .width('100%')
+          .height('100%')
+          .objectFit(ImageFit.Contain)
+
+        Image($r('app.media.ic_red_triangle'))
+          .width(24)
+          .height(24)
+          .margin({ left: 10 })// .alignSelf(ItemAlign.Center)
+          .objectFit(ImageFit.Contain)
+          .onClick(() => {
+            Logger.info("TAG", "cj compInfoBean onClick1 = " + this.isAudioPlaying)
+            dialog.open()
+            this.playerController.firstPlay(this.audioPlayUrl)
+            Logger.info("TAG", "cj compInfoBean onClick2 = " + this.isAudioPlaying)
+          })
+      }
+      // .aspectRatio(7 / 4)
+      .height('100%')
+      // .justifyContent(FlexAlign.Center)
+      // .width(94)
+      // .width(140)
+      .width('20%')
+      // .height(56)
+      .onClick(() => {
+        // console.info(TAG, `onClick listen_right_bg`);
+      })
+    }
+    // .width('100%')
+    .height(56)
+    .alignItems(VerticalAlign.Center)
+    .justifyContent(FlexAlign.SpaceBetween)
+  }
 }
 }

+/**
+ * 简易音频对话框
+ * */
+@CustomDialog
+export struct PaperReaderSimpleDialog {
+  private controllerSimple?: CustomDialogController;
+
+  build() {
+    Row() {
+      Image($r("app.media.icon_audio_pause"))
+        .objectFit(ImageFit.Contain)
+        .margin(18)
+        .width(24)
+        .height(24)
+    }
+    .width(60)
+    .height(60)
+    .backgroundColor(Color.White)
+    .onClick(() => {
+      if (this.controllerSimple) {
+        this.controllerSimple.close()
+      }
+
+    })
+
+  }
+}
+
+/**
+ * 图文音频对话框
+ * */
+@CustomDialog
+export struct PaperReaderDialog {
+  controllerDetail?: CustomDialogController
+
+  build() {
+    Stack() {
+      Column() { //标题 时间 进度条
+        Marquee({
+          start: true,
+          step: 50,
+          loop: Number.POSITIVE_INFINITY,
+          fromStart: true,
+          src: "Running Marquee starts rolling"
+        })
+          .width("60%")
+          .height(20)
+          .fontColor($r("app.color.color_222222"))
+          .fontSize(14)
+          .margin({ top: 10 })
+          .onStart(() => {
+            console.info('Marquee animation complete onStart')
+          })
+          .onBounce(() => {
+            console.info('Marquee animation complete onBounce')
+          })
+          .onFinish(() => {
+            console.info('Marquee animation complete onFinish')
+          })
+
+        Row() {
+          Text("00:00")
+            .fontSize($r('app.float.font_size_12'))
+            .fontColor($r('app.color.color_999999'))
+            .width("49%")
+            .height("100%")
+          Text("/00:00")
+            .fontSize($r('app.float.font_size_12'))
+            .fontColor($r('app.color.color_999999'))
+            .width("51%")
+            .height("100%")
+
+        }
+        .width("100%")
+        .height(16)
+        .margin({ top: 4 })
+      }
+      .width("100%")
+      .height("100%")
+
+      Progress({ value: 0, total: 100, type: ProgressType.Linear })
+        .color($r('app.color.color_ED2800'))
+        .width("100%")
+        .height(3)
+
+      Image($r("app.media.icon_audio_pause"))
+        .objectFit(ImageFit.Auto)
+        .align(Alignment.End)
+        .margin({ right: 12 })
+
+      Image($r("app.media.icon_audio_close"))
+        .objectFit(ImageFit.Auto)
+        .align(Alignment.End)
+        .margin({ right: 48 })
+        .onClick(() => {
+          if (this.controllerDetail) {
+            this.controllerDetail.close()
+          }
+        })
+    }
+    .width("65%")
+    .height(60)
+    .backgroundColor(Color.White)
+    .borderRadius(5)
+  }
+}