no message

Former-commit-id: 6c662ce48ae133e62f326723c0acace4a99b70d1
Former-commit-id: d6734073b9816f545fac36f942dd7f9bdcc95a83
Former-commit-id: 8fdcc1c3852f13eeb2616882f8b77b4e08a087a0
This commit is contained in:
李杨
2018-03-09 19:16:04 +08:00
parent 0b39efe7f9
commit 9a8a69eac5
4 changed files with 50 additions and 6 deletions

View File

@@ -0,0 +1,10 @@
<template>
<div class="dd-card-full">
<div class="dd-card-full__header">
<slot name="header"></slot>
</div>
<div class="dd-card-full__body">
<slot></slot>
</div>
</div>
</template>

View File

@@ -2,9 +2,7 @@
<div class="container-component" :class="{responsive}">
<!-- [card] 卡片容器 -->
<el-card v-if="type === 'card'">
<div v-if="$slots.header" slot="header">
<slot name="header"></slot>
</div>
<slot v-if="$slots.header" name="header" slot="header"></slot>
<slot></slot>
</el-card>
<!-- [ghost] 隐形的容器 -->
@@ -12,14 +10,18 @@
<slot></slot>
</div>
<!-- [full-card] 撑满 -->
<div v-if="type === 'full-card'">
<card-full v-if="type === 'full-card'">
<slot v-if="$slots.header" name="header" slot="header"></slot>
<slot></slot>
</div>
</card-full>
</div>
</template>
<script>
export default {
components: {
CardFull: () => import('./_CardFull.vue')
},
props: {
// 容器样式
type: {
@@ -33,11 +35,27 @@ export default {
required: false,
default: false
}
},
data () {
return {
headerHeight: 0
}
},
computed: {
fullCardBodyStyle () {
return {
}
}
},
mounted () {
console.log(this.$refs.fullCardHeader.offsetHeight + 18 * 2)
}
}
</script>
<style lang="scss">
@import '~@/assets/style/public.scss';
.container-component {
margin-right: 20px;
margin-bottom: 20px;
@@ -59,4 +77,16 @@ export default {
max-width: 1920px - 200px;
}
}
.full-card {
position: absolute;
top: 0px;
right: $margin;
bottom: $margin;
left: 0px;
.el-card__header {
position: absolute;
top: 0px;
width: 100%;
}
}
</style>