<template>
    <div class="sum-head">
        <span class="title">{{ title }}</span>
        <div class="total" v-show="text">
            <slot></slot>
            {{ text }}：<span>{{ sum }}</span>
        </div>
    </div>
</template>

<script>
    export default {
        name: "sum-head",
        props: {
            title: {
                type: String,
                default: ''
            },
            text: {
                type: String,
                default: ''
            },
            sum: {
                // type: String,
                default: ''
            }
        },
    }
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
    .sum-head {
        padding: 10px 12px;
        border-bottom: 1px solid #ccc;
        .title {
            color: #409EFF;
        }
        .total {
            float: right;
            span {
                color: #42b983;
                margin-right: 10px;
            }
        }
    }
</style>
