nick-jy-huang/JENJAN_frontend_recruit

JENJAN Frontend Recruit

題目要求

• 依照 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