<template>
    <div @click.stop="$emit('click')" class="add-btn d-flex a-c j-c u-s-n" :style="{ height: height  }">
        <slot>
            <el-icon size="18"><CirclePlusFilled /></el-icon>
            <span class="pl5 f-16">{{ content }}</span>
        </slot>
    </div>
</template>
<script setup name="AddBtn" lang="ts">
import { propTypes } from '@/utils/propTypes';
const emit = defineEmits(['click']);
const props = defineProps({
    content: propTypes.string.def(''),
    height: propTypes.string.def('66px')
});
</script>
<style lang="scss" scoped>
.add-btn {
    height: 66px;
    border-radius: 4px;
    color: var(--el-color-primary);
    border: 1px dashed var(--el-color-primary);
    cursor: pointer;

    &:hover {
        opacity: .8;
    }
}
</style>
