chore: add construction installment calculator design spec and plan

2026-05-28 12:48:48 +07:00
commit c21b125fc6
2 changed files with 714 additions and 0 deletions
@@ -0,0 +1,84 @@
+# Construction Installment Calculator — Design Spec
+
+Date: 2026-05-28
+
+## Overview
+
+Single HTML file tool for calculating construction project payment installments (งวดงาน). Users input contract details and edit installment structure; the page calculates dates, amounts, and cumulative totals, then exports to Excel.
+
+## Inputs (top form)
+
+| Field | Type | Description |
+|---|---|---|
+| วงเงินสัญญา | Number | Total contract amount (บาท) |
+| วันเริ่มก่อสร้าง | Date | Construction start date |
+| สัดส่วน งปม. (%) | Number | Budget money percentage (default 95) |
+| สัดส่วนเงินนอก (%) | Number | Outside budget percentage (default 5); auto-fills to 100 - งปม% |
+| จำนวนงวด | Number | Number of installments; changing this regenerates table rows |
+
+When จำนวนงวด = 27, pre-fill the standard structure from the Excel template (see below).
+
+## Installment Structure (fixed template for 27 งวด)
+
+| งวดที่ | วัน | ร้อยละ |
+|---|---|---|
+| 1 | 20 | 3.80 |
+| 2–5 | 20 | 3.70 |
+| 6–24 | 30 | 3.70 |
+| 25–27 | 40 | 3.70 |
+
+Total: 790 days, 100.00%
+
+For other installment counts, rows are generated blank (days=0, %=0) for user to fill in.
+
+## Table Columns
+
+| Column | Editable? | Calculation |
+|---|---|---|
+| งวดที่ | No | Sequential 1..n |
+| จำนวนวัน | Yes | User input |
+| ร้อยละ (%) | Yes | User input |
+| วันส่งมอบงาน | No | startDate + cumulative days |
+| รวม (บาท) | No | contractAmount × % / 100 |
+| เงิน งปม. (บาท) | No | รวม × งปม% / 100 |
+| เงินนอก (บาท) | No | รวม × เงินนอก% / 100 |
+| รวมสะสม (บาท) | No | Cumulative รวม |
+| งปม. สะสม (บาท) | No | Cumulative เงิน งปม. |
+| เงินนอก สะสม (บาท) | No | Cumulative เงินนอก |
+| ลบ | — | Button to remove row |
+
+## Summary Cards (above table)
+
+- วงเงินสัญญา
+- เงิน งปม. (งปม%×contract)
+- เงินนอก (เงินนอก%×contract)
+- รวมร้อยละ (sum of all % rows) — shown in red if ≠ 100%, green if = 100%
+- วันสิ้นสุดสัญญา (startDate + sum of all days)
+
+## Behavior
+
+- **Live recalculation**: every change to วัน, %, or header inputs recalculates all derived columns instantly (no Calculate button needed)
+- **Add row**: "+ เพิ่มงวด" button appends a blank row at the bottom
+- **Delete row**: ✕ button removes that row; remaining rows renumber
+- **จำนวนงวด input**: changing it regenerates rows (27 → template, other → blank rows); warns user before clearing existing data
+- **Validation**: total % card turns red/green; Export button disabled if total % ≠ 100%
+
+## Excel Export
+
+Uses SheetJS (xlsx CDN). Exported file includes:
+- Sheet name: "งวดงาน"
+- All 10 data columns + header row
+- Summary rows at top (contract amount, dates, totals)
+- Filename: `งวดงาน_YYYYMMDD.xlsx`
+
+## Architecture
+
+- Single `index.html` file
+- Vanilla JS (no framework)
+- SheetJS loaded from CDN for Excel export
+- Thai date display in Buddhist Era (พ.ศ.)
+- No backend, no build step required
+
+## File Location
+
+`/Users/nut.looknut/Project/rmutr/construction-installment-calculator/index.html`