完善个人信息弹窗

src/plugins/necessaryInfo/components/infoForm.vue

@@ -0,0 +1,216 @@
+<template>
+  <div style="width: 100%;">
+    <CtForm ref="formPageRef" :items="items"></CtForm>
+  </div>
+</template>
+
+<script setup>
+import { getDict } from '@/hooks/web/useDictionaries'
+defineOptions({name: 'shareJob-form-baseInfo'})
+import { reactive, ref } from 'vue'
+import { checkEmail } from '@/utils/validate'
+
+const formPageRef = ref()
+let query = reactive({})
+
+// 企业名称下拉列表
+const enterpriseNameInput = ref('')
+const getEnterpriseData = async (name) => {
+  const item = formItems.value.options.find(e => e.key === 'enterpriseId')
+  if (!item) return
+  if (item.items?.length && (enterpriseNameInput.value === name)) return // 防抖
+  item[item.itemTextName] = enterpriseNameInput.value = name
+  if (name === null || name === '') { item.items = [] }
+  else {
+    const data = await enterpriseSearchByName({ name })
+    item.items = data
+  }
+}
+const positionSearch = (name) => {
+  const item = formItems.value.options.find(e => e.key === 'positionId')
+  if (!item) return
+  item[item.itemTextName] = name
+}
+
+const items = ref({
+  options: [
+    {
+      type: 'text',
+      key: 'name',
+      value: '',
+      default: null,
+      label: '姓名 *',
+      outlined: true,
+      rules: [v => !!v || '请输入姓名']
+    },
+    {
+      type: 'autocomplete',
+      key: 'sex',
+      value: '1', // '1' ? '男' : '女'
+      default: '1',
+      label: '性别 *',
+      outlined: true,
+      dictTypeName: 'menduner_sex',
+      rules: [v => !!v || '请选择性别'],
+      items: []
+    },
+    {
+      type: 'phoneNumber',
+      key: 'phone',
+      value: '',
+      clearable: true,
+      label: '联系手机号 *',
+      rules: [v => !!v || '请填写联系手机号']
+    },
+    {
+      type: 'text',
+      key: 'email',
+      value: null,
+      default: null,
+      label: '常用邮箱',
+      outlined: true,
+      rules: [
+        value => {
+          if (value && !checkEmail(value)) return '请输入正确的电子邮箱'
+          return true
+        }
+      ]
+    },
+    {
+      type: 'datePicker',
+      mode: 'date',
+      labelWidth: 110,
+      key: 'birthday',
+      value: '1990-01-01',
+      defaultValue: new Date(1990, 1, 1),
+      label: '出生日期 *',
+      disabledFutureDates: true,
+      format: 'YYYY/MM/DD',
+      outlined: true,
+      rules: [v => !!v || '请选择出生日期']
+    },
+    {
+      type: 'combobox',
+      key: 'enterpriseId',
+      value: null,
+      default: null,
+      label: '任职企业名称（没有可填“暂无”） *',
+      outlined: true,
+      clearable: true,
+      canBeInputted: true, //
+      itemTextName: 'enterpriseName',
+      itemText: 'value',
+      itemValue: 'key',
+      rules: [v => !!v || '任职企业名称（没有可填“暂无”）'],
+      search: getEnterpriseData,
+      items: []
+    },
+    {
+      type: 'combobox',
+      key: 'positionId',
+      value: null,
+      default: null,
+      label: '任职职位名称（没有可填“暂无”） *',
+      outlined: true,
+      clearable: true,
+      canBeInputted: true, //
+      itemTextName: 'positionName',
+      itemText: 'nameCn',
+      itemValue: 'id',
+      rules: [v => !!v || '任职职位名称（没有可填“暂无”）'],
+      search: val => positionSearch(val),
+      items: []
+    },
+    // {
+    //   type: 'autocomplete',
+    //   key: 'interestedPositionList',
+    //   value: null,
+    //   default: null,
+    //   label: '意向职位 *',
+    //   outlined: true,
+    //   clearable: true,
+    //   multiple: true,
+    //   canBeInputted: true, //
+    //   itemText: 'nameCn',
+    //   itemValue: 'id',
+    //   dictTypeName: 'positionData',
+    //   rules: [v => !!v || '意向职位'],
+    //   items: []
+    // },
+    {
+      type: 'autocomplete',
+      key: 'jobStatus',
+      value: '',
+      default: null,
+      label: '求职状态 *',
+      outlined: true,
+      itemText: 'label',
+      itemValue: 'value',
+      dictTypeName: 'menduner_job_seek_status',
+      rules: [v => !!v || '请选择求职状态'],
+      items: []
+    },
+    {
+      type: 'autocomplete',
+      key: 'expType',
+      value: '',
+      default: null,
+      label: '工作经验 *',
+      outlined: true,
+      itemText: 'label',
+      itemValue: 'value',
+      dictTypeName: 'menduner_exp_type',
+      rules: [v => !!v || '请选择工作经验'],
+      items: []
+    },
+    {
+      type: 'autocomplete',
+      key: 'eduType',
+      value: '',
+      default: null,
+      label: '最高学历 *',
+      outlined: true,
+      itemText: 'label',
+      itemValue: 'value',
+      dictTypeName: 'menduner_education_type',
+      rules: [v => !!v || '请选择最高学历'],
+      items: []
+    },
+  ]
+})
+
+// 获取字典内容
+const getDictData = async (dictTypeName) => {
+  const item = items.value.options.find(e => e.dictTypeName === dictTypeName)
+  if (item) {
+    const { data } = await getDict(dictTypeName)
+    item.items = data
+    // console.log(dictTypeName, '字典内容', data)
+  }
+}
+
+const userInfo = ref(localStorage.getItem('userInfo') ? JSON.parse(localStorage.getItem('userInfo')) : {})
+const baseInfo = ref(localStorage.getItem('baseInfo') ? JSON.parse(localStorage.getItem('baseInfo')) : {})
+items.value.options.forEach((e) => {
+  if (e.dictTypeName) getDictData(e.dictTypeName) // 查字典set options
+  if (baseInfo.value && baseInfo.value[e.key]) e.value = baseInfo.value[e.key] // 人才信息回显
+  if (userInfo.value && userInfo.value[e.key]) e.value = userInfo.value[e.key] // 人才信息回显
+  if (e.key === 'sex' && e.value === '0') e.value = e.default
+})
+
+const getQuery = async () => {
+  const { valid } = await formPageRef.value.formRef.validate()
+  if (!valid) return false
+  const obj = {}
+  items.value.options.forEach(e => {
+    if (Object.prototype.hasOwnProperty.call(e, 'data')) return obj[e.key] = e.data
+    obj[e.key] = e.value
+  })
+  query = Object.assign(query, obj)
+  return query
+}
+
+defineExpose({
+  getQuery
+})
+</script>

src/plugins/necessaryInfo/components/necessaryInfoDialog.vue

@@ -0,0 +1,65 @@
+<!-- 完善个人信息 -->
+<template>
+  <v-app>
+    <CtDialog
+      :visible="dialog"
+      :widthType="2"
+      titleClass="text-h6"
+      title="完善个人信息"
+      :closeable="false"
+      otherBtnText="退出登录"
+      @other="handleLogout"
+      @submit="simpleInfoSubmit"
+    >
+      <infoForm ref="formRef"></infoForm>
+    </CtDialog>
+  </v-app>
+</template>
+
+<script setup>
+defineOptions({name: 'necessaryInfo-dialog'})
+import infoForm from './infoForm'
+import { savePersonSimpleInfo } from '@/api/recruit/personal/shareJob'
+import CtDialog from '@/components/CtDialog'
+import { useUserStore } from '@/store/user'; const userStore = useUserStore()
+import { useRoute } from 'vue-router'; const route = useRoute()
+import { useRouter } from 'vue-router'; const router = useRouter()
+import Confirm from '@/plugins/confirm'
+import { onMounted, ref } from 'vue'
+
+const dialog = ref(false)
+onMounted(() => {
+  dialog.value = true
+})
+
+const formRef = ref()
+const simpleInfoSubmit = async () => {
+  try {
+    const obj = await formRef.value.getQuery()
+    if (!obj) return
+    await savePersonSimpleInfo(obj)
+    const info = localStorage.getItem('baseInfo') ? JSON.parse(localStorage.getItem('baseInfo')) : {}
+    localStorage.setItem('baseInfo', JSON.stringify({ ...info, ...obj }))
+    localStorage.setItem('necessaryInfoReady', 'ok')
+    Confirm('系统提示', '提交成功，立即刷新', { hideCancelBtn: true }).then(() => {
+      // window.location.reload()
+      location.reload()
+    })
+    // dialog.value = false
+    // emit('simpleInfoReady')
+  } catch (error) {
+    console.error('error', error)
+  }
+}
+
+// 退出登录
+const handleLogout = () => {
+  Confirm('系统提示', '是否确定退出当前登录账号？').then(async () => {
+    await userStore.userLogout(1)
+    if (!route || route.path === '/recruitHome') location.reload()
+    else router.push({ path: '/recruitHome' })
+  })
+}
+</script>
+<style lang="scss" scoped>
+</style>

src/plugins/necessaryInfo/index.js

@@ -0,0 +1,27 @@
+import { createApp } from 'vue'
+import necessaryInfoDialog from './components/necessaryInfoDialog.vue'
+import vuetify from '@/plugins/vuetify'
+
+const toastMessage = (type, options)  => {
+  const componentName = type === 'necessaryInfoDialog' ? necessaryInfoDialog : null
+
+  const rootNode = document.createElement("div")
+  document.querySelector('.v-application').appendChild(rootNode)
+  const app = createApp(componentName, options)
+  app.use(vuetify)
+  app.mount(rootNode)
+  const { timeout } = options || {}
+  if ((timeout - 0)) {
+    setTimeout(() => {
+      app.unmount()
+      rootNode.remove()
+    }, (timeout-0))
+  }
+}
+
+// 注册插件app.use()会自动执行install函数
+toastMessage.install = (app) => {
+  app.config.globalProperties.Curtain = toastMessage
+}
+
+export default toastMessage