update：更新

src/app-register.ts

@@ -138,8 +138,8 @@ import AppFieldImageDynamic from './components/layout-element/media/app-field-im
 import AppTodoList from './components/app-todo-list/app-todo-list.vue';
 import ExtendActionTimeline from './components/extend-action-timeline/extend-action-timeline.vue';
 // 布局组件
-import AppIndexViewLayoutLeft from './components/view-layout/index-view-layout/index-view-layout-left/index-view-layout-left.vue';
-import AppIndexViewLayoutTop from './components/view-layout/index-view-layout/index-view-layout-top/index-view-layout-top.vue';
+import AppIndexViewLayoutLeft from './layout/index-view-layout-left/index-view-layout-left.vue';
+import AppIndexViewLayoutTop from './layout/index-view-layout-top/index-view-layout-top.vue';
 // 全局挂载UI实体服务注册中心
 window['uiServiceRegister'] = uiServiceRegister;
 // 全局挂载实体权限服务注册中心

src/layout/index-view-layout-left/index-view-layout-left.scss

+.index-view-layout-left {
+    .header-right {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+    }
+    .index_sider {
+        background-color:#FFF;
+    }
+}
\ No newline at end of file

src/layout/index-view-layout-left/index-view-layout-left.vue

+<template>
+    <layout class="index_view index-view-layout-left" id="movebox">
+        <sider class="index_sider" :width="collapseChange ? 64 : 200" hide-trigger id="left_move">
+            <div class="sider-top">
+                <slot name="siderTop" />
+            </div>
+            <slot name="siderContent" />
+        </sider>
+        <div v-show="!collapseChange" id="move_axis"></div>
+        <layout id="right_move">
+            <header class="index_header">
+                <div class="header-left">
+                    <slot name="headerLeft" />
+                </div>
+                <div class="header-center">
+                    <slot name="headerCenter" />
+                </div>
+                <div class="header-right">
+                    <slot name="headerRight" />
+                </div>   
+            </header>
+            <content :class="{ 'index_content': true, 'index_tab_content': Object.is(navModel,'tab') ? true : false, 'index_route_content': Object.is(navModel,'route') ? true : false }">
+                <slot name="tabPageExp" />
+                <slot name="navPos" />
+            </content>
+        </layout>
+    </layout>
+</template>
+<script lang="ts">
+import { Vue, Component, Watch, Prop } from 'vue-property-decorator';
+
+@Component({})
+export default class AppIndexViewLayoutLeft extends Vue {
+
+    /**
+     * 导航模式
+     * 
+     * @memberof AppIndexViewLayoutLeft
+     */
+    @Prop({ default: 'tab' })
+    public navModel!: string;
+
+    /**
+     * 是否折叠
+     * 
+     * @memberof AppIndexViewLayoutLeft
+     */
+    @Prop({ default: false })
+    public collapseChange!: boolean;
+}
+</script>
+
+<style lang="scss">
+@import "./index-view-layout-left.scss";
+</style>

src/layout/index-view-layout-top/index-view-layout-top.scss

+.index-view-layout--top {
+    .index-view-layout-header {
+        height: 64px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        background-color: var(--app-color-black);
+        color: var(--app-color-gray-white);
+        .header__left {
+            font-size: 21px;
+            font-weight: 700;
+            margin-left: 50px;
+            .app-icon {
+                width: 36px;
+                height: 37px;
+                margin-right: 6px;
+            }
+        }
+        .header__right {
+            display: flex;
+            align-items: center;
+        }
+    }
+    .index-view-layout-content {
+        height: calc(100% - 64px);
+        overflow: auto;
+        padding: 20px 38px 0 38px;
+        background-color: var(--app-color-gray-gray-400);
+    }
+}
\ No newline at end of file

src/layout/index-view-layout-top/index-view-layout-top.vue

+<template>
+    <layout class="index-view-layout index-view-layout--top">
+        <header class="index-view-layout-header">
+            <div class="header__left">
+                <slot name="headerLeft" />
+            </div>
+            <div class="header__center">
+                <slot name="headerCenter" />
+            </div>
+            <div class="header__right">
+                <slot name="headerRight" />
+            </div>
+        </header>
+        <content class="index-view-layout-content">
+            <slot name="navPos" />
+        </content>
+        <footer class="layout-footer-center">
+            <slot name="footer"></slot>
+        </footer>
+    </layout>
+</template>
+<script lang="ts">
+import { Vue, Component } from 'vue-property-decorator';
+
+@Component({})
+export default class AppIndexViewLayoutTop extends Vue {
+
+}
+</script>
+
+<style lang="scss">
+@import "./index-view-layout-top.scss";
+</style>