优化

src/pages/DetailPage/ExpertDetail.vue

@@ -12,8 +12,11 @@
 <!--        <el-form-item label="性别" prop="count">-->
 <!--          <span>{{expert.gender}}</span>-->
 <!--        </el-form-item>-->
+        <el-form-item label="头衔" prop="address">
+          <span>{{expert.title}}</span>
+        </el-form-item>
         <el-form-item label="简介" prop="address">
-          <span class="badge">{{expert.introduction}}</span>
+          <span>{{expert.introduction}}</span>
         </el-form-item>
 <!--        <el-form-item label="接包次数" prop="count">-->
 <!--          <span>{{expert.taskCount}}</span>-->
@@ -44,7 +47,7 @@
                     name: '',
                     photo: '',
                     introduction: '',
-                    // gender: '',
+                    title: '',
                 },
             }
         },
@@ -70,6 +73,7 @@
                     this.expert.name = res.data.name
                     this.expert.photo = res.data.photo
                     // this.expert.gender = res.data.gender
+                    this.expert.title = res.data.title
                     this.expert.introduction = res.data.introduction
                     // this.expert.address = res.data.address
                     this.hideLoading()

src/pages/DetailPage/FieldDetail.vue

@@ -0,0 +1,42 @@
+<template>
+  <div class="home-wrapper">
+    <div class="container" style="margin: 20px auto;">
+      <div class="create-body" v-for="item in fields">
+        <div class="title h2">{{item.name}}</div>
+        <div class="h3">{{item.introduction}}</div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+    import {storageGet, getAllFields} from '@/js/index.js'
+    import {notify} from "../../constants";
+
+    export default {
+        name: "FieldDetail",
+        data() {
+            return {
+                isLogin: false,
+                fields: [],
+            }
+        },
+        methods: {
+            setFields(){
+                getAllFields().then((res) => {
+                    this.fields = res
+                    console.log(res);
+                })
+            },
+        },
+        mounted() {
+            this.setFields();
+        }
+    }
+</script>
+
+<style scoped>
+  .item-template {
+    height: 80px;
+  }
+</style>

src/pages/DetailPage/TestTypeDetail.vue

@@ -0,0 +1,41 @@
+<template>
+  <div class="home-wrapper">
+    <div class="container" style="margin: 20px auto;">
+      <div class="create-body" v-for="item in fields">
+        <div class="title h2">{{item.name}}</div>
+        <div class="h3">{{item.introduction}}</div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+    import {getAllServiceTypes, getAllFields} from '@/js/index.js'
+
+    export default {
+        name: "TestTypeDetail",
+        data() {
+            return {
+                isLogin: false,
+                fields: [],
+            }
+        },
+        methods: {
+            setFields(){
+                getAllServiceTypes().then((res) => {
+                    this.fields = res
+                    console.log(res);
+                })
+            },
+        },
+        mounted() {
+            this.setFields();
+        }
+    }
+</script>
+
+<style scoped>
+  .item-template {
+    height: 80px;
+  }
+</style>

src/pages/Homepage/Homepage.vue

@@ -41,19 +41,19 @@
       <el-row>
         <el-col :span="19" class="test-type-wrapper">
           <TestMenu :testTypeList="homeData.testTypeList"></TestMenu>
-          <TestCard :homeData="homeData"></TestCard>
+          <TestCard :applicationTypeList="homeData.applicationTypeList"></TestCard>
         </el-col>
         <el-col :span="5"  class="homepage-right-modules">
           <LoginCard/>
-          <HotCrowd :applicationTypeRank="homeData.applicationTypeRank"/>
-          <HotAgency :agencyRank="homeData.agencyRank"/>
-          <HotUser :userRank="homeData.userRank"/>
+          <HotCrowd :applicationTypeRank="homeDataNoCache.applicationTypeRank"/>
+          <HotAgency :agencyRank="homeDataNoCache.agencyRank"/>
+          <HotUser :userRank="homeDataNoCache.userRank"/>
           <HotContest :competitionList="homeData.competitionList"/>
         </el-col>
       </el-row>
       <el-row :gutter="15">
         <el-col :span="12">
-          <ResourceAndTool :resourceList="homeData.resourceList"></ResourceAndTool>
+          <ResourceAndTool :resourceList="homeDataNoCache.resourceList"></ResourceAndTool>
         </el-col>
         <el-col :span="12">
           <BrandCard :residentAgencyList = homeData.residentAgencyList></BrandCard>
@@ -145,6 +145,7 @@
           ],
         },
         homeData:{},
+        homeDataNoCache: {},
         currTab:'homepage'
       }
     },
@@ -155,12 +156,17 @@
         }
         this.setFields();
 
-        Http.get('/api/common/index/info').then((res)=>{
+        Http.get('/api/common/index/info/cache').then((res)=>{
+          console.log(res.data);
           this.homeData = res.data;
-          this.homeData.applicationTypeList.map((item)=>{
-            item.height = (item.testTypeList.length / 2) * 24 + 100;
-            return item;
-          })
+          // this.homeData.applicationTypeList.map((item)=>{
+          //   item.height = (item.testTypeList.length / 2) * 24 + 100;
+          //   return item;
+          // })
+        })
+
+        Http.get('/api/common/index/info/nocache').then((res)=>{
+            this.homeDataNoCache = res.data;
         })
       },
       setFields(){
@@ -168,7 +174,6 @@
               this.homeTabArr.menuArr2 = res
               // console.log(this.homeTabArr.menuArr2)
           })
-
       },
       checkLogin(){
         if(!this.isLogin){
@@ -181,12 +186,19 @@
       },
       handleTabClick(tab){
         this.currTab = tab.name;
-        console.log(this.currTab +  "  "  + tab.index );
+        // console.log(this.currTab +  "  "  + tab.index +  "  "  + tab.name );
         for(let i = 0; i < this.homeTabArr.menuArr3.length; i++){
             if (this.currTab === this.homeTabArr.menuArr3[i].name){
                 this.$router.push(this.homeTabArr.menuArr3[i].linkTo);
             }
         }
+
+        for(let i = 0; i < this.homeTabArr.menuArr2.length; i++){
+            if (this.currTab === this.homeTabArr.menuArr2[i].code){
+                this.$router.push('/field/detail');
+            }
+        }
+
         this.$router.push(this.homeTabArr.menuArr1[Number(tab.index)].linkTo);
       },
       handleTypeClick(tab){

src/pages/Homepage/TestCard.vue

@@ -6,25 +6,21 @@
                         :min-line-gap="150"
                         :max-line-gap="220"
                         :single-max-width="300"
-        :watch="homeData.applicationTypeList">
+        :watch="applicationTypeList">
         <!-- each component is wrapped by a waterfall slot -->
         <waterfall-slot
-          v-for="(item, index) in homeData.applicationTypeList"
+          v-for="(item, index) in applicationTypeList"
           width="300"
-          :height="item.height"
+          :height="200"
           :order="index"
           :key="item.code"
         >
-          <el-card class="test-card" :body-style="{width:'300'}">
+          <el-card class="test-card" :body-style="{width:'300'}" >
             <div slot="header" class="clearfix test-card-header">
               <span>{{item.name}}</span>
             </div>
             <div>
-              <el-row :gutter="20">
-                <el-col :span="12"v-for="type in item.testTypeList" :key="type.code">
-                  <span>{{type.name}}</span>
-                </el-col>
-              </el-row>
+              <span>{{item.introduction}}</span>
             </div>
           </el-card>
         </waterfall-slot>
@@ -39,7 +35,7 @@
   import {mapGetters} from  'vuex'
   export default {
     name: "TestCard",
-    props:['homeData'],
+    props:['applicationTypeList'],
     data(){
       return{
       }
@@ -48,8 +44,10 @@
       Waterfall,
       WaterfallSlot
     },
+    methods:{
+    },
     mounted() {
-
+      console.log(this.applicationTypeList)
     }
   }
 

src/pages/Homepage/TestMenu.vue

@@ -1,12 +1,12 @@
 <template>
   <div class="test-menu-wrapper">
     <div class="test-menu-item-wrapper">
-      <div class="test-menu-item" v-for="(item,index) in testTypeList" :key="item.code" v-if="index<8">
+      <div class="test-menu-item" v-for="(item,index) in testTypeList" :key="item.code" v-if="index<8"  @click="geToDetail">
         <img src="../../assets/img/testType.png" alt="testType" class="test-menu-item-img">
         {{item.name}}
       </div>
       <div class="more-test-wrapper">
-        <i class="el-icon-arrow-right more-test"></i>更多分类
+        <i class="el-icon-arrow-right more-test" @click="geToDetail"></i>更多分类
       </div>
     </div>
   </div>
@@ -20,7 +20,12 @@
       return {
 
       }
-    }
+    },
+    methods:{
+        geToDetail(){
+            this.$router.push("/test/type/detail");
+        }
+    },
   }
 </script>
 

src/pages/HomepageSearch/ExpertCard.vue

@@ -1,12 +1,12 @@
 <template>
   <el-card class="expert-card">
     <div>
-      <div class="card-img"><img src="../../assets/img/logo-blue.png"/></div>
+      <div class="card-img"><img :src="card.photo" style="height: 50px; width: 50px;"/></div>
       <div class="card-title">
-        {{card.name ? card.name :card.introduction}}
+        {{card.name}}
       </div>
       <div class="card-content">
-        {{card.introduction}}
+        {{card.title}}
       </div>
       <el-divider></el-divider>
       <div class="card-detail">

src/router/index.js

@@ -372,6 +372,24 @@ export default new Router({
       }
     },
     {
+      path: '/field/detail',
+      name: 'FieldDetail',
+      component: resolve => require(['@/pages/DetailPage/FieldDetail.vue'], resolve),
+      meta: {
+        title: '',
+        requireAuth: false,
+      }
+    },
+    {
+      path: '/test/type/detail',
+      name: 'TestTypeDetail',
+      component: resolve => require(['@/pages/DetailPage/TestTypeDetail.vue'], resolve),
+      meta: {
+        title: '',
+        requireAuth: false,
+      }
+    },
+    {
       path: '/personal',
       name: 'UserCenter',
       component: resolve => require(['@/pages/UserCenter/UserCenter.vue'], resolve),