Merge branch 'master' of https://dev.pollex.com.tw:8443/r/pcalife/PAM

Tomas

2021-12-28 d31ac5dbb92b54e3eb643d0989aaa534f72076e3

Merge branch 'master' of https://dev.pollex.com.tw:8443/r/pcalife/PAM

 PAMapp/pages/accountSetting/index.vue

@@ -31,12 +31,6 @@
            <span v-show="!phoneValid" class="error">手機號碼格式有誤</span>
        </div>
      </div>
      <div class="account-info__icon text--middle">
        <!-- <i class="icon-edit"
          @click="editField('userPhone')"
          :class="{'icon-color-change': !userPhoneDisabled}">
        </i> -->
      </div>
    </div>
    <div class="pam-paragraph account-info" v-if="emailValue">
      <div class="account-info__title text--middle">綁定</div>
@@ -51,12 +45,6 @@
        <div class="account-info__input-error">
            <span v-show="!emailValue" class="error">信箱格式有誤</span>
        </div>
      </div>
      <div class="account-info__icon text--middle">
        <!-- <i class="icon-edit"
          @click="editField('userEmail')"
          :class="{'icon-color-change': !userEmailDisabled}">
        </i> -->
      </div>
    </div>
    <div class="pam-paragraph account-confirm">
@@ -76,39 +64,37 @@

@Component
export default class AccountSetting extends Vue {
        _userSetting!: UserSetting;
        userNameDisabled = true;
        userPhoneDisabled = true;
        userEmailDisabled = true ;
        userNameValue = '';
        phoneValue = '' ;
        emailValue = '' ;

        onEditMode = false;
        formValidStatus = {
            name: true,
  _userSetting!: UserSetting;
  userNameDisabled  = true;
  userPhoneDisabled = true;
  userEmailDisabled = true ;
  onEditMode        = false;
  userNameValue     = '';
  phoneValue        = '' ;
  emailValue        = '' ;
  formValidStatus = {
            name : true,
            phone: true,
            email: true,
        };
    };

        get nameValid(): boolean {
            this.formValidStatus.name = this.userNameValue ? true : false;
            return this.formValidStatus.name;
////////////////////////////////////////////////////////////
  mounted(){
            accountSettingService.getUserAccountSetting().then((userInfo: UserSetting)=>{
                this._userSetting = {
                    name : userInfo.name || '',
                    phone: userInfo.phone || '',
                    email: userInfo.email || '',
                };
                this.phoneValue    = this._userSetting.phone!;
                this.userNameValue = this._userSetting.name!;
                this.emailValue    = this._userSetting.email!;
            })
        }
////////////////////////////////////////////////////////////

        get phoneValid(): boolean {
            const rule = /^09[0-9]{8}$/;
            this.formValidStatus.phone = this.phoneValue ? rule.test(this.phoneValue) : true;
            return this.formValidStatus.phone;
        }

        get emailValid(): boolean {
            const rule = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;
            this.formValidStatus.email = this.emailValue ? rule.test(this.emailValue) : true;;
            return this.formValidStatus.email;
        }

        editField(fieldName: string): void {
  editField(fieldName: string): void {
            this.onEditMode = true;
            const enablePromise = new Promise((resolve, reject) => { // 此為promise語法
                resolve((this as any)[`${fieldName}Disabled`] = false);
@@ -118,22 +104,7 @@
                targetInput.focus();
            });
        }

        get isSubmitBtnDisabled(): boolean {
            const isFormValid = this.formValidStatus.name && this.formValidStatus.phone && this.formValidStatus.email;
            return !isFormValid || !this.onEditMode
                || (!this.phoneValue && !this.emailValue);
        }

        updateAccountSetting(): void {
            // const dataChanged = (): boolean => {
            //     return this._userSetting.name !== this.userNameValue
            //         || this._userSetting.phone !== this.phoneValue
            //         || this._userSetting.email !== this.emailValue;
            // };
            // if (dataChanged) {

            // }
  updateAccountSetting(): void {
            if (!this.onEditMode) return;
            const editSettingInfo: UserSetting = {
                name: this.userNameValue,
@@ -146,25 +117,35 @@
            });
        }

        private resetSettingForm(): void {
  private resetSettingForm(): void {
            this.onEditMode = false;
            this.userNameDisabled = true;
            this.userPhoneDisabled = true;
            this.userEmailDisabled = true ;
        }

        mounted(){
            accountSettingService.getUserAccountSetting().then((userInfo: UserSetting)=>{
                this._userSetting = {
                    name: userInfo.name || '',
                    phone: userInfo.phone || '',
                    email: userInfo.email || '',
                };
////////////////////////////////////////////////////////////

                this.phoneValue = this._userSetting.phone!;
                this.userNameValue = this._userSetting.name!;
                this.emailValue = this._userSetting.email!;
            })
  get nameValid(): boolean {
            this.formValidStatus.name = this.userNameValue ? true : false;
            return this.formValidStatus.name;
        }

  get phoneValid(): boolean {
            const rule = /^09[0-9]{8}$/;
            this.formValidStatus.phone = this.phoneValue ? rule.test(this.phoneValue) : true;
            return this.formValidStatus.phone;
        }

  get emailValid(): boolean {
            const rule = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;
            this.formValidStatus.email = this.emailValue ? rule.test(this.emailValue) : true;;
            return this.formValidStatus.email;
        }
  get isSubmitBtnDisabled(): boolean {
            const isFormValid = this.formValidStatus.name && this.formValidStatus.phone && this.formValidStatus.email;
            return !isFormValid || !this.onEditMode
                || (!this.phoneValue && !this.emailValue);
        }

}

 PAMapp/pages/agentInfo/_agentNo.vue

@@ -199,21 +199,18 @@

@Component
export default class AgentInfoComponent extends Vue {

  @roleStorage.Getter currentRole!:string|null;
  role = Role;

  agentInfo!: AgentInfo;
  role = Role;
  isAlertAddSuccess = false;
  isAlertFieldInfo = false;
  fieldInfoTitle = '';
  fieldInfoDesc = '';
  hideReviews = hideReviews ;
  isAlertFieldInfo  = false;
  fieldInfoTitle    = '';
  fieldInfoDesc     = '';
  hideReviews       = hideReviews ;

  //////////////////////////////////////////////////////////////////////

  get agentName(): string {
    return `${this.agentInfo.name}(${this.agentInfo.role})`;
  }

//////////////////////////////////////////////////////////////////////
  async asyncData(context: Context) {
    const agentNo = context.route.params.agentNo;
    return {
@@ -221,10 +218,11 @@
    }
  }

//////////////////////////////////////////////////////////////////////

  alertAddSuccess(): void {
      this.isAlertAddSuccess = true;
  }

  alertFieldInfo(field: string): void {
    this.isAlertFieldInfo = true;
    switch(field) {
@@ -238,6 +236,13 @@
        break;
    }
  }

//////////////////////////////////////////////////////////////////////

  get agentName(): string {
    return `${this.agentInfo.name}(${this.agentInfo.role})`;
  }
  
}

</script>