- 依照 Figma 畫面製作相應 UI 及功能
- 製作 UI 1-1、1-2 (相似度盡可能高)
- 使用 axios 獲取 API 資料並顯示
- 前端框架使用 Vue 3 並以 CDN 方式引入參考
- UI 框架使用郵件中的附檔 bootstrap.min.css，且盡量無額外撰寫的 css
- 圖示部分使用 Bootstrap Icon
- 需有 RWD (簡易調整不要爆版即可，自由發揮)
- 使用 html 直接開發，不可使用 node js 或其他構建工具
- 可輸入物流單號於中間的輸入框中
- QR Code 按鈕不需要有功能
- 查詢包裹 與 查詢不明包裹 可以點擊切換 (純切換即可，無須關聯擊他功能)
- 按下 查詢 時 1-1 畫面移至左側 (不用動畫)，並顯示右方表格
- 按下清除按鈕清空輸入框中的文字即可，不用切換顯示狀態 (1-1/1-2)
- 實心藍按鈕為 btn-primary
- 空心按鈕為 btn-outline-transparent
- 查詢不明包裹 按鈕使用的是 btn-transparent
- QR Code icon
- 地球 icon