获取城市中文

src/store/user.js

@@ -6,6 +6,7 @@ import { logout } from '@/api/common/index'
 import { getUserInfo } from '@/api/personal/user'
 import Snackbar from '@/plugins/snackbar'
 import { timesTampChange } from '@/utils/date'
+import { getAreaName } from '@/utils/getText'
 
 
 export const useUserStore = defineStore('user',
@@ -62,19 +63,19 @@ export const useUserStore = defineStore('user',
       try {
         const data = await getBaseInfo({ userId: userId || accountInfo.userId })
         // baseInfo = data
-        baseInfo = getFieldText(data)
-        localStorage.setItem('baseInfo', JSON.stringify(data))
+        baseInfo = await getFieldText(data)
+        localStorage.setItem('baseInfo', JSON.stringify(baseInfo))
       } catch (error) {
         Snackbar.error(error.msg)
       }
     }
     // 字典对应中文
-    const getFieldText = (data) => {
-      if (data.areaId && data.areaId !== 0) data.areaText = '广州' // 现居住地text
+    const getFieldText = async (data) => {
+      if (data.areaId && data.areaId !== 0) data.areaName = await getAreaName(data.areaId) // 现居住地text
       if (data.birthday && data.birthday !== 0) data.birthdayText = timesTampChange(data.birthday).slice(0, 10) // 出生日期
       if (data.eduType && data.eduType !== 0) data.eduTypeText = '硕士' // 学历
       if (data.expType && data.expType !== 0) data.expTypeText = '1-3年' // 工作经验
-      if (data.sex && data.sex !== 0) data.sexTypeText = '男' // 性别
+      if (data.sex && data.sex !== 0) data.sexTypeText = data.sex === '1' ? '男' : '女' // 性别
       if (data.maritalStatus && data.maritalStatus !== 0) data.maritalText = '未婚' // 	婚姻状况
       if (data.jobStatus && data.jobStatus !== 0) data.jobStatusText = '离职-随时到岗' // 	求职状态
       if (data.jobType && data.jobType !== 0) data.jobTypeText = '全职' // 	求职类型

src/utils/getText.js

@@ -1,11 +1,33 @@
+import { getDict } from '@/hooks/web/useDictionaries'
+
 export const getText = (value, arr, itemText = 'label', itemValue = 'value') => { // 一维数组
   // console.log('getText', value, arr)
-  if (!arr?.length || !(value && value !==0)) return
+  if (!arr?.length || !(value && value !== 0)) return
   const item = arr.find(formItem => formItem[itemValue] === value)
   if (!item) return
   return item[itemText]
 }
 
+
+export const getAreaName = (value, arr, itemText = 'name', itemValue = 'id') => { // 一维数组
+  let str = '暂无'
+  if (!value && value !== 0) return
+  if (!arr?.length) {
+    getDict('menduner_area_type', {}, 'areaList').then(({ data }) => {
+      arr = data?.length && data || []
+      if (!arr?.length) return
+      getItemText ()
+    })
+  } else getItemText ()
+
+  function getItemText () {
+    const item = arr.find(formItem => formItem[itemValue] === value)
+    if (!item) return
+    str = item[itemText]
+    return str
+  }
+}
+
 export const dealCanBeInputtedValueAndLabel = (formItem, item) => {
   if (item[formItem.key] && item[formItem.itemTextName]) { formItem.search(item[formItem.itemTextName], '触发下拉框内容'); formItem.value = item[formItem.key] }
   else { formItem.value = item[formItem.itemTextName]; formItem[formItem.itemTextName] = item[formItem.itemTextName] }

src/views/PersonalCenter/dynamic/left.vue

@@ -33,7 +33,7 @@
         <div>
           <span>出生日期：{{ baseInfo?.birthdayText || '暂无' }}</span>
         </div>
-        <div class="mt-3">现居地址： {{ baseInfo?.areaText || '暂无' }}</div>
+        <div class="mt-3">现居地址： {{ baseInfo?.areaName || '暂无' }}</div>
       </div>
       <div class="slider-btn">
         <v-btn class="slider-btn-item" rounded variant="outlined" color="primary" append-icon="mdi-menu-right" to="/resume">在线简历</v-btn>

src/views/resume/components/basicInfo.vue

@@ -11,8 +11,8 @@
           bordered 
           offset-x="-25" 
           offset-y="33" 
-          :color="baseInfo?.sex ? (baseInfo?.sex === '0' ? '#1867c0' : 'error') : 'error'" 
-          :icon="baseInfo?.sex ? (baseInfo?.sex === '0' ? 'mdi-gender-male' : 'mdi-gender-female') : 'mdi-gender-female'">
+          :color="baseInfo?.sex ? (baseInfo?.sex === '1' ? '#1867c0' : 'error') : 'error'" 
+          :icon="baseInfo?.sex ? (baseInfo?.sex === '1' ? 'mdi-gender-male' : 'mdi-gender-female') : 'mdi-gender-female'">
           <v-avatar size=80 :image="baseInfo.avatar || 'https://minio.citupro.com/dev/menduner/7.png'"></v-avatar>
           <div v-show="showIcon" class="mdi mdi-camera-outline"></div>
         </v-badge>
@@ -23,7 +23,20 @@
         <div v-if="isEdit">
           <CtForm ref="CtFormRef" :items="formItems" style="width: 100%;">
             <template v-slot:phone>
-              <v-btn variant="text" class="ml-2" color="primary">更改</v-btn>
+              <v-btn variant="text" class="ml-2" color="primary">{{ $t('common.change') }}</v-btn>
+            </template>
+            <template #areaType="{ item }">
+              <v-menu :close-delay="1" :open-delay="0" v-bind="$attrs">
+                <template v-slot:activator="{  props }">
+                  <textUI
+                    v-model="item[item.nameKey]"
+                    :item="item"
+                    v-bind="props"
+                    style="position: relative;"
+                  ></textUI>
+                </template>
+                <areaType :isIntType="false" :select="[baseInfo?.areaId].filter(Boolean)" @handleAreaClick="handleArea" class="jobTypeCardBox" isSingle></areaType>
+              </v-menu>
             </template>
           </CtForm>
           <div class="text-end">
@@ -38,7 +51,7 @@
             <div class="listBox" :style="{ height: isExpand ? 'auto' : '68px' }">
               <div>
                 <span class="mdi mdi-map-marker-outline"></span>
-                <span>{{ baseInfo.areaText }}</span>
+                <span>{{ baseInfo.areaName || '暂无' }}</span>
               </div>
               <div>
                 <span class="mdi mdi-phone-outline"></span>
@@ -95,6 +108,8 @@
 <script setup>
 import CtForm from '@/components/CtForm'
 import Snackbar from '@/plugins/snackbar'
+import areaType from '@/components/AreaSelect'
+import textUI from '@/components/FormUI/TextInput'
 import { getDict } from '@/hooks/web/useDictionaries'
 import { getTimeStamp, timesTampChange } from '@/utils/date'
 import { saveResumeBasicInfo } from '@/api/resume'
@@ -130,7 +145,7 @@ const formItems = ref({
     {
       type: 'ifRadio',
       key: 'sex',
-      value: 0,
+      value: '0', // '1' ? '男' : '女'
       default: 0,
       label: '性别',
       col: 6,
@@ -164,17 +179,25 @@ const formItems = ref({
       slotName: 'phone',
     },
     {
-      type: 'autocomplete',
+      // type: 'autocomplete',
+      // key: 'areaId',
+      // value: null,
+      // default: null,
+      // label: '所在城市 *',
+      // col: 6,
+      // outlined: true,
+      // itemText: 'label',
+      // itemValue: 'value',
+      // rules: [v => !!v || '请选择所在城市'],
+      // items: [{ label: '广州', value: '440100'}]
+      slotName: 'areaType',
       key: 'areaId',
       value: null,
-      default: null,
       label: '所在城市 *',
+      nameKey: 'areaName', // 展示出来id对应的内容
       col: 6,
-      outlined: true,
-      itemText: 'label',
-      itemValue: 'value',
-      rules: [v => !!v || '请选择所在城市'],
-      items: [{ label: '广州', value: '440100'}]
+      flexStyle: 'mr-3',
+      rules: [v => !!v || '请选择所在城市']
     },
     {
       type: 'text',
@@ -287,8 +310,8 @@ const handleSave = async () => {
   if (!valid) return
   const obj = {}
   formItems.value.options.forEach(e => {
-    if (e.noReturn) return
-    else if (e.type === 'datepicker') obj[e.key] = getTimeStamp(e.value)
+    // if (e.nameKey) obj[e.nameKey] = e.nameKey
+    if (e.type === 'datepicker') obj[e.key] = getTimeStamp(e.value)
     else obj[e.key] = e.value
   })
   await saveResumeBasicInfo(obj)
@@ -299,6 +322,20 @@ const handleSave = async () => {
   await getBasicInfo()
 }
 
+// 城市
+const setValue = (key, id, name) => {
+  const item =  formItems.value.options.find(e => e.key === key)
+  if (item) {
+    item.value = id
+    item[item.nameKey] = name
+  }
+}
+const handleArea = (list, name) => {
+  if (!list.length) return
+  const id = list[0]
+  setValue('areaId', id, name)
+}
+
 // 获取字典内容
 const getDictData = async (dictTypeName) => {
   const item = formItems.value.options.find(e => e.dictTypeName === dictTypeName)
@@ -307,7 +344,6 @@ const getDictData = async (dictTypeName) => {
     item.items = data
   }
 }
-
 formItems.value.options.forEach((e, index) => {
   if ((index + 2) % 2 === 0) e.flexStyle = 'mr-3'
   if (e.dictTypeName) getDictData(e.dictTypeName) // 查字典set options
@@ -318,7 +354,11 @@ formItems.value.options.forEach((e, index) => {
 })
 </script>
 <style lang="scss" scoped>
-
+.jobTypeCardBox {
+  position: absolute;
+  top: -22px;
+  left: 0;
+}
 .avatarsBox {
   height: 80px;
   width: 80px;