iT邦幫忙

2025 iThome 鐵人賽

DAY 14
0

UI 畫面不佳

今天要來針對排班分頁進行改善,下圖可以發現兩個問題

  1. UI 不佳:點擊「建立新排班」後的彈跳視窗沒有置中

    畫面至於左下角而非正中間,UI 不良需要調整

  2. 超出專案範圍:視窗內出現選擇店鋪

    在這次專案,已定義只討論單一店鋪的排班,因此可少掉「選擇店鋪」的選項

https://ithelp.ithome.com.tw/upload/images/20250928/20168562Gyrz8yJdno.png

這是我下的 Prompt:

接下來讓我們針對「排班分頁」進行改善,首先請你看前台畫面,想請你幫我在點擊建立新排班時出現的彈跳視窗保持在懸浮於畫面正中間,而非在左下角;視窗內的選擇店鋪這個選項可以直接刪除,在這個專案,我們只討論單一店鋪。

畫面修正如下,嗯,Cursor 做得很好,在進入下一階段前先 push 到 Github 吧!

https://ithelp.ithome.com.tw/upload/images/20250928/20168562sEcrelXhss.png

排班詳細資訊不足

建立新排班後的資訊,可以發現依然會出現xx總店字眼,並且無法點擊排班查看當周的排班人員相關崗位與安排資訊

雖然已經修改掉不討論其他店鋪,但畫面中依然出現xx總店的字眼,另外我想看到排班的細節資訊,想請你幫我在點擊各周班表後能伸長顯示人員在當周的排班資訊

https://ithelp.ithome.com.tw/upload/images/20250928/20168562rT1CBlNFAX.png

在 Cursor 費盡功夫完成修改後,我一如往常點擊網頁重新整理,可以看到畫面有所變動,並且也能打開查看詳細資訊,但無法看到排班細節,這次我選擇直接附上圖片讓 Cursor 自行判斷哪裡出現問題

請你依照圖片判斷哪裡出現問題,並且告訴我應該如何改善

https://ithelp.ithome.com.tw/upload/images/20250928/20168562tD5YnHTEDc.png

這是他的回應,然後他也提到排班詳細資訊確實為空,因此我要求他自動產生排班資訊讓我參考

好的,接下來請你協助我依照之前我提供給妳的排班邏輯,建立排班結果讓我查看

https://ithelp.ithome.com.tw/upload/images/20250928/20168562fKmohaPMT5.png

經過他自行調出過去提供的排班邏輯以及員工擅長崗位後,他排出來的班表示這樣的:

https://ithelp.ithome.com.tw/upload/images/20250928/20168562eXxnwu7PUe.png

接下來就請水獺朋友體驗看看目前的成果需要再做哪些改善了。我們下篇見~


上一篇
[13] 開發過程 - 員工管理分頁持續優化
下一篇
[15] 開發過程 - 部分驗證與測試 -1
系列文
生成式 AI 生產力挑戰:30 天從需求打造工作凱瑞工具16
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言