<template>
  <div class="index">
    <custom-form v-model="form" :fields="formFields" :useSave="false">
      <template #icon>
        <el-avatar v-if="form.icon && form.icon.length > 0" :src="form.icon[0].url"></el-avatar>
      </template>
      <template #gender>
        <el-option disabled v-for="i in genderList" :key="i._id" :label="i.label" :value="i.value"></el-option>
      </template>
    </custom-form>
  </div>
</template>
<script setup>
// 基础
const { t } = useI18n()
const form = inject('form')
const formFields = ref([
  { label: t('pages.student.icon'), model: 'icon', custom: true },
  { label: t('pages.student.openid'), model: 'openid' },
  { label: t('pages.student.nick_name'), model: 'nick_name' },
  { label: t('pages.student.gender'), model: 'gender', type: 'select' },
  { label: t('pages.student.birth'), model: 'birth' },
  { label: t('pages.student.phone'), model: 'phone' }
])
// 字典表
const genderList = inject('genderList')
</script>
<style scoped lang="scss">
.tags {
  display: flex;
  justify-content: center;
  grid-gap: 0.5rem;
  gap: 0.5rem;
}
</style>
