From 31f6ff0ebbf3d374e6e0acdeda72bccdd86de2d5 Mon Sep 17 00:00:00 2001
From: Tomas <tomasysh@gmail.com>
Date: 星期四, 10 二月 2022 14:16:15 +0800
Subject: [PATCH] update#134662: [ 顧問管理流程 ] 編輯顧問個人資料 : 所在地區,無產生選擇器

---
 PAMapp/components/Interview/InterviewMsg.vue |  137 ++++++++++++++++++++++++++++++---------------
 1 files changed, 91 insertions(+), 46 deletions(-)

diff --git a/PAMapp/components/Interview/InterviewMsg.vue b/PAMapp/components/Interview/InterviewMsg.vue
index 62d0453..bc76c75 100644
--- a/PAMapp/components/Interview/InterviewMsg.vue
+++ b/PAMapp/components/Interview/InterviewMsg.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div class="interview-msg-component">
     <el-dialog
       :visible.sync="dialogVisible"
       :width="dialogWidth"
@@ -9,30 +9,34 @@
         <div class="subTitle msg-dialog-title">蝝赤�</div>
       <div class="send-msg-nav">
         <div class="mdTxt">��摰�</div>
-        <div class="mdTxt text--primary text--underline">蝺刻摩</div>
       </div>
 
       <el-input
         type="textarea"
-        :rows="9"
+        :autosize="true"
         placeholder="蝝赤�"
         resize="none"
         v-model="interviewTxt">
         </el-input>
 
-      <div class="mdTxt mt-30 mb-10">����赤��挾</div>
-      <DateTimePicker
-        @changeDateTime="interviewTime = $event"
-      ></DateTimePicker>
+      <div v-if="client.phone">
+        <div class="mdTxt mt-30 mb-10 required">����赤��挾</div>
+        <DateTimePicker
+          @changeDateTime="interviewTime = $event"
+          :isPastDateDisabled="true"
+          :defaultValue="defaultValue"
+        ></DateTimePicker>
+      </div>
 
       <div class="msg-dialog-btn">
-        <el-button @click="addInterview"  :disabled="!interviewTime">���</el-button>
+        <el-button @click="addInterview"  :disabled="isBtnDisabled">���</el-button>
       </div>
 
         </el-dialog>
 
         <PopUpFrame
-        :isOpen.sync="isShowSuccessAlert">
+          :isOpen.sync="isShowSuccessAlert"
+          @closePopUp="closeAllDialog">
         <div class="text--middle invite-review">
             <div class="mb-30 mt-10">撌脩��赤�</div>
             <div class="text--primary text--middle cursor--pointer text--underline" @click="closeAllDialog " :size="'250px'">������</div>
@@ -41,16 +45,23 @@
   </div>
 </template>
 <script lang="ts">
-import { Vue, Component, Prop, PropSync, Emit, Action } from 'nuxt-property-decorator';
+import { Vue, Component, Prop, PropSync, Emit, namespace } from 'nuxt-property-decorator';
 
 import appointmentService from '~/shared/services/appointment.service';
 import { Appointment, ToInformAppointment } from '~/shared/models/appointment.model';
+import { AgentInfo } from '~/shared/models/agent-info.model';
+
+const loginStore = namespace('login.store');
+const appointmentStore = namespace('appointment.store');
 
 @Component
 export default class InterviewMsg extends Vue {
 
-    @Action
-    storeMyAppointmentList!: () => Promise<number>;
+    @appointmentStore.Action
+    updateAppointmentDetail!: (id: number) => Appointment;
+
+    @appointmentStore.Action
+    getMyAppointmentList!: () => Promise<Appointment[]>;
 
     @PropSync('isVisible')
     dialogVisible!: boolean;
@@ -61,20 +72,36 @@
     @Prop()
     client!: Appointment;
 
+    @Prop()
+    defaultValue!: string;
+
     @Emit('closeDialog')
     closeDialog() {
         return;
     }
 
+    @loginStore.State
+    loginConsultant!: AgentInfo;
+
     isShowSuccessAlert = false;
 
     interviewTxt = "";
     interviewTime = '';
-
     //////////////////////////////////////////////////////////////////////
 
+    mounted() {
+      if(this.loginConsultant.phoneNumber && this.loginConsultant.email)
+      {
+        this.interviewTxt = "�憟踝��靽���像����憿批��" + this.loginConsultant.name + "嚗�����������銝膩������蝜�"+"\n"+"隞乩����閰梯�Ⅳ/Email嚗�"+"\n" + this.loginConsultant.phoneNumber + "\n" + this.loginConsultant.email + "\n"+"�甇斗���靘選����蝜恬�����"}
+        else if (!this.loginConsultant.phoneNumber && this.loginConsultant.email)
+          {
+            this.interviewTxt = "�憟踝��靽���像����憿批��" + this.loginConsultant.name + "嚗�����������銝膩������蝜�"+"\n"+"隞乩����mail嚗�"+"\n" + this.loginConsultant.email + "\n"+"�甇斗���靘選����蝜恬�����"
+        }
+        else
+        this.interviewTxt = "�憟踝��靽���像����憿批��" + this.loginConsultant.name + "嚗�����������銝膩������蝜�"+"\n"+"隞乩����閰梯�Ⅳ嚗�"+"\n" + this.loginConsultant.phoneNumber + "\n"+"�甇斗���靘選����蝜恬�����"
+    }
+
     addInterview() {
-      console.log('client', this.client);
       const appointmentInformation: ToInformAppointment = {
         appointmentId: this.client.id,
         email        : this.client?.email,
@@ -90,42 +117,60 @@
     closeAllDialog() {
       this.isShowSuccessAlert = false ;
       this.dialogVisible = false;
-      this.storeMyAppointmentList();
+      this.updateAppointmentDetail(this.client.id);
+      this.getMyAppointmentList();
+    }
+
+    get isBtnDisabled() :Boolean {
+      const isFormValid = this.client.phone ? this.interviewTxt && this.interviewTime :this.interviewTxt
+      return !isFormValid
     }
 
 }
 </script>
 
-<style lang="scss" scoped>
-.msg-dialog-title{
-  display: flex;
-  justify-content: center;
-  margin-bottom:30px;
-  color: $PRIMARY_BLACK;
-}
-.send-msg-nav{
-  display: flex;
-  justify-content: space-between;
-  margin-bottom: 10px;
-  color: $PRIMARY_BLACK;
-}
-.el-dialog{
-  width:90%
-}
-.el-textarea__inner{
-  font-size: 20px;
-  padding:10px;
-  text-align: justify;
-  font-weight: 500;
-}
-.msg-dialog-btn{
-  margin-top: 30px;
-  display: flex;
-  justify-content: center;
-}
-.invite-review{
-    display: flex;
-    flex-direction: column;
-    align-items: center;
+<style lang="scss" >
+.interview-msg-component{
+
+  .required {
+  position: relative;
+  &::before {
+      content: '*';
+      position: absolute;
+      color: #FF0000;
+      transform: translate(-12px, 0);
+    }
   }
+  .msg-dialog-title{
+    display: flex;
+    justify-content: center;
+    margin-bottom:30px;
+    color: $PRIMARY_BLACK;
+  }
+  .send-msg-nav{
+    display: flex;
+    justify-content: space-between;
+    margin-bottom: 10px;
+    color: $PRIMARY_BLACK;
+  }
+  .el-dialog{
+    width:90%
+  }
+  .el-textarea__inner{
+    font-size: 20px;
+    padding:10px;
+    text-align: justify;
+    font-weight: 600;
+  }
+  .msg-dialog-btn{
+    margin-top: 30px;
+    display: flex;
+    justify-content: center;
+  }
+  .invite-review{
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+    }
+}
 </style>

--
Gitblit v1.8.0