feat(广告)：绘制 冠名广告、视频广告、长通栏广告 和 顶部长通栏广告 大图卡

+/**
+ * @Description: 广告扩展信息的解析模型
+ * @Author:
+ * @Email: liyubing@wondertek.com.cn
+ * @CreateDate:
+ * @UpdateRemark: 更新说明
+ * @Version: 1.0
+ */
+export interface AdvExtraData {
+
+
+  itemTopImage: string;
+  itemMore: AdvExtraItemData;
+  item: AdvExtraItemData[]
+
+}
+
+export interface AdvExtraItemData {
+/**
+ * 图片地址
+ */
+  image: string;
+  /**
+   * 标题
+   */
+  title: string ;
+  /**
+   * 跳转地址
+   */
+  linkUrl: string;
+  /**
+   * 跳转类型
+   */
+  linkType: string;
+
+}
\ No newline at end of file

-//全标题 "appStyle":"2",
-import { CompDTO, ContentDTO } from 'wdBean';
+import { CompDTO } from 'wdBean';
 import { CommonConstants } from 'wdConstant/Index';
 import { ProcessUtils } from 'wdRouter';
-import { CardMediaInfo } from '../cardCommon/CardMediaInfo'
-import { CardSourceInfo } from '../cardCommon/CardSourceInfo'
+import { CardAdvBottom } from './CardAdvBottom';
 
 const TAG: string = 'Card2Component';
 
-/** 
- * @Description:    广告---大图卡
- * @Author:         
- * @Email:          liyubing@wondertek.com.cn
- * @CreateDate:     
- * @UpdateRemark:   更新说明
- * @Version:        1.0
+/**
+ * @Description: 广告---大图卡
+ * @Author:
+ * @Email: liyubing@wondertek.com.cn
+ * @CreateDate:
+ * @UpdateRemark: 更新说明
+ * @Version: 1.0
  */
 @Component
 export struct CardAdvBigImageComponent {
-
   @State compDTO: CompDTO = {} as CompDTO
 
+
   aboutToAppear(): void {
 
     console.error('ZZZXXXXX', '----大图卡----aboutToAppear-----')
+
+
   }
 
   aboutToDisappear(): void {
@@ -33,12 +33,21 @@ export struct CardAdvBigImageComponent {
   build() {
 
     Column() {
-      Text(this.compDTO.matInfo.advTitle)
-        .fontSize($r('app.float.font_size_17'))
-        .fontColor($r('app.color.color_222222'))
-        .maxLines(3)
-        .textOverflow({ overflow: TextOverflow.Ellipsis })// 超出的部分显示省略号。
-        .align(Alignment.Start)
+
+      //新闻标题
+      Text(this.compDTO.matInfo.advTitle).bottomTextStyle().margin({ bottom: 8, })
+      //大图
+      Image(this.compDTO.matInfo.matImageUrl[0])
+        .width(CommonConstants.FULL_WIDTH)
+        .aspectRatio(16 / 9)
+        .borderRadius(4)
+        .borderWidth(0.5)
+        .borderColor($r('app.color.color_0D000000'))
+        .width(CommonConstants.FULL_WIDTH)
+
+      CardAdvBottom().margin({
+        top: 8,
+      })
     }
     .width(CommonConstants.FULL_WIDTH)
     .padding({
@@ -48,13 +57,21 @@ export struct CardAdvBigImageComponent {
       bottom: $r('app.float.card_comp_pagePadding_tb')
     })
     .onClick((event: ClickEvent) => {
-      //ProcessUtils.processPage(this.contentDTO)
+      ProcessUtils.openAdvDetail(this.compDTO.matInfo)
     })
   }
 }
 
+/*
+   标题样式
+ */
 @Extend(Text)
 function bottomTextStyle() {
-  .fontSize(12)
-  .fontColor('#B0B0B0')
+  .fontSize('18fp')
+  .fontColor($r('app.color.color_222222'))
+  .maxLines(3)
+  .textOverflow({ overflow: TextOverflow.Ellipsis }) // 超出的部分显示省略号。
+  .align(Alignment.Start)
+  .width('100%')
+  .lineHeight(25)
 }
\ No newline at end of file

 //全标题 "appStyle":"2",
 import { CompDTO, ContentDTO } from 'wdBean';
+import { AdvExtraData, AdvExtraItemData } from 'wdBean/src/main/ets/bean/adv/AdvExtraData';
+import { CompAdvMatInfoBean } from 'wdBean/src/main/ets/bean/adv/CompAdvInfoBean';
 import { CommonConstants } from 'wdConstant/Index';
 import { ProcessUtils } from 'wdRouter';
 import { CardMediaInfo } from '../cardCommon/CardMediaInfo'
@@ -7,22 +9,30 @@ import { CardSourceInfo } from '../cardCommon/CardSourceInfo'
 
 const TAG: string = 'Card2Component';
 
-/** 
- * @Description:    广告---冠名广告
- * @Author:         
- * @Email:          liyubing@wondertek.com.cn
- * @CreateDate:     
- * @UpdateRemark:   更新说明
- * @Version:        1.0
+/**
+ * @Description: 广告---冠名广告
+ * @Author:
+ * @Email: liyubing@wondertek.com.cn
+ * @CreateDate:
+ * @UpdateRemark: 更新说明
+ * @Version: 1.0
  */
 @Component
 export struct CardAdvGanMiComponent {
-
   @State compDTO: CompDTO = {} as CompDTO
+  @State advExtraData: AdvExtraData = {} as AdvExtraData
+  @State advLength: number = 0;
 
   aboutToAppear(): void {
 
     console.error('ZZZXXXXX', '--冠名广告------aboutToAppear-----')
+
+    let extraData = this.compDTO.matInfo.extraData
+    let labelDTO = JSON.parse(extraData) as AdvExtraData
+    this.advExtraData = labelDTO
+    //this.advExtraData.item = [this.advExtraData.item[0]]
+   // this.advExtraData.item[2].title ="我爱你中国我爱你中国我爱你中国我爱你中国我爱你中国我爱你中国我爱你中国我爱你中国我爱你中国我爱你中国我爱你中国我爱你中国我爱你中国我爱你中国我爱你中国"
+    this.advLength = this.advExtraData.item.length
   }
 
   aboutToDisappear(): void {
@@ -33,28 +43,160 @@ export struct CardAdvGanMiComponent {
   build() {
 
     Column() {
-      Text(this.compDTO.matInfo.advTitle)
-        .fontSize($r('app.float.font_size_17'))
-        .fontColor($r('app.color.color_222222'))
-        .maxLines(3)
-        .textOverflow({ overflow: TextOverflow.Ellipsis })// 超出的部分显示省略号。
-        .align(Alignment.Start)
+
+
+      Row() {
+        Stack() {
+          //长图
+          Image(this.advExtraData.itemTopImage)
+            .width(CommonConstants.FULL_WIDTH)
+            .aspectRatio(343 / 40)
+            .borderRadius(4)
+            .borderWidth(0.5)
+            .borderColor($r('app.color.color_0D000000'))
+
+          // 广告标签和删除功能
+          Row() {
+            Text($r('app.string.comp_advertisement'))
+              .fontSize('10fp')
+              .fontColor($r('app.color.white'))
+              .width(28)
+              .height(16)
+              .backgroundColor('#4D000000')
+              .borderRadius(3)
+              .textAlign(TextAlign.Center)
+
+            Blank()
+
+            Stack() {
+              Image($r('app.media.comp_adv_close_white'))
+                .width(9)
+                .height(9)
+                .borderRadius({
+                  topLeft: '4vp',
+                  topRight: '4vp',
+                  bottomLeft: '4vp',
+                  bottomRight: '4vp'
+                })
+            }
+            .width(18)
+            .height(14)
+            .backgroundColor('#4D000000')
+            .borderWidth(0.5)
+            .borderColor($r('app.color.white'))
+            .borderRadius(3)
+
+          }.width('100%').padding({
+            top: 8,
+            left: 8,
+            right: 8
+          })
+        }
+        .alignContent(Alignment.Top)
+        .width(CommonConstants.FULL_WIDTH)
+      }.width('100%').padding({
+        left: $r('app.float.card_comp_pagePadding_lf'),
+        right: $r('app.float.card_comp_pagePadding_lf'),
+      })
+
+
+      //
+      List({ space: 8 }) {
+
+        ForEach(this.advExtraData.item, (content: AdvExtraItemData) => {
+
+          ListItem() {
+            // 广告列表信息
+            Column() {
+
+              Image(content.image)
+                .width('100%')
+                .aspectRatio(150 / 84)
+                .borderWidth(0.5)
+                .borderColor($r('app.color.color_0D000000'))
+                .borderRadius(4)
+
+              Text(content.title)
+                .fontSize('16fp')
+                .fontColor($r('app.color.color_222222'))
+                .fontSize('15fp')
+                .maxLines(3)
+                .lineHeight(20)
+                .textOverflow({ overflow: TextOverflow.Ellipsis })
+                .width('100%')
+                .margin({ top: 8 })
+
+            }.width(this.advLength >= 3 ? 150 : this.advLength == 2 ? 210 : '100%').onClick(() => {
+
+              let matInfo: CompAdvMatInfoBean = {
+                linkUrl: content.linkUrl,
+                linkType: content.linkType
+              } as CompAdvMatInfoBean;
+              ProcessUtils.openAdvDetail(matInfo)
+
+            })
+
+          }
+
+        })
+
+      }
+      .width('100%')
+      .listDirection(Axis.Horizontal)
+      .edgeEffect(EdgeEffect.None)
+      .scrollBar(BarState.Off)
+      .contentStartOffset(this.advLength == 1 ? 0 : 16)
+      .contentEndOffset(this.advLength == 1 ? 0 : 16)
+      .margin({ top: 10, bottom: 10 })
+      .padding({
+        left: this.advLength == 1 ? 16 : 0,
+        right: this.advLength == 1 ? 16 : 0,
+      })
+
+
+      // 更多按钮
+      commonButton(this.advExtraData)
+
     }
     .width(CommonConstants.FULL_WIDTH)
     .padding({
-      left: $r('app.float.card_comp_pagePadding_lf'),
-      right: $r('app.float.card_comp_pagePadding_lf'),
       top: $r('app.float.card_comp_pagePadding_tb'),
       bottom: $r('app.float.card_comp_pagePadding_tb')
     })
-    .onClick((event: ClickEvent) => {
-      //ProcessUtils.processPage(this.contentDTO)
-    })
+
   }
 }
 
-@Extend(Text)
-function bottomTextStyle() {
-  .fontSize(12)
-  .fontColor('#B0B0B0')
+/*
+   标题样式
+ */
+@Builder
+function commonButton(advExtraData: AdvExtraData) {
+
+
+  Row() {
+    Row() {
+      Blank()
+      Text('查看更多').fontColor('#222222').fontSize('14fp')
+      Image($r('app.media.icon_comp_more_right_red')).width(16).height(16)
+      Blank()
+
+    }
+    .width('100%')
+    .backgroundColor('#F5F5F5')
+    .borderRadius(3)
+    .padding({ top: 10, bottom: 10, })
+    .onClick(() => {
+      let matInfo: CompAdvMatInfoBean = {
+        linkUrl: advExtraData.itemMore.linkUrl,
+        linkType: advExtraData.itemMore.linkType
+      } as CompAdvMatInfoBean;
+      ProcessUtils.openAdvDetail(matInfo)
+    })
+  }.width('100%').padding({
+    left: $r('app.float.card_comp_pagePadding_lf'),
+    right: $r('app.float.card_comp_pagePadding_lf'),
+
+  })
+
 }
\ No newline at end of file

 //全标题 "appStyle":"2",
 import { CompDTO, ContentDTO } from 'wdBean';
-import { CommonConstants } from 'wdConstant/Index';
+import { CommonConstants, CompStyle } from 'wdConstant/Index';
 import { ProcessUtils } from 'wdRouter';
 import { CardMediaInfo } from '../cardCommon/CardMediaInfo'
 import { CardSourceInfo } from '../cardCommon/CardSourceInfo'
+import { CardAdvBottom } from './CardAdvBottom';
 
 const TAG: string = 'Card2Component';
 
-/** 
- * @Description:    广告---长通栏广告 和 顶部长通栏广告
- * @Author:         
- * @Email:          liyubing@wondertek.com.cn
- * @CreateDate:     
- * @UpdateRemark:   更新说明
- * @Version:        1.0
+/**
+ * @Description: 广告---长通栏广告 和 顶部长通栏广告
+ * @Author:
+ * @Email: liyubing@wondertek.com.cn
+ * @CreateDate:
+ * @UpdateRemark: 更新说明
+ * @Version: 1.0
  */
 @Component
 export struct CardAdvLongImageComponent {
 
+
   @State compDTO: CompDTO = {} as CompDTO
 
+  @State haveTitle : boolean = true
+
   aboutToAppear(): void {
 
     console.error('ZZZXXXXX', '--长通栏广告 和 顶部长通栏广告------aboutToAppear-----')
+
+    this.haveTitle = this.compDTO.matInfo.advSubType === CompStyle.Card_Adv_7;
   }
 
   aboutToDisappear(): void {
@@ -33,12 +39,23 @@ export struct CardAdvLongImageComponent {
   build() {
 
     Column() {
-      Text(this.compDTO.matInfo.advTitle)
-        .fontSize($r('app.float.font_size_17'))
-        .fontColor($r('app.color.color_222222'))
-        .maxLines(3)
-        .textOverflow({ overflow: TextOverflow.Ellipsis })// 超出的部分显示省略号。
-        .align(Alignment.Start)
+
+      //新闻标题
+      if(this.haveTitle ){
+        Text(this.compDTO.matInfo.advTitle).bottomTextStyle().margin({ bottom: 8, })
+      }
+
+      //长图
+      Image(this.compDTO.matInfo.matImageUrl[0])
+        .width(CommonConstants.FULL_WIDTH)
+        .aspectRatio(343 / 96)
+        .borderRadius(4)
+        .borderWidth(0.5)
+        .borderColor($r('app.color.color_0D000000'))
+
+      CardAdvBottom().margin({
+        top: 8,
+      })
     }
     .width(CommonConstants.FULL_WIDTH)
     .padding({
@@ -48,13 +65,20 @@ export struct CardAdvLongImageComponent {
       bottom: $r('app.float.card_comp_pagePadding_tb')
     })
     .onClick((event: ClickEvent) => {
-      //ProcessUtils.processPage(this.contentDTO)
+      ProcessUtils.openAdvDetail(this.compDTO.matInfo)
     })
   }
 }
 
+/*
+   标题样式
+ */
 @Extend(Text)
 function bottomTextStyle() {
-  .fontSize(12)
-  .fontColor('#B0B0B0')
+  .fontSize('18fp')
+  .fontColor($r('app.color.color_222222'))
+  .maxLines(3)
+  .textOverflow({ overflow: TextOverflow.Ellipsis }) // 超出的部分显示省略号。
+  .align(Alignment.Start)
+  .lineHeight(25)
 }
\ No newline at end of file

@@ -62,6 +62,7 @@ export struct CardAdvSmallImageComponent {
         .borderWidth(0.5)
         .borderColor($r('app.color.color_0D000000'))
         .borderRadius(4)
+        //.alt('wwww.baidu.com')
         .alignRules({
           top: { anchor: 'title_name', align: VerticalAlign.Top },
           left: { anchor: 'title_name', align: HorizontalAlign.End },

 //全标题 "appStyle":"2",
-import { CompDTO, ContentDTO } from 'wdBean';
+import { CompDTO, ContentDTO, VideoInfoDTO } from 'wdBean';
 import { CommonConstants } from 'wdConstant/Index';
 import { ProcessUtils } from 'wdRouter';
 import { CardMediaInfo } from '../cardCommon/CardMediaInfo'
 import { CardSourceInfo } from '../cardCommon/CardSourceInfo'
+import { CardAdvBottom } from './CardAdvBottom';
 
 const TAG: string = 'Card2Component';
 
-/** 
- * @Description:    广告---视频广告
- * @Author:         
- * @Email:          liyubing@wondertek.com.cn
- * @CreateDate:     
- * @UpdateRemark:   更新说明
- * @Version:        1.0
+/**
+ * @Description: 广告---视频广告
+ * @Author:
+ * @Email: liyubing@wondertek.com.cn
+ * @CreateDate:
+ * @UpdateRemark: 更新说明
+ * @Version: 1.0
  */
 @Component
 export struct CardAdvVideoComponent {
-
   @State compDTO: CompDTO = {} as CompDTO
+  @State contentDTO: ContentDTO = {} as ContentDTO
 
   aboutToAppear(): void {
-
     console.error('ZZZXXXXX', '--视频广告------aboutToAppear-----')
+
+
+    // this.contentDTO.objectType = '1'
+    // this.contentDTO.videoInfo = { videoDuration: 1000 } as VideoInfoDTO
   }
 
   aboutToDisappear(): void {
@@ -33,12 +37,29 @@ export struct CardAdvVideoComponent {
   build() {
 
     Column() {
-      Text(this.compDTO.matInfo.advTitle)
-        .fontSize($r('app.float.font_size_17'))
-        .fontColor($r('app.color.color_222222'))
-        .maxLines(3)
-        .textOverflow({ overflow: TextOverflow.Ellipsis })// 超出的部分显示省略号。
-        .align(Alignment.Start)
+
+      //新闻标题
+      Text(this.compDTO.matInfo.advTitle).bottomTextStyle()
+      //大图
+      Stack() {
+        Image(this.compDTO.matInfo.matImageUrl[0])
+          .width(CommonConstants.FULL_WIDTH)
+          .aspectRatio(16 / 9)
+          .borderRadius(4)
+          .borderWidth(0.5)
+          .borderColor($r('app.color.color_0D000000'))
+        //播放状态+时长
+        CardMediaInfo({
+          contentDTO: this.contentDTO
+        })
+      }
+      .alignContent(Alignment.BottomEnd)
+      .width(CommonConstants.FULL_WIDTH)
+      .margin({ top: 8 })
+
+      CardAdvBottom().margin({
+        top: 8,
+      })
     }
     .width(CommonConstants.FULL_WIDTH)
     .padding({
@@ -48,13 +69,21 @@ export struct CardAdvVideoComponent {
       bottom: $r('app.float.card_comp_pagePadding_tb')
     })
     .onClick((event: ClickEvent) => {
-      //ProcessUtils.processPage(this.contentDTO)
+      ProcessUtils.openAdvDetail(this.compDTO.matInfo)
     })
   }
 }
 
+/*
+   标题样式
+ */
 @Extend(Text)
 function bottomTextStyle() {
-  .fontSize(12)
-  .fontColor('#B0B0B0')
+  .fontSize('18fp')
+  .fontColor($r('app.color.color_222222'))
+  .maxLines(3)
+  .textOverflow({ overflow: TextOverflow.Ellipsis }) // 超出的部分显示省略号。
+  .align(Alignment.Start)
+  .width('100%')
+  .lineHeight(25)
 }
\ No newline at end of file

-//全标题 "appStyle":"2",
-import { CompDTO, ContentDTO } from 'wdBean';
+import { CompDTO } from 'wdBean';
+import { AdvExtraData, AdvExtraItemData } from 'wdBean/src/main/ets/bean/adv/AdvExtraData';
+import { CompAdvMatInfoBean } from 'wdBean/src/main/ets/bean/adv/CompAdvInfoBean';
 import { CommonConstants } from 'wdConstant/Index';
 import { ProcessUtils } from 'wdRouter';
-import { CardMediaInfo } from '../cardCommon/CardMediaInfo'
-import { CardSourceInfo } from '../cardCommon/CardSourceInfo'
 
 const TAG: string = 'Card2Component';
 
-/** 
- * @Description:    广告---冠名广告
- * @Author:         
- * @Email:          liyubing@wondertek.com.cn
- * @CreateDate:     
- * @UpdateRemark:   更新说明
- * @Version:        1.0
+/**
+ * @Description: 广告---展会广告
+ * @Author:
+ * @Email: liyubing@wondertek.com.cn
+ * @CreateDate:
+ * @UpdateRemark: 更新说明
+ * @Version: 1.0
  */
 @Component
 export struct CardAdvVideoExComponent {
-
   @State compDTO: CompDTO = {} as CompDTO
+  @State advExtraData: AdvExtraData = {} as AdvExtraData
 
   aboutToAppear(): void {
 
-    console.error('ZZZXXXXX', '--冠名广告------aboutToAppear-----')
+    console.error('ZZZXXXXX', '--展会广告------aboutToAppear-----')
+
+    let extraData = this.compDTO.matInfo.extraData
+    let labelDTO = JSON.parse(extraData) as AdvExtraData
+    this.advExtraData = labelDTO
   }
 
   aboutToDisappear(): void {
 
-    console.error('ZZZXXXXX', '----冠名广告----aboutToDisappear-----')
+    console.error('ZZZXXXXX', '----展会广告----aboutToDisappear-----')
   }
 
   build() {
 
     Column() {
-      Text(this.compDTO.matInfo.advTitle)
-        .fontSize($r('app.float.font_size_17'))
-        .fontColor($r('app.color.color_222222'))
-        .maxLines(3)
-        .textOverflow({ overflow: TextOverflow.Ellipsis })// 超出的部分显示省略号。
-        .align(Alignment.Start)
+
+      Stack() {
+        //长图
+        Image(this.advExtraData.itemTopImage)
+          .width(CommonConstants.FULL_WIDTH)
+          .aspectRatio(343 / 80)
+          .borderRadius(4)
+          .borderWidth(0.5)
+          .borderColor($r('app.color.color_0D000000'))
+
+
+        Row() {
+
+          Text($r('app.string.comp_advertisement'))
+            .fontSize('10fp')
+            .fontColor($r('app.color.white'))
+            .width(28)
+            .height(16)
+            .backgroundColor('#4D000000')
+            .borderRadius(4)
+            .textAlign(TextAlign.Center)
+
+          Blank()
+
+          Stack() {
+            Image($r('app.media.comp_adv_close_white'))
+              .width(9)
+              .height(9)
+              .borderRadius({
+                topLeft: '4vp',
+                topRight: '4vp',
+                bottomLeft: '4vp',
+                bottomRight: '4vp'
+              })
+          }
+          .width(18)
+          .height(14)
+          .backgroundColor('#4D000000')
+          .borderWidth(0.5)
+          .borderColor($r('app.color.white'))
+          .borderRadius(4)
+
+        }.width('100%').padding({
+          top: 8,
+          left: 8,
+          right: 8
+        })
+      }
+      .alignContent(Alignment.Top)
+      .width(CommonConstants.FULL_WIDTH)
+
+      //
+      List({ space: 10 }) {
+
+        ForEach(this.advExtraData.item, (content: AdvExtraItemData) => {
+
+          ListItem() {
+
+            Text(content.title).fontSize('16fp').fontColor($r('app.color.color_222222')).width('100%').onClick(() => {
+              let matInfo: CompAdvMatInfoBean = {
+                linkUrl: content.linkUrl,
+                linkType: content.linkType
+              } as CompAdvMatInfoBean;
+              ProcessUtils.openAdvDetail(matInfo)
+            })
+          }
+
+        })
+
+      }.width('100%').listDirection(Axis.Vertical).margin({ top: 10, bottom: 10 })
+
+      // 更多按钮
+      commonButton(this.advExtraData)
+
     }
     .width(CommonConstants.FULL_WIDTH)
     .padding({
@@ -47,14 +118,33 @@ export struct CardAdvVideoExComponent {
       top: $r('app.float.card_comp_pagePadding_tb'),
       bottom: $r('app.float.card_comp_pagePadding_tb')
     })
-    .onClick((event: ClickEvent) => {
-      //ProcessUtils.processPage(this.contentDTO)
-    })
+
   }
 }
 
-@Extend(Text)
-function bottomTextStyle() {
-  .fontSize(12)
-  .fontColor('#B0B0B0')
+/*
+   标题样式
+ */
+@Builder
+function commonButton(advExtraData: AdvExtraData) {
+
+
+  Row() {
+    Blank()
+    Text('查看更多').fontColor('#222222').fontSize('14fp')
+    Image($r('app.media.icon_comp_more_right_red')).width(16).height(16)
+    Blank()
+
+  }
+  .width('100%')
+  .backgroundColor('#F5F5F5')
+  .borderRadius(3)
+  .padding({ top: 10, bottom: 10, })
+  .onClick(() => {
+    let matInfo: CompAdvMatInfoBean = {
+      linkUrl: advExtraData.itemMore.linkUrl,
+      linkType: advExtraData.itemMore.linkType
+    } as CompAdvMatInfoBean;
+    ProcessUtils.openAdvDetail(matInfo)
+  })
 }
\ No newline at end of file