Update: 0907-P6: Bad use of null-like value

Tomas

2023-09-07 8f60f9800584d6918d7bcda66ed18f8773a25f25

 PAMapp/pages/questionnaire/_agentNo.vue

@@ -23,7 +23,7 @@
              <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">
@@ -38,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"
@@ -67,7 +67,7 @@
    <div class="ques-container">
      <div class="pam-paragraph">
        <div class="mdTxt">
            想要詢問的問題
            想了解的領域
            <span class="hint text--bold">
                (可複選)
            </span>
@@ -76,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>
@@ -103,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" >
@@ -121,24 +127,19 @@
    <PopUpFrame :isOpen.sync="sendReserve" @update:isOpen="closeReservePopUp">
        <div class="mdTxt mt-30 sendReserve-txt">預約成功！</div>
        <div class="mdTxt sendReserve-txt mb-30">您預約的顧問會儘速與您聯絡！</div>
        <!-- TODO: 未串接 api, 隱藏平台滿意度 -->
        <!-- <div class="pam-app-review mb-10">
        <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> -->
        <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 @click="closeReservePopUp">略過</el-button>
          <el-button type="primary"
            @click="closeReservePopUp">
            @click="reviewPlatform">
            送出
          </el-button> -->
          <el-button type="primary"
            @click="closeReservePopUp">
            我知道了
          </el-button>
        </div>
    </PopUpFrame>
@@ -161,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
@@ -185,7 +191,10 @@
    @roleStorage.State
    recommendConsultantItem!:string;

    score ="" ;
    @roleStorage.Mutation
    storageUserInfo!: (params: RegisterInfo) => void;

    score = 0;

    genderOptions=[
      {
@@ -195,6 +204,17 @@
      {
        title:'女性',
        label:Gender.FEMALE,
      }
    ];

    consultationMethodOptions = [
      {
        title: '線上',
        label: 'online'
      },
      {
        title: '線下',
        label: 'offline'
      }
    ];

@@ -284,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            : '',
@@ -296,6 +317,7 @@
        selectTimesOptions: [],
      }],
      agentNo: '',
      consultationMethod: '',
    };

    showDrawer= false;
@@ -352,6 +374,17 @@
        }
        removeRequestQuestionFromStorage();
      }

      if (authService.isUserLogin()) {
        accountSettingService.getUserAccountSetting().then((contactTypeDetail) => {
              this.myRequest = {
                ...this.myRequest,
                ...contactTypeDetail
              }
        })
      }


    }

    ////////////////////////////////////////////////////////////////////////////
@@ -387,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;
@@ -416,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() {
@@ -450,6 +510,7 @@
        queryConsultantService.appointmentDemand(data).then(res => {
            this.sendReserve = true;
            this.myRequest.hopeContactTime = [];
            this.appointmentId = res['id'];
            setRequestsToStorage(this.myRequest);
        });
    }
@@ -459,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() {
@@ -513,7 +585,9 @@
  color: #ED1B2E;
  cursor: pointer;
}

.error {
  color:$PRIMARY_RED
}
//送出按鈕樣式與排版
.ques-footer{
  justify-content: center;
@@ -575,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;
}
@@ -608,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;
@@ -621,7 +698,9 @@
      -moz-box-sizing: border-box;
    }
  }

  .ml-4{
    margin-left: 4px;
  }
  .ques-container {
    position: relative;
    margin: 0px 20px;