<route lang="json">
{
  "layout": false,
  "style": {
    "navigationStyle": "custom"
  }
}
</route>

<template>
  <view class="splash-container">
    <image class="wh-full" src="@/static/images/guide1.png" />
  </view>
  <MDialog
    :visible="show"
    title="用户协议与隐私政策"
    cancel-button-text="不同意"
    confirm-button-text="同意并继续"
    @cancel="handleCancel"
    @confirm="handleConfirm"
  >
    <view class="text-16px py-20px color-text-1 text-left">
      <view class="mb-10px">(1)《隐私政策》中关于个人设备用户信息的收集和使用说明》。</view>
      <view>(2)《隐私政策》中与第三方SDK类服务商数据共享、相关信息收集和使用说明。</view>
      <view class="my-20px">用户协议和隐私政策说明：</view>
      <view class="color-text-place">
        阅读完整的
        <text class="color-primary" @click="goDetail">《个人信息保护政策》</text>
        了解详细内容
      </view>
    </view>
  </MDialog>
</template>

<script setup lang="ts">
  import { useUserStore } from '@/stores/modules/userStore'

  defineOptions({ name: 'Privacy' })

  const userStore = useUserStore()
  const agreePrivacy = computed(() => userStore.agreePrivacy)
  const show = ref(false)

  const handleCancel = () => {
    show.value = false
  }
  const handleConfirm = () => {
    show.value = false
    userStore.agreePrivacy = true
    uni.navigateTo({ url: '/pages/splash/index' })
  }

  const goDetail = () => {
    uni.navigateTo({ url: '/pages-sub/privacy-detail/index' })
  }

  onBeforeMount(() => {
    if (agreePrivacy.value) {
      uni.navigateTo({ url: '/pages/splash/index' })
    } else {
      show.value = true
    }
  })
</script>

<style scoped lang="scss">
  .splash-container {
    @apply h-full;
    :deep(.wd-swiper) {
      @apply h-full;
    }
    .splash-mask {
      @apply flex flex-col items-center text-center;
      .text {
        @apply color-text-1 text-24px mt-20px flex items-center text-center;
        letter-spacing: 10px;
        writing-mode: vertical-rl;
        .vue {
          @apply text-28px font-600 bg-bg-primary;
          letter-spacing: 0px;
          background: linear-gradient(315deg, #42d392 25%, #647eff);
          background-clip: text;
          writing-mode: horizontal-tb;
          -webkit-text-fill-color: transparent;
        }
      }
    }
    :deep(.wd-swiper__track) {
      @apply rounded-0px;
    }
  }
</style>
