Update app.py

app.py

@@ -34,20 +34,17 @@ def get_sheet_names():
 def ensure_headers(sheet_name):
     try:
         sheets_service = build('sheets', 'v4', credentials=CREDENTIALS)
-        
         headers = [
-            ['姓名 Name', '學號 Student ID', '購買商品 Product', 
-             '金額 Cost', '發票檔案 Receipt File', '時間 Timestamp', 'IP位址 IP Address']
+            ['項目 Item', '總金額 Total Cost', '發票檔案 Receipt File', '時間 Timestamp', 'IP位址 IP', '付款明細 Payment Details']
         ]
         
         sheets_service.spreadsheets().values().update(
             spreadsheetId=SPREADSHEET_ID,
-            range=f'{sheet_name}!A1:G1',
+            range=f'{sheet_name}!A1:F1',
             valueInputOption='RAW',
             body={'values': headers}
         ).execute()
         
-        # Format headers
         requests = [{
             'repeatCell': {
                 'range': {
@@ -116,6 +113,10 @@ HTML_TEMPLATE = '''
         button:hover { 
             background-color: #45a049; 
         }
+        button:disabled {
+            background-color: #cccccc;
+            cursor: not-allowed;
+        }
         #status { 
             margin-top: 20px; 
             padding: 15px;
@@ -139,10 +140,12 @@ HTML_TEMPLATE = '''
         .remove-person {
             background-color: #dc3545;
             margin-top: 10px;
+            width: auto;
         }
         #add-person {
             margin-bottom: 20px;
             background-color: #17a2b8;
+            width: auto;
         }
         .total-cost {
             font-size: 1.2em;
@@ -164,7 +167,7 @@ HTML_TEMPLATE = '''
         </div>
 
         <div class="form-group">
-            <label for="product">購買商品 Product:</label>
+            <label for="product">購買項目 Item:</label>
             <input type="text" id="product" name="product" required>
         </div>
         
@@ -177,18 +180,19 @@ HTML_TEMPLATE = '''
             <!-- Person entries will be added here -->
         </div>
 
-        <button type="button" id="add-person">新增人員 Add Person</button>
+        <button type="button" id="add-person">新增付款人 Add Person</button>
 
         <div class="total-cost">
             總金額 Total Cost: <span id="total">0</span>
         </div>
         
-        <button type="submit">提交 Submit</button>
+        <button type="submit" id="submitBtn">提交 Submit</button>
     </form>
     <div id="status"></div>
 
     <script>
         let personCounter = 0;
+        const maxPersons = 10;  // Maximum number of persons allowed
 
         function createPersonEntry() {
             const container = document.createElement('div');
@@ -223,12 +227,16 @@ HTML_TEMPLATE = '''
         function removePerson(button) {
             button.parentElement.remove();
             updateTotal();
+            document.getElementById('add-person').disabled = document.getElementsByClassName('person-entry').length >= maxPersons;
         }
 
         document.getElementById('add-person').addEventListener('click', () => {
             const container = document.getElementById('people-container');
-            container.appendChild(createPersonEntry());
-            personCounter++;
+            if (container.children.length < maxPersons) {
+                container.appendChild(createPersonEntry());
+                personCounter++;
+                document.getElementById('add-person').disabled = container.children.length >= maxPersons;
+            }
         });
 
         // Add initial person entry
@@ -237,11 +245,16 @@ HTML_TEMPLATE = '''
         document.getElementById('purchaseForm').addEventListener('submit', async (e) => {
             e.preventDefault();
             
+            const submitBtn = document.getElementById('submitBtn');
+            if (submitBtn.disabled) return;
+            
             if (document.getElementsByName('names[]').length === 0) {
-                alert('請至少新增一個人員 Please add at least one person');
+                alert('請至少新增一個付款人 Please add at least one person');
                 return;
             }
 
+            submitBtn.disabled = true;
+            
             const status = document.getElementById('status');
             status.style.display = 'block';
             status.textContent = '提交中... Submitting...';
@@ -271,6 +284,8 @@ HTML_TEMPLATE = '''
             } catch (error) {
                 status.className = 'error';
                 status.textContent = '提交錯誤 Error submitting form';
+            } finally {
+                submitBtn.disabled = false;
             }
         });
     </script>
@@ -293,6 +308,15 @@ def submit():
         student_ids = request.form.getlist('studentIds[]')
         costs = request.form.getlist('costs[]')
 
+        # Calculate total
+        total_cost = sum(float(cost) for cost in costs)
+
+        # Create payment details string
+        payment_details = []
+        for name, student_id, cost in zip(names, student_ids, costs):
+            payment_details.append(f"{name}({student_id}): ${cost}")
+        payment_details_str = " | ".join(payment_details)
+
         # Upload file to Drive
         drive_service = build('drive', 'v3', credentials=CREDENTIALS)
         
@@ -324,16 +348,21 @@ def submit():
         timestamp = datetime.datetime.now().strftime('%Y-%m-%d %H:%M:%S')
         ip_address = request.remote_addr
 
-        # Create entries for each person
-        values = []
-        for name, student_id, cost in zip(names, student_ids, costs):
-            values.append([name, student_id, product, cost, file_url, timestamp, ip_address])
+        # Create single row entry
+        values = [[
+            product,
+            total_cost,
+            file_url,
+            timestamp,
+            ip_address,
+            payment_details_str
+        ]]
 
         body = {'values': values}
         
         sheets_service.spreadsheets().values().append(
             spreadsheetId=SPREADSHEET_ID,
-            range=f'{sheet_name}!A:G',
+            range=f'{sheet_name}!A:F',
             valueInputOption='USER_ENTERED',
             body=body
         ).execute()