<!-- 选择是否是学生 -->
<template>
  <scroll-view class="scrollBox" scroll-y="true">
    <template v-if="showSelect">
      <view class="text-center ss-m-t-50" style="color: #666; font-weight: 400; font-size: 18px">请选择当前角色</view>
      <view class="ss-p-50">
        <uni-card class="ss-m-t-30" @tap="handleClickRole(0)">
          <view class="d-flex flex-column align-center ss-p-y-50">
            <image src="/static/svg/workMan.svg" class="svg ss-m-l-10"></image>
            <view class="color-primary text-center" style="font-size: 24px">职场人士</view>
          </view>
        </uni-card>
        <uni-card class="ss-m-t-80" @tap="handleClickRole(1)">
          <view class="d-flex flex-column align-center ss-p-y-50">
            <image src="/static/svg/student.svg" class="svg ss-m-l-10"></image>
            <view class="color-primary text-center" style="font-size: 24px">在校学生</view>
          </view>
        </uni-card>
      </view>
    </template>
    <template v-else>
      <studentInfoForm></studentInfoForm>
    </template>
  </scroll-view>
</template>

<script setup>
import { ref } from 'vue'
import studentInfoForm from './studentInfoForm.vue'
import { showAuthModal } from '@/hooks/useModal'

const showSelect = ref(true)

const handleClickRole = (type) => {
  if (type) {
    // 学生用户
    showSelect.value = false
  } else {
    // 普通用户
    showAuthModal('necessaryInfo')
    uni.setStorageSync('necessaryInfoReady', 'fddeaddc47868b')
  }
}

</script>
<style lang="scss" scoped>
.scrollBox {
  width: 100vw;
  // height: 100vh;
  height: calc(100vh - 30rpx);
  margin-bottom: 30rpx;
}

.svg {
  width: 100px;
  height: 100px;
  margin-bottom: 30px;
}
</style>
