basicInfo.vue 7.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261
  1. <!-- 基本信息 -->
  2. <template>
  3. <div>
  4. <div class="topTip">丰富详尽的企业介绍能提高求职者对贵企业的关注和了解,有助于达到更好的招聘效果</div>
  5. <CtForm ref="CtFormRef" :items="formItems" style="width: 900px;margin: 0 auto">
  6. <!-- <template #name="{ item }">
  7. <div v-show="!item.show" class="text-right" style="width: 80px; line-height: 40px;">
  8. <v-icon :color="statusInfo.color" size="20">{{ statusInfo.mdi }}</v-icon>
  9. <span class="cursor-pointer text-decoration-underline" :style="{'color': statusInfo.color,'font-size': '14px'}" @click="emit('change', 6)">{{ statusInfo.label }}</span>
  10. </div>
  11. </template> -->
  12. <template #industryId="{ item }">
  13. <v-menu :close-delay="1" :open-delay="0" v-bind="$attrs" :close-on-content-click="true">
  14. <template v-slot:activator="{ props }">
  15. <TextInput
  16. v-model="item.value"
  17. :item="item"
  18. v-bind="props"
  19. ></TextInput>
  20. </template>
  21. <industryTypeCard :limit="1" :select="[query.industryId].filter(Boolean)" @handleClickIndustry="handleIndustry"></industryTypeCard>
  22. </v-menu>
  23. </template>
  24. <template #prepare="{ item }">
  25. <v-checkbox v-model="item.value" label="筹备中(如果贵企业正在筹备,请勾选)" color="primary"></v-checkbox>
  26. </template>
  27. </CtForm>
  28. <div class="text-center">
  29. <v-btn color="primary" class="buttons mt-3 mb-10" @click.stop="handleSave">{{ $t('common.save') }}</v-btn>
  30. </div>
  31. </div>
  32. </template>
  33. <script setup>
  34. defineOptions({name: 'informationSettingsComponents-basicInfo'})
  35. import { ref, reactive } from 'vue'
  36. import { getEnterpriseBaseInfo, updateEnterpriseBaseInfo } from '@/api/enterprise'
  37. // import { getEnterpriseAuth } from '@/api/recruit/enterprise/information'
  38. import { getDict } from '@/hooks/web/useDictionaries'
  39. import { useI18n } from '@/hooks/web/useI18n'
  40. import industryTypeCard from '@/components/industryTypeCard'
  41. import Snackbar from '@/plugins/snackbar'
  42. import { useUserStore } from '@/store/user'
  43. const emit = defineEmits(['complete'])
  44. const { t } = useI18n()
  45. const CtFormRef = ref()
  46. const query = reactive({})
  47. const user = useUserStore()
  48. const formItems = ref({
  49. options: [
  50. {
  51. type: 'text',
  52. key: 'name',
  53. value: '',
  54. col: 6,
  55. label: '企业全称 *',
  56. flexStyle: 'mr-3',
  57. slotName: 'name',
  58. rules: [v => !!v || '请输入企业全称']
  59. },
  60. {
  61. type: 'text',
  62. key: 'anotherName',
  63. value: '',
  64. col: 6,
  65. label: '企业展示名称 *',
  66. rules: [v => !!v || '请输入企业展示名称']
  67. },
  68. {
  69. type: 'text',
  70. key: 'website',
  71. value: '',
  72. col: 6,
  73. flexStyle: 'mr-3',
  74. label: '企业官网'
  75. },
  76. {
  77. type: 'text',
  78. key: 'contact',
  79. value: '',
  80. col: 6,
  81. label: '联系人'
  82. },
  83. {
  84. type: 'phoneNumber',
  85. key: 'phone',
  86. value: '',
  87. col: 6,
  88. flexStyle: 'mr-3',
  89. label: '联系电话'
  90. },
  91. {
  92. slotName: 'industryId',
  93. key: 'industryId',
  94. value: null,
  95. label: '所在行业 *',
  96. outlined: true,
  97. clearable: false,
  98. itemText: 'label',
  99. itemValue: 'value',
  100. col: 6,
  101. noParam: true,
  102. rules: [v => !!v || '请选择所在行业']
  103. },
  104. {
  105. type: 'autocomplete',
  106. key: 'financingStatus',
  107. value: null,
  108. label: '融资阶段',
  109. outlined: true,
  110. clearable: false,
  111. itemText: 'label',
  112. itemValue: 'value',
  113. col: 6,
  114. flexStyle: 'mr-3',
  115. dictTypeName: 'menduner_financing_status',
  116. // rules: [v => !!v || '请选择融资阶段'],
  117. items: []
  118. },
  119. {
  120. type: 'autocomplete',
  121. key: 'scale',
  122. value: null,
  123. label: '企业规模 *',
  124. outlined: true,
  125. clearable: false,
  126. itemText: 'label',
  127. itemValue: 'value',
  128. col: 6,
  129. dictTypeName: 'menduner_scale',
  130. rules: [v => !!v || '请选择企业规模'],
  131. items: []
  132. },
  133. {
  134. type: 'datePicker',
  135. key: 'openTime',
  136. value: null,
  137. mode: 'month',
  138. default: '2010-01',
  139. defaultValue: new Date(2010, 1),
  140. format: 'YYYY-MM',
  141. label: '开业时间',
  142. labelWidth: 120,
  143. col: 6,
  144. flexStyle: 'mr-3',
  145. },
  146. {
  147. slotName: 'prepare',
  148. key: 'prepare',
  149. value: true,
  150. col: 6
  151. },
  152. {
  153. type: 'textarea',
  154. key: 'introduce',
  155. value: null,
  156. counter: 2000,
  157. rows: 6,
  158. label: '企业介绍 *',
  159. outlined: true,
  160. rules: [v => !!v || '请输入企业介绍']
  161. },
  162. ]
  163. })
  164. const setValue = (key, value) => {
  165. formItems.value.options.find(e => e.key === key).value = value
  166. }
  167. // 行业列表
  168. const industryList = ref([])
  169. getDict('menduner_industry_type', {}, 'industryList').then(({ data }) => {
  170. data = data?.length && data || []
  171. industryList.value = data
  172. })
  173. // 获取企业实名信息
  174. // const authInfo = ref({})
  175. // const statusList = [
  176. // { label: '未认证', color: '#fb8c00', value: null, mdi: 'mdi-shield-remove' },
  177. // { label: '审核中', color: '#fb8c00', value: '0', mdi: 'mdi-shield-half-full' },
  178. // { label: '已认证', color: '#00897B', value: '1', mdi: 'mdi-shield-check' },
  179. // { label: '已驳回', color: '#fe574a', value: '2', mdi: 'mdi-shield-off' }
  180. // ]
  181. // const getAuthInfo = async () => {
  182. // const data = await getEnterpriseAuth()
  183. // if (!data) return
  184. // authInfo.value = data
  185. // }
  186. // getAuthInfo()
  187. // const statusInfo = computed(() => {
  188. // const obj = (authInfo.value && Object.keys(authInfo.value).length) ? statusList.find(e => e.value === authInfo.value.status) : statusList[0]
  189. // return obj
  190. // })
  191. // 获取基本信息
  192. const getBaseInfo = async () => {
  193. let completeCount = 0
  194. const totalCount = formItems.value.options?.length || 0
  195. const data = await getEnterpriseBaseInfo()
  196. if (!data || !Object.keys(data).length) return emit('complete', { totalCount, completeCount, id: 'basicInfo' }) // 完成度展示
  197. query.id = data.id
  198. formItems.value.options.forEach(item => {
  199. if (item.dictTypeName) {
  200. getDict(item.dictTypeName).then(({ data }) => {
  201. data = data?.length && data || []
  202. item.items = data
  203. })
  204. }
  205. query.industryId = data.industryId
  206. if (item.key === 'industryId') {
  207. item.value = industryList.value.find(e => e.id === data[item.key])?.nameCn
  208. } else if (item.key === 'openTime') {
  209. item.value = data[item.key] ? data[item.key] : item.default
  210. } else item.value = data[item.key]
  211. // 完成度展示
  212. if (!item.rules || (item.value !== undefined && item.value !== null && item.value !== '')) completeCount++
  213. })
  214. // 完成度展示
  215. emit('complete', { totalCount, completeCount, id: 'basicInfo' })
  216. }
  217. getBaseInfo()
  218. // 所在行业
  219. const handleIndustry = (list, arr) => {
  220. if (!list.length) return
  221. query.industryId = list[0]
  222. const str = arr.map(e => e.nameCn).join('、')
  223. setValue('industryId', str)
  224. }
  225. const handleSave = async () => {
  226. const { valid } = await CtFormRef.value.formRef.validate()
  227. if (!valid) return
  228. formItems.value.options.forEach(e => {
  229. if (e.noParam) return
  230. query[e.key] = e.value
  231. })
  232. await updateEnterpriseBaseInfo(query)
  233. Snackbar.success(t('common.saveMsg'))
  234. await user.getEnterpriseInfo()
  235. getBaseInfo()
  236. }
  237. // defineExpose({
  238. // getBaseInfo
  239. // })
  240. </script>
  241. <style lang="scss" scoped>
  242. .topTip {
  243. background-color: #f7f8fa;
  244. color: #2f3640;
  245. padding: 12px 20px;
  246. margin: 10px 0 40px;
  247. font-size: 14px;
  248. }
  249. </style>