From 46da7429ca192bf6a947d79437e8076b94676a05 Mon Sep 17 00:00:00 2001 From: Tomas <tomasysh@gmail.com> Date: 星期四, 13 一月 2022 16:29:45 +0800 Subject: [PATCH] update: 刪除重複的 interface: clientInfo => appointment --- PAMapp/components/Client/ClientCard.vue | 113 ++++++++++++++++++++++++++++++++++++-------------------- 1 files changed, 72 insertions(+), 41 deletions(-) diff --git a/PAMapp/components/Client/ClientCard.vue b/PAMapp/components/Client/ClientCard.vue index 3ddcfcf..79dc475 100644 --- a/PAMapp/components/Client/ClientCard.vue +++ b/PAMapp/components/Client/ClientCard.vue @@ -6,29 +6,16 @@ class="rowStyle cursor--pointer" justify="space-between" :class="{'new': newAppointment }" - @click.native="openDetail" + @click.native="viewDetail" > - <el-col :xs="1" :sm="1" class="unread" align="middle" v-if="isReserved"> + <div class="test"> + <div class="unread" v-if="isReserved"> <div class="circle" v-if="!isRead"></div> - </el-col> - <el-col :xs="5" :sm="3" align="middle"> - <el-avatar - :size="50" - ></el-avatar> - <div class="satisfaction" v-if="!hideReviews"> - <template v-if="client.satisfactionScore"> - TODO:���遛��漲 - <i class="icon-star pam-icon icon--yellow satisfaction"></i> - <span>{{client.satisfactionScore}}</span> - </template> - <template v-else> - <div class="unfilled">�憛急遛��漲</div> - </template> - </div> - </el-col> - <el-col :xs="14" :sm="14" class="pl-10"> + </div> + + <div class="pl-10"> <div class="smTxt_bold name">{{ client.name }}</div> - <div class="my-10">������</div> + <div class="my-10 xsTxt">������</div> <div class="professionals"> <template v-if="client.requirement"> <span @@ -42,19 +29,42 @@ >(摰X�����瘙�)</span> </template> </div> - </el-col> - <el-col class="flex-column contactInfo" :xs="4" :sm="6"> - <div + <AppointmentProgress + :currentStep="'contacted'" + ></AppointmentProgress> + </div> + </div> + <!-- <el-col :xs="5" :sm="3" align="middle"> + <el-avatar + :size="50" + ></el-avatar> + <div class="satisfaction" v-if="!hideReviews"> + <template v-if="client.satisfactionScore"> + TODO:���遛��漲 + <i class="icon-star pam-icon icon--yellow satisfaction"></i> + <span>{{client.satisfactionScore}}</span> + </template> + <template v-else> + <div class="unfilled">�憛急遛��漲</div> + </template> + </div> + </el-col> --> + + <div class="flex-column contactInfo" :xs="4" :sm="6"> + <!-- <div class="smTxt_bold fix-chrome-click--issue" :class="{'unread-txt': reservedTxt === '�霈�', 'read-txt': reservedTxt !== '�霈�'}" - >{{ reservedTxt }}</div> + >{{ reservedTxt }}</div> --> + <div class="invite-msg smTxt_bold"> + ���赤� + </div> <div - class="date xsTxt text--mid_grey" + class="date xsTxt text--black" >{{ date }}</div> <div class="xsTxt text--mid_grey" >{{ time }}</div> - </el-col> + </div> </el-row> <Ui-Dialog @@ -92,7 +102,7 @@ <div class="mdTxt">�摰寞�膩</div> <div class="smTxt text--bold text--primary cursor--pointer text--underline edit" - @click='isEdit = !isEdit' + @click='editMemo' >蝺刻摩</div> </div> @@ -127,9 +137,9 @@ import appointmentService from '~/shared/services/appointment.service'; import UtilsService from '~/shared/services/utils.service'; import { hideReviews } from '~/shared/const/hide-reviews'; -import { AppointmentMemoInfo, ClientInfo } from '~/shared/models/client.model'; import myConsultantService from '~/shared/services/my-consultant.service'; import { ElRow } from 'element-ui/types/row'; +import { Appointment, AppointmentMemoInfo } from '~/shared/models/appointment.model'; const localStorage = namespace('localStorage'); @Component({ @@ -153,10 +163,10 @@ }) export default class ClientList extends Vue { @Action - updateMyAppointment!: (data: ClientInfo) => void; + updateMyAppointment!: (data: Appointment) => void; @Prop() - client!: ClientInfo; + client!: Appointment; @localStorage.Mutation storageClearAppointmentIdFromMsg!: () => void; @@ -190,6 +200,12 @@ ? JSON.parse(JSON.stringify(this.client.appointmentMemoList[0])) : {appointmentId: 0, content: '', id: 0}; this.memo = this.memoInfo.content; + } + + ////////////////////////////////////////////////////////////////////// + + viewDetail(): void { + this.$router.push(`/appointment/${this.client.id}`); } get newAppointment(): boolean { @@ -257,12 +273,7 @@ markAppointment() { myConsultantService.markAsContact(this.client.id).then(data => { - // TODO: 閬敺����� updated client 鞈�� - Ben 2021/11/16 - const updatedClient = {...this.client}; - updatedClient.communicateStatus = 'contacted'; - updatedClient.contactTime = new Date().toString(); - - this.updateMyAppointment(updatedClient); + this.updateMyAppointment(data); this.isVisibleDialog = false; }) } @@ -307,20 +318,26 @@ private createMemo(params) { appointmentService.createMemo(params).then(memoRes => { - this.updateStoreMemo(memoRes); + this.storeMemo(memoRes); }); } private updateMemo(params) { appointmentService.updateMemo(params).then(memoRes => { - this.updateStoreMemo(memoRes); + this.storeMemo(memoRes); }); } - private updateStoreMemo(memoRes) { + private storeMemo(memoRes) { this.memoInfo = memoRes; this.memo = this.memoInfo.content; + this.client.appointmentMemoList[0] = this.memoInfo; this.isEdit = false; + } + + editMemo() { + this.isEdit = !this.isEdit; + this.memo = this.memoInfo.content; } cancelEditMemo() { @@ -338,6 +355,7 @@ margin-bottom: 10px; display: flex; justify-content: space-between; + transition: background-color 0.5s; &.new { border-left: solid 4px $YELLOW; @@ -351,7 +369,7 @@ .circle { width: 10px; height: 10px; - border-radius: 50px; + border-radius: 50%; background-color: $PRIMARY_RED; margin: auto; } @@ -371,7 +389,6 @@ text-overflow: ellipsis; .professionalsTxt { font-size: 12px; - font-weight: bold; margin-right: 5px; } .noProfessionalsTxt { @@ -417,4 +434,18 @@ .fixed-Height { height: 16px; } + .test{ + display: flex; + } + .invite-msg{ + color: #ED1B2E; + border-bottom: 1px solid #ED1B2E; + width: 97px; + } + .line{ + height: 4px; + width: 10px; + background-color: $PRUDENTIAL_GREY; + + } </style> -- Gitblit v1.8.0