From 14cb362efdb21c24c1a2a7bf1f5d1cf6749aebfb Mon Sep 17 00:00:00 2001 From: congzc Date: Tue, 20 Jun 2023 18:13:17 +0800 Subject: [PATCH] 2 --- src/store/modules/userInfo.js | 5 +- src/views/myAccount/index.vue | 144 ++++++++++++++++++++++++++-------- src/views/myStore/index.vue | 2 +- 3 files changed, 117 insertions(+), 34 deletions(-) diff --git a/src/store/modules/userInfo.js b/src/store/modules/userInfo.js index 5d48bd6..ffd8035 100644 --- a/src/store/modules/userInfo.js +++ b/src/store/modules/userInfo.js @@ -5,21 +5,24 @@ import { } from "../../apis/myAccount"; export const userInfoModules = defineStore("userInfoState", () => { // state + // const userInfo = ref(null) const userInfo = ref({}) // 登录获取用户信息 async function getUserInfo() { const res = await getUserInfoApi() userInfo.value = res.data + localStorage.setItem("AccountInfo", JSON.stringify(res.data)); } // 退出清除用户信息 function loginOut(params) { userInfo.value = { avatarUrl: null } + localStorage.removeItem("AccountInfo"); } return { userInfo, getUserInfo, loginOut }; }, { - persist: true, + persist: true }); \ No newline at end of file diff --git a/src/views/myAccount/index.vue b/src/views/myAccount/index.vue index b827c55..c7ffd32 100644 --- a/src/views/myAccount/index.vue +++ b/src/views/myAccount/index.vue @@ -7,18 +7,18 @@
-
- {{ userInfoPinia.userInfo.name }} +
+ {{ localStorageAccountInfo.name }}
- {{ userInfoPinia.userInfo.email }} + {{ localStorageAccountInfo.email }}
{{ $t("account.editInfo") @@ -49,6 +49,12 @@ +
+
+ + {{ $t("createVideo.comingSoon") }} +
+
Invite friends to get @@ -214,6 +220,10 @@ const { locale } = useI18n(); const lanChange = ref(locale); //国际化 const userInfoPinia = userInfoModules(); //pinia +// const userInfoPinia = localStorage.getItem("AccountInfo");//pinia +const localStorageAccountInfo = ref( + JSON.parse(localStorage.getItem("AccountInfo")) +); //#region 编辑个人信息 const showEditInfoDialog = ref(false); //控制弹窗显隐 @@ -240,33 +250,55 @@ async function chooseImg(e) { } // 上传编辑信息 async function submitUserInfo() { - let formData = new FormData(); - const timestamp = Date.now(); - formData.append("file", dialogAvatarData.value, timestamp + ".png"); - const res1 = await awsImgUpload(formData); - const data = { - name: userNameinput.value, - avatarUrl: res1.data.url, - }; - try { - const res2 = await updUserInfoApi(data); - ElMessage.success( - lanChange.value == "zh-cn" ? `修改成功` : `Modified successfully` - ); - userInfoPinia.getUserInfo(); - showEditInfoDialog.value = false; - } catch (error) { - ElMessage.error( - lanChange.value == "zh-cn" - ? `修改失败,请稍后重试` - : `The modification failed. Please try again later` - ); + if (dialogAvatarData.value) { + let formData = new FormData(); + const timestamp = Date.now(); + formData.append("file", dialogAvatarData.value, timestamp + ".png"); + const res1 = await awsImgUpload(formData); + const data = { + name: userNameinput.value, + avatarUrl: res1.data.url, + }; + try { + const res2 = await updUserInfoApi(data); + ElMessage.success( + lanChange.value == "zh-cn" ? `修改成功` : `Modified successfully` + ); + await userInfoPinia.getUserInfo(); + showEditInfoDialog.value = false; + router.go(0); + } catch (error) { + ElMessage.error( + lanChange.value == "zh-cn" + ? `修改失败,请稍后重试` + : `The modification failed. Please try again later` + ); + } + } else { + const data = { + name: userNameinput.value, + }; + try { + const res2 = await updUserInfoApi(data); + ElMessage.success( + lanChange.value == "zh-cn" ? `修改成功` : `Modified successfully` + ); + await userInfoPinia.getUserInfo(); + showEditInfoDialog.value = false; + router.go(0); + } catch (error) { + ElMessage.error( + lanChange.value == "zh-cn" + ? `修改失败,请稍后重试` + : `The modification failed. Please try again later` + ); + } } } // 关闭弹窗清空 function closeInfoDialog() { - userNameinput.value = userInfoPinia.userInfo.name; - dialogAvatarUrl.value = userInfoPinia.userInfo.avatarUrl; + userNameinput.value = localStorageAccountInfo.value.name; + dialogAvatarUrl.value = localStorageAccountInfo.value.avatarUrl; dialogAvatarData.value = null; } //#endregion --------------------------- @@ -362,10 +394,15 @@ onMounted(() => { getMyInviteCode(); // 查询用户的邀请码 getIsUseState(); //查询是否使用过邀请码 getInviteList(); - console.log(userInfoPinia.userInfo); - console.log(localStorage.userInfo); - userNameinput.value = userInfoPinia.userInfo.name; - dialogAvatarUrl.value = userInfoPinia.userInfo.avatarUrl; + + userNameinput.value = localStorageAccountInfo.value.name; + dialogAvatarUrl.value = localStorageAccountInfo.value.avatarUrl; +}); +//#endregion --------------------------- + +//#region +watch(localStorageAccountInfo.value, (newValue) => { + console.log("LocalStorage 的值发生了变化:", newValue); }); //#endregion --------------------------- @@ -478,7 +515,50 @@ function routerTo(url) { } &-three { + position: relative; height: 200px; + overflow: hidden; + .mask { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + line-height: 780px; + font-size: 120px; + font-weight: 900; + text-align: center; + background-color: rgba(0, 0, 0, 0.5); + + z-index: 9; + .title { + position: absolute; + top: 20%; + left: 38%; + font-size: 30px; + text-align: center; + line-height: 80px; + background-image: -webkit-linear-gradient( + left, + #4b61dc, + #15d1b8 25%, + #4b61dc 50%, + #15d1b8 75%, + #4b61dc + ) !important; + -webkit-text-fill-color: transparent !important; + -webkit-background-clip: text !important; + background-clip: text !important; + -webkit-background-size: 200% 100% !important; + background-size: 200% 100% !important; + .el-icon { + padding-top: -3px; + color: #15d1b8; + vertical-align: middle; + font-size: 25px; + } + } + } .codeImg { position: relative; padding: 10px; diff --git a/src/views/myStore/index.vue b/src/views/myStore/index.vue index 8d187ac..c899055 100644 --- a/src/views/myStore/index.vue +++ b/src/views/myStore/index.vue @@ -12,7 +12,7 @@
- {{ item.typeDesc }} + {{ lanChange == "zh-cn" ? item.typeDesc : item.englishName }}
{{