此為內部系統,故不提供連結以及其他內部畫面
透過個人化數位體驗、自助服務,為客戶量身定制參與和溝通計劃,使內部團隊和客戶能更有效率地工作,並且提高客戶忠誠度和客戶長期價值。
技術:Next.js、 app router 、Material UI 、react-hook-form、zod等
主要有六大面向
專案、需求、提案、合作項目、執行、結案
除了建立專案無頁面檢視(只能從編輯頁面查看),其他面向皆有顯示頁面,並且可以設定權限讓外部人員查看專案進度或結案成果
這幾個大項功能會依照建立專案時設定的權限去做客戶能瀏覽的範圍
主要是建立一個全新專案,新增基本訊息並新增執行團隊人員、設定外部人員登入密碼以及設定此專案的權限
建立提案具體需求,部分欄位區分只能內部員工新增編輯與查看,製作拖曳功能讓使用者可以做上傳多個檔案時的排序
使用者可以新增多個提案,提案可自己設定版本號 可以新增刪除修改提案,但刪除按鈕只有管理人員可以做查看並有權限刪除
一樣可以上傳多個檔案並用拖曳方式更改順序
提案的顯示頁面可以查看個版本的紀錄以及新增註解(留言)
使用者可以在這裡新增項目與合約文件等
執行部分分了幾個功能
一個是上傳此專案的執行進度時程表、成本表以及因為公司是行銷公司所以會有社群貼文等需要做社群嵌入、上傳文件等等
由於進度時程表與成本表只是單純的 json 檔去做 api 請求寫入,所以這兩個部分的製作是由主管做 vibe coding 完成的,最後再將他們改寫成 React 的寫法放到專案中
並且結合 AI ,讓使用者在填寫進度時程時,可以請 AI 做一些範例~
製作多個區塊式的文件上傳拖曳功能,並且依照使用者設定,可以設定只能內部查看或是公開等等
由於專案可設定完全公開頁面、部分需要密碼才能查看的頁面以及內部人員有完全觀看但如果不是專案相關人員就不能查看編輯頁面等邏輯
在製作過程中權限需要後端的 api 去做判斷
也就是誰有查看導覽列權限的 api 去介接 ~
因為一定要判斷權限才能做顯示頁面連結,所以導覽列基本上是靠 api 回傳的權限判斷並寫死頁面連結做顯示
如果外部人員都有權限觀看的話
導覽列這幾個大標就會全顯示
如果沒有權限則完全無法看到該導覽名稱與內容
登入則是分員工登入以及外部人員登入
員工是使用 SSO 登入
外部人員需密碼才能登入