feat and fix

src/components/vAbove/vAbove.scss

@@ -6,7 +6,7 @@ $above-height:65px;
   z-index:100;
   width: calc(100% - 210px);
   box-shadow: 1px 1px 12px rgb(244,244,244);
-  background-color:#006df0;
+  background-color:#fff;
   height:$above-height;
   .avator{
     position: absolute;
@@ -14,7 +14,7 @@ $above-height:65px;
     top:18px;
     cursor: pointer;
     .name  {
-      color:#fff;
+      color:#00A0E9;
     }
     .img{
       background-color: rgb(212, 209, 209);

src/components/vAbove/vAbove.vue

@@ -11,7 +11,7 @@
         <el-dropdown trigger="click">
             <div class="name">
                 {{name||'无昵称'}}
-                <i class="el-icon-caret-bottom" style="color: #fff"></i>
+                <i class="el-icon-caret-bottom" style="color: #00A0E9"></i>
             </div>
             <el-dropdown-menu class="user-dropdown" slot="dropdown">
                 <el-dropdown-item divided>

src/components/vBread/vBread.vue

@@ -7,7 +7,11 @@
 -->
 <template>
   <div class="vBreadCom">
-    <el-breadcrumb separator="/">
+    <el-breadcrumb v-if="$route.name === 'home'" separator="/">
+      <el-breadcrumb-item class="home">首页</el-breadcrumb-item>
+      <el-breadcrumb-item class="select">首页</el-breadcrumb-item>
+    </el-breadcrumb>
+    <el-breadcrumb v-else separator="/">
       <el-breadcrumb-item class="home">{{first}}</el-breadcrumb-item>
       <el-breadcrumb-item class="select">{{last}}</el-breadcrumb-item>
     </el-breadcrumb>

src/components/vNav/vNav.scss

@@ -13,7 +13,7 @@
     border-right:none;
     .is-active{
       .a_menu{
-        color: #757778;
+        color: #5d77ad;
       }
     }
     /deep/.el-submenu{
@@ -37,10 +37,11 @@
     // margin-left: 40px;
     width:160px;
     margin: auto;
+    color: #5d77ad!important;
     min-width: 80px !important;
     border-radius: 3px;
   }
-  .el-menu-item.is-active{
+  .el-menu-item.active{
     background-color:#00a0e9 !important;
     color: #fff !important;
     width:160px;

src/components/vNav/vNav.vue

@@ -3,7 +3,14 @@
     <div class="logo">
         <img style="width:120px; border-bottom: 1px solid #bbb;padding: 15px" src="@/../public/img/logo2.png" alt="">
     </div>
-    <el-menu background-color="#f6fafd" @select="handleSelect" text-color="#8D9498" unique-opened active-text-color="#fff">
+    <el-menu background-color="#f6fafd" @select="handleSelect" text-color="#5d77ad" unique-opened active-text-color="#fff">
+      <!-- <el-menu-item index="-1"  @click="jump('home')"> -->
+        <!-- <i class="el-icon-menu"></i> -->
+        <div class="el-menu-item special" @click="jump('home')" :class="$route.name==='home' ? 'active' : ''">
+          <img style="width: 20px" class="icon2" :src="imgList[$route.name==='home' ? 4 : 0]" alt="">
+          <span slot="title" class="a_menu" style="font-size：16px" :style="$route.name==='home' ? 'color: #fff' : ''">首页</span>
+        </div>
+      <!-- </el-menu-item> -->
         <el-submenu v-for="(item,index) in route||filterOne" :key="index" :index="`${index}`">
             <template slot="title">
                 <!-- <span :class="'iconfont '+item.icon"></span> -->
@@ -11,7 +18,7 @@
                 <img style="width: 20px" :src="imgList[item.icon]" alt="">
                 <span class="a_menu">{{item.name}}</span>
             </template>
-            <el-menu-item v-for="(child,childIndex) in item.child||item.child.filter(j => menuIdList.includes(j.menuid))" @click="jump(child.to)" :class="$route.name===child.to ? 'is-active' : ''" :key="childIndex" :index="`${index}-${childIndex}`" :style="childIndex!==item.child.length-1?'margin-bottom: 15px':''">
+            <el-menu-item v-for="(child,childIndex) in item.child||item.child.filter(j => menuIdList.includes(j.menuid))" @click="jump(child.to)" :class="$route.name===child.to ? 'active' : ''" :key="childIndex" :index="`${index}-${childIndex}`" :style="childIndex!==item.child.length-1?'margin-bottom: 15px':''">
                 <div>{{child.name}}</div>
             </el-menu-item>
         </el-submenu>
@@ -37,92 +44,93 @@ export default {
       ],
       // url: '../../../public/img/',.
       menuIdList: [],
-      route: [{
-        name: '公司设置',
-        // menuid: 100,
-        to: '',
-        icon: 1,
-        child: [{
-          name: '基本信息设置',
-          menuid: 503,
-          to: 'basicInfo'
-        },
-        {
-          name: '职位信息设置',
-          menuid: 504,
-          to: 'positionInfo'
-        },
-        {
-          name: '简历信息设置',
-          menuid: 505,
-          to: 'formManage'
-        },
-        {
-          name: '视频库管理',
-          menuid: 507,
-          to: 'videoManage'
-        },
-        {
-          name: '面试问题设置',
-          menuid: 506,
-          to: 'procedureManage'
-        },
-        // {
-        //   name: '应用场景管理',
-        //   menuid: 508,
-        //   to: 'sceneManage'
-        // },
+      route: [
         {
-          name: '邀约管理',
-          menuid: 509,
-          to: 'templateManage'
+          name: '公司设置',
+          // menuid: 100,
+          to: '',
+          icon: 1,
+          child: [{
+            name: '基本信息设置',
+            menuid: 503,
+            to: 'basicInfo'
+          },
+          {
+            name: '职位信息设置',
+            menuid: 504,
+            to: 'positionInfo'
+          },
+          {
+            name: '简历信息设置',
+            menuid: 505,
+            to: 'formManage'
+          },
+          {
+            name: '视频库管理',
+            menuid: 507,
+            to: 'videoManage'
+          },
+          {
+            name: '面试问题设置',
+            menuid: 506,
+            to: 'procedureManage'
+          },
+          // {
+          //   name: '应用场景管理',
+          //   menuid: 508,
+          //   to: 'sceneManage'
+          // },
+          {
+            name: '邀约管理',
+            menuid: 509,
+            to: 'templateManage'
+          },
+          {
+            name: '邮箱管理',
+            menuid: 510,
+            to: 'mailManage'
+          }
+          ]
         },
         {
-          name: '邮箱管理',
-          menuid: 510,
-          to: 'mailManage'
-        }
-        ]
-      },
-      {
-        name: '候选人管理',
-        // menuid: 200,
-        to: '',
-        icon: 2,
-        child: [{
-          name: '人才库',
-          menuid: 511,
-          to: 'candidateAll'
-        },
-        {
-          name: '简历管理',
-          menuid: 512,
-          to: 'resumeList'
+          name: '候选人管理',
+          // menuid: 200,
+          to: '',
+          icon: 2,
+          child: [{
+            name: '人才库',
+            menuid: 511,
+            to: 'candidateAll'
+          },
+          {
+            name: '简历管理',
+            menuid: 512,
+            to: 'resumeList'
+          },
+          {
+            name: '面试管理',
+            menuid: 513,
+            to: 'candidateList'
+          }
+          ]
         },
         {
-          name: '面试管理',
-          menuid: 513,
-          to: 'candidateList'
+          name: '用户管理',
+          // menuid: 200,
+          to: '',
+          icon: 3,
+          child: [{
+            name: '密码设置',
+            menuid: 514,
+            to: 'passwordSettings'
+          },
+          {
+            name: '数据统计',
+            menuid: 515,
+            to: 'statistics'
+          }
+          ]
         }
-        ]
-      },
-      {
-        name: '用户管理',
-        // menuid: 200,
-        to: '',
-        icon: 3,
-        child: [{
-          name: '密码设置',
-          menuid: 514,
-          to: 'passwordSettings'
-        },
-        {
-          name: '数据统计',
-          menuid: 515,
-          to: 'statistics'
-        }
-        ]
-      }
       ]
     }
   },
@@ -166,6 +174,7 @@ export default {
       this.$router.push({
         name: to
       })
+      this.$forceUpdate()
     }
   }
 }
@@ -177,6 +186,24 @@ export default {
 /deep/.el-submenu__title i {
     color: #8D9498;
 }
+.special {
+  // height: 56px!important;
+  // width: 210px!important;
+  // margin: 0!important;
+  color: #5d77ad;
+  // text-align: start!important;
+  padding-left: 0;
+  position: relative;
+  padding-right: 0;
+  font-size: 16px!important;
+  // display: flex;
+  // justify-content: space-between;
+  .icon2 {
+    position: absolute;
+    left: 12px;
+    top: 10px;
+  }
+}
 
 // .logo {
 //     color: #ffffff;

src/router/index.js

@@ -13,6 +13,11 @@ Vue.use(VueRouter)
 
 const routes = [
   {
+    path: '/home',
+    name: 'home',
+    component: () => import('@/views/index')
+  },
+  {
     path: '/candidateAll',
     name: 'candidateAll',
     component: () => import('@/views/candidateManage/candidateAll')
@@ -92,7 +97,7 @@ const routes = [
   // redirect
   {
     path: '/',
-    redirect: '/basicInfo'
+    redirect: '/home'
   }
 ]
 

src/views/candidateManage/candidateList.vue

@@ -8,8 +8,8 @@
 -->
 <template>
 <div class="candidateList">
-    <v-input :btn="isCollapse==1?btn1:isCollapse===2?btn2:isCollapse===3?btn3:btn0" :list="list" :key="isCollapse+3" @del="delAll" @search="search" @through="throughAll" @notice="noticeAll" @eliminate="eliminateAll" @undetermined="undeterminedAll"></v-input>
-    <el-radio-group v-model="isCollapse" size="medium" style="margin-bottom: 20px;">
+    <v-input :btn="isCollapse==1?btn1:isCollapse===2?btn2:isCollapse===3?btn3:btn0" :list="list" :key="isCollapse+3" @del="delAll" @search="search" @through="throughAll" @notice="noticeAll" @eliminate="eliminateAll" @undetermined="undeterminedAll"  @sendMail="sendMailAll"></v-input>
+    <el-radio-group v-model="isCollapse" size="medium" style="margin-bottom: 20px;" fill="#00a0e9">
         <el-radio-button :label="0">候选人列表</el-radio-button>
         <el-radio-button :label="1">已通过候选人</el-radio-button>
         <el-radio-button :label="2">已淘汰候选人</el-radio-button>
@@ -81,7 +81,7 @@
             <el-form-item label="邮箱地址" prop="delivererMail">
                 <el-input placeholder="请输入邮箱地址" v-model="uform.delivererMail" maxlength="32" show-word-limit></el-input>
             </el-form-item>
-            <el-form-item label="面试应聘职位" prop="desiredPositionId">
+            <el-form-item label="应聘职位" prop="desiredPositionId">
                 <el-select class="select" v-model="uform.desiredPositionId" placeholder="请选择应聘职位">
                     <el-option v-for="item in positionList" :key="item.value" :label="item.label" :value="item.value">
                     </el-option>
@@ -129,7 +129,7 @@ export default {
       form: {},
       uform: {},
       email: '',
-      state: 1,
+      state: 2,
       info: {},
       infoTwo: {},
       vedioUrl: '',
@@ -248,6 +248,11 @@ export default {
         name: '待定',
         type: 'warning',
         method: 'undetermined'
+      },
+      {
+        name: '邮件通知',
+        method: 'sendMail',
+        type: 'success'
       }
       ],
       btn1: [{
@@ -275,6 +280,11 @@ export default {
         name: '删除',
         type: 'danger',
         method: 'del'
+      },
+      {
+        name: '邮件通知',
+        method: 'sendMail',
+        type: 'success'
       }
       ],
       btn3: [{
@@ -291,6 +301,11 @@ export default {
         name: '淘汰',
         type: 'danger',
         method: 'eliminate'
+      },
+      {
+        name: '邮件通知',
+        method: 'sendMail',
+        type: 'success'
       }
       ],
       table: {
@@ -323,7 +338,7 @@ export default {
         //   props: 'positionApplied'
         // },
         {
-          label: '面试应聘职位',
+          label: '应聘职位',
           props: 'positionName'
         },
         {
@@ -343,11 +358,11 @@ export default {
           props: 'delivererMail'
         },
         {
-          label: '通知面试时间',
+          label: '通知时间',
           props: 'sendMailTime'
         },
         {
-          label: '完成面试时间',
+          label: '完成时间',
           props: 'confirmInterviewTime'
         }
         ],
@@ -419,7 +434,7 @@ export default {
         //   props: 'positionApplied'
         // },
         {
-          label: '面试应聘职位',
+          label: '应聘职位',
           props: 'positionName'
         },
         {
@@ -439,11 +454,11 @@ export default {
           props: 'delivererMail'
         },
         {
-          label: '通知面试时间',
+          label: '通知时间',
           props: 'sendMailTime'
         },
         {
-          label: '完成面试时间',
+          label: '完成时间',
           props: 'confirmInterviewTime'
         },
         {
@@ -452,7 +467,7 @@ export default {
           options: ['未发送', '发送中', '发送成功', '发送失败']
         }
         ],
-        width: 500,
+        width: 300,
         handle: [{
           title: '查看',
           method: 'details',
@@ -500,7 +515,7 @@ export default {
         //   props: 'positionApplied'
         // },
         {
-          label: '面试应聘职位',
+          label: '应聘职位',
           props: 'positionName'
         },
         {
@@ -581,7 +596,7 @@ export default {
         //   props: 'positionApplied'
         // },
         {
-          label: '面试应聘职位',
+          label: '应聘职位',
           props: 'positionName'
         },
         {
@@ -626,6 +641,11 @@ export default {
           title: '修改',
           method: 'update',
           type: 'warning'
+        },
+        {
+          title: '邮件通知',
+          method: 'sendMail',
+          type: 'success'
         }
         ]
       }
@@ -738,7 +758,7 @@ export default {
     },
     notice (row) {
       this.open()
-      this.state = 1
+      this.state = 2
       this.copyPickList = [row.id]
     },
     noticeAll () {
@@ -899,6 +919,17 @@ export default {
       this.state = 2
       this.copyPickList = [id]
     },
+    sendMailAll () {
+      if (this.pickList.length) {
+        this.open()
+        this.state = 2
+      } else {
+        this.$message({
+          type: 'info',
+          message: '请选择需通知的应聘者'
+        })
+      }
+    },
     open () {
       this.dialogFormVisible = true
     },

src/views/candidateManage/resumeList.vue

@@ -8,8 +8,8 @@
 -->
 <template>
 <div class="indexPage">
-    <v-input :btn="btn" :list="list" @del="delAll" @notice="noticeAll" @through="throughAll" @eliminate="eliminateAll" @undetermined="undeterminedAll" @search="search"></v-input>
-    <el-radio-group v-model="isCollapse" size="medium" style="margin-bottom: 20px;">
+    <v-input :btn="btn" :list="list" @del="delAll" @notice="noticeAll" @through="throughAll" @eliminate="eliminateAll" @undetermined="undeterminedAll" @search="search" @sendMail="sendMailAll"></v-input>
+    <el-radio-group v-model="isCollapse" size="medium" style="margin-bottom: 20px;" fill="#00a0e9">
         <el-radio-button :label="0">未读</el-radio-button>
         <el-radio-button :label="1">通过</el-radio-button>
         <el-radio-button :label="2">淘汰</el-radio-button>
@@ -253,6 +253,11 @@ export default {
         name: '删除',
         type: 'danger',
         method: 'del'
+      },
+      {
+        name: '邮件通知',
+        method: 'sendMail',
+        type: 'success'
       }
       ],
       table: {
@@ -625,12 +630,15 @@ export default {
       this.copyPickList = [row.id]
     },
     noticeAll () {
-      this.pickList.length
-        ? this.open()
-        : this.$message({
+      if (this.pickList.length) {
+        this.open()
+        this.state = 1
+      } else {
+        this.$message({
           type: 'info',
           message: '请选择需要通知的对象'
         })
+      }
     },
     through (row, type = false) {
       let ids = type ? row : [row.id]
@@ -760,6 +768,17 @@ export default {
       this.state = 2
       this.copyPickList = [row.id]
     },
+    sendMailAll () {
+      if (this.pickList.length) {
+        this.open()
+        this.state = 2
+      } else {
+        this.$message({
+          type: 'info',
+          message: '请选择需通知的应聘者'
+        })
+      }
+    },
     submit () {
       let a
       this.$refs['uform'].validate((valid) => {
@@ -937,6 +956,11 @@ export default {
           name: '删除',
           type: 'danger',
           method: 'del'
+        },
+        {
+          name: '邮件通知',
+          method: 'sendMail',
+          type: 'success'
         }
         ]
           : this.isCollapse === 1 ? [{
@@ -969,6 +993,11 @@ export default {
               name: '删除',
               type: 'danger',
               method: 'del'
+            },
+            {
+              name: '邮件通知',
+              method: 'sendMail',
+              type: 'success'
             }
             ]
               : this.isCollapse === 3 ? [{
@@ -985,6 +1014,11 @@ export default {
                 name: '删除',
                 type: 'danger',
                 method: 'del'
+              },
+              {
+                name: '邮件通知',
+                method: 'sendMail',
+                type: 'success'
               }
               ] : [{
                 name: '确定',
@@ -995,6 +1029,11 @@ export default {
                 name: '删除',
                 type: 'danger',
                 method: 'del'
+              },
+              {
+                name: '邮件通知',
+                method: 'sendMail',
+                type: 'success'
               }
               ]
       )

src/views/companyManage/templateManage.vue

@@ -20,11 +20,14 @@
                 <div v-else>{{this.downList0.some(i => i.id === form.sceneId) ? this.downList0.find(i => i.id === form.sceneId).sceneName : ''}}</div>
             </el-form-item>
             <el-form-item :label="form.sceneId === 1||form.sceneId === 4?'邮件主题':'邀约岗位'" prop="templateName">
-                <el-autocomplete v-if="state !== 2" v-model="form.templateName" :fetch-suggestions="querySearch" :placeholder="'请输入'+form.sceneId === 1||form.sceneId === 4?'邮件主题':'邀约岗位'" @select="handleSelect" :maxlength="32" show-word-limit></el-autocomplete>
+                <el-autocomplete v-if="state !== 2" v-model.trim="form.templateName" :fetch-suggestions="querySearch" :placeholder="'请输入'+form.sceneId === 1||form.sceneId === 4?'邮件主题':'邀约岗位'" @select="handleSelect" :maxlength="32" show-word-limit></el-autocomplete>
                 <div v-else>{{form.templateName}}</div>
             </el-form-item>
             <el-form-item v-if="form.sceneId === 1||form.sceneId === 4" label="邮件内容" prop="templateIntroduce">
-                <el-input v-if="state !== 2" type="textarea" :rows="4" resize="none" placeholder="请输入邮件内容" v-model="form.templateIntroduce" maxlength="1024" show-word-limit></el-input>
+              <div v-if="state !== 2">
+                <el-input type="textarea" :rows="4" resize="none" placeholder="请输入邮件内容" v-model="form.templateIntroduce" maxlength="1024" show-word-limit></el-input>
+                <div v-html="form.sceneId === 1 ? prompt1.replace(/\n/g,'<br/>') : prompt2.replace(/\n/g,'<br/>')"></div>
+              </div>
                 <div v-else>{{form.templateIntroduce}}</div>
             </el-form-item>
             <el-form-item v-if="form.sceneId == 1||form.sceneId == 3" label="关联岗位" prop="processId">
@@ -80,10 +83,11 @@
 export default {
   data () {
     let validator = (rule, value, callback) => {
-      if (value === '') {
-        callback(new Error('请输入邀约岗位!'))
+      console.log(rule, value, callback)
+      if (!value) {
+        return callback(new Error('请输入邀约岗位!'))
       } else if (this.restaurants.map(item => item.value).filter(item => item !== this.form.name).includes(value)) {
-        callback(new Error('该名称已被使用!'))
+        return callback(new Error('该名称已被使用!'))
       } else {
         callback()
       }
@@ -103,6 +107,15 @@ export default {
       downList1: [],
       downList2: [],
       restaurants: [],
+      prompt1: `示例：
+    简历已通过初步筛选，邀请您参加视频初试环节，请注意：
+    1. 二维码扫描只可使用一次，有效期自2020年9月8日-9月9日24点止，请使用手机确保周围环境安静的前提下开始。
+    2. 请确保网络环境畅通，在录制面试视频时不要接打电话和网络语音。
+    3. 每个问题有一分钟的时间进行回答。
+    谢谢！`,
+      prompt2: `示例：
+    感谢您的参与！
+    工作人员将通过电话或邮件与您联系后续相关安排，敬请留意！`,
       rule: {
         templateName: [{
           required: true,
@@ -501,29 +514,31 @@ export default {
           this.$refs['form'].resetFields()
         }
       }
-    },
-    'form.sceneId' (val) {
-      val === 1 && (this.form.templateIntroduce = `
-示例：
+    }
+    //     'form.sceneId' (val) {
+    //       if (!this.form.id) {
+    //         val === 1 && (this.form.templateIntroduce = `
+    // 示例：
 
-简历已通过初步筛选，邀请您参加视频初试环节，请注意：
+    // 简历已通过初步筛选，邀请您参加视频初试环节，请注意：
 
-1. 二维码扫描只可使用一次，有效期自2020年9月8日-9月9日24点止，请使用手机确保周围环境安静的前提下开始。
+    // 1. 二维码扫描只可使用一次，有效期自2020年9月8日-9月9日24点止，请使用手机确保周围环境安静的前提下开始。
 
-2. 请确保网络环境畅通，在录制面试视频时不要接打电话和网络语音。
+    // 2. 请确保网络环境畅通，在录制面试视频时不要接打电话和网络语音。
 
-3. 每个问题有一分钟的时间进行回答。
+    // 3. 每个问题有一分钟的时间进行回答。
 
-谢谢！
-      `)
-      val === 4 && (this.form.templateIntroduce = `
-示例：
+    // 谢谢！
+    //       `)
+    //         val === 4 && (this.form.templateIntroduce = `
+    // 示例：
 
-感谢您的参与！
+    // 感谢您的参与！
 
-工作人员将通过电话或邮件与您联系后续相关安排，敬请留意！
-      `)
-    }
+    // 工作人员将通过电话或邮件与您联系后续相关安排，敬请留意！
+    //       `)
+    //       }
+    //     }
   }
 }
 </script>

src/views/index.vue

@@ -0,0 +1,267 @@
+<template>
+    <div class="index">
+        <el-card class="box-card">
+            <div class="flex jsa">
+                <div v-for="(item, index) in topList" :key="item.type" class="f1 p20">
+                    <div class="flex top">
+                        <img :src="imgList[index]" alt="">
+                        <div>
+                            <div class="title">{{['昨日新增简历', '上周新增简历', '简历投递总数'][item.type]}}</div>
+                            <div class="number" :style="{color: colorList[index]}">{{item.countSize}}</div>
+                        </div>
+                    </div>
+                    <div class="ml5">
+                        <div class="time">统计时间：{{$utils.formatYMD(item.countTime) + ' ' + '12:00' + ' ' +'pm'}}</div>
+                        <div class="slider" :style="{ background: colorList[index] }">
+                            <div class="slider-son" :style="{ background: '#fff', height: '100%', width: item.socialRecruitmentSize / (item.schoolRecruitmentSize + item.socialRecruitmentSize) * 100 + '%', opacity: 0.5}" ></div>
+                        </div>
+                        <div class="flex jsb recruit">
+                            <div>校招:{{item.schoolRecruitmentSize}}</div>
+                            <div>社招:{{item.socialRecruitmentSize}}</div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </el-card>
+        <div style="height:20px"></div>
+        <!-- <el-card class="box-card"> -->
+        <div class="flex" style="margin-bottom:20px">
+            <el-card class="box-card" style="width: 60%;margin-right:20px">
+                <div ref="mychart1" :style="{width: '100%', height: '500px'}"></div>
+            </el-card>
+            <el-card class="box-card" style="width: 40%">
+                <div ref="mychart2" :style="{width: '100%', height: '500px'}"></div>
+            </el-card>
+        </div>
+        <!-- </el-card> -->
+    </div>
+</template>
+
+<script>
+import echarts from 'echarts'
+export default {
+  data () {
+    return {
+      imgList: [
+        require('../../public/img/bar-chart-grouped-line.png'),
+        require('../../public/img/line-chart-line.png'),
+        require('../../public/img/pie-chart-line.png')
+      ],
+      colorList: ['#4089FF', '#25D096', '#F34D4E'],
+      breadData: [],
+      topList: [],
+      schoolRecruit: [],
+      schoolWeek: []
+    }
+  },
+  mounted () {
+    this.$nextTick(() => {
+      this.queryData1()
+      this.queryData2()
+    })
+  },
+  methods: {
+    queryData1 () {
+      this.$api
+        .post('/chart/resumeTotal', {
+          reqdata: {}
+        })
+        .then((res) => {
+          this.breadData = res.object.pieChartDtoList.map(item => ({ value: item.countSize, name: item.platformName }))
+          this.topList = res.object.resumeTotal
+          this.initChart2()
+        })
+    },
+    queryData2 () {
+      this.$api
+        .post('/chart/getResumeChart', {
+          reqdata: {
+            recruitType: 0
+          }
+        })
+        .then((res) => {
+          console.log(res)
+          this.timeList = res.object.weekList || []
+          this.clubRecruit = res.object.countList || []
+          this.clubTotal = res.object.countTotal
+          this.clubWeek = this.clubRecruit[this.clubRecruit.length - 1]
+          this.$api
+            .post('/chart/getResumeChart', {
+              reqdata: {
+                recruitType: 1
+              }
+            })
+            .then((res) => {
+              let arr = []
+              let length = this.timeList.indexOf(res.object.weekList && res.object.weekList[0])
+              arr.length = length === -1 ? 0 : length
+              this.schoolRecruit = [...arr, ...(res.object.countList || [])]
+              this.schoolWeek = this.schoolRecruit[this.schoolRecruit.length - 1]
+              this.initChart1()
+            })
+        })
+    },
+    initChart1 () {
+      let myChart = echarts.init(this.$refs.mychart1)
+      myChart.setOption({
+        title: {
+          text: '简历投递信息'
+        },
+        tooltip: {
+          trigger: 'axis'
+        },
+        legend: {
+          data: ['校招投递简历', '社招投递简历']
+        },
+        grid: {
+          left: '3%',
+          right: '4%',
+          bottom: '3%',
+          containLabel: true
+        },
+        // toolbox: {
+        //   feature: {
+        //     saveAsImage: {}
+        //   }
+        // },
+        xAxis: {
+          type: 'category',
+          boundaryGap: false,
+          data: this.timeList.map(item => item.substring(0, 10)),
+          axisLabel: {
+            interval: 0,
+            rotate: -80
+          }
+        },
+        yAxis: {
+          type: 'value'
+        },
+        color: ['#25D096', '#F34D4E'],
+        series: [{
+          name: '校招投递简历',
+          type: 'line',
+          data: this.schoolRecruit
+        },
+        {
+          name: '社招投递简历',
+          type: 'line',
+          data: this.clubRecruit
+        }
+        ]
+      })
+      setTimeout(function () {
+        window.onresize = function () {
+          myChart.resize()
+        }
+      }, 200)
+    },
+    initChart2 () {
+      let myChart = echarts.init(this.$refs.mychart2)
+      let option = {
+        title: {
+          text: '社招各平台投递总数占比',
+          left: 'center'
+        },
+        tooltip: {
+          trigger: 'item',
+          formatter: '{a} <br/>{b}: {c} ({d}%)'
+        },
+        legend: {
+          bottom: 0,
+          left: 'center',
+          data: ['51job', '智联招聘', '58同城']
+        },
+        color: this.colorList,
+        series: [
+          {
+            name: '来源',
+            type: 'pie',
+            radius: ['50%', '70%'],
+            avoidLabelOverlap: false,
+            label: {
+              show: false,
+              position: 'center'
+            },
+            emphasis: {
+              label: {
+                show: true,
+                fontSize: '30',
+                fontWeight: 'bold'
+              }
+            },
+            labelLine: {
+              show: false
+            },
+            data: this.breadData
+          }
+        ]
+      }
+      myChart.setOption(option)
+      setTimeout(function () {
+        window.onresize = function () {
+          myChart.resize()
+        }
+      }, 200)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+    .f1 {
+        width: 300px;
+    }
+    .jsa {
+        justify-content: space-around;
+    }
+    .fdc {
+        flex-direction: column;
+    }
+    .flex {
+        display: flex;
+    }
+    .jsb {
+        justify-content: space-between;
+    }
+    .p20 {
+        padding: 20px 50px;
+    }
+    .top {
+        margin-bottom: 20px;
+    }
+    img {
+        width: 100px;
+        // height: 60px;
+        height: 100px;
+        margin-right: 20px;
+    }
+    .title {
+      margin-top: 5px;
+        font-size: 24px;
+        margin-bottom: 14px;
+    }
+    .number {
+        font-size: 38px;
+        padding-bottom: 20px;
+    }
+    .time {
+        color: #777;
+        padding-bottom: 10px;
+        font-size: 10px;
+    }
+    .ml5 {
+        margin-left: 10px;
+    }
+    .slider {
+        margin-bottom: 10px;
+        height: 15px;
+        position: relative;
+        &-son {
+            position: absolute;
+            right: 0;
+        }
+    }
+    .recruit {
+        font-size: 12px;
+    }
+</style>