menduner/src/views/recruit/enterprise/register/joiningEnterprise.vue

<template>
  <div class="pt-5">
    <v-card class="default-width pa-5">
      <!-- 标题 -->
      <div class="resume-header">
        <div class="resume-title">{{ $t('enterprise.joiningEnterprise') }}</div>
      </div>
      <!-- 表单 -->
      <div class="CtFormClass" style="width: 600px;">
        <CtForm ref="CtFormRef" :items="formItems" style="width: 100%;"></CtForm>
      </div>
      <div class="text-center">
        <!-- 完成 -->
        <v-btn
          :loading="loginLoading"
          color="primary" class="white--text mt-8" min-width="350"
          @click="handleCommit"
        >
        {{ $t('common.complete') }}
        </v-btn>
      </div>
      <!-- 底部 -->
      <div class="text-center mt-5">
        <v-btn color="primary" variant="text" @click="router.push({ path: '/recruit/enterprise/register' })">{{ $t('enterprise.registeringNewEnterprise') }}</v-btn>
      </div>
    </v-card>
  </div>
</template>

<script setup>
import CtForm from '@/components/CtForm'
import { enterpriseSearchByName } from '@/api/recruit/personal/resume'
import { useRouter } from 'vue-router'
import Snackbar from '@/plugins/snackbar'
import { useI18n } from '@/hooks/web/useI18n'
import { ref } from 'vue'

defineOptions({name: 'enterprise-enterpriseRegister-joiningEnterprise'})
const router = useRouter()
const loginLoading = ref(false)
const { t } = useI18n()

// 企业名称下拉列表
const getSchoolListData = async (name) => {
  const item = formItems.value.options.find(e => e.key === 'enterpriseId')
  if (!item) return
  const data = await enterpriseSearchByName({ name })
  item.items = data
}

const formItems = ref({
  options: [
    {
      type: 'autocomplete',
      key: 'enterpriseId',
      value: null,
      default: null,
      label: '企业名称 *',
      outlined: true,
      clearable: true,
      itemText: 'value',
      itemValue: 'key',
      rules: [v => !!v || '请选择企业名称'],
      search: getSchoolListData,
      items: []
    },
    {
      type: 'text',
      key: 'email',
      value: '',
      label: '职务 *',
      rules: [v => !!v || '请输入职务']
    },
    {
      type: 'text',
      key: 'name',
      value: '',
      label: '姓名 *',
      counter: 15,
      rules: [v => !!v || '请输入姓名']
    },
  ]
})

// 提交
const handleCommit = () => {
  Snackbar.success(t('common.submittedSuccessfully'))
  setTimeout(() => {
    router.push({ path: '/recruit/enterprise' })
  }, 3000);
}
</script>
<style lang="scss" scoped>
.CtFormClass {
  margin: 0 auto;
}
.note {
  color: var(--color-666);
  font-size: 14px;
  line-height: 32px;
}
.file-input-box {
  position: relative;
  height: 80px;
  width: 100px;
  border: 1px solid rgb(188, 188, 188);
  border-radius: 5px;
  cursor: pointer;
  .icon {
    position: absolute;
    top: 45%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: var(--color-999);
  }
}
</style>