更新

TUICallKit-Vue3/tongji/pages/game.vue

@@ -158,29 +158,37 @@
         <view class="gg-main" :style="mainStyle">
             <!-- 次：仅展示上次消除的食物与含糖量 -->
             <view v-if="gamePhase === 'playing'" class="gg-hud-last-food">
-                <text class="gg-hud-last-food-kicker">上次消除</text>
+                <view class="gg-hud-last-food-head">
+                    <text class="gg-hud-last-food-kicker">上次消除</text>
+                    <view
+                        v-if="lastClearedFood"
+                        class="gg-hud-last-food-chip"
+                        :class="'is-' + lastClearedFood.gi"
+                    >
+                        <text class="gg-hud-last-food-chip-dot"></text>
+                        <text class="gg-hud-last-food-chip-text">{{ lastClearedFood.giShort }}</text>
+                    </view>
+                </view>
                 <view
                     v-if="lastClearedFood"
                     class="gg-hud-last-food-card"
                     :class="'is-' + lastClearedFood.gi"
                 >
-                    <view class="gg-hud-last-food-icon">
+                    <view class="gg-hud-last-food-icon" :class="'is-' + lastClearedFood.gi">
                         <FoodTileIcon :food="lastClearedFood.food" size="goal" />
                     </view>
                     <view class="gg-hud-last-food-body">
                         <text class="gg-hud-last-food-name">{{ lastClearedFood.name }}</text>
                         <view class="gg-hud-last-food-sugar-row">
-                            <text class="gg-hud-last-food-sugar-label">含糖量</text>
-                            <text
-                                class="gg-hud-last-food-gi"
-                                :class="'is-' + lastClearedFood.gi"
-                                :style="{ backgroundColor: lastClearedFood.color }"
-                            >{{ lastClearedFood.giShort }}</text>
+                            <view class="gg-hud-last-food-gi" :class="'is-' + lastClearedFood.gi">
+                                <text class="gg-hud-last-food-gi-text">含糖 {{ lastClearedFood.giShort }}</text>
+                            </view>
                             <text class="gg-hud-last-food-sugar-hint">{{ lastClearedFood.eatHint }}</text>
                         </view>
                     </view>
                 </view>
                 <view v-else class="gg-hud-last-food-placeholder">
+                    <view class="gg-hud-last-food-placeholder-dot" aria-hidden="true"></view>
                     <text>三连消除后，这里显示食物名称与含糖量</text>
                 </view>
             </view>
@@ -290,6 +298,7 @@ import {
     getClearVal,
     getFoodTip,
     formatEatLabel,
+    getFoodByKey,
     GI_SHORT,
     GI_COLOR
 } from '../data/gameFoodLibrary.js'
@@ -365,6 +374,25 @@ function pickRandom(pool, n) {
  * 低/中各若干 + 仅 1 种高糖；再从中挑 2 种作为收集目标。
  */
 function selectSessionFoods() {
+    // 固定食材关卡（如第一关）：只用配置里的这些食物
+    const fixedKeys = levelConfig.value.foods
+    if (Array.isArray(fixedKeys) && fixedKeys.length) {
+        const fixed = fixedKeys.map((k) => getFoodByKey(k)).filter(Boolean)
+        const fixedHighs = fixed.filter((f) => f.gi === 'high')
+        const fixedHighPick = pickRandom(fixedHighs, 1)
+        sessionHighFood.value = fixedHighPick[0] ? cloneFoodType(fixedHighPick[0]) : null
+
+        activeFoods.value = fixed
+        warmUpFoodImgs(fixed)
+
+        const goalFoods = pickRandom(fixed, 2)
+        const fixedTargets = levelConfig.value.goalTargets || [10, 12]
+        goalDefs.value = goalFoods.map((f, i) => ({ key: f.key, food: cloneFoodType(f), target: fixedTargets[i] ?? 10 }))
+
+        rebuildGoals()
+        return
+    }
+
     const lows = FOOD_LIBRARY.filter((f) => f.gi === 'low')
     const mids = FOOD_LIBRARY.filter((f) => f.gi === 'mid')
     const highs = FOOD_LIBRARY.filter((f) => f.gi === 'high')
@@ -554,7 +582,7 @@ const gridStyle = computed(() => {
     }
     if (w > 0 && h > 0) {
         style.width = `${w}px`
-        style.height = `${h}px`
+        style.height = `${h+10}px`
     }
     return style
 })