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

Tomas

2021-12-28 d31ac5dbb92b54e3eb643d0989aaa534f72076e3

 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,37 +64,35 @@

@Component
export default class AccountSetting extends Vue {

        _userSetting!: UserSetting;
        userNameDisabled = true;
        userPhoneDisabled = true;
        userEmailDisabled = true ;
  onEditMode        = false;
        userNameValue = '';
        phoneValue = '' ;
        emailValue = '' ;

        onEditMode = false;
        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 {
            this.onEditMode = true;
@@ -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) {

            // }
            if (!this.onEditMode) return;
            const editSettingInfo: UserSetting = {
                name: this.userNameValue,
@@ -153,18 +124,28 @@
            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);
        }

}