优化：优惠券页面顶部安全区距离优化

env/.env.development

@@ -8,6 +8,7 @@ VITE_SHOW_SOURCEMAP = false
 # 后台请求地址
 VITE_SERVER_BASEURL = 'http://192.168.1.28:8082/jeecg-boot'
 # VITE_SERVER_BASEURL = 'http://192.168.1.232:8082/jeecg-boot'
+# VITE_SERVER_BASEURL = 'https://life.baoxianzhanggui.com/locallive-pro-java'
 
 
 # 静态资源请求地址

src/components/discountCoupon.vue

@@ -1,6 +1,7 @@
 <script lang="ts" setup>
 import { computed, ref } from 'vue'
 import ShortLinkModal from '@/components/ShortLinkModal.vue'
+import { getLastPartAfterSlash } from '@/utils/couponClassFormat'
 import { getImageUrl } from '@/utils/imageUtil'
 import { useCouponShare } from '../hooks/useCouponShare'
 
@@ -28,6 +29,10 @@ const deadline = computed(() => {
     }
     return '长期有效'
 })
+const category = computed(() => {
+    const relatedName = getLastPartAfterSlash(coupon.value.relatedName)
+    return `限${relatedName}商品使用`
+})
 
 // 分享弹窗相关 - 使用v-model控制弹窗显示
 const showShareModal = ref(false)
@@ -79,7 +84,7 @@ function handleCloseShareModal() {
                     满{{ coupon.ruleMinSpendAmount }}元可用
                 </view>
                 <view class="discount-desc-type">
-                    限{{ coupon.relatedName }}商品使用
+                    {{ category }}
                 </view>
             </view>
         </view>

src/components/spendAndSaveCoupon_large.vue

@@ -1,6 +1,7 @@
 <script lang="ts" setup>
 import { computed, ref } from 'vue'
 import ShortLinkModal from '@/components/ShortLinkModal.vue'
+import { getLastPartAfterSlash } from '@/utils/couponClassFormat'
 import { getImageUrl } from '@/utils/imageUtil'
 import { useCouponShare } from '../hooks/useCouponShare'
 
@@ -28,11 +29,13 @@ const deadline = computed(() => {
 
 const category = computed(() => {
     const relatedType = props.coupon.relatedType
+    const relatedName = getLastPartAfterSlash(props.coupon.relatedName)
+    console.log(props.coupon.relatedName, relatedName)
     if (relatedType === '1') {
-        return `限${props.coupon.relatedName}分类商品使用`
+        return `限${relatedName}分类商品使用`
     }
     else {
-        return `限${props.coupon.relatedName}商品使用`
+        return `限${relatedName}商品使用`
     }
 })
 // 分享弹窗相关 - 使用v-model控制弹窗显示
@@ -185,10 +188,10 @@ function handleCloseShareModal() {
             width: 68%;
             display: flex;
             flex-direction: column;
+            justify-content: space-evenly;
             padding-left: 18rpx;
 
             .coupon-info-category {
-                padding-top: 33rpx;
                 font-weight: 400;
                 font-size: 32rpx;
                 color: #333333;

src/http/alova.ts

@@ -65,7 +65,6 @@ const alovaInstance = createAlova({
         console.log('method===>', method)
         const { config } = method
         const ignoreAuth = !config.meta?.ignoreAuth
-        console.log('ignoreAuth===>', ignoreAuth)
         // 处理认证信息   自行处理认证问题
         if (ignoreAuth) {
             const tokenStore = useTokenStore()

src/pages-A/couponRedemptionList/index.vue

@@ -88,6 +88,7 @@ function datePickerConfirm() {
 
 <template>
     <view class="page-container">
+        <view class="safe-top" :style="{ height: `${topSafeAreaHeight}px` }" />
         <up-navbar title="优惠券" :auto-back="true" />
         <up-status-bar />
         <view class="redemption-type" :style="{ paddingTop: `${topSafeAreaHeight}px` }">

src/pages-A/discountcouponList/index.vue

@@ -80,6 +80,7 @@ onShareAppMessage(async (options) => {
 
 <template>
     <view class="page-container">
+        <view class="safe-top" :style="{ height: `${topSafeAreaHeight}px` }" />
         <up-navbar title="折扣券" :auto-back="true" />
         <up-status-bar />
         <scroll-view :style="{ paddingTop: `${topSafeAreaHeight}px` }" class="discount-coupon-list" scroll-y

src/pages-A/spendAndSaveCouponList/index.vue

@@ -79,6 +79,7 @@ onLoad((options) => {
 
 <template>
     <view class="page-container">
+        <view class="safe-top" :style="{ height: `${topSafeAreaHeight}px` }" />
         <up-navbar title="满减券" :auto-back="true" />
         <up-status-bar />
         <scroll-view :style="{ paddingTop: `${topSafeAreaHeight}px` }" class="discount-coupon-list" scroll-y

src/utils/couponClassFormat.ts

@@ -0,0 +1,9 @@
+export function getLastPartAfterSlash(str: string) {
+    // 先移除末尾的斜杠
+    const trimmedStr = str.replace(/\/$/, '')
+    const lastSlashIndex = trimmedStr.lastIndexOf('/')
+    if (lastSlashIndex === -1) {
+        return str
+    }
+    return trimmedStr.substring(lastSlashIndex + 1)
+}

src/utils/index.ts

@@ -84,20 +84,20 @@ export function getAllPages(key?: string) {
         }))
 
     // 这里处理分包
-    const subPages: PageMetaDatum[] = []
-        ; (subPackages as SubPackages).forEach((subPageObj) => {
-            // console.log(subPageObj)
-            const { root } = subPageObj
-
-            subPageObj.pages
-                .filter(page => !key || page[key])
-                .forEach((page) => {
-                    subPages.push({
-                        ...page,
-                        path: `/${root}/${page.path}`,
-                    })
+    const subPages: PageMetaDatum[] = [];
+    (subPackages as SubPackages).forEach((subPageObj) => {
+        // console.log(subPageObj)
+        const { root } = subPageObj
+
+        subPageObj.pages
+            .filter(page => !key || page[key])
+            .forEach((page) => {
+                subPages.push({
+                    ...page,
+                    path: `/${root}/${page.path}`,
                 })
-        })
+            })
+    })
     const result = [...mainPages, ...subPages]
     // console.log(`getAllPages by ${key} result: `, result)
     return result