<template>
    <view class="add-trolleys">
        <view
            :class="{
                'disabled': disabled,
            }"
            class="m-icon m-icon-trolleys"
            :style="{'background-image': backgroundImage}"
            @tap.stop="trolleysTap"
        />
    </view>
</template>

<script>
/**
 * @file 购物车样式组件
 * @author zhangeryi@baidu.com
 */

import {send} from '../../utils/log';
export default {
    config: {
        component: true
    },
    options: {
        addGlobalClass: true
    },
    props: {
        disabled: {
            type: [Boolean, Number]
        },
        logkey: {
            type: String
        },
        backgroundImage: {
            type: String,
            default: ''
        }
    },
    methods: {
        trolleysTap() {
            this.$emit('trolleysTap');
            send({
                type: 'b',
                action: 'addTrolleysClick',
                module: this.logkey
            });
        }
    }
};
</script>
<style lang="less" scoped>
.add-trolleys {
    text-align: right;
    color: #fd503e;
    .m-icon {
        background: #fd503e;
        color: #fff;
        border-radius: 100%;
        width: 24px;
        height: 24px;
        text-align: center;
        font-size: 14px;
        line-height: 25px;
        padding-right: 1px;
        box-sizing: border-box;
        float: right;
        &.disabled {
            background: #ccc;
        }
    }
}
</style>


