我的简历

src/api/PersonalCenter/index.js

@@ -2,8 +2,8 @@
  * @Description: 个人中心
  * @Author: 空白格
  * @Date: 2022-08-15 14:26:14
- * @LastEditors: wangcc
- * @LastEditTime: 2022-08-24 18:01:54
+ * @LastEditors: gcz
+ * @LastEditTime: 2022-08-25 11:41:09
  * @FilePath: \veterans_client_web\src\api\PersonalCenter\index.js
  * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
  */
@@ -72,4 +72,30 @@ export function getIdInfo(params) {
     method: 'get',
     params
   })
+}
+
+/**
+ * 保存求职意向
+ * @param {*} params
+ * @returns
+ */
+export function saveJobIntention(data) {
+  return request({
+    url: '/app/memberinfo/saveJobIntention',
+    method: 'put',
+    data
+  })
+}
+
+/**
+ * 保存自我评价
+ * @param {*} params
+ * @returns
+ */
+export function saveSelfAssessment(data) {
+  return request({
+    url: '/app/memberinfo/saveSelfAssessment',
+    method: 'put',
+    data
+  })
 }

src/assets/images/link-page-icon.svg

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16px" height="16px" viewBox="0 0 16 16" version="1.1">
+  <title>形状</title>
+  <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="我的-简历" transform="translate(-1524.000000, -767.000000)" fill="#999999" fill-rule="nonzero">
+      <path d="M1538.5436,782.999984 L1525.45693,782.999984 C1525.07053,782.999984 1524.69995,782.846518 1524.42673,782.573378 C1524.1535,782.300238 1524,781.92978 1524,781.543501 L1524,768.471193 C1524,768.085482 1524.15327,767.71557 1524.4261,767.442831 C1524.69892,767.170093 1525.06895,767.01687 1525.45479,767.01687 L1534.18218,767.01687 C1534.4518,767.01687 1534.67037,767.235369 1534.67037,767.504902 C1534.67037,767.774435 1534.4518,767.992935 1534.18218,767.992935 L1525.93749,767.992935 C1525.68065,767.99265 1525.43425,768.094519 1525.25264,768.276072 C1525.07103,768.457624 1524.96913,768.703944 1524.96941,768.960698 L1524.96941,781.067117 C1524.96877,781.324078 1525.07052,781.570715 1525.25218,781.752516 C1525.43384,781.934316 1525.68044,782.036309 1525.93749,782.035952 L1538.05582,782.035952 C1538.31284,782.036237 1538.5594,781.934221 1538.74104,781.752437 C1538.92268,781.570652 1539.02446,781.324057 1539.02389,781.067117 L1539.02389,772.348675 C1539.02389,772.174362 1539.11691,772.013289 1539.26791,771.926131 C1539.41892,771.838974 1539.60497,771.838974 1539.75598,771.926131 C1539.90698,772.013289 1540,772.174362 1540,772.348675 L1540,781.552338 C1539.99965,781.937605 1539.84583,782.30687 1539.57254,782.578516 C1539.29925,782.850161 1538.92899,783.001818 1538.5436,782.999984 L1538.5436,782.999984 Z M1530.6324,776.586859 C1530.51006,776.712341 1530.32965,776.762325 1530.16015,776.717699 C1529.99065,776.673073 1529.85828,776.540738 1529.81364,776.371292 C1529.769,776.201846 1529.81899,776.021495 1529.94452,775.899195 L1538.65772,767.150761 C1538.77953,767.02296 1538.96108,766.971236 1539.13199,767.01564 C1539.30289,767.060044 1539.43628,767.193594 1539.48043,767.364515 C1539.52458,767.535435 1539.47256,767.716849 1539.34453,767.838424 L1530.6324,776.586859 Z" id="形状"></path>
+    </g>
+  </g>
+</svg>

src/router/index.js

@@ -168,6 +168,15 @@ const routes = [
           title: '我的简历'
         }
       },
+      {
+        path: 'personalcenter/resumeEdit',
+        name: 'ResumeEdit',
+        component: () =>
+          import('@/views/PersonalCenter/Resume/ResumeEdit.vue'),
+        meta: {
+          title: '编辑简历'
+        }
+      },
       {
         path: 'personalcenter/deliver',
         name: 'DeliverIndex',

src/views/PersonalCenter/Resume/ResumeEdit.vue

@@ -0,0 +1,361 @@
+<!--
+ * @Description: 
+ * @Author: gcz
+ * @Date: 2022-08-25 09:38:41
+ * @LastEditors: gcz
+ * @LastEditTime: 2022-08-25 11:46:23
+ * @FilePath: \veterans_client_web\src\views\PersonalCenter\Resume\ResumeEdit.vue
+ * @Copyright: Copyright (c) 2016~2022 by gcz, All Rights Reserved. 
+-->
+<template>
+  <div class="app-main">
+    <BannerBreadcrumb title="我的简历" :breadcrumb="false" />
+    <div class="banner-breadcrumb-breadcrumb">
+      <el-breadcrumb separator-class="el-icon-arrow-right">
+        <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
+        <el-breadcrumb-item :to="{ path: '/personalcenter' }"
+          >我的</el-breadcrumb-item
+        >
+        <el-breadcrumb-item>我的简历</el-breadcrumb-item>
+      </el-breadcrumb>
+    </div>
+    <div class="app-main-box">
+      <div class="app-main-box-content resume">
+        <div class="title">我的简历</div>
+        <el-row>
+          <el-col :span="16">
+            <div class="name">{{ memberinfo.name }}</div>
+            <div class="">
+              {{ memberinfo.menSex === 1 ? "女" : "男" }} ·
+              <span class="position" v-if="memberinfo.jobStatus !== 0">
+                · <span class="c-yellow">入职中</span>
+                <span>(memberinfo.company)</span>
+              </span>
+              <span class="c-yellow" v-else>未入职</span>
+            </div>
+          </el-col>
+          <el-col :span="8">
+            <div class="avatar hexagon">
+              <div
+                class="avatar-box hexagon-box"
+                :style="{
+                  backgroundImage: `url('${
+                    memberinfo.avatar
+                      ? memberinfo.avatar
+                      : 'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png'
+                  }')`,
+                }"
+              ></div>
+            </div>
+          </el-col>
+        </el-row>
+        <el-row class="resumm-item">
+          <el-col :span="24">
+            <div class="item-title">基本信息</div>
+            <p>
+              退役军人 ·
+              {{ memberinfo.menBirth ? getAge(memberinfo.menBirth) : "-" }}岁 ·
+              {{ memberinfo.politOutlook || "-" }} ·
+              {{ memberinfo.degrEduc || "-" }}
+            </p>
+            <p>电话：{{ memberinfo.mobile }}</p>
+          </el-col>
+        </el-row>
+        <el-form ref="form" :model="form" label-width="80px">
+          <div class="form-title">求职意向</div>
+          <el-row :gutter="24">
+            <el-col :span="12">
+              <el-form-item
+                label="最低工资"
+                prop="expectedLowestSalary"
+              >
+                <el-col :span="8">
+                  <el-select v-model="form.expectedLowestSalary" placeholder="请选择">
+                    <el-option
+                      v-for="item of 50"
+                      :disabled="item >= form.expectedHighestSalary"
+                      :key="item"
+                      :label="item"
+                      :value="item"
+                    >
+                    </el-option>
+                  </el-select>
+                </el-col>
+                <el-col :span="4">
+                  <div
+                    :style="{
+                      width: '100%',
+                      fontSize: '50px',
+                      textAlign: 'center',
+                    }"
+                  >
+                    ~
+                  </div>
+                </el-col>
+                <el-col :span="8">
+                  <el-select v-model="form.expectedHighestSalary" placeholder="请选择">
+                    <el-option
+                      v-for="item of 50"
+                      :disabled="item <= form.expectedLowestSalary"
+                      :key="item"
+                      :label="item"
+                      :value="item"
+                    >
+                    </el-option>
+                  </el-select>
+                </el-col>
+                <el-col :span="2">
+                  <div
+                    :style="{
+                      width: '100%',
+                      fontSize: '40px',
+                      paddingLeft: '3px',
+                      fontWeight: 1,
+                    }"
+                  >
+                    K
+                  </div>
+                </el-col>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="意向地区" prop="intentionArea">
+                <el-cascader
+                  filterable
+                  size="large"
+                  ref="addressSelect"
+                  :options="addressOptions"
+                  v-model="form.intentionArea"
+                  :leafOnly="true"
+                  @change="addrChange"
+                >
+                </el-cascader>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="期望行业">
+                <el-input v-model="form.expectedIndustry"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="期望职位">
+                <el-input v-model="form.expectedPost"></el-input>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <div class="btn-wrap">
+            <span class="btn" @click="saveJobIntention">保存</span>
+          </div>
+        </el-form>
+        <section class="resumm-item self-assessment">
+          <div class="item-title">自我评价</div>
+          <el-input
+            class="textarea"
+            type="textarea"
+            :rows="5"
+            placeholder="请输入自我评价"
+            v-model="selfAssessment">
+          </el-input>
+          <div class="btn-wrap">
+            <span class="btn" @click="saveSelfAssessment">保存</span>
+          </div>
+        </section>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import BannerBreadcrumb from "@/components/BannerBreadcrumb";
+import { getPersonInfoData ,saveJobIntention,saveSelfAssessment} from "@/api/PersonalCenter";
+import { regionDataPlus,regionData, CodeToText,TextToCode  } from "element-china-area-data";
+export default {
+  name: "Resume",
+  components: {
+    BannerBreadcrumb,
+  },
+  data() {
+    return {
+      addressOptions: regionDataPlus,
+      memberinfo: {},
+      form: {
+        intentionArea:[],
+        expectedPost:'',
+        expectedIndustry:'',
+        expectedLowestSalary:null,
+        expectedHighestSalary:null,
+      },
+      selfAssessment:''
+    };
+  },
+  created() {
+    this.getPersonInfo();
+  },
+  methods: {
+    /**
+     * 获取个人信息
+     * @date 2022-08-15
+     * @returns {any}
+     */
+    getPersonInfo() {
+      getPersonInfoData().then((res) => {
+        if (res.code === 200) {
+          this.memberinfo = res?.data;
+          // this.form.provinceId = res?.data?.provinceId;
+          // this.form.provinceName = res?.data?.provinceName;
+          // this.form.cityId = res?.data?.cityId;
+          // this.form.cityName = res?.data?.cityName;
+          // this.form.areaId = res?.data?.areaId;
+          // this.form.areaName  = res?.data?.areaName ;
+          this.form.expectedPost = res?.data?.expectedPost||'';
+          this.form.expectedIndustry = res?.data?.expectedIndustry||'';
+          this.form.expectedLowestSalary = Number( res?.data?.expectedLowestSalary );
+          this.form.expectedHighestSalary = Number( res?.data?.expectedHighestSalary );
+
+          this.form.intentionArea = [];
+          this.form.intentionArea.push(res?.data?.provinceId.toString())
+          this.form.intentionArea.push(res?.data?.cityId.toString())
+          this.form.intentionArea.push(res?.data?.areaId.toString())
+
+          this.selfAssessment = res?.data?.selfAssessment||'';
+          console.log("this.form", this.form);
+        }
+      });
+    },
+    /**
+     * 通过出生年月计算年龄
+     * @param { String } date
+     */
+    getAge(date) {
+      const birth = new Date(date).valueOf();
+      const now = new Date().valueOf();
+      const age = (now - birth) / 1000 / 60 / 60 / 24 / 365;
+      return parseInt(age);
+    },
+    addrChange(value) {
+        this.form.provinceId =value[0];
+        this.form.cityId = value[1];
+        this.form.areaId = value[2];
+        this.form.provinceName = CodeToText[value[0]];
+        this.form.cityName = CodeToText[value[1]];
+        this.form.areaName = CodeToText[value[2]];
+      console.log("this.provinceName", this.provinceName);
+      console.log("addrChange", value);
+    },
+    saveJobIntention(){
+      saveJobIntention(this.form).then(res=>{
+        this.$message.success(res.msg)
+        // console.log('saveJobIntention',res);
+      })
+    },
+    saveSelfAssessment(){
+      saveSelfAssessment({selfAssessment:this.selfAssessment}).then(res=>{
+        this.$message.success(res.msg)
+      })
+    },
+  },
+};
+</script>
+
+<style lang='scss' scoped>
+.c-yellow {
+  color: #ff6901;
+}
+
+.app-main-box-content {
+  min-height: calc(100vh - 73px - 104px - 64px - 100px - 23px - 40px);
+}
+.banner-breadcrumb-breadcrumb {
+  background-color: #fff;
+  :deep(.el-breadcrumb) {
+    width: 70%;
+    height: 64px;
+    line-height: 64px;
+    min-width: 600px;
+    margin: 0 auto;
+    font-size: 20px;
+  }
+  :deep(.el-breadcrumb__inner.is-link) {
+    color: #7e7e7e;
+    font-weight: normal;
+  }
+  :deep(.el-breadcrumb__item:last-child .el-breadcrumb__inner) {
+    color: #ff0000;
+  }
+}
+.resume {
+  color: #666;
+  .title {
+    text-align: center;
+    color: #222;
+    font-weight: 400;
+    font-size: 24px;
+    letter-spacing: 1.55px;
+    padding-bottom: 30px;
+    border-bottom: 1px solid #d7d7d7;
+    margin-bottom: 40px;
+  }
+  .name {
+    color: #222;
+    font-size: 30px;
+    margin-bottom: 10px;
+  }
+  .avatar {
+    width: 138px;
+    height: 138px;
+    background-color: rgba($color: #fff, $alpha: 0.7);
+    padding: 7px;
+    margin-right: 0;
+    margin-left: auto;
+  }
+  .resumm-item {
+    margin-bottom: 50px;
+    .item-title {
+      font-size: 20px;
+      color: #222;
+      margin-bottom: 14px;
+    }
+    p {
+      margin-bottom: 10px;
+    }
+    .link-page {
+      padding-top: 24px;
+      text-align: right;
+      cursor: pointer;
+    }
+  }
+}
+.el-form {
+  background: #f4f4f4;
+  margin-left: -20px;
+  margin-right: -20px;
+  padding: 20px;
+  .form-title {
+    font-size: 20px;
+    color: #222;
+    margin-bottom: 14px;
+  }
+}
+.btn-wrap{
+    text-align: right;
+    .btn{
+      display: inline-block;
+      padding: 0 20px;
+      cursor: pointer;
+      height: 30px;
+      line-height: 30px;
+      background: #709078;
+      color: #fff;
+      font-size: 16px;
+      border-radius: 5px;
+      margin-left: 10px;
+    }
+  }
+.resumm-item.self-assessment{
+  padding-top: 24px;
+  margin-bottom: 0;
+  .textarea{
+    margin-bottom: 24px;
+  }
+}
+</style>

src/views/PersonalCenter/Resume/ResumeIndex.vue

@@ -2,11 +2,227 @@
  * @Description: 我的简历
  * @Author: 空白格
  * @Date: 2022-08-24 09:35:03
- * @LastEditors: 空白格
- * @LastEditTime: 2022-08-24 09:35:03
+ * @LastEditors: gcz
+ * @LastEditTime: 2022-08-25 09:43:57
  * @FilePath: \veterans_client_web\src\views\PersonalCenter\Resume\ResumeIndex.vue
  * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
 -->
 <template>
-  <div>我的简历</div>
+  <div class="app-main">
+    <BannerBreadcrumb title="我的简历" :breadcrumb="false" />
+    <div class="banner-breadcrumb-breadcrumb">
+      <el-breadcrumb separator-class="el-icon-arrow-right">
+        <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
+        <el-breadcrumb-item :to="{ path: '/personalcenter' }"
+          >我的</el-breadcrumb-item
+        >
+        <el-breadcrumb-item>我的简历</el-breadcrumb-item>
+      </el-breadcrumb>
+    </div>
+    <div class="app-main-box">
+      <div class="app-main-box-content resume">
+        <div class="title">我的简历</div>
+        <el-row>
+          <el-col :span="16">
+            <div class="name">{{ memberinfo.name }}</div>
+            <div class="">
+              {{ memberinfo.menSex === 1 ? "女" : "男" }} ·
+              <span class="position" v-if="memberinfo.jobStatus !== 0">
+                · <span class="c-yellow">入职中</span>
+                <span>(memberinfo.company)</span>
+              </span>
+              <span class="c-yellow" v-else>未入职</span>
+            </div>
+          </el-col>
+          <el-col :span="8">
+            <div class="avatar hexagon">
+              <div
+                class="avatar-box hexagon-box"
+                :style="{
+                  backgroundImage: `url('${
+                    memberinfo.avatar
+                      ? memberinfo.avatar
+                      : 'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png'
+                  }')`,
+                }"
+              ></div>
+            </div>
+          </el-col>
+        </el-row>
+        <el-row class="resumm-item">
+          <el-col :span="22">
+            <div class="item-title">基本信息</div>
+            <p>
+              退役军人 ·
+              {{ memberinfo.menBirth ? getAge(memberinfo.menBirth) : "-" }}岁 ·
+              {{ memberinfo.politOutlook || "-" }} ·
+              {{ memberinfo.degrEduc || "-" }}
+            </p>
+            <p>电话：{{ memberinfo.mobile }}</p>
+          </el-col>
+          <el-col class="link-page" :span="2">
+            <img @click="goEdit" src="@/assets/images/link-page-icon.svg" alt="">
+          </el-col>
+        </el-row>
+        <el-row class="resumm-item">
+          <el-col :span="22">
+            <div class="item-title">期望薪资</div>
+            <div v-if="memberinfo.cityName && memberinfo.provinceName && memberinfo.areaName">{{ `${memberinfo.provinceName}-${memberinfo.cityName}-${memberinfo.areaName}` }}</div>
+				    <div class="c-yellow" v-if="memberinfo.expectedLowestSalary && memberinfo.expectedHighestSalary">{{ `${memberinfo.expectedLowestSalary}k ~ ${memberinfo.expectedHighestSalary}k` }}</div>
+				    <div class="supple" v-if="!memberinfo.workCity && !memberinfo.expectedLowestSalary && !memberinfo.expectedLowestSalary">暂末补充求职意向… </div>
+          </el-col>
+          <el-col class="link-page" :span="2">
+            <img @click="goEdit" src="@/assets/images/link-page-icon.svg" alt="">
+          </el-col>
+        </el-row>
+        <el-row class="resumm-item">
+          <el-col :span="22">
+            <div class="item-title">自我评价</div>
+            <div v-if="memberinfo.selfAssessment">
+              {{ memberinfo.selfAssessment }}
+            </div>
+            <p v-else>暂末补充自我评价…</p>
+          </el-col>
+          <el-col class="link-page" :span="2">
+            <img @click="goEdit" src="@/assets/images/link-page-icon.svg" alt="">
+          </el-col>
+        </el-row>
+        <el-row class="resumm-item">
+          <el-col :span="22">
+            <div class="item-title">工作经历</div>
+            <el-empty description="暂无工作经历"></el-empty>
+          </el-col>
+          <el-col class="link-page" :span="2">
+            <!-- <img @click="goEdit" src="@/assets/images/link-page-icon.svg" alt=""> -->
+          </el-col>
+        </el-row>
+        <el-row class="resumm-item">
+          <el-col :span="22">
+            <div class="item-title">培训与教育经历</div>
+            <el-empty description="暂无培训与教育经历"></el-empty>
+          </el-col>
+          <el-col class="link-page" :span="2">
+            <!-- <img @click="goEdit" src="@/assets/images/link-page-icon.svg" alt=""> -->
+          </el-col>
+        </el-row>
+      </div>
+    </div>
+  </div>
 </template>
+
+<script>
+import BannerBreadcrumb from "@/components/BannerBreadcrumb";
+import { getPersonInfoData } from "@/api/PersonalCenter";
+export default {
+  name: "Resume",
+  components: {
+    BannerBreadcrumb,
+  },
+  data() {
+    return {
+      memberinfo: {},
+    };
+  },
+  created() {
+    this.getPersonInfo();
+  },
+  methods: {
+    /**
+     * 获取个人信息
+     * @date 2022-08-15
+     * @returns {any}
+     */
+    getPersonInfo() {
+      getPersonInfoData().then((res) => {
+        if (res.code === 200) {
+          this.memberinfo = res?.data;
+          console.log("this.memberinfo", this.memberinfo);
+        }
+      });
+    },
+    /**
+     * 通过出生年月计算年龄
+     * @param { String } date
+     */
+    getAge(date) {
+      const birth = new Date(date).valueOf();
+      const now = new Date().valueOf();
+      const age = (now - birth) / 1000 / 60 / 60 / 24 / 365;
+      return parseInt(age);
+    },
+    goEdit(){
+      this.$router.push({path:'resumeEdit'});
+    }
+  },
+};
+</script>
+
+<style lang='scss' scoped>
+.c-yellow {
+  color: #ff6901;
+}
+
+.app-main-box-content {
+  min-height: calc(100vh - 73px - 104px - 64px - 100px - 23px - 40px);
+}
+.banner-breadcrumb-breadcrumb {
+  background-color: #fff;
+  :deep(.el-breadcrumb) {
+    width: 70%;
+    height: 64px;
+    line-height: 64px;
+    min-width: 600px;
+    margin: 0 auto;
+    font-size: 20px;
+  }
+  :deep(.el-breadcrumb__inner.is-link) {
+    color: #7e7e7e;
+    font-weight: normal;
+  }
+  :deep(.el-breadcrumb__item:last-child .el-breadcrumb__inner) {
+    color: #ff0000;
+  }
+}
+.resume {
+  color: #666;
+  .title {
+    text-align: center;
+    color: #222;
+    font-weight: 400;
+    font-size: 24px;
+    letter-spacing: 1.55px;
+    padding-bottom: 30px;
+    border-bottom: 1px solid #d7d7d7;
+    margin-bottom: 40px;
+  }
+  .name {
+    color: #222;
+    font-size: 30px;
+    margin-bottom: 10px;
+  }
+  .avatar {
+    width: 138px;
+    height: 138px;
+    background-color: rgba($color: #fff, $alpha: 0.7);
+    padding: 7px;
+    margin-right: 0;
+    margin-left: auto;
+  }
+  .resumm-item {
+    margin-bottom: 50px;
+    .item-title {
+      font-size: 20px;
+      color: #222;
+      margin-bottom: 14px;
+    }
+    p {
+      margin-bottom: 10px;
+    }
+    .link-page{
+      padding-top: 24px;
+      text-align: right;
+      cursor: pointer;
+    }
+  }
+}
+</style>