정산 - 합계 추가

src/views/Calculate/CalculateLive.vue

@@ -55,20 +55,19 @@
             class="elevation-1"
             hide-default-footer
           >
-            <template v-slot:item.email="{ item }">
-              {{ item.email }}
-            </template>
-
-            <template v-slot:item.nickname="{ item }">
-              {{ item.nickname }}
-            </template>
-
-            <template v-slot:item.date="{ item }">
-              {{ item.date }}
-            </template>
-
-            <template v-slot:item.title="{ item }">
-              {{ item.title }}
+            <template slot="body.prepend">
+              <tr>
+                <td colspan="5">
+                  합계
+                </td>
+                <td>{{ sumField('numberOfPeople').toLocaleString() }} 명</td>
+                <td>{{ sumField('totalAmount').toLocaleString() }} 캔</td>
+                <td>{{ sumField('totalKrw').toLocaleString() }} 원</td>
+                <td>{{ sumField('paymentFee').toLocaleString() }} 원</td>
+                <td>{{ sumField('settlementAmount').toLocaleString() }} 원</td>
+                <td>{{ sumField('tax').toLocaleString() }} 원</td>
+                <td>{{ sumField('depositAmount').toLocaleString() }} 원</td>
+              </tr>
             </template>
 
             <template v-slot:item.entranceFee="{ item }">
@@ -145,7 +144,7 @@ export default {
           field: "entranceFee",
         },
         {
-          label: "인원",
+          label: "유료방참여인원",
           field: "numberOfPeople",
         },
         {
@@ -204,7 +203,7 @@ export default {
           value: 'entranceFee',
         },
         {
-          text: '인원',
+          text: '유료방참여인원',
           align: 'center',
           sortable: false,
           value: 'numberOfPeople',
@@ -280,6 +279,10 @@ export default {
       this.$dialog.notify.success(message)
     },
 
+    sumField(key) {
+      return this.items.reduce((a, b) => a + (b[key] || 0), 0)
+    },
+
     async getCalculateLive() {
       this.is_loading = true