| { |
| "task_id": "c50", |
| "layer": "composite", |
| "seed_type": "prd", |
| "operators": [ |
| "generate", |
| "restyle", |
| "add state", |
| "wire up data", |
| "restructure layout" |
| ], |
| "difficulty": "challenging", |
| "levers": [ |
| "state coupling", |
| "cross-requirement combined state", |
| "exact numeric assertions" |
| ], |
| "domain": "tool dashboard", |
| "repair": false, |
| "inject_type": null, |
| "seed_meta": { |
| "authored_by": "hand", |
| "materials": "none" |
| }, |
| "title": "Gateway Panel: From Site Build to Discounted-Price Recalculation", |
| "milestones": [ |
| { |
| "operator": "generate", |
| "request": "Build a site homepage called “Gateway Panel”, with the tagline “Leave the complexity to the backend”. Put the site name, an “Enabled Modules (0)” entry, and a “Total ¥0” in the top bar.\n\nThe filter bar categories are All / Monitoring / Alerts / Reports, defaulting to “All”. The module list has 19 items in total: Monitoring 7, Alerts 7, Reports 5. Each item has a name, its category, a list price, and an “Enable” button.\n\nList prices are calculated by position: item n = 80 + n × 40. There is also a rule: items with a list price of 300 or more get 20% off, rounded down, and the card must show both the original price and the discounted price." |
| }, |
| { |
| "operator": "add state", |
| "request": "“Enable” must actually work: after clicking, the button changes to “Enabled”, the top-bar count increases by 1, and the top-bar “Total” adds this item's **discounted price**; clicking again cancels and both decrease back. The total must be calculated accurately using discounted prices." |
| }, |
| { |
| "operator": "restyle", |
| "request": "Add a “Night mode” toggle to the top bar; turning it on switches the whole site to dark mode (darker background, lighter body text). The toggle state must persist after switching categories, and the top-bar count and total must not change because of the theme switch." |
| }, |
| { |
| "operator": "restructure layout", |
| "request": "Change the module list into a grid, with 3 items per row at desktop width. After the change, the list price, discounted price, sorting, selected state, and total must all be identical to before." |
| }, |
| { |
| "operator": "remove section", |
| "request": "We're dropping the “Reports” category; remove the category together with those 5 items. After removal, list prices are recalculated by new position (item n = 80 + n × 40), and the discount rule still applies as before." |
| } |
| ], |
| "checklist": [ |
| { |
| "id": "gen.tabs", |
| "m": 1, |
| "dimension": "visual", |
| "w": 1.5, |
| "description": "The filter bar has exactly 4 categories: All / Monitoring / Alerts / Reports; “All” is selected and distinguishable." |
| }, |
| { |
| "id": "gen.total", |
| "m": 1, |
| "dimension": "functional", |
| "w": 1.5, |
| "description": "There are 19 items in total under All." |
| }, |
| { |
| "id": "gen.price", |
| "m": 1, |
| "dimension": "functional", |
| "w": 1.5, |
| "description": "List prices are calculated by position: item 1 is ¥120, item 2 is ¥160, item 6 is ¥320." |
| }, |
| { |
| "id": "gen.disc.exact", |
| "m": 1, |
| "dimension": "functional", |
| "w": 1.5, |
| "description": "A 20% discount applies at a list price of 300 or above, rounded down: item 6's discounted price is ¥256 (if its list price has not reached the threshold, no discounted price is shown)." |
| }, |
| { |
| "id": "gen.disc.boundary", |
| "m": 1, |
| "dimension": "functional", |
| "w": 1.5, |
| "description": "Items with a list price below 300 do not show a discounted price; only the original price is shown." |
| }, |
| { |
| "id": "gen.split", |
| "m": 1, |
| "dimension": "functional", |
| "w": 1.0, |
| "description": "After switching categories, the counts per category are: Monitoring 7, Alerts 7, Reports 5." |
| }, |
| { |
| "id": "gen.card", |
| "m": 1, |
| "dimension": "visual", |
| "w": 1.0, |
| "description": "Each card simultaneously shows the name, category, list price, and an “Enable” button." |
| }, |
| { |
| "id": "gen.header", |
| "m": 1, |
| "dimension": "visual", |
| "w": 1.0, |
| "description": "The top bar shows the site name “Gateway Panel”, the “Enabled Modules” entry (initially 0), and “Total ¥0”." |
| }, |
| { |
| "id": "gen.sel.one", |
| "m": 1, |
| "dimension": "visual", |
| "w": 1.0, |
| "description": "At any given moment, exactly one category is selected." |
| }, |
| { |
| "id": "st.add1", |
| "m": 2, |
| "dimension": "interaction", |
| "w": 1.5, |
| "description": "Click “Enable” on item 1; the button changes to “Enabled”, the count is 1, and the total becomes ¥120." |
| }, |
| { |
| "id": "st.add2", |
| "m": 2, |
| "dimension": "interaction", |
| "w": 1.5, |
| "description": "Then select item 6; the count is 2 and the total becomes ¥376 (accumulated using the discounted price)." |
| }, |
| { |
| "id": "st.cancel", |
| "m": 2, |
| "dimension": "interaction", |
| "w": 1.5, |
| "description": "Cancel item 6; the count returns to 1 and the total returns to ¥120." |
| }, |
| { |
| "id": "st.keep.tab", |
| "m": 2, |
| "dimension": "interaction", |
| "w": 1.5, |
| "description": "After selecting 2 items, switch to “Monitoring” and back to All; both the count and total remain unchanged." |
| }, |
| { |
| "id": "st.sum.uses.disc", |
| "m": 2, |
| "dimension": "functional", |
| "w": 1.5, |
| "description": "The total uses discounted prices rather than original prices (for an item that has reached the discount threshold, the increment to the total equals its discounted price)." |
| }, |
| { |
| "id": "skin.toggle", |
| "m": 3, |
| "dimension": "visual", |
| "w": 1.5, |
| "description": "A “Night mode” toggle exists in the top bar; it is clickable and has two clearly distinct states." |
| }, |
| { |
| "id": "skin.dark", |
| "m": 3, |
| "dimension": "visual", |
| "w": 1.5, |
| "description": "After turning on Night mode, the background becomes clearly darker and the body text turns light, distinguishable from the daytime state." |
| }, |
| { |
| "id": "skin.keep.tab", |
| "m": 3, |
| "dimension": "interaction", |
| "w": 1.5, |
| "description": "After turning on Night mode, switch categories; it is still in the dark state." |
| }, |
| { |
| "id": "skin.keep.sum", |
| "m": 3, |
| "dimension": "interaction", |
| "w": 1.5, |
| "description": "Select 2 items first, then toggle Night mode twice; both the count and total remain unchanged." |
| }, |
| { |
| "id": "skin.readable", |
| "m": 3, |
| "dimension": "visual", |
| "w": 1.0, |
| "description": "In the Night mode state, both the list price and the discounted price are clearly legible." |
| }, |
| { |
| "id": "ref.grid3", |
| "m": 4, |
| "dimension": "visual", |
| "w": 1.5, |
| "description": "At desktop width, the layout is a grid with exactly 3 items per row." |
| }, |
| { |
| "id": "ref.price.same", |
| "m": 4, |
| "dimension": "functional", |
| "w": 1.5, |
| "description": "After the restructure, list prices are unchanged: item 1 is ¥120, item 6 is ¥320." |
| }, |
| { |
| "id": "ref.disc.same", |
| "m": 4, |
| "dimension": "functional", |
| "w": 1.0, |
| "description": "After the restructure, item 6's discounted price is still ¥256." |
| }, |
| { |
| "id": "ref.state.same", |
| "m": 4, |
| "dimension": "interaction", |
| "w": 1.5, |
| "description": "Select 2 items before the restructure; after the restructure, the count and total are unchanged and those 2 items are still in the selected state." |
| }, |
| { |
| "id": "ref.skin.same", |
| "m": 4, |
| "dimension": "visual", |
| "w": 1.0, |
| "description": "After the restructure, the Night mode toggle is still usable and the dark state still takes effect." |
| }, |
| { |
| "id": "del.gone", |
| "m": 5, |
| "dimension": "coverage", |
| "w": 1.5, |
| "description": "The filter bar has only 3 categories left; “Reports” no longer appears." |
| }, |
| { |
| "id": "del.total", |
| "m": 5, |
| "dimension": "functional", |
| "w": 1.5, |
| "description": "Under All it becomes 14 items." |
| }, |
| { |
| "id": "del.none", |
| "m": 5, |
| "dimension": "coverage", |
| "w": 1.0, |
| "description": "Browse the 14 items one by one; none of them belongs to “Reports”." |
| }, |
| { |
| "id": "del.price.recalc", |
| "m": 5, |
| "dimension": "functional", |
| "w": 1.5, |
| "description": "List prices are recalculated by new position: item 1 is ¥120, item 6 is ¥320, and the last item (item 14) is ¥640." |
| }, |
| { |
| "id": "del.disc.recalc", |
| "m": 5, |
| "dimension": "functional", |
| "w": 1.5, |
| "description": "The discount rule still applies to the recalculated list prices: the last item (item 14) has a discounted price of ¥512." |
| }, |
| { |
| "id": "del.keep.state", |
| "m": 5, |
| "dimension": "interaction", |
| "w": 1.5, |
| "description": "Before deleting, select 2 items in the retained categories; after deletion, the count and total remain unchanged." |
| }, |
| { |
| "id": "del.grid.reflow", |
| "m": 5, |
| "dimension": "visual", |
| "w": 1.0, |
| "description": "After deletion, the grid still has 3 items per row; the last row is laid out according to the remaining count, with no empty placeholders." |
| }, |
| { |
| "id": "del.combo", |
| "m": 5, |
| "dimension": "interaction", |
| "w": 1.5, |
| "description": "Select 2 items → turn on Night mode → switch to “Monitoring” → back to All; the count, total, and theme state are all correct at the same time." |
| }, |
| { |
| "id": "del.sum.recalc", |
| "m": 5, |
| "dimension": "interaction", |
| "w": 1.5, |
| "description": "After deletion, reselect item 1; the increment to the total equals its recalculated discounted price." |
| } |
| ], |
| "inject": null, |
| "qc_static": [], |
| "review_status": "hand_authored", |
| "hand_notes": { |
| "cross_requirement_items": 7, |
| "dim_counts": { |
| "visual": 10, |
| "functional": 11, |
| "interaction": 10, |
| "coverage": 2 |
| } |
| } |
| } |
|
|
