<template>
    <el-card style="height:100%">
        <div class="container">
            <h2>{{service.featureName}}</h2>
            <p>{{service.featureDesc}}</p>
            <el-divider></el-divider>
            <p>
                <span v-if="service.limitType==2">剩余：{{parseInt(service.surplus)}}</span>
                <span v-if="service.limitType==1">{{service.beginDate}} - {{service.endDate}}</span>
            </p>
        </div>
    </el-card>

</template>

<script>
export default {
    name: "ServiceItem",
    props: {
        service: {
            type: Object,
            required: true,
        },
    },
    data() {
        return {};
    },
};
</script>

<style lang="stylus" scoped>
.container {
    width: 300px;
    height: 100%;
}
</style>