<template>
    <view class="im-card-title">
        <view 
            class="im-card-title__text c-color-green" 
            :style="{
                background: cardTitleObj.background,
                color: cardTitleObj.color
            }"
        >{{ cardTitleObj.text }}</view>
        <view class="im-card-title__block"></view>
    </view>
</template>

<script>
/**
 * @file components/im/im-text-line
 * @author mayifan02
 * @categories
 * @tags
 */
import {navigate} from '../../utils/navigate';
export default {
    config: {
        component: true
    },
    options: {
        addGlobalClass: true
    },
    props: {
        /**
         * 卡片标题
         * @property {string} text 名称
         * @property {string} background 背景颜色
         * @property {string} color 文字颜色
         */
        cardTitleObj: {
            type: Object,
            default: () => ({})
        }
    },
    components: {},
    data() {
        return {};
    }
};
</script>

<style lang="less" scoped>
.im-card-title {
    &__text {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        padding-left: 10px;
        border-radius: 8px 8px 0 0;
        font-weight: 700;
        line-height: 40px;
        background-color: #ebfbfb;
        box-sizing: border-box;
    }
    &__block {
        height: 30px;
    }
}
</style>
