ADD:增加与慕测排行榜对接

src/pages/Homepage/Homepage.vue

@@ -2,15 +2,15 @@
   <div class="home-wrapper">
     <div class="nav" stype="height:500px">
       <!--搜索框-->
-      <el-row class="search-nav" style="padding: 30px 0 20px 0">
-        <el-col :span="6">
-          <div class="pull-left" @click="handleLogoClick">
+      <el-row class="container search-nav" style="padding: 30px 0 20px 0" :gutter="40">
+        <el-col :span="5">
+          <div class="pull-left to-mooctest-ranking" @click="handleLogoClick">
             <img class="logo-img" :src="logo_transparent" :to="'/home'"/>
             <span class="logo-title">{{ logoTitle }}</span>
           </div>
         </el-col>
-        <el-col :span="12">
-          <div class="search-nav">
+        <el-col :span="15">
+          <div class="search-nav-input">
             <div id="search-block ">
               <el-tabs v-model="searchType" type="card" @tab-click="handleTypeClick">
                 <el-tab-pane v-for="item in searchTypeArr" v-if="item.value!=='all'" :label="item.name"
@@ -25,12 +25,12 @@
           </div>
 
         </el-col>
-        <el-col :span="6">
+        <el-col :span="4">
           <el-button type="primary pull-right" class="releaseBtn" @click="checkLogin()">免费发布众测需求</el-button>
         </el-col>
       </el-row>
       <!--TabNav-->
-      <el-tabs v-model="currTab" @tab-click="handleTabClick" class="square-tab">
+      <el-tabs v-model="currTab" @tab-click="handleTabClick" class="container square-tab">
         <el-tab-pane v-for="item in homeTabArr.menuArr1" :label="item.label" :name="item.name"
                      :key="item.name"></el-tab-pane>
         <el-tab-pane v-for="item in homeTabArr.menuArr2" :label="item.name" :name="item.code"
@@ -42,7 +42,7 @@
       </div>
     </div>
 
-    <div class="home-page container">
+    <div class="container home-page ">
       <el-row :gutter="15">
         <el-col :span="5" class="homepage-right-modules">
           <LoginCard v-if="HOME_DISPLAY.login_card"/>
@@ -54,6 +54,7 @@
 
         <el-col :span="19" class="test-type-wrapper">
           <TestMenu :testTypeList="homeData.testTypeList" v-if="HOME_DISPLAY.test_menu && homeData.testTypeList"></TestMenu>
+          <RankingCard></RankingCard>
           <TestCard :applicationTypeList="homeData.applicationTypeList" v-if="HOME_DISPLAY.test_card && homeData.applicationTypeList"></TestCard>
           <el-row style="margin-top: 10px" v-if="HOME_DISPLAY.resource_and_tool">
             <ResourceAndTool :resourceList="homeDataNoCache.toolList && homeDataNoCache.toolList"></ResourceAndTool>
@@ -77,6 +78,7 @@ import InstitutionCard from './InstitutionCard'
 import HotCrowd from './HotCrowd'
 import HotAgency from './HotAgency'
 import HotUser from './HotUser'
+import RankingCard from './RankingCard'
 import HotContest from './HotContest'
 import PopularProject from '../Square/PopularProject'
 import Http from '@/js/http.js'
@@ -101,6 +103,7 @@ export default {
     TestMenu,
     PopularProject,
     LoginCard,
+    RankingCard,
     TestCard,
     BrandCard,
     ResourceAndTool,
@@ -175,7 +178,7 @@ export default {
       this.checkCreateProjectAuth();
     },
     handleLogoClick(){
-      location.reload();
+      window.open('http://47.98.174.59:8200/#/');
     },
     checkCreateProjectAuth() {
       if (!this.isLogin) {

src/pages/Homepage/RankingCard.vue

@@ -0,0 +1,58 @@
+<template>
+  <el-row :gutter="20" style="margin-bottom: 20px">
+    <el-col :span="8">
+      <div class="ranking-card ranking-card1"
+           onclick="window.open('http://47.98.174.59:8200/#/list?field=BASESF&code=OS')">
+        <div class="wrap-mask">操作系统推荐榜</div>
+      </div>
+    </el-col>
+    <el-col :span="8">
+      <div class="ranking-card ranking-card2"
+           onclick="window.open('http://47.98.174.59:8200/#/list?field=BASESF&code=DATABASE')">
+        <div class="wrap-mask">数据库推荐榜</div>
+      </div>
+    </el-col>
+    <el-col :span="8">
+      <div class="ranking-card ranking-card3"
+           onclick="window.open('http://47.98.174.59:8200/#/list?field=APPSF&code=OFFICE')">
+        <div class="wrap-mask">办公软件推荐榜</div>
+      </div>
+    </el-col>
+  </el-row>
+</template>
+
+<script>
+export default {
+  name: "RankingCard"
+}
+</script>
+
+<style scoped lang="scss">
+.ranking-card {
+  background-size: 100% 100%;
+  width: 100%;
+  height: 113px;
+  border-radius: 4px;
+  text-align: center;
+  line-height: 113px;
+  font-size: 22px;
+  cursor: pointer;
+}
+
+.ranking-card1{
+  background-image: url("~@/assets/image/ranking-bcg4.png");
+}
+.ranking-card2{
+  background-image: url("~@/assets/image/ranking-bcg4.png");
+}
+.ranking-card3{
+  background-image: url("~@/assets/image/ranking-bcg4.png");
+}
+.wrap-mask {
+  height:100%;
+  width:100%;
+  background: rgba(241, 5, 5, 0.2);
+  border-radius: 4px;
+}
+
+</style>

src/pages/Square/Square2.0.vue

@@ -2,15 +2,15 @@
   <div>
     <div class="nav" stype="height:500px">
       <!--搜索框-->
-      <el-row class="search-nav" style="padding: 30px 0 20px 0">
-        <el-col :span="6">
-          <div class="pull-left" @click="gotoHome" style="cursor: pointer">
-            <img class="logo-img" src="../../assets/image/logo-transparent.png" />
-            <span class="logo-title">{{logoTitle}}</span>
+      <el-row class="container search-nav" style="padding: 30px 0 20px 0">
+        <el-col :span="5">
+          <div class="pull-left to-mooctest-ranking" @click="handleLogoClick">
+            <img class="logo-img" :src="logo_transparent" :to="'/home'"/>
+            <span class="logo-title">{{ logoTitle }}</span>
           </div>
         </el-col>
-        <el-col :span="12">
-          <div class="search-nav">
+        <el-col :span="15">
+          <div class="search-nav-input">
             <div id="search-block " class="">
               <el-tabs v-model="searchType" type="card" @tab-click="handleTypeClick">
                 <el-tab-pane v-for="item in searchTabArr" :label="item.label" :name="item.name" :key="item.label"></el-tab-pane>
@@ -23,12 +23,12 @@
             </div>
           </div>
         </el-col>
-        <el-col :span="6">
+        <el-col :span="4">
           <el-button type="primary pull-right" class="releaseBtn" @click="checkLogin()">免费发布众测需求</el-button>
         </el-col>
       </el-row>
       <!--TabNav-->
-      <el-tabs v-model="currTab" @tab-click="handleTabClick" class="square-tab" >
+      <el-tabs v-model="currTab" @tab-click="handleTabClick" class="container square-tab" >
         <el-tab-pane  v-for="item in menuArr" :name="item.name" :key="item.name">
           <span slot="label" style="font-size: 18px">{{item.label}}</span>
         </el-tab-pane>
@@ -81,6 +81,7 @@
     data(){
       return {
         logoTitle:CONFIG.logoTitle,
+        logo_transparent:CONFIG.logo_transparent,
         SQUARE_DISPLAY:CONFIG.SQUARE_DISPLAY,
         user: {},
         isLogin: false,
@@ -106,6 +107,9 @@
     computed:{
     },
     methods:{
+      handleLogoClick(){
+        window.open('http://47.98.174.59:8200/#/');
+      },
       gotoHome(){
         this.$router.push('/home');
       },

src/pages/Technology/Technology2.0.vue

@@ -2,15 +2,15 @@
   <div class="technology-container">
     <div class="nav" stype="height:500px">
       <!--搜索框-->
-      <el-row class="search-nav" style="padding: 30px 0 20px 0">
-        <el-col :span="6">
-          <div class="pull-left" @click="gotoHome" style="cursor: pointer">
-            <img class="logo-img" src="../../assets/image/logo-transparent.png" />
-            <span class="logo-title">{{logoTitle}}</span>
+      <el-row class="container search-nav" style="padding: 30px 0 20px 0">
+        <el-col :span="5">
+          <div class="pull-left to-mooctest-ranking" @click="handleLogoClick">
+            <img class="logo-img" :src="logo_transparent" :to="'/home'"/>
+            <span class="logo-title">{{ logoTitle }}</span>
           </div>
         </el-col>
-        <el-col :span="12">
-          <div class="search-nav">
+        <el-col :span="15">
+          <div class="search-nav-input">
             <div id="search-block " class="">
               <el-tabs v-model="searchType" type="card" @tab-click="handleTypeClick">
                 <el-tab-pane v-for="item in searchTypeArr" :label="item.label" :name="item.value" :key="item.value"></el-tab-pane>
@@ -21,12 +21,12 @@
             </div>
           </div>
         </el-col>
-        <el-col :span="6">
+        <el-col :span="4">
           <el-button type="primary pull-right" class="releaseBtn" @click="checkLogin()">免费发布众测需求</el-button>
         </el-col>
       </el-row>
       <!--TabNav-->
-      <el-tabs v-model="searchType" @tab-click="handleTabClick" class="square-tab">
+      <el-tabs v-model="searchType" @tab-click="handleTabClick" class="container square-tab">
         <el-tab-pane v-for="item in searchTypeArr" :name="item.value" :key="item.value">
           <span slot="label" style="font-size: 18px">{{item.name}}</span>
         </el-tab-pane>
@@ -94,6 +94,7 @@
     data(){
       return {
         logoTitle:CONFIG.logoTitle,
+        logo_transparent:CONFIG.logo_transparent,
         TECHNOLOGY_DISPLAY:CONFIG.TECHNOLOGY_DISPLAY,
         loading: false,
         isLogin: false,
@@ -107,6 +108,9 @@
       }
     },
     methods:{
+      handleLogoClick(){
+        window.open('http://47.98.174.59:8200/#/');
+      },
       loadData(){
           if (storageGet('user') != null) {
               this.isLogin = true;
@@ -205,6 +209,7 @@
 
 <style lang="scss">
   @import "../../style/search-nav.scss";
+
   .technology-container {
     /deep/ .search-input,/deep/ .releaseBtn{
       margin: 20px 0 0 0 !important;

src/router/index.js

@@ -1,7 +1,6 @@
 import Vue from 'vue'
 import Router from 'vue-router'
 import Home from '@/components/Home'
-// import Square from '@/components/Square'
 import Mine from '@/components/Mine'
 
 import Task from '@/components/task/Task'
@@ -39,24 +38,6 @@ export default new Router({
         showSlice: true
       },
     },
-    // {
-    //   path: '/home',
-    //   name: 'Home',
-    //   component: resolve => require(['@/components/Home.vue'], resolve),
-    //   meta: {
-    //     title: '',
-    //     requireAuth: false,
-    //   },
-    // },
-    // {
-    //   path: '/square',
-    //   name: 'Square',
-    //   component: resolve => require(['@/components/Square.vue'], resolve),
-    //   meta: {
-    //     title: '',
-    //     requireAuth: false,
-    //   },
-    // },
     {
       path: '/mine',
       name: 'Mine',

src/style/search-nav.scss

@@ -3,19 +3,30 @@
 .nav{
   background:rgba(255,255,255,1);
   box-shadow:0px 4px 30px 0px rgba(8,5,6,0.08);
-  padding: 0 10%;
+  //padding: 0 10%;
+}
+.search-nav,.square-tab {
+  margin: 0 auto !important;
+  /deep/ .el-col {
+    padding: 0 !important;
+  }
 }
-
 .logo-img{
-  width: 50px;
-  height: 50px;
-  margin: 2px 23px;
-  display: block;
+  width: 45px;
+  height: 45px;
+  margin: 2px 30px;
+  display: inline-block;
+  vertical-align: middle;
 }
 .logo-title{
   width: 100px;
   display: inline-block;
   text-align: center;
+  height: 50px;
+  line-height: 50px;
+  color: $__color-primary;
+  font-width: 500;
+  font-size: 18px;
 }
 .nav .el-tabs__header{
   margin: 0 !important;
@@ -30,10 +41,6 @@
   height: 0;
 }
 
-/*.square-tab .el-tabs__item {*/
-/*  font-size: 18px;*/
-/*  margin-right: 35px;*/
-/*}*/
 
 .search-button{
   background-color: $--color-primary !important;
@@ -47,6 +54,7 @@
 
 .search-block{
   width: 500px;
+
 }
 
 .releaseBtn{
@@ -57,3 +65,14 @@
   border: 1px solid #ccc;
   width: 1px;
 }
+.to-mooctest-ranking {
+  background-image: url("~@/assets/image/ranking-bcg.png");
+  background-size: 100% 100%;
+  width: 100%;
+  height: 66px;
+  padding-top: 14px;
+}
+.search-nav-input {
+  width: 600px;
+  margin: 0 auto;
+}