红包逻辑需要重构

2026-01-16 17:57:43 +08:00
parent 5f9629f198
commit f0aee6ba14
16 changed files with 335 additions and 45 deletions
--- a/pages/discover/punch.vue
+++ b/pages/discover/punch.vue
@@ -200,7 +200,9 @@
    <view class="public-header—box">
      <view class="integral-box">
        <text>我的积分</text>
-        <text>{{ formatNumberWithWan(userInfo.totalPoints) }}</text>
+        <text style="font-size: 80rpx; margin-top: 30rpx;">
+          {{ formatNumberWithWan(userInfo.totalPoints) }}
+        </text>
      </view>
      <image
        src="/static/images/discover/calendar.png"
--- a/pages/mall/comment.vue
+++ b/pages/mall/comment.vue
@@ -17,6 +17,7 @@
  const productId = ref('')
  const listData = ref([])
  const paging = ref(null)
+  const total = ref(0)

  const onTop = id => {
    formData.type = id
@@ -24,23 +25,31 @@

  const getList = async (pageNum, pageSize) => {
    try {
+      console.log(listData.value.length, '====')
      const res = await getProductCommentList({
        productId: productId.value,
        pageNum,
        pageSize
      })
+      total.value = res.total
      paging.value.complete(res.rows)
    } catch (err) {
      paging.value.complete(false)
    }
  }

+  const onImage = img => {
+    uni.previewImage({
+      urls: [img]
+    })
+  }
+
  onLoad(e => {
    productId.value = e.productId
  })

  onShow(() => {
-    getList()
+    getList(1, 15)
  })
 </script>

@@ -51,6 +60,7 @@
    :default-page-size="15"
    safe-area-inset-bottom
    use-safe-area-placeholder
+    :show-loading-more-no-more-view="total !== listData.length"
    :auto="false"
    @query="getList"
  >
@@ -69,7 +79,19 @@

      <!-- 卡片位置 -->
      <view v-for="item in listData" :key="item.id" class="card-box">
+        <uni-icons
+          v-if="item.isAnonymous"
+          type="contact-filled"
+          size="90rpx"
+          class="avatar"
+          style="
+            display: flex;
+            justify-content: center;
+            align-items: center;
+          "
+        ></uni-icons>
        <image
+          v-else
          :src="item.avatar || '/static/images/public/random1.png'"
          mode="scaleToFill"
          class="avatar"
@@ -77,7 +99,9 @@
        <!-- 右边 -->
        <view class="right-box">
          <view class="name_box">
-            <text class="name">{{ item.userName }}</text>
+            <text class="name">
+              {{ item.isAnonymous ? '匿名用户' : item.userName }}
+            </text>
            <uni-rate readonly :size="24" :value="item.rating" />
          </view>
          <view class="rate-box">
@@ -104,15 +128,16 @@
          <text class="content">
            {{ item.content }}
          </text>
-          <!-- <view class="img-box">
-          <image
-            v-for="item in 5"
-            src="/static/images/public/random1.png"
-            mode="scaleToFill"
-            class="bottom-img"
-          ></image>
-        </view>
-        <view class="bottom-content">
+          <view v-if="item.imageUrls" class="img-box">
+            <image
+              :src="item.imageUrls"
+              lazy-load
+              mode="scaleToFill"
+              class="bottom-img"
+              @click="onImage(item.imageUrls)"
+            ></image>
+          </view>
+          <!-- <view class="bottom-content">
          <view class="name-box">
            <text>名字：</text>
            <text>内容</text>
@@ -128,7 +153,7 @@
        <cb-button
          @click="navigateTo('/pages/mall/add-comment', { productId })"
        >
-          确认添加
+          添加评论
        </cb-button>
      </bottom-view>
    </template>
@@ -139,7 +164,7 @@
  // @import './styles/public.scss';
  @import '@/styles/top-selector.scss';
  .comment-box {
-    padding: 32rpx 24rpx;
+    padding: 32rpx 24rpx 180rpx 24rpx;
    .card-box {
      margin-top: 36rpx;
      display: flex;
--- a/pages/mall/confirm-order.vue
+++ b/pages/mall/confirm-order.vue
@@ -119,6 +119,8 @@
      quantity: formData.num,
      skuId: formData.spec
    }
+    console.log(data, '===data===')
+    return

    tixian.value.close()
    const res = await addOrder(data)
--- a/pages/mall/detail.vue
+++ b/pages/mall/detail.vue
@@ -1,5 +1,5 @@
 <script setup>
-  import { onLoad } from '@dcloudio/uni-app'
+  import { onLoad, onShow } from '@dcloudio/uni-app'
  import { getProductDetail, getProductCommentList } from '@/api/mall'
  import { ref, computed } from 'vue'
  import { navigateTo } from '@/utils/router'
@@ -17,11 +17,14 @@

  /** 评论数量获取 */
  const getComment = async productId => {
-    const res = await getProductCommentList({
-      productId,
-      pageNum: 1,
-      pageSize: 1
-    })
+    const res = await getProductCommentList(
+      {
+        productId,
+        pageNum: 1,
+        pageSize: 1
+      },
+      false
+    )
    commentNum.value = res.total
  }

@@ -50,7 +53,9 @@
    productId.value = e.productId
    groupId.value = e?.groupId || ''
    await getData(e.productId)
-    await getComment(e.productId)
+  })
+  onShow(() => {
+    getComment(productId.value)
  })
 </script>

@@ -64,13 +69,13 @@
          class="left-icon"
        ></image>
      </template>
-      <template #right>
+      <!-- <template #right>
        <image
          src="/static/images/public/share-icon.png"
          mode="heightFix"
          class="right-icon"
        ></image>
-      </template>
+      </template> -->
    </nav-bar>
    <!-- 顶部图片 -->
    <view class="top-img">
--- a/pages/red-packet/details.vue
+++ b/pages/red-packet/details.vue
@@ -0,0 +1,171 @@
+<script setup>
+  // pages/red-packet/details   红包详情
+  import { onLoad } from '@dcloudio/uni-app'
+  import { getRedEnvelopeDetail } from '../../api/tui-kit'
+  import { ref, computed } from 'vue'
+  import { useAuthUser } from '../../composables/useAuthUser'
+
+  const { userInfo } = useAuthUser()
+
+  const viewData = ref({})
+  const conversationType = ref('')
+  const loading = ref(true)
+
+  /** 是否个人红包详情 */
+  const isPersonal = computed(() => conversationType.value === 'C2C')
+  const getData = async id => {
+    loading.value = true
+    const res = await getRedEnvelopeDetail(id)
+    viewData.value = res.data
+    loading.value = false
+  }
+
+  onLoad(e => {
+    conversationType.value = e.type
+    getData(e.id)
+  })
+</script>
+
+<template>
+  <view>
+    <nav-bar>
+      <template #back>
+        <uni-icons type="back" size="42rpx" color="#ffffff"></uni-icons>
+      </template>
+    </nav-bar>
+    <!-- 顶部半圆样式 -->
+    <view class="top-half-circle"></view>
+    <view v-if="loading" style="margin-top: 40rpx">
+      <uni-load-more status="loading"></uni-load-more>
+    </view>
+    <view v-else>
+      <!-- 发红包人 -->
+      <view class="red-envelope-person">
+        <view class="name-box">
+          <image
+            v-if="userInfo?.avatar"
+            :src="userInfo?.avatar"
+            mode="aspectFill"
+            class="avatar"
+          ></image>
+          <uni-icons
+            v-else
+            type="contact-filled"
+            size="54rpx"
+          ></uni-icons>
+          <text>{{ userInfo?.userName }}发出的的红包</text>
+        </view>
+        <text class="tips">{{ viewData?.title }}</text>
+      </view>
+
+      <!-- 红包信息 -->
+      <view class="red-envelope-info">
+        <text v-if="isPersonal">
+          {{
+            viewData.hasReceived
+              ? `${viewData.remainCount}个红包${viewData.remainAmount}积分`
+              : `红包${viewData.remainAmount}积分，等待对方领取`
+          }}
+        </text>
+        <text v-else>1个红包共5.00元</text>
+      </view>
+
+      <!-- 领取人卡片信息 -->
+      <view
+        v-if="isPersonal && viewData.hasReceived"
+        class="red-envelope-card"
+      >
+        <view class="avatar"></view>
+        <view class="right-box">
+          <view class="top-name">
+            <text>用户名称</text>
+            <text>5积分</text>
+          </view>
+          <text class="date">用户名称</text>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<style lang="scss" scoped>
+  .top-half-circle {
+    width: 100%;
+    height: 200rpx;
+    // 使用 border-radius 创建半圆效果
+    border-radius: 0 0 50% 50%;
+    background: #f05f55;
+  }
+
+  .red-envelope-card {
+    padding: 20rpx 32rpx;
+    border-bottom: 2rpx solid #f1f1f1;
+    display: flex;
+    .avatar {
+      flex-shrink: 0;
+      width: 80rpx;
+      height: 80rpx;
+      border-radius: 16rpx;
+      background: rgb(197, 139, 139);
+      margin-right: 16rpx;
+    }
+    .right-box {
+      width: 100%;
+      height: 80rpx;
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+      .top-name {
+        display: flex;
+        justify-content: space-between;
+        text {
+          font-size: 28rpx;
+          color: #333333;
+        }
+      }
+      .date {
+        font-size: 28rpx;
+        color: #a1a1a1;
+      }
+    }
+  }
+
+  .red-envelope-info {
+    margin-top: 60rpx;
+    padding: 20rpx 32rpx;
+    border-bottom: 2rpx solid #f1f1f1;
+    text {
+      font-size: 28rpx;
+      color: #a1a1a1;
+    }
+  }
+
+  .red-envelope-person {
+    margin-top: 38rpx;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    .name-box {
+      display: flex;
+      align-items: center;
+      .avatar {
+        width: 40rpx;
+        height: 40rpx;
+        border-radius: 10rpx;
+        background: rgb(190, 133, 133);
+        margin-right: 6rpx;
+        text {
+          line-height: 1;
+          font-size: 34rpx;
+          font-weight: 600;
+          color: #333333;
+        }
+      }
+    }
+    .tips {
+      margin-top: 10rpx;
+      font-size: 28rpx;
+      color: #a1a1a1;
+    }
+  }
+</style>