62 lines
1.1 KiB
Vue
62 lines
1.1 KiB
Vue
<template>
|
|
<section class="AiGroup" :class="{noBorder,description}" :style="{paddingLeft:left+'rpx'}">
|
|
<div class="groupHeader" v-if="title" v-text="title"/>
|
|
<slot/>
|
|
</section>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: "AiGroup",
|
|
provide() {
|
|
return {
|
|
labelColor: this.labelColor,
|
|
description: this.description,
|
|
activeStep: this.activeStep
|
|
}
|
|
},
|
|
props: {
|
|
title: String,
|
|
noBorder: Boolean,
|
|
left: {default: 32},
|
|
labelColor: {default: "#333"},
|
|
description: {default: false}, //用于展示则不会又红星,会把标签的内间距去掉
|
|
activeStep: {default: 1}//用于步骤组件的当前步数
|
|
},
|
|
data() {
|
|
return {
|
|
items: []
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.AiGroup {
|
|
background: #FFFFFF;
|
|
box-shadow: inset 0px -1px 0px 0px #DDDDDD;
|
|
|
|
&.noBorder {
|
|
box-shadow: none;
|
|
}
|
|
|
|
& + .AiGroup {
|
|
margin-top: 16px;
|
|
}
|
|
|
|
.groupHeader {
|
|
font-weight: bold;
|
|
font-size: 36px;
|
|
padding-left: 20px;
|
|
margin-bottom: 16px;
|
|
}
|
|
|
|
&.description {
|
|
.groupHeader {
|
|
padding-left: 0;
|
|
}
|
|
}
|
|
|
|
}
|
|
</style>
|