From 1b57ac5bea14a750b5ddf961c3a8510da18f3637 Mon Sep 17 00:00:00 2001
From: 劉鈞霖 <benson@gmail.com>
Date: 星期二, 23 十一月 2021 12:07:02 +0800
Subject: [PATCH] [ Update ] 串接顧問登入 完成 50% (驗證碼以及忘記密碼 尚未 ) 、 新增 api 錯誤訊息 。
---
PAMapp/pages/login/index.vue | 90 +++++++++++++++++++++++++++++++++++++--------
1 files changed, 74 insertions(+), 16 deletions(-)
diff --git a/PAMapp/pages/login/index.vue b/PAMapp/pages/login/index.vue
index d81ffba..39bb3ea 100644
--- a/PAMapp/pages/login/index.vue
+++ b/PAMapp/pages/login/index.vue
@@ -4,7 +4,7 @@
<div class="pam-paragraph">
<div class="mdTxt">
- 蝬�撘�
+ 撽�撘�<small class="pam-field-title__hint pl-10">(憿批��誑�����撘��蝜�)</small>
</div>
<div class="pam-tags">
<el-row type="flex" class="pt-10">
@@ -15,7 +15,6 @@
:class="{ 'active': connectDevice === 'EMAIL'}"
@click="connectDevice = 'EMAIL'">Email</el-button>
</el-row>
-
</div>
<el-row type="flex" class="pt-10" v-show="connectDevice === 'MOBILE'">
@@ -127,20 +126,41 @@
</div>
</el-row>
<el-row class="pt-10">
- <div class="mdTxt pam-register-dialog__contract">
- ����犖鞈��鈭��
+ <div
+ class="mdTxt pam-register-dialog__contract"
+ @scroll="detectContructReadStatus">
+ <h3>����犖鞈��鈭��</h3>
+ <p class="mt-10">
�摰�犖鞈��風瘜��������犖鞈����������
�銝�����
+ <p>
+
+ <p class="mt-10">
銝����銝��犖鞈��嚗�����僑�����澈���絞銝�蝺刻���批�璆准����
��蝯⊥撘�(��雿���閰梯�Ⅳ�-MAIL����極雿��)蝑��隞�誑��
���霅��犖銋����
+ <p>
+
+ <p class="mt-10">
鈭������犖鞈��風瘜����誘銋�������蝘��風�蝑�����
���������犖鞈���
+ <p>
+
+ <p class="mt-10">
銝���������������������犖鞈���
+ </p>
+
+ <p class="mt-10">
�������������平���暑�������銝剛瘞���������犖鞈�
����
+ </p>
+
+ <p class="mt-10">
鈭���������摰���甈∩誑憭�璆凋�撱��恐撠����誑��隞
���������銋����嚗�������犖鞈���
+ </p>
+
+ <p class="mt-10">
���靘�犖鞈��風瘜洵 3 璇���停����犖鞈�����蝙銋���嚗�
(銝�) �閰Ｘ���閬賬��
(鈭�) 隢�ˊ蝯西�ˊ���
@@ -149,14 +169,24 @@
(鈭�) 隢����
����蝙銝膩甈��撠������������������痊隞颯�靘�
�犖鞈��風瘜洵 14 璇�������銵雿平鞎餌��
+ </p>
+
+ <p class="mt-10">
銝������迤蝣箔��犖鞈�����瘜����摰�����平����
+ </p>
+
+ <p class="mt-10">
�����平���閬���隞�������犖鞈����������銋痊��
+ </p>
+
+ <p class="mt-10">
銋��閫�甇支����蝚血��犖鞈��風瘜����������������迨���
��嚗�敺��撽��
�犖鞈�������
銝��鈭箏歇�����眼���膩��鈭���
鈭�鈭箏��眼����������鈭箔��犖鞈��誑��隞����������
���������
+ </p>
</div>
</el-row>
<el-row class="pt-30">
@@ -175,25 +205,45 @@
<span slot="footer" class="dialog-footer">
<el-button
type="primary"
- :disabled="!name || !agreeControct"
+ :disabled="!name || !agreeControct || !isReadContract"
@click="applyAccount"
>撱箇�撣唾��
</el-button>
</span>
</el-dialog>
-
+ <PopUpFrame class="pam-popUpFrame"
+ :isOpen.sync="applySuccessConfirmVisable">
+ <div class="pam-popUp-title text--center">
+ 甇∟�����������垣閰ｇ�“���誑�����{ connectDevice === 'MOBILE' ? '����Ⅳ' : 'Email'}}���蝜�
+ </div>
+ <div class="pam-popUp-confirm-bolck pam-paragraph">
+ <div class="text--center">
+ <el-button
+ type="primary"
+ @click="confirmApplySuccess"
+ >������</el-button>
+ </div>
+ </div>
+ </PopUpFrame>
<el-button class="mt-30" @click="fakeLogin">摰Ｘ��</el-button>
</div>
</template>
<script lang="ts">
+import { namespace } from 'nuxt-property-decorator';
import { Vue, Component } from 'vue-property-decorator';
import { login } from '~/assets/ts/api/consultant';
-import { Role } from '../../components/NavBar.vue';
+import { Role } from '~/assets/ts/models/enum/Role';
+
+const roleStorage = namespace('localStorage');
+
@Component
export default class Login extends Vue {
+ @roleStorage.Mutation storageIdToken!: (token:string) => void;
+ @roleStorage.Mutation storageRole!: (role:string) => void;
+
connectDevice: 'MOBILE' | 'EMAIL' = 'MOBILE';
phoneNumber = '';
@@ -206,26 +256,35 @@
emailResendCounter = 30;
registerDialogVisable = false;
+ applySuccessConfirmVisable = false;
name = '';
agreeControct = false;
+ isReadContract = false;
+
+ detectContructReadStatus(event: any): void {
+ this.isReadContract = Math.round(event.target.scrollTop) === (event.target.scrollHeight - event.target.clientHeight);
+ };
get showPhoneOtpCodeField(): boolean {
return this.connectDevice === 'MOBILE' && this.onPhoneVerifyStep === 'INPUT_OTP';
- }
+ };
get showEmailVerifyField(): boolean {
return this.connectDevice === 'EMAIL';
- }
+ };
applyOtpVerification(): void {
this.onPhoneVerifyStep = 'INPUT_OTP';
- }
+ };
applyAccount(): void {
+ this.applySuccessConfirmVisable = true;
console.log('apply new account!')
+ };
+
+ confirmApplySuccess(): void {
+ this.applySuccessConfirmVisable = false
}
-
-
// TODO: ��TP隤����� ���蝙�
fakeLogin() {
@@ -234,13 +293,12 @@
password: 'user',
}
login(user).then((res) => {
- localStorage.setItem('id_token', res.data.id_token);
- localStorage.setItem('roleOfState',Role.USER);
+ this.storageIdToken(res.data.id_token);
+ this.storageRole(Role.USER);
this.$router.go(-1);
})
+ };
-
- }
}
</script>
--
Gitblit v1.8.0