import { router } from '@kit.ArkUI'
import preferencesUtil from '../utils/preferences'
import loginOut from '../utils/loginOut'
import { personData, personCertificateRow, companyWalletTest, companyWalletRow, companyData } from '../api/userType'
import baseUrl from '../utils/baseUrl'
import { getCompanyPersonList } from '../api/originalRecords'
import { companyPersonTest, companyPersonRow } from '../api/recordsType'
import { getCompanyWallet, updateState } from '../api/user'
import { AxiosResponse } from '@ohos/axios'
import { promptAction } from '@kit.ArkUI'
import LoadingDialog from '../dialog/LoadingDialog'
import updatePasswordDialog from '../dialog/updatePasswordDialog'
@Extend(Text)
function textExtend() {
  .fontSize(14).lineHeight(19).fontColor('#3d3d3d')
}

@Extend(Text)
function textRight() {
  .fontSize(14).lineHeight(19).fontColor('#999')
}

let getTextInfo = (state: string | null) => {
  if(state == '0') {
    return '已离职'
  } else if(state == '1') {
    return '确认从业'
  } else if(state == '2') {
    return '确认离职'
  } else {
    return ''
  }
}

@Component
export default struct MainPage {
  dialogController: CustomDialogController = new CustomDialogController({
    builder: updatePasswordDialog(),
    cornerRadius: 10
  })
  loadingController: CustomDialogController = new CustomDialogController({
    builder: LoadingDialog(),
    customStyle: true,
    offset: { dx: 0, dy: 0 },
    alignment: DialogAlignment.Center,
    autoCancel: false
  })
  @Link userInfo: personData
  @Link companyInfo: companyData
  @Link personCertificateInfo: personCertificateRow
  @State walletData: companyWalletRow | null = null
  @State companyData: companyPersonRow | null = null
  @Link isEdit: boolean
  roleName = preferencesUtil.get('XF_ROLE_NAME', '')
  async aboutToAppear() {
    let personId = preferencesUtil.get('XF_PERSON_ID', 0)
    let companyId = preferencesUtil.get('XF_COMPANY_ID', 0)
    if(this.roleName == 'person' && preferencesUtil.get('XF_PERSON_INFO', '')) {
      this.userInfo = JSON.parse(preferencesUtil.get('XF_PERSON_INFO', '') as string)
    }
    if(this.roleName == 'person' || this.roleName == 'unapprovedPerson') {
      // 获取公司人员个人信息
      const companyInfo: AxiosResponse<companyPersonTest> = await getCompanyPersonList({pageNum: 1, pageSize: 10, personId: Number(personId)})
      this.companyData = companyInfo.data.rows[0]
    }
    // 获取公司钱包信息
    const walletInfo: AxiosResponse<companyWalletTest> = await getCompanyWallet({pageNum: 1, pageSize: 10, companyId: Number(companyId)})
    this.walletData = walletInfo.data.rows[0]

  }
  build() {
    Stack(){
      Column(){
        Row(){
          Image((baseUrl + this.userInfo?.personalImg) || $r('app.media.userAvatar')).width(80).height(80).borderRadius(40).margin({right: 10})
          Text(this.userInfo?.personName).fontSize(16).lineHeight(21).fontWeight(600).fontColor('#fff')
        }.width('100%').padding({left: 15,right: 15}).margin({top: 44})
        .visibility(this.roleName == 'person' || this.roleName == 'unapprovedPerson' ? Visibility.Visible: Visibility.None)
        Row(){
          Row(){
            Image((baseUrl + this.companyInfo?.businessLicensePic) || $r('app.media.userAvatar')).width(60).height(60).borderRadius(30).margin({right: 10})
            Text(this.companyInfo?.companyName).fontSize(14).lineHeight(21).fontWeight(600).fontColor('#fff')
          }.layoutWeight(1).justifyContent(FlexAlign.Start)
          Column({space: 4}){
            Image($r('app.media.wallet')).width(30)
            Text(this.walletData?.bean.toString() + '(豆)').fontSize(12).fontColor('#fff')
          }.width(80).onClick(() => {
            router.pushUrl({
              url: "pages/MyWallet"
            })
          })
        }.width('100%').padding({left: 10,right: 10}).margin({top: 44})
        .visibility(this.roleName == 'company' ? Visibility.Visible: Visibility.None)
      }.width('100%').height(256).padding({left: 15,right: 15})
      .linearGradient({angle: 63 ,colors: [['#1B65FD', 0], ['#6D9DFF', 0.5]]})
      List(){
        // 公司基本信息
        ListItem(){
          Column(){
            Row(){
              Text('基本信息').fontWeight(600).textExtend()
              Row(){
                Text('编辑').fontSize(12).fontColor('#999')
                Image($r('app.media.right_4')).width(12).margin({left: 4})
              }.onClick(() => {
                router.pushUrl({
                  url: 'pages/EditCompanyInfo'
                })
              })
            }.padding(10).border({width: {bottom: 2}, color: '#eee'})
            .justifyContent(FlexAlign.SpaceBetween).width('100%')
            Column(){
              Row(){
                Row(){
                  Image($r('app.media.username')).width(16).margin({right: 5})
                  Text('用户名').textExtend()
                }
                Text(this.companyInfo?.username).textRight()
              }.width('100%').justifyContent(FlexAlign.SpaceBetween)
              .border({width: {bottom: 1}, color: '#eee'})
              .padding({top: 15, bottom: 15})
              Row(){
                Row(){
                  Image($r('app.media.enterprise')).width(16).margin({right: 5})
                  Text('企业名称').textExtend()
                }
                Text(this.companyInfo?.companyName).textRight()
              }.width('100%').justifyContent(FlexAlign.SpaceBetween)
              .border({width: {bottom: 1}, color: '#eee'})
              .padding({top: 15, bottom: 15})
              Row(){
                Row(){
                  Image($r('app.media.business_license')).width(16).margin({right: 5})
                  Text('营业执照编号').textExtend()
                }
                Text(this.companyInfo?.businessLicenseNo).textRight()
              }.width('100%').justifyContent(FlexAlign.SpaceBetween)
              .border({width: {bottom: 1}, color: '#eee'})
              .padding({top: 15, bottom: 15})
              Row(){
                Row(){
                  Image($r('app.media.idcard')).width(16).margin({right: 5})
                  Text('联系人').textExtend()
                }
                Text(this.companyInfo?.linkMan).textRight()
              }.width('100%').justifyContent(FlexAlign.SpaceBetween)
              .border({width: {bottom: 1}, color: '#eee'})
              .padding({top: 15, bottom: 15})
              Row(){
                Row(){
                  Image($r('app.media.phone')).width(16).margin({right: 5})
                  Text('联系人手机号').textExtend()
                }
                Text(this.companyInfo?.lmTel).textRight()
              }.width('100%').justifyContent(FlexAlign.SpaceBetween)
              .border({width: {bottom: 1}, color: '#eee'})
              .padding({top: 15, bottom: 15})
              Row(){
                Row(){
                  Image($r('app.media.email')).width(16).margin({right: 5})
                  Text('电子邮箱').textExtend()
                }
                Text(this.companyInfo?.email).textRight()
              }.width('100%').justifyContent(FlexAlign.SpaceBetween)
              .padding({top: 15, bottom: 15})
              .border({width: {bottom: 1}, color: '#eee'})
            }.padding({left: 10, right: 10})
          }.width('100%').backgroundColor('#fff').borderRadius(10).clip(true)
        }.visibility(this.roleName == 'company' ? Visibility.Visible: Visibility.None).margin({bottom: 10})
        // 个人基本信息
        ListItem(){
          Column(){
            Row(){
              Text('基本信息').fontWeight(600).textExtend()
              Row(){
                Text('编辑').fontSize(12).fontColor('#999')
                Image($r('app.media.right_4')).width(12).margin({left: 4})
              }.onClick(() => {
                router.pushUrl({
                  url: 'pages/EditUser'
                })
              })
            }.padding(10).border({width: {bottom: 2}, color: '#eee'})
            .justifyContent(FlexAlign.SpaceBetween).width('100%')
            Column(){
              Row(){
                Row(){
                  Image($r('app.media.username')).width(16).margin({right: 5})
                  Text('用户名').textExtend()
                }
                Text(this.userInfo?.username).textRight()
              }.width('100%').justifyContent(FlexAlign.SpaceBetween)
              .border({width: {bottom: 1}, color: '#eee'})
              .padding({top: 15, bottom: 15})
              Row(){
                Row(){
                  Image($r('app.media.idcard')).width(16).margin({right: 5})
                  Text('身份证号').textExtend()
                }
                Text(this.userInfo?.idNo).textRight()
              }.width('100%').justifyContent(FlexAlign.SpaceBetween)
              .border({width: {bottom: 1}, color: '#eee'})
              .padding({top: 15, bottom: 15})
              Row(){
                Row(){
                  Image($r('app.media.sex')).width(16).margin({right: 5})
                  Text('性别').textExtend()
                }
                Text(this.userInfo?.gender == '0' ? '男' : '女').textRight()
              }.width('100%').justifyContent(FlexAlign.SpaceBetween)
              .border({width: {bottom: 1}, color: '#eee'})
              .padding({top: 15, bottom: 15})
              Row(){
                Row(){
                  Image($r('app.media.phone')).width(16).margin({right: 5})
                  Text('手机号码').textExtend()
                }
                Text(this.userInfo?.phone).textRight()
              }.width('100%').justifyContent(FlexAlign.SpaceBetween)
              .border({width: {bottom: 1}, color: '#eee'})
              .padding({top: 15, bottom: 15})
              Row(){
                Row(){
                  Image($r('app.media.email')).width(16).margin({right: 5})
                  Text('电子邮箱').textExtend()
                }
                Text(this.userInfo?.email).textRight()
              }.width('100%').justifyContent(FlexAlign.SpaceBetween)
              .padding({top: 15, bottom: 15})
              .border({width: {bottom: 1}, color: '#eee'})
              Row(){
                Row(){
                  Image($r('app.media.brithday')).width(16).margin({right: 5})
                  Text('出生日期').textExtend()
                }
                Text(this.userInfo?.birthDate).textRight()
              }.width('100%').justifyContent(FlexAlign.SpaceBetween)
              .padding({top: 15, bottom: 15})
            }.padding({left: 10, right: 10})
          }.width('100%').backgroundColor('#fff').borderRadius(10).clip(true)
        }.visibility(this.roleName == 'person' || this.roleName == 'unapprovedPerson' ? Visibility.Visible: Visibility.None).margin({bottom: 10})
        // 证书信息
        ListItem(){
          Column(){
            Row(){
              Row({ space: 5 }){
                Text('证书信息').fontWeight(600).textExtend()
              }
              Row(){
                Text(this.isEdit ? '编辑' : '添加').fontSize(12).fontColor('#999')
                Image($r('app.media.right_4')).width(12).margin({left: 4})
              }.onClick(() => {
                router.pushUrl({
                  url: 'pages/CertificateInfo'
                })
              })
            }.padding(10).border({width: {bottom: 2}, color: '#eee'})
            .justifyContent(FlexAlign.SpaceBetween).width('100%')
            Column(){
              Row(){
                Row(){
                  Image($r('app.media.certificate_type')).width(16).margin({right: 5})
                  Text('证书类型').textExtend()
                }
                Text(`${this.personCertificateInfo?.certificateLevel}${this.personCertificateInfo?.certificateName}`).textRight()
              }.width('100%').justifyContent(FlexAlign.SpaceBetween)
              .border({width: {bottom: 1}, color: '#eee'})
              .padding({top: 15, bottom: 15})
              Row(){
                Row(){
                  Image($r('app.media.certificate_num')).width(16).margin({right: 5})
                  Text('证书编号').textExtend()
                }
                Text(this.personCertificateInfo?.certificateNo).textRight()
              }.width('100%').justifyContent(FlexAlign.SpaceBetween)
              .border({width: {bottom: 1}, color: '#eee'})
              .padding({top: 15, bottom: 15})
              Row(){
                Row(){
                  Image($r('app.media.date')).width(16).margin({right: 5})
                  Text('颁发时间').textExtend()
                }
                Text(this.personCertificateInfo?.issueDate).textRight()
              }.width('100%').justifyContent(FlexAlign.SpaceBetween)
              .padding({top: 15, bottom: 15})
            }.padding({left: 10, right: 10})
          }.width('100%').backgroundColor('#fff').borderRadius(10).clip(true)
        }.visibility(this.roleName == 'person' || this.roleName == 'unapprovedPerson' ? Visibility.Visible: Visibility.None).margin({bottom: 10})
        // 从业信息
        ListItem(){
          Column(){
            Row(){
              Text('从业信息').fontWeight(600).textExtend()
              Image($r('app.media.refresh')).width(12)
                .onClick(async () => {
                  this.loadingController.open()
                  let personId = preferencesUtil.get('XF_PERSON_ID', 0)
                  const companyInfo: AxiosResponse<companyPersonTest> = await getCompanyPersonList({pageNum: 1, pageSize: 10, personId: Number(personId)})
                  if(companyInfo.data.rows.length > 0) {
                    this.companyData = companyInfo.data.rows[0]
                  }
                  this.loadingController.close()
                })
            }.padding(10).border({width: {bottom: 2}, color: '#eee'})
            .justifyContent(FlexAlign.Start).width('100%')
            Column(){
              Row(){
                Row(){
                  Image($r('app.media.enterprise')).width(16).margin({right: 5})
                  Text('所属公司').textExtend()
                }
                Text(this.companyData?.companyName).textRight()
              }.width('100%').justifyContent(FlexAlign.SpaceBetween)
              .border({width: {bottom: 1}, color: '#eee'})
              .padding({top: 15, bottom: 15})
              Row(){
                Row(){
                  Image($r('app.media.certificate_num')).width(16).margin({right: 5})
                  Text('报告豆余额').textExtend()
                }
                Text(`${this.walletData?.bean}`).textRight()
              }.width('100%').justifyContent(FlexAlign.SpaceBetween)
              .border({width: {bottom: 1}, color: '#eee'})
              .padding({top: 15, bottom: 15})
              Row(){
                Row(){
                  Image($r('app.media.date')).width(16).margin({right: 5})
                  Text('添加时间').textExtend()
                }
                Text(this.companyData?.createTime).textRight()
              }.width('100%').justifyContent(FlexAlign.SpaceBetween)
              .border({width: {bottom: 1}, color: '#eee'})
              .padding({top: 15, bottom: 15})
            }.padding({left: 10, right: 10})
            Row(){
              Row(){
                Image($r('app.media.edit')).width(16).margin({right: 5})
                Text('操作').textExtend()
              }
              Text(getTextInfo(this.companyData?.state || '0')).width(80).height(25)
                .backgroundColor(this.companyData?.state == '1' ? '#1890ff' : '#C80000')
                .fontSize(14).textAlign(TextAlign.Center).fontColor('#fff').borderRadius(8)
                .visibility(this.companyData?.state == '0' ? Visibility.None : Visibility.Visible)
                .onClick(() => {
                  AlertDialog.show({
                    title: '提示',
                    message: this.companyData?.state == '2' ? `是否从${this.companyData?.companyName}离职` : `是否在${this.companyData?.companyName}就职`,
                    alignment: DialogAlignment.Center,
                    primaryButton: {
                      value: '取消',
                      action: () => {
                        console.info('Callback when the first button is clicked')
                      }
                    },
                    secondaryButton: {
                      enabled: true,
                      defaultFocus: true,
                      style: DialogButtonStyle.HIGHLIGHT,
                      value: '确认',
                      action: async () => {
                        if(this.companyData?.state == '2') {
                          await updateState({ relateId: this.companyData?.relateId, state: '0' })
                          promptAction.showToast({
                            message: '已成功离职',
                            duration: 2000
                          })
                          await loginOut()
                          router.replaceUrl({
                            url: 'pages/Login'
                          })
                        }else {
                          await updateState({ relateId: this.companyData?.relateId, state: '2' })
                          promptAction.showToast({
                            message: '已恢复职位，请重新登录获取新数据',
                            duration: 2000
                          })
                          await loginOut()
                          router.replaceUrl({
                            url: 'pages/Login'
                          })
                        }
                      }
                    }
                  })
                })
            }.width('100%').justifyContent(FlexAlign.SpaceBetween)
            .padding({top: 15, bottom: 15, left: 10, right: 10})
          }.width('100%').backgroundColor('#fff').borderRadius(10).clip(true)
        }.visibility(this.roleName == 'person' || this.roleName == 'unapprovedPerson' ? Visibility.Visible: Visibility.None).margin({bottom: 10})
        // APP信息
        ListItem(){
          Column(){
            Row(){
              Text('APP信息').fontWeight(600).textExtend()
            }.padding(10).border({width: {bottom: 2}, color: '#eee'})
            .justifyContent(FlexAlign.SpaceBetween).width('100%')
            Column(){
              Row(){
                Row(){
                  Image($r('app.media.user_agreement')).width(16).margin({right: 5})
                  Text('用户协议').textExtend()
                }
                Image($r('app.media.right_4')).width(12).margin({left: 4})
              }.width('100%').justifyContent(FlexAlign.SpaceBetween)
              .border({width: {bottom: 1}, color: '#eee'})
              .padding({top: 15, bottom: 15}).onClick(() => {
                router.pushUrl({
                  url: 'pages/UserAgreement'
                })
              })
              Row(){
                Row(){
                  Image($r('app.media.privacy')).width(16).margin({right: 5})
                  Text('隐私政策').textExtend()
                }
                Image($r('app.media.right_4')).width(12).margin({left: 4})
              }.width('100%').justifyContent(FlexAlign.SpaceBetween)
              .border({width: {bottom: 1}, color: '#eee'})
              .padding({top: 15, bottom: 15}).onClick(() => {
                router.pushUrl({
                  url: 'pages/PrivacyPolicy'
                })
              })
              Row(){
                Row(){
                  Image($r('app.media.delete')).width(16).margin({right: 5})
                  Text('注销协议').textExtend()
                }
                Image($r('app.media.right_4')).width(12).margin({left: 4})
              }.width('100%').justifyContent(FlexAlign.SpaceBetween)
              .padding({top: 15, bottom: 15}).onClick(() => {
                router.pushUrl({
                  url: 'pages/CancellationAgreement'
                })
              })
            }.padding({left: 10, right: 10})
          }.width('100%').backgroundColor('#fff').borderRadius(10).clip(true)
        }.margin({bottom: 10})
        // 操作按钮
        ListItem(){
          Column({space: 10}){
            Text('修改密码').width('100%').height(50).backgroundColor('#4ECDBE').borderRadius(10)
              .fontSize(16).fontColor(Color.White).fontWeight(600).textAlign(TextAlign.Center)
              .onClick(() => {
                this.dialogController.open()
              })
            Text('退出登录').width('100%').height(50).backgroundColor('#6D9DFF').borderRadius(10)
              .fontSize(16).fontColor(Color.White).fontWeight(600).textAlign(TextAlign.Center)
              .onClick(() => {
                AlertDialog.show({
                  title: '提示',
                  message: '是否退出登录？',
                  autoCancel: true,
                  alignment: DialogAlignment.Center,
                  gridCount: 4,
                  offset: { dx: 0, dy: -20 },
                  buttonDirection: DialogButtonDirection.HORIZONTAL,
                  buttons: [
                    {
                      value: '取消',
                      action: () => {
                        console.info('Callback when button1 is clicked')
                      }
                    },
                    {
                      value: '确认',
                      action: async () => {
                        await loginOut()
                        router.replaceUrl({
                          url: 'pages/Login'
                        })
                      }
                    }
                  ],
                  cancel: () => {
                    console.info('Closed callbacks')
                  }
                })
              })
            Column(){
              Text('http://xfapp.crgx.net').fontSize(10).fontColor('#999').lineHeight(18)
              Text('非广西消防救援总队官方出品Copyright@广西世纪创软信息技术有限公司').fontSize(10).fontColor('#999').lineHeight(18)
                .maxLines(2).textAlign(TextAlign.Center)
            }
          }
        }
      }.margin({left: 15, right: 15, top: 144}).borderRadius(10).scrollBar(BarState.Off).layoutWeight(1)
    }.height('100%').backgroundColor('#f3f2f7').alignContent(Alignment.Top).padding({bottom: 20})
  }
}