import {
  Action,
  ContentDetailDTO,
  H5ReceiveDataExtraBean,
  H5ReceiveDataJsonBean,
  H5ReceiveDetailBean,
  ResponseBean
} from 'wdBean';
import { Logger, SPHelper, NetworkUtil, DisplayUtils } from 'wdKit';
import { SpConstants } from 'wdConstant';
import { WdWebLocalComponent, WebArticleEventHandler, WebPoolManager } from 'wdWebComponent';
import { NativeCallH5Type } from 'wdWebComponent/src/main/ets/pages/NativeCallH5Type';
import { BridgeWebViewControl } from 'wdJsBridge/Index';

const TAG: string = 'ImageAndTextWebComponent'
@Component
export struct ImageAndTextWebComponent {
  action: Action = {} as Action
  @State reload: number = 0;
  @Link isPageEnd: boolean
  @Prop @Watch('onDetailDataUpdated') contentDetailData: ContentDetailDTO [] = [] as ContentDetailDTO []
  webPoolTargetId: string = ''
  webviewControl: BridgeWebViewControl = new BridgeWebViewControl()
  private h5ReceiveAppData: H5ReceiveDetailBean = { dataSource: '2' } as H5ReceiveDetailBean
  private webPrepared = false;
  private dataPrepared = false;
  async onDetailDataUpdated() {
    Logger.debug(TAG, '详情内容已获取接口数据');
    if (this.action) {
      let contentId: string = ''
      let contentType: string = ''
      let topicId: string = ''
      let channelId: string = ''
      let compId: string = ''
      let sourcePage: string = '5'
      let creatorId = await SPHelper.default.get(SpConstants.USER_CREATOR_ID, '') || ''
      let isLogin = await SPHelper.default.get(SpConstants.USER_STATUS, '') || '0'
      let loadImageOnlyWifiSwitch = await SPHelper.default.get(SpConstants.SETTING_WIFI_IMAGE_SWITCH, '') || false
      if (this.action.params) {
        if (this.action.params.contentID) {
          contentId = this.action.params?.contentID
        }
        if (this.action.params.extra) {
          if (this.action.params.extra.contentType) {
            contentType = this.action.params.extra.contentType
          }
          if (this.action.params.extra.topicId) {
            topicId = this.action.params.extra.topicId
          }
          if (this.action.params.extra.channelId) {
            channelId = this.action.params.extra.channelId
          }
          if (this.action.params.extra.compId) {
            compId = this.action.params.extra.compId
          }
          if (this.action.params.extra.sourcePage) {
            sourcePage = this.action.params.extra.sourcePage
          }
        }

      }

      // TODO 对接user信息、登录情况
      let h5ReceiveDataExtraBean: H5ReceiveDataExtraBean = {
        creatorId: creatorId,
        cnsTraceId: '',
        isLogin: isLogin,
        loadImageOnlyWifiSwitch: loadImageOnlyWifiSwitch ? '1' : '2',
        networkStatus: Number(NetworkUtil.getNetworkType()),
        darkMode: 'light',
        fontSizes: 'normalsize'

      } as H5ReceiveDataExtraBean
      let h5ReceiveDataJsonBean: H5ReceiveDataJsonBean = {
        contentId: contentId,
        contentType: contentType
      } as H5ReceiveDataJsonBean
      h5ReceiveDataJsonBean.topicId = topicId
      h5ReceiveDataJsonBean.channelId = channelId
      h5ReceiveDataJsonBean.compId = compId
      h5ReceiveDataJsonBean.sourcePage = sourcePage
      h5ReceiveDataJsonBean.netError = '0'
      let response: ResponseBean = {} as ResponseBean
      response.data = this.contentDetailData
      // Logger.debug('ImageAndTextWebComponent', 'newsContent111111:',this.contentDetailData[0].newsContent);
      response.code = 200
      response.success = true
      h5ReceiveDataJsonBean.responseMap = response
      this.h5ReceiveAppData.dataJson = h5ReceiveDataJsonBean
      this.h5ReceiveAppData.dataExt = h5ReceiveDataExtraBean
      this.dataPrepared = true
      this.trySendData2H5()
    }

  }

  aboutToAppear(): void {
    Logger.debug(TAG, 'H5模板加载控件 aboutToAppear');

    this.webPoolTargetId = WebPoolManager.sharedInstance().takeAvaiableArticleWebTarget({
      uiContext: this.getUIContext(),
      webSrc: $rawfile("apph5/index.html"),
      webController: this.webviewControl,
      webArticleEventHandler: new WebArticleEventHandler(this.webviewControl)
    })
    this.webviewControl = WebPoolManager.sharedInstance().getWebController(this.webPoolTargetId)!
  }

  aboutToDisappear(): void {
    Logger.debug(TAG, 'H5模板加载控件 aboutToDisappear');
    WebPoolManager.sharedInstance().recycleTarget(this.webPoolTargetId)
  }

  build() {
    Column() {
      WdWebLocalComponent({
        webPoolTargetId: this.webPoolTargetId,
        webviewControl: this.webviewControl,
        reload:this.reload,
        backVisibility: false,
        onWebPrepared: this.onWebPrepared.bind(this),
        isPageEnd: $isPageEnd
      })
        .padding({top:10})
    }
  }

  private trySendData2H5() {
    if (!this.webPrepared || !this.dataPrepared) {
      return
    }
    // 数据、web组件，都准备好了，开始塞详情数据
    this.sendContentData2H5(this.h5ReceiveAppData)
  }

  private onWebPrepared() {
    Logger.debug(TAG, 'H5模板已加载，prepared');
    this.webPrepared = true
    this.trySendData2H5()
  }

  private sendContentData2H5(h5ReceiveAppData: H5ReceiveDetailBean) {
    let jsonString = JSON.stringify(h5ReceiveAppData);
    Logger.debug(TAG, '传递html数据至H5 jsCall_receiveAppData',jsonString);
    this.webviewControl.callHandle(NativeCallH5Type.jsCall_receiveAppData, jsonString, (data: string) => {
      Logger.debug(TAG, "from js data = " + data);
    })
  }
}