這集影片延續上一集的「使用者管理」,這次我們要來實作「角色管理」功能,並進一步加入「設備綁定」的設定。
在實務專案中,每個角色常常會對應到不同的設備控制權限,因此將示範如何設計一個前端介面,為每個角色選擇對應的設備清單,並透過多選下拉選單(<select multiple>)來實作這個功能。
從表單設計開始,逐步實作角色的新增、修改、刪除功能,並介紹如何載入設備清單、預設勾選已綁定的設備,以及如何處理角色與設備之間的關聯資料。
整體實作維持簡潔、實用的風格,前端使用純 HTML + JavaScript,並串接後端的 RESTful API 進行資料操作。
00:00 讀取角色
05:23 讀取設備
08:06 新增角色、挷定設備
13:21 修改角色、挷定設備
20:27 刪除角色