career test entry fixed

src/views/career/plan/CareerEva.vue

@@ -121,9 +121,9 @@ export default {
   methods: {
     goCareer (type) {
       if (type === 'HOLLAND') {
-        this.$router.push({ name: 'CareerEvaDetail', params: { type: 'HOLLAND' } })
+        this.$router.push({ name: 'CareerEvaDetail', query: { type: 'HOLLAND' } })
       }else if(type === 'BMTI'){
-        this.$router.push({ name: 'CareerEvaDetail', params: { type: 'BMTI' } })
+        this.$router.push({ name: 'CareerEvaDetail', query: { type: 'BMTI' } })
       }
     },
     goReportList(type){

src/views/career/plan/CareerEvaDetail.vue

@@ -5,7 +5,7 @@
       <el-image style="width:100%;" :src="require('@/assets/images/career/career_banner.png')"></el-image>
       <div v-if="flag===false" style="padding:10px 72px;">
         <!-- 迈尔斯布里格斯类型指标（MBTI）测试前 -->
-        <h2 v-if="cereerType === 'HOLLAND'">职业性格测评（MBTI）测试前须知</h2>
+        <h2 v-if="careerType === 'HOLLAND'">职业性格测评（HOLLAND）测试前须知</h2>
         <h2 v-else>迈尔斯布里格斯类型指标（MBTI）测试前须知</h2>
         <el-row style="font-size: 14px;">
           <ul>
@@ -15,86 +15,95 @@
             </li>
             <li>
               <div class="number">2</div>
-              <div></div>《性格分析报告》展示的你的性格倾向，而不是你的知识，技能，经验。
+              <div></div>
+              《性格分析报告》展示的你的性格倾向，而不是你的知识，技能，经验。
             </li>
             <li>
-            <div class="number">3</div>
-            <div style="width:100%">
-              MBTI提供的性格类型描述仅供测试者确定自己的性格类型之用，性格类型没有好坏，只有不同。每一种性格特征都有其价值和优点，也有缺点和需要注意的地方。清楚地了解自己的性格优劣势，有利于更好地发挥自己的特长，而尽可能的在为人处事中避免自己性格中的劣势，更好地和他人相处，更好地作重要的决策。
-            </div>
+              <div class="number">3</div>
+              <div style="width:100%">
+                MBTI提供的性格类型描述仅供测试者确定自己的性格类型之用，性格类型没有好坏，只有不同。每一种性格特征都有其价值和优点，也有缺点和需要注意的地方。清楚地了解自己的性格优劣势，有利于更好地发挥自己的特长，而尽可能的在为人处事中避免自己性格中的劣势，更好地和他人相处，更好地作重要的决策。
+              </div>
             </li>
             <li>
               <div class="number">4</div>
-              <div>本测试分为四部分，共{{cereerType === 'HOLLAND'?'60题':'93题'}}。需时约18分钟，所有题目没有对错之分，请根据自己的时间情况填写</div>
+              <div>
+                本测试分为四部分，共{{ careerType === 'HOLLAND' ? '60题' : '93题' }}。需时约18分钟，所有题目没有对错之分，请根据自己的时间情况填写
+              </div>
             </li>
           </ul>
         </el-row>
         <div style="position: relative;">
-          <el-image style="width:100%;margin-top: 20px;" :src="require('@/assets/images/career/bg_xuzhi.png')"></el-image>
-        <div style="width: 60%;position: absolute;top:40%;right:15%;color:#47C6A2;font-size: 14px;">只要你是认真、真实地填写了测试问卷，那么通常情况下你都能得到一个确实和你的性格相匹配的类型。 希望你能从中或多或少地获得一些有益的信息。</div>
+          <el-image style="width:100%;margin-top: 20px;"
+                    :src="require('@/assets/images/career/bg_xuzhi.png')"></el-image>
+          <div style="width: 60%;position: absolute;top:40%;right:15%;color:#47C6A2;font-size: 14px;">
+            只要你是认真、真实地填写了测试问卷，那么通常情况下你都能得到一个确实和你的性格相匹配的类型。
+            希望你能从中或多或少地获得一些有益的信息。
+          </div>
         </div>
-      <el-row style="margin-top: 56px;margin-bottom: 60px;">
-        <el-button style="background-color: #47C6A2;color: #ffffff;" @click="flag=true">开始测试</el-button>
-        <el-button style="color: #979797;" @click="$router.push('/career/components/CareerHollandReportList')">查询记录</el-button>
-      </el-row>
+        <el-row style="margin-top: 56px;margin-bottom: 60px;">
+          <el-button style="background-color: #47C6A2;color: #ffffff;" @click="flag=true">开始测试</el-button>
+          <el-button @click="$router.push({name:careerType === 'HOLLAND'?'CareerHollandReportList': 'CareerMbtiReportList'})">
+            查询记录
+          </el-button>
+        </el-row>
       </div>
-      <div v-if="cereerType === 'HOLLAND' && flag===true ">
-        <career-holland />
+      <div v-if="careerType === 'HOLLAND' && flag===true ">
+        <career-holland/>
       </div>
-      <div v-if="cereerType === 'BMTI' && flag===true ">
-        <career-mbti></career-mbti>
+      <div v-if="careerType === 'BMTI' && flag===true ">
+        <career-mbti/>
       </div>
-     </div>
+    </div>
   </div>
 </template>
 
 <script>
 import CareerHolland from "@/views/career/components/CareerHolland";
 import CareerMbti from "@/views/career/components/CareerMbti";
+
 export default {
   name: "CareerEvaDetail",
-  components: { CareerHolland,CareerMbti },
+  components: {CareerHolland, CareerMbti},
   data() {
     return {
-      cereerType: "", //标识是从哪里进来的
-      flag:false
+      flag: false
     };
   },
-  watch: {
-    $route: {
-      immediate: true,
-      handler(val) {
-        this.cereerType = val.params.type;
-      }
+  computed: {
+    careerType() {
+      return this.$route.query.type || 'HOLLAND'
     }
   }
 };
 </script>
 
 <style scoped lang="scss">
-  ul{
-    padding: 0;
-  }
-  li{
-    list-style: none;
-    display: flex;
-    align-items: center;
-    margin: 15px 0;
-    div{
-      font-size: 14px;
-      color: #414141;
-      font-family: PingFangSC-Regular, PingFang SC;
-      font-weight: 400;
-    }
-  }
-  .number{
-    width: 24px;
-    height: 24px;
-    border-radius: 50%;
-    background-color:#D2F1E8;
-    color:#000000;
-    text-align: center;
-    line-height: 24px;
-    margin-right: 10px;
+ul {
+  padding: 0;
+}
+
+li {
+  list-style: none;
+  display: flex;
+  align-items: center;
+  margin: 15px 0;
+
+  div {
+    font-size: 14px;
+    color: #414141;
+    font-family: PingFangSC-Regular, PingFang SC;
+    font-weight: 400;
   }
+}
+
+.number {
+  width: 24px;
+  height: 24px;
+  border-radius: 50%;
+  background-color: #D2F1E8;
+  color: #000000;
+  text-align: center;
+  line-height: 24px;
+  margin-right: 10px;
+}
 </style>