From 033b0f1604eae764f6d703984da1d854eb0f9368 Mon Sep 17 00:00:00 2001 From: congzc Date: Mon, 12 Jun 2023 18:26:17 +0800 Subject: [PATCH] =?UTF-8?q?=E8=B4=A6=E6=88=B7=E4=BF=A1=E6=81=AF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apis/myAccount.js | 25 ++++ src/components/myLoadingIcon.vue | 51 ++++++++ src/lang/package/en.ts | 62 +++++---- src/lang/package/zh-cn.ts | 12 +- src/layout/components/Navbar.vue | 27 +++- src/main.ts | 3 +- src/store/modules/userInfo.js | 15 ++- src/styles/my.scss | 27 +++- src/types/components.d.ts | 2 + src/views/createVideo/index.vue | 212 ++++++++++++++++++++++++++++-- src/views/login/index.vue | 6 +- src/views/myAccount/index.vue | 216 ++++++++++++++++++++++++++++--- src/views/myCreating/index.vue | 11 +- src/views/myStore/index.vue | 17 ++- 14 files changed, 611 insertions(+), 75 deletions(-) create mode 100644 src/components/myLoadingIcon.vue diff --git a/src/apis/myAccount.js b/src/apis/myAccount.js index 3371ea8..bec0256 100644 --- a/src/apis/myAccount.js +++ b/src/apis/myAccount.js @@ -48,4 +48,29 @@ export function useCodeUserApi() { url: `api/user/getUseCodeUser`, method: 'get' }) +} + +/** + * @description 修改用户名和头像 + * @params + * @returns + */ +export function updUserInfoApi(data) { + return request({ + url: `api/user/updUserInfo`, + method: 'post', + data + }) +} + +/** + * @description 获取用户信息 + * @params + * @returns + */ +export function getUserInfoApi() { + return request({ + url: `api/user/getUserInfo`, + method: 'get', + }) } \ No newline at end of file diff --git a/src/components/myLoadingIcon.vue b/src/components/myLoadingIcon.vue new file mode 100644 index 0000000..3366999 --- /dev/null +++ b/src/components/myLoadingIcon.vue @@ -0,0 +1,51 @@ + + + + diff --git a/src/lang/package/en.ts b/src/lang/package/en.ts index eefbee5..b192b79 100644 --- a/src/lang/package/en.ts +++ b/src/lang/package/en.ts @@ -4,30 +4,36 @@ export default { dashboard: "Dashboard", document: "Document", }, - + // 公用 + public:{ + cancel:'Cancel', + confirm:'Confirm', + username:'Username', + avatar:'Avatar', + }, // 登录页面国际化 login: { title: "Metavatar-PC", username: "Username", email: "E-mail", password: "Password", - confirmPassword: "Confirm Password", + confirmPassword: "Confirm password", login: "Sign in", register: "Sign up", loginBtn: "Sign in", registerBtn: "Sign up", - verifyCode: "Verify Code", + verifyCode: "Verify code", signIn: "Already got an account? Sign in here", signUp: "Don't have an account? Sign up here", forgetPwd: "I forgot my password", - forgetPwdTitle:'forgot password', + forgetPwdTitle:'Forgot password', SendEmail:'Send an email', resetPassword:'Reset password', setNewPwd:'Set new password', - newPwd:'new password', - oldPwd:'old password', - confirmNewPwd:'confirm new password', - confirm:'confirm', + newPwd:'New password', + oldPwd:'Old password', + confirmNewPwd:'Confirm new password', + confirm:'Confirm', gohome:'Back to home page' }, @@ -40,26 +46,29 @@ export default { // 创作视频 createVideo: { - title: "CreateVideo", - availableMould:"Available Moulds", + title: "Create Video", + availableMould:"Available moulds", personalWarehouse:'Personal warehouse', - typeScript: "Type your Script", - uploadAudio: "Upload Audio", + typeScript: "Type your script", + uploadAudio: "Upload audio", recordedAudio:'Recorded audio', startRecorded:'Start recording', stopRecorded:'Stop recording', - aiScript: "Ai Script", + aiScript: "Ai script", typeTitle: "Type a title", confirm: "Confirm", aiText: "Please input here", languages: "Languages", voices: "Voices", styles: "Styles", - reselect: "reselect", + reselect: "Reselect", sureUpload: "Confirm upload", - generateVideo: "Generate Video", - saveVideo:'save manuscript', + generateVideo: "Generate video", + saveVideo:'Save manuscript', select:'Please select', + music:'Music', + Aipicture:'Ai-generated pictures', + AipictureTip:'Please customize your picture', }, // 我的视频 @@ -68,28 +77,29 @@ export default { search: "Search...", name: "Name", date: "Date", - videoTitle: "Video Title:", + videoTitle: "Video title:", download: "Download", delete: "Delete", more: "More", loading: "Loading , just a moment", noList: "Nothing here. How about making one ?", - goCreate: "Go Create !", - manuscript: "manuscript", + goCreate: "Go create !", + manuscript: "Manuscript", generating: "Generating", generationFailed: "Failed", generationSucceed: "Succeed", - manuscriptText: "manuscript", - generatingText: "The video is generating, please wait a moment", + manuscriptText: "Manuscript", + generatingText: "The video is generating, Please wait a moment", generationFailedText: "The video generate is failed, Reason:", - edit:'edit' + edit:'Edit' }, // 个人账户 account: { title: "My Account", - reSetPwd: "Reset Password", - until: "until", + reSetPwd: "Reset password", + editInfo:'Edit personal information', + until: "Until", getMore: "UPGRADE", copyCode: "Copy invitation code", saveCode: "Save QR code", @@ -102,7 +112,7 @@ export default { failed: "Failed", msg1: "Obtain one video production time", inputCode:'Please enter the invitation code', - submit:'submit', + submit:'Submit', noListOrder: "没有数据哦,快去邀请更多人加入我们吧~", noListInvite: "No data, please invite more people to join us", }, @@ -128,7 +138,7 @@ export default { expired: "Your ticket is expired. You can click the button to resend new email then", sendSuccess: "The email has been resent, you can check it now", - goLogin: "Login Now", + goLogin: "Login now", reSend: "Resend", }, }; diff --git a/src/lang/package/zh-cn.ts b/src/lang/package/zh-cn.ts index d2fa0e1..f08c51b 100644 --- a/src/lang/package/zh-cn.ts +++ b/src/lang/package/zh-cn.ts @@ -4,7 +4,13 @@ export default { dashboard: "首页", document: "项目文档", }, - + // 公用 + public:{ + cancel:'取消', + confirm:'确定', + username:'用户名', + avatar:'头像', + }, // 登录页面国际化 login: { title: "Metavatar-PC", @@ -60,6 +66,9 @@ export default { generateVideo: "生成视频", saveVideo:'保存草稿', select:'请选择', + music:'音乐', + Aipicture:'Ai生成图片', + AipictureTip:'请自定义您的图片', }, // 我的视频 @@ -89,6 +98,7 @@ export default { account: { title: "个人账户", reSetPwd: "修改密码", + editInfo:'编辑个人信息', until: "有效期至", getMore: "升级套餐", copyCode: "复制邀请码", diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue index ddb5f5f..fe8e71d 100644 --- a/src/layout/components/Navbar.vue +++ b/src/layout/components/Navbar.vue @@ -16,7 +16,13 @@ - +
+ +
@@ -43,7 +49,8 @@ import { useTagsViewStore } from "@/store/modules/tagsView"; import { useUserStore } from "@/store/modules/user"; import { useI18n } from "vue-i18n"; import LangSelect from "@/components/LangSelect/index.vue"; - +import { userInfoModules } from "@/store/modules/userInfo"; +const userInfoPinia = userInfoModules(); //pinia const { locale } = useI18n(); // 当前语言状态与国际化组件 @@ -159,13 +166,23 @@ watch( box-shadow: 0 0 1px #0003; padding-right: 50px; .avatar { - width: 30px; - height: 30px; + position: relative; + width: 50px; + height: 50px; margin-right: 10px; margin-left: 20px; - background-color: #4769da; + background-color: #fff; border-radius: 50%; cursor: pointer; + overflow: hidden; + img { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + max-width: 100%; + max-height: 100%; + } } .navItem { cursor: pointer; diff --git a/src/main.ts b/src/main.ts index c822504..8280add 100644 --- a/src/main.ts +++ b/src/main.ts @@ -19,6 +19,7 @@ import "uno.css"; import "@/styles/my.scss"; // 引入自己定义的样式 // 引入组件 import myLoading from "@/components/myLoading.vue"; +import myLoadingIcon from "@/components/myLoadingIcon.vue"; const app = createApp(App); @@ -33,4 +34,4 @@ app.use(ElementPlus); app.use(router).use(i18n).mount("#app"); // 注册全局组件 -app.component('myLoading',myLoading) \ No newline at end of file +app.component('myLoading',myLoading).component('myLoadingIcon',myLoadingIcon) \ No newline at end of file diff --git a/src/store/modules/userInfo.js b/src/store/modules/userInfo.js index db02748..f186337 100644 --- a/src/store/modules/userInfo.js +++ b/src/store/modules/userInfo.js @@ -1,14 +1,19 @@ import { defineStore } from "pinia"; import { store } from "@/store"; - -export const userInfoPinia = defineStore("userInfo", () => { +import { + getUserInfoApi, +} from "../../apis/myAccount"; +export const userInfoModules = defineStore("userInfo", () => { // state - const email = ref(""); + const userInfo = ref(null) function setEmail(params) { email.value = params } - - return { email, setEmail }; + async function getUserInfo() { + const res = await getUserInfoApi() + userInfo.value = res.data + } + return { userInfo, setEmail, getUserInfo }; }, { persist: true, diff --git a/src/styles/my.scss b/src/styles/my.scss index 8165314..58bb358 100644 --- a/src/styles/my.scss +++ b/src/styles/my.scss @@ -49,4 +49,29 @@ p { background: linear-gradient(225deg, rgb(81 217 202 / 100%), rgb(114 100 245 / 100%)); -} \ No newline at end of file +} + +// 自定义按钮 +.customBtn { + padding: 10px 15px; + text-align: center; + background-color: #fff; + color: #000; + transition: all .3s; + border-radius: 15px; + cursor: pointer; + + &:hover { + background-color: #000; + color: #fff; + } +} + +// element公共样式 +.el-dialog { + border-radius: 30px !important; +} + +// :deep(.el-input__wrapper.is-focus) { +// box-shadow: 0 0 0 1px #000 !important; +// } \ No newline at end of file diff --git a/src/types/components.d.ts b/src/types/components.d.ts index 019c155..cbeaaba 100644 --- a/src/types/components.d.ts +++ b/src/types/components.d.ts @@ -8,6 +8,7 @@ export {} declare module '@vue/runtime-core' { export interface GlobalComponents { Breadcrumb: typeof import('./../components/Breadcrumb/index.vue')['default'] + copy: typeof import('./../components/myLoading copy.vue')['default'] ElAlert: typeof import('element-plus/es')['ElAlert'] ElBreadcrumb: typeof import('element-plus/es')['ElBreadcrumb'] ElBreadcrumbItem: typeof import('element-plus/es')['ElBreadcrumbItem'] @@ -71,6 +72,7 @@ declare module '@vue/runtime-core' { LangSelect: typeof import('./../components/LangSelect/index.vue')['default'] MultiUpload: typeof import('./../components/Upload/MultiUpload.vue')['default'] MyLoading: typeof import('./../components/myLoading.vue')['default'] + MyLoadingIcon: typeof import('./../components/myLoadingIcon.vue')['default'] Pagination: typeof import('./../components/Pagination/index.vue')['default'] RightPanel: typeof import('./../components/RightPanel/index.vue')['default'] RouterLink: typeof import('vue-router')['RouterLink'] diff --git a/src/views/createVideo/index.vue b/src/views/createVideo/index.vue index ae8bcd4..7436c33 100644 --- a/src/views/createVideo/index.vue +++ b/src/views/createVideo/index.vue @@ -124,9 +124,23 @@ + +
+
+
+
+
+
+
+ +
+
+
+
+
{{ $t("createVideo.personalWarehouse") }}
+
+ {{ $t("createVideo.Aipicture") }} +
+ +
+
+ {{ $t("createVideo.AipictureTip") }} +
+
@@ -213,7 +246,7 @@
- +

{{ $t("createVideo.uploadAudio") }} @@ -352,7 +385,7 @@

- +
- + +
+
+ + + {{ $t("createVideo.confirm") }} + + + + + +
+

{{ $t("createVideo.languages") }}

+ + + +

{{ $t("createVideo.voices") }}

+ + + +

{{ $t("createVideo.styles") }}

+ + + + {{ + $t("createVideo.generateVideo") + }} +
+
+ +
- +
@@ -663,6 +761,13 @@ async function changeFile() { } //#endregion --------------------------- +//#region AI生成图片 +function chooseAiPic() { + showFace.value = 2; + showUploadBtn.value = 5; +} +//#endregion -------------------------- + //#region card1的逻辑 const textareaContent = ref(""); function insertIcon() { @@ -754,6 +859,7 @@ async function getPreviewAudio() { ); } previewAudioUrl.value = res.data.data; + document.getElementById("audio").play(); } catch (error) { ElMessage.error(error); } @@ -788,6 +894,7 @@ const stopRecording = async () => { audioUrl.value = URL.createObjectURL(recorder.getWAVBlob()); audioData.value = recorder.getWAVBlob(); isRecording.value = true; + console.log(document.getElementById("uploadAudio").duration); } catch (error) { console.error(error); } @@ -831,14 +938,31 @@ async function uploadAudio(isSaveVideo) { const fileInput = ref(null); let intervalId = null; // 用于存储 setInterval 的返回值 +const uploadAudioTime = ref(null); // 音频时长 const handleFileChange = async () => { const file = fileInput.value.files[0]; + if (file) { const videoUrl = URL.createObjectURL(file); audioUrl.value = videoUrl; audioData.value = file; + const audio2 = new Audio(); + audio2.src = videoUrl; + countAudioTime(audio2); } }; +// 计算音频的时长 +const countAudioTime = async (audio) => { + while (isNaN(audio.duration) || audio.duration === Infinity) { + // 延迟一会 不然网页都卡死 + await new Promise((resolve) => setTimeout(resolve, 200)); + // 设置随机播放时间,模拟调进度条 + audio.currentTime = 10000000 * Math.random(); + } + // console.log("音频的总时长:", Math.floor(audio.duration)); + uploadAudioTime.value = Math.floor(audio.duration); +}; + // 获取视频上传进度 const afterSaveAudioId = ref(null); async function uploadProgress(videoId, isSaveVideo) { @@ -1007,7 +1131,7 @@ onMounted(async () => { } .left { - width: 70%; + width: 68%; height: 80%; padding: 20px; :deep(.el-input__wrapper) { @@ -1160,6 +1284,54 @@ onMounted(async () => { border: 2px solid #000; border-radius: 50%; } + + .editAiPicBox { + position: relative; + display: flex; + width: 100%; + height: 100%; + border: 1px solid #ccc; + background-color: #f1f2f6; + border-radius: 30px; + overflow: hidden; + .edit { + width: 50%; + height: 100%; + + background-color: #fff; + .TagBox { + width: 100%; + height: 100%; + + border-radius: 0 0 30px 0; + background-color: #f1f2f6; + } + } + .AIpicBox { + position: relative; + width: 50%; + height: 100%; + border-radius: 30px 0 0 0; + background-color: #fff; + .picBox { + position: relative; + width: 100%; + height: 100%; + border-radius: 30px 0 0 0; + background-color: #fff; + img { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + + max-width: 100%; + max-height: 100%; + border-radius: 30px; + } + } + } + } } &-bottom { @@ -1197,7 +1369,7 @@ onMounted(async () => { overflow-y: scroll; .faceItem { position: relative; - margin-right: 35px; + margin-right: 30px; margin-bottom: 35px; width: 150px; height: 150px; @@ -1276,11 +1448,33 @@ onMounted(async () => { } } } + .Aipicture { + width: 100%; + height: 180px; + .title { + 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; + } + } } } .right { - width: 30%; + width: 32%; height: 100%; padding: 30px 30px 20px 30px; background-color: #f1f2f6; @@ -1449,7 +1643,7 @@ onMounted(async () => { } :deep(.el-tabs__item) { - width: 34%; + width: 25%; } :deep(.el-tabs__item:hover) { diff --git a/src/views/login/index.vue b/src/views/login/index.vue index cf15088..7fb2fba 100644 --- a/src/views/login/index.vue +++ b/src/views/login/index.vue @@ -502,7 +502,7 @@ import { import axios from "axios"; // 状态管理依赖 -import { userInfoPinia } from "@/store/modules/userInfo"; +import { userInfoModules } from "@/store/modules/userInfo"; // API依赖 import { @@ -515,7 +515,7 @@ import { useI18n } from "vue-i18n"; const { locale } = useI18n(); const currentLan = ref(locale); -const userInfo = userInfoPinia(); +const userInfoPinia = userInfoModules(); const route = useRoute(); const router = useRouter(); /** @@ -957,7 +957,7 @@ async function doLogin(data: any) { // 注册成功将账号密码保存到本地 saveInfo(data); isLogining.value = false; - userInfo.setEmail(data.email); //保存邮箱到pinia + userInfoPinia.getUserInfo(); //保存邮箱到pinia }) .catch((err) => { console.log(err, "err"); diff --git a/src/views/myAccount/index.vue b/src/views/myAccount/index.vue index 309882f..e4dfc97 100644 --- a/src/views/myAccount/index.vue +++ b/src/views/myAccount/index.vue @@ -5,16 +5,31 @@
- +
-
OLO
- {{ userInfo.email }} - {{ $t("account.reSetPwd") }} +
+ {{ userInfoPinia.userInfo.name }} +
+ {{ userInfoPinia.userInfo.email }} +
+ {{ + $t("account.editInfo") + }} + {{ $t("account.reSetPwd") }} +
@@ -134,6 +149,40 @@
+ + + + {{ $t("public.avatar") }}: + +
+ +
+
+ +
+
+
+ + {{ $t("public.username") }}: + + + + + +
+ {{ $t("public.cancel") }} +
+
+ {{ $t("public.confirm") }} +
+
+
@@ -141,21 +190,82 @@ //#region 导入文件 import { useI18n } from "vue-i18n"; import { useRouter } from "vue-router"; -import { userInfoPinia } from "@/store/modules/userInfo"; +import { userInfoModules } from "@/store/modules/userInfo"; import dayjs from "dayjs"; +import imageCompression from "browser-image-compression"; //压缩图片插件 import { inviteCodeApi, useCodeApi, isUseApi, useCodeUserApi, + updUserInfoApi, } from "../../apis/myAccount"; +import { awsImgUpload } from "@/apis/createVideo"; import defaultAvater from "../../assets/img/left-top-logo.png"; + //#endregion --------------------------- const { locale } = useI18n(); const lanChange = ref(locale); //国际化 -const userInfo = userInfoPinia(); //pinia +const userInfoPinia = userInfoModules(); //pinia + +//#region 编辑个人信息 +const showEditInfoDialog = ref(false); //控制弹窗显隐 +const userNameinput = ref(null); //用户名输入框绑定 +const dialogAvatarUrl = ref(null); //图片回显地址 +const dialogAvatarData = ref(null); //图片上传数据 +const infoDialogLoad = ref(false); //load效果 +// 选择图片 +async function chooseImg(e) { + if (e.target.files[0]) { + dialogAvatarUrl.value = null; + dialogAvatarData.value = null; + // 压缩配置 + const options = { + maxSizeMB: 2, // 最大压缩大小为 1MB + useWebWorker: true, // 使用 Web Worker 进行压缩,提高性能 + }; + const compressedFile = await imageCompression(e.target.files[0], options); + dialogAvatarUrl.value = URL.createObjectURL(compressedFile); + dialogAvatarData.value = compressedFile; + } else { + return; + } +} +// 上传编辑信息 +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` + ); + } +} +// 关闭弹窗清空 +function closeInfoDialog() { + userNameinput.value = userInfoPinia.userInfo.name; + dialogAvatarUrl.value = userInfoPinia.userInfo.avatarUrl; + dialogAvatarData.value = null; +} +//#endregion --------------------------- + //#region 二维码邀请码区域 const myInviteCode = ref(null); //我的邀请码 async function getMyInviteCode() { @@ -168,10 +278,18 @@ function copyInviteCode() { navigator.clipboard .writeText(inviteCode) .then(() => { - ElMessage.success("邀请码已复制到剪贴板"); + ElMessage.success( + lanChange.value == "zh-cn" + ? "邀请码已复制到剪贴板" + : `The invitation code has been copied to the clipboard` + ); }) .catch((error) => { - ElMessage.error("无法复制邀请码:", error); + ElMessage.error( + lanChange.value == "zh-cn" + ? "无法复制邀请码:" + : `Unable to copy invitation code` + ); }); } // 下载二维码图片 @@ -228,6 +346,8 @@ onMounted(() => { getMyInviteCode(); // 查询用户的邀请码 getIsUseState(); //查询是否使用过邀请码 getInviteList(); + userNameinput.value = userInfoPinia.userInfo.name; + dialogAvatarUrl.value = userInfoPinia.userInfo.avatarUrl; }); //#endregion --------------------------- @@ -249,7 +369,7 @@ function routerTo(url) { } .left { - width: 37%; + width: 39%; height: 100%; padding: 30px; @@ -307,6 +427,7 @@ function routerTo(url) { &-two { position: relative; height: 80px; + overflow: hidden; .number { font-size: 30px; @@ -322,12 +443,14 @@ function routerTo(url) { position: absolute; top: -1px; right: -1px; + padding: 5px; width: 80px; height: 80px; - line-height: 80px; + line-height: 70px; text-align: center; background-color: #000; color: #fff; + font-size: 14px; transition: all 0.3s; &:hover { background-color: #15d1b8; @@ -416,7 +539,7 @@ function routerTo(url) { .right { background-color: #f1f2f6; padding: 30px; - width: 63%; + width: 61%; height: 100%; // height: 95%; border-radius: 30px 0 0 0; @@ -567,6 +690,69 @@ function routerTo(url) { } } +.editInfoDialog { + .el-row { + display: flex; + justify-content: space-evenly; + } + .el-col { + margin-bottom: 10px; + text-align: right; + line-height: 32px; + padding-right: 20px; + } + .dialogAvatar { + position: relative; + width: 200px; + height: 200px; + background-color: rgba(204, 204, 204, 0.2); + border-radius: 30px; + overflow: hidden; + &:hover { + img { + z-index: 0; + } + .add { + background-color: rgba(0, 0, 0, 0.2); + } + } + input { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + opacity: 0; + z-index: 3; + cursor: pointer; + } + .add { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: 1; + text-align: center; + line-height: 200px; + font-size: 50px; + font-weight: 700; + color: #000; + transition: all 0.3s; + } + img { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + padding: 10px; + max-width: 100%; + max-height: 100%; + z-index: 2; + transition: all 0.3s; + } + } +} // 公共类名 .bigWord { font-size: 30px; diff --git a/src/views/myCreating/index.vue b/src/views/myCreating/index.vue index 760091f..6f6b08f 100644 --- a/src/views/myCreating/index.vue +++ b/src/views/myCreating/index.vue @@ -38,7 +38,7 @@
{{ item.title }} - {{ item.createDate }} + {{ dayjs(item.createDate).format("YYYY-MM-DD") }}
{ console.log(res, "res"); res.data.list.forEach((item) => { - item.createDate = timestampToTime(item.createDate) || ""; - item.updateDate = timestampToTime(item.updateDate) || ""; - item.createVideoDate = timestampToTime(item.createVideoDate) || ""; + // item.createDate = timestampToTime(item.createDate) || ""; + // item.updateDate = timestampToTime(item.updateDate) || ""; + // item.createVideoDate = timestampToTime(item.createVideoDate) || ""; item.statusName = getStatus(item.videoStatus); }); videoList.value = res.data.list; @@ -514,6 +514,7 @@ onMounted(() => { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; + font-size: 13px; } .statusName { position: absolute; diff --git a/src/views/myStore/index.vue b/src/views/myStore/index.vue index 2ef9e62..a921018 100644 --- a/src/views/myStore/index.vue +++ b/src/views/myStore/index.vue @@ -86,7 +86,8 @@ >
- + +
扫描二维码进行付款
@@ -169,7 +170,6 @@ const showPayDialog = ref(false); //套餐信息dialog显示隐藏 const presentItme = reactive({}); //点击的套餐项 function clickPayDialog(item) { presentItme.value = item; - console.log(presentItme); showPayDialog.value = true; } function showOrderCode(type) { @@ -179,6 +179,7 @@ function showOrderCode(type) { //#region 点击套餐内的支付 const orderCodeDialogShow = ref(false); +const orderCodeUrl = ref(null); //#endregion ------------------------------------ //#region @@ -352,10 +353,18 @@ const orderCodeDialogShow = ref(false); width: 100%; .codeImg { display: flex; + margin: auto; justify-content: space-evenly; + align-items: center; + width: 300px; + height: 300px; + border: 1px solid #ccc; + border-radius: 15px; + overflow: hidden; + padding: 10px; img { - width: 300px; - height: 300px; + width: 100%; + height: 100%; } } .tips {