崑 山 科 技 大 學

資訊工程系

專題製作報告

餐飲訂購系統

FOOD AND BEVERAGE MANAGEMENT SYSTEM

學 生：4970E009 林淵博

4970E012 袁竹緯

4970E044 高佑霖

4970E088 劉德寬

指導老師：李宗儒

中華民國100年6月

餐飲訂購系統

FOOD AND BEVERAGE MANAGEMENT SYSTEM

學 生：林淵博、袁竹緯、高佑霖、劉德寬

Student:Lin Yuan-Bo、Yuan Jhu-Wei、 Gao You-Lin、Liu Te-Kuan

指導老師：李宗儒 Advisor: Lee Michael

崑山科技大學

資訊工程系

專題報告

A Report Submitted to Department of Information Engineering

Kun Shan University in Partial Fulfillment of the Requirements

for the Degree of Bachelor in

Information Engineering June 2012

Tainan, Taiwan, Republic of China

中華民國 100 年 6 月

i

█

ii

餐飲訂購系統

學生：林淵博、袁竹緯、高佑霖、劉德寬 指導老師：李宗儒

崑山科技大學資訊工程系

摘 要

網際網路的發展，改變了許多消費者的消費模式，亦帶動了許多商機，從以往

只能親自前往店家購物，至今已可以在家動動手指，利用電腦網路購買自己想要的

商品。但許多的餐飲業雖然會利用網路行銷、廣告，但多數仍未利用網路的便利性，

來取代以往要利用電話訂購外送較為不便的模式，同時消費者也無法充分地了解所

需的等待時間。

本研究的主要目的，在於結合網路、資料庫、程式語言和智慧型手機，架構與

建立一個電子化的訂購系統，讓使用者能夠更加便利、迅速、機動地的進行消費行

為，且取得更多傳統模式上無法取得的資訊，落實數位生活。本組採用目前在市面

上有名飲料店的菜單來做為我們畢業專題製作的範本，使用者可以透過手機軟體或

網頁輕鬆地向商家來訂購商品，本系統也可邀請您的朋友來跟您一同訂購，類似目

前市場上團購的概念，訂單送出後可以清楚得掌握到目前訂單的狀態，例如:店家是

否接受訂單、是否已經沖泡完成、是否外送中(會顯示您是第幾筆外送)、最後外送

員跟您結完帳後，需要在外送員所攜帶的智慧型手機軟體上點選「完成」，訂單即可

完成並且加入到您的歷史紀錄中。

iii

誌 謝

能夠完成這份專題，首先要由衷的感謝我們的指導教授 李宗儒 老師，在繁忙

的教學工作期間給予我們最細心的指導與一些專業知識的建議，彌補我們所不足或

需要改善的地方，讓我們的專題更加符合當初建立的目標與成果，也謝謝我們的導

師 周志學 老師細心的指導與督促我們。

在大學期間，從剛進大學的新鮮人到即將要步入社會的知識青年，學校總是給

予我們最多的幫助以及社會經驗、職場上所需的專業技能與知識，讓我們不再對自

己的未來充滿疑惑及恐懼，也間接的為我們未來道路上的指向方針填上美好以及成

功的目標，謝謝系上的所有教授、老師不吝嗇的把課本上以及自己所學到的知識傳

達給我們，讓我們學習到對自己最有幫助的知識與內容。

在奠定專題題目之時，其實我們對新的系統「Android」相當的陌生，在製作專

題初期幾乎是從零開始，但這相對的也讓我們在這一塊領域中有了更深一層的了解，

擴展了我們對未來職場的所需的視野與知識。製作期間，組員們充分的發揮創意、

研究能力、組織能力、解決能力，一點一滴的建構我們的心中最理想的目標，以回

報教授及老師對我們的期望與教育我們最終的理想。

看著畢業專題的完成，內心充滿著無數的感動及感謝，除了感謝教授的指導，

也感謝每位為了專題犧牲無數的睡眠與時間、付出心力的夥伴，有你們的努力與包

容，讓我們在崑山的四年劃下完美的句點。

最後，再一次的感謝師長的教導、同學們的幫助，讓我們完成這一份專題。

iv

目 錄

授權書 .................................................................................................................................... i 摘要 ....................................................................................................................................... ii 誌謝 ...................................................................................................................................... iii 目錄 ...................................................................................................................................... iv 圖目錄 .................................................................................................................................. vi 第一章 緒論 ................................................................................................................ 1-1

1.1 研究背景與動機 ........................................................................................ 1-1 1.2 研究目的 .................................................................................................... 1-1 1.3 研究方法與系統概述 ................................................................................ 1-2 1.4 論文內容概述 ............................................................................................ 1-2

第二章 相關研究 ........................................................................................................ 2-1 2.1 Android ....................................................................................................... 2-1

2.1.1 Android 系統架構 .............................................................................. 2-3 2.2 Java ............................................................................................................. 2-3 2.3 PHP ............................................................................................................. 2-4 2.4 MySQL ....................................................................................................... 2-4 2.5 AppServ ...................................................................................................... 2-4 2.6 jQuery ......................................................................................................... 2-4 2.7 AJAX .......................................................................................................... 2-5 2.8 Swing(Java) ................................................................................................ 2-5 2.9 PHPMailer .................................................................................................. 2-6

第三章 系統架構 ........................................................................................................ 3-1 3.1 消費者端 .................................................................................................... 3-1 3.2 店家端 ........................................................................................................ 3-3 3.3 伺服端 ........................................................................................................ 3-4

第四章 軟體流程 ........................................................................................................ 4-1 4.1 消費者端 .................................................................................................... 4-1

4.1.1 使用者帳號管理功能 ........................................................................ 4-1 4.1.2 單多人訂購功能 ................................................................................ 4-2 4.1.3 即時訂單狀態追蹤功能 .................................................................... 4-3

4.2 店家端 ........................................................................................................ 4-3 4.3 伺服端 ........................................................................................................ 4-4

第五章 系統實現 ........................................................................................................ 5-1 5.1 模擬消費者訂購 ........................................................................................ 5-1

5.1.1 Android 應用程式 .............................................................................. 5-1

v

5.1.2 Web 網頁介面 ................................................................................... 5-6 5.2 模擬店家處理訂單 .................................................................................. 5-14

5.2.1 Java 視窗程式 ................................................................................. 5-14 5.2.2 Android 應用程式 ............................................................................ 5-18

第六章 結論 ................................................................................................................ 6-1 參考文獻 ........................................................................................................................... R-1

vi

圖 目 錄

圖 2-1 Android 系統架構圖 ......................................................................................... 2-3 圖 3-1 系統架構圖 ....................................................................................................... 3-1 圖 5-1 手機登入、註冊與帳號啟用畫面 ................................................................... 5-1 圖 5-2 消費者端 Android 應用程式主畫面 ............................................................... 5-2 圖 5-3 訂購飲料頁面 ................................................................................................... 5-2 圖 5-4 透過揪團訂購模式建立揪團並選擇店家 ....................................................... 5-3 圖 5-5 選擇加團限制等其他資訊 ................................................................................ 5-3 圖 5-6 選擇邀請好友及設定截止時間 ....................................................................... 5-4 圖 5-7 訂購茶飲頁面 ................................................................................................... 5-5 圖 5-8 訂單資訊 ........................................................................................................... 5-5 圖 5-9 Web 版登入畫面 ............................................................................................... 5-6 圖 5-10 Web 版無法登入協助頁面 ............................................................................. 5-6 圖 5-11 忘記密碼頁面 ................................................................................................. 5-7 圖 5-12 密碼已重製成功之通知信件 ......................................................................... 5-7 圖 5-13 Web 版主畫面 ................................................................................................. 5-8 圖 5-14 Web 版單人訂購模式選擇店家 ..................................................................... 5-8 圖 5-15 Web 版單人訂購模式茶飲訂購頁面 ............................................................. 5-9 圖 5-16 訂單確認頁面 ............................................................................................... 5-10 圖 5-17 Web 版揪團訂購 ........................................................................................... 5-10 圖 5-18 Web 版揪團訂購建立揪團頁面 ................................................................... 5-11 圖 5-19 揪團建立成功 ............................................................................................... 5-12 圖 5-20 揪團茶飲訂購頁面 ....................................................................................... 5-12 圖 5-21 揪團提前截止投票-等待投票 ..................................................................... 5-13 圖 5-22 揪團提前截止投票-完成 .............................................................................. 5-13 圖 5-23 揪團訂購訂單資訊 ....................................................................................... 5-14 圖 5-24 店家端 Java 程式登入畫面及主畫面 ......................................................... 5-15 圖 5-25 選擇退單項目 ............................................................................................... 5-16 圖 5-26 退單最後確認 ............................................................................................... 5-16 圖 5-27 退單顯示分頁 ............................................................................................... 5-17 圖 5-28 消費者端收到退單通知 ............................................................................... 5-17 圖 5-29 店家端 Android 應用程式 ........................................................................... 5-18 圖 5-30 由外送人員完成外送，完成訂單 ............................................................... 5-18

1-1

第一章 緒論

1.1 研究背景與動機

在台灣的大街小巷裡非常容易看見賣著手搖泡沫茶飲的店家，但即便在手機行

動網路及智慧型手機的發展蓬勃的現今，業者的外送方案多數仍只有電話，但透過

電話的方式訂購不但需要支付電話費，也容易產生與消費者在溝通上的問題，而造

成業者與消費者之間產生不必要的麻煩。

在網際網路快速的發展之下，不僅為生活帶來便利，亦為許多產業帶來龐大的

商機，譬如以往消費者只能親自前往店家購物或是透過郵購，至今已可以在家動動

手指，利用電腦購買自己想要的商品。雖然許多的餐飲業雖然會利用網路來進行行

銷，但多數仍未利用網路的便利性，來取代以往要利用電話訂購外送較為不便的模

式，同時消費者也無法充分地了解外送所需的等待時間。

1.2 研究目的

近年來國內外許多商家的銷售通路陸陸續續多了網際網路，但在餐飲業方面仍

繼續以電話訂購的傳統模式來進行外送，故本專題將嘗試設計與實作，一套含消費

者端及店家端的線上訂購整合系統，來達到有效地運用店家人力、網際網路及智慧

型手機，並進行模擬使用者向店家進行消費並外送至指定地點，使用者可以透過智

慧型手機或是任何可瀏覽網頁的裝置，來做為選購商品的管道，透過這些管道直接

向店家下訂單，除了能達到節省電話費用，更可大幅地降低店家可能會因通話品質、

環境噪音干擾誤聽，而造成訂單沖泡錯誤，耗費人力重新沖泡茶飲及往返外送目的

地的困擾。

1-2

1.3 研究方法與系統概述

首先本專題針對目前臺灣南部地區較知名的連鎖加盟泡沫茶飲店作為範本，來

建立飲品菜單，並收集店家地理位置資訊後，思考系統開發方向，規劃系統內容，

建立實驗步驟，並進行實驗，本研究流程圖如 1-1。

為達到完全真實模擬店家與消費者之間的消費流程，故本系統共分三大部分，

分別為消費者端、店家端及伺服端；消費者端含使用者訂購茶飲之智慧型手機應用

程式及 Web 網站端。店家端則含外送人員結帳之智慧型手機應用程式及店家內接收

消費者訂單的 Java 視窗程式。伺服端則負責處理由消費者端及店家端之最終使用者

介面所送出之相關資料，並同時處理消費者端揪團提前截止之投票行為，以及處理

使用者註冊帳號與寄發帳號啟用認證信。

本專題在消費者端之智慧型手機應用程式，採用目前在市場佔有率位居首位的

Android系統來進行開發，而Web網站端則使用 jQuery及CSS語法實現使用者界面，

並以 PHP(PHP：Hypertext Preprocessor)搭配 MySQL 資料庫建構而成。

而在店家端的智慧型手機應用程式同消費者端，使用 Android 來進行開發，接

收消費者訂單之系統則選擇在課堂上所學到的 Java Swing 來開發視窗程式。

伺服端則採用 AppServ 2.5.10 版整合性套件來架設 Web Server，此套件內含四

個建置此系統的必要軟體，為 Apache 2.2.8、PHP 5.2.6、MySQL 5.0.51b 及

phpMyAdmin-2.10.3，並使用郵件函式庫 PHPMailer 搭配 Gmail 來寄發使用者相關服

務之信件。此外，另使用 Java 程式語言編寫一套處理本系統各項訂單資訊的伺服端

程式。

1.4 論文內容概述

本論文內容共分為六個章節，首先第一章緒論其內容為探討本專題之研究背景

與動機、研究目的，並透過研究方法與系統概述描述此系統設計之理念與研究步驟。

1-3

第二章背景則是敘述本專題製作中主要所需建置以及使用之環境背景，並且將使用

之軟體與撰寫程式語言等相關技術做說明。第三章系統架構為本專題所規劃之系統

內容，分別為消費者端、店家端及伺服端，將透過各小節來敘述其特性與功用；並

由第四章軟體流程說明，詳細敘述此專題所架構的兩大系統之系統流程與各項功能。

第五章系統實現將以圖文說明方式，呈現本專題所規畫開發之系統，並詳細解說各

項功能。第六章結論分析說明本專題初始理念以及未來可延伸方向與貢獻度，期望

本論文對往後學術與資訊科技發展能有所貢獻。

2-1

第二章 相關研究

本章節將會針對餐飲訂購系統內所使用到的各項軟體及技術，做出基本簡介及

探討相關文獻。本系統的三大部份當中，消費者端及店家端皆有使用 Android 應用

程式及處理動態網頁所需的 PHP 及來進行開發，而除了以上這兩樣技術外，消費者

端的 Web 介面亦使用到 jQuery 及 AJAX 技術來達到非同步更新機制。店家端則是

使用 Java Swing 所提供的標準圖形用戶介面，來開發接收消費者訂單的視窗程式。

伺服端則是利用 Java 來編寫伺服端程式，以及利用一般個人電腦搭配安裝 AppServ

整合性套件來建立伺服器環境，提供本消費者端及店家端所需的服務。

2.1 Android

Android 是一個以 Linux 為基礎的半開放原始碼作業系統，主要用於行動設備，

由 Google 和開放手持設備聯盟開發與領導。其特色在於使用 Linux 開放平台，而且

免費提供給手機製造商及軟體開發商使用。特色方面，Android 的軟體架構採用分

層設計的概念，優點為減少各層之間的相依性、便於獨立開發、容易收斂問題及除

厝等等。

應用程式框架－框架內已經具備多種基礎軟體元件，應用程式可直接呼用

這些元件的功效服務，節省應用程式的開發心力及時間，同時程式的再用

性、移植性也較高。

Dalvik 虛擬機器－Android 內不是使用標準的 Java 虛擬機器(Java Virtual

Machine；JVM)，而是使用獨特的 Dalvik 虛擬機器，關於此以下將再進行

深入的說明。

整合(網頁)瀏覽器－網頁瀏覽器就是所謂的「主要、常用的應用程式」，

Android 內建的瀏覽器是用 WebKit 的瀏覽引擎為基礎所開發成的，WebKit

2-2

是一個開放原碼專案，許多瀏覽器也都是用WebKit引擎所開發成，如Apple

的 Safari、Nokia S60 手機內的瀏覽器(Web Browser for S60)等。

最佳化的繪圖能力－繪圖分為 2D 與 3D，2D 方面 Android 是用一套特有的

函式庫，而 3D 則是使用 OpenGL ES 1.0(OpenGL for Embedded Systems)規

範的函式庫。

SQLite 資料庫－SQLite 是一套開放原始碼的關連式資料庫，其特點在於輕

量性(僅 500KB 左右的容量)，適合手持式裝置運用，此外桌上型運算的應

用程式也有使用，如 OpenOffice.org 2.0 版之後就有內建 SQLite。

媒體支援能力－Android 支援多種音訊、靜態視訊、動態視訊格式，如

MPEG-4、H.264、MP3、AAC、AMR、JPG、PNG、GIF 等。

GSM 通話能力－GSM 手機的通話能力其實必須在硬體電路層次實現，軟

體層次無法實現，只是 Android 平台要求必須要有 GSM 通話能力，此項功

效特點與其說是特點，不如說是訂立出最低的硬體要求規範。

藍牙(Bluetooth)、EDGE、3G、以及 Wi-Fi－這些通訊能力一樣屬於硬體層

次的功效要求。

攝影機(Camera)、GPS 定位、羅盤、加速度感測器－這些同樣屬於硬體層

次的功效，Android 主要是在軟體層面提供支援，如硬體抽象層、應用程

式介面等。

豐富的開發環境－Android 平台強調已備有完善的程式開發環境，其開發

環境包括裝置模擬器(Emulator)、除錯工具、程式執行所耗用記憶體、效能

等評估功能，另還有一個可用於 Eclipse IDE 的外掛程式(Plug-in)。

2-3

2.1.1 Android 系統架構

圖 2-1 Android 系統架構圖

Android 的架構如上圖，分成四個層次，由上至下分別為應用程式層(Application

Layer)、應用程式框架層(Application Framework Layer)、函式庫層(Library Layer)、

以及 Linux 核心層。

2.2 Java

Java 是一種電腦程式設計語言，擁有跨平台、物件導向、泛型程式設計的特性，

伴隨著網際網路的迅猛發展而發展，逐漸成為重要的網路程式語言。Java 不同於一

般的編譯語言和直譯語言。它首先將原始碼編譯成位元組碼（bytecode），然後依賴

各種不同平台上的虛擬機來解釋執行位元組碼，從而實現了「一次編譯、到處執行」

的跨平台特性。

2-4

2.3 PHP

PHP（PHP：Hypertext Preprocessor）是一種在電腦上執行的腳本語言，主要用

途是在於處理動態網頁，也包含了命令列執行介面（command line interface），或者

產生圖形使用者介面（GUI）程式。

PHP 的應用範圍相當廣泛，尤其是在網頁程式的開發上。一般來說 PHP 大多執

行在網頁伺服器上，透過執行 PHP 程式碼來產生使用者瀏覽的網頁。PHP 可以在多

數的伺服器和作業系統上執行，而且使用 PHP 完全是免費的。根據 2007 年 4 月的

統計資料，PHP 已經被安裝在超過 2000 萬個網站和 100 萬台伺服器上。

2.4 MySQL

MySQL 是一個開放程式碼的關聯式資料庫管理系統，原開發者為瑞典的

MySQL AB 公司，該公司於 2008 年被昇陽電腦（Sun Microsystems）收購。2009 年，

甲骨文公司（Oracle）收購昇陽電腦公司，MySQL 成為 Oracle 旗下產品。

2.5 AppServ

AppServ 是一個在 Windows 平台運行的 WAMP(Windows、Apache、MySQL、

PHP)開源工具，起源於泰國。這個平台包含了 Apache、MySQL 和 PHP 的安裝及自

動配置，並透過 phpMyAdmin 來管理 MySQL。

2.6 jQuery

jQuery 是一套跨瀏覽器的 JavaScript 函式庫，強化 HTML 與 JavaScript 之間的

操作。由 John Resig 在 2006 年 1 月的 BarCamp NYC 上釋出第一個版本。目前全球

有 28%的網站使用 jQuery，是目前最受歡迎的 JavaScript 函式庫。

2-5

jQuery 免費且為開放原始碼，使用 GPL 和 MIT 許可證雙協議。jQuery 的語法

設計使得許多操作變容易，如操作文件（document）、選擇 DOM 元素、動畫效果、

事件處理、發展 Ajax 以及其他功能。除此之外，jQuery 提供 API 讓開發者將自己

所寫的功能融入 jQuery 內。

2.7 AJAX

AJAX 為「Asynchronous JavaScript XML」（非同步的 JavaScript 與 XML 技術），

是一種廣泛應用在瀏覽器的網頁開發技術。Ajax 是多項技術的綜合應用，Ajax 概念

由 Jesse James Garrett 所提出，AJAX：

運用 XHTML+CSS 來表達資訊；

運用 JavaScript 操作 DOM（Document Object Model）執行動態效果；

運用 XML 和 XSLT 進行資料交換及操作；

運用 XMLHttpRequest 為 Agent 與網頁伺服器進行非同步資料交換；

運用 JavaScript 技術實現。

類似於 DHTML 或 LAMP，AJAX 不是指一種單一的技術，而是有機地利

用了一系列相關的技術。事實上，一些基於 AJAX 的「派生／合成」式

（derivative/composite）的技術正在出現，如 AFLAX。

AJAX 的應用使用支持以上技術的 Web 瀏覽器作為運行平台。這些瀏覽器目前

包括：Internet Explorer、Mozilla、Firefox、Opera、Konqueror 及 Mac OS 的 Safari。

但是 Opera 不支持 XSL 格式對象，也不支持 XSLT。

2.8 Swing(Java)

Swing 是一個為 Java 設計的 GUI 工具包。 Swing 是 Java 基礎類別的一部分。

Swing 包括了圖形使用者界面 (GUI) 物件 如：文字框，按鈕，分隔窗格和表格。

2-6

Swing 提供許多比 AWT 更好的螢幕顯示元素。它們用純 Java 寫成，所以同 Java

本身一樣可以跨平台執行，這一點不像 AWT。它們是 JFC 的一部分。它們支持可

更換的面板和主題（各種作業系統預設的特有主題），然而不是真的使用原生平台提

供的設備，而是僅僅在表面上模仿它們。這意味著你可以在任意平台上使用 JAVA

支持的任意面板。 輕量級元件的缺點則是執行速度較慢，優點就是可以在所有平台

上採用統一的行為。

2.9 PHPMailer

PHPMailer is a full-featured Email Transfer Class for PHP, supporting SMTP and

POP3.

3-1

第三章 系統架構

本專題的系統架構共可以分為三部份，分別是「消費者端」、「店家端」以及「伺

服端」。此系統模擬使用者開始訂購飲料，且將訂單送往店家端，再由外送店員與消

費者確認並交易完成，使用者透過PC WEB或搭載Android智慧型手機及平版電腦，

且必須使用 Internet、3G 便可開始使用此系統。使用者所申請的帳號、所訂購的商

品、訂單的狀態、歷史紀錄、好友名單，都會跟伺服端做及時的更新，且在店家端

也會立即的顯示出使用者的訂單，以便做出接收訂單或是退單的動作。

圖 3-1 系統架構圖

3.1 消費者端

消費者端分為兩種版本，分別為「智慧型手機版」及「PC WEB 版」，兩種版本

共同包含的功能有註冊新帳號、重發認證信、忘記密碼、單人訂購、揪團訂購、訂

單狀態、歷史紀錄、好友名單及帳號管理。

使用者可以依照自己的需求選擇要使用「智慧型手機版」或是「PC WEB 版」，

3-2

使用者必須申請一組帳號，並且帳號必須到申請時所填寫的電子信箱接收認證信，

啟用此帳號，才可繼續使用本系統，假如使用者未在三十分鐘內啟用帳號並想繼續

使用此帳號登入時，就必須要重發認證信來重新啟用此帳號，使用者不幸忘記密碼

時，可點選忘記密碼，本系統會自動產生新密碼並寄發電子信箱到申請時所填寫的

信箱。

單人訂購:使用者必須填寫要外送的地址以及所訂購商品的店家，店家只能選擇所

填寫的外送地址為中心 1.5公里內的店家，填寫完畢後即可開始店購商品，系統會

清楚的顯示共訂多少商品，且自動算出總價格以及折價的金額，確定商品後並可送

出訂單給伺服端。

揪團訂購:使用者可以創立一個揪團，必須填入外送地址、訂購商品的店家、揪團

名稱、揪團截止時間(時間必須大於 5分鐘)、揪團模式，揪團模式有兩種，分別為

「直接邀請」或是「使用密碼」。直接邀請:使用者用指定的方式邀請朋友加入，受

邀者則會在揪團列表顯示揪團訊息，可直接加入此揪團。使用密碼:揪團建立後，只

要是揪團者所加入的朋友，即可看到揪團的訊息，輸入密碼正確後即可進入。

揪團建立後即可開始訂購商品，揪團內可以清楚的看到每位使用者所訂購的商品資

訊，每位訂購者在時間截止前都可以修改自己訂購的商品，但揪團者有權力可以刪

除受邀者所訂購的商品，揪團訂購截止時，揪團者確認好商品後即可送出此訂單，

假如揪團者想要提前截止訂單，系統會問揪團者是否要發起投票，發起投票後，系

統會自動偵測在揪團訂購頁面中的使用者，並立即顯示是否同意要提前截止此訂單

(必須在 15秒內做決定，否則視為同意提前截止)，假如所有人都同意時，揪團即可

截止且由揪團者送出訂單，如果有人不同意提前截止時，此揪團則會繼續進行，揪

團訂購截止前都可發投票，假如無人在訂購頁面時，系統會直接截止訂購商品，揪

團者即可送出訂單。已經建立好的揪團未送出訂單前都可以刪除訂單。

3-3

訂購狀態:使用者一次只能擁有一筆訂單，直到訂單完成後才可再新增訂單，訂購

狀態會有訂單的所有資訊，包括有外送地址、店家、訂購模式(單人或揪團)、折價

後總金額、所訂購的商品、訂單狀態(即時更新狀態訊息)，訂單狀態分為 6個狀態，

狀態 1:已送出，待店家收單(可退單)，狀態 2:待店家沖泡，狀態 3:等待外送，目

前佇列:1(模擬目前只有一筆外送時的狀態)，狀態 4:外送中，狀態 5:完成(訂單會

加入歷史紀錄)，假如訂購店家目前有缺少茶類或是加料的部分，可能需要 20-30

分鐘的時間時，店家會詢問訂購者是否要等待，選擇等待則更新為狀態 2，選擇不

等待時則視為退單(訂單會加入歷史紀錄)。

歷史紀錄:紀錄已經完成或是退單的每一筆訂單資訊，包含訂單價格、訂購的時間、

完成的時間、所選擇的店家、單人或是揪團模式、訂單詳細資料，點選訂單詳細資

料後可詳細的了解是哪位使用者所訂購的商品。

好友名單:列出你所新增的朋友列表，可點選刪除功能即可將朋友刪除，輸入朋友

的電子郵件即可新增成為朋友。

帳號管理:列出使用者在申請帳號時所填的姓名、電話、信箱、地址，假如想修改

時，可點選「修改個資」，只可以修改姓名和地址(電話和信箱為唯一性)，如果要修

改密碼可點選修改密碼的功能。

3.2 店家端

店家透過電腦或是觸碰螢幕來操作，每個店家都配有一組的使用帳號，因此並

不會接收到其他店家之訂單，店家可即時接收 Android智慧型手機或是 Web網頁所

傳過來的訂單，商家就目前店內可沖泡之茶飲來判斷是否要接收訂單，若店家目前

有缺少某樣茶飲或是材料，可即時送出訊息告知訂購者是否要等待或是取消訂單，

3-4

若店家已接受訂單將會發送通知給訂購者，得知訂單最新狀態，當店家沖泡完畢時

亦會即時送出最新狀態通知訂購者，且告知訂購者目前訂單佇列，以便訂購者可估

算大約所需等待的時間，當訂單佇列為第一順位時，則表示訂單將要被外送，外送

人員要外送時則會即時更改訂單狀態為外送中，外送人員將商品送達訂購者手上時，

可由外送人員所配戴的 Android智慧型手機，核對訂單是否與送達商品符合，確認

商品後由外送人員按下完成，即可完成交易。完成之訂單可在店家端系統中查詢。

3.3 伺服端

伺服端將處理及存放來自消費者端及店家端所送來的各項資料，處理的資訊包

括有偵測揪團訂購時是否存在於訂購頁面、揪團訂單截止時間是否已經結束訂購、

揪團提前截止投票時間倒數、申請帳號完後是否有至信箱啟用帳號、重發帳號啟用

認證信、重發新密碼至信箱。

4-1

第四章 軟體流程

4.1 消費者端

消費者端規劃可使用 Android 智慧型手機應用程式及 Web 網頁進行訂購，兩者

操作模式均含使用者帳號管理功能、單多人訂購功能及即時訂單狀態追蹤功能。

4.1.1 使用者帳號管理功能

此功能主要是針對各項帳號管理之需求作處理。

註冊帳號：本系統以使用者之電子郵件信箱為帳號，因此每位使用者之電子信

箱並不允許重複，在填入其他必要資訊如密碼與聯絡電話後，使用者即可完成註冊，

同時系統也將以寄發一封含啟用網址之認證信件，供使用者在註冊完後的三十分鐘

內點選信件內之超連結以啟用帳號，目的是為確認該電子信箱為註冊者所擁有且信

箱位址為有效的。

重新寄發認證信：考量某些電子郵件服務商可能會將本系統寄發給使用者之帳

號認證啟用信件分類至垃圾信件匣，亦或是使用者在帳號註冊完成後未在時間內啟

用帳號，就必須重發認證信，便可啟用使用帳號。

忘記密碼：考量使用者可能忘記登入時的密碼，所以增設此功能，使用者需要

在此功能內輸入申請時所填寫的聯絡電話，伺服端便立即寄發新密碼至使用者的電

子郵件信箱。

帳號管理：此功能提供使用者修改個人資訊，如暱稱、地址及密碼。

好友管理：提供使用者新增或刪除好友，新增時僅需填入欲加入的好友帳號。

4-2

4.1.2 單多人訂購功能

此功能主要提供使用者訂購茶飲之功能，其中多人訂購即為揪團模式，提供使

用者邀請好友共同訂購茶飲。

選擇店家：使用者填寫要外送的地址完後，系統將會自動搜索該地址一點五公

里內的所有店家，提供給使用者決定要訂購的店家。

單人訂購：使用者登入後可即時使用此功能，訂購前必須填寫外送地址及選擇

外送店家，外送地址預設將填入使用者申請時所填寫的地址，填寫完畢後便可開始

訂購茶飲，選購時可依消費者的個人喜好來訂購茶飲及選擇甜度、冰塊還可以選擇

是否要加料，訂購後將會列出已經訂購的商品資訊以及折價後的金額，使用者確定

訂單後，便可送出訂單至選後的店家，等待店家收單。

多人訂購：使用者登入後如果想要跟同事或是同學共同訂購茶飲時，即可使用

此功能，開始訂購前揪團者必須先創立一個揪團且必須填寫外送地址、選擇外送店

家、揪團名稱、揪團說明、截止時間，邀請的模式有直接邀請或使用密碼，直接邀

請是指定你所要邀請的朋友即可，被邀請的好友可直接進入該揪團開始訂購茶飲，

若使用的是使用密碼時，只要是創立揪團人的好友便可看到該揪團，輸入密碼即可

進入開始訂購，兩者的訂購模式是相同的。揪團建立完成後邀請人及被邀請人即可

開始訂購茶飲，訂購者可依自己的喜好選購喜愛的茶飲以及需要的甜度、冰塊或是

否要加料，點選後則會列出訂購者以及所訂購的茶飲資訊，若建立揪團者在截止訂

購茶飲時間到前，欲提前截止訂購，則可發起提前截止投票之功能，投票發起後只

要在此揪團訂購頁面之使用者，會立即接收到是否要提前截止之投票通知，使用者

們必須要 15 秒內作出決定，若未作出決定則系統會判定該使用者為同意提前截止，

如果沒有使用者正在訂購茶飲頁面時，系統將直接截止訂購，訂購者確認所有的訂

單資訊後，便可送訂單至選購的店家，等待店家收單。

4-3

4.1.3 即時訂單狀態追蹤功能

當訂購者送出訂單後，從送出訂單至完成外送間的所有流程，將會於消費者端

顯示各項訊息，提供消費者了解訂單最新狀態，狀態共分為以下六種：

待店家收單：此狀態為訂單已經送出，但店家未接收訂單，使用者可在這

時候退單。

待店家沖泡：此狀態為店家已經接收訂單，並且開始進行沖泡茶飲的動作。

等待外送，目前佇列：此狀態為店家已經完成所有茶飲的沖泡，並顯示目

前所等待的外送編號。

外送中：此狀態為外送店員已經從店裡出發前往訂購時所填寫的外送地

址。

完成：外送店員已經將茶飲送至訂購者手上，確認茶飲是否正確後，外送

店員便可在 Android 智慧型手機上點選外送完成之功能，訂單便可完成，

此訂單將會加入歷史紀錄。

店家回應：若店家無法接收訂單或是缺少某些材料時，會通知訂購者是否

要等待或是退單的訊息，假如訂購者選擇等待時，訂單狀態將會改為待店

家沖泡，反之為退單，退單後此訂單將會加入歷史紀錄。

歷史紀錄：所有完成之訂單或是退單，都會加入到歷史紀錄內，使用者可在歷

史紀錄內清楚看到所有訂購過的訂單資訊，包括有訂購的日期時間、訂購的店

家、訂單完成的時間以及訂購的金額，點選詳細資料便可清楚的了解共訂了幾

杯茶飲、訂購者、甜度、冰塊、是否加料之所有資訊。

4.2 店家端

店家人員開啟店家端 Java程式，輸入店家專屬帳號密碼，向資料庫進行驗證後，

正確即會進入該店家訂單管理介面，介面共分為接退訂單、退單顯示、歷史查詢三

4-4

個部分。店家外送人員外送時所攜帶之 Android 智慧型手機，需輸入店家專屬帳號

密碼，向資料庫進行驗證後，即可看到該店家所又要等待外送的訂單，外送人員按

照訂單佇列依序將茶飲外送至消費者手上。

接退訂單：介面會顯示出接收到的六筆訂單，訂單會清楚地列出訂單編號、

電話號碼、地址、總金額以及訂單內容，假如訂單超過六筆時則會在右下

角顯示出尚未接單筆數，沖泡完成後等待外送時將會將訂單從接退訂單之

介面中移除，便會替補為新的訂單。

退單顯示：假如店家方面目前有缺少可以完成訂單之茶飲需要煮茶時間時，

可回應消費者目前退單的原因，消費者未作出回應時，此訂單將會顯示在

此介面，在退單顯示也會清楚的顯示訂單編號、電話號碼、地址、總金額、

訂購內容，假如消費者作出等待的回應時，此訂單將回到街退訂單的介面，

並且等待店家完成沖泡，若消費者不想等待時則會將此訂單從介面中移

除。

歷史紀錄：只要是從外送人員手上完成之訂單，會將此訂單移至歷史紀錄，

在歷史紀錄裡，可選擇是在哪個時段所完成的訂單，店家人員可清楚的查

詢訂單資訊。

4.3 伺服端

伺服端利用 Java 程式撰寫，透過執行續來完成及處理所接收到的資訊，下列為

伺服端程式所處理之工作：

揪團截止時間：伺服端將向資料庫查詢所有揪團訂單之截止時間，並以伺

服端時間為基準，來判斷是否超過訂購截止時間，若已經超過截止時間，

則狀態將自動更新為截止。

揪團投票：揪團者發起投票後，伺服端將會立即向資料庫查詢，還在揪團

訂購頁面之使用者，並將透過這些使用者的代號，建立新的投票場次，並

4-5

在十五秒內完成此場次之投票結果，假如投票通過則會更新揪團狀態為截

止訂購，反之揪團訂購則繼續進行，如果無人停留在訂購頁面則會更新此

訂單狀態為截止訂購。

店家端完成訂單之時間：伺服端將會向資料庫查詢所有訂單，假如某訂單

完成時，則會以伺服端的目前時間，來做為更新此訂單之完成時間。

5-1

第五章 系統實現

5.1 模擬消費者訂購

本系統所開發之消費者端共分為手機上操作的 Android 應用程式及給一般個人

電腦使用的 Web 網頁介面，下面將分別介紹如何透過這兩種介面來訂購茶飲。

5.1.1 Android 應用程式

如果使用者無登入過，會先進入登入畫面。第一次使用的消費者則可以選擇註

冊新帳號來註冊。

圖 5-1 手機登入、註冊與帳號啟用畫面

5-2

進入主畫面後，共有訂購飲料、好友清單、歷史紀錄以及附近店家四個按鈕，

Menu 的部分則有設定、關於及登出。

圖 5-2 消費者端 Android 應用程式主畫面

點選訂購飲料後，會進入訂購飲料的主畫面，畫面上方的列表將顯示出可以加

入的揪團，而下方則是自己的外送訂單狀態，如果有自己建立單人或是揪團訂單，

可以直接透過該區塊觀看訂單的簡易狀態。

圖 5-3 訂購飲料頁面

5-3

接著如果愈開始訂購茶飲，點選畫面右上角的建立，將出現單人模式及揪團模

式兩種選項，在此使用揪團模式來進行展示。

圖 5-4 透過揪團訂購模式建立揪團並選擇店家

進入揪團訂單建立頁面後，首先先填入愈送達的地址，才可以按下「點此選擇

店家」的按鈕來選擇店家，進入選擇店家的頁面後，將按使用者輸入的地址來計算

並顯示出方圓半徑 1.5 公里內的店家，提供使用者選擇想要的店家。

圖 5-5 選擇加團限制等其他資訊

5-4

而揪團主題則為該揪團的主旨，屬於必填欄位，加團限制則可以選擇「僅接受

已邀請的人」及「使用密碼」，前者為從好友列表中，選擇要邀請一起訂購的好友，

也只有這些邀請的好友才可以一起加入揪團訂購茶飲，後者則是只要擁有密碼的好

友則可以加入訂購。

圖 5-6 選擇邀請好友及設定截止時間

建立揪團後，將進入訂購茶飲的畫面，左頁面為顯示茶飲種類的菜單，而右頁

面為顯示揪團資訊及目前已經訂購的茶飲列表。

5-5

圖 5-7 訂購茶飲頁面

在設定的揪團截止時間尚未到達之前，創團者無法提前截止揪團去向店家下訂

單的動作，因此如愈提前截止，則會需要發起提前截止投票，投票成員將會為仍停

留在訂購頁面的使用者。

圖 5-8 訂單資訊

在確認完訂單後，揪團者即可按下確定送出，將訂單發送至指定外送的店家，

待店家接收訂單後沖泡飲品並完成外送。

5-6

5.1.2 Web 網頁介面

進入 Web 網頁介面後，同樣會需要消費者先進行登入，才可進行後續其他動

作。

圖 5-9 Web 版登入畫面

接著將利用網頁介面展示於使用者帳號管理功能內的「忘記密碼」功能，此功

能於 Android 應用程式內亦有含。

圖 5-10 Web 版無法登入協助頁面

在首頁選擇「無法登入」後將會出現忘記密碼以及重發認證信兩個選項，提供

無法登入的使用者來使用。

5-7

圖 5-11 忘記密碼頁面

進入忘記密碼的操作畫面後，使用者須輸入註冊時所填寫的聯絡電話，來進行

驗證，成功後系統將會寄送隨機產生的新密碼至信箱。

圖 5-12 密碼已重製成功之通知信件

隨後完成登入後，進入主畫面歡迎使用者，上方的選單分別有單人訂購、揪團

訂購、訂單狀態、歷史紀錄、朋友管理及帳號管理。

5-8

圖 5-13 Web 版主畫面

接著展示單人模式之操作流程，首先點選首頁上方菜單的單人訂購後，會請客

戶先輸入外送地址來選擇欲外送之店家。

圖 5-14 Web 版單人訂購模式選擇店家

5-9

依照使用者所輸入的地址來計算出可以選擇的店家，點選地圖上的圖示後，便

會出現店名以及店家地址，按下選擇此店家後便會出現於下方，接著按下送出後便

可進入訂購頁面。

圖 5-15 Web 版單人訂購模式茶飲訂購頁面

頁面分別有糖度、冰塊、加料以及目前訂單四個區塊，而右上角則會顯示使用

者所填寫欲外送的地址以及選擇的店家，如果臨時想修改則可以透過「修改」來更

改地址以及外送店家。

5-10

圖 5-16 訂單確認頁面

訂購完成後，按下「目前訂單」則會進入確認頁面，當確認欲訂購之茶飲以及

總價格、杯數後等資訊，按下「送出訂單」，訂單將會立即送至伺服端，等待店家端

接受訂單。

圖 5-17 Web 版揪團訂購

5-11

接著再介紹揪團訂購的部分，使用者可以由「目前房間」得知有哪些好友正在

揪團訂購飲料，如果使用者想自己開揪團，則選擇「建立揪團」。

圖 5-18 Web 版揪團訂購建立揪團頁面

必須先輸入地址以及選擇店家的步驟如同單人訂購，揪團訂購則是需要選擇加

入揪團的條件，一個是邀請自己的好友，另一個則是使用密碼，而揪團則需要再輸

入揪團的房間名稱以及截止時間。

5-12

圖 5-19 揪團建立成功

揪團建立完成後，只要在尚未送出訂單給店家之前，都是可以取消揪團的，也

就是取消訂單。回到揪團訂購的主頁面之後，可以看見剛才所建立的揪團，點選加

入之後即可進入訂購頁面。

圖 5-20 揪團茶飲訂購頁面

5-13

在目前訂單的區塊則可以看見好友們以及使用者訂購的茶飲，其中揪團訂購中

與單人訂購的不同在於，揪團者如果欲提前截止揪團並送單給店家，必須先進行投

票。

圖 5-21 揪團提前截止投票-等待投票

投票成員將以仍在訂購頁面的使用者為主，因此提前截止的前提為所有的票均

為同意票。

圖 5-22 揪團提前截止投票-完成

在所有投票人均同意後，揪團將由伺服端將狀態轉為截止，此時其他的使用者

則需要等待揪團者將訂單送出。

5-14

圖 5-23 揪團訂購訂單資訊

在揪團者確認訂單完畢後，按下「送出訂單」即可等待店家端進行收單。

5.2 模擬店家處理訂單

上一節展示利用本系統所開發之消費者端來進行訂購茶飲，接著本節將介紹店

家端將如何接收及處理消費者端所送出之訂單。

5.2.1 Java 視窗程式

每間店家都配有自己的帳號密碼，因此每間店使用的程式雖然相同，但因需要

帳號密碼登入，所以不會有處理到其他間店訂單的問題發生。

5-15

圖 5-24 店家端 Java 程式登入畫面及主畫面

店家端輸入完帳號密碼後，將進入主畫面，左方區塊為送出退單通知用，右方

則以六宮格的方式呈現每一筆由消費者端送出的訂單，下方則有歷史查詢可查詢已

結案的歷史訂單以及尚未接單筆數來瞭解尚有幾筆訂單未出現於六宮格內。

5-16

圖 5-25 選擇退單項目

考慮店家可能因某些因素無法沖泡訂單內的某些飲品，因此當無法立即沖泡時

則可針對該訂單，按下「退單」來進行選擇無法沖泡的茶飲或加料來回報給消費者，

後續是否繼續沖泡則將等待消費者回應。

圖 5-26 退單最後確認

在選擇完無法沖泡的品項之後，將會出現於主畫面的左區塊做最後確認，按下

退單通知後，將會送出通知給消費者端，讓消費者選擇繼續等待或是退單。

5-17

圖 5-27 退單顯示分頁

當所選擇的訂單退單之後，訂單將會排入「退單顯示」的分頁中，店家端可以

透過此分頁查看等待消費者端回覆的訂單。

圖 5-28 消費者端收到退單通知

接著店家端送出退單通知後，消費者端將會收到通知，而消費者端則可以選擇

繼續等待或是退單，來決定是否繼續。

5-18

當店家沖泡完畢後，將會等待外送，而這部份的狀態則由店家外送人員透過店

家端之 Android 應用程式來負責。

5.2.2 Android 應用程式

當店家將茶飲沖泡完成後，外送人員即可透過智慧型手機將狀態更新至外送中；

同於店家端的 Java 程式一樣，Android 應用程式仍需要透過店家專屬的帳號密碼來

進行登入，才可完成後續作業。

圖 5-29 店家端 Android 應用程式

外送人員將訂單外送前，將狀態更新為「外送中」，當抵達外送目的地後，與消

費者當面清點項目與金額，無誤後即可完成訂單。

圖 5-30 由外送人員完成外送，完成訂單

6-1

第六章 結論

現今社會中，使用智慧型手機的人們比例是越來越普遍，幾乎是到了人手一支

的地步，在智慧型手機的應用程式裡，只要方便、容易上手的程式，使用者甚至會

付費下載來使用，本專題所開發的餐飲訂購系統就是為了方便使用者在選擇或訂購

餐點、飲料時，可以詳細記綠自己所訂購的物品、金額，也同步紀錄到店家所使用

的資料庫裡，以避免引起消費者最不喜歡的消費糾紛，以確保自己的權益不受損，

在戶外使用時只要有 3G 網路或 Wi-Fi 可以連線上網時，就可以在以往我們覺得不

方便訂購或送達的地點，輸入自己的所在地及想要訂購的餐飲店家，以達到方便、

快速的取得您所訂購的餐點飲料。

此套應用程式也開發了電腦網路端及店家使用端，只要在可以上網瀏覽網頁的

電腦裡，就可以透過網頁點選所需餐點、飲料以及結合 Google Maps 地圖在資料庫

裡已輸入的合作店家所在地址，發送至店家達到我們舊有的需要透過電話連繫的目

的，也避免了在與店家通話訂購飲料時，因通話品質不良造成餐點、飲料誤解而訂

購錯誤的情況，避免掉需要餐點重新製做、重送的時間。

店家端則是強化了現有的餐飲連鎖企業所使用的軟體，同步連線到有登入的會

員帳號手機及電腦，在使用者第一時間送出訂單時接收、製作，客人所訂購餐點不

足或者需要重新製作時，也可以回報給客人是否等候或要更改餐點內容，改善可能

因為店員忽略而忘記告知消費者避免糾紛，在餐點或飲料完成時回報給使用者現在

等待外送情況，告知消費者現在自己的消費物品是否已經在外送中以防止漏單的情

況及消費者等待太久或不知道自己的東西已經在外送途中了沒，更有外送人員所使

用的餐點確認程式，在餐點送至到使用者手上時，透過此程式可以讓消費者清點及

確定外送到的餐點及數量、金額是否正確後，完成這次消費動作，以提升企業品質

及獲得消費者的信心與支持，大大提升智慧型手機使用者間的好用軟體分享及口

碑。

6-2

隨著環保意識抬頭，全球人民口中所呼籲的「節能減碳，救地球」，在以往我們

都會使用紙張來記綠訂購內容，本作品考慮到減少紙張不必要的浪費情況下，以往

都是使用紙張來書寫記綠餐點、飲料，用過一次後就丟棄，現在只要透過同步輸入

到資料庫來記綠一次次消費行為的內容，大大的減少必須使用紙張的情況，為新興

的綠能產業提供了另一項新的指標方針。

本作品大大提升了智慧型手機及電腦、嵌入式硬體三方面的聯繫，為餐飲界以

往的不便達到盡善盡美的功用，並對往後不同的企業提供更多延展性及相關服務，

提高本作品在市面上的商業價值潛力。

R-1

參考文獻

[1] 蓋索林(gasolin)，2011，Google！Android2 手機應用程式設計入門第三版，松

崗，台北。

[2] 林城，2011，Google Android2.X 應用程式開發實戰，碁峯資訊，台北。

[3] Cooking Java – Android 學習筆記：

http://cooking-java.blogspot.com/search/label/Android

[4] JavaEye：http://www.javaeye.com/

[5] 連尼誌：http://b.lineage.idv.hk/

[6] ysl 的程式天堂：http://ysl-paradise.blogspot.com/2010/09/asynctask.html

[7] Android 開發日誌：http://3haku.net/tag/android

[8] iT 邦幫忙::IT 知識分享社群： http://ithelp.ithome.com.tw/

[9] 台灣 Android 中文資源站：http://android.cool3c.com/

[10] PHP 程式設計講義區：http://www.wasite.com/php0/index.htm

[11] Java World@TW：http://www.javaworld.com.tw/jute/

[12] SQL 語法教學：http://www.1keydata.com/tw/sql/sql.html

[13] Android Developers：http://developer.android.com/index.html

[14] Android 開發社區：http://www.eoeandroid.com/thread-479-1-1.html

[15] CG 數位學習網 : http://www.cg.com.tw/PHP/index.htm

[16] CSS 語法教學 : http://css.1keydata.com/tw/

[17] 教學網站-【飛肯設計學苑】: http://www.flycan.com.tw/board/

[18] J2H 程式設計討論 :http://www.j2h.tw/bbs/bbs16/index.php

[19] lan 懶惰蟲筆記 :http://ianjung1974.blogspot.com/

[20] Free CSS Templates.org : http://www.freecsstemplates.org/

[21] CSS Table Gallery : http://icant.co.uk/csstablegallery/tables/100.php

R-2

[22] PHP+MySQL 程式設計研習 : http://chensh.loxa.edu.tw/php/

[23] PHP : Hypertext Preprocessor : http://www.php.net/

[24] jQuery 教學 - 基礎篇 : http://jsgears.com/thread-63-1-1.html

[25] jQuery:The Write Less , DO More, JavaScript Library : http://jquery.com/

[26] 台扣啵的研究日誌 :http://blog.roodo.com/taikobo0