import { getOrderList, getOrderSource, getOrderState, getRecordList } from '../api/originalRecords'
import { recordParams, orderParams, orderTest, orderRow, recordTest, recordRow } from  '../api/recordsType'
import { quarterType, quarterTest } from '../api/options/optionsType'
import { getCompanyWallet, getPay, beanType } from '../api/user'
import { companyWalletTest, companyWalletRow  } from '../api/userType'
import preferencesUtils from '../utils/preferences'
import { AxiosResponse } from '@ohos/axios'
import orderItem from '../components/orderItem'
import { router } from '@kit.ArkUI'
import FilterOrderDialog from '../dialog/FilterOrderDialog'
import FilterRecordDialog from  '../dialog/FilterRecordDialog'


let companyId = preferencesUtils.get('XF_COMPANY_ID', '') as number
@Entry
@Component
struct MyWallet {
  @State params: orderParams = {
    pageNum: 1,
    pageSize: 10,
    companyId: companyId
  }
  @State recordParams: recordParams = {
    pageNum: 1,
    pageSize: 10,
    companyId: companyId
  }
  @State searchKey: string = ''
  @State sourceList: quarterType[] = []
  @State stateList: quarterType[] = []
  private controller: TabsController = new TabsController()
  @State currentIndex: number = 0
  @State searchTip: string = '请输入订单编号'
  @State totalAll: number = 0
  @State orderList: orderRow[] = []
  @State recordList: recordRow[] = []
  @State recordTotal: number = 0
  @State loadingText: string = '点击加载更多'
  @State loadingText2: string = '点击加载更多'
  @State walletData: companyWalletRow | null = null
  @State isShowPay: boolean = false

  getList = async () => {
    const personRes: AxiosResponse<orderTest> = await getOrderList(this.params)
    this.orderList = personRes.data.rows
    this.totalAll = personRes.data.total
  }

  getRecordData = async () => {
    const personRes: AxiosResponse<recordTest> = await getRecordList(this.recordParams)
    this.recordList = personRes.data.rows
    this.recordTotal = personRes.data.total
  }
  // 获取支付来源列表
  getSourceList = async () => {
    const sourceRes: AxiosResponse<quarterTest> = await getOrderSource()
    this.sourceList = sourceRes.data.data
  }
  // 获取订单状态列表
  getStateList = async () => {
    const stateRes: AxiosResponse<quarterTest> = await getOrderState()
    this.stateList = stateRes.data.data
  }

  // 获取报告豆余额
  getWalletInfo = async () => {
    const walletInfo: AxiosResponse<companyWalletTest> = await getCompanyWallet({pageNum: 1, pageSize: 10, companyId: Number(companyId)})
    this.walletData = walletInfo.data.rows[0]
  }

  async aboutToAppear(){
    Promise.all([
      this.getList(),
      this.getRecordData(),
      this.getSourceList(),
      this.getStateList(),
      this.getWalletInfo()
    ])
  }
  // 订单查询筛选
  dialogOrderController: CustomDialogController = new CustomDialogController({
    builder: FilterOrderDialog({
      params: this.params,
      sourceList: this.sourceList,
      stateList: this.stateList,
      confirm: () => {
        this.getList()
      },
      reset: () => {
        this.getList()
        this.searchKey = ''
      }
    }),
    alignment: DialogAlignment.Center,
    customStyle: false,
    cornerRadius: 10
  })

  // 消费记录查询筛选
  dialogRecordController: CustomDialogController = new CustomDialogController({
    builder: FilterRecordDialog({
      recordParams: this.recordParams,
      confirm: () => {
        this.getRecordData()
      },
      reset: () => {
        this.getRecordData()
        this.searchKey = ''
      }
    }),
    alignment: DialogAlignment.Center,
    customStyle: false,
    cornerRadius: 10
  })

  // 加载更多订单数据
  private async loadMoreData(){
    if(this.params.pageSize >= this.totalAll) {
      this.loadingText = '已加载全部数据'
    }else {
      this.params.pageSize += 10
      await this.getList()
    }
  }

  // 加载更多消耗数据
  private async loadMoreRecordData(){
    if(this.recordParams.pageSize >= this.recordTotal) {
      this.loadingText2 = '已加载全部数据'
    }else {
      this.recordParams.pageSize += 10
      await this.getRecordData()
    }
  }

  build() {
    Column(){
      // 顶部搜索
      Row(){
        Image($r('app.media.back_light')).width(20).onClick(() => {
          router.back()
        })
        Search({ placeholder: this.searchTip, value: $$this.searchKey })
          .searchButton('搜索', {
            fontSize: 12
          })
          .width('95%')
          .height(30)
          .backgroundColor('#fff')
          .borderWidth(1)
          .placeholderColor(Color.Grey)
          .placeholderFont({ size: 12, weight: 400 })
          .textFont({ size: 12, weight: 400 })
          .layoutWeight(1)
          .onChange((value: string) => {
            this.currentIndex == 0 ? this.params.orderNo = value : this.recordParams.reportNo = value
          })
          .onSubmit(() => {
            this.currentIndex == 0 ? this.getList() : this.getRecordData()
          })
        Row(){
          Image($r('app.media.filter')).width(20).onClick(() => {
            this.currentIndex == 0 ? this.dialogOrderController.open() : this.dialogRecordController.open()
          })
        }.width(40).padding({left:5, right: 5}).justifyContent(FlexAlign.SpaceAround)
      }.padding({left: 5, right: 5})
      // 我的余额
      Row(){
        Column({space: 10}){
          Text('余额（豆）').fontSize(14).fontColor('#fff')
          Text(this.walletData?.bean.toString()).fontSize(24).fontColor('#fff').fontWeight(600).fontStyle(FontStyle.Italic)
          Text('开票信息').padding({top: 5, bottom: 5, left: 15, right: 15})
            .backgroundColor('#fff').borderRadius(30).fontSize(14).fontColor('#13ce66')
            .onClick(() => {
              router.pushUrl({
                url: 'pages/BillingInformation'
              })
            })
        }.height(150).justifyContent(FlexAlign.Center).padding(20)
        Column(){
          Text('充值').borderWidth(2).borderColor('#fff').borderRadius(30)
            .padding({top: 5, bottom: 5, left: 15, right: 15}).fontSize(14).fontColor('#fff')
            .onClick(() => {
              router.pushUrl({
                url: 'pages/Recharge'
              })
            })
        }.height(150).alignItems(HorizontalAlign.Center).padding(20)
        .visibility(this.isShowPay ? Visibility.Visible : Visibility.None)
      }.height(150).borderRadius(10).backgroundColor('#13ce66')
      .width('100%').justifyContent(FlexAlign.SpaceBetween)
      // 订单导航
      Tabs({ barPosition: BarPosition.Start, index: this.currentIndex, controller: this.controller }) {
        TabContent() {
          List(){
            ForEach(this.orderList, (item: orderRow) => {
              ListItem(){
                orderItem({
                  orderInfo: item,
                  sourceList: this.sourceList,
                  stateList: this.stateList
                })
              }
            })
            ListItem(){
              Row({space: 5}){
                Text().width(20).height(1).backgroundColor('#999')
                Text(this.loadingText).fontSize(12).fontColor('#999')
                Text().width(20).height(1).backgroundColor('#999')
              }.width('100%').padding({top: 10, bottom: 10}).justifyContent(FlexAlign.Center)
              .onClick(async () => {
                this.loadMoreData()
              })
            }.width('100%')
          }.height('100%').width('100%')
        }.tabBar('充值订单')
        TabContent() {
          List(){
            ForEach(this.recordList, (item: recordRow) => {
              ListItem(){
                Row(){
                  Column({space: 10}){
                    Text(`原始记录编号：${item.reportNo}`).fontSize(14).fontColor('#000').fontWeight(600)
                    Text(`时间：${item.createTime}`).fontSize(12).fontColor('#999')
                  }.alignItems(HorizontalAlign.Start)
                  Text(`-${item.costBean}`).fontStyle(14).fontStyle(FontStyle.Italic).fontColor('#ff4949').fontWeight(600)
                }.padding({top: 20, bottom: 20, left: 10, right: 10}).width('100%').justifyContent(FlexAlign.SpaceBetween)
                .border({width: {bottom: 1}, color: '#eee'}).width('100%')
              }
            })
            ListItem(){
              Row({space: 5}){
                Text().width(20).height(1).backgroundColor('#999')
                Text(this.loadingText2).fontSize(12).fontColor('#999')
                Text().width(20).height(1).backgroundColor('#999')
              }.width('100%').padding({top: 10, bottom: 10}).justifyContent(FlexAlign.Center)
              .onClick(async () => {
                this.loadMoreRecordData()
              })
            }.width('100%')
          }.height('100%').width('100%')
        }.tabBar('消耗记录')
      }
      .vertical(false)
      .barMode(BarMode.Fixed)
      .onChange((index: number) => {
        // currentIndex控制TabContent显示页签
        this.currentIndex = index
        this.searchTip = index == 0 ? '请输入订单编号' : '请输入【原始记录编号】'
      })
      .layoutWeight(1)
    }.height('100%').width('100%').padding(10)
  }
}