caimei-applets-store/components/views/cm-floor-title/cm-floor-title.vue

<template>
    <view class="floor-title">
        <view class="row">
            <text class="title" v-text="title"></text>
            <view class="more" @click="$emit('click')">
                <text v-text="moreText"></text>
                <text class="iconfont icon-chakangengduo"></text>
            </view>
        </view>
        <view class="sub-title" v-if="subTitle"><text v-text="subTitle"></text></view>
    </view>
</template>

<script>
export default {
    name: 'cm-floor-title',
    props: {
        title: {
            type: String,
            default: '标题'
        },
        subTitle: {
            type: String,
            default: ''
        },
        moreText: {
            type: String,
            default: '查看更多'
        }
    }
}
</script>

<style lang="scss" scoped>
// 楼层标题
.floor-title {
    padding: 24rpx;

    .row {
        @extend .cm-flex-between;
        .title {
            @include ellipsis(1);
            max-width: 600rpx;
            font-size: 34rpx;
            font-weight: 600;
            color: #333333;
        }

        .more {
            font-size: 26rpx;
            color: #999999;

            .iconfont {
                font-size: 24rpx;
            }
        }
    }
    .sub-title {
        font-size: 26rpx;
        color: #999999;
        margin-top: 8rpx;
    }
}
</style>