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

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

@@ -1,6 +1,6 @@
<template>
<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">
{{ name }}
</h1>
@@ -15,7 +15,7 @@
</span> times.
</div>
</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">
{{ i18next.t("AcctMgmt.UserInfo") }}
</h1>
@@ -38,7 +38,7 @@
</div>
</div>
<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]">
{{ i18next.t("AcctMgmt.FullName") }}
</span>
@@ -61,9 +61,9 @@
@click="onCancelNameClick">
{{ i18next.t("Global.Cancel") }}
</button>
<!-- margin-left 是目測找出來的數字 -->
<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"
>
{{ i18next.t("Global.Edit") }}
@@ -97,9 +97,16 @@
</div>
</div>
<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
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">
{{ i18next.t("Global.Save") }}
</button>
@@ -119,6 +126,11 @@
</div>
</div>
</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>
</template>
@@ -192,7 +204,8 @@ export default {
const onCancelPwdClick = () => {
isPwdEditable.value = false;
inputPwd.value = false;
inputPwd.value = '';
isPwdLengthValid.value = true;
};
const togglePwdEyeBtn = (toBeOpen) => {