修改

Merge pull request !1 from ISFP_T/now_prod

env/.env.development

@@ -4,7 +4,7 @@ NODE_ENV=development
 VITE_DELETE_CONSOLE=false
 
 #本地环境
-#VITE_SERVER_BASEURL=https://howhowfresh.com/prod-api
+VITE_SERVER_BASEURL=https://howhowfresh.com/prod-api
-VITE_SERVER_BASEURL=http://192.168.5.23:8080
+#VITE_SERVER_BASEURL=http://192.168.0.197:8889
-#VITE_SERVER_BASEURL=http://192.168.0.148:8888
+#VITE_SERVER_BASEURL=http://192.168.0.158:8888
 #VITE_SERVER_BASEURL=http://liuyao.nat100.top/meiguowaimai

src/App.vue

@@ -10,15 +10,12 @@ onLaunch(initConfig);
 
 onShow(() => {
   console.log('%c外卖用户端--用户端', 'background: #00A76D; color: white; padding: 3px; border-radius: 2px;');
-  console.log("App Show");
 });
 
 onHide(() => {
-  console.log("App Hide");
 });
 
 onError((error: string) => {
-  console.log('App Error', error)
 })
 
 
@@ -29,12 +26,9 @@ function initApp() {
     const color = plus.android.newObject("android.graphics.Color");
     const ac = plus.android.runtimeMainActivity();
     const c2int = plus.android.invoke(color, "parseColor", "#FFFFFF");
-    console.log("c2int===" + JSON.stringify(c2int))
     const win = plus.android.invoke(ac, "getWindow");
-    console.log("win===" + JSON.stringify(win))
     plus.android.invoke(win, "setNavigationBarColor", c2int);
   } catch (e) {
-    console.log('error', e)
   }
   // #endif
 }
@@ -87,12 +81,10 @@ function initConfig() {
   }
 
   if(!configStore.isShowedLanguageSelectPage) {
-    console.log('未展示过语言选择页面，导航到语言选择页面')
     uni.navigateTo({
       url: '/pages-login/pages/choose-language/index',
       success() {
         configStore.isShowedLanguageSelectPage = true
-        console.log('导航到语言选择页面成功')
       },
     })
   }

src/components/cc-comment/cc-comment.vue

@@ -236,8 +236,6 @@ let commentPlaceholder = ref("说点什么..."); // 输入框占位符
 
 // 发送评论
 function sendClick({ item1, index1, item2, index2 } = replyTemp) {
-  console.log('replyTemp', replyTemp.item1)
-  console.log('replyTemp', replyTemp.item2)
   const data = replyTemp.item2 || replyTemp.item1
   appCommentPublishCommentPost({
     body: {
@@ -248,7 +246,6 @@ function sendClick({ item1, index1, item2, index2 } = replyTemp) {
       content: commentValue.value,
     }
   }).then(res=> {
-    console.log(res)
     emit("update");
     cPopupShow.value = false;
     commentValue.value = ""; // 清空输入框值
@@ -263,7 +260,6 @@ function sendClick({ item1, index1, item2, index2 } = replyTemp) {
 
 function expandReply(item1) {
   // item1.childrenShow = item1.children
-  console.log(item1)
   appCommentReplyListPost({
     params: {
       pageNum: 1,
@@ -273,7 +269,6 @@ function expandReply(item1) {
       parentId: item1.id,
     }
   }).then(res=> {
-    console.log('回复列表', res)
     item1.children = res.rows.map(item => {
       let userInfo = {}
       // 普通用户
@@ -314,7 +309,6 @@ function shrinkReply(item1) {
 const delPopupRef = ref(null);
 let delTemp = reactive({}); // 临时数据
 function deleteClick({ item1, index1, item2, index2 }) {
-  console.log('删123除', item1, index1, item2, index2)
   message
       .confirm({
         title: t("common.prompt.system-prompt"),
@@ -336,7 +330,6 @@ function deleteClick({ item1, index1, item2, index2 }) {
             id: item2.id ? item2.id : item1.id,
           }
         }).then(res=> {
-          console.log('删除成功', res)
           emit("deleteFun");
           shrinkReply(item1)
         })

src/components/choose-image/choose-image.vue

@@ -1,6 +1,5 @@
 <script lang="ts" setup>
-// import {upload} from '@/utils/upload/alioss'
+import { upload } from '@/utils/upload/alioss'
-import { uploadToS3 } from '@/utils/upload/ymx'
 
 const props = withDefaults(
     defineProps<{
@@ -59,8 +58,7 @@ function chooseImage(type: 'album' | 'camera') {
   //     })
   //
   //     for (let i = 0; i < files.length; i++) {
-  //       // asyncList.push(upload(files[i]))
+  //       asyncList.push(upload(files[i]))
-  //       asyncList.push(uploadToS3(files[i]))
   //       console.log(asyncList)
   //     }
   //
@@ -101,21 +99,57 @@ function chooseImage(type: 'album' | 'camera') {
         mask: true,
       })
       for (let i = 0; i < files.length; i++) {
-        // asyncList.push(upload(files[i]))
+        asyncList.push(upload(files[i]))
-        asyncList.push(uploadToS3(files[i]))
-        console.log(asyncList)
       }
       Promise.all(asyncList)
           .then((results) => {
             console.log(results)
             emits('change', results)
           })
+          .catch(() => {
+            uni.showToast({ icon: 'none', title: t('common.prompt.up-failed') })
+          })
           .finally(() => {
             uni.hideLoading()
           })
     }
   })
   // #endif
+
+  // #ifndef APP-PLUS
+  uni.chooseImage({
+    count: props.count,
+    sizeType: ['compressed'],
+    sourceType: type === 'album' ? ['album'] : ['camera'],
+    success: async (res) => {
+      let files = [...res.tempFilePaths]
+      if (props.count > 0) {
+        files = files.slice(0, props.count)
+      }
+      if (!props.isUpload) {
+        return emits('change', files)
+      }
+      await uni.showLoading({
+        title: t('common.loading') + '...',
+        mask: true,
+      })
+      const asyncList: Promise<unknown>[] = []
+      for (let i = 0; i < files.length; i++) {
+        asyncList.push(upload(files[i]))
+      }
+      Promise.all(asyncList)
+        .then((results) => {
+          emits('change', results)
+        })
+        .catch(() => {
+          uni.showToast({ icon: 'none', title: t('common.prompt.up-failed') })
+        })
+        .finally(() => {
+          uni.hideLoading()
+        })
+    },
+  })
+  // #endif
 }
 
 

src/components/header-search/header-search.vue

@@ -1,8 +1,11 @@
 <script setup lang="ts">
+import { computed, onMounted } from 'vue'
 import Config from '@/config'
 import {throttle} from 'throttle-debounce'
+import {useUserStore} from '@/store'
 
 const {t} = useI18n()
+const userStore = useUserStore()
 
 const props = withDefaults(
     defineProps<{
@@ -10,11 +13,17 @@ const props = withDefaults(
       disabled?: boolean
       focus?: boolean
       placeholder?: string
+      /** 搜索落地页：右侧圆形购物车，与返回键对称 */
+      trailingCart?: boolean
+      /** trailingCart 为 true 时：gray=搜索首页浅底；white=结果页白底（与设计稿一致） */
+      trailingSurface?: 'gray' | 'white'
     }>(),
     {
       modelValue: '',
       disabled: false,
       focus: false,
+      trailingCart: false,
+      trailingSurface: 'gray',
     },
 )
 
@@ -39,6 +48,35 @@ function handleClickLeft() {
   uni.navigateBack()
 }
 
+function goCart() {
+  if (userStore.checkLogin()) {
+    uni.navigateTo({ url: '/pages-user/pages/cart/index' })
+  }
+}
+
+const cartBadgeTotal = computed(() => {
+  const list = userStore.userCartAllData
+  if (!Array.isArray(list) || list.length === 0) return 0
+  let n = 0
+  for (const m of list) {
+    n += (m as { merchantCartVoList?: unknown[] })?.merchantCartVoList?.length || 0
+  }
+  return n
+})
+
+onMounted(() => {
+  if (props.trailingCart) {
+    userStore.getUserCartAllData()
+  }
+})
+
+const headerRootClass = computed(() => {
+  if (!props.trailingCart) return 'header-search header-search--default'
+  return props.trailingSurface === 'white'
+    ? 'header-search header-search--trailing-white'
+    : 'header-search header-search--landing'
+})
+
 defineOptions({
   name: 'HeaderSearch',
 
@@ -46,10 +84,52 @@ defineOptions({
 </script>
 <template>
   <view
-      class="relative z-1 bg-#fff"
+      :class="headerRootClass"
   >
     <status-bar/>
-    <view class="flex-center-sb px-30rpx h-88rpx">
+    <view
+      v-if="trailingCart"
+      class="header-search__row header-search__row--triple px-24rpx pt-8rpx pb-12rpx"
+    >
+      <view
+        class="header-search__round-btn center shrink-0"
+        :class="trailingSurface === 'white' ? 'header-search__round-btn--muted' : ''"
+        @click="handleClickLeft"
+      >
+        <view class="i-carbon:chevron-left text-34rpx text-#14181b"></view>
+      </view>
+      <view class="header-search__pill flex-1 min-w-0 h-80rpx flex items-center px-28rpx">
+        <image src="@img/chef/100222.png" class="w-28rpx h-28rpx mr-14rpx shrink-0"></image>
+        <wd-input
+            no-border
+            clearable
+            :focus-when-clear="false"
+            :disabled="disabled"
+            :focus="focus"
+            confirm-type="search"
+            custom-class="flex items-center !text-28rpx !bg-transparent flex-1 min-w-0"
+            placeholderStyle="font-size: 28rpx;color: #999999; font-weight: 500;"
+            :modelValue="modelValue"
+            :placeholder="placeholder || t('common.prompt.please-enter-keyword-search')"
+            @update:modelValue="handleInputUpdateModelValue"
+            @confirm="handleSearch"
+        >
+        </wd-input>
+      </view>
+      <view
+        class="header-search__round-btn header-search__round-btn--cart center shrink-0"
+        :class="trailingSurface === 'white' ? 'header-search__round-btn--muted' : ''"
+        @click="goCart"
+      >
+        <view class="i-carbon:shopping-cart text-34rpx text-#14181b"></view>
+        <view
+          v-if="userStore.isLogin && cartBadgeTotal > 0"
+          class="header-search__cart-badge"
+          >{{ cartBadgeTotal > 99 ? '99+' : cartBadgeTotal }}</view
+        >
+      </view>
+    </view>
+    <view v-else class="flex-center-sb px-30rpx h-88rpx">
       <view class="shrink-0" @click="handleClickLeft">
         <view class="i-fluent:ios-arrow-ltr-24-filled  text-36rpx text-#333"></view>
       </view>
@@ -79,6 +159,56 @@ defineOptions({
 </template>
 
 <style scoped lang="scss">
+.header-search--landing {
+  background: #f7f8fa;
+}
+.header-search--trailing-white {
+  background: #fff;
+}
+.header-search--default {
+  position: relative;
+  z-index: 1;
+  background: #fff;
+}
+.header-search__row--triple {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 16rpx;
+}
+.header-search__round-btn {
+  width: 72rpx;
+  height: 72rpx;
+  border-radius: 50%;
+  background: #fff;
+  box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
+}
+.header-search__round-btn--muted {
+  background: #f0f0f0;
+  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.05);
+}
+.header-search__round-btn--cart {
+  position: relative;
+}
+.header-search__cart-badge {
+  position: absolute;
+  top: 6rpx;
+  right: 6rpx;
+  min-width: 28rpx;
+  height: 28rpx;
+  padding: 0 6rpx;
+  font-size: 18rpx;
+  line-height: 28rpx;
+  font-weight: 600;
+  color: #fff;
+  text-align: center;
+  background: #e23636;
+  border-radius: 999rpx;
+}
+.header-search__pill {
+  background: #f2f2f2;
+  border-radius: 999rpx;
+}
 :deep(.wd-input__clear) {
   background: transparent !important;
 }

src/components/navbar/navbar.vue

@@ -4,9 +4,12 @@ const props = withDefaults(defineProps<{
   fixed?: boolean
   showLeft?: boolean
   customClass?: string
+  /** 左侧返回为白底圆形+阴影（用于预约日期等浅色页） */
+  circleBack?: boolean
 }>(), {
   fixed: true,
-  showLeft: true
+  showLeft: true,
+  circleBack: false
 });
 
 function handleClickLeft() {
@@ -31,7 +34,17 @@ function handleClickLeft() {
       @click-left="handleClickLeft">
     <template #left>
       <view class="shrink-0" v-if="showLeft">
-        <view class="i-carbon:chevron-left text-50rpx text-primary ml-[-10rpx]"></view>
+        <view
+          class="flex items-center justify-center"
+          :class="circleBack ? 'navbar-circle-back' : ''"
+        >
+          <view
+            :class="[
+              'i-carbon:chevron-left text-50rpx',
+              circleBack ? 'ml-0 text-#111' : 'ml-[-10rpx] text-primary',
+            ]"
+          ></view>
+        </view>
       </view>
     </template>
     <template #right>
@@ -41,6 +54,14 @@ function handleClickLeft() {
 </template>
 
 <style scoped lang="scss">
+.navbar-circle-back {
+  width: 72rpx;
+  height: 72rpx;
+  border-radius: 50%;
+  background-color: #fff;
+  // box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.08);
+}
+
 :deep(.wd-navbar) {
   z-index: 2 !important;
   .wd-navbar__title {

src/config/index.ts

@@ -23,6 +23,8 @@ const Config = {
     shareLink: "https://www.howhowfresh.com/h5/",
     shareImage: "https://hanguomcn.oss-ap-northeast-2.aliyuncs.com/images/20250901105756_1756695476183_56ac07ac.png",
     shareDesc: "分享专属二维码邀请新用户注册即邀请成功。一起来注册体验点餐功能。",
+    // Zelle 支付二维码图片地址
+    zellePayPath: "https://www.howhowfresh.com/minio/ruoyi/2026/04/14/ef120c97e50c419da2263a59d6679229.png",
     // 登录端口
     userPort: 1,
     // 手机区号数组

src/locale/en.json

@@ -135,6 +135,9 @@
   "navbar-forget-password": "Forgot password",
   "navbar-forget-payment-password": "Forgot your payment password",
   "navbar-invited-person": "My invitation",
+  "navbar-ai-recommend": "AI Recommend Entry",
+  "navbar-ai-diet-preference": "Diet Preference Setup",
+  "navbar-ai-chat": "AI Ingredient Chat",
   "navbar-nickname": "Name",
   "navbar-personal-information": "personal information",
   "navbar-set-payment-password": "Set a payment password",
@@ -171,7 +174,7 @@
         "officeDescription": "Workplaces with entry restrictions",
         "other": "Other",
         "otherDescription": "Hospitals, parks, outdoors, etc",
-        "title": "Select building type"
+        "title": "Building type selection"
       },
       "deliveryInstructions": "Delivery Instructions",
       "deliveryPointInfo": "Delivery Point Information",
@@ -206,14 +209,20 @@
         "dateNotSelectable": "This date is not selectable",
         "noAvailableTime": "No available time for current date, automatically selected next business day",
         "notAvailable": "Not available",
+        "nextWeek": "Next week",
+        "pageTitle": "Delivery date",
         "reservationSuccess": "Reservation successful",
-        "selectTimeSlot": "Please select a time slot"
+        "selectTimeSlot": "Please select a time slot",
+        "thisWeek": "This week"
       },
       "savedAddresses": "Saved addresses",
       "title": "Address",
       "titleDetail": "Address Details"
     },
     "browse": {
+      "brandTag": "CHEFLINK Selected",
+      "moreRecipes": "More Recipes",
+      "nearbyEmpty": "No nearby data",
       "titleCuisine": "Nearby Cuisine",
       "titleRecipes": "Selected Recipes"
     },
@@ -223,12 +232,108 @@
       "deliveryFee": "Shipping Fee",
       "featured-on": "Featured on CHEFLINK",
       "featured-dishes": "Featured Dishes",
-      "nearby-merchants": "Nearby Merchants"
+      "nearby-merchants": "Nearby Merchants",
+      "open-member": "Become a Member",
+      "recharge-now": "Deposit Now",
+      "quickTabs": {
+        "memberZone": "Members' Picks",
+        "liveSeafoodAir": "Live Seafood – Limited Supply",
+        "mustEatList": "Must-Try List",
+        "newCalendar": "New Arrival",
+        "newCalendarNav": "Today's New",
+        "freshSeafoodToday": "Day-Boat Fresh Catch",
+        "groupCatering": "Catering & Group Orders",
+        "energyMeal": "Energy Meals"
+      },
+      "mustEatListTabs": {
+        "merchant": "Merchant Rank",
+        "dish": "Product Rank",
+        "all": "All"
+      },
+      "noticeBar": {
+        "thursday": "Every Thursday: Fresh seafood + New York store delivery",
+        "sunday": "Every Sunday: Boston local store delivery",
+        "freshCatch": "Freshly caught seafood is listed based on daily catch. Limited quantity, while supplies last."
+      }
+    },
+    "ai": {
+      "recommend": {
+        "loading": "Loading..."
+      },
+      "dietPreference": {
+        "title": "Complete Your Diet Preferences",
+        "sub": "We will recommend dishes and ingredients that better match your taste based on your information, allowing AI to understand your stomach better.",
+        "loadingConfig": "Loading profile configuration...",
+        "empty": "No configurable items",
+        "multi": "(Multiple)",
+        "single": "(Single)",
+        "submit": "Save Configuration",
+        "fallback": {
+          "groupTaste": "Taste & Taboos",
+          "tasteLike": "Taste Preference",
+          "tasteTaboo": "Absolute Taboos",
+          "optionHeavy": "Heavy Flavor",
+          "optionLight": "Light",
+          "optionSpicy": "Spicy",
+          "optionSeafood": "Seafood Allergy",
+          "optionOrgan": "No Offal",
+          "optionOnion": "No Onion/Ginger/Garlic"
+        }
+      },
+      "chat": {
+        "title": "AI Ingredient Recommendation",
+        "defaultMessage": "Hi, I can recommend dishes based on your budget, taboos, and taste preferences.",
+        "thinking": "Thinking...",
+        "thinkingSearching": "AI is searching matching items...",
+        "searchingGoods": "Searching products...",
+        "toolStatusWithSizePrefix": "Calling ",
+        "toolStatusWithSizeMiddle": ", total ",
+        "toolStatusWithSizeSuffix": " items",
+        "emptyResult": "Completed, but no displayable content returned.",
+        "requestFailed": "Request failed, please try again later.",
+        "recommendCountPrefix": "Recommended items: ",
+        "recommendCountSuffix": "",
+        "recommendSource": "Selected by AI in real time",
+        "summaryFoundPrefix": "",
+        "summaryFoundSuffix": " items found",
+        "summaryBudgetPrefix": "Estimate ",
+        "summaryBudgetMiddle1": ", actual ",
+        "summaryBudgetMiddle2": ", saved ",
+        "summaryBudgetSuffix": "",
+        "unnamed": "Unnamed Item",
+        "quickAdd": "Quick Add",
+        "added": "Added",
+        "addAll": "Add All",
+        "addingAll": "Adding...",
+        "allAdded": "All Added",
+        "addAllResultPrefix": "Added ",
+        "addAllResultMiddle1": ", failed ",
+        "addAllResultMiddle2": ", skipped ",
+        "addAllResultSuffix": "",
+        "addAllFailed": "Failed to add, please try again",
+        "goCartTitle": "Added Successfully",
+        "goCartTip": "Go to cart now?",
+        "goCartLater": "Maybe later",
+        "goCartNow": "Go now",
+        "duplicateTitle": "Duplicate Add Confirmation",
+        "duplicateSingleTip": "This item already exists in the cart. Add again?",
+        "duplicateBatchTipPrefix": "",
+        "duplicateBatchTipSuffix": " recommended item(s) already exist in the cart. Add them again?",
+        "missingDishNav": "Missing merchant info, unable to open detail",
+        "missingCartArgs": "Missing merchant or dish info, unable to add cart",
+        "addCartPending": "Add to Cart (pending integration)",
+        "inputPlaceholder": "Send a message or hold to speak (demo)",
+        "generating": "Generating..."
+      }
     },
     "mine": {
       "activity-description": "Activity description",
       "activity-description-tip": "Share the QR code and invite new users to register successfully. Successful invitation",
-      "collection": "Collection",
+      "collection": "My Collection",
+      "collectionBatchDeleteConfirmPrefix": "Remove ",
+      "collectionBatchDeleteConfirmSuffix": " selected favorite(s)?",
+      "collectionBatchModeHint": "Select items to remove, then tap the trash again to delete",
+      "collectionSelectFirst": "Please select favorites to remove",
       "complaintsAndSuggestions": "Complaints and suggestions",
       "customer-service-phone": "Customer service phone",
       "dial": "Dial",
@@ -240,8 +345,10 @@
       "join": "Join",
       "log-out-successfully": "Log out successfully",
       "login-out-tip": "Are you sure you want to log out of your current login account?",
+      "member": "Member",
       "member-desc": "Unlock members to enjoy more discounts and promotions.",
       "member-title": "Free trial of CHEFLINK",
+      "openMember": "Activate",
       "order": "Order",
       "platformAgreement": "Platform Agreement",
       "privacyPolicy": "Privacy Policy",
@@ -259,17 +366,23 @@
       "PU": "PU",
       "accept": "ACPT",
       "all": "ALL",
+      "cancelOrder": "Cancel",
       "completed": "DCOMP",
       "confirmReady": "CONF/READY",
       "onTheWay": "OTW",
-      "title": "History"
+      "title": "History",
+      "totalItemCountPrefix": "",
+      "totalItemCountSuffix": " items"
     },
     "store": {
       "all": "All"
     },
     "search": {
-      "hot-title": "Popular Categories",
+      "hot-title": "Hot searches",
-      "recently": "Recently",
+      "clear-history": "Clear",
+      "recently": "Search history",
+      "weekly-sales": "Weekly sales",
+      "member-price-line": "Member",
       "result": {
         "food": "Food",
         "recipe": "Recipe",
@@ -362,9 +475,50 @@
     "checkout": {
       "addAddress": "Add address",
       "addCoupon": "Add coupon",
+      "confirmOrder": "Confirm order",
+      "couponInputPlaceholder": "Enter coupon code",
+      "deliverBeforePrefix": "Arriving before ",
+      "deliverBeforeSuffix": "",
+      "deliveryInfo": "Delivery",
+      "driverTip": "Driver tip",
+      "driverTipNote": "100% of your tip goes to the driver.",
+      "tipByDeliveryDatePrefix": "Delivery date ",
+      "tipNextTime": "Maybe next time",
+      "fillAddressHint": "Add delivery address and contact",
+      "freeTag": "Free",
+      "localDelivery": "Local delivery",
+      "localDeliverySubtitlePrefix": "Delivered by ",
+      "localDeliverySubtitleSuffix": ".",
+      "memberThanksPrefix": "Thanks for being a ",
+      "memberThanksSuffix": " member.",
+      "missingParamsHint": "Missing checkout parameters. Please return to cart and try again.",
+      "emptyCartHint": "Your cart is empty. Please add items before checkout.",
+      "orderTotalLine": "Order total",
+      "orderBreakdown": "Order details",
+      "pay": "Pay",
+      "payMethodSection": "Payment method",
+      "pickupSubtitle": "Pick up at the store at your scheduled time.",
+      "pickupTitle": "Pickup",
+      "scheduledDeliveryHint": "Delivery fee refunded if we miss the promised window.",
+      "scheduledDeliveryTitle": "Scheduled delivery",
+      "scheduledDeliveryWindowPrefix": "By ",
+      "scheduledDeliveryWindowSuffix": "",
+      "scheduledDeliveryAddon": "+ $ 2.99",
+      "scheduledDeliveryStandardTitle": "Standard delivery",
+      "scheduledDeliveryStandardDesc": "Delivered in your selected window. No rush fee.",
+      "serviceFee": "Service fee",
+      "shippingFee": "Delivery fee",
+      "subtotalBar": "Subtotal",
+      "subtotalOneLinePrefix": "Subtotal: $ ",
+      "subtotalWithPiecesPrefix": "Items total (",
+      "subtotalWithPiecesSuffix": ")",
+      "itemsGoodsTotalWithPriceMiddle": " items total $",
+      "useDiscount": "Discounts",
       "appointmentDelivery": "Appointment delivery",
       "appointmentPickup": "Appointment pickup",
       "chooseTime": "Choose the time",
+      "chooseTimeForStorePrefix": "Please choose a delivery time for \"",
+      "chooseTimeForStoreSuffix": "\"",
       "chooseTips": "Choose tips",
       "contactPhone": "Contact phone",
       "deliveryPreference": "Delivery preference",
@@ -400,10 +554,13 @@
       "cancellationReasonDesc": "30 minutes without processing automatically agreed by the system.",
       "cancellationTime": "Cancellation time",
       "cancellationTitle": "Merchant processing in progress",
+      "cancelSuccess": "Order cancelled successfully",
       "cancelled": "Cancelled",
       "deliveryAddress": "Delivery address",
+      "deliveryDate": "Delivery date",
       "deliveryPhotos": "Delivery of photos",
       "deliveryTime": "Delivery time",
+      "beforeDeadline": " before",
       "estimatedDeliveryTime": "Estimated delivery time",
       "orderInfo": "Ordering Information",
       "orderNumber": "Order number",
@@ -433,10 +590,90 @@
       "total": "Total",
       "upTime": "Estimated self-pickup time",
       "useCode": "Use code",
-      "writeOff": "Meal Code"
+      "writeOff": "Meal Code",
+      "uploadPaidVoucher": "I've paid — upload proof",
+      "voucherSubmitSuccess": "Proof submitted — pending review",
+      "voucherSubmitFailed": "Submit failed, please try again",
+      "voucherUploadFailed": "Upload failed, please try again",
+      "payMethodZip": "ZIP voucher payment",
+      "zipPayHint": "Scan the QR code to pay, then upload your payment proof",
+      "zipPayAmountLabel": "Amount due",
+      "zipPayAmountInvalid": "Invalid payment amount. Please return to checkout.",
+      "zipPayAmountChanged": "Payment group amount changed. Please upload proof again.",
+      "zipPayPendingReview": "A ZIP payment for this delivery date is pending review.",
+      "pleaseBindCreditCard": "No bank card linked. Please add a card before paying."
+    },
+    "energyMeal": {
+      "title": "Energy Meals",
+      "addAllToCart": "Add all to cart",
+      "empty": "No energy meals yet",
+      "unavailable": "This bundle is unavailable"
+    },
+    "groupCatering": {
+      "cancelAction": "Cancel Reservation",
+      "cancelConfirm": "Are you sure you want to cancel this group meal reservation?",
+      "cancelReasonPlaceholder": "Enter a cancellation reason (optional)",
+      "cancelSuccess": "Cancelled successfully",
+      "cancelTitle": "Cancel Reservation",
+      "contactNamePlaceholder": "Enter contact name",
+      "contactPhonePlaceholder": "Enter contact phone",
+      "detailTitle": "Reservation Details",
+      "fieldCancelReason": "Cancellation Reason",
+      "fieldContactName": "Contact Name",
+      "fieldContactPhone": "Contact Phone",
+      "fieldEstimatedTotal": "Estimated Total",
+      "fieldExpectedTime": "Expected Meal/Delivery Time",
+      "fieldHandleRemark": "Merchant Notes",
+      "fieldMerchant": "Merchant",
+      "fieldPeopleCount": "Headcount",
+      "fieldPerCapitaPrice": "Price Per Person",
+      "fieldRemark": "Remarks",
+      "fieldScene": "Occasion",
+      "intro": "Group meal reservations are inquiry requests sent to merchants. They do not go through cart checkout or payment. Fill in headcount, budget, and expected time, and the merchant will follow up with menu and pricing details.",
+      "listEmpty": "No group meal reservations yet",
+      "emptyAction": "Submit a Reservation",
+      "merchantEmpty": "No merchants available",
+      "peopleCountPlaceholder": "Enter headcount",
+      "perCapitaPricePlaceholder": "Enter price per person",
+      "remarkPlaceholder": "e.g. delivery address or dietary notes",
+      "sceneOptions": {
+        "birthday": "Birthday Party",
+        "company": "Company Meeting",
+        "other": "Other",
+        "party": "Party / Celebration",
+        "school": "School Event"
+      },
+      "scenePlaceholder": "Custom occasion",
+      "selectDate": "Select date",
+      "selectExpectedTime": "Select expected time",
+      "selectMerchant": "Select merchant",
+      "selectTime": "Select time",
+      "statusCancelled": "Cancelled by User",
+      "statusCompleted": "Completed",
+      "statusConfirmed": "Confirmed",
+      "statusContacted": "Contacted",
+      "statusPending": "Pending",
+      "statusRejected": "Rejected",
+      "submitAction": "Submit Reservation",
+      "submitSuccess": "Submitted successfully",
+      "tabList": "My Reservations",
+      "tabSubmit": "New Reservation",
+      "tips": "Note: Estimated total = headcount × price per person. Final pricing is subject to merchant confirmation.",
+      "title": "Catering & Group Orders",
+      "validation": {
+        "contactName": "Please enter contact name",
+        "contactPhone": "Please enter contact phone",
+        "expectedTime": "Please select expected meal/delivery time",
+        "merchant": "Please select a merchant",
+        "peopleCount": "Headcount must be greater than 0",
+        "perCapitaPrice": "Price per person cannot be less than 0",
+        "scene": "Please enter an occasion"
+      },
+      "viewAndCancel": "View details / cancellable"
     },
     "store": {
       "addToCart": "Add to cart",
+      "quantity": "Quantity",
       "appetizers": "Appetizers",
       "merchantDiscounts": "Merchant discounts",
       "claimNow": "Claim now",
@@ -488,6 +725,23 @@
       "recommend": "Recommended for you",
       "required": "Required",
       "sales": "Sales",
+      "dishDetail": {
+        "productDetails": "Product details",
+        "productIntro": "Introduction",
+        "origin": "Origin",
+        "unitQty": "Unit qty.",
+        "category": "Category",
+        "brand": "Brand",
+        "allergen": "Allergen",
+        "weeklySales": "Weekly sales",
+        "forYou": "Recommended for you",
+        "memberPriceLabelSuffix": " member price",
+        "dash": "—",
+        "lbUnit": "lb",
+        "hotSalesBadge": "Fresh picks",
+        "stockLabel": "Stock",
+        "loadMoreRecommend": "Load more"
+      },
       "securityCode": {
         "cantSee": "Can't see clearly? Change one",
         "confirm": "Confirm"
@@ -499,6 +753,7 @@
       "tips3": "membership to enjoy a ",
       "tips4": "Enjoy delivery service over",
       "tips5": "Delivery fee",
+      "deliveryScheduleDaysPrefix": "Delivery days: ",
       "start": " and up",
       "title": "The minimum order amount for this store is",
       "toast": {
@@ -555,7 +810,28 @@
       "title": "Cart",
       "totalPrice": "Total price",
       "viewCart": "View Shopping Cart",
-      "viewStore": "View Store"
+      "viewStore": "View Store",
+      "localDelivery": "Local delivery",
+      "deliveryUnifiedPrefix": "Orders are delivered by ",
+      "deliveryUnifiedSuffix": ".",
+      "itemsTotalWithPriceMiddle": " items total $",
+      "deliveryFeeLine": "Delivery",
+      "serviceFeeLine": "Service fee",
+      "subtotalLine": "Subtotal",
+      "selectAll": "Select all",
+      "forYou": "Recommended for you",
+      "calculating": "Calculating...",
+      "selectItemsHint": "Select items to checkout",
+      "removeCartTitle": "Delete shopping cart?",
+      "removeCartDesc": "Are you sure you want to delete this cart?",
+      "removeProductTitle": "Remove the product?",
+      "removeProductDescPrefix": "Are you sure you want to remove ",
+      "removeProductDescSuffix": " from your shopping cart?",
+      "emptyTitle": "Your cart is empty",
+      "emptyAction": "Explore Restaurants",
+      "orderNoticeTitle": "Order Notice",
+      "multiStoreCheckoutNoticeTitle": "Check delivery dates before checkout",
+      "multiStoreCheckoutNoticeDesc": "Your cart contains multiple stores, and items may have different delivery dates. Please confirm each item's delivery date before placing the order."
     },
     "choosePaymethod": {
       "creditCard": "Credit card payment",
@@ -565,6 +841,7 @@
     },
     "complaints": {
       "contact-information": "Contact information",
+      "contact-information-placeholder": "Please enter your contact phone",
       "contact-information-tip": "Your contact information helps us communicate and solve problems, only visible to staff",
       "description": "You are welcome to give us feedback on the use of our products and suggestions.",
       "feedback-content": "Feedback content",
@@ -582,6 +859,8 @@
     "coupon": {
       "all-merchants": "Applicable to all merchants",
       "expiry-date": "Expiry date: ",
+      "merchantOnlyPrefix": "Only available at ",
+      "merchantOnlySuffix": "",
       "merchant-specific": "For specific merchant use",
       "no-coupons": "You currently do not have any coupons",
       "redeem-now": "Redeem now",
@@ -604,8 +883,10 @@
       "paymentMethod": "Payment method",
       "renewalNow": "Renewal now",
       "weeks": "weeks",
-      "billedAnnually": "Billed at ${amount}/year",
+      "billedAnnuallyPrefix": "Billed at $",
-      "savingsPerYear": "It can save an additional ${amount} per year."
+      "billedAnnuallySuffix": "/year",
+      "savingsPerYearPrefix": "It can save an additional $",
+      "savingsPerYearSuffix": " per year."
     },
     "member-center": {
       "chooseLike": "Choose 3 items you like",
@@ -640,10 +921,22 @@
       "password-length-limit": "Password must be 8-16 characters long"
     },
     "recharge": {
+      "activityDetailTitle": "Recharge Promotion",
+      "activityPlaceholderDesc": "Promotion details are coming soon.",
+      "activityRechargeBtn": "Deposit Now",
+      "activityRulesTitle": "Promotion Rules",
       "amount": "Recharge amount",
       "amount-invalid": "The recharge amount cannot be less than 0",
       "description": "Please enter your recharge amount",
       "pay-method": "Please select a payment method",
+      "payMethodStripe": "Credit card (Stripe)",
+      "payMethodZip": "ZIP voucher payment",
+      "zipPayHint": "Scan the QR code to pay, then upload your payment proof",
+      "uploadVoucher": "Upload payment proof",
+      "voucherRequired": "Please upload payment proof first",
+      "voucherUploaded": "Proof uploaded",
+      "zipSubmitSuccess": "Proof submitted — pending review",
+      "promotionTier": "Deposit {recharge}, get {gift} bonus",
       "success": "Recharge successful",
       "title": "Recharge Balance"
     },

src/locale/zh-Hans.json

@@ -30,7 +30,7 @@
     "goSettle": "去结算",
     "google-map": "谷歌地图",
     "googleLoginFailed": "谷歌登录授权失败，请重试",
-    "gotIt": "明白了",
+    "gotIt": "我知道了",
     "loading": "加载中",
     "mile": "英里",
     "minutes": "分钟",
@@ -135,6 +135,9 @@
   "navbar-forget-password": "忘记密码",
   "navbar-forget-payment-password": "忘记支付密码",
   "navbar-invited-person": "我的邀请",
+  "navbar-ai-recommend": "AI推荐入口",
+  "navbar-ai-diet-preference": "饮食喜好设置",
+  "navbar-ai-chat": "AI食材推荐",
   "navbar-nickname": "昵称",
   "navbar-personal-information": "个人信息",
   "navbar-set-payment-password": "设置支付密码",
@@ -171,7 +174,7 @@
         "officeDescription": "有进入限制的工作场所",
         "other": "其他",
         "otherDescription": "医院、公园、户外等",
-        "title": "选择建筑类型"
+        "title": "建筑类型选择"
       },
       "deliveryInstructions": "配送说明",
       "deliveryPointInfo": "交货点信息",
@@ -206,15 +209,21 @@
         "dateNotSelectable": "该日期不可选择",
         "noAvailableTime": "当前日期无可用时间，已自动选择下一个营业日",
         "notAvailable": "不营业",
+        "nextWeek": "下周",
+        "pageTitle": "送货日",
         "reservationSuccess": "预约成功",
-        "selectTimeSlot": "请选择时间段"
+        "selectTimeSlot": "请选择时间段",
+        "thisWeek": "本周"
       },
       "savedAddresses": "保存的地址",
       "title": "地址管理",
       "titleDetail": "地址详情"
     },
     "browse": {
-      "titleCuisine": "附近的美食",
+      "brandTag": "CHEFLINK 严选",
+      "moreRecipes": "更多食谱",
+      "nearbyEmpty": "附近暂无美食",
+      "titleCuisine": "附近美食",
       "titleRecipes": "选择食谱"
     },
     "home": {
@@ -223,12 +232,108 @@
       "deliveryFee": "配送费",
       "featured-on": "精选商家",
       "featured-dishes": "精选菜品",
-      "nearby-merchants": "附近商家"
+      "nearby-merchants": "附近商家",
+      "open-member": "开通会员",
+      "recharge-now": "立即充值",
+      "quickTabs": {
+        "memberZone": "会员精选",
+        "liveSeafoodAir": "限量活海鲜",
+        "mustEatList": "必吃榜单",
+        "newCalendar": "上新日历",
+        "newCalendarNav": "今日上新",
+        "freshSeafoodToday": "今日现打海鲜",
+        "groupCatering": "团餐预定",
+        "energyMeal": "能量餐食"
+      },
+      "mustEatListTabs": {
+        "merchant": "商家榜单",
+        "dish": "产品榜单",
+        "all": "综合"
+      },
+      "noticeBar": {
+        "thursday": "每周四：好好鲜生生鲜 + 纽约店铺配送",
+        "sunday": "每周日：波士顿本地店铺配送",
+        "freshCatch": "渔船现打海鲜将根据当天捕捞情况临时上新，数量有限，售完即止。"
+      }
+    },
+    "ai": {
+      "recommend": {
+        "loading": "加载中..."
+      },
+      "dietPreference": {
+        "title": "完善您的饮食偏好",
+        "sub": "我们将根据您的信息为您推荐更符合口味的菜品和食材，让AI更懂你的胃。",
+        "loadingConfig": "正在加载画像配置...",
+        "empty": "暂无可配置项",
+        "multi": "（可多选）",
+        "single": "（单选）",
+        "submit": "保存配置",
+        "fallback": {
+          "groupTaste": "口味与禁忌",
+          "tasteLike": "口味偏好",
+          "tasteTaboo": "绝对忌口",
+          "optionHeavy": "重口味",
+          "optionLight": "清淡",
+          "optionSpicy": "麻辣",
+          "optionSeafood": "海鲜过敏",
+          "optionOrgan": "不吃内脏",
+          "optionOnion": "不吃葱姜蒜"
+        }
+      },
+      "chat": {
+        "title": "AI食材推荐",
+        "defaultMessage": "你好，我可以根据你的预算、忌口和口味推荐菜品。",
+        "thinking": "思考中...",
+        "thinkingSearching": "AI 正在检索匹配商品...",
+        "searchingGoods": "正在检索商品...",
+        "toolStatusWithSizePrefix": "正在调用 ",
+        "toolStatusWithSizeMiddle": "，共 ",
+        "toolStatusWithSizeSuffix": " 条",
+        "emptyResult": "已完成，但未返回可展示内容。",
+        "requestFailed": "请求失败，请稍后重试。",
+        "recommendCountPrefix": "推荐商品 ",
+        "recommendCountSuffix": " 件",
+        "recommendSource": "来自 AI 实时筛选",
+        "summaryFoundPrefix": "找到 ",
+        "summaryFoundSuffix": " 件商品",
+        "summaryBudgetPrefix": "预估 ",
+        "summaryBudgetMiddle1": "，实际 ",
+        "summaryBudgetMiddle2": "，优惠 ",
+        "summaryBudgetSuffix": " 元",
+        "unnamed": "未命名商品",
+        "quickAdd": "一键加购",
+        "added": "已加购",
+        "addAll": "一键加入全部",
+        "addingAll": "加购中...",
+        "allAdded": "已全部加购",
+        "addAllResultPrefix": "已加购",
+        "addAllResultMiddle1": "件，失败",
+        "addAllResultMiddle2": "件，跳过",
+        "addAllResultSuffix": "件",
+        "addAllFailed": "加入失败，请稍后重试",
+        "goCartTitle": "加入成功",
+        "goCartTip": "是否前往购物车？",
+        "goCartLater": "下次再说",
+        "goCartNow": "直接前往",
+        "duplicateTitle": "重复加入确认",
+        "duplicateSingleTip": "当前购物车已存在该商品，是否重复加入？",
+        "duplicateBatchTipPrefix": "当前购物车已有",
+        "duplicateBatchTipSuffix": "件推荐商品，是否重复加入这些商品？",
+        "missingDishNav": "缺少商家信息，暂无法查看详情",
+        "missingCartArgs": "缺少商家或菜品信息，暂无法加购",
+        "addCartPending": "加入购物车（待接入）",
+        "inputPlaceholder": "输入消息后点击发送",
+        "generating": "生成中..."
+      }
     },
     "mine": {
       "activity-description": "活动说明：",
       "activity-description-tip": "分享专属二维码邀请新用户注册即邀请成功。一起来注册体验点餐功能。",
-      "collection": "收藏",
+      "collection": "我的收藏",
+      "collectionBatchDeleteConfirmPrefix": "确定删除已选中的 ",
+      "collectionBatchDeleteConfirmSuffix": " 条收藏？",
+      "collectionBatchModeHint": "请选择要删除的收藏，再次点击垃圾桶执行删除",
+      "collectionSelectFirst": "请先选择要删除的收藏",
       "complaintsAndSuggestions": "投诉建议",
       "customer-service-phone": "客服电话",
       "dial": "拨号",
@@ -240,8 +345,10 @@
       "join": "加入",
       "log-out-successfully": "退出登录成功",
       "login-out-tip": "是否确定退出当前登录账号",
+      "member": "会员",
       "member-desc": "解锁会员，享受更多折扣和促销活动。",
       "member-title": "CHEFLINK 免费试用",
+      "openMember": "去开通",
       "order": "订单",
       "platformAgreement": "平台协议",
       "privacyPolicy": "隐私政策",
@@ -259,17 +366,23 @@
       "PU": "自取",
       "accept": "接受",
       "all": "全部",
+      "cancelOrder": "取消订单",
       "completed": "已完成",
       "confirmReady": "确认/已准备",
       "onTheWay": "在路上",
-      "title": "订单"
+      "title": "订单",
+      "totalItemCountPrefix": "共",
+      "totalItemCountSuffix": "件"
     },
     "store": {
       "all": "全部"
     },
     "search": {
-      "hot-title": "热搜",
+      "hot-title": "热门搜索",
-      "recently": "历史记录",
+      "clear-history": "清空",
+      "recently": "搜索记录",
+      "weekly-sales": "周销量",
+      "member-price-line": "会员价",
       "result": {
         "food": "美食",
         "recipe": "菜谱",
@@ -362,9 +475,50 @@
     "checkout": {
       "addAddress": "新增地址",
       "addCoupon": "添加优惠券",
+      "confirmOrder": "确认订单",
+      "couponInputPlaceholder": "请输入优惠券",
+      "deliverBeforePrefix": "将在 ",
+      "deliverBeforeSuffix": " 之前送达",
+      "deliveryInfo": "配送信息",
+      "driverTip": "司机小费",
+      "driverTipNote": "您所支付的小费 100% 归司机所有",
+      "tipByDeliveryDatePrefix": "配送日期 ",
+      "tipNextTime": "下次再说吧",
+      "fillAddressHint": "请填写您的送货地址及联系方式",
+      "freeTag": "免费",
+      "localDelivery": "本地配送",
+      "localDeliverySubtitlePrefix": "商品将由 ",
+      "localDeliverySubtitleSuffix": " 统一配送！",
+      "memberThanksPrefix": "感谢您成为 ",
+      "memberThanksSuffix": " 会员。",
+      "missingParamsHint": "页面参数缺失，请返回购物车重新结算",
+      "emptyCartHint": "购物车暂无商品，请返回添加后再结算",
+      "orderTotalLine": "订单总计",
+      "orderBreakdown": "订单明细",
+      "pay": "付款",
+      "payMethodSection": "支付方式",
+      "pickupSubtitle": "请按预约时间到店取餐。",
+      "pickupTitle": "门店自取",
+      "scheduledDeliveryHint": "若未在承诺时间内送达，运费将予以退还。",
+      "scheduledDeliveryTitle": "定时送达服务",
+      "scheduledDeliveryWindowPrefix": "",
+      "scheduledDeliveryWindowSuffix": " 前送达",
+      "scheduledDeliveryAddon": "+ $ 2.99",
+      "scheduledDeliveryStandardTitle": "标准送达",
+      "scheduledDeliveryStandardDesc": "按预约时段配送，无加急费用。",
+      "serviceFee": "服务费",
+      "shippingFee": "运费",
+      "subtotalBar": "小计",
+      "subtotalOneLinePrefix": "小计: $ ",
+      "subtotalWithPiecesPrefix": "总计(",
+      "subtotalWithPiecesSuffix": "件)",
+      "itemsGoodsTotalWithPriceMiddle": "件商品总共$",
+      "useDiscount": "使用优惠",
       "appointmentDelivery": "预约配送",
       "appointmentPickup": "预约自取",
       "chooseTime": "选择时间",
+      "chooseTimeForStorePrefix": "请为「",
+      "chooseTimeForStoreSuffix": "」选择配送时间",
       "chooseTips": "选择小费",
       "contactPhone": "联系电话",
       "deliveryPreference": "配送偏好",
@@ -400,10 +554,13 @@
       "cancellationReasonDesc": "30分钟不处理，系统自动同意",
       "cancellationTime": "取消时间",
       "cancellationTitle": "商户处理中",
+      "cancelSuccess": "取消订单成功",
       "cancelled": "已取消",
       "deliveryAddress": "配送地址",
+      "deliveryDate": "配送日期",
       "deliveryPhotos": "送达照片",
       "deliveryTime": "送达时间",
+      "beforeDeadline": "前",
       "estimatedDeliveryTime": "预计送达时间",
       "orderInfo": "订单信息",
       "orderNumber": "订单号",
@@ -433,10 +590,90 @@
       "total": "总计",
       "upTime": "预计自取时间",
       "useCode": "核销码",
-      "writeOff": "核销"
+      "writeOff": "核销",
+      "uploadPaidVoucher": "我已支付，上传凭证",
+      "voucherSubmitSuccess": "凭证已提交，待审核",
+      "voucherSubmitFailed": "提交失败，请重试",
+      "voucherUploadFailed": "上传失败，请重试",
+      "payMethodZip": "ZIP 凭证支付",
+      "zipPayHint": "请扫码完成转账后，上传支付凭证截图",
+      "zipPayAmountLabel": "应付金额",
+      "zipPayAmountInvalid": "支付金额无效，请返回结算页重新确认",
+      "zipPayAmountChanged": "支付组金额已变化，请重新上传凭证",
+      "zipPayPendingReview": "该配送日期已有 ZIP 支付待审核，请等待审核",
+      "pleaseBindCreditCard": "未绑定银行卡，请先绑定后再支付"
+    },
+    "energyMeal": {
+      "title": "能量餐",
+      "addAllToCart": "一键加入购物车",
+      "empty": "暂无能量餐",
+      "unavailable": "套餐暂不可购买"
+    },
+    "groupCatering": {
+      "cancelAction": "取消预定",
+      "cancelConfirm": "确定要取消这条团餐预定吗？",
+      "cancelReasonPlaceholder": "请输入取消原因（选填）",
+      "cancelSuccess": "取消成功",
+      "cancelTitle": "取消预定",
+      "contactNamePlaceholder": "请输入联系人",
+      "contactPhonePlaceholder": "请输入联系电话",
+      "detailTitle": "预定详情",
+      "fieldCancelReason": "取消原因",
+      "fieldContactName": "联系人",
+      "fieldContactPhone": "联系电话",
+      "fieldEstimatedTotal": "预计总价",
+      "fieldExpectedTime": "期望用餐/配送时间",
+      "fieldHandleRemark": "商家备注",
+      "fieldMerchant": "选择商家",
+      "fieldPeopleCount": "团餐人数",
+      "fieldPerCapitaPrice": "人均单价",
+      "fieldRemark": "备注",
+      "fieldScene": "用餐场景",
+      "intro": "团餐预定是向商家提交的咨询线索，不进入购物车或支付流程。请填写人数、预算和期望时间，商家会与您进一步沟通菜单与报价。",
+      "listEmpty": "暂无团餐预定记录",
+      "emptyAction": "去提交预定",
+      "merchantEmpty": "暂无可选商家",
+      "peopleCountPlaceholder": "请输入人数",
+      "perCapitaPricePlaceholder": "请输入人均单价",
+      "remarkPlaceholder": "例如配送地址、忌口要求等",
+      "sceneOptions": {
+        "birthday": "生日宴",
+        "company": "公司会议",
+        "other": "其他",
+        "party": "派对宴请",
+        "school": "学校活动"
+      },
+      "scenePlaceholder": "可自定义场景",
+      "selectDate": "选择日期",
+      "selectExpectedTime": "请选择期望时间",
+      "selectMerchant": "请选择商家",
+      "selectTime": "选择时间",
+      "statusCancelled": "用户取消",
+      "statusCompleted": "已完成",
+      "statusConfirmed": "已确认",
+      "statusContacted": "已联系",
+      "statusPending": "待处理",
+      "statusRejected": "已拒绝",
+      "submitAction": "提交预定",
+      "submitSuccess": "提交成功",
+      "tabList": "我的预定",
+      "tabSubmit": "提交预定",
+      "tips": "温馨提示：预计总价 = 团餐人数 × 人均单价，最终以商家确认报价为准。",
+      "title": "团餐预定",
+      "validation": {
+        "contactName": "请输入联系人",
+        "contactPhone": "请输入联系电话",
+        "expectedTime": "请选择期望用餐/配送时间",
+        "merchant": "请选择商家",
+        "peopleCount": "团餐人数必须大于 0",
+        "perCapitaPrice": "人均单价不能小于 0",
+        "scene": "请输入用餐场景"
+      },
+      "viewAndCancel": "查看详情 / 可取消"
     },
     "store": {
       "addToCart": "加入购物车",
+      "quantity": "数量",
       "appetizers": "开胃菜",
       "merchantDiscounts": "商家折扣",
       "claimNow": "立即领取",
@@ -488,6 +725,23 @@
       "recommend": "推荐给您",
       "required": "必选项",
       "sales": "销量",
+      "dishDetail": {
+        "productDetails": "产品详情",
+        "productIntro": "产品简介",
+        "origin": "产地",
+        "unitQty": "单位数量",
+        "category": "分类",
+        "brand": "品牌",
+        "allergen": "过敏源",
+        "weeklySales": "周销量",
+        "forYou": "为您推荐",
+        "memberPriceLabelSuffix": "会员价",
+        "dash": "—",
+        "lbUnit": "磅",
+        "hotSalesBadge": "生鲜热销榜",
+        "stockLabel": "库存",
+        "loadMoreRecommend": "加载更多"
+      },
       "securityCode": {
         "cantSee": "看不清？换一张",
         "confirm": "确定"
@@ -499,6 +753,7 @@
       "tips3": "会员可享受",
       "tips4": "最低起送金额",
       "tips5": "配送费",
+      "deliveryScheduleDaysPrefix": "配送日：",
       "start": "起",
       "title": "这家店的起送金额是",
       "toast": {
@@ -555,7 +810,28 @@
       "title": "购物车",
       "totalPrice": "总计",
       "viewCart": "查看购物车",
-      "viewStore": "查看店铺"
+      "viewStore": "查看店铺",
+      "localDelivery": "本地配送",
+      "deliveryUnifiedPrefix": "商品将由 ",
+      "deliveryUnifiedSuffix": " 统一配送！",
+      "itemsTotalWithPriceMiddle": "件商品总共$",
+      "deliveryFeeLine": "运费",
+      "serviceFeeLine": "服务费",
+      "subtotalLine": "小计",
+      "selectAll": "全选",
+      "forYou": "为您推荐",
+      "calculating": "计算中...",
+      "selectItemsHint": "请选择要结算的商品",
+      "removeCartTitle": "删除购物车？",
+      "removeCartDesc": "确定要删除该店铺购物车吗？",
+      "removeProductTitle": "移除商品？",
+      "removeProductDescPrefix": "确定要将 ",
+      "removeProductDescSuffix": " 从购物车中移除吗？",
+      "emptyTitle": "购物车为空",
+      "emptyAction": "去逛逛餐厅",
+      "orderNoticeTitle": "下单须知",
+      "multiStoreCheckoutNoticeTitle": "下单前请确认配送日期",
+      "multiStoreCheckoutNoticeDesc": "当前购物车有多个店铺，商品可能不是同一天配送。请先确认每个商品的配送日期，再提交订单。"
     },
     "choosePaymethod": {
       "creditCard": "信用卡支付",
@@ -565,6 +841,7 @@
     },
     "complaints": {
       "contact-information": "联系电话",
+      "contact-information-placeholder": "请输入您的联系电话",
       "contact-information-tip": "您的联系方式有助于我们沟通解决问题，仅工作人员可见",
       "description": "您好，欢迎您给我们反馈产品的使用感受和建议。",
       "feedback-content": "反馈内容",
@@ -582,6 +859,8 @@
     "coupon": {
       "all-merchants": "适用于所有商户使用",
       "expiry-date": "到期日：",
+      "merchantOnlyPrefix": "仅",
+      "merchantOnlySuffix": "可用",
       "merchant-specific": "指定商户使用",
       "no-coupons": "您目前没有任何优惠券",
       "redeem-now": "立即兑换",
@@ -604,8 +883,10 @@
       "paymentMethod": "支付方式",
       "renewalNow": "立即加入",
       "weeks": "周",
-      "billedAnnually": "按${amount}/年 结算",
+      "billedAnnuallyPrefix": "按$",
-      "savingsPerYear": "它每年可以额外节省${amount}"
+      "billedAnnuallySuffix": "/年 结算",
+      "savingsPerYearPrefix": "它每年可以额外节省$",
+      "savingsPerYearSuffix": ""
     },
     "member-center": {
       "chooseLike": "选择您喜欢的3个项目",
@@ -640,10 +921,22 @@
       "password-length-limit": "密码长度必须为8-16位"
     },
     "recharge": {
+      "activityDetailTitle": "充值活动",
+      "activityPlaceholderDesc": "活动详情即将上线，敬请期待。",
+      "activityRechargeBtn": "立即充值",
+      "activityRulesTitle": "活动规则",
       "amount": "充值金额",
       "amount-invalid": "充值金额不能小于0",
       "description": "请输入您的充值金额",
       "pay-method": "请选择支付方式",
+      "payMethodStripe": "信用卡（Stripe）",
+      "payMethodZip": "ZIP 凭证支付",
+      "zipPayHint": "请扫码完成转账后，上传支付凭证截图",
+      "uploadVoucher": "上传支付凭证",
+      "voucherRequired": "请先上传支付凭证",
+      "voucherUploaded": "凭证已上传",
+      "zipSubmitSuccess": "已提交凭证，等待后台审核",
+      "promotionTier": "充{recharge}送{gift}",
       "success": "充值成功",
       "title": "余额充值"
     },

src/manifest.json

@@ -2,8 +2,8 @@
     "name" : "CHEFLINK delivery",
     "appid" : "__UNI__06509BE",
     "description" : "",
-    "versionName" : "2.0.1",
+    "versionName" : "3.2.9",
-    "versionCode" : 201,
+    "versionCode" : 329,
     "transformPx" : false,
     /* 5+App特有相关 */
     "app-plus" : {
@@ -203,5 +203,11 @@
         "enable" : false
     },
     "vueVersion" : "3",
-    "locale" : "en"
+    "locale" : "en",
+    "h5" : {
+        "router" : {
+            "mode" : "history",
+            "base" : "/h5/"
+        }
+    }
 }

src/pages-login/pages/sign-up/index.vue

@@ -14,6 +14,7 @@
   const userStore = useUserStore();
   const configStore = useConfigStore()
   const logicStore = useLogicStore()
+  const invitationCode = ref('')
   
   const areaCode = ref<string>(logicStore.registerForm.areaCode || '+1');
   const columns = ref<string[]>(Config.phoneCodeList);
@@ -94,6 +95,9 @@
       // uuid: data.uuid,
       userPort: Config.userPort, // 登录端口2 商户端
     }
+    if (invitationCode.value) {
+      requestBody.invitationCode = invitationCode.value
+    }
     if (requestBody.email == null || requestBody.email === '') {
       delete requestBody.email
     }
@@ -155,6 +159,15 @@
   
   const emailIsReadonly = ref(false)
   const phoneIsReadonly = ref(false)
+  onLoad((options?: Record<string, any>) => {
+    const codeRaw = options?.invitationCode
+    const code = typeof codeRaw === 'string' ? decodeURIComponent(codeRaw).trim() : ''
+    invitationCode.value = code
+    if (code) {
+      userStore.invitationCode = code
+    }
+  })
+
   onMounted(() => {
     const {email, confirmEmail, phone, type} = logicStore.registerForm
     if (type === 'phone') {

src/pages-store/pages/dishes/components/featured-dish-topic-page.vue

@@ -0,0 +1,332 @@
+<script setup lang="ts">
+import { computed } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { debounce } from 'throttle-debounce'
+import { getFeaturedDishList } from '@/pages-store/service'
+import { appCollectCollectPost } from '@/service'
+import { CollectionType } from '@/constant/enums'
+import { useConfigStore } from '@/store'
+import { formatSalesCount } from '@/utils/utils'
+import {
+  getFeaturedDishImage,
+  getFeaturedDishPromoLabel,
+  isFeaturedDishSoldOut,
+  parseFeaturedDishListRes,
+} from '@/utils/featuredDish'
+import type { FeaturedDishQueryBody, RouteQueryMap } from '../utils/featured-dish-query'
+
+const props = defineProps<{
+  buildQuery: (routeQuery?: RouteQueryMap) => FeaturedDishQueryBody
+  routeQuery?: RouteQueryMap
+  pageTitle?: string
+}>()
+
+const { t } = useI18n()
+const configStore = useConfigStore()
+
+const paging = ref<ZPagingInstance | null>(null)
+const dataList = ref<Record<string, unknown>[]>([])
+
+async function onQuery(pageNum: number, pageSize: number) {
+  try {
+    const filterBody = props.buildQuery(props.routeQuery)
+    const res = await getFeaturedDishList({
+      pageNum,
+      pageSize,
+      ...filterBody,
+    })
+    const { rows, total } = parseFeaturedDishListRes(res)
+    await paging.value?.completeByTotal(rows, total)
+  } catch {
+    await paging.value?.complete(false)
+  }
+}
+
+const featuredDishColumns = computed(() => {
+  const list = dataList.value
+  return [
+    list.filter((_, i) => i % 2 === 0),
+    list.filter((_, i) => i % 2 === 1),
+  ]
+})
+
+function navigateToDishes(item: Record<string, unknown>) {
+  uni.navigateTo({
+    url: `/pages-store/pages/store/dishes?id=${item.id}&storeId=${item.merchantId}`,
+  })
+}
+
+const collectDish = debounce(
+  1300,
+  (item: Record<string, unknown>) => {
+    appCollectCollectPost({
+      body: {
+        targetId: String(item.id),
+        targetType: CollectionType.DISH,
+      },
+    }).then(() => {
+      item.isCollect = !item.isCollect
+    })
+  },
+  { atBegin: true },
+)
+
+defineExpose({
+  refresh: () => paging.value?.refresh(),
+})
+</script>
+
+<template>
+  <z-paging
+    ref="paging"
+    v-model="dataList"
+    bg-color="#f2f2f2"
+    :auto="true"
+    @query="onQuery"
+  >
+    <template #top>
+      <navbar :title="pageTitle || ''" />
+    </template>
+
+    <view class="featured-dishes-section px-24rpx pb-40rpx pt-16rpx">
+      <view class="waterfall-row flex gap-16rpx items-start">
+        <view
+          v-for="(col, colIndex) in featuredDishColumns"
+          :key="colIndex"
+          class="waterfall-col flex-1 min-w-0 flex flex-col gap-16rpx"
+        >
+          <view
+            v-for="item in col"
+            :key="String(item.id ?? item.merchantId) + '-' + String(item.dishName)"
+            class="featured-dish-card w-full"
+            @click="navigateToDishes(item)"
+          >
+            <view class="featured-dish-image">
+              <view v-if="item.isNew == 1" class="dish-new-ribbon">
+                <text class="dish-new-ribbon__text">NEW</text>
+              </view>
+              <image
+                :src="getFeaturedDishImage(item)"
+                mode="aspectFill"
+                class="featured-dish-img"
+              />
+              <view
+                v-if="isFeaturedDishSoldOut(item.stock)"
+                class="featured-dish-sold-dim"
+              />
+              <image
+                v-if="isFeaturedDishSoldOut(item.stock)"
+                src="/static/app/images/SoldOut.png"
+                mode="aspectFill"
+                class="featured-dish-sold-overlay"
+              />
+              <view
+                class="featured-dish-collect w-56rpx h-56rpx absolute z-4 top-12rpx right-12rpx center"
+                @click.stop="collectDish(item)"
+              >
+                <image
+                  v-if="!item.isCollect"
+                  src="@img-store/1334.png"
+                  mode="aspectFill"
+                  class="w-44rpx h-44rpx featured-dish-collect-icon"
+                />
+                <image
+                  v-else
+                  src="@img-store/1337.png"
+                  mode="aspectFill"
+                  class="w-44rpx h-44rpx featured-dish-collect-icon"
+                />
+              </view>
+            </view>
+            <view class="featured-dish-body">
+              <view class="featured-dish-meta flex items-start justify-between gap-12rpx mb-14rpx">
+                <view class="min-w-0 flex-1">
+                  <text class="featured-dish-price">US${{ item.originalPrice }}</text>
+                </view>
+                <text class="featured-dish-sales shrink-0">
+                  {{ t('pages-store.store.sales') }}: {{ formatSalesCount(item.salesCount) }}
+                </text>
+              </view>
+              <view class="featured-dish-title line-clamp-2 mb-16rpx">
+                {{ item.dishName }}
+              </view>
+              <view class="flex items-center justify-between gap-12rpx">
+                <view
+                  v-if="Number(item.memberPrice) > 0"
+                  class="featured-dish-member shrink min-w-0"
+                >
+                  <text class="featured-dish-member-inner">
+                    {{ t('pages-store.store.members') }}: US${{ item.memberPrice }}
+                  </text>
+                </view>
+                <view v-else class="flex-1 min-w-0"></view>
+                <view class="featured-dish-add shrink-0">
+                  <image src="/static/app/images/add_cart.png" class="featured-dish-add__icon" />
+                </view>
+              </view>
+              <view
+                v-if="getFeaturedDishPromoLabel(item)"
+                class="featured-dish-promo mt-16rpx"
+              >
+                <text class="featured-dish-promo-text">{{ getFeaturedDishPromoLabel(item) }}</text>
+              </view>
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+
+    <template #bottom>
+      <view class="h-24rpx"></view>
+      <view :style="[configStore.iosSafeBottomPlaceholder]"></view>
+    </template>
+  </z-paging>
+</template>
+
+<style scoped lang="scss">
+.featured-dish-collect-icon {
+  filter: drop-shadow(0 2rpx 6rpx rgba(0, 0, 0, 0.18));
+}
+
+.featured-dish-image {
+  position: relative;
+  width: 100%;
+  height: 0;
+  padding-bottom: 100%;
+  background: #f0f0f0;
+  overflow: hidden;
+}
+
+.featured-dish-img {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  display: block;
+  z-index: 1;
+}
+
+.featured-dish-sold-dim {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 2;
+  background: rgba(201, 197, 197, 0.6);
+  pointer-events: none;
+}
+
+.featured-dish-sold-overlay {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  width: 140rpx;
+  height: 140rpx;
+  z-index: 3;
+  pointer-events: none;
+}
+
+.featured-dish-card {
+  background: #fff;
+  border-radius: 24rpx;
+  overflow: hidden;
+  box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.06);
+}
+
+.featured-dish-body {
+  padding: 20rpx 20rpx 22rpx;
+}
+
+.featured-dish-price {
+  color: #e02e24;
+  font-size: 32rpx;
+  font-weight: 600;
+  line-height: 1.2;
+}
+
+.featured-dish-sales {
+  color: #999;
+  font-size: 24rpx;
+  line-height: 1.35;
+  max-width: 48%;
+  text-align: right;
+}
+
+.featured-dish-title {
+  color: #1a1a1a;
+  font-size: 28rpx;
+  font-weight: 500;
+  line-height: 1.45;
+}
+
+.featured-dish-member {
+  display: inline-flex;
+  align-items: center;
+  max-width: calc(100% - 88rpx);
+}
+
+.featured-dish-member-inner {
+  display: inline-block;
+  padding: 6rpx 18rpx;
+  border-radius: 999rpx;
+  background: linear-gradient(180deg, #fff5eb 0%, #ffe8d6 100%);
+  color: #c45c1a;
+  font-size: 24rpx;
+  font-weight: 500;
+  line-height: 1.35;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.featured-dish-add {
+  flex-shrink: 0;
+}
+
+.featured-dish-add__icon {
+  width: 56rpx;
+  height: 56rpx;
+  display: block;
+}
+
+.featured-dish-promo {
+  padding: 12rpx 16rpx;
+  border-radius: 12rpx;
+  background: #fff0f0;
+}
+
+.featured-dish-promo-text {
+  color: #e02e24;
+  font-size: 22rpx;
+  font-weight: 500;
+  line-height: 1.4;
+}
+
+.dish-new-ribbon {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 184rpx;
+  height: 184rpx;
+  overflow: hidden;
+  z-index: 5;
+  pointer-events: none;
+
+  &__text {
+    position: absolute;
+    top: 26rpx;
+    left: -66rpx;
+    width: 240rpx;
+    text-align: center;
+    font-size: 22rpx;
+    font-weight: 700;
+    color: #fff;
+    letter-spacing: 2rpx;
+    line-height: 44rpx;
+    background: #e23636;
+    transform: rotate(-45deg);
+  }
+}
+</style>

src/pages-store/pages/dishes/components/featured-dish-waterfall.vue

@@ -0,0 +1,300 @@
+<script setup lang="ts">
+import { computed } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { debounce } from 'throttle-debounce'
+import usePage from '@/hooks/usePage'
+import { getFeaturedDishList } from '@/pages-store/service'
+import { appCollectCollectPost } from '@/service'
+import { CollectionType } from '@/constant/enums'
+import { formatSalesCount } from '@/utils/utils'
+import type { FeaturedDishQueryBody, RouteQueryMap } from '../utils/featured-dish-query'
+
+const props = defineProps<{
+  buildQuery: (routeQuery?: RouteQueryMap) => FeaturedDishQueryBody
+  routeQuery?: RouteQueryMap
+}>()
+
+const { t } = useI18n()
+
+function isSoldOutStock(stockLike: unknown) {
+  const n = Number(stockLike)
+  return !Number.isNaN(n) && n <= 0
+}
+
+function getDishPromoLabel(item: Record<string, unknown>): string {
+  const raw = item.marketingLabel ?? item.hotSaleTag ?? item.rankTag ?? item.promotionLabel
+  return typeof raw === 'string' && raw.trim() ? raw.trim() : ''
+}
+
+function dishImageSrc(item: Record<string, unknown>) {
+  const url = item.dishImageUrl ?? item.dishImage
+  if (typeof url === 'string' && url) return url.split(',')[0]
+  return ''
+}
+
+const { paging, dataList, queryList } = usePage((pageNum, pageSize) => {
+  const body = props.buildQuery(props.routeQuery)
+  return getFeaturedDishList({
+    pageNum,
+    pageSize,
+    ...body,
+  }).then((res: { rows?: unknown[]; total?: number }) => ({
+    rows: res?.rows ?? [],
+    total: res?.total ?? 0,
+  }))
+})
+
+const featuredDishColumns = computed(() => {
+  const list = dataList.value as Record<string, unknown>[]
+  return [
+    list.filter((_, i) => i % 2 === 0),
+    list.filter((_, i) => i % 2 === 1),
+  ]
+})
+
+function navigateToDishes(item: Record<string, unknown>) {
+  uni.navigateTo({
+    url: `/pages-store/pages/store/dishes?id=${item.id}&storeId=${item.merchantId}`,
+  })
+}
+
+const collectDish = debounce(
+  1300,
+  (item: Record<string, unknown>) => {
+    appCollectCollectPost({
+      body: {
+        targetId: String(item.id),
+        targetType: CollectionType.DISH,
+      },
+    }).then(() => {
+      item.isCollect = !item.isCollect
+    })
+  },
+  { atBegin: true },
+)
+
+defineExpose({
+  refresh: () => paging.value?.refresh(),
+})
+</script>
+
+<template>
+  <z-paging
+    ref="paging"
+    v-model="dataList"
+    :fixed="false"
+    :auto="true"
+    bg-color="#f2f2f2"
+    @query="queryList"
+  >
+    <view class="featured-dishes-section px-24rpx pb-40rpx pt-16rpx">
+      <view class="waterfall-row flex gap-16rpx items-start">
+        <view
+          v-for="(col, colIndex) in featuredDishColumns"
+          :key="colIndex"
+          class="waterfall-col flex-1 min-w-0 flex flex-col gap-16rpx"
+        >
+          <view
+            v-for="item in col"
+            :key="String(item.id ?? item.merchantId) + '-' + String(item.dishName)"
+            class="featured-dish-card w-full"
+            @click="navigateToDishes(item)"
+          >
+            <view class="featured-dish-image">
+              <view v-if="item.isNew == 1" class="dish-new-ribbon">
+                <text class="dish-new-ribbon__text">NEW</text>
+              </view>
+              <image
+                :src="dishImageSrc(item)"
+                mode="aspectFill"
+                class="featured-dish-img"
+              />
+              <view
+                v-if="isSoldOutStock(item.stock)"
+                class="featured-dish-sold-dim"
+              />
+              <image
+                v-if="isSoldOutStock(item.stock)"
+                src="/static/app/images/SoldOut.png"
+                mode="aspectFill"
+                class="featured-dish-sold-overlay"
+              />
+              <view
+                class="featured-dish-collect w-56rpx h-56rpx absolute z-4 top-12rpx right-12rpx center"
+                @click.stop="collectDish(item)"
+              >
+                <image
+                  v-if="!item.isCollect"
+                  src="@img-store/1334.png"
+                  mode="aspectFill"
+                  class="w-44rpx h-44rpx featured-dish-collect-icon"
+                />
+                <image
+                  v-else
+                  src="@img-store/1337.png"
+                  mode="aspectFill"
+                  class="w-44rpx h-44rpx featured-dish-collect-icon"
+                />
+              </view>
+            </view>
+            <view class="featured-dish-body">
+              <view class="featured-dish-meta flex items-start justify-between gap-12rpx mb-14rpx">
+                <view class="min-w-0 flex-1">
+                  <text class="featured-dish-price">US${{ item.originalPrice }}</text>
+                </view>
+                <text class="featured-dish-sales shrink-0">
+                  {{ t('pages-store.store.sales') }}: {{ formatSalesCount(item.salesCount) }}
+                </text>
+              </view>
+              <view class="featured-dish-title line-clamp-2 mb-16rpx">
+                {{ item.dishName }}
+              </view>
+              <view class="flex items-center justify-between gap-12rpx">
+                <view
+                  v-if="Number(item.memberPrice) > 0"
+                  class="featured-dish-member shrink min-w-0"
+                >
+                  <text class="featured-dish-member-inner">
+                    {{ t('pages-store.store.members') }}: US${{ item.memberPrice }}
+                  </text>
+                </view>
+                <view v-else class="flex-1 min-w-0"></view>
+                <view class="featured-dish-add shrink-0">
+                  <image src="/static/app/images/add_cart.png" class="featured-dish-add__icon" />
+                </view>
+              </view>
+              <view
+                v-if="getDishPromoLabel(item)"
+                class="featured-dish-promo mt-16rpx"
+              >
+                <text class="featured-dish-promo-text">{{ getDishPromoLabel(item) }}</text>
+              </view>
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+  </z-paging>
+</template>
+
+<style scoped lang="scss">
+.featured-dish-collect-icon {
+  filter: drop-shadow(0 2rpx 6rpx rgba(0, 0, 0, 0.18));
+}
+
+.featured-dish-image {
+  position: relative;
+  width: 100%;
+  height: 0;
+  padding-bottom: 100%;
+  background: #f0f0f0;
+  overflow: hidden;
+}
+
+.featured-dish-img {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  display: block;
+  z-index: 1;
+}
+
+.featured-dish-sold-dim {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 2;
+  background: rgba(201, 197, 197, 0.6);
+  pointer-events: none;
+}
+
+.featured-dish-sold-overlay {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  width: 140rpx;
+  height: 140rpx;
+  z-index: 3;
+  pointer-events: none;
+}
+
+.featured-dish-card {
+  background: #fff;
+  border-radius: 24rpx;
+  overflow: hidden;
+  box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.06);
+}
+
+.featured-dish-body {
+  padding: 20rpx 20rpx 22rpx;
+}
+
+.featured-dish-price {
+  color: #e02e24;
+  font-size: 32rpx;
+  font-weight: 600;
+  line-height: 1.2;
+}
+
+.featured-dish-sales {
+  color: #999;
+  font-size: 24rpx;
+  line-height: 1.35;
+  max-width: 48%;
+  text-align: right;
+}
+
+.featured-dish-title {
+  color: #1a1a1a;
+  font-size: 28rpx;
+  font-weight: 500;
+  line-height: 1.35;
+}
+
+.featured-dish-member-inner {
+  font-size: 22rpx;
+  color: #ce7138;
+}
+
+.featured-dish-member {
+  padding: 4rpx 12rpx;
+  background: rgba(206, 113, 56, 0.1);
+  border-radius: 8rpx;
+}
+
+.featured-dish-add {
+  flex-shrink: 0;
+}
+
+.featured-dish-add__icon {
+  width: 52rpx;
+  height: 52rpx;
+  display: block;
+}
+
+.featured-dish-promo-text {
+  font-size: 22rpx;
+  color: #666;
+}
+
+.dish-new-ribbon {
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 4;
+  padding: 6rpx 16rpx;
+  background: linear-gradient(135deg, #ff6b35, #e02e24);
+  border-radius: 0 0 16rpx 0;
+}
+
+.dish-new-ribbon__text {
+  font-size: 20rpx;
+  font-weight: 700;
+  color: #fff;
+  letter-spacing: 0.05em;
+}
+</style>

src/pages-store/pages/dishes/components/topic-fresh-seafood-today.vue

@@ -0,0 +1,17 @@
+<script setup lang="ts">
+import FeaturedDishTopicPage from './featured-dish-topic-page.vue'
+import { buildFreshSeafoodTodayQuery, type RouteQueryMap } from '../utils/featured-dish-query'
+
+defineProps<{
+  routeQuery?: RouteQueryMap
+  pageTitle?: string
+}>()
+</script>
+
+<template>
+  <featured-dish-topic-page
+    :build-query="buildFreshSeafoodTodayQuery"
+    :page-title="pageTitle"
+    :route-query="routeQuery"
+  />
+</template>

src/pages-store/pages/dishes/components/topic-live-seafood-air.vue

@@ -0,0 +1,17 @@
+<script setup lang="ts">
+import FeaturedDishTopicPage from './featured-dish-topic-page.vue'
+import { buildLiveSeafoodAirQuery, type RouteQueryMap } from '../utils/featured-dish-query'
+
+defineProps<{
+  routeQuery?: RouteQueryMap
+  pageTitle?: string
+}>()
+</script>
+
+<template>
+  <featured-dish-topic-page
+    :build-query="buildLiveSeafoodAirQuery"
+    :page-title="pageTitle"
+    :route-query="routeQuery"
+  />
+</template>

src/pages-store/pages/dishes/components/topic-member-zone.vue

@@ -0,0 +1,17 @@
+<script setup lang="ts">
+import FeaturedDishTopicPage from './featured-dish-topic-page.vue'
+import { buildMemberZoneQuery, type RouteQueryMap } from '../utils/featured-dish-query'
+
+defineProps<{
+  routeQuery?: RouteQueryMap
+  pageTitle?: string
+}>()
+</script>
+
+<template>
+  <featured-dish-topic-page
+    :build-query="buildMemberZoneQuery"
+    :page-title="pageTitle"
+    :route-query="routeQuery"
+  />
+</template>

src/pages-store/pages/dishes/components/topic-must-eat-list.vue

@@ -0,0 +1,505 @@
+<script setup lang="ts">
+import { computed, onMounted, ref } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { appMerchantFeaturedListPost, appRecipeCategoryListGet } from '@/service'
+import { getFeaturedDishList } from '@/pages-store/service'
+import { useUserStore, useConfigStore } from '@/store'
+import SearchDishResultItem from '@/pages/search/components/search-dish-result-item.vue'
+import { buildMustEatListQuery, type RouteQueryMap } from '../utils/featured-dish-query'
+import { parseFeaturedDishListRes } from '@/utils/featuredDish'
+
+type MustEatTab = 'merchant' | 'dish'
+type RecipeCategoryItem = { id?: string | number; categoryName?: string }
+
+const props = defineProps<{
+  routeQuery?: RouteQueryMap
+  pageTitle?: string
+}>()
+
+const { t } = useI18n()
+const userStore = useUserStore()
+const configStore = useConfigStore()
+
+const activeTab = ref<MustEatTab>('merchant')
+const tabIndex = ref(0)
+
+const tabs = computed(() => [
+  { label: t('pages.home.mustEatListTabs.merchant'), value: 'merchant' as MustEatTab },
+  { label: t('pages.home.mustEatListTabs.dish'), value: 'dish' as MustEatTab },
+])
+
+const paging = ref<ZPagingInstance | null>(null)
+const dataList = ref<Record<string, unknown>[]>([])
+const merchantSourceList = ref<Record<string, unknown>[]>([])
+const recipeCategoryList = ref<RecipeCategoryItem[]>([])
+const activeCategoryId = ref<string | number>('')
+
+const categoryTabs = computed(() => [
+  { id: '' as const, name: t('pages.home.mustEatListTabs.all') },
+  ...recipeCategoryList.value.map((c) => ({
+    id: c.id ?? '',
+    name: String(c.categoryName ?? ''),
+  })),
+])
+
+const activeCategoryIndex = computed(() => {
+  const idx = categoryTabs.value.findIndex(
+    (c) => String(c.id) === String(activeCategoryId.value),
+  )
+  return idx >= 0 ? idx : 0
+})
+
+onMounted(() => {
+  appRecipeCategoryListGet({}).then((res) => {
+    recipeCategoryList.value = (res.data as RecipeCategoryItem[]) || []
+  })
+})
+
+function onTabChange(index: number) {
+  tabIndex.value = index
+  activeTab.value = tabs.value[index]?.value ?? 'merchant'
+  dataList.value = []
+  paging.value?.reload()
+}
+
+function onCategoryChange(id: string | number) {
+  if (String(activeCategoryId.value) === String(id)) return
+  activeCategoryId.value = id
+  dataList.value = []
+  paging.value?.reload()
+}
+
+function categoryNameById(id: string | number): string {
+  if (id === '' || id == null) return ''
+  const hit = recipeCategoryList.value.find((c) => String(c.id) === String(id))
+  return String(hit?.categoryName ?? '')
+}
+
+function filterMerchantsByCategory(list: Record<string, unknown>[]) {
+  const name = categoryNameById(activeCategoryId.value)
+  if (!name) return list
+  return list.filter((item) => {
+    const zh = item.merchantCategoryNamesZh as string[] | undefined
+    const en = item.merchantCategoryNamesEn as string[] | undefined
+    const names = [...(zh || []), ...(en || [])]
+    return names.some((n) => n.includes(name) || name.includes(n))
+  })
+}
+
+async function onQuery(pageNum: number, pageSize: number) {
+  try {
+    if (activeTab.value === 'merchant') {
+      if (pageNum > 1) {
+        await paging.value?.completeByNoMore([], true)
+        return
+      }
+      const res = await appMerchantFeaturedListPost({
+        body: {
+          lat: userStore.userLocation.latitude,
+          lng: userStore.userLocation.longitude,
+        },
+      })
+      const list = Array.isArray((res as { data?: unknown[] })?.data)
+        ? ((res as { data: unknown[] }).data as Record<string, unknown>[])
+        : []
+      merchantSourceList.value = list
+      const filtered = filterMerchantsByCategory(list)
+      await paging.value?.completeByTotal(filtered, filtered.length)
+      return
+    }
+
+    const filterBody = buildMustEatListQuery(props.routeQuery)
+    if (activeCategoryId.value !== '' && activeCategoryId.value != null) {
+      filterBody.recipeCategoryId = activeCategoryId.value
+    }
+    const res = await getFeaturedDishList({
+      pageNum,
+      pageSize,
+      ...filterBody,
+    })
+    const { rows, total } = parseFeaturedDishListRes(res)
+    await paging.value?.completeByTotal(rows, total)
+  } catch {
+    await paging.value?.complete(false)
+  }
+}
+
+function merchantImagePair(item: Record<string, unknown>): [string, string] {
+  const shop = String(item.shopImages ?? '')
+    .split(',')
+    .map((s) => s.trim())
+    .filter(Boolean)
+  const logo = String(item.logo ?? '').trim()
+  let a = shop[0] || logo || ''
+  let b = shop[1] || shop[0] || logo || ''
+  if (!a && !b) return ['', '']
+  if (!b) b = a
+  if (!a) a = b
+  return [a, b]
+}
+
+function merchantCategoryLine(item: Record<string, unknown>): string {
+  const zh = item.merchantCategoryNamesZh as string[] | undefined
+  const en = item.merchantCategoryNamesEn as string[] | undefined
+  if (uni.getLocale() === 'zh-Hans' && zh?.length) return zh[0] || ''
+  if (en?.length) return en[0] || ''
+  if (zh?.length) return zh[0] || ''
+  return ''
+}
+
+function ratingStars(rating?: unknown) {
+  return Math.min(5, Math.max(0, Math.round(Number(rating) || 0)))
+}
+
+function ratingText(rating?: unknown) {
+  const n = Number(rating)
+  return Number.isFinite(n) ? n.toFixed(1) : '0.0'
+}
+
+function openMerchant(item: Record<string, unknown>) {
+  if (item?.id == null) return
+  uni.navigateTo({
+    url: `/pages-store/pages/store/index?id=${item.id}`,
+  })
+}
+</script>
+
+<template>
+  <z-paging
+    ref="paging"
+    v-model="dataList"
+    bg-color="#f2f2f2"
+    :auto="true"
+    @query="onQuery"
+  >
+    <template #top>
+      <navbar :title="pageTitle || ''" />
+      <view class="must-eat-tabbar">
+        <view class="must-eat-segment">
+          <view
+            class="must-eat-segment__thumb"
+            :style="{ transform: `translateX(${tabIndex * 100}%)` }"
+          />
+          <view
+            v-for="(tab, index) in tabs"
+            :key="tab.value"
+            class="must-eat-segment__item"
+            :class="{ 'must-eat-segment__item--on': tabIndex === index }"
+            @click="onTabChange(index)"
+          >
+            <text class="must-eat-segment__text">{{ tab.label }}</text>
+          </view>
+        </view>
+
+        <scroll-view
+          class="must-eat-categories"
+          scroll-x
+          :show-scrollbar="false"
+          enable-flex
+        >
+          <view class="must-eat-categories__track">
+            <view
+              v-for="(cat, index) in categoryTabs"
+              :key="String(cat.id === '' ? 'all' : cat.id)"
+              class="must-eat-categories__item"
+              :class="{
+                'must-eat-categories__item--on': activeCategoryIndex === index,
+              }"
+              @click="onCategoryChange(cat.id)"
+            >
+              <text class="must-eat-categories__text">{{ cat.name }}</text>
+              <view
+                v-if="activeCategoryIndex === index"
+                class="must-eat-categories__line"
+              />
+            </view>
+            <view class="must-eat-categories__tail" />
+          </view>
+        </scroll-view>
+      </view>
+    </template>
+
+    <!-- 商家：精选商家，一行一条（同 home-store 卡片） -->
+    <view v-if="activeTab === 'merchant'" class="must-eat-list px-24rpx pb-40rpx pt-8rpx">
+      <view
+        v-for="(item, index) in dataList"
+        :key="String(item.id ?? index)"
+        class="merchant-card"
+        @click="openMerchant(item)"
+      >
+        <view class="merchant-card__imgs">
+          <view
+            v-for="(src, ii) in merchantImagePair(item)"
+            :key="ii"
+            class="merchant-card__img-slot"
+            :class="
+              ii === 0
+                ? 'merchant-card__img-slot--first'
+                : 'merchant-card__img-slot--last'
+            "
+          >
+            <image
+              v-if="src"
+              class="merchant-card__img"
+              :src="src"
+              mode="aspectFill"
+            />
+            <view v-else class="merchant-card__img merchant-card__img--empty" />
+          </view>
+        </view>
+        <view class="merchant-card__body">
+          <text class="merchant-card__name">{{ item.merchantName }}</text>
+          <text
+            v-if="merchantCategoryLine(item)"
+            class="merchant-card__cate"
+          >{{ merchantCategoryLine(item) }}</text>
+          <view class="merchant-card__rating">
+            <text
+              v-for="si in [1, 2, 3, 4, 5]"
+              :key="si"
+              class="merchant-card__star"
+              :class="{
+                'merchant-card__star--on': si <= ratingStars(item.rating),
+              }"
+            >★</text>
+            <text class="merchant-card__score">{{ ratingText(item.rating) }}</text>
+          </view>
+          <text class="merchant-card__tag">{{ t('pages.home.brandTag') }}</text>
+        </view>
+        <view class="merchant-card__go" @click.stop="openMerchant(item)">
+          <view class="i-carbon:chevron-right merchant-card__go-icon"></view>
+        </view>
+      </view>
+    </view>
+
+    <!-- 商品：销量排序，一行一条 -->
+    <view v-else class="must-eat-dish-list pb-40rpx pt-8rpx">
+      <search-dish-result-item
+        v-for="item in dataList"
+        :key="String(item.id ?? item.merchantId)"
+        :item="item as any"
+      />
+    </view>
+
+    <template #bottom>
+      <view class="h-24rpx"></view>
+      <view :style="[configStore.iosSafeBottomPlaceholder]"></view>
+    </template>
+  </z-paging>
+</template>
+
+<style scoped lang="scss">
+.must-eat-tabbar {
+  background: #fff;
+  padding: 16rpx 24rpx 0;
+}
+
+.must-eat-segment {
+  position: relative;
+  display: flex;
+  align-items: stretch;
+  height: 80rpx;
+  padding: 8rpx;
+  background: #ececec;
+  border-radius: 999rpx;
+  box-sizing: border-box;
+  overflow: hidden;
+}
+
+.must-eat-segment__thumb {
+  position: absolute;
+  left: 8rpx;
+  top: 8rpx;
+  width: calc((100% - 16rpx) / 2);
+  height: calc(100% - 16rpx);
+  background: #fff;
+  border-radius: 999rpx;
+  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.08);
+  transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
+  z-index: 0;
+}
+
+.must-eat-segment__item {
+  position: relative;
+  z-index: 1;
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.must-eat-segment__text {
+  font-size: 28rpx;
+  color: #666;
+  font-weight: 500;
+  line-height: 1.2;
+  transition: color 0.2s, font-weight 0.2s;
+}
+
+.must-eat-segment__item--on .must-eat-segment__text {
+  color: #14181b;
+  font-weight: 600;
+}
+
+.must-eat-categories {
+  width: 100%;
+  margin-top: 8rpx;
+  white-space: nowrap;
+}
+
+.must-eat-categories__track {
+  display: inline-flex;
+  align-items: flex-end;
+  min-width: 100%;
+  padding: 8rpx 0 4rpx;
+}
+
+.must-eat-categories__item {
+  position: relative;
+  flex-shrink: 0;
+  display: inline-flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 16rpx 28rpx 14rpx;
+}
+
+.must-eat-categories__item--on {
+  padding-bottom: 10rpx;
+}
+
+.must-eat-categories__text {
+  font-size: 28rpx;
+  color: #999;
+  font-weight: 400;
+  line-height: 1.3;
+  white-space: nowrap;
+}
+
+.must-eat-categories__item--on .must-eat-categories__text {
+  color: #14181b;
+  font-weight: 700;
+}
+
+.must-eat-categories__line {
+  margin-top: 10rpx;
+  width: 40rpx;
+  height: 6rpx;
+  background: #14181b;
+  border-radius: 6rpx;
+}
+
+.must-eat-categories__tail {
+  flex-shrink: 0;
+  width: 24rpx;
+  height: 1rpx;
+}
+
+.merchant-card {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  background: #fff;
+  border-radius: 24rpx;
+  padding: 24rpx;
+  margin-bottom: 20rpx;
+  box-shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.06);
+}
+
+.merchant-card__imgs {
+  display: flex;
+  flex-direction: column;
+  gap: 12rpx;
+  width: 152rpx;
+  flex-shrink: 0;
+}
+
+.merchant-card__img-slot {
+  width: 152rpx;
+  height: 96rpx;
+  overflow: hidden;
+  background: #e8eaed;
+}
+
+.merchant-card__img-slot--first {
+  border-radius: 12rpx 12rpx 0 0;
+}
+
+.merchant-card__img-slot--last {
+  border-radius: 0 0 12rpx 12rpx;
+}
+
+.merchant-card__img {
+  width: 100%;
+  height: 100%;
+  display: block;
+}
+
+.merchant-card__body {
+  flex: 1;
+  min-width: 0;
+  padding: 0 20rpx 0 8rpx;
+}
+
+.merchant-card__name {
+  font-size: 30rpx;
+  font-weight: 600;
+  color: #14181b;
+  line-height: 1.35;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.merchant-card__cate {
+  margin-top: 8rpx;
+  font-size: 26rpx;
+  color: #333;
+  display: block;
+}
+
+.merchant-card__rating {
+  margin-top: 12rpx;
+  display: flex;
+  align-items: center;
+  gap: 4rpx;
+}
+
+.merchant-card__star {
+  font-size: 22rpx;
+  color: #e0e0e0;
+}
+
+.merchant-card__star--on {
+  color: #ffb400;
+}
+
+.merchant-card__score {
+  margin-left: 8rpx;
+  font-size: 24rpx;
+  color: #666;
+}
+
+.merchant-card__tag {
+  margin-top: 10rpx;
+  font-size: 22rpx;
+  color: #ce7138;
+}
+
+.merchant-card__go {
+  width: 48rpx;
+  height: 48rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+}
+
+.merchant-card__go-icon {
+  font-size: 36rpx;
+  color: #999;
+}
+
+.must-eat-dish-list {
+  background: #fff;
+}
+</style>

src/pages-store/pages/dishes/components/topic-new-calendar.vue

@@ -0,0 +1,24 @@
+<script setup lang="ts">
+import { computed } from 'vue'
+import { useI18n } from 'vue-i18n'
+import FeaturedDishTopicPage from './featured-dish-topic-page.vue'
+import { buildNewCalendarQuery, type RouteQueryMap } from '../utils/featured-dish-query'
+
+defineProps<{
+  routeQuery?: RouteQueryMap
+  pageTitle?: string
+}>()
+
+const { t } = useI18n()
+
+/** 导航栏固定「今日上新」，不使用路由 categoryName */
+const navTitle = computed(() => t('pages.home.quickTabs.newCalendarNav'))
+</script>
+
+<template>
+  <featured-dish-topic-page
+    :build-query="buildNewCalendarQuery"
+    :page-title="navTitle"
+    :route-query="routeQuery"
+  />
+</template>

src/pages-store/pages/dishes/index.vue

@@ -51,11 +51,16 @@ function navigateTo(url: string) {
     <view class="grid grid-cols-2 gap-x-30rpx gap-y-46rpx px-32rpx">
       <template v-for="(item,index) in dataList">
         <view @click="handleClickDish(item)" class="w-330rpx overflow-hidden">
-          <image
+          <view class="search-result-img-wrap">
-              :src="thumbnailImg(item?.dishImage?.split(',')[0])"
+            <view v-if="item.isNew == 1" class="dish-new-ribbon">
-              class="w-full h-186rpx rounded-24rpx mb-16rpx"
+              <text class="dish-new-ribbon__text">NEW</text>
-              mode="aspectFill"
+            </view>
-          ></image>
+            <image
+                :src="thumbnailImg(item?.dishImage?.split(',')[0])"
+                class="w-full h-186rpx rounded-24rpx"
+                mode="aspectFill"
+            ></image>
+          </view>
           <text class="text-30rpx lh-30rpx text-#333 line-clamp-1 tracking-[.04em] font-500"
           >{{ item.dishName }}</text>
         </view>
@@ -65,5 +70,36 @@ function navigateTo(url: string) {
 </template>
 
 <style scoped lang="scss">
+.search-result-img-wrap {
+  position: relative;
+  overflow: hidden;
+  border-radius: 24rpx;
+  margin-bottom: 16rpx;
+}
 
+.dish-new-ribbon {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 184rpx;
+  height: 184rpx;
+  overflow: hidden;
+  z-index: 5;
+  pointer-events: none;
+
+  &__text {
+    position: absolute;
+    top: 26rpx;
+    left: -66rpx;
+    width: 240rpx;
+    text-align: center;
+    font-size: 22rpx;
+    font-weight: 700;
+    color: #fff;
+    letter-spacing: 2rpx;
+    line-height: 44rpx;
+    background: #E23636;
+    transform: rotate(-45deg);
+  }
+}
 </style>

src/pages-store/pages/dishes/quick-topic.vue

@@ -0,0 +1,93 @@
+<script setup lang="ts">
+import { onLoad, onReady } from '@dcloudio/uni-app'
+import { computed, ref, type Component } from 'vue'
+import { useI18n } from 'vue-i18n'
+import TopicMemberZone from './components/topic-member-zone.vue'
+import TopicLiveSeafoodAir from './components/topic-live-seafood-air.vue'
+import TopicMustEatList from './components/topic-must-eat-list.vue'
+import TopicNewCalendar from './components/topic-new-calendar.vue'
+import TopicFreshSeafoodToday from './components/topic-fresh-seafood-today.vue'
+import type { RouteQueryMap } from './utils/featured-dish-query'
+
+const { t } = useI18n()
+
+const topic = ref('')
+const routeQuery = ref<RouteQueryMap>({})
+
+const VALID_TOPICS = [
+  'member-zone',
+  'live-seafood-air',
+  'must-eat-list',
+  'new-calendar',
+  'fresh-seafood-today',
+] as const
+
+type QuickTopic = (typeof VALID_TOPICS)[number]
+
+const topicComponentMap: Record<QuickTopic, Component> = {
+  'member-zone': TopicMemberZone,
+  'live-seafood-air': TopicLiveSeafoodAir,
+  'must-eat-list': TopicMustEatList,
+  'new-calendar': TopicNewCalendar,
+  'fresh-seafood-today': TopicFreshSeafoodToday,
+}
+
+const topicTitleKeyMap: Record<QuickTopic, string> = {
+  'member-zone': 'pages.home.quickTabs.memberZone',
+  'live-seafood-air': 'pages.home.quickTabs.liveSeafoodAir',
+  'must-eat-list': 'pages.home.quickTabs.mustEatList',
+  'new-calendar': 'pages.home.quickTabs.newCalendar',
+  'fresh-seafood-today': 'pages.home.quickTabs.freshSeafoodToday',
+}
+
+const categoryNameFromRoute = computed(() => {
+  const name = routeQuery.value.categoryName
+  return name ? decodeURIComponent(name) : ''
+})
+
+const pageTitle = computed(() => {
+  if (categoryNameFromRoute.value) return categoryNameFromRoute.value
+  const key = topicTitleKeyMap[topic.value as QuickTopic]
+  return key ? t(key) : ''
+})
+
+const isValidTopic = computed(() =>
+  VALID_TOPICS.includes(topic.value as QuickTopic),
+)
+
+const activeTopicComponent = computed(() => {
+  if (!isValidTopic.value) return null
+  return topicComponentMap[topic.value as QuickTopic] ?? null
+})
+
+onLoad((query?: Record<string, string | undefined>) => {
+  topic.value = String(query?.topic ?? '')
+  const { topic: _t, ...rest } = query ?? {}
+  routeQuery.value = rest
+})
+
+onReady(() => {
+  if (!isValidTopic.value) {
+    uni.showToast({ title: '参数无效', icon: 'none' })
+    setTimeout(() => uni.navigateBack(), 1500)
+  }
+})
+</script>
+
+<template>
+  <view class="quick-topic-root">
+    <component
+      v-if="activeTopicComponent"
+      :is="activeTopicComponent"
+      :page-title="pageTitle"
+      :route-query="routeQuery"
+    />
+  </view>
+</template>
+
+<style scoped lang="scss">
+.quick-topic-root {
+  min-height: 100vh;
+  height: 100vh;
+}
+</style>

src/pages-store/pages/dishes/utils/featured-dish-query.ts

@@ -0,0 +1,93 @@
+/** 精选菜品列表 POST body，见 docs/app-featured-dish-list.md */
+export type FeaturedDishQueryBody = {
+  operationalEntry?: string
+  hasMemberPrice?: any
+  stockMin?: any
+  stockMax?: any
+  recipeCategoryId?: any
+  createBeginTime?: any
+  createEndTime?: any
+  salesSort?: 'asc' | 'desc'
+  isNew?: any
+}
+
+/** 运营入口固定参数（精选菜品列表 operationalEntry） */
+export const OPERATIONAL_ENTRY = {
+  FEATURED: 'featured',
+  FRESH_SEAFOOD_TODAY: 'fresh-seafood-today',
+  LIMITED_AIR_SEAFOOD: 'limited-air-seafood',
+  NEW_DISH_CALENDAR: 'new-dish-calendar',
+} as const
+
+export type RouteQueryMap = Record<string, string | undefined>
+/** 将 URL 上可选筛选参数合并进 body（分页仍走 query） */
+export function mergeRouteQueryIntoBody(
+  base: FeaturedDishQueryBody,
+  routeQuery: RouteQueryMap = {},
+): FeaturedDishQueryBody {
+  const body: FeaturedDishQueryBody = { ...base }
+  const recipeCategoryId = routeQuery.recipeCategoryId
+  const stockMin = routeQuery.stockMin
+  const stockMax = routeQuery.stockMax
+  const createBeginTime = routeQuery.createBeginTime
+  const createEndTime = routeQuery.createEndTime
+  const hasMemberPrice = routeQuery.hasMemberPrice
+  const salesSort = routeQuery.salesSort
+  const operationalEntry = routeQuery.operationalEntry
+
+  if (operationalEntry != null) body.operationalEntry = operationalEntry
+  if (recipeCategoryId != null) body.recipeCategoryId = recipeCategoryId
+  if (stockMin != null) body.stockMin = stockMin
+  if (stockMax != null) body.stockMax = stockMax
+  if (createBeginTime != null) body.createBeginTime = createBeginTime
+  if (createEndTime != null) body.createEndTime = createEndTime
+  if (hasMemberPrice != null) body.hasMemberPrice = hasMemberPrice
+  if (salesSort === 'asc' || salesSort === 'desc') body.salesSort = salesSort
+
+  return body
+}
+
+/** 会员专区：仅查有会员价菜品 */
+export function buildMemberZoneQuery(routeQuery?: RouteQueryMap): FeaturedDishQueryBody {
+  return mergeRouteQueryIntoBody({ hasMemberPrice: true }, routeQuery)
+}
+
+/** 限量空运活海鲜：固定运营入口 */
+export function buildLiveSeafoodAirQuery(routeQuery?: RouteQueryMap): FeaturedDishQueryBody {
+  return mergeRouteQueryIntoBody(
+    { operationalEntry: OPERATIONAL_ENTRY.LIMITED_AIR_SEAFOOD },
+    routeQuery,
+  )
+}
+
+/** 必吃榜：按销量降序 */
+export function buildMustEatListQuery(routeQuery?: RouteQueryMap): FeaturedDishQueryBody {
+  return mergeRouteQueryIntoBody({ salesSort: 'desc' }, routeQuery)
+}
+
+/** 今日上新/上新日历：运营入口 new-dish-calendar（全量新品，按上架时间倒序） */
+export function buildNewCalendarQuery(routeQuery?: RouteQueryMap): FeaturedDishQueryBody {
+  return mergeRouteQueryIntoBody(
+    { operationalEntry: OPERATIONAL_ENTRY.NEW_DISH_CALENDAR },
+    routeQuery,
+  )
+}
+
+/** 今日现打海鲜：固定运营入口 */
+export function buildFreshSeafoodTodayQuery(routeQuery?: RouteQueryMap): FeaturedDishQueryBody {
+  return mergeRouteQueryIntoBody(
+    { operationalEntry: OPERATIONAL_ENTRY.FRESH_SEAFOOD_TODAY },
+    routeQuery,
+  )
+}
+
+export const TOPIC_QUERY_BUILDERS: Record<
+  string,
+  (routeQuery?: RouteQueryMap) => FeaturedDishQueryBody
+> = {
+  'member-zone': buildMemberZoneQuery,
+  'live-seafood-air': buildLiveSeafoodAirQuery,
+  'must-eat-list': buildMustEatListQuery,
+  'new-calendar': buildNewCalendarQuery,
+  'fresh-seafood-today': buildFreshSeafoodTodayQuery,
+}

src/pages-store/pages/dishes/utils/quick-topic-route.ts

@@ -0,0 +1,59 @@
+/** 首页 tabs-type 对应精选菜品专题 slug（与 quick-topic 子组件一致） */
+export const QUICK_TOPIC_SLUGS = [
+  'member-zone',
+  'live-seafood-air',
+  'must-eat-list',
+  'new-calendar',
+  'fresh-seafood-today',
+] as const
+
+export type QuickTopicSlug = (typeof QUICK_TOPIC_SLUGS)[number]
+
+export function isQuickTopicSlug(value: string): value is QuickTopicSlug {
+  return (QUICK_TOPIC_SLUGS as readonly string[]).includes(value)
+}
+
+/**
+ * 将 /app/merchantCategory/list 单项映射为 quick-topic 的 topic。
+ * 优先读后端字段 topicKey / code / topic；否则按列表顺序与五个专题一一对应。
+ */
+export function resolveQuickTopicFromMerchantCategory(
+  item: Record<string, unknown>,
+  index: number,
+): QuickTopicSlug {
+  const raw = item.topicKey ?? item.code ?? item.topic
+  if (typeof raw === 'string' && isQuickTopicSlug(raw)) {
+    return raw
+  }
+  const safeIndex = index >= 0 && index < QUICK_TOPIC_SLUGS.length ? index : 0
+  return QUICK_TOPIC_SLUGS[safeIndex]
+}
+
+/** 快捷入口 topic 与 operationalEntry 固定映射 */
+export const TOPIC_OPERATIONAL_ENTRY: Partial<Record<QuickTopicSlug, string>> = {
+  'live-seafood-air': 'limited-air-seafood',
+  'new-calendar': 'new-dish-calendar',
+  'fresh-seafood-today': 'fresh-seafood-today',
+}
+
+export function buildQuickTopicUrl(
+  topic: QuickTopicSlug,
+  extra: {
+    merchantCategoryId?: string | number
+    categoryName?: string
+    operationalEntry?: string
+  } = {},
+) {
+  const parts = [`topic=${encodeURIComponent(topic)}`]
+  const operationalEntry = extra.operationalEntry ?? TOPIC_OPERATIONAL_ENTRY[topic]
+  if (operationalEntry) {
+    parts.push(`operationalEntry=${encodeURIComponent(operationalEntry)}`)
+  }
+  if (extra.merchantCategoryId != null && extra.merchantCategoryId !== '') {
+    parts.push(`merchantCategoryId=${encodeURIComponent(String(extra.merchantCategoryId))}`)
+  }
+  if (extra.categoryName) {
+    parts.push(`categoryName=${encodeURIComponent(extra.categoryName)}`)
+  }
+  return `/pages-store/pages/dishes/quick-topic?${parts.join('&')}`
+}

src/pages-store/pages/energy-meal/components/energy-meal-skeleton.vue

@@ -0,0 +1,139 @@
+<template>
+  <view class="energy-meal-skeleton">
+    <view v-for="i in 2" :key="i" class="energy-meal-skeleton__card">
+      <view class="energy-meal-skeleton__head">
+        <view class="energy-meal-skeleton__title skeleton-item"></view>
+        <view class="energy-meal-skeleton__merchant skeleton-item"></view>
+      </view>
+
+      <view
+        v-for="j in 2"
+        :key="j"
+        class="energy-meal-skeleton__row"
+        :class="{ 'energy-meal-skeleton__row--last': j === 2 }"
+      >
+        <view class="energy-meal-skeleton__img skeleton-item"></view>
+        <view class="energy-meal-skeleton__main">
+          <view class="energy-meal-skeleton__name skeleton-item"></view>
+          <view class="energy-meal-skeleton__price skeleton-item"></view>
+          <view class="energy-meal-skeleton__member skeleton-item"></view>
+          <view class="energy-meal-skeleton__sales skeleton-item"></view>
+        </view>
+      </view>
+
+      <view class="energy-meal-skeleton__action">
+        <view class="energy-meal-skeleton__btn skeleton-item"></view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<style scoped lang="scss">
+.skeleton-item {
+  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
+  background-size: 200% 100%;
+  animation: shimmer 1.5s infinite;
+}
+
+@keyframes shimmer {
+  0% {
+    background-position: -200% 0;
+  }
+  100% {
+    background-position: 200% 0;
+  }
+}
+
+.energy-meal-skeleton {
+  padding: 24rpx;
+}
+
+.energy-meal-skeleton__card {
+  margin-bottom: 24rpx;
+  border-radius: 20rpx;
+  background: #fff;
+  overflow: hidden;
+  box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
+}
+
+.energy-meal-skeleton__head {
+  padding: 24rpx 24rpx 8rpx;
+}
+
+.energy-meal-skeleton__title {
+  width: 280rpx;
+  height: 36rpx;
+  border-radius: 8rpx;
+}
+
+.energy-meal-skeleton__merchant {
+  width: 180rpx;
+  height: 28rpx;
+  border-radius: 8rpx;
+  margin-top: 12rpx;
+}
+
+.energy-meal-skeleton__row {
+  display: flex;
+  padding: 28rpx 24rpx;
+  border-bottom: 1rpx solid #ebebeb;
+}
+
+.energy-meal-skeleton__row--last {
+  border-bottom: none;
+}
+
+.energy-meal-skeleton__img {
+  width: 200rpx;
+  height: 200rpx;
+  border-radius: 20rpx;
+  flex-shrink: 0;
+}
+
+.energy-meal-skeleton__main {
+  flex: 1;
+  min-width: 0;
+  margin-left: 24rpx;
+  display: flex;
+  flex-direction: column;
+}
+
+.energy-meal-skeleton__name {
+  width: 100%;
+  height: 72rpx;
+  border-radius: 8rpx;
+}
+
+.energy-meal-skeleton__price {
+  width: 160rpx;
+  height: 32rpx;
+  border-radius: 8rpx;
+  margin-top: 12rpx;
+}
+
+.energy-meal-skeleton__member {
+  width: 320rpx;
+  height: 28rpx;
+  border-radius: 8rpx;
+  margin-top: 12rpx;
+}
+
+.energy-meal-skeleton__sales {
+  width: 180rpx;
+  height: 44rpx;
+  border-radius: 999rpx;
+  margin-top: auto;
+}
+
+.energy-meal-skeleton__action {
+  display: flex;
+  justify-content: flex-end;
+  padding: 8rpx 24rpx 24rpx;
+}
+
+.energy-meal-skeleton__btn {
+  width: 280rpx;
+  height: 72rpx;
+  border-radius: 16rpx;
+}
+</style>

src/pages-store/pages/energy-meal/index.vue

@@ -0,0 +1,436 @@
+<script setup lang="ts">
+import Config from '@/config/index'
+import { useUserStore } from '@/store'
+import EnergyMealSkeleton from './components/energy-meal-skeleton.vue'
+import {
+  appEnergyMealAddCartPost,
+  appEnergyMealListPost,
+  type EnergyMealItemVo,
+  type EnergyMealVo,
+} from '@/service'
+import { formatSalesCount, thumbnailImg } from '@/utils/utils'
+
+const { t } = useI18n()
+const userStore = useUserStore()
+
+const filterMerchantId = ref<string>('')
+const mealList = ref<EnergyMealVo[]>([])
+const paging = ref<ZPagingInstance | null>(null)
+const addingMealId = ref<string | number | null>(null)
+const loading = ref(true)
+
+onLoad((options: Record<string, string | undefined>) => {
+  if (options?.merchantId) {
+    filterMerchantId.value = String(options.merchantId)
+  }
+})
+
+function firstImage(raw?: string) {
+  if (typeof raw !== 'string' || !raw.trim()) return ''
+  return raw.split(',')[0].trim()
+}
+
+function sortedItems(meal: EnergyMealVo): EnergyMealItemVo[] {
+  const list = Array.isArray(meal.itemList) ? [...meal.itemList] : []
+  return list.sort((a, b) => Number(a.sort ?? 0) - Number(b.sort ?? 0))
+}
+
+function canAddMeal(meal: EnergyMealVo) {
+  return sortedItems(meal).some((item) => item.merchantDishVo?.id)
+}
+
+function dishCover(item: EnergyMealItemVo) {
+  return firstImage(item.merchantDishVo?.dishImage)
+}
+
+function dishName(item: EnergyMealItemVo) {
+  const name = String(item.merchantDishVo?.dishName ?? '').trim()
+  const qty = Number(item.quantity) || 1
+  if (!name) return '--'
+  if (qty > 1) {
+    return `${name} × ${qty}`
+  }
+  return name
+}
+
+function dishPrice(item: EnergyMealItemVo) {
+  const dish = item.merchantDishVo ?? {}
+  const discount = Number(dish.discountPrice)
+  const original = Number(dish.originalPrice)
+  if (Number.isFinite(discount) && discount > 0) return discount.toFixed(2)
+  if (Number.isFinite(original) && original > 0) return original.toFixed(2)
+  return '0.00'
+}
+
+function dishOriginalPrice(item: EnergyMealItemVo) {
+  const dish = item.merchantDishVo ?? {}
+  const discount = Number(dish.discountPrice)
+  const original = Number(dish.originalPrice)
+  if (
+    Number.isFinite(original) &&
+    original > 0 &&
+    Number.isFinite(discount) &&
+    original > discount
+  ) {
+    return original.toFixed(2)
+  }
+  return ''
+}
+
+function dishMemberPrice(item: EnergyMealItemVo) {
+  const member = Number(item.merchantDishVo?.memberPrice)
+  return Number.isFinite(member) && member > 0 ? member.toFixed(2) : ''
+}
+
+function openDishDetail(item: EnergyMealItemVo, meal: EnergyMealVo) {
+  const dishId = item.merchantDishVo?.id ?? item.dishId
+  const merchantId = meal.merchantId ?? item.merchantDishVo?.merchantId
+  if (!dishId || !merchantId) return
+  uni.navigateTo({
+    url: `/pages-store/pages/store/dishes?id=${dishId}&storeId=${merchantId}`,
+  })
+}
+
+async function onQuery(pageNum: number, pageSize: number) {
+  if (pageNum === 1) {
+    loading.value = true
+  }
+  try {
+    const body: Record<string, string> = {}
+    if (filterMerchantId.value) {
+      body.merchantId = filterMerchantId.value
+    }
+    const res = await appEnergyMealListPost({
+      params: { pageNum, pageSize },
+      body,
+    })
+    const rows = Array.isArray(res.rows) ? res.rows : []
+    const total = Number(res.total ?? rows.length)
+    await paging.value?.completeByTotal(rows, total)
+  } catch {
+    await paging.value?.complete(false)
+  } finally {
+    if (pageNum === 1) {
+      loading.value = false
+    }
+  }
+}
+
+async function handleAddAllToCart(meal: EnergyMealVo) {
+  if (!userStore.checkLogin()) return
+  if (!meal.id) return
+  if (!canAddMeal(meal)) {
+    uni.showToast({
+      title: t('pages-store.energyMeal.unavailable'),
+      icon: 'none',
+    })
+    return
+  }
+  if (addingMealId.value != null) return
+
+  addingMealId.value = meal.id
+  try {
+    await appEnergyMealAddCartPost({
+      body: {
+        energyMealId: meal.id,
+        count: 1,
+      },
+      options: { hideErrorToast: true },
+    })
+    uni.showToast({
+      title: t('toast.addCartSuccess'),
+      icon: 'none',
+    })
+    userStore.getUserCartAllData()
+  } catch (err: any) {
+    uni.showToast({
+      title: err?.msg || err?.message || t('common.prompt.request-failed-please-try-again-later'),
+      icon: 'none',
+    })
+  } finally {
+    if (addingMealId.value === meal.id) {
+      addingMealId.value = null
+    }
+  }
+}
+</script>
+
+<template>
+  <z-paging
+    ref="paging"
+    v-model="mealList"
+    bg-color="#f2f2f2"
+    :auto="true"
+    :hide-empty-view="loading"
+    @query="onQuery"
+  >
+    <template #top>
+      <navbar :title="t('pages-store.energyMeal.title')" circle-back />
+    </template>
+
+    <view
+      v-show="loading"
+      class="animate-in fade-in animate-ease-out animate-duration-300"
+    >
+      <energy-meal-skeleton />
+    </view>
+
+    <view
+      v-show="!loading"
+      class="animate-in fade-in animate-ease-in animate-duration-300 energy-meal-page"
+    >
+      <view
+        v-for="meal in mealList"
+        :key="meal.id"
+        class="energy-meal-card"
+      >
+        <view v-if="meal.mealName" class="energy-meal-card__head">
+          <text class="energy-meal-card__title line-clamp-1">{{ meal.mealName }}</text>
+          <text
+            v-if="meal.merchant?.merchantName"
+            class="energy-meal-card__merchant line-clamp-1"
+          >
+            {{ meal.merchant.merchantName }}
+          </text>
+        </view>
+
+        <view
+          v-for="(item, index) in sortedItems(meal)"
+          :key="item.id || `${meal.id}-${index}`"
+          class="energy-dish-row"
+          :class="{ 'energy-dish-row--last': index === sortedItems(meal).length - 1 }"
+          @click="openDishDetail(item, meal)"
+        >
+          <view class="energy-dish-row__img-wrap">
+            <image
+              :src="thumbnailImg(dishCover(item))"
+              mode="aspectFill"
+              class="energy-dish-row__img"
+            />
+          </view>
+          <view class="energy-dish-row__main">
+            <text class="energy-dish-row__name line-clamp-2">{{ dishName(item) }}</text>
+            <view class="energy-dish-row__price-row">
+              <text class="energy-dish-row__price-current">${{ dishPrice(item) }}</text>
+              <text
+                v-if="dishOriginalPrice(item)"
+                class="energy-dish-row__price-old"
+              >
+                ${{ dishOriginalPrice(item) }}
+              </text>
+            </view>
+            <view
+              v-if="dishMemberPrice(item)"
+              class="energy-dish-row__member"
+            >
+              <text class="energy-dish-row__member-diamond">◆</text>
+              <text class="energy-dish-row__member-text">
+                {{ Config.appName }} {{ t('pages.search.member-price-line') }}: ${{ dishMemberPrice(item) }}
+              </text>
+            </view>
+            <view class="energy-dish-row__sales-wrap">
+              <text class="energy-dish-row__sales-tag">
+                {{ t('pages.search.weekly-sales') }}：{{ formatSalesCount(item.merchantDishVo?.salesCount) }}
+              </text>
+            </view>
+          </view>
+        </view>
+
+        <view
+          v-if="canAddMeal(meal)"
+          class="energy-meal-card__action"
+        >
+          <view
+            class="energy-meal-card__btn"
+            :class="{ 'energy-meal-card__btn--loading': addingMealId === meal.id }"
+            @click.stop="handleAddAllToCart(meal)"
+          >
+            {{ t('pages-store.energyMeal.addAllToCart') }}
+          </view>
+        </view>
+      </view>
+    </view>
+
+    <template #empty>
+      <view v-if="!loading" class="energy-meal-empty">
+        <image class="energy-meal-empty__img" src="@img/chef/100.png" mode="aspectFit" />
+        <text class="energy-meal-empty__text">{{ t('pages-store.energyMeal.empty') }}</text>
+      </view>
+    </template>
+  </z-paging>
+</template>
+
+<style scoped lang="scss">
+.energy-meal-page {
+  padding: 24rpx;
+}
+
+.energy-meal-card {
+  margin-bottom: 24rpx;
+  border-radius: 20rpx;
+  background: #fff;
+  overflow: hidden;
+  box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
+}
+
+.energy-meal-card__head {
+  padding: 24rpx 24rpx 8rpx;
+}
+
+.energy-meal-card__title {
+  display: block;
+  font-size: 30rpx;
+  line-height: 42rpx;
+  font-weight: 600;
+  color: #1a1a1a;
+}
+
+.energy-meal-card__merchant {
+  display: block;
+  margin-top: 6rpx;
+  font-size: 24rpx;
+  line-height: 34rpx;
+  color: #888;
+}
+
+.energy-dish-row {
+  display: flex;
+  align-items: stretch;
+  padding: 28rpx 24rpx;
+  border-bottom: 1rpx solid #ebebeb;
+}
+
+.energy-dish-row--last {
+  border-bottom: none;
+}
+
+.energy-dish-row__img-wrap {
+  width: 200rpx;
+  height: 200rpx;
+  border-radius: 20rpx;
+  overflow: hidden;
+  flex-shrink: 0;
+  background: #f2f2f2;
+}
+
+.energy-dish-row__img {
+  width: 100%;
+  height: 100%;
+  display: block;
+}
+
+.energy-dish-row__main {
+  flex: 1;
+  min-width: 0;
+  margin-left: 24rpx;
+  display: flex;
+  flex-direction: column;
+}
+
+.energy-dish-row__name {
+  font-size: 28rpx;
+  line-height: 40rpx;
+  font-weight: 500;
+  color: #1a1a1a;
+}
+
+.energy-dish-row__price-row {
+  display: flex;
+  align-items: baseline;
+  flex-wrap: wrap;
+  gap: 12rpx;
+  margin-top: 12rpx;
+}
+
+.energy-dish-row__price-current {
+  font-size: 32rpx;
+  line-height: 36rpx;
+  font-weight: 700;
+  color: #e02e24;
+}
+
+.energy-dish-row__price-old {
+  font-size: 24rpx;
+  line-height: 28rpx;
+  color: #999;
+  text-decoration: line-through;
+}
+
+.energy-dish-row__member {
+  display: flex;
+  align-items: center;
+  gap: 6rpx;
+  margin-top: 12rpx;
+}
+
+.energy-dish-row__member-diamond {
+  font-size: 20rpx;
+  line-height: 1;
+  color: #b8860b;
+}
+
+.energy-dish-row__member-text {
+  font-size: 24rpx;
+  line-height: 32rpx;
+  font-weight: 500;
+  color: #8b6914;
+}
+
+.energy-dish-row__sales-wrap {
+  margin-top: auto;
+  padding-top: 12rpx;
+}
+
+.energy-dish-row__sales-tag {
+  display: inline-block;
+  padding: 8rpx 18rpx;
+  border-radius: 999rpx;
+  background: #f5f5f5;
+  font-size: 22rpx;
+  line-height: 28rpx;
+  color: #888;
+}
+
+.energy-meal-card__action {
+  display: flex;
+  justify-content: flex-end;
+  padding: 8rpx 24rpx 24rpx;
+}
+
+.energy-meal-card__btn {
+  min-width: 280rpx;
+  height: 72rpx;
+  padding: 0 32rpx;
+  border-radius: 16rpx;
+  background: #111;
+  color: #fff;
+  font-size: 28rpx;
+  line-height: 72rpx;
+  font-weight: 500;
+  text-align: center;
+}
+
+.energy-meal-card__btn--loading {
+  opacity: 0.65;
+}
+
+.energy-meal-empty {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 120rpx 48rpx;
+}
+
+.energy-meal-empty__img {
+  width: 250rpx;
+  height: 250rpx;
+}
+
+.energy-meal-empty__text {
+  margin-top: 24rpx;
+  font-size: 28rpx;
+  line-height: 40rpx;
+  color: #8a8a8a;
+}
+</style>

src/pages-store/pages/group-catering/detail.vue

@@ -0,0 +1,295 @@
+<script setup lang="ts">
+import { dayjs } from '@/plugin/index'
+import {
+  appGroupMealReservationCancelPost,
+  appGroupMealReservationIdGet,
+  type GroupMealReservationVo,
+} from '@/service'
+import { useConfigStore } from '@/store'
+import { formatTimestampWithMonthName } from '@/utils/utils'
+import {
+  calcGroupMealEstimatedTotal,
+  canCancelGroupMeal,
+  formatGroupMealMoney,
+} from './utils'
+
+const { t } = useI18n()
+const configStore = useConfigStore()
+
+const reservationId = ref('')
+const loading = ref(true)
+const submitting = ref(false)
+const detail = ref<GroupMealReservationVo>({})
+const cancelReason = ref('')
+
+const estimatedTotal = computed(() =>
+  formatGroupMealMoney(calcGroupMealEstimatedTotal(detail.value)),
+)
+
+const statusText = computed(() => {
+  const status = Number(detail.value.status)
+  const keyMap: Record<number, string> = {
+    1: 'statusPending',
+    2: 'statusContacted',
+    3: 'statusConfirmed',
+    4: 'statusRejected',
+    5: 'statusCompleted',
+    6: 'statusCancelled',
+  }
+  const key = keyMap[status]
+  return key ? t(`pages-store.groupCatering.${key}`) : '--'
+})
+
+const canCancel = computed(() => canCancelGroupMeal(Number(detail.value.status)))
+
+function formatExpectedTime(value?: number) {
+  if (!value) return '--'
+  return formatTimestampWithMonthName(Number(value))
+}
+
+async function loadDetail() {
+  if (!reservationId.value) return
+  loading.value = true
+  try {
+    const res = await appGroupMealReservationIdGet({ id: reservationId.value })
+    detail.value = res.data ?? {}
+  } catch {
+    detail.value = {}
+  } finally {
+    loading.value = false
+  }
+}
+
+async function handleCancel() {
+  if (!canCancel.value || submitting.value || !reservationId.value) return
+  submitting.value = true
+  try {
+    await appGroupMealReservationCancelPost({
+      body: {
+        id: reservationId.value,
+        cancelReason: cancelReason.value.trim() || undefined,
+      },
+    })
+    uni.showToast({
+      title: t('pages-store.groupCatering.cancelSuccess'),
+      icon: 'none',
+    })
+    setTimeout(() => {
+      uni.navigateBack()
+    }, 800)
+  } finally {
+    submitting.value = false
+  }
+}
+
+function confirmCancel() {
+  uni.showModal({
+    title: t('pages-store.groupCatering.cancelTitle'),
+    content: t('pages-store.groupCatering.cancelConfirm'),
+    success: (res) => {
+      if (res.confirm) {
+        handleCancel()
+      }
+    },
+  })
+}
+
+onLoad((query?: Record<string, string | undefined>) => {
+  reservationId.value = String(query?.id ?? '')
+  loadDetail()
+})
+</script>
+
+<template>
+  <view class="group-detail-page">
+    <navbar :title="t('pages-store.groupCatering.detailTitle')" circle-back />
+
+    <view v-if="loading" class="center py-120rpx text-28rpx text-#999">
+      {{ t('common.loading') }}
+    </view>
+
+    <template v-else>
+      <view class="group-detail-page__content px-30rpx pt-20rpx">
+        <view class="group-detail-card">
+          <view class="group-detail-card__head">
+            <text class="group-detail-card__merchant">
+              {{ detail.merchant?.merchantName || '--' }}
+            </text>
+            <text class="group-detail-card__status">{{ statusText }}</text>
+          </view>
+
+          <view class="group-detail-row">
+            <text class="group-detail-row__label">{{ t('pages-store.groupCatering.fieldScene') }}</text>
+            <text class="group-detail-row__value">{{ detail.scene || '--' }}</text>
+          </view>
+          <view class="group-detail-row">
+            <text class="group-detail-row__label">{{ t('pages-store.groupCatering.fieldPeopleCount') }}</text>
+            <text class="group-detail-row__value">{{ detail.peopleCount ?? '--' }}</text>
+          </view>
+          <view class="group-detail-row">
+            <text class="group-detail-row__label">{{ t('pages-store.groupCatering.fieldPerCapitaPrice') }}</text>
+            <text class="group-detail-row__value">${{ formatGroupMealMoney(Number(detail.perCapitaPrice) || 0) }}</text>
+          </view>
+          <view class="group-detail-row">
+            <text class="group-detail-row__label">{{ t('pages-store.groupCatering.fieldEstimatedTotal') }}</text>
+            <text class="group-detail-row__value group-detail-row__value--accent">${{ estimatedTotal }}</text>
+          </view>
+          <view class="group-detail-row">
+            <text class="group-detail-row__label">{{ t('pages-store.groupCatering.fieldExpectedTime') }}</text>
+            <text class="group-detail-row__value">{{ formatExpectedTime(detail.expectedTime) }}</text>
+          </view>
+          <view class="group-detail-row">
+            <text class="group-detail-row__label">{{ t('pages-store.groupCatering.fieldContactName') }}</text>
+            <text class="group-detail-row__value">{{ detail.contactName || '--' }}</text>
+          </view>
+          <view class="group-detail-row">
+            <text class="group-detail-row__label">{{ t('pages-store.groupCatering.fieldContactPhone') }}</text>
+            <text class="group-detail-row__value">{{ detail.contactPhone || '--' }}</text>
+          </view>
+          <view v-if="detail.remark" class="group-detail-row group-detail-row--column">
+            <text class="group-detail-row__label">{{ t('pages-store.groupCatering.fieldRemark') }}</text>
+            <text class="group-detail-row__value">{{ detail.remark }}</text>
+          </view>
+          <view v-if="detail.handleRemark" class="group-detail-row group-detail-row--column">
+            <text class="group-detail-row__label">{{ t('pages-store.groupCatering.fieldHandleRemark') }}</text>
+            <text class="group-detail-row__value">{{ detail.handleRemark }}</text>
+          </view>
+          <view v-if="detail.cancelReason" class="group-detail-row group-detail-row--column">
+            <text class="group-detail-row__label">{{ t('pages-store.groupCatering.fieldCancelReason') }}</text>
+            <text class="group-detail-row__value">{{ detail.cancelReason }}</text>
+          </view>
+        </view>
+
+        <view v-if="canCancel" class="group-detail-card mt-24rpx">
+          <view class="text-28rpx text-#333 font-500 mb-20rpx">
+            {{ t('pages-store.groupCatering.fieldCancelReason') }}
+          </view>
+          <textarea
+            v-model="cancelReason"
+            class="group-detail-textarea"
+            :placeholder="t('pages-store.groupCatering.cancelReasonPlaceholder')"
+            maxlength="200"
+          />
+        </view>
+      </view>
+
+      <view class="h-180rpx" />
+      <view :style="[configStore.iosSafeBottomPlaceholder]" />
+
+      <view
+        v-if="canCancel"
+        class="group-detail-page__footer fixed bottom-0 left-0 right-0 px-30rpx pt-16rpx bg-#fff"
+      >
+        <wd-button
+          custom-class="!h-98rpx !text-30rpx !text-#fff !lh-98rpx !rounded-16rpx"
+          block
+          :loading="submitting"
+          @click="confirmCancel"
+        >
+          {{ t('pages-store.groupCatering.cancelAction') }}
+        </wd-button>
+        <view :style="[configStore.iosSafeBottomPlaceholder]" />
+      </view>
+    </template>
+  </view>
+</template>
+
+<style>
+page {
+  background-color: #f5f5f5;
+}
+</style>
+
+<style scoped lang="scss">
+.group-detail-card {
+  padding: 28rpx;
+  border-radius: 20rpx;
+  background: #fff;
+}
+
+.group-detail-card__head {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 16rpx;
+  margin-bottom: 24rpx;
+}
+
+.group-detail-card__merchant {
+  flex: 1;
+  min-width: 0;
+  font-size: 32rpx;
+  font-weight: 600;
+  color: #333;
+  line-height: 1.4;
+}
+
+.group-detail-card__status {
+  flex-shrink: 0;
+  padding: 6rpx 16rpx;
+  border-radius: 999rpx;
+  background: #fff7ef;
+  color: #ce7138;
+  font-size: 22rpx;
+  line-height: 1.4;
+}
+
+.group-detail-row {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 24rpx;
+  padding: 18rpx 0;
+  border-bottom: 1rpx solid #f3f3f3;
+
+  &:last-child {
+    border-bottom: none;
+  }
+
+  &--column {
+    flex-direction: column;
+    gap: 12rpx;
+  }
+}
+
+.group-detail-row__label {
+  flex-shrink: 0;
+  font-size: 26rpx;
+  color: #888;
+}
+
+.group-detail-row__value {
+  flex: 1;
+  min-width: 0;
+  text-align: right;
+  font-size: 26rpx;
+  color: #333;
+  line-height: 1.5;
+  word-break: break-word;
+
+  &--accent {
+    color: #e02e24;
+    font-weight: 600;
+  }
+}
+
+.group-detail-row--column .group-detail-row__value {
+  text-align: left;
+}
+
+.group-detail-textarea {
+  width: 100%;
+  min-height: 160rpx;
+  padding: 20rpx;
+  box-sizing: border-box;
+  border-radius: 16rpx;
+  background: #f7f7f7;
+  font-size: 26rpx;
+  color: #333;
+  line-height: 1.6;
+}
+
+.group-detail-page__footer {
+  box-shadow: 0 -4rpx 20rpx rgba(0, 0, 0, 0.06);
+}
+</style>

src/pages-store/pages/group-catering/index.vue

@@ -0,0 +1,893 @@
+<script setup lang="ts">
+import { dayjs } from '@/plugin/index'
+import {
+  appGroupMealReservationMyListPost,
+  appGroupMealReservationSubmitPost,
+  appMerchantDetailMerchantIdGet,
+  appMerchantFeaturedListPost,
+  appMerchantNearbyListPost,
+  type GroupMealReservationVo,
+} from '@/service'
+import { useConfigStore, useUserStore } from '@/store'
+import { formatTimestampWithMonthName } from '@/utils/utils'
+import {
+  calcGroupMealEstimatedTotal,
+  canCancelGroupMeal,
+  formatGroupMealMoney,
+} from './utils'
+
+const { t } = useI18n()
+const configStore = useConfigStore()
+const userStore = useUserStore()
+
+type PageTab = 'submit' | 'list'
+const activeTab = ref<PageTab>('submit')
+const submitting = ref(false)
+
+const selectedMerchant = ref<{ id: string; merchantName: string } | null>(null)
+const merchantPickerVisible = ref(false)
+const merchantOptions = ref<Array<{ id: string; merchantName: string }>>([])
+const merchantLoading = ref(false)
+
+const form = ref({
+  peopleCount: '1',
+  perCapitaPrice: '',
+  scene: '',
+  contactName: '',
+  contactPhone: '',
+  remark: '',
+})
+const expectedDate = ref('')
+const expectedTime = ref('')
+
+const sceneOptions = computed(() => [
+  t('pages-store.groupCatering.sceneOptions.company'),
+  t('pages-store.groupCatering.sceneOptions.birthday'),
+  t('pages-store.groupCatering.sceneOptions.school'),
+  t('pages-store.groupCatering.sceneOptions.party'),
+  t('pages-store.groupCatering.sceneOptions.other'),
+])
+
+const estimatedTotal = computed(() => {
+  const people = Number(form.value.peopleCount)
+  const price = Number(form.value.perCapitaPrice)
+  return formatGroupMealMoney(calcGroupMealEstimatedTotal({
+    peopleCount: people,
+    perCapitaPrice: price,
+  }))
+})
+
+const expectedTimeText = computed(() => {
+  if (!expectedDate.value || !expectedTime.value) {
+    return t('pages-store.groupCatering.selectExpectedTime')
+  }
+  return `${expectedDate.value} ${expectedTime.value}`
+})
+
+const PAGE_SIZE = 10
+const reservationList = ref<GroupMealReservationVo[]>([])
+const listLoading = ref(false)
+const listLoadingMore = ref(false)
+const listQueried = ref(false)
+const listPageNum = ref(1)
+const listHasMore = ref(true)
+
+const showListEmpty = computed(
+  () => listQueried.value && !listLoading.value && reservationList.value.length === 0,
+)
+const showListLoading = computed(
+  () => listLoading.value && reservationList.value.length === 0,
+)
+
+function prefillContact() {
+  const info = userStore.userInfo ?? {}
+  const nameParts = [info.firstName, info.lastName].filter(Boolean).join(' ').trim()
+  form.value.contactName = nameParts || String(info.nickName ?? '').trim()
+  const phone = String(info.phone ?? '').trim()
+  const areaCode = String(info.areaCode ?? '').trim()
+  form.value.contactPhone = phone
+    ? `${areaCode ? `${areaCode} ` : ''}${phone}`.trim()
+    : ''
+}
+
+function buildExpectedTimestamp() {
+  if (!expectedDate.value || !expectedTime.value) return 0
+  const ts = dayjs(`${expectedDate.value} ${expectedTime.value}`).valueOf()
+  return Number.isFinite(ts) ? ts : 0
+}
+
+function validateForm() {
+  if (!userStore.checkLogin()) return false
+  if (!selectedMerchant.value?.id) {
+    uni.showToast({ title: t('pages-store.groupCatering.validation.merchant'), icon: 'none' })
+    return false
+  }
+  const peopleCount = Number(form.value.peopleCount)
+  if (!Number.isFinite(peopleCount) || peopleCount <= 0) {
+    uni.showToast({ title: t('pages-store.groupCatering.validation.peopleCount'), icon: 'none' })
+    return false
+  }
+  const perCapitaPrice = Number(form.value.perCapitaPrice)
+  if (!Number.isFinite(perCapitaPrice) || perCapitaPrice < 0) {
+    uni.showToast({ title: t('pages-store.groupCatering.validation.perCapitaPrice'), icon: 'none' })
+    return false
+  }
+  if (!form.value.scene.trim()) {
+    uni.showToast({ title: t('pages-store.groupCatering.validation.scene'), icon: 'none' })
+    return false
+  }
+  if (!form.value.contactName.trim()) {
+    uni.showToast({ title: t('pages-store.groupCatering.validation.contactName'), icon: 'none' })
+    return false
+  }
+  if (!form.value.contactPhone.trim()) {
+    uni.showToast({ title: t('pages-store.groupCatering.validation.contactPhone'), icon: 'none' })
+    return false
+  }
+  const expectedTimestamp = buildExpectedTimestamp()
+  if (!expectedTimestamp) {
+    uni.showToast({ title: t('pages-store.groupCatering.validation.expectedTime'), icon: 'none' })
+    return false
+  }
+  return true
+}
+
+async function handleSubmit() {
+  if (!validateForm() || submitting.value || !selectedMerchant.value) return
+  submitting.value = true
+  try {
+    await appGroupMealReservationSubmitPost({
+      body: {
+        merchantId: selectedMerchant.value.id,
+        peopleCount: Number(form.value.peopleCount),
+        perCapitaPrice: Number(form.value.perCapitaPrice),
+        scene: form.value.scene.trim(),
+        contactName: form.value.contactName.trim(),
+        contactPhone: form.value.contactPhone.trim(),
+        expectedTime: buildExpectedTimestamp(),
+        remark: form.value.remark.trim() || undefined,
+      },
+    })
+    uni.showToast({
+      title: t('pages-store.groupCatering.submitSuccess'),
+      icon: 'none',
+    })
+    reloadList()
+    activeTab.value = 'list'
+  } finally {
+    submitting.value = false
+  }
+}
+
+async function loadMerchantOptions() {
+  merchantLoading.value = true
+  try {
+    const body = {
+      lat: userStore.userLocation.latitude,
+      lng: userStore.userLocation.longitude,
+    }
+    const [featuredRes, nearbyRes] = await Promise.all([
+      appMerchantFeaturedListPost({ body }),
+      appMerchantNearbyListPost({ body }),
+    ])
+    const merged = new Map<string, { id: string; merchantName: string }>()
+    const appendList = (list: unknown) => {
+      if (!Array.isArray(list)) return
+      list.forEach((item: any) => {
+        const id = String(item?.id ?? '')
+        const merchantName = String(item?.merchantName ?? '').trim()
+        if (id && merchantName && !merged.has(id)) {
+          merged.set(id, { id, merchantName })
+        }
+      })
+    }
+    appendList(featuredRes?.data)
+    appendList(nearbyRes?.data)
+    merchantOptions.value = Array.from(merged.values())
+  } catch {
+    merchantOptions.value = []
+  } finally {
+    merchantLoading.value = false
+  }
+}
+
+function openMerchantPicker() {
+  merchantPickerVisible.value = true
+  if (merchantOptions.value.length === 0) {
+    loadMerchantOptions()
+  }
+}
+
+function selectMerchant(item: { id: string; merchantName: string }) {
+  selectedMerchant.value = item
+  merchantPickerVisible.value = false
+}
+
+async function initMerchantFromQuery(merchantId: string) {
+  if (!merchantId) return
+  try {
+    const res = await appMerchantDetailMerchantIdGet({
+      params: { merchantId },
+    })
+    const name = String(res.data?.merchantName ?? '').trim()
+    if (name) {
+      selectedMerchant.value = { id: merchantId, merchantName: name }
+    }
+  } catch {
+    selectedMerchant.value = { id: merchantId, merchantName: merchantId }
+  }
+}
+
+function parseReservationRows(res: unknown) {
+  const payload = res as Record<string, unknown> | null | undefined
+  if (!payload) return { rows: [] as GroupMealReservationVo[], total: 0 }
+  const rows = Array.isArray(payload.rows)
+    ? payload.rows
+    : Array.isArray((payload.data as Record<string, unknown> | undefined)?.rows)
+      ? ((payload.data as Record<string, unknown>).rows as GroupMealReservationVo[])
+      : []
+  const total = Number(
+    payload.total ?? (payload.data as Record<string, unknown> | undefined)?.total ?? rows.length,
+  )
+  return { rows, total }
+}
+
+async function fetchReservationList(reset = false) {
+  if (reset) {
+    listPageNum.value = 1
+    listHasMore.value = true
+    listLoading.value = true
+    listQueried.value = false
+  } else if (!listHasMore.value || listLoadingMore.value || listLoading.value) {
+    return
+  } else {
+    listLoadingMore.value = true
+  }
+
+  if (!userStore.isLogin) {
+    reservationList.value = []
+    listHasMore.value = false
+    listLoading.value = false
+    listLoadingMore.value = false
+    listQueried.value = true
+    return
+  }
+
+  try {
+    const res = await appGroupMealReservationMyListPost({
+      params: { pageNum: listPageNum.value, pageSize: PAGE_SIZE },
+      body: {},
+    })
+    const { rows, total } = parseReservationRows(res)
+    reservationList.value = reset ? rows : [...reservationList.value, ...rows]
+    listHasMore.value = reservationList.value.length < total
+    if (listHasMore.value) {
+      listPageNum.value += 1
+    }
+  } catch {
+    if (reset) {
+      reservationList.value = []
+    }
+    listHasMore.value = false
+  } finally {
+    listLoading.value = false
+    listLoadingMore.value = false
+    listQueried.value = true
+  }
+}
+
+function reloadList() {
+  fetchReservationList(true)
+}
+
+function switchTab(tab: PageTab) {
+  activeTab.value = tab
+  if (tab === 'list') {
+    reloadList()
+  }
+}
+
+function getStatusText(status?: number) {
+  const keyMap: Record<number, string> = {
+    1: 'statusPending',
+    2: 'statusContacted',
+    3: 'statusConfirmed',
+    4: 'statusRejected',
+    5: 'statusCompleted',
+    6: 'statusCancelled',
+  }
+  const key = keyMap[Number(status)]
+  return key ? t(`pages-store.groupCatering.${key}`) : '--'
+}
+
+function openDetail(item: GroupMealReservationVo) {
+  if (!item.id) return
+  uni.navigateTo({
+    url: `/pages-store/pages/group-catering/detail?id=${item.id}`,
+  })
+}
+
+function onDateChange(e: { detail: { value: string } }) {
+  expectedDate.value = e.detail.value
+}
+
+function onTimeChange(e: { detail: { value: string } }) {
+  expectedTime.value = e.detail.value
+}
+
+onLoad((query?: Record<string, string | undefined>) => {
+  prefillContact()
+  if (query?.merchantId) {
+    initMerchantFromQuery(String(query.merchantId))
+  }
+  if (query?.tab === 'list') {
+    activeTab.value = 'list'
+    reloadList()
+  }
+})
+
+onShow(() => {
+  if (activeTab.value === 'list' && listQueried.value) {
+    reloadList()
+  }
+})
+</script>
+
+<template>
+  <view class="group-catering-page">
+    <navbar :title="t('pages-store.groupCatering.title')" circle-back />
+
+    <view class="group-catering-tabs px-30rpx pt-16rpx pb-8rpx bg-#fff">
+      <view class="group-catering-tabs__inner">
+        <view
+          class="group-catering-tabs__item"
+          :class="{ 'group-catering-tabs__item--active': activeTab === 'submit' }"
+          @click="switchTab('submit')"
+        >
+          {{ t('pages-store.groupCatering.tabSubmit') }}
+        </view>
+        <view
+          class="group-catering-tabs__item"
+          :class="{ 'group-catering-tabs__item--active': activeTab === 'list' }"
+          @click="switchTab('list')"
+        >
+          {{ t('pages-store.groupCatering.tabList') }}
+        </view>
+      </view>
+    </view>
+
+    <view v-if="activeTab === 'submit'" class="group-catering-form px-30rpx pt-24rpx">
+      <view class="group-form-card">
+        <text class="group-form-card__intro">{{ t('pages-store.groupCatering.intro') }}</text>
+      </view>
+
+      <view class="group-form-card mt-24rpx">
+        <view class="group-form-item" @click="openMerchantPicker">
+          <text class="group-form-item__label">{{ t('pages-store.groupCatering.fieldMerchant') }}</text>
+          <view class="group-form-item__value-wrap">
+            <text
+              class="group-form-item__value"
+              :class="{ 'group-form-item__value--placeholder': !selectedMerchant }"
+            >
+              {{ selectedMerchant?.merchantName || t('pages-store.groupCatering.selectMerchant') }}
+            </text>
+            <text class="group-form-item__arrow">›</text>
+          </view>
+        </view>
+
+        <view class="group-form-item">
+          <text class="group-form-item__label">{{ t('pages-store.groupCatering.fieldPeopleCount') }}</text>
+          <input
+            v-model="form.peopleCount"
+            class="group-form-item__input"
+            type="number"
+            :placeholder="t('pages-store.groupCatering.peopleCountPlaceholder')"
+          />
+        </view>
+
+        <view class="group-form-item">
+          <text class="group-form-item__label">{{ t('pages-store.groupCatering.fieldPerCapitaPrice') }}</text>
+          <input
+            v-model="form.perCapitaPrice"
+            class="group-form-item__input"
+            type="digit"
+            :placeholder="t('pages-store.groupCatering.perCapitaPricePlaceholder')"
+          />
+        </view>
+
+        <view class="group-form-item group-form-item--column">
+          <text class="group-form-item__label">{{ t('pages-store.groupCatering.fieldEstimatedTotal') }}</text>
+          <text class="group-form-item__estimate">${{ estimatedTotal }}</text>
+        </view>
+
+        <view class="group-form-item group-form-item--column">
+          <text class="group-form-item__label">{{ t('pages-store.groupCatering.fieldScene') }}</text>
+          <view class="group-form-scenes">
+            <view
+              v-for="scene in sceneOptions"
+              :key="scene"
+              class="group-form-scene"
+              :class="{ 'group-form-scene--active': form.scene === scene }"
+              @click="form.scene = scene"
+            >
+              {{ scene }}
+            </view>
+          </view>
+          <input
+            v-model="form.scene"
+            class="group-form-item__input mt-16rpx"
+            type="text"
+            :placeholder="t('pages-store.groupCatering.scenePlaceholder')"
+          />
+        </view>
+
+        <view class="group-form-item">
+          <text class="group-form-item__label">{{ t('pages-store.groupCatering.fieldExpectedTime') }}</text>
+          <view class="group-form-item__picker-row">
+            <picker mode="date" :value="expectedDate" @change="onDateChange">
+              <view class="group-form-picker">{{ expectedDate || t('pages-store.groupCatering.selectDate') }}</view>
+            </picker>
+            <picker mode="time" :value="expectedTime" @change="onTimeChange">
+              <view class="group-form-picker">{{ expectedTime || t('pages-store.groupCatering.selectTime') }}</view>
+            </picker>
+          </view>
+          <text class="group-form-item__hint">{{ expectedTimeText }}</text>
+        </view>
+
+        <view class="group-form-item">
+          <text class="group-form-item__label">{{ t('pages-store.groupCatering.fieldContactName') }}</text>
+          <input
+            v-model="form.contactName"
+            class="group-form-item__input"
+            type="text"
+            :placeholder="t('pages-store.groupCatering.contactNamePlaceholder')"
+          />
+        </view>
+
+        <view class="group-form-item">
+          <text class="group-form-item__label">{{ t('pages-store.groupCatering.fieldContactPhone') }}</text>
+          <input
+            v-model="form.contactPhone"
+            class="group-form-item__input"
+            type="text"
+            :placeholder="t('pages-store.groupCatering.contactPhonePlaceholder')"
+          />
+        </view>
+
+        <view class="group-form-item group-form-item--column">
+          <text class="group-form-item__label">{{ t('pages-store.groupCatering.fieldRemark') }}</text>
+          <textarea
+            v-model="form.remark"
+            class="group-form-textarea"
+            :placeholder="t('pages-store.groupCatering.remarkPlaceholder')"
+            maxlength="200"
+          />
+        </view>
+      </view>
+
+      <view class="group-form-tips mt-24rpx">
+        <text>{{ t('pages-store.groupCatering.tips') }}</text>
+      </view>
+
+      <view class="h-180rpx" />
+      <view :style="[configStore.iosSafeBottomPlaceholder]" />
+
+      <view class="group-catering-page__footer fixed bottom-0 left-0 right-0 px-30rpx pt-16rpx bg-#fff">
+        <wd-button
+          custom-class="!h-98rpx !text-30rpx !text-#fff !lh-98rpx !rounded-16rpx"
+          block
+          :loading="submitting"
+          @click="handleSubmit"
+        >
+          {{ t('pages-store.groupCatering.submitAction') }}
+        </wd-button>
+        <view :style="[configStore.iosSafeBottomPlaceholder]" />
+      </view>
+    </view>
+
+    <view v-else class="group-catering-list-panel">
+      <view v-if="showListLoading" class="group-catering-loading">
+        <text class="group-catering-loading__text">{{ t('common.loading') }}</text>
+      </view>
+
+      <view v-else-if="showListEmpty" class="group-catering-empty">
+        <image
+          class="group-catering-empty__img"
+          src="@img/chef/100.png"
+          mode="aspectFit"
+        />
+        <text class="group-catering-empty__text">
+          {{ t('pages-store.groupCatering.listEmpty') }}
+        </text>
+        <view class="group-catering-empty__btn" @click="switchTab('submit')">
+          {{ t('pages-store.groupCatering.emptyAction') }}
+        </view>
+      </view>
+
+      <scroll-view
+        v-else
+        scroll-y
+        class="group-catering-scroll"
+        :lower-threshold="80"
+        @scrolltolower="fetchReservationList(false)"
+      >
+        <view class="px-30rpx pt-24rpx">
+          <view
+            v-for="item in reservationList"
+            :key="String(item.id)"
+            class="group-list-card"
+            @click="openDetail(item)"
+          >
+            <view class="group-list-card__head">
+              <text class="group-list-card__merchant">{{ item.merchant?.merchantName || '--' }}</text>
+              <text class="group-list-card__status">{{ getStatusText(item.status) }}</text>
+            </view>
+            <view class="group-list-card__row">
+              <text>{{ t('pages-store.groupCatering.fieldPeopleCount') }}: {{ item.peopleCount ?? '--' }}</text>
+              <text>${{ formatGroupMealMoney(Number(item.perCapitaPrice) || 0) }}</text>
+            </view>
+            <view class="group-list-card__row">
+              <text>{{ t('pages-store.groupCatering.fieldEstimatedTotal') }}: ${{ formatGroupMealMoney(calcGroupMealEstimatedTotal(item)) }}</text>
+            </view>
+            <view class="group-list-card__row">
+              <text>{{ formatTimestampWithMonthName(Number(item.expectedTime)) }}</text>
+            </view>
+            <view v-if="canCancelGroupMeal(Number(item.status))" class="group-list-card__action">
+              {{ t('pages-store.groupCatering.viewAndCancel') }}
+            </view>
+          </view>
+        </view>
+
+        <view v-if="listLoadingMore" class="group-catering-loading-more">
+          {{ t('common.loading') }}
+        </view>
+        <view :style="[configStore.iosSafeBottomPlaceholder]" />
+      </scroll-view>
+    </view>
+
+    <wd-popup
+      v-model="merchantPickerVisible"
+      position="bottom"
+      custom-style="border-radius: 24rpx 24rpx 0 0;"
+    >
+      <view class="merchant-picker">
+        <view class="merchant-picker__title">{{ t('pages-store.groupCatering.selectMerchant') }}</view>
+        <scroll-view scroll-y class="merchant-picker__list">
+          <view v-if="merchantLoading" class="center py-80rpx text-28rpx text-#999">
+            {{ t('common.loading') }}
+          </view>
+          <view
+            v-for="item in merchantOptions"
+            :key="item.id"
+            class="merchant-picker__item"
+            @click="selectMerchant(item)"
+          >
+            {{ item.merchantName }}
+          </view>
+          <view v-if="!merchantLoading && merchantOptions.length === 0" class="center py-80rpx text-28rpx text-#999">
+            {{ t('pages-store.groupCatering.merchantEmpty') }}
+          </view>
+        </scroll-view>
+        <view :style="[configStore.iosSafeBottomPlaceholder]" />
+      </view>
+    </wd-popup>
+  </view>
+</template>
+
+<style>
+page {
+  background-color: #f5f5f5;
+}
+</style>
+
+<style scoped lang="scss">
+.group-catering-page {
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+}
+
+.group-catering-list-panel {
+  flex: 1;
+  min-height: calc(100vh - 280rpx);
+}
+
+.group-catering-scroll {
+  height: calc(100vh - 280rpx);
+}
+
+.group-catering-loading {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-height: calc(100vh - 280rpx);
+}
+
+.group-catering-loading__text {
+  font-size: 28rpx;
+  color: #999;
+}
+
+.group-catering-loading-more {
+  padding: 24rpx 0 40rpx;
+  text-align: center;
+  font-size: 24rpx;
+  color: #999;
+}
+
+.group-catering-tabs__inner {
+  display: flex;
+  padding: 8rpx;
+  border-radius: 16rpx;
+  background: #f5f5f5;
+}
+
+.group-catering-tabs__item {
+  flex: 1;
+  height: 72rpx;
+  line-height: 72rpx;
+  text-align: center;
+  font-size: 28rpx;
+  color: #666;
+  border-radius: 12rpx;
+
+  &--active {
+    background: #fff;
+    color: #333;
+    font-weight: 600;
+    box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.06);
+  }
+}
+
+.group-form-card {
+  padding: 28rpx;
+  border-radius: 20rpx;
+  background: #fff;
+}
+
+.group-form-card__intro {
+  font-size: 26rpx;
+  line-height: 1.7;
+  color: #666;
+}
+
+.group-form-item {
+  padding: 24rpx 0;
+  border-bottom: 1rpx solid #f3f3f3;
+
+  &:last-child {
+    border-bottom: none;
+  }
+
+  &--column {
+    display: flex;
+    flex-direction: column;
+    gap: 16rpx;
+  }
+}
+
+.group-form-item__label {
+  display: block;
+  font-size: 28rpx;
+  font-weight: 500;
+  color: #333;
+}
+
+.group-form-item__value-wrap {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 16rpx;
+  margin-top: 16rpx;
+}
+
+.group-form-item__value {
+  flex: 1;
+  min-width: 0;
+  font-size: 28rpx;
+  color: #333;
+
+  &--placeholder {
+    color: #999;
+  }
+}
+
+.group-form-item__arrow {
+  color: #999;
+  font-size: 34rpx;
+}
+
+.group-form-item__input {
+  width: 100%;
+  margin-top: 16rpx;
+  height: 80rpx;
+  padding: 0 20rpx;
+  box-sizing: border-box;
+  border-radius: 12rpx;
+  background: #f7f7f7;
+  font-size: 28rpx;
+  color: #333;
+}
+
+.group-form-item__estimate {
+  font-size: 36rpx;
+  font-weight: 600;
+  color: #e02e24;
+}
+
+.group-form-item__picker-row {
+  display: flex;
+  gap: 16rpx;
+  margin-top: 16rpx;
+}
+
+.group-form-picker {
+  flex: 1;
+  height: 80rpx;
+  line-height: 80rpx;
+  padding: 0 20rpx;
+  border-radius: 12rpx;
+  background: #f7f7f7;
+  font-size: 26rpx;
+  color: #333;
+  text-align: center;
+}
+
+.group-form-item__hint {
+  display: block;
+  margin-top: 12rpx;
+  font-size: 24rpx;
+  color: #999;
+}
+
+.group-form-scenes {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 16rpx;
+}
+
+.group-form-scene {
+  padding: 12rpx 20rpx;
+  border-radius: 999rpx;
+  background: #f7f7f7;
+  font-size: 24rpx;
+  color: #666;
+
+  &--active {
+    background: #fff7ef;
+    color: #ce7138;
+  }
+}
+
+.group-form-textarea {
+  width: 100%;
+  min-height: 160rpx;
+  padding: 20rpx;
+  box-sizing: border-box;
+  border-radius: 12rpx;
+  background: #f7f7f7;
+  font-size: 26rpx;
+  color: #333;
+  line-height: 1.6;
+}
+
+.group-form-tips {
+  padding: 24rpx 28rpx;
+  border-radius: 16rpx;
+  background: #fff7ef;
+  font-size: 24rpx;
+  line-height: 1.7;
+  color: #a0672d;
+}
+
+.group-list-card {
+  margin-bottom: 24rpx;
+  padding: 28rpx;
+  border-radius: 20rpx;
+  background: #fff;
+}
+
+.group-list-card__head {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 16rpx;
+  margin-bottom: 16rpx;
+}
+
+.group-list-card__merchant {
+  flex: 1;
+  min-width: 0;
+  font-size: 30rpx;
+  font-weight: 600;
+  color: #333;
+}
+
+.group-list-card__status {
+  flex-shrink: 0;
+  padding: 6rpx 16rpx;
+  border-radius: 999rpx;
+  background: #fff7ef;
+  color: #ce7138;
+  font-size: 22rpx;
+}
+
+.group-list-card__row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 16rpx;
+  margin-top: 12rpx;
+  font-size: 24rpx;
+  color: #666;
+}
+
+.group-list-card__action {
+  margin-top: 20rpx;
+  font-size: 24rpx;
+  color: #ce7138;
+}
+
+.group-catering-page__footer {
+  box-shadow: 0 -4rpx 20rpx rgba(0, 0, 0, 0.06);
+}
+
+.merchant-picker {
+  max-height: 70vh;
+  background: #fff;
+}
+
+.merchant-picker__title {
+  padding: 28rpx 30rpx 16rpx;
+  font-size: 30rpx;
+  font-weight: 600;
+  color: #333;
+}
+
+.merchant-picker__list {
+  max-height: 56vh;
+}
+
+.merchant-picker__item {
+  padding: 28rpx 30rpx;
+  font-size: 28rpx;
+  color: #333;
+  border-bottom: 1rpx solid #f3f3f3;
+}
+
+.group-catering-empty {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  min-height: calc(100vh - 280rpx);
+  padding: 80rpx 40rpx 120rpx;
+  box-sizing: border-box;
+}
+
+.group-catering-empty__img {
+  width: 280rpx;
+  height: 280rpx;
+}
+
+.group-catering-empty__text {
+  margin-top: 24rpx;
+  font-size: 28rpx;
+  line-height: 1.5;
+  color: #999;
+  text-align: center;
+}
+
+.group-catering-empty__btn {
+  margin-top: 40rpx;
+  min-width: 280rpx;
+  height: 80rpx;
+  padding: 0 40rpx;
+  border-radius: 40rpx;
+  background: #14181b;
+  color: #fff;
+  font-size: 28rpx;
+  line-height: 80rpx;
+  text-align: center;
+}
+</style>

src/pages-store/pages/group-catering/utils.ts

@@ -0,0 +1,31 @@
+import type { GroupMealReservationVo } from '@/service/groupMealReservation'
+
+/** 消费端团餐预定状态 */
+export const GROUP_MEAL_STATUS = {
+  PENDING: 1,
+  CONTACTED: 2,
+  CONFIRMED: 3,
+  REJECTED: 4,
+  COMPLETED: 5,
+  USER_CANCELLED: 6,
+} as const
+
+export function canCancelGroupMeal(status?: number) {
+  return status === GROUP_MEAL_STATUS.PENDING || status === GROUP_MEAL_STATUS.CONTACTED
+}
+
+export function calcGroupMealEstimatedTotal(item: Pick<
+  GroupMealReservationVo,
+  'peopleCount' | 'perCapitaPrice'
+>) {
+  const people = Number(item.peopleCount)
+  const price = Number(item.perCapitaPrice)
+  if (!Number.isFinite(people) || !Number.isFinite(price) || people <= 0 || price < 0) {
+    return 0
+  }
+  return people * price
+}
+
+export function formatGroupMealMoney(value: number) {
+  return value.toFixed(2)
+}

src/pages-store/pages/home-store/index.vue

@@ -1,25 +1,24 @@
 <script setup lang="ts">
 import usePage from "@/hooks/usePage";
-import {appMerchantRecommendListPost} from "@/service";
+import { appMerchantRecommendListPost, type MerchantVo } from "@/service";
-import {useUserStore} from "@/store";
+import { useUserStore } from "@/store";
 import FiltrateTool from "@/components/filtrate-tool/index.vue";
 import PriceChoose from "@/components/filtrate-tool/components/price-choose.vue";
 import Score from "@/components/filtrate-tool/components/score.vue";
-import FoodBox from "@/pages/home/components/tabbar-home/components/food-box/index.vue";
-const userStore = useUserStore();
 
-const {t} = useI18n()
+const userStore = useUserStore();
+const { t } = useI18n();
 
 const props = defineProps({
   merchantCategoryIds: {
     type: [Number, String],
-    default: null
+    default: null,
-  }
+  },
-})
+});
 
-const {paging, dataList, queryList} = usePage(getList)
+const { paging, dataList, queryList } = usePage<MerchantVo>(getList);
 function getList(pageNum: number, pageSize: number) {
-  return new Promise(resolve => {
+  return new Promise((resolve) => {
     appMerchantRecommendListPost({
       params: {
         pageNum: pageNum,
@@ -28,75 +27,344 @@ function getList(pageNum: number, pageSize: number) {
       body: {
         lat: userStore.userLocation.latitude,
         lng: userStore.userLocation.longitude,
-        selfPickup: selfPickup.value, // 是否自提
+        selfPickup: selfPickup.value,
-        discount: discount.value, // 是否有折扣 1是 2 否
+        discount: discount.value,
-        scoreRange: scoreRange.value || null, // 评分范围 比如 3-4
+        scoreRange: scoreRange.value || null,
-        priceRange: price.value || null, // 价格范围 比如 10-30
+        priceRange: price.value || null,
-        merchantCategoryIds: props.merchantCategoryIds ? [props.merchantCategoryIds] : [], // 商家分类id集合(首页中间)
+        merchantCategoryIds: props.merchantCategoryIds
-      }
+          ? [props.merchantCategoryIds]
-    }).then(res => {
+          : [],
-      console.log(res)
+      },
-      resolve({rows: res.rows})
+    }).then((res) => {
-    })
+      console.log(res);
-  })
+      resolve({ rows: res.rows });
+    });
+  });
 }
 
-// 是否自提
+const selfPickup = ref<number | null>(null);
-const selfPickup = ref<number | null>(null)
 function togglePickup(value: number) {
   selfPickup.value = value;
-  paging.value.refresh()
+  paging.value?.refresh();
-}
-// 是否有折扣
-const discount = ref<number | null>(null)
-function toggleDiscount(value: number) {
-  discount.value = value;
-  paging.value.refresh()
 }
 
-const scoreRef = ref<any>()
+const discount = ref<number | null>(null);
-const scoreRange = ref<string | null>(null)
+function toggleDiscount(value: number) {
-const priceChooseRef = ref<any>()
+  discount.value = value;
-const price = ref<string | null>(null)
+  paging.value?.refresh();
+}
+
+const scoreRef = ref<any>();
+const scoreRange = ref<string | null>(null);
+const priceChooseRef = ref<any>();
+const price = ref<string | null>(null);
 function toggleScore() {
-  if (scoreRef.value) {
+  scoreRef.value?.onOpen();
-    scoreRef.value.onOpen();
-  }
 }
 function togglePrice() {
-  if (priceChooseRef.value) {
+  priceChooseRef.value?.onOpen();
-    priceChooseRef.value.onOpen();
-  }
 }
 
 function applyScore(value: string) {
   scoreRange.value = value;
+  nextTick(() => paging.value?.refresh());
 }
 function applyPrice(value: string) {
   price.value = value;
+  nextTick(() => paging.value?.refresh());
+}
+
+/** 左侧双图：优先店铺图，不足则用 logo 补齐 */
+function merchantImagePair(item: MerchantVo): [string, string] {
+  const shop = (item.shopImages || "")
+    .split(",")
+    .map((s) => s.trim())
+    .filter(Boolean);
+  const logo = (item.logo || "").trim();
+  let a = shop[0] || logo || "";
+  let b = shop[1] || shop[0] || logo || "";
+  if (!a && !b) return ["", ""];
+  if (!b) b = a;
+  if (!a) a = b;
+  return [a, b];
+}
+
+function merchantCategoryLine(item: MerchantVo): string {
+  const zh = item.merchantCategoryNamesZh;
+  const en = item.merchantCategoryNamesEn;
+  if (uni.getLocale() === "zh-Hans" && zh?.length) return zh[0] || "";
+  if (en?.length) return en[0] || "";
+  if (zh?.length) return zh[0] || "";
+  return "";
+}
+
+function ratingStars(rating?: number) {
+  const n = Math.min(5, Math.max(0, Math.round(Number(rating) || 0)));
+  return n;
+}
+
+function ratingText(rating?: number) {
+  const n = Number(rating);
+  if (Number.isFinite(n)) return n.toFixed(1);
+  return "0.0";
+}
+
+function openMerchant(item: MerchantVo) {
+  if (item?.id == null) return;
+  uni.navigateTo({
+    url: `/pages-store/pages/store/index?id=${item.id}`,
+  });
 }
 </script>
 
 <template>
-  <z-paging ref="paging" v-model="dataList" @query="queryList">
+  <view class="home-store-page">
+  <z-paging
+    ref="paging"
+    v-model="dataList"
+    bg-color="#F2F3F5"
+    @query="queryList"
+  >
     <template #top>
-      <view class="bg-white pb-24rpx">
+      <view class="home-store-header">
-        <navbar :title="t('pages.home.featured-on')"/>
+        <navbar
-        <!-- 筛选工具 -->
+          :title="t('pages.home.featured-on')"
-        <filtrate-tool class="mt-32rpx" @togglePickup="togglePickup" @toggleDiscount="toggleDiscount" @toggleScore="toggleScore" @togglePrice="togglePrice" />
+          circle-back
+          custom-class="!bg-white"
+        />
+      </view>
+      <view class="home-store-filter-strip">
+        <filtrate-tool
+          class="home-store-filters"
+          @togglePickup="togglePickup"
+          @toggleDiscount="toggleDiscount"
+          @toggleScore="toggleScore"
+          @togglePrice="togglePrice"
+        />
       </view>
     </template>
-    <view class="p-30rpx">
+
-      <template v-for="(item, index) in dataList" :key="index">
+    <view class="home-store-list">
-        <food-box :item="item" />
+      <view
-      </template>
+        v-for="(item, index) in dataList"
+        :key="item.id ?? index"
+        class="merchant-card"
+        @click="openMerchant(item)"
+      >
+        <view class="merchant-card__imgs">
+          <view
+            v-for="(src, ii) in merchantImagePair(item)"
+            :key="ii"
+            class="merchant-card__img-slot"
+            :class="
+              ii === 0
+                ? 'merchant-card__img-slot--first'
+                : 'merchant-card__img-slot--last'
+            "
+          >
+            <image
+              v-if="src"
+              class="merchant-card__img"
+              :src="src"
+              mode="aspectFill"
+            />
+            <view v-else class="merchant-card__img merchant-card__img--empty" />
+          </view>
+        </view>
+        <view class="merchant-card__body">
+          <text class="merchant-card__name">{{ item.merchantName }}</text>
+          <text
+            v-if="merchantCategoryLine(item)"
+            class="merchant-card__cate"
+            >{{ merchantCategoryLine(item) }}</text
+          >
+          <view class="merchant-card__rating">
+            <text
+              v-for="si in [1, 2, 3, 4, 5]"
+              :key="si"
+              class="merchant-card__star"
+              :class="{
+                'merchant-card__star--on': si <= ratingStars(item.rating),
+              }"
+              >★</text
+            >
+            <text class="merchant-card__score">{{
+              ratingText(item.rating)
+            }}</text>
+          </view>
+          <text class="merchant-card__tag">{{ t("pages.home.brandTag") }}</text>
+        </view>
+        <view class="merchant-card__go" @click.stop="openMerchant(item)">
+          <view class="i-carbon:chevron-right merchant-card__go-icon"></view>
+        </view>
+      </view>
     </view>
   </z-paging>
 
   <score @applyScore="applyScore" ref="scoreRef" />
   <price-choose @applyPrice="applyPrice" ref="priceChooseRef" />
+  </view>
 </template>
 
 <style scoped lang="scss">
+.home-store-page {
+  min-height: 100vh;
+}
 
-</style>
+.home-store-header {
+  background: #fff;
+}
+
+.home-store-filter-strip {
+  background: #f2f3f5;
+  padding-bottom: 8rpx;
+}
+
+.home-store-filters {
+  display: block;
+  padding: 16rpx 0 20rpx;
+}
+
+.home-store-list {
+  padding: 16rpx 24rpx 40rpx;
+  box-sizing: border-box;
+}
+
+.merchant-card {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  background: #fff;
+  border-radius: 24rpx;
+  padding: 24rpx;
+  margin-bottom: 20rpx;
+  box-shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.06);
+}
+
+.merchant-card__imgs {
+  display: flex;
+  flex-direction: column;
+  gap: 12rpx;
+  width: 152rpx;
+  flex-shrink: 0;
+}
+
+.merchant-card__img-slot {
+  width: 152rpx;
+  height: 96rpx;
+  flex-shrink: 0;
+  overflow: hidden;
+  background: #e8eaed;
+}
+
+/* 仅外侧圆角；靠两张图之间的分割一侧为直角 */
+.merchant-card__img-slot--first {
+  border-radius: 12rpx 12rpx 0 0;
+}
+
+.merchant-card__img-slot--last {
+  border-radius: 0 0 12rpx 12rpx;
+}
+
+.merchant-card__img {
+  width: 100%;
+  height: 100%;
+  display: block;
+  background: #e8eaed;
+}
+
+.merchant-card__img--empty {
+  flex-shrink: 0;
+  width: 100%;
+  height: 100%;
+}
+
+.merchant-card__body {
+  flex: 1;
+  min-width: 0;
+  padding: 0 20rpx 0 8rpx;
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+}
+
+.merchant-card__name {
+  font-size: 30rpx;
+  font-weight: 600;
+  color: #14181b;
+  line-height: 1.35;
+  max-width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.merchant-card__cate {
+  margin-top: 8rpx;
+  font-size: 26rpx;
+  color: #333;
+  line-height: 1.3;
+  max-width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.merchant-card__rating {
+  margin-top: 12rpx;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 4rpx;
+}
+
+.merchant-card__star {
+  font-size: 22rpx;
+  line-height: 1;
+  color: #e0e0e0;
+  letter-spacing: -2rpx;
+}
+
+.merchant-card__star--on {
+  color: #14181b;
+}
+
+.merchant-card__score {
+  margin-left: 10rpx;
+  font-size: 26rpx;
+  font-weight: 600;
+  color: #14181b;
+}
+
+.merchant-card__tag {
+  margin-top: 10rpx;
+  font-size: 24rpx;
+  font-weight: 500;
+  color: #b8860b;
+  line-height: 1.3;
+}
+
+.merchant-card__go {
+  width: 56rpx;
+  height: 56rpx;
+  border-radius: 50%;
+  background: #14181b;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+}
+
+.merchant-card__go-icon {
+  font-size: 28rpx;
+  color: #fff;
+  margin-left: 2rpx;
+}
+</style>
+
+<style>
+page {
+  background-color: #f2f3f5;
+}
+</style>

src/pages-store/pages/list/index.vue

@@ -1,61 +1,753 @@
 <script setup lang="ts">
-import {appMerchantRecommendListPost,getDishListByCategoryId} from "@/service";
+import { debounce } from "throttle-debounce";
-import FoodBox from "@/pages/home/components/tabbar-home/components/food-box/index.vue";
+import Config from "@/config";
-import {useUserStore} from "@/store";
+import usePage from "@/hooks/usePage";
+import {
+  appRecipeCategoryListGet,
+  appCollectCollectPost,
+  appMerchantCartAddCartPost,
+  getDishListByCategoryId,
+} from "@/service";
+import { CollectionType } from "@/constant/enums";
+import {
+  useCategoryNavStore,
+  useConfigStore,
+  useUserStore,
+} from "@/store";
+import { formatSalesCount } from "@/utils/utils";
+import { onShow } from "@dcloudio/uni-app";
 
+const { t } = useI18n();
+const configStore = useConfigStore();
 const userStore = useUserStore();
+const categoryNavStore = useCategoryNavStore();
 
-const props = defineProps<{
+/** 菜品瀑布流项（接口字段较多，用宽松类型避免模板断言） */
-  id?: string
+type DishGridItem = Record<string, any>;
-}>()
+
+/** 菜谱分类（与首页 class-bullet 同源：appRecipeCategoryListGet） */
+const recipeCategoryList = ref<Record<string, unknown>[]>([]);
+/** 当前选中的菜谱分类 id，仅由用户点击大分类或首页写入的 pending 决定，不用路由 options */
+const recipeCategoryId = ref<string>("");
+
+/** 横向分类 scroll-view 滚动到选中项（与 :id="'recipe-cat-'+id" 对应） */
+const recipeCategoryScrollInto = ref("");
+
+const pageReady = ref(false);
+
+const { paging, dataList, queryList } = usePage(getList);
 
 function getList(pageNum: number, pageSize: number) {
-  return new Promise(resolve => {
+  return new Promise<{ rows: unknown[]; total?: number }>((resolve) => {
+    const rid = recipeCategoryId.value;
+    if (!rid) {
+      resolve({ rows: [], total: 0 });
+      return;
+    }
+
     getDishListByCategoryId({
       params: {
         pageNum,
         pageSize,
-        recipeCategoryId:props.id
+        recipeCategoryId: rid,
       },
       body: {
-        lat: userStore.userLocation.latitude,
+        pageNum,
-        lng: userStore.userLocation.longitude,
+        pageSize,
-        selfPickup: null, // 是否自提
+        lat: userStore.userLocation.latitude || undefined,
-        discount: null, // 是否有折扣 1是 2 否
+        lng: userStore.userLocation.longitude || undefined,
-        scoreRange: null, // 评分范围 比如 3-4
+        recipeCategoryId: rid,
-        priceRange: null, // 价格范围 比如 10-30
         merchantCategoryIds: [],
-        merchantLabelIds: props.id ? [props.id] : [],
+        merchantLabelIds: [],
-        recipeCategoryId:props.id
       },
-    }).then(res => {
-      resolve(res.data)
     })
-  })
+      .then((res: any) => {
+        resolve({
+          rows: res?.rows ?? res?.data?.rows ?? [],
+          total: res?.total ?? res?.data?.total,
+        });
+      })
+      .catch(() => resolve({ rows: [] }));
+  });
 }
 
-const {paging, loading, firstLoaded, dataList, queryList} = usePage(getList)
+const dishColumns = computed(() => {
+  const list = (dataList.value || []) as DishGridItem[];
+  return [
+    list.filter((_, i) => i % 2 === 0),
+    list.filter((_, i) => i % 2 === 1),
+  ];
+});
+
+function getDishPromoLabel(item: DishGridItem): string {
+  const raw =
+    item.marketingLabel ??
+    item.hotSaleTag ??
+    item.rankTag ??
+    item.promotionLabel;
+  return typeof raw === "string" && raw.trim() ? raw.trim() : "";
+}
+
+function isSoldOutStock(stockLike: unknown) {
+  const n = Number(stockLike);
+  return !Number.isNaN(n) && n <= 0;
+}
+
+function navigateToDishes(item: DishGridItem) {
+  const id = item?.id;
+  const storeId = item?.merchantId;
+  if (id == null || storeId == null) return;
+  uni.navigateTo({
+    url: `/pages-store/pages/store/dishes?id=${id}&storeId=${storeId}`,
+  });
+}
+
+function goSearch() {
+  uni.navigateTo({ url: "/pages/search/index" });
+}
+
+function goCart() {
+  uni.navigateTo({ url: "/pages-user/pages/cart/index" });
+}
+
+function handleBack() {
+  const pages = getCurrentPages?.() || [];
+  if (pages.length <= 1) {
+    uni.switchTab({ url: "/pages/home/index" });
+    return;
+  }
+  uni.navigateBack();
+}
+
+const cartBadgeTotal = computed(() => {
+  const list = userStore.userCartAllData;
+  if (!Array.isArray(list) || list.length === 0) return 0;
+  let n = 0;
+  for (const m of list) {
+    n +=
+      (m as { merchantCartVoList?: unknown[] })?.merchantCartVoList
+        ?.length || 0;
+  }
+  return n;
+});
+
+const addingDishId = ref<string | number | null>(null);
+
+async function onAddCartClick(item: DishGridItem) {
+  if (isSoldOutStock(item?.stock)) {
+    uni.showToast({
+      title: t("common.prompt.soldOut"),
+      icon: "none",
+    });
+    return;
+  }
+  if (!userStore.isLogin) {
+    uni.showToast({ title: t("common.pleaseLogin"), icon: "none" });
+    setTimeout(() => uni.navigateTo({ url: Config.loginPath }), 400);
+    return;
+  }
+  const dishId = item?.id;
+  const merchantId = item?.merchantId;
+  if (dishId == null || merchantId == null) return;
+  if (addingDishId.value != null) return;
+  addingDishId.value = dishId as string | number;
+  try {
+    await appMerchantCartAddCartPost({
+      body: {
+        merchantId,
+        dishId,
+        count: 1,
+        merchantCartSideDishBoList: [],
+      } as any,
+    });
+    uni.showToast({ title: t("toast.addCartSuccess"), icon: "none" });
+    userStore.getUserCartAllData();
+  } finally {
+    addingDishId.value = null;
+  }
+}
+
+const debouncedCollect = debounce(
+  1300,
+  (
+    isCollected: boolean,
+    id: string,
+    type: CollectionType,
+    cb: () => void
+  ) => {
+    appCollectCollectPost({
+      body: { targetId: id, targetType: type },
+    }).then(() => cb());
+  },
+  { atBegin: true }
+);
+
+function handleDishCollectionClick(item: DishGridItem) {
+  if (!userStore.isLogin) {
+    uni.showToast({ title: t("common.pleaseLogin"), icon: "none" });
+    setTimeout(() => uni.navigateTo({ url: Config.loginPath }), 400);
+    return;
+  }
+  const id = String(item?.id ?? "");
+  if (!id) return;
+  debouncedCollect(Boolean(item.isCollect), id, CollectionType.DISH, () => {
+    item.isCollect = !item.isCollect;
+  });
+}
+
+function normalizeCategoryId(v: unknown): string {
+  if (v === null || v === undefined) return "";
+  return String(v).trim();
+}
+
+/** 与列表项 id 比对（兼容数字 / 字符串） */
+function categoryRowIdEquals(
+  cat: Record<string, unknown>,
+  target: string
+): boolean {
+  const t = normalizeCategoryId(target);
+  if (!t) return false;
+  const a = normalizeCategoryId(cat.id);
+  if (a === t) return true;
+  const na = Number(a);
+  const nt = Number(t);
+  if (!Number.isNaN(na) && !Number.isNaN(nt) && na === nt) return true;
+  return false;
+}
+
+/** 在接口返回的分类列表中解析应选中的 id（与首页点击项对齐） */
+function resolveRecipeCategoryIdFromPending(pendingRaw: string | null): string {
+  const list = recipeCategoryList.value;
+  if (!list.length) return "";
+
+  const pending = pendingRaw ? normalizeCategoryId(pendingRaw) : "";
+  if (pending) {
+    const hit = list.find((c) => categoryRowIdEquals(c, pending));
+    if (hit != null) return normalizeCategoryId(hit.id);
+  }
+  return normalizeCategoryId(list[0].id);
+}
+
+function scrollRecipeTabIntoView() {
+  const id = recipeCategoryId.value;
+  if (!id) return;
+  recipeCategoryScrollInto.value = "";
+  nextTick(() => {
+    recipeCategoryScrollInto.value = `recipe-cat-${id}`;
+  });
+}
+
+function onSelectRecipe(cat: Record<string, unknown>) {
+  const id = normalizeCategoryId(cat?.id);
+  if (!id || id === recipeCategoryId.value) return;
+  recipeCategoryId.value = id;
+  nextTick(() => scrollRecipeTabIntoView());
+  paging.value?.reload();
+}
+
+async function loadRecipeCategories() {
+  const recipeRes: any = await appRecipeCategoryListGet({});
+  recipeCategoryList.value = recipeRes?.data || [];
+}
+
+function resolveInitialRecipeCategoryId() {
+  const pending = categoryNavStore.consumePendingRecipeCategoryId();
+  recipeCategoryId.value = resolveRecipeCategoryIdFromPending(pending);
+}
+
+onMounted(async () => {
+  await loadRecipeCategories();
+  resolveInitialRecipeCategoryId();
+  pageReady.value = true;
+  nextTick(() => {
+    scrollRecipeTabIntoView();
+    paging.value?.reload();
+  });
+});
+
+onShow(() => {
+  userStore.getUserCartAllData();
+});
 </script>
 
 <template>
   <z-paging
-      ref="paging"
+    ref="paging"
-      v-model="dataList"
+    v-model="dataList"
-      @query="queryList"
+    :auto="false"
-      bg-color="#fff"
+    @query="queryList"
+    bg-color="#f5f5f5"
   >
     <template #top>
-      <navbar />
+      <view class="cat-top" :style="{ paddingTop: configStore.statusBarHeight + 'px' }">
+        <view class="cat-header-row">
+          <view class="cat-icon-btn" @click="handleBack">
+            <view class="i-carbon:chevron-left text-40rpx text-#111" />
+          </view>
+          <view class="cat-search" @click="goSearch">
+            <image
+              src="@img/chef/100222.png"
+              class="cat-search-icon"
+              mode="aspectFit"
+            />
+            <text class="cat-search-placeholder">{{
+              t("components.search.placeholder")
+            }}</text>
+          </view>
+          <view class="cat-icon-btn cat-icon-btn--cart" @click="goCart">
+            <view class="i-carbon:shopping-cart text-34rpx text-#14181b" />
+            <view
+              v-if="userStore.isLogin && cartBadgeTotal > 0"
+              class="cat-cart-badge"
+              >{{ cartBadgeTotal > 99 ? "99+" : cartBadgeTotal }}</view
+            >
+          </view>
+        </view>
+
+        <!-- 第一行：菜谱分类（圆图 + 文案） -->
+        <scroll-view
+          class="cat-scroll-x"
+          scroll-x
+          scroll-with-animation
+          :scroll-into-view="recipeCategoryScrollInto"
+          :show-scrollbar="false"
+          enable-flex
+        >
+          <view class="cat-recipe-track">
+            <view
+              v-for="cat in recipeCategoryList"
+              :key="String(cat.id)"
+              :id="'recipe-cat-' + String(cat.id)"
+              class="cat-recipe-item"
+              @click="onSelectRecipe(cat)"
+            >
+              <view
+                class="cat-recipe-ring"
+                :class="{
+                  'cat-recipe-ring--on': categoryRowIdEquals(
+                    cat,
+                    recipeCategoryId,
+                  ),
+                }"
+              >
+                <image
+                  class="cat-recipe-img"
+                  :src="String(cat.categoryImageUrl || cat.categoryImage || '')"
+                  mode="aspectFill"
+                />
+              </view>
+              <text
+                class="cat-recipe-label"
+                :class="{
+                  'cat-recipe-label--on': categoryRowIdEquals(
+                    cat,
+                    recipeCategoryId,
+                  ),
+                }"
+                >{{ cat.categoryName }}</text
+              >
+            </view>
+          </view>
+        </scroll-view>
+      </view>
     </template>
 
-    <view class="p-32rpx">
+    <view v-if="pageReady" class="cat-waterfall px-24rpx pb-32rpx">
-      <template v-for="(item, index) in dataList" :key="index">
+      <view class="waterfall-row flex gap-16rpx items-start">
-        <food-box :item="item" />
+        <view
-      </template>
+          v-for="(col, colIndex) in dishColumns"
+          :key="colIndex"
+          class="waterfall-col flex-1 min-w-0 flex flex-col gap-16rpx"
+        >
+          <view
+            v-for="item in col"
+            :key="String(item.id) + '-' + String(item.merchantId)"
+            class="cat-dish-card w-full"
+            @click="navigateToDishes(item)"
+          >
+            <view class="cat-dish-image relative w-full bg-#f0f0f0">
+              <view v-if="item.isNew == 1" class="dish-new-ribbon">
+                <text class="dish-new-ribbon__text">NEW</text>
+              </view>
+              <view
+                class="cat-dish-collect"
+                @click.stop="handleDishCollectionClick(item)"
+              >
+                <image
+                  v-if="!item.isCollect"
+                  src="@img-store/1334.png"
+                  mode="aspectFit"
+                  class="cat-dish-collect-icon"
+                />
+                <image
+                  v-else
+                  src="@img-store/1337.png"
+                  mode="aspectFit"
+                  class="cat-dish-collect-icon"
+                />
+              </view>
+              <view
+                v-if="isSoldOutStock(item.stock)"
+                class="cat-dish-soldout"
+                >{{ t("common.prompt.soldOut") }}</view
+              >
+              <image
+                :src="String(item.dishImage || '').split(',')[0]"
+                mode="widthFix"
+                class="w-full block"
+              />
+            </view>
+            <view class="cat-dish-body">
+              <view class="cat-dish-meta flex items-start justify-between gap-12rpx mb-14rpx">
+                <view class="min-w-0 flex-1">
+                  <text class="cat-dish-price"
+                    >US${{ item.discountPrice }}</text
+                  >
+                  <text
+                    v-if="
+                      Number(item.originalPrice) > Number(item.discountPrice)
+                    "
+                    class="cat-dish-original"
+                    >US${{ item.originalPrice }}</text
+                  >
+                </view>
+                <text class="cat-dish-sales shrink-0"
+                  >{{ t("pages-store.store.sales") }}:
+                  {{ formatSalesCount(item.salesCount) }}</text
+                >
+              </view>
+              <view class="cat-dish-title line-clamp-2 mb-16rpx">{{
+                item.dishName
+              }}</view>
+              <view class="flex items-center justify-between gap-12rpx">
+                <view
+                  v-if="Number(item.memberPrice) > 0"
+                  class="cat-dish-member shrink min-w-0"
+                >
+                  <text class="cat-dish-member-inner"
+                    >{{ t("pages-store.store.members") }}: US${{
+                      item.memberPrice
+                    }}</text
+                  >
+                </view>
+                <view v-else class="flex-1 min-w-0" />
+                <view
+                  class="cat-dish-add shrink-0"
+                  :class="{
+                    'cat-dish-add--busy': addingDishId === item.id,
+                  }"
+                  @click.stop="onAddCartClick(item)"
+                >
+                  <image src="/static/app/images/add_cart.png" class="cat-dish-add__icon" />
+                </view>
+              </view>
+              <view
+                v-if="getDishPromoLabel(item)"
+                class="cat-dish-promo mt-16rpx"
+              >
+                <text class="cat-dish-promo-text">{{
+                  getDishPromoLabel(item)
+                }}</text>
+              </view>
+            </view>
+          </view>
+        </view>
+      </view>
     </view>
+
+    <template #bottom>
+      <view class="h-24rpx" />
+      <view :style="[configStore.iosSafeBottomPlaceholder]" />
+    </template>
   </z-paging>
 </template>
 
 <style scoped lang="scss">
+.cat-top {
+  background: #f5f5f5;
+  padding-bottom: 8rpx;
+}
 
-</style>
+.cat-header-row {
+  display: flex;
+  align-items: center;
+  gap: 16rpx;
+  padding: 12rpx 24rpx 20rpx;
+}
+
+.cat-icon-btn {
+  width: 72rpx;
+  height: 72rpx;
+  border-radius: 50%;
+  background: #fff;
+  box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.08);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+}
+
+.cat-icon-btn--cart {
+  position: relative;
+}
+
+.cat-cart-badge {
+  position: absolute;
+  top: 2rpx;
+  right: 2rpx;
+  min-width: 28rpx;
+  height: 28rpx;
+  padding: 0 6rpx;
+  font-size: 18rpx;
+  line-height: 28rpx;
+  font-weight: 600;
+  color: #fff;
+  text-align: center;
+  background: #e23636;
+  border-radius: 999rpx;
+}
+
+.cat-search {
+  flex: 1;
+  min-width: 0;
+  height: 72rpx;
+  border-radius: 36rpx;
+  background: #fff;
+  box-shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.06);
+  display: flex;
+  align-items: center;
+  padding: 0 28rpx;
+}
+
+.cat-search-icon {
+  width: 28rpx;
+  height: 28rpx;
+  flex-shrink: 0;
+}
+
+.cat-search-placeholder {
+  margin-left: 16rpx;
+  font-size: 28rpx;
+  font-weight: 500;
+  color: #999;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.cat-scroll-x {
+  width: 100%;
+  white-space: nowrap;
+}
+
+.cat-recipe-track {
+  display: inline-flex;
+  flex-direction: row;
+  padding: 8rpx 24rpx 16rpx;
+  gap: 36rpx;
+}
+
+.cat-recipe-item {
+  display: inline-flex;
+  flex-direction: column;
+  align-items: center;
+  width: 120rpx;
+  flex-shrink: 0;
+}
+
+.cat-recipe-ring {
+  width: 102rpx;
+  height: 102rpx;
+  border-radius: 50%;
+  padding: 0;
+  background: #fff;
+  box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.07);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+}
+
+.cat-recipe-ring--on {
+  border: 4rpx solid #14181b;
+}
+
+.cat-recipe-img {
+  width: 94rpx;
+  height: 94rpx;
+  border-radius: 50%;
+}
+
+.cat-recipe-label {
+  margin-top: 12rpx;
+  font-size: 22rpx;
+  line-height: 1.2;
+  color: #333;
+  text-align: center;
+  width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  font-weight: 500;
+}
+
+.cat-recipe-label--on {
+  color: #14181b;
+  font-weight: 600;
+}
+
+.cat-waterfall {
+  min-height: 200rpx;
+}
+
+.cat-dish-card {
+  background: #fff;
+  border-radius: 24rpx;
+  overflow: hidden;
+  box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.06);
+}
+
+.cat-dish-collect {
+  position: absolute;
+  z-index: 2;
+  top: 12rpx;
+  right: 12rpx;
+  width: 56rpx;
+  height: 56rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.cat-dish-collect-icon {
+  width: 44rpx;
+  height: 44rpx;
+  filter: drop-shadow(0 2rpx 6rpx rgba(0, 0, 0, 0.18));
+}
+
+.cat-dish-soldout {
+  position: absolute;
+  z-index: 2;
+  left: 16rpx;
+  top: 16rpx;
+  padding: 0 14rpx;
+  height: 48rpx;
+  border-radius: 24rpx;
+  background: rgba(20, 24, 27, 0.75);
+  color: #fff;
+  font-size: 24rpx;
+  font-weight: 500;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.cat-dish-body {
+  padding: 20rpx 20rpx 22rpx;
+}
+
+.cat-dish-price {
+  color: #e02e24;
+  font-size: 32rpx;
+  font-weight: 600;
+  line-height: 1.2;
+}
+
+.cat-dish-original {
+  margin-left: 10rpx;
+  color: #b3b3b3;
+  font-size: 22rpx;
+  text-decoration: line-through;
+  vertical-align: baseline;
+}
+
+.cat-dish-sales {
+  color: #999;
+  font-size: 24rpx;
+  line-height: 1.35;
+  max-width: 48%;
+  text-align: right;
+}
+
+.cat-dish-title {
+  color: #1a1a1a;
+  font-size: 28rpx;
+  font-weight: 500;
+  line-height: 1.45;
+}
+
+.cat-dish-member {
+  display: inline-flex;
+  align-items: center;
+  max-width: calc(100% - 88rpx);
+}
+
+.cat-dish-member-inner {
+  display: inline-block;
+  padding: 6rpx 18rpx;
+  border-radius: 999rpx;
+  background: linear-gradient(180deg, #fff5eb 0%, #ffe8d6 100%);
+  color: #c45c1a;
+  font-size: 24rpx;
+  font-weight: 500;
+  line-height: 1.35;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  max-width: 100%;
+}
+
+.cat-dish-add {
+  flex-shrink: 0;
+}
+
+.cat-dish-add__icon {
+  width: 56rpx;
+  height: 56rpx;
+  display: block;
+}
+
+.cat-dish-add--busy {
+  opacity: 0.45;
+  pointer-events: none;
+}
+
+.cat-dish-promo {
+  padding: 12rpx 16rpx;
+  border-radius: 12rpx;
+  background: #fff0f0;
+}
+
+.cat-dish-promo-text {
+  color: #e02e24;
+  font-size: 22rpx;
+  font-weight: 500;
+  line-height: 1.4;
+}
+
+.dish-new-ribbon {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 184rpx;
+  height: 184rpx;
+  overflow: hidden;
+  z-index: 5;
+  pointer-events: none;
+
+  &__text {
+    position: absolute;
+    top: 26rpx;
+    left: -66rpx;
+    width: 240rpx;
+    text-align: center;
+    font-size: 22rpx;
+    font-weight: 700;
+    color: #fff;
+    letter-spacing: 2rpx;
+    line-height: 44rpx;
+    background: #E23636;
+    transform: rotate(-45deg);
+  }
+}
+</style>

src/pages-store/pages/order/choose-address.vue

@@ -56,16 +56,18 @@ function handleClickSearch() {
           // 已存在：直接选择这个地址，走原有 chooseAddress 流程
           chooseAddress(exist)
         } else {
-          // 不存在：走新增地址流程
+          // 不存在：走新增地址流程（建筑类型首次在保存页以弹窗呈现）
+          addressStore.clearAddressInfo()
           addressStore.setAddressLocation({
             displayName: data.displayName,
             formattedAddress: data.formattedAddress,
             longitude: data.location.lng,
             latitude: data.location.lat,
           })
+          addressStore.pendingIntroBuildingType = true
           setTimeout(() => {
             uni.navigateTo({
-              url: '/pages/address/choose-type'
+              url: '/pages/address/save-address/other'
             })
           }, 300)
         }

src/pages-store/pages/order/components/cancel-order.vue

@@ -6,7 +6,7 @@ const emit = defineEmits(['confirm']);
 
 const show = ref(false);
 
-const sortOptions = [
+const sortOptions = computed(() => [
   {
     label: t('pages-store.store.cancelOrder.informationError'),
     value: 'time'
@@ -23,26 +23,29 @@ const sortOptions = [
     label: t('pages-store.store.cancelOrder.dontWant'),
     value: 'comment'
   }
-];
+]);
 const currentSort = ref(0);
 function handleClick(index: number) {
-  // show.value = false;
   currentSort.value = index;
 }
 
 function confirmCancel() {
-  console.log('取消订单', sortOptions[currentSort.value].label)
+  emit('confirm', sortOptions.value[currentSort.value].label);
-  emit('confirm', sortOptions[currentSort.value].label);
 }
 
 function onOpen() {
+  currentSort.value = 0;
   show.value = true;
 }
-function handleClose() {
+function onClose() {
   show.value = false;
 }
+function handleClose() {
+  onClose();
+}
 defineExpose({
   onOpen,
+  onClose,
 });
 </script>
 
@@ -59,7 +62,7 @@ defineExpose({
           class="w-28rpx h-28rpx absolute top-30rpx right-30rpx"
           mode="aspectFit"
       />
-      <view class="text-36rpx lh-36rpx text-#333 font-bold text-center mb-68rpx">{{ t('common.cancel') }}</view>
+      <view class="text-36rpx lh-36rpx text-#333 font-bold text-center mb-68rpx">{{ t('pages.order.cancelOrder') }}</view>
       <template v-for="(item, index) in sortOptions">
         <view @click="handleClick(index)" class="flex items-center mb-42rpx last:mb-0">
           <view class="w-48rpx h-48rpx shrink-0 mr-20rpx">

src/pages-store/pages/order/index.vue

@@ -1,20 +1,29 @@
 <script setup lang="ts">
 import {
   appMerchantOrderDetailPost,
-  appCollectCollectPost,
   type MerchantOrderVo,
-  appUserCardSelectDefaultPost, appMerchantOrderPayOrderPost, appMerchantOrderCancelOrderPost
+  appUserCardSelectDefaultPost,
+  appMerchantOrderPayOrderPost,
+  appMerchantOrderCancelOrderPost,
+  appMerchantOrderZipPayVoucherPost,
+  appMerchantOrderZipPayVoucherBatchPost,
 } from "@/service";
-import { debounce } from 'throttle-debounce'
+import ChooseImage from '@/components/choose-image/choose-image.vue'
+import {
+  resolveRequestErrorMessage,
+  isZipAmountChangedError,
+  isZipPendingReviewError,
+  stringifyOrderIds,
+} from '@/pages-store/pages/order/utils/checkout-order'
 const { t } = useI18n();
 import OrderProgress from './components/order-progress.vue'
 import OrderDetailSkeleton from './components/order-detail-skeleton.vue'
-import Collection from "@/components/collection/index.vue";
 import PriceDetail from "@/pages-store/pages/order/components/price-detail.vue";
 import CancelOrder from "@/pages-store/pages/order/components/cancel-order.vue";
 import {useConfigStore} from "@/store";
-import {CollectionType, OrderStatus, EventEnum, OrderCancelStatus} from "@/constant/enums";
+import {OrderStatus, EventEnum, OrderCancelStatus} from "@/constant/enums";
 import {formatTimestampWithMonthName, formatTimestampShort, navGoogleMap, callPhone} from "@/utils/utils";
+import dayjs from 'dayjs'
 import useEventEmit from "@/hooks/useEventEmit";
 const configStore = useConfigStore();
 
@@ -36,15 +45,15 @@ const openCancelOrder = () => {
   cancelOrderRef.value?.onOpen();
 };
 function confirmCancel(reason: string) {
-  console.log('取消订单', reason)
   appMerchantOrderCancelOrderPost({
     body: {
       orderId: orderDetail.value.id,
       cancelReason: reason,
     }
   }).then(res=> {
+    cancelOrderRef.value?.onClose()
     uni.showToast({
-      title: '取消订单成功',
+      title: t('pages-store.order.cancelSuccess'),
       icon: 'none',
     })
     setTimeout(() => {
@@ -72,13 +81,23 @@ const orderStepsCancel = ref([
 // 页面加载状态
 const loading = ref(true);
 const orderId = ref('')
+const zipVoucherOrderIds = ref<string[]>([])
+const zipVoucherPaymentAmount = ref(0)
+
 onLoad((options: any)=> {
   if(options.id) {
     orderId.value = options.id;
-    // appMerchantOrderDetail()
-    // 查询用户默认信用卡
-    appUserCardSelectDefault()
   }
+  if (options?.orderIds) {
+    zipVoucherOrderIds.value = stringifyOrderIds(String(options.orderIds).split(','))
+  }
+  if (options?.paymentAmount != null && options?.paymentAmount !== '') {
+    const amount = Number(options.paymentAmount)
+    if (Number.isFinite(amount) && amount > 0) {
+      zipVoucherPaymentAmount.value = amount
+    }
+  }
+  appUserCardSelectDefault()
 })
 
 onShow(()=> {
@@ -90,13 +109,19 @@ onShow(()=> {
 const orderDetail = ref<MerchantOrderVo>()
 function appMerchantOrderDetail() {
   loading.value = true;
-  appMerchantOrderDetailPost({
+  return appMerchantOrderDetailPost({
     params: {
       orderId: orderId.value,
     }
   }).then((res: any)=> {
     console.log('订单详情', res)
     orderDetail.value = res.data
+    if (!zipVoucherOrderIds.value.length && orderDetail.value?.id) {
+      zipVoucherOrderIds.value = stringifyOrderIds([orderDetail.value.id])
+    }
+    if (zipVoucherPaymentAmount.value <= 0 && orderDetail.value?.paidAmount != null) {
+      zipVoucherPaymentAmount.value = Number(orderDetail.value.paidAmount) || 0
+    }
     // 是自取订单还是配送订单 1-派送 2-自取
     if(orderDetail.value) {
       if(+orderDetail.value.receiveMethod === 2) {
@@ -115,6 +140,61 @@ const orderStatus = computed(() => {
   return ''
 })
 
+/** 税费及其他费用：按订单维度展示，非承载订单 deliveryFee/tip 为 0 */
+const taxesAndOtherFeesTotal = computed(() => {
+  const d = orderDetail.value
+  return (
+    (Number(d?.tax) || 0) +
+    (Number(d?.tip) || 0) +
+    (Number(d?.deliveryFee) || 0)
+  ).toFixed(2)
+})
+
+const orderDeliveryDateLabel = computed(() => {
+  const date = String((orderDetail.value as any)?.deliveryDate ?? '').trim()
+  if (!date) return ''
+  const d = dayjs(date)
+  return d.isValid() ? d.format('MM/DD/YYYY') : date
+})
+
+// ====== 为设计稿准备的数据结构（商品缩略卡/总件数/总价等）======
+const orderDishList = computed(() => {
+  const list = orderDetail.value?.merchantOrderDishVoList as unknown as Array<any> | null | undefined
+  if (!Array.isArray(list)) return []
+  return list
+})
+
+const orderTotalItemCount = computed(() => {
+  return orderDishList.value.reduce((sum, item) => sum + (Number(item?.count) || 0), 0)
+})
+
+const orderTotalItemCountText = computed(() => {
+  return `${t('pages.order.totalItemCountPrefix')}${orderTotalItemCount.value}${t('pages.order.totalItemCountSuffix')}`
+})
+
+const orderTotalPrice = computed(() => {
+  const n = orderDetail.value?.paidAmount ?? orderDetail.value?.actualPrice ?? 0
+  return Number(n).toFixed(2)
+})
+
+function dishCover(dishItem: any) {
+  const img = dishItem?.merchantDishVo?.dishImage
+  if (!img || typeof img !== 'string') return ''
+  return img.split(',')[0] || ''
+}
+
+function dishTitle(dishItem: any) {
+  return dishItem?.merchantDishVo?.dishName ?? ''
+}
+
+const payMethodText = computed(() => {
+  const method = orderDetail.value?.payMethod
+  if (method === 1) return t('pages-user.choosePaymethod.creditCard')
+  if (method === 2) return t('pages-user.choosePaymethod.wallet')
+  if (method === 3) return t('pages-store.order.payMethodZip')
+  return '--'
+})
+
 // 复制订单号
 const copyOrderNumber = (text: string) => {
   if(!text) return
@@ -133,33 +213,11 @@ const callPhoneFn = (phone: string) => {
   callPhone(phone)
 }
 
-// 收藏店铺
-function handleCollectionClick() {
-  debouncedEmit(orderDetail.value?.merchantVo?.id, CollectionType.STORE, ()=> {
-    if (orderDetail.value?.merchantVo) {
-      orderDetail.value.merchantVo.isCollect = !orderDetail.value.merchantVo.isCollect
-    }
-  })
-}
-// 防抖处理函数
-const debouncedEmit = debounce(1300, (id: any, type: CollectionType, callback: ()=> void) => {
-  // 收藏接口
-  appCollectCollectPost({
-    body: {
-      targetId: id,
-      targetType: type
-    }
-  }).then(res=> {
-    callback()
-  })
-}, {
-  atBegin: true, // 立即触发
-})
-
 // 支付参数
 const payMethodOptions = ref({
   orderId: '',
   cardId: '',
+  cardNumber: '',
   payMethod: 1, // 支付方式 1信用卡 2余额
   payPassword: '',
 })
@@ -188,9 +246,20 @@ function goPay() {
   // 如果是余额支付,弹出支付密码弹窗
   if(payMethodOptions.value.payMethod === 2) {
     passwordInputRef.value?.showPasswordInput()
-  } else {
+    return
-    appMerchantOrderPayOrder()
   }
+  // 信用卡支付：必须已绑定卡（与 appMerchantOrderPayOrder 入参一致，避免 cardId/cardNumber 为空仍请求）
+  if (payMethodOptions.value.payMethod === 1) {
+    const cardId = String(payMethodOptions.value.cardId || '').trim()
+    if (!cardId) {
+      uni.showToast({
+        title: t('pages-store.order.pleaseBindCreditCard'),
+        icon: 'none',
+      })
+      return
+    }
+  }
+  appMerchantOrderPayOrder()
 }
 function payPawSuccess(password: string) {
   payMethodOptions.value.payPassword = password
@@ -227,21 +296,177 @@ function openQrCode() {
 function navigateTo(url: string) {
   uni.navigateTo({ url })
 }
+
+/** 订单详情顶栏：与设计稿一致的 MM/DD HH:mm */
+function formatOrderNavScheduleTime(timestamp?: number | string | null) {
+  if (timestamp == null || timestamp === '') return ''
+  const n = Number(timestamp)
+  if (!Number.isFinite(n)) return ''
+  return dayjs(n).format('MM/DD HH:mm')
+}
+
+function handleOrderDetailBack() {
+  const pages = getCurrentPages?.() || []
+  if (pages.length <= 1) {
+    uni.switchTab({ url: '/pages/home/index' })
+    return
+  }
+  uni.navigateBack()
+}
+
+/** 顶栏居中展示「预计送达 / 下单时间」：非取消、非退款申请中、非商家拒绝 */
+const showOrderNavTimeBlock = computed(() => {
+  if (!orderDetail.value) return false
+  if (orderStatus.value === OrderStatus.CANCELLED) return false
+  if (orderDetail.value.refundStatus === OrderCancelStatus.APPLIED) return false
+  if (orderStatus.value === OrderStatus.MERCHANT_REJECTED) return false
+  return true
+})
+
+const orderNavPrimaryLine = computed(() => {
+  const d = orderDetail.value
+  if (!d) return ''
+  const isDelivery = +(d.receiveMethod ?? 0) === 1
+  const label = isDelivery
+      ? t('pages-store.order.estimatedDeliveryTime')
+      : t('pages-store.order.upTime')
+  const timePart = formatOrderNavScheduleTime(d.endScheduledTime) || '--'
+  const suffix = isDelivery ? t('pages-store.order.beforeDeadline') : ''
+  return `${label} : ${timePart}${suffix}`
+})
+
+const orderNavSecondaryLine = computed(() => {
+  const d = orderDetail.value
+  if (!d) return ''
+  const ct = d.createTime
+  const timeStr =
+      formatOrderNavScheduleTime(ct) ||
+      (ct != null && ct !== '' ? formatTimestampShort(Number(ct)) : '')
+  return `${t('pages-store.order.orderTime')}: ${timeStr || '--'}`
+})
+
+// 已支付上传凭证（Zip 等线下支付）
+const voucherChooseRef = ref<InstanceType<typeof ChooseImage>>()
+const voucherSubmitting = ref(false)
+
+function openUploadVoucher() {
+  voucherChooseRef.value?.init()
+}
+
+function normalizeVoucherUrl(payload: unknown): string {
+  if (Array.isArray(payload)) {
+    const first = payload[0]
+    return typeof first === 'string' ? first : ''
+  }
+  return typeof payload === 'string' ? payload : ''
+}
+
+async function submitZipPayVoucher(zipPayVoucher: string) {
+  const orderIds = zipVoucherOrderIds.value.length
+    ? zipVoucherOrderIds.value
+    : stringifyOrderIds([orderDetail.value?.id])
+  const paymentAmount = zipVoucherPaymentAmount.value > 0
+    ? zipVoucherPaymentAmount.value
+    : Number(orderDetail.value?.paidAmount ?? 0)
+  if (!orderIds.length || paymentAmount <= 0) {
+    throw new Error(t('pages-store.order.zipPayAmountInvalid'))
+  }
+  if (orderIds.length > 1) {
+    await appMerchantOrderZipPayVoucherBatchPost({
+      body: {
+        orderIds,
+        zipPayVoucher,
+        paymentAmount,
+      },
+      options: { hideErrorToast: true },
+    })
+    return
+  }
+  await appMerchantOrderZipPayVoucherPost({
+    body: {
+      orderId: orderIds[0],
+      zipPayVoucher,
+      paymentAmount,
+    },
+    options: { hideErrorToast: true },
+  })
+}
+
+async function onVoucherImageUploaded(urls: unknown) {
+  const zipPayVoucher = normalizeVoucherUrl(urls)
+  if (!zipPayVoucher) {
+    uni.showToast({ title: t('pages-store.order.voucherUploadFailed'), icon: 'none' })
+    return
+  }
+  const id = orderDetail.value?.id
+  if (id == null || String(id).trim() === '') {
+    uni.showToast({ title: t('pages-store.order.voucherUploadFailed'), icon: 'none' })
+    return
+  }
+  if (voucherSubmitting.value) return
+  voucherSubmitting.value = true
+  try {
+    await submitZipPayVoucher(zipPayVoucher)
+    uni.showToast({ title: t('pages-store.order.voucherSubmitSuccess'), icon: 'none' })
+    setTimeout(() => {
+      appMerchantOrderDetail()
+    }, 500)
+  } catch (err) {
+    const message = resolveRequestErrorMessage(err, t('pages-store.order.voucherSubmitFailed'))
+    if (isZipAmountChangedError(message)) {
+      await appMerchantOrderDetail()
+      if (zipVoucherPaymentAmount.value <= 0) {
+        zipVoucherPaymentAmount.value = Number(orderDetail.value?.paidAmount ?? 0)
+      }
+      uni.showToast({ title: t('pages-store.order.zipPayAmountChanged'), icon: 'none' })
+      return
+    }
+    if (isZipPendingReviewError(message)) {
+      uni.showToast({ title: t('pages-store.order.zipPayPendingReview'), icon: 'none' })
+      return
+    }
+    uni.showToast({ title: message, icon: 'none' })
+  } finally {
+    voucherSubmitting.value = false
+  }
+}
 </script>
 
 <template>
-  <navbar />
+  <view class="order-detail-page">
-  <view
+    <wd-navbar
-      class="animate-in fade-in animate-ease-out animate-duration-300"
+        safeAreaInsetTop
-      v-show="loading"
+        fixed
-  >
+        placeholder
-    <!-- 骨架屏 -->
+        :bordered="false"
-    <OrderDetailSkeleton />
+        custom-class="order-detail-navbar !bg-white"
-  </view>
+        @click-left="handleOrderDetailBack"
-  <view
+    >
-      class="animate-in fade-in animate-ease-in animate-duration-300"
+      <template #left>
-      v-if="!loading"
+        <view class="shrink-0">
-  >
+          <view class="order-detail-navbar-circle center">
+            <view class="i-carbon:chevron-left text-44rpx text-#111"></view>
+          </view>
+        </view>
+      </template>
+      <template #title>
+        <view v-if="!loading && orderDetail && showOrderNavTimeBlock" class="order-detail-nav-times">
+          <text class="order-detail-nav-primary">{{ orderNavPrimaryLine }}</text>
+          <text class="order-detail-nav-secondary">{{ orderNavSecondaryLine }}</text>
+        </view>
+      </template>
+    </wd-navbar>
+    <view
+        class="animate-in fade-in animate-ease-out animate-duration-300"
+        v-show="loading"
+    >
+      <!-- 骨架屏 -->
+      <OrderDetailSkeleton />
+    </view>
+    <view
+        class="animate-in fade-in animate-ease-in animate-duration-300 bg-white"
+        v-if="!loading"
+    >
     <!-- 已取消-成功取消 -->
     <template v-if="orderStatus === OrderStatus.CANCELLED">
       <view class="px-30rpx pt-20rpx pb-50rpx">
@@ -262,34 +487,27 @@ function navigateTo(url: string) {
       </view>
     </template>
     <!-- 商家拒绝订单 -->
-    <template v-if="orderStatus === OrderStatus.MERCHANT_REJECTED">
+    <template v-else-if="orderStatus === OrderStatus.MERCHANT_REJECTED">
-      <view class="px-30rpx pt-20rpx pb-50rpx">
+      <view class="px-30rpx pt-8rpx pb-40rpx">
         <view class="text-40rpx lh-36rpx text-#333 font-500">{{ t('pages-store.order.orderStatus.merchantRejected') }}</view>
         <view class="text-28rpx lh-28rpx text-#7D7D7D mt-26rpx">{{ t('pages-store.order.orderStatus.merchantRejectedDesc') }}</view>
       </view>
     </template>
     <template v-else>
-      <view class="px-30rpx pt-20rpx pb-50rpx">
+      <!-- 顶栏已展示预计送达/下单时间；此处仅保留提示类副文案 -->
-        <view class="text-40rpx lh-36rpx text-#333 font-500">
+      <view class="px-30rpx pt-8rpx pb-24rpx" v-if="orderStatus === OrderStatus.PENDING_PAYMENT || orderDetail?.refundStatus === OrderCancelStatus.REJECTED">
-          <template v-if="orderDetail?.receiveMethod === 1">
+        <view class="text-28rpx lh-36rpx text-#7D7D7D" v-if="orderStatus === OrderStatus.PENDING_PAYMENT">
-            {{ t('pages-store.order.estimatedDeliveryTime') }}
+          {{ t('pages-store.order.autoCancellation') }}
-          </template>
-          <template v-else>{{ t('pages-store.order.upTime') }}</template>
-          :
-<!--          订单预计送达时间-->
-          {{ formatTimestampShort(orderDetail?.endScheduledTime) }}
         </view>
-        <view class="text-28rpx lh-28rpx text-#7D7D7D mt-26rpx">
+        <view class="text-28rpx lh-36rpx text-#7D7D7D mt-16rpx" v-if="orderDetail?.refundStatus === OrderCancelStatus.REJECTED">
-          <view>{{ t('pages-store.order.orderTime') }}: {{ formatTimestampShort(orderDetail?.createTime) }}</view>
-          <!-- 订单30分钟自动取消--待支付 -->
-          <view v-if="orderStatus === OrderStatus.PENDING_PAYMENT">{{ t('pages-store.order.autoCancellation') }}</view>
-        </view>
-        <view class="text-28rpx lh-28rpx text-#7D7D7D mt-26rpx" v-if="orderDetail?.refundStatus === OrderCancelStatus.REJECTED">
           {{ t('pages-store.order.rejectReason') }}：{{ orderDetail?.rejectReason }}
         </view>
       </view>
-      <!-- 订单进度 -->
+      <!-- 订单进度（紧接顶栏时间信息） -->
-      <view v-if="orderDetail?.refundStatus !== OrderCancelStatus.APPLIED || orderDetail?.refundStatus !== OrderCancelStatus.APPROVED" class="mb-52rpx px-30rpx">
+      <view
+          v-if="orderDetail?.refundStatus !== OrderCancelStatus.APPLIED && orderDetail?.refundStatus !== OrderCancelStatus.APPROVED"
+          class="order-detail-progress-wrap mb-52rpx px-30rpx"
+      >
         <OrderProgress
             :steps="orderSteps"
             :current-status="orderStatus"
@@ -350,58 +568,77 @@ function navigateTo(url: string) {
         </view>
         <view class="text-30rpx lh-30rpx text-#333 mb-24rpx mt-36rpx">{{ t('pages-store.order.deliveryPhotos') }}</view>
         <view class="flex items-center gap-20rpx">
-          <template v-for="item in orderDetail?.deliveryPhotos?.split(',')">
+          <view
+              v-for="(item, idx) in orderDetail?.deliveryPhotos?.split(',')"
+              :key="`${idx}-${item}`"
+          >
             <wd-img width="158rpx" height="158rpx" radius="16rpx" mode="aspectFill" :src="item" :enable-preview="true" />
-          </template>
+          </view>
         </view>
       </view>
       <view class="w-full h-16rpx bg-#F6F6F6"></view>
     </view>
 
     <!-- 商品列表 -->
-    <view class="px-30rpx py-36rpx">
+    <view class="goods-section px-30rpx py-24rpx">
-      <!-- 商家信息 -->
+      <view class="goods-layout">
-      <view @click="navigateTo('/pages-store/pages/store/index?id=' + orderDetail?.merchantVo?.id)" class="flex-center-sb h-80rpx mb-36rpx">
+        <view class="goods-left">
-        <view class="flex items-center">
+          <!-- 门店行：图标 + 店铺名 + 右箭头 -->
-          <image
+          <view
-              :src="orderDetail?.merchantVo?.logo"
+              @click="navigateTo('/pages-store/pages/store/index?id=' + orderDetail?.merchantVo?.id)"
-              mode="aspectFill"
+              class="store-row-detail flex-center-sb mb-20rpx"
-              class="w-80rpx h-80rpx rounded-full bg-#F2F2F2 mr-24rpx shrink-0"
+          >
-          />
+            <view class="flex items-center min-w-0">
-          <text class="text-30rpx lh-30rpx text-#333 font-500">{{ orderDetail?.merchantVo?.merchantName }}</text>
+              <image
-          <image
+                  src="@img/chef/126.png"
-              src="@img/chef/142.png"
+                  class="w-40rpx h-40rpx shrink-0 mr-16rpx"
-              class="w-32rpx h-32rpx shrink-0 ml-10rpx"
+                  mode="aspectFit"
-          ></image>
+              />
-        </view>
+              <text class="text-30rpx lh-36rpx text-#333 font-500 line-clamp-1">
-        <collection :is-collected="orderDetail?.merchantVo?.isCollect" @collectionChange="handleCollectionClick" />
+                {{ orderDetail?.merchantVo?.merchantName }}
-      </view>
+              </text>
-
-      <view
-          v-for="item in orderDetail?.merchantOrderDishVoList"
-          :key="item.id"
-          class="flex items-start mb-32rpx last:mb-0"
-      >
-        <!-- 商品图片 -->
-        <view class="w-136rpx h-136rpx rounded-16rpx overflow-hidden mr-20rpx shrink-0">
-          <image
-              :src="item.merchantDishVo?.dishImage?.split(',')[0]"
-              mode="aspectFill"
-              class="w-full h-full bg-#F2F2F2"
-          />
-        </view>
-
-        <!-- 商品信息 -->
-        <view class="flex-1">
-          <text class="text-30rpx lh-30rpx text-#333 font-500 block mb-20rpx">{{ item.merchantDishVo?.dishName }}</text>
-          <view class="flex-center-sb text-24rpx lh-24rpx text-#7D7D7D mb-24rpx">
-            <text class="line-clamp-1">{{ item.merchantSideDishVo?.sideDishName }} {{ item.merchantSideDishItemVo?.name }}</text>
-            <!-- 数量 -->
-            <view class="shrink-0 text-28rpx lh-28rpx text-#333 text-right font-500">
-              X {{ item.count }}
             </view>
+            <image
+                src="@img/chef/142.png"
+                class="w-28rpx h-28rpx shrink-0"
+                mode="aspectFit"
+            />
           </view>
-          <text class="text-30rpx lh-30rpx text-#333 font-500">{{ `$${item.merchantDishVo?.discountPrice}` }}</text>
+
+          <!-- 商品缩略卡横向滚动 -->
+          <scroll-view
+              scroll-x
+              class="goods-scroll"
+              :show-scrollbar="false"
+              :enable-flex="true"
+          >
+            <view class="goods-track">
+              <view
+                  v-for="(item, di) in orderDishList"
+                  :key="item.id ?? di"
+                  class="goods-cell"
+              >
+                <view class="goods-img-wrap">
+                  <image
+                      :src="dishCover(item)"
+                      mode="aspectFill"
+                      class="goods-img"
+                  />
+                  <view v-if="Number(item?.count) > 1" class="goods-qty">
+                    x{{ item?.count }}
+                  </view>
+                </view>
+                <text class="goods-caption line-clamp-2">{{ dishTitle(item) }}</text>
+              </view>
+            </view>
+          </scroll-view>
+        </view>
+
+        <view class="goods-price-right">
+          <text class="goods-price">${{ orderTotalPrice }}</text>
+          <text class="goods-count">
+            {{ orderTotalItemCountText }}
+          </text>
         </view>
       </view>
     </view>
@@ -409,8 +646,14 @@ function navigateTo(url: string) {
     <!-- 分隔线 -->
     <view class="w-full h-16rpx bg-#F6F6F6"></view>
 
-    <view v-if="orderDetail?.receiveMethod === 1" class="pt-36rpx">
+    <view v-if="orderDetail?.receiveMethod === 1" class="pt-36rpx bg-white">
       <view class="text-36rpx lh-36rpx text-#333 font-500 pl-30rpx mb-4rpx">{{ t('pages-store.order.deliveryAddress') }}</view>
+      <view
+          v-if="orderDeliveryDateLabel"
+          class="text-28rpx lh-28rpx text-#6D6D6D pl-30rpx mb-16rpx"
+      >
+        {{ t('pages-store.order.deliveryDate') }}: {{ orderDeliveryDateLabel }}
+      </view>
 
       <!-- 收货地址 -->
       <view class="flex items-center border-bottom py-36rpx px-30rpx">
@@ -441,7 +684,6 @@ function navigateTo(url: string) {
           {{ orderDetail?.deliveryMethod }}
         </view>
       </view>
-      <!-- 联系电话 -->
       <view
           class="flex items-center py-36rpx px-30rpx"
       >
@@ -457,7 +699,7 @@ function navigateTo(url: string) {
     </view>
     <!-- 分隔线 -->
 
-    <view v-else class="px-30rpx pt-36rpx">
+    <view v-else class="px-30rpx pt-36rpx bg-white">
       <view class="text-36rpx lh-36rpx text-#333 font-bold">{{ t('pickupAddress') }}</view>
       <view class="flex-center-sb py-40rpx">
         <view class="flex items-center">
@@ -486,7 +728,7 @@ function navigateTo(url: string) {
 
     <view class="w-full h-16rpx bg-#F6F6F6"></view>
 
-    <view class="border-bottom px-30rpx py-36rpx text-36rpx lh-36rpx text-#333 ">
+    <view class="bg-white border-bottom px-30rpx py-36rpx text-36rpx lh-36rpx text-#333 ">
       <view class="font-500 text-36rpx lh-36rpx mb-40rpx">{{ t('pages-store.order.orderInfo') }}</view>
       <!-- 订单编号 -->
       <view @click="copyOrderNumber(orderDetail?.orderNo)" class="flex-center-sb text-30rpx lh-30rpx mb-40rpx">
@@ -501,11 +743,10 @@ function navigateTo(url: string) {
         </view>
       </view>
       <!-- 下单时间 mb-40rpx根据支付状态显示 -->
-      <view class="flex-center-sb text-30rpx lh-30rpx" :class="[orderStatus !== OrderStatus.PENDING_PAYMENT ? 'mb-40rpx' : '']">
+      <view class="flex-center-sb text-30rpx lh-30rpx mb-40rpx">
         <text>{{ t('pages-store.order.orderTime') }}</text>
         <text>{{ formatTimestampWithMonthName(orderDetail?.createTime) }}</text>
       </view>
-      <!-- 待支付 -->
       <template v-if="orderStatus !== OrderStatus.PENDING_PAYMENT">
         <!-- 支付方式 -->
         <view class="flex-center-sb text-30rpx lh-30rpx mb-40rpx">
@@ -516,14 +757,9 @@ function navigateTo(url: string) {
                 mode="aspectFill"
                 class="w-44rpx h-44rpx shrink-0 mr-10rpx"
             />
-            <text>{{ orderDetail?.payMethod === 1 ? t('pages-user.choosePaymethod.creditCard') : t('pages-user.choosePaymethod.wallet') }}</text>
+            <text>{{ payMethodText }}</text>
           </view>
         </view>
-        <!-- 支付时间 -->
-        <view class="flex-center-sb text-30rpx lh-30rpx">
-          <text>{{ t('pages-user.member.payTime') }}</text>
-          <text>{{ formatTimestampWithMonthName(orderDetail?.payTime) }}</text>
-        </view>
       </template>
     </view>
 
@@ -545,7 +781,7 @@ function navigateTo(url: string) {
           />
         </view>
         <view>
-          <text>${{ (Number(orderDetail?.tax) + Number(orderDetail?.tip) + Number(orderDetail?.deliveryFee)).toFixed(2) }}</text>
+          <text>${{ taxesAndOtherFeesTotal }}</text>
         </view>
       </view>
       <view class="flex-center-sb">
@@ -606,12 +842,21 @@ function navigateTo(url: string) {
         </template>
       </template>
       <template v-else>
-        <!-- 待支付 -->
         <template v-if="orderStatus === OrderStatus.PENDING_PAYMENT">
-          <wd-button @click="goPay" custom-class="!h-108rpx !bg-14181B !text-36rpx !lh-108rpx !text-#fff !rounded-16rpx" block>
+          <!-- 上传支付凭证 -->
+          <wd-button
+              :loading="voucherSubmitting"
+              :disabled="voucherSubmitting"
+              @click="openUploadVoucher"
+              custom-class="!h-108rpx !bg-transparent !text-32rpx !font-500 !lh-108rpx !text-#333 !rounded-46rpx !border-#666666 !border-solid !border-1rpx"
+              block
+            >
+              {{ t('pages-store.order.uploadPaidVoucher') }}
+            </wd-button>
+          <wd-button @click="goPay" custom-class="!h-108rpx !bg-14181B !text-32rpx !lh-108rpx !text-#fff !rounded-46rpx !mt-22rpx" block>
             {{ t('common.goPay') }}
           </wd-button>
-          <view @click="openCancelOrder" class="text-center  mt-52rpx text-36rpx lh-36rpx text-#333 font-500">
+          <view @click="openCancelOrder" class="text-center  mt-22rpx text-28rpx lh-28rpx text-#333 font-500">
             {{ t('common.cancel') }}
           </view>
         </template>
@@ -678,13 +923,154 @@ function navigateTo(url: string) {
     <!-- 支付订单 -->
     <password-container @success="payPawSuccess" ref="passwordInputRef" />
     <!-- 核销订单 -->
-    <use-code ref="useCodeRef" />
+      <use-code ref="useCodeRef" />
+    <!-- 支付凭证：相册/拍照，上传后回调真实 URL -->
+    <choose-image ref="voucherChooseRef" :count="1" @change="onVoucherImageUploaded" />
+    </view>
   </view>
 </template>
 <style>
 page {
-  background-color: #fff;
+  background-color: #F6F6F6;
 }
 </style>
 <style scoped>
+/* 订单详情：商品缩略卡横向滚动（对齐设计稿） */
+.goods-section {
+  background: #fff;
+}
+
+.goods-layout {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-end;
+}
+
+.goods-left {
+  flex: 1;
+  min-width: 0;
+}
+
+.store-row-detail {
+  align-items: center;
+}
+
+.goods-price-right {
+  flex-shrink: 0;
+  text-align: right;
+  padding-left: 24rpx;
+  padding-bottom: 10rpx;
+}
+
+.goods-price {
+  display: block;
+  font-size: 32rpx;
+  line-height: 40rpx;
+  font-weight: 700;
+  color: #14181B;
+}
+
+.goods-count {
+  display: block;
+  margin-top: 8rpx;
+  font-size: 24rpx;
+  line-height: 30rpx;
+  color: #7D7D7D;
+  font-weight: 500;
+}
+
+.goods-scroll {
+  width: 100%;
+}
+
+.goods-track {
+  display: flex;
+  flex-direction: row;
+  gap: 16rpx;
+  padding-right: 8rpx;
+}
+
+.goods-cell {
+  width: 128rpx;
+  flex-shrink: 0;
+}
+
+.goods-img-wrap {
+  position: relative;
+  width: 128rpx;
+  height: 128rpx;
+  border-radius: 16rpx;
+  overflow: hidden;
+  background: #F2F2F2;
+}
+
+.goods-img {
+  width: 100%;
+  height: 100%;
+}
+
+.goods-qty {
+  position: absolute;
+  right: 6rpx;
+  bottom: 6rpx;
+  min-width: 36rpx;
+  padding: 4rpx 10rpx;
+  background: rgba(20, 24, 27, 0.85);
+  color: #fff;
+  font-size: 20rpx;
+  line-height: 24rpx;
+  border-radius: 8rpx;
+  text-align: center;
+}
+
+.goods-caption {
+  display: block;
+  margin-top: 10rpx;
+  font-size: 22rpx;
+  line-height: 28rpx;
+  color: #333;
+}
+
+.order-detail-navbar-circle {
+  width: 72rpx;
+  height: 72rpx;
+  border-radius: 50%;
+  background-color: #fff;
+  box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.08);
+}
+
+.order-detail-nav-times {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 0 8rpx;
+  max-width: 480rpx;
+}
+
+.order-detail-nav-primary {
+  font-size: 28rpx;
+  line-height: 36rpx;
+  font-weight: 600;
+  color: #14181b;
+  text-align: center;
+}
+
+.order-detail-nav-secondary {
+  margin-top: 6rpx;
+  font-size: 24rpx;
+  line-height: 30rpx;
+  color: #7d7d7d;
+  text-align: center;
+}
+
+.order-detail-progress-wrap {
+  padding-top: 8rpx;
+}
+
+:deep(.order-detail-navbar.wd-navbar .wd-navbar__title) {
+  max-width: 520rpx;
+  overflow: visible;
+  white-space: normal;
+}
 </style>

src/pages-store/pages/order/utils/checkout-order.ts

@@ -0,0 +1,209 @@
+import dayjs from 'dayjs'
+import type { MerchantAppointmentSlot } from '@/utils/deliverySchedule'
+
+/** 小费选项：下次一定（$0） */
+export const TIP_NEXT_TIME = -1
+
+export function formatDeliveryDateKey(startTime?: number | string | null): string {
+  if (startTime == null || startTime === '') return ''
+  const d = dayjs(Number(startTime))
+  return d.isValid() ? d.format('YYYY-MM-DD') : ''
+}
+
+export function formatDeliveryDateLabel(dateKey: string): string {
+  if (!dateKey) return ''
+  const d = dayjs(dateKey)
+  return d.isValid() ? d.format('MM/DD') : dateKey
+}
+
+export function collectDeliveryDatesFromMerchants(
+  merchants: Array<{ id?: string | number }>,
+  appointmentMap: Record<string, MerchantAppointmentSlot>,
+): string[] {
+  const set = new Set<string>()
+  merchants.forEach((m) => {
+    const dateKey = formatDeliveryDateKey(appointmentMap[String(m.id)]?.startTime)
+    if (dateKey) set.add(dateKey)
+  })
+  return Array.from(set).sort()
+}
+
+export function resolveTipAmount(tipIndex: number, diyTip?: string): number {
+  const diy = String(diyTip ?? '').trim()
+  if (diy) return Number(diy) || 0
+  if (tipIndex === TIP_NEXT_TIME || tipIndex <= 0) return 0
+  return tipIndex
+}
+
+export function buildDeliveryDateTipMap(
+  dates: string[],
+  indexMap: Record<string, number>,
+  diyMap: Record<string, string>,
+): Record<string, number> {
+  const map: Record<string, number> = {}
+  dates.forEach((date) => {
+    map[date] = resolveTipAmount(indexMap[date] ?? TIP_NEXT_TIME, diyMap[date])
+  })
+  return map
+}
+
+export function buildReceiveMethod(deliveryMethodIndex: number): number {
+  return deliveryMethodIndex === 0 ? 1 : 2
+}
+
+export function optionalAddressId(
+  receiveMethod: number,
+  addressId: string | number | undefined | null,
+): string | undefined {
+  if (receiveMethod !== 1) return undefined
+  const id = String(addressId ?? '').trim()
+  return id || undefined
+}
+
+export function stringifyId(id: string | number | undefined | null): string | undefined {
+  const s = String(id ?? '').trim()
+  return s || undefined
+}
+
+export function stringifyCartIds(ids: Array<string | number>): string[] {
+  return ids.map((id) => String(id)).filter(Boolean)
+}
+
+type SchedulePayload = {
+  startScheduledTime?: number
+  endScheduledTime?: number
+  startMap: Record<string, number>
+  endMap: Record<string, number>
+}
+
+export function appendDeliveryScheduleFields(
+  body: Record<string, unknown>,
+  deliveryTimeType: number,
+  options: {
+    isBatch: boolean
+    storeId?: string
+    showDeliveryTime?: string
+    diyTime?: { startTime?: number; endTime?: number }
+    merchants: Array<{ id?: string | number }>
+    appointmentMap: Record<string, MerchantAppointmentSlot>
+    buildScheduledTimePayload: (
+      merchants: Array<{ id?: string | number }>,
+      map: Record<string, MerchantAppointmentSlot>,
+    ) => SchedulePayload
+    getTimeStamps?: (timeStr: string) => { startTimestamp: number; endTimestamp: number }
+  },
+) {
+  body.deliveryType = deliveryTimeType
+  if (deliveryTimeType !== 2) return
+
+  if (options.isBatch) {
+    const scheduled = options.buildScheduledTimePayload(
+      options.merchants,
+      options.appointmentMap,
+    )
+    if (scheduled.startScheduledTime != null) {
+      body.startScheduledTime = scheduled.startScheduledTime
+      body.endScheduledTime = scheduled.endScheduledTime
+    }
+    if (Object.keys(scheduled.startMap).length > 0) {
+      body.merchantStartScheduledTimeMap = scheduled.startMap
+      body.merchantEndScheduledTimeMap = scheduled.endMap
+    }
+    return
+  }
+
+  const ap = options.appointmentMap[String(options.storeId ?? '')]
+  body.startScheduledTime = ap?.startTime ?? options.diyTime?.startTime
+  body.endScheduledTime = ap?.endTime ?? options.diyTime?.endTime
+}
+
+function sumUniqueDeliveryDateFees(
+  list: unknown,
+  feeKey: 'groupDeliveryFee' | 'groupTip',
+): number {
+  if (!Array.isArray(list)) return 0
+  const seen = new Set<string>()
+  let sum = 0
+  list.forEach((item: any) => {
+    const date = String(item?.deliveryDate ?? '').trim()
+    if (!date || seen.has(date)) return
+    seen.add(date)
+    sum += Number(item?.[feeKey] ?? 0) || 0
+  })
+  return sum
+}
+
+export function pickCheckoutDeliveryFee(price: Record<string, any> | null | undefined, isBatch: boolean): number {
+  if (!price) return 0
+  if (isBatch) {
+    if (price.groupDeliveryFee != null && price.groupDeliveryFee !== '') {
+      return Number(price.groupDeliveryFee) || 0
+    }
+    const fromList = sumUniqueDeliveryDateFees(price.deliveryDateSummaryList, 'groupDeliveryFee')
+    if (fromList > 0) return fromList
+    return Number(price.totalDeliveryFee ?? price.deliveryFee ?? 0) || 0
+  }
+  return Number(price.deliveryFee ?? 0) || 0
+}
+
+export function pickCheckoutTip(price: Record<string, any> | null | undefined, isBatch: boolean): number {
+  if (!price) return 0
+  if (isBatch) {
+    if (price.groupTip != null && price.groupTip !== '') {
+      return Number(price.groupTip) || 0
+    }
+    const fromList = sumUniqueDeliveryDateFees(price.deliveryDateSummaryList, 'groupTip')
+    if (fromList > 0) return fromList
+    return Number(price.totalTip ?? price.tip ?? 0) || 0
+  }
+  return Number(price.tip ?? 0) || 0
+}
+
+export function pickCheckoutPaidAmount(price: Record<string, any> | null | undefined, isBatch: boolean): number {
+  if (!price) return 0
+  if (isBatch) {
+    return Number(price.totalPaidAmount ?? price.paidAmount ?? 0) || 0
+  }
+  return Number(price.paidAmount ?? 0) || 0
+}
+
+export function pickCheckoutGoodsAmount(price: Record<string, any> | null | undefined, isBatch: boolean): number {
+  if (!price) return 0
+  if (isBatch) {
+    return Number(price.totalActualAmount ?? price.actualAmount ?? 0) || 0
+  }
+  return Number(price.actualAmount ?? 0) || 0
+}
+
+export function pickCheckoutTax(price: Record<string, any> | null | undefined, isBatch: boolean): number {
+  if (!price) return 0
+  if (isBatch) {
+    return Number(price.totalTax ?? price.tax ?? 0) || 0
+  }
+  return Number(price.tax ?? 0) || 0
+}
+
+export function stringifyOrderIds(ids: Array<string | number | null | undefined>): string[] {
+  return ids.map((id) => String(id ?? '').trim()).filter(Boolean)
+}
+
+/** ZIP 凭证提交应付总额（支付组维度） */
+export function pickZipPaymentAmount(
+  price: Record<string, any> | null | undefined,
+  isBatch: boolean,
+): number {
+  return pickCheckoutPaidAmount(price, isBatch)
+}
+
+export function resolveRequestErrorMessage(err: unknown, fallback: string): string {
+  const e = err as { msg?: string; message?: string; data?: { msg?: string } }
+  return String(e?.msg || e?.data?.msg || e?.message || fallback).trim() || fallback
+}
+
+export function isZipPendingReviewError(message: string): boolean {
+  return /ZIP.*待审核|待审核.*ZIP/i.test(message)
+}
+
+export function isZipAmountChangedError(message: string): boolean {
+  return /支付组金额已变化|金额已变化.*凭证/i.test(message)
+}

src/pages-store/pages/store/components/coupon-popup.vue

@@ -1,6 +1,10 @@
 <script setup lang="ts">
 import {useConfigStore} from "@/store";
 import {receiveCouponApi} from "@/pages-user/service";
+import couponBg from '@img-store/coupon.png'
+import couponBg2 from '@img-store/coupon-2.png'
+import couponRightBg from '@img-store/coupon-right.png'
+import couponRightBg2 from '@img-store/coupon-right-2.png'
 const configStore = useConfigStore()
 
 const { t, locale } = useI18n()
@@ -57,17 +61,16 @@ function formatMoney(value: unknown) {
   return n.toFixed(2)
 }
 
-function couponTitleText(item: any) {
+function couponAmountText(item: any) {
   const type = Number(item?.couponType)
   const discountValue = Number(item?.discountValue)
 
-  // 标题保持原样：折扣券显示百分比，满减券只显示减免金额（不展示门槛）
   if (type === 1) {
     const pct = Number.isFinite(discountValue) ? Number(discountValue * 100).toFixed(0) : '0'
-    return `${pct}% ${t('pages-store.store.couponOff')}`
+    return `${pct}%`
   }
 
-  return `$${formatMoney(discountValue)} ${t('pages-store.store.couponOff')}`
+  return `$${formatMoney(discountValue)}`
 }
 
 function couponBenefitText(item: any) {
@@ -91,44 +94,58 @@ function couponBenefitText(item: any) {
 </script>
 
 <template>
-  <wd-popup v-model="show" custom-style="border-radius:0;" position="bottom" @close="handleClose">
+  <wd-popup v-model="show" custom-style="border-radius: 24rpx 24rpx 0 0;" position="bottom" @close="handleClose">
-    <view class="bg-#F5F5F5 px-32rpx pt-30rpx">
+    <view class="coupon-popup-wrap">
-      <view class="text-40rpx lh-40rpx text-#333 font-bold text-center mb-60rpx">{{ t('pages-store.store.claimCoupon') }}</view>
+      <view class="text-36rpx lh-36rpx text-#333 font-bold text-center pt-40rpx pb-36rpx">
-      <scroll-view scroll-y class="h-1000rpx">
+        {{ t('pages-store.store.claimCoupon') }}
-        <template v-for="item in couponList" :key="item.id">
+      </view>
-          <view class="coupon-item h-328rpx flex flex-col mb-30rpx last:mb-0">
+
-            <view class="flex-1 pt-40rpx px-58rpx">
+      <scroll-view scroll-y class="coupon-popup-list">
-              <view class="line-clamp-1 text-34rpx lh-34rpx text-#333 font-bold">
+        <view
-<!--                couponType 1-折扣券, 2-满减券-->
+          v-for="item in couponList"
-                {{ couponTitleText(item) }}
+          :key="item.id"
+          class="coupon-card"
+        >
+          <image
+            class="coupon-card-bg"
+            :src="item.userCouponVo ? couponBg2 : couponBg"
+            mode="scaleToFill"
+          />
+          <view class="coupon-card-body">
+            <view class="coupon-card-info">
+              <view class="coupon-card-amount">
+                <text class="coupon-amount-value" :class="{ 'coupon-amount-value--disabled': item.userCouponVo }">{{ couponAmountText(item) }}</text>
+                <text class="coupon-amount-label" :class="{ 'coupon-amount-label--disabled': item.userCouponVo }">{{ t('pages-store.store.couponOff') }}</text>
               </view>
-              <view class="text-24rpx lh-32rpx text-#999 my-18rpx">
+              <view class="coupon-card-desc">
-                {{ t('pages-store.store.validDays') }}: {{ item.validDays }}{{ daySuffix(item.validDays) }}
-              </view>
-              <view class="text-24rpx lh-32rpx text-#999 my-18rpx">
                 {{ item.nameZh }}
+                <text class="ml-16rpx">{{ t('pages-store.store.validDays') }}:{{ item.validDays }}{{ daySuffix(item.validDays) }}</text>
               </view>
-              <view class="text-28rpx lh-28rpx text-#333 flex items-center">
+              <view class="coupon-card-benefit">
                 <image
-                    class="w-36rpx h-36rpx shrink-0 mr-10rpx"
+                  class="coupon-benefit-icon"
-                    src="@img/chef/106.png"
+                  src="@img/chef/106.png"
                 ></image>
-                {{ t('pages-store.store.get') }} {{ couponBenefitText(item) }}
+                <text>{{ t('pages-store.store.get') }} {{ couponBenefitText(item) }}</text>
-                <template v-if="Number(item?.couponType) === 1"> {{ t('pages-store.store.couponOff') }}</template>
               </view>
             </view>
-            <template v-if="item.userCouponVo">
-              <view class="h-86rpx bg-#e6e6e6 lh-84rpx text-center text-28rpx text-#fff rounded-br-18rpx rounded-bl-18rpx">
-                {{ t('pages-store.store.claimed') }}
-              </view>
-            </template>
-            <template v-else>
-              <view @click="confirmCoupon(item)" class="h-84rpx lh-84rpx text-center text-28rpx text-#fff">
-                {{ t('pages-store.store.claimNow') }}
-              </view>
-            </template>
           </view>
-        </template>
+          <view
+            v-if="item.userCouponVo"
+            class="coupon-claim-wrap"
+          >
+            <image class="coupon-claim-bg" :src="couponRightBg2" mode="scaleToFill" />
+            <text class="coupon-claim-text coupon-claim-text--disabled">{{ t('pages-store.store.claimed') }}</text>
+          </view>
+          <view
+            v-else
+            class="coupon-claim-wrap"
+            @click="confirmCoupon(item)"
+          >
+            <image class="coupon-claim-bg" :src="couponRightBg" mode="scaleToFill" />
+            <text class="coupon-claim-text">{{ t('pages-store.store.claimNow') }}</text>
+          </view>
+        </view>
       </scroll-view>
 
       <view :style="[configStore.iosSafeBottomPlaceholder]" />
@@ -137,10 +154,126 @@ function couponBenefitText(item: any) {
 </template>
 
 <style scoped lang="scss">
-.coupon-item {
+.coupon-popup-wrap {
-  background-image: url('@img/chef/103.png');
+  background: #F5F5F5;
-  background-size: 100% 100%;
+  padding: 0 32rpx;
-  background-repeat: no-repeat;
-  background-position: center;
 }
-</style>
+
+.coupon-popup-list {
+  max-height: 860rpx;
+  padding-bottom: 30rpx;
+}
+
+.coupon-card {
+  position: relative;
+  margin-bottom: 24rpx;
+
+  &:last-child {
+    margin-bottom: 0;
+  }
+}
+
+.coupon-card-bg {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 0;
+}
+
+.coupon-card-body {
+  position: relative;
+  z-index: 1;
+  padding: 32rpx 180rpx 32rpx 32rpx;
+}
+
+.coupon-card-info {
+  min-width: 0;
+}
+
+.coupon-card-amount {
+  display: flex;
+  align-items: baseline;
+  margin-bottom: 16rpx;
+}
+
+.coupon-amount-value {
+  font-size: 48rpx;
+  line-height: 56rpx;
+  font-weight: bold;
+  color: #CE7138;
+
+  &--disabled {
+    color: #BFBFBF;
+  }
+}
+
+.coupon-amount-label {
+  font-size: 26rpx;
+  line-height: 26rpx;
+  color: #CE7138;
+  font-weight: 500;
+  margin-left: 10rpx;
+
+  &--disabled {
+    color: #BFBFBF;
+  }
+}
+
+.coupon-card-desc {
+  font-size: 24rpx;
+  line-height: 32rpx;
+  color: #999;
+  margin-bottom: 14rpx;
+}
+
+.coupon-card-benefit {
+  font-size: 24rpx;
+  line-height: 32rpx;
+  color: #333;
+  display: flex;
+  align-items: center;
+}
+
+.coupon-benefit-icon {
+  width: 32rpx;
+  height: 32rpx;
+  flex-shrink: 0;
+  margin-right: 8rpx;
+}
+
+.coupon-claim-wrap {
+  position: absolute;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  width: 168rpx;
+  z-index: 2;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.coupon-claim-bg {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 0;
+}
+
+.coupon-claim-text {
+  position: relative;
+  z-index: 1;
+  color: #fff;
+  font-size: 26rpx;
+  // font-weight: 600;
+  text-align: center;
+
+  &--disabled {
+    opacity: 0.6;
+  }
+}
+</style>

src/pages-store/pages/store/components/store-main-skeleton.vue

@@ -0,0 +1,166 @@
+<template>
+  <view class="store-main-sk">
+    <view class="sk-banner skeleton-item"></view>
+    <view class="sk-notice skeleton-item"></view>
+    <view class="sk-info-block">
+      <view class="sk-store-name skeleton-item"></view>
+      <view class="flex items-center gap-16rpx mt-12rpx">
+        <view class="sk-rating skeleton-item"></view>
+        <view class="sk-sales skeleton-item"></view>
+      </view>
+      <view class="flex items-center gap-16rpx mt-16rpx">
+        <view class="sk-coupon skeleton-item"></view>
+        <view class="sk-coupon skeleton-item"></view>
+        <view class="sk-coupon skeleton-item"></view>
+      </view>
+    </view>
+    <view class="flex items-center px-24rpx pb-24rpx gap-16rpx">
+      <view v-for="i in 4" :key="i" class="sk-tab skeleton-item"></view>
+    </view>
+    <view class="sk-dish-grid px-24rpx">
+      <view v-for="i in 4" :key="i" class="sk-dish-card">
+        <view class="sk-dish-img skeleton-item"></view>
+        <view class="sk-dish-body">
+          <view class="flex items-center justify-between mb-10rpx">
+            <view class="sk-price skeleton-item"></view>
+            <view class="sk-dish-sales skeleton-item"></view>
+          </view>
+          <view class="sk-title skeleton-item mb-12rpx"></view>
+          <view class="sk-title sk-title--short skeleton-item mb-14rpx"></view>
+          <view class="flex items-center justify-between">
+            <view class="sk-member skeleton-item"></view>
+            <view class="sk-add skeleton-item"></view>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup lang="ts">
+</script>
+
+<style scoped lang="scss">
+.skeleton-item {
+  background: linear-gradient(90deg, #ebebeb 25%, #d6d6d6 50%, #ebebeb 75%);
+  background-size: 200% 100%;
+  animation: sk-shimmer 1.4s ease-in-out infinite;
+}
+
+@keyframes sk-shimmer {
+  0% {
+    background-position: -200% 0;
+  }
+  100% {
+    background-position: 200% 0;
+  }
+}
+
+.store-main-sk {
+  width: 100%;
+  min-height: 100%;
+  background: #f6f6f6;
+}
+
+.sk-banner {
+  width: 100%;
+  height: 360rpx;
+}
+
+.sk-notice {
+  width: 100%;
+  height: 66rpx;
+}
+
+.sk-info-block {
+  background: #fff;
+  padding: 20rpx 24rpx 16rpx;
+}
+
+.sk-store-name {
+  width: 60%;
+  height: 36rpx;
+  border-radius: 8rpx;
+}
+
+.sk-rating {
+  width: 100rpx;
+  height: 24rpx;
+  border-radius: 6rpx;
+}
+
+.sk-sales {
+  width: 120rpx;
+  height: 24rpx;
+  border-radius: 6rpx;
+}
+
+.sk-coupon {
+  width: 100rpx;
+  height: 48rpx;
+  border-radius: 8rpx;
+  flex-shrink: 0;
+}
+
+.sk-tab {
+  width: 96rpx;
+  height: 56rpx;
+  border-radius: 28rpx;
+  flex-shrink: 0;
+}
+
+.sk-dish-grid {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 20rpx;
+}
+
+.sk-dish-card {
+  background: #fff;
+  border-radius: 20rpx;
+  overflow: hidden;
+}
+
+.sk-dish-img {
+  width: 100%;
+  height: 270rpx;
+}
+
+.sk-dish-body {
+  padding: 14rpx 14rpx 16rpx;
+}
+
+.sk-price {
+  width: 90rpx;
+  height: 28rpx;
+  border-radius: 6rpx;
+}
+
+.sk-dish-sales {
+  width: 60rpx;
+  height: 22rpx;
+  border-radius: 6rpx;
+}
+
+.sk-title {
+  width: 90%;
+  height: 26rpx;
+  border-radius: 6rpx;
+}
+
+.sk-title--short {
+  width: 60%;
+}
+
+.sk-member {
+  width: 120rpx;
+  height: 36rpx;
+  border-radius: 20rpx;
+}
+
+.sk-add {
+  width: 48rpx;
+  height: 48rpx;
+  border-radius: 50%;
+}
+</style>

src/pages-store/pages/store/components/store-skeleton.vue

@@ -1,115 +1,40 @@
 <template>
   <view class="store-skeleton">
-    <!-- 顶部图片区域 -->
+    <view class="store-sk-layout">
-    <view class="relative h-562rpx">
+      <view class="store-sk-sidebar">
-      <!-- 状态栏 -->
+        <status-bar />
-      <view class="fixed top-0 left-0 z-9 w-full pt-6rpx">
+        <view class="sk-back skeleton-item"></view>
-        <view class="flex-center-sb px-30rpx">
+        <view class="sk-head">
-          <view class="back-button-skeleton skeleton-item"></view>
+          <view class="sk-head-icon skeleton-item"></view>
-          <view class="flex">
+          <view class="sk-head-text skeleton-item"></view>
-            <view class="action-button-skeleton skeleton-item mr-20rpx"></view>
-            <view class="action-button-skeleton skeleton-item mr-20rpx"></view>
-            <view class="action-button-skeleton skeleton-item"></view>
-          </view>
         </view>
-      </view>
+        <view
-      
+          v-for="i in 4"
-      <!-- 主图骨架 -->
+          :key="i"
-      <view class="main-image-skeleton skeleton-item w-750rpx h-562rpx absolute top-0 left-0"></view>
+          class="sk-merchant-item"
-    </view>
+          :class="{ 'sk-merchant-item--active': i === 1 }"
-
-    <!-- 店铺信息区域 -->
-    <view class="px-30rpx pt-40rpx pb-42rpx">
-      <!-- 店铺名称 -->
-      <view class="text-center">
-        <view class="store-name-skeleton skeleton-item mx-auto mb-16rpx"></view>
-        
-        <!-- 评分和信息 -->
-        <view class="center mb-16rpx">
-          <view class="rating-skeleton skeleton-item mr-20rpx"></view>
-          <view class="chef-link-skeleton skeleton-item mr-20rpx"></view>
-          <view class="distance-skeleton skeleton-item"></view>
-        </view>
-        
-        <!-- 描述信息 -->
-        <view class="description-skeleton skeleton-item mx-auto mb-16rpx"></view>
-        <view class="description-skeleton skeleton-item mx-auto mb-16rpx"></view>
-        
-        <!-- 标签 -->
-        <view class="tag-skeleton skeleton-item mx-auto"></view>
-      </view>
-
-      <!-- 配送方式切换 -->
-      <view class="delivery-switch-skeleton skeleton-item mt-40rpx"></view>
-      
-      <!-- 配送信息卡片 -->
-      <view class="delivery-info-skeleton skeleton-item mt-36rpx"></view>
-    </view>
-
-    <!-- 标签页导航 -->
-    <view class="tabs-skeleton">
-      <view class="flex">
-        <view 
-          v-for="i in 5" 
-          :key="i" 
-          class="tab-item-skeleton skeleton-item mr-40rpx"
-        ></view>
-      </view>
-      <view class="tabs-divider skeleton-item"></view>
-    </view>
-
-    <!-- 商品列表区域 -->
-    <view class="px-30rpx">
-      <!-- 分类标题 -->
-      <view class="section-title-skeleton skeleton-item my-36rpx"></view>
-      
-      <!-- 商品网格 -->
-      <view class="grid grid-cols-2 gap-30rpx">
-        <view 
-          v-for="i in 6" 
-          :key="i" 
-          class="product-item-skeleton"
         >
-          <!-- 商品图片 -->
+          <view class="sk-merchant-logo skeleton-item"></view>
-          <view class="product-image-skeleton skeleton-item mb-28rpx"></view>
+          <view class="sk-merchant-name skeleton-item"></view>
-          
-          <!-- 商品名称 -->
-          <view class="product-name-skeleton skeleton-item mb-12rpx"></view>
-          
-          <!-- 价格行 -->
-          <view class="flex-center-sb mb-12rpx">
-            <view class="price-skeleton skeleton-item"></view>
-            <view class="member-price-skeleton skeleton-item"></view>
-          </view>
-          
-          <!-- 原价和销量 -->
-          <view class="flex-center-sb">
-            <view>
-              <view class="original-price-skeleton skeleton-item mb-8rpx"></view>
-              <view class="sales-skeleton skeleton-item"></view>
-            </view>
-            <view class="add-button-skeleton skeleton-item"></view>
-          </view>
         </view>
       </view>
+      <store-main-skeleton />
     </view>
   </view>
 </template>
 
 <script setup lang="ts">
-// Store页面骨架屏组件
+import StoreMainSkeleton from './store-main-skeleton.vue'
 </script>
 
 <style scoped lang="scss">
-// 通用骨架屏样式
 .skeleton-item {
-  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
+  background: linear-gradient(90deg, #ebebeb 25%, #d6d6d6 50%, #ebebeb 75%);
   background-size: 200% 100%;
-  animation: shimmer 1.5s infinite;
+  animation: sk-shimmer 1.4s ease-in-out infinite;
 }
 
-// 闪烁动画
+@keyframes sk-shimmer {
-@keyframes shimmer {
   0% {
     background-position: -200% 0;
   }
@@ -119,190 +44,84 @@
 }
 
 .store-skeleton {
-  background-color: #fff;
-  min-height: 100vh;
-}
-
-// 通用布局类
-.flex-center-sb {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-}
-
-.center {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-// 状态栏区域
-.status-bar-skeleton {
   width: 100%;
-  height: 44rpx;
+  min-height: 100vh;
-  margin-bottom: 20rpx;
+  background: #f6f6f6;
+  overflow: hidden;
 }
 
-.back-button-skeleton {
+.store-sk-layout {
+  display: flex;
+  width: 100%;
+  height: 100vh;
+}
+
+.store-sk-sidebar {
+  width: 146rpx;
+  flex-shrink: 0;
+  height: 100%;
+  background: #ececec;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding-bottom: 20rpx;
+  overflow: hidden;
+}
+
+.sk-back {
   width: 48rpx;
   height: 48rpx;
   border-radius: 24rpx;
+  margin: 12rpx 0 8rpx;
 }
 
-.action-button-skeleton {
+.sk-head {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 10rpx;
+  padding: 8rpx 0 16rpx;
+}
+
+.sk-head-icon {
+  width: 26rpx;
+  height: 26rpx;
+  border-radius: 6rpx;
+}
+
+.sk-head-text {
+  width: 80rpx;
+  height: 20rpx;
+  border-radius: 6rpx;
+}
+
+.sk-merchant-item {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 16rpx 10rpx;
+  gap: 10rpx;
+}
+
+.sk-merchant-item--active {
+  background: #fff;
+}
+
+.sk-merchant-logo {
   width: 68rpx;
   height: 68rpx;
-  border-radius: 34rpx;
+  border-radius: 16rpx;
 }
 
-// 主图区域
+.sk-merchant-name {
-.main-image-skeleton {
+  width: 72rpx;
-  border-radius: 0;
+  height: 20rpx;
-}
-
-// 店铺信息区域
-.store-name-skeleton {
-  width: 400rpx;
-  height: 40rpx;
-  border-radius: 8rpx;
-}
-
-.rating-skeleton {
-  width: 120rpx;
-  height: 24rpx;
   border-radius: 6rpx;
 }
 
-.chef-link-skeleton {
+:deep(.store-main-sk) {
-  width: 100rpx;
+  flex: 1;
-  height: 24rpx;
+  min-width: 0;
-  border-radius: 6rpx;
 }
-
+</style>
-.distance-skeleton {
-  width: 80rpx;
-  height: 24rpx;
-  border-radius: 6rpx;
-}
-
-.description-skeleton {
-  width: 500rpx;
-  height: 24rpx;
-  border-radius: 6rpx;
-}
-
-.tag-skeleton {
-  width: 300rpx;
-  height: 48rpx;
-  border-radius: 8rpx;
-}
-
-// 配送方式
-.delivery-switch-skeleton {
-  width: 318rpx;
-  height: 60rpx;
-  border-radius: 30rpx;
-}
-
-.delivery-info-skeleton {
-  width: 100%;
-  height: 164rpx;
-  border-radius: 20rpx;
-}
-
-// 标签页导航
-.tabs-skeleton {
-  padding: 0 30rpx;
-  
-  .tab-item-skeleton {
-    width: 120rpx;
-    height: 30rpx;
-    border-radius: 6rpx;
-  }
-  
-  .tabs-divider {
-    width: 100%;
-    height: 10rpx;
-    margin-top: 32rpx;
-    border-radius: 0;
-  }
-}
-
-// 分类标题
-.section-title-skeleton {
-  width: 200rpx;
-  height: 40rpx;
-  border-radius: 8rpx;
-}
-
-// 商品项
-.product-item-skeleton {
-  .product-image-skeleton {
-    width: 100%;
-    height: 248rpx;
-    border-radius: 24rpx;
-  }
-  
-  .product-name-skeleton {
-    width: 80%;
-    height: 30rpx;
-    border-radius: 6rpx;
-  }
-  
-  .price-skeleton {
-    width: 100rpx;
-    height: 30rpx;
-    border-radius: 6rpx;
-  }
-  
-  .member-price-skeleton {
-    width: 170rpx;
-    height: 28rpx;
-    border-radius: 14rpx;
-  }
-  
-  .original-price-skeleton {
-    width: 80rpx;
-    height: 28rpx;
-    border-radius: 6rpx;
-  }
-  
-  .sales-skeleton {
-    width: 100rpx;
-    height: 28rpx;
-    border-radius: 6rpx;
-  }
-  
-  .add-button-skeleton {
-    width: 64rpx;
-    height: 64rpx;
-    border-radius: 32rpx;
-  }
-}
-
-// 分隔线
-.divider-skeleton {
-  width: 100%;
-  height: 10rpx;
-  border-radius: 0;
-}
-
-// 底部提示
-.bottom-tip-skeleton {
-  height: 96rpx;
-  border-radius: 0;
-}
-
-// 响应式设计
-@media (max-width: 750rpx) {
-  .grid {
-    gap: 20rpx;
-  }
-  
-  .product-item-skeleton {
-    .product-image-skeleton {
-      height: 200rpx;
-    }
-  }
-}
-</style>

src/pages-store/pages/store/search/result.vue

@@ -45,11 +45,16 @@ function navigateToDishes(item: any) {
     <view class="grid grid-cols-2 gap-x-30rpx gap-y-46rpx pb-40rpx px-30rpx">
       <template v-for="item in dataList">
         <view @click="navigateToDishes(item)" class="w-330rpx overflow-hidden">
-          <image
+          <view class="search-result-img-wrap">
-              :src="item?.dishImage?.split(',')[0]"
+            <view v-if="item.isNew == 1" class="dish-new-ribbon">
-              class="w-full h-186rpx rounded-24rpx mb-16rpx"
+              <text class="dish-new-ribbon__text">NEW</text>
-              mode="aspectFill"
+            </view>
-          ></image>
+            <image
+                :src="item?.dishImage?.split(',')[0]"
+                class="w-full h-186rpx rounded-24rpx"
+                mode="aspectFill"
+            ></image>
+          </view>
           <text class="text-30rpx lh-30rpx text-#333 line-clamp-1 tracking-[.04em] font-500"
           >{{ item.dishName }}</text
           >
@@ -60,5 +65,36 @@ function navigateToDishes(item: any) {
 </template>
 
 <style scoped lang="scss">
+.search-result-img-wrap {
+  position: relative;
+  overflow: hidden;
+  border-radius: 24rpx;
+  margin-bottom: 16rpx;
+}
 
+.dish-new-ribbon {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 184rpx;
+  height: 184rpx;
+  overflow: hidden;
+  z-index: 5;
+  pointer-events: none;
+
+  &__text {
+    position: absolute;
+    top: 26rpx;
+    left: -66rpx;
+    width: 240rpx;
+    text-align: center;
+    font-size: 22rpx;
+    font-weight: 700;
+    color: #fff;
+    letter-spacing: 2rpx;
+    line-height: 44rpx;
+    background: #E23636;
+    transform: rotate(-45deg);
+  }
+}
 </style>

src/pages-store/service/index.ts

@@ -13,4 +13,4 @@ export const getFeaturedDishList = (data: Record<string, any>) =>
 
 //获取店铺详情
 export const getStoreDetailById = (storeId: string) =>
-    http.post<any>('/app/merchant/detail/' + storeId);
+    http.post<any>('/app/merchant/detail/' + storeId);

src/pages-user/pages/balance/index.vue

@@ -70,28 +70,34 @@ onShow(()=> {
 </script>
 
 <template>
-  <view class="bg-#F6F6F6">
+  <view class="balance-page bg-#F6F6F6">
-    <image src="@img/chef/107.png" class="w-full h-472rpx"></image>
     <z-paging ref="paging" v-model="dataList" @query="queryList">
       <template #top>
-        <wd-navbar
+        <view class="balance-hero">
-            safeAreaInsetTop
+          <image
-            :fixed="true"
+            src="@img/chef/107.png"
-            :placeholder="true"
+            class="balance-hero__bg"
-            :bordered="false"
+            mode="aspectFill"
-            custom-class="!bg-transparent"
+          />
-            @click-left="handleClickLeft"
+          <view class="balance-hero__content">
-        >
+            <wd-navbar
-          <template #title>
+              safeAreaInsetTop
-            <text class="text-34rpx text-#fff !font-400">{{ t('pages-user.balance.title') }}</text>
+              :fixed="true"
-          </template>
+              :placeholder="true"
-          <template #left>
+              :bordered="false"
-            <view class="shrink-0">
+              custom-class="balance-navbar !bg-transparent"
-              <view class="i-carbon:chevron-left text-50rpx text-#fff ml-[-10rpx]"></view>
+              @click-left="handleClickLeft"
-            </view>
+            >
-          </template>
+              <template #title>
-        </wd-navbar>
+                <text class="balance-navbar__title">{{ t('pages-user.balance.title') }}</text>
-        <view class="h-254rpx box z-9 mx-18rpx mt-18rpx px-40rpx py-52rpx">
+              </template>
+              <template #left>
+                <view class="shrink-0">
+                  <view class="i-carbon:chevron-left balance-navbar__back ml-[-10rpx]" />
+                </view>
+              </template>
+            </wd-navbar>
+            <view class="h-254rpx box z-9 mx-18rpx mt-18rpx px-40rpx py-52rpx">
           <view @click="navigateTo('/pages/agreement/index?code=' + Agreement.BALANCE_EXPLANATION)" class="flex items-center">
             <text class="text-28rpx text-#333">{{ t('pages-user.balance.my-balance') }}：</text>
             <image src="@img/chef/108.png" class="w-28rpx h-28rpx shrink-0"></image>
@@ -101,12 +107,14 @@ onShow(()=> {
             <wd-button @click="navigateTo('/pages-user/pages/recharge/index')" custom-class="!min-w-160rpx !h-64rpx !rounded-20rpx !bg-#00A76D">{{ t('common.recharge') }}</wd-button>
           </view>
         </view>
+          </view>
+        </view>
       </template>
       <view class="px-18rpx">
         <view class="bg-white rounded-36rpx overflow-hidden mt-18rpx py-30rpx">
           <view class="flex-center-sb pr-20rpx mb-8rpx">
             <view class="flex items-center">
-              <view class="w-8rpx h-30rpx bg-#00A76D"></view>
+              <view class="w-8rpx h-40rpx bg-#00A76D" style="margin-left: 10rpx;border-radius: 20rpx;"></view>
               <text class="ml-10rpx text-34rpx text-#333">{{ t('pages-user.balance.detail-list') }}</text>
             </view>
             <view class="flex items-center">
@@ -142,6 +150,41 @@ onShow(()=> {
 </template>
 
 <style scoped lang="scss">
+.balance-hero {
+  position: relative;
+  overflow: hidden;
+}
+
+.balance-hero__bg {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 472rpx;
+  z-index: 0;
+}
+
+.balance-hero__content {
+  position: relative;
+  z-index: 1;
+}
+
+.balance-navbar__title {
+  font-size: 34rpx;
+  line-height: 34rpx;
+  font-weight: 400;
+  color: #333;
+}
+
+.balance-navbar__back {
+  font-size: 50rpx;
+  color: #333;
+}
+
+:deep(.balance-navbar .wd-navbar__title) {
+  color: #333;
+}
+
 .box {
   border-radius: 16rpx;
   background: linear-gradient(198deg, #D0F4E8 -8%, #FFFFFF 37%, #FFFFFF 56%, #FFFFFF 76%);

src/pages-user/pages/cart/components/multi-store-notice.vue

@@ -0,0 +1,87 @@
+<script setup lang="ts">
+const { t } = useI18n();
+const emit = defineEmits(["confirm", "close", "update:modelValue"]);
+
+const props = defineProps<{
+  modelValue: boolean;
+  zIndex?: number;
+}>();
+
+function handleClose() {
+  emit("update:modelValue", false);
+  emit("close");
+}
+
+function handleConfirm() {
+  emit("confirm");
+  handleClose();
+}
+</script>
+
+<template>
+  <wd-popup
+    :model-value="modelValue"
+    @update:model-value="(val) => emit('update:modelValue', val)"
+    position="bottom"
+    :z-index="zIndex || 2000"
+    custom-style="background: transparent;"
+    @close="handleClose"
+  >
+    <view class="multi-store-notice">
+      <view class="multi-store-notice__title">
+        {{ t("pages-user.cart.orderNoticeTitle") }}
+      </view>
+      <view class="multi-store-notice__desc">
+        {{ t("pages-user.cart.multiStoreCheckoutNoticeDesc") }}
+      </view>
+      <view class="multi-store-notice__btn-fixed">
+        <wd-button
+          block
+          custom-class="multi-store-notice__btn"
+          custom-style="height:88rpx;line-height:88rpx;"
+          @click="handleConfirm"
+          @tap="handleConfirm"
+        >
+          {{ t("common.gotIt") }}
+        </wd-button>
+      </view>
+    </view>
+  </wd-popup>
+</template>
+
+<style scoped lang="scss">
+.multi-store-notice {
+  margin: 0 24rpx calc(24rpx + constant(safe-area-inset-bottom));
+  margin: 0 24rpx calc(24rpx + env(safe-area-inset-bottom));
+  border-radius: 32rpx;
+  padding: 44rpx 40rpx 180rpx;
+  background: #fff;
+  min-height: 420rpx;
+}
+
+.multi-store-notice__title {
+  text-align: center;
+  font-size: 42rpx;
+  line-height: 52rpx;
+  font-weight: 700;
+  color: #111;
+}
+
+.multi-store-notice__desc {
+  margin-top: 28rpx;
+  font-size: 30rpx;
+  line-height: 44rpx;
+  color: #333;
+  // text-align: center;
+}
+
+.multi-store-notice__btn-fixed {
+  position: fixed;
+  left: 64rpx;
+  right: 64rpx;
+  bottom: calc(48rpx + constant(safe-area-inset-bottom));
+  bottom: calc(48rpx + env(safe-area-inset-bottom));
+  z-index: 2200;
+  pointer-events: auto;
+}
+</style>

src/pages-user/pages/cart/components/remove-cart.vue

@@ -25,9 +25,9 @@ defineExpose({
       @close="handleClose"
   >
     <view class="px-30rpx text-#333 text-center pt-48rpx pb-60rpx">
-      <view class="text-40rpx lh-40rpx font-500">Delete shopping cart?</view>
+      <view class="text-40rpx lh-40rpx font-500">{{ t("pages-user.cart.removeCartTitle") }}</view>
       <view class="text-28rpx lh-28rpx mt-36rpx">
-        Are you sure you want to delete the shopping cart?
+        {{ t("pages-user.cart.removeCartDesc") }}
       </view>
       <view class="mt-70rpx">
         <wd-button @click="handleDelete" custom-class="!h-108rpx !bg-14181B !text-36rpx !lh-108rpx !text-#fff !rounded-16rpx" block>

src/pages-user/pages/cart/components/remove-store.vue

@@ -4,6 +4,10 @@ const emit = defineEmits(['confirm','close'])
 
 const show = ref(false);
 const goodsName = ref('');
+
+const removeProductDescText = computed(() =>
+  `${t("pages-user.cart.removeProductDescPrefix")}${goodsName.value}${t("pages-user.cart.removeProductDescSuffix")}`
+);
 function onOpen(title: string) {
   if (title) {
     goodsName.value = title;
@@ -31,9 +35,9 @@ defineExpose({
       @close="handleClose"
   >
     <view class="px-30rpx text-#333 text-center pt-48rpx pb-60rpx">
-      <view class="text-40rpx lh-40rpx font-500">Remove the product?</view>
+      <view class="text-40rpx lh-40rpx font-500">{{ t("pages-user.cart.removeProductTitle") }}</view>
       <view class="text-28rpx lh-28rpx mt-36rpx">
-        Are you sure you want to remove {{ goodsName }} from your shopping cart?
+        {{ removeProductDescText }}
       </view>
       <view class="mt-70rpx">
         <wd-button @click="confirmRemove" custom-class="!h-108rpx !bg-14181B !text-36rpx !lh-108rpx !text-#fff !rounded-16rpx" block>

src/pages-user/pages/cart/store-cart.vue

@@ -11,6 +11,7 @@ import RemoveStore from "./components/remove-store.vue";
 import StoreCartSkeleton from "./components/store-cart-skeleton.vue";
 import { onBeforeUnmount, ref } from "vue";
 import {useConfigStore} from "@/store";
+import { parseMerchantCartPayload } from "@/utils/utils";
 const configStore = useConfigStore();
 // 骨架屏加载状态
 const loading = ref(true);
@@ -115,20 +116,14 @@ function scheduleCartUpdate(item: MerchantCartVo, targetValue: number) {
   pendingUpdateTimers.set(key, timer)
 }
 
-function normalizeInputNumberValue(payload: any): number {
+/** wd-input-number change 为 { value }，兼容 detail.value */
-  if (typeof payload === 'number') {
+function normalizeInputNumberValue(payload: unknown): number {
-    return payload
+  const raw =
-  }
+    typeof payload === "number"
-  if (payload && typeof payload === 'object') {
+      ? payload
-    if (typeof payload.detail?.value === 'number') {
+      : (payload as any)?.value ?? (payload as any)?.detail?.value ?? payload;
-      return payload.detail.value
+  const n = Number(raw);
-    }
+  return Number.isFinite(n) ? n : 0;
-    if (typeof payload.value === 'number') {
-      return payload.value
-    }
-  }
-  const numeric = Number(payload)
-  return Number.isNaN(numeric) ? 0 : numeric
 }
 
 const delItemData = ref<MerchantCartVo | null>(null)
@@ -225,8 +220,9 @@ function getCartInfo() {
     }
   }).then((res: any)=> {
     console.log('购物车列表', res)
-    cartDataList.value = res.data
+    const items = parseMerchantCartPayload(res?.data).items as MerchantCartVo[]
-    syncItemCountCache(res.data || [])
+    cartDataList.value = items
+    syncItemCountCache(items)
 
     // 购物车有菜品，查询菜品会员折扣价
     if(cartDataList.value.length > 0) {
@@ -247,6 +243,18 @@ function appMerchantCartCalculateSavings() {
   })
 }
 
+function getCartItemDiscountPrice(item: MerchantCartVo) {
+  return item.discountPrice ?? item.merchantDishVo?.discountPrice
+}
+
+function getCartItemOriginalPrice(item: MerchantCartVo) {
+  return item.originalPrice ?? item.merchantDishVo?.originalPrice
+}
+
+function getCartItemMemberPrice(item: MerchantCartVo) {
+  return item.memberPrice ?? item.merchantDishVo?.memberPrice
+}
+
 function navigateTo(url: string) {
   uni.navigateTo({ url })
 }
@@ -301,21 +309,21 @@ function navigateTo(url: string) {
 
           <view class="price-row flex items-center mt-18rpx">
             <text class="current-price text-[#333333] text-30rpx font-normal"
-            >${{ item.merchantDishVo.discountPrice }}</text
+            >${{ getCartItemDiscountPrice(item) }}</text
             >
             <text
-                v-if="item.merchantDishVo.originalPrice"
+                v-if="getCartItemOriginalPrice(item)"
                 class="original-price text-[#7D7D7D] text-24rpx font-normal line-through ml-10rpx"
-            >${{ item.merchantDishVo.originalPrice }}</text
+            >${{ getCartItemOriginalPrice(item) }}</text
             >
 
             <!-- 会员价标签 -->
             <view
-                v-if="Number(item.merchantDishVo.memberPrice) > 0"
+                v-if="Number(getCartItemMemberPrice(item)) > 0"
                 class="member-price-tag ml-10rpx center pl-16rpx pr-6rpx pb-2rpx"
             >
               <text class="text-[#FBE3C3] text-20rpx"
-              >{{ t('pages-store.store.members') }}: ${{ item.merchantDishVo.memberPrice }}</text
+              >{{ t('pages-store.store.members') }}: ${{ getCartItemMemberPrice(item) }}</text
               >
             </view>
           </view>
@@ -338,7 +346,7 @@ function navigateTo(url: string) {
       <view @click="goBack" class="h-148rpx flex items-center justify-end pr-30rpx">
         <view class="w-212rpx h-64rpx bg-#F2F2F2 rounded-64rpx center">
           <image
-              src="@img/chef/1285.png"
+              src="/static/app/images/add_cart.png"
               class="mr-16rpx w-24rpx h-24rpx shrink-0"
           ></image>
           <text class="text-#333 text-28rpx lh-28rpx font-500">{{ t('pages-user.cart.addItems') }}</text>

src/pages-user/pages/collection/components/order-swiper-list/order-swiper-list.vue

@@ -1,11 +1,13 @@
 <script setup lang="ts">
 import { debounce } from 'throttle-debounce'
 import {appCollectListPost, appCollectCollectPost} from "@/service";
-import FoodBox from "@/pages/home/components/tabbar-home/components/food-box/index.vue";
 import Collection from "@/components/collection/index.vue";
 import {CollectionType} from "@/constant/enums";
 
 const {t} = useI18n()
+const emit = defineEmits<{
+  (e: 'batch-delete-success'): void
+}>()
 const props = defineProps({
   currentIndex: {
     type: Number,
@@ -15,6 +17,18 @@ const props = defineProps({
     type: Number,
     default: 0,
   },
+  batchDeleteMode: {
+    type: Boolean,
+    default: false,
+  },
+})
+
+const selectedIds = ref<string[]>([])
+
+watch(() => props.batchDeleteMode, (v) => {
+  if (!v) {
+    selectedIds.value = []
+  }
 })
 
 // (1, "菜谱")(2, "菜品")(3, "配菜")(4, "商家")
@@ -35,7 +49,7 @@ const {paging, dataList, queryList, loading} = usePage<any>((pageNum: number, pa
         pageSize,
       },
       body: {
-        targetType: typeList[props.currentIndex]
+        targetType: typeList[props.index]
       }
     }),
 )
@@ -51,6 +65,106 @@ function navigateToDishes(item: any) {
   })
 }
 
+function getDishInfo(item: any) {
+  return item?.merchantDishVo || item || {}
+}
+
+function getDishImage(item: any) {
+  const dish = getDishInfo(item)
+  return dish?.dishImage?.split?.(',')?.[0] || dish?.dishImage || ''
+}
+
+/** 当前列表 tab 对应的收藏目标 id（与 appCollectCollectPost 一致） */
+function getCollectTargetId(item: any): string {
+  const i = props.index
+  if (i === 0) {
+    return String(item.merchantVo?.id ?? item.merchantId ?? getDishInfo(item).merchantId ?? item.id ?? '')
+  }
+  if (i === 1) {
+    return String(item.merchantDishVo?.id ?? getDishInfo(item).id ?? item.id ?? '')
+  }
+  if (i === 2) {
+    return String(item.merchantRecipeVo?.id ?? item.id ?? '')
+  }
+  return ''
+}
+
+function toggleSelect(item: any) {
+  if (!props.batchDeleteMode) return
+  const id = getCollectTargetId(item)
+  if (!id) return
+  const idx = selectedIds.value.indexOf(id)
+  if (idx >= 0) {
+    selectedIds.value.splice(idx, 1)
+  } else {
+    selectedIds.value.push(id)
+  }
+}
+
+function isSelected(item: any) {
+  const id = getCollectTargetId(item)
+  return id ? selectedIds.value.includes(id) : false
+}
+
+function onStoreOrDishRowClick(item: any) {
+  if (props.batchDeleteMode) {
+    toggleSelect(item)
+    return
+  }
+  navigateToDishes(getDishInfo(item))
+}
+
+function onRecipeCardClick(item: any) {
+  if (props.batchDeleteMode) {
+    toggleSelect(item)
+    return
+  }
+  navigateToRecipeDetail(item.merchantRecipeVo?.id ?? item.id)
+}
+
+function runBatchDelete() {
+  if (selectedIds.value.length === 0) {
+    uni.showToast({
+      title: t('pages.mine.collectionSelectFirst'),
+      icon: 'none',
+    })
+    return
+  }
+  uni.showModal({
+    title: t('common.prompt.system-prompt'),
+    content: `${t('pages.mine.collectionBatchDeleteConfirmPrefix')}${selectedIds.value.length}${t('pages.mine.collectionBatchDeleteConfirmSuffix')}`,
+    success: (res) => {
+      if (!res.confirm) return
+      const targetType = typeList[props.index] as number
+      const ids = [...selectedIds.value]
+      ;(async () => {
+        try {
+          for (const targetId of ids) {
+            await appCollectCollectPost({
+              body: {
+                targetId,
+                targetType,
+              },
+            })
+          }
+          selectedIds.value = []
+          emit('batch-delete-success')
+          paging.value?.reload()
+          uni.showToast({
+            title: t('toast.deleteSuccess'),
+            icon: 'none',
+          })
+        } catch {
+          uni.showToast({
+            title: t('common.prompt.request-incorrect'),
+            icon: 'none',
+          })
+        }
+      })()
+    },
+  })
+}
+
 // 收藏菜谱
 function handleSubmitCollectRecipe(item:any) {
   debouncedEmit(item.merchantRecipeVo?.isCollect, item.merchantRecipeVo?.id, CollectionType.RECIPE, ()=> {
@@ -58,12 +172,6 @@ function handleSubmitCollectRecipe(item:any) {
   })
 }
 
-// 收藏菜品
-function handleDishCollectionClick(item: any) {
-  debouncedEmit(item.isCollect, item.id, CollectionType.DISH, ()=> {
-    item.isCollect = !item.isCollect
-  })
-}
 // 防抖处理函数
 const debouncedEmit = debounce(1300, (isCollected: boolean, id: string, type: CollectionType, callback: ()=> void) => {
   // 收藏接口
@@ -94,6 +202,7 @@ function refresh() {
 defineExpose({
   reload,
   refresh,
+  runBatchDelete,
 })
 </script>
 
@@ -101,71 +210,66 @@ defineExpose({
   <view class="h-full">
     <z-paging ref="paging" v-model="dataList" @query="queryList" :fixed="false" :auto="false">
       <view class="p-30rpx">
-        <template v-if="currentIndex == 0">
+        <template v-if="currentIndex == 0 || currentIndex == 1">
-          <!--商家-->
+          <view class="collection-list">
-          <view v-for="item in dataList" :key="item.id">
+            <view
-            <food-box :item="item.merchantVo" />
+              v-for="item in dataList"
-          </view>
+              :key="item.id"
-        </template>
+              class="collection-item"
-        <template v-if="currentIndex == 1">
+              @click="onStoreOrDishRowClick(item)"
-          <!--菜品-->
+            >
-          <view class="grid grid-cols-2 gap-30rpx">
+              <view
-            <template v-for="item in dataList">
+                v-if="batchDeleteMode"
-              <view @click="navigateToDishes(item.merchantDishVo)" class="w-100% mb-10rpx rounded-16rpx">
+                class="collection-item__check"
-                <view class="relative h-248rpx rounded-24rpx mb-28rpx">
+                @click.stop="toggleSelect(item)"
-                  <view @click.stop="handleDishCollectionClick(item.merchantDishVo)" class="w-68rpx h-68rpx absolute z-2 top-0 right-0">
+              >
-                    <image
+                <view class="check-box" :class="{ 'is-on': isSelected(item) }">
-                        v-if="!item.merchantDishVo.isCollect"
+                  <text v-if="isSelected(item)" class="check-tick">✓</text>
-                        src="@img-store/1334.png"
-                        mode="aspectFill"
-                        class="w-full h-full"
-                    />
-                    <image
-                        v-else
-                        src="@img-store/1337.png"
-                        mode="aspectFill"
-                        class="w-full h-full"
-                    />
-                  </view>
-                  <image
-                      :src="item.merchantDishVo?.dishImage?.split(',')[0]"
-                      mode="aspectFill"
-                      class="w-full h-full rounded-24rpx"
-                  />
-                </view>
-                <view class="line-clamp-1 text-30rpx lh-30rpx text-#333 font-500 mb-12rpx">
-                  {{ item.merchantDishVo.dishName }}
-                </view>
-                <view class="flex-center-sb">
-                  <text class="text-30rpx lh-30rpx text-#333 font-500">US${{ item.merchantDishVo.discountPrice }}</text>
-                  <view
-                    v-if="Number(item.merchantDishVo.memberPrice) > 0"
-                    class="member-price-tag text-[#FBE3C3] text-18rpx center pl-6rpx"
-                  >
-                    {{ t('pages-store.store.members') }}: ${{ item.merchantDishVo.memberPrice }}
-                  </view>
-                </view>
-                <view class="flex-center-sb mt-12rpx">
-                  <view class="text-28rpx text-#999">
-                    <view class="line-through">US${{ item.merchantDishVo.originalPrice }}</view>
-                    <view>{{ t('pages-store.store.sales') }}:{{ item.merchantDishVo.salesCount }}</view>
-                  </view>
-
-                  <view class="center w-64rpx h-64rpx rounded-50% bg-white shadow-lg">
-                    <image
-                        src="@img/chef/1285.png"
-                        class="w-30rpx h-30rpx shrink-0"
-                    ></image>
-                  </view>
                 </view>
               </view>
-            </template>
+              <image
+                :src="getDishImage(item)"
+                mode="aspectFill"
+                class="collection-item__image"
+              />
+              <view class="collection-item__content">
+                <view class="collection-item__name line-clamp-1">{{ getDishInfo(item).dishName }}</view>
+                <view class="collection-item__price-row mt-10rpx">
+                  <text class="collection-item__price">${{ getDishInfo(item).discountPrice }}</text>
+                  <text
+                    v-if="Number(getDishInfo(item).originalPrice) > 0"
+                    class="collection-item__original ml-10rpx"
+                  >
+                    ${{ getDishInfo(item).originalPrice }}
+                  </text>
+                </view>
+                <view v-if="Number(getDishInfo(item).memberPrice) > 0" class="collection-item__member mt-12rpx">
+                  <image src="@img-store/1339.png" class="w-22rpx h-22rpx mr-6rpx" />
+                  {{ t('pages.browse.brandTag') }} {{ t('pages-store.store.members') }}: ${{ getDishInfo(item).memberPrice }}
+                </view>
+                <view class="collection-item__sales mt-10rpx">
+                  {{ t('pages-store.store.sales') }} : {{ getDishInfo(item).salesCount || 0 }}
+                </view>
+              </view>
+              <view v-if="!batchDeleteMode" class="collection-item__add center">
+                <text class="text-42rpx text-#333">+</text>
+              </view>
+            </view>
           </view>
         </template>
         <template v-if="currentIndex == 2">
           <view class="grid grid-cols-2 gap-30rpx">
-            <view v-for="item in dataList">
+            <view v-for="item in dataList" :key="item.id" class="recipe-card-wrap">
-              <view @click="navigateToRecipeDetail(item.id)" class="w-312rpx">
+              <view
+                v-if="batchDeleteMode"
+                class="recipe-card__check"
+                @click.stop="toggleSelect(item)"
+              >
+                <view class="check-box" :class="{ 'is-on': isSelected(item) }">
+                  <text v-if="isSelected(item)" class="check-tick">✓</text>
+                </view>
+              </view>
+              <view @click="onRecipeCardClick(item)" class="w-312rpx">
                 <image
                     :src="item.merchantRecipeVo?.recipeImage?.split(',')[0]"
                     class="w-310rpx h-296rpx rounded-24rpx mb-26rpx"
@@ -175,7 +279,7 @@ defineExpose({
                   <text class="text-30rpx lh-30rpx text-#333 line-clamp-1 tracking-[.04em] font-500"
                   >{{ item.merchantRecipeVo?.recipeName }}</text
                   >
-                  <view class="w-40rpx h-40rpx ml-14rpx shrink-0">
+                  <view v-if="!batchDeleteMode" class="w-40rpx h-40rpx ml-14rpx shrink-0">
                     <collection
                         :is-collected="item.merchantRecipeVo?.isCollect"
                         @collectionChange="handleSubmitCollectRecipe(item)"
@@ -192,5 +296,123 @@ defineExpose({
 </template>
 
 <style scoped lang="scss">
+.collection-list {
+  .collection-item {
+    display: flex;
+    align-items: center;
+    padding: 24rpx 0;
+    border-bottom: 1rpx solid #f1f1f1;
+  }
 
+  .collection-item__image {
+    width: 168rpx;
+    height: 168rpx;
+    border-radius: 20rpx;
+    background: #f4f4f4;
+    flex-shrink: 0;
+  }
+
+  .collection-item__content {
+    flex: 1;
+    margin-left: 20rpx;
+    overflow: hidden;
+  }
+
+  .collection-item__name {
+    font-size: 30rpx;
+    line-height: 38rpx;
+    color: #222;
+    font-weight: 500;
+  }
+
+  .collection-item__price-row {
+    display: flex;
+    align-items: baseline;
+  }
+
+  .collection-item__price {
+    color: #e7362f;
+    font-size: 42rpx;
+    line-height: 42rpx;
+    font-weight: 600;
+  }
+
+  .collection-item__original {
+    color: #a5a5a5;
+    font-size: 28rpx;
+    line-height: 28rpx;
+    text-decoration: line-through;
+  }
+
+  .collection-item__member {
+    display: inline-flex;
+    align-items: center;
+    color: #c5883f;
+    font-size: 26rpx;
+    line-height: 26rpx;
+  }
+
+  .collection-item__sales {
+    width: fit-content;
+    height: 42rpx;
+    padding: 0 14rpx;
+    border-radius: 10rpx;
+    background: #f1f2f4;
+    color: #9b9b9b;
+    font-size: 24rpx;
+    line-height: 42rpx;
+  }
+
+  .collection-item__add {
+    width: 56rpx;
+    height: 56rpx;
+    border-radius: 50%;
+    border: 1rpx solid #e6e6e6;
+    margin-left: 14rpx;
+    flex-shrink: 0;
+  }
+
+  .collection-item__check {
+    width: 44rpx;
+    margin-right: 12rpx;
+    flex-shrink: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+}
+
+.check-box {
+  width: 40rpx;
+  height: 40rpx;
+  border-radius: 50%;
+  border: 2rpx solid #c8c8c8;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.check-box.is-on {
+  border-color: #111;
+  background: #111;
+}
+
+.check-tick {
+  font-size: 24rpx;
+  line-height: 24rpx;
+  color: #fff;
+  font-weight: 700;
+}
+
+.recipe-card-wrap {
+  position: relative;
+}
+
+.recipe-card__check {
+  position: absolute;
+  z-index: 3;
+  left: 8rpx;
+  top: 8rpx;
+}
 </style>

src/pages-user/pages/collection/index.vue

@@ -1,6 +1,26 @@
 <script setup lang="ts">
 import OrderSwiperList from "./components/order-swiper-list/order-swiper-list.vue";
+import { useUserStore } from "@/store";
+import { onShow } from "@dcloudio/uni-app";
+
 const {t} = useI18n()
+const userStore = useUserStore();
+
+const cartBadgeTotal = computed(() => {
+  const list = userStore.userCartAllData;
+  if (!Array.isArray(list) || list.length === 0) return 0;
+  let n = 0;
+  for (const m of list) {
+    n +=
+      (m as { merchantCartVoList?: unknown[] })?.merchantCartVoList
+        ?.length || 0;
+  }
+  return n;
+});
+
+onShow(() => {
+  userStore.getUserCartAllData();
+});
 const segmentedValue = ref(0);
 const segmentedList = [
     'Store',
@@ -8,26 +28,106 @@ const segmentedList = [
     'Recipe',
 ]
 
-function handleSwiperChange(e) {
+function handleSwiperChange(e: any) {
   segmentedValue.value = e.detail.current;
 }
 
 const orderSwiperListRef = ref()
+
+const batchDeleteMode = ref(false)
+
 onMounted(()=> {
   nextTick(()=> {
     orderSwiperListRef.value[segmentedValue.value].reload()
   })
 })
+
+function exitBatchDeleteMode() {
+  batchDeleteMode.value = false
+}
+
+function handleBatchDeleteSuccess() {
+  batchDeleteMode.value = false
+}
+
+function navigateBack() {
+  uni.navigateBack({
+    delta: 1,
+  })
+}
+
+function handleDeleteCollection() {
+  if (!batchDeleteMode.value) {
+    batchDeleteMode.value = true
+    uni.showToast({
+      title: t('pages.mine.collectionBatchModeHint'),
+      icon: 'none',
+    })
+    return
+  }
+  const inst = orderSwiperListRef.value?.[segmentedValue.value]
+  inst?.runBatchDelete?.()
+}
+
+function navigateToCart() {
+  uni.navigateTo({
+    url: '/pages-user/pages/cart/index'
+  })
+}
 </script>
 
 <template>
-  <view>
+  <view class="collection-page">
     <z-paging-swiper>
       <template #top>
-        <navbar/>
+        <status-bar />
-        <view class="px-30rpx">
+        <view class="header-wrap px-30rpx pt-14rpx">
-          <view class="text-46rpx lh-46rpx text-#333 font-bold mb-52rpx">{{ t('pages.mine.collection') }}</view>
+          <view class="flex items-center justify-between mb-34rpx">
-          <l-segmented v-model="segmentedValue" :options="segmentedList" shape="round" bg-color="#F2F2F2" active-color="#333" />
+            <image
+              @click="navigateBack"
+              src="@img/chef/1327.png"
+              mode="aspectFill"
+              class="w-48rpx h-48rpx"
+            />
+            <view class="text-38rpx lh-38rpx text-#111 font-600">{{ t('pages.mine.collection') }}</view>
+            <view class="flex items-center gap-16rpx">
+              <text
+                v-if="batchDeleteMode"
+                class="text-28rpx text-#666"
+                @click="exitBatchDeleteMode"
+              >{{ t('common.cancel') }}</text>
+              <view
+                v-if="!batchDeleteMode"
+                class="collection-header-cart w-66rpx h-66rpx rounded-50% bg-#F5F5F5 center shrink-0"
+                @click="navigateToCart"
+              >
+                <view class="i-carbon:shopping-cart text-36rpx text-#14181b"></view>
+                <view
+                  v-if="userStore.isLogin && cartBadgeTotal > 0"
+                  class="collection-header-cart-badge"
+                  >{{ cartBadgeTotal > 99 ? "99+" : cartBadgeTotal }}</view
+                >
+              </view>
+              <view
+              v-if="!batchDeleteMode"
+                class="w-66rpx h-66rpx rounded-50% bg-#F5F5F5 center"
+                @click="handleDeleteCollection"
+              >
+                <image src="@img/chef/1278.png" mode="aspectFill" class="w-66rpx h-66rpx" />
+              </view>
+            </view>
+          </view>
+          <l-segmented
+            v-model="segmentedValue"
+            :options="segmentedList"
+            shape="round"
+            bg-color="#F2F3F5"
+            active-color="#fff"
+            color="#5E5E5E"
+            padding="0rpx"
+            slider-color="#000"
+            height="62rpx"
+          />
         </view>
       </template>
 
@@ -35,15 +135,95 @@ onMounted(()=> {
               :current="segmentedValue"
               @change="handleSwiperChange">
         <swiper-item class="swiper-item" v-for="(item, index) in segmentedList" :key="index">
-          <order-swiper-list ref="orderSwiperListRef" :currentIndex="segmentedValue" :index="index"></order-swiper-list>
+          <order-swiper-list
+            ref="orderSwiperListRef"
+            :currentIndex="segmentedValue"
+            :index="index"
+            :batch-delete-mode="batchDeleteMode"
+            @batch-delete-success="handleBatchDeleteSuccess"
+          />
         </swiper-item>
       </swiper>
     </z-paging-swiper>
+
+    <view class="cart-bar-wrap px-24rpx pb-24rpx" v-if="batchDeleteMode">
+      <view class="delete-bar">
+        <view class="text-30rpx  text-#1d1d1d ml-20rpx" style="color: #fff;">{{ t('common.delete') || '删除' }}</view>
+      </view>
+    </view>
   </view>
 </template>
 
-<style>
+<style scoped lang="scss">
 page {
-  background-color: white;
+  background-color: #fff;
+}
+
+.collection-page {
+  min-height: 100vh;
+  background: #fff;
+  padding-bottom: constant(safe-area-inset-bottom);
+  padding-bottom: env(safe-area-inset-bottom);
+}
+
+.header-wrap {
+  background: #fff;
+}
+
+:deep(.l-segmented) {
+  height: 62rpx !important;
+  border-radius: 34rpx !important;
+}
+
+:deep(.l-segmented-item) {
+  font-size: 30rpx !important;
+  color: #666 !important;
+}
+
+:deep(.l-segmented-item--active) {
+  color: #fff !important;
+  font-weight: 600 !important;
+  background: #111 !important;
+}
+
+.cart-bar-wrap {
+  position: fixed;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 20;
+  background: linear-gradient(to top, #fff 65%, rgba(255, 255, 255, 0));
+}
+
+.collection-header-cart {
+  position: relative;
+}
+
+.collection-header-cart-badge {
+  position: absolute;
+  top: 2rpx;
+  right: 2rpx;
+  min-width: 28rpx;
+  height: 28rpx;
+  padding: 0 6rpx;
+  font-size: 18rpx;
+  line-height: 28rpx;
+  font-weight: 600;
+  color: #fff;
+  text-align: center;
+  background: #e23636;
+  border-radius: 999rpx;
+}
+
+.delete-bar {
+  height: 96rpx;
+  border-radius: 48rpx;
+  background: #000;
+  box-shadow: 0 -2rpx 16rpx rgba(0, 0, 0, 0.06);
+  border: 1rpx solid #efefef;
+  padding: 0 26rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
 </style>

src/pages-user/pages/complaints/index.vue

@@ -1,8 +1,8 @@
 <script setup lang="ts">
 import ChooseImage from "@/components/choose-image/choose-image.vue";
-import {appFeedbackAddPost} from "@/service";
+import { appFeedbackAddPost } from "@/service";
 import { z } from 'zod';
-const {t} = useI18n()
+const { t } = useI18n()
 
 const form = ref({
   content: '',
@@ -24,9 +24,37 @@ const createValidationSchema = () => {
 }
 
 const chooseImageRef = ref()
+const showNoticePopup = ref(true)
+const confirmCountdown = ref(5)
+let countdownTimer: ReturnType<typeof setInterval> | null = null
 
-// 校验单个字段
+function startNoticeCountdown() {
-const validateField = (field: keyof typeof form.value) => {
+  if (countdownTimer) {
+    clearInterval(countdownTimer)
+  }
+  confirmCountdown.value = 5
+  countdownTimer = setInterval(() => {
+    if (confirmCountdown.value <= 1) {
+      confirmCountdown.value = 0
+      if (countdownTimer) {
+        clearInterval(countdownTimer)
+        countdownTimer = null
+      }
+      return
+    }
+    confirmCountdown.value -= 1
+  }, 1000)
+}
+
+function handleCloseNoticePopup() {
+  if (confirmCountdown.value > 0) {
+    return
+  }
+  showNoticePopup.value = false
+}
+
+// 校验单个字段（只校验 schema 中存在的字段）
+const validateField = (field: 'content' | 'contactPhone') => {
   try {
     const schema = createValidationSchema()
     const fieldSchema = schema.shape[field]
@@ -64,12 +92,12 @@ const handleSubmit = () => {
   if (!validateForm()) {
     return
   }
-  
+
   appFeedbackAddPost({
     body: {
       ...form.value
     }
-  }).then(res=> {
+  }).then(res => {
     uni.showToast({
       title: t('toast.submitSuccess'),
       icon: 'none'
@@ -88,79 +116,217 @@ const handleChooseImage = () => {
 function onImageChange(files: string[]) {
   form.value.images = files[0]
 }
+
+onLoad(() => {
+  startNoticeCountdown()
+})
+
+onUnload(() => {
+  if (countdownTimer) {
+    clearInterval(countdownTimer)
+    countdownTimer = null
+  }
+})
 </script>
 <template>
-  <navbar :title="t('pages-user.complaints.title')" />
+  <view class="complaints-root">
-  <view class="px-18rpx">
+    <navbar :title="t('pages-user.complaints.title')" />
-    <view class="mb-27rpx mt-32rpx text-28rpx text-#333">
+    <view class="complaints-page">
-      {{ t('pages-user.complaints.description') }}
-    </view>
-    <view class="bg-white rounded-14rpx px-18rpx pt-30rpx pb-24rpx">
-      <view class="text-28rpx text-#333 mb-28rpx">{{ t('pages-user.complaints.feedback-content') }}：</view>
-      <view
-          class="min-h-234rpx box-border bg-#F6F6F6 rounded-14rpx overflow-hidden px-18rpx py-10rpx"
-      >
-        <wd-textarea
-            v-model="form.content"
-            :maxlength="500"
-            custom-class="!bg-#F6F6F6"
-            custom-textarea-container-class="!bg-#F6F6F6"
-            no-border
-            auto-height
-            :placeholder="t('pages-user.complaints.feedback-content-placeholder')"
-            @blur="validateField('content')"
-        /> 
-      </view>
 
 
-      <view>
+      <view class="form-card">
-        <view class="text-28rpx text-#333 mt-32rpx mb-24rpx">{{ t('pages-user.complaints.image') }}:</view>
+        <view class="field">
-        <view @click="handleChooseImage" class="relative w-210rpx h-210rpx">
+          <view class="field__label">{{ t('pages-user.complaints.feedback-content') }}</view>
-          <image
+          <view class="field__box field__box--textarea">
-              v-if="form.images"
+            <wd-textarea v-model="form.content" :maxlength="500" custom-class="!bg-transparent"
-              src="@img/chef/113.png"
+              custom-textarea-container-class="!bg-transparent" no-border auto-height
-              class="absolute top--10rpx right--10rpx z-10 w-36rpx h-36rpx"
+              :placeholder="t('pages-user.complaints.feedback-content-placeholder')" @blur="validateField('content')" />
-          ></image>
+          </view>
-          <image
-              v-if="!form.images"
-              src="@img/chef/112.png"
-              class="w-210rpx h-210rpx"
-          ></image>
-          <image
-              v-else
-              :src="form.images"
-              class="w-210rpx h-210rpx rounded-16rpx"
-              mode="aspectFill"
-          ></image>
         </view>
-      </view>
-    </view>
-    <view class="mt-14rpx flex-center-sb bg-white h-86rpx rounded-14rpx px-18rpx">
-      <view class="text-28rpx text-#333 ">{{ t('pages-user.complaints.contact-information') }}:</view>
-      <wd-input
-          no-border
-          custom-class="!p-[12rpx+20rpx]   rounded-10rpx"
-          v-model.trim="form.contactPhone"
-          placeholderStyle="font-size: 28rpx;line-height: 40rpx;color: #B1B1B1; text-align: right;"
-          :placeholder="t('common.enter')"
-          :maxlength="50"
-          custom-input-class="text-right"
-          @blur="validateField('contactPhone')"
-      />
-    </view>
 
-    <view class="mt-38rpx text-28rpx text-#999">
+        <view class="field field--mt">
-      {{ t('pages-user.complaints.contact-information-tip') }}
+          <view class="field__label">{{ t('pages-user.complaints.image') }}</view>
+          <view class="upload" @click="handleChooseImage">
+            <image v-if="form.images" src="@img/chef/113.png" class="upload__remove"></image>
+            <image v-if="!form.images" src="@img/chef/112.png" class="upload__placeholder"></image>
+            <image v-else :src="form.images" class="upload__image" mode="aspectFill"></image>
+          </view>
+        </view>
+
+        <view class="field field--mt">
+          <view class="field__label">{{ t('pages-user.complaints.contact-information') }}</view>
+          <view class="field__box field__box--input">
+            <wd-input v-model.trim="form.contactPhone" no-border custom-class="!p-0 !bg-transparent"
+              custom-input-class="complaints-input" :placeholder="t('pages-user.complaints.contact-information-placeholder')" :maxlength="50"
+              @blur="validateField('contactPhone')" />
+          </view>
+        </view>
+
+      </view>
+
+      <view class="complaints-page__desc">
+        {{ t('pages-user.complaints.description') }}
+      </view>
+
+      <!-- 底部固定提交按钮 -->
+      <view class="bottom-actions">
+        <wd-button custom-class="submit-btn" block @click="handleSubmit">
+          {{ t('common.submit') }}
+        </wd-button>
+      </view>
+
+      <ChooseImage ref="chooseImageRef" @change="onImageChange" />
+
+      <wd-popup v-model="showNoticePopup" :close-on-click-modal="false" custom-class="!bg-transparent">
+        <view class="notice-dialog">
+          <view class="notice-dialog__title">{{ t('pages-user.complaints.title') }}</view>
+          <view class="notice-dialog__content">
+            {{ t('pages-user.complaints.contact-information-tip') }}
+          </view>
+          <wd-button
+            custom-class="notice-dialog__btn"
+            block
+            :disabled="confirmCountdown > 0"
+            @click="handleCloseNoticePopup"
+          >
+            {{ confirmCountdown > 0 ? `${t('common.gotIt')} (${confirmCountdown}s)` : t('common.gotIt') }}
+          </wd-button>
+        </view>
+      </wd-popup>
     </view>
-    <fixed-bottom-large-btn
-        class="z-100"
-        fixed
-        :text="`${t('common.submit')}`"
-        @click="handleSubmit"
-    />
-    <ChooseImage ref="chooseImageRef" @change="onImageChange" />
   </view>
 </template>
 <style lang="scss" scoped>
+.complaints-page {
+  padding: 32rpx 30rpx calc(160rpx + env(safe-area-inset-bottom));
+  background: #fff;
+  min-height: 100vh;
+  box-sizing: border-box;
+}
 
+.complaints-page__desc {
+  font-size: 22rpx;
+  line-height: 36rpx;
+  color: #333;
+  margin-bottom: 18rpx;
+  text-align: center;
+}
+
+.form-card {
+  background: #fff;
+  border-radius: 24rpx;
+  padding: 26rpx 24rpx 18rpx;
+}
+
+.field__label {
+  font-size: 26rpx;
+  line-height: 36rpx;
+  color: #333;
+  font-weight: 700;
+  margin-bottom: 16rpx;
+}
+
+.field--mt {
+  margin-top: 26rpx;
+}
+
+.field__box {
+  border: 1rpx solid #ececec;
+  border-radius: 18rpx;
+  background: #fff;
+  overflow: hidden;
+}
+
+.field__box--textarea {
+  padding: 14rpx 16rpx;
+  min-height: 240rpx;
+  box-sizing: border-box;
+}
+
+.field__box--input {
+  padding: 18rpx 16rpx;
+  box-sizing: border-box;
+}
+
+:deep(.complaints-input) {
+  text-align: left;
+  font-size: 26rpx;
+  line-height: 36rpx;
+  color: #333;
+}
+
+.upload {
+  width: 176rpx;
+  height: 176rpx;
+  border: 1rpx solid #ececec;
+  border-radius: 18rpx;
+  overflow: hidden;
+  position: relative;
+  background: #fff;
+}
+
+.upload__placeholder,
+.upload__image {
+  width: 176rpx;
+  height: 176rpx;
+}
+
+.upload__remove {
+  position: absolute;
+  top: -10rpx;
+  right: -10rpx;
+  z-index: 2;
+  width: 36rpx;
+  height: 36rpx;
+}
+
+.bottom-actions {
+  position: fixed;
+  left: 30rpx;
+  right: 30rpx;
+  bottom: calc(36rpx + env(safe-area-inset-bottom));
+  z-index: 20;
+}
+
+:deep(.submit-btn) {
+  height: 108rpx !important;
+  border-radius: 999rpx !important;
+  background: #111 !important;
+  color: #fff !important;
+  font-size: 32rpx !important;
+  font-weight: 800 !important;
+  letter-spacing: 0.06em;
+}
+
+.notice-dialog {
+  width: 620rpx;
+  background: #fff;
+  border-radius: 24rpx;
+  padding: 36rpx 28rpx 28rpx;
+  box-sizing: border-box;
+}
+
+.notice-dialog__title {
+  text-align: center;
+  font-size: 30rpx;
+  line-height: 40rpx;
+  color: #222;
+  font-weight: 700;
+}
+
+.notice-dialog__content {
+  margin-top: 18rpx;
+  margin-bottom: 28rpx;
+  font-size: 26rpx;
+  line-height: 38rpx;
+  color: #666;
+  // text-align: center;
+}
+
+:deep(.notice-dialog__btn) {
+  height: 84rpx !important;
+  border-radius: 999rpx !important;
+  font-size: 28rpx !important;
+  font-weight: 700 !important;
+}
 </style>

src/pages-user/pages/coupon/index.vue

@@ -42,6 +42,16 @@ function formatCouponDetail(item: any) {
   return t('pages-store.store.discount')
 }
 
+function formatCouponMerchantText(item: any) {
+  const name = String(item?.merchantVo?.merchantName || '').trim()
+  if (name) {
+    return `${t('pages-user.coupon.merchantOnlyPrefix')}${name}${t('pages-user.coupon.merchantOnlySuffix')}`
+  }
+  return item?.snapshotMerchantId
+    ? t('pages-user.coupon.merchant-specific')
+    : t('pages-user.coupon.all-merchants')
+}
+
 function getList(pageNum: number, pageSize: number) {
   return appCouponUserCouponListPost({
     params: {
@@ -101,11 +111,11 @@ function handleSubmit() {
     bg-color="#fff"
   >
     <template #top>
-      <navbar />
+      <navbar :title="t('pages-user.coupon.title')" />
       <view class="px-30rpx pb-42rpx">
-        <view class="text-46rpx text-#333 font-bold lh-46rpx mb-36rpx mt-10rpx">
+        <!-- <view class="text-46rpx text-#333 font-bold lh-46rpx mb-36rpx mt-10rpx">
           {{ t("pages-user.coupon.title") }}</view
-        >
+        > -->
         <view
           class="flex items-center h-88rpx px-30rpx bg-#F2F3F6 rounded-88rpx box-border"
         >
@@ -131,10 +141,11 @@ function handleSubmit() {
       </view>
     </template>
 
-    <view class="px-30rpx my-38rpx" v-if="isSearch">
+    <view class="px-30rpx my-34rpx" style="position: fixed; bottom: 10rpx; left: 0; right: 0; z-index: 100;" v-if="isSearch">
       <wd-button
         block
-        custom-class="!h-108rpx !text-36rpx !rounded-16rpx"
+        custom-class="!h-98rpx !text-32rpx !rounded-46rpx"
+        style="background-color: #000;"
         :disabled="isDisabled"
         @click="handleSubmit"
       >
@@ -149,7 +160,7 @@ function handleSubmit() {
               {{ item.snapshotNameZh }}
             </view>
             <view class="text-24rpx lh-32rpx text-#999 my-18rpx">
-              {{ item.snapshotMerchantId ? t('pages-user.coupon.merchant-specific') : t('pages-user.coupon.all-merchants') }}
+              {{ formatCouponMerchantText(item) }}
             </view>
             <view class="text-24rpx lh-32rpx text-#999 my-18rpx">
               {{ dayjs(Number(item.snapshotValidEnd)).format('YYYY-MM-DD HH:mm') }}{{ isEnLocale() ? ' expires' : '到期' }}

src/pages-user/pages/edit-nickname/index.vue

@@ -1,12 +1,20 @@
+<!--
+ * @Author: ISFP_T 68358856@qq.com
+ * @Date: 2026-02-25 10:02:44
+ * @LastEditors: ISFP_T 68358856@qq.com
+ * @LastEditTime: 2026-04-01 15:51:38
+ * @FilePath: \chef-link-uniapp\src\pages-user\pages\edit-nickname\index.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
 <script lang="ts" setup>
 import Config from '@/config'
-import {useUserStore} from '@/store'
+import { useUserStore } from '@/store'
 import { appUserEditUserInfoPost } from '@/service'
-import {debounce} from 'throttle-debounce';
+import { debounce } from 'throttle-debounce';
-import {z} from "zod";
+import { z } from "zod";
 import * as R from "ramda";
 
-const {t} = useI18n()
+const { t } = useI18n()
 const userStore = useUserStore()
 
 const form = ref({
@@ -15,8 +23,8 @@ const form = ref({
 })
 
 const FormSchema = z.object({
-  firstName: z.string().min(1, {message: t('pages-login.prompt.first-name')}),
+  firstName: z.string().min(1, { message: t('pages-login.prompt.first-name') }),
-  surname: z.string().min(1, {message: t('pages-login.prompt.last-name')}),
+  surname: z.string().min(1, { message: t('pages-login.prompt.last-name') }),
 })
 
 
@@ -26,10 +34,10 @@ function checkForm(): boolean {
     const fieldErrorMessage = validateFormField.error.flatten().fieldErrors
     const errorMessage: string | undefined = R.path([0, 0], R.values(fieldErrorMessage))
     errorMessage &&
-    uni.showToast({
+      uni.showToast({
-      title: errorMessage,
+        title: errorMessage,
-      icon: 'none',
+        icon: 'none',
-    })
+      })
   }
   return validateFormField.success
 }
@@ -42,7 +50,7 @@ async function submit() {
         ...form.value,
       }
     })
-    await uni.showToast({title: t('common.prompt.save-successfully'), icon: 'none'})
+    await uni.showToast({ title: t('common.prompt.save-successfully'), icon: 'none' })
     await userStore.getUserInfo()
     setTimeout(uni.navigateBack, 1000)
   } catch (e) {
@@ -57,47 +65,28 @@ const handleSubmit = R.when(checkForm, debounce(Config.debounceLongTime, submit,
 
 <template>
   <view>
-    <navbar :title="t('navbar-nickname')"/>
+    <navbar :title="t('navbar-nickname')" />
     <view class="py-36rpx px-30rpx bg-#fff">
-        <view class="">
+      <view class="">
-          <view class="text-28-bold">{{ t("pages-login.sign-up.first-name") }}</view>
+        <view class="text-28-bold">{{ t("pages-login.sign-up.first-name") }}</view>
-          <view
+        <view class="mt-20rpx flex px-30rpx items-center h-88rpx border-2rpx border-solid border-#D4D4D4 rounded-20rpx">
-              class="mt-20rpx flex px-30rpx items-center h-88rpx border-2rpx border-solid border-#D4D4D4 rounded-20rpx">
+          <wd-input no-border clearable :focus-when-clear="false" :cursorSpacing="20" :maxlength="40"
-            <wd-input
+            v-model.trim="form.firstName" custom-class="flex-1" placeholder="">
-                no-border
+          </wd-input>
-                clearable
-                :focus-when-clear="false"
-                :cursorSpacing="20"
-                :maxlength="40"
-                v-model.trim="form.firstName"
-                custom-class="flex-1"
-                placeholder=""
-            >
-            </wd-input>
-          </view>
-        </view>
-        <view class="mt-36rpx">
-          <view class="text-28-bold">{{ t("pages-login.sign-up.last-name") }}</view>
-          <view
-              class="mt-20rpx flex px-30rpx items-center h-88rpx border-2rpx border-solid border-#D4D4D4 rounded-20rpx">
-            <wd-input
-                no-border
-                clearable
-                :focus-when-clear="false"
-                use-prefix-slot
-                :maxlength="40"
-                :cursorSpacing="20"
-                v-model.trim="form.surname"
-                custom-class="flex-1"
-                placeholder=""
-            >
-            </wd-input>
-          </view>
         </view>
       </view>
+      <view class="mt-36rpx">
+        <view class="text-28-bold">{{ t("pages-login.sign-up.last-name") }}</view>
+        <view class="mt-20rpx flex px-30rpx items-center h-88rpx border-2rpx border-solid border-#D4D4D4 rounded-20rpx">
+          <wd-input no-border clearable :focus-when-clear="false" use-prefix-slot :maxlength="40" :cursorSpacing="20"
+            v-model.trim="form.surname" custom-class="flex-1" placeholder="">
+          </wd-input>
+        </view>
+      </view>
+    </view>
 
-    <view class="mt-318rpx px-30rpx">
+    <view class="mt-318rpx px-30rpx" style="position: fixed; bottom: 30rpx; left: 0; right: 0; z-index: 100;">
-      <wd-button custom-class="!h-108rpx !text-36rpx font-bold !rounded-16rpx" block @click="handleSubmit">
+      <wd-button custom-class="!h-108rpx !text-36rpx font-bold !rounded-46rpx" block @click="handleSubmit">
         {{ t('common.save') }}
       </wd-button>
     </view>

src/pages-user/pages/faqs/index.vue

@@ -59,9 +59,9 @@ onLoad(()=> {
       :auto="false"
     >
       <template #top>
-        <navbar />
+        <navbar :title="t('pages.mine.help')" />
         <view class="px-30rpx pb-42rpx">
-          <view class="text-46rpx text-#333 font-bold lh-46rpx mb-36rpx mt-10rpx">{{ t("pages.mine.help") }}</view>
+          <!-- <view class="text-46rpx text-#333 font-bold lh-46rpx mb-36rpx mt-10rpx">{{ t("pages.mine.help") }}</view> -->
           <view
             class="flex items-center h-88rpx px-30rpx bg-#F2F3F6 rounded-88rpx box-border"
           >

src/pages-user/pages/invited-person/index.vue

@@ -42,8 +42,13 @@ function handleClickLeft() {
               <view class="i-carbon:chevron-left text-50rpx text-#3D3D3D ml-[-10rpx]"></view>
             </view>
           </template>
+          <template #title>
+            <view class="invite-navbar-title-wrap">
+              <text class="invite-navbar-title">{{ t('pages.mine.the-person-invited') }}</text>
+              <text class="invite-navbar-count">({{ dataList.length }})</text>
+            </view>
+          </template>
         </wd-navbar>
-        <view class="mb-46rpx mt-18rpx pl-30rpx text-#333 text-46rpx lh-46rpx font-bold">{{ t('pages.mine.the-person-invited') }} ({{ dataList.length }})</view>
       </template>
       <view class="px-18rpx">
         <view
@@ -111,4 +116,30 @@ function handleClickLeft() {
   </view>
 </template>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.invite-navbar-title-wrap {
+  display: flex;
+  align-items: baseline;
+  align-items: center;
+  align-content: center;
+  height: 100%;
+  justify-content: center;
+  width: 100%;
+  padding-left: 8rpx;
+  gap: 8rpx;
+}
+
+.invite-navbar-title {
+  font-size: 34rpx;
+  line-height: 42rpx;
+  font-weight: 700;
+  color: #333;
+}
+
+.invite-navbar-count {
+  font-size: 28rpx;
+  line-height: 34rpx;
+  font-weight: 600;
+  color: #666;
+}
+</style>

src/pages-user/pages/member/join-member.vue

@@ -11,7 +11,6 @@ const configStore = useConfigStore()
 const userStore = useUserStore();
 import {EventEnum} from "@/constant/enums";
 import {appMembershipRechargePost, appUserCardSelectDefaultPost} from "@/service";
-import { tWithParams } from '@/utils/utils';
 
 // 订阅选项
 const subscriptionPlans = ref([]);
@@ -213,7 +212,7 @@ function changeAutoSubscribe() {
                 <text
                   v-if="+item.membershipType === 2"
                   class=" text-#999 ml-16rpx"
-                  >({{ tWithParams('pages-user.member.billedAnnually', { amount: item.rechargeAmount }) }})</text
+                  >({{ t('pages-user.member.billedAnnuallyPrefix') }}{{ item.rechargeAmount }}{{ t('pages-user.member.billedAnnuallySuffix') }})</text
                 >
               </view>
             </view>
@@ -240,7 +239,7 @@ function changeAutoSubscribe() {
                   class="w-32rpx h-32rpx mr-16rpx shrink-0"
                   mode="aspectFit"
               />
-              <text class="text-24rpx text-#CE7138">{{ tWithParams('pages-user.member.savingsPerYear', { amount: `$${annualDiscount}` }) }}</text>
+              <text class="text-24rpx text-#CE7138">{{ t('pages-user.member.savingsPerYearPrefix') }}{{ annualDiscount }}{{ t('pages-user.member.savingsPerYearSuffix') }}</text>
             </view>
           </view>
         </view>

src/pages-user/pages/recharge/activity-detail.vue

@@ -0,0 +1,152 @@
+<script setup lang="ts">
+import { appMarketActivityListPost } from '@/service'
+import { useConfigStore } from '@/store'
+
+const { t } = useI18n()
+const configStore = useConfigStore()
+
+const activityId = ref('')
+const loading = ref(true)
+const activity = ref<Record<string, any>>({})
+
+const bannerSrc = computed(() => {
+  return activity.value.activityImageUrl || activity.value.activityImage || ''
+})
+
+const activityTitle = computed(() => {
+  return activity.value.activityName || t('pages-user.recharge.activityDetailTitle')
+})
+
+const activityContent = computed(() => {
+  const content = activity.value.activityContent
+  if (typeof content === 'string' && content.trim()) {
+    return content
+  }
+  return `<p>${t('pages-user.recharge.activityPlaceholderDesc')}</p>`
+})
+
+async function loadActivityDetail() {
+  loading.value = true
+  try {
+    const res = await appMarketActivityListPost({})
+    const list = Array.isArray(res?.data) ? res.data : []
+    const matched = list.find((item) => String(item?.id) === activityId.value)
+    activity.value = matched || {}
+  } catch {
+    activity.value = {}
+  } finally {
+    loading.value = false
+  }
+}
+
+function handleRecharge() {
+  uni.navigateTo({
+    url: '/pages-user/pages/recharge/index',
+  })
+}
+
+onLoad((query?: Record<string, string | undefined>) => {
+  activityId.value = String(query?.id ?? '')
+  loadActivityDetail()
+})
+</script>
+
+<template>
+  <view class="recharge-activity-page">
+    <navbar :title="t('pages-user.recharge.activityDetailTitle')" />
+
+    <view v-if="loading" class="recharge-activity-page__loading center py-120rpx text-28rpx text-#999">
+      {{ t('common.loading') }}
+    </view>
+
+    <template v-else>
+      <view class="recharge-activity-page__banner">
+        <image
+          v-if="bannerSrc"
+          :src="bannerSrc"
+          class="recharge-activity-page__banner-img"
+          mode="scaleToFill"
+        />
+        <view
+          v-else
+          class="recharge-activity-page__banner-placeholder"
+        >
+          {{ t('pages-user.recharge.activityDetailTitle') }}
+        </view>
+      </view>
+
+      <view class="px-30rpx pt-32rpx">
+        <view class="mt-32rpx mb-24rpx text-40rpx lh-48rpx text-#333 font-bold tracking-[.04em]">
+          {{ activityTitle }}
+        </view>
+
+        <view class="recharge-activity-page__card rounded-16rpx bg-white px-28rpx py-32rpx">
+          <view class="text-30rpx lh-30rpx text-#333 font-500 mb-24rpx">
+            {{ t('pages-user.recharge.activityRulesTitle') }}
+          </view>
+          <mp-html
+            selectable
+            :preview-img="false"
+            :show-img-menu="false"
+            :tag-style="{
+              div: 'white-space: pre-wrap;',
+              p: 'white-space: pre-wrap;color:#666;font-size:14px;line-height:1.7;',
+              img: 'width:100%;max-width:100%;height:auto;',
+            }"
+            :content="activityContent"
+          />
+        </view>
+      </view>
+
+      <view class="h-160rpx" />
+      <view :style="[configStore.iosSafeBottomPlaceholder]" />
+
+      <view class="recharge-activity-page__footer fixed bottom-0 left-0 right-0 px-30rpx pt-16rpx bg-#fff">
+        <wd-button
+          custom-class="!h-98rpx !text-30rpx !text-#fff !lh-98rpx !rounded-16rpx"
+          block
+          @click="handleRecharge"
+        >
+          {{ t('pages-user.recharge.activityRechargeBtn') }}
+        </wd-button>
+        <view :style="[configStore.iosSafeBottomPlaceholder]" />
+      </view>
+    </template>
+  </view>
+</template>
+
+<style>
+page {
+  background-color: #f5f5f5;
+}
+</style>
+
+<style scoped lang="scss">
+.recharge-activity-page__banner {
+  width: 100%;
+  height: 420rpx;
+  overflow: hidden;
+  background: #f5f5f5;
+}
+
+.recharge-activity-page__banner-img {
+  width: 100%;
+  height: 100%;
+  display: block;
+}
+
+.recharge-activity-page__banner-placeholder {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 28rpx;
+  color: #999;
+  background: #f5f5f5;
+}
+
+.recharge-activity-page__footer {
+  box-shadow: 0 -4rpx 20rpx rgba(0, 0, 0, 0.06);
+}
+</style>

src/pages-user/pages/recharge/index.vue

@@ -1,156 +1,465 @@
 <script setup lang="ts">
-import {appUserCardSelectDefaultPost} from "@/service";
+import Config from '@/config/index'
-import useEventEmit from "@/hooks/useEventEmit";
+import ChooseImage from '@/components/choose-image/choose-image.vue'
-import {EventEnum} from "@/constant/enums";
+import { appMarketActivityRechargePromotionGet, appUserCardSelectDefaultPost } from '@/service'
-import { rechargeBalanceApi } from "@/pages-user/service";
+import useEventEmit from '@/hooks/useEventEmit'
-const { t } = useI18n();
+import { EventEnum } from '@/constant/enums'
+import { rechargeBalanceApi } from '@/pages-user/service'
 
-const amount = ref()
+const { t, locale } = useI18n()
 
-const payMethodOptions = ref({
+const PAY_METHOD_STRIPE = 1
-  payMethod: 1,
+const PAY_METHOD_ZIP = 3
-  cardId: '',
+
-  cardNumber: '',
+const amount = ref<string | number>('')
+const payMethod = ref(PAY_METHOD_STRIPE)
+const cardId = ref('')
+const cardNumber = ref('')
+const zipPayVoucher = ref('')
+const submitting = ref(false)
+const rechargePromotion = ref<Record<string, any> | null>(null)
+const voucherChooseRef = ref<InstanceType<typeof ChooseImage>>()
+const promotionNoticeRef = ref<{ reset?: () => void }>()
+const zellePayPath = Config.zellePayPath
+
+const promotionTiers = computed(() => {
+  const list = rechargePromotion.value?.rechargeTierList
+  if (!Array.isArray(list)) return []
+  return [...list].sort(
+    (a, b) => (Number(a?.sort) || 0) - (Number(b?.sort) || 0),
+  )
 })
 
-function handleSubmit() {
+function formatPromotionTier(tier: Record<string, any>) {
-  if(!amount.value) {
+  const recharge = String(tier.rechargeAmount ?? '0')
+  const gift = String(tier.giftAmount ?? '0')
+  if (locale.value === 'zh-Hans') {
+    return `充${recharge}送${gift}`
+  }
+  return `Deposit ${recharge}, get ${gift} bonus`
+}
+
+const promotionActivityName = computed(() => {
+  return (
+    rechargePromotion.value?.activityName ||
+    t('pages-user.recharge.activityDetailTitle')
+  )
+})
+
+const promotionNoticeTexts = computed(() => {
+  if (!promotionTiers.value.length) return []
+  return promotionTiers.value.map((tier) =>
+    `${promotionActivityName.value}：${formatPromotionTier(tier)}`,
+  )
+})
+
+/** 横向无缝滚动：多条拼接，重复一遍避免循环跳变 */
+const promotionNoticeScrollText = computed(() => {
+  const items = promotionNoticeTexts.value.filter(Boolean)
+  if (!items.length) return ''
+  const once = items.join('　　')
+  if (items.length === 1) return once
+  return `${once}　　${once}`
+})
+
+const promotionNoticeShouldScroll = computed(
+  () => promotionNoticeTexts.value.length > 1,
+)
+
+function selectPayMethod(method: number) {
+  if (payMethod.value === method) return
+  payMethod.value = method
+  if (method === PAY_METHOD_STRIPE) {
+    zipPayVoucher.value = ''
+  }
+}
+
+function normalizeVoucherUrl(payload: unknown): string {
+  if (Array.isArray(payload)) {
+    const first = payload[0]
+    return typeof first === 'string' ? first : ''
+  }
+  return typeof payload === 'string' ? payload : ''
+}
+
+function openUploadVoucher() {
+  voucherChooseRef.value?.init()
+}
+
+function onVoucherUploaded(urls: unknown) {
+  const url = normalizeVoucherUrl(urls)
+  if (!url) {
+    uni.showToast({
+      title: t('pages-store.order.voucherUploadFailed'),
+      icon: 'none',
+    })
+    return
+  }
+  zipPayVoucher.value = url
+}
+
+function validateAmount(): number | null {
+  const val = Number(amount.value)
+  if (!amount.value && amount.value !== 0) {
     uni.showToast({
       title: t('pages-user.recharge.description'),
       icon: 'none',
     })
-    return
+    return null
   }
-  if(amount.value <= 0) {
+  if (!Number.isFinite(val) || val <= 0) {
     uni.showToast({
       title: t('pages-user.recharge.amount-invalid'),
       icon: 'none',
     })
+    return null
+  }
+  return val
+}
+
+async function handleSubmit() {
+  const payAmount = validateAmount()
+  if (payAmount == null || submitting.value) return
+
+  if (payMethod.value === PAY_METHOD_STRIPE) {
+    if (!cardId.value) {
+      uni.showToast({
+        title: t('pages-user.recharge.pay-method'),
+        icon: 'none',
+      })
+      return
+    }
+    submitting.value = true
+    try {
+      await rechargeBalanceApi({
+        payAmount,
+        payMethod: PAY_METHOD_STRIPE,
+        cardId: cardId.value,
+        cardType: 1,
+      })
+      uni.showToast({
+        title: t('pages-user.recharge.success'),
+        icon: 'none',
+      })
+      setTimeout(() => uni.navigateBack(), 1000)
+    } finally {
+      submitting.value = false
+    }
     return
   }
-  if(!payMethodOptions.value.cardId) {
+
+  if (!zipPayVoucher.value) {
     uni.showToast({
-      title: t('pages-user.recharge.pay-method'),
+      title: t('pages-user.recharge.voucherRequired'),
       icon: 'none',
     })
     return
   }
-  rechargeBalanceApi({
+
-    payAmount: Number(amount.value),
+  submitting.value = true
-    cardId: payMethodOptions.value.cardId,
+  try {
-    cardType: 1
+    await rechargeBalanceApi({
-  }).then(res => {
+      payAmount,
-    console.log('充值余额', res)
+      payMethod: PAY_METHOD_ZIP,
+      zipPayVoucher: zipPayVoucher.value,
+    })
     uni.showToast({
-      title: t('pages-user.recharge.success'),
+      title: t('pages-user.recharge.zipSubmitSuccess'),
       icon: 'none',
     })
-    setTimeout(() => {
+    setTimeout(() => uni.navigateBack(), 1200)
-      uni.navigateBack()
+  } finally {
-    }, 1000)
+    submitting.value = false
-  })
+  }
 }
 
 function navigateTo(url: string) {
   uni.navigateTo({ url })
 }
 
-onLoad(()=> {
+async function loadRechargePromotion() {
-  // 查询用户默认信用卡
+  try {
-  appUserCardSelectDefault()
+    const res: any = await appMarketActivityRechargePromotionGet({})
-})
+    rechargePromotion.value = res?.data ?? null
+  } catch {
+    rechargePromotion.value = null
+  } finally {
+    await nextTick()
+    promotionNoticeRef.value?.reset?.()
+  }
+}
 
 function appUserCardSelectDefault() {
-  appUserCardSelectDefaultPost({}).then((res: any)=> {
+  appUserCardSelectDefaultPost({}).then((res: any) => {
-    console.log('查询用户默认信用卡', res)
+    cardId.value = res.data?.cardId || ''
-    payMethodOptions.value.cardId = res.data?.cardId || ''
+    cardNumber.value = res.data?.cardNumber || ''
-    payMethodOptions.value.cardNumber = res.data?.cardNumber || ''
   })
 }
+
 useEventEmit(EventEnum.CHOOSE_PAYMENT_METHOD, (data) => {
-  if(data) {
+  if (!data) return
-    payMethodOptions.value.cardId = data.cardId
+  cardId.value = data.cardId || ''
-    payMethodOptions.value.cardNumber = data.cardNumber
+  cardNumber.value = data.cardNumber || ''
-    payMethodOptions.value.payMethod = 1
+  payMethod.value = PAY_METHOD_STRIPE
-  }
+  zipPayVoucher.value = ''
+})
+
+onLoad(() => {
+  appUserCardSelectDefault()
+  void loadRechargePromotion()
 })
 </script>
 
 <template>
-  <view class="">
+  <view class="recharge-page">
-    <navbar :title="t('pages-user.recharge.title')"/>
+    <navbar :title="t('pages-user.recharge.title')" />
 
-    <view class="px-20rpx py-22rpx">
+    <view class="recharge-page__body">
-      <view class="bg-white rounded-12rpx p-28rpx">
+      <view v-if="promotionNoticeScrollText" class="recharge-promo-notice mx-30rpx mb-30rpx">
+        <wd-notice-bar
+          ref="promotionNoticeRef"
+          prefix="sound"
+          :text="promotionNoticeScrollText"
+          direction="horizontal"
+          :scrollable="promotionNoticeShouldScroll"
+          :delay="1"
+          :speed="60"
+          color="#00A76D"
+          background-color="#E8F8F1"
+          custom-class="recharge-promo-notice__bar"
+        />
+      </view>
+
+      <view class="bg-white rounded-12rpx p-28rpx mx-30rpx">
         <view class="text-30rpx lh-30rpx text-#333 font-500 mb-30rpx">
           {{ t('pages-user.recharge.amount') }}
         </view>
         <view class="flex items-center bg-#F7F7F7 h-108rpx rounded-12rpx px-26rpx">
+          <text class="text-30rpx text-#333 mr-8rpx">$</text>
           <wd-input
-              v-model="amount"
+            v-model="amount"
-              :focus-when-clear="false"
+            :focus-when-clear="false"
-              :placeholder="t('pages-user.recharge.description')"
+            :placeholder="t('pages-user.recharge.description')"
-              clearable
+            clearable
-              confirm-type="search"
+            custom-class="!text-30rpx !bg-transparent flex-1"
-              custom-class="!text-30rpx !bg-transparent flex-1"
+            no-border
-              no-border
+            placeholderStyle="font-size: 30rpx;color: #999;"
-              placeholderStyle="font-size: 30rpx;color: #999;"
+            type="digit"
-              type="number"
+            use-prefix-slot
-              use-prefix-slot
+          />
-          >
-          </wd-input>
         </view>
       </view>
 
-      <view
+      <view class="bg-white rounded-12rpx p-28rpx mt-30rpx mx-30rpx">
-          @click="navigateTo('/pages-user/pages/choose-paymethod/index?hideWallet=true')"
+        <view class="text-30rpx lh-30rpx text-#333 font-500 mb-24rpx">
-          class="bg-white rounded-12rpx p-28rpx mt-30rpx flex-center-sb text-32rpx lh-32rpx font-500 text-#333"
+          {{ t('pages-user.choosePaymethod.title') }}
-      >
-        <view class="flex items-center">
-          <image
-              src="@img/chef/138.png"
-              class="w-44rpx h-44rpx mr-28rpx shrink-0"
-              mode="aspectFit"
-          />
-          <text class="">
-            {{ t('pages-user.choosePaymethod.creditCard') }}
-          </text>
         </view>
-        <view class="flex items-center">
+
-          <view class="mr-12px">
+        <view
-            <!--判断用户是否有信用卡-->
+          class="recharge-pay-option"
-            <text v-if="!payMethodOptions.cardId">{{ t("pages-user.member.creditCard") }}</text>
+          :class="{ 'recharge-pay-option--on': payMethod === PAY_METHOD_STRIPE }"
-            <text v-else>{{ payMethodOptions.cardNumber }}</text>
+          @click="selectPayMethod(PAY_METHOD_STRIPE)"
+        >
+          <view class="recharge-pay-option-dot">
+            <view v-if="payMethod === PAY_METHOD_STRIPE" class="recharge-pay-option-dot-inner" />
           </view>
+          <image src="@img/chef/138.png" class="w-44rpx h-44rpx shrink-0" mode="aspectFit" />
+          <text class="flex-1 text-30rpx text-#333">{{ t('pages-user.recharge.payMethodStripe') }}</text>
+        </view>
+
+        <view
+          v-if="payMethod === PAY_METHOD_STRIPE"
+          class="recharge-card-row"
+          @click="navigateTo('/pages-user/pages/choose-paymethod/index?hideWallet=true')"
+        >
+          <text class="text-28rpx text-#666">{{ t('pages-user.choosePaymethod.creditCard') }}</text>
+          <view class="flex items-center">
+            <text class="text-28rpx text-#333 mr-12rpx">
+              <template v-if="!cardId">{{ t('pages-user.member.creditCard') }}</template>
+              <template v-else>{{ cardNumber }}</template>
+            </text>
+            <image src="@img/chef/142.png" class="w-32rpx h-32rpx shrink-0" mode="aspectFit" />
+          </view>
+        </view>
+
+        <view
+          class="recharge-pay-option mt-20rpx"
+          :class="{ 'recharge-pay-option--on': payMethod === PAY_METHOD_ZIP }"
+          @click="selectPayMethod(PAY_METHOD_ZIP)"
+        >
+          <view class="recharge-pay-option-dot">
+            <view v-if="payMethod === PAY_METHOD_ZIP" class="recharge-pay-option-dot-inner" />
+          </view>
+          <text class="flex-1 text-30rpx text-#333">{{ t('pages-user.recharge.payMethodZip') }}</text>
+        </view>
+
+        <view v-if="payMethod === PAY_METHOD_ZIP" class="recharge-zip-block">
+          <text class="recharge-zip-hint">{{ t('pages-user.recharge.zipPayHint') }}</text>
           <image
-              src="@img/chef/142.png"
+            v-if="zellePayPath"
-              class="w-32rpx h-32rpx shrink-0"
+            :src="zellePayPath"
-              mode="aspectFit"
+            mode="aspectFit"
+            class="recharge-zip-qr"
           />
+          <view v-else class="recharge-zip-qr recharge-zip-qr--empty center text-24rpx text-#999">
+            QR
+          </view>
+          <wd-button
+            custom-class="!h-88rpx !rounded-16rpx !text-28rpx !bg-#14181B !mt-24rpx"
+            block
+            @click="openUploadVoucher"
+          >
+            {{ t('pages-user.recharge.uploadVoucher') }}
+          </wd-button>
+          <view v-if="zipPayVoucher" class="recharge-voucher-preview mt-24rpx">
+            <text class="text-26rpx text-#00A76D mb-12rpx block">{{
+              t('pages-user.recharge.voucherUploaded')
+            }}</text>
+            <image :src="zipPayVoucher" mode="aspectFill" class="recharge-voucher-img" />
+          </view>
         </view>
       </view>
     </view>
 
     <fixed-bottom-large-btn
-        :text="t('common.recharge')"
+      :text="submitting ? t('common.loading') : t('common.recharge')"
-        class="z-100"
+      class="z-100"
-        :fixed="true"
+      :fixed="true"
-        @click="handleSubmit"
+      @click="handleSubmit"
     />
+
+    <choose-image ref="voucherChooseRef" :count="1" @change="onVoucherUploaded" />
   </view>
 </template>
 
 <style>
 page {
-  background-color: #F5F5F5;
+  background-color: #f5f5f5;
 }
 </style>
+
 <style scoped lang="scss">
-:deep(.wd-input__clear) {
+.recharge-page {
-  background-color: transparent !important;
+  min-height: 100vh;
 }
 
+.recharge-page__body {
+  padding-top: 22rpx;
+}
+
+.recharge-promo-notice {
+  border-radius: 12rpx;
+  overflow: hidden;
+}
+
+:deep(.recharge-promo-notice__bar) {
+  border-radius: 12rpx;
+  font-size: 26rpx;
+  line-height: 36rpx;
+  padding: 16rpx 28rpx;
+}
+
+:deep(.recharge-promo-notice__bar .wd-notice-bar__prefix) {
+  flex-shrink: 0;
+  margin-right: 12rpx;
+  font-size: 32rpx;
+  line-height: 36rpx;
+}
+
+:deep(.recharge-promo-notice__bar .wd-notice-bar__wrap) {
+  height: 36rpx;
+  line-height: 36rpx;
+  overflow: hidden;
+}
+
+:deep(.recharge-promo-notice__bar .wd-notice-bar__content) {
+  font-size: 26rpx;
+  line-height: 36rpx;
+  white-space: nowrap;
+}
+
+.recharge-pay-option {
+  display: flex;
+  align-items: center;
+  gap: 20rpx;
+  padding: 24rpx 20rpx;
+  border-radius: 16rpx;
+  border: 2rpx solid #ebebeb;
+}
+
+.recharge-pay-option--on {
+  border-color: #14181b;
+  background: #fafafa;
+}
+
+.recharge-pay-option-dot {
+  width: 36rpx;
+  height: 36rpx;
+  border-radius: 50%;
+  border: 2rpx solid #14181b;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+}
+
+.recharge-pay-option-dot-inner {
+  width: 20rpx;
+  height: 20rpx;
+  border-radius: 50%;
+  background: #14181b;
+}
+
+.recharge-card-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-top: 16rpx;
+  margin-left: 56rpx;
+  padding: 20rpx 24rpx;
+  border-radius: 12rpx;
+  background: #f7f7f7;
+}
+
+.recharge-zip-block {
+  margin-top: 20rpx;
+  padding: 24rpx;
+  border-radius: 16rpx;
+  background: #f7f7f7;
+}
+
+.recharge-zip-hint {
+  display: block;
+  font-size: 26rpx;
+  color: #666;
+  line-height: 1.5;
+  margin-bottom: 20rpx;
+}
+
+.recharge-zip-qr {
+  width: 100%;
+  height: 420rpx;
+  border-radius: 16rpx;
+  background: #fff;
+}
+
+.recharge-zip-qr--empty {
+  height: 220rpx;
+}
+
+.recharge-voucher-preview {
+  padding-top: 8rpx;
+}
+
+.recharge-voucher-img {
+  width: 100%;
+  height: 280rpx;
+  border-radius: 12rpx;
+  background: #eee;
+}
+
+:deep(.wd-input__clear),
 :deep(.wd-input__icon) {
   background-color: transparent !important;
 }
-</style>
+</style>

src/pages-user/pages/recipe/index.vue

@@ -15,6 +15,29 @@ import {formatTimestamp, formatTimestampWithMonthName} from "@/utils/utils";
 import {useUserStore, useConfigStore} from "@/store";
 const userStore = useUserStore()
 const configStore = useConfigStore()
+
+function normalizeTimestamp(input: unknown): number | null {
+  if (input == null || input === '') return null
+  const raw = Number(input)
+  if (!Number.isFinite(raw) || raw <= 0) return null
+
+  // 10位秒级、13位毫秒级、16位微秒级都做兼容
+  if (raw < 1e11) return Math.trunc(raw * 1000)
+  if (raw > 1e14) return Math.trunc(raw / 1000)
+  return Math.trunc(raw)
+}
+
+function formatRecipeTime(value: unknown): string {
+  const ts = normalizeTimestamp(value)
+  if (!ts) return '--'
+  return formatTimestamp(ts)
+}
+
+function formatCommentTime(value: unknown): string {
+  const ts = normalizeTimestamp(value)
+  if (!ts) return '--'
+  return formatTimestampWithMonthName(ts)
+}
 // 加载状态
 const loading = ref(true);
 // 获取菜谱详情
@@ -108,7 +131,7 @@ function getCommentList() {
         user_name: userInfo.user_name, // 用户名
         user_avatar: userInfo.user_avatar, // 用户头像地址
         user_content: item.content, // 用户评论内容
-        create_time: formatTimestampWithMonthName(item.createTime), // 创建时间
+        create_time: formatCommentTime(item.createTime), // 创建时间
       }
     })
     tableTotal.value = res.total
@@ -192,7 +215,7 @@ function handleSend() {
             >{{ recipeDetail?.recipeName || '' }}</view
           >
           <view class="flex-center-sb text-28rpx text-#fff">
-            <text>{{ formatTimestamp(recipeDetail?.createTime) }}</text>
+            <text>{{ formatRecipeTime(recipeDetail?.createTime) }}</text>
             <view class="flex items-center">
               <image
                 src="@img/chef/1326.png"

src/pages-user/pages/search-address/index.vue

@@ -21,32 +21,33 @@
         </view>
       </view>
     </template>
-    <view :change:prop="mapRenderjs.searchPlace" :prop="querySearch" class="bg-#f5f5f5">
+    <view class="bg-#f5f5f5">
       <view class="px-22rpx py-20rpx">
-        <template v-if="placesLength === 0">
+        <view v-if="logicStore.searchLoading" class="center py-100rpx text-28rpx text-#9B9CA0">
-          <view class="center py-100rpx">
+          Loading...
-            <image class="w-250rpx h-250rpx" src="@img/chef/100.png"></image>
+        </view>
+
+        <template v-else-if="placesLength > 0">
+          <view class="rounded-36rpx bg-white">
+            <view
+              v-for="(item, index) in logicStore.placesList"
+              :key="(item as any).id || index"
+              :class="[index === logicStore.placesList.length - 1 ? '' : 'border-bottom']"
+              class="px-22rpx pb-30rpx pt-34rpx"
+              @click="handleClickLocation(item as AddressPlaceItem)"
+            >
+              <view class="text-#000 text-26rpx font-bold">{{ (item as any).displayName }}</view>
+              <view class="text-#9B9CA0 text-24rpx flex-center-sb">
+                <view>{{ (item as any).formattedAddress }}</view>
+              </view>
+            </view>
           </view>
         </template>
 
-        <template v-else>
+        <view v-else-if="hasSearched" class="center py-100rpx">
-          <view class="rounded-36rpx bg-white">
+          <image class="w-250rpx h-250rpx" src="@img/chef/100.png"></image>
-            <template v-for="(item,index) in logicStore.placesList" :key="index">
+        </view>
-              <view :class="[index === logicStore.placesList.length - 1 ? '' : 'border-bottom']"
-                    class="px-22rpx pb-30rpx pt-34rpx"
-                    @click="handleClickLocation(item)">
-                    <!-- <view >{{ item }}</view> -->
-                <view class="text-#000 text-26rpx font-bold">{{ item.displayName }}</view>
-                <view class="text-#9B9CA0 text-24rpx flex-center-sb">
-                  <view>{{ item.formattedAddress }}</view>
-                </view>
-              </view>
-            </template>
-          </view>
-        </template>
       </view>
-      <view id="map" :change:prop="mapRenderjs.initMap" :prop="mapDataComputed" :user-location="userLocation"
-            class="absolute left-0 bottom-0 w-0 h-0"></view>
     </view>
   </z-paging>
 </template>
@@ -54,84 +55,245 @@
 import Config from "@/config";
 import {useLogicStore} from "@/pages-user/store/logic";
 import {useUserStore} from "@/store";
-import { getCurrentInstance } from "vue";
+import {debounce} from "throttle-debounce";
 
 const {t, locale} = useI18n();
 const userStore = useUserStore()
 const logicStore = useLogicStore()
 
+export interface AddressPlaceItem {
+  id: string
+  displayName: string
+  formattedAddress: string
+  location: { lat: number; lng: number } | null
+}
+
 let openerEventChannel: any = null
 onLoad(() => {
-  // 统一通过 getOpenerEventChannel 获取导航传入的 eventChannel
   const pages = getCurrentPages() as any[]
   const page = pages[pages.length - 1]
   openerEventChannel = page?.getOpenerEventChannel?.() || null
 })
 
-// 生命周期：清空地址列表
 onMounted(() => {
   logicStore.clearPlacesList()
 })
 
-const placesLength = computed(() => {
+const placesLength = computed(() => logicStore.placesList.length)
-  return logicStore.placesList.length;
+const mapSearchKeyword = ref<string>('')
-});
+const hasSearched = ref(false)
-
-const userLocation = computed(() => ({
-  longitude: userStore.location.longitude,
-  latitude: userStore.location.latitude
-}));
 
 watch(
-    () => logicStore.searchLoading,
+  () => logicStore.searchLoading,
-    (newValue) => {
+  (loading) => {
-      if (newValue) {
+    if (loading) {
-        uni.showLoading({
+      uni.showLoading({ title: 'Loading...', mask: true })
-          title: 'Loading...',
+    } else {
-          mask: true,
+      uni.hideLoading()
-        });
+    }
-      } else {
+  },
-        uni.hideLoading();
+  { immediate: true },
-      }
+)
-    },
-    {immediate: true}
-);
 
-// 地图搜索关键词
+function resolveLanguageCode() {
-const mapSearchKeyword = ref<string>('');
+  if (locale.value === 'zh-Hans') return 'zh-CN'
-const querySearch = computed(() => {
+  if (locale.value === 'en') return 'en'
-  return {
+  return String(locale.value || 'en')
-    keyword: mapSearchKeyword.value,
+}
+
+function resolveRegionCode() {
+  return locale.value === 'zh-Hans' ? 'CN' : 'US'
+}
+
+function resolveBiasCenter() {
+  const lat = Number(userStore.location.latitude)
+  const lng = Number(userStore.location.longitude)
+  if (Number.isFinite(lat) && Number.isFinite(lng) && (lat !== 0 || lng !== 0)) {
+    return { latitude: lat, longitude: lng }
   }
+  if (locale.value === 'zh-Hans') {
+    return { latitude: 39.9042, longitude: 116.4074 }
+  }
+  return { latitude: 38.8977, longitude: -77.0365 }
+}
+
+function parsePlacesApiPlace(place: any): AddressPlaceItem | null {
+  if (!place) return null
+
+  const lat = place.location?.latitude
+  const lng = place.location?.longitude
+  const formattedAddress = String(place.formattedAddress || '').trim()
+  const displayName = String(
+    typeof place.displayName === 'string'
+      ? place.displayName
+      : place.displayName?.text || formattedAddress,
+  ).trim()
+
+  if (!displayName && !formattedAddress) return null
+
+  return {
+    id: String(place.id || ''),
+    displayName: displayName || formattedAddress,
+    formattedAddress,
+    location:
+      Number.isFinite(Number(lat)) && Number.isFinite(Number(lng))
+        ? { lat: Number(lat), lng: Number(lng) }
+        : null,
+  }
+}
+
+function parseGeocodeResult(result: any): AddressPlaceItem | null {
+  if (!result) return null
+
+  const formattedAddress = String(result.formatted_address || '').trim()
+  const lat = result.geometry?.location?.lat
+  const lng = result.geometry?.location?.lng
+  const displayName =
+    formattedAddress.split(',')[0]?.trim() || formattedAddress
+
+  if (!formattedAddress) return null
+
+  return {
+    id: String(result.place_id || ''),
+    displayName,
+    formattedAddress,
+    location:
+      Number.isFinite(Number(lat)) && Number.isFinite(Number(lng))
+        ? { lat: Number(lat), lng: Number(lng) }
+        : null,
+  }
+}
+
+function requestJson<T = any>(options: UniApp.RequestOptions) {
+  return new Promise<{ statusCode: number; data: T }>((resolve, reject) => {
+    uni.request({
+      timeout: 10000,
+      ...options,
+      success: (res) => resolve(res as any),
+      fail: reject,
+    })
+  })
+}
+
+async function searchByPlacesTextSearch(keyword: string) {
+  const languageCode = resolveLanguageCode()
+  const regionCode = resolveRegionCode()
+  const center = resolveBiasCenter()
+
+  const res = await requestJson<{ places?: any[]; error?: any }>({
+    url: 'https://places.googleapis.com/v1/places:searchText',
+    method: 'POST',
+    header: {
+      'Content-Type': 'application/json',
+      'X-Goog-Api-Key': Config.googleMapKey,
+      'X-Goog-FieldMask': 'places.id,places.displayName,places.formattedAddress,places.location',
+    },
+    data: {
+      textQuery: keyword,
+      languageCode,
+      regionCode,
+      pageSize: 20,
+      locationBias: {
+        circle: {
+          center,
+          radius: 50000,
+        },
+      },
+    },
+  })
+
+  if (res.statusCode !== 200) {
+    const message = (res.data as any)?.error?.message || `HTTP ${res.statusCode}`
+    throw new Error(message)
+  }
+
+  const places = Array.isArray(res.data?.places) ? res.data.places : []
+  return places.map(parsePlacesApiPlace).filter(Boolean) as AddressPlaceItem[]
+}
+
+async function searchByGeocodeFallback(keyword: string) {
+  const languageCode = resolveLanguageCode()
+  const regionCode = resolveRegionCode()
+  const query = encodeURIComponent(keyword)
+  const url =
+    `https://maps.googleapis.com/maps/api/geocode/json?address=${query}` +
+    `&key=${Config.googleMapKey}&language=${languageCode}&region=${regionCode}`
+
+  const res = await requestJson<{ results?: any[]; status?: string }>({
+    url,
+    method: 'GET',
+  })
+
+  if (res.statusCode !== 200 || res.data?.status !== 'OK') {
+    return []
+  }
+
+  const results = Array.isArray(res.data.results) ? res.data.results : []
+  return results.map(parseGeocodeResult).filter(Boolean) as AddressPlaceItem[]
+}
+
+async function searchPlaces(keyword: string) {
+  logicStore.searchLoading = true
+  hasSearched.value = true
+
+  try {
+    let list = await searchByPlacesTextSearch(keyword)
+
+    if (list.length === 0) {
+      list = await searchByGeocodeFallback(keyword)
+    }
+
+    logicStore.setPlacesList(list)
+  } catch (error) {
+    console.error('地址搜索失败', error)
+    try {
+      const fallback = await searchByGeocodeFallback(keyword)
+      logicStore.setPlacesList(fallback)
+    } catch (fallbackError) {
+      console.error('Geocode 回退失败', fallbackError)
+      logicStore.setPlacesList([])
+    }
+  } finally {
+    logicStore.searchLoading = false
+  }
+}
+
+const debouncedSearch = debounce(300, (keyword: string) => {
+  void searchPlaces(keyword)
 })
 
-function handleClickLocation(item: any) {
+watch(mapSearchKeyword, (keyword) => {
-  console.log('item', item)
+  const text = String(keyword || '').trim()
+  if (!text) {
+    hasSearched.value = false
+    logicStore.clearPlacesList()
+    return
+  }
+  debouncedSearch(text)
+})
+
+function handleClickLocation(item: AddressPlaceItem) {
   openerEventChannel?.emit?.('chooseAddress', item)
   uni.navigateBack()
 }
 
-// 使用当前位置
 function handleUseLocation() {
-  // 检查是否获取到了当前定位
   if (!userStore.location.longitude || !userStore.location.latitude) {
-    // 尝试再次获取定位
     uni.getLocation({
       isHighAccuracy: true,
       type: 'gcj02',
       geocode: true,
-      success: async (res) => {
+      success: (res) => {
         getCityName(res.latitude, res.longitude)
       },
-      fail: (err) => {
+      fail: () => {
         const settings = uni.getAppAuthorizeSetting()
-        console.log(settings)
         if (settings.locationAuthorized === 'denied') {
           uni.showToast({
             title: t('common.prompt.please-authorize-location-information'),
-            icon: 'none'
+            icon: 'none',
           })
-          setTimeout(()=> {
+          setTimeout(() => {
             uni.openAppAuthorizeSetting()
           })
         }
@@ -143,311 +305,75 @@ function handleUseLocation() {
       formattedAddress: userStore.location.formattedAddress || '',
       location: {
         lng: userStore.location.longitude,
-        lat: userStore.location.latitude
+        lat: userStore.location.latitude,
-      }
+      },
     })
     uni.navigateBack()
   }
 }
 
 function getCityName(latitude: number, longitude: number) {
-  const url = `https://maps.googleapis.com/maps/api/geocode/json?latlng=${latitude},${longitude}&key=${Config.googleMapKey}&language=${locale.value === 'zh-Hans' ? 'zh-CN' : locale.value}`;
+  const languageCode = resolveLanguageCode()
+  const url =
+    `https://maps.googleapis.com/maps/api/geocode/json?latlng=${latitude},${longitude}` +
+    `&key=${Config.googleMapKey}&language=${languageCode}`
 
   uni.request({
     url,
     method: 'GET',
     timeout: 10000,
     success: (res: any) => {
-      const results = res.data?.results || [];
+      const results = res.data?.results || []
-      console.log('geocode results:', results);
 
       if (!results.length) {
-        return handleFail();
+        return handleFail()
       }
 
-      const addr = results[0]; // 最高匹配度
+      const addr = results[0]
-      const components = addr.address_components || [];
+      const components = addr.address_components || []
 
-      // 提取城市名的工具函数
       const pickAddress = (types: string[]) => {
-        return components.find((item) => item.types.some((t) => types.includes(t)));
+        return components.find((item: any) => item.types.some((type: string) => types.includes(type)))
-      };
+      }
 
-      // 寻找城市名（多层兜底）
+      const cityObj =
-      let cityObj =
+        pickAddress(['locality']) ||
-          pickAddress(["locality"]) ||
+        pickAddress(['administrative_area_level_2']) ||
-          pickAddress(["administrative_area_level_2"]) ||
+        pickAddress(['administrative_area_level_1']) ||
-          pickAddress(["administrative_area_level_1"]) ||
+        pickAddress(['political'])
-          pickAddress(["political"]);
 
-      const cityName = cityObj?.long_name || null;
+      const cityName = cityObj?.long_name || null
-
+      const formattedAddress = addr.formatted_address || cityName || ''
-      // 从 Google 获取完整地址
-      const formattedAddress = addr.formatted_address || cityName || "";
-
-      console.log("city:", cityObj);
-      console.log("formattedAddress:", formattedAddress);
 
       if (!cityName) {
-        return handleFail();
+        return handleFail()
       }
 
-      // 存入 store
       userStore.location = {
         location: cityName,
         formattedAddress,
         longitude,
-        latitude
+        latitude,
-      };
+      }
 
-      // 回传上一页（eventChannel）
       openerEventChannel?.emit?.('chooseAddress', {
         displayName: cityName,
         formattedAddress,
-        location: { lng: longitude, lat: latitude }
+        location: { lng: longitude, lat: latitude },
-      });
+      })
 
-      uni.navigateBack();
+      uni.navigateBack()
     },
-
+    fail: () => handleFail(),
-    fail: () => handleFail()
+  })
-  });
 
   function handleFail() {
     uni.showToast({
       title: t('common.prompt.getLocationFailed'),
-      icon: 'none'
+      icon: 'none',
-    });
+    })
   }
 }
-
-const mapDataComputed = computed(() => {
-  return {
-    language: locale.value,
-    lng: userStore.location.longitude || 174.7633,
-    lat: userStore.location.latitude || -36.8485,
-  }
-})
-</script>
-<script lang="ts">
-import { defineComponent } from "vue";
-import { useLogicStore } from "@/pages-user/store/logic";
-
-export default defineComponent({
-  methods: {
-    onMapSearchResult(places: any) {
-      const logicStore = useLogicStore()
-      console.log(places, '接收到的搜索结果')
-
-      if (places && places.length > 0) {
-        // 保持与原先一致的解析逻辑
-        const parsedPlaces = places
-          .map((placeArray: any) => {
-            const placeData = placeArray[0]?.[0]
-            if (!placeData) return null
-
-            const placeId = placeData[1]
-            const formattedAddress = placeData[8] || ''
-            const locationArray = placeData[11]
-            const displayNameArray = placeData[27]
-
-            return {
-              id: placeId,
-              displayName: displayNameArray?.[0] || formattedAddress,
-              formattedAddress: formattedAddress,
-              location: locationArray
-                ? {
-                    lat: locationArray[0],
-                    lng: locationArray[1],
-                  }
-                : null,
-            }
-          })
-          .filter(Boolean)
-
-        console.log('解析后的地址列表', parsedPlaces)
-        logicStore.setPlacesList(parsedPlaces)
-      } else {
-        logicStore.setPlacesList([])
-      }
-    },
-    onMapNotLoaded() {
-      uni.showToast({
-        title: 'Map is not loaded yet, please wait',
-        icon: 'none',
-      })
-    },
-    onMapSearchTimeout() {
-      uni.showToast({
-        title: 'Search timeout, please try again',
-        icon: 'none',
-      })
-    },
-    onMapSearchLoading(_isLoading: boolean) {
-      // 如需联动 loading，可在此处驱动 store
-    },
-  },
-})
-</script>
-<script lang="renderjs" module="mapRenderjs">
-import {Loader} from "@googlemaps/js-api-loader"
-import * as R from 'ramda'
-import Config from '@/config'
-import {debounce} from "throttle-debounce";
-
-let map = null
-let mapLoaded = false; // 地图加载完成标志
-// @ts-ignore
-export default {
-  data() {
-    return {
-      region: "US",
-      lan: 'en',
-      google: null,
-      canvas: null,
-      center: null,
-      dotLottie: null,
-      marker: null,
-      markerViewList: [],
-      AdvancedMarkerElement: null,
-      lng: -77.0365,
-      lat: 38.8977,
-      userLocation: {
-        longitude: 0,
-        latitude: 0
-      }
-    }
-  },
-  props: {
-    userLocation: Object
-  },
-  mounted() {
-    console.log('mounted mapRenderjs')
-    mapLoaded = false; // 重置地图加载完成标志
-    // !map&&this.initMap()
-    this.searchPlace = debounce(200, this.searchPlace)
-  },
-  methods: {
-    initMap({lng, lat, language}) {
-      console.log('initMap', lng, lat)
-      console.log('当前系统语言', language)
-
-      this.lan = language === 'zh-Hans' ? 'zh-CN' : 'en'
-      this.region = language === 'zh-Hans' ? 'CN' : 'US'
-      this.lng = language === 'zh-Hans' ? 116.4074 : -77.0365
-      this.lat = language === 'zh-Hans' ? 39.9042 : 38.8977
-      console.log('当前系统语言', this.lan)
-      console.log('当前系统区域', this.region)
-
-      this.$nextTick(() => {
-        const loader = new Loader({
-          apiKey: Config.googleMapKey,
-          version: "weekly",
-          region: this.region, // 设置为美国
-          language: this.lan,
-        });
-
-
-        loader.load().then(async (google) => {
-          const {Map} = await google.maps.importLibrary("maps")
-          this.google = google
-          console.log('google', google.maps)
-          // 地图相关配置
-          // 指定自定义地图样式的 ID。
-          // center: 地图初始中心点的经纬度（lat, lng）。
-          // zoom: 地图初始缩放级别。
-          // fullscreenControl: 是否显示全屏按钮（false 表示不显示）。
-          // cameraControl: 是否显示相机控制（false 表示不显示）。
-          // disableDefaultUI: 是否禁用所有默认 UI 控件（true 表示全部禁用）。
-          // gestureHandling: 设置手势操作方式（"greedy" 表示允许所有手势操作）
-          const mapOptions = {
-            mapId: 'ff2268c265ce7a40',
-            center: {
-              lat: this.lat,
-              lng: this.lng,
-            },
-            zoom: 12,
-            fullscreenControl: false,
-            cameraControl: false,
-            disableDefaultUI: true,
-            gestureHandling: "greedy",
-          };
-
-          map = new Map(document.getElementById("map"), mapOptions);
-          mapLoaded = true; // 地图加载完成
-        });
-      })
-    },
-    async searchPlace({keyword}) {
-      console.log('搜索关键词', keyword);
-      if (!keyword) {
-        this.$ownerInstance.callMethod('onMapSearchResult', [])
-        return;
-      }
-      if (!mapLoaded) {
-        console.log('地图未加载完成，无法搜索');
-        this.$ownerInstance.callMethod('onMapNotLoaded');
-        return;
-      }
-      if (!map || !this.google) {
-        return
-      }
-      this.$ownerInstance.callMethod('onMapSearchLoading', true);
-      let timeoutId;
-      try {
-        // 设置搜索超时
-        const timeoutPromise = new Promise((_, reject) => {
-          timeoutId = setTimeout(() => {
-            this.$ownerInstance.callMethod('onMapSearchLoading', false);
-            reject(new Error('Search timeout'));
-          }, 10000); // 10 秒超时
-        });
-
-        const {Place, SearchByTextRankPreference} = await this.google.maps.importLibrary("places");
-        const request = {
-          textQuery: keyword,
-          fields: ['id', 'displayName', 'location', 'formattedAddress', 'addressComponents'],
-          locationBias: {lat: this.lat, lng: this.lng},
-          language: this.lan,
-          maxResultCount: 20,
-          region: this.region,
-          rankPreference: SearchByTextRankPreference.RELEVANCE
-        };
-
-        const searchPromise = Place.searchByText(request);
-        const {places} = await Promise.race([searchPromise, timeoutPromise]);
-        console.log('地图搜索结果原始数据', places);
-        
-        // 将 Google Places API 返回的对象转换为可序列化的数组格式
-        const serializedPlaces = places.map(place => {
-          // 提取需要的字段并转换为普通对象
-          return [[{
-            1: place.id,
-            8: place.formattedAddress || '',
-            9: place.addressComponents || [],
-            11: place.location ? [place.location.lat(), place.location.lng()] : null,
-            27: place.displayName ? [
-              typeof place.displayName === 'string' ? place.displayName : place.displayName.text,
-              place.displayName.languageCode || this.lan
-            ] : null
-          }]];
-        });
-        
-        console.log('序列化后的搜索结果', serializedPlaces);
-        this.$ownerInstance.callMethod('onMapSearchResult', serializedPlaces);
-      } catch (e) {
-        console.log('搜索错误原因', e);
-        if (e.message === 'Search timeout') {
-          this.$ownerInstance.callMethod('onMapSearchTimeout');
-        }
-        this.$ownerInstance.callMethod('onMapSearchResult', []);
-      } finally {
-        clearTimeout(timeoutId);
-        this.$ownerInstance.callMethod('onMapSearchLoading', false);
-      }
-    }
-  },
-}
 </script>
 <style>
 page {
@@ -456,4 +382,4 @@ page {
 </style>
 <style lang="scss" scoped>
 
-</style>
+</style>

src/pages-user/pages/setting/components/password-dialogs/password-dialogs.vue

@@ -0,0 +1,464 @@
+<script setup lang="ts">
+import { computed } from 'vue'
+
+type PayPwdMode = 'set' | 'change'
+
+const props = defineProps<{
+  t: (key: string) => string
+  isSend: number
+  payPwdMode: PayPwdMode
+  showLoginPwdPopup: boolean
+  showLoginPwdForgetPopup: boolean
+  showPayPwdPopup: boolean
+  showPayPwdForgetPopup: boolean
+  loginPwdForm: { oldLoginPwd: string; newLoginPwd: string; confirmPwd: string }
+  loginPwdForgetForm: { phone: string; captcha: string; newLoginPwd: string; confirmPwd: string }
+  payPwdSetForm: { phone: string; captcha: string; payPwd: string; confirmPwd: string }
+  payPwdChangeForm: { oldPayPwd: string; newPayPwd: string; confirmPwd: string }
+  payPwdForgetForm: { phone: string; captcha: string; payPwd: string; confirmPwd: string }
+}>()
+
+const emit = defineEmits<{
+  (e: 'update:showLoginPwdPopup', value: boolean): void
+  (e: 'update:showLoginPwdForgetPopup', value: boolean): void
+  (e: 'update:showPayPwdPopup', value: boolean): void
+  (e: 'update:showPayPwdForgetPopup', value: boolean): void
+  (e: 'submit-login-pwd'): void
+  (e: 'submit-login-pwd-forget'): void
+  (e: 'submit-pay-pwd-set'): void
+  (e: 'submit-pay-pwd-change'): void
+  (e: 'submit-pay-pwd-forget'): void
+  (e: 'request-login-forget-code'): void
+  (e: 'request-pay-set-code'): void
+  (e: 'request-pay-forget-code'): void
+}>()
+
+const loginPwdPopupVisible = computed({
+  get: () => props.showLoginPwdPopup,
+  set: (value: boolean) => emit('update:showLoginPwdPopup', value),
+})
+
+const loginPwdForgetPopupVisible = computed({
+  get: () => props.showLoginPwdForgetPopup,
+  set: (value: boolean) => emit('update:showLoginPwdForgetPopup', value),
+})
+
+const payPwdPopupVisible = computed({
+  get: () => props.showPayPwdPopup,
+  set: (value: boolean) => emit('update:showPayPwdPopup', value),
+})
+
+const payPwdForgetPopupVisible = computed({
+  get: () => props.showPayPwdForgetPopup,
+  set: (value: boolean) => emit('update:showPayPwdForgetPopup', value),
+})
+
+function openLoginPwdForget() {
+  emit('update:showLoginPwdPopup', false)
+  emit('update:showLoginPwdForgetPopup', true)
+}
+
+function openPayPwdForget() {
+  emit('update:showPayPwdPopup', false)
+  emit('update:showPayPwdForgetPopup', true)
+}
+</script>
+
+<template>
+  <view>
+    <wd-popup
+      v-model="loginPwdPopupVisible"
+      :close-on-click-modal="false"
+      position="bottom"
+      custom-class="ios-popup-mask"
+    >
+      <view class="ios-dialog">
+        <view class="ios-dialog__header">
+          <view class="ios-dialog__title">{{ t('navbar-change-password') }}</view>
+          <view class="ios-dialog__close" @click="emit('update:showLoginPwdPopup', false)">×</view>
+        </view>
+        <view class="ios-dialog__body">
+          <wd-input
+            v-model.trim="loginPwdForm.oldLoginPwd"
+            no-border
+            show-password
+            clearable
+            :maxlength="20"
+            :placeholder="t('pages-user.pay-password.input-placeholder.enter-old-password')"
+          />
+          <view class="ios-dialog__divider" />
+          <wd-input
+            v-model.trim="loginPwdForm.newLoginPwd"
+            no-border
+            show-password
+            clearable
+            :maxlength="16"
+            :placeholder="t('pages-user.pay-password.input-placeholder.enter-new-password')"
+          />
+          <view class="ios-dialog__divider" />
+          <wd-input
+            v-model.trim="loginPwdForm.confirmPwd"
+            no-border
+            show-password
+            clearable
+            :maxlength="16"
+            :placeholder="t('pages-user.pay-password.input-placeholder.enter-new-password-again')"
+          />
+          <view class="ios-dialog__link-row">
+            <text class="ios-dialog__link" @click="openLoginPwdForget">
+              {{ t('navbar-forget-password') }}?
+            </text>
+          </view>
+        </view>
+        <view class="ios-dialog__footer">
+          <wd-button custom-class="ios-dialog__btn ios-dialog__btn--primary" block @click="emit('submit-login-pwd')">
+            {{ t('common.confirm') }}
+          </wd-button>
+        </view>
+      </view>
+    </wd-popup>
+
+    <wd-popup
+      v-model="loginPwdForgetPopupVisible"
+      :close-on-click-modal="false"
+      position="bottom"
+      custom-class="ios-popup-mask"
+    >
+      <view class="ios-dialog">
+        <view class="ios-dialog__header">
+          <view class="ios-dialog__title">{{ t('navbar-forget-password') }}</view>
+          <view class="ios-dialog__close" @click="emit('update:showLoginPwdForgetPopup', false)">×</view>
+        </view>
+        <view class="ios-dialog__body">
+          <wd-input :model-value="loginPwdForgetForm.phone" disabled disabledColor="transparent" no-border />
+          <view class="ios-dialog__divider" />
+          <wd-input
+            v-model.trim="loginPwdForgetForm.captcha"
+            style="color:#000 !important;"
+            no-border
+            clearable
+            :maxlength="6"
+            :placeholder="t('pages-user.pay-password.input-placeholder.enter-verification-code')"
+          >
+            <template #suffix>
+              <wd-button :disabled="!!isSend" custom-class="ios-code-btn" @click="emit('request-login-forget-code')">
+                {{ isSend ? isSend + 'S' : t('common.obtain') }}
+              </wd-button>
+            </template>
+          </wd-input>
+          <view class="ios-dialog__divider" />
+          <wd-input
+            v-model.trim="loginPwdForgetForm.newLoginPwd"
+            style="color:#000 !important;"
+            no-border
+            show-password
+            clearable
+            :maxlength="20"
+            :placeholder="t('pages-user.pay-password.input-placeholder.enter-new-password')"
+          />
+          <view class="ios-dialog__divider" />
+          <wd-input
+            v-model.trim="loginPwdForgetForm.confirmPwd"
+            no-border
+            show-password
+            clearable
+            :maxlength="20"
+            :placeholder="t('pages-user.pay-password.input-placeholder.enter-new-password-again')"
+          />
+        </view>
+        <view class="ios-dialog__footer">
+          <wd-button custom-class="ios-dialog__btn ios-dialog__btn--primary" block @click="emit('submit-login-pwd-forget')">
+            {{ t('common.confirm') }}
+          </wd-button>
+        </view>
+      </view>
+    </wd-popup>
+
+    <wd-popup
+      v-model="payPwdPopupVisible"
+      :close-on-click-modal="false"
+      position="bottom"
+      custom-class="ios-popup-mask"
+    >
+      <view class="ios-dialog">
+        <view class="ios-dialog__header">
+          <view class="ios-dialog__title">
+            {{ payPwdMode === 'set' ? t('navbar-set-payment-password') : t('navbar-change-payment-password') }}
+          </view>
+          <view class="ios-dialog__close" @click="emit('update:showPayPwdPopup', false)">×</view>
+        </view>
+
+        <view class="ios-dialog__body" v-if="payPwdMode === 'set'">
+          <wd-input :model-value="payPwdSetForm.phone" disabled disabledColor="transparent" no-border />
+          <view class="ios-dialog__divider" />
+          <wd-input
+            v-model.trim="payPwdSetForm.captcha"
+            no-border
+            clearable
+            :maxlength="6"
+            :placeholder="t('pages-user.pay-password.input-placeholder.enter-verification-code')"
+          >
+            <template #suffix>
+              <wd-button :disabled="!!isSend" custom-class="ios-code-btn" @click="emit('request-pay-set-code')">
+                {{ isSend ? isSend + 'S' : t('common.obtain') }}
+              </wd-button>
+            </template>
+          </wd-input>
+          <view class="ios-dialog__divider" />
+          <wd-input
+            v-model.trim="payPwdSetForm.payPwd"
+            no-border
+            show-password
+            clearable
+            :maxlength="6"
+            :placeholder="t('pages-user.pay-password.input-placeholder.enter-new-password')"
+          />
+          <view class="ios-dialog__divider" />
+          <wd-input
+            v-model.trim="payPwdSetForm.confirmPwd"
+            no-border
+            show-password
+            clearable
+            :maxlength="6"
+            :placeholder="t('pages-user.pay-password.input-placeholder.enter-new-password-again')"
+          />
+        </view>
+
+        <view class="ios-dialog__body" v-else>
+          <wd-input
+            v-model.trim="payPwdChangeForm.oldPayPwd"
+            no-border
+            show-password
+            clearable
+            :maxlength="6"
+            :placeholder="t('pages-user.pay-password.input-placeholder.enter-old-password')"
+          />
+          <view class="ios-dialog__divider" />
+          <wd-input
+            v-model.trim="payPwdChangeForm.newPayPwd"
+            no-border
+            show-password
+            clearable
+            :maxlength="6"
+            :placeholder="t('pages-user.pay-password.input-placeholder.enter-new-password')"
+          />
+          <view class="ios-dialog__divider" />
+          <wd-input
+            v-model.trim="payPwdChangeForm.confirmPwd"
+            no-border
+            show-password
+            clearable
+            :maxlength="6"
+            :placeholder="t('pages-user.pay-password.input-placeholder.enter-new-password-again')"
+          />
+          <view class="ios-dialog__link-row">
+            <text class="ios-dialog__link" @click="openPayPwdForget">
+              {{ t('navbar-forget-password') }}?
+            </text>
+          </view>
+        </view>
+
+        <view class="ios-dialog__footer">
+          <wd-button
+            custom-class="ios-dialog__btn ios-dialog__btn--primary"
+            block
+            @click="payPwdMode === 'set' ? emit('submit-pay-pwd-set') : emit('submit-pay-pwd-change')"
+          >
+            {{ t('common.confirm') }}
+          </wd-button>
+        </view>
+      </view>
+    </wd-popup>
+
+    <wd-popup
+      v-model="payPwdForgetPopupVisible"
+      :close-on-click-modal="false"
+      position="bottom"
+      custom-class="ios-popup-mask"
+    >
+      <view class="ios-dialog">
+        <view class="ios-dialog__header">
+          <view class="ios-dialog__title">{{ t('navbar-forget-payment-password') }}</view>
+          <view class="ios-dialog__close" @click="emit('update:showPayPwdForgetPopup', false)">×</view>
+        </view>
+        <view class="ios-dialog__body">
+          <wd-input :model-value="payPwdForgetForm.phone" disabled disabledColor="transparent" no-border />
+          <view class="ios-dialog__divider" />
+          <wd-input
+            v-model.trim="payPwdForgetForm.captcha"
+            style="color:#000 !important;"
+            no-border
+            clearable
+            :maxlength="6"
+            :placeholder="t('pages-user.pay-password.input-placeholder.enter-verification-code')"
+          >
+            <template #suffix>
+              <wd-button :disabled="!!isSend" custom-class="ios-code-btn" @click="emit('request-pay-forget-code')">
+                {{ isSend ? isSend + 'S' : t('common.obtain') }}
+              </wd-button>
+            </template>
+          </wd-input>
+          <view class="ios-dialog__divider" />
+          <wd-input
+            v-model.trim="payPwdForgetForm.payPwd"
+            no-border
+            show-password
+            clearable
+            :maxlength="6"
+            :placeholder="t('pages-user.pay-password.input-placeholder.enter-new-password')"
+          />
+          <view class="ios-dialog__divider" />
+          <wd-input
+            v-model.trim="payPwdForgetForm.confirmPwd"
+            no-border
+            show-password
+            clearable
+            :maxlength="6"
+            :placeholder="t('pages-user.pay-password.input-placeholder.enter-new-password-again')"
+          />
+        </view>
+        <view class="ios-dialog__footer">
+          <wd-button custom-class="ios-dialog__btn ios-dialog__btn--primary" block @click="emit('submit-pay-pwd-forget')">
+            {{ t('common.confirm') }}
+          </wd-button>
+        </view>
+      </view>
+    </wd-popup>
+  </view>
+</template>
+
+<style scoped lang="scss">
+.ios-dialog {
+  width: 100vw;
+  max-height: 88vh;
+  background: #fff;
+  border-radius: 40rpx 40rpx 0 0;
+  overflow: hidden;
+  padding-bottom: env(safe-area-inset-bottom);
+  box-sizing: border-box;
+}
+
+.ios-dialog__header {
+  height: 96rpx;
+  padding: 0 28rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+}
+
+.ios-dialog__title {
+  text-align: center;
+  font-size: 36rpx;
+  line-height: 44rpx;
+  color: #1c1c1e;
+  font-weight: 600;
+}
+
+.ios-dialog__close {
+  position: absolute;
+  right: 28rpx;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 56rpx;
+  height: 56rpx;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 44rpx;
+  line-height: 44rpx;
+  color: #222;
+}
+
+.ios-dialog__body {
+  margin: 0 24rpx 12rpx;
+  background: #fff;
+}
+
+.ios-dialog__divider {
+  display: none;
+}
+
+.ios-dialog__link-row {
+  padding: 12rpx 8rpx 0;
+  display: flex;
+  justify-content: flex-end;
+}
+
+.ios-dialog__link {
+  font-size: 34rpx;
+  line-height: 34rpx;
+  color: #3c3c43;
+  font-weight: 500;
+}
+
+.ios-dialog__footer {
+  padding: 210rpx 24rpx 24rpx;
+}
+
+:deep(.ios-dialog__btn) {
+  height: 88rpx !important;
+  border-radius: 999rpx !important;
+  font-size: 34rpx !important;
+  font-weight: 600 !important;
+}
+
+:deep(.ios-dialog__btn--primary) {
+  background: #000 !important;
+  color: #fff !important;
+}
+
+:deep(.ios-code-btn) {
+  min-width: 92rpx !important;
+  height: 52rpx !important;
+  padding: 0 20rpx !important;
+  border-radius: 16rpx !important;
+  font-size: 26rpx !important;
+  font-weight: 400 !important;
+  line-height: 52rpx !important;
+  background: #000 !important;
+  color: #fff !important;
+  border: none !important;
+}
+
+:deep(.ios-code-btn.is-disabled) {
+  background: #8e8e93 !important;
+  color: #fff !important;
+  opacity: 1 !important;
+}
+
+:deep(.wd-input) {
+  height: 84rpx !important;
+  border: 1rpx solid #dedede !important;
+  border-radius: 24rpx !important;
+  padding: 0 24rpx !important;
+  box-sizing: border-box !important;
+  display: flex;
+  align-items: center;
+  margin-bottom: 14rpx;
+}
+
+:deep(.wd-input__inner) {
+  flex: 1;
+  min-width: 0;
+  border: none !important;
+  margin-bottom: 0 !important;
+  padding: 0 !important;
+}
+
+:deep(.wd-input__suffix) {
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+  margin-left: 12rpx;
+}
+
+:deep(.ios-popup-mask) {
+  background: transparent !important;
+}
+
+:deep(.ios-popup-mask.wd-popup--bottom) {
+  border-radius: 40rpx 40rpx 0 0 !important;
+}
+</style>

src/pages-user/pages/setting/index.vue

@@ -1,21 +1,260 @@
 <script setup lang="ts">
 import {useMessage} from "wot-design-uni";
 import {useConfigStore, useUserStore} from "@/store";
-import {conversionMobile} from "@/utils";
-import {Agreement} from "@/constant/enums";
 import ChooseLanguage from "./components/choose-language/choose-language.vue";
 import Logout from "./components/log-out/log-out.vue";
+import PasswordDialogs from "./components/password-dialogs/password-dialogs.vue";
 import Config from "@/config";
-import {appUserLogOffPost} from "@/service";
+import {appUserLogOffPost, appUserEditLoginPwdPost, appUserForgetPwdPost} from "@/service";
+import { setPayPwd, editPayPwd, forgetPayPwd } from "@/pages-user/service";
+import { SmsType } from "@/constant/enums";
+import { z } from "zod";
+import useGetMsgCode from "@/hooks/useGetMsgCode";
 
 const {t} = useI18n();
 const {locale} = useI18n();
 const userStore = useUserStore();
 const configStore = useConfigStore()
 const message = useMessage();
-const currentVersion = ref(configStore.appVersion)
 const chooseLanguageRef = ref<InstanceType<typeof ChooseLanguage>>()
 const logoutRef = ref<InstanceType<typeof Logout>>()
+const currentLanguageLabel = computed(() => (locale.value === 'en' ? 'English' : '中文'))
+const { isSend, getMsgCode } = useGetMsgCode()
+
+const showLoginPwdPopup = ref(false)
+const showLoginPwdForgetPopup = ref(false)
+const showPayPwdPopup = ref(false)
+const showPayPwdForgetPopup = ref(false)
+const payPwdMode = ref<'set' | 'change'>('set')
+
+const loginPwdForm = ref({
+  oldLoginPwd: '',
+  newLoginPwd: '',
+  confirmPwd: '',
+})
+
+const loginPwdSchema = computed(() =>
+  z
+    .object({
+      oldLoginPwd: z.string().min(1, { message: t('pages-user.pay-password.input-placeholder.enter-old-password') }),
+      newLoginPwd: z
+        .string()
+        .min(8, { message: t('pages-user.pay-password.password-length-limit') })
+        .max(16, { message: t('pages-user.pay-password.password-length-limit') }),
+      confirmPwd: z.string().min(1, { message: t('pages-user.pay-password.input-placeholder.enter-new-password-again') }),
+    })
+    .refine((data) => data.newLoginPwd === data.confirmPwd, {
+      path: ['confirmPwd'],
+      message: t('pages-user.pay-password.two-passwords-inconsistent'),
+    })
+)
+
+function validateBySchema(schema: z.ZodTypeAny, data: any) {
+  const res = schema.safeParse(data)
+  if (!res.success) {
+    const errors = res.error.flatten().fieldErrors
+    const first = Object.values(errors).find((arr) => Array.isArray(arr) && arr.length)?.[0]
+    if (first) uni.showToast({ title: String(first), icon: 'none' })
+    return false
+  }
+  return true
+}
+
+async function submitLoginPwd() {
+  if (!validateBySchema(loginPwdSchema.value, loginPwdForm.value)) return
+  await appUserEditLoginPwdPost({ body: { ...loginPwdForm.value } })
+  uni.showToast({ title: t('pages-user.password.change-password-successfully'), icon: 'none' })
+  showLoginPwdPopup.value = false
+  loginPwdForm.value = { oldLoginPwd: '', newLoginPwd: '', confirmPwd: '' }
+  setTimeout(() => {
+    userStore.clear()
+    uni.navigateTo({ url: Config.loginPath })
+  }, 1000)
+}
+
+const loginPwdForgetForm = ref({
+  areaCode: userStore.userInfo?.areaCode || '',
+  phone: userStore.userInfo?.phone || '',
+  captcha: '',
+  confirmPwd: '',
+  newLoginPwd: '',
+})
+
+const loginPwdForgetSchema = computed(() =>
+  z
+    .object({
+      captcha: z.string().min(1, { message: t('pages-user.pay-password.input-placeholder.enter-verification-code') }),
+      confirmPwd: z
+        .string()
+        .min(1, { message: t('pages-user.pay-password.input-placeholder.enter-new-password') })
+        .regex(/^\d{6}$/, { message: t('pages-user.pay-password.enter-6-digit-password') }),
+      newLoginPwd: z.string().min(1, { message: t('pages-user.pay-password.input-placeholder.enter-new-password-again') }),
+    })
+    .refine((data) => data.confirmPwd === data.newLoginPwd, {
+      path: ['newLoginPwd'],
+      message: t('pages-user.pay-password.two-passwords-inconsistent'),
+    })
+)
+
+function openLoginPwdPopup() {
+  showLoginPwdPopup.value = true
+}
+
+function openPayPwdPopup() {
+  payPwdMode.value = userStore.userInfo?.payPwd ? 'change' : 'set'
+  showPayPwdPopup.value = true
+}
+
+function requestLoginForgetCode() {
+  if (isSend.value > 0) return
+  getMsgCode({
+    type: SmsType.USER_FORGET_PASSWORD,
+    phone: loginPwdForgetForm.value.phone,
+    areaCode: loginPwdForgetForm.value.areaCode,
+  })
+}
+
+async function submitLoginPwdForget() {
+  if (!validateBySchema(loginPwdForgetSchema.value, loginPwdForgetForm.value)) return
+  await appUserForgetPwdPost({ body: { ...loginPwdForgetForm.value } })
+  uni.showToast({ title: t('pages-user.password.forget-password-successfully'), icon: 'none' })
+  await userStore.getUserInfo()
+  showLoginPwdForgetPopup.value = false
+  loginPwdForgetForm.value = {
+    areaCode: userStore.userInfo?.areaCode || '',
+    phone: userStore.userInfo?.phone || '',
+    captcha: '',
+    confirmPwd: '',
+    newLoginPwd: '',
+  }
+}
+
+const payPwdSetForm = ref({
+  areaCode: userStore.userInfo?.areaCode || '',
+  phone: userStore.userInfo?.phone || '',
+  captcha: '',
+  payPwd: '',
+  confirmPwd: '',
+})
+
+const payPwdSetSchema = computed(() =>
+  z
+    .object({
+      captcha: z.string().min(1, { message: t('pages-user.pay-password.input-placeholder.enter-verification-code') }),
+      payPwd: z
+        .string()
+        .min(1, { message: t('pages-user.pay-password.input-placeholder.enter-new-password') })
+        .regex(/^\d{6}$/, { message: t('pages-user.pay-password.enter-6-digit-password') }),
+      confirmPwd: z.string().min(1, { message: t('pages-user.pay-password.input-placeholder.enter-new-password-again') }),
+    })
+    .refine((data) => data.payPwd === data.confirmPwd, {
+      path: ['confirmPwd'],
+      message: t('pages-user.pay-password.two-passwords-inconsistent'),
+    })
+)
+
+function requestPaySetCode() {
+  if (isSend.value > 0) return
+  getMsgCode({
+    type: SmsType.USER_SET_PAYMENT_PASSWORD,
+    phone: payPwdSetForm.value.phone,
+    areaCode: payPwdSetForm.value.areaCode,
+  })
+}
+
+async function submitPayPwdSet() {
+  if (!validateBySchema(payPwdSetSchema.value, payPwdSetForm.value)) return
+  await setPayPwd(payPwdSetForm.value as any)
+  uni.showToast({ title: t('pages-user.pay-password.set-payment-password-successfully'), icon: 'none' })
+  await userStore.getUserInfo()
+  showPayPwdPopup.value = false
+  payPwdSetForm.value = {
+    areaCode: userStore.userInfo?.areaCode || '',
+    phone: userStore.userInfo?.phone || '',
+    captcha: '',
+    payPwd: '',
+    confirmPwd: '',
+  }
+}
+
+const payPwdChangeForm = ref({
+  oldPayPwd: '',
+  newPayPwd: '',
+  confirmPwd: '',
+})
+
+const payPwdChangeSchema = computed(() =>
+  z
+    .object({
+      oldPayPwd: z.string().min(1, { message: t('pages-user.pay-password.input-placeholder.enter-old-password') }),
+      newPayPwd: z
+        .string()
+        .min(1, { message: t('pages-user.pay-password.input-placeholder.enter-new-password') })
+        .regex(/^\d{6}$/, { message: t('pages-user.pay-password.enter-6-digit-password') }),
+      confirmPwd: z.string().min(1, { message: t('pages-user.pay-password.input-placeholder.enter-new-password-again') }),
+    })
+    .refine((data) => data.newPayPwd === data.confirmPwd, {
+      path: ['confirmPwd'],
+      message: t('pages-user.pay-password.two-passwords-inconsistent'),
+    })
+)
+
+async function submitPayPwdChange() {
+  if (!validateBySchema(payPwdChangeSchema.value, payPwdChangeForm.value)) return
+  await editPayPwd(payPwdChangeForm.value as any)
+  uni.showToast({ title: t('pages-user.pay-password.change-payment-password-successfully'), icon: 'none' })
+  await userStore.getUserInfo()
+  showPayPwdPopup.value = false
+  payPwdChangeForm.value = { oldPayPwd: '', newPayPwd: '', confirmPwd: '' }
+}
+
+const payPwdForgetForm = ref({
+  areaCode: userStore.userInfo?.areaCode || '',
+  phone: userStore.userInfo?.phone || '',
+  captcha: '',
+  payPwd: '',
+  confirmPwd: '',
+})
+
+const payPwdForgetSchema = computed(() =>
+  z
+    .object({
+      captcha: z.string().min(1, { message: t('pages-user.pay-password.input-placeholder.enter-verification-code') }),
+      payPwd: z
+        .string()
+        .min(1, { message: t('pages-user.pay-password.input-placeholder.enter-new-password') })
+        .regex(/^\d{6}$/, { message: t('pages-user.pay-password.enter-6-digit-password') }),
+      confirmPwd: z.string().min(1, { message: t('pages-user.pay-password.input-placeholder.enter-new-password-again') }),
+    })
+    .refine((data) => data.payPwd === data.confirmPwd, {
+      path: ['confirmPwd'],
+      message: t('pages-user.pay-password.two-passwords-inconsistent'),
+    })
+)
+
+function requestPayForgetCode() {
+  if (isSend.value > 0) return
+  getMsgCode({
+    type: SmsType.USER_FORGET_PAYMENT_PASSWORD,
+    phone: payPwdForgetForm.value.phone,
+    areaCode: payPwdForgetForm.value.areaCode,
+  })
+}
+
+async function submitPayPwdForget() {
+  if (!validateBySchema(payPwdForgetSchema.value, payPwdForgetForm.value)) return
+  await forgetPayPwd(payPwdForgetForm.value as any)
+  uni.showToast({ title: t('pages-user.pay-password.forget-payment-password-successfully'), icon: 'none' })
+  await userStore.getUserInfo()
+  showPayPwdForgetPopup.value = false
+  payPwdForgetForm.value = {
+    areaCode: userStore.userInfo?.areaCode || '',
+    phone: userStore.userInfo?.phone || '',
+    captcha: '',
+    payPwd: '',
+    confirmPwd: '',
+  }
+}
 
 function handleChooseLanguage() {
   if (chooseLanguageRef.value) {
@@ -30,10 +269,7 @@ function navigateTo(url: string) {
 
 
 function handleSetOrUpdatePassword() {
-  if (userStore.userInfo?.payPwd) {
+  openPayPwdPopup()
-    return navigateTo(`/pages-user/pages/pay-password/change/index`)
-  }
-  navigateTo(`/pages-user/pages/pay-password/set/index`)
 }
 
 function handleLogout() {
@@ -74,76 +310,160 @@ function handleLogoutAccount() {
 </script>
 
 <template>
-  <navbar :title="t('navbar-settings')"/>
+  <view class="setting-root">
-  <view class="pt-20rpx">
+    <navbar :title="t('navbar-settings')"/>
-    <view class="text-30-bold  bg-#fff">
+    <view class="setting-page">
-      <view
+      <view class="setting-card">
-          class="flex justify-between items-center border-bottom font-bold p-[40rpx+20rpx]"
+        <view
-          @click="navigateTo('/pages-user/pages/password/change/index')"
+          class="setting-row setting-row--border"
-      >
+          @click="openLoginPwdPopup"
-        <view>{{ t("pages-user.setting.modification") }}</view>
+        >
-        <image
+          <text class="setting-row__label">{{ t("pages-user.setting.modification") }}</text>
-            src="@img/chef/100202.png"
+          <image src="@img/chef/100202.png" class="setting-row__arrow"></image>
-            class="shrink-0 ml-16rpx w-22rpx h-30rpx"
+        </view>
-        ></image>
-      </view>
 
-      <view
+        <view class="setting-row" @click="handleSetOrUpdatePassword">
-          @click="
+          <text class="setting-row__label">{{ t("pages-user.setting.payPwd") }}</text>
-          handleSetOrUpdatePassword
+          <view class="setting-row__right">
-        "
+            <text class="setting-row__value">{{ t('pages.mine.set') }}</text>
-          class="flex justify-between items-center p-[40rpx+20rpx] border-bottom"
+            <image src="@img/chef/100202.png" class="setting-row__arrow"></image>
-      >
+          </view>
-        <view>{{ t("pages-user.setting.payPwd") }}</view>
-        <view class="flex items-center">
-          <text>{{ t('navbar-settings') }}</text>
-          <image
-              src="@img/chef/100202.png"
-              class="shrink-0 ml-16rpx w-22rpx h-30rpx"
-          ></image>
         </view>
       </view>
 
-      <view
+      <view class="setting-card setting-card--gap">
-          class="flex justify-between items-center p-[40rpx+20rpx] border-bottom before:!bg-common"
+        <view class="setting-row" @click="handleChooseLanguage">
-          @click="handleChooseLanguage"
+          <text class="setting-row__label">{{ t("pages-user.setting.language") }}</text>
-      >
+          <view class="setting-row__right">
-        <view>{{ t("pages-user.setting.language") }}</view>
+            <text class="setting-row__value">{{ currentLanguageLabel }}</text>
-        <view class="flex items-center">
+            <image src="@img/chef/100202.png" class="setting-row__arrow"></image>
-          <text>{{ locale === 'en' ? 'English' : '中文'}}</text>
+          </view>
-          <image
-              src="@img/chef/100202.png"
-              class="shrink-0 ml-16rpx w-22rpx h-30rpx"
-          ></image>
         </view>
       </view>
 
-      <view
+      <view class="setting-card setting-card--gap">
-          class="flex justify-between items-center font-bold p-[40rpx+20rpx]"
+        <view class="setting-row" @click="handleLogoutAccount">
-          @click="handleLogoutAccount"
+          <text class="setting-row__label setting-row__label--strong">{{ t('pages-user.setting.cancelAccount') }}</text>
-      >
+          <!-- <image src="@img/chef/100202.png" class="setting-row__arrow"></image> -->
-        <view>{{ t('pages-user.setting.cancelAccount') }}</view>
+        </view>
-        <image
+      </view>
-            src="@img/chef/100202.png"
+
-            class="shrink-0 ml-16rpx w-22rpx h-30rpx"
+      <view class="logout-actions">
-        ></image>
+        <wd-button custom-class="logout-btn" block @click="handleLogout">
+          {{ t('pages-user.setting.logout') }}
+        </wd-button>
       </view>
     </view>
 
-    <view class="px-30rpx mt-180rpx">
-      <wd-button  
-        custom-class="!h-108rpx !text-36rpx !text-white !bg-#14181B !rounded-16rpx"
-        block
-        @click="handleLogout"
-      >
-        {{ t('pages-user.setting.logout') }}
-      </wd-button>
-
-    </view>
-    
     <choose-language ref="chooseLanguageRef"/>
     <logout ref="logoutRef"/>
+    <password-dialogs
+      :t="t"
+      :is-send="isSend"
+      :pay-pwd-mode="payPwdMode"
+      :show-login-pwd-popup="showLoginPwdPopup"
+      :show-login-pwd-forget-popup="showLoginPwdForgetPopup"
+      :show-pay-pwd-popup="showPayPwdPopup"
+      :show-pay-pwd-forget-popup="showPayPwdForgetPopup"
+      :login-pwd-form="loginPwdForm"
+      :login-pwd-forget-form="loginPwdForgetForm"
+      :pay-pwd-set-form="payPwdSetForm"
+      :pay-pwd-change-form="payPwdChangeForm"
+      :pay-pwd-forget-form="payPwdForgetForm"
+      @update:show-login-pwd-popup="showLoginPwdPopup = $event"
+      @update:show-login-pwd-forget-popup="showLoginPwdForgetPopup = $event"
+      @update:show-pay-pwd-popup="showPayPwdPopup = $event"
+      @update:show-pay-pwd-forget-popup="showPayPwdForgetPopup = $event"
+      @submit-login-pwd="submitLoginPwd"
+      @submit-login-pwd-forget="submitLoginPwdForget"
+      @submit-pay-pwd-set="submitPayPwdSet"
+      @submit-pay-pwd-change="submitPayPwdChange"
+      @submit-pay-pwd-forget="submitPayPwdForget"
+      @request-login-forget-code="requestLoginForgetCode"
+      @request-pay-set-code="requestPaySetCode"
+      @request-pay-forget-code="requestPayForgetCode"
+    />
   </view>
 </template>
 
-<style scoped></style>
+<style scoped lang="scss">
+.setting-root {
+  min-height: 100vh;
+  background: #f5f5f5;
+}
+
+.setting-page {
+  padding: 20rpx 30rpx calc(160rpx + env(safe-area-inset-bottom));
+  box-sizing: border-box;
+}
+
+.setting-card {
+  background: #fff;
+  border-radius: 24rpx;
+  overflow: hidden;
+}
+
+.setting-card--gap {
+  margin-top: 24rpx;
+}
+
+.setting-row {
+  height: 102rpx;
+  padding: 0 28rpx;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+
+  &--border {
+    border-bottom: 1rpx solid #ededed;
+  }
+
+  &__label {
+    font-size: 34rpx;
+    line-height: 34rpx;
+    color: #2c2c2c;
+    // font-weight: 700;
+  }
+
+  &__label--strong {
+    width: 100%;
+    text-align: center;
+  }
+
+  &__right {
+    display: flex;
+    align-items: center;
+    gap: 12rpx;
+  }
+
+  &__value {
+    font-size: 30rpx;
+    line-height: 30rpx;
+    color: #2c2c2c;
+    // font-weight: 600;
+  }
+
+  &__arrow {
+    width: 22rpx;
+    height: 30rpx;
+    flex-shrink: 0;
+  }
+}
+
+.logout-actions {
+  position: fixed;
+  left: 30rpx;
+  right: 30rpx;
+  bottom: calc(36rpx + env(safe-area-inset-bottom));
+  z-index: 20;
+}
+
+:deep(.logout-btn) {
+  height: 108rpx !important;
+  border-radius: 22rpx !important;
+  background: #111 !important;
+  color: #fff !important;
+  font-size: 36rpx !important;
+  font-weight: 700 !important;
+}
+</style>

src/pages-user/pages/user-info/index.vue

@@ -1,14 +1,14 @@
 <script setup lang="ts">
 import Config from '@/config'
-import {useUserStore} from '@/store'
+import { useUserStore } from '@/store'
 import type chooseImageVue from '@/components/choose-image/choose-image.vue'
 import { appUserEditUserInfoPost } from '@/service'
-import {debounce} from 'throttle-debounce';
+import { debounce } from 'throttle-debounce';
-import {upload} from '@/utils/upload/alioss'
+import { upload } from '@/utils/upload/alioss'
-import {EventEnum} from "@/constant/enums";
+import { EventEnum } from "@/constant/enums";
 
 const userStore = useUserStore()
-const {t} = useI18n()
+const { t } = useI18n()
 
 
 const chooseImageRef = ref<InstanceType<typeof chooseImageVue> | null>(null)
@@ -18,16 +18,16 @@ const form = ref({
 
 
 watch(
-    () => userStore.userInfo,
+  () => userStore.userInfo,
-    (newValue) => {
+  (newValue) => {
-      console.log('userInfo', newValue)
+    console.log('userInfo', newValue)
-      form.value = {
+    form.value = {
-        avatar: newValue?.avatar || '',
+      avatar: newValue?.avatar || '',
-      }
+    }
-    },
+  },
-    {
+  {
-      deep: true,
+    deep: true,
-    },
+  },
 )
 
 async function handleCropperAvatarSuccess(avatarUrl: string) {
@@ -61,13 +61,13 @@ async function submit() {
         avatar: form.value.avatar,
       }
     })
-    await uni.showToast({title: t('common.prompt.save-successfully'), icon: 'none'})
+    await uni.showToast({ title: t('common.prompt.save-successfully'), icon: 'none' })
     await userStore.getUserInfo()
   } catch (e) {
   }
 }
 
-const handleSubmit = debounce(Config.debounceLongTime, submit, {atBegin: true})
+const handleSubmit = debounce(Config.debounceLongTime, submit, { atBegin: true })
 
 function handleAddImg() {
   chooseImageRef.value?.init()
@@ -91,7 +91,7 @@ function handlePreviewImage() {
 
 
 function navigateTo(url: string) {
-  uni.navigateTo({url})
+  uni.navigateTo({ url })
 }
 
 onLoad(async () => {
@@ -119,37 +119,31 @@ onBackPress(() => {
     </template>
   </choose-image>
   <view class="h-full flex flex-col">
-    <navbar :title="t('navbar-personal-information')"/>
+    <navbar :title="t('navbar-personal-information')" />
     <view class="bg-#fff">
       <view class="p-18rpx flex items-center justify-between border-bottom">
         <view class="shrink-0 mr-20rpx text-30rpx text-primary">{{ t('pages-user.user-info.head-portrait') }}</view>
         <view class="flex items-center" @click="handleAddImg">
           <image :src="form.avatar" class="shrink-0 w-80rpx h-80rpx rounded-full"></image>
-          <image
+          <image src="@img/chef/100202.png" class="shrink-0 ml-16rpx w-22rpx h-30rpx"></image>
-            src="@img/chef/100202.png"
-            class="shrink-0 ml-16rpx w-22rpx h-30rpx"
-        ></image>
         </view>
       </view>
       <view class="px-18rpx py-37rpx flex items-center justify-between"
-            @click="navigateTo('/pages-user/pages/edit-nickname/index')">
+        @click="navigateTo('/pages-user/pages/edit-nickname/index')">
         <view class="shrink-0 mr-20rpx text-30rpx text-primary">{{ t('pages-user.user-info.nickname') }}</view>
         <view class="flex-1 flex items-center justify-end text-30rpx text-primary">
           <text>{{ `${userStore.userInfo.firstName} ${userStore.userInfo.surname}` }}</text>
-          <image
+          <image src="@img/chef/100202.png" class="shrink-0 ml-16rpx w-22rpx h-30rpx"></image>
-            src="@img/chef/100202.png"
-            class="shrink-0 ml-16rpx w-22rpx h-30rpx"
-        ></image>
         </view>
       </view>
     </view>
 
 
-    <view class="mt-318rpx px-30rpx">
+    <view class="mt-318rpx px-30rpx" style="position: fixed; bottom: 30rpx; left: 0; right: 0; z-index: 100;">
-          <wd-button custom-class="!h-108rpx !text-36rpx font-bold !rounded-16rpx" block @click="handleSubmit">
+      <wd-button custom-class="!h-108rpx !text-36rpx font-bold !rounded-46rpx" block @click="handleSubmit">
-            {{ t('common.save') }}
+        {{ t('common.save') }}
-          </wd-button>
+      </wd-button>
-        </view>
+    </view>
   </view>
 </template>
 

src/pages-user/store/logic.ts

@@ -6,6 +6,7 @@ export const useLogicStore = defineStore('store-list-logic', () => {
     const searchLoading = ref(false)
 
     const setPlacesList = (list: any) => {
+        console.log('setPlacesList', list)
         if (Array.isArray(list)) {
             placesList.value = list
         } else {

src/pages.json

@@ -79,6 +79,27 @@
         "navigationBarTitleText": "%navbar-customer-service%",
         "navigationStyle": "default"
       }
+    },
+    {
+      "path": "pages/ai/recommend/index",
+      "style": {
+        "navigationBarTitleText": "%navbar-ai-recommend%",
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path": "pages/ai/diet-preference/index",
+      "style": {
+        "navigationBarTitleText": "%navbar-ai-diet-preference%",
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path": "pages/ai/chat/index",
+      "style": {
+        "navigationBarTitleText": "%navbar-ai-chat%",
+        "navigationStyle": "custom"
+      }
     }
   ],
   "subPackages": [
@@ -213,6 +234,9 @@
         },
         {
           "path": "pages/recharge/index"
+        },
+        {
+          "path": "pages/recharge/activity-detail"
         }
       ]
     },
@@ -229,7 +253,10 @@
           "path": "pages/store/search/result"
         },
         {
-          "path": "pages/store/dishes"
+          "path": "pages/store/dishes",
+          "style": {
+            "onReachBottomDistance": 80
+          }
         },
         {
           "path": "pages/order/checkout"
@@ -252,8 +279,26 @@
         {
           "path": "pages/dishes/index"
         },
+        {
+          "path": "pages/dishes/quick-topic",
+          "style": {
+            "onReachBottomDistance": 80
+          }
+        },
         {
           "path": "pages/home-store/index"
+        },
+        {
+          "path": "pages/energy-meal/index",
+          "style": {
+            "onReachBottomDistance": 80
+          }
+        },
+        {
+          "path": "pages/group-catering/index"
+        },
+        {
+          "path": "pages/group-catering/detail"
         }
       ]
     }

src/pages/address/index.vue

@@ -18,15 +18,17 @@ function handleClickSearch() {
       chooseAddress: (data: any) => {
         console.log('搜索的地址信息', data)
         if (data) {
+          addressStore.clearAddressInfo()
           addressStore.setAddressLocation({
             displayName: data.displayName,
             formattedAddress: data.formattedAddress,
             longitude: data.location.lng,
             latitude: data.location.lat
           })
+          addressStore.pendingIntroBuildingType = true
           setTimeout(()=> {
             uni.navigateTo({
-              url: '/pages/address/choose-type'
+              url: '/pages/address/save-address/other'
             })
           }, 300)
         }

src/pages/address/reservation-time.vue

@@ -1,75 +1,54 @@
 <script setup lang="ts">
-import {EventEnum} from "@/constant/enums";
+import { EventEnum } from "@/constant/enums";
 
 const { t } = useI18n();
 import dayjs from "dayjs";
 
-// 店铺的营业时间（示例：周一到周五营业，周六周日不营业）
-// 测试用的营业时间字符串
-// MONDAY/TUESDAY/WEDNESDAY 09:00-18:00;THURSDAY/FRIDAY 08:00-09:00; // 周一到周五9点到18点，周四到周五8点到9点
-// MONDAY/TUESDAY/WEDNESDAY 09:00-18:00;THURSDAY/FRIDAY 08:00-12:00;SATURDAY/SUNDAY 10:00-20:00 // 周六周日10点到20点
-// MONDAY/TUESDAY/WEDNESDAY 09:00-16:00
-// MONDAY 09:00-18:00;TUESDAY 09:00-10:00;WEDNESDAY 09:00-18:00;THURSDAY 09:00-18:00;FRIDAY 08:00-09:00
 const storeBusinessHours = ref('');
-// 是否仅选择日期（当前需求：只选哪一天配送，不选具体时间段）
 const onlySelectDay = ref(true);
 
-// 业务规则：只能预约周一 / 周四 / 周五
+import { parseDeliveryScheduleTimes, isDeliveryScheduleDay } from '@/utils/deliverySchedule';
-// JS 中：0-周日 1-周一 ... 4-周四 5-周五
+
-const allowedWeekdays = [1, 4, 5];
+const allowedWeekdays = ref<number[]>([]);
 const isAllowedDay = (date: Date): boolean => {
-  const dayIndex = date.getDay();
+  return isDeliveryScheduleDay(date, allowedWeekdays.value);
-  return allowedWeekdays.includes(dayIndex);
 };
 
-// 解析商家营业时间的接口
 interface BusinessHours {
-  days: string[]; // 营业的星期几
+  days: string[];
-  startTime: string; // 开始时间 HH:mm
+  startTime: string;
-  endTime: string; // 结束时间 HH:mm
+  endTime: string;
 }
 
-/**
- * 解析商家营业时间字符串
- * @param businessHoursStr 营业时间字符串，支持多种格式：
- *   - MONDAY/TUESDAY/WEDNESDAY 09:00-18:00;THURSDAY/FRIDAY/SATURDAY/SUNDAY 10:00-20:00
- *   - MONDAY/TUESDAY/WEDNESDAY 09:00-18:00
- *   - MONDAY 09:00-18:00;TUESDAY 09:00-10:00;WEDNESDAY 09:00-18:00
- * @returns 解析后的营业时间数组
- */
 const parseBusinessHours = (businessHoursStr: string): BusinessHours[] => {
   if (!businessHoursStr) return [];
 
   const businessHours: BusinessHours[] = [];
-  // 使用分号分割不同的营业时间段
   const segments = businessHoursStr.split(";");
 
   segments.forEach((segment) => {
     const trimmedSegment = segment.trim();
     if (!trimmedSegment) return;
 
-    // 使用空格分割星期几和时间
     const parts = trimmedSegment.split(" ");
     if (parts.length !== 2) return;
 
     const dayStr = parts[0].trim().toUpperCase();
     const timeStr = parts[1];
 
-    // 解析时间范围
     const timeRange = timeStr.split("-");
     if (timeRange.length !== 2) return;
 
     const startTime = timeRange[0].trim();
     const endTime = timeRange[1].trim();
 
-    // 按斜杠分割星期几，支持 MONDAY/TUESDAY/WEDNESDAY 格式
     const days = dayStr
       .split("/")
       .map((day) => day.trim())
       .filter((day) => day);
 
     businessHours.push({
-      days, // 支持多个星期几共享同一营业时间
+      days,
       startTime,
       endTime,
     });
@@ -78,17 +57,11 @@ const parseBusinessHours = (businessHoursStr: string): BusinessHours[] => {
   return businessHours;
 };
 
-/**
- * 获取指定日期的营业时间
- * @param date 日期
- * @returns 营业时间对象，如果不营业返回null
- */
 const getBusinessHoursForDate = (date: Date): BusinessHours | null => {
   if (!storeBusinessHours.value) return null;
 
   const businessHours = parseBusinessHours(storeBusinessHours.value);
 
-  // 获取星期几的英文名称（确保是大写）(不要国际化导致判断失效)
   const dayNames = [
     "SUNDAY",
     "MONDAY",
@@ -100,50 +73,34 @@ const getBusinessHoursForDate = (date: Date): BusinessHours | null => {
   ];
   const dayName = dayNames[date.getDay()];
 
-  // 查找包含当前星期几的营业时间
   return businessHours.find((hours) => hours.days.includes(dayName)) || null;
 };
 
-/**
- * 检查日期是否营业
- * @param date 日期
- * @returns 是否营业
- */
 const isDateOpen = (date: Date): boolean => {
-  if (!storeBusinessHours.value) return true; // 如果没有营业时间限制，默认营业
+  if (!storeBusinessHours.value) return true;
   return getBusinessHoursForDate(date) !== null;
 };
 
-/**
- * 检查日期是否应该显示为可选择状态（营业且有可用时间段）
- * @param date 日期
- * @returns 是否可选择
- */
 const isDateSelectable = (date: Date): boolean => {
-  // 新增：限制只能预约周一 / 周四 / 周五
   if (!isAllowedDay(date)) {
     return false;
   }
 
-  // 如果只选日期模式，营业即可选择
   if (onlySelectDay.value) {
     if (!storeBusinessHours.value) return true;
     return isDateOpen(date);
   }
 
-  // 原逻辑：需要营业且有可用时间段
+  if (!storeBusinessHours.value) return true;
-  if (!storeBusinessHours.value) return true; // 如果没有营业时间限制，默认可选择
   if (!isDateOpen(date)) return false;
   return hasAvailableTimeSlots(date);
 };
 
-// 生成未来的日期（显示所有日期，但标记营业状态）
 const dateOptions = computed(() => {
   const dates: Date[] = [];
   const today = new Date();
 
-  // 生成连续的5天日期（包括不营业的日期）
+  for (let i = 0; i < 7; i++) {
-  for (let i = 0; i < 5; i++) {
     const date = new Date(today);
     date.setDate(today.getDate() + i);
     dates.push(date);
@@ -152,10 +109,11 @@ const dateOptions = computed(() => {
   return dates;
 });
 
-// 状态管理 - 初始化为第一个营业日期
+const thisWeekDates = computed(() => dateOptions.value.slice(0, 5));
+const nextWeekDates = computed(() => dateOptions.value.slice(5, 7));
+
 const selectedDate = ref<Date>();
 
-// 检查指定时间是否在营业时间内
 const isTimeInBusinessHours = (
   hour: number,
   minute: number,
@@ -167,35 +125,28 @@ const isTimeInBusinessHours = (
   return timeStr >= businessHours.startTime && timeStr <= businessHours.endTime;
 };
 
-// 检查指定日期是否有可用时间段
 const hasAvailableTimeSlots = (date: Date): boolean => {
   const now = new Date();
   const currentHour = now.getHours();
   const currentMinute = now.getMinutes();
 
-  // 获取指定日期的营业时间
   const businessHours = getBusinessHoursForDate(date);
 
-  // 如果没有营业时间，返回false
   if (!businessHours) {
     return false;
   }
 
-  // 解析营业时间的开始和结束时间
   const [startHour, startMinute] = businessHours.startTime
     .split(":")
     .map(Number);
   const [endHour, endMinute] = businessHours.endTime.split(":").map(Number);
 
-  // 检查是否有可用时间段
   for (let hour = startHour; hour <= endHour; hour++) {
     for (let minute = 0; minute < 60; minute += 30) {
-      // 检查时间段开始时间是否在营业时间内
       if (!isTimeInBusinessHours(hour, minute, businessHours)) {
         continue;
       }
 
-      // 计算时间段结束时间
       let nextHour = hour;
       let nextMinute = minute + 30;
       if (nextMinute >= 60) {
@@ -203,7 +154,6 @@ const hasAvailableTimeSlots = (date: Date): boolean => {
         nextMinute = 0;
       }
 
-      // 检查时间段结束时间是否超出营业时间
       if (!isTimeInBusinessHours(nextHour, nextMinute, businessHours)) {
         if (
           nextHour > endHour ||
@@ -214,12 +164,10 @@ const hasAvailableTimeSlots = (date: Date): boolean => {
         }
       }
 
-      // 避免生成开始时间和结束时间相同的无效时间段
       if (hour === nextHour && minute === nextMinute) {
         continue;
       }
 
-      // 如果是今天，过滤掉已经过去的时间
       if (date.toDateString() === now.toDateString()) {
         if (
           hour < currentHour ||
@@ -229,7 +177,6 @@ const hasAvailableTimeSlots = (date: Date): boolean => {
         }
       }
 
-      // 如果能到这里，说明有可用时间段
       return true;
     }
   }
@@ -237,156 +184,77 @@ const hasAvailableTimeSlots = (date: Date): boolean => {
   return false;
 };
 
-// 初始化选中日期为第一个有可用时间段的营业日期
+const userPickedDate = ref(false);
-const initializeSelectedDate = () => {
+
-  if (onlySelectDay.value) {
+/** 从今天起查找最近可配送日（配送日 + 营业时间） */
-    // 仅选日期模式：选择第一个“允许预约且营业”的日期（或第一个允许的日期）
+const findNearestDeliverableDate = (maxDays = 30): Date | null => {
-    const firstOpen = dateOptions.value.find(
+  const today = new Date();
-      (d) => isAllowedDay(d) && isDateOpen(d)
+  today.setHours(0, 0, 0, 0);
-    );
+  for (let i = 0; i <= maxDays; i++) {
-    const firstAllowed = firstOpen || dateOptions.value.find((d) => isAllowedDay(d));
+    const d = new Date(today);
-    selectedDate.value = firstAllowed || dateOptions.value[0];
+    d.setDate(today.getDate() + i);
-    nextTick(() => updateScrollPosition());
+    if (isDateSelectable(d)) {
+      return d;
+    }
+  }
+  return null;
+};
+
+const initializeSelectedDate = (resetUserPick = false) => {
+  if (resetUserPick) {
+    userPickedDate.value = false;
+  }
+  if (userPickedDate.value) {
     return;
   }
 
-  // 非仅选日期模式：保留原逻辑
+  const nearest = findNearestDeliverableDate(30);
-  for (const date of dateOptions.value) {
+  if (nearest) {
-    if (isDateSelectable(date)) {
+    selectedDate.value = nearest;
-      selectedDate.value = date;
+    selectedTimeSlot.value = "";
-      nextTick(() => {
+    return;
-        updateScrollPosition();
-      });
-      return;
-    }
   }
 
-  const today = new Date();
+  selectedDate.value = dateOptions.value[0] ?? new Date();
-  const nextBusinessDate = findNextBusinessDate(today);
+  selectedTimeSlot.value = "";
-  if (nextBusinessDate) {
-    selectedDate.value = nextBusinessDate;
-    nextTick(() => {
-      updateScrollPosition();
-      uni.showToast({
-        title: t('pages.address.reservationTime.currentTimeExpired'),
-        icon: "none",
-        duration: 2000,
-      });
-    });
-  } else {
-    selectedDate.value = dateOptions.value[0];
-    nextTick(() => {
-      updateScrollPosition();
-    });
-  }
 };
 
-// 监听dateOptions变化，初始化选中日期
 watch(
-  dateOptions,
+  () => [...allowedWeekdays.value],
   () => {
-    if (!selectedDate.value) {
+    initializeSelectedDate();
-      initializeSelectedDate();
+  }
-    }
-  },
-  { immediate: true }
 );
 
-// 监听营业时间字符串变化，重新初始化选中日期
+watch(storeBusinessHours, () => {
-watch(
+  initializeSelectedDate();
-  storeBusinessHours,
+});
-  () => {
-    if (storeBusinessHours.value) {
-      initializeSelectedDate();
-    }
-  },
-  { immediate: true }
-);
 const selectedTimeSlot = ref<string>("");
 
-// 横向滚动距离
+const formatWeekdayCircle = (date: Date) => dayjs(date).format("dddd");
-const scrollLeft = ref<number>(0);
 
-// 计算并设置横向滚动距离
+const formatCircleSubLine = (date: Date) => {
-const updateScrollPosition = () => {
-  if (!selectedDate.value) return;
-  
-  // 找到选中日期在 dateOptions 中的索引
-  const selectedIndex = dateOptions.value.findIndex(date => 
-    dayjs(date).isSame(dayjs(selectedDate.value), 'day')
-  );
-  
-  if (selectedIndex === -1) return;
-  
-  // 每个日期卡片的宽度：240rpx + 28rpx 间距 = 268rpx
-  // 但第一个卡片没有左边距，所以需要特殊处理
-  const cardWidth = 240; // rpx
-  const cardMargin = 28; // rpx
-  
-  // 计算滚动距离，让选中的卡片尽量居中显示
-  let scrollDistance = 0;
-  if (selectedIndex > 0) {
-    // 第一个卡片没有左边距，从第二个开始每个卡片占用 240 + 28 = 268rpx
-    scrollDistance = selectedIndex * (cardWidth + cardMargin);
-    
-    // 减去一些距离让选中项更居中（可根据屏幕宽度调整）
-    scrollDistance = Math.max(0, scrollDistance - 100);
-  }
-  
-  scrollLeft.value = scrollDistance;
-};
-
-// 格式化日期显示
-const formatDateDisplay = (date: Date) => {
-  const today = dayjs();
-  const targetDate = dayjs(date);
-
-  if (targetDate.isSame(today, "day")) {
-    return "Today";
-  } else if (targetDate.isSame(today.add(1, "day"), "day")) {
-    return "Tomorrow";
-  } else {
-    // 返回星期几
-    return targetDate.format("dddd");
-  }
-};
-
-// 格式化日期为月份和日期（不包含年份），不可选择日期显示"不营业"
-const formatDateOnly = (date: Date) => {
   if (!isDateSelectable(date)) {
-    return t('pages.address.reservationTime.notAvailable')
+    return t("pages.address.reservationTime.notAvailable");
   }
-  return dayjs(date).format('MMMM D')
+  return dayjs(date).format("MM/DD");
 };
 
-/**
- * 检查时间是否在营业时间内
- * @param hour 小时
- * @param minute 分钟
- * @param businessHours 营业时间对象
- * @returns 是否在营业时间内
- */
-
-// 生成时间段选项（根据商家营业时间过滤）
 const timeSlots = computed(() => {
   const slots: string[] = [];
   const now = new Date();
   const currentHour = now.getHours();
   const currentMinute = now.getMinutes();
 
-  // 如果还没有选中日期，返回空数组
   if (!selectedDate.value) {
     return slots;
   }
 
-  // 获取选中日期的营业时间
   const businessHours = getBusinessHoursForDate(selectedDate.value);
 
-  // 如果没有营业时间限制，使用原有逻辑（0-24小时）
   if (!businessHours) {
     for (let hour = 0; hour < 24; hour++) {
       for (let minute = 0; minute < 60; minute += 30) {
-        // 如果是今天，过滤掉已经过去的时间
         if (selectedDate.value.toDateString() === now.toDateString()) {
           if (
             hour < currentHour ||
@@ -411,21 +279,17 @@ const timeSlots = computed(() => {
     return slots;
   }
 
-  // 解析营业时间的开始和结束时间
   const [startHour, startMinute] = businessHours.startTime
     .split(":")
     .map(Number);
   const [endHour, endMinute] = businessHours.endTime.split(":").map(Number);
 
-  // 生成营业时间内的时间段
   for (let hour = startHour; hour <= endHour; hour++) {
     for (let minute = 0; minute < 60; minute += 30) {
-      // 检查时间段开始时间是否在营业时间内
       if (!isTimeInBusinessHours(hour, minute, businessHours)) {
         continue;
       }
 
-      // 计算时间段结束时间
       let nextHour = hour;
       let nextMinute = minute + 30;
       if (nextMinute >= 60) {
@@ -433,9 +297,7 @@ const timeSlots = computed(() => {
         nextMinute = 0;
       }
 
-      // 检查时间段结束时间是否超出营业时间
       if (!isTimeInBusinessHours(nextHour, nextMinute, businessHours)) {
-        // 如果结束时间超出营业时间，但开始时间在营业时间内，则调整结束时间为营业结束时间
         if (
           nextHour > endHour ||
           (nextHour === endHour && nextMinute > endMinute)
@@ -445,12 +307,10 @@ const timeSlots = computed(() => {
         }
       }
 
-      // 避免生成开始时间和结束时间相同的无效时间段（如 18:00 - 18:00）
       if (hour === nextHour && minute === nextMinute) {
         continue;
       }
 
-      // 如果是今天，过滤掉已经过去的时间
       if (selectedDate.value.toDateString() === now.toDateString()) {
         if (
           hour < currentHour ||
@@ -473,11 +333,9 @@ const timeSlots = computed(() => {
   return slots;
 });
 
-// 监听时间段变化，如果当前选中日期没有可用时间段，自动选择下一个营业日期
 watch(timeSlots, (newSlots) => {
-  if (onlySelectDay.value) return; // 仅选日期模式不需要处理时间段
+  if (onlySelectDay.value) return;
   if (selectedDate.value && newSlots.length === 0) {
-    // 当前选中日期没有可用时间段，寻找下一个营业日期
     const nextBusinessDate = findNextBusinessDate(selectedDate.value);
     if (nextBusinessDate) {
       selectedDate.value = nextBusinessDate;
@@ -491,14 +349,12 @@ watch(timeSlots, (newSlots) => {
   }
 });
 
-// 寻找下一个有可用时间段的营业日期
 const findNextBusinessDate = (currentDate: Date): Date | null => {
-  const maxDays = 30; // 最多向前查找30天
+  const maxDays = 30;
   for (let i = 1; i <= maxDays; i++) {
     const nextDate = new Date(currentDate);
     nextDate.setDate(currentDate.getDate() + i);
 
-    // 检查是否在dateOptions范围内
     const isInRange = dateOptions.value.some((date) =>
       dayjs(date).isSame(dayjs(nextDate), "day")
     );
@@ -515,9 +371,7 @@ const findNextBusinessDate = (currentDate: Date): Date | null => {
   return null;
 };
 
-// 选择日期
 const selectDate = (date: Date) => {
-  // 检查日期是否可选择，如果不可选择则不允许选择
   if (!isDateSelectable(date)) {
     uni.showToast({
       title: t('pages.address.reservationTime.dateNotSelectable'),
@@ -526,19 +380,24 @@ const selectDate = (date: Date) => {
     return;
   }
 
+  userPickedDate.value = true;
   selectedDate.value = date;
-  // 选择新日期后，清空已选择的时间段
   selectedTimeSlot.value = "";
 };
 
-// 选择时间段
 const selectTimeSlot = (timeSlot: string) => {
   selectedTimeSlot.value = timeSlot;
 };
 
-// 提交预约
+const isDateSelected = (date: Date) =>
+  !!selectedDate.value && dayjs(selectedDate.value).isSame(dayjs(date), "day");
+
 const submitReservation = () => {
-  // 非仅选日期模式，需要选择时间段
+  const dateVal = selectedDate.value;
+  if (!dateVal) {
+    return;
+  }
+
   if (!onlySelectDay.value) {
     if (!selectedTimeSlot.value) {
       uni.showToast({
@@ -549,14 +408,12 @@ const submitReservation = () => {
     }
   }
 
-  // 计算开始/结束时间
+  const selectedDateDayjs = dayjs(dateVal);
-  const selectedDateDayjs = dayjs(selectedDate.value);
   let startTime: dayjs.Dayjs;
   let endTime: dayjs.Dayjs;
 
   if (onlySelectDay.value) {
-    // 仅选日期：优先使用营业时间范围；若无营业时间限制，则使用当天起止
+    const bh = getBusinessHoursForDate(dateVal);
-    const bh = getBusinessHoursForDate(selectedDate.value);
     if (bh) {
       const [startHour, startMinute] = bh.startTime.split(':').map(Number);
       const [endHour, endMinute] = bh.endTime.split(':').map(Number);
@@ -575,7 +432,6 @@ const submitReservation = () => {
       endTime = selectedDateDayjs.endOf('day');
     }
   } else {
-    // 选择了时间段：解析并生成起止时间
     const [startTimeStr, endTimeStr] = selectedTimeSlot.value.split(' - ');
     const [startHour, startMinute] = startTimeStr.split(':').map(Number);
     const [endHour, endMinute] = endTimeStr.split(':').map(Number);
@@ -592,14 +448,15 @@ const submitReservation = () => {
   }
 
   console.log("预约信息:", {
-    date: selectedDate.value,
+    date: dateVal,
     timeSlot: onlySelectDay.value ? '' : selectedTimeSlot.value,
     startTime: startTime.valueOf(),
     endTime: endTime.valueOf(),
   });
 
   uni.$emit(EventEnum.CHOOSE_APPOINTMENT_TIME, {
-    date: selectedDate.value,
+    merchantId: storeId.value,
+    date: dateVal,
     timeSlot: onlySelectDay.value ? '' : selectedTimeSlot.value,
     startTime: startTime.valueOf(),
     endTime: endTime.valueOf(),
@@ -615,63 +472,73 @@ const submitReservation = () => {
 
 const storeId = ref(null);
 
-// 页面加载时处理参数
 onLoad((options: any) => {
-  if (options.storeId) {
+  if (options.merchantId) {
+    storeId.value = options.merchantId;
+  } else if (options.storeId) {
     storeId.value = options.storeId;
   }
+  if (options.deliveryScheduleTimes) {
+    allowedWeekdays.value = parseDeliveryScheduleTimes(
+      decodeURIComponent(options.deliveryScheduleTimes)
+    );
+  }
   if (options.storeBusinessHours) {
-    storeBusinessHours.value = options.storeBusinessHours;
+    storeBusinessHours.value = decodeURIComponent(options.storeBusinessHours);
-    // 如果传递了该参数，进入仅选日期模式
     onlySelectDay.value = true;
   }
-  // 无论是否传参，统一初始化选中日期，避免首屏未选导致不显示时间段
   nextTick(() => {
-    initializeSelectedDate();
+    initializeSelectedDate(true);
   });
 });
 </script>
 
 <template>
-  <view class="">
+  <view class="reservation-time-page min-h-screen pb-180rpx">
-    <navbar />
+    <navbar
-    <view class="mt-20rpx px-30rpx text-46rpx lh-46rpx text-#333 font-bold">
+      :title="t('pages.address.reservationTime.pageTitle')"
-      {{ t("pages.address.appTime") }}
+      circle-back
-    </view>
+      custom-class="reservation-time-navbar"
-    <view class="px-30rpx pt-52rpx pb-50rpx w-screen bg-white">
+    />
-      <scroll-view class="w-full whitespace-nowrap" scroll-x="true" :scroll-left="scrollLeft">
+    <view class="reservation-time-body px-40rpx pt-40rpx">
-        <template v-for="(item, index) in dateOptions" :key="index">
+      <view class="date-section">
+        <text class="section-label">{{ t("pages.address.reservationTime.thisWeek") }}</text>
+        <view class="date-row">
           <view
-              @click="selectDate(item)"
+            v-for="(item, index) in thisWeekDates"
-              :class="[
+            :key="index"
-                index === 0 ? '' : 'ml-28rpx',
+            class="date-circle"
-                selectedDate && dayjs(selectedDate).isSame(dayjs(item), 'day')
+            :class="{
-                  ? 'border-#333'
+              'date-circle--selected': isDateSelected(item),
-                  : 'border-#D8D8D8',
+              'date-circle--disabled': !isDateSelectable(item),
-                !isDateSelectable(item)
+            }"
-                  ? 'opacity-50 cursor-not-allowed'
+            @click="selectDate(item)"
-                  : 'cursor-pointer',
-              ]"
-              class="inline-block border-solid border-1px w-240rpx h-140rpx rounded-20rpx px-32rpx py-36rpx"
           >
-            <view
+            <text class="date-circle__weekday">{{ formatWeekdayCircle(item) }}</text>
-                :class="!isDateSelectable(item) ? 'text-#999' : 'text-#333'"
+            <text class="date-circle__sub">{{ formatCircleSubLine(item) }}</text>
-                class="text-28rpx lh-28rpx mb-12rpx"
-            >
-              {{ formatDateDisplay(item) }}
-            </view>
-            <view
-                :class="!isDateSelectable(item) ? 'text-#CCC' : 'text-#7D7D7D'"
-                class="text-28rpx"
-            >
-              {{ formatDateOnly(item) }}
-            </view>
           </view>
-        </template>
+        </view>
-      </scroll-view>
+      </view>
+      <view v-if="nextWeekDates.length" class="date-section date-section--next">
+        <text class="section-label">{{ t("pages.address.reservationTime.nextWeek") }}</text>
+        <view class="date-row">
+          <view
+            v-for="(item, index) in nextWeekDates"
+            :key="index"
+            class="date-circle"
+            :class="{
+              'date-circle--selected': isDateSelected(item),
+              'date-circle--disabled': !isDateSelectable(item),
+            }"
+            @click="selectDate(item)"
+          >
+            <text class="date-circle__weekday">{{ formatWeekdayCircle(item) }}</text>
+            <text class="date-circle__sub">{{ formatCircleSubLine(item) }}</text>
+          </view>
+        </view>
+      </view>
     </view>
-    <!-- 时间段选择区域：在仅选日期模式下隐藏 -->
+    <view v-if="!onlySelectDay" class="pb-138rpx mx-40rpx bg-white rounded-24rpx overflow-hidden mt-24rpx">
-    <view v-if="!onlySelectDay" class="pb-138rpx">
       <view
         v-for="(timeSlot, index) in timeSlots"
         :key="index"
@@ -683,7 +550,6 @@ onLoad((options: any) => {
         @click="selectTimeSlot(timeSlot)"
       >
         <text class="text-32rpx font-regular">{{ timeSlot }}</text>
-        <!-- 单选按钮 -->
         <image
           :src="
             selectedTimeSlot === timeSlot
@@ -705,8 +571,91 @@ onLoad((options: any) => {
   </view>
 </template>
 
-<style>
+<style scoped lang="scss">
-page {
+.reservation-time-body {
+  box-sizing: border-box;
+}
+
+.date-section {
+  margin-bottom: 48rpx;
+
+  &--next {
+    margin-bottom: 0;
+  }
+}
+
+.section-label {
+  display: block;
+  font-size: 32rpx;
+  line-height: 44rpx;
+  color: #111;
+  font-weight: 500;
+  margin-bottom: 24rpx;
+}
+
+.date-row {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  gap: 20rpx;
+  justify-content: flex-start;
+}
+
+.date-circle {
+  width: 118rpx;
+  height: 118rpx;
+  border-radius: 50%;
   background-color: #fff;
+  box-shadow: 0 8rpx 20rpx rgba(0, 0, 0, 0.06);
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  box-sizing: border-box;
+}
+
+.date-circle__weekday {
+  font-size: 26rpx;
+  line-height: 32rpx;
+  color: #111;
+  font-weight: 500;
+}
+
+.date-circle__sub {
+  font-size: 22rpx;
+  line-height: 28rpx;
+  margin-top: 6rpx;
+  color: #111;
+  opacity: 0.88;
+}
+
+.date-circle--selected {
+  background-color: #111;
+  box-shadow: none;
+
+  .date-circle__weekday,
+  .date-circle__sub {
+    color: #fff;
+    opacity: 1;
+  }
+}
+
+.date-circle--disabled {
+  opacity: 0.45;
+}
+
+.date-circle--disabled.date-circle--selected {
+  opacity: 1;
+}
+</style>
+
+<style lang="scss">
+page {
+  background-color: #f7f7f9;
+}
+
+.reservation-time-page :deep(.reservation-time-navbar.wd-navbar) {
+  background-color: #f7f7f9 !important;
 }
 </style>

src/pages/address/save-address/apartment.vue

@@ -99,6 +99,13 @@ onLoad(()=> {
     }
   })
 })
+
+onReady(() => {
+  if (addressStore.pendingIntroBuildingType && !addressStore.addressInfo.id) {
+    buildingTypeRef.value?.openIntroSheet?.()
+  }
+})
+
 onUnload(()=> {
   if(!isSwitch.value) {
     addressStore.clearAddressInfo()
@@ -176,7 +183,11 @@ function chooseStateConfirm(data: any) {
         <view class="mb-20rpx text-36rpx lh-36rpx text-#333 font-500">{{ t('pages.address.choose-type.navTitle') }}</view>
         <view @click="openBuildingType" class="bg-#F6F6F6 rounded-16rpx px-24rpx h-98rpx flex-center-sb">
           <text class="text-30rpx lh-30rpx text-#333">
-            {{ `${t(`pages.address.choose-type.${addressStore.addressInfo.type}`)}` }}
+            {{
+              addressStore.addressInfo.type
+                ? t(`pages.address.choose-type.${addressStore.addressInfo.type}`)
+                : t('common.placeholder.pleaseSelect')
+            }}
           </text>
           <image src="@img/chef/142.png" class="w-32rpx h-32rpx shrink-0 rotate-90"></image>
         </view>

src/pages/address/save-address/components/building-type.vue

@@ -1,70 +1,228 @@
 <script setup lang="ts">
-import {UserAddressType} from "@/constant/enums";
+import { UserAddressType } from '@/constant/enums';
+import { useAddressStore } from '@/pages/address/store/address';
 
 const { t } = useI18n();
-const show = ref(false);
+const addressStore = useAddressStore();
-const value = ref('house')
 
-const emit = defineEmits(['submit'])
+/** 新地址首次进入保存页：与原先 choose-type 全页等价的介绍弹窗 */
+const showIntro = ref(false);
+/** 点击表单「建筑类型」行：原有滚轮选择器 */
+const showPicker = ref(false);
 
+const emit = defineEmits<{
+  submit: [value: string];
+}>();
+
+const typeList = computed(() => [
+  {
+    label: t('pages.address.choose-type.house'),
+    desc: t('pages.address.choose-type.houseDescription'),
+    value: UserAddressType.HOUSE,
+    icon: '/static/images/chef/147.png',
+  },
+  {
+    label: t('pages.address.choose-type.apartment'),
+    desc: t('pages.address.choose-type.apartmentDescription'),
+    value: UserAddressType.APARTMENT,
+    icon: '/static/images/chef/148.png',
+  },
+  {
+    label: t('pages.address.choose-type.office'),
+    desc: t('pages.address.choose-type.officeDescription'),
+    value: UserAddressType.OFFICE,
+    icon: '/static/images/chef/149.png',
+  },
+  {
+    label: t('pages.address.choose-type.hotel'),
+    desc: t('pages.address.choose-type.hotelDescription'),
+    value: UserAddressType.HOTEL,
+    icon: '/static/images/chef/150.png',
+  },
+  {
+    label: t('pages.address.choose-type.other'),
+    desc: t('pages.address.choose-type.otherDescription'),
+    value: UserAddressType.OTHER,
+    icon: '/static/images/chef/151.png',
+  },
+]);
+
+const columns = computed(() => [
+  { label: t('pages.address.choose-type.house'), value: UserAddressType.HOUSE },
+  { label: t('pages.address.choose-type.apartment'), value: UserAddressType.APARTMENT },
+  { label: t('pages.address.choose-type.office'), value: UserAddressType.OFFICE },
+  { label: t('pages.address.choose-type.hotel'), value: UserAddressType.HOTEL },
+  { label: t('pages.address.choose-type.other'), value: UserAddressType.OTHER },
+]);
+
+const pickerValue = ref<string>(UserAddressType.HOUSE);
+
+function routeForType(type: string): string {
+  switch (type) {
+    case UserAddressType.HOUSE:
+      return 'pages/address/save-address/house';
+    case UserAddressType.APARTMENT:
+      return 'pages/address/save-address/apartment';
+    case UserAddressType.OFFICE:
+      return 'pages/address/save-address/office';
+    case UserAddressType.HOTEL:
+      return 'pages/address/save-address/hotel';
+    case UserAddressType.OTHER:
+      return 'pages/address/save-address/other';
+    default:
+      return '';
+  }
+}
+
+function currentSaveAddressRoute(): string {
+  const pages = getCurrentPages();
+  return pages[pages.length - 1]?.route ?? '';
+}
+
+/** 点击表单行：滚轮选择器（原效果） */
 function onOpen() {
-  show.value = true;
+  pickerValue.value =
-}
+    addressStore.addressInfo.type && `${addressStore.addressInfo.type}`.length > 0
-function handleClose() {
+      ? (addressStore.addressInfo.type as string)
-  show.value = false;
+      : UserAddressType.HOUSE;
-}
+  showPicker.value = true;
-function handleSubmit() {
-  console.log('value', value.value)
-  emit('submit', value.value)
-  handleClose()
 }
 
-const columns = ref(
+function handlePickerClose() {
-    [
+  showPicker.value = false;
-      {
+}
-        label: t('pages.address.choose-type.house'),
+
-        value: UserAddressType.HOUSE,
+function handlePickerCancel() {
-      },
+  showPicker.value = false;
-      {
+}
-        label: t('pages.address.choose-type.apartment'),
+
-        value: UserAddressType.APARTMENT,
+function handlePickerConfirm() {
-      },
+  addressStore.addressInfo.type = pickerValue.value;
-      {
+  showPicker.value = false;
-        label: t('pages.address.choose-type.office'),
+  const next = routeForType(pickerValue.value);
-        value: UserAddressType.OFFICE,
+  if (next && currentSaveAddressRoute() !== next) {
-      },
+    emit('submit', pickerValue.value);
-      {
+  }
-        label: t('pages.address.choose-type.hotel'),
+}
-        value: UserAddressType.HOTEL,
+
-      },
+/** 新地址首次进入页面时由父级调用 */
-      {
+function openIntroSheet() {
-        label: t('pages.address.choose-type.other'),
+  showIntro.value = true;
-        value: UserAddressType.OTHER,
+}
-      },
+
-    ]
+function handleIntroClose() {
-)
+  showIntro.value = false;
-function onChange({picker, value, index}) {
+}
+
+/** 蒙层关闭且尚未完成选择时，与「跳过」一致 */
+function onIntroPopupClosed() {
+  if (!addressStore.pendingIntroBuildingType) return;
+  addressStore.pendingIntroBuildingType = false;
+  addressStore.addressInfo.type = UserAddressType.OTHER;
+  const next = routeForType(UserAddressType.OTHER);
+  if (next && currentSaveAddressRoute() !== next) {
+    emit('submit', UserAddressType.OTHER);
+  }
+}
+
+function chooseIntroType(item: { value: string }) {
+  addressStore.pendingIntroBuildingType = false;
+  addressStore.addressInfo.type = item.value;
+  showIntro.value = false;
+  const next = routeForType(item.value);
+  if (next && currentSaveAddressRoute() !== next) {
+    emit('submit', item.value);
+  }
+}
+
+function handleIntroSkip() {
+  addressStore.pendingIntroBuildingType = false;
+  addressStore.addressInfo.type = UserAddressType.OTHER;
+  showIntro.value = false;
+  const next = routeForType(UserAddressType.OTHER);
+  if (next && currentSaveAddressRoute() !== next) {
+    emit('submit', UserAddressType.OTHER);
+  }
 }
 
 defineExpose({
   onOpen,
+  openIntroSheet,
 });
 </script>
 
 <template>
+  <!-- 新地址首次：建筑类型介绍底部弹窗 -->
   <wd-popup
-      v-model="show"
+    v-model="showIntro"
-      position="bottom"
+    position="bottom"
-      @close="handleClose"
+    :z-index="120"
+    custom-style="background: transparent;"
+    @close="onIntroPopupClosed"
+  >
+    <view class="bg-white rounded-t-32rpx overflow-hidden pb-[calc(24rpx+env(safe-area-inset-bottom))]">
+      <view class="relative px-30rpx pt-40rpx pb-8rpx">
+        <text
+          class="absolute right-30rpx top-40rpx z-1 text-32rpx lh-32rpx text-#CE7138"
+          @click="handleIntroSkip"
+        >
+          {{ t('common.skip') }}
+        </text>
+        <view class="text-center text-36rpx lh-44rpx text-#333 font-500 pr-100rpx pl-100rpx">
+          {{ t('pages.address.choose-type.title') }}
+        </view>
+        <view class="mt-24rpx text-center text-28rpx lh-36rpx text-#666">
+          {{ t('pages.address.choose-type.description') }}
+        </view>
+      </view>
+
+      <scroll-view scroll-y class="box-border max-h-[62vh] px-30rpx pb-8rpx pt-28rpx">
+        <view
+          v-for="(item, index) in typeList"
+          :key="item.value"
+          :class="[
+            index === 0 ? '' : 'mt-28rpx',
+            item.value === addressStore.addressInfo.type
+              ? 'border-#000 border-4rpx'
+              : 'border-#DFDFDF border-2rpx',
+            'border-solid rounded-16rpx px-28rpx py-34rpx flex items-center',
+          ]"
+          @click="chooseIntroType(item)"
+        >
+          <image :src="item.icon" class="h-48rpx mr-28rpx shrink-0 w-48rpx" />
+          <view class="min-w-0 flex-1">
+            <view class="text-36rpx lh-40rpx text-#333 font-500">
+              {{ item.label }}
+            </view>
+            <view class="mt-18rpx text-28rpx lh-32rpx text-#6D6D6D">
+              {{ item.desc }}
+            </view>
+          </view>
+        </view>
+      </scroll-view>
+    </view>
+  </wd-popup>
+
+  <!-- 点击建筑类型行：原滚轮选择 -->
+  <wd-popup
+    v-model="showPicker"
+    position="bottom"
+    :z-index="121"
+    @close="handlePickerClose"
   >
     <view>
       <view class="flex-center-sb h-102rpx bg-#F7F7F7 px-30rpx">
-        <view @click="handleClose" class="text-30rpx text-#999">{{ t('common.cancel') }}</view>
+        <view class="text-30rpx text-#999" @click="handlePickerCancel">{{ t('common.cancel') }}</view>
         <view class="text-34rpx text-#333">{{ t('common.buildingType') }}</view>
-        <view @click="handleSubmit" class="text-30rpx text-#FF6106">{{ t('common.confirm') }}</view>
+        <view class="text-30rpx text-#FF6106" @click="handlePickerConfirm">{{ t('common.confirm') }}</view>
       </view>
       <view class="bg-#fff px-54rpx py-56rpx">
-        <wd-picker-view :columns="columns" v-model="value" @change="onChange" label-key="label" value-key="value" />
+        <wd-picker-view
+          :columns="columns"
+          v-model="pickerValue"
+          label-key="label"
+          value-key="value"
+        />
       </view>
     </view>
   </wd-popup>
@@ -90,4 +248,4 @@ defineExpose({
 :deep(.uni-picker-view-indicator) {
   height: 94rpx !important;
 }
-</style>
+</style>

src/pages/address/save-address/hotel.vue

@@ -98,6 +98,13 @@ onLoad(()=> {
     }
   })
 })
+
+onReady(() => {
+  if (addressStore.pendingIntroBuildingType && !addressStore.addressInfo.id) {
+    buildingTypeRef.value?.openIntroSheet?.()
+  }
+})
+
 onUnload(()=> {
   if(!isSwitch.value) {
     addressStore.clearAddressInfo()
@@ -173,7 +180,11 @@ function chooseStateConfirm(data: any) {
         <view class="mb-20rpx text-36rpx lh-36rpx text-#333 font-500">{{ t('pages.address.choose-type.navTitle') }}</view>
         <view @click="openBuildingType" class="bg-#F6F6F6 rounded-16rpx px-24rpx h-98rpx flex-center-sb">
           <text class="text-30rpx lh-30rpx text-#333">
-            {{ `${t(`pages.address.choose-type.${addressStore.addressInfo.type}`)}` }}
+            {{
+              addressStore.addressInfo.type
+                ? t(`pages.address.choose-type.${addressStore.addressInfo.type}`)
+                : t('common.placeholder.pleaseSelect')
+            }}
           </text>
           <image src="@img/chef/142.png" class="w-32rpx h-32rpx shrink-0 rotate-90"></image>
         </view>

src/pages/address/save-address/house.vue

@@ -98,6 +98,13 @@ onLoad(()=> {
     }
   })
 })
+
+onReady(() => {
+  if (addressStore.pendingIntroBuildingType && !addressStore.addressInfo.id) {
+    buildingTypeRef.value?.openIntroSheet?.()
+  }
+})
+
 onUnload(()=> {
   if(!isSwitch.value) {
     addressStore.clearAddressInfo()
@@ -173,7 +180,11 @@ function chooseStateConfirm(data: any) {
         <view class="mb-20rpx text-36rpx lh-36rpx text-#333 font-500">{{ t('pages.address.choose-type.navTitle') }}</view>
         <view @click="openBuildingType" class="bg-#F6F6F6 rounded-16rpx px-24rpx h-98rpx flex-center-sb">
           <text class="text-30rpx lh-30rpx text-#333">
-            {{ `${t(`pages.address.choose-type.${addressStore.addressInfo.type}`)}` }}
+            {{
+              addressStore.addressInfo.type
+                ? t(`pages.address.choose-type.${addressStore.addressInfo.type}`)
+                : t('common.placeholder.pleaseSelect')
+            }}
           </text>
           <image src="@img/chef/142.png" class="w-32rpx h-32rpx shrink-0 rotate-90"></image>
         </view>

src/pages/address/save-address/office.vue

@@ -98,6 +98,13 @@ onLoad(()=> {
     }
   })
 })
+
+onReady(() => {
+  if (addressStore.pendingIntroBuildingType && !addressStore.addressInfo.id) {
+    buildingTypeRef.value?.openIntroSheet?.()
+  }
+})
+
 onUnload(()=> {
   if(!isSwitch.value) {
     addressStore.clearAddressInfo()
@@ -173,7 +180,11 @@ function chooseStateConfirm(data: any) {
         <view class="mb-20rpx text-36rpx lh-36rpx text-#333 font-500">{{ t('pages.address.choose-type.navTitle') }}</view>
         <view @click="openBuildingType" class="bg-#F6F6F6 rounded-16rpx px-24rpx h-98rpx flex-center-sb">
           <text class="text-30rpx lh-30rpx text-#333">
-            {{ `${t(`pages.address.choose-type.${addressStore.addressInfo.type}`)}` }}
+            {{
+              addressStore.addressInfo.type
+                ? t(`pages.address.choose-type.${addressStore.addressInfo.type}`)
+                : t('common.placeholder.pleaseSelect')
+            }}
           </text>
           <image src="@img/chef/142.png" class="w-32rpx h-32rpx shrink-0 rotate-90"></image>
         </view>

src/pages/address/save-address/other.vue

@@ -98,6 +98,13 @@ onLoad(()=> {
     }
   })
 })
+
+onReady(() => {
+  if (addressStore.pendingIntroBuildingType && !addressStore.addressInfo.id) {
+    buildingTypeRef.value?.openIntroSheet?.()
+  }
+})
+
 onUnload(()=> {
   if(!isSwitch.value) {
     addressStore.clearAddressInfo()
@@ -173,7 +180,11 @@ function chooseStateConfirm(data: any) {
         <view class="mb-20rpx text-36rpx lh-36rpx text-#333 font-500">{{ t('pages.address.choose-type.navTitle') }}</view>
         <view @click="openBuildingType" class="bg-#F6F6F6 rounded-16rpx px-24rpx h-98rpx flex-center-sb">
           <text class="text-30rpx lh-30rpx text-#333">
-            {{ `${t(`pages.address.choose-type.${addressStore.addressInfo.type}`)}` }}
+            {{
+              addressStore.addressInfo.type
+                ? t(`pages.address.choose-type.${addressStore.addressInfo.type}`)
+                : t('common.placeholder.pleaseSelect')
+            }}
           </text>
           <image src="@img/chef/142.png" class="w-32rpx h-32rpx shrink-0 rotate-90"></image>
         </view>

src/pages/address/search-address.vue

@@ -2,7 +2,6 @@
 const { t } = useI18n();
 const keyword = ref('');
 function handleSearch(){
-  console.log("1111111111");
   
 }
 function handleClickItem(){

src/pages/address/store/address.ts

@@ -1,6 +1,9 @@
 import { defineStore } from "pinia";
 import type { UserAddressBo } from '@/service/types';
 export const useAddressStore = defineStore('store-address', () => {
+    /** 从地图搜索新增地址进入保存页时，首次需弹出建筑类型介绍层（与原先进入 choose-type 页等价） */
+    const pendingIntroBuildingType = ref(false)
+
     const addressInfo = ref<UserAddressBo>({
         type: '',
         /** 配送类型  1-亲自送达 2-放门口，默认放门口 */
@@ -57,6 +60,7 @@ export const useAddressStore = defineStore('store-address', () => {
     }
 
     function clearAddressInfo() {
+        pendingIntroBuildingType.value = false
         addressInfo.value = {
             id: '',
             type: '',
@@ -102,6 +106,7 @@ export const useAddressStore = defineStore('store-address', () => {
     return {
         addressInfo,
         addressLocation,
+        pendingIntroBuildingType,
         setAddressLocation,
         clearAddressInfo
     }

src/pages/ai/chat/components/go-cart-popup.vue

@@ -0,0 +1,112 @@
+<script setup lang="ts">
+import { computed } from 'vue'
+
+const props = withDefaults(
+  defineProps<{
+    modelValue: boolean
+    title: string
+    content: string
+    cancelText: string
+    confirmText: string
+  }>(),
+  {
+    modelValue: false,
+    title: '',
+    content: '',
+    cancelText: '',
+    confirmText: '',
+  }
+)
+
+const emit = defineEmits<{
+  (e: 'update:modelValue', value: boolean): void
+  (e: 'confirm'): void
+  (e: 'cancel'): void
+}>()
+
+const show = computed({
+  get: () => props.modelValue,
+  set: (value: boolean) => emit('update:modelValue', value),
+})
+
+function handleCancel() {
+  emit('cancel')
+}
+
+function handleConfirm() {
+  emit('confirm')
+}
+
+function handleClose() {
+  emit('cancel')
+}
+</script>
+
+<template>
+  <wd-popup v-model="show" position="center" round="true" custom-style="border-radius: 20rpx;" @close="handleClose">
+    <view class="go-cart-popup">
+      <view class="go-cart-popup__title">{{ title }}</view>
+      <view class="go-cart-popup__content">{{ content }}</view>
+      <view class="go-cart-popup__actions">
+        <button class="go-cart-popup__btn go-cart-popup__btn--ghost" @click="handleCancel">
+          {{ cancelText }}
+        </button>
+        <button class="go-cart-popup__btn go-cart-popup__btn--primary" @click="handleConfirm">
+          {{ confirmText }}
+        </button>
+      </view>
+    </view>
+  </wd-popup>
+</template>
+
+<style scoped lang="scss">
+.go-cart-popup {
+  width: 620rpx;
+  background: #fff;
+  border-radius: 20rpx;
+  padding: 36rpx 30rpx 30rpx;
+}
+
+.go-cart-popup__title {
+  font-size: 34rpx;
+  font-weight: 600;
+  color: #111;
+  text-align: center;
+}
+
+.go-cart-popup__content {
+  margin-top: 22rpx;
+  font-size: 28rpx;
+  line-height: 1.5;
+  color: #444;
+  text-align: center;
+  white-space: pre-wrap;
+}
+
+.go-cart-popup__actions {
+  margin-top: 34rpx;
+  display: flex;
+  gap: 18rpx;
+}
+
+.go-cart-popup__btn {
+  flex: 1;
+  height: 84rpx;
+  line-height: 84rpx;
+  border-radius: 14rpx;
+  font-size: 28rpx;
+  padding: 0;
+}
+
+.go-cart-popup__btn--ghost {
+  border: 1rpx solid #d7d7d7;
+  background: #fff;
+  color: #555;
+}
+
+.go-cart-popup__btn--primary {
+  border: 1rpx solid #14181b;
+  background: #14181b;
+  color: #fff;
+}
+</style>

src/pages/ai/chat/index.vue

@@ -0,0 +1,811 @@
+<script setup lang="ts">
+import { computed, onMounted, onUnmounted, ref } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { appAiChatStreamGet, appMerchantCartAddCartPost } from '@/service'
+import { useUserStore } from '@/store'
+import GoCartPopup from './components/go-cart-popup.vue'
+const { t } = useI18n()
+const userStore = useUserStore()
+
+function goPreference() {
+  const current = getCurrentPages?.().slice(-1)[0]
+  if (current?.route === 'pages/ai/diet-preference/index') return
+  uni.navigateTo({
+    url: '/pages/ai/diet-preference/index',
+  })
+}
+
+type ChatMessage = { from: 'ai' | 'me'; text: string }
+type RecommendItem = {
+  id?: string
+  name?: string
+  img?: string
+  price?: string | number
+  specId?: string
+  specPrice?: string | number
+  specMemberPrice?: string | number
+  specActualSalePrice?: string | number
+  merchantId?: string | number
+  storeId?: string | number
+  dishId?: string | number
+}
+
+const PREF_DATA_KEY = 'ai_diet_pref_data'
+const inputText = ref('')
+const defaultAiMessage = computed(() => t('pages.ai.chat.defaultMessage'))
+const messages = ref<ChatMessage[]>([
+  { from: 'ai', text: defaultAiMessage.value },
+])
+const recommendItems = ref<RecommendItem[]>([])
+const pendingRecommendItems = ref<RecommendItem[]>([])
+const addedRecommendMap = ref<Record<string, boolean>>({})
+const addingAll = ref(false)
+const addingItemKey = ref('')
+const streamTask = ref<UniApp.RequestTask | null>(null)
+const isStreaming = ref(false)
+const conversationId = ref('')
+const toolStatus = ref('')
+const thinkingStatus = ref('')
+const textQueue = ref('')
+const goCartPopupVisible = ref(false)
+const goCartPopupContent = ref('')
+let goCartPopupResolver: ((value: boolean) => void) | null = null
+let typingRafId: ReturnType<typeof setTimeout> | 0 = 0
+const TYPING_CHARS_PER_FRAME = 1
+
+function scheduleFrame(cb: () => void): ReturnType<typeof setTimeout> {
+  const raf = (globalThis as any)?.requestAnimationFrame
+  if (typeof raf === 'function') {
+    return raf(cb)
+  }
+  // App 端部分运行环境没有 requestAnimationFrame，降级为 16ms 定时器
+  return setTimeout(cb, 16)
+}
+
+function cancelFrame(id: ReturnType<typeof setTimeout> | 0) {
+  if (!id) return
+  const caf = (globalThis as any)?.cancelAnimationFrame
+  if (typeof caf === 'function') {
+    caf(id)
+    return
+  }
+  clearTimeout(id)
+}
+
+const preferenceSummary = computed(() => {
+  const data = uni.getStorageSync(PREF_DATA_KEY) || {}
+  if (!data || typeof data !== 'object') return ''
+  const keys = Object.keys(data).slice(0, 3)
+  if (!keys.length) return ''
+  return keys
+    .map((k) => {
+      const v = data[k]
+      if (Array.isArray(v)) return `${k}: ${v.join(',') || '-'}`
+      return `${k}: ${String(v ?? '-')}`
+    })
+    .join(' | ')
+})
+
+function tryParseProductLine(line: string): RecommendItem | null {
+  const trimmed = line.trim()
+  if (!trimmed.startsWith('- {')) return null
+  const jsonRaw = trimmed.replace(/^-+\s*/, '')
+  try {
+    const parsed = JSON.parse(jsonRaw)
+    if (!parsed || typeof parsed !== 'object') return null
+    return parsed as RecommendItem
+  } catch (e) {
+    return null
+  }
+}
+
+function isSummaryLine(line: string): boolean {
+  const text = line.trim()
+  return /找到\s*\d+\s*件商品.*?预估\s*[0-9.]+.*?实际\s*[0-9.]+.*?优惠\s*[0-9.]+/.test(text)
+}
+
+function splitAiTextForRender(text: string): Array<{ text: string; strong: boolean }> {
+  if (!text) return []
+  const summaryReg = /(找到\s*\d+\s*件商品.*?预估\s*[0-9.]+.*?实际\s*[0-9.]+.*?优惠\s*[0-9.]+(?:元)?)/g
+  const result: Array<{ text: string; strong: boolean }> = []
+  let lastIndex = 0
+  let match: RegExpExecArray | null = null
+  while ((match = summaryReg.exec(text)) !== null) {
+    if (match.index > lastIndex) {
+      result.push({ text: text.slice(lastIndex, match.index), strong: false })
+    }
+    result.push({ text: match[0], strong: true })
+    lastIndex = summaryReg.lastIndex
+  }
+  if (lastIndex < text.length) {
+    result.push({ text: text.slice(lastIndex), strong: false })
+  }
+  return result
+}
+
+function resolveDishId(item: RecommendItem): string {
+  const raw = item.id ?? item.dishId ?? item.specId
+  if (raw == null) return ''
+  return String(raw).trim()
+}
+
+function resolveMerchantId(item: RecommendItem): string {
+  const raw = item.merchantId ?? item.storeId
+  if (raw == null) return ''
+  return String(raw).trim()
+}
+
+function getRecommendKey(item: RecommendItem): string {
+  return `${resolveMerchantId(item)}__${resolveDishId(item)}`
+}
+
+function isRecommendAdded(item: RecommendItem): boolean {
+  return !!addedRecommendMap.value[getRecommendKey(item)]
+}
+
+function canRecommendAdd(item: RecommendItem): boolean {
+  return !!resolveDishId(item) && !!resolveMerchantId(item)
+}
+
+function hasInCart(item: RecommendItem): boolean {
+  const merchantId = resolveMerchantId(item)
+  const dishId = resolveDishId(item)
+  if (!merchantId || !dishId) return false
+  const merchants = userStore.userCartAllData as Array<any> | null
+  if (!Array.isArray(merchants)) return false
+  return merchants.some((merchant) => {
+    const mId = String(merchant?.id ?? merchant?.merchantId ?? '')
+    if (mId !== merchantId) return false
+    const list = merchant?.merchantCartVoList
+    if (!Array.isArray(list)) return false
+    return list.some((cartItem: any) => String(cartItem?.dishId ?? '') === dishId)
+  })
+}
+
+async function confirmDuplicateAdd(content: string): Promise<boolean> {
+  return new Promise((resolve) => {
+    uni.showModal({
+      title: t('pages.ai.chat.duplicateTitle'),
+      content,
+      confirmText: t('common.confirm'),
+      cancelText: t('common.cancel'),
+      success: (res) => {
+        resolve(!!res.confirm)
+      },
+      fail: () => resolve(false),
+    })
+  })
+}
+
+function handleGoCartConfirm() {
+  goCartPopupVisible.value = false
+  uni.navigateTo({
+    url: '/pages-user/pages/cart/index',
+  })
+  if (goCartPopupResolver) {
+    goCartPopupResolver(true)
+    goCartPopupResolver = null
+  }
+}
+
+function handleGoCartCancel() {
+  goCartPopupVisible.value = false
+  if (goCartPopupResolver) {
+    goCartPopupResolver(false)
+    goCartPopupResolver = null
+  }
+}
+
+async function confirmGoCart(content?: string): Promise<boolean> {
+  if (goCartPopupResolver) {
+    goCartPopupResolver(false)
+    goCartPopupResolver = null
+  }
+  goCartPopupContent.value = content || t('pages.ai.chat.goCartTip')
+  goCartPopupVisible.value = true
+  return new Promise((resolve) => {
+    goCartPopupResolver = resolve
+  })
+}
+
+function openDishDetail(item: RecommendItem) {
+  const dishId = resolveDishId(item)
+  const merchantId = resolveMerchantId(item)
+  if (!dishId || !merchantId) {
+    uni.showToast({ title: t('pages.ai.chat.missingDishNav'), icon: 'none' })
+    return
+  }
+  uni.navigateTo({
+    url: `/pages-store/pages/store/dishes?id=${dishId}&storeId=${merchantId}`,
+  })
+}
+
+async function addRecommendToCart(
+  item: RecommendItem,
+  options?: { silent?: boolean; forceDuplicate?: boolean; suppressDuplicatePrompt?: boolean }
+): Promise<boolean> {
+  if (!userStore.checkLogin()) return false
+  const key = getRecommendKey(item)
+  if (isRecommendAdded(item) && !options?.forceDuplicate) return true
+  if (addingItemKey.value === key) return false
+  const dishId = resolveDishId(item)
+  const merchantId = resolveMerchantId(item)
+  if (!dishId || !merchantId) {
+    if (!options?.silent) {
+      uni.showToast({ title: t('pages.ai.chat.missingCartArgs'), icon: 'none' })
+    }
+    return false
+  }
+  if (!options?.forceDuplicate && hasInCart(item)) {
+    if (options?.suppressDuplicatePrompt) return false
+    const ok = await confirmDuplicateAdd(t('pages.ai.chat.duplicateSingleTip'))
+    if (!ok) return false
+  }
+  try {
+    addingItemKey.value = key
+    await appMerchantCartAddCartPost({
+      body: {
+        merchantId,
+        dishId,
+        count: 1,
+        merchantCartSideDishBoList: [],
+      } as any,
+    })
+    addedRecommendMap.value[key] = true
+    if (!options?.silent) {
+      await confirmGoCart()
+    }
+    userStore.getUserCartAllData()
+    return true
+  } catch (e) {
+    return false
+  } finally {
+    if (addingItemKey.value === key) addingItemKey.value = ''
+  }
+}
+
+const allRecommendAdded = computed(() => {
+  if (!recommendItems.value.length) return false
+  return recommendItems.value.every((item) => isRecommendAdded(item))
+})
+
+const recommendCountText = computed(() => {
+  const count = recommendItems.value.length
+  return `${t('pages.ai.chat.recommendCountPrefix')}${count}${t('pages.ai.chat.recommendCountSuffix')}`
+})
+
+function duplicateBatchTipText(count: number) {
+  return `${t('pages.ai.chat.duplicateBatchTipPrefix')}${count}${t('pages.ai.chat.duplicateBatchTipSuffix')}`
+}
+
+function addAllResultText(success: number, failed: number, skipped: number) {
+  return `${t('pages.ai.chat.addAllResultPrefix')}${success}${t('pages.ai.chat.addAllResultMiddle1')}${failed}${t('pages.ai.chat.addAllResultMiddle2')}${skipped}${t('pages.ai.chat.addAllResultSuffix')}`
+}
+
+async function addAllRecommendToCart() {
+  if (!recommendItems.value.length || addingAll.value) return
+  if (!userStore.checkLogin()) return
+  const duplicateCount = recommendItems.value.filter((item) => hasInCart(item)).length
+  let allowDuplicate = false
+  if (duplicateCount > 0) {
+    allowDuplicate = await confirmDuplicateAdd(
+      duplicateBatchTipText(duplicateCount)
+    )
+  }
+  addingAll.value = true
+  let success = 0
+  let failed = 0
+  let skipped = 0
+  for (const item of recommendItems.value) {
+    if (isRecommendAdded(item)) {
+      skipped += 1
+      continue
+    }
+    if (!canRecommendAdd(item)) {
+      failed += 1
+      continue
+    }
+    const ok = await addRecommendToCart(item, {
+      silent: true,
+      forceDuplicate: allowDuplicate,
+      suppressDuplicatePrompt: true,
+    })
+    if (ok) success += 1
+    else failed += 1
+  }
+  addingAll.value = false
+  if (success > 0) {
+    await confirmGoCart(
+      `${addAllResultText(success, failed, skipped)}\n${t('pages.ai.chat.goCartTip')}`
+    )
+  } else if (failed > 0) {
+    uni.showToast({ title: t('pages.ai.chat.addAllFailed'), icon: 'none' })
+  }
+}
+
+function appendAiText(aiMessageIndex: number, text: string) {
+  if (!text) return
+  messages.value[aiMessageIndex].text += text
+}
+
+function flushTypingQueue(aiMessageIndex: number) {
+  if (typingRafId) return
+  const tick = () => {
+    if (!textQueue.value) {
+      typingRafId = 0
+      return
+    }
+    const chunk = textQueue.value.slice(0, TYPING_CHARS_PER_FRAME)
+    textQueue.value = textQueue.value.slice(TYPING_CHARS_PER_FRAME)
+    appendAiText(aiMessageIndex, chunk)
+    typingRafId = scheduleFrame(tick)
+  }
+  typingRafId = scheduleFrame(tick)
+}
+
+function handleSend() {
+  const text = inputText.value.trim()
+  if (!text || isStreaming.value) return
+  messages.value.push({ from: 'me', text })
+  messages.value.push({ from: 'ai', text: '' })
+  const aiMessageIndex = messages.value.length - 1
+  inputText.value = ''
+  isStreaming.value = true
+  toolStatus.value = ''
+  thinkingStatus.value = t('pages.ai.chat.thinking')
+  recommendItems.value = []
+  pendingRecommendItems.value = []
+  addedRecommendMap.value = {}
+  textQueue.value = ''
+  if (typingRafId) {
+    cancelFrame(typingRafId)
+    typingRafId = 0
+  }
+
+  streamTask.value = appAiChatStreamGet({
+    query: {
+      content: text,
+      conversationId: conversationId.value || undefined,
+    },
+    callbacks: {
+      onStart(payload) {
+        if (payload?.conversationId) {
+          conversationId.value = String(payload.conversationId)
+        }
+      },
+      onTool(payload) {
+        const tool = String(payload?.tool || '')
+        const size = payload?.size != null ? String(payload.size) : ''
+        toolStatus.value = tool
+          ? `${t('pages.ai.chat.toolStatusWithSizePrefix')}${tool}${t('pages.ai.chat.toolStatusWithSizeMiddle')}${size || '-'}${t('pages.ai.chat.toolStatusWithSizeSuffix')}`
+          : t('pages.ai.chat.searchingGoods')
+        thinkingStatus.value = t('pages.ai.chat.thinkingSearching')
+      },
+      onChunk(payload) {
+        if (payload?.conversationId) {
+          conversationId.value = String(payload.conversationId)
+        }
+        const chunkText = String(payload?.text || '')
+        if (!chunkText) return
+
+        let plainText = ''
+        chunkText.split('\n').forEach((line) => {
+          if (!line.trim()) return
+          if (isSummaryLine(line)) {
+            plainText += (plainText ? '\n' : '') + line
+            return
+          }
+          const lineProduct = tryParseProductLine(line)
+          if (lineProduct) {
+            pendingRecommendItems.value.push(lineProduct)
+            return
+          }
+          plainText += (plainText ? '\n' : '') + line
+        })
+        if (plainText) textQueue.value += plainText
+        flushTypingQueue(aiMessageIndex)
+      },
+      onEnd() {
+        toolStatus.value = ''
+        thinkingStatus.value = ''
+        const finalize = () => {
+          if (pendingRecommendItems.value.length > 0) {
+            recommendItems.value = [...pendingRecommendItems.value]
+            pendingRecommendItems.value = []
+            addedRecommendMap.value = {}
+          }
+          if (!messages.value[aiMessageIndex].text.trim() && recommendItems.value.length === 0) {
+            messages.value[aiMessageIndex].text = t('pages.ai.chat.emptyResult')
+          }
+          isStreaming.value = false
+          streamTask.value = null
+        }
+        if (textQueue.value) {
+          const waitDone = () => {
+            if (textQueue.value) {
+              scheduleFrame(waitDone)
+              return
+            }
+            finalize()
+          }
+          scheduleFrame(waitDone)
+        } else {
+          finalize()
+        }
+      },
+      onError() {
+        toolStatus.value = ''
+        thinkingStatus.value = ''
+        textQueue.value = ''
+        pendingRecommendItems.value = []
+        if (typingRafId) {
+          cancelFrame(typingRafId)
+          typingRafId = 0
+        }
+        if (!messages.value[aiMessageIndex].text.trim()) {
+          messages.value[aiMessageIndex].text = t('pages.ai.chat.requestFailed')
+        }
+        isStreaming.value = false
+        streamTask.value = null
+      },
+      // fallback: non-chunk response still rendered
+      onToken(token) {
+        textQueue.value += token
+        flushTypingQueue(aiMessageIndex)
+      },
+    },
+  })
+}
+
+onUnmounted(() => {
+  if (goCartPopupResolver) {
+    goCartPopupResolver(false)
+    goCartPopupResolver = null
+  }
+  if (streamTask.value && typeof streamTask.value.abort === 'function') {
+    streamTask.value.abort()
+  }
+  textQueue.value = ''
+  pendingRecommendItems.value = []
+  if (typingRafId) {
+    cancelFrame(typingRafId)
+    typingRafId = 0
+  }
+})
+</script>
+
+<template>
+  <view class="page">
+    <navbar :title="t('navbar-ai-chat')">
+      <template #right>
+        <!-- <view class="nav-action" @click="goPreference">
+          {{ t('common.go-to-settings') }}
+        </view> -->
+        <image src="/static/app/images/gengduo.png" class="w-44rpx h-44rpx ml-8rpx shrink-0"  @click="goPreference"></image>
+      </template>
+    </navbar>
+    <!-- <view class="header">
+      <text class="title">{{ t('pages.ai.chat.title') }}</text>
+      <text v-if="preferenceSummary" class="pref">{{ preferenceSummary }}</text>
+    </view> -->
+
+    <view class="chat">
+      <view v-for="(m, idx) in messages" :key="idx" class="bubble-row" :class="m.from === 'me' ? 'row-me' : 'row-ai'">
+        <view class="bubble" :class="m.from === 'me' ? 'bubble-me' : 'bubble-ai'">
+          <text v-if="m.from === 'me'" class="bubble-text">{{ m.text }}</text>
+          <text v-else class="bubble-text">
+            <text
+              v-for="(seg, sIdx) in splitAiTextForRender(m.text)"
+              :key="`${idx}-${sIdx}`"
+              :class="seg.strong ? 'bubble-strong' : ''"
+            >{{ seg.text }}</text>
+          </text>
+        </view>
+      </view>
+
+      <view v-if="thinkingStatus" class="thinking-status">
+        <text class="thinking-dot"></text>
+        <text class="thinking-text">{{ thinkingStatus }}</text>
+      </view>
+      <view v-if="toolStatus" class="tool-status">{{ toolStatus }}</view>
+
+      <view v-if="recommendItems.length > 0" class="product-card">
+        <view class="product-card__top">
+          <text class="price">{{ recommendCountText }}</text>
+          <text class="label">{{ t('pages.ai.chat.recommendSource') }}</text>
+        </view>
+        <view class="product-list">
+          <view class="product-item" v-for="(item, i) in recommendItems" :key="item.specId || item.id || i" @click="openDishDetail(item)">
+            <image class="thumb" mode="aspectFill" :src="item.img || ''" />
+            <view class="meta">
+              <text class="name">{{ item.name || t('pages.ai.chat.unnamed') }}</text>
+              <text class="money">$ {{ item.specActualSalePrice || item.price || '-' }}</text>
+            </view>
+            <button
+              class="add-one-btn"
+              :class="{ 'add-one-btn--added': isRecommendAdded(item) }"
+              :disabled="isRecommendAdded(item)"
+              @click.stop="addRecommendToCart(item)"
+            >
+              {{ isRecommendAdded(item) ? t('pages.ai.chat.added') : t('pages.ai.chat.quickAdd') }}
+            </button>
+          </view>
+        </view>
+        <button class="btn" :disabled="addingAll || allRecommendAdded" @click="addAllRecommendToCart">
+          {{ addingAll ? t('pages.ai.chat.addingAll') : (allRecommendAdded ? t('pages.ai.chat.allAdded') : t('pages.ai.chat.addAll')) }}
+        </button>
+      </view>
+    </view>
+
+    <view class="composer">
+      <input
+        v-model="inputText"
+        class="input"
+        :placeholder="t('pages.ai.chat.inputPlaceholder')"
+      />
+      <button class="send" :disabled="isStreaming" @click="handleSend">
+        {{ isStreaming ? t('pages.ai.chat.generating') : t('common.send') }}
+      </button>
+    </view>
+    <go-cart-popup
+      v-model="goCartPopupVisible"
+      :content="goCartPopupContent"
+      :title="t('pages.ai.chat.goCartTitle')"
+      :cancel-text="t('pages.ai.chat.goCartLater')"
+      :confirm-text="t('pages.ai.chat.goCartNow')"
+      @confirm="handleGoCartConfirm"
+      @cancel="handleGoCartCancel"
+    />
+  </view>
+</template>
+
+<style scoped lang="scss">
+.page {
+  background: #f2f2f2;
+  min-height: 100vh;
+  // padding: 24rpx;
+  padding-bottom: calc(180rpx + env(safe-area-inset-bottom, 0px));
+}
+
+.header {
+  margin-bottom: 18rpx;
+}
+
+.title {
+  font-size: 36rpx;
+  font-weight: 700;
+  color: #111;
+  display: block;
+}
+
+.pref {
+  margin-top: 10rpx;
+  font-size: 24rpx;
+  color: #888;
+  display: block;
+}
+
+.chat {
+  // background: #fff;
+  border-radius: 20rpx;
+  padding:24rpx;
+  // padding: 18rpx;
+  // box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.04);
+}
+
+.bubble-row {
+  display: flex;
+  margin-bottom: 16rpx;
+}
+
+.row-ai {
+  justify-content: flex-start;
+}
+
+.row-me {
+  justify-content: flex-end;
+}
+
+.bubble {
+  max-width: 78%;
+  padding: 14rpx 18rpx;
+  border-radius: 16rpx;
+}
+
+.bubble-ai {
+  background: #ffffff;
+  color: #14181b;
+  border-radius: 0 16rpx 16rpx 16rpx;
+}
+
+.bubble-me {
+  background: #14181b;
+  color: #ffffff;
+  border-radius: 16rpx 0 16rpx 16rpx;
+}
+
+.bubble-text {
+  font-size: 26rpx;
+  line-height: 1.4;
+  white-space: pre-wrap;
+}
+
+.bubble-strong {
+  font-weight: 700;
+  color: #b03d15;
+}
+
+.product-card {
+  margin-top: 10rpx;
+  border-radius: 16rpx;
+  border: 1rpx solid #f1f1f1;
+  padding: 16rpx;
+  background: #fafafa;
+}
+
+.product-card__top {
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
+  margin-bottom: 12rpx;
+}
+
+.price {
+  color: #e23636;
+  font-size: 32rpx;
+  font-weight: 700;
+}
+
+.label {
+  color: #14181b;
+  font-size: 24rpx;
+  background: #e9eef6;
+  padding: 6rpx 14rpx;
+  border-radius: 999rpx;
+}
+
+.product-list {
+  display: flex;
+  flex-direction: column;
+  gap: 12rpx;
+}
+
+.product-item {
+  display: flex;
+  gap: 12rpx;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.thumb {
+  width: 88rpx;
+  height: 72rpx;
+  border-radius: 12rpx;
+  background: #f0f0f0;
+}
+
+.meta {
+  display: flex;
+  flex-direction: column;
+  gap: 6rpx;
+  flex: 1;
+  min-width: 0;
+}
+
+.name {
+  font-size: 24rpx;
+  color: #111;
+  line-height: 1.35;
+}
+
+.money {
+  font-size: 24rpx;
+  color: #e23636;
+  font-weight: 600;
+}
+
+.add-one-btn {
+  width: 128rpx;
+  height: 56rpx;
+  line-height: 56rpx;
+  border-radius: 999rpx;
+  border: 1rpx solid #14181b;
+  background: #fff;
+  color: #14181b;
+  font-size: 22rpx;
+  padding: 0;
+}
+
+.add-one-btn--added {
+  border-color: #9aa5b1;
+  color: #9aa5b1;
+  background: #f6f8fa;
+}
+
+.btn {
+  margin-top: 14rpx;
+  border-radius: 16rpx;
+  background: #14181b;
+  color: #fff;
+  font-size: 26rpx;
+}
+
+.composer {
+  position: fixed;
+  // left: 24rpx;
+  // right: 24rpx;
+  bottom: 0;
+  background: #fff;
+  // border-radius: 20rpx;
+  width: 100%;
+  padding: 24rpx 24rpx calc(52rpx + env(safe-area-inset-bottom, 0px));
+  display: flex;
+  gap: 12rpx;
+  align-items: center;
+  box-shadow: 0 10rpx 30rpx rgba(0, 0, 0, 0.06);
+}
+
+.input {
+  flex: 1;
+  font-size: 26rpx;
+  background: #f7f7f7;
+  padding: 12rpx 14rpx;
+  border-radius: 14rpx;
+}
+
+.send {
+  width: 160rpx;
+  border-radius: 16rpx;
+  background: #14181b;
+  color: #fff;
+  font-size: 26rpx;
+  padding: 12rpx 0;
+}
+
+.tool-status {
+  margin-top: 8rpx;
+  margin-bottom: 8rpx;
+  font-size: 22rpx;
+  color: #4f667e;
+  background: #eef3fb;
+  border-radius: 999rpx;
+  padding: 8rpx 14rpx;
+  display: inline-flex;
+}
+
+.thinking-status {
+  margin-top: 8rpx;
+  margin-bottom: 8rpx;
+  display: flex;
+  align-items: center;
+  gap: 10rpx;
+  color: #5a6d85;
+  font-size: 24rpx;
+}
+
+.thinking-dot {
+  width: 14rpx;
+  height: 14rpx;
+  border-radius: 999rpx;
+  background: #5a6d85;
+  opacity: 0.75;
+  animation: ai-thinking-pulse 1s ease-in-out infinite;
+}
+
+.thinking-text {
+  color: #5a6d85;
+}
+
+.nav-action {
+  font-size: 24rpx;
+  color: #14181b;
+  padding: 8rpx 0 8rpx 16rpx;
+}
+
+@keyframes ai-thinking-pulse {
+  0% { transform: scale(0.85); opacity: 0.45; }
+  50% { transform: scale(1.1); opacity: 1; }
+  100% { transform: scale(0.85); opacity: 0.45; }
+}
+</style>
+

src/pages/ai/diet-preference/index.vue

@@ -0,0 +1,426 @@
+<script setup lang="ts">
+import { computed, onMounted, ref } from 'vue'
+import { useI18n } from 'vue-i18n'
+import {
+  appDiningProfileConfigGet,
+  appDiningProfileGet,
+  appDiningProfileSavePost,
+} from '@/service'
+const { t } = useI18n()
+
+type Option = { id: string; label: string }
+type Field = {
+  fieldKey: string
+  fieldName: string
+  groupKey: string
+  groupName: string
+  sortNum: number
+  isRequired: boolean
+  multiple: boolean
+  options: Option[]
+}
+type Group = {
+  key: string
+  title: string
+  sortNum: number
+  fields: Field[]
+}
+type SelectedMap = Record<string, string[]>
+type ProfileMap = Record<string, unknown>
+
+const PREF_FLAG_KEY = 'ai_diet_pref_done'
+const PREF_DATA_KEY = 'ai_diet_pref_data'
+
+const loading = ref(false)
+const groups = ref<Group[]>([])
+const selectedMap = ref<SelectedMap>({})
+
+function getFallbackGroups(): Group[] {
+  return [
+    {
+      key: 'taste',
+      title: t('pages.ai.dietPreference.fallback.groupTaste'),
+      sortNum: 1,
+      fields: [
+        {
+          fieldKey: 'taste_like',
+          fieldName: t('pages.ai.dietPreference.fallback.tasteLike'),
+          groupKey: 'taste',
+          groupName: t('pages.ai.dietPreference.fallback.groupTaste'),
+          sortNum: 1,
+          isRequired: false,
+          multiple: false,
+          options: [
+            { id: 'zkw', label: t('pages.ai.dietPreference.fallback.optionHeavy') },
+            { id: 'qd', label: t('pages.ai.dietPreference.fallback.optionLight') },
+            { id: 'ml', label: t('pages.ai.dietPreference.fallback.optionSpicy') },
+          ],
+        },
+        {
+          fieldKey: 'taste_taboo',
+          fieldName: t('pages.ai.dietPreference.fallback.tasteTaboo'),
+          groupKey: 'taste',
+          groupName: t('pages.ai.dietPreference.fallback.groupTaste'),
+          sortNum: 2,
+          isRequired: false,
+          multiple: true,
+          options: [
+            { id: 'seafood', label: t('pages.ai.dietPreference.fallback.optionSeafood') },
+            { id: 'organ', label: t('pages.ai.dietPreference.fallback.optionOrgan') },
+            { id: 'onion', label: t('pages.ai.dietPreference.fallback.optionOnion') },
+          ],
+        },
+      ],
+    },
+  ]
+}
+
+const hasGroups = computed(() => groups.value.length > 0)
+
+function goPreference() {
+  const current = getCurrentPages?.().slice(-1)[0]
+  if (current?.route === 'pages/ai/diet-preference/index') return
+  uni.navigateTo({
+    url: '/pages/ai/diet-preference/index',
+  })
+}
+
+function parseOptionsJson(optionsJson: unknown): Option[] {
+  if (!optionsJson) return []
+  let rawList: any[] = []
+  if (Array.isArray(optionsJson)) {
+    rawList = optionsJson
+  } else if (typeof optionsJson === 'string') {
+    try {
+      rawList = JSON.parse(optionsJson)
+    } catch (e) {
+      rawList = []
+    }
+  }
+  return rawList.map((opt, idx) => ({
+    id: String(opt?.k ?? opt?.key ?? opt?.id ?? idx),
+    label: String(opt?.v ?? opt?.value ?? opt?.name ?? `选项${idx + 1}`),
+  }))
+}
+
+function normalizeConfig(data: any): Group[] {
+  const list = Array.isArray(data) ? data : Array.isArray(data?.list) ? data.list : []
+  if (!list.length) return getFallbackGroups()
+
+  const groupMap = new Map<string, Group>()
+  list.forEach((item: any, idx: number) => {
+    const groupKey = String(item?.groupKey ?? `group_${idx}`)
+    const groupName = String(item?.groupName ?? `分组${idx + 1}`)
+    const groupSort = Number(item?.sortNum ?? idx)
+    const fieldKey = String(item?.fieldKey ?? `${groupKey}_field_${idx}`)
+    const options = parseOptionsJson(item?.optionsJson)
+    if (!options.length) return
+
+    const field: Field = {
+      fieldKey,
+      fieldName: String(item?.fieldName ?? fieldKey),
+      groupKey,
+      groupName,
+      sortNum: Number(item?.sortNum ?? idx),
+      isRequired: Number(item?.isRequired ?? 0) === 1,
+      multiple: Number(item?.multiSelect ?? 0) === 1,
+      options,
+    }
+
+    if (!groupMap.has(groupKey)) {
+      groupMap.set(groupKey, {
+        key: groupKey,
+        title: groupName,
+        sortNum: groupSort,
+        fields: [field],
+      })
+    } else {
+      groupMap.get(groupKey)!.fields.push(field)
+    }
+  })
+
+  const groupsBySort = Array.from(groupMap.values())
+    .map((group) => ({
+      ...group,
+      fields: group.fields.sort((a, b) => a.sortNum - b.sortNum),
+    }))
+    .sort((a, b) => a.sortNum - b.sortNum)
+
+  return groupsBySort.length ? groupsBySort : getFallbackGroups()
+}
+
+function collectSelectedKeys(profileData: any): Record<string, Set<string>> {
+  const map: Record<string, Set<string>> = {}
+  if (!profileData || typeof profileData !== 'object') return map
+
+  const normalizeValues = (val: unknown): string[] => {
+    if (Array.isArray(val)) return val.map((v) => String(v))
+    if (val == null || val === '') return []
+    // 兼容后端返回 "a,b,c" 形式
+    if (typeof val === 'string' && val.includes(',')) {
+      return val.split(',').map((v) => v.trim()).filter(Boolean)
+    }
+    return [String(val)]
+  }
+
+  Object.keys(profileData).forEach((key) => {
+    map[key] = new Set(normalizeValues(profileData[key]))
+  })
+  return map
+}
+
+function initSelectionByGroups(profileData: any) {
+  const selectedFromServer = collectSelectedKeys(profileData)
+  const nextMap: SelectedMap = {}
+  groups.value.forEach((group) => {
+    group.fields.forEach((field) => {
+      const matched =
+        selectedFromServer[field.fieldKey] ||
+        selectedFromServer[field.fieldName] ||
+        selectedFromServer[field.fieldKey.toLowerCase()]
+      if (matched && matched.size > 0) {
+        nextMap[field.fieldKey] = field.options
+          .map((o) => o.id)
+          .filter((id) => matched.has(id) || matched.has(String(id)))
+      } else {
+        nextMap[field.fieldKey] = []
+      }
+    })
+  })
+  selectedMap.value = nextMap
+}
+
+function toggleOption(field: Field, optionId: string) {
+  const arr = selectedMap.value[field.fieldKey] || []
+  const idx = arr.indexOf(optionId)
+  if (field.multiple) {
+    if (idx >= 0) arr.splice(idx, 1)
+    else arr.push(optionId)
+  } else {
+    selectedMap.value[field.fieldKey] = idx >= 0 ? [] : [optionId]
+    return
+  }
+  selectedMap.value[field.fieldKey] = [...arr]
+}
+
+function isSelected(groupKey: string, optionId: string) {
+  return (selectedMap.value[groupKey] || []).includes(optionId)
+}
+
+function buildSavePayload() {
+  const fields: ProfileMap = {}
+  groups.value.forEach((group) => {
+    group.fields.forEach((field) => {
+      const values = selectedMap.value[field.fieldKey] || []
+      if (!values.length) return
+      fields[field.fieldKey] = field.multiple ? values : values[0]
+    })
+  })
+  return { fields }
+}
+
+async function loadData() {
+  loading.value = true
+  try {
+    const [configRes, profileRes] = await Promise.all([
+      appDiningProfileConfigGet({}),
+      appDiningProfileGet({}),
+    ])
+    groups.value = normalizeConfig(configRes?.data)
+    initSelectionByGroups(profileRes?.data)
+  } catch (e) {
+    groups.value = getFallbackGroups()
+    initSelectionByGroups({})
+  } finally {
+    loading.value = false
+  }
+}
+
+async function handleComplete() {
+  try {
+    const body = buildSavePayload()
+    await appDiningProfileSavePost({ body })
+    uni.setStorageSync(PREF_DATA_KEY, selectedMap.value)
+    uni.setStorageSync(PREF_FLAG_KEY, true)
+    uni.redirectTo({
+      url: '/pages/ai/chat/index',
+    })
+  } catch (e) {
+    // 保存失败时沿用项目全局错误提示
+  }
+}
+
+onMounted(() => {
+  loadData()
+})
+</script>
+
+<template>
+  <view class="page">
+    <navbar :title="t('navbar-ai-diet-preference')">
+    </navbar>
+    <view class="header">
+      <view class="header-title" style="display: flex; align-items: center;">
+        <image src="/static/app/images/ai-diet-preference-title.png" class="w-44rpx h-44rpx ml-8rpx shrink-0"></image>
+        <text class="title">{{ t('pages.ai.dietPreference.title') }}</text>
+      </view>
+      <text class="sub">{{ t('pages.ai.dietPreference.sub') }}</text>
+    </view>
+
+    <view  style="padding: 22rpx;">
+
+    <view v-if="loading" class="section">
+      <view class="section-title">{{ t('pages.ai.dietPreference.loadingConfig') }}</view>
+    </view>
+
+    <view v-else-if="!hasGroups" class="section">
+      <view class="section-title">{{ t('pages.ai.dietPreference.empty') }}</view>
+    </view>
+
+    <template v-else>
+      <view class="section" v-for="group in groups" :key="group.key">
+        <view class="section-title">{{ group.title }}</view>
+        <view class="field-block" v-for="field in group.fields" :key="field.fieldKey">
+          <view class="field-title">
+            <text>{{ field.fieldName }}</text>
+            <text v-if="field.isRequired" class="required">*</text>
+            <text class="mode-tag">{{ field.multiple ? t('pages.ai.dietPreference.multi') : t('pages.ai.dietPreference.single') }}</text>
+          </view>
+          <view class="chips">
+            <view
+              v-for="opt in field.options"
+              :key="opt.id"
+              class="chip"
+              :class="isSelected(field.fieldKey, opt.id) ? 'chip--active' : ''"
+              @click="toggleOption(field, opt.id)"
+            >
+              <text>{{ opt.label }}</text>
+            </view>
+          </view>
+        </view>
+      </view>
+    </template>
+
+    <view class="footer">
+      <button class="btn" @click="handleComplete">
+        {{ t('pages.ai.dietPreference.submit') }}
+      </button>
+    </view>
+  </view>
+  </view>
+</template>
+
+<style scoped lang="scss">
+.page {
+  background: #f2f2f2;
+  min-height: 100vh;
+  // padding: 24rpx;
+}
+
+.header {
+  background: #EFFDF5;
+  // border-radius: 20rpx;
+  padding: 22rpx 22rpx;
+  box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.04);
+}
+
+.title {
+  font-size: 28rpx;
+  font-weight: 500;
+  color: #065E46;
+  display: block;
+  margin-left: 12rpx;
+}
+
+.sub {
+  display: block;
+  margin-top: 12rpx;
+  font-size: 24rpx;
+  color: #027857;
+  line-height: 1.4;
+}
+
+.section {
+  margin-top: 22rpx;
+  background: #fff;
+  border-radius: 20rpx;
+  padding: 22rpx;
+}
+
+.section-title {
+  font-size: 28rpx;
+  font-weight: 600;
+  color: #111;
+  margin-bottom: 16rpx;
+}
+
+.chips {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 16rpx;
+}
+
+.field-block + .field-block {
+  margin-top: 20rpx;
+}
+
+.field-title {
+  margin-bottom: 14rpx;
+  display: flex;
+  align-items: center;
+  gap: 8rpx;
+  font-size: 24rpx;
+  color: #333;
+}
+
+.required {
+  color: #e23636;
+}
+
+.mode-tag {
+  color: #999;
+  font-size: 22rpx;
+}
+
+.chip {
+  padding: 14rpx 18rpx;
+  border-radius: 999rpx;
+  background: #f6f6f6;
+  color: #333;
+  font-size: 24rpx;
+  line-height: 1;
+}
+
+.chip--active {
+  background: #14181b;
+  color: #fff;
+}
+
+.footer {
+  margin-top: 28rpx;
+  background: transparent;
+}
+
+.btn {
+  width: 100%;
+  border-radius: 16rpx;
+  background: #14181b;
+  color: #fff;
+  font-size: 28rpx;
+  padding: 18rpx 0;
+}
+
+.tip {
+  margin-top: 16rpx;
+  font-size: 22rpx;
+  color: #999;
+  text-align: center;
+}
+
+.nav-action {
+  font-size: 24rpx;
+  color: #14181b;
+  padding: 8rpx 0 8rpx 16rpx;
+}
+</style>
+

src/pages/ai/recommend/index.vue

@@ -0,0 +1,77 @@
+<script setup lang="ts">
+import { onMounted } from 'vue'
+import { appDiningProfileGet } from '@/service'
+import { useI18n } from 'vue-i18n'
+const { t } = useI18n()
+
+function hasProfileData(data: unknown) {
+  if (!data) return false
+  if (typeof data === 'object') {
+    const map = data as Record<string, unknown>
+    return Object.keys(map).some((k) => {
+      const v = map[k]
+      if (Array.isArray(v)) return v.length > 0
+      return v != null && String(v).trim() !== ''
+    })
+  }
+  return false
+}
+function goPreference() {
+  const current = getCurrentPages?.().slice(-1)[0]
+  if (current?.route === 'pages/ai/diet-preference/index') return
+  uni.navigateTo({
+    url: '/pages/ai/diet-preference/index',
+  })
+}
+
+async function redirectToTarget() {
+  let done = false
+  try {
+    const res = await appDiningProfileGet({})
+    done = hasProfileData(res?.data)
+  } catch (e) {
+    // 查询失败时兜底读本地标记，避免阻塞入口
+    done = !!uni.getStorageSync('ai_diet_pref_done')
+  }
+  uni.redirectTo({
+    url: done ? '/pages/ai/chat/index' : '/pages/ai/diet-preference/index',
+  })
+}
+
+onMounted(() => {
+  redirectToTarget()
+})
+</script>
+
+<template>
+  <view>
+    <navbar :title="t('navbar-ai-recommend')">
+      <template #right>
+        <view class="nav-action" @click="goPreference">
+          {{ t('common.go-to-settings') }}
+        </view>
+      </template>
+    </navbar>
+    <view class="ai-recommend-loading">
+      <text>{{ t('pages.ai.recommend.loading') }}</text>
+    </view>
+  </view>
+</template>
+
+<style scoped lang="scss">
+.ai-recommend-loading {
+  min-height: 60vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 28rpx;
+  color: #333;
+}
+
+.nav-action {
+  font-size: 24rpx;
+  color: #14181b;
+  padding: 8rpx 0 8rpx 16rpx;
+}
+</style>
+

src/pages/home/components/tabbar-browse/tabbar-browse.vue

@@ -1,23 +1,17 @@
 <script setup lang="ts">
-import useEventEmit from "@/hooks/useEventEmit";
-import {CollectionType, EventEnum} from "@/constant/enums";
-import { debounce } from 'throttle-debounce'
 import Search from "../tabbar-home/components/search.vue";
 import { useConfigStore, useUserStore } from "@/store";
-import MsgBox from "../tabbar-home/components/msg-box.vue";
-import Collection from "@/components/collection/index.vue";
 import BrowseSkeleton from "./components/browse-skeleton.vue";
 import {
-  appMerchantDishNearbyListPost,
+  appMerchantNearbyListPost,
   appSearchSearchRecipePost,
-  appCollectCollectPost,
 } from "@/service";
 import {thumbnailImg} from "@/utils/utils";
 const configStore = useConfigStore();
 const userStore = useUserStore();
-const emit = defineEmits(["toggleNotOpen"]);
 
 const loading = ref(false);
+const recipePreviewLimit = 4;
 
 const { t } = useI18n();
 
@@ -29,27 +23,23 @@ function navigateTo(url: string) {
   }
 }
 
-function toggleNotOpen() {
-  emit("toggleNotOpen");
-}
-
 async function initData() {
   if(!recipeData.value) {
     loading.value = true;
   }
   getRecipeData()
-  // 获取菜品数据
+  getNearbyStoreList()
-  appMerchantDishNearbyList()
 }
 
 // 获取菜谱数据
-const recipeData = ref([]);
+const recipeData = ref<any[]>([]);
 function getRecipeData() {
   appSearchSearchRecipePost({
-    body: {
+    params: {
       pageNum: 1,
       pageSize: 10,
-    }
+    },
+    body: {}
   }).then(res=> {
     console.log('菜谱数据', res)
     recipeData.value = res.rows;
@@ -57,47 +47,60 @@ function getRecipeData() {
     loading.value = false;
   })
 }
-// 收藏菜品
-function handleSubmitCollectRecipe(item: any) {
-  collectRecipe(item)
-}
-// 防抖处理函数
-const collectRecipe = debounce(1000, (item: any) => {
-  appCollectCollectPost({
-    body: {
-      targetId: item.id,
-      targetType: CollectionType.RECIPE
-    }
-  }).then(res=> {
-    item.isCollect = !item.isCollect;
-  })
-}, {
-  atBegin: true, // 立即触发
-});
-
 function navigateToRecipeDetail(id: string | number) {
   navigateTo(`/pages-user/pages/recipe/index?id=${id}`)
 }
 
-// 获取附近的菜品
+function navigateToRecipeList() {
-const dishData = ref([]);
+  navigateTo('/pages-user/pages/recipe/list')
-function appMerchantDishNearbyList() {
+}
-  appMerchantDishNearbyListPost({
+
-    params: {
+// 获取附近店铺
-      pageNum: 1,
+const nearbyStoreList = ref<any[]>([]);
-      pageSize: 10,
+const nearbyStoreLoaded = ref(false);
-    },
+function getNearbyStoreList() {
+  nearbyStoreLoaded.value = false;
+  appMerchantNearbyListPost({
     body: {
       lat: userStore.userLocation.latitude,
       lng: userStore.userLocation.longitude,
-    }
+    },
-  }).then(res=> {
-    console.log('菜品数据', res)
-    dishData.value = res.rows;
   })
+    .then((res) => {
+      console.log("附近店铺", res);
+      nearbyStoreList.value = res.data || [];
+    })
+    .catch(() => {
+      nearbyStoreList.value = [];
+    })
+    .finally(() => {
+      nearbyStoreLoaded.value = true;
+    });
 }
-function handleClickDish(item: any) {
+
-  navigateTo(`/pages-store/pages/store/index?id=${item.merchantId}`)
+function handleClickStore(item: any) {
+  navigateTo(`/pages-store/pages/store/index?id=${item.id}`);
+}
+
+function getStoreName(item: any) {
+  return item?.merchantName || "--";
+}
+
+function getStoreLogo(item: any) {
+  return item?.logo || "";
+}
+
+function getStoreRate(item: any) {
+  const rating = Number(item?.rating ?? 0);
+  return Number.isFinite(rating) && rating > 0 ? rating.toFixed(1) : "5.0";
+}
+
+function getPreviewRecipeList() {
+  return recipeData.value.slice(0, recipePreviewLimit)
+}
+
+function showRecipeMore() {
+  return recipeData.value.length > recipePreviewLimit
 }
 
 async function getPlatformDefaultStoreInfo() {}
@@ -131,64 +134,76 @@ defineExpose({
         v-show="!loading"
         class="animate-in fade-in animate-ease-in animate-duration-300"
       >
-        <view class="flex-center-sb px-30rpx pt-16rpx">
+        <view class="px-24rpx pt-16rpx">
-          <view class="text-56rpx text-#333 lh-56rpx font-bold">{{
-            t("tabBar.browse")
-          }}</view>
-          <msg-box @toggleNotOpen="toggleNotOpen" />
-        </view>
-        <view class="px-30rpx mt-44rpx">
           <search />
         </view>
-        <view class="mt-50rpx px-30rpx">
+        <view class="browse-wrap px-24rpx">
-          <view @click="navigateTo('/pages-user/pages/recipe/list')" class="flex-center-sb">
+          <view class="section-title mt-36rpx">{{ t("pages.browse.titleRecipes") }}</view>
-            <text class="text-36rpx lh-36rpx text-#333 font-bold">{{
+          <view class="mt-28rpx">
-              t("pages.browse.titleRecipes")
+            <scroll-view scroll-x class="recipe-scroll" :show-scrollbar="false" :enable-flex="true">
-            }}</text>
+              <view class="recipe-track">
-            <image src="@img/chef/116.png" class="w-64rpx h-64rpx"></image>
+                <view
-          </view>
+                  v-for="item in getPreviewRecipeList()"
-          <scroll-view scroll-x="true" class="mt-16rpx">
+                  :key="item.id"
-            <view class="flex gap-30rpx">
+                  class="recipe-item"
-              <template v-for="item in recipeData">
+                  @click="navigateToRecipeDetail(item.id)"
-                <view @click="navigateToRecipeDetail(item.id)" class="w-312rpx">
+                >
                   <image
                     :src="thumbnailImg(item?.recipeImage?.split(',')[0])"
-                    class="w-310rpx h-296rpx rounded-24rpx mb-26rpx bg-common"
+                    class="recipe-avatar"
                     mode="aspectFill"
-                  ></image>
+                  />
-                  <view class="flex-center-sb">
+                  <text class="recipe-name line-clamp-1">{{ item.recipeName }}</text>
-                    <text class="text-30rpx lh-30rpx text-#333 line-clamp-1 tracking-[.04em] font-500"
+                </view>
-                      >{{ item.recipeName }}</text
+                <view v-if="showRecipeMore()"  class="recipe-more" @click="navigateToRecipeList">
-                    >
+                  <view class="recipe-more__text-wrap">
-                    <view class="w-40rpx h-40rpx ml-14rpx shrink-0">
+                    <text class="recipe-more__text">{{ t("pages.browse.moreRecipes") }}</text>
-                      <collection
+                  </view>
-                        :is-collected="item.isCollect"
+                  <i class="i-carbon:chevron-right recipe-more__icon"></i>
-                        @collectionChange="handleSubmitCollectRecipe(item)"
+                </view>
-                      />
+              </view>
-                    </view>
+            </scroll-view>
+          </view>
+
+          <view class="section-title mt-54rpx">{{ t("pages.browse.titleCuisine") }}</view>
+          <scroll-view
+            v-if="nearbyStoreList.length > 0"
+            scroll-x
+            class="store-scroll mt-28rpx pb-40rpx"
+            :show-scrollbar="false"
+            :enable-flex="true"
+          >
+            <view class="store-track">
+              <view
+                v-for="item in nearbyStoreList"
+                :key="item.id"
+                @click="handleClickStore(item)"
+                class="store-card"
+              >
+                <image
+                  :src="thumbnailImg(getStoreLogo(item))"
+                  class="store-card__cover"
+                  mode="aspectFill"
+                />
+                <view class="store-card__right">
+                  <view class="store-card__name line-clamp-2">{{ getStoreName(item) }}</view>
+                  <view class="store-card__rating">★★★★★ {{ getStoreRate(item) }}</view>
+                  <view class="store-card__brand">{{ t("pages.browse.brandTag") }}</view>
+                  <view class="store-card__arrow center">
+                    <i class="i-carbon:chevron-right text-30rpx text-white"></i>
                   </view>
                 </view>
-              </template>
+              </view>
             </view>
           </scroll-view>
-
           <view
-            class="mt-50rpx mb-28rpx text-36rpx lh-36rpx text-#333 font-bold"
+            v-else-if="nearbyStoreLoaded && !loading"
-            >{{ t("pages.browse.titleCuisine") }}</view
+            class="store-empty mt-28rpx pb-40rpx"
           >
-          <view class="grid grid-cols-2 gap-x-30rpx gap-y-46rpx pb-40rpx">
+            <view class="store-empty__icon-wrap center">
-            <template v-for="item in dishData">
+              <i class="i-carbon:location-off store-empty__icon"></i>
-              <view @click="handleClickDish(item)" class="w-330rpx overflow-hidden">
+            </view>
-                <image
+            <text class="store-empty__text">{{ t("pages.browse.nearbyEmpty") }}</text>
-                  :src="thumbnailImg(item?.dishImage?.split(',')[0])"
-                  class="w-full h-186rpx rounded-24rpx mb-16rpx bg-common"
-                  mode="aspectFill"
-                ></image>
-                <text class="text-30rpx lh-30rpx text-#333 line-clamp-1 tracking-[.04em] font-500"
-                  >{{ item.dishName }}</text
-                >
-              </view>
-            </template>
           </view>
         </view>
       </view>
@@ -201,4 +216,179 @@ defineExpose({
   </view>
 </template>
 
-<style scoped lang="scss"></style>
+<style scoped lang="scss">
+.browse-wrap {
+  background: #fff;
+}
+
+.section-title {
+  font-size: 32rpx;
+  line-height: 48rpx;
+  // font-weight: 700;
+  color: #1c1c1c;
+}
+
+.recipe-scroll,
+.store-scroll {
+  width: 100%;
+}
+
+.recipe-track {
+  display: flex;
+  align-items: flex-start;
+  gap: 22rpx;
+  padding-right: 24rpx;
+}
+
+.recipe-item {
+  flex-shrink: 0;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.recipe-avatar {
+  width: 112rpx;
+  height: 112rpx;
+  border-radius: 56rpx;
+  background: #f1f1f1;
+}
+
+.recipe-name {
+  max-width: 140rpx;
+  margin-top: 14rpx;
+  text-align: center;
+  font-size: 26rpx;
+  line-height: 32rpx;
+  color: #222;
+  font-weight: 500;
+}
+
+.recipe-more {
+  flex-shrink: 0;
+  height: 112rpx;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 4rpx;
+  padding: 4rpx 8rpx;
+}
+
+.recipe-more__text-wrap {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  gap: 6rpx;
+}
+
+.recipe-more__text {
+  font-size: 24rpx;
+  line-height: 28rpx;
+  color: #8a8a8a;
+  font-weight: 500;
+  writing-mode: vertical-rl;
+  text-orientation: upright;
+  letter-spacing: 2rpx;
+  white-space: nowrap;
+}
+
+.recipe-more__icon {
+  font-size: 20rpx;
+  color: #8a8a8a;
+}
+
+.store-track {
+  display: flex;
+  align-items: stretch;
+  gap: 22rpx;
+  padding-right: 24rpx;
+}
+
+.store-card {
+  width: 404rpx;
+  height: 220rpx;
+  border-radius: 20rpx;
+  overflow: hidden;
+  background: #fff;
+  flex-shrink: 0;
+  display: flex;
+  box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.06);
+}
+
+.store-card__cover {
+  width: 184rpx;
+  height: 220rpx;
+  background: #f2f2f2;
+  flex-shrink: 0;
+}
+
+.store-card__right {
+  flex: 1;
+  padding: 16rpx 14rpx 14rpx 16rpx;
+  position: relative;
+}
+
+.store-card__name {
+  font-size: 28rpx;
+  line-height: 34rpx;
+  color: #191919;
+  font-weight: 600;
+}
+
+.store-card__rating {
+  margin-top: 8rpx;
+  color: #111;
+  font-size: 26rpx;
+  line-height: 30rpx;
+  font-weight: 500;
+}
+
+.store-card__brand {
+  margin-top: 12rpx;
+  color: #d39a48;
+  font-size: 24rpx;
+  line-height: 28rpx;
+  font-weight: 500;
+}
+
+.store-card__arrow {
+  position: absolute;
+  right: 10rpx;
+  bottom: 12rpx;
+  width: 52rpx;
+  height: 52rpx;
+  border-radius: 50%;
+  background: #111;
+}
+
+.store-empty {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  min-height: 220rpx;
+  padding: 48rpx 32rpx;
+  border-radius: 20rpx;
+  background: #f7f7f7;
+}
+
+.store-empty__icon-wrap {
+  width: 96rpx;
+  height: 96rpx;
+  border-radius: 50%;
+  background: #ececec;
+}
+
+.store-empty__icon {
+  font-size: 44rpx;
+  color: #b0b0b0;
+}
+
+.store-empty__text {
+  margin-top: 24rpx;
+  font-size: 28rpx;
+  line-height: 40rpx;
+  color: #8a8a8a;
+  text-align: center;
+}
+</style>

src/pages/home/components/tabbar-home/components/class-bullet.vue

@@ -1,82 +1,31 @@
 <template>
   <view class="class-bullet-container">
-    <!-- 第一行：自动缓慢滚动 + 可手动滑动 -->
+    <view class="category-grid">
-    <view class="scroll-row first-row">
+      <view
-      <scroll-view
+        v-for="item in topCategories"
-        class="ab-scroll mb-22rpx"
+        :key="item.id"
-        scroll-x
+        class="category-item"
-        show-scrollbar="false"
+        @click="handleItemClick(item)"
-        :scroll-left="scrollLeft1"
-        @touchstart="onTouchStart1"
-        @touchend="onTouchEnd1"
-        @touchcancel="onTouchEnd1"
-        @scroll="onScroll1"
       >
-        <view class="sv-inner" id="sv1-inner">
+        <image
-          <!-- 一份内容 -->
+          v-if="item.categoryImage || item.logoUrl"
-          <view
+          :src="item.categoryImage || item.logoUrl"
-            v-for="(item, idx) in categories"
+          class="category-icon"
-            :key="item.id + '-row1-a-' + idx"
+          mode="aspectFit"
-            class="category-item"
+        />
-            @click="handleItemClick(item)"
+        <text class="category-text">{{ item.categoryName || item.name }}</text>
-          >
+      </view>
-            <image v-if="item.categoryImage || item.logoUrl" :src="item.categoryImage || item.logoUrl" class="category-icon" mode="aspectFit" />
+      <view class="category-item" @click="handleMoreClick">
-            <text class="category-text">{{ item.categoryName || item.name }}</text>
+        <image src="@/static/app/images/more.png" class="category-icon" mode="aspectFit" />
-          </view>
+        <text class="category-text">更多</text>
-          <!-- 第二份重复内容，用于无缝滚动 -->
+      </view>
-          <view
-            v-for="(item, idx) in categories"
-            :key="item.id + '-row1-b-' + idx"
-            class="category-item"
-            @click="handleItemClick(item)"
-          >
-            <image v-if="item.categoryImage || item.logoUrl" :src="item.categoryImage || item.logoUrl" class="category-icon" mode="aspectFit" />
-            <text class="category-text">{{ item.categoryName || item.name }}</text>
-          </view>
-        </view>
-      </scroll-view>
-    </view>
-
-    <!-- 第二行：反向数据，自动滚动速度略不同 -->
-    <view class="scroll-row">
-      <scroll-view
-        class="ab-scroll"
-        scroll-x
-        show-scrollbar="false"
-        :scroll-left="scrollLeft2"
-        @touchstart="onTouchStart2"
-        @touchend="onTouchEnd2"
-        @touchcancel="onTouchEnd2"
-        @scroll="onScroll2"
-      >
-        <view class="sv-inner" id="sv2-inner">
-          <view
-            v-for="(item, idx) in categoriesReversed"
-            :key="item.id + '-row2-a-' + idx"
-            class="category-item"
-            @click="handleItemClick(item)"
-          >
-            <image v-if="item.categoryImage || item.logoUrl" :src="item.categoryImage || item.logoUrl" class="category-icon" mode="aspectFit" />
-            <text class="category-text">{{ item.categoryName || item.name }}</text>
-          </view>
-          <view
-            v-for="(item, idx) in categoriesReversed"
-            :key="item.id + '-row2-b-' + idx"
-            class="category-item"
-            @click="handleItemClick(item)"
-          >
-            <image v-if="item.categoryImage || item.logoUrl" :src="item.categoryImage || item.logoUrl" class="category-icon" mode="aspectFit" />
-            <text class="category-text">{{ item.categoryName || item.name }}</text>
-          </view>
-        </view>
-      </scroll-view>
     </view>
   </view>
-  
 </template>
 
 <script setup lang="ts">
-import { computed, ref, onMounted, onUnmounted, nextTick } from 'vue'
+import { computed } from 'vue'
+import { useCategoryNavStore } from '@/store'
 
 // 定义分类项接口（与模板字段一致）
 interface CategoryItem {
@@ -97,6 +46,8 @@ const props = withDefaults(defineProps<Props>(), {
   categories: () => []
 })
 
+const categoryNavStore = useCategoryNavStore()
+
 // 定义事件
 const emit = defineEmits<{
   /** 点击分类项事件 */
@@ -118,213 +69,59 @@ const mockCategories: CategoryItem[] = [
 const categories = computed(() => {
   return props.categories.length > 0 ? props.categories : mockCategories
 })
-// 第二行使用反向顺序以形成与第一行相反的视觉效果
+const topCategories = computed(() => categories.value.slice(0, 4))
-const categoriesReversed = computed(() => {
-  const list = categories.value || []
-  return list.slice().reverse()
-})
 
-// ===== 自动滚动相关（电商标签推荐风格） =====
+// 点击处理（列表页菜谱 id 来自 store，不放在 URL query）
-// 视口宽度，用于计算最大可滚动距离（scrollWidth - viewportWidth）
-const systemInfo = uni.getSystemInfoSync()
-const viewportWidth = systemInfo.windowWidth || 0
-
-const scrollLeft1 = ref(0)
-const scrollLeft2 = ref(0)
-
-// 最大可滚动距离（由 scroll 事件提供，避免自己算）
-const maxScroll1 = ref(0)
-const maxScroll2 = ref(0)
-
-const isTouching1 = ref(false)
-const isTouching2 = ref(false)
-
-let autoTimer1: any = null
-let autoTimer2: any = null
-let resumeTimer1: any = null
-let resumeTimer2: any = null
-
-// 速度和间隔可以根据效果微调
-const AUTO_INTERVAL = 30
-const AUTO_STEP_1 = 0.6
-const AUTO_STEP_2 = 0.4
-const RESUME_DELAY = 800
-const RESET_THRESHOLD = 2 // 在距离末尾一定范围内就重置
-
-function startAuto1() {
-  if (autoTimer1) return
-  autoTimer1 = setInterval(() => {
-    if (isTouching1.value) return
-    let next = scrollLeft1.value + AUTO_STEP_1
-    const max = maxScroll1.value
-    if (max > 0 && next >= max - RESET_THRESHOLD) {
-      // 距离最右侧很近时，从头开始，实现循环
-      next = 0
-    }
-    scrollLeft1.value = next
-  }, AUTO_INTERVAL)
-}
-
-function startAuto2() {
-  if (autoTimer2) return
-  autoTimer2 = setInterval(() => {
-    if (isTouching2.value) return
-    let next = scrollLeft2.value + AUTO_STEP_2
-    const max = maxScroll2.value
-    if (max > 0 && next >= max - RESET_THRESHOLD) {
-      next = 0
-    }
-    scrollLeft2.value = next
-  }, AUTO_INTERVAL)
-}
-
-function stopAuto1() {
-  if (autoTimer1) {
-    clearInterval(autoTimer1)
-    autoTimer1 = null
-  }
-}
-
-function stopAuto2() {
-  if (autoTimer2) {
-    clearInterval(autoTimer2)
-    autoTimer2 = null
-  }
-}
-
-function onTouchStart1() {
-  isTouching1.value = true
-  if (resumeTimer1) clearTimeout(resumeTimer1)
-  stopAuto1()
-}
-
-function onTouchEnd1() {
-  resumeTimer1 = setTimeout(() => {
-    isTouching1.value = false
-    startAuto1()
-  }, RESUME_DELAY)
-}
-
-function onScroll1(e: any) {
-  const detail = e?.detail
-  if (detail && typeof detail.scrollLeft === 'number') {
-    scrollLeft1.value = detail.scrollLeft
-    // scrollWidth - viewportWidth 为最大可滚动距离
-    if (typeof detail.scrollWidth === 'number' && viewportWidth > 0) {
-      const max = detail.scrollWidth - viewportWidth
-      maxScroll1.value = max > 0 ? max : 0
-    }
-  }
-}
-
-function onTouchStart2() {
-  isTouching2.value = true
-  if (resumeTimer2) clearTimeout(resumeTimer2)
-  stopAuto2()
-}
-
-function onTouchEnd2() {
-  resumeTimer2 = setTimeout(() => {
-    isTouching2.value = false
-    startAuto2()
-  }, RESUME_DELAY)
-}
-
-function onScroll2(e: any) {
-  const detail = e?.detail
-  if (detail && typeof detail.scrollLeft === 'number') {
-    scrollLeft2.value = detail.scrollLeft
-    if (typeof detail.scrollWidth === 'number' && viewportWidth > 0) {
-      const max = detail.scrollWidth - viewportWidth
-      maxScroll2.value = max > 0 ? max : 0
-    }
-  }
-}
-
-// 点击处理
 const handleItemClick = (item: CategoryItem) => {
   emit('itemClick', item)
-  navigateTo('/pages-store/pages/list/index?id=' + item.id)
+  categoryNavStore.setPendingRecipeCategoryId(item.id)
+  navigateTo('/pages-store/pages/list/index')
 }
 
 function navigateTo(url: string) {
   uni.navigateTo({ url })
 }
 
-onMounted(() => {
+function handleMoreClick() {
-  nextTick(() => {
+  navigateTo('/pages-store/pages/list/index')
-    // 启动自动滚动，maxScroll 值会在第一次 scroll 事件时更新
+}
-    setTimeout(() => {
-      startAuto1()
-      startAuto2()
-    }, 300)
-  })
-})
-
-onUnmounted(() => {
-  stopAuto1()
-  stopAuto2()
-  if (resumeTimer1) clearTimeout(resumeTimer1)
-  if (resumeTimer2) clearTimeout(resumeTimer2)
-})
 </script>
 
 <style lang="scss" scoped>
 .class-bullet-container {
   width: 100%;
-  overflow: hidden;
-
-  .scroll-row {
-    margin-bottom: 20rpx;
-    overflow: hidden;
-
-    &:last-child {
-      margin-bottom: 0;
-    }
-  }
-
-  .ab-scroll {
-    width: 100%;
-    overflow: hidden;
-  }
-
-  .sv-inner {
-    display: flex;
-    flex-direction: row;
-    gap: 20rpx;
-  }
-
-  .category-item {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    min-width: 120rpx;
-    height: 60rpx;
-    padding: 0 20rpx;
-    border: 1px solid #C8C8C8;
-    border-radius: 30rpx;
-    cursor: pointer;
-    transition: all 0.2s ease;
-    flex-shrink: 0;
-
-    &:active {
-      transform: translateY(0) scale(0.95);
-    }
-
-    .category-icon {
-      width: 32rpx;
-      height: 32rpx;
-      margin-right: 8rpx;
-      flex-shrink: 0;
-    }
-
-    .category-text {
-      font-size: 28rpx;
-      color: #333;
-      white-space: nowrap;
-    }
-  }
 }
 
-// 取消 CSS 动画，由 JS 控制的 scroll-left 实现无缝滚动，避免与手势滚动冲突导致的抖动
+.category-grid {
+  display: grid;
+  grid-template-columns: repeat(5, minmax(0, 1fr));
+  gap: 12rpx;
+}
+
+.category-item {
+  min-width: 0;
+  min-height: 108rpx;
+  padding: 8rpx 4rpx;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 8rpx;
+}
+
+.category-icon {
+  width: 54rpx;
+  height: 54rpx;
+  flex-shrink: 0;
+}
+
+.category-text {
+  font-size: 22rpx;
+  color: #333;
+  line-height: 1.2;
+  max-width: 100%;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
 </style>

src/pages/home/components/tabbar-home/components/featured-on/index.vue

@@ -1,40 +1,271 @@
 <script setup lang="ts">
-import {thumbnailImg} from "@/utils/utils";
+import { thumbnailImg } from '@/utils/utils'
+
 const props = defineProps<{
-  list: any[];
+  list: any[]
-}>();
+}>()
-const { t } = useI18n();
+const { t } = useI18n()
 
 function handleClickFood(item: any) {
   uni.navigateTo({
-    url: '/pages-store/pages/store/index?id=' + item.id
+    url: '/pages-store/pages/store/index?id=' + item.id,
   })
 }
+
+function getCardImages(item: any): string[] {
+  const raw = item?.shopImages
+  let urls: string[] = []
+  if (raw && typeof raw === 'string') {
+    urls = raw
+      .split(',')
+      .map((s: string) => s.trim())
+      .filter(Boolean)
+      .map((u: string) => thumbnailImg(u) || u)
+  }
+  if (urls.length === 0 && item?.logo) {
+    const logo = thumbnailImg(item.logo) || item.logo
+    urls = logo ? [logo] : []
+  }
+  return urls
+}
+
+function getTitleLines(item: any): { line1: string; line2: string } {
+  const en = item?.merchantCategoryNamesEn?.[0]
+  const zh = item?.merchantCategoryNamesZh?.[0]
+  const name = String(item?.merchantName || '').trim()
+  if (en && zh) return { line1: String(en), line2: String(zh) }
+  if (en && !zh) return { line1: String(en), line2: name && name !== String(en) ? name : '' }
+  if (zh && !en) return { line1: String(zh), line2: name && name !== String(zh) ? name : '' }
+  const parts = name.split(/\n|\r|\|｜/).map((s) => s.trim()).filter(Boolean)
+  if (parts.length >= 2) return { line1: parts[0], line2: parts[1] }
+  return { line1: name, line2: '' }
+}
+
+function formatMerchantRating(item: any): string {
+  const r = Number(item?.rating)
+  if (Number.isFinite(r) && r > 0) return r.toFixed(1)
+  return '5.0'
+}
+
+function subtitleLine(item: any): string {
+  const comments = item?.commentCount ?? 0
+  const dt = item?.deliveryTime
+  if (dt === undefined || dt === null || dt === '') {
+    return `(${comments})`
+  }
+  const n = Number(dt)
+  if (Number.isFinite(n) && n > 0) {
+    const unit = n === 1 ? t('common.day') : t('common.days')
+    return `(${comments}) · ${n}${unit}`
+  }
+  return `(${comments}) · ${dt}`
+}
 </script>
 
 <template>
-  <scroll-view scroll-x="true">
+  <scroll-view class="featured-scroll" scroll-x enable-flex :show-scrollbar="false">
-    <view class="flex">
+    <view class="featured-track">
-      <view class="w-30rpx shrink-0"></view>
+      <view class="featured-track__pad" />
-      <template v-for="(item, index) in list" :key="item?.id ?? index">
+      <view
-        <view @click="handleClickFood(item)" :class="[index === 0 ? '' : 'ml-28rpx']">
+        v-for="(item, index) in list"
-          <image :src="thumbnailImg(item?.shopImages?.split(',')[0])" class="w-448rpx h-252rpx rounded-24rpx mb-20rpx bg-common" mode="aspectFill"></image>
+        :key="item?.id ?? index"
-          <text class="text-30rpx lh-30rpx text-#333 font-500 line-clamp-1">{{ item?.merchantName }}</text>
+        class="featured-card"
-          <view v-if="+item.deliveryService === 1" class="text-#CE7138 text-24rpx lh-24rpx mt-12rpx">
+        :class="{ 'featured-card--first': index === 0 }"
+        @click="handleClickFood(item)"
+      >
+        <!-- 左侧图：单图或与示例一致的双图上下分栏 -->
+        <view class="featured-card__media">
+          <template v-if="getCardImages(item).length >= 2">
+            <image
+              :src="getCardImages(item)[0]"
+              class="featured-card__media-half featured-card__media-half--top"
+              mode="scaleToFill"
+            />
+          </template>
+          <image
+            v-else-if="getCardImages(item).length >= 1"
+            :src="getCardImages(item)[0]"
+            class="featured-card__media-single"
+            mode="scaleToFill"
+          />
+          <view v-else class="featured-card__media-single featured-card__media-placeholder" />
+        </view>
+
+        <view class="featured-card__body">
+          <view class="featured-card__titles">
+            <text v-if="getTitleLines(item).line1" class="featured-card__name featured-card__name--primary">{{
+              getTitleLines(item).line1
+            }}</text>
+            <text v-if="getTitleLines(item).line2" class="featured-card__name featured-card__name--secondary">{{
+              getTitleLines(item).line2
+            }}</text>
+          </view>
+
+          <view
+            v-if="+item.deliveryService === 1"
+            class="featured-card__fee"
+          >
             {{ t('pages-store.store.tips5') }} ${{ item.deliveryFee }}{{ t('pages-store.store.start') }}
           </view>
-          <view class="text-24rpx lh-24rpx flex items-center mt-12rpx">
+
-            <text class="text-#333 font-500">{{ item.rating }}</text>
+          <view class="featured-card__rating">
-            <image src="@img/chef/124.png" class="w-24rpx h-24rpx mx-4rpx mt-2rpx"></image>
+            <text class="featured-card__stars">★★★★★</text>
-            <text class="text-#7D7D7D">({{ item.commentCount }}) • {{ item.deliveryTime }} {{ Number(item.deliveryTime) === 1 ? t('common.day') : t('common.days') }}</text>
+            <text class="featured-card__rate-num">{{ formatMerchantRating(item) }}</text>
+          </view>
+
+          <text class="featured-card__sub">{{ subtitleLine(item) }}</text>
+
+          <view class="featured-card__arrow center">
+            <view class="i-carbon:chevron-right text-32rpx text-white"></view>
           </view>
         </view>
-      </template>
+      </view>
-      <view class="w-30rpx shrink-0 op-0">1</view>
+      <view class="featured-track__pad featured-track__pad--end" />
     </view>
   </scroll-view>
 </template>
 
 <style scoped lang="scss">
+.featured-scroll {
+  width: 100%;
+}
 
-</style>
+.featured-track {
+  display: flex;
+  align-items: stretch;
+  padding-bottom: 4rpx;
+}
+
+.featured-track__pad {
+  flex-shrink: 0;
+  width: 6rpx;
+}
+.featured-track__pad--end {
+  width: 24rpx;
+}
+
+.featured-card {
+  flex-shrink: 0;
+  display: flex;
+  flex-direction: row;
+  width: 560rpx;
+  height: 306rpx;
+  min-height: 306rpx;
+  margin-left: 16rpx;
+  background: #fff;
+  border-radius: 24rpx;
+  overflow: hidden;
+  box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.06);
+}
+.featured-card--first {
+  margin-left: 0;
+}
+
+.featured-card__media {
+  width: 383rpx;
+  flex-shrink: 0;
+  background: #f0f0f0;
+  display: flex;
+  flex-direction: column;
+  position: relative;
+  overflow: hidden;
+}
+
+.featured-card__media-single {
+  width: 100%;
+  height: 100%;
+  min-height: 256rpx;
+  display: block;
+}
+
+.featured-card__media-half {
+  width: 100%;
+  flex: 1;
+  min-height: 0;
+  display: block;
+}
+.featured-card__media-half--top {
+  border-bottom: 3rpx solid #fff;
+}
+
+.featured-card__body {
+  flex: 1;
+  min-width: 0;
+  padding: 20rpx 20rpx 18rpx 20rpx;
+  position: relative;
+  display: flex;
+  flex-direction: column;
+}
+
+.featured-card__titles {
+  display: flex;
+  flex-direction: column;
+  gap: 6rpx;
+}
+
+.featured-card__name {
+  display: block;
+  width: 100%;
+  font-size: 24rpx;
+  line-height: 30rpx;
+  font-weight: 600;
+  color: #1a1a1a;
+  white-space: normal;
+  word-break: break-word;
+}
+.featured-card__name--secondary {
+  font-weight: 500;
+}
+
+.featured-card__media-placeholder {
+  min-height: 256rpx;
+  background: #e8e8e8;
+}
+
+.featured-card__fee {
+  margin-top: 10rpx;
+  font-size: 18rpx;
+  line-height: 24rpx;
+  font-weight: 500;
+  color: #d48806;
+}
+
+.featured-card__rating {
+  margin-top: 14rpx;
+  display: flex;
+  align-items: center;
+  gap: 8rpx;
+}
+
+.featured-card__stars {
+  font-size: 22rpx;
+  line-height: 1;
+  color: #1a1a1a;
+  letter-spacing: 2rpx;
+}
+
+.featured-card__rate-num {
+  font-size: 26rpx;
+  line-height: 30rpx;
+  font-weight: 600;
+  color: #1a1a1a;
+}
+
+.featured-card__sub {
+  margin-top: 8rpx;
+  font-size: 22rpx;
+  line-height: 28rpx;
+  color: #999;
+}
+
+.featured-card__arrow {
+  position: absolute;
+  right: 16rpx;
+  bottom: 16rpx;
+  width: 56rpx;
+  height: 56rpx;
+  border-radius: 50%;
+  background: #14181b;
+  box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.12);
+}
+</style>

src/pages/home/components/tabbar-home/components/food-box/index.vue

@@ -61,11 +61,16 @@ function handleCollectionChange(value: boolean) {
 </script>
 <template>
   <view @click="handleClickFood" class="mb-52rpx">
-    <image
+    <view class="food-box-img-wrap">
-        :src="item?.dishImage?.split(',')[0]||item?.logo"
+      <view v-if="item.isNew == 1" class="dish-new-ribbon">
-      mode="aspectFill"
+        <text class="dish-new-ribbon__text">NEW</text>
-      class="w-100% h-400rpx rounded-24rpx bg-common"
+      </view>
-    ></image>
+      <image
+          :src="item?.dishImage?.split(',')[0]||item?.logo"
+        mode="aspectFill"
+        class="w-100% h-400rpx rounded-24rpx bg-common"
+      ></image>
+    </view>
     <view class="flex justify-between items-start mt-14rpx">
       <view>
         <text class="text-30rpx lh-30rpx text-#333 font-500 line-clamp-1"
@@ -86,3 +91,37 @@ function handleCollectionChange(value: boolean) {
     </view>
   </view>
 </template>
+
+<style scoped lang="scss">
+.food-box-img-wrap {
+  position: relative;
+  overflow: hidden;
+  border-radius: 24rpx;
+}
+
+.dish-new-ribbon {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 184rpx;
+  height: 184rpx;
+  overflow: hidden;
+  z-index: 5;
+  pointer-events: none;
+
+  &__text {
+    position: absolute;
+    top: 26rpx;
+    left: -66rpx;
+    width: 240rpx;
+    text-align: center;
+    font-size: 22rpx;
+    font-weight: 700;
+    color: #fff;
+    letter-spacing: 2rpx;
+    line-height: 44rpx;
+    background: #E23636;
+    transform: rotate(-45deg);
+  }
+}
+</style>

src/pages/home/components/tabbar-home/components/home-skeleton.vue

@@ -1,20 +1,26 @@
 <template>
   <view class="home-skeleton">
-    <!-- 头部区域 -->
+    <!-- 顶部头部（与 home-top-header 对齐） -->
     <view class="header-section">
-      <view class="app-title-skeleton skeleton-item"></view>
+      <view class="header-toolbar">
-      <view class="delivery-info-skeleton skeleton-item"></view>
+        <view class="brand-row">
+          <view class="logo-skeleton skeleton-item"></view>
+          <view class="app-title-skeleton skeleton-item"></view>
+        </view>
+        <view class="header-right">
+          <view class="location-pill-skeleton skeleton-item"></view>
+          <view class="cart-btn-skeleton skeleton-item"></view>
+        </view>
+      </view>
+      <view class="notice-row-skeleton skeleton-item"></view>
     </view>
 
-    <!-- 位置和通知区域 -->
+    <!-- 搜索栏 + 消息按钮 -->
-    <view class="location-notification">
-      <view class="location-skeleton skeleton-item"></view>
-      <view class="notification-skeleton skeleton-item"></view>
-    </view>
-
-    <!-- 搜索栏 -->
     <view class="search-section">
-      <view class="search-bar-skeleton skeleton-item"></view>
+      <view class="search-row">
+        <view class="search-bar-skeleton skeleton-item"></view>
+        <view class="message-btn-skeleton skeleton-item"></view>
+      </view>
     </view>
 
     <!-- 分类滚动区域 -->
@@ -107,59 +113,94 @@
 }
 
 .home-skeleton {
-  background-color: #fff;
+  background-color: #f2f2f2;
   min-height: 100vh;
 }
 
 // 头部区域
 .header-section {
-  padding: 18rpx 30rpx 0;
+  padding: 18rpx 24rpx 0;
   display: flex;
-  align-items: center;
+  flex-direction: column;
-  gap: 14rpx;
+  gap: 10rpx;
-  
+
-  .app-title-skeleton {
+  .header-toolbar {
-    width: 241rpx;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 12rpx;
+  }
+
+  .brand-row {
+    display: flex;
+    align-items: center;
+    gap: 14rpx;
+    flex: 1;
+    min-width: 0;
+  }
+
+  .logo-skeleton {
+    width: 52rpx;
     height: 52rpx;
+    border-radius: 50%;
+    flex-shrink: 0;
+  }
+
+  .app-title-skeleton {
+    width: 210rpx;
+    height: 36rpx;
     border-radius: 8rpx;
   }
-  
+
-  .delivery-info-skeleton {
+  .notice-row-skeleton {
-    width: 266rpx;
+    width: 100%;
-    height: 28rpx;
+    height: 32rpx;
-    border-radius: 6rpx;
+    border-radius: 8rpx;
+  }
+
+  .header-right {
+    display: flex;
+    align-items: center;
+    gap: 10rpx;
+    flex-shrink: 0;
+  }
+
+  .location-pill-skeleton {
+    width: 200rpx;
+    height: 72rpx;
+    border-radius: 999rpx;
+  }
+
+  .cart-btn-skeleton {
+    width: 72rpx;
+    height: 72rpx;
+    border-radius: 50%;
   }
 }
 
-// 位置和通知区域
+// 搜索栏 + 消息按钮
-.location-notification {
-  padding: 22rpx 30rpx 0;
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  
-  .location-skeleton {
-    width: 329rpx;
-    height: 30rpx;
-    border-radius: 6rpx;
-  }
-  
-  .notification-skeleton {
-    width: 132rpx;
-    height: 60rpx;
-    border-radius: 30rpx;
-  }
-}
-
-// 搜索栏
 .search-section {
-  padding: 32rpx 30rpx 0;
+  padding: 20rpx 24rpx 0;
-  
+
+  .search-row {
+    display: flex;
+    align-items: center;
+    gap: 14rpx;
+  }
+
   .search-bar-skeleton {
-    width: 690rpx;
+    flex: 1;
+    min-width: 0;
     height: 88rpx;
     border-radius: 44rpx;
   }
+
+  .message-btn-skeleton {
+    width: 74rpx;
+    height: 74rpx;
+    border-radius: 50%;
+    flex-shrink: 0;
+  }
 }
 
 // 分类滚动区域

src/pages/home/components/tabbar-home/components/home-top-header.vue

@@ -0,0 +1,159 @@
+<script setup lang="ts">
+import { computed } from 'vue'
+import { useI18n } from 'vue-i18n'
+
+const { t } = useI18n()
+
+defineProps<{
+  appName: string
+  locationText: string
+  cartBadgeTotal?: number
+  isLogin?: boolean
+}>()
+
+const emit = defineEmits<{
+  (e: 'clickLocation'): void
+  (e: 'clickCart'): void
+}>()
+
+const noticeTexts = computed(() => [
+  t('pages.home.noticeBar.thursday'),
+  t('pages.home.noticeBar.sunday'),
+  t('pages.home.noticeBar.freshCatch'),
+])
+
+/** 横向无缝滚动：多条拼接为一条，重复一遍避免循环时跳变 */
+const noticeScrollText = computed(() => {
+  const items = noticeTexts.value.filter(Boolean)
+  if (!items.length) return ''
+  const once = items.join('　　')
+  return `${once}　　${once}`
+})
+</script>
+
+<template>
+  <view class="home-top-header px-24rpx pt-12rpx pb-8rpx">
+    <view class="home-top-header__toolbar flex items-center justify-between gap-12rpx">
+      <view class="flex items-center gap-14rpx min-w-0 flex-1">
+        <image
+          src="@img/logo.png"
+          class="w-52rpx h-52rpx shrink-0"
+          style="border-radius: 50%"
+        />
+        <text class="text-32rpx lh-36rpx text-#1a1a1a font-bold tracking-tight line-clamp-1">
+          {{ appName }}
+        </text>
+      </view>
+      <view class="flex items-center gap-10rpx shrink-0">
+        <view class="home-loc-pill" @click="emit('clickLocation')">
+          <text class="home-loc-pill__text line-clamp-1">
+            {{ locationText || t('pages.home.default-location') }}
+          </text>
+          <image
+            src="@img/chef/119.png"
+            class="home-loc-pill__arrow w-20rpx h-20rpx shrink-0 op-50 mt-2rpx"
+          />
+        </view>
+        <view class="home-cart-btn" @click="emit('clickCart')">
+          <view class="i-carbon:shopping-cart text-36rpx text-#14181b" />
+          <view
+            v-if="isLogin && (cartBadgeTotal || 0) > 0"
+            class="home-cart-badge"
+          >
+            {{ (cartBadgeTotal || 0) > 99 ? '99+' : cartBadgeTotal }}
+          </view>
+        </view>
+      </view>
+    </view>
+
+    <view class="home-notice-wrap mt-10rpx">
+      <wd-notice-bar
+        :text="noticeScrollText"
+        :delay="1"
+        :speed="60"
+        color="#00A76D"
+        background-color="transparent"
+        custom-class="home-notice-bar"
+      />
+    </view>
+  </view>
+</template>
+
+<style scoped lang="scss">
+.home-top-header {
+  background: #f2f2f2;
+}
+
+.home-notice-wrap {
+  width: 100%;
+
+  :deep(.home-notice-bar) {
+    padding: 0;
+    font-size: 26rpx;
+    line-height: 32rpx;
+    border-radius: 0;
+    background: transparent !important;
+  }
+
+  :deep(.wd-notice-bar__wrap) {
+    height: 32rpx;
+    line-height: 32rpx;
+    overflow: hidden;
+  }
+
+  :deep(.wd-notice-bar__content) {
+    font-size: 26rpx;
+    line-height: 32rpx;
+    white-space: nowrap;
+  }
+}
+
+.home-loc-pill {
+  display: flex;
+  align-items: center;
+  gap: 8rpx;
+  max-width: 200rpx;
+  padding: 12rpx 18rpx;
+  background: #fff;
+  border-radius: 999rpx;
+  box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
+}
+
+.home-loc-pill__text {
+  flex: 1;
+  min-width: 0;
+  font-size: 22rpx;
+  line-height: 28rpx;
+  font-weight: 500;
+  color: #333;
+}
+
+.home-cart-btn {
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 72rpx;
+  height: 72rpx;
+  flex-shrink: 0;
+  background: #fff;
+  border-radius: 50%;
+  box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.07);
+}
+
+.home-cart-badge {
+  position: absolute;
+  top: 4rpx;
+  right: 4rpx;
+  min-width: 28rpx;
+  height: 28rpx;
+  padding: 0 6rpx;
+  font-size: 18rpx;
+  line-height: 28rpx;
+  font-weight: 600;
+  color: #fff;
+  text-align: center;
+  background: #e23636;
+  border-radius: 999rpx;
+}
+</style>

src/pages/home/components/tabbar-home/components/msg-box.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import { useUserStore } from "@/store";
+import { useUserStore } from '@/store';
-const emit = defineEmits(['toggleNotOpen']);
 const userStore = useUserStore();
+
 function navigateTo(url: string) {
   if(userStore.checkLogin()) {
     uni.navigateTo({
@@ -9,18 +9,42 @@ function navigateTo(url: string) {
     });
   }
 }
+
+
+function onFabClick() {
+  navigateTo('/pages/ai/recommend/index')
+}
 </script>
 
 <template>
-  <view class="flex items-center">
+  <!-- 仅 AI 跳转做右侧球体悬浮 -->
-    <view @click="navigateTo('/pages-user/pages/message/index')" class="w-40rpx h-40rpx mr-42rpx relative">
+  <view
-      <view v-if="userStore.isLogin && userStore.unreadMessageCount > 0" class="w-32rpx h-32rpx bg-#E23636 absolute z-2 top--16rpx right--16rpx rounded-50% text-24rpx text-#fff text-center line-height-32rpx">{{ userStore.unreadMessageCount }}</view>
+    class="ai-floating"
-      <image src="@img/chef/114.png" class="w-40rpx h-40rpx"></image>
+  >
+    <view class="ai-fab" @click="onFabClick">
+      <image src="@/static/app/images/aidiancan.gif" class="ai-icon"></image>
     </view>
-    <image @click="emit('toggleNotOpen')" src="@img/chef/115.png" class="w-40rpx h-40rpx"></image>
   </view>
 </template>
 
 <style scoped lang="scss">
+.ai-floating {
+  position: fixed;
+  right: 12rpx;
+  top: 83%;
+  z-index: 88;
+  display: block;
+  transform: translateY(-50%) translateX(0);
+  transition: transform 0.22s ease;
+}
 
+.ai-floating.is-collapsed {
+  transform: translateY(-50%) translateX(55rpx);
+}
+
+.ai-icon {
+  width: 260rpx;
+  height: 260rpx;
+  margin-right:-70rpx !important;
+}
 </style>

src/pages/home/components/tabbar-home/components/search.vue

@@ -1,5 +1,7 @@
 <script setup lang="ts">
 const { t } = useI18n()
+import { useUserStore } from '@/store'
+const userStore = useUserStore()
 
 const props = defineProps({
   isAutoJump: {
@@ -20,15 +22,71 @@ function handleClickSearch() {
     emit('clickSearch')
   }
 }
+
+function goMessage() {
+  if (userStore.checkLogin()) {
+    uni.navigateTo({
+      url: '/pages-user/pages/message/index',
+    })
+  }
+}
 </script>
 
 <template>
-<view @click="handleClickSearch" class="flex items-center h-88rpx bg-#F2F3F6 rounded-44rpx pl-36rpx">
+  <view class="home-search-row flex items-center gap-14rpx">
-  <image src="@img/chef/100222.png" class="w-28rpx h-28rpx"></image>
+    <view
-  <text class="text-30rpx text-#434343 ml-16rpx tracking-[.04em] font-500">{{ t('components.search.placeholder') }}</text>
+      @click="handleClickSearch"
-</view>
+      class="home-search-bar flex-1 min-w-0 flex items-center h-88rpx rounded-44rpx pl-36rpx pr-28rpx bg-white"
+    >
+      <image src="@img/chef/100222.png" class="w-28rpx h-28rpx shrink-0"></image>
+      <text class="home-search-placeholder text-28rpx ml-16rpx tracking-[.04em] font-500 truncate">{{
+        t('components.search.placeholder')
+      }}</text>
+    </view>
+    <view class="home-msg-btn" @click="goMessage">
+      <view
+        v-if="userStore.isLogin && userStore.unreadMessageCount > 0"
+        class="home-msg-badge"
+      >
+        {{ userStore.unreadMessageCount > 99 ? '99+' : userStore.unreadMessageCount }}
+      </view>
+      <image src="@img/chef/114.png" class="w-34rpx h-34rpx"></image>
+    </view>
+  </view>
 </template>
 
 <style scoped lang="scss">
-
+.home-search-bar {
+  box-shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.06);
+}
+.home-search-placeholder {
+  color: #9a9a9a;
+}
+.home-msg-btn {
+  position: relative;
+  width: 74rpx;
+  height: 74rpx;
+  border-radius: 50%;
+  background: #fff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.06);
+  flex-shrink: 0;
+}
+.home-msg-badge {
+  position: absolute;
+  right: -6rpx;
+  top: -6rpx;
+  min-width: 26rpx;
+  height: 26rpx;
+  padding: 0 5rpx;
+  border-radius: 999rpx;
+  background: #E23636;
+  color: #fff;
+  font-size: 16rpx;
+  line-height: 26rpx;
+  text-align: center;
+  font-weight: 500;
+}
 </style>

src/pages/home/components/tabbar-home/components/tabs-type.vue

@@ -1,5 +1,9 @@
 <script setup lang="ts">
+import { computed } from 'vue'
+import { useI18n } from 'vue-i18n'
+
 const props = defineProps({
+  /** 外部列表（菜谱页等）；首页不传则使用固定七项 */
   list: {
     type: Array,
     default: () => [],
@@ -21,74 +25,109 @@ const props = defineProps({
     default: 'logoUrl',
   },
 })
-const emit = defineEmits(['changeType']);
-watchEffect(() => {
-  if (props.currentId) {
-    selectedIndex.value = props.currentId;
-  }
-});
 
-const selectedIndex = ref();
+const emit = defineEmits(['changeType'])
+const { t } = useI18n()
 
-function selectTab(item: any) {
+const fixedTabs = [
-  selectedIndex.value = item[props.valueKey];
+  {
-  // 触发父组件事件
+    id: 'fresh-seafood-today',
-  console.log('selectTab', item[props.valueKey]);
+    nameKey: 'pages.home.quickTabs.freshSeafoodToday',
-  emit('changeType', item[props.valueKey]);
+    logoUrl: '/static/app/images/home/xiandahaixian.png',
+  },
+  {
+    id: 'new-calendar',
+    nameKey: 'pages.home.quickTabs.newCalendar',
+    logoUrl: '/static/app/images/home/shangxinrili.png',
+  },
+  {
+    id: 'member-zone',
+    nameKey: 'pages.home.quickTabs.memberZone',
+    logoUrl: '/static/app/images/home/huiyuanzhuanqu.png',
+  },
+  {
+    id: 'must-eat-list',
+    nameKey: 'pages.home.quickTabs.mustEatList',
+    logoUrl: '/static/app/images/home/bichibang.png',
+  },
+  {
+    id: 'group-catering',
+    nameKey: 'pages.home.quickTabs.groupCatering',
+    logoUrl: '/static/app/images/home/tancanyuding.png',
+  },
+  {
+    id: 'live-seafood-air',
+    nameKey: 'pages.home.quickTabs.liveSeafoodAir',
+    logoUrl: '/static/app/images/home/kongyunhaixian.png',
+  },
+  {
+    id: 'energy-meal',
+    nameKey: 'pages.home.quickTabs.energyMeal',
+    logoUrl: '/static/app/images/home/nengliangcan.png',
+  },
+]
+
+const useFixedTabs = computed(() => !props.list || props.list.length === 0)
+
+function selectTab(item: Record<string, unknown>) {
+  emit('changeType', item[props.valueKey])
 }
+
+function getTabName(item: Record<string, unknown>) {
+  if (useFixedTabs.value && item.nameKey) {
+    return t(String(item.nameKey))
+  }
+  return item[props.labelKey]
+}
+
+function getImage(item: Record<string, unknown>) {
+  return String(item[props.imgKey] ?? '')
+}
+
+const displayList = computed(() =>
+  useFixedTabs.value ? fixedTabs : props.list,
+)
 </script>
 
 <template>
   <scroll-view :scroll-x="true">
     <view class="flex items-center">
       <view class="shrink-0 w-30rpx"></view>
-      <template v-for="(item, index) in list" :key="index">
+      <view
-        <view
+        v-for="(item, index) in displayList"
-          :class="[index === 0 ? '' : 'ml-40rpx']"
+        :key="String((item as Record<string, unknown>)[valueKey] ?? (item as Record<string, unknown>).id ?? index)"
-          class="w-112rpx flex flex-col items-center"
+        :class="[index === 0 ? '' : 'ml-40rpx']"
-          @click="selectTab(item)"
+        class="tab-item shrink-0 flex flex-col items-center"
-        >
+        @click="selectTab(item as Record<string, unknown>)"
-          <view
+      >
-            :class="['img-wrap', selectedIndex == item[props.valueKey] ? 'img-selected' : '']"
+        <image
-          >
+          class="tab-img"
-            <image
+          :src="getImage(item as Record<string, unknown>)"
-              class="tab-img rounded-50% overflow-hidden bg-common"
+          mode="heightFix"
-              :src="item[props.imgKey]"
+        />
-              mode="aspectFill"
+        <text class="tab-label line-clamp-1">{{ getTabName(item as Record<string, unknown>) }}</text>
-            ></image>
+      </view>
-          </view>
-          <text
-            :class="selectedIndex == item[props.valueKey] ? 'text-#CE7138' : 'text-#333'"
-            class="line-clamp-1 text-20rpx lh-20rpx mt-12rpx font-500"
-            >{{ item[props.labelKey] }}</text
-          >
-        </view>
-      </template>
       <view class="shrink-0 w-30rpx op-0">1</view>
     </view>
   </scroll-view>
 </template>
 
 <style scoped lang="scss">
-.img-wrap {
+.tab-item {
-  display: flex;
+  min-width: 94rpx;
-  align-items: center;
-  justify-content: center;
-  transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.2s;
-  width: 132rpx;
-  height: 132rpx;
 }
-.img-selected {
+
-  border: 4rpx solid #ce7138;
+.tab-label {
-  border-radius: 50%;
+  margin-top: 10rpx;
-  overflow: hidden;
+  font-size: 22rpx;
-  box-sizing: border-box;
+  line-height: 28rpx;
+  color: #333;
+  white-space: nowrap;
 }
 
 .tab-img {
-  width: 112rpx;
+  height: 144rpx;
-  height: 112rpx;
+  display: block;
-  border-radius: 50%;
+  margin-bottom: 10rpx;
-  transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
 }
 </style>

src/pages/home/components/tabbar-home/tabbar-home.vue

@@ -1,4 +1,6 @@
 <script setup lang="ts">
+import { ref, computed } from 'vue'
+import { useI18n } from 'vue-i18n'
 import useEventEmit from "@/hooks/useEventEmit";
 import {CollectionType, EventEnum} from "@/constant/enums";
 import { useConfigStore, useUserStore } from "@/store";
@@ -6,6 +8,7 @@ import Config from '@/config/index'
 import { debounce } from 'throttle-debounce'
 import MsgBox from "@/pages/home/components/tabbar-home/components/msg-box.vue";
 import Search from "@/pages/home/components/tabbar-home/components/search.vue";
+import HomeTopHeader from "@/pages/home/components/tabbar-home/components/home-top-header.vue";
 import ClassBullet from "./components/class-bullet.vue";
 import TabsType from "./components/tabs-type.vue";
 import FeaturedOn from "./components/featured-on/index.vue";
@@ -16,7 +19,6 @@ import HomeSkeleton from "./components/home-skeleton.vue";
 import {
   appMarketActivityListPost,
   appMerchantCartListMerchantPost,
-  appMerchantCategoryListGet,
   appMerchantFeaturedListPost,
   appMerchantLabelListGet,
   appMerchantNearbyListPost, appMerchantRecommendListPost,
@@ -25,6 +27,11 @@ import {
 } from "@/service";
 import usePage from "@/hooks/usePage";
 import {getFeaturedDishList} from "@/pages-store/service";
+import {
+  buildQuickTopicUrl,
+  isQuickTopicSlug,
+} from '@/pages-store/pages/dishes/utils/quick-topic-route'
+import { formatSalesCount } from "@/utils/utils";
 const configStore = useConfigStore();
 const userStore = useUserStore();
 const props = defineProps<{
@@ -32,7 +39,35 @@ const props = defineProps<{
   price?: Array<string> | string;
 }>();
 const emit = defineEmits(["toggleScore", "togglePrice", "toggleNotOpen"]);
-const { t } = useI18n();
+const { t, locale } = useI18n();
+
+/** 首页运营图：按语言切换（中文 / 英文） */
+const HOME_PROMO_BANNERS = {
+  memberUpgrade: {
+    zh: 'https://www.howhowfresh.com/minio/ruoyi/2026/06/05/d4a0d40503ac4206a0387af1ab869de6.png',
+    en: 'https://www.howhowfresh.com/minio/ruoyi/2026/06/05/c01f1664626d417a9a7ca6165a20f06f.png',
+  },
+  deliveryTime: {
+    zh: 'https://www.howhowfresh.com/minio/ruoyi/2026/06/03/c5673a8874594755bdde7ed7fcbd1982.jpg',
+    en: 'https://www.howhowfresh.com/minio/ruoyi/2026/06/03/1da02f1e0af34cea91a4f643247176be.png',
+  },
+} as const
+
+const isEnglishLocale = computed(() =>
+  String(locale.value || uni.getLocale() || '').toLowerCase().startsWith('en'),
+)
+
+const memberUpgradeBannerSrc = computed(() =>
+  isEnglishLocale.value
+    ? HOME_PROMO_BANNERS.memberUpgrade.en
+    : HOME_PROMO_BANNERS.memberUpgrade.zh,
+)
+
+const deliveryTimeBannerSrc = computed(() =>
+  isEnglishLocale.value
+    ? HOME_PROMO_BANNERS.deliveryTime.en
+    : HOME_PROMO_BANNERS.deliveryTime.zh,
+)
 
 const loading = ref(false)
 
@@ -41,6 +76,13 @@ function isSoldOutStock(stockLike: unknown) {
   return !Number.isNaN(n) && n <= 0
 }
 
+/** 底部营销条文案（接口若返回 marketingLabel / hotSaleTag 等则展示） */
+function getDishPromoLabel(item: Record<string, unknown>): string {
+  const raw = item.marketingLabel ?? item.hotSaleTag ?? item.rankTag ?? item.promotionLabel
+  return typeof raw === 'string' && raw.trim() ? raw.trim() : ''
+}
+
+
 function navigateTo(url: string) {
   if(userStore.checkLogin()) {
     uni.navigateTo({
@@ -49,17 +91,15 @@ function navigateTo(url: string) {
   }
 }
 
-const swiperList = ref([]);
+const swiperList = ref<any[]>([])
-const currentSwiper = ref(0);
 
 async function initData() {
   // 只在首次加载时显示骨架屏，避免切换时的白屏
   if(featuredList.value.length === 0) {
     loading.value = true
   }
-  appMarketActivityList()
+  getAppMarketActivityList()
   getAppMerchantLabelList()
-  getAppMerchantCategoryList()
   getAppFeaturedList()
   getAppNearbyListPost()
   // 获取当前用户购物车信息
@@ -89,12 +129,21 @@ defineExpose({
   init: getIndexList,
 });
 
-// 获取轮播图列表
+/** 首页轮播：POST /app/marketActivity/list */
-function appMarketActivityList() {
+function getAppMarketActivityList() {
-  appMarketActivityListPost({}).then(res=> {
+  appMarketActivityListPost({})
-    console.log('互动列表', res)
+    .then((res) => {
-    swiperList.value = res.data
+      const list = Array.isArray(res?.data) ? res.data : []
-  })
+      swiperList.value = list
+        .filter((item) => item?.activityImageUrl || item?.activityImage)
+        .map((item) => ({
+          ...item,
+          activityImage: item.activityImageUrl || item.activityImage,
+        }))
+    })
+    .catch(() => {
+      swiperList.value = []
+    })
 }
 
 // 滚动信息获取 APP-商家标签分类控制器(用户端首页上面左右滚动的)
@@ -109,15 +158,7 @@ function getAppMerchantLabelList() {
   //   appMerchantLabelList.value = res.data || []
   // })
 }
-// 查询所有商家分类数据
-const appMerchantCategoryList = ref([])
 const currentCategory = ref('')
-function getAppMerchantCategoryList() {
-  appMerchantCategoryListGet({}).then((res: any) => {
-    console.log('查询所有商家分类数据', res)
-    appMerchantCategoryList.value = res.data || []
-  })
-}
 
 // 查询精选商家列表(首页)
 const featuredList = ref([])
@@ -193,11 +234,32 @@ function handleItemClick(e) {
   merchantLabelId.value = e.id
   // paging.value.refresh()
 }
-function tabsTypeChange(id: string) {
+function tabsTypeChange(id: string | number) {
-  currentCategory.value = id
+  const topic = String(id)
-  navigateTo('/pages-store/pages/home-store/index?merchantCategoryIds=' + id)
+  if (topic === 'energy-meal') {
-  // console.log('分类切换', id)
+    navigateTo('/pages-store/pages/energy-meal/index')
-  // paging.value.refresh()
+    return
+  }
+  if (topic === 'group-catering') {
+    navigateTo('/pages-store/pages/group-catering/index')
+    return
+  }
+  if (!isQuickTopicSlug(topic)) {
+    return
+  }
+  currentCategory.value = topic
+  const titleKeys: Record<string, string> = {
+    'member-zone': 'pages.home.quickTabs.memberZone',
+    'live-seafood-air': 'pages.home.quickTabs.liveSeafoodAir',
+    'must-eat-list': 'pages.home.quickTabs.mustEatList',
+    'new-calendar': 'pages.home.quickTabs.newCalendar',
+    'fresh-seafood-today': 'pages.home.quickTabs.freshSeafoodToday',
+  }
+  navigateTo(
+    buildQuickTopicUrl(topic, {
+      categoryName: t(titleKeys[topic]),
+    }),
+  )
 }
 
 // 是否展示精选商家和附近商家 true 显示 false隐藏
@@ -209,11 +271,38 @@ const isShowMerchant = computed(()=> {
   }
 })
 
+// 精选菜品瀑布流：按序均分到两列（0,2,4… / 1,3,5…），分页追加后仍交错排列
+const featuredDishColumns = computed(() => {
+  const list = dataList.value
+  return [
+    list.filter((_, i) => i % 2 === 0),
+    list.filter((_, i) => i % 2 === 1),
+  ]
+})
+
+/** 顶栏购物车角标（多商家购物车汇总件数） */
+const cartBadgeTotal = computed(() => {
+  const list = userStore.userCartAllData
+  if (!Array.isArray(list) || list.length === 0) return 0
+  let n = 0
+  for (const m of list) {
+    n += (m as { merchantCartVoList?: unknown[] })?.merchantCartVoList?.length || 0
+  }
+  return n
+})
+
+function goCart() {
+  navigateTo('/pages-user/pages/cart/index')
+}
+
 // 手动触发下拉刷新了
 function onRefresh() {
   console.log('手动触发下拉刷新了')
   merchantLabelId.value = ''
   currentCategory.value = ''
+  getAppMarketActivityList()
+  getAppFeaturedList()
+  getAppNearbyListPost()
   paging.value.refresh()
 }
 
@@ -221,7 +310,7 @@ function handleClickSwiper(item: any) {
   console.log(item, '点击轮播图')
   switch (Number(item.activityType)) {
     case 1: // 商家列表
-      navigateTo('/pages-store/pages/list/index?id=')
+      navigateTo('/pages-store/pages/list/index')
       break
     case 2: // 活动菜品列表
       navigateTo('/pages-store/pages/dishes/index?id=' + item.id)
@@ -229,6 +318,12 @@ function handleClickSwiper(item: any) {
     case 3: // 会员
       navigateTo('/pages-user/pages/member/index')
       break
+    case 5: // 充值活动
+      navigateTo('/pages-user/pages/recharge/activity-detail?id=' + item.id)
+      break
+//    case 4:
+//     navigateTo('/pages/ai/chat/index')
+//      break
   }
 }
 
@@ -261,7 +356,7 @@ const debouncedEmit = debounce(1300, (isCollected: boolean, id: string, type: Co
 
 <template>
   <view
-    class="bg-#fff"
+    class="home-page-root"
     :style="[
       {
         height: configStore.windowHeight + 'px',
@@ -271,22 +366,14 @@ const debouncedEmit = debounce(1300, (isCollected: boolean, id: string, type: Co
       <z-paging @onRefresh="onRefresh" ref="paging" v-model="dataList" :auto="false" @query="queryList" @scroll="onPageScroll" :refresher-enabled="true" :auto-show-back-to-top="false">
         <template #top>
           <status-bar />
-          <view class="flex items-center pt-18rpx px-30rpx pb-20rpx">
+          <home-top-header
-<!--            <text class="text-52rpx lh-52rpx text-#333 font-bold shrink-0">{{Config.appName}}</text>-->
+            :app-name="Config.appName"
-            <image
+            :location-text="userStore.userLocation.location"
-                src="@img/logo.png"
+            :cart-badge-total="cartBadgeTotal"
-                class="w-52rpx h-52rpx shrink-0"
+            :is-login="userStore.isLogin"
-            ></image>
+            @click-location="navigateTo('/pages-user/pages/search-address/index')"
-            <view class="bg-#D8D8D8 w-1rpx h-40rpx mx-14rpx"></view>
+            @click-cart="goCart"
-            <view @click="navigateTo('/pages/address/index')" class="text-#00A76D text-28rpx lh-28rpx flex items-center">
+          />
-              <text v-if="userStore.appointmentTimeShow">{{ t('pages.address.appTime') }}:{{ userStore.appointmentTimeShow }}</text>
-              <text v-else>{{ t('pages.address.reservation') }}</text>
-              <image
-                  src="@img/chef/119.png"
-                  class="w-24rpx h-24rpx ml-6rpx mt-4rpx shrink-0"
-              ></image>
-            </view>
-          </view>
         </template>
         <view
             class="animate-in fade-in animate-ease-out animate-duration-300"
@@ -294,169 +381,422 @@ const debouncedEmit = debounce(1300, (isCollected: boolean, id: string, type: Co
         >
           <home-skeleton />
         </view>
-        <view class="flex-center-sb px-30rpx pt-34rpx">
+        <view class="px-24rpx pt-12rpx pb-8rpx">
-          <!--展示用户的定位城市，如果用户没有使用定位则展示选择的城市，用户选择城市后，需要更新定位城市-->
-          <view @click="navigateTo('/pages-user/pages/search-address/index')" class="flex items-center text-30rpx text-#333 font-500">
-            <text class="line-clamp-1">
-              {{ userStore.userLocation.location || t('pages.home.default-location') }}
-            </text>
-            <image
-                src="@img/chef/101.png"
-                class="w-24rpx h-24rpx ml-10rpx mt-6rpx shrink-0"
-            ></image>
-          </view>
-          <view class="shrink-0 ml-40rpx">
-            <msg-box @toggleNotOpen="toggleNotOpen" />
-          </view>
-        </view>
-        <view class="px-30rpx mt-32rpx pb-22rpx">
           <search />
-          <!-- 分类滚动区域 -->
+          <msg-box />
-          <view class="mt-40rpx" v-if="appMerchantLabelList.length > 0">
+          <!-- 分类标签 -->
+          <view class="mt-28rpx" v-if="appMerchantLabelList.length > 0">
             <class-bullet :categories="appMerchantLabelList" @itemClick="handleItemClick" />
           </view>
         </view>
+        <!-- 轮播图：/app/marketActivity/list -->
         <swiper
+            v-if="swiperList.length > 0"
             class="card-swiper"
-            :circular="true"
+            :circular="swiperList.length > 1"
-            :autoplay="true"
+            :autoplay="swiperList.length > 1"
-            previous-margin="60rpx"
-            next-margin="60rpx"
         >
-          <template v-for="item in swiperList" :key="item.id">
+          <swiper-item
-            <swiper-item @click="handleClickSwiper(item)" class="">
+            v-for="(item, sIdx) in swiperList"
-              <image
+            :key="item.id ?? sIdx"
-                  :src="item.activityImage"
+            @click="handleClickSwiper(item)"
-                  class="swiper-item-content w-full h-100% rounded-24rpx bg-common"
+          >
-              ></image>
+            <image
-            </swiper-item>
+                :src="item.activityImage"
-          </template>
+                class="swiper-item-content w-full h-100%"
+                mode="scaleToFill"
+            ></image>
+          </swiper-item>
         </swiper>
 
-        <!-- 分类滚动区域 -->
+        <!-- 快捷入口（固定五项，跳转精选菜品专题页） -->
-        <tabs-type @changeType="tabsTypeChange" v-if="appMerchantCategoryList.length > 0" :list="appMerchantCategoryList" :currentId="currentCategory" class="mt-22rpx" />
+        <tabs-type
+          :current-id="currentCategory"
+          class="mt-28rpx mb-24rpx home-tabs-quick"
+          @change-type="tabsTypeChange"
+        />
 
-        <!-- 筛选工具 -->
+        <view
-<!--        <filtrate-tool class="mt-32rpx" @togglePickup="togglePickup" @toggleDiscount="toggleDiscount" @toggleScore="toggleScore" @togglePrice="togglePrice" />-->
+          class="home-member-banner"
-
+          :style="{ backgroundImage: `url(${memberUpgradeBannerSrc})` }"
-        <view class="animate-in fade-in animate-ease-in animate-duration-300" v-if="isShowMerchant">
+        >
-          <!-- Featured on ChefLink 精选商家 -->
+          <view class="home-member-banner__actions">
-          <view v-if="featuredList.length > 0" class="mt-56rpx">
             <view
-                class="mb-30rpx pl-30rpx text-36rpx lh-36rpx text-#333 font-bold"
+              class="home-member-banner__btn"
-            >{{ t('pages.home.featured-on') }}</view>
+              @click="navigateTo('/pages-user/pages/member/index')"
+            >
+              <text class="home-member-banner__btn-text">{{ t('pages.home.open-member') }}</text>
+            </view>
+            <view
+              class="home-member-banner__btn"
+              @click="navigateTo('/pages-user/pages/recharge/index')"
+            >
+              <text class="home-member-banner__btn-text">{{ t('pages.home.recharge-now') }}</text>
+            </view>
+          </view>
+        </view>
+        <image
+          :src="deliveryTimeBannerSrc"
+          class="w-100% h-[200rpx] rounded-24rpx mt-4rpx"
+          mode="widthFix"
+        />
+        <!-- 精选商家和附近商家 -->
+        <view class="animate-in fade-in animate-ease-in animate-duration-300" v-if="isShowMerchant">
+          <!-- Featured on ChefLink 精选商家（浅底 + 横向卡片，对齐设计稿） -->
+          <view v-if="featuredList.length > 0" class="featured-merchants-section mt-36rpx px-24rpx pt-8rpx pb-16rpx">
+            <view class="mb-24rpx px-6rpx text-28rpx lh-36rpx text-#1a1a1a">
+              {{ t('pages.home.featured-on') }}
+            </view>
             <featured-on :list="featuredList" />
           </view>
 
           <!-- Nearby Merchants 附近商家 -->
-          <view v-if="nearbyList.length > 0" class="mt-56rpx">
+          <view v-if="nearbyList.length > 0" class="nearby-merchants-block mt-36rpx px-24rpx pb-16rpx">
-            <view
+            <view class="mb-24rpx px-6rpx text-28rpx lh-36rpx text-#1a1a1a ">
-                class="mb-32rpx pl-30rpx text-36rpx lh-36rpx text-#333 font-bold"
+              {{ t('pages.home.nearby-merchants') }}
-            >{{ t('pages.home.nearby-merchants') }}</view>
+            </view>
             <nearby-merchants :list="nearbyList" />
           </view>
         </view>
 
-        <!-- List -->
+        <!-- List 精选菜品瀑布流（浅底 + 白卡片 + 阴影，结构对齐设计稿） -->
-        <view class="mt-56rpx px-30rpx">
+        <view class="featured-dishes-section mt-36rpx px-24rpx pb-40rpx">
-          <view class="mb-32rpx text-36rpx lh-36rpx text-#333 font-bold"
+          <view class="mb-24rpx px-6rpx text-28rpx lh-36rpx text-#1a1a1a "
           >{{ t('pages.home.featured-dishes') }}</view>
-          <template v-for="(item, index) in dataList" :key="index">
+          <view class="waterfall-row flex gap-16rpx items-start">
-            <view @click="navigateToDishes(item)" class="w-100% mb-30rpx">
+            <view
-              <view class="relative h-448rpx rounded-24rpx mb-28rpx">
+              v-for="(col, colIndex) in featuredDishColumns"
-                <view @click.stop="handleDishCollectionClick(item)" class="w-68rpx h-68rpx absolute z-2 top-0 right-0">
+              :key="colIndex"
+              class="waterfall-col flex-1 min-w-0 flex flex-col gap-16rpx"
+            >
+              <view
+                v-for="item in col"
+                :key="item.id || String(item.merchantId) + '-' + item.dishName"
+                @click="navigateToDishes(item)"
+                class="featured-dish-card w-full"
+              >
+                <view class="featured-dish-image">
+                  <view v-if="item.isNew == 1" class="dish-new-ribbon">
+                    <text class="dish-new-ribbon__text">NEW</text>
+                  </view>
                   <image
-                      v-if="!item.isCollect"
+                      :src="item?.dishImage?.split(',')[0]"
-                      src="@img-store/1334.png"
                       mode="aspectFill"
-                      class="w-full h-full"
+                      class="featured-dish-img"
+                  />
+                  <view
+                    v-if="isSoldOutStock(item?.stock)"
+                    class="featured-dish-sold-dim"
                   />
                   <image
-                      v-else
+                    v-if="isSoldOutStock(item?.stock)"
-                      src="@img-store/1337.png"
+                    src="/static/app/images/SoldOut.png"
-                      mode="aspectFill"
-                      class="w-full h-full"
-                  />
-                </view>
-                <view
-                  v-if="isSoldOutStock(item?.stock)"
-                  class="absolute z-2 left-20rpx top-20rpx px-16rpx h-52rpx rounded-26rpx bg-#14181B/70 center text-26rpx text-#fff font-500"
-                >
-                  已售完
-                </view>
-                <image
-                    :src="item?.dishImage?.split(',')[0]"
                     mode="aspectFill"
-                    class="w-full h-full rounded-24rpx bg-common"
+                    class="featured-dish-sold-overlay"
-                />
+                  />
-              </view>
+                  <view
-              <view class="line-clamp-1 text-30rpx text-#333 font-500">
+                    @click.stop="handleDishCollectionClick(item)"
-                {{ item?.dishName }}
+                    class="featured-dish-collect w-56rpx h-56rpx absolute z-4 top-12rpx right-12rpx center"
-              </view>
+                  >
-              <view class="flex-center-sb mt-12rpx">
+                    <image
-                <text class="text-32rpx lh-30rpx text-#333 font-500">US${{ item?.discountPrice }}</text>
+                        v-if="!item.isCollect"
-                <view
+                        src="@img-store/1334.png"
-                  v-if="Number(item?.memberPrice) > 0"
+                        mode="aspectFill"
-                  class="member-price-tag text-[#FBE3C3] font-500 text-30rpx lh-30rpx center pl-6rpx break-all"
+                        class="w-44rpx h-44rpx featured-dish-collect-icon"
-                >
+                    />
-                  <text>{{ t('pages-store.store.members') }}: </text>
+                    <image
-                  ${{ item?.memberPrice }}
+                        v-else
+                        src="@img-store/1337.png"
+                        mode="aspectFill"
+                        class="w-44rpx h-44rpx featured-dish-collect-icon"
+                    />
+                  </view>
                 </view>
-              </view>
+                <view class="featured-dish-body">
-              <view class="flex-center-sb mt-12rpx">
+                  <view class="featured-dish-meta flex items-start justify-between gap-12rpx mb-14rpx">
-                <view class="text-28rpx text-#999">
+                    <view class="min-w-0 flex-1">
-                  <view class="line-through">US${{ item?.originalPrice }}</view>
+                      <text class="featured-dish-price">US${{item?.originalPrice }}</text>
-                  <view>{{ t('pages-store.store.sales') }}:{{ item?.salesCount }}</view>
+                      <!-- <text
-                </view>
+                        v-if="Number(item?.originalPrice) > Number(item?.discountPrice)"
-
+                        class="featured-dish-original"
-                <view class="center w-64rpx h-64rpx rounded-50% bg-white shadow-lg">
+                      >US${{ item?.originalPrice }}</text> -->
-                  <image
+                    </view>
-                      src="@img/chef/1285.png"
+                    <text class="featured-dish-sales shrink-0">{{ t('pages-store.store.sales') }}: {{ formatSalesCount(item?.salesCount) }}</text>
-                      class="w-30rpx h-30rpx shrink-0"
+                  </view>
-                  ></image>
+                  <view class="featured-dish-title line-clamp-2 mb-16rpx">
+                    {{ item?.dishName }}
+                  </view>
+                  <view class="flex items-center justify-between gap-12rpx">
+                    <view
+                      v-if="Number(item?.memberPrice) > 0"
+                      class="featured-dish-member shrink min-w-0"
+                    >
+                      <text class="featured-dish-member-inner">{{ t('pages-store.store.members') }}: US${{ item?.memberPrice }}</text>
+                    </view>
+                    <view v-else class="flex-1 min-w-0"></view>
+                    <view class="featured-dish-add shrink-0">
+                      <image
+                          src="/static/app/images/add_cart.png"
+                          class="featured-dish-add__icon"
+                      />
+                    </view>
+                  </view>
+                  <view
+                    v-if="getDishPromoLabel(item as Record<string, unknown>)"
+                    class="featured-dish-promo mt-16rpx"
+                  >
+                    <text class="featured-dish-promo-text">{{ getDishPromoLabel(item as Record<string, unknown>) }}</text>
+                  </view>
                 </view>
               </view>
             </view>
-          </template>
+          </view>
         </view>
         <template #bottom>
           <view class="h-50px"></view>
           <view :style="[configStore.iosSafeBottomPlaceholder]"></view>
         </template>
       </z-paging>
-    <view v-if="userStore.isLogin && userStore.userCartAllData.length > 0" @click="navigateTo('/pages-user/pages/cart/index')" class="fixed bottom-138rpx left-50% translate-x--50% px-26rpx h-88rpx bg-#14181B rounded-44rpx center text-28rpx text-#fff font-500">
+    <!-- 回到顶部（购物车已并入顶栏，不再使用底部浮条） -->
-      <image src="@img/chef/125.png" class="w-28rpx h-28rpx shrink-0"></image>
+    <view v-if="showBackToTop" @click="scrollToTop" class="home-back-top fixed left-30rpx w-88rpx h-88rpx bg-#14181B rounded-50% center shadow-lg">
-      <view class="ml-10rpx whitespace-nowrap">{{ userStore.userCartAllData[0]?.merchantName }}</view>
-      <view class="w-8rpx h-8rpx rounded-50% bg-white mx-8rpx"></view>
-      <text>{{ userStore.userCartAllData[0]?.merchantCartVoList?.length || 0 }}</text>
-    </view>
-    
-    <!-- 回到顶部按钮 -->
-    <view v-if="showBackToTop" @click="scrollToTop" class="fixed bottom-148rpx left-30rpx w-88rpx h-88rpx bg-#14181B rounded-50% center shadow-lg">
       <image src="@img/chef/119.png" class="w-40rpx h-40rpx shrink-0 rotate-180"></image>
     </view>
   </view>
 </template>
 
 <style scoped lang="scss">
+.home-page-root {
+  background: #f2f2f2;
+}
+
+.home-delivery-row {
+  padding-left: 2rpx;
+}
+
+.home-tabs-quick {
+  padding-left: 8rpx;
+  padding-right: 8rpx;
+}
+
+.home-member-banner {
+  position: relative;
+  width: 100%;
+  height: 550rpx;
+  background-size: 100% 100%;
+  background-position: center;
+  background-repeat: no-repeat;
+}
+
+.home-member-banner__actions {
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 5rpx;
+  padding: 0 40rpx;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 24rpx;
+}
+
+.home-member-banner__btn {
+  flex: 1;
+  height: 72rpx;
+  padding: 0 24rpx;
+  border-radius: 999rpx;
+  background: #21ae39;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.home-member-banner__btn-text {
+  font-size: 28rpx;
+  font-weight: 600;
+  color: #ffffff;
+  line-height: 1.2;
+}
+
+.nearby-merchants-block {
+  background: #f2f2f2;
+}
+
+/* 为底栏 Tab 预留空间，避免被遮挡 */
+.home-back-top {
+  bottom: calc(100rpx + env(safe-area-inset-bottom, 0px));
+}
+
 .card-swiper {
   height: 420rpx;
 }
 .swiper-item-content {
   width: 100%;
   height: 100%;
-  transform: scale(0.95);
+  transition: transform 0.3s ease;
-  border-radius: 20rpx;
-  transition: transform 0.3s;
 }
-.swiper-item-active .swiper-item-content {
+
-  transform: scale(1);
+
+/* 精选商家 / 精选菜品 区块（与页面背景统一） */
+.featured-merchants-section,
+.featured-dishes-section {
+  background: #f2f2f2;
 }
-.member-price-tag {
+
-  min-width: 220rpx;
+.featured-dish-collect-icon {
-  height: 42rpx;
+  filter: drop-shadow(0 2rpx 6rpx rgba(0, 0, 0, 0.18));
-  background-image: url("/static/images/chef/1282.png");
+}
-  background-size: 100% 100%;
+
-  background-repeat: no-repeat;
+/* 瀑布流商品图：固定 1:1 区域，便于「已售完」等角标统一 */
+.featured-dish-image {
+  position: relative;
+  width: 100%;
+  height: 0;
+  padding-bottom: 100%;
+  background: #f0f0f0;
+  overflow: hidden;
+}
+
+.featured-dish-img {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  display: block;
+  z-index: 1;
+}
+
+.featured-dish-sold-dim {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 2;
+  background: rgba(201, 197, 197, 0.6);
+  pointer-events: none;
+}
+
+.featured-dish-sold-overlay {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  width: 140rpx;
+  height: 140rpx;
+  z-index: 3;
+  pointer-events: none;
+}
+
+.featured-dish-card {
+  background: #fff;
+  border-radius: 24rpx;
+  overflow: hidden;
+  box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.06);
+}
+
+.featured-dish-body {
+  padding: 20rpx 20rpx 22rpx;
+}
+
+.featured-dish-price {
+  color: #e02e24;
+  font-size: 32rpx;
+  font-weight: 600;
+  line-height: 1.2;
+}
+
+.featured-dish-original {
+  margin-left: 10rpx;
+  color: #b3b3b3;
+  font-size: 22rpx;
+  font-weight: 400;
+  text-decoration: line-through;
+  vertical-align: baseline;
+}
+
+.featured-dish-sales {
+  color: #999;
+  font-size: 24rpx;
+  line-height: 1.35;
+  max-width: 48%;
+  text-align: right;
+}
+
+.featured-dish-title {
+  color: #1a1a1a;
+  font-size: 28rpx;
+  font-weight: 500;
+  line-height: 1.45;
+}
+
+/* 会员价：暖色胶囊，替代长条形切图 */
+.featured-dish-member {
+  display: inline-flex;
+  align-items: center;
+  max-width: calc(100% - 88rpx);
+}
+
+.featured-dish-member-inner {
+  display: inline-block;
+  padding: 6rpx 18rpx;
+  border-radius: 999rpx;
+  background: linear-gradient(180deg, #fff5eb 0%, #ffe8d6 100%);
+  color: #c45c1a;
+  font-size: 24rpx;
+  font-weight: 500;
+  line-height: 1.35;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.featured-dish-add {
+  flex-shrink: 0;
+}
+
+.featured-dish-add__icon {
+  width: 56rpx;
+  height: 56rpx;
+  display: block;
+}
+
+/* 可选营销条（淡红底 + 文案） */
+.featured-dish-promo {
+  padding: 12rpx 16rpx;
+  border-radius: 12rpx;
+  background: #fff0f0;
+}
+
+.featured-dish-promo-text {
+  color: #e02e24;
+  font-size: 22rpx;
+  font-weight: 500;
+  line-height: 1.4;
+}
+
+.dish-new-ribbon {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 184rpx;
+  height: 184rpx;
+  overflow: hidden;
+  z-index: 5;
+  pointer-events: none;
+
+  &__text {
+    position: absolute;
+    top: 26rpx;
+    left: -66rpx;
+    width: 240rpx;
+    text-align: center;
+    font-size: 22rpx;
+    font-weight: 700;
+    color: #fff;
+    letter-spacing: 2rpx;
+    line-height: 44rpx;
+    background: #E23636;
+    transform: rotate(-45deg);
+  }
 }
 </style>

src/pages/home/components/tabbar-mine/components/invite-poster/invite-poster.vue

@@ -194,7 +194,7 @@ const poster = computed(() => ({
                   type: 'view',
                 },
                 {
-                  text:  'http://192.168.5.118:8011/h5/'+ `pages-login/pages/sign-up/index?invitationCode=${userStore.userInfo.invitationCode}`,
+                  text:  'http://www.howhowfresh.com/h5/'+ `pages-login/pages/sign-up/index?invitationCode=${userStore.userInfo.invitationCode}`,
                   type: 'qrcode',
                   css: {
                     width: '124rpx',

src/pages/home/components/tabbar-mine/components/invite-user/invite-user.vue

@@ -83,10 +83,16 @@ defineExpose({
             </view>
             <view class="shrink-0 ml-20rpx" v-if="userStore.userInfo.invitationCode">
               <uqrcode ref="uqrcode" canvas-id="qrcode"
-                       :value="'http://192.168.5.118:8011/h5/' + `pages-login/pages/sign-up/index?invitationCode=${userStore.userInfo.invitationCode}`"
+                       :value="'http://www.howhowfresh.com/h5/' + `pages-login/pages/sign-up/index?invitationCode=${userStore.userInfo.invitationCode}`"
                        :size="124"
                        sizeUnit="rpx"
                        :options="{}"></uqrcode>
+
+                       <!-- <uqrcode ref="uqrcode" canvas-id="qrcode"
+                       :value="'http://192.168.5.118:8011/h5/' + `pages-login/pages/sign-up/index?invitationCode=${userStore.userInfo.invitationCode}`"
+                       :size="124"
+                       sizeUnit="rpx"
+                       :options="{}"></uqrcode> -->
             </view>
           </view>
         </view>

src/pages/home/components/tabbar-mine/components/mine-skeleton.vue

@@ -1,48 +1,41 @@
 <template>
-  <view class="mine-skeleton">
+  <view class="mine-skeleton-page">
-    <!-- 用户信息区域 -->
+    <!-- 顶部用户信息（对应新布局） -->
-    <view class="user-info-section flex-center-sb">
+    <view class="sk-header">
-        <view class="user-name-skeleton skeleton-item"></view>
+      <view class="sk-header__left">
-      <view class="user-avatar-skeleton skeleton-item"></view>
+        <view class="sk-name skeleton-item"></view>
-    </view>
+        <view class="sk-sub-row">
-
+          <view class="sk-sub-text skeleton-item"></view>
-    <!-- 统计卡片区域 -->
+          <view class="sk-badge skeleton-item"></view>
-    <view class="stats-section">
-      <view class="stats-list">
-        <view 
-          v-for="i in 3" 
-          :key="i" 
-          class="stat-card-skeleton skeleton-item"
-        >
-          <view class="stat-number-skeleton skeleton-item"></view>
-          <view class="stat-label-skeleton skeleton-item"></view>
         </view>
+        <view class="sk-date skeleton-item"></view>
       </view>
+      <view class="sk-avatar skeleton-item"></view>
     </view>
 
-    <!-- 会员横幅区域 -->
+    <!-- 三项数据胶囊卡 -->
-    <view class="member-banner-section">
+    <view class="sk-stats skeleton-item">
-      <view class="member-banner-skeleton skeleton-item">
+      <view class="sk-stats__cell" v-for="i in 3" :key="i">
-        <view class="banner-content">
+        <view class="sk-num skeleton-item"></view>
-          <view class="banner-title-skeleton skeleton-item"></view>
+        <view class="sk-label skeleton-item"></view>
-          <view class="banner-subtitle-skeleton skeleton-item"></view>
-        </view>
-        <view class="banner-icon-skeleton skeleton-item"></view>
       </view>
+      <view class="sk-divider" v-if="true"></view>
     </view>
 
-    <!-- 菜单列表区域 -->
+    <!-- 会员横幅 -->
-    <view class="menu-section">
+    <view class="sk-banner skeleton-item">
-      <view class="menu-list">
+      <view class="sk-banner__title skeleton-item"></view>
-        <view 
+      <view class="sk-banner__sub skeleton-item"></view>
-          v-for="i in 9" 
+    </view>
-          :key="i" 
+
-          class="menu-item-skeleton"
+    <!-- 菜单列表卡片 -->
-        >
+    <view class="sk-menu">
-          <view class="menu-icon-skeleton skeleton-item"></view>
+      <view class="sk-menu__row" v-for="i in 9" :key="i">
-          <view class="menu-text-skeleton skeleton-item"></view>
+        <view class="sk-menu__left">
-          <view class="menu-arrow-skeleton skeleton-item"></view>
+          <view class="sk-menu__icon skeleton-item"></view>
+          <view class="sk-menu__text skeleton-item"></view>
         </view>
+        <view class="sk-menu__arrow skeleton-item"></view>
       </view>
     </view>
   </view>
@@ -70,161 +63,166 @@
   }
 }
 
-.mine-skeleton {
+.mine-skeleton-page {
-  background-color: #fff;
+  background-color: #f5f5f5;
-  padding: 0 30rpx;
+  padding: 0 30rpx 30rpx;
 }
 
-// 用户信息区域
+.sk-header {
-.user-info-section {
+  padding-top: 32rpx;
-  padding: 36rpx 0 0; 
+  padding-bottom: 28rpx;
   display: flex;
   align-items: center;
-  gap: 20rpx;
+  justify-content: space-between;
-  
+  gap: 24rpx;
-  .user-avatar-skeleton {
-    width: 130rpx;
-    height: 130rpx;
-    border-radius: 50%;
-  }
-  
-  .user-name-skeleton {
-    width: 233rpx;
-    height: 56rpx;
-    border-radius: 8rpx;
-  }
-}
 
-// 统计卡片区域
+  &__left {
-.stats-section {
+    flex: 1;
-  padding: 90rpx 0 0;
+    min-width: 0;
-  
-  .stats-list {
-    display: flex;
-    gap: 36rpx;
-    
-    .stat-card-skeleton {
-      flex: 1;
-      height: 194rpx;
-      border-radius: 24rpx;
-      display: flex;
-      flex-direction: column;
-      justify-content: center;
-      align-items: center;
-      gap: 20rpx;
-      
-      .stat-number-skeleton {
-        width: 80rpx;
-        height: 44rpx;
-        border-radius: 6rpx;
-      }
-      
-      .stat-label-skeleton {
-        width: 120rpx;
-        height: 28rpx;
-        border-radius: 6rpx;
-      }
-    }
-  }
-}
-
-// 会员横幅区域
-.member-banner-section {
-  padding: 40rpx 0 0;
-  
-  .member-banner-skeleton {
-    width: 690rpx;
-    height: 152rpx;
-    border-radius: 24rpx;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding: 0 28rpx;
-    
-    .banner-content {
-      display: flex;
-      flex-direction: column;
-      gap: 12rpx;
-      
-      .banner-title-skeleton {
-        width: 457rpx;
-        height: 57rpx;
-        border-radius: 8rpx;
-      }
-      
-      .banner-subtitle-skeleton {
-        width: 497rpx;
-        height: 48rpx;
-        border-radius: 6rpx;
-      }
-    }
-    
-    .banner-icon-skeleton {
-      width: 80rpx;
-      height: 80rpx;
-      border-radius: 50%;
-    }
-  }
-}
-
-// 菜单列表区域
-.menu-section {
-  padding: 80rpx 0 0;
-  
-  .menu-list {
     display: flex;
     flex-direction: column;
-    gap: 0;
-    
-    .menu-item-skeleton {
-      display: flex;
-      align-items: center;
-      padding: 22rpx 0;
-    //   border-bottom: 1rpx solid #f0f0f0;
-      
-      &:last-child {
-        border-bottom: none;
-      }
-      
-      .menu-icon-skeleton {
-        width: 44rpx;
-        height: 44rpx;
-        border-radius: 8rpx;
-        margin-right: 20rpx;
-      }
-      
-      .menu-text-skeleton {
-        flex: 1;
-        height: 30rpx;
-        border-radius: 6rpx;
-      }
-      
-      .menu-arrow-skeleton {
-        width: 22rpx;
-        height: 30rpx;
-        border-radius: 4rpx;
-        margin-left: 20rpx;
-      }
-    }
   }
 }
 
-// 响应式设计
+.sk-name {
-@media (max-width: 750rpx) {
+  width: 420rpx;
-  .stats-list {
+  height: 44rpx;
-    flex-direction: column;
+  border-radius: 10rpx;
-    gap: 20rpx;
+}
-  }
+
-  
+.sk-sub-row {
-  .member-banner-skeleton {
+  margin-top: 12rpx;
-    flex-direction: column;
+  display: flex;
-    gap: 20rpx;
+  align-items: center;
-    padding: 20rpx;
+  gap: 12rpx;
-    
+}
-    .banner-content {
+
-      align-items: center;
+.sk-sub-text {
-      text-align: center;
+  width: 200rpx;
-    }
+  height: 22rpx;
+  border-radius: 999rpx;
+}
+
+.sk-badge {
+  width: 120rpx;
+  height: 22rpx;
+  border-radius: 999rpx;
+}
+
+.sk-date {
+  margin-top: 10rpx;
+  width: 360rpx;
+  height: 22rpx;
+  border-radius: 8rpx;
+}
+
+.sk-avatar {
+  width: 130rpx;
+  height: 130rpx;
+  border-radius: 50%;
+  flex-shrink: 0;
+}
+
+.sk-stats {
+  margin-top: 24rpx;
+  height: 120rpx;
+  border-radius: 60rpx;
+  background: #fff;
+  box-shadow: 0 12rpx 30rpx rgba(0, 0, 0, 0.06);
+  display: flex;
+  align-items: center;
+  padding: 0 20rpx;
+  position: relative;
+}
+
+.sk-stats__cell {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 10rpx;
+}
+
+.sk-num {
+  width: 70rpx;
+  height: 30rpx;
+  border-radius: 8rpx;
+}
+
+.sk-label {
+  width: 90rpx;
+  height: 20rpx;
+  border-radius: 8rpx;
+}
+
+.sk-divider {
+  display: none;
+}
+
+.sk-banner {
+  margin-top: 24rpx;
+  height: 152rpx;
+  border-radius: 24rpx;
+  overflow: hidden;
+  background: #fff;
+  padding: 22rpx 28rpx;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+}
+
+.sk-banner__title {
+  width: 420rpx;
+  height: 32rpx;
+  border-radius: 10rpx;
+}
+
+.sk-banner__sub {
+  width: 520rpx;
+  height: 20rpx;
+  border-radius: 8rpx;
+}
+
+.sk-menu {
+  margin-top: 14rpx;
+  background: #fff;
+  border-radius: 24rpx;
+  overflow: hidden;
+}
+
+.sk-menu__row {
+  padding: 28rpx 24rpx;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  border-bottom: 1rpx solid #efefef;
+
+  &:last-child {
+    border-bottom: none;
   }
 }
+
+.sk-menu__left {
+  display: flex;
+  align-items: center;
+  gap: 18rpx;
+}
+
+.sk-menu__icon {
+  width: 44rpx;
+  height: 44rpx;
+  border-radius: 10rpx;
+}
+
+.sk-menu__text {
+  width: 240rpx;
+  height: 26rpx;
+  border-radius: 10rpx;
+}
+
+.sk-menu__arrow {
+  width: 22rpx;
+  height: 30rpx;
+  border-radius: 8rpx;
+}
 </style> 

src/pages/home/components/tabbar-mine/tabbar-mine.vue

@@ -173,7 +173,7 @@ defineExpose({
 
 <template>
   <view
-    class="bg-#fff"
+    class="view-bg"
     :style="[
       {
         height: configStore.windowHeight + 'px',
@@ -194,127 +194,103 @@ defineExpose({
         v-show="!loading"
         class="animate-in fade-in animate-ease-in animate-duration-300"
       >
-        <view class="px-30rpx">
+        <view class="mine-page ">
-          <view
+          <!-- 顶部用户信息 -->
-            @click="navigateTo('/pages-user/pages/user-info/index')"
+          <view class="mine-header" @click="navigateTo('/pages-user/pages/user-info/index')">
-            class="flex-center-sb mt-32rpx mb-82rpx"
+            <view class="mine-header__left">
-          >
+              <text class="mine-header__name">
-<!--            <text class="text-56rpx text-#333 leading-56rpx font-bold tracking-[.04em]"-->
+                {{
-<!--              >{{ userStore.isLogin ? `${userStore.userInfo.firstName} ${userStore.userInfo.surname}` : t('common.pleaseLogin') }}-->
+                  userStore.isLogin
-<!--            </text>-->
+                    ? ([userStore.userInfo.firstName, userStore.userInfo.surname].filter(Boolean).join(' ') ||
-
+                      t('common.unknownUser'))
-            <text
-                class="text-56rpx text-#333 leading-56rpx font-bold tracking-[.04em]"
-            >
-              {{
-                userStore.isLogin
-                    ? ([userStore.userInfo.firstName, userStore.userInfo.surname].filter(Boolean).join(' ') || t('common.unknownUser'))
                     : t('common.pleaseLogin')
-              }}
+                }}
-            </text>
+              </text>
+              <view class="mine-header__sub" v-if="userStore.isLogin">
+                <text class="mine-header__member">{{ Config.appName }} {{ t('pages.mine.member') }}</text>
+                <view class="mine-header__badge" v-if="!isUserMember">
+                  {{ t('pages.mine.openMember') }}
+                </view>
+                <text class="mine-header__chev">›</text>
+              </view>
+              <text class="mine-header__date" v-if="isUserMember && userStore.userInfo.userMembershipVo?.expireTime">
+                {{ t('common.expireTime') }}：{{ formatTimestampWithMonthName(userStore.userInfo.userMembershipVo?.expireTime) }}
+              </text>
+            </view>
 
             <image
-                v-if="userStore.isLogin"
+              v-if="userStore.isLogin"
-                :src="userStore.userInfo.avatar"
+              :src="userStore.userInfo.avatar"
-                class="w-130rpx h-130rpx rounded-50%"
+              class="mine-header__avatar"
-                mode="aspectFill"
+              mode="aspectFill"
-            />
-            <image
-                v-else
-                class="w-130rpx h-130rpx rounded-50%"
-                mode="aspectFill"
-                src="@img/chef/default_avatar.png"
             />
+            <image v-else class="mine-header__avatar" mode="aspectFill" src="@img/chef/default_avatar.png" />
           </view>
-          <view class="flex-center-sb mb-36rpx">
+
-            <view
+          <!-- 三项数据胶囊卡 -->
-                @click="navigateTo('/pages-user/pages/collection/index')"
+          <view class="mine-stats">
-              class="flex-1 flex-col center bg-#F6F6F6 rounded-24rpx h-194rpx"
+            <view class="mine-stats__item" @click="navigateTo('/pages-user/pages/collection/index')">
-            >
+              <text class="mine-stats__num">{{ userStore.userInfo.collectNum || 0 }}</text>
-              <view
+              <text class="mine-stats__label">{{ t('pages.mine.collection') }}</text>
-                class="text-44rpx text-#333 leading-44rpx font-bold mb-24rpx"
-                >{{ userStore.userInfo.collectNum || 0 }}</view
-              >
-              <view class="text-28rpx text-#333 leading-28rpx tracking-[.04em]">{{
-                t("pages.mine.collection")
-              }}</view>
             </view>
-            <view
+            <view class="mine-stats__divider" />
-              @click="navigateTo('/pages-user/pages/balance/index')"
+            <view class="mine-stats__item" @click="navigateTo('/pages-user/pages/balance/index')">
-              class="flex-1 mx-32rpx flex-col center bg-#F6F6F6 rounded-24rpx h-194rpx"
+              <text class="mine-stats__num">{{ userStore.userInfo?.balance || 0 }}</text>
-            >
+              <text class="mine-stats__label">{{ t('pages.mine.wallet') }}</text>
-              <view
-                class="text-44rpx text-#333 leading-44rpx font-bold mb-24rpx"
-                >{{ userStore.userInfo?.balance || 0 }}</view
-              >
-              <view class="text-28rpx text-#333 leading-28rpx tracking-[.04em]">{{
-                t("pages.mine.wallet")
-              }}</view>
             </view>
-            <view
+            <view class="mine-stats__divider" />
-              @click="changeOrderFn"
+            <view class="mine-stats__item" @click="changeOrderFn">
-              class="flex-1 flex-col center bg-#F6F6F6 rounded-24rpx h-194rpx"
+              <text class="mine-stats__num">{{ userStore.userInfo.orderNum || 0 }}</text>
-            >
+              <text class="mine-stats__label">{{ t('pages.mine.order') }}</text>
-              <view
-                class="text-44rpx text-#333 leading-44rpx font-bold mb-24rpx"
-                >{{ userStore.userInfo.orderNum || 0 }}</view
-              >
-              <view class="text-28rpx text-#333 leading-28rpx tracking-[.04em]">{{
-                t("pages.mine.order")
-              }}</view>
             </view>
           </view>
+
           <template v-if="isUserMember">
-            <view @click="navigateTo('/pages-user/pages/member/index')" class="w-full h-152rpx relative mb-52rpx">
+            <view @click="navigateTo('/pages-user/pages/member/index')" class="member-banner">
-              <image src="@img/chef/100203.png" class="w-full h-full absolute top-0 left-0"></image>
+              <image src="@img/chef/100203.png" class="member-banner__bg"></image>
-              <view class="pl-28rpx py-22rpx pr-165rpx relative z-1 h-full flex flex-col justify-between">
+              <view class="member-banner__content">
-                <view class="text-40rpx text-#333 font-bold">
+                <view class="member-banner__title">{{ Config.appName }}</view>
-                  {{ Config.appName }}
+                <view class="member-banner__sub">
-                </view>
-                <view class="text-24rpx lh-24rpx text-#935D04 tracking-[.08em]">
                   {{ t('common.expireTime') }}：{{ formatTimestampWithMonthName(userStore.userInfo.userMembershipVo?.expireTime) }}
                 </view>
               </view>
             </view>
           </template>
           <template v-else>
-            <view @click="navigateTo('/pages-user/pages/member/index')" class="w-full h-152rpx relative mb-52rpx">
+            <view @click="navigateTo('/pages-user/pages/member/index')" class="member-banner">
-              <image src="@img/chef/100203.png" class="w-full h-full absolute top-0 left-0"></image>
+              <image src="@img/chef/100203.png" class="member-banner__bg"></image>
-              <view class="pl-28rpx py-22rpx pr-165rpx relative z-1 h-full flex flex-col justify-between">
+              <view class="member-banner__content">
-                <view class="text-40rpx text-#333 font-bold">
+                <view class="member-banner__title">
-                  <!--用户没有试用过会员-->
                   <template v-if="!userStore.userInfo.userMembershipVo">{{ t('pages.mine.member-title') }}</template>
                   <template v-else>{{ t('pages.mine.join') }} {{ Config.appName }}</template>
                 </view>
-                <view class="text-24rpx lh-24rpx text-#935D04 tracking-[.08em]">{{ t('pages.mine.member-desc') }}</view>
+                <view class="member-banner__sub">{{ t('pages.mine.member-desc') }}</view>
               </view>
             </view>
           </template>
 
+          <view style="height: 30rpx;background-color: #f5f5f5;" />
 
-          <view
+          <!-- 菜单列表卡片 -->
-            class="flex-center-sb py-28rpx bg-#fff"
+          <view class="mine-menu">
-            v-for="(item, index) in tabBarList"
+            <view
-            :key="item.code"
+              class="mine-menu__row"
-            :class="[
+              v-for="(item, index) in tabBarList"
-              index === tabBarList.length - 1 ? 'mb-58rpx' : 'border-bottom',
+              :key="item.code"
-            ]"
+              :class="[index === tabBarList.length - 1 ? 'mine-menu__row--last' : '']"
-            @click="handleTabClick(item)"
+              @click="handleTabClick(item)"
-          >
+            >
-            <view class="flex items-center">
+              <view class="mine-menu__left">
-              <image
+                <image class="mine-menu__icon" :src="item.iconPath"></image>
-                class="w-44rpx h-44rpx shrink-0 mr-18rpx"
+                <text class="mine-menu__text">{{ item.text }}</text>
-                :src="item.iconPath"
+              </view>
-              ></image>
+              <image class="mine-menu__arrow" src="@img/chef/100202.png"></image>
-              <text class="text-30rpx text-primary font-500 lh-30rpx tracking-[.04em]">{{
-                item.text
-              }}</text>
-            </view>
-            <view class="flex items-center shrink-0 ml-20rpx">
-              <image class="w-22rpx h-30rpx" src="@img/chef/100202.png"></image>
             </view>
           </view>
+
+          <view class="mine-bottom-spacer" />
         </view>
+          
       </view>
       <template #bottom>
         <view class="h-50px"></view>
@@ -325,7 +301,229 @@ defineExpose({
 </template>
 
 <style scoped lang="scss">
-.border-bottom {
+.view-bg {
-  border-bottom: 1rpx solid #dfdfdf;
+  background-color: #fff;
+}
+
+.mine-page {
+  padding-bottom: 20rpx;
+}
+
+.mine-header {
+margin: 0 30rpx;
+  padding: 32rpx 0 28rpx;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+
+  &__left {
+    min-width: 0;
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+  }
+
+  &__name {
+    font-size: 38rpx;
+    line-height: 40rpx;
+    font-weight: 700;
+    color: #333;
+    letter-spacing: 0.04em;
+    max-width: 520rpx;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  &__sub {
+    margin-top: 12rpx;
+    display: inline-flex;
+    align-items: center;
+    gap: 10rpx;
+    color: #b68b3e;
+    font-size: 22rpx;
+    line-height: 22rpx;
+    font-weight: 600;
+  }
+
+  &__member {
+    color: #b68b3e;
+  }
+
+  &__badge {
+    padding: 8rpx 16rpx;
+    border-radius: 999rpx;
+    background: rgba(182, 139, 62, 0.12);
+    color: #b68b3e;
+    font-size: 20rpx;
+    line-height: 20rpx;
+    font-weight: 700;
+    letter-spacing: 0.02em;
+  }
+
+  &__chev {
+    transform: translateY(-1rpx);
+    color: #b68b3e;
+    font-size: 24rpx;
+    line-height: 22rpx;
+  }
+
+  &__date {
+    margin-top: 10rpx;
+    font-size: 22rpx;
+    line-height: 22rpx;
+    color: #999;
+    font-weight: 500;
+  }
+
+  &__avatar {
+    width: 90rpx;
+    height: 90rpx;
+    border-radius: 50%;
+    flex-shrink: 0;
+    background-color: #eee;
+  }
+}
+
+.mine-stats {
+  margin: 15rpx 35rpx;
+  // margin-top: 24rpx;
+  background: #fff;
+  border-radius: 36rpx;
+  height: 120rpx;
+  padding: 0 20rpx;
+  display: flex;
+  align-items: center;
+  box-shadow: 0 12rpx 30rpx rgba(10, 10, 10, 0.06);
+
+  &__item {
+    flex: 1;
+    min-width: 0;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: 8rpx;
+    
+  }
+
+  &__num {
+    font-size: 32rpx;
+    line-height: 30rpx;
+    font-weight: 700;
+    color: #333;
+  }
+
+  &__label {
+    font-size: 26rpx;
+    line-height: 28rpx;
+    color: #666;
+    font-weight: 700;
+    letter-spacing: 0.04em;
+    // font-weight: 500;
+  }
+
+  &__divider {
+    width: 1rpx;
+    height: 56rpx;
+    background: #eaeaea;
+    flex-shrink: 0;
+  }
+}
+
+.member-banner {
+  margin: 15rpx 30rpx;
+  height: 152rpx;
+  position: relative;
+  border-radius: 36rpx;
+  overflow: hidden;
+
+  &__bg {
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    top: 0;
+    left: 0;
+  }
+
+  &__content {
+    position: relative;
+    z-index: 1;
+    height: 100%;
+    padding: 22rpx 165rpx 22rpx 28rpx;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+  }
+
+  &__title {
+    font-size: 32rpx;
+    line-height: 32rpx;
+    font-weight: 800;
+    color: #333;
+  }
+
+  &__sub {
+    font-size: 20rpx;
+    line-height: 20rpx;
+    font-weight: 600;
+    color: #935d04;
+    letter-spacing: 0.08em;
+  }
+}
+
+.mine-menu {
+  margin:20rpx 30rpx 30rpx;
+  background: #fff;
+  border-radius: 24rpx;
+  overflow: hidden;
+
+  &__row {
+    padding: 28rpx 24rpx;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    border-bottom: 1rpx solid #efefef;
+  }
+
+  &__row--last {
+    border-bottom: none;
+  }
+
+  &__left {
+    min-width: 0;
+    display: flex;
+    align-items: center;
+    gap: 18rpx;
+  }
+
+  &__icon {
+    width: 38rpx;
+    height: 38rpx;
+    flex-shrink: 0;
+  }
+
+  &__text {
+    font-size: 26rpx;
+    line-height: 26rpx;
+    color: #333;
+    // font-weight: 600;
+    letter-spacing: 0.04em;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  &__arrow {
+    width: 22rpx;
+    height: 30rpx;
+    flex-shrink: 0;
+    opacity: 0.9;
+  }
+}
+
+.mine-bottom-spacer {
+  height: 58rpx;
 }
 </style>

src/pages/home/components/tabbar-order/components/order-swiper-list/order-swiper-list.vue

@@ -1,12 +1,15 @@
 <script setup lang="ts">
 import {
   appMerchantOrderOrderListPost,
+  appMerchantOrderCancelOrderPost,
   type MerchantOrderVo
 } from "@/service";
-import {callPhone, formatTimestampWithWeekday} from "@/utils/utils";
+import CancelOrder from '@/pages-store/pages/order/components/cancel-order.vue'
+import {callPhone} from "@/utils/utils";
 import {OrderCancelStatus, OrderStatus} from "@/constant/enums";
 import {useUserStore} from "@/store";
-import HomeSkeleton from "@/pages/home/components/tabbar-home/components/home-skeleton.vue";
+import {dayjs} from "@/plugin";
+
 const userStore = useUserStore();
 const { t } = useI18n();
 const props = defineProps<{
@@ -31,7 +34,7 @@ const {paging, dataList, loading, queryList, firstLoaded} = usePage<MerchantOrde
       },
       body: {
         userPort: 1,
-        orderStatusList: props.status ? [Number(props.status + 1)] : [],
+        orderStatusList: props.status !== null && props.status !== '' ? [Number(props.status)] : [],
       }
     })
   } else {
@@ -41,12 +44,134 @@ const {paging, dataList, loading, queryList, firstLoaded} = usePage<MerchantOrde
   }
 })
 
-function handleClick(item: any) {
+function normalizeTimestamp(input: unknown): number | null {
+  if (input == null || input === '') return null
+
+  let value: number
+  if (typeof input === 'string') {
+    const trimmed = input.trim()
+    if (!trimmed) return null
+    value = Number(trimmed)
+  } else {
+    value = Number(input)
+  }
+
+  if (!Number.isFinite(value) || value <= 0) return null
+
+  // 兼容后端可能返回秒级时间戳
+  if (value < 1e12) {
+    value = value * 1000
+  }
+  return value
+}
+
+function formatOrderCardTime(item: MerchantOrderVo) {
+  // 优先使用下单时间 createTime；没有则回退到预约结束时间
+  const ts = normalizeTimestamp((item as any)?.createTime ?? item?.endScheduledTime)
+  if (!ts) return '--'
+  return dayjs(ts).format('YYYY/MM/DD HH:mm')
+}
+
+function formatOrderPrice(item: MerchantOrderVo) {
+  const raw = item?.paidAmount ?? item?.actualPrice ?? 0
+  if (raw == null || raw === '') return '0.00'
+  if (typeof raw === 'number') return raw.toFixed(2)
+  const str = String(raw).trim()
+  if (!str) return '0.00'
+  if (!str.includes('.')) return `${str}.00`
+  const [intPart, decimalPart = ''] = str.split('.')
+  return `${intPart}.${(decimalPart + '00').slice(0, 2)}`
+}
+
+function getOrderDishes(item: MerchantOrderVo): Array<Record<string, any>> {
+  const list = item.merchantOrderDishVoList as unknown as Array<Record<string, any>> | null | undefined
+  if (!list || !Array.isArray(list)) return []
+  return list
+}
+
+function dishCover(dish: Record<string, any>) {
+  const img = dish?.merchantDishVo?.dishImage
+  if (!img || typeof img !== 'string') return ''
+  return img.split(',')[0] || ''
+}
+
+function dishTitle(dish: Record<string, any>) {
+  return dish?.merchantDishVo?.dishName ?? ''
+}
+
+function getTotalDishCount(item: MerchantOrderVo) {
+  return getOrderDishes(item).reduce((s, d) => s + (d.count || 0), 0)
+}
+
+function getTotalDishCountText(item: MerchantOrderVo) {
+  return `${t('pages.order.totalItemCountPrefix')}${getTotalDishCount(item)}${t('pages.order.totalItemCountSuffix')}`
+}
+
+function isSameCode(value: unknown, code: unknown) {
+  return String(value ?? '') === String(code ?? '')
+}
+
+function isRefundApplied(item: MerchantOrderVo) {
+  return isSameCode(item.refundStatus, OrderCancelStatus.APPLIED)
+}
+
+function isRefundApproved(item: MerchantOrderVo) {
+  return isSameCode(item.refundStatus, OrderCancelStatus.APPROVED)
+}
+
+function isRefundRejected(item: MerchantOrderVo) {
+  return isSameCode(item.refundStatus, OrderCancelStatus.REJECTED)
+}
+
+function getOrderStatusText(item: MerchantOrderVo) {
+  if (isRefundApplied(item)) return t('pages-store.order.orderStatus.refund')
+  if (isRefundApproved(item)) return t('pages-store.order.orderStatus.agreeRefund')
+  if (isRefundRejected(item)) return t('pages-store.order.orderStatus.rejectRefund')
+  if (isSameCode(item.orderStatus, OrderStatus.CANCELLED)) return t('pages-store.order.orderStatus.cancelled')
+  if (isSameCode(item.orderStatus, OrderStatus.PENDING_PAYMENT)) return t('pages-store.order.orderStatus.pendingPayment')
+  if (isSameCode(item.orderStatus, OrderStatus.HAS_PENDING_PAYMENT)) return t('pages-store.order.orderStatus.hasPendingPayment')
+  if (isSameCode(item.orderStatus, OrderStatus.MERCHANT_ACCEPTED)) return t('pages-store.order.orderStatus.received')
+  if (isSameCode(item.receiveMethod, 1) && isSameCode(item.orderStatus, OrderStatus.DELIVERING)) return t('pages-store.order.orderStatus.delivering')
+  if (isSameCode(item.orderStatus, OrderStatus.COMPLETED)) return t('pages-store.order.orderStatus.delivered')
+  if (isSameCode(item.orderStatus, OrderStatus.MERCHANT_REJECTED)) return t('pages-store.store.orderStatus.rejected')
+  return '--'
+}
+
+function handleClick(item: MerchantOrderVo) {
   uni.navigateTo({
     url: '/pages-store/pages/order/index?id=' + item.id
   })
 }
 
+const cancelOrderRef = ref<InstanceType<typeof CancelOrder>>()
+const pendingCancelOrder = ref<MerchantOrderVo | null>(null)
+
+function handleCancelClick(item: MerchantOrderVo) {
+  pendingCancelOrder.value = item
+  cancelOrderRef.value?.onOpen()
+}
+
+function confirmCancel(reason: string) {
+  const order = pendingCancelOrder.value
+  if (!order?.id) return
+  appMerchantOrderCancelOrderPost({
+    body: {
+      orderId: order.id,
+      cancelReason: reason,
+    },
+  }).then(() => {
+    cancelOrderRef.value?.onClose()
+    pendingCancelOrder.value = null
+    uni.showToast({
+      title: t('pages-store.order.cancelSuccess'),
+      icon: 'none',
+    })
+    setTimeout(() => {
+      paging.value?.refresh()
+    }, 500)
+  })
+}
+
 function reload() {
   paging.value?.reload()
 }
@@ -66,127 +191,367 @@ defineExpose({
 </script>
 
 <template>
-  <view class="h-full">
+  <view class="list-root h-full">
     <z-paging ref="paging" v-model="dataList" @query="queryList" :fixed="false" :auto="false">
-      <view class="p-30rpx">
+      <view class="page-pad">
         <view
             v-show="loading"
             class="animate-in fade-in animate-ease-out animate-duration-300"
         >
-          <template v-for="item in 3">
+          <view v-for="sk in 3" :key="'sk-' + sk" class="order-card order-card--skeleton mb-24rpx">
-            <view class="w-full px-50rpx pt-43rpx pb-36rpx bg-white rounded-36rpx mb-30rpx last:mb-0">
+              <view class="flex-center-sb mb-24rpx">
-              <!-- 头部时间和状态骨架屏 -->
+                <view class="w-280rpx h-32rpx skeleton-item rounded-8rpx"></view>
-              <view class="flex-center-sb mb-28rpx">
+                <view class="w-120rpx h-32rpx skeleton-item rounded-8rpx"></view>
-                <view class="w-280rpx h-34rpx skeleton-item rounded-8rpx"></view>
-                <view class="w-120rpx h-34rpx skeleton-item rounded-8rpx"></view>
               </view>
-              
+              <view class="flex items-center mb-24rpx">
-              <!-- 商家信息骨架屏 -->
-              <view class="flex items-center my-28rpx">
                 <view class="w-32rpx h-32rpx skeleton-item rounded-6rpx mr-10rpx"></view>
-                <view class="w-200rpx h-30rpx skeleton-item rounded-6rpx"></view>
+                <view class="w-240rpx h-28rpx skeleton-item rounded-6rpx"></view>
-                <view class="w-60rpx h-32rpx skeleton-item rounded-6rpx ml-20rpx"></view>
+                <view class="w-72rpx h-28rpx skeleton-item rounded-20rpx ml-16rpx"></view>
               </view>
-              
+              <view class="flex gap-16rpx mb-24rpx">
-              <!-- 轮播图骨架屏 -->
+                <view v-for="i in 3" :key="i" class="sk-thumb">
-              <view class="mb-30rpx">
+                  <view class="sk-thumb-img skeleton-item"></view>
-                <view class="w-100% h-508rpx skeleton-item rounded-36rpx mb-10rpx"></view>
+                  <view class="w-100rpx h-22rpx skeleton-item rounded-4rpx mt-10rpx"></view>
-                <view class="w-180rpx h-30rpx skeleton-item rounded-6rpx"></view>
+                </view>
-              </view>
+                <view class="flex-1"></view>
-              
+                <view class="w-100rpx flex flex-col items-end gap-12rpx pt-8rpx">
-              <!-- 底部按钮区域骨架屏 -->
+                  <view class="w-88rpx h-30rpx skeleton-item rounded-4rpx"></view>
-              <view class="flex-center-sb">
+                  <view class="w-72rpx h-22rpx skeleton-item rounded-4rpx"></view>
-                <view class="w-56rpx h-56rpx skeleton-item rounded-28rpx"></view>
-                <view class="flex items-center gap-20rpx">
-                  <view class="w-170rpx h-64rpx skeleton-item rounded-64rpx"></view>
-                  <view class="w-170rpx h-64rpx skeleton-item rounded-64rpx"></view>
                 </view>
               </view>
-            </view>
+              <view class="flex justify-end">
-          </template>
+                <view class="sk-pill skeleton-item"></view>
+              </view>
+          </view>
         </view>
         <view
             class="animate-in fade-in animate-ease-in animate-duration-300"
             v-if="!loading"
         >
-          <template v-for="(item,index) in dataList">
+          <view
-            <view @click="handleClick(item)" :class="[index === 0 ? '' : 'mt-30rpx']" class="w-full px-50rpx pt-43rpx pb-36rpx bg-white rounded-36rpx">
+              v-for="(item,index) in dataList"
-              <view class="flex-center-sb text-34rpx lh-34rpx font-bold">
+              :key="item.id"
-                <text class="text-#333 tracking-[.04em]">{{ formatTimestampWithWeekday(item.endScheduledTime) }}</text>
+              :class="[index === 0 ? '' : 'mt-24rpx']"
-                <text class="text-#00A76D tracking-[.04em] shrink-0">
+              class="order-card"
-                  <template v-if="
+              @click="handleClick(item)"
-                  +item.refundStatus === OrderCancelStatus.APPLIED ||
+          >
-                  +item.refundStatus === OrderCancelStatus.APPROVED ||
+              <view class="flex-center-sb items-start gap-16rpx">
-                  +item.refundStatus === OrderCancelStatus.REJECTED
+                <text class="order-time">{{ formatOrderCardTime(item) }}</text>
-                  ">
+                <text class="order-status shrink-0" :class="{ 'text-#FF6106': isSameCode(item.orderStatus, OrderStatus.MERCHANT_REJECTED) }">
-                    <template v-if="+item.refundStatus === OrderCancelStatus.APPLIED">
+                  {{ getOrderStatusText(item) }}
-                      {{ t('pages-store.order.orderStatus.refund') }}
-                    </template>
-                    <template v-else-if="+item.refundStatus === OrderCancelStatus.APPROVED">
-                      {{ t('pages-store.order.orderStatus.agreeRefund') }}
-                    </template>
-                    <template v-else-if="+item.refundStatus === OrderCancelStatus.REJECTED">
-                      {{ t('pages-store.order.orderStatus.rejectRefund') }}
-                    </template>
-                  </template>
-                  <template v-else>
-                    <template v-if="item.orderStatus === OrderStatus.CANCELLED">{{ t('pages-store.order.orderStatus.cancelled') }}</template>
-                    <template v-if="item.orderStatus === OrderStatus.PENDING_PAYMENT">{{ t('pages-store.order.orderStatus.pendingPayment') }}</template>
-                    <template v-if="item.orderStatus === OrderStatus.HAS_PENDING_PAYMENT">{{ t('pages-store.order.orderStatus.hasPendingPayment') }}</template>
-                    <!--配送订单-->
-                    <template v-if="item.orderStatus === OrderStatus.MERCHANT_ACCEPTED">{{ t('pages-store.order.orderStatus.received') }}</template>
-                    <template v-if="+item.receiveMethod === 1 && item.orderStatus === OrderStatus.DELIVERING">{{ t('pages-store.order.orderStatus.delivering') }}</template>
-                    <template v-if="item.orderStatus === OrderStatus.COMPLETED">{{ t('pages-store.order.orderStatus.delivered') }}</template>
-
-                    <!--商家拒绝接单-->
-                    <template v-if="item.orderStatus === OrderStatus.MERCHANT_REJECTED">
-                      <text class="text-#FF6106">{{ t('pages-store.store.orderStatus.rejected') }}</text>
-                    </template>
-                  </template>
                 </text>
               </view>
-              <view class="text-30rpx lh-30rpx text-#333 font-500 flex items-center my-28rpx ">
+
-                <image src="@img/chef/126.png" class="w-32rpx h-32rpx mr-10rpx"></image>
+              <view class="store-row">
-                {{ item.merchantVo.merchantName }}
+                <image src="@img/chef/126.png" class="store-icon" mode="aspectFit"></image>
-                <!--收货方式(1-派送 2-自取)-->
+                <text class="store-name line-clamp-1">{{ item.merchantVo?.merchantName }}</text>
-                <view v-if="+item.receiveMethod === 1" class="bg-#FF6106 rounded-6rpx h-32rpx text-#fff text-22rpx center px-10rpx ml-20rpx">
+                <view v-if="isSameCode(item.receiveMethod, 1)" class="recv-tag recv-tag--del">
                   {{ t('pages.order.DEL') }}
                 </view>
-                <view v-if="+item.receiveMethod === 2" class="bg-#00A76D rounded-6rpx h-32rpx text-#fff text-22rpx center px-10rpx ml-20rpx">
+                <view v-if="isSameCode(item.receiveMethod, 2)" class="recv-tag recv-tag--pu">
                   {{ t('pages.order.PU') }}
                 </view>
               </view>
-              <swiper class="h-568rpx mb-30rpx" :autoplay="true">
+
-                <swiper-item v-for="img in item.merchantOrderDishVoList">
+              <view class="goods-row">
-                  <image
+                <scroll-view scroll-x class="goods-scroll" :show-scrollbar="false" :enable-flex="true">
-                      :src="img.merchantDishVo.dishImage?.split(',')[0]"
+                  <view class="goods-track">
-                      mode="aspectFill"
+                    <view
-                      class="w-100% h-508rpx rounded-36rpx bg-common"
+                        v-for="(dish, di) in getOrderDishes(item)"
-                  ></image>
+                        :key="dish.id ?? di"
-                  <view class="mt-10rpx text-30rpx font-500 line-clamp-1">{{ img.merchantDishVo.dishName }}</view>
+                        class="goods-cell"
-                </swiper-item>
+                    >
-              </swiper>
+                      <view class="goods-img-wrap">
-              <view class="flex-center-sb">
+                        <image
-                <view>
+                            :src="dishCover(dish)"
-                  <image v-if="+item.receiveMethod === 2" src="@img/chef/127.png" class="w-56rpx h-56rpx"></image>
+                            mode="aspectFill"
-                  <image @click.stop="callPhone(item.merchantVo.phone)" v-if="item.orderStatus >= OrderStatus.MERCHANT_ACCEPTED && +item.receiveMethod === 1" src="@img/chef/128.png" class="w-56rpx h-56rpx"></image>
+                            class="goods-img"
+                        />
+                        <view
+                            v-if="dish.count > 1"
+                            class="goods-qty"
+                        >x{{ dish.count }}</view>
+                      </view>
+                      <text class="goods-caption">{{ dishTitle(dish) }}</text>
+                    </view>
+                  </view>
+                </scroll-view>
+                <view class="price-block shrink-0">
+                  <text class="price-num">${{ formatOrderPrice(item) }}</text>
+                  <text class="price-meta">{{ getTotalDishCountText(item) }}</text>
                 </view>
-                <view class="flex items-center gap-20rpx font-500">
+              </view>
-                  <template v-if="item.refundStatus !== OrderCancelStatus.APPLIED && item.refundStatus !== OrderCancelStatus.APPROVED">
+
-                    <view v-if="item.orderStatus !== OrderStatus.CANCELLED && +item.orderStatus !== OrderStatus.COMPLETED && item.orderStatus !== OrderStatus.MERCHANT_REJECTED" class="w-170rpx h-64rpx center rounded-64rpx border-solid border-#666666 border-1rpx">{{ t('common.cancel') }}</view>
+              <view class="action-row" @click.stop>
-                    <view v-if="+item.receiveMethod === 2 && +item.orderStatus === OrderStatus.MERCHANT_ACCEPTED" class="w-170rpx h-64rpx center rounded-64rpx bg-#14181B text-28rpx text-#fff">{{ t('pages-store.order.writeOff') }}</view>
+                <view class="action-left">
-                    <view v-if="+item.orderStatus === OrderStatus.COMPLETED && item?.dishReviewVoList.length === 0" class="w-170rpx h-64rpx center rounded-64rpx bg-#14181B text-28rpx text-#fff">{{ t('common.evaluate') }}</view>
+                  <image
+                      v-if="isSameCode(item.receiveMethod, 2) && isSameCode(item.orderStatus, OrderStatus.MERCHANT_ACCEPTED)"
+                      src="@img/chef/127.png"
+                      class="action-icon"
+                  />
+                  <image
+                      v-if="!isSameCode(item.orderStatus, OrderStatus.PENDING_PAYMENT) && !isSameCode(item.orderStatus, OrderStatus.CANCELLED) && isSameCode(item.receiveMethod, 1)"
+                      src="@img/chef/128.png"
+                      class="action-icon"
+                      @click="callPhone(item.merchantVo?.phone)"
+                  />
+                </view>
+                <view class="action-btns">
+                  <template v-if="!isRefundApplied(item) && !isRefundApproved(item)">
+                    <view
+                        v-if="!isSameCode(item.orderStatus, OrderStatus.CANCELLED) && !isSameCode(item.orderStatus, OrderStatus.COMPLETED) && !isSameCode(item.orderStatus, OrderStatus.MERCHANT_REJECTED)"
+                        class="btn-outline"
+                        @click="handleCancelClick(item)"
+                    >{{ t('pages.order.cancelOrder') }}</view>
+                    <view
+                        v-if="isSameCode(item.receiveMethod, 2) && isSameCode(item.orderStatus, OrderStatus.MERCHANT_ACCEPTED)"
+                        class="btn-primary"
+                        @click="handleClick(item)"
+                    >{{ t('pages-store.order.writeOff') }}</view>
+                    <view
+                        v-if="isSameCode(item.orderStatus, OrderStatus.COMPLETED) && item?.dishReviewVoList?.length === 0"
+                        class="btn-primary"
+                        @click="handleClick(item)"
+                    >{{ t('common.evaluate') }}</view>
                   </template>
                 </view>
               </view>
-            </view>
+          </view>
-          </template>
         </view>
       </view>
     </z-paging>
+    <cancel-order ref="cancelOrderRef" @confirm="confirmCancel" />
   </view>
 </template>
 
 <style scoped lang="scss">
+.list-root {
+  background: #F5F5F5;
+}
 
-</style>
+.page-pad {
+  padding: 24rpx 24rpx 32rpx;
+}
+
+.order-card {
+  background: #fff;
+  border-radius: 24rpx;
+  padding: 28rpx 24rpx 24rpx;
+  box-shadow: 0 2rpx 16rpx rgba(0, 0, 0, 0.04);
+}
+
+.order-card--skeleton {
+  box-shadow: none;
+}
+
+.order-time {
+  font-size: 28rpx;
+  line-height: 36rpx;
+  color: #14181B;
+  font-weight: 500;
+}
+
+.order-status {
+  font-size: 28rpx;
+  line-height: 36rpx;
+  color: #00A76D;
+  font-weight: 500;
+}
+
+.store-row {
+  display: flex;
+  align-items: center;
+  margin-top: 20rpx;
+  gap: 0;
+}
+
+.store-icon {
+  width: 32rpx;
+  height: 32rpx;
+  margin-right: 10rpx;
+  flex-shrink: 0;
+}
+
+.store-name {
+  flex: 1;
+  min-width: 0;
+  font-size: 28rpx;
+  line-height: 36rpx;
+  color: #14181B;
+  font-weight: 500;
+}
+
+.recv-tag {
+  flex-shrink: 0;
+  margin-left: 16rpx;
+  padding: 4rpx 14rpx;
+  border-radius: 8rpx;
+  font-size: 22rpx;
+  line-height: 28rpx;
+  color: #fff;
+  font-weight: 500;
+}
+
+.recv-tag--del {
+  background: #FF6106;
+}
+
+.recv-tag--pu {
+  background: #00A76D;
+}
+
+.goods-row {
+  display: flex;
+  align-items: flex-start;
+  margin-top: 24rpx;
+  gap: 16rpx;
+}
+
+.goods-scroll {
+  flex: 1;
+  min-width: 0;
+  align-self: flex-start;
+  height: auto;
+}
+
+.goods-track {
+  display: flex;
+  flex-direction: row;
+  gap: 16rpx;
+  padding-right: 8rpx;
+}
+
+.goods-cell {
+  width: 128rpx;
+  flex-shrink: 0;
+}
+
+.goods-img-wrap {
+  position: relative;
+  width: 128rpx;
+  height: 128rpx;
+  border-radius: 16rpx;
+  overflow: hidden;
+  background: #F2F2F2;
+}
+
+.goods-img {
+  width: 100%;
+  height: 100%;
+}
+
+.goods-qty {
+  position: absolute;
+  right: 6rpx;
+  bottom: 6rpx;
+  min-width: 36rpx;
+  padding: 4rpx 10rpx;
+  background: rgba(20, 24, 27, 0.85);
+  color: #fff;
+  font-size: 20rpx;
+  line-height: 24rpx;
+  border-radius: 8rpx;
+  text-align: center;
+}
+
+.goods-caption {
+  display: block;
+  margin-top: 10rpx;
+  font-size: 22rpx;
+  line-height: 28rpx;
+  color: #333;
+  min-height: 56rpx;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  word-break: break-word;
+}
+
+.price-block {
+  text-align: right;
+  padding-top: 8rpx;
+  max-width: 200rpx;
+}
+
+.price-num {
+  display: block;
+  font-size: 32rpx;
+  line-height: 40rpx;
+  font-weight: 700;
+  color: #14181B;
+}
+
+.price-meta {
+  display: block;
+  margin-top: 8rpx;
+  font-size: 22rpx;
+  line-height: 28rpx;
+  color: #999;
+}
+
+.action-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-top: 24rpx;
+}
+
+.action-left {
+  display: flex;
+  align-items: center;
+  gap: 16rpx;
+}
+
+.action-icon {
+  width: 56rpx;
+  height: 56rpx;
+}
+
+.action-btns {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  gap: 16rpx;
+  flex-wrap: wrap;
+}
+
+.btn-outline {
+  padding: 16rpx 32rpx;
+  border-radius: 999rpx;
+  border: 2rpx solid #14181B;
+  font-size: 26rpx;
+  font-weight: 500;
+  color: #14181B;
+  background: #fff;
+  line-height: 32rpx;
+}
+
+.btn-primary {
+  padding: 16rpx 32rpx;
+  border-radius: 999rpx;
+  background: #14181B;
+  font-size: 26rpx;
+  font-weight: 500;
+  color: #fff;
+  line-height: 32rpx;
+}
+
+.sk-thumb {
+  flex-shrink: 0;
+  width: 128rpx;
+}
+
+.sk-thumb-img {
+  width: 128rpx;
+  height: 128rpx;
+  border-radius: 16rpx;
+}
+
+.sk-pill {
+  width: 176rpx;
+  height: 60rpx;
+  border-radius: 9999rpx;
+}
+</style>

src/pages/home/components/tabbar-order/tabbar-order.vue

@@ -67,32 +67,30 @@ defineExpose({
     <z-paging-swiper>
       <template #top>
         <status-bar/>
-        <view class="pl-30rpx pt-18rpx text-56rpx lh-56rpx text-#333 font-bold tracking-[.04em]">{{ t('pages.order.title') }}</view>
+        <!-- <view class="pl-30rpx pt-18rpx text-56rpx lh-56rpx text-#333 font-bold tracking-[.04em]">{{ t('pages.order.title') }}</view> -->
-        <view class="tab pl-20rpx mt-24rpx">
+        <view class="tab mt-16rpx bg-white">
           <wd-tabs
               slidable="always"
               key="tab"
-              color="#333"
+              color="#14181B"
-              inactiveColor="#999"
+              inactiveColor="#B0B0B0"
-              :line-height="3"
+              :line-height="6"
-              :line-width="30"
+              :line-width="48"
               v-model="currentIndex"
               @click="handleClickTab"
           >
-            <template v-for="(item, index) in tabList" :key="index">
+            <wd-tab v-for="(item, index) in tabList" :key="index" :title="item.name"></wd-tab>
-              <wd-tab :title="item.name"></wd-tab>
-            </template>
           </wd-tabs>
-          <view class="px-20rpx mt--2rpx">
+          <!-- <view class="px-20rpx mt--2rpx">
             <view class="border-b-solid border-b-4rpx border-b-#999"></view>
-          </view>
+          </view> -->
         </view>
       </template>
-      <swiper class="h-full"
+      <swiper class="h-full order-swiper"
               :current="currentIndex"
               @change="handleSwiperChange">
         <swiper-item class="swiper-item" v-for="(item, index) in tabList" :key="index">
-          <order-swiper-list ref="orderSwiperListRef" :currentIndex="currentIndex" :status="index"></order-swiper-list>
+          <order-swiper-list ref="orderSwiperListRef" :currentIndex="currentIndex" :status="item.value"></order-swiper-list>
         </swiper-item>
       </swiper>
       <template #bottom>
@@ -106,22 +104,44 @@ defineExpose({
 <style scoped lang="scss">
 .tab {
   :deep(.wd-tabs) {
+    background: #fff !important;
     .wd-tabs__line {
       bottom: 0 !important;
       z-index: 99 !important;
-      border-radius: 0 !important;
+      border-radius: 2rpx !important;
+      background: #14181B !important;
     }
     .wd-tabs__nav-item {
-      padding: 0 22rpx !important;
+      padding: 0 !important;
+      flex: 1 1 0 !important;
+      display: flex !important;
+      justify-content: center !important;
     }
-    .wd-tabs__nav-item-text{
+    .wd-tabs__nav-item-text {
-      font-size: 32rpx !important;
+      font-size: 26rpx !important;
       text-overflow: unset !important;
       font-family: 'UberMove', sans-serif !important;
+      // font-weight: 500 !important;
+      width: 100%;
+      text-align: center;
     }
+    .wd-tabs__nav-item.is-active .wd-tabs__nav-item-text {
+      font-weight: 700 !important;
+      color: #14181B !important;
+    }
+  }
+
+  :deep(.wd-tabs__nav-container) {
+    display: flex !important;
+    width: 100% !important;
+    justify-content: space-between !important;
   }
 }
 .bg {
-  background: linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 51%, rgba(255, 255, 255, 0) 100%);
+  background: linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 40%, rgba(245, 245, 245, 0) 100%);
+}
+
+.order-swiper {
+  background-color: #F5F5F5;
 }
 </style>

src/pages/search/components/search-dish-result-item.vue

@@ -0,0 +1,226 @@
+<script setup lang="ts">
+import { computed } from 'vue'
+import Config from '@/config/index'
+import { formatSalesCount } from '@/utils/utils'
+
+const { t } = useI18n()
+
+type DishItem = {
+  id: number | string
+  merchantId?: number | string
+  dishName?: string
+  dishImage?: string
+  discountPrice?: number | string
+  originalPrice?: number | string
+  memberPrice?: number | string
+  salesCount?: number | string
+  [key: string]: unknown
+}
+
+const props = defineProps<{
+  item: DishItem
+}>()
+
+function goDetail() {
+  const { item } = props
+  if (item.merchantId) {
+    uni.navigateTo({
+      url: `/pages-store/pages/store/dishes?id=${item.id}&storeId=${item.merchantId}`,
+    })
+  } else {
+    uni.navigateTo({
+      url: `/pages-store/pages/store/index?id=${item.id}`,
+    })
+  }
+}
+
+const cover = computed(() => {
+  const raw = props.item?.dishImage
+  if (typeof raw === 'string' && raw) return raw.split(',')[0]
+  return ''
+})
+</script>
+
+<template>
+  <view class="search-dish-item" @click="goDetail">
+    <view class="search-dish-item__img-wrap">
+      <view v-if="item.isNew == 1" class="dish-new-ribbon">
+        <text class="dish-new-ribbon__text">NEW</text>
+      </view>
+      <image :src="cover" mode="aspectFill" class="search-dish-item__img" />
+    </view>
+    <view class="search-dish-item__main">
+      <text class="search-dish-item__title line-clamp-2">{{ item.dishName || '' }}</text>
+      <view class="search-dish-item__price-row">
+        <text class="search-dish-item__price-current">
+          ${{ item.discountPrice ?? item.originalPrice }}
+        </text>
+        <text
+          v-if="
+            Number(item.originalPrice) > 0 &&
+            Number(item.originalPrice) > Number(item.discountPrice ?? item.originalPrice)
+          "
+          class="search-dish-item__price-old"
+        >${{ item.originalPrice }}</text>
+      </view>
+      <view
+        v-if="Number(item.memberPrice) > 0"
+        class="search-dish-item__member"
+      >
+        <text class="search-dish-item__member-diamond">◆</text>
+        <text class="search-dish-item__member-text">
+          {{ Config.appName }} {{ t('pages.search.member-price-line') }}: ${{ item.memberPrice }}
+        </text>
+      </view>
+      <view class="search-dish-item__sales-wrap">
+        <text class="search-dish-item__sales-tag">
+          {{ t('pages.search.weekly-sales') }}：{{ formatSalesCount(item.salesCount) }}
+        </text>
+      </view>
+    </view>
+    <view class="search-dish-item__add shrink-0" @click.stop="goDetail">
+      <image src="/static/app/images/add_cart.png" class="search-dish-item__add-icon" mode="aspectFit" />
+    </view>
+  </view>
+</template>
+
+<style scoped lang="scss">
+.search-dish-item {
+  display: flex;
+  flex-direction: row;
+  align-items: stretch;
+  padding: 28rpx 24rpx;
+  background: #fff;
+  border-bottom: 1rpx solid #ebebeb;
+}
+
+.search-dish-item__img {
+  width: 200rpx;
+  height: 200rpx;
+  background: #f2f2f2;
+  display: block;
+}
+
+.search-dish-item__main {
+  flex: 1;
+  min-width: 0;
+  margin-left: 24rpx;
+  margin-right: 16rpx;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+}
+
+.search-dish-item__title {
+  font-size: 28rpx;
+  line-height: 40rpx;
+  font-weight: 500;
+  color: #1a1a1a;
+}
+
+.search-dish-item__price-row {
+  display: flex;
+  flex-direction: row;
+  align-items: baseline;
+  flex-wrap: wrap;
+  gap: 12rpx;
+  margin-top: 12rpx;
+}
+
+.search-dish-item__price-current {
+  font-size: 32rpx;
+  line-height: 36rpx;
+  font-weight: 700;
+  color: #e02e24;
+}
+
+.search-dish-item__price-old {
+  font-size: 24rpx;
+  line-height: 28rpx;
+  color: #999;
+  text-decoration: line-through;
+}
+
+.search-dish-item__member {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  margin-top: 12rpx;
+  padding: 6rpx 0;
+  gap: 6rpx;
+}
+
+.search-dish-item__member-diamond {
+  font-size: 20rpx;
+  line-height: 1;
+  color: #b8860b;
+}
+
+.search-dish-item__member-text {
+  font-size: 24rpx;
+  line-height: 32rpx;
+  font-weight: 500;
+  color: #8b6914;
+}
+
+.search-dish-item__sales-wrap {
+  margin-top: auto;
+  padding-top: 12rpx;
+}
+
+.search-dish-item__sales-tag {
+  display: inline-block;
+  padding: 8rpx 18rpx;
+  border-radius: 999rpx;
+  background: #f5f5f5;
+  font-size: 22rpx;
+  line-height: 28rpx;
+  color: #888;
+}
+
+.search-dish-item__add {
+  align-self: flex-end;
+  flex-shrink: 0;
+}
+
+.search-dish-item__add-icon {
+  width: 64rpx;
+  height: 64rpx;
+  display: block;
+}
+
+.search-dish-item__img-wrap {
+  position: relative;
+  width: 200rpx;
+  height: 200rpx;
+  border-radius: 20rpx;
+  overflow: hidden;
+  flex-shrink: 0;
+}
+
+.dish-new-ribbon {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 184rpx;
+  height: 184rpx;
+  overflow: hidden;
+  z-index: 5;
+  pointer-events: none;
+
+  &__text {
+    position: absolute;
+    top: 26rpx;
+    left: -66rpx;
+    width: 240rpx;
+    text-align: center;
+    font-size: 22rpx;
+    font-weight: 700;
+    color: #fff;
+    letter-spacing: 2rpx;
+    line-height: 44rpx;
+    background: #E23636;
+    transform: rotate(-45deg);
+  }
+}
+</style>

src/pages/search/components/search-history/index.vue

@@ -1,56 +0,0 @@
-<template>
-  <view class="pt-52rpx pl-30rpx bg-#fff" v-if="searchStore.historyList?.length">
-    <view class="text-40rpx lh-40rpx text-#333 font-bold mb-24rpx tracking-[.04em]">{{ t('pages.search.recently') }}</view>
-    <view class="">
-      <template v-for="(item, index) in searchStore.historyList" :key="index">
-        <wd-swipe-action>
-          <view @click="handleSearch(item,index)" class="w-full h-110rpx flex items-center">
-            <image src="@img/chef/130.png" class="w-28rpx h-28rpx mr-44rpx"></image>
-            <view class="flex-1 border-b-solid border-b-1rpx border-b-#DFDFDF h-full flex items-center text-30rpx text-primary font-500 tracking-[.06em] line-clamp-1">{{ item.text }}</view>
-          </view>
-          <template #right>
-            <view @click="handleRemove(index)" class="w-110rpx h-110rpx bg-#FF4848 center">
-              <image src="@img/chef/129.png" class="w-44rpx h-50rpx"></image>
-            </view>
-          </template>
-        </wd-swipe-action>
-      </template>
-    </view>
-  </view>
-  <wd-message-box/>
-</template>
-
-<script lang="ts" setup>
-import {useSearchStore} from "@/store";
-import {useMessage,} from "wot-design-uni";
-
-const {t} = useI18n()
-
-const message = useMessage()
-const searchStore = useSearchStore()
-const isRemove = ref(false)
-
-
-function handleSearch(item: { text: string }, index: number) {
-  if (isRemove.value) {
-    handleRemove(index)
-    return
-  }
-  console.log(item)
-  nextTick(() => {
-    searchStore.setHistoryList(item.text)
-    uni.navigateTo({
-      url: `/pages/search/result?keyword=${item.text}`,
-    })
-  })
-}
-
-function handleRemove(index: number) {
-  searchStore.historyList.splice(index, 1)
-  if (searchStore.historyList.length === 0) {
-    isRemove.value = false
-  }
-}
-</script>
-
-<style lang="scss" scoped></style>