整理图标-三库

src/router/index.js

@@ -682,17 +682,10 @@ export const constantRoutes = [{
           title: '生涯评测-院校库'
         }
       },
-      {
-        path: '/career/components/UniversityDetail',
-        component: (resolve) => require(['@/views/career/components//UniversityDetail'], resolve),
-        name: 'UniversityDetail',
-        meta: {
-          title: '生涯评测-院校详情'
-        }
-      },
       {
         path: '/career/plan/UniversityDetail',
         component: (resolve) => require(['@/views/career/plan/UniversitiesDetail'], resolve),
+        name: 'UniversityDetail',
         meta: {
           title: '生涯评测-院校详情'
         }

src/views/career/components/CollegesLine.vue

@@ -35,7 +35,7 @@
       <el-table :data="tableData" border v-loading="loading">
         <el-table-column prop="code" label="院校" align="center">
           <template slot-scope="scope">
-            <el-link :underline="false" @click="goDetails(scope.row.universityId)">【{{scope.row.universityName}}】</el-link>
+            <el-link :underline="false" @click="goDetails(scope.row)">【{{scope.row.universityName}}】</el-link>
           </template>
         </el-table-column>
         <el-table-column prop="location" width="80" label="所在地" align="center"></el-table-column>
@@ -111,8 +111,8 @@ import {
       this.getMarjorYears()
     },
     methods: {
-      goDetails(id){
-        this.$router.push({ name: 'UniversityDetail', params: { id: id } })
+      goDetails(item){
+        this.$router.push({path:'/career/plan/UniversityDetail',query: {code:item.universityCode}})
       },
       getMarjorList(){
 

src/views/career/plan/UniversitiesDetail.vue

@@ -49,7 +49,6 @@
                         {{ `${item.value[0] ? item.value[0].number : ''} / ${item.value[1] ? item.value[1].number : ''} ` }}
                         <i class="el-icon-question"></i>
                       </p>
-
                     </el-popover>
                   </div>
                   <div v-else>
@@ -317,43 +316,43 @@ export default {
       const baseInfo = this.baseInfo
       return [
         {
-          img: 'https://pv4y-pc.youzy.cn/static/img/icon_shijian@2x.8463f33f.png',
+          img: require('@/assets/images/career/year.png'),
           value: `${baseInfo.createdYear}年`,
           desc: '创办时间'
         },
         {
-          img: 'https://pv4y-pc.youzy.cn/static/img/icon_shijian@2x.8463f33f.png',
+          img: require('@/assets/images/career/type.png'),
           value: baseInfo.natureTypeCN,
           desc: '办学类型'
         },
         {
-          img: 'https://pv4y-pc.youzy.cn/static/img/icon_shijian@2x.8463f33f.png',
+          img: require('@/assets/images/career/xingzhi.png'),
           value: baseInfo.type,
           desc: '院校类型'
         },
         {
-          img: 'https://pv4y-pc.youzy.cn/static/img/icon_shijian@2x.8463f33f.png',
+          img: require('@/assets/images/career/bumen.png'),
           value: baseInfo.managerType,
           desc: '所属部门'
         },
         {
-          img: 'https://pv4y-pc.youzy.cn/static/img/icon_shijian@2x.8463f33f.png',
+          img: require('@/assets/images/career/xueli.png'),
           value: baseInfo.level,
           desc: '学历层次'
         },
         {
-          img: 'https://pv4y-pc.youzy.cn/static/img/icon_shijian@2x.8463f33f.png',
+          img: require('@/assets/images/career/location.png'),
           value: `${baseInfo.location} ${baseInfo.cityName}`,
           desc: '所处地'
         },
         {
-          img: 'https://pv4y-pc.youzy.cn/static/img/icon_shijian@2x.8463f33f.png',
+          img: require('@/assets/images/career/shuoshi.png'),
           value: baseInfo.pointsOfShuo,
           desc: '硕士点',
           type: 'arr'
         },
         {
-          img: 'https://pv4y-pc.youzy.cn/static/img/icon_shijian@2x.8463f33f.png',
+          img: require('@/assets/images/career/boshi.png'),
           value: baseInfo.pointsOfBo,
           desc: '博士点',
           type: 'arr'

src/views/career/vocation/new-detail.vue

@@ -1,31 +1,31 @@
 <template>
-  <div  class="app-container jobDetail" >
+  <div class="app-container jobDetail">
     <el-row :gutter="20">
       <el-col :span="6">
-       <div class="bd-f2">
-         <p style="border-bottom: 1px solid #f2f2f2" class="pd10 f-333 f14">全部职业</p>
-         <div class="tree-wrap">
-           <el-tree
-           ref="tree"
-           :data="vocationList"
-           node-key="code"
-           :default-checked-keys="[code]"
-           :default-expanded-keys="[code]"
-           :props="defaultProps"
-           :current-node-key="code"
-           @node-click="handleNodeClick"
-           :isLeaf="isLeaf"
-         >
-           <p  class="custom-tree-node" :title="node.label" slot-scope="{node, data}">
-             <span class="text-ellipsis">{{node.label }}</span>
-             <span>{{data.children ? data.children.length : ''}}</span>
-           </p>
-         </el-tree>
-         </div>
+        <div class="bd-f2">
+          <p style="border-bottom: 1px solid #f2f2f2" class="pd10 f-333 f14">全部职业</p>
+          <div class="tree-wrap">
+            <el-tree
+              ref="tree"
+              :data="vocationList"
+              node-key="code"
+              :default-checked-keys="[code]"
+              :default-expanded-keys="[code]"
+              :props="defaultProps"
+              :current-node-key="code"
+              @node-click="handleNodeClick"
+              :isLeaf="isLeaf"
+            >
+              <p class="custom-tree-node" :title="node.label" slot-scope="{node, data}">
+                <span class="text-ellipsis">{{ node.label }}</span>
+                <span>{{ data.children ? data.children.length : '' }}</span>
+              </p>
+            </el-tree>
+          </div>
 
-       </div>
-     </el-col>
-      <el-col  :span="18">
+        </div>
+      </el-col>
+      <el-col :span="18">
         <el-card style="color: #5E5E5E;" ref="navBar">
           <el-breadcrumb separator-class="el-icon-arrow-right">
             <el-breadcrumb-item :to="{ path: '/index' }">首页</el-breadcrumb-item>
@@ -33,22 +33,23 @@
             <el-breadcrumb-item>职业详情</el-breadcrumb-item>
           </el-breadcrumb>
         </el-card>
-        <div class="mt20 header-content pd20" >
-          <p class="f28 f-333">{{vocationDetail.name ||  ''}}</p>
+        <div class="mt20 header-content pd20">
+          <p class="f28 f-333">{{ vocationDetail.name || '' }}</p>
         </div>
         <div class="tabs-wrap">
           <span class="tabs-item" @click="tabActive = 0" :class="{'bg-primary':tabActive == 0}">职业概况</span>
-          <span class="tabs-item" @click="tabActive = 1":class="{'bg-primary':tabActive == 1}">就业岗位</span>
+          <span class="tabs-item" @click="tabActive = 1" :class="{'bg-primary':tabActive == 1}">就业岗位</span>
         </div>
         <p class="line"></p>
         <div
           v-show="loading"
           class="loading-div"
           v-loading="loading"
-          :style="{height:windowHeight + 'px'}">
+          :style="{height:windowHeight + 'px'}"
+        >
         </div>
 
-        <div class="content-wrap mt20" >
+        <div class="content-wrap mt20">
           <!-- 职业概况  -->
           <div v-if="Object.keys(vocationDetail).length > 0">
             <div v-show="tabActive == 0">
@@ -57,23 +58,27 @@
                 <div class="text-666" v-html="vocationDetail.description"></div>
               </div>
               <div class="desc-item">
-                <p class="format-tit">就业岗位<span class="text-666 f14">({{vocationDetail.postJobs.length || 0}}个)</span></p>
+                <p class="format-tit">就业岗位<span class="text-666 f14">({{ vocationDetail.postJobs.length || 0 }}个)</span>
+                </p>
                 <div class="post-item mb20" v-for="post in vocationDetail.postJobs">
-                  <div class="post-title f16 mb10" style="cursor: pointer" @click="toJob(post)">{{post.name}}</div>
+                  <div class="post-title f16 mb10" style="cursor: pointer" @click="toJob(post)">{{ post.name }}</div>
                   <div class="pb10 text-666 post-text">
-                    <div>{{`${post.salaryMin}元-${post.salaryMax}元/月`}}</div>
-                    <div>热门地区：{{post.hotCity}}</div>
+                    <div>{{ `${post.salaryMin}元-${post.salaryMax}元/月` }}</div>
+                    <div>热门地区：{{ post.hotCity }}</div>
                   </div>
                 </div>
               </div>
               <div class="desc-item">
-                <p class="format-tit">相关专业<span class="text-666 f14">({{vocationDetail.postMajors.length}}个)</span></p>
+                <p class="format-tit">相关专业<span class="text-666 f14">({{ vocationDetail.postMajors.length }}个)</span>
+                </p>
                 <div class="post-item mb20" v-for="post in vocationDetail.postMajors">
-                  <div class="post-title f16 mb10" style="cursor: pointer" @click="toMajorDetail(post)">{{post.name}}</div>
+                  <div class="post-title f16 mb10" style="cursor: pointer" @click="toMajorDetail(post)">
+                    {{ post.name }}
+                  </div>
                   <div class="pb10 text-666 post-text">
-                    <div>国标代码：{{post.code}}</div>
-                    <div>学制：{{post.learnYear}}</div>
-                    <div>男女比例：{{`${post.maleRatio}/${post.femaleRatio}`}}</div>
+                    <div>国标代码：{{ post.code }}</div>
+                    <div>学制：{{ post.learnYear }}</div>
+                    <div>男女比例：{{ `${post.maleRatio}/${post.femaleRatio}` }}</div>
                   </div>
                 </div>
               </div>
@@ -81,18 +86,20 @@
           </div>
 
           <!--  就业岗位-->
-          <div v-if="vocationalPosts.length > 0">
-            <div v-show="tabActive == 1">
+          <div v-show="tabActive == 1">
+            <div v-if="vocationalPosts.length > 0">
               <el-row :gutter="20" type="flex" class="jobTabs">
                 <el-col class="job-item-wrap" :span="4" v-for="item in vocationalPosts" :key="item.name">
-                  <div class="job-item f14 f-333" :class="{'bg-primary':jobActiveName == item.name}" @click="toActiveJob(item.name)">
-                    <p class="mb10">{{item.name}}</p>
-                    <p>{{`${item.salaryMin}-${item.salaryMax}`}}{{item.salaryUnit}}</p>
+                  <div class="job-item f14 f-333" :class="{'bg-primary':jobActiveName == item.name}"
+                       @click="toActiveJob(item.name)"
+                  >
+                    <p class="mb10">{{ item.name }}</p>
+                    <p>{{ `${item.salaryMin}-${item.salaryMax}` }}{{ item.salaryUnit }}</p>
                   </div>
                 </el-col>
               </el-row>
               <!--  岗位详情  -->
-              <div  v-if="Object.keys(jobDetail).length > 0">
+              <div v-if="Object.keys(jobDetail).length > 0">
                 <!-- 图表 -->
                 <div class="desc-item">
                   <p class="format-tit">薪资情况</p>
@@ -125,9 +132,9 @@
                   <el-row :gutter="40" type="flex" class="flex-wrap">
                     <el-col :span="12" class="f16" v-for="(item,index) in  jobDetail.demand">
                       <el-row class="format-job-wrap">
-                        <el-col :span="3" class="f18 text-center f-666">{{index + 1}}</el-col>
-                        <el-col :span="15" class="f-333">{{item.city}}</el-col>
-                        <el-col :span="6" class="f-666  text-right f14">{{item.count}}职位</el-col>
+                        <el-col :span="3" class="f18 text-center f-666">{{ index + 1 }}</el-col>
+                        <el-col :span="15" class="f-333">{{ item.city }}</el-col>
+                        <el-col :span="6" class="f-666  text-right f14">{{ item.count }}职位</el-col>
                       </el-row>
                     </el-col>
                   </el-row>
@@ -137,9 +144,9 @@
                   <el-row :gutter="40" type="flex" class="flex-wrap">
                     <el-col :span="12" class="f16" v-for="(item,index) in  jobDetail.industrySalary">
                       <el-row class="format-job-wrap">
-                        <el-col :span="3" class="f18 text-center f-666">{{index + 1}}</el-col>
-                        <el-col :span="15" class="f-333">{{item.name}}</el-col>
-                        <el-col :span="6" class="f-666 text-right f14">{{item.salary}}元 / 月</el-col>
+                        <el-col :span="3" class="f18 text-center f-666">{{ index + 1 }}</el-col>
+                        <el-col :span="15" class="f-333">{{ item.name }}</el-col>
+                        <el-col :span="6" class="f-666 text-right f14">{{ item.salary }}元 / 月</el-col>
                       </el-row>
                     </el-col>
                   </el-row>
@@ -149,72 +156,71 @@
                   <el-row :gutter="40" type="flex" class="flex-wrap">
                     <el-col :span="12" class="f16" v-for="(item,index) in  jobDetail.citySalary">
                       <el-row class="format-job-wrap">
-                        <el-col :span="3" class="f18 text-center f-666">{{index + 1}}</el-col>
-                        <el-col :span="15" class="f-333">{{item.city}}</el-col>
-                        <el-col :span="6" class="f-666 text-right f14">{{item.salary}}元 / 月</el-col>
+                        <el-col :span="3" class="f18 text-center f-666">{{ index + 1 }}</el-col>
+                        <el-col :span="15" class="f-333">{{ item.city }}</el-col>
+                        <el-col :span="6" class="f-666 text-right f14">{{ item.salary }}元 / 月</el-col>
                       </el-row>
                     </el-col>
                   </el-row>
                 </div>
               </div>
-              <div v-else>
-                暂无数据
-              </div>
             </div>
-          </div></div>
+            <div v-else>
+              暂无数据
+            </div>
+          </div>
+        </div>
       </el-col>
     </el-row>
 
 
-
-
   </div>
 </template>
 <script>
 import MxChart from '@/components/MxChart/index'
-import { vocationalPostsDetail,vocationalPosts,vocationalOverview } from '@/api/webApi/vocation'
+import { vocationalOverview, vocationalPosts, vocationalPostsDetail } from '@/api/webApi/vocation'
 import MxVocationTranslateMixin from '@/components/Cache/modules/mx-vocation-translate-mixin'
 
 export default {
-  name: "Detail",
+  name: 'Detail',
   components: {
     MxChart
   },
-  mixins:[MxVocationTranslateMixin],
-  data(){
+  mixins: [MxVocationTranslateMixin],
+  data() {
     return {
-      loading:false,
-      code:'',
+      loading: false,
+      code: '',
       defaultProps: {
         children: 'children',
         label: 'name'
       },
       tabActive: 0,
       vocationalPosts: [],  // 就业岗位
-      vocationDetail:{},  // 职业概况
+      vocationDetail: {},  // 职业概况
       jobActiveName: '',  // 激活状态的岗位
       jobDetail: {},  // 岗位详情
-      windowHeight:document.documentElement.clientHeight,
+      windowHeight: document.documentElement.clientHeight
     }
   },
   created() {
     this.code = this.$route.query.code
-    this.getVocationalOverview();
+    this.getVocationalOverview()
   },
-  computed:{
+  computed: {
     // 按工资分布
     chartSalary() {
       if (!this.jobDetail.salary.length) return null
       const pieData = this.jobDetail.salary.map(item => {
         return {
           value: item.ratio,
-          name: `${item.min}-${item.max}元/月 ${item.ratio}%`,
+          name: `${item.min}-${item.max}元/月 ${item.ratio}%`
         }
       })
-      const options  = {
-          toolbox: {
-            show: true,
-          },
+      const options = {
+        toolbox: {
+          show: true
+        },
         tooltip: {
           trigger: 'item'
         },
@@ -222,7 +228,7 @@ export default {
           {
             type: 'pie',
             radius: [40, 60],
-            label:{
+            label: {
               formatter: '{b}'
             },
             data: pieData
@@ -237,19 +243,19 @@ export default {
       const pieData = this.jobDetail.exp.map(item => {
         return {
           value: item.ratio,
-          name: `${item.exp}${item.ratio}%`,
+          name: `${item.exp}${item.ratio}%`
         }
       })
-      const options  = {
+      const options = {
         toolbox: {
-          show: true,
+          show: true
         },
         series: [
           {
             name: 'Nightingale Chart',
             type: 'pie',
             radius: [30, 60],
-            label:{
+            label: {
               formatter: '{b}'
             },
             data: pieData
@@ -264,19 +270,19 @@ export default {
       const pieData = this.jobDetail.edu.map(item => {
         return {
           value: item.ratio,
-          name: `${item.edu}${item.ratio}%`,
+          name: `${item.edu}${item.ratio}%`
         }
       })
-      const options  = {
+      const options = {
         toolbox: {
-          show: true,
+          show: true
         },
         series: [
           {
             name: 'Nightingale Chart',
             type: 'pie',
             radius: [30, 60],
-            label:{
+            label: {
               formatter: '{b}'
             },
             data: pieData
@@ -290,7 +296,7 @@ export default {
       if (!this.jobDetail.experience.length) return null
       const col = this.jobDetail.experience.map(item => item.year)
       const row = this.jobDetail.experience.map(item => item.salary)
-      const options  = {
+      const options = {
         xAxis: {
           data: col,
           axisLine: {
@@ -300,10 +306,10 @@ export default {
           },
           axisTick: {
             alignWithLabel: true
-          },
+          }
         },
         yAxis: {
-          type: 'value',
+          type: 'value'
         },
         series: [
           {
@@ -313,37 +319,36 @@ export default {
             stack: 'Total',
             label: {
               show: true,
-              position: 'top',
+              position: 'top'
             },
             smooth: false,
             data: row
-          },
+          }
         ]
 
       }
       return options
     }
   },
-  watch:{
+  watch: {
     tabActive: {
-      handler(newVal){
+      handler(newVal) {
         // 1 岗位 0 概览
-        if(newVal == 0)  this.getVocationalOverview();
-        if(newVal == 1)  this.getVocationalPosts();
+        if (newVal == 0) this.getVocationalOverview()
+        if (newVal == 1) this.getVocationalPosts()
       }
-    },
+    }
   },
-  methods:{
+  methods: {
     toMajorDetail(row) {
-      console.log('跳转')
-      console.log(row)
       // 跳转
-      this.$router.push({path:'/career/plan/MajorDetail',query:{code:row.code}})
+      this.$router.push({ path: '/career/plan/MajorDetail', query: { code: row.code } })
     },
-    handleNodeClick(data,node) {
-      if(!node.isLeaf || this.code == node.data.code) return
-      this.code =node.data.code
+    handleNodeClick(data, node) {
+      if (!node.isLeaf || this.code == node.data.code) return
+      this.code = node.data.code
       this.tabActive = 0
+      this.vocationalPosts = []
       this.getVocationalOverview()
       // 跳转
       // this.$router.replace({path:'/career/vocation/Detail',query:{code:node.data.code}})
@@ -353,11 +358,11 @@ export default {
       this.tabActive = 1
       this.toActiveJob(post.name)
     },
-    isLeaf(data,node) {
+    isLeaf(data, node) {
       return node.childCount == 0
     },
     toActiveJob(name) {
-      if(this.jobActiveName == name) return
+      if (this.jobActiveName == name) return
       this.jobActiveName = name
       //  刷新数据
       this.getVocationalPostsDetail()
@@ -365,12 +370,12 @@ export default {
     //  就业岗位
     getVocationalPosts() {
       this.loading = true
-      const params={
-        code:this.code
-      };
+      const params = {
+        code: this.code
+      }
       vocationalPosts(params).then(res => {
         this.vocationalPosts = res.data
-        if(this.jobActiveName == '') {
+        if (this.jobActiveName == '') {
           this.jobActiveName = res.data[0].name
           this.$nextTick(_ => {
             this.getVocationalPostsDetail()
@@ -383,21 +388,21 @@ export default {
     // 就业岗位详情
     getVocationalPostsDetail() {
       this.loading = true
-      vocationalPostsDetail({postName:this.jobActiveName }).then(res => {
-          console.log(res)
+      vocationalPostsDetail({ postName: this.jobActiveName }).then(res => {
+        console.log(res)
         this.jobDetail = res.data || {}
       }).finally(res => {
         this.loading = false
       })
     },
     //  职业概况
-    getVocationalOverview(){
+    getVocationalOverview() {
       this.loading = true
-      const params={
-        code:this.code
-      };
-      vocationalOverview(params).then(res=>{
-         console.log(res)
+      const params = {
+        code: this.code
+      }
+      vocationalOverview(params).then(res => {
+        console.log(res)
         this.vocationDetail = res.data || {}
       }).finally(_ => {
         this.loading = false
@@ -408,57 +413,68 @@ export default {
 </script>
 <style lang="scss" scoped>
 .jobDetail {
-  .header-content{
+  .header-content {
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: rgba(66, 185, 131, 0.1);
   }
-  .custom-tree-node{
+
+  .custom-tree-node {
     display: flex;
     justify-content: space-between;
     align-items: center;
     width: 100%;
     overflow: hidden;
   }
-  .tabs-wrap{
+
+  .tabs-wrap {
     margin-top: 20px;
     height: 40px;
-    .tabs-item{
+
+    .tabs-item {
       cursor: pointer;
       padding: 0 33px;
       border-radius: 4px 4px 0 0;
       display: inline-block;
       line-height: 40px;
-      &:hover{
-        color:#47C6A2;
+
+      &:hover {
+        color: #47C6A2;
       }
-      &.bg-primary{
-        background: #47C6A2 ;
+
+      &.bg-primary {
+        background: #47C6A2;
         color: white;
       }
     }
   }
-  .bg-primary{
+
+  .bg-primary {
     background: #47C6A2 !important;
     color: white;
   }
+
   .format-job-wrap {
     display: flex;
     height: 44px;
     line-height: 44px;
     border-bottom: 1px solid #f2f2f2;
   }
-  .line{
-    background:  #47C6A2;
+
+  .line {
+    background: #47C6A2;
     height: 1px;
   }
-  .post-text{
+
+  .post-text {
     display: flex;
-    div{
+
+    div {
       min-width: 160px;
-      &:not(:first-child):before{
+
+      &:not(:first-child):before {
         content: "";
         display: inline-block;
         width: 1px;
@@ -470,6 +486,7 @@ export default {
       }
     }
   }
+
   .loading-div {
     width: 100%;
     position: absolute;
@@ -477,37 +494,43 @@ export default {
     left: 0;
   }
 
-  .post-title{
+  .post-title {
     color: #333;
   }
 
-  .post-item{
+  .post-item {
     border-bottom: 1px solid #f2f2f2;
     color: #333;
   }
-  .format-tit{
+
+  .format-tit {
     border-left: 4px solid #47C6A2;
     padding-left: 10px;
     margin-bottom: 20px;
     font-size: 20px;
   }
-  .desc-item{
+
+  .desc-item {
     margin-bottom: 40px;
   }
-  .text-666{
+
+  .text-666 {
     font-size: 14px;
     color: #666666 !important;
   }
 
-  .flex-wrap{
+  .flex-wrap {
     flex-wrap: wrap;
   }
-  .jobTabs{
+
+  .jobTabs {
     flex-wrap: wrap;
-    .job-item-wrap{
+
+    .job-item-wrap {
       padding: 10px;
       margin-bottom: 20px;
-      .job-item{
+
+      .job-item {
         cursor: pointer;
         border-radius: 4px;
         padding: 10px;
@@ -515,15 +538,18 @@ export default {
       }
     }
   }
-  .tree-wrap{
+
+  .tree-wrap {
     padding: 10px;
-    height: calc(100vh - 176px) ;
+    height: calc(100vh - 176px);
     overflow: hidden;
     overflow-y: auto;
   }
+
   ::v-deep .el-tree-node.is-current > .el-tree-node__content {
     background: rgba(22, 119, 255, 0.1);
     color: #47C6A2;
+
     ::v-deep .is-leaf {
       color: rgba(0, 0, 0, 0);
     }