From e828225de7636d0195db2c3c9b1701a5b2f12049 Mon Sep 17 00:00:00 2001 From: Tomas <tomasysh@gmail.com> Date: 星期四, 14 九月 2023 18:01:33 +0800 Subject: [PATCH] Merge branch '滲透' of https://dev.pollex.com.tw:8443/r/pcalife/PAM into 滲透 --- PAMapp/pages/questionnaire/_agentNo.vue | 179 ++++++++++++++++++++++++++++++++++++++++++++++++----------- 1 files changed, 146 insertions(+), 33 deletions(-) diff --git a/PAMapp/pages/questionnaire/_agentNo.vue b/PAMapp/pages/questionnaire/_agentNo.vue index 6593094..9208efb 100644 --- a/PAMapp/pages/questionnaire/_agentNo.vue +++ b/PAMapp/pages/questionnaire/_agentNo.vue @@ -23,9 +23,13 @@ <div class="mdTxt">�隞��蝜急撘�</div> <div class="ques-header__input-block"> <span>Email嚗�</span> - <input class="ques-header__input" + <input class="ques-header__input break" + :class="{ 'is-invalid': !emailValid}" placeholder="隢撓�" v-model="myRequest.email"> + </div> + <div class="error mt-5 mb-5" style="margin-left:65px"> + <span v-show="!emailValid">Email�撘�炊</span> </div> </div> </div> @@ -34,14 +38,14 @@ <div class="mdTxt">�����蝜急撘�</div> <div class="mt-10 ques-header__input-block"> <span>Email嚗�</span> - <span>{{myRequest.email}}</span> + <span class=" break">{{myRequest.email}}</span> </div> </div> <div class="mt-30"> <div class="mdTxt">�隞��蝜急撘�</div> <div class="ques-header__input-block"> - <span>�����</span> - <input class="ques-header__input" + <span>���� : </span> + <input class="ques-header__input ml-4" :class="{'is-invalid': !phoneValid}" placeholder="隢撓�" maxlength="10" @@ -63,7 +67,7 @@ <div class="ques-container"> <div class="pam-paragraph"> <div class="mdTxt"> - �閬岷������ + �鈭圾����� <span class="hint text--bold"> (�銴) </span> @@ -72,6 +76,12 @@ <MultiSelectBtn class="mt-10" :mutiSelect.sync="myRequest.requirement" :options="requirementOptions" /> + </div> + <div class="pam-paragraph"> + <div class="mdTxt">隢株岷�撘�</div> + <SingleSelectBtn class="mt-10" + :singleSelected.sync="myRequest.consultationMethod" + :options="consultationMethodOptions" /> </div> <div class="pam-paragraph"> <div class="mdTxt">����批</div> @@ -99,7 +109,7 @@ <PopUpFrame :isOpen.sync="showDrawer"> <div class="qaTextTitle mdTxt"> - <strong>�閬岷������</strong> + <strong>�鈭圾�����</strong> </div> <div class="qa-dialog"> <div v-for="(qaText,index) in quesAboutList" :key="index" > @@ -115,12 +125,21 @@ </PopUpFrame> <PopUpFrame :isOpen.sync="sendReserve" @update:isOpen="closeReservePopUp"> - <div class="text--middle mt-30 sendReserve-txt">�������</div> - <div class="text--middle sendReserve-txt">�����“�������蝯∴��</div> + <div class="mdTxt mt-30 sendReserve-txt">�������</div> + <div class="mdTxt sendReserve-txt mb-30">�����“�������蝯∴��</div> + <div class="pam-app-review mb-10"> + <div class="mdTxt mb-10">撠 + <span class="mdTxt text--primary text--bold ">������</span> + 撟喳��擃���� + </div> + <div class="mdTxt">�蝯虫�嗾憿��嚗�</div> + </div> + <el-rate v-model="score" class="pam-satisfaction-rate fix-chrome-click--issue"></el-rate> <div class="text--center mdTxt"> + <el-button @click="closeReservePopUp">����</el-button> <el-button type="primary" - @click="closeReservePopUp"> - ������ + @click="reviewPlatform"> + � </el-button> </div> </PopUpFrame> @@ -143,14 +162,19 @@ import { getRequestsFromStorage, removeRequestQuestionFromStorage, setRequestsToStorage } from '~/shared/storageRequests'; import _ from 'lodash'; +import accountSettingService from '~/shared/services/account-setting.service'; import appointmentService from '~/shared/services/appointment.service'; import authService from '~/shared/services/auth.service'; import queryConsultantService from '~/shared/services/query-consultant.service'; +import reviewsService from '~/shared/services/reviews.service'; import { Consultant } from '~/shared/models/consultant.model'; import { ContactType } from '~/shared/models/enum/ContactType'; import { Gender } from '~/shared/models/enum/Gender'; import { RegisterInfo } from '~/shared/models/registerInfo'; import { AppointmentParams, AppointmentRequests } from '~/shared/models/appointment.model'; +import { UserSetting } from '~/shared/models/account.model'; +import { SatisfactionType } from '~/shared/models/enum/satisfaction-type'; +import { UserReviewParams } from '~/shared/models/reviews.model'; const roleStorage = namespace('localStorage'); @Component @@ -167,6 +191,11 @@ @roleStorage.State recommendConsultantItem!:string; + @roleStorage.Mutation + storageUserInfo!: (params: RegisterInfo) => void; + + score = 0; + genderOptions=[ { title:'���', @@ -175,6 +204,17 @@ { title:'憟單��', label:Gender.FEMALE, + } + ]; + + consultationMethodOptions = [ + { + title: '蝺��', + label: 'online' + }, + { + title: '蝺��', + label: 'offline' } ]; @@ -264,8 +304,9 @@ ]; myRequest: AppointmentRequests = { - phone : this.userInfo?.phone ? this.userInfo.phone : '', - email : this.userInfo?.email ? this.userInfo.email : '', + name : '', + phone : '', + email : '', contactType : _.isEqual(this.userInfo?.contactType,ContactType.SMS) ? ContactType.PHONE: ContactType.EMAIL, gender : '', age : '', @@ -276,6 +317,7 @@ selectTimesOptions: [], }], agentNo: '', + consultationMethod: '', }; showDrawer= false; @@ -332,6 +374,17 @@ } removeRequestQuestionFromStorage(); } + + if (authService.isUserLogin()) { + accountSettingService.getUserAccountSetting().then((contactTypeDetail) => { + this.myRequest = { + ...this.myRequest, + ...contactTypeDetail + } + }) + } + + } //////////////////////////////////////////////////////////////////////////// @@ -353,10 +406,9 @@ private getLatestReserved(agentNo) { const agentInfo = this.myConsultantList.filter(item => item.agentNo === agentNo); - const appointmentInfo = agentInfo.length > 0 && agentInfo[0].appointments ? agentInfo[0].appointments! - .filter((appointment) => appointment.communicateStatus !== 'contacted') + .filter((appointment) => appointment.communicateStatus === 'reserved') .map((reversedAppointment) => ( { ...reversedAppointment, sortDate: new Date(reversedAppointment.appointmentDate) @@ -368,20 +420,23 @@ private getReservedData(appointmentInfo) { if (appointmentInfo) { - const hopeContactTime = appointmentInfo!.hopeContactTime.split("'") - .filter(item => item && item !== ','); - this.getAppointmentId(appointmentInfo); - - return { - ...appointmentInfo, - hopeContactTime: hopeContactTime.map(item => { + const hopeContactTime = appointmentInfo!.hopeContactTime + ? appointmentInfo!.hopeContactTime.split("'").filter(item => item && item !== ',').map(item => { const info = item.split('��'); return { selectWeekOptions: info[0].split(','), selectTimesOptions: info[1].split(',') } - }), - requirement: appointmentInfo.requirement.split(',') + }) + :[{selectWeekOptions : [],selectTimesOptions: []}]; + this.getAppointmentId(appointmentInfo); + + return { + ...appointmentInfo, + hopeContactTime: hopeContactTime, + requirement: appointmentInfo.requirement + ? appointmentInfo.requirement.split(',') + : [] } } else { return null; @@ -397,12 +452,36 @@ //////////////////////////////////////////////////////////////////////////// - sentDemand() { - if (this.isEditBtn) { - this.editAppointmentDemand(); + async sentDemand() { + if (!this.isEditBtn) { + // 雿輻 async/await 靘��甇交����蝯�� + const addFavoriteAgentList = [{ agentNo: this.$route.params.agentNo, createdTime: new Date().toISOString() }]; + const response = await queryConsultantService.addFavoriteConsultant(addFavoriteAgentList); + + // 蝣箔�甇交����蝯�� null ��� undefined + if (!response) { + throw new Error('queryConsultantService.addFavoriteConsultant returned null-like value.'); + } else { + if (typeof this.editAppointmentDemand === 'function') { + // 蝣箔�� this.editAppointmentDemand �銝��� + await this.editAppointmentDemand(); + } else { + // ���� this.editAppointmentDemand �摰儔����� + throw new Error('this.editAppointmentDemand is not defined or not a function.'); + } + } } else { - queryConsultantService.addFavoriteConsultant([this.$route.params.agentNo]).then(res => this.sentAppointmentDemand()); + await this.editAppointmentDemand(); } + + const editSettingInfo: UserSetting = { + name: this.myRequest.name, + phone: this.myRequest.phone, + email: this.myRequest.email, + }; + + await accountSettingService.updateAccountSetting(editSettingInfo); + this.storageUserInfo(this.userInfo); } private editAppointmentDemand() { @@ -431,6 +510,7 @@ queryConsultantService.appointmentDemand(data).then(res => { this.sendReserve = true; this.myRequest.hopeContactTime = []; + this.appointmentId = res['id']; setRequestsToStorage(this.myRequest); }); } @@ -440,6 +520,17 @@ return selectedHopeContactTime.map(i => { return `'${i.selectWeekOptions}��${i.selectTimesOptions}'`} ).toString(); + } + + reviewPlatform(): void { + const reviewPlatformParams: UserReviewParams = { + appointmentId: this.appointmentId, + score: this.score, + type: SatisfactionType.SYSTEM + }; + reviewsService.reviewPlatform(reviewPlatformParams).then((_) => { + this.closeReservePopUp(); + }); } closeReservePopUp() { @@ -456,6 +547,11 @@ : true; } + get emailValid() { + const rule = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/; + return this.myRequest.email ? rule.test(this.myRequest.email) : true; + } + get userInfo(): RegisterInfo { const initUserInfo = JSON.parse(localStorage.getItem('userInfo')!); return initUserInfo; @@ -463,7 +559,7 @@ get isDisabledSubmitBtn(): boolean { return _.includes(this.myRequest.contactType,ContactType.PHONE) - ? !this.isHopeContactTimeDone() + ? !this.isHopeContactTimeDone() || !this.emailValid : !this.phoneValid; } @@ -479,7 +575,6 @@ display: flex; justify-content: center; margin-top: 10px; - margin-bottom: 26px; } //drawer��摨���見撘� @@ -490,7 +585,9 @@ color: #ED1B2E; cursor: pointer; } - +.error { + color:$PRIMARY_RED +} //����見撘���� .ques-footer{ justify-content: center; @@ -552,7 +649,10 @@ transform: translate(-12px, 0); } } - +.break{ + word-break: break-all; + line-height: 1.2; +} .ques-page--reset.pam-page-container { margin: 0px auto; } @@ -585,7 +685,7 @@ @extend .text--middle,.mt-10 ; .ques-header__input{ &.is-invalid{ - border: 2px solid $PRIMARY_RED !important; + border: 1px solid $PRIMARY_RED !important; } flex: 1; height: 50px; @@ -598,12 +698,24 @@ -moz-box-sizing: border-box; } } - + .ml-4{ + margin-left: 4px; + } .ques-container { position: relative; margin: 0px 20px; } +.pam-app-review{ + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; +} + +.pam-satisfaction-rate{ + margin-bottom: 45px; +} @include desktop{ .ques-header{ @@ -631,5 +743,6 @@ } } + </style> -- Gitblit v1.8.0