<script setup>
import { useGlobSetting } from 'hooks/setting/env'
import { sleep } from 'uview-plus'
import { getUserInfoApi, postAuthLoginApi } from '@/api/system'
import { useCdn } from '@/composables/use-cdn'
import { ACCESS_TOKEN_KEY, USER_LOGIN_ACCOUNT } from '@/constants/storage'
import { useUserStore } from '@/store/user'
const { cdnUrl } = useCdn('/elevator/2024/12/30')

const isAgree = ref(false)
const { cdnUrl: linkUrl } = useCdn('/elevator/2025')
const webView = '/pages/views/web-view/index'
const toAgreement = () => {
  const link = `${linkUrl}/荣君安-用户协议.html`
  const url = `${webView}?url=${encodeURIComponent(link)}`
  uni.navigateTo({
    url
  })
}
const toPrivacy = () => {
  const link = `${linkUrl}/荣君安-隐私政策.html`
  const url = `${webView}?url=${encodeURIComponent(link)}`
  uni.navigateTo({
    url
  })
}

const toLogin = () => {
  if (!isAgree.value) {
    uni.$u.toast('请同意用户协议和隐私协议')
    return
  }

  uni.navigateTo({
    url: '/pages/views/login/password'
  })
}
const quickLogin = async () => {
  if (!isAgree.value) {
    uni.$u.toast('请同意用户协议和隐私协议')
    return
  }

  const value = uni.getStorageSync(USER_LOGIN_ACCOUNT)
  if (!value || !value.account || !value.password) {
    uni.$u.toast('一键登录失败')
    await sleep(1500)
    toLogin()
    return
  }

  model.value = value
  submit()
}
const model = ref({
  account: '',
  password: ''
})

const { clientId } = useGlobSetting()
const { setUserInfo, setUserRoles } = useUserStore()
const submit = async () => {
  const { account, password } = model.value
  const { error, data } = await postAuthLoginApi({
    username: account,
    password: password,
    grantType: 'password',
    clientId
  })
  uni.showLoading({
    title: '登录中'
  })
  if (!error) {
    uni.hideLoading()
    uni.$u.toast('登录成功')
    const { access_token } = data
    uni.setStorageSync(ACCESS_TOKEN_KEY, access_token)
    const { data: userData } = await getUserInfoApi()
    const { user, roles } = userData
    setUserInfo(user)
    setUserRoles(roles)
    uni.redirectTo({
      url: '/pages/index/index'
    })
  } else {
    uni.hideLoading()
    uni.$u.toast('登录失败')
  }
}
</script>

<template>
  <view min-h-100vh px-30>
    <view mx-auto mb-50 w-400 h-400 f-c-c>
      <up-image
        :src="`${cdnUrl}/b7e2194e233e472fb25dc5bd3bc700de.png`"
        width="250rpx"
        height="250rpx"
      />
    </view>

    <view mt-30>
      <up-button type="primary" text="账号密码登录" @click="toLogin" />

      <up-button
        type="primary"
        text="一键登录"
        custom-style="margin-top: 30px"
        @click="quickLogin"
      />
    </view>

    <view position="fixed" bottom-50 left-0 pl-30 f-s-c>
      <view
        w-36
        h-36
        rounded-full
        border-2
        border-gray-300
        border-solid
        f-c-c
        :style="{
          backgroundColor: isAgree ? '#204DA1' : 'transparent',
          borderColor: isAgree ? 'transparent' : '#D9D9D9',
          borderWidth: isAgree ? '0' : '2px'
        }"
        @tap="isAgree = !isAgree"
      >
        <up-icon
          v-if="isAgree"
          name="right-line"
          custom-prefix="custom-icon"
          :color="`${'#FFFFFF'}`"
        />
      </view>
      <div ml-6>
        <text>已阅读并同意</text>
        <text color="#579AF8" @tap="toAgreement">《用户协议》</text>
        <text color="#579AF8" @tap="toPrivacy">《隐私协议》</text>
      </div>
    </view>
  </view>
</template>
