refactor: consultantLogin

Mila

2021-12-16 6b88c4b2695f21103322ab1fc8dc331806c56fa6

refactor: consultantLogin

 PAMapp/assets/ts/api/consultant.ts

@@ -53,26 +53,6 @@
    return http.delete('/consultant/favorite/'+agentId, {headers})
}

// 取得驗證碼圖片
export function getImgOfVerification():Promise<string>{
  return http.get('/login/validate/get_img_code',{ responseType : 'arraybuffer' })
    .then(response=>{
      const toBase64 = window.btoa(_.reduce(new Uint8Array(response.data),(data,byte)=>data + String.fromCharCode(byte),''));
      const imgSrc = `data:image/jpeg;base64,${toBase64}`;
      return imgSrc;
  });
}

// 驗證碼 驗證
export function getVerificationStatus(imgCode:string):Promise<AxiosResponse<boolean>>{
  return http.get('/login/validate/verify_img_code/'+imgCode);
}

// 顧問登入
export function logInToConsultant(consultantDto:ConsultantLoginInfo):Promise<AxiosResponse<RequestOfLoginSuccess>>{
    return http.post('/eService/authenticate',consultantDto);
}

// 取得預約單細節
export function getAppointmentDetail(apointmentId: number):Promise<AxiosResponse<AppointmentDetail>> {
    const headers = {

 PAMapp/assets/ts/services/login.service.ts

@@ -1,9 +1,12 @@
import { ConsultantLoginInfo } from "../models/ConsultantLoginInfo";
import { LoginRequest } from "../models/loginRequest.model";
import { LoginSuccessToken } from "../models/loginSuccessToken.model";
import { LoginVerify } from "../models/loginVerify.model";
import { OtpInfo } from "../models/otpInfo.model";
import { RegisterInfo } from "../models/registerInfo";
import { http } from "./httpClient";
import { AxiosResponse } from 'axios';
import _ from "lodash";

class LoginService {
    /** 顧客登入-發送OTP **/
@@ -20,6 +23,29 @@
  register(registerInfo: RegisterInfo):Promise<LoginSuccessToken>{
    return http.post('/otp/register', registerInfo).then(res => res.data);
  }

  /** 取得驗證碼圖片 **/
  getImgOfVerification():Promise<string>{
    return http.get('/login/validate/get_img_code',{ responseType : 'arraybuffer' })
      .then( response => {
        const toBase64 = window.btoa(
                          _.reduce( new Uint8Array(response.data),(data,byte) =>
                            data + String.fromCharCode(byte),'')
                        );
        const imgSrc = `data:image/jpeg;base64,${toBase64}`;
        return imgSrc;
    });
  }

  /** 驗證碼-驗證 **/
  getVerificationStatus(imgCode:string):Promise<AxiosResponse<boolean>>{
    return http.get('/login/validate/verify_img_code/'+imgCode);
  }

  /** 顧問登入 **/
  logInToConsultant(consultantDto:ConsultantLoginInfo):Promise<AxiosResponse<LoginSuccessToken>>{
    return http.post('/eService/authenticate',consultantDto);
  }
}

export default new LoginService();

 PAMapp/assets/ts/services/pamService.service.ts

@@ -2,14 +2,12 @@
import { http } from "./httpClient";
import { editAppointmentParams } from '../models/editAppointmentParams.model';
import { AppointmentDetail } from '../models/AppointmentDetail';
import { ConsultantLoginInfo } from '../models/ConsultantLoginInfo';
import { UserSetting } from '../models/account.model';
import { FastQueryParams } from '../models/quickFilter.model';
import { Consultant } from '../models/consultant.model';
import { StrictQueryParams } from '../models/strictQueryParams';
import { AppointmentParams } from '../models/appointmentParams';
import { UserReviewsConsultantsParams } from '../models/UserReviewsConsultantsParams';
import { LoginSuccessToken } from '../models/loginSuccessToken.model';
import { AgentOfStrictQuery } from '../models/agentOfStrictQuery';
import _ from "lodash";

@@ -54,28 +52,7 @@
    return http.delete('/consultant/favorite/'+agentId);
  }

  /** 取得驗證碼圖片 **/
  getImgOfVerification():Promise<string>{
    return http.get('/login/validate/get_img_code',{ responseType : 'arraybuffer' })
      .then( response => {
        const toBase64 = window.btoa(
                          _.reduce( new Uint8Array(response.data),(data,byte) =>
                            data + String.fromCharCode(byte),'')
                        );
        const imgSrc = `data:image/jpeg;base64,${toBase64}`;
        return imgSrc;
    });
  }

  /** 驗證碼-驗證 **/
  getVerificationStatus(imgCode:string):Promise<AxiosResponse<boolean>>{
    return http.get('/login/validate/verify_img_code/'+imgCode);
  }

  /** 顧問登入 **/
  logInToConsultant(consultantDto:ConsultantLoginInfo):Promise<AxiosResponse<LoginSuccessToken>>{
    return http.post('/ehttp/authenticate',consultantDto);
  }

  /** 取得預約單細節 **/
  getAppointmentDetail(apointmentId: number):Promise<AxiosResponse<AppointmentDetail>> {

 PAMapp/pages/consultantLogin/index.vue

@@ -58,9 +58,9 @@
<script lang="ts">
  import { Vue, Component , namespace } from 'nuxt-property-decorator';
  import { AxiosError } from 'axios';
  import { getImgOfVerification, logInToConsultant, getVerificationStatus } from '~/assets/ts/api/consultant';
  import { Role } from '~/assets/ts/models/enum/Role';
  import ErrorMessageBox from '~/assets/ts/errorService';
  import loginService from '~/assets/ts/services/login.service'

  const roleStorage = namespace('localStorage');
  @Component({
@@ -79,25 +79,20 @@
      password: '',
    }

    get isAlreadyDone():boolean{
      return !!(this.verificationCode && this.consultantDto.username && this.consultantDto.password);
    }

    ////////////////////////////////////////////////////////////////////
    mounted() {
      this.getInitUserName();
      this.regenerateImgOfVerification();
    };

    private getInitUserName(): void {
      const username = localStorage.getItem('consultantUserName')
      if (username) {
        this.consultantDto.username = username;
        this.isRememberUserName = true;
      }
    get isAlreadyDone():boolean{
      return !!(this.verificationCode && this.consultantDto.username && this.consultantDto.password);
    }


    ////////////////////////////////////////////////////////////////////
    public regenerateImgOfVerification(): void {
      getImgOfVerification().then( imgOfBase64 =>
      loginService.getImgOfVerification().then( imgOfBase64 =>
        this.imgSrc = imgOfBase64
      );
    };
@@ -111,8 +106,18 @@
      this.isAlreadyDone ? this.verify() : ErrorMessageBox('請確認帳號、密碼以及驗證碼是否填寫完畢');
    }


    ////////////////////////////////////////////////////////////////////
    private getInitUserName(): void {
      const username = localStorage.getItem('consultantUserName')
      if (username) {
        this.consultantDto.username = username;
        this.isRememberUserName = true;
      }
    }

    private verify():void{
      getVerificationStatus(this.verificationCode).then( verifySuccess => {
      loginService.getVerificationStatus(this.verificationCode).then( verifySuccess => {
        if(verifySuccess.data){
          this.loginWithConsultant()
        }else{
@@ -124,7 +129,7 @@
    }

    private loginWithConsultant(): void {
      logInToConsultant(this.consultantDto).then(res => {
      loginService.logInToConsultant(this.consultantDto).then(res => {
        this.storageIdToken(res.data.id_token);
        this.storageRole(Role.ADMIN);
        this.storageConsultantId(this.consultantDto.username)