<route lang="yaml">
style:
  navigationBarTitleText: 设计师认证
  navigationStyle: custom
</route>
<script lang="ts" setup>
import Card from '@/components/card.vue'
import DataForm from '@/components/data-form.vue'
import NavBarEvo from '@/components/nav-bar-evo.vue'
import SectionHeading from '@/components/section-heading.vue'
import { createUserAuthInfo, getByDictType } from '../../../core/libs/requests'
import { DictType } from '../../../core/models/moment'
import { useUserStore } from '../../../store'
import pageHeaderBg from '@designer-hub/assets/src/assets/svgs/pageHeaderBg'
import pageHeaderFilter from '@designer-hub/assets/src/assets/svgs/pageHeaderFilter'
import { storeToRefs } from 'pinia'
import { useMessage, useToast } from 'wot-design-uni'

const userStore = useUserStore()
const { userInfo } = storeToRefs(userStore)
const { alert } = useMessage()
const { error } = useToast()
const formData = ref({})
const formInited = ref(false)
const schema = ref({
  channelSource: {
    type: 'Select',
    label: '来源',
    props: {
      labelWidth: '126rpx',
      placeholder: '请选择通过哪个渠道入驻的筑巢荟',
      columns: [],
    },
  },
  referrer: {
    type: 'TextField',
    label: '推荐人',
    props: {
      labelWidth: '126rpx',
      placeholder: '请如实填写推荐人编号，设计师会员编号或渠道编号',
    },
  },
  designerName: {
    type: 'TextField',
    label: '姓名',
    props: {
      labelWidth: '126rpx',
      placeholder: '请输入真实姓名',
    },
  },
  mobile: {
    type: 'TextField',
    label: '电话',
    props: {
      labelWidth: '126rpx',
      placeholder: '请输入电话号码',
    },
  },
  employer: {
    type: 'TextField',
    label: '公司',
    props: {
      labelWidth: '126rpx',
      placeholder: '请输入所在公司或自己公司名称',
    },
  },
  spatialExpertiseType: {
    type: 'Radio',
    label: '擅长空间类型',
    props: {
      placeholder: ' ',
      columns: [],
    },
  },
})
const handleSubmit = async () => {
  console.log(formData.value)

  const { code, msg } = await createUserAuthInfo({
    gender: userInfo.value.sex,
    attachment: 'https://via.placeholder.com/319x204',
    userId: userInfo.value.userId,
    ...formData.value,
  })
  if (code === 0) {
    uni.navigateTo({ url: '/pages/mine/authentication/submit/success/index' })
  } else {
    error(msg)
  }
}
onMounted(async () => {
  const { data } = await getByDictType('member_channel_source')
  const { data: res } = await getByDictType(DictType.memberSpatialExpertiseType)
  console.log(res)
  schema.value.channelSource.props.columns = data
  schema.value.spatialExpertiseType.props.columns = res
  formInited.value = true
  // alert({ title: '提示', msg: '您的认证申请已提交，请耐心等待审核，审核通过后您将获得通知' })
})
defineExpose({})
</script>
<template>
  <div class="flex-grow">
    <div class="relative aspect-[3.6/1]">
      <div class="absolute top-0 left-0 right-0 bottom--18.5">
        <wd-img width="100%" height="100%" :src="pageHeaderBg"></wd-img>
      </div>
      <div class="absolute top-0 left-0 right-0 bottom--18.5">
        <wd-img width="100%" height="100%" :src="pageHeaderFilter"></wd-img>
      </div>
    </div>
    <NavBarEvo title="设计师认证"></NavBarEvo>
    <div class="flex-grow flex flex-col p-3.5 gap-3.5 relative">
      <Card>
        <SectionHeading size="base" title="基本信息"></SectionHeading>
        <template v-if="formInited"></template>
        <DataForm v-model="formData" :schema="schema" direction="horizontal"></DataForm>
      </Card>
      <Card>
        <SectionHeading size="base" title="上传附件"></SectionHeading>
        <wd-upload></wd-upload>
      </Card>
      <div class="flex-1"></div>
      <div>
        <wd-button block :round="false" @click="handleSubmit">提交</wd-button>
      </div>
    </div>
  </div>
</template>
