From bb682522ce2e18f7c67f087620134d3aadba559d Mon Sep 17 00:00:00 2001
From: Mila <Mila@pollex.com.tw>
Date: 星期二, 16 十一月 2021 21:00:50 +0800
Subject: [PATCH] update 預約清單: 使用 store 存放 AppointmentList

---
 PAMapp/components/Client/ClientCard.vue |   19 +++++++++++++++----
 1 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/PAMapp/components/Client/ClientCard.vue b/PAMapp/components/Client/ClientCard.vue
index 398ef8e..2a2eef9 100644
--- a/PAMapp/components/Client/ClientCard.vue
+++ b/PAMapp/components/Client/ClientCard.vue
@@ -1,6 +1,6 @@
 <template>
     <div>
-        <el-row type="flex" class="rowStyle">
+        <el-row type="flex" class="rowStyle" @click.native="openDetail">
             <el-col :xs="5" :sm="3">
                 <el-avatar
                     :size="50"
@@ -32,7 +32,6 @@
             <el-col class="flex-column contactInfo" :xs="5" :sm="6">
                 <div class="smTxt_bold cursor--pointer"
                     :class="client.communicateStatus"
-                    @click="openDetail"
                 >{{isReserved ? '撌脤���' : '撌脰蝯�'}}
                 </div>
                 <div class="date xsTxt text--mid_grey">{{date}}</div>
@@ -66,7 +65,7 @@
 </template>
 
 <script lang="ts">
-import { Vue, Component, Prop } from 'nuxt-property-decorator';
+import { Vue, Component, Prop, Mutation, Action } from 'nuxt-property-decorator';
 import { isMobileDevice } from '~/assets/ts/device';
 import { ClientInfo, markAsContact } from '~/assets/ts/api/appointment';
 
@@ -81,6 +80,8 @@
     }
 })
 export default class ClientList extends Vue {
+    @Action updateMyAppointment!: (data: ClientInfo) => void
+
     @Prop() client!: ClientInfo;
     isVisibleDialog = false;
     width = '';
@@ -121,7 +122,17 @@
     }
 
     markAppointment() {
-        markAsContact(this.client.id).then(res => this.$router.go(0))
+        markAsContact(this.client.id).then(data => {
+            // TODO: 閬敺����� updated client 鞈�� - Ben 2021/11/16
+
+            const updatedClient = {...this.client};
+            updatedClient.communicateStatus = 'contacted';
+            updatedClient.appointmentDate = new Date();
+
+            this.updateMyAppointment(updatedClient);
+            this.isVisibleDialog = false;
+
+        })
     }
 
 }

--
Gitblit v1.8.0