imacat/lucia-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

my account page without component button

Browse Source
This commit is contained in:
Cindy Chang
2024-08-30 09:41:28 +08:00
parent 9cf10f5108
commit 700b701984
2 changed files with 20 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/stores/login.ts
View File

@@ -67,7 +67,6 @@ export default defineStore('loginStore', {
try { try {
const response = await axios.post(api, this.auth, config); const response = await axios.post(api, this.auth, config);
console.log('response', response);
if(response.status === 200) { if(response.status === 200) {
const newAccessToken = response.data.access_token; const newAccessToken = response.data.access_token;
const newRefreshToken = response.data.refresh_token; const newRefreshToken = response.data.refresh_token;

27
src/views/AccountManagement/MyAccount.vue
View File

@@ -1,6 +1,6 @@
<template> <template>
<div class="general my-account flex flex-col items-center w-full h-full p-8"> <div class="general my-account flex flex-col items-center w-full h-full p-8">
<main class="flex main-part flex-col px-6 mt-6 w-[720px]"> <main class="flex main-part flex-col px-8 mt-6 w-[720px]">
<h1 id="general_acct_info_user_name" class="text-[32px] leading-[64px] font-medium mb-2"> <h1 id="general_acct_info_user_name" class="text-[32px] leading-[64px] font-medium mb-2">
{{ name }} {{ name }}
</h1> </h1>
@@ -15,7 +15,7 @@
</span> times. </span> times.
</div> </div>
</main> </main>
<main class="flex flex-col pt-6 px-6 w-[720px]"> <main class="flex flex-col pt-6 px-8 w-[720px]">
<h1 class="text-[20px] font-medium mb-4"> <h1 class="text-[20px] font-medium mb-4">
{{ i18next.t("AcctMgmt.UserInfo") }} {{ i18next.t("AcctMgmt.UserInfo") }}
</h1> </h1>
@@ -38,7 +38,7 @@
</div> </div>
</div> </div>
<div class="row w-full flex py-2 h-[40px] mb-4 items-center text-[14px]"> <div class="row w-full flex py-2 h-[40px] mb-4 items-center text-[14px]">
<div class="field-label text-sm flex font-medium mr-4"> <div class="field-label text-sm flex font-medium mr-4 box-border">
<span class="flex w-[80px]"> <span class="flex w-[80px]">
{{ i18next.t("AcctMgmt.FullName") }} {{ i18next.t("AcctMgmt.FullName") }}
</span> </span>
@@ -61,9 +61,9 @@
@click="onCancelNameClick"> @click="onCancelNameClick">
{{ i18next.t("Global.Cancel") }} {{ i18next.t("Global.Cancel") }}
</button> </button>
<!-- margin-left 是目測找出來的數字 -->
<button v-else class="flex save-btn rounded-full text-[#666666] h-[32px] w-[80px] items-center <button v-else class="flex save-btn rounded-full text-[#666666] h-[32px] w-[80px] items-center
bg-[#FFFFFF] justify-center cursor-pointer ml-[214px] border border-[#666666]" bg-[#FFFFFF] justify-center cursor-pointer ml-[204px] border border-[#666666]
box-border"
@click="onEditNameClick" @click="onEditNameClick"
> >
{{ i18next.t("Global.Edit") }} {{ i18next.t("Global.Edit") }}
@@ -97,9 +97,16 @@
</div> </div>
</div> </div>
<div class="button-and-dummy-column flex flex-col text-[14px]"> <div class="button-and-dummy-column flex flex-col text-[14px]">
<div class="button-group flex"> <div class="button-group flex w-min-[80px] h-[40px]">
<button v-if='isPwdEditable' class="flex save-btn rounded-full text-[#FFFFFF] h-[32px] w-[80px] items-center <button v-if='isPwdEditable' class="flex save-btn rounded-full text-[#FFFFFF] h-[32px] w-[80px] items-center
bg-[#0099FF] justify-center cursor-pointer ml-[112px]" bg-[#0099FF] justify-center cursor-pointer ml-[112px]"
:class="{
'border-[#CCCCCC]': !isPwdLengthValid,
'border-[1px]': !isPwdLengthValid,
'text-[#CCCCCC]': !isPwdLengthValid,
'bg-[#FFFFFF]': !isPwdLengthValid,
'cursor-auto': !isPwdLengthValid,
}"
@click="onSavePwdClick"> @click="onSavePwdClick">
{{ i18next.t("Global.Save") }} {{ i18next.t("Global.Save") }}
</button> </button>
@@ -119,6 +126,11 @@
</div> </div>
</div> </div>
</main> </main>
<main class="session flex flex-col pt-6 px-8 w-[720px]">
<h1 class="text-[20px] font-medium mb-4">
{{ i18next.t("AcctMgmt.Session") }}
</h1>
</main>
</div> </div>
</template> </template>
@@ -192,7 +204,8 @@ export default {
const onCancelPwdClick = () => { const onCancelPwdClick = () => {
isPwdEditable.value = false; isPwdEditable.value = false;
inputPwd.value = false; inputPwd.value = '';
isPwdLengthValid.value = true;
}; };
const togglePwdEyeBtn = (toBeOpen) => { const togglePwdEyeBtn = (toBeOpen) => {