优质供应商

src/router/index.js

@@ -9,7 +9,7 @@ import { filterAsyncRouter } from '@/store/modules/permission'
 
 NProgress.configure({ showSpinner: false })// NProgress Configuration
 
-const whiteList = ['/login', '/backlogin', '/home', '/product']// 免登录路由白名单
+const whiteList = ['/login', '/backlogin', '/home', '/product', '/supplier', '/project', '/course']// 免登录路由白名单
 const backUrlList = ['/dashboard', '/system', '/monitor', '/sys-tools', '/backstage']// 后台路由
 
 router.beforeEach((to, from, next) => {

src/router/routers.js

@@ -52,6 +52,30 @@ export const constantRouterMap = [
     },
     hidden: true
   },
+  {
+    path: '/supplier',
+    meta: { title: '优质供应商', noCache: true },
+    component: (resolve) => {
+      return require(['@/views/homepage/supplier/index'], resolve)
+    },
+    hidden: true
+  },
+  {
+    path: '/project',
+    meta: { title: '解决方案与服务', noCache: true },
+    component: (resolve) => {
+      return require(['@/views/homepage/project/index'], resolve)
+    },
+    hidden: true
+  },
+  {
+    path: '/course',
+    meta: { title: '专业培训', noCache: true },
+    component: (resolve) => {
+      return require(['@/views/homepage/course/index'], resolve)
+    },
+    hidden: true
+  },
   {
     path: '/backstage',
     component: Layout,

src/views/homepage/components/inquiryView.vue

@@ -38,7 +38,7 @@ export default {
         'course': '课程定制'
       },
       visible: false,
-      title: '询 价',
+      title: '咨 询',
       formData: {
         name: '',
         phone: '',
@@ -94,6 +94,8 @@ export default {
     initView(id, type) {
       if (type) {
         this.title = this.typeDict[type]
+      } else {
+        this.title = '咨 询'
       }
       this.showView()
     }

src/views/homepage/components/titleMenus.vue

@@ -10,7 +10,7 @@ export default {
   data() {
     return {
       menus: [
-        { name: '首页', url: '/home' }, { name: '优质产品', url: '/product' }, { name: '优质供应商' }, { name: '解决方案与服务' }, { name: '软件系统' }, { name: '专业培训' }, { name: '行业资讯' }, { name: '信息发布' }
+        { name: '首页', url: '/home' }, { name: '优质产品', url: '/product' }, { name: '优质供应商', url: '/supplier' }, { name: '解决方案与服务', url: '/project' }, { name: '软件系统' }, { name: '专业培训', url: '/course' }, { name: '行业资讯' }, { name: '信息发布' }
       ],
       currentMenuObj: null
     }

src/views/homepage/components/titleMenusV2.vue

@@ -17,7 +17,7 @@ export default {
   data() {
     return {
       menus: [
-        { name: '首页', url: '/home' }, { name: '优质产品', url: '/product' }, { name: '优质供应商' }, { name: '解决方案与服务' }, { name: '软件系统' }, { name: '专业培训' }, { name: '行业资讯' }, { name: '信息发布' }
+        { name: '首页', url: '/home' }, { name: '优质产品', url: '/product' }, { name: '优质供应商', url: '/supplier' }, { name: '解决方案与服务', url: '/project' }, { name: '软件系统' }, { name: '专业培训', url: '/course' }, { name: '行业资讯' }, { name: '信息发布' }
       ],
       currentMenuObj: null
     }

src/views/homepage/components/userLogin.vue

@@ -39,9 +39,7 @@ export default {
     ])
   },
   mounted() {
-    this.$nextTick(() => {
-      console.log(this.user)
-    })
+    this.$nextTick(() => {})
   },
   methods: {
     login(item) {

src/views/homepage/components/userLoginV2.vue

@@ -39,9 +39,7 @@ export default {
     ])
   },
   mounted() {
-    this.$nextTick(() => {
-      console.log(this.user)
-    })
+    this.$nextTick(() => {})
   },
   methods: {
     login(item) {

src/views/homepage/index.vue

@@ -107,7 +107,15 @@
         <!--热门排行榜-->
         <div class="line-title"><div class="title-point" /><span class="title-text">热门排行榜</span></div>
         <el-row :gutter="20" style="padding-top: 20px">
-          <el-col :span="8"><div class="top_area" /></el-col>
+          <el-col :span="8"><div class="top_area">
+            <div
+              v-for="(item,index) in topAreas"
+              :key="'ta_'+index"
+              class="top_area_text touch"
+              :style="'top:'+item.top+';left:'+item.left+';font-size:'+item.size+';color:'+color[index]"
+              @click="areaTopClick(item.name)"
+            >{{ item.name }}</div>
+          </div></el-col>
           <el-col :span="8"><div class="box-toplist">
             <div class="title">供应商TOP8</div>
             <ul class="contact-list">
@@ -167,6 +175,7 @@ export default {
   dicts: ['product_type', 'area_province'],
   data() {
     return {
+      color: ['#C1232B', '#27727B', '#FCCE10', '#E87C25', '#B5C334', '#FE8463', '#9BCA63', '#FAD860', '#F3A43B', '#60C0DD', '#D7504B', '#C6E579', '#F4E001', '#F0805A', '#26C0C0'],
       defaultImgProduct: default_product,
       defaultImgLogo: default_p_logo,
       imgSrcStart: process.env.VUE_APP_BASE_API,
@@ -352,6 +361,7 @@ export default {
           imgSrcList: []
         }
       ],
+      topAreas: [],
       topSuppliers: [
         { name: '中山市三角镇凌创传感器厂', id: 123 },
         { name: '中山市三角镇凌创传感器厂', id: 123 },
@@ -387,7 +397,20 @@ export default {
   },
   mounted() {
     this.$nextTick(() => {
-
+      const random = (min, max) => {
+        return Math.floor(Math.random() * (max - min)) + min
+      }
+      const arr = ['北京', '上海', '广州', '深圳', '青岛', '南京', '杭州', '天津', '石家庄', '济南', '烟台', '威海', '大连', '连云港', '潍坊']
+      arr.forEach((item, index) => {
+        this.topAreas.push({
+          name: item,
+          top: `${random(0, 382)}px`,
+          left: `${random(0, 324)}px`,
+          size: `${Math.max(80 - index * 7, 12)}px`
+        })
+      })
+      this.topAreas[0].top = '180px'
+      this.topAreas[0].left = '120px'
     })
   },
   methods: {
@@ -422,6 +445,10 @@ export default {
     goToDetails(item, type) {
       console.log(item, type)
     },
+    // 点击地区top
+    areaTopClick(text) {
+      console.log(text)
+    },
     // 点击更多
     moreTo(type) {
       console.log(type)
@@ -546,10 +573,19 @@ export default {
     }
   }
   .top_area {
+    position: relative;
     width: 100%;
     height: 492px;
     background: url("../../assets/home_images/top_area.png") no-repeat;
     background-size:100% 100%;
+    .top_area_text {
+      position: absolute;
+      font-weight: bolder;
+      opacity: 0.7;
+    }
+    .top_area_text:hover {
+      opacity: 1;
+    }
   }
   .box-toplist{
     background: #FFFFFF;

src/views/homepage/product/index.vue

@@ -175,6 +175,7 @@
     </div>
     <home-footer ref="homeFooter" />
     <inquiry-view ref="inquiryView" />
+    <el-backtop />
   </div>
 </template>
 <script>