import { BottomNavi, CommonConstants, SpConstants } from 'wdConstant';
import { BreakpointSystem, Logger, SPHelper, StringUtils } from 'wdKit';
import PageViewModel from '../../viewmodel/PageViewModel';
import storageStatistics from "@ohos.file.storageStatistics";
import { BusinessError } from '@ohos.base';
import router from '@ohos.router';
import { WDRouterPage, WDRouterRule } from 'wdRouter';
import { Params } from 'wdBean';
// import { common } from '@kit.AbilityKit';
import fs from '@ohos.file.fs';
import { CustomCacheDialog } from './CustomCacheDialog';
import { MineSettingDatasModel } from '../../model/MineSettingDatasModel';
import { MineMainSettingFunctionItem } from '../../viewmodel/MineMainSettingFunctionItem';
import common from '@ohos.app.ability.common';
import dataPreferences from '@ohos.data.preferences';
import { TitleBackComponent } from './TitleBackComponent';
import { MyCustomDialog } from '../reusable/MyCustomDialog';
import { TrackingButton, TrackConstants } from 'wdTracking/Index';
import { JSON } from '@kit.ArkTS';
import { HttpUtils } from 'wdNetwork/Index';

@Component
export struct MineSettingComponent {
  // @State listData: Array<string | Array<string>> = new Array();
  @State listData: Array<MineMainSettingFunctionItem> = new Array;
  @State privacySwitch: boolean = false
  @State cacheSize: number = 0
  @State accountState:boolean=false
  preferences: dataPreferences.Preferences | null = null;
  @StorageProp('currentBreakpoint') @Watch("currentChanged")currentBreakpoint: string = 'sm';
  private breakpointSystem = new BreakpointSystem();
  @State percent:number = 1

  currentChanged(){
    if(this.currentBreakpoint == "md" || this.currentBreakpoint == "lg"){
      this.percent = 0.7
    }else {
      this.percent = 1
    }
  }

  dialogController: CustomDialogController = new CustomDialogController({
    builder: MyCustomDialog({
      cancel: () => {
      },
      confirm: () => {
        this.deleteCache()
      },
      title: "清理缓存",
      tipValue:"是否确认清理此App的缓存",
      tipShow:true,
      leftTextColor:$r('app.color.color_333333')
    }),
    autoCancel: true,
    alignment: DialogAlignment.Center,
    customStyle: true
  })
  aboutToAppear() {
    this.breakpointSystem.register();
    this.currentChanged()
    // 获取设置页面数据
    this.getSettingPageData()

    this.getCacheSize()

    this.getAccountState()

    this.addLoginStatusObserver()

  }

  aboutToDisappear(): void {
    this.breakpointSystem.unregister();
  }

  async getAccountState(){
    let userId=await SPHelper.default.get(SpConstants.USER_ID,'') as string
    if(userId==''){
      this.accountState=false
    }else {
      this.accountState=true
    }
  }

  async getSettingPageData() {
    let oldList = MineSettingDatasModel.getMineMainSettingFunctionItemData();
    if (!HttpUtils.isLogin()) {
      this.listData = oldList.slice(1,oldList.length)
    } else {
      this.listData = oldList;
    }

  }

  build() {
    Column(){
      TitleBackComponent({title:"设置"})
      this.settingList()
    }.height('100%').backgroundColor(Color.White)
  }

  // 页面布局
  @Builder settingList() {
    Column() {
      List() {
        // 循环渲染ListItemGroup，contactsGroups为多个分组联系人contacts和标题title的数据集合
        ForEach(this.listData, (item: MineMainSettingFunctionItem, index: number) => {
          ListItem() {
            Column(){
              Column(){
                if (item.type == 0) {
                  this.getArrowCell(item,index)
                } else if (item.type == 1) {
                  this.getSwitchCell(item,index)
                }
              }
              .margin({
                left: 16,
                right: 16
              })
              if(index === this.listData.length - 2) {
                Divider()
                  .color('#f0f0f0')
                  .strokeWidth(5)
              } else {
                Divider()
                  .color('#f0f0f0')
                  .strokeWidth(1)
                  .margin({
                    left: 16,
                    right: 16
                  })
              }
            }
          }
        })
      }.onScrollFrameBegin((offset, state) => {
        return { offsetRemain: 0 }
      })
    }
    .backgroundColor(Color.White)
  }

  @Builder itemHead(text: string) {
    // 列表分组的头部组件，对应联系人分组A、B等位置的组件
    if (text.length > 0) {
      Row()
        .width('100%')
        .height(10)
        .backgroundColor(0xf0f0f0)
    }
  }

  // 右侧开关cell
  @Builder getSwitchCell(item:MineMainSettingFunctionItem, index:number) {
    Column() {
      Row() {
        // 左侧logo和标题
        Row() {
          // 判断有没有图片
          if (0) {
            Image('https://pic.rmb.bdstatic.com/e182cf67c341d1128d2a6cc05886bf62.jpeg@s_0,h_2000')
              .height(20)
              .width(20)
              .margin({ right: 16 })

            Text(`${item.title}`)
              .lineHeight(20)
              .fontColor('#222222')
              .fontSize(15)
              .fontWeight(400)
              .fontFamily('PingFang SC-Regular')
          } else {
            Text(`${item.title}`)
              .lineHeight(20)
              .fontColor('#222222')
              .fontSize(15)
              .fontWeight(400)
              .fontFamily('PingFang SC-Regular')
          }
        }.width('60%')

        // 右侧文案和右箭头
        Row() {
          Toggle({ type: ToggleType.Switch, isOn: item.switchState })
            .height(30)
            .width(50)
            .selectedColor("#ED2800")
            .onChange((isOn: boolean) => {
              // Logger.debug("SPHelper", "数据 ： " + JSON.stringify(item))
              if(item.itemType=='push_switch'){
                trackButtonClick("settingPagePushSwitch")
                //推送
                SPHelper.default.save(SpConstants.SETTING_PUSH_SWITCH,isOn)
              }else if(item.itemType=='wifi_switch'){
                trackButtonClick("settingPageOnlyWifiNetworkLoadPicture")
                //wifi 图片
                SPHelper.default.save(SpConstants.SETTING_WIFI_IMAGE_SWITCH,isOn)
              }else if(item.itemType=='video_switch'){
                trackButtonClick("settingPageAutomaticallyPlayVideoOnWifiNetwork")
                //wifi 视频
                SPHelper.default.save(SpConstants.SETTING_WIFI_VIDEO_SWITCH,isOn)
              }else if(item.itemType=='suspensionState_switch'){
                trackButtonClick("settingPagePlayerFloatingWindowSwitchClick")
                //悬浮窗
                SPHelper.default.save(SpConstants.SETTING_SUSPENSION_SWITCH,isOn)
              }
            })
        }
        .width('40%')
        .justifyContent(FlexAlign.End)

      }
      .alignItems(VerticalAlign.Center)
      .justifyContent(FlexAlign.SpaceBetween)
    }
    .height(56)
    .justifyContent(FlexAlign.Center)
    .alignItems(HorizontalAlign.Center)
  }

  // 右文字+箭头cell
  @Builder getArrowCell(item:MineMainSettingFunctionItem, index:number) {
    Column() {
      Row() {
        // 左侧logo和标题
        Row() {
          Text(`${item.title}`)
            .lineHeight(20)
            .fontColor('#222222')
            .fontSize(15)
            .fontWeight(400)
            .fontFamily('PingFang SC-Regular')
        }
        .width('60%')

        // 右侧文案和右箭头
        Row() {
          Text((item.itemType=='clear_cache') ? this.cacheSize.toFixed(2) + 'MB' : '')
            .fontColor('#999999')
            .maxLines(1)
            .lineHeight(18)
            .fontSize(14)
            .fontWeight(400)
            .fontFamily('PingFang SC-Regular')
          Image($r('app.media.mine_user_arrow_2'))
            .width(14)
            .height(14)
            .objectFit(ImageFit.Auto)
            .interpolation(ImageInterpolation.High)
            .margin({
              left: 5
            })
        }
        .width('40%')
        .justifyContent(FlexAlign.End)

      }
      .alignItems(VerticalAlign.Center)
      .justifyContent(FlexAlign.SpaceBetween)

    }
    .height(56)
    .justifyContent(FlexAlign.Center)
    .alignItems(HorizontalAlign.Center)
    .onClick(() => {
      if (item.itemType == 'account') {
        trackButtonClick("settingPageAccountManagement")
        let params: Params = {
          pageID: 'AccountAndSecurityLayout'
        }
        WDRouterRule.jumpWithPage(WDRouterPage.settingPage, params)
      } else if (item.itemType == 'private_setting') {
        WDRouterRule.jumpWithPage(WDRouterPage.privacySettingPage)
        trackButtonClick("settingPagePrivacySettings")
      } else if (item.itemType == 'clear_cache') {
        trackButtonClick("settingPageClearCache")
        this.dialogController.open()
      }
    })

  }

  //删除缓存
  deleteCache() {
    let context = getContext(this) as common.UIAbilityContext
    let application = context.getApplicationContext();
    let appPath = application.cacheDir
    // Logger.debug("MineSettingComponent", appPath)
    fs.rmdir(appPath).then(() => {
      this.getCacheSize()
    })
    let path = context.cacheDir
    // Logger.debug("MineSettingComponent", path)
    fs.rmdir(path).then(() => {
      this.getCacheSize()
    })
  }

  getCacheSize() {
    // 获取缓存数据
    storageStatistics.getCurrentBundleStats((err: BusinessError, bundleStats: storageStatistics.BundleStats) => {
      if (err) {
        // console.error(`Invoke getCurrentBundleStats failed, code is ${err.code}, message is ${err.message}`);
      } else {
        this.cacheSize = bundleStats.cacheSize / 1024.00 / 1024.00;
      }
    });
  }

  async addLoginStatusObserver(){
    this.preferences = await SPHelper.default.getPreferences();
    let observer = (key: string) => {
      if(key == SpConstants.USER_ID){
        this.getSettingPageData()
      }
    }
    this.preferences.on('change', observer);
  }

  calcHeight(value:number): number{
    return value * this.percent
  }
}

function trackButtonClick(buttonName: string){
  TrackingButton.click(buttonName, TrackConstants.PageName.Setting, TrackConstants.PageName.Setting)
}