From 34b08e1c461f5e08675fcff95525956d7c4bef11 Mon Sep 17 00:00:00 2001 From: wayne <wayne8692wayne8692@gmail.com> Date: 星期四, 17 二月 2022 11:38:48 +0800 Subject: [PATCH] Merge branch 'Phase3' into pollex-dev --- PAMapp/pages/agentInfo/edit/_agentNo.vue | 144 ++++++++++++++++++++++++++++++----------------- 1 files changed, 92 insertions(+), 52 deletions(-) diff --git a/PAMapp/pages/agentInfo/edit/_agentNo.vue b/PAMapp/pages/agentInfo/edit/_agentNo.vue index 93b4dce..ae47457 100644 --- a/PAMapp/pages/agentInfo/edit/_agentNo.vue +++ b/PAMapp/pages/agentInfo/edit/_agentNo.vue @@ -1,5 +1,6 @@ <template> <div class="edit-agent-info-page"> + <el-row type="flex" justify="center"> @@ -7,21 +8,42 @@ :agentNo="agentInfo.agentNo" :photoBase64.sync="editInfoValue.photoBase64"/> </el-row> - <el-row + + <!-- NOTE: ���蝺刻摩��銝�閬*蝷� avgScore嚗���� [Tomas, 2022/2/10 13:55] --> + <!-- <el-row type="flex" class="pt-10" justify="center" align="middle" v-if="!hideReviews"> - <!-- TODO:���遛��漲 --> <i class="pam-icon icon--primary icon-star"></i> <h3 class="mdTxt">{{ agentInfo.avgScore }}</h3> - </el-row> + </el-row> --> - <el-row + <!-- <el-row type="flex" class="pam-paragraph" justify="center"> <el-input class="mdTxt" v-model="editInfoValue.name"></el-input> + </el-row> --> + <el-row + type="flex" + class="pam-paragraph"> + <el-col :span="24" class="pam-field"> + <div class="pam-field__label pam-progress__label"> + <div> + <div class="pam-field__title mb-10"> + <i class="pam-icon icon-avatar" + ></i>憿舐內��迂 + <span class="hint text--bold" v-show="!editInfoValue.name">憿舐內��迂�敹‵</span> + </div> + </div> + <el-input + v-model="editInfoValue.name" + :class="{'is-invalid': !nameValid}" + maxlength="10" + minlength="10"></el-input> + </div> + </el-col> </el-row> <el-row @@ -50,8 +72,8 @@ <el-row type="flex" class="pam-paragraph"> - <UiField :span="12" icon="agent" label="����"> - <el-input v-model="editInfoValue.title"></el-input> + <UiField :span="24" icon="agent" label="����"> + <el-input v-model="editInfoValue.title" class="mt-10"></el-input> </UiField> </el-row> @@ -59,7 +81,12 @@ type="flex" class="pam-paragraph"> <UiField icon="company" label="�����"> - <el-input v-model="editInfoValue.serveArea"></el-input> + <MultiSelectBtn class="mt-30" + :mutiSelect.sync="editInfoValue.serveArea" + :nameOfSelectAll="'��'" + :options="serveAreaOptions" + > + </MultiSelectBtn> </UiField> </el-row> @@ -67,7 +94,7 @@ type="flex" class="pam-paragraph"> <UiField icon="address" label="�����"> - <el-input v-model="editInfoValue.companyAddress"></el-input> + <el-input v-model="editInfoValue.companyAddress" class="mt-10"></el-input> </UiField> </el-row> @@ -77,20 +104,22 @@ <UiField :span="12" icon="time" label="��敺�����"> {{ agentInfo.latestLoginTime | formatDate }} </UiField> - <UiField :span="12" icon="calender" label="����風" style="display:flex"> - <el-input v-model="editInfoValue.seniorityYear" class="seniority-input"></el-input>撟� - <el-select style="width:60px" v-model="editInfoValue.seniorityMonth" class="seniority-input"> - <el-option - v-for="(month) in [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]" - :value="month" - :key="month"> - {{ month }} - </el-option> - </el-select>��� + <UiField :span="12" icon="calender" label="����風"> + <div class="mt-10" style="display: flex; align-items: center"> + <el-input v-model="editInfoValue.seniorityYear" class="seniority-input" ></el-input>撟� + <el-select style="width:60px" v-model="editInfoValue.seniorityMonth" class="seniority-input"> + <el-option + v-for="(month) in [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]" + :value="month" + :key="month"> + {{ month }} + </el-option> + </el-select>��� + </div> </UiField> </el-row> - <el-row + <!-- <el-row type="flex" class="pam-paragraph"> <el-col :span="24" class="pam-field"> @@ -109,7 +138,7 @@ <el-progress :show-text="false" :stroke-width="15" :percentage="agentInfo.evaluation * 2"></el-progress> </div> </el-col> - </el-row> + </el-row> --> <el-row type="flex" @@ -123,9 +152,9 @@ </div> </div> <MultiSelectBtn class="mt-30" - :mutiSelect.sync="editInfoValue.communicationStyle" - :options="agentCommunicationStyleList" - :maxLength="2" + :mutiSelect.sync="editInfoValue.communicationStyle" + :options="agentCommunicationStyleList" + :maxLength="2" > </MultiSelectBtn> </div> @@ -144,8 +173,8 @@ </div> </div> <MultiSelectBtn class="mt-30" - :mutiSelect.sync="editInfoValue.expertise" - :options="agentExpertList" + :mutiSelect.sync="editInfoValue.expertise" + :options="agentExpertList" > </MultiSelectBtn> </div> @@ -156,7 +185,7 @@ type="flex" class="pam-paragraph"> <UiField icon="comment" label="�犖��艙"> - <el-input type="textarea" autosize v-model="editInfoValue.concept"></el-input> + <el-input type="textarea" autosize v-model="editInfoValue.concept" class="mt-10"></el-input> </UiField> </el-row> @@ -164,7 +193,12 @@ type="flex" class="pam-paragraph"> <UiField icon="school" label="�犖��"> - <el-input type="textarea" autosize v-model="editInfoValue.experiences"></el-input> + <el-input + autosize + type="textarea" + class="mt-10" + v-model="editInfoValue.experiences"> + </el-input> </UiField> </el-row> @@ -172,7 +206,7 @@ type="flex" class="pam-paragraph"> <UiField icon="trophy" label="敺��風"> - <el-input type="textarea" autosize style="height:70%" v-model="editInfoValue.awards"></el-input> + <el-input type="textarea" autosize style="height:70%" v-model="editInfoValue.awards" class="mt-10"></el-input> </UiField> </el-row> @@ -223,29 +257,35 @@ import { AgentInfoSetting } from '~/shared/models/account.model'; import { Role } from '~/shared/models/enum/Role'; import { agentCommunicationStyleList } from '~/shared/const/agent-communication-style-list'; +import { taiwanCities } from '~/shared/const/taiwan-cities'; const localStorageTest = namespace('localStorage'); +const loginStore = namespace('login.store'); @Component -export default class AgentInfoComponent extends Vue { +export default class AgentInfoEditComponent extends Vue { - @localStorageTest.State('current_role') - currentRole!:string | null; + @localStorageTest.State + current_role: any; - _agentInfoSetting!: AgentInfoSetting; + @loginStore.Action + updateConsultantDetail!: (agentNo: string) => Promise<AgentInfo>; + + defaultAgentInfoSetting!: AgentInfoSetting; agentInfo! : AgentInfo fieldInfoDesc : string = ''; fieldInfoTitle : string = ''; hideReviews : boolean = hideReviews ; isAlertFieldInfo: boolean = false; isInfoUpdate : boolean = false; + serveAreaOptions: any[] = taiwanCities.map((city) => ({ title: city, label: city })); editInfoValue = { agentNo : '', name : '', expertise : [] as string[], title : '', - serveArea : '', + serveArea : [] as string[], companyAddress : '', seniorityYear : 1, seniorityMonth : 0, @@ -319,13 +359,13 @@ private setAgentInfo(agentInfo: AgentInfo): void { const [agentYear, _yearUnit , agentMonth, _monthUnit] = agentInfo.seniority.split(" "); - this._agentInfoSetting = { + this.defaultAgentInfoSetting = { agentNo : agentInfo.agentNo||'', name : agentInfo.name || '', expertise : agentInfo.expertise || [], title : agentInfo.title || '', role : agentInfo.role||'', - serveArea : agentInfo.serveArea || '', + serveArea : agentInfo?.serveArea.split('��'), gender : agentInfo.gender||'', phoneNumber : agentInfo.phoneNumber||'', companyAddress : agentInfo.companyAddress || '', @@ -339,10 +379,10 @@ }; this.editInfoValue = { - ...this._agentInfoSetting, - expertise : _.cloneDeep(this._agentInfoSetting.expertise), + ...this.defaultAgentInfoSetting, + expertise : _.cloneDeep(this.defaultAgentInfoSetting.expertise), // TODO: 蝣箄��垢甇斗���垢���隞�" , "���� [Tomas, 2021/12/28] - communicationStyle : this._agentInfoSetting.communicationStyle.split('��'), + communicationStyle : this.defaultAgentInfoSetting.communicationStyle.split('��'), } } @@ -352,9 +392,11 @@ const editSettingInfo: any = { ...this.editInfoValue, communicationStyle: this.editInfoValue.communicationStyle.join('��'), + serveArea: this.editInfoValue.serveArea.join('��'), } accountSettingService.editAgentInfoSetting(editSettingInfo).then((res: AgentInfoSetting) => { this.isInfoUpdate = true; + this.updateConsultantDetail(editSettingInfo.agentNo); }); } @@ -376,13 +418,18 @@ this.fieldInfoTitle = '���漲'; this.fieldInfoDesc = '���漲��������翰�祟�敺����雿�憿批����脰�������蝯行�����潘��隞乩������“������潦��'; break; - case 'evaluation': - this.fieldInfoTitle = '隢株岷摨西”�'; - this.fieldInfoDesc = '隢株岷摨西”��撠��雿�憿批�������垣閰X���脰�������蝯行�����潦��'; - break; + // case 'evaluation': + // this.fieldInfoTitle = '隢株岷摨西”�'; + // this.fieldInfoDesc = '隢株岷摨西”��撠��雿�憿批�������垣閰X���脰�������蝯行�����潦��'; + // break; } } + //////////////////////////////////////////////////////////// + get nameValid(): boolean { + return !!this.defaultAgentInfoSetting?.name; + } + get phoneValid(): boolean { const rule = /^09[0-9]{8}$/; return this.editInfoValue.phoneNumber @@ -407,12 +454,8 @@ </script> -<style lang="scss" > -.edit-agent-info-page{ - .el-textarea__inner{ - font-size: 15px; -} -} +<style lang="scss"> + .pam-icon { font-size : 15px; padding-right: 8px; @@ -467,14 +510,11 @@ } .seniority-input{ - width : 50px; + width : 60px; margin-right: 5px; } .el-input--suffix .el-input__inner { padding-right: 20px; } -.el-textarea__inner{ - font-size: 18px; -} </style> -- Gitblit v1.8.0