From 770181fb81daea58f48d568ca43fefbbe5041a9a Mon Sep 17 00:00:00 2001
From: XiaoXinPro 14 IAH5R <568170040@qq.com>
Date: Tue, 23 May 2023 16:25:53 +0800
Subject: [PATCH 1/5] =?UTF-8?q?=E5=9B=BD=E9=99=85=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/components/LangSelect/index.vue | 20 ++-
src/lang/package/en.ts | 73 ++++++++--
src/lang/package/zh-cn.ts | 73 ++++++++--
src/layout/components/Navbar.vue | 162 +++++++++++++----------
src/layout/components/Sidebar/index.vue | 11 +-
src/layout/components/TagsView/index.vue | 2 +-
src/router/index.ts | 17 ++-
src/views/createVideo/index.vue | 46 +++++--
src/views/myAccount/index.vue | 27 ++--
src/views/myCreating/index.vue | 20 +--
10 files changed, 301 insertions(+), 150 deletions(-)
diff --git a/src/components/LangSelect/index.vue b/src/components/LangSelect/index.vue
index 4880cd0..aa4652f 100644
--- a/src/components/LangSelect/index.vue
+++ b/src/components/LangSelect/index.vue
@@ -1,7 +1,7 @@
-
+
@@ -37,3 +37,9 @@ function handleLanguageChange(lang: string) {
+
+
diff --git a/src/lang/package/en.ts b/src/lang/package/en.ts
index 44d40bd..ceaaef8 100644
--- a/src/lang/package/en.ts
+++ b/src/lang/package/en.ts
@@ -1,22 +1,71 @@
export default {
// 路由国际化
route: {
- dashboard: 'Dashboard',
- document: 'Document'
+ dashboard: "Dashboard",
+ document: "Document",
},
+
// 登录页面国际化
login: {
- title: 'Metavatar-PC',
- username: 'Username',
- password: 'Password',
- login: 'Login',
- verifyCode: 'Verify Code',
+ title: "Metavatar-PC",
+ username: "Username",
+ password: "Password",
+ login: "Login",
+ verifyCode: "Verify Code",
},
+
// 导航栏国际化
navbar: {
- dashboard: 'Dashboard',
- logout: 'Logout',
- document: 'Document',
- gitee: 'Gitee'
- }
+ account: "Account",
+ logout: "Logout",
+ },
+
+ // 创作视频
+ createVideo: {
+ title: "CreateVideo",
+ typeScript: "Type your Script",
+ uploadAudio: "Upload Audio",
+ aiScript: "Ai Script",
+ typeTitle: "Type a title",
+ confirm: "Confirm",
+ aiText: "Please input here",
+ languages: "Languages",
+ voices: "Voices",
+ styles: "Styles",
+ reload: "Reload",
+ generateVideo: "Generate Video",
+ },
+
+ // 我的视频
+ myCreating: {
+ title: "My Creating",
+ typeTitle: "Type a title",
+ name: "Name",
+ date: "Date",
+ download: "Download",
+ delete: "Delete",
+ more: "More",
+ },
+
+ // 个人账户
+ account: {
+ title: "My Account",
+ reSetPwd: "Reset Password",
+ getMore: "UPGRADE",
+ copyCode: "Copy invitation code",
+ saveCode: "Save QR code",
+ buyHistory: "OrderHistory",
+ inviteHistory: "InviteHistory",
+ orderID: "OrderID",
+ price: "Price",
+ date: "Date",
+ successed: "Successed",
+ failed: "Failed",
+ msg1: "Obtain one video production time",
+ },
+
+ // 商店
+ shop: {
+ title: "Shop",
+ },
};
diff --git a/src/lang/package/zh-cn.ts b/src/lang/package/zh-cn.ts
index 6e7bac7..367573e 100644
--- a/src/lang/package/zh-cn.ts
+++ b/src/lang/package/zh-cn.ts
@@ -1,22 +1,71 @@
export default {
// 路由国际化
route: {
- dashboard: '首页',
- document: '项目文档'
+ dashboard: "首页",
+ document: "项目文档",
},
+
// 登录页面国际化
login: {
- title: 'Metavatar-PC',
- username: '用户名',
- password: '密码',
- login: '登 录',
- verifyCode: '验证码'
+ title: "Metavatar-PC",
+ username: "用户名",
+ password: "密码",
+ login: "登 录",
+ verifyCode: "验证码",
},
+
// 导航栏国际化
navbar: {
- dashboard: '首页',
- logout: '注销',
- document: '项目文档',
- gitee: '码云'
- }
+ account: "账户",
+ logout: "注销",
+ },
+
+ // 创作视频
+ createVideo: {
+ title: "创作视频",
+ typeScript: "输入文案",
+ uploadAudio: "上传视频",
+ aiScript: "AI生成文本",
+ typeTitle: "输入标题",
+ confirm: "确定",
+ aiText: "在此输入",
+ languages: "选择语言",
+ voices: "选择声音",
+ styles: "选择风格",
+ reload: "重新上传",
+ generateVideo: "生成视频",
+ },
+
+ // 我的视频
+ myCreating: {
+ title: "我的视频",
+ typeTitle: "输入标题",
+ name: "名称",
+ date: "时间",
+ download: "下载",
+ delete: "删除",
+ more: "更多",
+ },
+
+ // 个人账户
+ account: {
+ title: "个人账户",
+ reSetPwd: "修改密码",
+ getMore: "升级套餐",
+ copyCode: "复制邀请码",
+ saveCode: "保存二维码",
+ buyHistory: "购买记录",
+ inviteHistory: "邀请记录",
+ orderID: "订单号",
+ price: "支付金额",
+ date: "购买日期",
+ successed: "支付成功",
+ failed: "支付失败",
+ msg1: "获得视频制作次数一次",
+ },
+
+ // 商店
+ shop: {
+ title: "商店",
+ },
};
diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue
index cc0b051..6347b62 100644
--- a/src/layout/components/Navbar.vue
+++ b/src/layout/components/Navbar.vue
@@ -1,3 +1,78 @@
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ $t(routeName as string) }}
+
+
+
+
+
+
+
{{ $t("navbar.account") }}
+
+ {{ $t("navbar.logout") }}
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
{{ routeName }}
-
-
个人账户
-
退出登录
-
-
-
diff --git a/src/layout/components/Sidebar/index.vue b/src/layout/components/Sidebar/index.vue
index 61fa256..4d33235 100644
--- a/src/layout/components/Sidebar/index.vue
+++ b/src/layout/components/Sidebar/index.vue
@@ -7,19 +7,19 @@
- 创作视频
+ {{ $t("createVideo.title") }}
- 我的视频
+ {{ $t("myCreating.title") }}
- 商店
+ {{ $t("shop.title") }}
-
+
@@ -60,30 +63,35 @@
-
+
111111111111111111
-
+
22222222222222222
-
+
-
- submit
+
+
+ {{ $t("createVideo.confirm") }}
+
-
language
+
{{ $t("createVideo.languages") }}
-
voices
+
{{ $t("createVideo.voices") }}
-
style
+
{{ $t("createVideo.styles") }}
-
Generate Video
+
{{
+ $t("createVideo.generateVideo")
+ }}
@@ -139,8 +149,20 @@ function changeFile(e) {
imgUrl.value = URL.createObjectURL(e.target.files[0]);
}
+// $t在script中的使用
+import { getCurrentInstance } from "vue";
+const {
+ appContext: {
+ config: { globalProperties },
+ },
+} = getCurrentInstance();
+
+const string = "createVideo.typeScript";
+const t = globalProperties.$t(string);
+
// card3的
let language = reactive("");
+
let languageOptions = reactive([
{
value: "Option1",
diff --git a/src/views/myAccount/index.vue b/src/views/myAccount/index.vue
index eba9393..202a133 100644
--- a/src/views/myAccount/index.vue
+++ b/src/views/myAccount/index.vue
@@ -10,14 +10,14 @@
OLO
weqrewerwer@mail.com
-
更改密码
+
{{ $t("account.reSetPwd") }}
3 Videos Generation Left
Until 2023/12/31
-
购买更多
+
{{ $t("account.getMore") }}
@@ -30,8 +30,8 @@
Generation
- 复制邀请码
- 保存二维码
+ {{ $t("account.copyCode") }}
+ {{ $t("account.saveCode") }}
@@ -40,24 +40,24 @@
-
+
-
+
@@ -237,7 +237,7 @@
}
.state {
- width: 10%;
+ margin-right: 30px;
}
}
}
@@ -253,7 +253,6 @@
}
.state {
- width: 15%;
font-size: 14px;
line-height: 60px;
}
diff --git a/src/views/myCreating/index.vue b/src/views/myCreating/index.vue
index e8cdcd7..6538b24 100644
--- a/src/views/myCreating/index.vue
+++ b/src/views/myCreating/index.vue
@@ -3,7 +3,7 @@
@@ -14,8 +14,8 @@
- 名称
- 时间
+ {{ $t("myCreating.name") }}
+ {{ $t("myCreating.date") }}
- 下载
+ {{ $t("myCreating.download") }}
-
删除
+
{{ $t("myCreating.delete") }}
@@ -187,17 +187,17 @@ function mouseenter(item) {
position: absolute;
top: 45px;
right: 10px;
- width: 70px;
- height: 60px;
+ // width: 70px;
+ // height: 60px;
overflow: hidden;
border-radius: 10px;
&-item {
- width: 70px;
- height: 30px;
+ // width: 70px;
+ // height: 30px;
text-align: center;
background-color: #fff;
-
+ padding: 10px;
&-icon {
position: relative;
display: inline-block;
From fdadf1f6a8ccae923d9165e6359ca6c8c676816b Mon Sep 17 00:00:00 2001
From: XiaoXinPro 14 IAH5R <568170040@qq.com>
Date: Tue, 23 May 2023 17:01:00 +0800
Subject: [PATCH 2/5] upload
---
src/layout/components/Navbar.vue | 1 -
src/layout/components/Sidebar/index.vue | 1 +
src/views/myCreating/index.vue | 32 ++++++++++++-------------
3 files changed, 16 insertions(+), 18 deletions(-)
diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue
index 6347b62..5080f67 100644
--- a/src/layout/components/Navbar.vue
+++ b/src/layout/components/Navbar.vue
@@ -62,7 +62,6 @@
{{ $t(routeName as string) }}
-
diff --git a/src/layout/components/Sidebar/index.vue b/src/layout/components/Sidebar/index.vue
index 4d33235..c973cb8 100644
--- a/src/layout/components/Sidebar/index.vue
+++ b/src/layout/components/Sidebar/index.vue
@@ -94,6 +94,7 @@ function routerTo(url: RouteLocationRaw) {
transition: all 0.3s;
border-radius: 5px;
margin-bottom: 20px;
+ margin-right: 20px;
.icon {
width: 40px;
diff --git a/src/views/myCreating/index.vue b/src/views/myCreating/index.vue
index 6538b24..5194c25 100644
--- a/src/views/myCreating/index.vue
+++ b/src/views/myCreating/index.vue
@@ -60,13 +60,14 @@
@@ -197,7 +198,7 @@ function mouseenter(item) {
// height: 30px;
text-align: center;
background-color: #fff;
- padding: 10px;
+ padding: 0 10px;
&-icon {
position: relative;
display: inline-block;
@@ -261,18 +262,15 @@ function mouseenter(item) {
display: flex;
justify-content: space-between;
- :deep(.el-button) {
+ .elBtn {
color: #fff;
- background-color: #000 !important;
- border: none;
border-radius: 10px;
-
+ padding: 5px 10px;
+ cursor: pointer;
+ background: linear-gradient(225deg, #000, #000);
+ transition: all 0.3s;
&:hover {
- background: linear-gradient(
- 225deg,
- rgb(81 217 202 / 100%),
- rgb(114 100 245 / 100%)
- );
+ background: linear-gradient(225deg, #51d9ca, #7264f5);
}
}
From 497672b42eeeffebf2a14380b50d989f6c4c3a30 Mon Sep 17 00:00:00 2001
From: XiaoXinPro 14 IAH5R <568170040@qq.com>
Date: Tue, 23 May 2023 17:36:07 +0800
Subject: [PATCH 3/5] upload
---
src/layout/components/Navbar.vue | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue
index 5080f67..1d21ce5 100644
--- a/src/layout/components/Navbar.vue
+++ b/src/layout/components/Navbar.vue
@@ -183,7 +183,7 @@ watch(
display: flex;
align-items: center;
justify-content: flex-end;
- height: 50px;
+ height: 80px;
padding: 0 20px;
color: #fff;
background-color: #fff;
From 0cce9c076df4467eb6a01a5a79bf0f341c0ffcec Mon Sep 17 00:00:00 2001
From: YWQ HK IX <568170040@qq.com>
Date: Tue, 23 May 2023 21:16:11 +0800
Subject: [PATCH 4/5] =?UTF-8?q?=E8=BF=87=E6=B8=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/types/components.d.ts | 3 -
src/views/myStore/index.vue | 209 ++++++++++++++++++++----------------
2 files changed, 115 insertions(+), 97 deletions(-)
diff --git a/src/types/components.d.ts b/src/types/components.d.ts
index 433d75f..d67af9e 100644
--- a/src/types/components.d.ts
+++ b/src/types/components.d.ts
@@ -20,13 +20,10 @@ declare module '@vue/runtime-core' {
ElFormItem: typeof import('element-plus/es')['ElFormItem']
ElIcon: typeof import('element-plus/es')['ElIcon']
ElInput: typeof import('element-plus/es')['ElInput']
- ElMenu: typeof import("element-plus/es")["ElMenu"]
- ElMenuItem: typeof import("element-plus/es")["ElMenuItem"]
ElOption: typeof import('element-plus/es')['ElOption']
ElRow: typeof import('element-plus/es')['ElRow']
ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
ElSelect: typeof import('element-plus/es')['ElSelect']
- ElSubMenu: typeof import("element-plus/es")["ElSubMenu"]
ElSwitch: typeof import('element-plus/es')['ElSwitch']
ElTabPane: typeof import('element-plus/es')['ElTabPane']
ElTabs: typeof import('element-plus/es')['ElTabs']
diff --git a/src/views/myStore/index.vue b/src/views/myStore/index.vue
index 7509f3d..9335574 100644
--- a/src/views/myStore/index.vue
+++ b/src/views/myStore/index.vue
@@ -2,37 +2,37 @@
-
-
-
-
-
-
- {{ item.title }}
+
+
+
+
+
+
+
+ {{ item.title }}
+
+
+ {{ item.price }}元/{{
+ item.priceTime
+ }}
+
+
+ {{ item.time }}分钟/月
+
+
+ 选择方案
+
-
- {{ item.price }}元/{{ item.priceTime }}
-
-
- {{ item.time }}分钟/月
-
-
- 选择方案
-
-
-
-
@@ -159,82 +159,103 @@ function clickPayDialog(item) {
height: 100%;
// scrollbar-width: none; /* 隐藏滚动条(Chrome、Firefox) */
// -ms-overflow-style: none; /* 隐藏滚动条(IE、Edge) */
-}
-.item {
- width: 350px;
- height: 100%;
- margin-left: 50px;
- background-color: #fffefd;
- flex-shrink: 0; /* 防止缩小宽度 */
- border: 1px solid #c0bfbd;
- border-radius: 20px;
- overflow: hidden;
- .line {
- height: 20px;
- background-color: pink;
- }
- .info {
- padding: 20px;
- .content {
- height: 300px;
+ .item {
+ width: 350px;
+ height: 100%;
+ margin-left: 50px;
+ background-color: #fffefd;
+ flex-shrink: 0; /* 防止缩小宽度 */
+ border: 1px solid #c0bfbd;
+ border-radius: 20px;
+ overflow: hidden;
+ transition: all 0.3s;
+ cursor: pointer;
+ .line {
+ height: 20px;
+ background-color: pink;
+ cursor: pointer;
+ }
+ .info {
padding: 20px;
- border-bottom: 1px solid #c0bfbd;
- .title {
- font-size: 30px;
- font-weight: 700;
- line-height: 25px;
- margin-bottom: 30px;
- .el-icon {
- line-height: 30px;
- width: 40px;
- height: 40px;
- font-size: 40px;
- color: #000;
- text-align: center;
- vertical-align: sub;
- }
- }
- .money {
- margin-bottom: 30px;
- font-size: 20px;
- color: #7c7c7a;
- .price {
+ cursor: pointer;
+ .content {
+ height: 300px;
+ padding: 20px;
+ border-bottom: 1px solid #c0bfbd;
+ cursor: pointer;
+ .title {
font-size: 30px;
font-weight: 700;
- color: #242625;
+ line-height: 25px;
+ margin-bottom: 30px;
+ cursor: pointer;
+ .el-icon {
+ line-height: 30px;
+ width: 40px;
+ height: 40px;
+ font-size: 40px;
+ color: #000;
+ text-align: center;
+ vertical-align: sub;
+ cursor: pointer;
+ }
}
- }
- .time {
- margin-bottom: 30px;
- font-size: 20px;
- color: #7c7c7a;
- span {
+ .money {
+ margin-bottom: 30px;
+ font-size: 20px;
+ color: #7c7c7a;
+ cursor: pointer;
+ .price {
+ font-size: 30px;
+ font-weight: 700;
+ color: #242625;
+ cursor: pointer;
+ }
+ }
+ .time {
+ margin-bottom: 30px;
+ font-size: 20px;
+ color: #7c7c7a;
+ cursor: pointer;
+ span {
+ font-weight: 700;
+ color: #242625;
+ cursor: pointer;
+ }
+ }
+ .button {
+ width: 100%;
+ height: 40px;
+ border-radius: 10px;
+ text-align: center;
+ line-height: 40px;
+ color: #fff;
font-weight: 700;
- color: #242625;
+ background-color: yellow;
+ cursor: pointer;
}
}
- .button {
- width: 100%;
- height: 40px;
- border-radius: 10px;
- text-align: center;
- line-height: 40px;
- color: #fff;
- font-weight: 700;
- background-color: yellow;
- }
- }
- .authority {
- &-item {
- padding: 20px 10px;
- span {
- color: #7c7c7a;
- margin-right: 30px;
+ .authority {
+ cursor: pointer;
+ &-item {
+ cursor: pointer;
+ padding: 20px 10px;
+ span {
+ cursor: pointer;
+ color: #7c7c7a;
+ margin-right: 30px;
+ }
}
}
}
+ &:hover {
+ cursor: pointer;
+ transform: translateY(-20px);
+ box-shadow: #00000026 2px 2px 2px 2px;
+ }
}
}
+
.commodityList::-webkit-scrollbar {
display: none; /* 隐藏滚动条(Safari、Chrome) */
}
From 3df026e63922a28e73a833ab7a598965973d631d Mon Sep 17 00:00:00 2001
From: YWQ HK IX <568170040@qq.com>
Date: Tue, 23 May 2023 21:22:47 +0800
Subject: [PATCH 5/5] upload
---
src/types/auto-imports.d.ts | 2 --
src/views/myCreating/index.vue | 4 ++--
src/views/myStore/index.vue | 2 +-
3 files changed, 3 insertions(+), 5 deletions(-)
diff --git a/src/types/auto-imports.d.ts b/src/types/auto-imports.d.ts
index e5c7bdb..9ea2d5d 100644
--- a/src/types/auto-imports.d.ts
+++ b/src/types/auto-imports.d.ts
@@ -2,7 +2,6 @@
export {}
declare global {
const EffectScope: typeof import('vue')['EffectScope']
- const ElForm: typeof import('element-plus/es')['ElForm']
const ElMessage: typeof import('element-plus/es')['ElMessage']
const ElMessageBox: typeof import('element-plus/es')['ElMessageBox']
const asyncComputed: typeof import('@vueuse/core')['asyncComputed']
@@ -271,7 +270,6 @@ import { UnwrapRef } from 'vue'
declare module 'vue' {
interface ComponentCustomProperties {
readonly EffectScope: UnwrapRef
- readonly ElForm: UnwrapRef
readonly ElMessage: UnwrapRef
readonly ElMessageBox: UnwrapRef
readonly asyncComputed: UnwrapRef
diff --git a/src/views/myCreating/index.vue b/src/views/myCreating/index.vue
index 5194c25..6dcd18d 100644
--- a/src/views/myCreating/index.vue
+++ b/src/views/myCreating/index.vue
@@ -267,10 +267,10 @@ function mouseenter(item) {
border-radius: 10px;
padding: 5px 10px;
cursor: pointer;
- background: linear-gradient(225deg, #000, #000);
+ background-color: #000;
transition: all 0.3s;
&:hover {
- background: linear-gradient(225deg, #51d9ca, #7264f5);
+ background-color: #15d1b8;
}
}
diff --git a/src/views/myStore/index.vue b/src/views/myStore/index.vue
index 9335574..9310d75 100644
--- a/src/views/myStore/index.vue
+++ b/src/views/myStore/index.vue
@@ -168,7 +168,7 @@ function clickPayDialog(item) {
border: 1px solid #c0bfbd;
border-radius: 20px;
overflow: hidden;
- transition: all 0.3s;
+ transition: all 0.2s;
cursor: pointer;
.line {
height: 20px;