上传课程页的代码

mallApp/src/components/app-tabbar.vue

@@ -35,6 +35,12 @@ export default {
           "selectedIconPath": "../static/images/common/category-is.png",
           "text": "分类"
         },
+        {
+          "pagePath": "/pages/home/course",
+          "iconPath": "../static/images/common/category-no.png",
+          "selectedIconPath": "../static/images/common/category-is.png",
+          "text": "课程"
+        },
         {
           "pagePath": "/pages/home/shop",
           "iconPath": "../static/images/common/shop-no.png",
@@ -59,7 +65,6 @@ export default {
   },
   methods: {
     switchTab (index, item) {
-      console.log('/' + item.pagePath)
       console.log(index)
       // this.currentTabIndex = index
       uni.switchTab({

mallApp/src/pages.json

@@ -30,6 +30,12 @@
 				"navigationBarTitleText": "我的"
 			}
 		},
+    {
+			"path": "pages/home/course",
+			"style": {
+				"navigationBarTitleText": "课程"
+			}
+		},
 		{
 			"path": "common/redirect",
 			"style": {
@@ -42,6 +48,13 @@
 				"navigationBarBackgroundColor": "#ffffff",
 				"navigationBarTextStyle": "black"
 			}
+		},
+    {
+			"path": "pages/class/index",
+			"style": {
+				"navigationBarBackgroundColor": "#ffffff",
+				"navigationBarTextStyle": "black"
+			}
 		}
 	],
 	"subPackages": [
@@ -197,6 +210,12 @@
 				"selectedIconPath": "static/images/common/category-is.png",
 				"text": "分类"
 			},
+      {
+        "pagePath": "pages/home/course",
+        "iconPath": "static/images/common/category-no.png",
+        "selectedIconPath": "static/images/common/category-is.png",
+        "text": "课程"
+      },
 			{
 				"pagePath": "pages/home/shop",
 				"iconPath": "static/images/common/shop-no.png",

mallApp/src/pages/class/index.vue

@@ -0,0 +1,5 @@
+<template>
+  <view>
+    123
+  </view>
+</template>

mallApp/src/pages/home/course.vue

@@ -0,0 +1,117 @@
+< -- 汪宁  2021-4-16  -- > 
+<template>
+  <view class="app_content">
+    <scroll-view class="course_list" scroll-y>
+      <view class="list_item" v-for="(item, index) in 8" :key="index">
+        <image src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fi1.sinaimg.cn%2FIT%2F2010%2F0419%2F201041993511.jpg&refer=http%3A%2F%2Fi1.sinaimg.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621152651&t=08594a9b7bc95600bd5134c8be7f1150"></image>
+        <view class="class_name">婚礼宴会设计班</view>
+        <view class="class_introduce">针对花店花艺师，有一定花艺基础的花艺从业者</view>
+        <view class="class_price">
+          <text>¥6800.00</text>
+          <view class="class_apply">
+            <text>600人报名</text>
+            <view class="apply_btn" @click="signUp">报名</view>
+          </view>
+        </view>
+      </view>
+    </scroll-view>
+    <tab-bar
+      :current="2"
+      @click="tabClick"
+    ></tab-bar>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      currentTabIndex: 2
+    }
+  },
+  methods: {
+    tabClick (index) {
+      this.currentTabIndex = index
+    },
+    signUp() {
+      uni.navigateTo({
+        url: '/pages/class/index'
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.app_content{
+  // width: 100vw;
+  height: 100vh;
+  background-color: #f0f2f6;
+  padding-top: 1px;
+  padding-bottom: 120upx;
+  .course_list{
+    margin-top: 20upx;
+    // background-color: pink;
+    height: 100%;
+    padding-bottom: 100upx;
+    .list_item{
+      background-color: #fff;
+      margin: 0 20upx 20upx;
+      padding-bottom: 30upx;
+      &:last-child{
+        margin-bottom: 130upx;
+      }
+      &>image{
+        height: 440upx;
+        width: 100%;
+      }
+      &>.class_name{
+        padding-left: 20upx;
+        font-size: 38px;
+        font-weight: 600;
+        color: #333333;
+        margin: 20upx 0;
+      }
+      &>.class_introduce{
+        margin-left: 20upx;
+        font-size: 24px;
+        color: #999999;
+        margin-bottom: 20upx;
+        overflow: hidden;/*超出部分隐藏*/
+        white-space: nowrap;/*不换行*/
+        text-overflow:ellipsis;/*超出部分文字以...显示*/
+      }
+      &>.class_price{
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        &>text{
+          margin-left: 20upx;
+          font-size: 28px;
+          font-weight: bold;
+          color: #FF2842;
+        }
+        &>.class_apply{
+          margin-left: 20upx;
+          &>text{
+            font-size: 24px;
+            color: #666666;
+          }
+          &>.apply_btn{
+            width: 140upx;
+            display: inline-block;
+            height: 50upx;
+            line-height: 50upx;
+            background: linear-gradient(0deg, #FD6161, #FF3C59);
+            border-radius: 25px;
+            text-align: center;
+            color: #fff;
+            font-size: 26upx;
+            margin: 0 20upx;
+          }
+        }
+      }
+    }
+  }
+}
+</style>

mallApp/src/pages/home/shop.vue

@@ -66,7 +66,7 @@
       :introUserId="option.introUserId"
     />
     <tab-bar
-      :current="2"
+      :current="3"
       @click="tabClick"
     ></tab-bar>
   </div>
@@ -99,7 +99,7 @@ export default {
       // 新人领券
       newUserGift: {},
       activeCoupon: false,
-      currentTabIndex: 2
+      currentTabIndex: 3
     };
   },
   onLoad (option) {

mallApp/src/pages/home/user.vue

@@ -144,7 +144,7 @@
     <app-trademark />
     <go-login :show.sync="loginShow" />
     <tab-bar
-      :current="3"
+      :current="4"
       @click="tabClick"
     ></tab-bar>
   </div>
@@ -182,7 +182,7 @@ export default {
       merchantInfo: {},
       mobile: "",
       subscribe: 0,
-      currentTabIndex: 3
+      currentTabIndex: 4
     };
   },
   watch: {