Przeglądaj źródła

feat: nav改动

dev_YWQ
congzc 2 lat temu
rodzic
commit
ac3e7f3e4e
16 zmienionych plików z 293 dodań i 59 usunięć
  1. BIN
      src/assets/img/left-top-logo.png
  2. +2
    -1
      src/layout/components/AppMain.vue
  3. +47
    -9
      src/layout/components/Navbar.vue
  4. +32
    -13
      src/layout/components/Sidebar/Logo.vue
  5. +102
    -3
      src/layout/components/Sidebar/index.vue
  6. +51
    -25
      src/router/index.ts
  7. +2
    -2
      src/settings.ts
  8. +1
    -0
      src/store/modules/settings.ts
  9. +2
    -0
      src/styles/sidebar.scss
  10. +8
    -3
      src/styles/variables.scss
  11. +2
    -0
      src/types/auto-imports.d.ts
  12. +21
    -0
      src/types/components.d.ts
  13. +2
    -1
      src/views/createVideo/index.vue
  14. +2
    -1
      src/views/myAccount/index.vue
  15. +3
    -1
      src/views/myCreating/index.vue
  16. +16
    -0
      src/views/myStore/index.vue

BIN
src/assets/img/left-top-logo.png Wyświetl plik

Przed Po
Szerokość: 800  |  Wysokość: 160  |  Rozmiar: 36 KiB

+ 2
- 1
src/layout/components/AppMain.vue Wyświetl plik

@@ -24,7 +24,8 @@ const tagsViewStore = useTagsViewStore();
/* 50= navbar 50 */ /* 50= navbar 50 */
min-height: calc(100vh - 50px); min-height: calc(100vh - 50px);
overflow: hidden; overflow: hidden;
background-color: var(--el-bg-color-page);
// background-color: var(--el-bg-color-page);
background-color: #000;
} }


.fixed-header + .app-main { .fixed-header + .app-main {


+ 47
- 9
src/layout/components/Navbar.vue Wyświetl plik

@@ -1,4 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { watch, ref } from "vue";
import { storeToRefs } from "pinia"; import { storeToRefs } from "pinia";
import { RouteLocationRaw, useRoute, useRouter } from "vue-router"; import { RouteLocationRaw, useRoute, useRouter } from "vue-router";
import { useAppStore } from "@/store/modules/app"; import { useAppStore } from "@/store/modules/app";
@@ -49,41 +50,53 @@ function logout() {
function routerTo() { function routerTo() {
router.push("/myAccount"); router.push("/myAccount");
} }
// 当前路由的名字
const routeName = ref(route.meta.name);

watch(
() => route.meta.name,
(newName) => {
routeName.value = newName;
}
);
</script> </script>


<template> <template>
<!-- 顶部导航栏 --> <!-- 顶部导航栏 -->
<div class="navbar">
<div class="myNavbar">
<!-- 左侧面包屑 --> <!-- 左侧面包屑 -->
<div class="flex">
<div class="flex" v-if="false">
<hamburger <hamburger
:is-active="appStore.sidebar.opened" :is-active="appStore.sidebar.opened"
@toggleClick="toggleSideBar" @toggleClick="toggleSideBar"
/> />
<breadcrumb /> <breadcrumb />
</div> </div>

<!-- 右侧导航设置 --> <!-- 右侧导航设置 -->
<div class="flex">
<div class="flex" v-if="false">
<!-- 导航栏设置(窄屏隐藏)--> <!-- 导航栏设置(窄屏隐藏)-->
<div class="setting-container" v-if="device !== 'mobile'"> <div class="setting-container" v-if="device !== 'mobile'">
<!--全屏 --> <!--全屏 -->
<div class="setting-item" @click="toggle">
<div class="setting-item" @click="toggle" v-if="false">
<svg-icon <svg-icon
:icon-class="isFullscreen ? 'exit-fullscreen' : 'fullscreen'" :icon-class="isFullscreen ? 'exit-fullscreen' : 'fullscreen'"
/> />
</div> </div>
<!-- 布局大小 --> <!-- 布局大小 -->
<el-tooltip content="布局大小" effect="dark" placement="bottom">
<el-tooltip
content="布局大小"
effect="dark"
placement="bottom"
v-if="false"
>
<size-select class="setting-item" /> <size-select class="setting-item" />
</el-tooltip> </el-tooltip>
<!--语言选择--> <!--语言选择-->
<lang-select class="setting-item" />
<lang-select class="setting-item" v-if="false" />
</div> </div>

<!-- 用户头像 --> <!-- 用户头像 -->
<span @click="routerTo">个人账户</span> <span @click="routerTo">个人账户</span>
<el-dropdown trigger="click">
<el-dropdown trigger="click" v-if="false">
<div class="avatar-container"> <div class="avatar-container">
<img :src="userStore.avatar + '?imageView2/1/w/80/h/80'" /> <img :src="userStore.avatar + '?imageView2/1/w/80/h/80'" />
<i-ep-caret-bottom class="w-3 h-3" /> <i-ep-caret-bottom class="w-3 h-3" />
@@ -109,6 +122,11 @@ function routerTo() {
</template> </template>
</el-dropdown> </el-dropdown>
</div> </div>
<!-- 显示的,以上代码作废 -->
<div style="position: absolute; left: 30px">{{ routeName }}</div>
<div class="avatar"></div>
<div @click="routerTo">个人账户</div>
<div @click="logout" style="margin-left: 10px">退出登录</div>
</div> </div>
</template> </template>


@@ -154,4 +172,24 @@ function routerTo() {
} }
} }
} }
// 代替原来的navbar
.myNavbar {
display: flex;
align-items: center;
justify-content: flex-end;
height: 50px;
padding: 0 20px;
color: #fff;
background-color: #fff;
background-color: #000;
box-shadow: 0 0 1px #0003;

.avatar {
width: 30px;
height: 30px;
margin-right: 5px;
background-color: red;
border-radius: 50%;
}
}
</style> </style>

+ 32
- 13
src/layout/components/Sidebar/Logo.vue Wyświetl plik

@@ -1,13 +1,13 @@
<script lang="ts" setup> <script lang="ts" setup>
import { useSettingsStore } from '@/store/modules/settings';
import { useSettingsStore } from "@/store/modules/settings";


const settingsStore = useSettingsStore(); const settingsStore = useSettingsStore();


defineProps({ defineProps({
collapse: { collapse: {
type: Boolean, type: Boolean,
required: true
}
required: true,
},
}); });


const logo = ref(new URL(`../../../assets/logo.png`, import.meta.url).href); const logo = ref(new URL(`../../../assets/logo.png`, import.meta.url).href);
@@ -19,25 +19,33 @@ const logo = ref(new URL(`../../../assets/logo.png`, import.meta.url).href);
<router-link <router-link
v-if="collapse" v-if="collapse"
key="collapse" key="collapse"
class="h-full w-full flex items-center justify-center"
class="h-full w-full flex items-center justify-center left-top-box"
to="/" to="/"
> >
<img v-if="settingsStore.sidebarLogo" :src="logo" class="w-5 h-5" />
<span v-else class="ml-3 text-white text-sm font-bold"
>vue3-element-admin</span
>
<!-- <img
v-if="settingsStore.sidebarLogo"
src="../../../assets/img/left-top-logo.png"
class="w-5 h-5"
/> -->
<img
v-if="settingsStore.sidebarLogo"
src="../../../assets/img/left-top-logo.png"
/>
<span v-else class="ml-3 text-white text-sm font-bold"></span>
</router-link> </router-link>


<router-link <router-link
v-else v-else
key="expand" key="expand"
class="h-full w-full flex items-center justify-center"
class="h-full w-full flex items-center justify-center left-top-box"
to="/" to="/"
> >
<img v-if="settingsStore.sidebarLogo" :src="logo" class="w-5 h-5" />
<span class="ml-3 text-white text-sm font-bold"
>vue3-element-admin</span
>
<img
v-if="settingsStore.sidebarLogo"
src="../../../assets/img/left-top-logo.png"
class="left-top-logo"
/>
<span class="ml-3 text-white text-sm font-bold"></span>
</router-link> </router-link>
</transition> </transition>
</div> </div>
@@ -45,6 +53,17 @@ const logo = ref(new URL(`../../../assets/logo.png`, import.meta.url).href);


<style lang="scss" scoped> <style lang="scss" scoped>
// https://cn.vuejs.org/guide/built-ins/transition.html#the-transition-component // https://cn.vuejs.org/guide/built-ins/transition.html#the-transition-component

.left-top-box {
background-color: #000;
}

.left-top-logo {
width: 180px;
height: 40px;
padding: 5px 0 0 10px;
}

.sidebarLogoFade-enter-active { .sidebarLogoFade-enter-active {
transition: opacity 2s; transition: opacity 2s;
} }


+ 102
- 3
src/layout/components/Sidebar/index.vue Wyświetl plik

@@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { useRoute } from "vue-router";
import { RouteLocationRaw, useRoute, useRouter } from "vue-router";


import SidebarItem from "./SidebarItem.vue"; import SidebarItem from "./SidebarItem.vue";
import Logo from "./Logo.vue"; import Logo from "./Logo.vue";
@@ -10,19 +10,48 @@ import { useAppStore } from "@/store/modules/app";
import { storeToRefs } from "pinia"; import { storeToRefs } from "pinia";
import variables from "@/styles/variables.module.scss"; import variables from "@/styles/variables.module.scss";


// 静态路由
import { constantRoutes } from "@/router";
const settingsStore = useSettingsStore(); const settingsStore = useSettingsStore();
const permissionStore = usePermissionStore(); const permissionStore = usePermissionStore();
const appStore = useAppStore(); const appStore = useAppStore();


const { sidebarLogo } = storeToRefs(settingsStore); const { sidebarLogo } = storeToRefs(settingsStore);
const route = useRoute(); const route = useRoute();
const router = useRouter();

function routerTo(url: RouteLocationRaw) {
router.push(url);
}
</script> </script>


<template> <template>
<!-- 左侧菜单 -->
<div :class="{ 'has-logo': sidebarLogo }"> <div :class="{ 'has-logo': sidebarLogo }">
<logo v-if="sidebarLogo" :collapse="!appStore.sidebar.opened" /> <logo v-if="sidebarLogo" :collapse="!appStore.sidebar.opened" />
<el-scrollbar>
<div class="myRouter">
<div class="myRouter-item" @click="routerTo('/createVideo')">
<div class="icon">
<el-icon><i-ep-edit /></el-icon>
</div>
创作视频
</div>
<div class="myRouter-item" @click="routerTo('/myCreating')">
<div class="icon">
<el-icon><i-ep-menu /></el-icon>
</div>
我的视频
</div>
<div class="myRouter-item pricing" @click="routerTo('/myStore')">
<div class="icon">
<el-icon><i-ep-Goods /></el-icon>
</div>
商店
</div>
</div>
<!-- <el-scrollbar>
<el-menu <el-menu
style="background-color: #000000"
:default-active="route.path" :default-active="route.path"
:collapse="!appStore.sidebar.opened" :collapse="!appStore.sidebar.opened"
:background-color="variables.menuBg" :background-color="variables.menuBg"
@@ -40,6 +69,76 @@ const route = useRoute();
:is-collapse="!appStore.sidebar.opened" :is-collapse="!appStore.sidebar.opened"
/> />
</el-menu> </el-menu>
</el-scrollbar>
</el-scrollbar> -->
</div> </div>
</template> </template>

<style lang="scss" scoped>
.myRouter {
position: relative;
height: calc(100% - 50px);
padding: 200px 20px 0;
color: #fff;

&-item {
display: flex;
width: 100%;
height: 50px;
padding-left: 20px;
font-size: 20px;
font-weight: 500;
line-height: 50px;
text-align: center;
cursor: pointer;
border-bottom: 2px solid #fff;

.icon {
width: 40px;
height: 40px;
color: #fff;
border-radius: 50%;

.el-icon {
width: 25px;
height: 25px;
font-size: 25px;
color: #fff;
text-align: center;
vertical-align: sub;
}
}

&:hover {
color: #000;
background-color: #fff;

.el-icon {
color: #000;
}
}
}

.pricing {
position: absolute;
bottom: 20px;
width: calc(100% - 40px);
text-align: center;
}
}

:deep(.el-sub-menu__title) {
background-color: #000 !important;
}

:deep(.el-menu-item) {
div {
background-color: #000 !important;
}

background-color: #000 !important;
}

:deep(.el-menu-item.is-active) {
color: #fff;
}
</style>

+ 51
- 25
src/router/index.ts Wyświetl plik

@@ -31,8 +31,13 @@ export const constantRoutes: RouteRecordRaw[] = [
path: "createVideo", path: "createVideo",
component: () => import("@/views/createVideo/index.vue"), component: () => import("@/views/createVideo/index.vue"),
name: "createVideo", name: "createVideo",
meta: { title: "createVideo", icon: "homepage", affix: true },
}
meta: {
title: "createVideo",
icon: "homepage",
affix: true,
name: "创作视频",
},
},
], ],
}, },
// 视频列表 // 视频列表
@@ -45,8 +50,13 @@ export const constantRoutes: RouteRecordRaw[] = [
path: "myCreating", path: "myCreating",
component: () => import("@/views/myCreating/index.vue"), component: () => import("@/views/myCreating/index.vue"),
name: "myCreating", name: "myCreating",
meta: { title: "myCreating", icon: "homepage", affix: true },
}
meta: {
title: "myCreating",
icon: "homepage",
affix: true,
name: "我的视频",
},
},
], ],
}, },
// 个人账户 // 个人账户
@@ -59,36 +69,52 @@ export const constantRoutes: RouteRecordRaw[] = [
path: "myAccount", path: "myAccount",
component: () => import("@/views/myAccount/index.vue"), component: () => import("@/views/myAccount/index.vue"),
name: "myAccount", name: "myAccount",
meta: { title: "myAccount", icon: "homepage", affix: true },
}
meta: {
title: "myAccount",
icon: "homepage",
affix: true,
name: "个人账户",
},
},
], ],
}, },

// 商店
{ {
path: "/dashboard",
path: "/",
component: Layout, component: Layout,
redirect: "/dashboard",
redirect: "/myStore",
children: [ children: [
{ {
path: "dashboard",
component: () => import("@/views/dashboard/index.vue"),
name: "Dashboard",
meta: { title: "dashboard", icon: "homepage", affix: true },
},
{
path: "401",
component: () => import("@/views/error-page/401.vue"),
meta: { hidden: true },
},
{
path: "404",
component: () => import("@/views/error-page/404.vue"),
meta: { hidden: true },
path: "myStore",
component: () => import("@/views/myStore/index.vue"),
name: "myStore",
meta: { title: "myStore", icon: "homepage", affix: true, name: "商店" },
}, },
], ],
}, },


// {
// path: "/dashboard",
// component: Layout,
// redirect: "/dashboard",
// children: [
// {
// path: "dashboard",
// component: () => import("@/views/dashboard/index.vue"),
// name: "Dashboard",
// meta: { title: "dashboard", icon: "homepage", affix: true },
// },
// {
// path: "401",
// component: () => import("@/views/error-page/401.vue"),
// meta: { hidden: true },
// },
// {
// path: "404",
// component: () => import("@/views/error-page/404.vue"),
// meta: { hidden: true },
// },
// ],
// },


// 外部链接 // 外部链接
/*{ /*{


+ 2
- 2
src/settings.ts Wyświetl plik

@@ -43,8 +43,8 @@ interface DefaultSettings {


const defaultSettings: DefaultSettings = { const defaultSettings: DefaultSettings = {
title: "vue3-element-admin", title: "vue3-element-admin",
showSettings: true,
tagsView: true,
showSettings: false,
tagsView: false,
fixedHeader: false, fixedHeader: false,
sidebarLogo: true, sidebarLogo: true,
layout: "left", layout: "left",


+ 1
- 0
src/store/modules/settings.ts Wyświetl plik

@@ -4,6 +4,7 @@ import { useStorage } from "@vueuse/core";


export const useSettingsStore = defineStore("setting", () => { export const useSettingsStore = defineStore("setting", () => {
// state // state

const tagsView = useStorage<boolean>("tagsView", defaultSettings.tagsView); const tagsView = useStorage<boolean>("tagsView", defaultSettings.tagsView);


const showSettings = ref<boolean>(defaultSettings.showSettings); const showSettings = ref<boolean>(defaultSettings.showSettings);


+ 2
- 0
src/styles/sidebar.scss Wyświetl plik

@@ -37,6 +37,8 @@
} }


&.has-logo { &.has-logo {
background-color: #000;

.el-scrollbar { .el-scrollbar {
height: calc(100% - 50px); height: calc(100% - 50px);
} }


+ 8
- 3
src/styles/variables.scss Wyświetl plik

@@ -4,10 +4,15 @@
--menuBg: #304156; --menuBg: #304156;
--menuText: #bfcbd9; --menuText: #bfcbd9;
--menuActiveText: #409eff; --menuActiveText: #409eff;
--menuHover: #263445;
--subMenuBg: #1f2d3d;
// 左侧菜单鼠标经过颜色
--menuHover: #000;
// --menuHover: #263445;
// 左侧子菜单颜色
--subMenuBg: #000;
// --subMenuBg: #1f2d3d;
--subMenuActiveText: #f4f4f5; --subMenuActiveText: #f4f4f5;
--subMenuHover: #001528;
// --subMenuHover: #001528;
--subMenuHover: #000;
} }


$menuBg: var(--menuBg); $menuBg: var(--menuBg);


+ 2
- 0
src/types/auto-imports.d.ts Wyświetl plik

@@ -5,6 +5,7 @@ declare global {
const ElForm: typeof import("element-plus/es")["ElForm"]; const ElForm: typeof import("element-plus/es")["ElForm"];
const ElMessage: typeof import("element-plus/es")["ElMessage"]; const ElMessage: typeof import("element-plus/es")["ElMessage"];
const ElMessageBox: typeof import("element-plus/es")["ElMessageBox"]; const ElMessageBox: typeof import("element-plus/es")["ElMessageBox"];
const ElTree: typeof import("element-plus/es")["ElTree"];
const asyncComputed: typeof import("@vueuse/core")["asyncComputed"]; const asyncComputed: typeof import("@vueuse/core")["asyncComputed"];
const autoResetRef: typeof import("@vueuse/core")["autoResetRef"]; const autoResetRef: typeof import("@vueuse/core")["autoResetRef"];
const computed: typeof import("vue")["computed"]; const computed: typeof import("vue")["computed"];
@@ -278,6 +279,7 @@ declare module "vue" {
readonly ElMessageBox: UnwrapRef< readonly ElMessageBox: UnwrapRef<
typeof import("element-plus/es")["ElMessageBox"] typeof import("element-plus/es")["ElMessageBox"]
>; >;
readonly ElTree: UnwrapRef<typeof import("element-plus/es")["ElTree"]>;
readonly asyncComputed: UnwrapRef< readonly asyncComputed: UnwrapRef<
typeof import("@vueuse/core")["asyncComputed"] typeof import("@vueuse/core")["asyncComputed"]
>; >;


+ 21
- 0
src/types/components.d.ts Wyświetl plik

@@ -11,6 +11,8 @@ declare module '@vue/runtime-core' {
ElBreadcrumb: typeof import('element-plus/es')['ElBreadcrumb'] ElBreadcrumb: typeof import('element-plus/es')['ElBreadcrumb']
ElBreadcrumbItem: typeof import('element-plus/es')['ElBreadcrumbItem'] ElBreadcrumbItem: typeof import('element-plus/es')['ElBreadcrumbItem']
ElButton: typeof import('element-plus/es')['ElButton'] ElButton: typeof import('element-plus/es')['ElButton']
ElCard: typeof import('element-plus/es')['ElCard']
ElCol: typeof import('element-plus/es')['ElCol']
ElDialog: typeof import('element-plus/es')['ElDialog'] ElDialog: typeof import('element-plus/es')['ElDialog']
ElDivider: typeof import('element-plus/es')['ElDivider'] ElDivider: typeof import('element-plus/es')['ElDivider']
ElDropdown: typeof import('element-plus/es')['ElDropdown'] ElDropdown: typeof import('element-plus/es')['ElDropdown']
@@ -20,17 +22,26 @@ declare module '@vue/runtime-core' {
ElFormItem: typeof import('element-plus/es')['ElFormItem'] ElFormItem: typeof import('element-plus/es')['ElFormItem']
ElIcon: typeof import('element-plus/es')['ElIcon'] ElIcon: typeof import('element-plus/es')['ElIcon']
ElInput: typeof import('element-plus/es')['ElInput'] ElInput: typeof import('element-plus/es')['ElInput']
ElLink: typeof import('element-plus/es')['ElLink']
ElMenu: typeof import('element-plus/es')['ElMenu'] ElMenu: typeof import('element-plus/es')['ElMenu']
ElMenuItem: typeof import('element-plus/es')['ElMenuItem'] ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
ElOption: typeof import('element-plus/es')['ElOption'] ElOption: typeof import('element-plus/es')['ElOption']
ElPagination: typeof import('element-plus/es')['ElPagination']
ElRadio: typeof import('element-plus/es')['ElRadio']
ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
ElRow: typeof import('element-plus/es')['ElRow'] ElRow: typeof import('element-plus/es')['ElRow']
ElScrollbar: typeof import('element-plus/es')['ElScrollbar'] ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
ElSelect: typeof import('element-plus/es')['ElSelect'] ElSelect: typeof import('element-plus/es')['ElSelect']
ElSubMenu: typeof import('element-plus/es')['ElSubMenu'] ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
ElSwitch: typeof import('element-plus/es')['ElSwitch'] ElSwitch: typeof import('element-plus/es')['ElSwitch']
ElTable: typeof import('element-plus/es')['ElTable']
ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
ElTabPane: typeof import('element-plus/es')['ElTabPane'] ElTabPane: typeof import('element-plus/es')['ElTabPane']
ElTabs: typeof import('element-plus/es')['ElTabs'] ElTabs: typeof import('element-plus/es')['ElTabs']
ElTooltip: typeof import('element-plus/es')['ElTooltip'] ElTooltip: typeof import('element-plus/es')['ElTooltip']
ElTree: typeof import('element-plus/es')['ElTree']
ElTreeSelect: typeof import('element-plus/es')['ElTreeSelect']
ElUpload: typeof import('element-plus/es')['ElUpload']
GithubCorner: typeof import('./../components/GithubCorner/index.vue')['default'] GithubCorner: typeof import('./../components/GithubCorner/index.vue')['default']
Hamburger: typeof import('./../components/Hamburger/index.vue')['default'] Hamburger: typeof import('./../components/Hamburger/index.vue')['default']
IconSelect: typeof import('./../components/IconSelect/index.vue')['default'] IconSelect: typeof import('./../components/IconSelect/index.vue')['default']
@@ -39,8 +50,15 @@ declare module '@vue/runtime-core' {
IEpDelete: typeof import('~icons/ep/delete')['default'] IEpDelete: typeof import('~icons/ep/delete')['default']
IEpDownload: typeof import('~icons/ep/download')['default'] IEpDownload: typeof import('~icons/ep/download')['default']
IEpEdit: typeof import('~icons/ep/edit')['default'] IEpEdit: typeof import('~icons/ep/edit')['default']
IEpGoods: typeof import('~icons/ep/goods')['default']
IEpMenu: typeof import('~icons/ep/menu')['default']
IEpPlus: typeof import('~icons/ep/plus')['default'] IEpPlus: typeof import('~icons/ep/plus')['default']
IEpRefresh: typeof import('~icons/ep/refresh')['default']
IEpRefreshLeft: typeof import('~icons/ep/refresh-left')['default']
IEpSearch: typeof import('~icons/ep/search')['default']
IEpSetting: typeof import('~icons/ep/setting')['default'] IEpSetting: typeof import('~icons/ep/setting')['default']
IEpTop: typeof import('~icons/ep/top')['default']
IEpUploadFilled: typeof import('~icons/ep/upload-filled')['default']
IEpVideoPlay: typeof import('~icons/ep/video-play')['default'] IEpVideoPlay: typeof import('~icons/ep/video-play')['default']
LangSelect: typeof import('./../components/LangSelect/index.vue')['default'] LangSelect: typeof import('./../components/LangSelect/index.vue')['default']
MultiUpload: typeof import('./../components/Upload/MultiUpload.vue')['default'] MultiUpload: typeof import('./../components/Upload/MultiUpload.vue')['default']
@@ -53,4 +71,7 @@ declare module '@vue/runtime-core' {
SvgIcon: typeof import('./../components/SvgIcon/index.vue')['default'] SvgIcon: typeof import('./../components/SvgIcon/index.vue')['default']
WangEditor: typeof import('./../components/WangEditor/index.vue')['default'] WangEditor: typeof import('./../components/WangEditor/index.vue')['default']
} }
export interface ComponentCustomProperties {
vLoading: typeof import('element-plus/es')['ElLoadingDirective']
}
} }

+ 2
- 1
src/views/createVideo/index.vue Wyświetl plik

@@ -156,9 +156,10 @@ let languageOptions = reactive([
<style lang="scss" scoped> <style lang="scss" scoped>
.page { .page {
// height: calc(100vh - 84px); // height: calc(100vh - 84px);
height: 844px;
height: 887px;
padding: 20px 0 0 40px; padding: 20px 0 0 40px;
background-color: #fff; background-color: #fff;
border-radius: 25px 0 0;
} }


.left { .left {


+ 2
- 1
src/views/myAccount/index.vue Wyświetl plik

@@ -79,10 +79,11 @@
<script setup></script> <script setup></script>
<style lang="scss" scoped> <style lang="scss" scoped>
.page { .page {
height: 844px;
height: 887px;
padding: 20px 0 0 20px; padding: 20px 0 0 20px;
// height: calc(100vh - 84px); // height: calc(100vh - 84px);
background-color: #fff; background-color: #fff;
border-radius: 25px 0 0;
} }


.left { .left {


+ 3
- 1
src/views/myCreating/index.vue Wyświetl plik

@@ -96,9 +96,11 @@ function mouseenter(item) {


<style lang="scss" scoped> <style lang="scss" scoped>
.page { .page {
height: calc(100vh - 84px);
// height: calc(100vh - 84px);
height: 887px;
padding: 20px 0 0 20px; padding: 20px 0 0 20px;
background-color: #fff; background-color: #fff;
border-radius: 25px 0 0;
} }


:deep(.el-input__wrapper) { :deep(.el-input__wrapper) {


+ 16
- 0
src/views/myStore/index.vue Wyświetl plik

@@ -0,0 +1,16 @@
<template>
<div class="page">商店</div>
</template>
<script setup>
let title = ref("");
</script>

<style lang="scss" scoped>
.page {
// height: calc(100vh - 84px);
height: 887px;
padding: 20px 0 0 20px;
background-color: #fff;
border-radius: 25px 0 0;
}
</style>

Ładowanie…
Anuluj
Zapisz