提交 f92425d6 编写于 作者: Shine-zwj's avatar Shine-zwj

add:新增多编辑视图布局组件

上级 ef8e4708
......@@ -144,6 +144,7 @@ import AppIndexViewLayoutLeft from './layout/index-view-layout-left/index-view-l
import AppIndexViewLayoutTop from './layout/index-view-layout-top/index-view-layout-top.vue';
import AppGridViewLayout from './layout/grid-view-layout/grid-view-layout.vue';
import AppEditViewLayout from './layout/edit-view-layout/edit-view-layout.vue';
import AppMEditViewLayout from './layout/medit-view-layout/medit-view-layout.vue';
// 全局挂载UI实体服务注册中心
window['uiServiceRegister'] = uiServiceRegister;
// 全局挂载实体权限服务注册中心
......@@ -173,6 +174,7 @@ export const AppComponents = {
v.component('app-caption',AppCaption);
v.component('app-help',AppHelp);
v.component('app-button',AppButton);
v.component('app-medit-view-layout',AppMEditViewLayout);
v.component('app-edit-view-layout',AppEditViewLayout);
v.component('app-index-view-layout-top',AppIndexViewLayoutTop);
v.component('app-index-view-layout-left',AppIndexViewLayoutLeft);
......
......@@ -28,10 +28,10 @@
</layout>
</template>
<script lang="ts">
import { Vue, Component, Watch, Prop } from 'vue-property-decorator';
import { Vue, Component } from 'vue-property-decorator';
@Component({})
export default class AppGridViewLayout extends Vue {
export default class AppEditViewLayout extends Vue {
}
</script>
......
.medit-view-layout {
height: 100%;
padding: 0;
box-shadow: none;
background-color: transparent;
.view-header {
display: flex;
flex-direction: column;
.view-header__content {
display: flex;
justify-content: space-between;
}
}
}
\ No newline at end of file
<template>
<layout class="edit-view-layout view-layout view-container">
<header class="view-header">
<div class="view-header__top">
<slot name="headerTop" />
</div>
<div class="view-header__content">
<div class="view-header__left">
<slot name="headerLeft" />
</div>
<div class="view-header__center">
<slot name="headerCenter" />
</div>
<div class="view-header__right">
<slot name="headerRight" />
</div>
</div>
<div class="view-header__bottom">
<slot name="headerBottom" />
</div>
</header>
<content class="view-content content-container">
<slot />
</content>
<footer class="view-footer">
<slot name="footer" />
</footer>
</layout>
</template>
<script lang="ts">
import { Vue, Component } from 'vue-property-decorator';
@Component({})
export default class AppMEditViewLayout extends Vue {
}
</script>
<style lang="scss">
@import "./medit-view-layout.scss";
</style>
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册