优惠券

src/pages.json

@@ -92,6 +92,13 @@
 				"navigationBarTitleText": "申请退款"
 			}
 		}
+		,
+		{
+			"path": "pages/index/coupon",
+			"style": {
+				"navigationBarTitleText": "优惠券详情"
+			}
+		}
 	],
 	"globalStyle": {
 		"navigationStyle": "custom"

src/pages/index/coupon.vue

+<template>
+  <view class="container">
+    <scroll-view class="tabs" scroll-x="true" @scroll="scroll">
+      <text class="tab" v-for="(item, index) in tabs" :key="index">{{ item }}</text>
+    </scroll-view>
+    <view class="itemBox">
+      <view class="item"></view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+import {} from 'vue';
+const tabs = ref(['推荐', '附近美食', '果蔬生鲜', '数码商城', '小吃快餐', '数码商城', '餐饮券']);
+</script>
+
+<style lang="scss" scoped>
+page {
+  background: #f3f3f3;
+}
+.container {
+  .tabs {
+    white-space: nowrap;
+    padding: 0 30rpx;
+    box-sizing: border-box;
+    height: 100rpx;
+    line-height: 100rpx;
+    font-size: 32rpx;
+    color: #333333;
+    font-weight: bold;
+    background: white;
+    .tab {
+      display: inline-block;
+      margin-right: 40rpx;
+    }
+  }
+  .itemBox {
+    padding: 0 23rpx;
+    border-radius: 16rpx 16rpx 16rpx 16rpx;
+    margin-top: 20rpx;
+    .item {
+      width: 341rpx;
+      height: 674rpx;
+      background: #ffffff;
+    }
+  }
+}
+</style>

src/pages/index/index.vue

@@ -44,7 +44,12 @@
           <view v-else class="textF" @tap="toUse">去使用</view>
         </view>
       </scroll-view>
-      <image class="discount" src="../../static/index/discount.png" mode="widthFix" />
+      <image
+        @tap="toCoupon"
+        class="discount"
+        src="../../static/index/discount.png"
+        mode="widthFix"
+      />
     </view>
     <!-- 贵阳老味道 -->
     <!-- <view class="guiyang"></view> -->
@@ -223,6 +228,12 @@ const receive = (data) => {
     });
   }
 };
+// TO优惠券详情
+const toCoupon = () => {
+  xma.navigateTo({
+    url: '/pages/index/coupon',
+  });
+};
 // 获取分类
 const getClassification = () => {
   groupBuyList().then((res) => {