求职意向

src/components/FormUI/cascade/index.vue

@@ -17,6 +17,8 @@
         style="width: 100%;"
         :props="prop"
         :options="item.items"
+        :collapse-tags="item.collapseTags || false"
+        :collapse-tags-tooltip="true"
         @blur="handleBlur"
         @change="handleChange"
       ></el-cascader>

src/views/recruit/personal/PersonalCenter/resume/online/components/basicInfo.vue

@@ -342,6 +342,7 @@ const items = ref({
       itemText: 'name',
       itemValue: 'id',
       required: true,
+      checkStrictly: true,
       clearable: false,
       col: 6,
       items: [],
@@ -354,6 +355,7 @@ const items = ref({
       label: '户籍地',
       itemText: 'name',
       itemValue: 'id',
+      checkStrictly: true,
       required: false,
       clearable: true,
       col: 6,

src/views/recruit/personal/PersonalCenter/resume/online/components/jobIntention.vue

@@ -36,57 +36,7 @@
       <div v-else class="resumeNoDataText">{{ $t('resume.dataDefaultPrompt') }}{{ $t('resume.jobIntention') }}...</div>
     </div>
     <div v-if="isAdd" class="mt-2">
-      <CtForm ref="formPageRef" :items="items" style="width: 100%;">
-        <!-- 期望岗位 -->
-        <!-- <template #positionId="{ item }">
-          <v-menu :close-delay="1" :open-delay="0" v-bind="$attrs">
-            <template v-slot:activator="{  props }">
-              <textUI
-                :modelValue="item.value"
-                :item="item"
-                v-bind="props"
-                style="position: relative;"
-              ></textUI>
-            </template>
-            <jobTypeCard class="jobTypeCardBox" :select="[query.positionId].filter(Boolean)" :isSingle="true" @handleJobClick="handleJobClickItem"></jobTypeCard>
-          </v-menu>
-        </template> -->
-        <!-- 期望行业 -->
-        <template #industryIdList="{ item }">
-          <v-menu :close-delay="1" :open-delay="0" v-bind="$attrs" :close-on-content-click="false">
-            <template v-slot:activator="{  props }">
-              <textUI
-                v-model="item.value"
-                :item="item"
-                v-bind="props"
-              >
-                <template #default>
-                  <v-chip v-for="k in currentSelect" :key="k.id" class="mr-1" closable @click:close="handleIndustryClear(k)">{{ k.nameCn }}</v-chip>
-                </template>
-              </textUI>
-            </template>
-            <industryTypeCard :select="query.industryIdList" :currentData="currentSelect" showSelect @handleClickIndustry="handleIndustry"></industryTypeCard>
-          </v-menu>
-        </template>
-        <!-- 其它感兴趣的城市 -->
-        <template #interestedAreaIdList="{ item }">
-          <v-menu :close-delay="1" :open-delay="0" v-bind="$attrs" :close-on-content-click="false">
-            <template v-slot:activator="{  props }">
-              <TextInput
-                v-model="item.value"
-                :item="item"
-                v-bind="props"
-                style="position: relative;"
-              >
-                <template #default>
-                  <v-chip v-for="k in areaSelect" :key="k.id" class="mr-1" closable @click:close="handleAreaClear(k)">{{ k.name }}</v-chip>
-                </template>
-              </TextInput>
-            </template>
-            <AreaSelect :select="query.interestedAreaIdList" :currentData="areaSelect" :limit="false" showSelect @handleClick="handleArea"></AreaSelect>
-          </v-menu>
-        </template>
-      </CtForm>
+      <CtForm ref="formPageRef" :items="items" style="width: 100%;"></CtForm>
       <div class="text-end">
         <v-btn class="half-button mr-3" variant="tonal" @click="isAdd = false; resetForm()">{{ $t('common.cancel') }}</v-btn>
         <v-btn color="primary" class="half-button" @click="handleSave">{{ $t('common.save') }}</v-btn>
@@ -98,9 +48,6 @@
 <script setup name="jobIntention">
 import { ref, reactive } from 'vue'
 import CtForm from '@/components/CtForm'
-import textUI from '@/components/FormUI/TextInput'
-// import jobTypeCard from '@/components/jobTypeCard'
-import industryTypeCard from '@/components/industryTypeCard'
 import Snackbar from '@/plugins/snackbar'
 import Confirm from '@/plugins/confirm'
 import { saveResumeJobInterested, getResumeJobInterested, deleteResumeJobInterested } from '@/api/recruit/personal/resume'
@@ -129,26 +76,21 @@ const items = ref({
       rules: [v => !!v || '请选择期望岗位'],
       items: [],
     },
-    // {
-    //   slotName: 'positionId',
-    //   key: 'positionId',
-    //   value: '',
-    //   col: 6,
-    //   label: '期望岗位 *',
-    //   flexStyle: 'mr-3',
-    //   valueKey: 'position', 
-    //   hideDetails: true,
-    //   outlined: true,
-    //   rules: [v => !!v || '请选择期望岗位']
-    // },
     {
-      slotName: 'industryIdList',
+      type: 'cascade',
       key: 'industryIdList',
-      value: '',
-      outlined: true,
-      placeholder: '期望行业 *',
+      value: [],
+      default: [],
+      label: '期望行业',
+      itemText: 'nameCn',
+      itemValue: 'id',
+      required: true,
+      collapseTags: true,
+      clearable: false,
+      multiple: true,
       col: 6,
-      // rules: [v => !!v || '请选择期望行业']
+      rules: [v => !!v || '请选择期望行业'],
+      items: [],
     },
     {
       type: 'number',
@@ -220,25 +162,31 @@ const items = ref({
       itemValue: 'id',
       required: true,
       clearable: false,
+      checkStrictly: true,
       col: 6,
       items: [],
     },
     {
-      slotName: 'interestedAreaIdList',
+      type: 'cascade',
       key: 'interestedAreaIdList',
-      value: '',
-      placeholder: '其它感兴趣的城市'
+      value: [],
+      label: '其它感兴趣的城市',
+      itemText: 'name',
+      itemValue: 'id',
+      collapseTags: true,
+      checkStrictly: true,
+      clearable: false,
+      multiple: true,
+      items: []
     }
   ]
 })
 
+// 期望城市、其它感兴趣的城市
 getDict('areaTreeData', null, 'areaTreeData').then(({ data }) => {
   data = data?.length && data || []
-  if (!data?.length) return console.error('areaTreeData获取失败！')
-  const chinaTreeData = data
-  if (!chinaTreeData?.length) return console.error('chinaTreeData获取失败！')
-  const item = items.value.options.find(e => e.key === 'workAreaId')
-  if (item?.items) item.items = chinaTreeData
+  items.value.options.find(e => e.key === 'workAreaId').items = data
+  items.value.options.find(e => e.key === 'interestedAreaIdList').items = data
 })
 
 // 求职类型
@@ -252,6 +200,12 @@ getDict('positionTreeData', null, 'positionTreeData').then(({ data }) => {
   items.value.options.find(e => e.key === 'positionId').items = data
 })
 
+// 期望行业
+getDict('industryTreeData', null, 'industryTreeData').then(({ data }) => {
+  data = data?.length && data || []
+  items.value.options.find(e => e.key === 'industryIdList').items = data
+})
+
 // 获取求职意向
 const interestList = ref([])
 const getJobInterested = async () => {
@@ -266,65 +220,21 @@ const getJobInterested = async () => {
 }
 getJobInterested()
 
-const setValue = (key, value) => {
-  items.value.options.find(e => e.key === key).value = value
-}
-
-// // 期望职位
-// const handleJobClickItem = (list, name) => {
-//   if (!list.length) return
-//   query.positionId = list[0]
-//   setValue('positionId', name)
-// }
-
-// 行业类型
-let currentSelect = reactive([])
-const handleIndustry = (list, arr) => {
-  if (!list.length) return setValue('industryIdList', '')
-  query.industryIdList = list
-  currentSelect = arr
-  // const str = arr.map(e => e.nameCn).join('、')
-  // setValue('industryIdList', str)
-}
-
-const handleIndustryClear = (k) => {
-  query.industryIdList = query.industryIdList.filter(i => i !== k.id)
-  const index = currentSelect.findIndex(i => i.id === k.id)
-  if (index !== -1) currentSelect.splice(index, 1)
-}
-
-// 其它感兴趣的城市
-let areaSelect = reactive([])
-const handleArea = (list, arr) => {
-  if (!list.length) return setValue('interestedAreaIdList', '')
-  query.interestedAreaIdList = list
-  areaSelect = arr
-}
-const handleAreaClear = (k) => {
-  query.interestedAreaIdList = query.interestedAreaIdList.filter(i => Number(i) !== Number(k.id))
-  const index = areaSelect.findIndex(i => Number(i.id) === Number(k.id))
-  if (index !== -1) areaSelect.splice(index, 1)
-}
-
 const resetForm = () => {
   items.value.options.forEach(e => {
-    if (e.key === 'industryIdList') e.value = ''
+    if (e.key === 'industryIdList') e.value = []
     else e.value = null
   })
   editId.value = null
   query = {}
-  currentSelect = []
-  areaSelect = []
 }
 
-const arr = ['payFrom', 'payTo', 'jobType', 'workAreaId', 'positionId']
 const handleSave = async () => {
   const { valid } = await formPageRef.value.formRef.validate()
   if (!valid) return
   items.value.options.forEach(e => {
-    if (arr.includes(e.key)) query[e.key] = e.value 
+    query[e.key] = e.value 
   })
-  if (!query.industryIdList || !query.industryIdList.length) return Snackbar.warning('请选择您的期望行业')
   if (editId.value) query.id = editId.value
   await saveResumeJobInterested(query)
   Snackbar.success('保存成功')
@@ -337,17 +247,11 @@ const handleEdit = async (item) => {
   editId.value = item.id
   items.value.options.forEach(e => {
     query[e.key] = item[e.key] 
-    if (e.valueKey) {
-      e.value = item[e.valueKey]
-    } else e.value = item[e.key]
-    if (e.key === 'industryIdList') e.value = null
+    e.value = item[e.key]
     if (e.key === 'interestedAreaIdList') {
-      e.value = null
-      query.interestedAreaIdList = item.interestedAreaIdList && item.interestedAreaIdList.length ? item.interestedAreaIdList : []
+      e.value = item[e.key] && item[e.key].length ? item[e.key].map(e => Number(e)) : []
     }
   })
-  currentSelect = item.industry
-  areaSelect = item.interestedArea && item.interestedArea.length ? item.interestedArea : []
   isAdd.value = true
 }
 
@@ -384,7 +288,7 @@ const handleDelete = ({ id }) => {
   }
 }
 .text-box {
-  max-width: 200px;
+  max-width: 300px;
   white-space: nowrap;
   text-overflow: ellipsis;
   overflow: hidden;

src/views/recruit/personal/PersonalCenter/resume/online/components/portrait.vue

@@ -2,7 +2,7 @@
   <div>
     <span>个人画像：</span>
     <v-chip size="small" label v-for="(k, i) in list" :key="i" class="mr-2 mb-2" color="primary" closable @click:close="handleDelete(k)">{{ k }}</v-chip>
-    <v-btn icon="mdi-plus" variant="outlined" color="primary" size="small" @click="handleAdd"></v-btn>
+    <v-btn class="ml-3 mb-2" icon="mdi-plus" variant="outlined" color="primary" size="s-small" @click="handleAdd"></v-btn>
   </div>
 
   <div class="d-flex align-center cursor-pointer color-primary mt-3 font-size-18" @click="handleShareCode">