|  | @@ -7,18 +7,18 @@ | 
														
													
														
															
																|  |  | <div class="avatar"> |  |  | <div class="avatar"> | 
														
													
														
															
																|  |  | <img |  |  | <img | 
														
													
														
															
																|  |  | :src=" |  |  | :src=" | 
														
													
														
															
																|  |  | userInfoPinia.userInfo.avatarUrl |  |  |  | 
														
													
														
															
																|  |  | ? userInfoPinia.userInfo.avatarUrl |  |  |  | 
														
													
														
															
																|  |  |  |  |  | localStorageAccountInfo.avatarUrl | 
														
													
														
															
																|  |  |  |  |  | ? localStorageAccountInfo.avatarUrl | 
														
													
														
															
																|  |  | : defaultAvater |  |  | : defaultAvater | 
														
													
														
															
																|  |  | " |  |  | " | 
														
													
														
															
																|  |  | alt="" |  |  | alt="" | 
														
													
														
															
																|  |  | /> |  |  | /> | 
														
													
														
															
																|  |  | </div> |  |  | </div> | 
														
													
														
															
																|  |  | <div class="info"> |  |  | <div class="info"> | 
														
													
														
															
																|  |  | <div class="name" v-if="userInfoPinia.userInfo.name"> |  |  |  | 
														
													
														
															
																|  |  | {{ userInfoPinia.userInfo.name }} |  |  |  | 
														
													
														
															
																|  |  |  |  |  | <div class="name" v-if="localStorageAccountInfo.name"> | 
														
													
														
															
																|  |  |  |  |  | {{ localStorageAccountInfo.name }} | 
														
													
														
															
																|  |  | </div> |  |  | </div> | 
														
													
														
															
																|  |  | <span>{{ userInfoPinia.userInfo.email }}</span> |  |  |  | 
														
													
														
															
																|  |  |  |  |  | <span>{{ localStorageAccountInfo.email }}</span> | 
														
													
														
															
																|  |  | <div> |  |  | <div> | 
														
													
														
															
																|  |  | <span class="password pointer" @click="showEditInfoDialog = true">{{ |  |  | <span class="password pointer" @click="showEditInfoDialog = true">{{ | 
														
													
														
															
																|  |  | $t("account.editInfo") |  |  | $t("account.editInfo") | 
														
													
												
													
														
															
																|  | @@ -49,6 +49,12 @@ | 
														
													
														
															
																|  |  | <!-- <div class="codeImg"> |  |  | <!-- <div class="codeImg"> | 
														
													
														
															
																|  |  | <img ref="codeImgRef" :src="defaultAvater" alt="" /> |  |  | <img ref="codeImgRef" :src="defaultAvater" alt="" /> | 
														
													
														
															
																|  |  | </div> --> |  |  | </div> --> | 
														
													
														
															
																|  |  |  |  |  | <div class="mask"> | 
														
													
														
															
																|  |  |  |  |  | <div class="title"> | 
														
													
														
															
																|  |  |  |  |  | <el-icon><i-ep-Lock /></el-icon> | 
														
													
														
															
																|  |  |  |  |  | {{ $t("createVideo.comingSoon") }} | 
														
													
														
															
																|  |  |  |  |  | </div> | 
														
													
														
															
																|  |  |  |  |  | </div> | 
														
													
														
															
																|  |  | <div class="other"> |  |  | <div class="other"> | 
														
													
														
															
																|  |  | <div v-if="lanChange == 'en'"> |  |  | <div v-if="lanChange == 'en'"> | 
														
													
														
															
																|  |  | <span>Invite friends to get</span> |  |  | <span>Invite friends to get</span> | 
														
													
												
													
														
															
																|  | @@ -214,6 +220,10 @@ const { locale } = useI18n(); | 
														
													
														
															
																|  |  | const lanChange = ref(locale); //国际化 |  |  | const lanChange = ref(locale); //国际化 | 
														
													
														
															
																|  |  | 
 |  |  | 
 | 
														
													
														
															
																|  |  | const userInfoPinia = userInfoModules(); //pinia |  |  | const userInfoPinia = userInfoModules(); //pinia | 
														
													
														
															
																|  |  |  |  |  | // const userInfoPinia = localStorage.getItem("AccountInfo");//pinia | 
														
													
														
															
																|  |  |  |  |  | const localStorageAccountInfo = ref( | 
														
													
														
															
																|  |  |  |  |  | JSON.parse(localStorage.getItem("AccountInfo")) | 
														
													
														
															
																|  |  |  |  |  | ); | 
														
													
														
															
																|  |  | 
 |  |  | 
 | 
														
													
														
															
																|  |  | //#region 编辑个人信息 |  |  | //#region 编辑个人信息 | 
														
													
														
															
																|  |  | const showEditInfoDialog = ref(false); //控制弹窗显隐 |  |  | const showEditInfoDialog = ref(false); //控制弹窗显隐 | 
														
													
												
													
														
															
																|  | @@ -240,33 +250,55 @@ async function chooseImg(e) { | 
														
													
														
															
																|  |  | } |  |  | } | 
														
													
														
															
																|  |  | // 上传编辑信息 |  |  | // 上传编辑信息 | 
														
													
														
															
																|  |  | async function submitUserInfo() { |  |  | 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() { |  |  | 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; |  |  | dialogAvatarData.value = null; | 
														
													
														
															
																|  |  | } |  |  | } | 
														
													
														
															
																|  |  | //#endregion --------------------------- |  |  | //#endregion --------------------------- | 
														
													
												
													
														
															
																|  | @@ -362,10 +394,15 @@ onMounted(() => { | 
														
													
														
															
																|  |  | getMyInviteCode(); // 查询用户的邀请码 |  |  | getMyInviteCode(); // 查询用户的邀请码 | 
														
													
														
															
																|  |  | getIsUseState(); //查询是否使用过邀请码 |  |  | getIsUseState(); //查询是否使用过邀请码 | 
														
													
														
															
																|  |  | getInviteList(); |  |  | 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 --------------------------- |  |  | //#endregion --------------------------- | 
														
													
														
															
																|  |  | 
 |  |  | 
 | 
														
													
												
													
														
															
																|  | @@ -478,7 +515,50 @@ function routerTo(url) { | 
														
													
														
															
																|  |  | } |  |  | } | 
														
													
														
															
																|  |  | 
 |  |  | 
 | 
														
													
														
															
																|  |  | &-three { |  |  | &-three { | 
														
													
														
															
																|  |  |  |  |  | position: relative; | 
														
													
														
															
																|  |  | height: 200px; |  |  | 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 { |  |  | .codeImg { | 
														
													
														
															
																|  |  | position: relative; |  |  | position: relative; | 
														
													
														
															
																|  |  | padding: 10px; |  |  | padding: 10px; | 
														
													
												
													
														
															
																|  | 
 |