第一章 導論

Transcription

1 逢甲大學 資訊工程學系專題報告 茶葉健診電子商務系統製作 學生 : 施星宇 ( 資四丙 ) 馬嘉鍵 ( 資四丙 ) 黃川溢 ( 資四丙 ) 譚哲慧 ( 資四甲 ) 指導教授 : 謝信芳 中華民國九十二年四月

2 目 錄 圖目錄...III 表目錄...VI 第一章導論 背景資料 動機 目的... 3 第二章系統規畫 沿革 組織 各部門職責 人員編制 現有系統概述 系統軟體硬體操作環境 系統預估時程表 工作分配 工作排程甘特圖 第三章系統分析與設計 系統分析方法論 採用的系統分析方法 新系統架構與功能 會員管理系統 茶葉健診系統 茶葉交易系統 公告系統 網站導覽 第四章系統建置 會員管理系統 茶葉健診系統 茶葉交易系統 公告系統 網頁導覽搜尋系統 第五章系統評估 會員管理系統 茶葉健診系統 茶葉交易系統 I

3 5.4 茶葉公告系統 網站導覽系統 第六章結論 組員心得 施星宇的心得 馬嘉鍵的心得 譚哲慧的心得 黃川溢的心得 未來展望 參考資料 附錄 - 與李案嘉老師訪談內容 II

4 圖目錄圖 2.1 案嘉雅竹運作組織圖... 7 圖 2.2 甘特圖 圖 3.1 瀑布式生命週期 圖 3.2 古典系統發展生命週期 圖 3.3 結構化系統發展生命週期 圖 3.4 雛型式的系統發展週期 圖 3.5 網頁架構圖 圖 3.6 線上會員註冊流程圖 圖 3.7 線上會員登入流程圖 圖 3.8 線上會員資料修改流程圖 圖 3.9 線上會員密碼查詢流程圖 圖 3.10 最高管理者新增健診中心流程圖 圖 3.11 最高管理者編輯健診中心流程圖 圖 3.12 會員線上健診預約掛號流程圖 圖 3.13 會員線上查詢健診預約掛號流程圖 圖 3.14 會員線上取消健診預約掛號單流程圖 圖 3.15 管理員處理掛號單流程圖 圖 3.16 茶大夫瀏覽已處理掛號單流程圖 圖 3.17 新增上市茶葉資料流程圖 圖 3.18 編輯上市茶葉資料流程圖 圖 3.19 訂單管理員處理訂單流程圖 圖 3.20 會員線上下單流程圖 圖 3.21 庫存管理員完成交易流程圖 圖 3.22 一般使用者瀏覽公告流程圖 圖 3.23 一般使用者查詢公告流程圖 圖 3.24 各部門管理者新增本部門公告流程圖 圖 3.25 各部門管理者修改本部門公告流程圖 圖 3.26 各部門管理者刪除本部門公告流程圖 圖 3.27 系統管理者新增系統公告流程圖 圖 3.28 系統管理者修改系統公告流程圖 圖 3.29 系統管理者刪除系統公告流程圖 圖 3.30 網頁收尋流程圖 圖 3.31 網站索引網頁 圖 4.1 會員註冊 圖 4.2 會員註冊資料確認 III

5 圖 4.3 會員註冊資料驗證錯誤 圖 4.4 會員登入 圖 4.5 會員密碼查詢 圖 4.6 會員密碼查詢結果 圖 4.7 管理員管理會員 圖 4.8 管理員管理會員 圖 4.9 茶葉健診系統首頁 ( 非站長級權限登入 ) 圖 4.10 茶葉健診系統首頁 ( 站長級權限登入 ) 圖 4.11 站長新增健診中心介面 圖 4.12 站長新增健診中心後結果 圖 4.13 管理員編輯健診中心 圖 4.14 站長編輯健診中心 圖 4.15 管理員編輯健診中心輸出結果 圖 4.16 茶葉健診系統首頁 ( 一般管理者登入 ) 圖 4.17 掛號單列表 ( 管理者登入 ) 圖 4.18 管理員處理掛號單 圖 4.19 管理員處理掛號單 圖 4.20 掛號單列表 ( 管理員處理完畢 ) 圖 4.21 掛號單列表 ( 一般會員尚未預約過 ) 圖 4.22 掛號單列表 ( 一般會員已經預約過 ) 圖 4.23 掛號單填寫內容 圖 4.24 查詢並選擇預約時段 圖 4.25 選擇預約時段後之掛號單填寫內容 圖 4.26 會員刪除預約掛號單 圖 4.27 一般使用者登入介面 圖 4.28 主管理員登入後操作介面 圖 4.29 主管理員新增產品資料 圖 4.30 新增產品資料後結果 圖 4.31 主管理員編輯產品資料 圖 4.32 主管理員修改後輸出結果 圖 4.33 主管理員任免訂單管理員操作介面 圖 4.34 主管理員任免訂單管理員操作介面 圖 4.35 訂單管理員任用後結果 圖 4.36 訂單管理員處理訂單操作介面 圖 4.37 訂單管理員處理訂單操作介面 圖 4.38 所有產品顯示列表 圖 4.39 目標產品詳細資料 圖 4.40 該名會員的一筆訂購資料送出結果 IV

6 圖 4.41 該名會員的一筆訂購資料刪除結果 圖 4.42 完成交易後的訂單歷史紀錄報表 圖 4.43 公告系統首頁 ( 非站長級權限登入畫面 ) 圖 4.44 茶葉健診中心公告系統首頁 ( 站長級權限登入 ) 圖 4.45 發布新公告系統頁面 圖 4.46 新增公告之範例輸入畫面 圖 4.47 發布公告權限不足之錯誤訊息頁面 圖 4.48 新增公告成功的訊息畫面 圖 4.49 修改公告畫面 圖 4.50 修改公告畫面 圖 4.51 管理員修改公告輸出結果 圖 4.52 系統管理者刪除公告畫面 圖 4.53 系統管理者刪除公告畫面 圖 4.54 刪除公告後返回公告首頁 圖 4.55 公告系統主瀏覽頁面 ( 一般會員所示 ) 圖 4.56 選擇今日公告 圖 4.57 今日公告顯示畫面 圖 4.58 選擇急件公告 圖 4.59 急件公告顯示畫面 圖 4.60 選擇普通公告 圖 4.61 普通公告顯示畫面 圖 4.62 所有公告顯示畫面 圖 4.63 選擇頁數顯示畫面 圖 4.64 跳頁結果顯示畫面 圖 4.65 輸入關鍵字查尋顯示畫面 圖 4.66 查尋結果顯示畫面 圖 4.67 網頁導覽搜尋系統首頁 圖 4.68 網頁索引主頁 圖 4.69 收尋網頁首頁 圖 4.70 收尋資料結果 V

7 表目錄 表 2.1 工作分配表 表 3.1 網站首頁記錄格式 表 3.2 會員註冊畫面記錄格式 表 3.3 會員系統資料庫記錄格式 表 3.4 會員登入畫面記錄格式 表 3.5 會員修改資料 表 3.6 會員查詢錄格式 表 3.7 茶葉健診首頁記錄格式 表 3.8 管理員新增健診中心記錄格式 表 3.9 健診中心資料庫記錄格式 表 3.10 管理者選擇編輯健診中心記錄格式 表 3.11 管理者編輯健診中心內容記錄格式 表 3.12 會員健診預約掛號單填寫內容記錄格式 表 3.13 會員茶葉健診中心記錄格式 表 3.14 掛號單資料庫記錄格式 表 3.15 茶葉交易首頁記錄格式 表 3.16 管理員登錄新產品資料記錄格式 表 3.17 管理者編輯上市茶葉資料記錄格式 表 3.18 交易系統產品資料庫記錄格式 表 3.19 訂單管理員操作介面記錄格式 表 3.20 客戶訂單的處理記錄格式 表 3.21 客戶訂單資料庫記錄格式 表 3.22 產品總覽記錄格式 表 3.23 已完成訂購單記錄格式 表 3.24 公告系統首頁記錄格式 表 3.25 公告統資料庫記錄格式 表 3.26 瀏覽公告內容記錄格式 表 3.27 使用者登入介面記錄格式 表 3.28 使用者資料庫記錄格式 表 3.29 新增公告介面記錄格式 表 3.30 公告系統資料庫訊息記錄格式 表 3.31 搜尋網頁記錄格式 表 3.32 網頁索引資料庫記錄格式 VI

8 表 3.33 索引網頁記錄格式 VII

9 1.1 背景資料 第一章導論 茶葉健診教育網, 主要是應用網路的傳輸和資料庫技術來處理茶葉健診掛號和茶葉教育線上報名等一系列規律的工作, 提供從業人員在行政和健診茶葉上的適當協助, 減少過多重覆性的工作所花費的人力成本, 將這種傳統產業與電子商務結合可以有以下優點.. 1. 廣大的使用者可以輕易的了解何謂茶葉健診, 並輕易的使用線上掛號 2. 將原本須要一天 24 小時僱用員工的運作模式以即時的網路取代 3. 公司的各分部管理員可以清楚的得知客戶的最新資訊並以最短時間回應 4. 在全省各健診據點間的健診中心可以相互取得所需的茶葉病歷 事實上, 網路上有關茶葉的教育或交易網站相當的多, 而坊間也不乏有許多有經驗的老師或茶農免費為人健診茶葉, 但這僅只於少數親戚朋友, 目前為止還未見有如李案嘉老師般不僅有足夠的茶葉知識 教學經驗, 更具有以服務為目的來為廣大的消費者義務健診的理想 1

10 1.2 動機 茶葉健診的概念可由兩方面切入討論.. 1. 茶葉本身具有多種解毒和養生功能, 為一健康飲料 2. 現代因為西方醫學對某些慢性病無法有效根治, 而出現全方位醫學 中國是茶的故鄉, 茶的魅力不只是因為它有解渴的功能, 更由於和華夏悠久而豐富的文化傳統融為一體, 直接或間接地滲透到人的精神生活 就健康而言, 據 神農本草經 記載.. 神農嘗百草, 一日遇七十二毒, 得茶而解之 雖然這是個傳說, 卻也是經過了從發現到利用的長期實踐過程所得到經驗 綜觀歷代記載飲茶的功效, 可以總結為 : 益思少睡 清熱降火 解毒止渴 消脹氣 助消化 消除疲勞 增強耐力 去痰治痢 利尿明目等 然而古人對飲茶功效的了解是經驗累積的傳述, 只知其然而不知其所以然, 近代科學近步, 舉凡食品成份之分離純化及鑑定技術 藥理試驗技術及統計分析配合電腦的應用等皆有長足發展 綜合國內外學者的研究, 飲茶的功效可歸納為下列八項 : 1. 提神醒腦 消除疲勞, 增強體力 2. 利尿 3. 降低血液中膽固醇及低密度脂蛋白 4. 預防蛀牙 5. 強化微血管 6. 抗菌作用 2

11 7. 抗細胞突變作用和防癌作用 8. 減緩衰老, 總的來說, 營養均衡 + 運動 + 飲茶 = 健康長壽就人體的健康來討論, 中醫學將人體視為 體 心 氣 靈 等有機綜合體, 以治癒生命原本據有的 自然痊癒力 為首要, 提高並增強此自然痊癒力為治療的基本目標, 治療的主軸為患者本身, 治療者僅為援助者, 以改善生活型態, 使其免疫力發揮功效, 正因為茶葉具有這些功能, 所以從採茶 製茶 泡茶乃至於喝茶的過程都是很重要的, 有鑑於一般消費者對於茶的知識普遍不足, 更遑論藉由評鑑來選擇優質且有益身體的茶, 所以我們秉持著以服務為目的的精神來義務健診消費者族群所購買而且不甚了解的茶葉, 相信這不只是對消費者的保護, 也更能促進茶商 茶農的敬業精神 1.3 目的 傳統產業與網路技術的結合, 在很多層面上有些許難度, 比如說, 傳統的茶葉交易是消費者與茶商會面, 並當場沖泡茶葉, 經過數個小時的選擇後才下決定是否購買, 所以原則上, 我們希望以科技為輔的方式來達成以下目的: 1. 預約掛號機制這個構思雖然不是老師的首創, 卻是相當少見的作法, 因為一般肯做茶葉健診的人不是以營利為主就是學員遍佈不夠廣, 即使有心也無法在各地設置營運據點, 李老師不僅有豐富的知識經驗, 也培育了在全國各地的人才, 所以有信心做如此的事業 3

12 2. 展現獨特的經營理念我們雖然設有茶葉選購的功能, 但是老師卻不著重於此, 反而將多數資源投入於茶葉健診的各項軟硬體上, 其次則是茶藝課程的安排, 本系統的設計也將以此為標竿 3. 回饋茶葉健診的研究心得一般營利的業者, 通常不會把茶葉健診案例的結果公諸於世, 為的是更多的營運收入, 而李老師願意把各地學生對客戶茶葉健診後的報告統整公佈於網站上, 所抱持的就是無私的經營理念 4. 線上報名茶藝課程為使有心跟李老師學茶的客戶更方便, 不僅設有線上報名的功能, 更在各地設有教室, 當然也包函次數不多的上山製茶活動報名 5. 線上管理系統因為管理員可能是分佈於各地的學員, 所以為方便各管理員間資料的流量, 將管理系統設計為線上管理可達最大效率 現今多數的茶商將茶以 併堆 方式作規格化, 為的是延伸固有的銷售網, 卻不見有真實而貼心的售後服務, 老師的目的不在於獲得商場的名與利, 而在於教育和服務的理念, 因為唯有透過無私的付出和良好的教育才能傳遞給大眾善的觀念, 網路技術確實可以用來賺取更多的金錢, 擴建更大的企業, 但是如果連這富有優良傳統文化背景的茶都被商業氣息所沾染, 那麼以後對人類真正重要的心靈健康還能抱持多大的希望呢? 做個有智慧的人遠比做個聰明的人有意義多了, 我們不該只以自己為第一考量, 而是多少也為別人和後代子孫留下典 4

13 範, 網站也開闢一個討論版, 以利於同好的意見心得交流, 但堅持服 務而不爭的理念, 我們不希望這個過程中有任何鬥爭或惡性競爭的發 生 5

14 2.1 沿革 第二章系統規畫 案嘉雅竹是李案嘉老師的茶行, 經過十年左右的經營, 已培育出許多茶藝專業人才, 也擁有一定數量的客戶所開的課程依程度區分初 中 高三級, 目前全由李老師一人兼任各班老師, 學科 術科並重, 且必須通過最後測驗才發給結業證書 茶葉銷售上, 因為李老師的精製茶多數是台灣高山茶, 品質以春 冬二季為最, 價格也相對高昂, 然而因為產量少 品質佳, 所以仍然有一群追求高品質茶葉的客戶群 茶葉健診則是剛開始起步的事業, 李老師在北 中 南三地都設有教室, 且有一批各行各業的學生, 初步規劃以這些據點作為茶葉健診中心, 對客戶最多只酌收基本的材料費, 原則上是義務性質的健診, 根據日後的營運狀況, 將對現有體制再次革新 6

15 2.2 組織 7

16 2.3 各部門職責 1. 中心主任目前為李案嘉老師, 負責一切行政的最高層 2. 技術部採茶組負責上老師指定茶區去選購茶葉, 可自行揀選或直接購買合格手採茶葉 3. 技術部製茶組將採回的茶在當地先製成毛茶, 可以自製或交由經驗豐富的茶農代製 4. 技術部精製組毛茶帶回店裡後交由老師或專業人員監督精製成可以銷售的茶葉 5. 行銷部負責與店裡的客戶互動, 或是積極向各行各業以活動方式推銷茶葉 6. 茶葉健診部器材組負責保管及健診時的一切操作事項, 屬於茶大夫的輔佐人員 7. 茶葉健診部掛號組接受各地的掛號單, 並排定各個時段再交給茶大夫作最後確認 8. 茶葉健診部病歷組統計各個已健診的案例, 分類歸納為文件, 以便日後需要時方便調閱 8

17 9. 茶大夫各地負責幫客戶健診茶葉的專業人員, 通常是由老師指定各地成績較佳的學生任職 10. 教學部輔助各班老師的教授業務, 包括報名 排課規劃和上課時的茶水及教材準備 11. 總務部採購組購買健診教育中心的所有部門所需物品 12. 總務部倉儲組管理並隨時清查所有中心的公有財產, 定時報告 13. 會計總計一切收入 支出, 並定期作出結報, 以及員工薪資的處理 2.4 人員編制 共有員工 21 名, 上有中心主任一名 1. 技術部採茶組 2 人 2. 技術部製茶組 3 人 3. 技術部精製組 2 人 4. 行銷部 3 人 5. 茶葉健診部器材組 1 人 6. 茶葉健診部掛號組 2 人 9

18 7. 茶葉健診部病歷組 1 人 8. 茶大夫 5 人 9. 教學部 2 人 10. 總務部採購組 總務部倉儲組 會計因為目前公司規模尚未擴充, 所以暫時不須要人員, 待健診中心全面運作後可再行安排 2.5 現有系統概述 目前李案嘉老師的健診中心並無任何的電腦作業, 所以掛號方式和健診方式均為人工方式, 還沒有一個完整的體制, 所以希望透過電腦來規劃並且讓更多人了解茶葉健診這種服務 2.6 系統軟體硬體操作環境 1. 開發環境與工具 IIS 5.0 以上網頁前端開發 :Microsoft Visual Studio.NET 2003 Microsoft.NET Framework SDK v1.1 後端資料庫 :Microsoft SQL 2000 作業系統 : Windows 2000/XP 美工軟體 : PhotoImpact 8 Macromedia Dreamweaver MX

19 2. 未來使用者執行環境 Windows 98/2000/XP/2003 Server Internet Explorer 5.5 以上 2.7 系統預估時程表 工作分配 姓名 工作分配 備 註 施星宇一 系統設計 1. 會員系統 2. 茶葉健診系統程式設計 二 系統規畫 三 資料整合與校稿 馬嘉鍵一 系統設計 網頁架站 1. 茶葉交易系統 2. 茶葉健診系統構想提供二 茶葉相關知識指導三 系統規畫譚哲慧一 系統設計茶葉公告系統二 相關資料收集三 美工與圖片製作四 文書排板與校稿 黃川溢一 系統設計 訪談記錄 11

20 網站導覽系統 二 美工與圖片製作 表 2.1 工作分配表 工作排程甘特圖 本專案的開發時間甘特圖描述如下 圖 2.2 甘特圖 12

21 第三章系統分析與設計 3.1 系統分析方法論 系統發展生命週期 ( System Development Life Cycle, SDLC ) 系統發展生命週期的模型可分為下列幾種 : 1. 瀑布模型 ( Waterfall Model ) 圖 3.1 瀑布式生命週期 (1) 特性 : a. 整個生命週期, 有定義清楚的階段 b. 前一個階段完成後, 下一個階段才繼續往下做 c. 任何階段如果發現任何錯誤, 立刻回到前面發生錯誤的階段, 進行修正工作 d. 每一個階段完成後, 皆會有嚴謹的文件產出 e. 使用者只有在調查 需求分析 測試三個階段中參與 13

22 (2) 優點 : a. 建立了嚴謹 標準的開發程序 b. 透過統一的步驟, 保證系統產品的品質 c. 提供了很好的專案管理控制 d. 清楚的階段劃分, 易於分工及責任歸屬, 讓每一階段工作由最專業的人去執行 e. 符合 Divide and Conquer 及模組化的觀念, 將大而複雜的系統發展工作, 區分成六件小工作 f. 允許系統發展人員, 於各階段自由選擇合適的方法 模型工具去進行系統發展 (3) 缺點 : a. 循序向前 ( Sequential Progress ), 導致系統未完成前, 看不到成果 b. 風險高 c. 死限症候群 ( Deadline syndromes ) d. 某一階段工作無法如期完成時, 將導致後續所有工作停頓 e. 過多的紙上模型工具 (4) 各階段的工作內容 : a. 調查階段 (Survey) (a) 了解使用者所遭遇的問題及發生原因, 通常須進行資料蒐集工作 (b) 定義系統任務及目標 14

23 (c) 確認新系統的功能及資料需求 (d) 確認系統限制及風險 (e) 決定專案範圍 (f) 找出所有可行方案, 並進行可行性研究, 找出最佳方案, 並為最佳方案做成本效益分析 (g) 撰寫可行性報告及專案計畫 方法 : 資料收集技術 加權評估法 可行性研究 工具 : 因果圖 環境背景圖 Level - 1 DFD 及實體關係圖 產出 : 可行性報告, 又稱為系統建議書和專案計畫 b. 需求分析階段 ( Requirement analysis ) (a) 問題分析 (b) 確認新系統應俱備的需求 (c) 撰寫需求規範書, 並進行證實工作 方法 : Demarco 的結構化分析 Gane and Sarson 的結構化分析 Yourdon 的結構化分析 丟棄式雛型法 (Throwaway Prototyping) 物件導向分析 (Object-Oriented Analysis) 工具 : 資料流程圖 實體關係圖 資料字典 狀態轉移圖 結構化英語 決策樹 ( 表 ) HIPO 圖等 產出 : 結構化規範書或系統需求規範書 15

24 c. 系統設計 ( System Design ) (a) 初步設計或結構設計 (b) 細步設計 (c) 撰寫設計規範書和做驗證工作 方法 :Yourdon / Constantine 的結構化設計 傑克森設計方法論 王亞設計方法論 由上往下設計 物件導向設計 工具 : 資料流程圖 實體關係圖 資料字典 結構圖 結構化英語 決策樹 ( 表 ) HIPO 圖等 產出 : 初步設計 系統規範書 細部設計 程式規範書 兩者合稱系統設計規範書 d. 編碼階段 ( Coding ) (a) 選擇適合的程式語言 (b) 將系統設計階段的產出, 轉換成真正的程式碼 方法 : 結構化程式設計 產出 : 編碼完成的模組 16

25 e. 測試階段 ( Testing ) (a) 建立測試計畫 (b) 設計測試資料及期望結果 (c) 進行四階段測試 ( 單元 整合 驗收及系統測試 ) (d) 撰寫測試規範書 方法 : 白箱技術 黑箱技術 四階段測試 傳統或階段的由下往上製作 增量式由上往下 增量式由下往上 工具 : 程式圖 因果圖 決策表 流程圖形 產出 : 測試規範書 測試計畫 f. 維護階段 ( Maintenance ) 一般可能進行以下四種維護 : (a) 更正性維護 ( Corrective Maintenance ) (b) 適應性維護 ( Adaptive Maintenance ) (c) 完善性維護 ( Pefective Maintenance ) (d) 預防性維護 ( Preventive Maintenance ) 方法 : 逆向工程 系統再工程 前向工程 系統組態管理 系統轉換技術 系統轉型 產出 : 變成基準線 ( Base Line ) 的系統組態 ( 含生命週期中的所有產出 ) 17

26 2. 古典系統發展生命週期 ( Classical Project Life Cycle ) 圖 3.2 古典系統發展生命週期 此類系統發展過程是以資料流程圖表示, 其優缺點與瀑布式生命 週期法大致相同 18

27 3. 結構化生命週期 ( Structured Life Cycle ) 圖 3.3 結構化系統發展生命週期 4. 雛形式生命週期法 ( Prototyping Life Cycle ) 圖 3.4 雛型式的系統發展週期 19

28 (1) 特色 : 快速的規劃 分析與設計, 並建立一個系統雛型, 經由與使用者作不斷的評估與修正, 可以辨別使用者的動態功能需求, 或將工作雛型評估修正成最終的軟體產品 (2) 種類 : a. 丟棄式雛型 ( Throwaway Prototype ) (a) 腳本式雛型 (b) 摹仿式雛型 (c) 全功能式雛型 b. 演進式雛型 ( Evolutionary Prototype ) (a) 遞增式模型 (b) 螺旋式模型 (3) 優點 : a. 品質的保證與控制 b. 找出新的或無法預期的使用者需求 c. 可用來評估系統改善的需求 d. 在系統建置與維護作業時可節省成本 e. 提高使用者的滿意程度 f. 提高生產力 20

29 (4) 缺點 : a. 經費錯估的錯誤 b. 資訊人員抗拒新方法 c. 缺乏一般規劃 控制與管理 d. 需有熟悉雛型法的開發人員 e. 雛型法的產品可能執行效率不佳 f. 缺乏有效的評估準則 3.2 採用的系統分析方法 我們決定使用原型法來開發此系統, 理由如下 : 1. 原型對一個項目取得成功具有重要的意義 使用者也很難一次性把其真實的要求完全提交, 開始階段提出的往往只是對系統的期望, 和比較模糊的設想而已 而原型系統為用戶提供了一個靶子, 看著原型系統, 用戶往往就能進一步提出他們的真正想法 也許, 跳過原型可以節省時間和前期成本, 但跳過原型的話, 後期變更的成本會明顯增加 2. 便於發現問題, 及時糾正 3. 最終使用者往往在看到一套可運行的系統的基礎上, 才可能提出其真實的意見, 如果到最終提交時才看到這樣的系統就為時太晚 這也是以前無數軟體發展留下的教訓 21

30 3.3 新系統架構與功能 22

31 網頁架構圖內容簡介 ( 參照圖 3.5): 1. 網站介紹介紹此網站的成立宗旨 緣由以及老師的資歷 2. 茶業知識教育系統介紹跟茶葉有關的相關小知識, 讓使用者瀏覽後對茶各方面的知識會更為了解 3. 會員管理系統讓使用者透過註冊成為網站的會員, 以便使用此網站相關的服務, 還提供會員修改以便日後讓會員可以編輯自己的資料 4. 茶葉健診系統此系統為整體網站所強調的功能, 也是中心主題之ㄧ (1) 功能 4.1- 健診介紹介紹茶葉健診的緣起以及健診的方式, 說明為何茶葉需要健診 (2) 功能 4.2- 線上掛號單 a. 功能 預約掛號 : 讓網站會員先在網站上預約健診掛號 b. 功能 查詢掛號 : 讓網站會員可以查詢已經所預約的時段 c. 功能 取消掛號 : 讓網站會員可以取消已經預約的時段 (3) 功能 4.3- 健診討論區讓會員可以在此互相討論有關健診後的感想以及相關事物 23

32 5. 課程系統 (1) 功能 5.1- 課程介紹 : 詳述案嘉雅竹的茶道課程與報名方式 (2) 功能 5.2- 線上報名系統 : 讓會員可在線上利用此系統進行茶道課程的報名方式 (3) 功能 5.3- 課程討論區 : 讓會員彼此互交交流茶道的心得與感想 6. 交易買賣系統 (1) 功能 6.1- 產品介紹 : 介紹案嘉雅竹的各項茶葉產品 (2) 功能 6.2- 線上交易訂購單 : 讓會員利用網路購買的方式就能獲得所需要的產品 (3) 功能 6.3- 交易買賣討論區 : 讓會員互相討論買賣後的心得與感想 7. 網站導覽收尋系統 (1) 功能 7.1- 快速查詢引擎 : 提供給會員快速尋找資料的一個收尋引擎 (2) 功能 7.2- 網頁地圖 : 秀出整個網業的架構, 讓使用者一目明瞭, 可以更快速的進入所想要觀看的頁面 8. 公告系統 (1) 功能 8.1- 瀏覽公告 : 使用者可以瀏覽目前最新的公告或是過去的舊有公告 24

33 3.3.1 會員管理系統 算是此網站的重點部份, 沒有加入會員, 就無法使用網站所提供的服務, 主要包括了以下功能 : 1. 一般會員 (1) 新增會員 : 提供非會員之使用者成為網站的會員 (2) 會員登入 : 讓會員登入 (3) 會員資料修改 : 會員可以修改個人資料 (4) 會員密碼查詢 : 會員忘記密碼時, 可以輸入其他相關資料查詢 2. 管理者方面主要工作是管理每個會員的狀況, 如果會員有不好的行為, 管理員有這個權限去警告會員或是刪除帳號 25

34 以下來介紹會員管理系統的功能 : 1. 一般會員 (1) 新增會員 a. 會員註冊流程圖 addmember.aspx Procedure 1.1 Member.sql Index.aspx 圖 3.6 線上會員註冊流程圖 b. 檔案描述 (a)index.aspx: 網站的首頁, 提供所有子系統的連結介面 (b)addmember.aspx: 會員註冊介面 (c)member.sql: 存取會員資料的資料庫 (d)procedure 1.1: 處理會員註冊資料的程序, 將會員註冊輸入的資料回傳給資料庫 Member.sql, 並且先判斷帳號是否已經被使用, 如果輸入資料型態錯誤, 則提供錯誤訊息告知使用者 26

35 c. 檔案記錄格式 檔案名稱 :Index.aspx 紀錄格式 : 序號 欄位位置 欄名 資料型態 長度 附註 1 第一列第一行 網頁介紹 char 8 按鈕連結 2 第二列第一行 茶葉預約健診 char 8 按鈕連結 3 第三列第一行 線上茶葉交易 char 8 按鈕連結 4 第四列第一行 線上課程報名 char 8 按鈕連結 5 第五列第一行 茶葉相關知識 char 8 按鈕連結 6 第六列第一行 會員管理系統 char 8 按鈕連結 7 第七列第一行 網站導覽 char 8 按鈕連結 8 第一列第二行 公告項目 char 8 按鈕連結 9 第一列第三行 會員登入 char 8 按鈕連結 10 第一列第四行 會員註冊 char 8 按鈕連結 表 3.1 網站首頁記錄格式 27

36 檔案名稱 :AddMember.aspx 紀錄格式 : 序號 欄位位置 欄名 資料型態 長度 附註 1 第一列第一行使用者帳號 char 10 不可為空不可重複 2 第一列第二行 帳號檢查 char 10 3 第二列第一行使用者密碼 char 10 不可為空 4 第三列第一行 性別 char 2 5 第四列第一行 char 50 不可為空 6 第五列第一行 連絡電話 char 10 不可為空 7 第六列第一行 聯絡地址 char 50 不可為空 8 第七列第一行 生日 char 20 不可為空 9 第八列第一行身分證字號 char 10 不可為空 表 3.2 會員註冊畫面記錄格式 檔案名稱 :Member.sql 紀錄格式 : 序號 欄名 資料型態 長度 附註 1 會員編號 char 3 主索引鍵 2 帳號 char 10 3 密碼 char 10 4 電子信箱 char 50 5 身分證字號 char 10 28

37 6 聯絡地址 char 50 7 聯絡電話 int 10 8 生日 char 20 9 性別 char 2 10 會員所屬權限階級 char 5 11 管理健診中心名稱 char 20 表 3.3 會員系統資料庫記錄格式 (2) 會員登入 a. 會員登入流程圖 Login.aspx Procedure 1.2 Member.sql Index.aspx 圖 3.7 線上會員登入流程圖 29

38 b. 檔案描述 (a)index.aspx: 網站的首頁, 提供所有子系統的連結介面 (b)login.aspx: 會員登入介面 (c)member.sql: 存取會員資料的資料庫 (d)procedure 1.2: 處理會員登入的程序, 會員輸入帳號及密碼後會跟資料庫 Member.sql 做聯繫並比對資料, 比對結果無誤即成功登入, 否則提供錯誤訊息告知使用者 c. 檔案記錄格式 檔案名稱 :Login.aspx 紀錄格式 : 序號 欄位位置 欄名 資料型態 長度 附註 1 第一列第一行 帳號 char 10 2 第一列第二行 密碼 char 10 3 第一列第三行 登入 char 10 4 第一列第四行 註冊 char 10 5 第一列第五行忘記密碼 char 10 表 3.4 會員登入畫面記錄格式 30

39 (3) 會員資料修改 a. 會員資料修改流程圖 Edit_user.aspx Procedure 1.3 Member.sql Edit_Result.aspx 圖 3.8 線上會員資料修改流程圖 b. 檔案描述 (a)member.sql: 存取會員資料的資料庫 (b)edit_user.aspx: 會員登入後提供會員修改自己註冊資料的介面, 進入此介面會秀出會員所有的資料 (c)edit_result.aspx: 秀出修改後的新資料 (d)procedure 1.3: 更改會員資料的程序, 當會員在 Edit_user.aspx 選取欲更改的欄位資料並修改之, 此程序會跟資料庫 Member.sql 聯繫以修改資料欄位內的內容, 當修改完成後會在 Edit_Result.aspx 秀出更新後的資料 31

40 c. 檔案記錄格式 檔案名稱 :Edit_user.aspx 紀錄格式 : 序號 欄位位置 欄名 資料型態 長度附註 1 第一列第一行 舊密碼 char 10 2 第一列第二行 新密碼 char 10 3 第一列第三行 新密碼確認 char 10 4 第一列第四行 電子信箱 char 50 5 第一列第五行 身分證字號 char 10 6 第一列第六行 聯絡地址 char 50 7 第一列第七行 聯絡電話 char 10 8 第一列第八行 生日 char 20 9 第一列第九行 性別 char 2 10 第二列第四行 修改電子信箱 char 第二列第五行修改身分證字號 char 第二列第六行 修改聯絡地址 char 第二列第七行 修改聯絡電話 char 第二列第八行 修改生日 char 第二列第九行 修改性別 char 2 表 3.5 會員修改資料 32

41 (3) 會員密碼查詢 a. 會員密碼查詢流程圖 Forget_pass.aspx Procedure 1.4 Member.sql Index.aspx 圖 3.9 線上會員密碼查詢流程圖 b. 檔案描述 (a)index.aspx: 網站的首頁, 提供所有子系統的連結介面 (b)member.sql: 存取會員資料的資料庫 (c)forget_pass.aspx: 當會員忘記自己所屬的密碼, 可以透過此介面並輸入相關資料來查詢會員的密碼 (d)procedure 1.4: 處理使用者查詢密碼以及帳號的程序, 當使用者輸入 和身分證字號時, 此程序透過跟資料庫聯繫來比對輸入的兩個資料是否在同一個列裡面, 33

42 如果比對成功, 系統會自動寄出舊帳號 舊密碼到使用 者的 c. 檔案記錄格式 檔案名稱 :Forget_pass.aspx 紀錄格式 : 序號欄位名稱欄名資料型態長 附註 度 1 第一列第一行 身分證字號 char 10 2 第一列第二行 char 50 3 第三列第三行 送出查詢 char 10 表 3.6 會員查詢錄格式 34

43 3.3.2 茶葉健診系統 此專案的核心部分, 整個網站的中心系統, 不僅僅只是會員使用此系統, 還分成三種階級的會員 : 最高管理者 分區中心管理員 一般會員 ( 也就是所謂的求診者 ) 系統功能說明如下 : 1. 一般使用者 (1) 線上預約健診掛號單 : 提供會員進行線上預約掛號之服務 (2) 瀏覽預約結果 : 提供會員事後瀏覽查詢自己預約的結果, 以防會員忘記預約的時間 (3) 刪除預約掛號單 : 會員查詢預約結果後, 提供會員消預約的服務, 至於為什麼沒有修改內容呢? 因為送出掛號單後可能已經經過處理, 修改後怕管理者會沒注意到, 為了嚴格控管, 所以只有刪除的功能 2. 茶葉健診中心最高管理者此權限的人員目前暫定一名, 也是就是李案嘉老師, 其工作有 : (1) 新增健診中心 : 基本上目前只分為北 中 南三區的健診中心, 未來李案嘉老師的健診中心逐漸擴大後, 會把北中南三區細分成都市名稱, 如台北地區 桃園地區 台中地區 高雄地區 等等 (2) 編輯健診中心 : 對健診中心的更明 內容敘述 管理員的任命 (3) 任命區域健診中心管理者 : 在 (2) 的功能裡可以任命此區健診中心的管理員, 爲什麼不一個管理員管全部的版面呢? 主要是考慮到各區域之間的茶大夫不一定是同一個人, 由 35

44 各區域的中心管理員處理完掛號單交給各區域的駐診茶大 夫, 此程序方便不雜亂又有效率 3. 區域健診中心管理者人員配置方面是一各區域配一各區域管理員, 未來有可能增加到兩名, 工作只有處理各區域掛號單 : 當求診會員在網路預約掛號完成後, 是未處理狀態的, 必須經由各個區域中心的管理者處理這些掛號單, 在送達給茶大夫處理過的預約掛號單 為何需要經由管理員處理完在傳達給茶大夫呢? 因為考慮到預約會員有可能是預約錯誤時段或是臨時取消, 所以確認會員要掛號才將掛號單交給茶大夫 4. 茶大夫人員配置方面基本上是一個區域一個茶大夫, 茶大夫並不需要跟管理系統有任何的關聯, 只需要提供一個功能給茶大夫, 即瀏覽區域健診中心管理者處理後的掛號單列表 36

45 以下就來說明各個權限人員與功能的關係 : 1. 最高管理員部分 (1) 新增健診中心 a. 最高管理員新增健診中心流程圖 Add_Center.aspx Procedure 2.1 Center.sql Default.aspx 圖 3.10 最高管理者新增健診中心流程圖 b. 檔案描述 (a)default.aspx: 茶葉健診系統的開始進入頁面, 也就是此子系統之首頁, 此頁面分成大兩框架, 左方提供未登入之使用者登入介面, 右邊框架顯示分區健診中心的名稱和連結, 可以讓會員選擇離自己最近的區域來進行預約掛號健診服務 (b)add_center.aspx: 最高管理者新增健診中心介面, 最高管理者在此可以輸入健診中心的名稱 任命此中心的區 37

46 域管理員 (c)center.sql: 存取各個健診中心資料的資料庫 (d)procedure 2.1: 處理最高管理員新增健診中心的程序, 最高管理者在 Add_Center.aspx 輸入想要新增健診中心的資料, 包括此中心管理者名稱 健診中心名稱 健診中心的圖片 內容等 c. 檔案記錄格式檔案名稱 :Default.aspx 記錄格式 : 序號欄位位置欄名資料型態長度附註 1 第一列第一行使用者 char 10 登入 / 註冊 2 第二列第一行 帳號 char 10 文字輸入 3 第三列第一行 密碼 char 10 文字輸入 4 第四列第一行 登入 char 2 按鈕連結 5 第五列第二行 註冊 char 2 按鈕連結 6 第五列第三行 忘記密碼 char 4 按鈕連結 7 第一列第四行全國各地 char 50 表格欄名 健診中心 8 第一列第五行掛號單總數 int 4 表格欄名 9 第一列第六行已處理掛 int 4 表格欄名 號單數 38

47 10 第一列第七行駐診茶大夫 char 10 表格欄名 11 第一列第八行管理員 char 10 表格欄名 表 3.7 茶葉健診首頁記錄格式 檔案名稱 :Add_Center.aspx 紀錄格式 : 序號 欄位位置 欄名 資料型態 長度 附註 1 第一列第一行 健診中心名稱 char 50 輸入文字 2 第二列第一行健診中心管理員 char 10 輸入文字 3 第三列第一行 健診中心描述 char 20 輸入文字 4 第四列第一行 上傳圖片 char 50 輸入圖片位置 5 第五列第一行 確定新增 char 5 按鈕連結 表 3.8 管理員新增健診中心記錄格式 檔案名稱 :center.sql 紀錄格式 : 序號 欄名 資料型態 長度 附註 1 健診中心編號 int 4 2 健診中心名稱 char 50 3 管理員 char 10 39

48 4 健診中心描述 ntext 20 5 掛號單總數 int 4 6 已處理掛號單總數 int 4 7 中心駐診茶大夫 char 10 表 3.9 健診中心資料庫記錄格式 (2) 編輯健診中心 a. 最高管理者編輯健診中心流程圖 Edit_Center.aspx Procedure 2.2 Center.sql Edit_Default.aspx 圖 3.11 最高管理者編輯健診中心流程圖 40

49 b. 檔案描述 (a)edit_default.aspx: 必須有最高權限的管理者才能進入此頁面, 此頁面提供各區健診中心的編輯入口, 管理者可以在此頁面選擇所想要編輯的健診中心 (b)edit_center.aspx: 此頁面為管理者在 Edit_Default.aspx 所選取的健診中心的各個資料, 包括了健診中心名稱, 各區管理員名稱, 各區描述等等, 管理者可以修改這些內容或是刪除整個健診中心 (c)center.sql: 存取各個健診中心資料的資料庫 (d)procedure 2.2: 最高管理員新增健診中心的處理程序, 管理者在 Edit_Default.aspx 選擇一個地區的健診中心去做修改, 選完後會進入 Edit_Center.aspx 去做所選取的健診中心修改欲更改的資料, 包括更改健診中心名稱 管理員替換 健診中心的描述等等 c. 檔案記錄格式 檔案名稱 :Edit_Default.aspx 紀錄格式 : 序號 欄位位置 欄名 資料型態 長度 附註 1 第一列第一行 健診中心名稱 char 50 2 第一列第二行 掛號單總數 int 4 3 第一列第三行已處理掛號單數 int 4 4 第一列第四行 駐診茶大夫 char 10 41

50 5 第一列第五行管理員 char 10 6 第一列第六行編輯 char 5 表 3.10 管理者選擇編輯健診中心記錄格式 檔案名稱 :Edit_Center.aspx 紀錄格式 : 序號 欄位位置 欄名 資料型態 長度 附註 1 第一列第一行 健診中心名稱 char 50 輸入文字 2 第二列第一行健診中心管理員 char 10 輸入文字 3 第三列第一行 健診中心描述 char 20 輸入文字 4 第四列第一行 上傳圖片 char 50 輸入圖片位置 5 第五列第一行 確定修改 char 5 6 第五列第二行 刪除 char 5 表 3.11 管理者編輯健診中心內容記錄格式 42

51 2. 一般會員 (1) 新增健診預約掛號 a. 會員線上健診預約掛號流程圖 Default.aspx Post.sql Procedure 2.3 Center.sql Center.aspx 圖 3.12 會員線上健診預約掛號流程圖 b. 檔案描述 (a)post.aspx: 提供會員填寫預約掛號單的介面, 填寫完畢後系統會自動給使用者一個掛號序號, 讓會員日後按照掛號序號來進行茶葉健診 (b)center.aspx: 為各地區健診中心的掛號單列表, 每各地區的健診中心的資料均為獨立的, 而一般會員進入此頁面只能看到自己所預約的掛號單, 而管理員可以看到全 43

52 部的掛號單並一一處理之 (c)post.sql: 存取掛號單內容的資料庫 (d)center.sql: 存取各個健診中心資料的資料庫 c. 檔案記錄格式 檔案名稱 :Post.aspx 紀錄格式 : 序號 欄位位置 欄名 資料型態 長度 附註 1 第一列第一行 帳號 char 10 輸入文字 2 第二列第一行 健診時間 data 20 輸入文字 3 第三列第一行 健診原因敘述 char 100 輸入文字 4 第四列第一行 上傳圖片 char 50 輸入圖片的位置 5 第五列第一行 送出掛號單 char 10 按鈕 表 3.12 會員健診預約掛號單填寫內容記錄格式 檔案名稱 :Center.aspx 紀錄格式 : 序號 欄位位置 欄名 資料型態 長度 附註 1 第一列第一行 帳號 char 10 2 第一列第二行 健診序號 int 4 3 第一列第三行 欲健診時間 date 20 4 第一列第四行 管理者回覆處理 int 3 44

53 5 第一列第五行預約時間 date 20 6 第一列第六行修改 char 10 表 3.13 會員茶葉健診中心記錄格式 檔案名稱 :Post.sql 紀錄格式 : 序號 欄名 資料型態 長度 附註 1 掛號單編號 int 4 2 健診中心編號 int 4 3 帳號 char 10 4 序號 int 4 5 掛號單內容 char 健診時間 date 20 7 預約掛號時間 date 20 表 3.14 掛號單資料庫記錄格式 45

54 (2) 查詢預約結果 a. 會員線上查詢預約掛號流程圖 Default.aspx Post.sql Procedure 2.4 Center.sql Center.aspx 圖 3.13 會員線上查詢健診預約掛號流程圖 b. 檔案描述 (a)default.aspx: 茶葉健診系統的開始進入頁面 (b)center.aspx: 為各地區健診中心的掛號單列表, 每個會員擁有自己的掛號單介面, 別人看不到自己所掛號的東西 (c)post.sql: 存取掛號單內容的資料庫 (d)center.sql: 存取各個健診中心資料的資料庫 (e)procedure 2.4: 提供會員查詢自己的掛號單程序, 當會員進入 Center.aspx 後, 程序先判斷會員的 Session, 並且只列出符合此 Session 的掛號單 46

55 (2) 取消預約掛號單 a. 會員線上取消預約掛號流程圖 Post.sql Procedure 2.5 Center.sql Center.aspx 圖 3.14 會員線上取消健診預約掛號單流程圖 b. 檔案描述 Procedure 2.5: 會員取消預約掛號單的程序 當會員在 Center.aspx 查詢到自己預約的掛號單後, 可以在此頁面取消所預約的掛號單, 取消後此掛號單後,Center.sql 和 Post.sql 會將此筆資料刪除, 茶大夫的掛號單列表介面也不會有此掛號單的資料, 可以避免資料不同的問題發生 47

56 3. 區域健診中心管理者 (1) 處理各區域掛號單 a. 管理員處理掛號單流程圖 Center.aspx Post.sql Procedure 2.6 Center.sql Show.aspx 圖 3.15 管理員處理掛號單流程圖 b. 檔案描述 : (a)center.aspx: 為各地區健診中心的掛號單列表, 管理員可在此進入未處理的掛號單 (b)show.aspx: 提供茶大夫瀏覽ㄉ掛號單列表, 此介面列出已處理的掛號單 (c)center.sql: 存取各個健診中心資料的資料庫 (d)post.sql: 存取掛號單內容的資料庫 (e)procedure 2.6: 提供各健診中心管理員處理掛號單的程序, 當管理員在 Center.apx 看到未處理的掛號單, 確定掛號單的內容並處理, 處理完後會自動送給茶大夫瀏覽介面 Show.aspx 48

57 4. 茶大夫 (1) 瀏覽已處理掛號單 a. 茶大夫瀏覽已處理掛號單流程圖 Default.aspx Post.sql Procedure 2.7 Center.sql Show.aspx 圖 3.16 茶大夫瀏覽已處理掛號單流程圖 b. 檔案描述 : (a)default.aspx: 茶葉健診系統的開始進入頁面 (b)show.aspx: 茶大夫專屬介面, 列出所有預約掛號單的列表, 日後方便看診 (c)procedure 2.7: 很簡單的一個程序, 只是從資料庫讀取已經被管理員處理過後的掛號單, 將結果顯示在 Show.aspx 49

58 3.3.3 茶葉交易系統 本系統提供使用者一個方便的購物介面, 並自動計算折扣後的總金額, 再以電子郵件傳訊給客戶詳細的訂單內容, 使用者的權限分別有 : 系統最高管理員 訂單管理員 一般客戶 ( 意即本站的消費者 ) 系統功能說明如下 : 1. 一般使用者 (1) 瀏覽所有茶葉相關產品 : 列出所有上市茶種簡介, 並分類顯示 (2) 線上訂購茶葉 : 由購物車自動計算折扣後總價格, 在客戶下單確認後, 系統自動寄出電子郵件訂購單的詳細內容, 並提醒交易時間及地點 (3) 刪除訂購單資料 : 在訂購單未送出前, 系統顯示一個該使用者的訂購單內容, 使用者可以在確認前刪除訂單資料 2. 茶葉交易系統主管理員線上交易系統最大權限的管理員, 雖然訂單管理不是職責之一, 但為因應某些情況的發生, 所以也給予處理訂單的權限, 其工作只有新增或編輯上市茶葉資料 : 因為茶葉產品隨著季節的變化, 每一季都會由各茶區產出當季特色茶葉, 茶葉可能在當季銷售完, 市場有可能使茶葉價格變動, 所以管理者必須隨時注意庫存量以即時更新產品內容 50

59 3. 茶葉交易系統訂單管理者 (1) 會員訂單管理 : 顯示所有接獲訂單, 可以根據處理情況給予處理訂單和完成交易的標誌, 如此不僅讓客戶知道訂單的處理情形, 也方便訂單管理員間不致於處理相同一份訂單 (2) 訂單歷史記錄 : 顯示與本公司完成任何一次交易的客戶訂單資料, 這些資料在未來的帳目結報或客戶服務上都有正面影響, 另一方面也是管理者分析公司業績的主要指標 訂單管理者通常會根據營運規模來增加人數, 未來有可能以分區下單及管理的方式來進行交易, 然而目前仍然是統一下單並處理, 基本上, 訂單管理員也有處理訂單 完成交易及查詢訂單歷史記錄的功能, 每個訂單管理員的權限是相同的, 在確認訂單之後, 執行處理訂單的指令並由庫存的管理員準備出貨, 在接到與客戶完成交易的消息後立刻通知訂單管理員, 執行完成交易的指令, 而所有處理員工都能在系統上看到已經處理的消息 4. 庫存管理員由於訂單是來自全世界各地, 所以庫存管理員須要藉由訂單管理員的訂單資料執行銷售業務, 這個管理員並不直接操作系統, 但是他須要系統提供的訂單資料以確定出貨量並回報實際的交易結果給系統 51

60 以下就來說明各個權限人員與功能的關係 : 1. 主管理員部分 (1) 新增與編輯上市茶葉資料 a. 最高管理員新增與編輯上市茶葉資料流程圖 Default.aspx Protab.sql Procedure proMang.aspx 圖 3.17 新增上市茶葉資料流程圖 Default.aspx Protab.sql Procedure proAdd.aspx 圖 3.18 編輯上市茶葉資料流程圖 52

61 b. 檔案描述 (a)default.aspx: 茶葉交易系統的首頁, 本頁分成四大框架, 左邊是本店專屬特色茶的展示, 右邊是最新上市茶葉的資訊及圖片, 右下方是本季新茶的展示, 而上方則是使用者的選項列, 根據不同的使用者權限而出現不同的選項, 初始時有產品總覽和會員登入兩個功能 (b)09proadd.aspx: 網站的主管理員可以在此登錄新上市商品資料 (c)08promang.aspx: 上市產品的管理介面, 必須有最高權限的管理者才能進入此頁面, 此頁面提供各種上市茶葉的編輯功能, 管理者可以在此頁面直接選擇所想要編輯的茶葉產品 (d)protab.sql: 存取各項已登錄茶葉產品詳細資料的資料庫 (e)procedure 3.1: 處理主管理員登錄新上市茶葉的程序, 主管理員在 09proAdd.aspx 輸入想要登錄新上市茶葉的資料, 包括貨號 類別 名稱 售價 圖片等 (f)procedure 3.2: 處理主管理員編輯已上市茶葉的程序, 主管理員在 08proMang.aspx 選取想要編輯的上市茶葉的資料, 即可對此產品所展示的各項資料作修改 53

62 c. 檔案名稱 檔案名稱 :Default.aspx 紀錄格式 : 序號 欄位位置 欄名 資料型態 長度 附註 1 第一列第一行 產品總覽 char 4 按鈕連結 2 第一列第二行 會員登入 char 4 按鈕連結 3 第二列第一行 貨號 char 10 表格欄名 4 第二列第二行 產品名稱 char 10 表格欄名 5 第二列第三行 特價 int 4 表格欄名 6 第三列第一行 上市時間 char 10 表格欄名 7 第三列第二行 貨號 char 10 表格欄名 8 第三列第三行 產品名稱 char 10 表格欄名 9 第三列第四行 特價 char 4 表格欄名 表 3.15 茶葉交易首頁記錄格式 檔案名稱 :09proAdd.aspx 紀錄格式 : 序號 欄位位置 欄名 資料型態 長度 附註 1 第一列第一行 貨號 char 10 輸入文字 2 第二列第一行 類別 char 10 拉曳選單 3 第三列第一行 名稱 char 10 輸入文字 4 第四列第一行 售價 int 4 輸入數字 5 第四列第一行 原價 int 4 輸入數字 54

63 6 第四列第一行 折扣數 int 4 拉曳選單 7 第四列第一行 圖片連結 char 50 圖檔路徑 8 第四列第一行 簡介 char 50 輸入數字 9 第四列第一行 備註 char 50 輸入數字 10 第四列第一行 是否上櫃 char 4 按鈕選單 11 第四列第一行 產品登錄 char 4 按鈕連結 12 第四列第一行 重新填寫 char 4 按鈕連結 表 3.16 管理員登錄新產品資料記錄格式 檔案名稱 :08proMang.aspx 紀錄格式 : 序號 欄位位置 欄名 資料型態 長度 附註 1 第一列第一行 貨號 char 10 2 第一列第二行 名稱 char 10 3 第一列第三行 價格 Int 4 4 第一列第四行 原價 Int 4 5 第一列第五行 折扣數 int 4 6 第一列第六行 上架 char 4 7 第一列第七行 編輯 char 4 表 3.17 管理者編輯上市茶葉資料記錄格式 55

64 檔案名稱 :protab.sql 紀錄格式 : 序號 欄名 資料型態 長度 附註 1 貨號 char 10 2 類別 char 10 3 名稱 char 10 4 售價 int 4 5 原價 int 4 6 折扣數 int 4 7 圖片連結 char 50 8 簡介 ntext 50 9 備註 ntext 是否上櫃 char 4 表 3.18 交易系統產品資料庫記錄格式 56

65 2. 訂單管理員 (1) 處理會員訂購單 a. 訂單管理員處理訂單流程圖 10saleStat.aspx logtab.sql Procedure userOrder.aspx 圖 3.19 訂單管理員處理訂單流程圖 b. 檔案描述 (a)10salestat.aspx: 訂單和網站管理員的管理介面, 有商品管理 會員管理 會員訂單管理和訂單歷史記錄等功能 (b)13userorder.aspx: 各會員的訂購單管理介面 (c)logtab.sql: 存取所有客戶訂購單的資料庫 (d)procedure 3.3: 訂單管理員在 13userOrder.aspx 介面中可以點選處理訂單, 此後這一筆訂單資料就會顯示處理中 57

66 c. 檔案記錄格式 檔案名稱 :10saleStat.aspx 紀錄格式 : 序號 欄位位置 欄名 資料型態 長度 附註 1 第一列第一行 銷售數量 Int 6 表格欄名 2 第一列第二行 銷售金額 int 10 表格欄名 3 第一列第三行 訂購單數量 int 6 表格欄名 4 第一列第四行 完成交易量 int 6 表格欄名 5 第一列第五行 平均交易額 int 10 表格欄名 6 第二列第一行 商品管理 char 10 按鈕連結 7 第二列第二行 會員管理 char 10 按鈕連結 8 第二列第三行 會員訂單管理 char 10 按鈕連結 9 第二列第四行 訂單歷史記錄 char 10 按鈕連結 10 第三列第一行 回入口 char 3 按鈕連結 11 第四列第一行 貨號 char 4 表格欄名 12 第四列第二行 產品名稱 char 10 表格欄名 13 第四列第三行 總銷售量 int 10 表格欄名 14 第四列第四行 銷售額 int 10 表格欄名 表 3.19 訂單管理員操作介面記錄格式 58

67 檔案名稱 :13userOrder.aspx 紀錄格式 : 序號欄位位置欄名資料型態長度附註 1 第三列第一行訂單 NO int 6 表格欄名 2 第三列第二行 ID char 10 表格欄名 3 第三列第三行會員姓名 char 10 表格欄名 4 第三列第四行貨號 int 6 表格欄名 5 第三列第五行產品名稱 char 10 表格欄名 6 第三列第六行數量 int 10 表格欄名 7 第三列第七行金額 int 10 表格欄名 8 第三列第八行訂購狀態 char 10 表格欄名 9 第三列第九行訂購時間 char 10 表格欄名 10 第三列第十行處理訂單 char 4 按鈕連結 11 第三列十一行完成交易 char 4 按鈕連結 表 3.20 客戶訂單的處理記錄格式 檔案名稱 :logtab.sql 紀錄格式 : 序號 欄名 資料型態 長度 附註 1 訂單 NO int 6 2 ID char 10 3 貨號 int 6 4 數量 int 10 5 金額 int 10 59

68 6 訂購時間 char 10 7 訂購狀態 char 10 表 3.21 客戶訂單資料庫記錄格式 60

69 3. 一般會員 (1) 新增一筆訂購單資料 a. 會員線上下單流程圖 01proList.aspx logtab.sql Procedure 3.4 Protab.sql 03proIntdc.aspx 圖 3.20 會員線上下單流程圖 b. 檔案描述 (a)01prolist.aspx: 展示目前所有上市茶葉, 附有方便的搜尋功能, 以及產品介紹的連結 (b)03prointdc.aspx: 除了商品的簡介外, 附加購物車功能, 方便使用者直接下單, 總金額也自動算出 (c)02userloglist.aspx: 顯示該會員已完成的訂購單, 在訂單管理員送出通知前是可以刪除的, 以免操作上的失誤造成的誤訂, 這是在已登入會員後才能進入的頁面 (d)logtab.sql: 存取所有客戶訂購單的資料庫 61

70 (e)procedure 3.4: 客戶在決定購買的茶葉上點選後會出 現茶葉的詳細資料, 在 03proIntdc.aspx 附有放入訂購 單的按鈕, 當客戶按下後, 這次訂購程序就算完成 c. 檔案記錄格式 : 檔案名稱 :01proList.aspx 紀錄格式 : 序號 欄位位置 欄名 資料型態 長度 附註 1 第一列第一行 種類 char 10 表格欄名 2 第一列第二行 貨號 char 4 表格欄名 3 第一列第三行 產品名稱 char 10 按鈕連結 4 第一列第四行 特價 char 10 表格欄名 5 第二列第一行 回入口 char 3 按鈕連結 表 3.22 產品總覽記錄格式 檔案名稱 :02userLogList.aspx 紀錄格式 : 序號 欄位位置 欄名 資料型態 長度 附註 1 第一列第一行 貨號 char 4 表格欄名 2 第一列第二行 產品名稱 char 10 表格欄名 62

71 3 第一列第三行 訂購數量 int 5 表格欄名 4 第一列第四行 金額 int 10 表格欄名 5 第一列第五行 時間 char 10 表格欄名 表 3.23 已完成訂購單記錄格式 63

72 4. 庫存管理員 (1) 完成一筆交易 a. 庫存管理員完成交易流程圖 10saleStat.aspx logtab.sql Procedure userOrder.aspx 圖 3.21 庫存管理員完成交易流程圖 b. 檔案描述 (a)10salestat.aspx: 訂單和網站管理員的管理介面, 有商品管理 會員管理 會員訂單管理和訂單歷史記錄等功能 (b)13userorder.aspx: 各會員的訂購單管理介面 (c)logtab.sql: 存取所有客戶訂購單的資料庫 (d)procedure 3.5: 庫存管理員在於完成實際交易的結果確定後, 可在 13userOrder.aspx 介面中可以點選完成交易, 此後這一筆訂單資料就會顯示已完成, 並登錄到交易歷史記錄中以備查詢 64

73 3.3.4 公告系統 主要是用來作為各個相關部門的公佈欄之用, 以了解各分部的最新消息 異動狀態公告, 以及重要事項的提醒和連絡之用, 並由使用者屬性的不同, 分為一般使用者, 各部門管理者, 和系統管理者這三種不同的功能使用 各系統功能說明如下 : 1. 一般使用者 (1) 瀏覽公告 : 由主畫面上所顯示的最新消息, 來瀏覽重要相關公告事項 (2) 查詢公告 : 提供使用者搜索公告的功能, 包含分類搜索, 及公告主旨搜索, 並且可由分頁與跳頁的功能, 從不同的頁數開始觀看 2. 各部門管理者 (1) 新增本部門公告 : 讓各部門管理者在登入系統後, 以發布公告的功能來發布重要的最新消息, 並且由公告單位以及公告類型這兩項功能的加入, 讓一般使用者在瀏覽公告以及查詢上更為方便, 還可以附上相關網址 聯絡人郵件位址, 以及聯絡方式好讓會員與各部門之間能產生良好的互動及溝通管道 (2) 修改本部門公告 : 修訂本部門已公告內容的部分, 因為權限設定關係, 各部門管理者只限定修改本部門已經發布過的公告內容, 不能修改其他部門的公告內容, 以免造成資料錯誤 65

74 (3) 刪除本部門公告 : 同上述的修改功能, 一樣只能刪除本身 部門已經發布的公告, 不能刪除其他部門的部分 大部分 是用來刪除已過期公告或是發布錯誤的公告為主 3. 系統管理者 (1) 新增系統公告 : 發布系統更新 異動等的訊息公告 (2) 修改公告 : 對各部門公告內容皆可以做修正處理, 或是各部門所發布的公告內容如有雷同, 協調相關部門並做合併修改的動作, 以免版面混亂與造成會員瀏覽的不便 (3) 刪除公告 : 對於各個部門已過時效性的公告做刪除動作, 以減少系統資源的浪費 66

75 以下為公告系統功能描述 : 1. 一般使用者 (1) 瀏覽公告 a. 流程圖 News.aspx Procedure 4.1 News.sql 圖 3.22 一般使用者瀏覽公告流程圖 b. 檔案描述 (a)news.aspx: 瀏覽公告系統用的主要頁面, 是此系統之首頁, 其中, 最上層提供分類跳頁和關鍵字搜尋的功能 ; 第二層為管理者用的按鈕設計, 內容包含 登入系統 發布公告 修改模式 刪除模式 登出系統 取消檢視條件 等的功能 ; 第三層為跳頁模式, 可選擇到哪一頁瀏覽, 只要輸入頁碼即可 ; 第四層以下為公告內容顯示部分, 預設值以顯示最新公告內容為主 (b)procedure 4.1: 處理公告內容顯示的程序, 會從 News.sql 中讀取所須顯示的公告資料, 以顯示在 News.aspx 的頁面中, 預設值以顯示最新公告內容為主 (c)news.sql: 此公告系統最主要的資料庫, 儲存各種公告資訊欄位內容 67

76 c. 檔案記錄格式 檔案名稱 :News.aspx 紀錄格式 : 序號 欄位位置 欄名 資料型態 長度 附註 選單 : 所有公告 1 第一列第一行選擇檢視模式 Char 10 今日公告 急件公告普通公告 2 第一列第二行 檢索公告主旨 char 20 輸入文字 3 第三列第一行 登入系統 char 10 按鈕連結 4 第三列第二行 發佈公告 char 10 按鈕連結 5 第三列第三行 修改模式 char 10 按鈕連結 6 第三列第四行 刪除模式 char 10 按鈕連結 7 第三列第五行 登出系統 char 10 按鈕連結 8 第三列第六行 取消檢視條件 char 20 按鈕連結 9 第四列第一行 跳頁 int 4 頁數選單 10 第三列第三行 最新消息公告 char 50 表 3.24 公告系統首頁記錄格式 68

77 檔案名稱 :News.sql 紀錄格式 : 序號 欄位位置 欄位名稱資料型態 長度 附註 1 第一列第一行 流水號 int 10 公告編號 2 第一列第二行 類別 char 50 急件或普通 3 第一列第三行公告主旨 char 50 公告的主題 4 第一列第四行公告單位 char 50 發佈公告的單位 5 第一列第五行公告日期 date 10 公告發表日 6 第一列第六行閱讀指數 int 3 點閱次數的累計 Yes = 使用 Html 7 第一列第七行文件類型 Boolean 4 格式,No = 不使 用 Html 格式 8 第一列第八行公告內容 char 250 公告的詳細內容 9 第一列第九行相關網址 char 30 相關參考網址 10 第一列第十行 聯絡人 char 50 聯絡人 11 第一列第十一行 電子郵件 char 20 連絡人電子郵件 12 第一列第十二行 Poster_ID char 50 發佈公告的 ID 13 第一列第十三行 公告時間 time 10 發佈公告的時間 表 3.25 公告統資料庫記錄格式 69

78 (2) 查詢公告 a. 流程圖 shownews.aspx News.aspx Procedure 4.2 gotonews.aspx News.sql 圖 3.23 一般使用者查詢公告流程圖 b. 檔案描述 (a)gotonews.aspx: 顯示搜尋目標所指定的公告資料 (b)shownews.aspx: 顯示瀏覽公告內容 (c)procedure 4.2: 用來取得指定公告資料, 可由所選要瀏覽的類別, 或是輸入公告編號 關鍵字等等的, 從公告系統的資料庫中擷取所想要閱覽的公告內容 70

79 c. 檔案記錄格式 檔案名稱 :shownews.aspx 紀錄格式 : 序號 欄位位置 欄位名稱 資料型態長度 附註 1 第一列第一行 公告屬性 char 10 2 第二列第一行 公告主旨 char 50 公告的主題 3 第三列第一行 文件類型 char 10 Html or txt 4 第三列第四行公告單位 char 50 發佈公告的單 位 5 第三列第五行 公告日期 / 時 間 Date/tim e 公告發表日 6 第四列第八行公告內容 Char 200 公告的詳細內 容 7 第五列第一行相關網址 char 30 相關參考網址 8 第六列第一行聯絡人 char 50 聯絡人 9 第七列第一行電子郵件 char 20 連絡人電子郵 件 表 3.26 瀏覽公告內容記錄格式 71

80 2. 各部門管理者 (1) 新增本部門公告 a. 流程圖 userlogin.aspx shownews.aspx userpass.aspx addnews.aspx Procedure 4.3 News.aspx Users.sql News.sql 圖 3.24 各部門管理者新增本部門公告流程圖 b. 檔案描述 (a)userlogin.aspx: 使用者登入介面, 包含使用者的帳號密碼的輸入欄位和驗證, 為管理者的主要登入頁面 (b)userpass.aspx: 使用者帳號密碼驗證, 在接收到使用者的帳號密碼輸入之後, 會向記錄使用者帳號的資料庫取得帳號資料表, 來檢查帳號是否啟用 密碼正確與否, 之後再來比對帳號 姓名 權限是否都符合開啟此一公告系統的要求, 確定完成後才會鏈結到所須顯示的頁面 (c)users.sql: 使用者資料庫, 記錄所有能更動此一公告系統的管理者的帳號 密碼以及權限的資料 (d)addnews.aspx: 新增公告的介面, 在次檢查使用者的權 72

81 限是否能發表公告後, 顯示此頁面讓使用者發布公告, 並在傳送公告確定前會檢查是否某些必要欄位都有填入資料 (e)procedure 4.3: 處理使用者發佈的公告內容, 將其訊息存入公告資料庫中作保存, 同時輸出新增公告資料至 shownews.aspx 頁面中, 並回到公告系統的首頁 c. 檔案記錄格式檔案名稱 :userlogin.aspx 紀錄格式 : 序號欄位位置欄位名稱資料型態長度附註 1 第一列第一行 2 第一列第二行 使用者帳號使用者密碼 char 8 使用者帳號 char 16 使用者密碼 3 第二列第三行登入 char 10 按鈕鏈結 表 3.27 使用者登入介面記錄格式 73

82 檔案名稱 :Users.sql 紀錄格式 : 序號 欄位位置 欄位名稱資料型態 長度 附註 1 第一列第一行 UserID int 20 使用者 ID 編號 2 第一列第二行 帳號 char 50 英文帳號 3 第一列第三行 密碼 char 50 帳號密碼 4 第一列第四行 權限 int 4 使用者的權限 5 第一列第五行 姓名 char 50 帳號的中文姓名 6 第一列第六行郵件地址 char 50 帳號的 表 3.28 使用者資料庫記錄格式 檔案名稱 :addnews.aspx 紀錄格式 : 序號 欄位位置 欄位名稱資料型態 長度 附註 1 第一列第一行公告屬性 char 50 公告屬性 2 第二列第一行公告單位 char 50 發佈公告的單位 3 第三列第一行公告主旨 char 50 公告的主題 4 第四列第一行 類別 char 50 急件或普通 Yes = 使用 Html 5 第四列第七行文件類型 Boolean 格式,No = 一般 格式 6 第五列第一行公告內容 char 250 公告的詳細內容 74

83 7 第七列第一行公告日期 date 10 公告發表日 8 第七列第二行公告時間 time 10 發佈公告的時間 9 第八列第一行相關網址 char 30 相關參考網址 10 第九列第一行 聯絡人 char 50 聯絡人 11 第十列第一行電子郵件 char 20 連絡人電子郵件 第十一列第一行第十一列第二行 確認發佈 char 按鈕鏈結 清除內容 char 按鈕鏈結 表 3.29 新增公告介面記錄格式 75

84 (2) 修改本部門公告 a. 流程圖 userlogin.aspx shownews.aspx userpass.aspx updatanews.aspx Procedure 4.4 sqlmsg.aspx Users.sql News.sql 圖 3.25 各部門管理者修改本部門公告流程圖 b. 檔案描述 (a)updatanews.aspx: 新增修改各部門自身的公告事項, 一樣會先經過帳號權限認證後才能使用此功能 (b)sqlmsg.aspx: 資料庫訊息, 即對資料庫使用 SQL 指令做修改時, 系統會產生的反應訊息, 像是公告系統修改成功與否, 登入權限是否符合等等的訊息出現 (c)procedure 4.4: 將要修改的公告, 依照公告編號從資料庫讀取出來, 並加以修改, 改完後回存回資料庫, 並由 shownews.aspx 來顯示修改後的結果 76

85 c. 檔案記錄格式檔案名稱 :sqlmsg.aspx 紀錄格式 : 序號欄位位置欄位名稱資料型態長度附註 1 第一列第一行回首頁自動編號 10 鏈結 2 第一列第二行 回公告系 統 文字 10 鏈結 3 第二列第一行訊息顯示文字 50 資料庫處理狀況 回應的訊息顯示 表 3.30 公告系統資料庫訊息記錄格式 (3) 刪除本部門公告 a. 流程圖 userlogin.aspx shownews.aspx userpass.aspx deletenews.aspx Procedure 4.5 sqlmsg.aspx Users.sql News.sql 圖 3.26 各部門管理者刪除本部門公告流程圖 77

86 b. 檔案描述 (a)deletenews.aspx: 供各部門管理者刪除本部門的公告 (b)procedure 4.5: 一樣會先做帳號權限認證的動作, 若不符合權限資格, 會將頁面經由 sqlmsg.aspx 顯示訊息後自動轉回系統首頁, 即 News.aspx 若刪除成功, 則由 shownews.aspx 顯示刪除結果 78

87 3. 系統管理者 (1) 新增系統公告 a. 流程圖 userlogin.aspx shownews.aspx userpass.aspx addnews.aspx Procedure 4.6 News.aspx Users.sql News.sql 圖 3.27 系統管理者新增系統公告流程圖 b. 檔案描述 Procedure 4.6: 再次判斷是否為系統管理者, 確定後給予最大管理權限 ( 包含跨各部門的資料做異動 ) 來新增系統的公告事項, 或是系統的重大更新公告 79

88 (2) 修改公告 a. 流程圖 userlogin.aspx shownews.aspx userpass.aspx updatanews.aspx Procedure 4.7 sqlmsg.aspx Users.sql News.sql 圖 3.28 系統管理者修改系統公告流程圖 b. 檔案描述 Procedure 4.7: 再次判斷是否為系統管理者, 確定後給予最大管理權限 ( 包含對跨各部門的資料做處理 ) 來修改系統的公告事項, 或是合併相似的公告內容 80

89 (3) 刪除公告 a. 流程圖 userlogin.aspx shownews.aspx userpass.aspx deletenews.aspx Procedure 4.8 sqlmsg.aspx Users.sql News.sql 圖 3.29 系統管理者刪除系統公告流程圖 b. 檔案描述 Procedure 4.8: 再次判斷是否為系統管理者, 確定後給予最大管理權限 ( 包含跨各部門的資料做處理 ) 來刪除已經過期的公告事項 81

90 3.3.5 網站導覽 此網站的網站導覽, 提供全站連結的索引, 主要包括了以下功能 : 1. 站內收尋功能 : 輸入關鍵字, 依據 KEY 值收尋全網站所有網頁, 並將有包含關鍵字的頁面列出 2. 網站索引功能 : 將所有網頁的超連結列出, 並顯示出網站導覽的地圖 以下介紹網站導覽系統的功能 : 1. 站內網頁收尋功能 一個嚴謹的網站, 由 root ( 網站首頁 ) 開始往下分門別類的延伸, 因此我們可以建立一個針對網頁搜尋的資料庫, 將由 root 開始, 逐層搜尋網頁, 並將網頁的內容, 以使用者檔案物件的方式, 插入我們的資料庫內, 並建立文字索引, 以達到以關鍵字做查詢的功能 (1) 網頁收尋流程圖 Index.aspx Procedure 5.1 websearch.sql 圖 3.30 網頁收尋流程圖 82

91 (2) 檔案描述 a.index.aspx: 搜尋網頁, 使用者輸入關鍵字, 並在搜尋玩後於同一網頁上顯示結果 b.websearch.sql: 以使用者檔案物件的方式, 存取網頁的內容 c.procedure 5.1: 處理會員搜尋的程序, 依資料庫 websearch.sql, 並將所有包含關鍵字的頁面全列出來 (3) 檔案記錄格式 檔案名稱 :index.aspx 紀錄格式 : 序號 欄位位置 欄名 資料型態 長度 附註 1 第一列第一行 關鍵字 char 10 文字輸入 2 第一列第二行 搜尋 char 10 按鈕連結 表 3.31 搜尋網頁記錄格式 83

92 檔案名稱 :websearch.sql 紀錄格式 : 序號 欄名 資料型態 長度 附註 1 網頁名稱 char 10 主索引鍵 2 網址 char 路徑 char 50 4 記錄 char 10 表 3.32 網頁索引資料庫記錄格式 2. 網站索引功能 (1) 網站索引網頁流程圖 mapindex.aspx 圖 3.31 網站索引網頁 84

93 (2) 檔案記錄格式 檔案名稱 :mapindex.aspx 紀錄格式 : 序號 欄位位置 欄名 資料型態 長度 附註 1 第一列第一行 網頁介紹 char 8 2 第一列第二行茶葉知識教 char 8 育系統 3 第一列第三行會員管理系 char 8 統 4 第二列第一行 會員登入 char 8 按鈕連結 5 第二列第二行 會員註冊 char 8 按鈕連結 6 第二列第三行 會員修改 char 8 按鈕連結 7 第一列第四行茶葉健診系 char 8 統 8 第二列第四行 健診介紹 char 8 按鈕連結 9 第二列第五行 線上掛號單 char 8 10 第二列第六行 健診討論區 char 8 按鈕連結 11 第三列第一行 預約掛號 char 8 按鈕連結 12 第三列第二行 查詢掛號 char 8 按鈕連結 13 第三列第三行 取消掛號 char 8 按鈕連結 14 第一列第五行 課程系統 char 8 15 第二列第七行 課程介紹 char 8 按鈕連結 16 第二列第八行線上報名系 char 8 按鈕連結 統 85

94 17 第二列第九行課程討論區 char 8 按鈕連結 18 第一列第六行交易買賣系 char 8 統 19 第二列第十行產品介紹 char 8 按鈕連結 20 第二列第十一行線上交易訂 char 8 按鈕連結 購單 21 第二列第十二行買賣討論區 char 8 按鈕連結 22 第一列第七行網站導覽搜 char 8 尋系統 23 第二列十三行快速搜尋引 char 8 按鈕連結 擎 24 第二列第十四行 網站地圖 char 8 按鈕連結 25 第一列第八行 公告系統 char 8 26 第二列第十五行 瀏覽公告 char 8 按鈕連結 27 第三列第一行 預約掛號 char 8 按鈕連結 28 第三列第二行 查詢掛號 char 8 按鈕連結 29 第三列第三行 取消掛號 char 8 按鈕連結 表 3.33 索引網頁記錄格式 86

95 第四章系統建置 4.1 會員管理系統 有會員登入 會員註冊 會員密碼查詢以及管理員會員管理 1. 會員註冊 (1) 輸入畫面 圖 4.1 會員註冊 (2) 演算法 Key In 會員基本資料 Click 確定送出 { If(True) Then Display 會員註冊結果 { Click 確認資料無誤 { 87

96 Insert Into 會員資料表 } } Else Display 錯誤訊息 } (3) 輸出畫面 資料驗證通過後, 會再出現一次資料確認的動作 圖 4.2 會員註冊資料確認 88

97 圖 4.3 會員註冊資料驗證錯誤 89

98 2. 會員登入和密碼查詢 (1) 輸入畫面 圖 4.4 會員登入 圖 4.5 會員密碼查詢 90

99 (2) 演算法 Key In 帳號 密碼 Click 登入 { Check 帳號 密碼 { If(True) Then Session(username)= 帳號 End If } } Click 加入會員 { Display 會員註冊畫面 } Click 忘記密碼 { Display 查詢密碼畫面 } 91

100 (3) 輸出畫面 圖 4.6 會員密碼查詢結果 92

101 3. 管理員管理會員 (1) 輸入畫面只有站長級的權限才能開啟此功能, 除了砍帳號外, 站長可以任命哪些會員為管理員 圖 4.7 管理員管理會員 -1 (2) 演算法 Click 刪除 { Delete from 會員資料表 } Click{ Key In 欲更改資料 Click 更改 { 93

102 Update 會員資料表 } } (3) 輸出畫面 圖 4.8 管理員管理會員 -2 94

103 4.2 茶葉健診系統 主要分成三種權限的使用者來說明, 包含了一般使用者 最高管理員 一般區域健診中心管理員 1. 最高使用者 ( 站長 ) 主要的工作為新增 / 編輯健診中心, 管理會員等等, 而這些功能必須是站長級的使用者才能夠看的見 (1) 開啟站長級權限功能 a. 輸入畫面 圖 4.9 茶葉健診系統首頁 ( 非站長級權限登入 ) b. 演算法 Key In 帳號 密碼 95

104 Click 登入 { Check 使用者權限 { If ( 站長 ) Then 開啟隱藏按鈕 End If } } c. 輸出畫面 圖 4.10 茶葉健診系統首頁 ( 站長級權限登入 ) 96

105 (2) 新增健診中心 a. 輸入畫面 圖 4.11 站長新增健診中心介面 b. 演算法 Key In 健診中心資料 Click 確定新增 { If(True) Then Insert Into 健診中心資料表回到首頁 End If } Else 97

106 Display 錯誤訊息畫面 } c. 輸出畫面 圖 4.12 站長新增健診中心後結果 98

107 (3) 修改健診中心資料 a. 輸入畫面 圖 4.13 管理員編輯健診中心 -1 當站長按下某一區的編輯鈕, 會出現以下畫面 圖 4.14 站長編輯健診中心 -2 99

108 b. 演算法 Click 編輯 { Display 健診中心修改畫面 { Key In 健診中心修改過的內容 Click 確定新增 { If(True) Then Updtae 健診中心資料表回到首頁 End If } Click 刪除健診中心 { Delete From 健診中心資料表 } } } 100

109 c. 輸出畫面 原本台中地區改為修改後的台中地區 圖 4.15 管理員編輯健診中心輸出結果 101

110 2. 區域健診中心管理員主要工作為瀏覽並處理各區域掛號單, 當會員預約掛號後, 管理員確認掛號單時間以及內容後, 並回覆此掛號單表示處理過 (1) 瀏覽各區掛號單 a. 輸入畫面目前下面北區健診中心有 6 個掛號單, 並且是未處理狀態 圖 4.16 茶葉健診系統首頁 ( 一般管理者登入 ) b. 演算法 Click 健診中心 { Check 使用者權限 { If ( 站長 And 管理員 ) Then 列出所有會員的掛號單 102

111 End If } } c. 輸出畫面 系統判斷權限後, 區域中心的管理員能查詢到全部的掛號 單, 並且事後一一處理之 圖 4.17 掛號單列表 ( 管理者登入 ) 103

112 (2) 處理各區掛號單 a. 輸入畫面 在掛號單列表點選每一篇的健診序號, 就能進入此畫面 圖 4.18 管理員處理掛號單 -1 管理員按下管理員回復會出現下面的畫面 : 圖 4.19 管理員處理掛號單

113 b. 演算法 Key In 掛號單處理內容 Click 處理完畢 { If(True) Then Update 處理回覆表回到掛號單列表 End IF } c. 輸出畫面 當管理員回復處理完後, 表格上的管理員處理會變成 1, 代表管理員 已經看過並確認 圖 4.20 掛號單列表 ( 管理員處理完畢 ) 105

114 3. 一般使用者 (1) 瀏覽掛號單分為已經預約過掛號單和沒預約過的畫面 a. 輸入畫面下面是會員尚未預約過任何掛號, 所以進入區域健診中心是一片空白 圖 4.21 掛號單列表 ( 一般會員尚未預約過 ) 106

115 下面是此會員之前已經有預約過掛號單, 為帳號 us123 所預約的兩張 掛號單, 而健診序號不是一定是相鄰, 下面代表有人已經預約 的序號了 圖 4.22 掛號單列表 ( 一般會員已經預約過 ) 107

116 一般會員在掛號單列表按下我要預約健診後出現的畫面 圖 4.23 掛號單填寫內容 b. 演算法 Click 我要預約掛號 { Display 填寫掛號單內容 { Click 查詢可預約時間 { Display 可預約時間表 { Choice 一個時段 And Click It{ 預約時間 == 選取時段 } } } 108

117 Key In 茶葉症狀描述 Click 確定預約 { IF(( 預約時間 And 內容描述 )is True) Then Update 掛號單內容資料表回到掛號單列表 Else Display 錯誤訊息 End IF } } 109

118 c. 輸出畫面 在填寫掛號單內容時必須先查詢可預約時段並選擇一個時 段才能繼續填寫, 以下是按下查詢可預約時段出現的畫面 圖 4.24 查詢並選擇預約時段 110

119 當時段選擇 2004/4/26, 健診時間會自動加入所選取的時段 圖 4.25 選擇預約時段後之掛號單填寫內容 帳號 Test1 掛號完畢結果會出現在掛號單列表上 111

120 (3) 刪除掛號單 a. 輸入畫面會員只能對掛號單做出刪除的工作而無法修改內容, 是為了確保管理員處理後的便利性 圖 4.26 會員刪除預約掛號單 b. 演算法 Click 確定刪除 { Delete from 掛號單內容資料表回到掛號單列表 } c. 輸出畫面 為掛號單列表 112

121 4.3 茶葉交易系統 以下分別介紹本系統中主管理員 訂單管理員 客戶 ( 一般使用者 ) 和庫存管理員於其職責中, 使用系統的步驟 1. 主管理員主要的工作為新增或編輯上市茶葉資料, 這位主管理員是唯一的, 他還有任命訂單管理員和庫存管理員的權限 (1) 開啟主管理員權限功能 a. 輸入畫面 圖 4.27 一般使用者登入介面 113

122 b. 演算法 Key In 帳號 密碼 Click 登入 { Check 使用者權限 { If ( 站長 ) Then 開啟隱藏按鈕 End If } } c. 輸出畫面 圖 4.28 主管理員登入後操作介面 114

123 (2) 新增上市茶葉資料 a. 輸入畫面 圖 4.29 主管理員新增產品資料 b. 演算法 Key In 產品資料 Click 產品登錄 { If(True) Then Insert Into 產品資料表回到商品管理 End If } Else 115

124 Display 錯誤訊息畫面 } c. 輸出畫面 圖 4.30 新增產品資料後結果 116

125 (2) 編輯上市茶葉資料 a. 輸入畫面 : 由圖 4.26, 當主管理員按下某一產品的編輯鈕 : 圖 4.31 主管理員編輯產品資料 b. 演算法 : Click 編輯 { Display 產品修改畫面 { Key In 產品修改過的內容 Click 確定修改 { If(True) Then Updtae 產品資料表回到商品管理 117

126 End If } Click 刪除產品資料 { Delete From 產品資料表 } } } c. 輸出畫面 原產品名稱烏龍茶已改為修改後的烏龍茶 圖 4.32 主管理員修改後輸出結果 118

127 (3) 任免訂單管理員 a. 輸入畫面 圖 4.33 主管理員任免訂單管理員操作介面

128 當主管理員按下任一會員的編輯鈕 圖 4.34 主管理員任免訂單管理員操作介面 -2 b. 演算法 Click 編輯 { Display 會員修改畫面 { Key In 會員修改過的權限 Click 確定修改 { If(True) Then Updtae 會員資料表回到會員管理 End If } 120

129 } Click 刪除會員資料 { Delete From 會員資料表 } } c. 輸出畫面 ID 為 Alice 的會員已從一般使用者升級為訂購管理者 圖 4.35 訂單管理員任用後結果 121

130 2. 訂單管理員其工作為會員訂單管理, 顯示所有接獲訂單, 可以根據處理情況給予處理訂單和完成交易的標誌, 如此不僅讓客戶知道訂單的處理情形, 也方便訂單管理員間不致於處理相同一份訂單 (1) 開啟訂單管理員權限功能 a. 輸入畫面 : 如圖 4.27 所示 b. 輸出畫面 : 如圖 4.28 所示 (2) 處理會員訂購單 a. 輸入畫面 圖 4.36 訂單管理員處理訂單操作介面

131 b. 演算法 Click 處理訂單 { If(True) Then Update 訂單資料表回到訂購單處理列表 End IF } c. 輸出畫面 當訂單管理員按下處理訂單按鈕後, 訂購狀態顯示為處理中 圖 4.37 訂單管理員處理訂單操作介面

132 3. 客戶 ( 一般使用者 ) 主要服務有 : 線上瀏覽產品並下單, 由購物車自動計算折扣後總價格, 在客戶下單確認後, 系統自動寄出電子郵件訂購單的詳細內容, 並提醒交易時間及地點, 在訂購單未處理前, 系統顯示一個該使用者的訂購單內容, 使用者可以在訂單管理員處理前刪除訂單資料 (1) 瀏覽並下單 a. 輸入畫面 圖 4.38 所有產品顯示列表 124

133 在想要購買的產品上按鈕後 圖 4.39 目標產品詳細資料 b. 演算法 : Click 放入訂購單 { If(True) Then Update 訂單資料表 Else 錯誤訊息回到會員訂單列表 End IF } 125

134 c. 輸出畫面 在看完詳細敘述和折扣計算價後點選放入訂購單 圖 4.40 該名會員的一筆訂購資料送出結果 (2) 會員刪除訂購單 a. 輸入畫面如圖 4.36, 在訂單管理員處理前, 客戶可以看到自己所下的任何一筆訂單資料 126

135 b. 演算法 If( 處理訂單 =TRUE) { 不顯示該筆資料 ELSE IF(Click 刪除 ) { Delete from 客戶訂購單資料表回到客戶訂購單列表 } } c. 輸出畫面一旦使用者按下刪除鈕後, 該筆訂單資料自動消失, 而訂單管理員也將不會看到這筆已消除的訂單 圖 4.41 該名會員的一筆訂購資料刪除結果 127

136 4. 庫存管理員其工作為在實際與客戶交易後, 到訂單管理系統進行完成交易並列出訂單歷史紀錄 (1) 進行完成交易手續 a. 輸入畫面如圖 4.33 所示 b. 演算法 Click 完成交易 { If(True) Then Update 訂單資料表回到訂購單處理列表 End IF } 128

137 c. 輸出畫面 在庫存管理員按下完成交易鈕後, 該筆訂單資料便傳送到訂 單歷史紀錄, 表示所有交易過程圓滿達成 圖 4.42 完成交易後的訂單歷史紀錄報表 129

138 4.4 公告系統 理想是分成三種權限的使用者來說明, 包含了一般使用者, 各部門管理者, 和系統管理者, 其中系統管理者能管理各部門管理者, 各部門管理者只能管理本身部門的公告系統, 不能異動到其他部門的公告資料 ; 而一般使用者只有瀏覽公告的功能可使用 但是那是 " 理想 ", 因為時間跟能力上的限制, 我們祇做出公告系統管理者跟一般使用者的操作介面模式而已 以下是對這兩種介面模式的描述, 以及演算法的表示部分加以解說 : 1. 系統管理者主要的工作為, 編輯公告系統, 管理全部公告等等, 而這些功能必須是站長級的使用者才能夠看的見 主要工作為管理公告事項, 發布最新消息, 能新增 修改, 和刪除公告內容, 並提供相關網址以及電子郵件等的聯絡方式, 讓一般使用者和各部門間能產生良好的互動關係 130

139 (1) 管理者登入 a. 輸入畫面 圖 4.43 公告系統首頁 ( 非站長級權限登入畫面 ) b. 演算法 Click 登入系統 { Key In 帳號 密碼 Click 登入 { Check 使用者權限 { If 權限 > 3 Then 開啟隱藏按鈕 Else 返回首頁 End If 131

140 } } } c. 輸出畫面 按下 " 登入系統 " 按鈕後頁面左上方按鈕之顯示畫面 : 圖 4.44 茶葉健診中心公告系統首頁 ( 站長級權限登入 ) 132

141 (2) 新增系統公告 a. 按下 " 發布公告 " 按鈕後的畫面 圖 4.45 發布新公告系統頁面 圖 4.46 新增公告之範例輸入畫面 133

142 權限不足所顯示之錯誤訊息畫面 圖 4.47 發布公告權限不足之錯誤訊息頁面 b. 演算法 Click 發布公告 { 驗證使用者權限 If 權限 > = 3 Then ( 為系統管理者 ){ 可發布系統公告 Else 顯示錯誤訊息頁面 End If } Key In 公告系統的公告資料 Click 確定新增 { 134

143 If (True) Then If 驗證資料欄位格式是否正確 & 必填欄位是否填寫 Then Insert Into 公告資料表 Else Display 各欄位驗證錯誤訊息 End If Else 回到新增公告頁面 } } c. 輸出畫面 圖 4.48 新增公告成功的訊息畫面 135

144 (3) 修改公告資料 a. 輸入畫面 進入 " 修改模式 ", 並要求點選所要修改的公告 圖 4.49 修改公告畫面 -1 圖 4.50 修改公告畫面

145 b. 演算法 Click 修改模式 { ( 驗證權限 ) If 權限 > = 3 Then ( 為系統管理者 ) 可修改全部系統公告 Else 顯示錯誤訊息頁面 End If Display 公告系統修改畫面 { Key In 修改已發布的公告內容 Click 修改 { If (True) Then Update 公告資料表顯示更新後的公告畫面 End If } } } 137

146 c. 輸出畫面 修改公告後畫面 圖 4.51 管理員修改公告輸出結果 138

147 (3) 刪除公告資料 a. 輸入畫面 圖 4.52 系統管理者刪除公告畫面 -1 圖 4.53 系統管理者刪除公告畫面

148 b. 演算法 Click 刪除模式 { ( 驗證權限 ) If 權限 > = 3 Then ( 為系統管理者 ) } End If Display 公告系統刪除畫面 { Click 刪除 { If (True) Then Delete From 公告資料表顯示更新後的公告畫面 End If } } } 140

149 c. 輸出畫面 圖 4.54 刪除公告後返回公告首頁 141

150 3. 一般使用者 (1) 瀏覽公告 a. 瀏覽公告頁面 ( 即公告首頁 ) 圖 4.55 公告系統主瀏覽頁面 ( 一般會員所示 ) 也可由 " 選擇檢視模式 " 的下拉式選單來顯示瀏覽方式 b. 演算法 Selected 檢視模式 { Case1 option = 今日公告 value='today' 顯示今日公告頁面 Case2 option = 急件公告 value='urgent' 142

151 顯示急件公告頁面 Case3 option = 普通公告 value='common' 顯示普通公告頁面 Case4 option = 所有公告 value='usual' 顯示所有公告頁面 Case5 option = 快速跳頁 value='pageno' 顯示所屬頁數頁面 } c. 輸出畫面 (a) 選擇 " 今日公告 " 畫面 圖 4.56 選擇今日公告 143

152 圖 4.57 今日公告顯示畫面 (b) 選擇 " 急件公告 " 畫面 圖 4.58 選擇急件公告 144

153 圖 4.59 急件公告顯示畫面 (c) 選擇 " 普通公告 " 畫面 圖 4.60 選擇普通公告 145

154 圖 4.61 普通公告顯示畫面 (d) 選擇 " 所有公告 " 畫面 圖 4.62 所有公告顯示畫面 146

155 (e) 分頁瀏覽 即選擇想要瀏覽的頁數來瀏覽那一頁數的頁面上的公告 主旨 圖 4.63 選擇頁數顯示畫面 147

156 圖 4.64 跳頁結果顯示畫面 148

157 (2) 查詢公告可讓使用者設定搜尋關鍵字, 來搜尋公告內容或是公告主題, 藉此方式來瀏覽所需要閱覽的公告資訊 a. 輸入畫面 圖 4.65 輸入關鍵字查尋顯示畫面 b. 演算法 Click Search 檢索公告主旨按鈕 { searchkey = newssearch.text If Not pagemode( 頁面模式 ) = "usual( 所有公告 )" then 開始在公告資料表做檢視動作 Else 回到首頁 149

158 End If } c. 輸出畫面 圖 4.66 查尋結果顯示畫面 150

159 4.5 網頁導覽搜尋系統 主要分成了兩個部分, 一為網頁索引, 一為搜尋網頁功能 1. 網頁索引主要功能為讓第一次進入此網頁的使用者了解網站的功能與大概能一目了然所有的連結與功能 (1) 索引網頁 a. 輸入畫面由網頁導覽搜尋首頁連結進入網頁索引頁面, 在索引頁面的超連結有分權限與非權限, 如果未登入的話有權限的連結無法進入 圖 4.67 網頁導覽搜尋系統首頁 151

160 圖 4.68 網頁索引主頁 b. 演算法 Key In 帳號 密碼 Click 登入 { If ( 正確 ) Then 進入頁面 End If } } 152

161 c. 輸出畫面如果未登入點選要權限的超連結會要求登入, 進入登入畫面在進入前登入便可直接連進網頁, 而輸出畫面為各子系統登入後的畫面 (1) 搜尋網頁 a. 輸入畫面此網頁為搜尋系統, 依據輸入欲搜尋 key 值從網頁之標頭 (Header) 標題或有出現關鍵字的網頁皆會列表, 使用者便可透過搜尋直接尋找資料 圖 4.69 收尋網頁首頁 153

162 b. 演算法 Key In 欲查詢的關鍵字 Click 查詢 { From(websearch 中的第一筆資料 )to( 最後一筆 ) if( 關鍵字 ==searchtext) Then 列出網頁的標頭 } End If c. 輸出畫面 列出結果 圖 4.70 收尋資料結果 154

163 第五章系統評估 5.1 會員管理系統 管理者方面主要工作是管理每個會員的狀況, 如果會員有不好的行為, 管理員可刪除帳號 一般會員方面, 能做會員資料異動 優點 : 1. 因為網站大部分的服務都必須是會員的權限才能進行使用, 所以在管理上比較有制度 2. 嚴格的資料驗證, 讓日後會員使用各項服務不需在填寫繁瑣的資料 缺點 : 1. 目前未提供給會員個人化介面, 未來會做到讓使用者能有自己風格化的會員介面 2. 對於管理者管理會員的功能做的很簡陋, 目前只能修改會員的權限和刪除帳號, 未來希望可以多加一些警告會員或是送訊息給會員的機制 3. 必須加入會員才能使用某些機制, 一開始會讓使用者覺得繁雜 4. 關於使用者查詢密碼方面, 目前用採用 重新送密碼, 此與可能會讓使用者覺得麻煩, 所以日後採用輸入身分證字號 帳號 的方式直接取得舊密碼 155

164 5.2 茶葉健診系統 目前網路唯一茶葉預約健診服務, 此乃首創, 雖然功能做的不完善, 但是基本服務精神與理念都做到了 優點 : 1. 簡單的掛號機制, 讓使用者用起來順手 2. 健診民眾除了可以描述茶葉的症狀外, 還可以自行拍照將茶葉的照片上傳, 讓茶大夫能先了解茶葉的種類, 日後方便健診 3. 提供管理員制度, 各區都指派一個管理員去處理掛號單, 處理效率較好 缺點 : 1. 目前茶大夫瀏覽掛號單的功能尚未做出, 未來會陸續改善 2. 掛號單的處理方式也是滿不好的, 適用管理者回覆的方式去做, 未來會改成按鈕點擊的方式來處理 3. 健診掛號序號機制不完善, 未來是希望每個可健診的時段的掛號序號都區分開來, 並且在每一天的晚上 12 點一過, 掛號序號會自動歸零 4. 介面過簡陋, 未來會加以美化 5. 會員掛號後, 如果管理員已經處理好掛號單, 會員又把將掛號單刪除, 讓茶大夫的時間行程受到影響, 這點我們還在評估最佳處理方式 6. 雖然老師在各地方都有分區, 但是目前健診老師只有李老師一個人, 所以目前會員需要預約健診只能健診中部地區中心 156

165 5.3 茶葉交易系統 本系統提供使用者一個方便的購物介面, 並自動計算折扣後的總金額, 再以電子郵件傳訊給客戶詳細的訂單內容 優點 : 1. 方便的訂單管理員任免機制, 即使主管理員與任免對象分隔兩地, 也可以即時將其權限作適當調整 2. 方便的購物車及折扣後總價自動計算 3. 客戶在訂單雖送出但訂單管理員未處理前可以取消訂單, 對於客戶與公司出貨部門都相當有利 4. 提供訂單歷史紀錄報表, 方便日後任何與交易帳目或統計的相關作業 5. 自動回覆訂單處理情況給客戶, 隨時掌握與客戶的互動 6. 區分最新產品 本店專屬特色茶和本季上市新茶的展示及連結 7. 提供產品的排序和搜尋功能, 使客戶有效的在眾多產品中作選擇 8. 提供各項產品銷售統計數據 缺點 : 1. 訂單處理模式和完成交易的手續不夠嚴謹 2. 訂單管理員與庫存管理員使用同一管理介面, 結構太鬆散 3. 訂購多種產品必須下多筆訂單, 造成客戶的不便 4. 未來交易市場擴大時, 目前各個訂單管理員不分區的設計是一大隱憂 5. 尚未做好信用卡交易機制, 只能使用較傳統的交易方式 6. 管理員與一般使用者間雖有權限的區分, 但操作的介面尚未完全隔開 157

166 5.4 茶葉公告系統 主要是用來作為各個相關部門的公佈欄之用, 以了解各分部的最新消息 異動狀態公告, 以及重要事項的提醒和連絡之用 優點 : 1. 讓使用者能從公告欄中能快速了解健診中心的最新消息 2. 由相關網站介紹的公告訊息中得到豐富茶葉知識的吸收 3. 藉由公告欄所公佈的新訊息和連絡方式, 建立會員和健診中心的良好互動關係 缺點 : 1. 因為是採用鏈結方式, 多數人會沒注意而忽略去瀏覽 2. 應該採用跑馬燈方式, 在各頁面放置相關公告與相關鏈結, 方便使用者觀看及注意 3. 目前因技術不足, 尚無法實做出系統管理者與部門管理者兩者間的權限與功能的劃分, 因此安全性上與系統管理方面有很顯著的缺失 158

167 5.5 網站導覽系統 此網站的網站導覽, 提供全站連結的索引, 包括站內收尋功能 優點 : 1. 可以使使用者更快熟悉認識這個網站, 就算是第一次進此網頁也可以快速上手 2. 如果想要做任何的網站服務都可以由索引快速的連結到想要的網頁 3. 使用者想要的資料可以更快取得 4. 降低找不到欲查詢的資料的機會, 並更容易獲得額外的資訊 缺點 : 1. 使用者連結時可能因為第一次上來很多連就因為沒有權限都不能進入 2. 管理者不能以索引進入隱藏按鈕的部分 159

168 6.1 組員心得 施星宇的心得 第六章結論 此次的專題, 其實只是個臨時組成的雜牌軍, 我原本專題是跟別人一起合作, 但是因為某些原因導致拆組 那時後拆組的事已經是二月初頭, 別人已經都做完準備研究所考試的時候, 我還在擔心我的專題要找誰做, 後來遇到馬嘉鍵同學, 剛好他們組只有二個人, 也還沒開始做, 剛好也是做電子商務的部份, 經過跟他們溝通後, 他們也答應讓我跟他們一起做專題, 一開始當我聽到他們是要做茶葉健診的網頁, 我那時心裡都在懷疑這到底可不可行, 但是經過後來跟李案嘉老師接觸過才對此題目慢慢有了興趣, 並決心要把它做好, 但是那時後還是對 ASP.NET 不熟, 所以有很長一段時間我把準備研究所的事情擱下來, 認真的去研究這個開發網頁的技術 至於為什麼說是雜牌軍呢? 說來慚愧 原本馬嘉鍵是一個人一組, 後來收留了被拆組的黃川溢同學, 而之後又收留了被拆組的我, 後來二月底謝信芳老師也推薦一名學姐幫助我們開發專案, 從原本的一人專題變成四個人, 所以要做的規模是越做越大, 雖然跟當初想像的不太一樣, 但是後來看到自己完成的系統, 心理面的歡喜真是說不出來啊! 這次我負責開發的是中心的部份 茶葉健診系統, 之前跟馬嘉鍵同學一直商討這個系統要如何去做, 雖然最後終於完成了, 不過有得必有失, 為了做專題導致我的研究所課業無法專心準備, 這大概是我大學裡最遺憾的一件事情吧! 我們的系統開發只算是各 beta 版本, 我和馬嘉鍵同學討論過, 專 160

169 題發表過後還是會把系統開發的更完美, 畢竟這是要上市的網頁, 不能草草暸之, 而且繼續開發的話, 更能增強我們的功力 最後希望給很多人建議, 要準備研究所的話, 專題最好在上學期就發表完, 以免像我一樣啊 馬嘉鍵的心得 自從跟隨李案嘉老師學了一陣子茶藝課程後, 對於老師對茶的熱愛以及他對台灣茶葉市場的亂像深有同感, 去年聽到老師講解茶葉健診的新構想, 起初頗不以為意, 然而在茶葉市場逛久後, 不得不佩服老師的專業能力和先見之明, 所以毅然決然的接下這套網站茶葉健診系統的開發, 另外附加茶葉交易系統, 這也是我主要負責的部分, 起初只有我一個人接下整個專案, 後來找了一位因組員離開學校而沒有組員的同學, 之後又在寒假時接納一位被組員除名的同學, 最後在 3 月中因為謝信芳老師的安排, 最後一位組員加入了本專案的開發行列, 幾經波折後, 我們又多次拜訪李老師, 並且作了許多需求調查, 也深刻體會到軟體開發過程中, 每個流程的重要性, 因為它們都會影響到日後的使用者滿意度及系統維護, 直到接了這次真實的專案後, 我終於體會到, 即使是重視專業能力的軟體開發, 工作態度和協調能力都是不可或缺的, 也許我們可以透過不斷的學習來強化自己的專業知識, 但是如果這伴隨而來的是自我觀念的膨脹或是不負責任的態度, 那麼所獲得的所有知識都不能夠對自己未來不論在職場或生活上有所助益 確實, 我們可能因為專業能力的不足而喪失職場的競爭力, 但是如果沒有學習與人溝通協調和認真負責的態度, 那麼各行各業都將無容身之地, 我想這一點是最重要而在教育訓練上卻極其匱乏, 值得深思的觀念 161

170 6.1.3 譚哲慧的心得 這次的系統公告頁面是用 DREAMWEAVER MX 2004 來做頁面編輯的主要工具, 也因此學習了 DREAMWEAVER MX 2004 的使用方法, 他跟之前的版本比較活用, 多了不少實用功能和更多的整合, 更多了一些新的模組, 甚至開放讓人去設計各種不同的方便性模組來讓大家使用, 以及經由 Macromedia Extension Manager 來整合管理這些外掛模組 2004 版的 DREAMWEAVER MX 對前端程式介面大多都能整合, 像是 ASP.NET PHP SQL 等的, 並且還能直接對程式碼做編輯 修改的動作, 能及時的預覽 除錯 ; 另外當然更包括對他自家產品 - Macromedia 系列的相互應用, 所以很容易能立即嵌入 FLASH FIREWORKS 等的多媒體檔, 還能直接呼叫它們來做編輯修改, 不需要再另外自己去開啟相關應用程式, 尤其是 FIREWORKS, 對 PNG 檔的圖層編輯算是蠻不錯的, 很適合用來編輯網頁頁面的圖層, 能讓頁面看起來更鮮活 還有, 前面有提過 Extension, 他其實是很多好心人將用過且功能不錯的 DERAMWEAVER 的 BEHEAVER, 加以包裝, 讓更多人能分享這樣一個不錯的套件 這次試用過的有 CDOmail: 讓系統自動寄出 跟 AUTO Hyperlink: 能自動辨別資料庫的欄位內容的類型, 將電子郵件跟網址格式的資料自動加入超鏈結, 都是蠻好用的套件, 可見的 DREAMWEAVER 的應用越來越靈活了 另外這次也學習到一些如何用 ASP.NET 去編寫一個網站, 剛開始就連能否讓 IIS 跑起來都蠻複雜的, 幾經波則後, 終於克服這種困難, 到後來的能讓整個頁面能執行, DREAMWEAVER 製作的.ASPX 頁面也得以順利的預覽, 算是一個蠻不錯的學習經驗 162

171 6.1.4 黃川溢的心得 我們這次做的電子商務系統, 是一個以服務性質為主的網站, 我本身是負責美工收集製作和網頁導覽系統的部分 ; 經過了這段時間的專題參與製作, 我發覺專題是一個大家共同合作的努力目標, 如果沒能跟上腳步, 就很容易做不出期望中的成品, 我總覺得, 這比平時的學校課業更需要用心去做與經營, 我本身所做的部分, 比較偏向排版和美工為主, 本身投注於收集資料的時間與學習一些像 Firework, Dreamwaver, Photoshop 等影像網頁處理網頁設計的軟體的時間 很多, 技術性偏向的主要是網頁搜尋的功能, 但由於市面上的網頁搜尋系統功能都十分強大, 像 php+mysql 在 linux 介面下也有方便又功能強的的網頁搜尋軟體 WBmaker, 相較之下便做的很無力, 但我本身做的部分在難度技術性上還不是很高, 但在經過這次專題製作的過程中深深的發現, 與組員工作夥伴的互動十分重要, 並且在這個專題完成以後, 希望還可以將電子商務的資料庫系統學的更精熟, 一方面也期望自己能在系統分析上有更進一步的程度提升 6.2 未來展望 這個系統原本預計還有線上報名和討論版的功能, 但是因為時間及人力上的限制無法此時完工, 這個工作將會在下一代系統的改良上一併完成, 事實上, 為因應與日俱增的客戶訂購及掛號單, 討論版和第二代的訂購和健診系統必將應運而生, 屆時我們也將依據各系統管理員和使用者的意見再做多次調整, 以使得這個全方位的茶葉網站和李案嘉老師的實際事業體達成最適當的互動模式, 如此不僅全體組員獲得無上的成就感, 也不辜負李案嘉老師的苦心栽培 163

172 參考資料 - 茶葉部份 - 1. 中國名茶全球資訊, 2. 茶顛話茶, 3. 行政院農業委員會茶業改良場, 4. 中国文艺, 5. 中國的茶文化, 6. 茶的歷史, 7. 好茶好站, - 程式與美工部分 - 1. 吳目誠,Deamweaver MX 2004 資料庫網頁製作中文版, pp , 網奕書局,Jan 黃世揚, 吳明哲, 曹祖聖,Asp.net 實戰 for VB.net,pp 松崗出版社,Dec 陳會安,ASP.NET 網頁製作徹底研究,pp , 旗標出版社, Oct 黃敬仁, 系統分析,pp , 碁峰資訊,Feb 楊先民,SQL Server 2000 範例教本, 學貫行銷, Gary B. Shelly,Thomas J.Cashman,Harry J.Rosenblatt, Systems Analysis and Design fifth edition,pp ,thomson 7. 資訊系統分析與設計, 8..NET 國際中文電子版, 164

173 附錄 - 與李案嘉老師訪談內容 ( 李案嘉老師以下簡稱李 ) 1. 請問李老師為什麼會想從事關於茶葉健診的行業? 李 : 父親愛茶種了五畝地的茶, 基於父親愛茶的機緣對茶深入研究, 後來自己也愛上茶的文化與這份茶的事業, 但我認為做茶的事業最重要的是信譽, 而要做好信譽最重要的是產品規格化, 但茶的規格化十分困難, 因為縱使同一種茶, 不同的地方出產, 味道也不盡相同, 規格化唯一的辦法就是把茶分級, 把各地的茶依品質做分類, 同一等級的茶放在同一堆, 即併堆 如此, 雖然做到規格化, 但茶的品質也受影響, 雖然利於銷售, 但我對於銷售的理念並不是如此, 我對自己茶的品質十分的要求, 此外, 我非常重視茶的售後服務, 如果茶有任何問題甚至到家服務都可以 2. 茶葉為什麼要健診? 李 : 如果不是喜歡的茶, 泡的次數自然就少, 泡的次數少影響到儲存的方式, 儲存的過程如果沒有好的概念和知識, 儲存的過程便會出問題, 因為儲存不當, 好茶也會變成不好的茶, 本來喝茶對身體好, 但喝到不好的茶對身體反而造成負面的影響, 茶葉健診當初的的, 就是希望大家不要喝到不好的茶進而對身體產生不好的影響, 老師希望以免費服務大眾的理念來預防大家因為喝到不好的茶而影響身體 165

174 3. 請問李老師怎麼去評判茶是好是壞, 怎麼做健診? 李 : 我用過去到現在所學的茶知識, 與所有經驗來貢獻於茶葉品質上好壞的評判, 並用自己的身體來做實驗, 對於哪些茶對身體有什麼好處, 或喝了品質差的茶對身體有什麼壞處, 除了我自己本身, 週遭的客戶朋友對於喝茶身體與體質上的改變也都使我對於茶好壞的健診有了最好的評判 4. 健診是由李老師一個人來執行嗎? 健診服務的對象只有在台中嗎? 李 : 我自己的學員都可以到家服務, 以義工的心態來教育消費者與學員, 而且也希望學員以義工的心態來為大眾服務, 所以希望可以做個服務性的茶葉健診的網站, 身體例行如此才能號昭一群想為愛茶人服務的義工來為大家貢獻, 像現在我本身在各地開課, 在各地也會植入一些新的學員與愛茶人出來, 之後經過我給他們做學術性的鑑定到一個階段之後, 能力已得到我的認可, 可以問題一些處理了, 這樣各地的網站網友茶葉遇到問題, 都可以由當地的學員來做健診, 也可以郵寄的方式來做健診 ( 當然以面對面最好 ) 然後我希望以醫院的掛號系統來處理健診系統, 像初診要填客戶基本資料, 複診就不用, 如果有一些特殊或常見的案例都可以放到網站上, 這樣便可以服務遍全國 166

175 5. 李老師為什麼這麼重視茶葉健診的義工服務? 李 : 喝茶本身有氧活化細胞的功效能養顏美容, 幫助五臟六腑做新陳代謝, 而且古人說每天開門七件事," 柴米油鹽醬醋茶 ", 所以既然茶是古人所注重的七件事, 所以很希望可以把茶的領域帶到社會與大家的生活裡 6. 李老師對網站功能與風格的期許? 李 : 創新風格卻帶有文化的味道, 開放性 中國風, 保守中帶有開放的感覺, 活的網站, 新的東西不斷的更新 豐富, 但不要做成封閉性的網站, 不只是讓別人上來找資料, 查資料, 有任何的事務都可以在上面互相討論, 互相學習, 也可以公佈訊息與學術性的交流, 但嚴禁批鬥, 我不希望在網站上的人們討論變成爭吵 7. 李老師對茶葉健診理念與網路化的目標? 李 : 我的理念 " 己利利人, 己達達人 " 希望能夠藉著科技的力量, 能把茶葉健診的好處擴大到更多的人受益, 老師把把茶葉的健診處理服務就像替病人醫病一樣, 為了使喝茶的人都能喝到好茶, 一方面覺得茶走味的可以把茶拿來健診, 並做可行的補救, 把茶當作病人一樣的照顧醫治, 一方面提供大家茶的知識, 避免大家買到壞茶, 也更懂得品嚐好茶, 並且一切以服務大家為原則, 而不是一般的商業手段 167

176 8. 李老師對於如果健診以後顧客對於茶的要求變高, 會不會對同行的競爭造成影響? 李 : 茶葉健診的目的, 本意是希望喝茶的人對於茶的任何疑難雜症都能有個解答的地方, 進一步的能使大家都能喝好茶, 並有品茶好茶的能力, 本身對同行之間可能會造成壓力, 但這是為了使茶行本身的素質增加, 因為客戶知道自己所購買的怎樣的茶, 茶行老闆想以壞茶欺騙顧客就更難了, 所以這樣的良性競爭受惠者是大眾, 如此達到服務的性質, 本是茶葉健診的目的 9. 請問李老師茶的製作流程是如何? 李 : 依我們台灣最特色半發酵茶的做法 : 從樹上採下來一心兩葉經過日光萎凋, 室內萎凋, 所謂的靜置攪拌到最後發酵, 然後殺菁 揉捻 製造成半球形... 不外乎每個環節接很重要所以溫溼度的控制與走水度的快慢皆會影響一泡茶的好壞 10. 醫學報導說吃西藥不適宜喝茶那吃中醫有這個顧忌嗎? 李 : 生病時要吃藥, 所以是情非得以的狀況才要吃藥, 吃藥是以毒攻毒的方法, 吃對了藥是良藥吃錯了反而是毒藥, 而茶是解毒的藥材, 過去神農嚐百草, 遇七十二毒以茶解之, 而今天吃藥是以毒攻毒, 所以喝茶會減低藥性, 當然包括吃中西藥皆不宜喝茶 168