import { Action, H5ReceiveDetailBean, ContentDetailDTO, InteractDataDTO } from 'wdBean';
import { WdWebComponent } from 'wdWebComponent';
import { CommonConstants } from 'wdConstant'
import { BridgeWebViewControl } from 'wdJsBridge/Index';
import { NativeCallH5Type } from 'wdWebComponent/src/main/ets/pages/NativeCallH5Type';
import { OperRowListView } from './view/OperRowListView';
import DetailViewModel from '../viewmodel/DetailViewModel';
import { publishCommentModel } from '../components/comment/model/PublishCommentModel';
import { EmptyComponent } from '../components/view/EmptyComponent';
import { NetworkUtil, WindowModel } from 'wdKit';
import { viewBlogItemInsightIntentShare } from '../utils/InsightIntentShare'
import { common } from '@kit.AbilityKit';
import { PageRepository } from '../repository/PageRepository';
import { CommentDialogView } from './CommentDialogView';
import { faceDetector } from '@kit.CoreVisionKit';
import { channelSkeleton } from './skeleton/channelSkeleton';

const TAG: string = 'SpacialTopicPageComponent'

//专题详情页
@Component
export struct SpacialTopicPageComponent {
  webviewControl: BridgeWebViewControl = new BridgeWebViewControl()
  scroller: Scroller = new Scroller();
  action: Action = {} as Action
  @State webUrl: string = '';
  @State subjectData: string = '';
  @State index: number = 0
  @State currentIndex: number = 0
  @State isPageEnd: boolean = false
  @State showCommentList: boolean = false
  @State interactData: InteractDataDTO = {} as InteractDataDTO
  @Prop reload: number = 0;
  @Provide contentDetailData: ContentDetailDTO = {} as ContentDetailDTO
  private h5ReceiveAppData: H5ReceiveDetailBean = { dataSource: '2' } as H5ReceiveDetailBean
  private webPrepared = false;
  private dataPrepared = false;
  @State publishCommentModel: publishCommentModel = new publishCommentModel()
  @State operationButtonList: string[] = ['comment', 'collect', 'share']
  @State bottomSafeHeight: number = AppStorage.get<number>('bottomSafeHeight') || 0
  @State isNetConnected: boolean = true
  @Provide topSafeHeight: number = AppStorage.get<number>('topSafeHeight') || 0
  @State showComment: boolean = false
  private trySendData2H5() {
    if (!this.webPrepared || !this.dataPrepared) {
      return
    }
    // 数据、web组件，都准备好了，开始塞详情数据
    this.sendContentData2H5(this.h5ReceiveAppData)
  }

  private onWebPrepared() {
    this.webPrepared = true
    this.trySendData2H5()
  }

  private sendContentData2H5(h5ReceiveAppData: H5ReceiveDetailBean) {
    this.webviewControl.callHandle(NativeCallH5Type.jsCall_receiveAppData,
      JSON.stringify(h5ReceiveAppData), (data: string) => {
      })
  }

  //意图上报
  private viewBlogInsightIntentShare(){
    let context = getContext(this) as common.UIAbilityContext;
    viewBlogItemInsightIntentShare(context,this.contentDetailData)
  }
  async getWebviewPageData (){
    let pageId = this.action.params?.extra?.pageId
    let relId: string = ''
    let relType: string = ''
    let contentId: string = ''
    if (this.action && this.action.params) {
      if (this.action.params.contentID) {
        contentId = this.action.params.contentID;
      }
      if (this.action && this.action.params && this.action.params.extra) {
        if (this.action.params.extra.relId) {
          relId = this.action.params.extra.relId;
        }
        if (this.action.params.extra.relType) {
          relType = this.action.params.extra.relType
        }
      }
    }
    if(pageId){
      // let pageInfoMsg = await PageRepository.fetchMorningEveningPageInfo(pageId)
      // let pageCompInfoMsg = await PageRepository.fetchMorningEveningCompInfo(Number(pageId), groupId, refreshTime, topicId, 1, 20)
      // let res = {
      //   dataJson: {
      //     pageInfoResponseMap: pageInfoMsg,
      //     compInfoResponseMap: pageCompInfoMsg,
      //   },
      // }
    }
  }


  private async getDetail() {
    this.isNetConnected = NetworkUtil.isNetConnected()
    let contentId: string = ''
    let relId: string = ''
    let relType: string = ''
    if (this.action && this.action.params) {
      if (this.action.params.contentID) {
        contentId = this.action.params.contentID;
      }
      if (this.action && this.action.params && this.action.params.extra) {
        if (this.action.params.extra.relId) {
          relId = this.action.params.extra.relId;
        }
        if (this.action.params.extra.relType) {
          relType = this.action.params.extra.relType
        }
      }
      let pageId = this.action.params.extra?.pageId
      console.log('pageIdpageId',pageId)
      if(pageId){
        let pageInfoMsg = await PageRepository.fetchMorningEveningPageInfo(pageId)
        let detailBeans = await DetailViewModel.getDetailPageData(relId, contentId, relType)
        if (detailBeans?.length > 0) {
          this.contentDetailData = JSON.parse(JSON.stringify(detailBeans[0]));
          this.viewBlogInsightIntentShare()
          // if (this.contentDetailData[0]?.openComment) {
          this.publishCommentModel.targetId = String(this.contentDetailData?.newsId || '')
          this.publishCommentModel.targetRelId = String(this.contentDetailData?.reLInfo?.relId || '')
          this.publishCommentModel.targetTitle = this.contentDetailData?.newsTitle
          this.publishCommentModel.targetRelType = String(this.contentDetailData?.reLInfo?.relType || '')
          this.publishCommentModel.targetRelObjectId = String(this.contentDetailData?.reLInfo?.relObjectId || '')
          this.publishCommentModel.keyArticle = String(this.contentDetailData?.keyArticle || '')
          this.publishCommentModel.targetType = String(this.contentDetailData?.newsType || '')
          this.publishCommentModel.visitorComment = String(this.contentDetailData?.visitorComment || '')

          // }
          this.subjectData = 'dasdasdadas'

          //TODO
          // this.trySendData2H5()
        }
        if(pageInfoMsg && pageInfoMsg.data){
          this.contentDetailData.openComment = Number(pageInfoMsg.data.topicInfo?.commentFlag)
          this.contentDetailData.commentDisplay = Number(pageInfoMsg.data.topicInfo?.commentShowFlag)
          if(pageInfoMsg.data.topicInfo?.shareOpen === 1){
            if (!this.operationButtonList.includes('share')) {
              this.operationButtonList.push('share');
            }
          }else{
            this.operationButtonList = this.operationButtonList.filter(e =>e !== 'share')
          }
        }

        console.log('contentDetailData',this.contentDetailData)
      }
    }
  }

  build() {
    Column() {
      Stack({ alignContent: Alignment.Bottom }) {
        Column() {
          Text(this.contentDetailData?.newsTitle)
          .backgroundColor(Color.White)
          .width('100%')
          .height(40)
          .fontSize(18)
          .textAlign(TextAlign.Center)
          .fontWeight(500)
          .visibility(this.action?.params?.backVisibility && this.isPageEnd ? Visibility.Visible : Visibility.None)
          if(this.subjectData.length > 0){
            WdWebComponent({
              webviewControl: this.webviewControl,
              webUrl: this.webUrl,
              reload: this.reload,
              onWebPrepared: this.onWebPrepared.bind(this),
              isPageEnd: $isPageEnd,
              subjectData: this.subjectData
            })
          }
        }
        .width(CommonConstants.FULL_WIDTH)
        .height(CommonConstants.FULL_HEIGHT)
        .padding({ bottom: this.action?.params?.backVisibility ? 115 : 75 })

        if (!this.isNetConnected) {
          EmptyComponent({
            emptyType: 1,
            emptyButton: true,
            retry: () => {
              this.getDetail()
            }
          }).padding({ bottom: 200 })
        } else {
          if (!this.isPageEnd) {
            channelSkeleton().padding({ top:`${this.topSafeHeight}px`,bottom: this.bottomSafeHeight })
          }
        }
        //底部交互区
        OperRowListView({
          contentDetailData: this.contentDetailData,
          publishCommentModel: this.publishCommentModel,
          operationButtonList: this.operationButtonList,
          styleType: 1,
          onCommentIconClick:()=>{
            this.showCommentList = true
          }
        })
        //全部评论
        CommentDialogView({
          index: $index,
          currentIndex: $currentIndex,
          showCommentList: $showCommentList,
          publishCommentModel: $publishCommentModel,
          interactData: $interactData,
        }).visibility(this.showComment?Visibility.Visible:Visibility.Hidden)
      }
    }.width(CommonConstants.FULL_WIDTH).height(CommonConstants.FULL_HEIGHT)
  }

  aboutToAppear() {
    if (!this.action?.params?.backVisibility) {
      // WindowModel.shared.setWindowLayoutFullScreen(true)
    }
    this.webUrl = this.action?.params?.url || ''
    this.getDetail()
  }

  aboutToDisappear() {
    if (!this.action?.params?.backVisibility) {
      // WindowModel.shared.setWindowLayoutFullScreen(false)
    }
  }
}