---
# System prepended metadata

title: '**COMEBUY 海外存貨、銷貨系統使用說明書**'

---

# **COMEBUY 海外存貨、銷貨系統使用說明書**

&emsp;&emsp;本文為臺大資管團隊與長沂國際實業股份有限公司（COMEBUY）產學合作專案所開發之系統使用說明書，由專案團隊撰寫，可提供公司人員在未來實際使用系統時參考。

&emsp;&emsp;本文共分為四節，依序詳細說明系統執行環境、系統主要模組、資料庫修改模組、上傳資料格式等使用系統相關內容。

&emsp;&emsp;初次使用系統前，請務必詳閱本說明書，以避免操作出現錯誤以致無法正確輸出資料。另外，若在使用過程出現錯誤訊息，可查閱使用模組的相關章節之錯誤預防機制段落，以初步確認錯誤發生原因以及可能的解決方法。

---
## 1. 系統環境
### 1.1 系統環境說明
&emsp;&emsp;本系統以 JavaScript 語言撰寫，對於作業系統需求如下：
#### 作業系統
* 最新版本的 Windows 10（版本 1903+，組建 18362+）或 Windows 11 
* Mac OS X 10.6 以上版本

### 1.2 系統執行流程
&emsp;&emsp;確認連上公司內部區域網路（與伺服器同一個私人網路），輸入給定網址，即可連線至伺服器，使用本系統。

---

## 2. 系統主要模組介紹與使用說明

&emsp;&emsp;系統共分成四個模組，分別是存貨系統模組、銷貨系統模組、佔比訂貨系統模組以及資料庫修改系統模組。前三者為使用者在此系統中使用的主要功能，可以查詢、計算資料庫裡的資料，或是得到將資料視覺化後的圖表。而資料庫修改系統則是讓使用者利用前端的介面，簡易地新增、修改資料庫的資料。

&emsp;&emsp;在本章節中，我們將會逐一說明存貨系統模組、銷貨系統模組、佔比訂貨系統模組之功能、使用流程、輸出內容以及錯誤預防機制，而資料庫修改模組則會在下一章節（3. 資料庫修改模組介紹與使用說明）介紹。

### 2.1 存貨系統模組
&emsp;&emsp;使用者在此系統中可以取得特定時間、特定地點、特定原物料的存貨狀況。而存貨狀況包括品項存貨量、有效期以及平均週用量。

> ![](https://hackmd.io/_uploads/By7zEwfI3.png)
> 點擊上方選單列中的「存貨」按鈕，即可進入存貨系統模組的介面，預設的時間選擇為當天日期。

#### 2.1.1 使用存貨系統之流程
1. 選擇想看的時間，可以任意單 / 複選單日或是時段。
    > <small>單選時間（一個單日）：</small>
    > <img src="https://hackmd.io/_uploads/BJMoc51U2.png" style="width:230px;">
    
    > <small>複選時間（兩個單日，一個時段）：</small>
    > ![](https://hackmd.io/_uploads/r13xo5JLh.png)
    
2. 選擇想看的地點，可以任意單 / 複選倉庫跟分店兩個類別裡的地點。
    > <small>單選地點（一個倉庫）：</small>
    > ![](https://hackmd.io/_uploads/ByezA91In.png)

    > <small>複選地點（一個倉庫，兩個分店）：</small>
    > ![](https://hackmd.io/_uploads/SJoMC518n.png)

3. 選擇想看的原物料，可以任意單 / 複選。
    > <small>可以複選原物料：</small>
    > ![](https://hackmd.io/_uploads/ByVtAc1Uh.png)

4. 若時間、地點、原物料都選擇完畢，即可點擊「預覽」按鈕。存貨系統會向資料庫查詢選擇結果對應的存貨紀錄，並在網頁上讓使用者預覽系統輸出的存貨表格，檢查是否如預期所需。
    > <small>下圖以紅框框起的即為預覽按鈕，點擊之後介面會顯示查詢結果。</small>
    > ![](https://hackmd.io/_uploads/ByBeMNGUh.png)

5. 若有需要，可以點擊右下方「下載成 Excel 檔」按鈕，系統會跳出讓使用者輸入檔名的互動視窗，點擊「下載」按鈕之後，即可取得存貨表格的 Excel 檔。
    > <small>下圖以紅框框起的即為「下載成 Excel 檔」按鈕。</small>
    > ![](https://hackmd.io/_uploads/SkSxf4G83.png)

    > <small>點擊「下載成 Excel 檔」按鈕後，會跳出輸入檔名的互動視窗，預設為「inventory_今天日期」。</small>
    > ![](https://hackmd.io/_uploads/BJqdmVf82.png)

#### 2.1.2 存貨系統輸出格式範例
存貨系統輸出格式依時間、地點分別為單選或複選分為三種格式。而原物料是單選或複選對於輸出格式無影響。
1. 時間複選、地點複選。
   縱軸為時間、地點以及原物料存貨基本資訊，一橫列為一筆存貨資料，輸出結果如下：
   ![](https://hackmd.io/_uploads/HkUFzVG8h.png)

2. 時間單選、地點複選。
   整張表格為選擇的時間的存貨表格，縱軸會依選擇的數個地點依序列出地點以及原物料存貨基本資訊，一橫列為一筆存貨資料，輸出結果如下：
   ![](https://hackmd.io/_uploads/HJUKGVf82.png)

3. 時間複選、地點單選。
   整張表格為選擇的地點的存貨表格，縱軸會依選擇的數個時間依序列出時間以及原物料存貨基本資訊，一橫列為一筆存貨資料，輸出結果如下：
   ![](https://hackmd.io/_uploads/H1IFGEGIn.png)

#### 2.1.3 錯誤預防機制
在此小節中會說明在使用存貨系統時，可能會遇到的錯誤以及可能發生的原因。
- 當「時間」、「地點」或是「物料」任一項未選擇，且直接點擊「預覽」按鈕時，會以提示視窗的方式跳出「請確認是否有選擇日期、地點及物料」的警示訊息，請使用者再次確認是否都有選擇欲查詢存貨資料的「時間、地點、物料」。

- 當確認選項無誤，並按下預覽按鈕後，系統會嘗試向資料庫取得所需要的內容，但若執行中出錯就會停止執行，並在畫面右上角回報錯誤：`後端發生錯誤：錯誤訊息`。由於此錯誤訊息為系統錯誤訊息，不確定錯誤來源且可能情況多變，請再向 IT 人員尋求技術上協助。

- 在剛進入存貨系統頁面時，系統會嘗試向資料庫取得當前的「設施」及「原物料」資訊，但若執行中出錯就會停止執行，並在畫面右上角回報錯誤：`無法從後端取得存貨初始資料：錯誤訊息`。由於此錯誤訊息為系統錯誤訊息，不確定錯誤來源且可能情況多變，請再向 IT 人員尋求技術上協助。

### 2.2 銷貨系統模組
&emsp;&emsp;使用者在此系統中可以取得特定時間、特定地點、特定品項的銷貨狀況。輸出的格式包括 CBT 表格、圓餅圖（同一個類別內不同品項之銷售佔比）、折線圖（不同品項在特定時間區段內之銷售狀況變化）。

> ![](https://hackmd.io/_uploads/HJ-eVDzL3.png)
> 點擊上方選單列中的「銷貨」按鈕，即可進入銷貨系統模組的介面，預設的時間選擇為當日之前七天，輸出格式為 CBT 表格。


#### 2.2.1 使用銷貨系統之流程（CBT 表格）
1. 選擇想看的時間，只能單選一個單日或是一個時段。
    > <small> 單選時間（一個單日，開始日期與結束日期都選同一日即為單日）： </small>
    > <img src="https://hackmd.io/_uploads/SJ-FJaeUn.png" style="width:230px;">

    > <small> 預設為當天日期往前一週：</small>
    > <img src="https://hackmd.io/_uploads/rJnC9Qf82.png" style="width:230px;">

2. 選擇想輸出的格式（CBT 表格）。
    > <small> 選擇 CBT 表格： </small>
    > ![](https://hackmd.io/_uploads/HyZOlTlU2.png)

3. 點擊「預覽」按鈕，使用者即可在網頁上預覽系統製作的銷貨 CBT 表格，檢查是否如預期所需。
    > <small>下圖以紅框框起的即為預覽按鈕，點擊之後介面會顯示查詢結果。</small>
    > ![](https://hackmd.io/_uploads/BkJAi7GI3.png)
    
4. 若有需要，可以點擊右下方「下載成 Excel 檔」按鈕，系統會跳出讓使用者輸入檔名的互動視窗，點擊「下載」按鈕之後，即可取得銷貨 CBT 表格的 Excel 檔。
    > <small>下圖以紅框框起的即為「下載成 Excel 檔」按鈕。</small>
    > ![](https://hackmd.io/_uploads/ByZS2QMUh.png)
    
    > <small>點擊「下載成 Excel 檔」按鈕後，會跳出輸入檔名的互動視窗，預設為「sell_今天日期」。</small>
    > ![](https://hackmd.io/_uploads/SJ29INfU3.png)
    
#### 2.2.2 使用銷貨系統之流程（圓餅圖）
1. 選擇想看的時間，只能單選一個單日或是一個時段。
    > <small> 單選時間（一個單日，開始日期與結束日期都選同一日即為單日）： </small>
    > <img src="https://hackmd.io/_uploads/SJ-FJaeUn.png" style="width:230px;">
    
2. 選擇想輸出的格式（圓餅圖）。
    > <small> 選擇圓餅圖： </small>
    > ![](https://hackmd.io/_uploads/Hk7iICxI2.png)

3. 此時系統介面會延展出地點及類別的選擇框，使用者可以任意單 / 複選想看的分店地點，以及單選想看的品項類別。此時若複選地點，系統會將所有選擇分店的銷貨量加總，再依各品項為單位計算出對應的銷貨量佔比。

4. 點擊「預覽」按鈕，使用者即可在網頁上預覽系統製作的銷貨圓餅圖，檢查是否如預期所需。
    > <small>下圖以紅框框起的即為預覽按鈕，點擊後下方介面可以預覽繪製的圓餅圖。</small>
    > ![](https://hackmd.io/_uploads/S1ypnXf8h.png)

5. 若有需要，可以點擊右下方「下載成 PNG 檔」按鈕，系統會跳出讓使用者輸入檔名的互動視窗，點擊「下載」按鈕之後，即可取得圓餅圖的 PNG 檔。
    > <small>下圖以紅框框起的即為「下載成 PNG 檔」按鈕。</small>
    > ![](https://hackmd.io/_uploads/BkN4amf82.png)

#### 2.2.3 使用銷貨系統之流程（折線圖）
1. 選擇想看的時間，只能單選一個單日或是一個時段。
    > <small> 單選時間（一個單日，開始日期與結束日期都選同一日即為單日）： </small>
    > <img src="https://hackmd.io/_uploads/SJ-FJaeUn.png" style="width:230px;">

2. 選擇想輸出的格式（折線圖）。
    > <small> 選擇折線圖： </small>
    > ![](https://hackmd.io/_uploads/SkhKPTxU3.png)
    
3. 此時系統介面會延展出地點及品項的選擇框，使用者可以任意單 / 複選想看的分店地點，以及任意單 / 複選想看的品項。此時若複選地點，系統將會把同個品項、不同地點視為不同組合，在折線圖上會繪製成不同條線。

4. 點擊「預覽」按鈕，使用者即可在網頁上預覽系統製作的折線圖，檢查是否如預期所需。
    > <small>下圖以紅框框起的即為預覽按鈕，點擊後下方介面可以預覽繪製的折線圖。</small>
    > ![](https://hackmd.io/_uploads/SyuDJNMI3.png)


5. 若有需要，可以點擊「下載成 PNG 檔」按鈕，系統會跳出讓使用者輸入檔名的互動視窗，點擊「下載」按鈕之後，即可取得折線圖的 PNG 檔。
    > <small>下圖以紅框框起的即為「下載成 PNG 檔」按鈕。</small>
    > ![](https://hackmd.io/_uploads/Sk5kA4zLn.png)

#### 2.2.4 銷貨系統輸出格式範例
##### CBT 表格
![](https://hackmd.io/_uploads/By0Ca7MI3.png)

##### 圓餅圖
<img src="https://hackmd.io/_uploads/Hkgr6mGLn.png" style="width:400px;">

##### 折線圖
![](https://hackmd.io/_uploads/HyluAXz8h.png)

#### 2.2.5 錯誤預防機制
在此小節中會說明在使用銷貨系統時，可能會遇到的錯誤以及可能發生的原因。
##### 整體
- 當確認選項無誤，並按下預覽按鈕後，系統會嘗試向資料庫取得所需要的內容，但若執行中出錯就會停止執行，並在畫面右上角回報錯誤：`後端發生錯誤：錯誤訊息`。由於此錯誤訊息為系統錯誤訊息，不確定錯誤來源且可能情況多變，請再向 IT 人員尋求技術上協助。

- 在剛進入銷貨系統頁面時，系統會嘗試向資料庫取得當前的「設施」、「類別」及「銷貨品項」資訊，但若執行中出錯就會停止執行，並在畫面右上角回報錯誤：`無法從後端取得銷貨初始資料：錯誤訊息`。由於此錯誤訊息為系統錯誤訊息，不確定錯誤來源且可能情況多變，請再向 IT 人員尋求技術上協助。

##### CBT 表格
- 若「分店、茶款、選搭、鮮萃茶、配料」這五個類別中，有任一類別裡沒有任何一項是使用中的項目（所有項目皆停用），就會無法製作 CBT 表。例如鮮萃茶裡所有的品項皆為停用狀態，此時若在銷貨系統要預覽 CBT 表格就會跳出警示訊息，無法預覽及下載 CBT 表格。

    > <small> 例子：若鮮萃茶中沒有任一個品項是「販賣中（使用中）」的狀態，點擊「預覽」會在右上角跳出警示訊息。 </small>
    > ![](https://hackmd.io/_uploads/S1xRmwMUh.png)

##### 圓餅圖
- 若「時間」、「地點」或是「類別」任一項未選擇，且直接點擊「預覽」按鈕時，系統會以提示視窗的方式跳出「請確認是否有選擇日期、地點及類別」的警示訊息，請使用者再次確認是否都有選擇欲製作成圓餅圖之銷貨資料的「時間、地點、類別」。

##### 折線圖
- 若「時間」、「地點」或是「品項」任一項未選擇，且直接點擊「預覽」按鈕時，系統會以提示視窗的方式跳出「請確認是否有選擇日期、地點及品項」的警示訊息，請使用者再次確認是否都有選擇欲製作成圓餅圖之銷貨資料的「時間、地點、品項」。


### 2.3 佔比訂貨系統模組
&emsp;&emsp;使用者在此系統中可以取得由特定時間、特定地點的銷貨狀況計算製作而成的佔比訂貨表。

> ![](https://hackmd.io/_uploads/By5VEDfIh.png)
> 點擊上方選單列中的「佔比訂貨」按鈕，即可進入佔比訂貨系統模組的介面。

#### 2.3.1 使用佔比訂貨系統之流程
1. 選擇想看的時間長度（最小單位為天，至多 365 天），決定系統將由過去多長的時間計算出佔比訂貨表。
    > <small> 可以使用拉桿調整時間長度： </small>
    > ![](https://hackmd.io/_uploads/B1yXxRe8h.png)

    > <small> 也可以使用右方顯示天數格子裡的上下鍵（以紅色方框框起處）調整時間長度： </small>
    > ![](https://hackmd.io/_uploads/r17IgAxL2.png)

2. 選擇想看的地點，可以單選分店類別裡的地點。
    > <small> 可以單選分店： </small>
    > ![](https://hackmd.io/_uploads/SyQBZReL3.png)

3. 點擊「預覽」按鈕，即可在網頁上預覽系統輸出的佔比訂貨表，檢查是否如預期所需。
    > <small> 下圖以紅框框起的即為預覽按鈕。 </small>
    > ![](https://hackmd.io/_uploads/SJHeGCg82.png)

4. 若有需要，可以點擊「下載成 Excel 檔」按鈕，系統會跳出讓使用者輸入檔名的互動視窗，點擊「下載」按鈕之後，即可取得佔比訂貨表的 Excel 檔。
    > <small>下圖以紅框框起的即為「下載成 Excel 檔」按鈕。</small>
    > ![](https://hackmd.io/_uploads/SyQgGPfUn.png)
    
    > <small>點擊「下載成 Excel 檔」按鈕後，會跳出輸入檔名的互動視窗，預設為「predict_今天日期」。</small>
    > ![](https://hackmd.io/_uploads/SkG8fwzU3.png)

#### 2.3.2 佔比訂貨系統輸出格式範例
##### 佔比訂貨表
![](https://hackmd.io/_uploads/rJsVZwfU3.png)

#### 2.3.3 錯誤預防機制
- 若「要往回看幾天？」或是「地點」沒有被輸入或選擇，且直接點擊「預覽」按鈕時，系統會以提示視窗的方式跳出「請確認是否有輸入天數以及選擇地點」的警示訊息，此時請使用者確認是否有設定「要往回看的天數」以及想看的「地點」。

- 當確認選項無誤，並按下預覽按鈕後，系統會嘗試向資料庫取得所需要的內容，但若執行中出錯就會停止執行，並在畫面右上角回報錯誤：`後端發生錯誤：錯誤訊息`。由於此錯誤訊息為系統錯誤訊息，不確定錯誤來源且可能情況多變，請再向 IT 人員尋求技術上協助。

- 在剛進入佔比訂貨系統頁面時，系統會嘗試向資料庫取得當前的「分店」資訊，但若執行中出錯就會停止執行，並在畫面右上角回報錯誤：`無法從後端取得佔比訂貨初始資料：錯誤訊息`。由於此錯誤訊息為系統錯誤訊息，不確定錯誤來源且可能情況多變，請再向 IT 人員尋求技術上協助。


---

## 3. 資料庫修改模組介紹與使用說明
 
&emsp;&emsp;使用者在此系統中可以利用前端介面，新增、修改資料庫中「類別（category)、設施（facility）、銷貨品項（item）、原物料（material）、存貨資料（inventory）、銷貨資料（sell）」六大表格。

&emsp;&emsp;在本章節中，我們將前四項分為不定期更新之資料，後兩項分為需定期匯入之資料說明，介紹如何使用前端介面中的功能修改資料庫。

> ![](https://hackmd.io/_uploads/SJ5D8DMI3.png)
> 點擊右上方的「資料庫修改」按鈕，即可進入資料庫修改模組的介面，下方有六大表格的按鈕，點擊欲修改表格的按鈕會跳轉至該表格的修改介面。

> ![](https://hackmd.io/_uploads/H1zWvPGUh.png)
> 以類別為例，若要回到資料庫修改的主頁面，可以按左上角的返回鍵（紅色框起處）。

### 3.1 不定期更新之資料
&emsp;&emsp;系統初始設定會需要基本的「類別（category）、設施（facility）、銷貨品項（item）、原物料（material）」。這四項為不定期更新的資料，一開始匯入資料庫後，若日後 COMEBUY 有調整，才需要公司同仁到資料庫修改模組更改。

#### 3.1.1 類別（category）
&emsp;&emsp;在類別（category）中可以更改各個類別的名稱。而在系統中將類別分成三類，分別「設施（facility）」中的類別、「銷售品項（item）」中的類別、「原物料（material）」中的類別，點擊各分類即可展開介面，顯示該類底下有哪些類別及其名稱。

> ![](https://hackmd.io/_uploads/Syh3UvGI2.png)
> 類別（category）介面。

> ![](https://hackmd.io/_uploads/ryOYOvG83.png)
> 點開「設施（facility）」，即可查看底下有的類別及其名稱。


##### 編輯類別（category）名稱
&emsp;&emsp;點擊類別名稱右方「編輯（筆的圖案）」按鈕，會跳出修改名稱的互動視窗。
> ![](https://hackmd.io/_uploads/B1tkFPfU2.png)
> 紅框框起處即為「編輯（筆的圖案）」按鈕。

1. 在互動視窗中的文字框輸入新的類別名稱。
2. 點擊「確認」按鈕即可修改該類別名稱。
3. 若想取消編輯，可以點擊「取消」按鈕或是互動視窗右上角的「叉號」按鈕。

    > ![](https://hackmd.io/_uploads/H1_MYvzUh.png)
    > 修改類別名稱互動視窗。

##### 錯誤預防機制：
- 若類別名稱的輸入框內為空白（類別名稱為空值），在按下確認按鈕時，系統會以提示視窗的方式跳出「未填入新的類別名稱」的警示訊息，請使用者再次確認是否有填寫新的類別名稱。

    > ![](https://hackmd.io/_uploads/SJCUnDz83.png)
    > 未填入類別名稱（類別名稱為空值）會跳出提示視窗。

#### 3.1.2 設施（facility）
&emsp;&emsp;在設施（facility）中可以新增一個新的設施，也可以修改資料庫中原有設施的名稱、所屬類別、使用狀態。

> ![](https://hackmd.io/_uploads/H12TRMZI3.png)
> 設施（facility）介面。

##### 新增設施（facility）
&emsp;&emsp;點擊標題「設施（facility）」旁的「加號」按鈕，會跳出新增一個設施的互動視窗。
> ![](https://hackmd.io/_uploads/rJNATPfL2.png)
> 紅框框起處即為「加號」按鈕，點擊可以新增設施。

1. 在互動視窗中填入新設施的編號、新設施的名稱以及所屬的類別。
2. 點擊「確認」按鈕即可新增一個新設施。新增之後，設施的編號就不能更改，需特別注意。
    > ![](https://hackmd.io/_uploads/rkxKpvGU2.png)
    > 新增設施的互動視窗。
3. 若想取消新增，可以點擊「取消」按鈕或是互動視窗右上角的「叉號」按鈕。
    
##### 編輯設施（facility）
&emsp;&emsp;點擊下方倉庫或分店，會展開兩個類別底下分別有的設施。點擊各設施名稱右方「編輯（筆的圖案）」按鈕，會跳出編輯設施的互動視窗。

1. 在編輯設施的互動視窗中，可以在文字框內編輯「設施名稱」與更新選擇設施的「所屬類別」。
2. 點擊「確認」按鈕即可完成編輯。
3. 若想取消編輯，可以點擊「取消」按鈕或是互動視窗右上角的「叉號」按鈕。
    > ![](https://hackmd.io/_uploads/S1BPAPzUh.png)
    > 修改設施的互動視窗。

4. 點擊各設施右方切換鍵可以切換設施的使用狀態（啟用 / 停用）。
    > ![](https://hackmd.io/_uploads/BJ9rADGIh.png)
    > 紅框內為切換設施使用狀態的切換鍵。

##### 錯誤預防機制：
###### 新增設施（facility）
- 若未輸入設施編號、設施名稱或是沒有選擇所屬類別，在按下確認按鈕時，都會跳出相對應的警示訊息，請使用者再次確認是否都有確實填入資料。

- 若「欲新增設施的編號」與「資料庫原有設施的編號」相同，將無法新增設施並跳出警示訊息。請使用者確實地確認是否給定新設施一組新的、不重複的編號。

###### 修改設施（facility）
- 若設施名稱為空白（未填入新名稱），在按下確認按鈕時，會跳出相對應的警示訊息，請使用者再次確認是否有填入新名稱，系統無法將設施名稱改為空值。

#### 3.1.3 銷貨品項（item）
&emsp;&emsp;在銷貨品項（item）中可以新增一個新的銷貨品項，也可以修改資料庫中原有銷貨品項的資料。

> ![](https://hackmd.io/_uploads/HyN4pdMIh.png)
> 銷貨品項（item）介面。

##### 新增銷貨品項（item）
&emsp;&emsp;點擊標題「銷貨品項（item）」旁的「加號」按鈕，會跳出新增一個銷貨品項的互動視窗。

1. 在互動視窗中填入新銷貨品項的編號、名稱，選擇是否記杯（在系統中計算總杯數時是否會計入）以及所屬的類別。新增之後，銷貨品項的編號就不能更改，需特別注意。
    > ![](https://hackmd.io/_uploads/rkxEAuMI2.png)
    > 輸入新銷貨品項資料的互動視窗。

2. 點擊「選擇銷貨品項成分」按鈕，會跳出新增品項成分的互動視窗，在此設定該品項是由什麼原物料組成以及組成的份數。每新增一項原物料成分都需按右邊的「打勾」按鈕，若需刪除已新增的成分則是按「刪除（垃圾桶圖案）」按鈕。
    > ![](https://hackmd.io/_uploads/HJ_KCdfU2.png)
    > 新增銷貨品項成分的互動視窗。

    > ![](https://hackmd.io/_uploads/B1lC0_GL2.png)
    > 新增原物料成分需按右邊的「打勾」按鈕，若需刪除已新增的成分則是按「刪除（垃圾桶圖案）」按鈕。

3. 確認所有成分無誤之後，點擊「確認」按鈕會回到原先新增品項的互動視窗。點擊新增品項互動視窗的「確認」按鈕即可新增銷貨品項。
   需特別注意，只有在點擊「新增品項互動視窗」的「確認」按鈕才會將新增的品項資料存入資料庫，「新增品項成分互動視窗」中的確認只會暫存在介面上，並不會存入資料庫，務必需點擊「新增品項互動視窗」的「確認」按鈕以完成新增銷貨品項。
4. 若想取消新增，可以點擊「取消」按鈕或是互動視窗右上角的「叉號」按鈕。
    > ![](https://hackmd.io/_uploads/BkDO1YfLn.png)
    > 填入所有銷貨品項所需資料後，可以點擊「確認」按鈕新增銷貨品項。


##### 編輯銷貨品項（item）
&emsp;&emsp;點擊介面下方銷貨品項類別，會展開該類別底下有的銷貨品項。點擊各銷貨品項名稱右方「編輯（筆的圖案）」按鈕，會跳出編輯銷貨品項的互動視窗。

1. 在編輯品項的互動視窗中，可以編輯「品項名稱、是否記杯、所屬類別」。點擊「選擇品項成分」按鈕，會跳出編輯品項成分的互動視窗，可以修改該品項使用哪些原物料（material）作為成分。
   需特別注意，只有在點擊「編輯品項互動視窗」的「確認」按鈕才會將修改結果存入資料庫，「編輯品項成分互動視窗」中的確認只會將對成分的編輯暫存在介面上，並不會存入資料庫，務必需點擊「編輯品項互動視窗」的「確認」按鈕以完成編輯。
    > ![](https://hackmd.io/_uploads/H1rHWtzL2.png)
    > 編輯銷貨品項（item）之品項名稱、是否記杯、所屬類別的互動視窗。

    > ![](https://hackmd.io/_uploads/r1_mbtfLh.png)
    > 編輯銷貨品項（item）之品項成分的互動視窗。

2. 確認修改內容無誤後，點擊「確認」按鈕即可完成編輯。
3. 若想取消編輯，可以點擊「取消」按鈕或是互動視窗右上角的「叉號」按鈕。

4. 點擊各品項右方切換鍵可以切換銷貨品項（item）使用狀態（啟用 / 停用）。
    > ![](https://hackmd.io/_uploads/ryLqNKMU3.png)
    > 紅框內為切換銷貨品項使用狀態的切換鍵。

##### 錯誤預防機制：
###### 整體
- 新增 / 修改品項成分時，任一品項都必須要有至少一個原物料（material）作為成分，而任一個原物料成分都至少要有 1 份，系統無法儲存將品項成分全數刪除或是將成分份數改為小於 1 份的資料。

- 原物料成分的份數格式限制為必須填入數字。

- 同一個品項中的原物料成分不能重複新增同一個原物料，若輸入此錯誤情形將會無法存入資料庫，並且跳出成分重複之警示訊息。
  > ![](https://hackmd.io/_uploads/SkrV7qGI3.png)
  > 此為錯誤示範，若在一個品項中新增兩筆常溫晶球(海外)作為品項成分，將無法存入資料庫。
  > ![](https://hackmd.io/_uploads/SkB145zL3.png)
  > 成分重複之警示訊息。

###### 新增銷貨品項（item）
- 若未輸入銷貨品項編號、銷貨品項名稱或是沒有選擇所屬類別、品項成分，在按下「確認」按鈕時，都會跳出相對應的警示訊息，請使用者再次確認是否都有確實填入資料。

- 若「欲新增銷貨品項的編號」與「資料庫原有銷貨品項的編號」相同，將無法新增銷貨品項並跳出警示訊息。請使用者確實地確認是否給定新銷貨品項一組新的、不重複的編號。

###### 修改銷貨品項（item）
- 若銷貨品項名稱為空白（未填入新名稱）或是品項成分為空白（未選擇品項成分），在按下「確認」按鈕時，會跳出相對應的警示訊息，請使用者再次確認是否有正確填入資料，因系統無法儲存將任一銷貨品項相關資料改為空值的更改。

#### 3.1.4 原物料（material）
&emsp;&emsp;在原物料（material）中可以新增一個新的原物料，也可以修改資料庫中原有原物料的資料。

> ![](https://hackmd.io/_uploads/Sk2CKFzU2.png)
> 原物料（material）介面

##### 新增原物料（material）
&emsp;&emsp;點擊標題「原物料（material）」旁的「加號」按鈕，會跳出新增一個原物料的互動視窗。

1. 在互動視窗中填入原物料的編號、名稱、規格（最小單位有多少 g、 每箱有多少單位、單位名稱）、使用量以及所屬類別。新增之後，原物料的編號就不能更改，需特別注意。
    > ![](https://hackmd.io/_uploads/rkCSsFfL2.png)
    > 輸入新原物料資料的互動視窗。

2. 確認新原物料的資料無誤之後，點擊「確認」按鈕即可新增原物料。 
    > ![](https://hackmd.io/_uploads/B1RBoKGU2.png)
    > 若確認欲新增的原物料資料都填寫正確、完整，即可點擊「確認」按鈕新增原物料。

4. 若想取消新增，可以點擊「取消」按鈕或是互動視窗右上角的「叉號」按鈕。

##### 編輯原物料（material）
&emsp;&emsp;點擊介面下方原物料類別，會展開該類別底下有的原物料。點擊各原物料名稱右方「編輯（筆的圖案）」按鈕，會跳出編輯原物料的互動視窗。

1. 在編輯原物料的互動視窗中，可以編輯原物料的編號、名稱、規格（最小單位有多少 g、 每箱有多少單位、單位名稱）、使用量以及所屬類別。
    > ![](https://hackmd.io/_uploads/S1ryjtGI2.png)
    > 編輯原物料資料的互動視窗。

2. 確認原物料修改內容無誤後，點擊「確認」按鈕即可完成編輯。

3. 若想取消新增，可以點擊「取消」按鈕或是互動視窗右上角的「叉號」按鈕。

##### 錯誤預防機制：
###### 整體
- 規格（最小單位有多少 g、 每箱有多少單位、單位名稱）有輸入格式限制：「最小單位有多少 g、 每箱有多少單位」須為數字，單位名稱則為字串，若格式錯誤將無法存入資料庫。

- 使用量須填入數字，若非數字將無法存入資料庫。

###### 新增原物料（material）
- 若未輸入原物料編號、原物料名稱或是沒有選擇所屬類別以及成份相關數值、單位，在按下「確認」按鈕時，都會跳出相對應的警示訊息。請使用者再次確認是否都有確實填入資料。

- 若「欲新增原物料的編號」與「資料庫原有原物料的編號」相同，將無法新增原物料並跳出警示訊息。請使用者確實地確認是否給定新原物料一組新的、不重複的編號。

###### 編輯原物料（material）
- 若原物料名稱為空白（未填入新名稱）或是成份相關數值、單位為空白（未填入成份相關數值、單位），在按下「確認」按鈕時，會跳出相對應的警示訊息。請使用者再次確認是否有正確填入資料，因系統無法儲存將任一原物料相關資料改為空值的更改。

### 3.2 需定期匯入之資料
&emsp;&emsp;存貨資料（inventory）、銷貨資料（sell）此兩項表格則是需要由公司同仁定期上傳至資料庫的資料。當公司定期盤點倉庫及分店存貨量、統整各分店銷貨狀況時，就需要同仁幫忙上傳盤點紀錄及銷貨紀錄資料至資料庫。

#### 3.2.1 存貨資料（inventory）
&emsp;&emsp;在存貨資料（inventory）中可以匯入倉庫或分店的定期盤點資料，詳細 Excel 檔案格式限制請參閱 4.1 存貨資料（inventory）格式要求。

> ![](https://hackmd.io/_uploads/HkM1JyzL3.png)
> 存貨資料（inventory）介面

1. 點擊「點擊選擇檔案」，會跳出選擇上傳檔案的視窗。
    > ![](https://hackmd.io/_uploads/B1XAwMGI2.png)
    > 點擊「點擊選擇檔案」後跳出的視窗，可以選擇欲上傳的檔案。

2. 選擇檔案後，介面會顯示該檔案的資料筆數、日期範圍、地點的基本資料。最下方有「是否覆寫」的切換鍵，可以選擇此次欲上傳的檔案是否要覆寫先前的資料。
    > ![](https://hackmd.io/_uploads/BydCHkGIn.jpg)
        > 選擇檔案之後的畫面。

3. 若選擇覆寫，系統會去比對「此次選擇檔案中的資料」與「資料庫中的存貨資料」是否有「時間、地點、品項」皆相同的資料。若有相同的資料，將會以新上傳的資料取代資料庫原有的資料。覆寫功能主要是用在需要修改存貨資料的時候，可以以直接上傳一份新的存貨資料的方式，取代已上傳至資料庫的舊資料。
    > ![](https://hackmd.io/_uploads/ryhDIGzLn.jpg)
    > 紅框框起處的是「是否覆寫」的切換鍵。

4. 點擊上傳鍵，會跳出確認是否要上傳的視窗，按下確認之後即可上傳存貨資料。
    > ![](https://hackmd.io/_uploads/BydwDzGLn.jpg)
    > 點擊右方藍色上傳按鈕（紅框框起處）可以上傳存貨資料。

    > ![](https://hackmd.io/_uploads/HJNaOMz83.png)
    > 確認是否要上傳的視窗。

    > ![](https://hackmd.io/_uploads/rJGZtGzL2.png)
    > 上傳成功之介面。

##### 錯誤預防機制：
- 若未選擇檔案，直接按下上傳按鈕會跳出警示訊息，無法上傳資料。

- 系統只接受 Excel 檔案上傳，選擇的檔案名稱若非 **.xls** 或 **.xlsx** ，按下上傳按鈕會跳出警示訊息，請使用者改為上傳 Excel 檔案。

- 檔案中若沒有「存貨日期」欄位，會在前端介面中的檔案基本資料處顯示日期格式錯誤，按下上傳按鈕會跳出警示訊息，請再次查看欲上傳檔案是否包含「存貨日期」欄位。

- 檔案中若沒有「存貨地點」欄位，會在前端介面中的檔案基本資料處顯示地點格式錯誤，按下上傳按鈕會跳出警示訊息，請再次查看欲上傳檔案是否包含「存貨地點」欄位。

- 若上傳資料失敗，會跳出警示訊息，並且自動下載將「發生錯誤的欄位標示紅色」的 Excel 檔案，請使用者查看該檔案確認欲上傳的檔案有哪裡發生錯誤，修改過後再次上傳至系統。
    > ![](https://hackmd.io/_uploads/BJfKm4mI3.png)
    > 上傳失敗的警示訊息。
    
    > ![](https://hackmd.io/_uploads/B139jtZt3.png)
    > 回報錯誤的 Excel 檔案。


#### 3.2.2 銷貨資料（sell）
&emsp;&emsp;在銷貨資料（sell）中可以匯入各分店銷貨狀況的資料，詳細 Excel 檔案格式限制請參閱 4.2 銷貨資料（sell）格式要求。

> ![](https://hackmd.io/_uploads/HJPJ9zzI3.png)
> 銷貨資料（sell）介面

1. 點擊「點擊選擇檔案」，會跳出選擇上傳檔案的視窗。
    > ![](https://hackmd.io/_uploads/r1lDfqGM8h.png)
    > 點擊「點擊選擇檔案」後跳出的視窗，可以選擇欲上傳的檔案。

2. 選擇檔案後，介面會顯示該檔案的資料筆數、日期範圍、地點的基本資料。最下方有「是否覆寫」的切換鍵，可以選擇此次欲上傳的檔案是否要覆寫先前的資料。
    > ![](https://hackmd.io/_uploads/SyDMqMzLn.png)
    > 選擇檔案之後的畫面。
3. 若選擇覆寫，系統會去比對「此次選擇檔案中的資料」與「資料庫中的銷貨資料」是否有「時間、地點、品項」皆相同的資料。若有相同的資料，將會以新上傳的資料取代資料庫原有的資料。覆寫功能主要是用在需要修改銷貨資料的時候，可以以直接上傳一份新的銷貨資料的方式，取代已上傳至資料庫的舊資料。
    > ![](https://hackmd.io/_uploads/BJnisfGIh.png)
    > 紅框框起處的是「是否覆寫」的切換鍵。

4. 點擊上傳鍵，會跳出確認是否要上傳的視窗，按下確認之後即可上傳存貨資料。
    > ![](https://hackmd.io/_uploads/rJ-rnGM8n.png)
    > 點擊右方藍色上傳按鈕（紅框框起處）可以上傳存貨資料。

    > ![](https://hackmd.io/_uploads/rJwfczML3.png)
    > 確認是否要上傳的視窗。

    > ![](https://hackmd.io/_uploads/BkwGqGG82.png)
    > 上傳成功之介面。

##### 錯誤預防機制：
- 若未選擇檔案，直接按下上傳按鈕會跳出警示訊息，無法上傳資料。

- 系統只接受 Excel 檔案上傳，選擇的檔案名稱若非 **.xls** 或 **.xlsx** ，按下上傳按鈕會跳出警示訊息，請使用者改為上傳 Excel 檔案。

- 檔案中若沒有「銷貨日期」欄位，會在前端介面中的檔案基本資料處顯示日期格式錯誤，按下上傳按鈕會跳出警示訊息，請再次查看欲上傳檔案是否包含「銷貨日期」欄位。

- 檔案中若沒有「銷貨地點」欄位，會在前端介面中的檔案基本資料處顯示地點格式錯誤，按下上傳按鈕會跳出警示訊息，請再次查看欲上傳檔案是否包含「銷貨地點」欄位。

### 3.3 整體資料庫修改錯誤預防機制
- 以上所有的新增、編輯、啟用 / 停用等動作，若在未與資料庫成功連線時執行，將回報資料庫連線失敗；除了前一節的提到錯誤預防機制之外，一切造成資料庫無法存入檔案之因素，將回報格式錯誤，需使用者再次檢查後上傳。

- 以上所有的新增、編輯、啟用 / 停用等動作，若資料傳遞過程中出錯就會停止執行，並在畫面右上角回報錯誤：`後端發生錯誤：錯誤訊息`。由於此錯誤訊息為系統錯誤訊息，不確定錯誤來源且可能情況多變，請再向 IT 人員尋求技術上協助。

- 在剛進入資料庫修改系統頁面時，系統會嘗試向資料庫取得當前的「類別」、「設施」、「銷貨品項」及「原物料」資訊，但若執行中出錯就會停止執行，並在畫面右上角回報錯誤：`無法從後端取得資料庫修改初始資料：錯誤訊息`。由於此錯誤訊息為系統錯誤訊息，不確定錯誤來源且可能情況多變，請再向 IT 人員尋求技術上協助。

- 若上傳資料失敗，會跳出警示訊息，並且自動下載將「發生錯誤的欄位標示紅色」的 Excel 檔案，請使用者查看該檔案確認欲上傳的檔案有哪裡發生錯誤，修改過後再次上傳至系統。
    > ![](https://hackmd.io/_uploads/BJmPxNXUh.png)
    > 上傳失敗的警示訊息。
    
    > ![](https://hackmd.io/_uploads/S1fZ3FZt3.png)
    > 回報錯誤的 Excel 檔案。

## 4. 上傳資料格式
&emsp;&emsp;本章節將介紹上傳資料（Excel 表格）的格式要求。

### 4.1 存貨資料（inventory）格式要求
&emsp;&emsp;要匯入系統資料庫的存貨資料為 Excel 檔，在此小節中會說明存貨資料表格的格式限制。上傳存貨資料（Excel 表格）之流程請參閱 3.2.1 存貨資料（inventory）。

> 範例 Excel：
> ![](https://hackmd.io/_uploads/Sy9CbO-tn.png)

1. 檔案限制
    + 副檔名須為 **.xls** 或 **.xlsx**（Excel 檔案）。
    + Excel 檔案中只能有一個工作表（sheet）。
2. 存貨地點限制
    + 存貨地點以**設施名稱**為準。
    + 存貨地點必須與**資料庫中已有**，且是**啟用中**的設施名稱**一模一樣**。
    + 存貨地點放在**A1 資料格**中（可以合併儲存格）。
3. 存貨日期限制
    + 存貨日期以 **Excel 內建的日期格式**儲存。
    + 存貨日期放在整個資料表中**倒數第四行（column）**、**第三列（row）**。（如上圖的 O 欄第三列 03/02）
    + 注意：系統只會看**倒數第四行**的資料，因此同仁們**不需要**把其他存貨資料刪除，只需要確保希望存入的資料在倒數第四行即可。
4. 存貨品項限制
    + 存貨品項以**物料編號**為準。
    + 物料編號必須與**資料庫中已有**，且是**啟用中**的物料編號**一模一樣**。
    + 存貨品項放在 **A 行**，從**第四列**開始（如上圖的 B010033）。
    + 最後一列放統計資料。該列資料**不會存入資料庫**。
5. 存貨量限制
    + 存貨量放在**倒數第四行**，從**第四列**開始。
    + 最後一列放統計資料。該列資料**不會存入資料庫**。
    + 沒有值的話就會以 0 存入資料庫
6. 有效期限制
    + 有效期放在**倒數第二行**，從**第四列**開始。
    + 最後一列放統計資料。該列資料**不會存入資料庫**。

### 4.2 銷貨資料（sell）格式要求
&emsp;&emsp;要匯入系統資料庫的銷貨資料為 Excel 檔，格式可為「加料報表」或「產品銷售彙總(多店)」兩種。在此小節中會說明銷貨資料表格的格式限制。上傳銷貨資料（Excel 表格）之流程請參閱 3.2.2 銷貨資料（sell）。

#### 4.2.1 格式一：加料報表
> 範例 Excel：
> ![](https://hackmd.io/_uploads/S1nIlKbth.png)

1. 檔案限制
    + 副檔名須為 **.xls** 或 **.xlsx**（Excel 檔案）。
    + 檔案中**只能有一個**工作表（sheet）。
    + 工作表名稱須為「**加料報表**」。
2. 銷貨地點限制
    + 銷貨地點以**設施編號**為準。
    + 設施編號必須與**資料庫中已有**，且是**啟用中**的設施編號**一模一樣**。
    + 設施編號放在 **B1 資料格**中。
3. 銷貨日期限制
    + 銷貨日期放在 **B3 資料格**中。
    + 格式須為「**YYYY-MM-DD 至 YYYY-MM-DD**」，第一個日期與中文字「至」中間以**半形空格**隔開。
    + 以**第一個日期**為準。
4. 銷貨品項限制
    + 銷貨品項以**品項編號**為準。
    + 品項編號必須與**資料庫中已有**，且是**啟用中**的品項編號**一模一樣**。
    + 銷貨品項放在 **A 行**，從**第七列**開始。
    + 最後一列放統計資料。該列資料**不會存入資料庫**。
5. 銷貨量限制
    + 銷貨量放在 **D 行**，從**第七列**開始。
    + 最後一列放統計資料。該列資料**不會存入資料庫**。

#### 4.2.1 格式二：產品銷售彙總(多店)
> 範例 Excel：
> ![](https://hackmd.io/_uploads/B15LGF-tn.png)

1. 檔案限制
    + 副檔名須為 **.xls** 或 **.xlsx**（Excel 檔案）。
    + 檔案中**只能有一個**工作表（sheet）。
    + 工作表名稱**不可**為「加料報表」。
2. 銷貨地點限制
    + 銷貨地點以**設施編號**為準。
    + 設施編號必須與**資料庫中已有**，且是**啟用中**的設施編號**一模一樣**。
    + 設施編號放在**第四列**，從 **C 行**開始。 
    + 格式為「**設施編號-設施名稱**」。中間以**半形**「**-**」隔開。
3. 銷貨日期限制
    + 銷貨日期放在 **B1 資料格**中。
    + 格式須為「**YYYY-MM-DD 至 YYYY-MM-DD**」，第一個日期與中文字「至」中間以**半形空格**隔開。
    + 以**第一個日期**為準。
4. 銷貨品項限制
    + 銷貨品項以**品項編號**為準。
    + 品項編號必須與**資料庫中已有**，且是**啟用中**的品項編號**一模一樣**。
    + 銷貨品項放在 **A 行**，從**第五列**開始。
    + 最後一列放統計資料。該列資料**不會存入資料庫**。
5. 銷貨量限制
    + 銷貨量從 **C 行**，從**第五列**開始。
    + 最後一列放統計資料。該列資料**不會存入資料庫**。