提交 685036e2 authored 作者: zhangchao's avatar zhangchao

init

上级 b460c0c5
// generated by unplugin-vue-components
// We suggest you to commit this file into source control
// Read more: https://github.com/vuejs/core/pull/3399
import '@vue/runtime-core'
export {}
declare module '@vue/runtime-core' {
export interface GlobalComponents {
ElButton: typeof import('element-plus/es')['ElButton']
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']
SvgIcon: typeof import('./src/components/sys/SvgIcon.vue')['default']
}
}
// generated by unplugin-vue-components
// We suggest you to commit this file into source control
// Read more: https://github.com/vuejs/core/pull/3399
import '@vue/runtime-core'
export {}
declare module '@vue/runtime-core' {
export interface GlobalComponents {
ElAside: typeof import('element-plus/es')['ElAside']
ElButton: typeof import('element-plus/es')['ElButton']
ElContainer: typeof import('element-plus/es')['ElContainer']
ElHeader: typeof import('element-plus/es')['ElHeader']
ElMain: typeof import('element-plus/es')['ElMain']
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']
SvgIcon: typeof import('./src/components/sys/SvgIcon.vue')['default']
}
}
<script setup lang="ts">
import { RouterLink, RouterView } from "vue-router";
</script>
<template>
<div id="app">
<router-view />
</div>
</template>
<script setup lang="ts">
import { RouterView } from "vue-router";
</script>
<template>
<div id="app">
<router-view />
</div>
</template>
<style lang="less">
#app {
width: 100%;
height: 100%;
flex: 1;
}
</style>
// Generated by 'unplugin-auto-import'
export {}
declare global {
const EffectScope: typeof import('vue')['EffectScope']
const computed: typeof import('vue')['computed']
const createApp: typeof import('vue')['createApp']
const customRef: typeof import('vue')['customRef']
const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
const defineComponent: typeof import('vue')['defineComponent']
const effectScope: typeof import('vue')['effectScope']
const getCurrentInstance: typeof import('vue')['getCurrentInstance']
const getCurrentScope: typeof import('vue')['getCurrentScope']
const h: typeof import('vue')['h']
const inject: typeof import('vue')['inject']
const isProxy: typeof import('vue')['isProxy']
const isReactive: typeof import('vue')['isReactive']
const isReadonly: typeof import('vue')['isReadonly']
const isRef: typeof import('vue')['isRef']
const markRaw: typeof import('vue')['markRaw']
const nextTick: typeof import('vue')['nextTick']
const onActivated: typeof import('vue')['onActivated']
const onBeforeMount: typeof import('vue')['onBeforeMount']
const onBeforeUnmount: typeof import('vue')['onBeforeUnmount']
const onBeforeUpdate: typeof import('vue')['onBeforeUpdate']
const onDeactivated: typeof import('vue')['onDeactivated']
const onErrorCaptured: typeof import('vue')['onErrorCaptured']
const onMounted: typeof import('vue')['onMounted']
const onRenderTracked: typeof import('vue')['onRenderTracked']
const onRenderTriggered: typeof import('vue')['onRenderTriggered']
const onScopeDispose: typeof import('vue')['onScopeDispose']
const onServerPrefetch: typeof import('vue')['onServerPrefetch']
const onUnmounted: typeof import('vue')['onUnmounted']
const onUpdated: typeof import('vue')['onUpdated']
const provide: typeof import('vue')['provide']
const reactive: typeof import('vue')['reactive']
const readonly: typeof import('vue')['readonly']
const ref: typeof import('vue')['ref']
const resolveComponent: typeof import('vue')['resolveComponent']
const shallowReactive: typeof import('vue')['shallowReactive']
const shallowReadonly: typeof import('vue')['shallowReadonly']
const shallowRef: typeof import('vue')['shallowRef']
const toRaw: typeof import('vue')['toRaw']
const toRef: typeof import('vue')['toRef']
const toRefs: typeof import('vue')['toRefs']
const triggerRef: typeof import('vue')['triggerRef']
const unref: typeof import('vue')['unref']
const useAttrs: typeof import('vue')['useAttrs']
const useCssModule: typeof import('vue')['useCssModule']
const useCssVars: typeof import('vue')['useCssVars']
const useSlots: typeof import('vue')['useSlots']
const watch: typeof import('vue')['watch']
const watchEffect: typeof import('vue')['watchEffect']
const watchPostEffect: typeof import('vue')['watchPostEffect']
const watchSyncEffect: typeof import('vue')['watchSyncEffect']
}
// Generated by 'unplugin-auto-import'
export {}
declare global {
const EffectScope: typeof import('vue')['EffectScope']
const computed: typeof import('vue')['computed']
const createApp: typeof import('vue')['createApp']
const customRef: typeof import('vue')['customRef']
const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
const defineComponent: typeof import('vue')['defineComponent']
const effectScope: typeof import('vue')['effectScope']
const getCurrentInstance: typeof import('vue')['getCurrentInstance']
const getCurrentScope: typeof import('vue')['getCurrentScope']
const h: typeof import('vue')['h']
const inject: typeof import('vue')['inject']
const isProxy: typeof import('vue')['isProxy']
const isReactive: typeof import('vue')['isReactive']
const isReadonly: typeof import('vue')['isReadonly']
const isRef: typeof import('vue')['isRef']
const markRaw: typeof import('vue')['markRaw']
const nextTick: typeof import('vue')['nextTick']
const onActivated: typeof import('vue')['onActivated']
const onBeforeMount: typeof import('vue')['onBeforeMount']
const onBeforeUnmount: typeof import('vue')['onBeforeUnmount']
const onBeforeUpdate: typeof import('vue')['onBeforeUpdate']
const onDeactivated: typeof import('vue')['onDeactivated']
const onErrorCaptured: typeof import('vue')['onErrorCaptured']
const onMounted: typeof import('vue')['onMounted']
const onRenderTracked: typeof import('vue')['onRenderTracked']
const onRenderTriggered: typeof import('vue')['onRenderTriggered']
const onScopeDispose: typeof import('vue')['onScopeDispose']
const onServerPrefetch: typeof import('vue')['onServerPrefetch']
const onUnmounted: typeof import('vue')['onUnmounted']
const onUpdated: typeof import('vue')['onUpdated']
const provide: typeof import('vue')['provide']
const reactive: typeof import('vue')['reactive']
const readonly: typeof import('vue')['readonly']
const ref: typeof import('vue')['ref']
const resolveComponent: typeof import('vue')['resolveComponent']
const resolveDirective: typeof import('vue')['resolveDirective']
const shallowReactive: typeof import('vue')['shallowReactive']
const shallowReadonly: typeof import('vue')['shallowReadonly']
const shallowRef: typeof import('vue')['shallowRef']
const toRaw: typeof import('vue')['toRaw']
const toRef: typeof import('vue')['toRef']
const toRefs: typeof import('vue')['toRefs']
const triggerRef: typeof import('vue')['triggerRef']
const unref: typeof import('vue')['unref']
const useAttrs: typeof import('vue')['useAttrs']
const useCssModule: typeof import('vue')['useCssModule']
const useCssVars: typeof import('vue')['useCssVars']
const useSlots: typeof import('vue')['useSlots']
const watch: typeof import('vue')['watch']
const watchEffect: typeof import('vue')['watchEffect']
const watchPostEffect: typeof import('vue')['watchPostEffect']
const watchSyncEffect: typeof import('vue')['watchSyncEffect']
}
<template>
<div class="blank-layout">
<router-view />
</div>
</template>
<script lang="ts" setup name="BlankLayout"></script>
<template>
<div class="blank-layout">
<router-view />
</div>
</template>
<script lang="ts" setup name="BlankLayout"></script>
<template>
<header>头部</header>
</template>
<script lang="ts" setup name="DefaultHeader"></script>
<style scoped>
header {
background-color: antiquewhite;
}
</style>
<template>
<div class="header-wrapper">消息中台header</div>
</template>
<script lang="ts" setup name="DefaultHeader"></script>
<style scoped lang="less">
.header-wrapper {
background-color: var(--color-background);
height: 64px;
line-height: 64px;
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
position: relative;
z-index: 9999;
padding: 0 var(--page-padding);
}
</style>
<template>
<div class="relative">
<Default-header />
<router-view v-slot="{ Component, route }">
<keep-alive>
<component :is="Component" v-if="route.meta.keepAlive"></component>
</keep-alive>
<component :is="Component" v-if="!route.meta.keepAlive"></component>
</router-view>
<Default-footer />
</div>
</template>
<script lang="ts" setup name="DefaultLayout">
import DefaultHeader from "./components/DefaultHeader.vue";
import DefaultFooter from "./components/DefaultFooter.vue";
</script>
<template>
<div class="relative">
<!-- <Default-header /> -->
<div class="main-wrapper h-full">
<el-container class="h-full">
<el-header>消息中台系统</el-header>
<el-container class="h-full">
<el-aside width="200px">Aside</el-aside>
<el-main>
<router-view v-slot="{ Component, route }">
<keep-alive>
<component
:is="Component"
v-if="route.meta.keepAlive"
></component>
</keep-alive>
<component
:is="Component"
v-if="!route.meta.keepAlive"
></component>
</router-view>
</el-main>
</el-container>
</el-container>
</div>
</div>
</template>
<script lang="ts" setup name="DefaultLayout">
// import DefaultHeader from "./components/DefaultHeader.vue";
</script>
<style lang="less">
.relative {
width: 100%;
height: 100%;
.el-header {
box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.1);
}
.el-aside {
// background-color: #79bbff;
box-shadow: 1px 1px 5px 0 rgba(0, 0, 0, 0.1);
}
}
</style>
<route lang="yaml">
redirect:
name: home
</route>
<route lang="yaml">
redirect:
name: home
</route>
<template></template>
import { createRouter, createWebHistory } from "vue-router";
import { setupLayouts } from "virtual:generated-layouts";
import generatedRoutes from "virtual:generated-pages";
const routes = setupLayouts(generatedRoutes);
const router = createRouter({
// history: createWebHashHistory(),
history: createWebHistory(import.meta.env.BASE_URL),
routes,
});
export default router;
import { createRouter, createWebHistory } from "vue-router";
import { setupLayouts } from "virtual:generated-layouts";
import generatedRoutes from "virtual:generated-pages";
const routes = setupLayouts(generatedRoutes);
const router = createRouter({
// history: createWebHashHistory(),
history: createWebHistory(import.meta.env.BASE_URL),
routes,
});
export default router;
......@@ -36,6 +36,10 @@
--section-gap: 160px;
}
:root {
--page-padding: 20px;
}
@media (prefers-color-scheme: dark) {
:root {
--color-background: var(--vt-c-black);
......@@ -59,8 +63,12 @@
font-weight: normal;
}
html,
body {
height: 100%;
}
body {
min-height: 100vh;
color: var(--color-text);
background: var(--color-background);
transition: color 0.5s, background-color 0.5s;
......@@ -71,4 +79,4 @@ body {
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
}
\ No newline at end of file
@import "./base.css";
#app {
max-width: 1280px;
/* max-width: 1280px; */
width: 100%;
margin: 0 auto;
/* padding: 2rem; */
......@@ -25,4 +26,4 @@
grid-template-columns: 1fr 1fr;
padding: 0 2rem;
} */
}
}
\ No newline at end of file
......@@ -3,6 +3,6 @@
"include": ["vite.config.*", "vitest.config.*", "cypress.config.*"],
"compilerOptions": {
"composite": true,
"types": ["node"]
"types": ["node","element-plus/global"]
}
}
......@@ -98,4 +98,9 @@ export default defineConfig({
"@": fileURLToPath(new URL("./src", import.meta.url)),
},
},
server: {
hmr: true,
open: true,
port: 6714,
},
});
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论