feat； 权益展示调整

scripts/build-icons.mjs

@@ -68,7 +68,7 @@ const FILL_ICONS = {
 const MATRIX = {
   pin: ["ink3", "brand", "white"],
   arrow: ["white", "brandDeep", "ink"],
-  chev: ["ink3", "white", "brand", "ink2", "accentDeep"],
+  chev: ["ink3", "white", "brand", "ink2", "accentDeep", "brandDeep"],
   back: ["ink", "white", "brand"],
   phone: ["white", "brandDeep"],
   copy: ["brandDeep", "brand"],

src/components/AppNavBar/index.vue

@@ -75,7 +75,7 @@ const onShare = () => emit("share");
       </view>
     </view>
 
-    <view class="flex items-center justify-center shrink-0 ml-auto" :class="btnCls">
+    <view v-if="showShare || $slots.right" class="flex items-center justify-center shrink-0 ml-auto" :class="btnCls">
       <slot name="right">
         <view v-if="showShare" class="w-full h-full flex items-center justify-center" hover-class="opacity-60" @click="onShare">
           <AppIcon name="share" :tone="iconTone" :size="22" />

src/components/BenefitCard/index.vue

@@ -162,7 +162,7 @@ const onTap = () => {
           :class="specCls">
           {{ spec }}
         </text>
-        <view class="min-w-0 flex-1 line-clamp-1">{{ b.special_notes || b.description || b.merchant_name || "" }}</view>
+        <view class="min-w-0 flex-1 line-clamp-1">{{ b.title || b.special_notes || b.description || b.merchant_name || "" }}</view>
       </view>
 
       <!-- ④ 有效期 + 第二项随态 -->

src/pages-sub/detail/index.vue

@@ -24,6 +24,14 @@ const benefits = ref([]);
 const related = ref([]);
 const current = ref(0);
 
+/** 到店权益折叠：超过 3 张默认只展示前 3 张 */
+const BENEFIT_VISIBLE = 3;
+const benefitsExpanded = ref(false);
+const collapsibleBenefit = computed(() => benefits.value.length > BENEFIT_VISIBLE);
+const shownBenefits = computed(() =>
+  benefitsExpanded.value ? benefits.value : benefits.value.slice(0, BENEFIT_VISIBLE)
+);
+
 const images = computed(() => {
   if (!merchant.value) return [];
   return unique(
@@ -213,8 +221,17 @@ onShareAppMessage(() => ({
         <view class="flex items-center gap-2 text-[16px] font-bold tracking-[-0.3px] text-ink deco-titledot">
           到店权益
         </view>
-        <BenefitCard v-for="benefit in benefits" :key="benefit.id" :benefit="benefit" mode="detail"
+        <BenefitCard v-for="benefit in shownBenefits" :key="benefit.id" :benefit="benefit" mode="detail"
           @action="onClaimBenefit" />
+
+        <view v-if="collapsibleBenefit"
+          class="mt-[11px] h-[34px] rounded-full flex items-center justify-center gap-[3px] text-cap font-semibold text-brand-deep bg-brand-soft border-[0.5px] border-brand-line"
+          hover-class="opacity-90" @click="benefitsExpanded = !benefitsExpanded">
+          <text>{{ benefitsExpanded ? "收起" : `展开全部权益 · 共 ${benefits.length} 项` }}</text>
+          <view class="flex" :class="benefitsExpanded ? '[rotate:-90deg]' : '[rotate:90deg]'">
+            <AppIcon name="chev" tone="brandDeep" :size="11" />
+          </view>
+        </view>
       </view>
 
       <!-- 附近同类推荐（图上压字卡） -->

src/styles/icons.scss

@@ -13,6 +13,7 @@
 .ai-chev.t-brand{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyNCAyNCcgZmlsbD0nbm9uZScgc3Ryb2tlPScjMDBCNTc4JyBzdHJva2Utd2lkdGg9JzEuOScgc3Ryb2tlLWxpbmVjYXA9J3JvdW5kJyBzdHJva2UtbGluZWpvaW49J3JvdW5kJz48cGF0aCBkPSJNOS41IDUuNSAxNiAxMmwtNi41IDYuNSIvPjwvc3ZnPg==")}
 .ai-chev.t-ink2{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyNCAyNCcgZmlsbD0nbm9uZScgc3Ryb2tlPScjNkI3MjgwJyBzdHJva2Utd2lkdGg9JzEuOScgc3Ryb2tlLWxpbmVjYXA9J3JvdW5kJyBzdHJva2UtbGluZWpvaW49J3JvdW5kJz48cGF0aCBkPSJNOS41IDUuNSAxNiAxMmwtNi41IDYuNSIvPjwvc3ZnPg==")}
 .ai-chev.t-accentDeep{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyNCAyNCcgZmlsbD0nbm9uZScgc3Ryb2tlPScjQzk1NTBDJyBzdHJva2Utd2lkdGg9JzEuOScgc3Ryb2tlLWxpbmVjYXA9J3JvdW5kJyBzdHJva2UtbGluZWpvaW49J3JvdW5kJz48cGF0aCBkPSJNOS41IDUuNSAxNiAxMmwtNi41IDYuNSIvPjwvc3ZnPg==")}
+.ai-chev.t-brandDeep{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyNCAyNCcgZmlsbD0nbm9uZScgc3Ryb2tlPScjMDA5QTY3JyBzdHJva2Utd2lkdGg9JzEuOScgc3Ryb2tlLWxpbmVjYXA9J3JvdW5kJyBzdHJva2UtbGluZWpvaW49J3JvdW5kJz48cGF0aCBkPSJNOS41IDUuNSAxNiAxMmwtNi41IDYuNSIvPjwvc3ZnPg==")}
 .ai-back.t-ink{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyNCAyNCcgZmlsbD0nbm9uZScgc3Ryb2tlPScjMTQxODFDJyBzdHJva2Utd2lkdGg9JzEuOScgc3Ryb2tlLWxpbmVjYXA9J3JvdW5kJyBzdHJva2UtbGluZWpvaW49J3JvdW5kJz48cGF0aCBkPSJNMTQuNSA1LjUgOCAxMmw2LjUgNi41Ii8+PC9zdmc+")}
 .ai-back.t-white{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyNCAyNCcgZmlsbD0nbm9uZScgc3Ryb2tlPScjRkZGRkZGJyBzdHJva2Utd2lkdGg9JzEuOScgc3Ryb2tlLWxpbmVjYXA9J3JvdW5kJyBzdHJva2UtbGluZWpvaW49J3JvdW5kJz48cGF0aCBkPSJNMTQuNSA1LjUgOCAxMmw2LjUgNi41Ii8+PC9zdmc+")}
 .ai-back.t-brand{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyNCAyNCcgZmlsbD0nbm9uZScgc3Ryb2tlPScjMDBCNTc4JyBzdHJva2Utd2lkdGg9JzEuOScgc3Ryb2tlLWxpbmVjYXA9J3JvdW5kJyBzdHJva2UtbGluZWpvaW49J3JvdW5kJz48cGF0aCBkPSJNMTQuNSA1LjUgOCAxMmw2LjUgNi41Ii8+PC9zdmc+")}