feat: 获取任务新增未完成净菜卡片,进度100%自动隐藏

- 「获取任务」按钮新增随机未完成净菜加工任务(进度0~70%)
- 卡片进度=100%时自动隐藏
- 使用唯一ID定位删除,避免索引错位
- 顶部「刷新」按钮保留,用于对已有卡片弹窗确认重量

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
zhangyan
2026-06-17 09:43:12 +08:00
co-authored by Claude Opus 4.6
parent 700495771b
commit f3a3701397
@@ -360,7 +360,7 @@
<!-- 右列:净菜列表 -->
<div class="col-right">
<!-- 净菜加工卡片列表 -->
<button class="fetch-task-btn" onclick="handleRefresh()">&#x1F4E5; 获取任务</button>
<button class="fetch-task-btn" onclick="handleFetchTask()">&#x1F4E5; 获取任务</button>
<div class="food-cards" id="foodCards"></div>
<!-- 底部操作栏 -->
@@ -428,7 +428,8 @@
var currentUser = null;
var acceptedFoods = [];
var pendingWeightFood = null; // 待确认重量的净菜引用
var pendingWeightFood = null;
var foodIdCounter = 0; // 唯一ID计数器
// ---- URL 参数 ----
function getUrlParam(name) {
@@ -447,22 +448,25 @@
// 初始化净菜列表(带累计已加工重量)
acceptedFoods = mockFoods.map(function(f) {
return { name: f.name, size: f.size, shape: f.shape, blade: f.blade, target: f.target, processed: f.processed, icon: f.icon };
foodIdCounter++;
return { id: foodIdCounter, name: f.name, size: f.size, shape: f.shape, blade: f.blade, target: f.target, processed: f.processed, icon: f.icon };
});
renderFoodCards();
})();
// ---- 渲染净菜卡片列表 ----
// ---- 渲染净菜卡片列表(隐藏已完成的) ----
function renderFoodCards() {
var container = document.getElementById('foodCards');
var html = '';
acceptedFoods.forEach(function(f, idx) {
// 只渲染未完成的(processed < target
acceptedFoods.forEach(function(f) {
if (f.processed >= f.target) return; // 已完成则隐藏
var pct = f.target > 0 ? Math.min(100, (f.processed / f.target) * 100) : 0;
html += '<div class="food-card">'
+ '<div class="food-card__header">'
+ '<span class="food-card__icon">' + f.icon + '</span>'
+ '<span class="food-card__name">' + f.name + '</span>'
+ '<button class="food-card__delete" onclick="removeFood(' + idx + ')" title="删除">&#x2715;</button>'
+ '<button class="food-card__delete" onclick="removeFood(' + f.id + ')" title="删除">&#x2715;</button>'
+ '</div>'
+ '<span class="food-card__spec">' + f.size + ' · ' + f.shape + ' · ' + f.blade + '</span>'
+ '<div class="food-card__progress">'
@@ -477,19 +481,42 @@
+ '</div>';
});
if (html === '') {
html = '<div style="grid-column:1/-1;text-align:center;padding:40px;color:rgba(255,255,255,0.2);font-size:13px;">暂无加工净菜,点击右上角「刷新」获取</div>';
html = '<div style="grid-column:1/-1;text-align:center;padding:40px;color:rgba(255,255,255,0.2);font-size:13px;">暂无加工净菜,点击上方「获取任务」添加</div>';
}
container.innerHTML = html;
}
// ---- 删除净菜 ----
function removeFood(idx) {
acceptedFoods.splice(idx, 1);
function removeFood(id) {
for (var i = 0; i < acceptedFoods.length; i++) {
if (acceptedFoods[i].id === id) { acceptedFoods.splice(i, 1); break; }
}
renderFoodCards();
showToast('已删除', 1000);
}
// ---- 刷新:模拟获取加工任务最新重量 ----
// ---- 获取任务:新增一个未完成的净菜加工任务 ----
function handleFetchTask() {
showToast('正在获取加工任务...', 800);
setTimeout(function() {
// 从食材库随机选一个,排除已在列表中未完成的同名净菜
var existingNames = acceptedFoods.filter(function(f) { return f.processed < f.target; }).map(function(f) { return f.name; });
var available = foodDatabase.filter(function(f) { return existingNames.indexOf(f.name) === -1; });
if (available.length === 0) {
showToast('暂无可获取的净菜任务', 1200, 'warn');
return;
}
var food = available[Math.floor(Math.random() * available.length)];
var target = parseFloat((Math.random() * 5 + 1.5).toFixed(1));
var processed = parseFloat((Math.random() * target * 0.7).toFixed(1)); // 0~70%进度,确保未完成
foodIdCounter++;
acceptedFoods.push({ id: foodIdCounter, name: food.name, size: food.size, shape: food.shape, blade: food.blade, target: target, processed: processed, icon: food.icon });
renderFoodCards();
showToast('已获取:' + food.name + '(应加工 ' + target.toFixed(1) + '斤)', 1500);
}, 800);
}
// ---- 刷新:模拟获取加工任务最新重量 ----(顶部刷新按钮)
function handleRefresh() {
showToast('正在获取加工数据...', 800);
setTimeout(function() {