diff --git a/src/pages.json b/src/pages.json
index 0b9af70..ab4820d 100644
--- a/src/pages.json
+++ b/src/pages.json
@@ -79,6 +79,12 @@
           "style": {
             "navigationBarTitleText": "确认订单"
           }
+        },
+        {
+          "path": "shoppingcart/index",
+          "style": {
+            "navigationBarTitleText": "购物车"
+          }
         }
       ]
     },
@@ -91,6 +97,12 @@
             "navigationBarTitleText": "会员信息"
           }
         },
+        {
+          "path": "integral/index",
+          "style": {
+            "navigationBarTitleText": "我的积分"
+          }
+        },
         {
           "path": "recharge/index",
           "style": {
diff --git a/src/pages/common/groupbuy/index.vue b/src/pages/common/groupbuy/index.vue
new file mode 100644
index 0000000..f45039f
--- /dev/null
+++ b/src/pages/common/groupbuy/index.vue
@@ -0,0 +1,11 @@
+<template>
+
+</template>
+
+<script lang='ts' setup>
+
+</script>
+
+<style lang='scss' scoped>
+
+</style>
diff --git a/src/pages/home/index.vue b/src/pages/home/index.vue
index bb90f83..b2731b6 100644
--- a/src/pages/home/index.vue
+++ b/src/pages/home/index.vue
@@ -17,12 +17,12 @@
       <view class='user-info-card'>
         <image class='user-avatar' :src='userInfo.image' mode='aspectFill' />
         <text class='user-name primary-text-color'>{{ userInfo?.nickName }}</text>
-        <view class='integral-view primary-text-color'>
+        <view class='integral-view primary-text-color' @click.stop='goPath("/pages/mine/subs/integral/index")'>
           <text>{{ userInfo?.integration }}</text>
           <text>积分</text>
         </view>
         <view class='divider' style='height: 83rpx' />
-        <view class='balance-view'>
+        <view class='balance-view' @click.stop='goPath("/pages/mine/subs/recharge/index")'>
           <text class='accent-text-color'>{{ userInfo?.balance }}</text>
           <text>余额（元）</text>
         </view>
diff --git a/src/pages/mall/index.vue b/src/pages/mall/index.vue
index 3af04dd..901ebda 100644
--- a/src/pages/mall/index.vue
+++ b/src/pages/mall/index.vue
@@ -29,7 +29,7 @@
       </scroll-view>
     </view>
 
-    <view class='shopping-cart'>
+    <view class='shopping-cart' @click.stop='goPath("/pages/mall/subs/shoppingcart/index")'>
       <image :src='assetsUrl("ic_shopping_cart.png")' />
       <text>10</text>
     </view>
diff --git a/src/pages/mall/subs/components/coupon-dialog.vue b/src/pages/mall/subs/components/coupon-dialog.vue
new file mode 100644
index 0000000..09fbecd
--- /dev/null
+++ b/src/pages/mall/subs/components/coupon-dialog.vue
@@ -0,0 +1,120 @@
+<template>
+  <uni-popup type='bottom' ref='popupRef' :mask-click='false'>
+    <view class='popup-content c-flex-column'>
+      <view class='c-flex-row'>
+        <text>优惠券</text>
+        <text @click.stop='close'>确定</text>
+      </view>
+
+      <scroll-view>
+        <coupon-item v-for='item in coupons' :item='item' />
+      </scroll-view>
+    </view>
+  </uni-popup>
+</template>
+
+<script lang='ts' setup>
+import CouponItem from '../components/coupon-item.vue';
+
+const popupRef = ref();
+const coupons = [{
+  id: 1,
+  title: '优惠券',
+  desc: '满100减10',
+  price: 100,
+  threshold: 10,
+  priceDesc: '满100减10',
+  useTime: '2021-12-31',
+  status: 1,
+  useStatus: '未使用'
+}, {
+  id: 1,
+  title: '优惠券',
+  desc: '满100减10',
+  price: 200,
+  threshold: 80,
+  priceDesc: '满100减10',
+  useTime: '2021-01-01',
+  status: 1,
+  useStatus: '未使用'
+}, {
+  id: 1,
+  title: '优惠券',
+  desc: '满100减10',
+  price: 300,
+  threshold: 60,
+  priceDesc: '满100减10',
+  useTime: '2023-12-31',
+  status: '0',
+  useStatus: '未使用'
+}, {
+  id: 1,
+  title: '优惠券',
+  desc: '满100减10',
+  price: 50,
+  threshold: 50,
+  priceDesc: '满100减10',
+  useTime: '2021-10-31',
+  status: 0,
+  useStatus: '未使用'
+}, {
+  id: 1,
+  title: '优惠券',
+  desc: '满1000减30',
+  price: 200,
+  threshold: 30,
+  priceDesc: '满100减10',
+  useTime: '2024-12-31',
+  status: 0,
+  useStatus: '未使用'
+}];
+
+const show = () => {
+  popupRef.value.open();
+};
+
+const close = () => {
+  popupRef.value.close();
+};
+
+defineExpose({
+  show
+});
+</script>
+
+<style lang='scss' scoped>
+.popup-content {
+  background: #FFFFFF;
+  border-radius: 20rpx 20rpx 0 0;
+  padding: 38rpx 45rpx 0 45rpx;
+
+  view:nth-of-type(1) {
+    display: flex;
+    margin-bottom: 70rpx;
+    position: relative;
+
+    text:nth-of-type(1) {
+      font-weight: bold;
+      font-size: 30rpx;
+      color: #333333;
+      position: absolute;
+      left: 0;
+      right: 0;
+      text-align: center;
+    }
+
+    text:nth-of-type(2) {
+      font-weight: bold;
+      font-size: 30rpx;
+      color: #F32B2B;
+      position: absolute;
+      right: 0;
+    }
+  }
+
+  scroll-view {
+    max-height: 600rpx;
+  }
+
+}
+</style>
diff --git a/src/pages/mall/subs/components/coupon-item.vue b/src/pages/mall/subs/components/coupon-item.vue
new file mode 100644
index 0000000..7b13d98
--- /dev/null
+++ b/src/pages/mall/subs/components/coupon-item.vue
@@ -0,0 +1,111 @@
+<template>
+  <view class='coupon-content'>
+    <image v-if='item.status==0' :src='assetsUrl("bg_coupon.png")' />
+    <image v-else-if='item.status==1' :src='assetsUrl("bg_coupon_expired.png")' />
+    <view class='left-content accent-text-color' :class='{"left-content-disabled": item.status==1}'>
+      <text>{{ item.price }}</text>
+      <text>满{{ item.threshold }}元可用</text>
+    </view>
+
+    <view class='right-content accent-text-color' :class='{"right-content-disabled": item.status==1}'>
+      <text>{{ item?.title }}</text>
+      <text>有效期至{{ item.useTime }}</text>
+      <image class='checkbox' :src='assetsUrl("ic_checkbox_active.png")' />
+    </view>
+  </view>
+
+</template>
+
+<script lang='ts' setup>
+
+import { assetsUrl } from '@/utils/assets';
+
+defineProps({
+  item: Object
+});
+</script>
+
+<style lang='scss' scoped>
+.coupon-content {
+  display: flex;
+  flex-direction: row;
+  height: 200rpx;
+  position: relative;
+  margin: 10rpx 0 10rpx 0;
+
+  image {
+    width: 100%;
+    height: 100%;
+    position: absolute;
+  }
+
+  .left-content {
+    display: flex;
+    flex-direction: column;
+    position: relative;
+    align-items: center;
+    justify-content: center;
+    padding-left: 50rpx;
+
+    text:nth-of-type(1) {
+      font-size: 55rpx;
+      font-weight: bold;
+    }
+
+    text:nth-of-type(1):after {
+      content: '元';
+      font-size: 24rpx;
+    }
+
+    text:nth-of-type(2) {
+      font-size: 26rpx;
+      font-weight: 400;
+    }
+  }
+
+  .left-content-disabled {
+    @extend .left-content;
+    color: #C2C2C2;
+  }
+
+  .right-content {
+    display: flex;
+    flex-direction: column;
+    position: relative;
+    flex: 1;
+    justify-content: center;
+    margin-left: 100rpx;
+
+    text:nth-of-type(1) {
+      font-size: 30rpx;
+    }
+
+    text:nth-of-type(2) {
+      font-size: 26rpx;
+      margin-top: 20rpx;
+      color: #333333;
+    }
+
+    .checkbox {
+      display: flex;
+      width: 42rpx;
+      height: 42rpx;
+      align-items: center;
+      justify-content: center;
+      font-weight: bold;
+      position: absolute;
+      right: 36rpx;
+    }
+  }
+
+  .right-content-disabled {
+    @extend .right-content;
+    color: #C2C2C2;
+
+    text:nth-of-type(2) {
+      color: #C2C2C2;
+    }
+  }
+}
+
+</style>
diff --git a/src/pages/mall/subs/goods/goods-detail.vue b/src/pages/mall/subs/goods/goods-detail.vue
index 7c22bcd..c5ed4e0 100644
--- a/src/pages/mall/subs/goods/goods-detail.vue
+++ b/src/pages/mall/subs/goods/goods-detail.vue
@@ -63,7 +63,7 @@
         </view>
 
         <view class='small-button-item'>
-          <view class='shoppingcart-count'>
+          <view class='shoppingcart-count' @click.stop='goPath("/pages/mall/subs/shoppingcart/index")'>
             <image :src='assetsUrl("ic_goods_shoppingcart.png")' />
             <text>12</text>
           </view>
@@ -78,7 +78,6 @@
     </view>
   </view>
   <sku-dialog ref='skuDialogRef' />
-
 </template>
 
 <script lang='ts' setup>
diff --git a/src/pages/mall/subs/order/order-confirm.vue b/src/pages/mall/subs/order/order-confirm.vue
index 685f3f2..f47cf75 100644
--- a/src/pages/mall/subs/order/order-confirm.vue
+++ b/src/pages/mall/subs/order/order-confirm.vue
@@ -62,7 +62,7 @@
         <text class='card-view-title'>运费</text>
         <text class='card-view-value'>￥8</text>
       </view>
-      <view class='c-flex-row'>
+      <view class='c-flex-row' @click.stop='showCouponDialog'>
         <text class='card-view-title'>优惠券
           <text style='font-size: 22rpx;color: #F32B2B;'>已选最大优惠</text>
         </text>
@@ -95,12 +95,15 @@
     </view>
   </view>
   <payment-dialog ref='paymentDialogRef' @change='args => paymentType=args' />
+  <coupon-dialog ref='couponDialogRef' />
 </template>
 
 <script lang='ts' setup>
 import { assetsUrl } from '@/utils/assets';
 import PaymentDialog from '../components/payment-dialog.vue';
+import CouponDialog from '@/pages/mall/subs/components/coupon-dialog.vue';
 
+const couponDialogRef = ref();
 const paymentDialogRef = ref();
 const paymentType = ref(0);
 const tabIndex = ref(0);
@@ -110,6 +113,10 @@ const changePayment = () => {
   paymentDialogRef.value.show();
 };
 
+const showCouponDialog = () => {
+  couponDialogRef.value.show();
+};
+
 const payment = () => {
 
 };
diff --git a/src/pages/mall/subs/shoppingcart/index.vue b/src/pages/mall/subs/shoppingcart/index.vue
new file mode 100644
index 0000000..6a3cdeb
--- /dev/null
+++ b/src/pages/mall/subs/shoppingcart/index.vue
@@ -0,0 +1,237 @@
+<template>
+  <view class='content'>
+    <view class='c-flex-row'>
+      <text class='manage' @click.stop='isEditMode = !isEditMode'>管理</text>
+    </view>
+
+    <view class='card-view'>
+      <scroll-view>
+        <view class='c-flex-column' v-for='(item, index) in [1,2,3,5]' :key='index'>
+          <view class='c-flex-row'>
+            <image v-show='isEditMode' class='checkbox' :src='assetsUrl("ic_checkbox_active_red.png")' />
+            <image class='goods-image' :src='assetsUrl("test_bg.png")' />
+            <view class='c-flex-column'>
+              <text>女童夏装套装洋气装短袖阔腿裤子夏装夏装套装
+              </text>
+              <view class='sku-view'>
+                <text>紫色，120cm x1</text>
+                <image :src='assetsUrl("ic_arrow_down_gray.png")' />
+              </view>
+              <text>￥29.90</text>
+              <view class='count-change-view c-flex-row'>
+                <view class='count-image' @click.stop='countChange(false)'>
+                  <image :src='assetsUrl("ic_reduce.png")' />
+                </view>
+                <text>{{ goodsCount }}</text>
+                <view class='count-image' @click.stop='countChange(true)'>
+                  <image :src='assetsUrl("ic_plus.png")' />
+                </view>
+              </view>
+            </view>
+          </view>
+        </view>
+      </scroll-view>
+    </view>
+
+    <view class='bottom-view c-flex-row'>
+      <view class='c-flex-row' @click.stop='checkedAll = !checkedAll'>
+        <image :src='assetsUrl(checkedAll?"ic_checkbox_active.png":"ic_checkbox_normal.png")' />
+        <text>全选</text>
+      </view>
+      <view style='flex: 1' />
+      <text>合计：
+        <text>￥29.90</text>
+      </text>
+      <text class='settlement' @click.stop='settlement'>结算</text>
+    </view>
+  </view>
+</template>
+
+<script lang='ts' setup>
+
+import { assetsUrl } from '@/utils/assets';
+
+const isEditMode = ref(false);
+const checkedAll = ref(false);
+const goodsCount = ref(1);
+
+const countChange = (isPlus: Boolean) => {
+
+};
+
+const settlement = () => {
+
+};
+</script>
+
+<style lang='scss' scoped>
+.content {
+  position: relative;
+
+  .manage {
+    width: 100%;
+    font-weight: 400;
+    font-size: 30rpx;
+    color: #333333;
+    background: #FFFFFF;
+    align-self: flex-end;
+    padding: 20rpx 30rpx;
+    text-align: end;
+  }
+
+  .card-view {
+    margin: 30rpx;
+    border-radius: 10rpx;
+    background: #FFFFFF;
+    padding: 10rpx 20rpx 20rpx 17rpx;
+
+    .c-flex-column:nth-of-type(1) {
+      margin: 20rpx 0;
+    }
+
+    view:nth-of-type(1) {
+      .checkbox {
+        width: 35rpx;
+        height: 35rpx;
+        margin-right: 20rpx;
+      }
+
+      .goods-image {
+        width: 186rpx;
+        height: 186rpx;
+        border-radius: 10rpx;
+      }
+
+      .c-flex-column {
+        flex: 1;
+        height: 186rpx;
+        margin-left: 20rpx;
+        position: relative;
+
+        text:nth-of-type(1) {
+          font-weight: 400;
+          font-size: 28rpx;
+          color: #333333;
+          -webkit-line-clamp: 2;
+          text-overflow: ellipsis;
+        }
+
+        .sku-view {
+          display: flex;
+          flex-direction: row;
+          width: 210rpx;
+          position: relative;
+          background: #F2F2F2;
+          margin-top: 10rpx;
+          align-items: center;
+          border-radius: 22rpx;
+          padding: 5rpx 20rpx;
+
+          text {
+            font-weight: 400;
+            font-size: 24rpx;
+            color: #999999;
+          }
+
+          image {
+            width: 20rpx;
+            height: 20rpx;
+            margin-left: 13rpx;
+          }
+        }
+
+        text:nth-of-type(2) {
+          display: flex;
+          font-weight: bold;
+          font-size: 32rpx;
+          color: #333333;
+          margin-top: 20rpx;
+        }
+
+        .count-change-view {
+          position: absolute;
+          right: 0;
+          bottom: 0;
+
+          .count-image {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            width: 54rpx;
+            height: 54rpx;
+            background: #FBFBFB;
+
+            image {
+              width: 15rpx;
+              height: 2rpx;
+            }
+          }
+
+          .count-image:nth-of-type(2) image {
+            width: 17rpx;
+            height: 17rpx;
+          }
+
+          text {
+            display: flex;
+            width: 54rpx;
+            height: 54rpx;
+            align-items: center;
+            justify-content: center;
+            font-weight: 400;
+            font-size: 30rpx;
+            color: #333333;
+            background: #F2F2F2;
+          }
+        }
+      }
+    }
+  }
+
+  .bottom-view {
+    background: #FFFFFF;
+    position: fixed;
+    padding: 12rpx 30rpx 78rpx 30rpx;
+    bottom: 0;
+    left: 0;
+    right: 0;
+
+    image {
+      width: 35rpx;
+      height: 35rpx;
+    }
+
+    .c-flex-row:nth-of-type(1) {
+      text {
+        margin-left: 10rpx;
+        font-size: 28rpx;
+        color: #333333;
+      }
+    }
+
+    text:nth-of-type(1) {
+      font-size: 30rpx;
+      color: #333333;
+
+      text {
+        font-weight: bold;
+        font-size: 36rpx;
+        color: #F32B2B;
+      }
+    }
+
+    .settlement {
+      display: flex;
+      background: #F32B2B;
+      border-radius: 43rpx;
+      padding: 17rpx 75rpx;
+      font-weight: bold;
+      font-size: 30rpx;
+      color: #FFFFFF;
+      margin-left: 37rpx;
+      align-items: center;
+      justify-content: center;
+    }
+  }
+}
+</style>
diff --git a/src/pages/mine/index.vue b/src/pages/mine/index.vue
index 062aa7a..6ebfe47 100644
--- a/src/pages/mine/index.vue
+++ b/src/pages/mine/index.vue
@@ -18,7 +18,7 @@
       </view>
 
       <view class='bottom-row'>
-        <view>
+        <view @click.stop='goPath("/pages/mine/subs/integral/index")'>
           <text>{{ userInfo.integration }}</text>
           <text>积分</text>
         </view>
diff --git a/src/pages/mine/subs/integral/components/integral-item.vue b/src/pages/mine/subs/integral/components/integral-item.vue
new file mode 100644
index 0000000..9e71565
--- /dev/null
+++ b/src/pages/mine/subs/integral/components/integral-item.vue
@@ -0,0 +1,45 @@
+<template>
+  <view class='card-view'>
+    <text class='category-title'>2023-02-12</text>
+    <view class='item c-flex-column' v-for='(item,index) in 3' :key='index'>
+      <view class='c-flex-row'>
+        <text class='primary-text-color' style='flex: 1'>消费</text>
+        <text class='accent-text-color'>-30</text>
+      </view>
+      <view class='c-flex-row'>
+        <text class='secondary-text-color' style='flex: 1'>2023-06-27 15:02:11</text>
+        <text style='color: #999999'>会员积分：￥30.00</text>
+      </view>
+      <view class='divider' style='margin-top: 20rpx'/>
+    </view>
+  </view>
+</template>
+
+<script lang='ts' setup>
+defineProps({
+  item: Object
+});
+</script>
+
+<style lang='scss' scoped>
+.card-view {
+  display: flex;
+  flex-direction: column;
+  padding: 16rpx 23rpx 20rpx 30rpx;
+  margin: 20rpx 0;
+}
+
+.category-title {
+  font-size: 34rpx;
+  font-weight: bold;
+  color: #333333;
+}
+
+.item {
+  margin: 10rpx 0;
+
+  view:nth-of-type(2) {
+    margin-top: 10rpx;
+  }
+}
+</style>
diff --git a/src/pages/mine/subs/integral/index.vue b/src/pages/mine/subs/integral/index.vue
new file mode 100644
index 0000000..15ceaa1
--- /dev/null
+++ b/src/pages/mine/subs/integral/index.vue
@@ -0,0 +1,53 @@
+<template>
+  <view class='content'>
+    <view class='top-view c-flex-column'>
+      <text>2520</text>
+      <text>会员积分</text>
+    </view>
+    <text class='integral-detail-title'>积分明细</text>
+    <scroll-view style='margin: 10rpx 20rpx'>
+      <integral-item v-for='(item,index) in tradeList' :key='index' :item='item' />
+    </scroll-view>
+  </view>
+</template>
+
+<script lang='ts' setup>
+import IntegralItem from '@/pages/mine/subs/integral/components/integral-item.vue';
+
+const tradeList = ref([1, 2, 3, 4, 5]);
+</script>
+
+<style lang='scss' scoped>
+
+.top-view {
+  height: 195rpx;
+  background: linear-gradient(#F32B2B, #F95D5D);
+  align-items: center;
+  justify-content: center;
+
+  text:nth-of-type(1) {
+    font-weight: 400;
+    font-size: 50rpx;
+    color: #FFFFFF;
+  }
+
+  text:nth-of-type(2) {
+    font-weight: 400;
+    font-size: 26rpx;
+    color: #FFFFFF;
+    margin-top: 10rpx;
+  }
+}
+
+.integral-detail-title {
+  margin: 20rpx 24rpx;
+  font-weight: bold;
+  font-size: 30rpx;
+  color: #333333;
+  position: relative;
+}
+
+scroll-view{
+  width: auto;
+}
+</style>
diff --git a/src/static/images/ic_arrow_down_gray.png b/src/static/images/ic_arrow_down_gray.png
new file mode 100644
index 0000000..ad104e5
Binary files /dev/null and b/src/static/images/ic_arrow_down_gray.png differ
diff --git a/src/static/images/ic_checkbox_active_red.png b/src/static/images/ic_checkbox_active_red.png
new file mode 100644
index 0000000..317aee6
Binary files /dev/null and b/src/static/images/ic_checkbox_active_red.png differ