五南官網-網頁設計手冊(下)：網站開發案例實作

CH1 案例：線上報修
接下來這個案例是一個簡單的線上報修系統，為了方便使用，不需要登入系統即可登錄需要報修的事項，以及查看報修事項列表與處理狀況。只有管理人員需以帳號密碼登入後，才可針對每一則報修事項進行回覆、填寫維修的進度。
建立專案與應用程式
開啟終端機或命令提示字元程式，以下面指令建立一個名為 repair 的新專案：
django-admin startproject repair

注意：大小寫有別！
例如若將 TIME_ZONE 的設定值不小心登打為 'Asia/TaipeI' ，在需要處理時間資訊時會引發 ValueError 錯誤噢！

專案與應用程式都建立好了，在正式撰寫網站功能之前，先思考一下，有哪些資料需要記錄？這個案例是個簡單的線上報修系統，對於每個報修的事項，只需要記錄其當下最新的狀況即可，不記錄處理的歷程。

部分欄位由報修人填寫，部分欄位由處理人員填寫。另外關於報修時間以及更新時間這兩個欄位，則可由系統自動記錄，不需人為填寫。

單行程式碼太長，不容易閱讀怎麼辦？
當單行程式碼過長時，其實可以拆分成數行。
程式碼中若包含了函式呼叫，或建立物件指定初值時，會使用到小括號，Python 可以根據括號的匹配關係得知函式呼叫或物件初始化的程式碼的作用範圍到哪裡。如這幾行的程式碼，原本應該寫在同一行，也可以這樣拆分成好幾行。
若程式碼無法以括號標註作用範圍，另一種方式可在要接續下一行的行末手動加上反斜線 \ 表示本行程式碼未結束，需延伸到下一行。

對資料模型進行變更後，務必要在命令提示字元或終端機登打指令，先產生異動腳本，再套用（遷移）至資料庫：
1 python manage.py makemigrations
2 python manage.py migrate
另外，在第一次進行資料庫遷移時，記得以專案管理腳本的 createsuperuser.參數來建立管理員帳號：
3 python manage.py createsuperuser

接下來就可以將專案網站服務執行起來，以便在開發過程中進行測試：
1 python manage.py runserver 0.0.0.0:80

定義路徑規則
定義完資料模型之後，接著要實作網站的各項功能。先規劃一下有哪些功能，
以及要將這些功能分別安排在什麼路徑上提供服務。

決定好路徑與功能的對應關係之後，先修改專案的路徑規則檔 repair/repair/urls.py

接著就將焦點放在應用程式 log 上，先來定義它自己的路徑規則。請新增檔案 repair/log/urls.py 

這邊定義了應用程式 log 自身的路徑規則，還記得前面在專案路徑規則中以 include() 函式將 'log.urls' 加入專案中嗎？這 4 條路徑規則在被加進專案時，還得在前面附加指定的前置字串 'log/'

導覽列一定要另存在別的檔案嗎？
在網頁基底範本的第 14 行，透過 django 範本的 {% include %}標籤引入外部的導覽列範本檔 navbar.html ，是為了方便在本書中說明變動之處，才刻意將導覽列另存在別的檔案以縮短單檔程式碼的篇幅。可以直接將導覽列範本檔的內容複製貼上，取代 {% include
'navbar.html' %} 這行程式碼，這樣就不需要另存一個檔案囉！

管理人員維護報修記錄
未登入的使用者新增報修記錄後，管理人員需要以帳號密碼登入系統之後，才能針對報修記錄回覆維修進度與狀況。
限定需登入才能回覆維修進度
視圖裡的 LogReply 類別需要限制在使用者登入之後才允許操作，請修改
.repair/log/views.py

自動填入表單預設值
管理人員在回覆維修進度時，希望可以直接預先將管理人員的資訊填入「處理人員」的欄位，不需要管理人員手動登打的話，需要再修改一下.LogReply 類別。

讓檢視與填表共用範本
我們在 repair/log/views.py 裡的 LogCreate 以及 LogReply 這兩個類別底下都沒有透過 template_name 屬性指定欲使用的頁面範本，而通用視圖 CreateView 與 UpdateView 的衍生類別預設會使用 所屬應用程式/ 參考資料模型_form.html 當作其使用的頁面範本檔案，因此.LogCreate 與 LogReply 會共用頁面範本資料夾下的 log/logitem_form.html 。

除了這種另外定義一個頁面範本來顯示表單的做法之外，若想讓檢視報修記錄與維護報修記錄的頁面外觀看起來更一致的話，也可以考慮與檢視報修記錄共用同一個頁面範本。

修改表單元件外觀
預設的多行文字欄位（Textarea）元件的預設尺寸，在頁面上顯示起來僅占用了一半不到的寬度，若要使其占用整列的寬度，可以為其套用 formcontrol.CSS 類別。
前面示範過以 Javascript 來套用 form-control 類別， 若不採用Javascript 的話，則需要在 Django 中自訂表單類別，然後在表單類別中指定輸入元件的屬性。
新增表單定義檔 repair/log/forms.py

檢視報修記錄新增回覆維修進度連結
管理人員在檢視報修項目內容之後，可以回覆目前的維修進度。請修改檢視報修記錄頁面範本 repair/log/templates/log/logitem_detail.html 

報修照片上傳
有時文字的描述不足以說明故障的狀況，若能讓報修人上傳照片輔助說明，就能讓維護單位更容易明白報修的狀況。

新增行政人員帳號
我們可以運用 Django 內建的後臺管理系統來進行人員帳號的管理與維護，只要存取專案網站的 /admin/ 路徑，以初始建立的管理員帳號登入後，即可透過內建的管理程式管理人員帳號。
不過也可以自行撰寫處理程式，資料模型的部分可以直接使用預統預設的定義，搭配我們自行定義路徑規則、視圖及頁面範本，以便與我們的專案網站整合得更一致。
我們將在專案中另行創建一支應用程式專責處理人員帳號的維護，把報修項目與人員帳號的處理分開，當然也可以直接在應用程式 log 中撰寫相關程式碼就好，端看個人喜好。

視圖
在之前的例子中，對於權限管控，只很簡單地繼承 LoginRequiredMixin.來檢查使用者是否為登入的狀態才允許操作某些功能。不過在這個例子中，這個專案網站可能會開放給其他行政人員使用，所以應該要使用更進階的權限管理方式，否則只要登入後，每個人都可以新增/ 修改帳號，這就有點恐怖了。
Django 也有內建的基本的權限管控功能，可以為個別帳號針對每個資料模型指定4 種存取權限 view 、 add 、 change 、 delete 。
法律/政治

財經/商管/觀光

文/史/哲/期刊

理工/醫護

教育/心理/傳播

小五南/中等教育
