SingleColumnComponent.ets 2.42 KB
import { CompDTO, CompStyle, ContentDTO } from 'wdBean';
import { BreakpointConstants } from 'wdConstant';
import { BreakPointType, Logger } from 'wdKit';
import { SingleColumn01CardView, SingleColumn02CardView } from './CardView';
import { EmptyComponent } from './EmptyComponent';

const TAG = 'SingleColumn01Component';

/**
 * 单列组件:SINGLE_COLUMN
 * 支持样式:
 * 'Single_Column-01', // 大卡横屏视频:视频、直播
 * 'Single_Column-02', // 活动卡:活动
 */
@Component
export struct SingleColumnComponent {
  @StorageLink('currentBreakpoint') currentBreakpoint: string = BreakpointConstants.BREAKPOINT_XS;
  @State compDTO: CompDTO = {} as CompDTO
  private compStyle: string = CompStyle.Single_Column_01;

  aboutToAppear() {
    this.compStyle = this.compDTO.compStyle
    Logger.info(TAG, `aboutToAppear beanList: ${this.compDTO?.operDataList?.length}`);
  }

  aboutToDisappear() {
    Logger.info(TAG, 'aboutToDisappear');
  }

  onPageShow() {
    Logger.info(TAG, 'onPageShow');
  }

  onPageHide() {
    Logger.info(TAG, 'onPageHide');
  }

  onBackPress() {
    Logger.info(TAG, 'onBackPress');
  }

  build() {
    if (this.compDTO && this.compDTO?.operDataList?.length > 0) {
      List({ space: 4 }) {
        ForEach(this.compDTO?.operDataList, (item: ContentDTO, index: number) => {
          ListItem() {
            this.buildItemView(item, index)
          }
        })
      }
      .margin({ left: $r('app.float.main_margin'), right: $r('app.float.main_margin'), bottom: 8 })
      .listDirection(Axis.Vertical)
      .lanes(this.buildLanes()) // 行/列数,一列
      .scrollBar(BarState.Off)
    } else {
      EmptyComponent({ emptyHeight: 100 })
    }
  }

  public buildLanes(): number {
    return new BreakPointType({ xs: 1, sm: 1, md: 2, lg: 2 }).getValue(this.currentBreakpoint)
  }

  /**
   * 组件item
   * @param programmeBean
   * @param index
   */
  @Builder
  buildItemView(item: ContentDTO, index: number) {
    if (this.compStyle == CompStyle.Single_Column_01) {
      SingleColumn01CardView({
        item: item,
        index: index
      })
    } else if (this.compStyle == CompStyle.Single_Column_02) {
      SingleColumn02CardView({
        item: item,
        index: index
      })
      // } else if (this.compStyle == CompStyle.Single_Column_03) {
      // SingleColumn03CardView({
      //   item: item,
      //   index: index
      // })
    } else {
      Text("尚未实现");
    }
  }
}