保誠-保戶業務員媒合平台
HelenHuang
2022-03-31 03d2b281a0cd0b90184dcb0173807954c0863a2d
PAMapp/pages/agentInfo/edit/_agentNo.vue
@@ -1,5 +1,5 @@
<template>
    <div class="edit-agent-info-page">
    <div class="edit-agent-info-page" v-if="!!agentInfo">
      <el-row
        type="flex"
@@ -68,6 +68,27 @@
        </el-col>
      </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-comment"
                  ></i>信箱
                  <span class="hint text--bold" v-show="!emailValid">信箱格式有誤</span>
                  <span class="hint text--bold" v-show="editInfoValue.email.length === 0">信箱為必填</span>
              </div>
            </div>
            <el-input
            v-model="editInfoValue.email"
            :class="{'is-invalid': !emailValid}"
            ></el-input>
          </div>
        </el-col>
      </el-row>
      <el-row
        type="flex"
@@ -104,18 +125,12 @@
        <UiField :span="12" icon="time" label="最後上線時間">
          {{ agentInfo.latestLoginTime | formatDate }}
        </UiField>
        <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 :span="12" icon="calender" label="到職日期">
          <UiDatePicker
              class="mt-10"
              :defaultValue ="agentInfo.entryDate"
              @changeDate="onChangeDate($event)"
          ></UiDatePicker>
        </UiField>
      </el-row>
@@ -287,14 +302,14 @@
    title             : '',
    serveArea         : [] as string[],
    companyAddress    : '',
    seniorityYear     : 1,
    seniorityMonth    : 0,
    concept           : '',
    experiences       : '',
    awards            : '',
    communicationStyle: [] as string[],
    photoBase64       : '',
    phoneNumber       : ''
    phoneNumber       : '',
    email             : '',
    entryDate         : '',
  };
  communicationStyleList: string[] = agentCommunicationStyleList;
@@ -358,7 +373,7 @@
  }
  private setAgentInfo(agentInfo: AgentInfo): void {
    const [agentYear, _yearUnit , agentMonth, _monthUnit] =  agentInfo.seniority.split(" ");
    // const [agentYear, _yearUnit , agentMonth, _monthUnit] =  agentInfo.seniority.split(" ");
    this.defaultAgentInfoSetting = {
      agentNo           : agentInfo.agentNo||'',
      name              : agentInfo.name || '',
@@ -369,13 +384,13 @@
      gender            : agentInfo.gender||'',
      phoneNumber       : agentInfo.phoneNumber||'',
      companyAddress    : agentInfo.companyAddress || '',
      seniorityYear     : agentYear? +agentYear : 0,
      seniorityMonth    : agentMonth ? +agentMonth : 0,
      concept           : agentInfo.concept || '',
      experiences       : agentInfo.experiences  || '',
      awards            : agentInfo.awards || '',
      communicationStyle: agentInfo.communicationStyle || '',
      photoBase64       : ''
      photoBase64       : '',
      email             : agentInfo.email || '',
      entryDate         : agentInfo.entryDate || '',
    };
    this.editInfoValue = {
@@ -386,6 +401,7 @@
    }
  }
  //////////////////////////////////////////////////////////////////////
  editAgentInfoSetting(): void {
@@ -393,11 +409,16 @@
      ...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);
    });
  }
  onChangeDate(date: any): void {
    this.editInfoValue.entryDate = date;
  }
  backToInfo() {
@@ -437,6 +458,11 @@
            : true;
        }
  get emailValid() {
      const rule = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;
      return this.editInfoValue.email ? rule.test(this.editInfoValue.email) : true;
    }
  get isSubmitBtnDisabled(): boolean {
      const isFormValid =  this.editInfoValue.name
                        && this.editInfoValue.title
@@ -445,9 +471,10 @@
                        && this.editInfoValue.concept
                        && this.editInfoValue.experiences
                        && this.editInfoValue.phoneNumber.length
                        && this.editInfoValue.seniorityYear
                        && this.editInfoValue.entryDate
                        && this.editInfoValue.expertise.length
                        && this.editInfoValue.communicationStyle.length;
                        && this.editInfoValue.communicationStyle.length
                        && this.editInfoValue.email.length;
      return !isFormValid
  }
}