
import { bundleManager } from '@kit.AbilityKit';
import { router } from '@kit.ArkUI';
import { YTAvoid } from '../utils/YTAvoid';


@Component
export struct About {
  @State content: string = '';
  @State isAgree: boolean = false
  @StorageProp(YTAvoid.SAFE_BOTTOM_KEY) safeBottom: number = 0
  ICPRecordNumber: string = '19019164号-5A'
  listData: string[] = ['用户协议', '隐私政策']
  @State versionName: string = ''

  async aboutToAppear() {
    const res = await bundleManager.getBundleInfoForSelf(bundleManager.BundleFlag.GET_BUNDLE_INFO_DEFAULT)
    this.versionName = res.versionName
  }

  build() {
    Column() {

      Row() {
        Column(){

        }.width(24)
        .height(24)
        // Image($r('app.media.ic_back'))
        //   .width(24)
        //   .margin({ left: 16 })
        //   .onClick(()=>{
        //     // yTRouter.routerBack()
        //
        //   })
        Text('关于我们')
        Column(){

        }.width(24)
        .height(24)
      }
      .width('100%')
      .justifyContent(FlexAlign.SpaceBetween)
      .height(44)
      Column() {
        Image($r('app.media.icon'))
          .width(100)
          .margin({ bottom: 16 })
        Text('版本号:' + this.versionName)
          .margin({ bottom: 8 })
        Text('ICP备案号:' + this.ICPRecordNumber)
          .margin({ bottom: 20 })
          .fontSize(12)
          .fontColor(Color.Gray)
        List({ space: 25 }) {
          ForEach(this.listData, (item: string, index) => {
            ListItem() {
              Row() {
                Text(item).fontSize(13)
                  .fontColor(Color.Black)
                Blank()
                Image($r('app.media.arrow_right')).width('24').height('24').margin({ right: 10 })
              }.width('100%')
              .onClick(() => {
                switch (index) {
                  case 0:
                    router.pushUrl({
                      url:'pages/UserAgreementPage'
                    })

                    break;
                  case 1:
                    router.pushUrl({
                      url:'pages/PrivacyPage'
                    })

                    break;
                }

              })
            }
          }, (item: string) => item)

          ListItem() {
            Row() {
              Text('个性化推荐').fontSize(13)
                .fontColor(Color.Black)
              Blank()
              Row() {
                Text()
                  .height('100%')
                  .aspectRatio(1)
                  .backgroundColor(Color.White)
                  .borderRadius(20)
              }
              .padding(1)
              .alignSelf(ItemAlign.End)
              .width(39)
              .aspectRatio(2)
              .borderRadius(20)
              .justifyContent(this.isAgree ? FlexAlign.End : FlexAlign.Start)
              .backgroundColor(this.isAgree ? Color.Brown : '#D9D9D9')
              .onClick(() => {
                animateTo({ duration: 200 }, () => {
                  this.isAgree = !this.isAgree
                })
              })
            }
            .width('100%')
            .alignItems(VerticalAlign.Center)
            .padding({ right: 16 })
          }
        }
        .divider({
          strokeWidth: 1,
          color: '#DFDFDF',
          startMargin: 20,
          endMargin: 10
        })
        .width('100%')
        .padding({ top: 10 })

      }
      .width('100%')
      .margin({ top: 20 })
      .padding({ left: 20, right: 20 })

      // Web({
      //   src: "https://hm-static.ytpm.net/friend/doc/%E7%94%A8%E6%88%B7%E5%8D%8F%E8%AE%AE.html",
      //   controller: this.webviewController,
      //   renderMode: RenderMode.ASYNC_RENDER // 设置渲染模式
      // }).padding(40).width('100%').height('100%')

    }
    .padding({ bottom: 44 })
    .height('100%')
  }
}