Procházet zdrojové kódy

Merge branch 'dev' of https://git.citupro.com/zhengnaiwen_citu/menduner into dev

Xiao_123 před 1 rokem
rodič
revize
7556543133

+ 286 - 12
src/views/resume/components/right/basicInfo.vue

@@ -7,23 +7,39 @@
     </div>
     <!-- 基础信息 -->
     <div style="flex: 1;" class="mr-8 mt-5">
-      <CtForm :items="items" style="width: 100%;"></CtForm>
+      <div class="d-flex justify-space-between">
+        <div v-for="(val, index) in itemsArr" :key="index" style="width: calc(50% - 12px);">
+          <CtForm :items="val.items" style="width: 100%;">
+            <template v-slot:phoneNum>
+              <v-btn variant="text" class="ml-2" color="primary">更改</v-btn>
+            </template>
+          </CtForm>
+        </div>
+      </div>
+      <div class="d-flex justify-center">
+        <v-btn variant="text" color="primary" v-if="isExpand" @click="expand">收起</v-btn>
+        <v-btn variant="text" color="primary" v-else @click="expand">展开</v-btn>
+      </div>
     </div>
   </div>
 </template>
 
 <script setup>
-import CtForm from '@/components/CtForm';
+import CtForm from '@/components/CtForm'
+// import { getYearMonth20YearsAgo, generateYearMonthDataArray } from './../../utils/generateYearMonthData'
 import { ref } from 'vue';
 
 defineOptions({name: 'resume-components-right-basicInfo'})
 const showIcon = ref(false)
+const isExpand = ref(false)
+// const defaultYearMonthValue = ref(getYearMonth20YearsAgo())
+// const yearMonth = ref(generateYearMonthDataArray())
 const items = ref({
   options: [
     {
       type: 'text',
       key: 'name',
-      value: null,
+      value: '陈芊芊',
       default: null,
       label: '姓名 *',
       outlined: true,
@@ -38,31 +54,289 @@ const items = ref({
       width: 70,
       items: [{ label: '男', value: true }, { label: '女', value: false }],
     },
+    {
+      type: 'text',
+      key: 'name',
+      value: '2021年05月03日',
+      default: null,
+      label: '出生日期',
+      outlined: true,
+      disabled: true,
+    },
+    // {
+    //   type: 'autocomplete',
+    //   key: 'birth',
+    //   value: defaultYearMonthValue,
+    //   default: null,
+    //   label: '请选择出生年月 *',
+    //   outlined: true,
+    //   // dense: true,
+    //   itemText: 'label',
+    //   itemValue: 'value',
+    //   rules: [v => !!v || '请选择出生年月'],
+    //   items: yearMonth
+    // },
+    {
+      type: 'text',
+      key: 'phoneNum',
+      value: '18466958635',
+      default: null,
+      label: '电话号码',
+      outlined: true,
+      disabled: true,
+      slotName: 'phoneNum',
+      rules: [v => !!v || '请输入电话号码']
+    },
     {
       type: 'autocomplete',
       key: 'birth',
-      value: null,
+      value: '01111',
       default: null,
-      label: '请选择出生年月 *',
+      label: '所在城市 *',
       outlined: true,
-      dense: true,
       itemText: 'label',
       itemValue: 'value',
-      rules: [v => !!v || '请选择出生年月'],
-      items: []
+      rules: [v => !!v || '请选择所在城市'],
+      items: [{ label: '广州', value: '01111'}]
     },
     {
       type: 'text',
-      key: 'name',
-      value: null,
+      key: 'email',
+      value: '69852936@qq.com',
       default: null,
-      label: '姓名 *',
+      label: '常用邮箱',
       outlined: true,
-      rules: [v => !!v || '请输入姓名']
+      rules: [v => !!v || '请输入常用邮箱']
+    },
+    {
+      type: 'autocomplete',
+      key: 'workExperience',
+      value: '4',
+      default: null,
+      label: '工作经验 *',
+      outlined: true,
+      itemText: 'label',
+      itemValue: 'value',
+      rules: [v => !!v || '请选择工作经验'],
+      items: [
+        {
+          id: 1600, 
+          label: "在校生", 
+          value: "0", 
+        }, 
+        {
+          id: 1601, 
+          label: "应届生", 
+          value: "1", 
+        }, 
+        {
+          id: 1602, 
+          label: "经验不限", 
+          value: "2", 
+        }, 
+        {
+          id: 1603, 
+          label: "1年以内", 
+          value: "3", 
+        }, 
+        {
+          id: 1604, 
+          label: "1-3年", 
+          value: "4", 
+        }, 
+        {
+          id: 1605, 
+          label: "3-5年", 
+          value: "5", 
+        }, 
+        {
+          id: 1606, 
+          label: "5-10年", 
+          value: "6", 
+        }, 
+        {
+          id: 1607, 
+          label: "10年以上", 
+          value: "7", 
+        }
+      ]
+    },
+    {
+      type: 'autocomplete',
+      key: 'edu',
+      value: '4',
+      default: null,
+      label: '最高学历 *',
+      outlined: true,
+      itemText: 'label',
+      itemValue: 'value',
+      rules: [v => !!v || '请选择最高学历'],
+      items: [
+        {
+          id: 1552, 
+          label: "初中及以下", 
+          value: "0"
+        }, 
+        {
+          id: 1553, 
+          label: "中专/中技", 
+          value: "1"
+        }, 
+        {
+          id: 1554, 
+          label: "高中", 
+          value: "2"
+        }, 
+        {
+          id: 1555, 
+          label: "大专", 
+          value: "3"
+        }, 
+        {
+          id: 1556, 
+          label: "本科", 
+          value: "4"
+        }, 
+        {
+          id: 1557, 
+          label: "硕士", 
+          value: "5"
+        }, 
+        {
+          id: 1558, 
+          label: "博士", 
+          value: "6"
+        }, 
+        {
+          id: 1559, 
+          label: "其他", 
+          value: "99"
+        }
+      ]
     },
   ]
 })
 
+const itemsArr = ref([])
+const getItemsArr = () => {
+  // arr = arr ? arr : items.value
+  itemsArr.value = [
+    { items: { options: [ ...items.value.options.filter((_, index) => (index + 2) % 2 === 0) ] } },
+    { items: { options: [ ...items.value.options.filter((_, index) => (index + 2) % 2 === 1) ] } }
+  ]
+}
+getItemsArr()
+
+const expand = () => {
+  if (isExpand.value) {
+    items.value.options.splice(8, items.value.options.length)
+  } else {
+    const expandArr = [
+      {
+        type: 'autocomplete',
+        key: 'workType',
+        value: '0',
+        default: null,
+        label: '求职类型 *',
+        outlined: true,
+        itemText: 'label',
+        itemValue: 'value',
+        rules: [v => !!v || '请选择求职类型'],
+        items: 
+        [
+          {
+            id: 1548, 
+            label: "全职", 
+            value: "0"
+          }, 
+          {
+            id: 1549, 
+            label: "兼职", 
+            value: "1"
+          }, 
+          {
+            id: 1550, 
+            label: "临时", 
+            value: "2"
+          }, 
+          {
+            id: 1551, 
+            label: "实习", 
+            value: "3"
+          }
+        ]
+      },
+      {
+        type: 'autocomplete',
+        key: 'sale',
+        value: '5',
+        default: null,
+        label: '薪资要求 *',
+        outlined: true,
+        itemText: 'label',
+        itemValue: 'value',
+        rules: [v => !!v || '请选择薪资要求'],
+        items: 
+        [
+          {
+            id: 1612, 
+            label: "不限", 
+            value: "0"
+          }, 
+          {
+            id: 1613, 
+            label: "3K以下", 
+            value: "1"
+          }, 
+          {
+            id: 1614, 
+            label: "3-5K", 
+            value: "2"
+          }, 
+          {
+            id: 1615, 
+            label: "5-10K", 
+            value: "3"
+          }, 
+          {
+            id: 1616, 
+            label: "10-20K", 
+            value: "4"
+          }, 
+          {
+            id: 1617, 
+            label: "20-50K", 
+            value: "5"
+          }, 
+          {
+            id: 1618, 
+            label: "50K以上", 
+            value: "6"
+          }
+        ]
+      },
+      {
+        type: 'text',
+        key: 'name',
+        value: '酒店经理',
+        default: null,
+        label: '期望职位',
+        outlined: true
+      },
+      {
+        type: 'text',
+        key: 'name',
+        value: '行业不限',
+        default: null,
+        label: '期望行业',
+        outlined: true
+      }
+    ]
+    items.value.options = [...items.value.options, ...expandArr]
+  }
+  getItemsArr()
+  isExpand.value = !isExpand.value
+}
 
 </script>
 <style lang="scss" scoped>

+ 36 - 0
src/views/resume/utils/generateYearMonthData.js

@@ -0,0 +1,36 @@
+// 近100年的YYYY-MM [{ label: '2024-05', value: 202405 }]
+export const generateYearMonthDataArray = () => {
+  const currentYear = new Date().getFullYear()
+  const yearMonthData = []
+  
+  for (let i = 0; i < 100; i++) {  
+    const year = currentYear - i
+    for (let month = 0; month < 12; month++) {  
+      const label = `${year}-${('0' + (month + 1)).slice(-2)}`; // 格式化为 "YYYY-MM"  
+      const value = parseInt(`${year}${('0' + (month + 1)).slice(-2)}`, 10); // 转换为整数格式 "YYYYMM"  
+      yearMonthData.push({ label, value })
+    }  
+  }  
+  
+  return yearMonthData; 
+}
+// 20年前的YYYYMM 返回:202405
+export const getYearMonth20YearsAgo = () => {
+  // 获取当前日期  
+  const now = new Date()
+      
+  // 设置年份为20年前  
+  now.setFullYear(now.getFullYear() - 20)
+    
+  // 需要注意的是,我们不能直接设置月份为0(因为月份是从0开始的),  
+  // 但由于我们只是要获取年和月,并不真正需要修改日期的月份部分,  
+  // 所以我们可以保持月份不变。  
+    
+  // 格式化年月为六位数的字符串  
+  const yearMonthString = `${now.getFullYear()}${('0' + (now.getMonth() + 1)).slice(-2)}`
+    
+  // 将字符串转换为数字类型  
+  const yearMonthNumber = parseInt(yearMonthString, 10)
+    
+  return yearMonthNumber
+}