<!--
 * @Description: 指标块布局
 * @Author: 王晓颖
 * @Date: 2021-07-14 09:03:40
 -->
<template>
  <div class="block-container">
    <div class="block-title">
      <title1 :title="title"/>
      <!--<dv-decoration-1 style="width:0.8rem; height:100%;" :color="colors"/>-->
      <!--<div class="title">{{title}}</div>-->
      <!--</dv-decoration-1>-->
    </div>
    <div class="block-content">
      <slot/>
    </div>
  </div>
</template>

<script>
  import Title1 from "../title/Title1";
  export default {
    name: "container1",
    components: {Title1},
    props:{
      title:{
        type:String,
        default:''
      }, // 标题
      colors:{
        type: Array,
        default: ()=>{
          return ['#ffffff','#4f98ee']
        }
      }
    }
  }
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.block-container{
  height: 100%;
  width:100%;
  .block-title{
    height: 0.5rem;
    display: flex;
    justify-content: start;
    align-items: flex-end;
    .title{
      line-height: 0.4rem;
      font-size:0.28rem;
      font-weight: bold;
      color: white;
    }
  }
  .block-content{
    height: calc(100% - 0.5rem);
    padding: 0.05rem;
    padding-top:0.1rem;
    /*background-color: rgba(255,255,255,0.5);*/
  }
}
</style>