import { ContentDTO } from 'wdBean/Index'
import { LazyDataSource, UserDataLocal } from 'wdKit/Index'
import { HttpUrlUtils } from 'wdNetwork/Index'
import SearcherAboutDataModel from '../../model/SearcherAboutDataModel'
import { SearchSuggestRequestItem } from '../../viewmodel/SearchSuggestRequestItem'
import { CardParser } from '../CardParser'
import { EmptyComponent } from '../view/EmptyComponent'
import { SearchResultContentComponent } from './SearchResultContentComponent'

const TAG = "SearchResultComponent"

/**
 * 搜索结果
 * 搜索结果为null（空布局 + 为你推荐）
 */
@Component
export struct SearchResultComponent {
  @Prop count: string[]
  @Prop searchText: string
  @Prop isGetRequest:boolean = false;
  @State currentIndex: number = 0
  private controller: TabsController = new TabsController()
  fontColor: string = '#999999'
  selectedFontColor: string = '#000000'
  @State data: LazyDataSource<ContentDTO> = new LazyDataSource();
  @State suggest_count: number = 0;
  @State isLoading: boolean = false
  scroller: Scroller = new Scroller()

  aboutToAppear(): void {
    if (this.count.length === 0 && this.isGetRequest == true) {
      this.getSuggestData()
    }
  }

  getSuggestData() {
    this.isLoading = true

    let request: SearchSuggestRequestItem = new SearchSuggestRequestItem(2, "", "", HttpUrlUtils.getImei(), UserDataLocal.userId, 8, "")

    SearcherAboutDataModel.getSearchSuggestData(request, getContext(this)).then((value) => {
      value.forEach((item) => {
        this.data.push(item)
      })
      this.data.notifyDataReload()
      this.suggest_count = this.data.totalCount()
      this.isLoading = false
    })
  }

  build() {
    Column() {
      if (this.count != null && this.count.length === 0 && this.isGetRequest == true) {
        List() {
          ListItem() {
            //缺省图
            EmptyComponent({emptyType:4})
              .height('612lpx')
              .width('100%')
          }
          if(this.suggest_count > 0){
            ListItem() {
              Row() {
                Image($r('app.media.search_suggest_icon'))
                  .width('6lpx')
                  .height('31lpx')
                  .objectFit(ImageFit.Cover)
                  .interpolation(ImageInterpolation.High)
                  .margin({ right: '10lpx' })
                Text("为你推荐")
                  .textAlign(TextAlign.Start)
                  .fontWeight('600lpx')
                  .fontSize('33lpx')
                  .lineHeight('46lpx')
                  .fontColor($r('app.color.color_222222'))
              }.height('84lpx')
              .padding({ left: '31lpx', right: '31lpx' })
              .width('100%')
              .alignItems(VerticalAlign.Center)
            }
          }

          LazyForEach(this.data, (item: ContentDTO, index: number) => {
            ListItem() {
              Column() {
                CardParser({contentDTO:item})
                if (index != this.data.totalCount() - 1) {
                  Divider()
                    .width('100%')
                    .height('1lpx')
                    .color($r('app.color.color_F5F5F5'))
                    .strokeWidth('1lpx')
                }
              }
            }
          })
        }
        .cachedCount(6)
        .edgeEffect(EdgeEffect.None)
        .scrollBar(BarState.Off)
        .height('100%')
        .onReachEnd(() => {
          if (!this.isLoading) {
            this.getSuggestData()
          }
        })
      } else {
        Tabs({ barPosition: BarPosition.Start, controller: this.controller }) {
          ForEach(this.count, (item: string, index: number) => {
            TabContent() {
              SearchResultContentComponent({ keywords: this.searchText, searchType: item })
            }.tabBar(this.TabBuilder(index, item))
          }, (item: string, index: number) => index.toString())
        }
        .vertical(false)
        .barMode(BarMode.Fixed)
        .barWidth('100%')
        .barHeight('84lpx')
        .animationDuration(0)
        .onChange((index: number) => {
          this.currentIndex = index
        })
        .width('100%')
        .layoutWeight(1)
      }
    }.width('100%')
    .margin({ top: '12lpx' })
  }

  @Builder
  TabBuilder(index: number, item: string) {
    Stack() {
      Text(item)
        .height('38lpx')
        .fontSize('33lpx')
        .fontWeight(this.currentIndex === index ? 600 : 400)
        .fontColor(this.currentIndex === index ? this.selectedFontColor : this.fontColor)
        .lineHeight('38lpx')

      if (this.currentIndex === index) {
        Divider()
          .width('31lpx')
          .height('4lpx')
          .color('#ED2800')
          .strokeWidth('4lpx')
          .margin({ top: '50lpx' })
          .id("divTag")
      }
    }.onClick(() => {
      this.currentIndex = index
      this.controller.changeIndex(this.currentIndex)
    })
    .height('100%')
    .margin({ right: '9lpx' })
    .padding({ left: '31lpx', right: index === this.count.length - 1 ? "31lpx" : "0lpx" })
  }
}