更新

src/router/index.js

@@ -12,6 +12,13 @@ const routes = [
     meta: { title: '首页', isleftarrow: false },
     component: () => import('../views/home/index.vue'),
   },
+  // 直播大厅
+  {
+    path: '/live/index',
+    name: 'live_index',
+    meta: { title: '直播大厅', isleftarrow: true },
+    component: () => import('../views/live/index.vue'),
+  },
   // 科技超市
   {
     path: '/market/index',
@@ -19,43 +26,13 @@ const routes = [
     meta: { title: '科技超市', isleftarrow: true },
     component: () => import('../views/market/index.vue'),
   },
-  // 科技超市-技术-产品-服务详情
-  {
-    path: '/market/prodDetail',
-    name: 'market_prodDetail',
-    meta: { title: '产品详情', isleftarrow: true },
-    component: () => import('../views/market/prodDetail.vue'),
-  },
-  // 科技超市-专家详情
-  {
-    path: '/market/exportDetail',
-    name: 'market_exportDetail',
-    meta: { title: '专家详情', isleftarrow: true },
-    component: () => import('../views/market/exportDetail.vue'),
-  },
-
-  // 科技超市-发布产品
-  {
-    path: '/market/detail',
-    name: 'market_detail',
-    meta: { title: '发布产品', isleftarrow: true },
-    component: () => import('../views/market/detail.vue'),
-  },
-
-  // 个人中心
-  {
-    path: '/user/index',
-    name: 'user_index',
-    meta: { title: '个人中心', isleftarrow: true },
-    component: () => import('../views/user/index.vue'),
-  },
-  // 个人中心-个人信息维护
-  {
-    path: '/user/personal',
-    name: 'user_personal',
-    meta: { title: '个人信息维护', isleftarrow: true },
-    component: () => import('../views/user/personal.vue'),
-  },
+  // // 个人中心
+  // {
+  //   path: '/user/index',
+  //   name: 'user_index',
+  //   meta: { title: '个人中心', isleftarrow: true },
+  //   component: () => import('../views/user/index.vue'),
+  // },
 ];
 
 const router = new VueRouter({

src/views/home/parts/clickBtn.vue

@@ -2,11 +2,11 @@
   <div id="clickBtn">
     <el-row>
       <el-col :span="24" class="info">
-        <el-col :span="11" class="btn">
+        <el-col :span="11" class="btn" @click.native="$router.push({ path: '/live/index' })">
           <p><i class="el-icon-camera"></i></p>
           <el-button type="primary" round>直播大厅</el-button>
         </el-col>
-        <el-col :span="11" class="btn">
+        <el-col :span="11" class="btn" @click.native="$router.push({ path: '/market/index' })">
           <p><i class="el-icon-coin"></i></p>
           <el-button type="primary" round>科技超市</el-button>
         </el-col>

src/views/live/index.vue

@@ -0,0 +1,63 @@
+<template>
+  <div id="index">
+    <el-row>
+      <el-col :span="24" class="style">
+        <el-col :span="24" class="top">
+          <NavBar v-show="navShow" :title="title" :isleftarrow="isleftarrow"> </NavBar>
+        </el-col>
+        <el-col :span="24" class="main">
+          直播
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+import NavBar from '@/layout/common/topInfo.vue';
+export default {
+  name: 'index',
+  props: {},
+  components: {
+    NavBar,
+  },
+  data: function() {
+    return {
+      // 头部标题
+      title: '',
+      // meta为true
+      isleftarrow: '',
+      // 返回
+      navShow: true,
+    };
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+  },
+  mounted() {
+    this.title = this.$route.meta.title;
+    this.isleftarrow = this.$route.meta.isleftarrow;
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.style {
+  width: 100%;
+  min-height: 667px;
+  position: relative;
+  background-color: #f9fafc;
+}
+.top {
+  height: 46px;
+  overflow: hidden;
+  position: relative;
+  z-index: 999;
+}
+.main {
+  min-height: 570px;
+}
+</style>

src/views/market copy/index.vue

@@ -0,0 +1,130 @@
+<template>
+  <div id="index">
+    <el-row>
+      <el-col :span="24" class="style">
+        <el-col :span="24" class="top">
+          <NavBar v-show="navShow" :title="title" :isleftarrow="isleftarrow"> </NavBar>
+        </el-col>
+        <el-col :span="24" class="main">
+          <el-col :span="24" class="one">
+            <van-tabs v-model="active" animated>
+              <van-tab>
+                <template #title>
+                  <van-icon name="todo-list" />
+                  <p>技术供求</p>
+                </template>
+                <technologyList></technologyList>
+              </van-tab>
+              <van-tab>
+                <template #title>
+                  <van-icon name="cluster" />
+                  <p>产品供求</p>
+                </template>
+                <productList></productList>
+              </van-tab>
+              <van-tab>
+                <template #title>
+                  <van-icon name="label" />
+                  <p>服务供求</p>
+                </template>
+                <serviceList></serviceList>
+              </van-tab>
+              <van-tab>
+                <template #title>
+                  <van-icon name="manager" />
+                  <p>专家供求</p>
+                </template>
+                <expertList></expertList>
+              </van-tab>
+            </van-tabs>
+          </el-col>
+          <el-col :span="24" class="two">
+            <van-button type="primary" @click="$router.push({ path: '/market/detail' })">发布产品</van-button>
+          </el-col>
+        </el-col>
+        <el-col :span="24" class="foot">
+          <footInfo></footInfo>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import NavBar from '@/layout/common/topInfo.vue';
+import footInfo from '@/layout/common/footInfo.vue';
+import technologyList from './parts/technologyList.vue';
+import productList from './parts/productList.vue';
+import serviceList from './parts/serviceList.vue';
+import expertList from './parts/expertList.vue';
+export default {
+  name: 'index',
+  props: {},
+  components: {
+    NavBar,
+    footInfo,
+    technologyList, //技术供求
+    productList, //产品供求
+    serviceList, //服务供求
+    expertList, //专家供求
+  },
+  data: () => ({
+    // 头部标题
+    title: '',
+    // meta为true
+    isleftarrow: '',
+    // 返回
+    navShow: true,
+    // 标签
+    active: '1',
+  }),
+  created() {},
+  computed: {},
+  methods: {},
+  mounted() {
+    this.title = this.$route.meta.title;
+    this.isleftarrow = this.$route.meta.isleftarrow;
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.style {
+  width: 100%;
+  min-height: 667px;
+  position: relative;
+  background-color: #f9fafc;
+}
+.top {
+  height: 46px;
+  overflow: hidden;
+  position: relative;
+  z-index: 999;
+}
+.main {
+  min-height: 570px;
+  .two {
+    position: fixed;
+    top: 80%;
+    left: 10px;
+    z-index: 999;
+  }
+}
+/deep/.van-tab {
+  text-align: center;
+}
+/deep/.van-tabs--line .van-tabs__wrap {
+  height: 70px;
+  margin: 0 0 10px 0;
+}
+/deep/.van-tab--active {
+  color: red;
+}
+.van-icon {
+  font-size: 20px;
+}
+.foot {
+  position: absolute;
+  bottom: 0;
+}
+</style>

src/views/market/index.vue

@@ -6,44 +6,7 @@
           <NavBar v-show="navShow" :title="title" :isleftarrow="isleftarrow"> </NavBar>
         </el-col>
         <el-col :span="24" class="main">
-          <el-col :span="24" class="one">
-            <van-tabs v-model="active" animated>
-              <van-tab>
-                <template #title>
-                  <van-icon name="todo-list" />
-                  <p>技术供求</p>
-                </template>
-                <technologyList></technologyList>
-              </van-tab>
-              <van-tab>
-                <template #title>
-                  <van-icon name="cluster" />
-                  <p>产品供求</p>
-                </template>
-                <productList></productList>
-              </van-tab>
-              <van-tab>
-                <template #title>
-                  <van-icon name="label" />
-                  <p>服务供求</p>
-                </template>
-                <serviceList></serviceList>
-              </van-tab>
-              <van-tab>
-                <template #title>
-                  <van-icon name="manager" />
-                  <p>专家供求</p>
-                </template>
-                <expertList></expertList>
-              </van-tab>
-            </van-tabs>
-          </el-col>
-          <el-col :span="24" class="two">
-            <van-button type="primary" @click="$router.push({ path: '/market/detail' })">发布产品</van-button>
-          </el-col>
-        </el-col>
-        <el-col :span="24" class="foot">
-          <footInfo></footInfo>
+          直播
         </el-col>
       </el-col>
     </el-row>
@@ -51,36 +14,29 @@
 </template>
 
 <script>
+import { mapState, createNamespacedHelpers } from 'vuex';
 import NavBar from '@/layout/common/topInfo.vue';
-import footInfo from '@/layout/common/footInfo.vue';
-import technologyList from './parts/technologyList.vue';
-import productList from './parts/productList.vue';
-import serviceList from './parts/serviceList.vue';
-import expertList from './parts/expertList.vue';
 export default {
   name: 'index',
   props: {},
   components: {
     NavBar,
-    footInfo,
-    technologyList, //技术供求
-    productList, //产品供求
-    serviceList, //服务供求
-    expertList, //专家供求
   },
-  data: () => ({
-    // 头部标题
-    title: '',
-    // meta为true
-    isleftarrow: '',
-    // 返回
-    navShow: true,
-    // 标签
-    active: '1',
-  }),
+  data: function() {
+    return {
+      // 头部标题
+      title: '',
+      // meta为true
+      isleftarrow: '',
+      // 返回
+      navShow: true,
+    };
+  },
   created() {},
-  computed: {},
   methods: {},
+  computed: {
+    ...mapState(['user']),
+  },
   mounted() {
     this.title = this.$route.meta.title;
     this.isleftarrow = this.$route.meta.isleftarrow;
@@ -103,28 +59,5 @@ export default {
 }
 .main {
   min-height: 570px;
-  .two {
-    position: fixed;
-    top: 80%;
-    left: 10px;
-    z-index: 999;
-  }
-}
-/deep/.van-tab {
-  text-align: center;
-}
-/deep/.van-tabs--line .van-tabs__wrap {
-  height: 70px;
-  margin: 0 0 10px 0;
-}
-/deep/.van-tab--active {
-  color: red;
-}
-.van-icon {
-  font-size: 20px;
-}
-.foot {
-  position: absolute;
-  bottom: 0;
 }
 </style>