From b522ce527dc97a9ed6d7c09edd88aa7aae020bee Mon Sep 17 00:00:00 2001
From: zhangyan <lenovo@example.com>
Date: Wed, 12 Aug 2026 15:13:29 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E8=B0=83=E6=96=99=E7=BB=84=E9=85=8D?=
 =?UTF-8?q?=E5=8C=BA=E5=A2=9E=E5=8A=A0=E5=B1=95=E5=BC=80/=E6=8A=98?=
 =?UTF-8?q?=E5=8F=A0=E5=BC=80=E5=85=B3=20+=20=E5=BA=94=E7=A7=B0=E5=B7=B2?=
 =?UTF-8?q?=E7=A7=B0=E6=94=B9=E4=B8=BA=20X/Yg=20=E6=A0=BC=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 调料组配区标题右侧增加"是否需要"滑动开关（是/否）
- 应称/已称 双字段合并为单字段 已称/应称g 格式
- 开关关闭时隐藏调料网格

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 .../ratio-scale/02-weighing-packing.html      | 52 +++++++++++++++----
 1 file changed, 42 insertions(+), 10 deletions(-)

diff --git a/other-module/canteen-device/ratio-scale/02-weighing-packing.html b/other-module/canteen-device/ratio-scale/02-weighing-packing.html
index db850f7..48b52f1 100644
--- a/other-module/canteen-device/ratio-scale/02-weighing-packing.html
+++ b/other-module/canteen-device/ratio-scale/02-weighing-packing.html
@@ -305,6 +305,29 @@
     .section-divider__icon { font-size: 14px; }
     .section-divider__line { flex: 1; height: 1px; background: rgba(255,255,255,0.08); }
 
+    /* 调料组配区展开/折叠开关 */
+    .seasoning-toggle {
+      display: flex; align-items: center; gap: 6px; margin-left: auto;
+      cursor: pointer; user-select: none; flex-shrink: 0;
+      font-size: 11px; color: rgba(255,255,255,0.35); font-weight: 400; letter-spacing: 0;
+    }
+    .seasoning-toggle__track {
+      width: 40px; height: 20px; border-radius: 10px;
+      background: rgba(255,255,255,0.12); transition: background 0.25s;
+      position: relative; flex-shrink: 0;
+    }
+    .seasoning-toggle__thumb {
+      position: absolute; top: 1px; left: 1px;
+      width: 18px; height: 18px; border-radius: 50%;
+      background: rgba(255,255,255,0.6); transition: transform 0.25s;
+      display: flex; align-items: center; justify-content: center;
+      font-size: 9px; font-weight: 700; color: rgba(255,255,255,0.7);
+    }
+    .seasoning-toggle--on .seasoning-toggle__track { background: #4a90d9; }
+    .seasoning-toggle--on .seasoning-toggle__thumb {
+      background: #fff; transform: translateX(20px); color: #4a90d9;
+    }
+
     /* ===== 调料组配网格 ===== */
     .seasoning-section { flex-shrink: 0; display: flex; flex-direction: column; gap: 6px; }
     .seasoning-grid {
@@ -332,12 +355,11 @@
     }
     .seasoning-cell--info .sea-name-icon { font-size: 22px; }
     .seasoning-cell--info .sea-fields {
-      display: grid; grid-template-columns: 1fr 1fr; gap: 4px 12px;
+      display: flex; gap: 4px;
     }
     .seasoning-cell--info .sea-field {
       display: flex; align-items: center; gap: 4px; font-size: 14px;
     }
-    .seasoning-cell--info .sea-field__label { color: rgba(255,255,255,0.35); }
     .seasoning-cell--info .sea-field__value { color: rgba(255,255,255,0.75); font-weight: 500; }
     .seasoning-cell--info .sea-field__value--done { color: #52c41a; }
     .seasoning-cell--info .sea-slot__status {
@@ -380,12 +402,11 @@
     }
     .sea-slot__name-icon { font-size: 16px; }
     .sea-slot__fields {
-      display: grid; grid-template-columns: 1fr 1fr; gap: 2px 8px;
+      display: flex; gap: 2px;
     }
     .sea-slot__field {
       display: flex; gap: 3px; font-size: 11px; line-height: 1.4;
     }
-    .sea-slot__field-label { color: rgba(255,255,255,0.35); }
     .sea-slot__field-value { color: rgba(255,255,255,0.65); font-weight: 500; }
     .sea-slot__field-value--done { color: #52c41a; }
     .sea-slot__status {
@@ -501,6 +522,10 @@
         <div class="section-divider">
           <span class="section-divider__icon">&#x1F9C2;</span>调料组配
           <span class="section-divider__line"></span>
+          <div class="seasoning-toggle seasoning-toggle--on" id="seasoningToggle" onclick="toggleSeasoning()">
+            <span>是否需要</span>
+            <div class="seasoning-toggle__track"><div class="seasoning-toggle__thumb">是</div></div>
+          </div>
         </div>
         <div class="seasoning-grid" id="seasoningGrid">
           <!-- 动态渲染 -->
@@ -870,6 +895,16 @@
       });
     }
 
+    /* ---- 调料组配区展开/折叠 ---- */
+    function toggleSeasoning() {
+      var toggle = document.getElementById('seasoningToggle');
+      var grid = document.getElementById('seasoningGrid');
+      var thumb = toggle.querySelector('.seasoning-toggle__thumb');
+      var isOn = toggle.classList.toggle('seasoning-toggle--on');
+      grid.style.display = isOn ? 'grid' : 'none';
+      thumb.textContent = isOn ? '是' : '否';
+    }
+
     /* ---- 渲染调料组配网格（3行×5列=15格，左上4格合并为信息格固定显示油，11格为调料位） ---- */
     function renderSeasoningGrid() {
       var grid = document.getElementById('seasoningGrid');
@@ -895,8 +930,7 @@
           '<span class="sea-slot__status ' + oilStatusCls + '">' + oilStatusText + '</span>' +
           '<div class="sea-name"><span class="sea-name-icon">' + (oilSea.icon || '&#x1F6E2;') + '</span>' + oilSea.name + '</div>' +
           '<div class="sea-fields">' +
-            '<div class="sea-field"><span class="sea-field__label">应称</span><span class="sea-field__value">' + oilNeed + 'g</span></div>' +
-            '<div class="sea-field"><span class="sea-field__label">已称</span><span class="sea-field__value ' + oilActualCls + '">' + oilSea.weighed + 'g</span></div>' +
+            '<div class="sea-field"><span class="sea-field__value ' + oilActualCls + '">' + oilSea.weighed + '/' + oilNeed + 'g</span></div>' +
           '</div>';
       } else {
         infoCell.innerHTML = '<div class="sea-name" style="color:#52c41a">全部完成</div>';
@@ -945,8 +979,7 @@
             '<span class="sea-slot__status ' + statusCls + '">' + statusText + '</span>' +
             '<div class="sea-slot__name"><span class="sea-slot__name-icon">' + (neededSea.icon || '&#x1F9C2;') + '</span>' + neededSea.name + '</div>' +
             '<div class="sea-slot__fields">' +
-              '<div class="sea-slot__field"><span class="sea-slot__field-label">应称</span><span class="sea-slot__field-value">' + seaNeed2 + 'g</span></div>' +
-              '<div class="sea-slot__field"><span class="sea-slot__field-label">已称</span><span class="sea-slot__field-value ' + actualCls2 + '">' + neededSea.weighed + 'g</span></div>' +
+              '<div class="sea-slot__field"><span class="sea-slot__field-value ' + actualCls2 + '">' + neededSea.weighed + '/' + seaNeed2 + 'g</span></div>' +
             '</div>';
 
           cell.onclick = (function(idx) { return function() { confirmSeasoningDirect(idx); }; })(findSeasoningIdxByPos(pos));
@@ -958,8 +991,7 @@
             '<span class="sea-slot__pos">' + pos + '</span>' +
             '<div class="sea-slot__name"><span class="sea-slot__name-icon">' + cfgIcon + '</span>' + cfg.name + '</div>' +
             '<div class="sea-slot__fields">' +
-              '<div class="sea-slot__field"><span class="sea-slot__field-label">应称</span><span class="sea-slot__field-value">--</span></div>' +
-              '<div class="sea-slot__field"><span class="sea-slot__field-label">已称</span><span class="sea-slot__field-value">--</span></div>' +
+              '<div class="sea-slot__field"><span class="sea-slot__field-value">--/--</span></div>' +
             '</div>';
         } else {
           cell.innerHTML = '<span class="sea-slot__pos">' + pos + '</span><div class="sea-slot__empty">空位</div>';