使用chatGPT製作費用試算表

(一)事前規劃

1. 完整思考：
   • 整案目標：參考港務公司費率表，試算郵輪的碇泊費、旅客服務費。
   • 使用介面：提供每個人都可自行輸入試算
2. 費率相關欄位
   • 碇泊費：依總噸位、停泊時間表計費
   • 旅客服務費：依出港人數每人460元計算
3. 方便分享的使用介面：網頁檔HTML／GAS(Google Apps Script)

(二)實作範例：網頁檔

1. 將費率表重點截圖(Windows + PrintScreen)、直接在ChatGPT貼上(可多張)，並下prompt：

請幫我寫一個費用試算的html介面
收費項目包括碇泊費、旅客服務費

幫我設計apple介面可輸入
- 停泊起始時間(日曆元件、下拉時間)
- 停泊結束時間
- 需計費旅客人數
最後幫我計算出各別碇泊費、旅客服務費，及加總費用

2. 在chatGPT複製後，另開記事本存成html檔、編碼改為UTF-8，即可直接使用。如果要給別人用，也直接傳遞html檔給別人後即可直接使用。

3. html成果展示，使用html檔的優點是：
   - 介面可有互動：可融合javascript前端程式有日曆、下拉選單、代填預設值之類的
   - 有瀏覽器就能執行，無需找平台主機放
   

(三)實作範例：可分享的網頁

• 什麼是GAS：
  全名為Google Apps Script，由Google開發可直接與其Google Workspace 應用程式整合（如 Google Sheets、Docs、Forms 等）的程式。
• 什麼場合會用到GAS
  • 希望以固定網址提供服務，如果版本修改了仍能維持同一統一網址不需變動。
  • 可收集資料直接放進Google Sheet，後續可作類似試算表的進一步處理。
  • 想要更多的後端程式功能，例：定時執行、有收到新資料就email通知...。

1. 接續上一個範例，透過chatGPT產生prompt：

幫我改成GAS環境可執行的程式
仍是用html網頁的方式來提供所有知道網址的人能進行試算

它會分別產生Code.gs（GAS 後端）、index.html（前端表單）兩個檔案。等下分別貼到GAS裡面去。

2. 這裡以Google Sheet為GAS的範例，先新增：
   • 到Google雲端硬碟新增一個Google Sheet，隨便取個「郵輪費用試算」檔名先存檔
   • 擴充功能＞Apps Script

3. 依chatGPT的指示先新增Code.gs、index.html：
   • 左上角＞按＋＞指令碼，新增Code.gs，將相關程式從chatGPT複製過來貼上
   • 左上角＞按＋＞HTML，新增index.html，將相關程式從chatGPT複製過來貼上

4. 在GAS發佈成網頁：

• 右上角＞部署＞新增部署作業

• 在開啟的視窗左上角齒輪＞按網頁應用程式。誰可以存取：改所有人，然後按部署。

• 成功後會產生一串網址，按下即可開啟，複製給別人直接即可連結。按下完成即可離開。
  

• 成果網頁，過程中可能會叫你提供Google 授權，直接一步步同意即可。

5. 忘了網址怎麼辦？

• 右上角＞部署＞管理部署作業，會看到歷次的版本，未來如果比較常用，各版本的說明欄可稍微註解以後會比較好辨識。例：這是正式版，4/9提供給各港。可直接提供不同的版本網址給其他使用者即可。
  

5. 增加功能：後來才想到碇泊費有尖峰加成、旅客服務有可能折扣，沒關係，想到就下prompt叫chatGPT修改，然後將新程式各別貼到Code.gs、index.html

1. 加上「尖峰加成10%（週五～週日）」的計算，如果有符合尖峰加成，最後的計算結果要特別標示說明
2. 旅客服務費下增加下拉選單可打折，包括不打折、9、8、7、6、5等選項，一樣如果有打折要特別標示

6. 在GAS中重新發佈成網頁：

• 這次改用右上角＞部署＞管理部署作業，然後建立新版本，進行部署。這樣的方式可確保公佈的網址不用改變。
  

• 成果網頁
  

最後完成的Google Sheet（含GAS程式）在這裡。