多图详情页swiper ,tabBar 开发

@@ -11,7 +11,7 @@ import { UserInfoDTO } from './UserInfoDTO'
  * http://192.168.1.3:3300/project/3802/interface/api/200915
  * http://192.168.1.3:3300/project/3802/interface/api/200915
  */
  */
 export interface ContentDetailDTO {
 export interface ContentDetailDTO {
-  newsId: string;
+  newsId: number;
   newsTitle: string;
   newsTitle: string;
   newsShortTitle: string;
   newsShortTitle: string;
   newsDownTitle: string;
   newsDownTitle: string;
@@ -42,8 +42,8 @@ export interface ContentDetailDTO {
   videoInfo: VideoInfoDTO[];
   videoInfo: VideoInfoDTO[];
   liveInfo?: any;
   liveInfo?: any;
   voteInfo?: any;
   voteInfo?: any;
-  rmhInfo?: RmhInfoDTO;
-  userInfo?: UserInfoDTO;
+  rmhInfo?: RmhInfoDTO | null;
+  userInfo?: UserInfoDTO | null;
   openLikes: number;
   openLikes: number;
   openComment: number;
   openComment: number;
   likesStyle: number;
   likesStyle: number;
@@ -68,4 +68,7 @@ export interface ContentDetailDTO {
   timeline?: any;
   timeline?: any;
   traceInfo: string;
   traceInfo: string;
   viewCount: number;
   viewCount: number;
+  isNewspaper: boolean;
+  oldNewsId: string;
+  serials: any;
 }
 }

@@ -2,7 +2,7 @@ export interface FullColumnImgUrlDTO {
   format?: any;
   format?: any;
   height: number;
   height: number;
   landscape: number;
   landscape: number;
-  size: number;
+  size: number | null;
   url: string;
   url: string;
   weight: number;
   weight: number;
 }
 }

@@ -9,12 +9,10 @@ export struct MultiPictureDetailItemComponent {
     Stack() {
     Stack() {
       Image(this.MultiPictureDetailItem.picPath)
       Image(this.MultiPictureDetailItem.picPath)
         .width('100%')
         .width('100%')
-        .aspectRatio(378 / 566)
+        .aspectRatio(this.MultiPictureDetailItem.width / this.MultiPictureDetailItem.height)
         .objectFit(ImageFit.Fill)
         .objectFit(ImageFit.Fill)
     }
     }
-    .padding({ top: 16, right: 16, bottom: 16, left: 16 })
-    .margin({ left: 10, right: 10 })
-    .backgroundColor(Color.White)
+    .backgroundColor(Color.Black)
     .width('100%')
     .width('100%')
   }
   }
 }
 }

@@ -8,6 +8,7 @@ import { MultiPictureDetailItemComponent } from './MultiPictureDetailItemCompone
 
 
 const TAG = 'MultiPictureDetailPageComponent';
 const TAG = 'MultiPictureDetailPageComponent';
 
 
+@Preview
 @Component
 @Component
 export struct MultiPictureDetailPageComponent {
 export struct MultiPictureDetailPageComponent {
   private displayTool = display.getDefaultDisplaySync()
   private displayTool = display.getDefaultDisplaySync()
@@ -17,7 +18,7 @@ export struct MultiPictureDetailPageComponent {
   @State relId: string = '500005189942'
   @State relId: string = '500005189942'
   @State contentId: string = '30043715146'
   @State contentId: string = '30043715146'
   @State relType: string = '1'
   @State relType: string = '1'
-  @State contentDetailData: ContentDetailDTO[] = [{}] as ContentDetailDTO[]
+  @State contentDetailData: ContentDetailDTO[] = [] as ContentDetailDTO[]
   @Provide @Watch('onCurrentPageNumUpdated') currentPageNum: string = '01'
   @Provide @Watch('onCurrentPageNumUpdated') currentPageNum: string = '01'
   private swiperController: SwiperController = new SwiperController()
   private swiperController: SwiperController = new SwiperController()
   @State swiperIndex: number = 0;
   @State swiperIndex: number = 0;
@@ -50,47 +51,42 @@ export struct MultiPictureDetailPageComponent {
 
 
   build() {
   build() {
     RelativeContainer() {
     RelativeContainer() {
-      RelativeContainer() {
-        if (this.contentDetailData?.[0].photoList?.length > 0) {
-          Swiper(this.swiperController) {
-            ForEach(this.contentDetailData[0].photoList, (item: PhotoListBean, index: number) => {
-              MultiPictureDetailItemComponent({ MultiPictureDetailItem: item })
-            })
-          }
-          .index(this.swiperIndex)
-          .width('100%')
-          .height(px2vp(this.picHeight) + 32)
-          .vertical(true)
-          .autoPlay(false)
-          .cachedCount(3)
-          .indicator(false)
-          .displayCount(1)
-          .margin({ top: 35, left: 10, right: 10 })
-          .id('e_picture_content')
-          .alignRules({
-            top: { anchor: "e_picture_container", align: VerticalAlign.Bottom },
-            middle: { anchor: "__container__", align: HorizontalAlign.Center }
-          })
-          .onChange((index: number) => {
-            this.swiperIndex = index
+      if (this.contentDetailData && this.contentDetailData.length > 0 && this.contentDetailData[0].photoList && this.contentDetailData[0].photoList?.length > 0) {
+        Swiper(this.swiperController) {
+          ForEach(this.contentDetailData[0].photoList, (item: PhotoListBean, index: number) => {
+            MultiPictureDetailItemComponent({ MultiPictureDetailItem: item })
           })
           })
         }
         }
+        .index(this.swiperIndex)
+        .width('100%')
+        .height(px2vp(this.picHeight) + 32)
+        .vertical(false)
+        .autoPlay(false)
+        .cachedCount(3)
+        .indicator(false)
+        .displayCount(1)
+        .id('e_swiper_content')
+        .alignRules({
+          top: { anchor: "__container__", align: VerticalAlign.Top },
+          middle: { anchor: "__container__", align: HorizontalAlign.Center }
+        })
+        .onChange((index: number) => {
+          this.swiperIndex = index
+        })
       }
       }
-      RelativeContainer() {
-        OperRowListView()
-          .alignRules({
-            top: { anchor: "e_picture_container", align: VerticalAlign.Bottom },
-            middle: { anchor: "__container__", align: HorizontalAlign.Center }
-          })
-      }
+      OperRowListView()
+      .alignRules({
+        bottom: { anchor: "__container__", align: VerticalAlign.Bottom },
+        middle: { anchor: "__container__", align: HorizontalAlign.Center }
+      })
       .width('100%')
       .width('100%')
-      .height(100)
-      .margin({ left: 20 })
-      .border({ width: 2, color: '#6699FF' })
+      .height(56)
+      .border({ width: {top: 0.5}, color: '#FFFFFF' })
+      .id('e_oper_row')
     }
     }
     .width('100%')
     .width('100%')
     .height('100%')
     .height('100%')
-    .backgroundColor($r('app.color.color_80000000'))
+    .backgroundColor(Color.Black)
     .id('e_picture_container')
     .id('e_picture_container')
   }
   }
 
 

@@ -2,17 +2,12 @@ import { ToastUtils, Logger } from 'wdKit';
 
 
 export interface OperationItem {
 export interface OperationItem {
   icon: Resource;
   icon: Resource;
-
-  // icon_selected: Resource;
   text: string | Resource;
   text: string | Resource;
   num?: number; // 个数
   num?: number; // 个数
 }
 }
 
 
-const FULL_PARENT: string = '100%';
-
 const TAG = 'OperRowListView';
 const TAG = 'OperRowListView';
 
 
-@Entry
 @Component
 @Component
 export struct OperRowListView {
 export struct OperRowListView {
   @State operationList: OperationItem[] = [
   @State operationList: OperationItem[] = [
@@ -41,32 +36,16 @@ export struct OperRowListView {
   }
   }
 
 
   build() {
   build() {
-    // List({ space: 0, initialIndex: 0 }) {
-    //   ForEach(this.operationList, (item: OperationItem, index: number) => {
-    //     ListItem() {
-    //       this.buildOperationItem(item, index)
-    //     }
-    //   }, (item: OperationItem, index: number) => JSON.stringify(item))
-    // }
-    // .width(48)
-    // .height(250)
-    // // .margin({ bottom: 100 })
-    // .backgroundColor(Color.Red)
-    // // .listDirection(Axis.Vertical) // 默认值：Axis.Vertical
-    // // .lanes(this.buildLanes()) // 行/列数，一列 // 默认值：1
-    // .cachedCount(2)
-    // .scrollBar(BarState.Off)
-    // .nestedScroll({
-    //   scrollForward: NestedScrollMode.PARENT_FIRST,
-    //   scrollBackward: NestedScrollMode.SELF_FIRST
-    // })
 
 
-    Column() {
+    Row() {
       ForEach(this.operationList, (item: OperationItem, index: number) => {
       ForEach(this.operationList, (item: OperationItem, index: number) => {
         this.buildOperationItem(item, index)
         this.buildOperationItem(item, index)
       }, (item: OperationItem, index: number) => JSON.stringify(item))
       }, (item: OperationItem, index: number) => JSON.stringify(item))
     }
     }
-    .width(48)
+    .width('100%')
+    .height('100%')
+    .alignItems(VerticalAlign.Center)
+    .justifyContent(FlexAlign.Center)
   }
   }
 
 
   /**
   /**
@@ -78,21 +57,11 @@ export struct OperRowListView {
   buildOperationItem(item: OperationItem, index: number) {
   buildOperationItem(item: OperationItem, index: number) {
     Column() {
     Column() {
       Image(item.icon)
       Image(item.icon)
-        .width('100%')
+        .width(24)
+        .height(24)
         .aspectRatio(1)
         .aspectRatio(1)
-      // .borderRadius(6)
-
-      Text(item.text)
-        .width('100%')// .margin({ top: 4, left: 6, right: 6 })// .backgroundColor(Color.Brown)
-        .fontWeight(FontWeight.Normal)
-        .textAlign(TextAlign.Center)
-        .fontSize(13)
-        .fontColor('#FFFFFF')
-        .maxLines(1)
-        .textOverflow({ overflow: TextOverflow.Ellipsis })
     }
     }
     .margin(5)
     .margin(5)
-    // .backgroundColor(Color.Black)
     .alignItems(HorizontalAlign.Center)
     .alignItems(HorizontalAlign.Center)
     .hoverEffect(HoverEffect.Scale)
     .hoverEffect(HoverEffect.Scale)
     .onClick((event: ClickEvent) => {
     .onClick((event: ClickEvent) => {

@@ -5,7 +5,7 @@ import {
   CompInfoBean,
   CompInfoBean,
   ContentDetailDTO,
   ContentDetailDTO,
   InteractDataDTO,
   InteractDataDTO,
-  InteractDataStatusDTO,
+  InteractDataStatusBean,
   MorningEveningPaperDTO,
   MorningEveningPaperDTO,
   NavigationBodyDTO,
   NavigationBodyDTO,
   NewspaperListBean,
   NewspaperListBean,
@@ -172,7 +172,7 @@ export class PageRepository {
   static fetchInteractDataStatus(param: object) {
   static fetchInteractDataStatus(param: object) {
     let url = PageRepository.getInteractDataStatusUrl()
     let url = PageRepository.getInteractDataStatusUrl()
     let headers: HashMap<string, string> = HttpUrlUtils.getCommonHeaders();
     let headers: HashMap<string, string> = HttpUrlUtils.getCommonHeaders();
-    return WDHttp.post<ResponseDTO<InteractDataStatusDTO[]>>(url, param, headers)
+    return WDHttp.post<ResponseDTO<InteractDataStatusBean[]>>(url, param, headers)
   };
   };
 
 
   // 浏览历史新增、删除接口
   // 浏览历史新增、删除接口

@@ -33,8 +33,8 @@ export struct DetailPlayShortVideoPage {
   @Provide newsSourceName?: string = ''
   @Provide newsSourceName?: string = ''
   @Provide newsTitle?: string = ''
   @Provide newsTitle?: string = ''
   @Provide editorName?: string = ''
   @Provide editorName?: string = ''
-  @Provide rmhInfo?: RmhInfoDTO = undefined
-  @Provide userInfo?: UserInfoDTO = undefined
+  @Provide rmhInfo?: RmhInfoDTO | null = null
+  @Provide userInfo?: UserInfoDTO | null = null
   @Provide message?: string = ''
   @Provide message?: string = ''
   @Provide newsSummary?: string = ''
   @Provide newsSummary?: string = ''
   @Provide progressVal: number = 0;
   @Provide progressVal: number = 0;

@@ -15,8 +15,8 @@ export class PlayViewModel {
   newsTitle?: string
   newsTitle?: string
   editorName?: string
   editorName?: string
   newsSummary?: string
   newsSummary?: string
-  rmhInfo?: RmhInfoDTO
-  userInfo?: UserInfoDTO
+  rmhInfo?: RmhInfoDTO | null
+  userInfo?: UserInfoDTO | null
   url?: string
   url?: string
   // 视频朝向，
   // 视频朝向，
   // 横屏视频：1(进入竖屏，立即展示半屏播放窗口，当切换横屏时，再展示全部播放窗口；后续可再转换到竖屏)：
   // 横屏视频：1(进入竖屏，立即展示半屏播放窗口，当切换横屏时，再展示全部播放窗口；后续可再转换到竖屏)：