iT邦幫忙

2025 iThome 鐵人賽

DAY 24
0
自我挑戰組

基於 Oracle 資料庫的醫院電子病歷系統設計與建置系列 第 24

Day24:前端設計 - 病患基本資訊頁面

  • 分享至 

  • xImage
  •  

大家好!!今天是鐵人賽的第24天!!!
醫師權限:新增/修改/刪除/查詢
以員工ID為36215的醫師為例
‼️原有設定新增病患的功能,但因頁面中可填寫的欄位在後端資料庫的資料表中僅為一部分,因此決定新增病患基本資訊僅可在後端資料庫執行(一樣只有醫師與管理員有新增權限)‼️
1.查詢病患基本資訊(以病患ID為20513的病患為例)
查詢某病患資料(可輸入病患的姓名/ID/身分證字號) -> 點擊"搜尋" -> 顯示"找到病患:XXX" -> 點擊"確認" -> 跑出此病患的基本資料
https://ithelp.ithome.com.tw/upload/images/20251011/20167787RA60VOgUo5.png
https://ithelp.ithome.com.tw/upload/images/20251011/201677871TUSyzBCs1.png
如想重新查詢病患可點擊"重新整理" -> 顯示"頁面已重新整理!" -> 點擊"確認" -> 頁面即更新為尚未查詢前的樣子
https://ithelp.ithome.com.tw/upload/images/20251011/201677871uVjsUpkga.png
https://ithelp.ithome.com.tw/upload/images/20251011/20167787DzlTmw9stQ.png
2.修改病患基本資訊(以病患ID為20513的病患為例)
點擊"編輯資料" -> 病患基本資料欄變為可更改狀態 -> 更改病患住址的欄位(由台北市南港區修改為新北市汐止區) -> 點擊"取消編輯" -> 修改的地址欄位會變回原本未更改時的資料(依舊為台北市南港區)
https://ithelp.ithome.com.tw/upload/images/20251011/201677871frnWsC2Qf.png
https://ithelp.ithome.com.tw/upload/images/20251011/20167787XRLMwLRuqH.png
https://ithelp.ithome.com.tw/upload/images/20251011/20167787l4HmqXG0Ru.png
更改病患住址的欄位(由台北市南港區修改為新北市汐止區) -> 點擊"儲存變更" -> 顯示"病患資料已更新成功!" -> 修改的地址欄位變為更改後的資料(新北市汐止區)
https://ithelp.ithome.com.tw/upload/images/20251011/20167787q50Ra4tQ6e.png
https://ithelp.ithome.com.tw/upload/images/20251011/20167787FznHUM3Vym.png
後端:病患ID為20513的病患住址原為"台北市南港區"
https://ithelp.ithome.com.tw/upload/images/20251011/20167787dODuTZVYlj.png
後端:病患ID為20513的病患住址更新為"新北市汐止區"
https://ithelp.ithome.com.tw/upload/images/20251011/201677870qGTjvF5ST.png
3.刪除病患基本資訊(以病患ID為10344的病患為例)
原本的後端資料庫有第26筆資料
https://ithelp.ithome.com.tw/upload/images/20251014/20167787ri0GnDaqQF.png
點擊"刪除病患" -> 顯示"確定要刪除病患「張庭安」的資料嗎?此操作無法復原!" -> 點擊"確定" -> 顯示"病患資料已刪除成功!"
https://ithelp.ithome.com.tw/upload/images/20251014/201677874rHXsuhsl1.png
https://ithelp.ithome.com.tw/upload/images/20251014/20167787EIGCKNSLQM.png
重新搜尋病患ID為10344的病患 -> 顯示"找不到符合條件的病患!"
https://ithelp.ithome.com.tw/upload/images/20251014/20167787uoAsuKVQpV.png
刪除此病患後的後端僅剩25筆資料(無第26筆!)
https://ithelp.ithome.com.tw/upload/images/20251014/20167787zNq3lR6Epr.png


護理師/藥師權限:查詢
以員工ID為41839的藥師為例(護理師與藥師所看到的頁面會是相同的,因此就列舉其中一個)
可看出護理師/藥師所看到的頁面僅可進行查詢或重新整理頁面
1.查詢病患基本資訊(以病患ID為20513的病患為例)
使用身分證字號查詢某病患資料(可輸入病患的姓名/ID/身分證字號) -> 點擊"搜尋" -> 顯示"找到病患:XXX" -> 點擊"確認" -> 跑出此病患的基本資料
https://ithelp.ithome.com.tw/upload/images/20251012/20167787pGyLigN6aX.png
https://ithelp.ithome.com.tw/upload/images/20251012/20167787c9e6AG3FYN.png
如想重新查詢病患可點擊"重新整理" -> 顯示"頁面已重新整理!" -> 點擊"確認" -> 頁面即更新為尚未查詢前的樣子
https://ithelp.ithome.com.tw/upload/images/20251012/20167787g2vAbaGi8P.png
https://ithelp.ithome.com.tw/upload/images/20251012/20167787HQoTH17zRf.png


因為內容有點太多啦!所以就只會截前端頁面與後端資料庫的畫面,終端機的回傳指令那些的就不會分享了><!
以上是我今天的分享!謝謝大家的觀看 ~ /images/emoticon/emoticon02.gif


上一篇
Day23:前端設計 - 登入註冊頁面、病患基本資訊頁面
下一篇
Day25:前端設計 - 病患病歷頁面
系列文
基於 Oracle 資料庫的醫院電子病歷系統設計與建置30
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言