<template>
    <view class="shop" @click="tap">
        <image :src="image"></image>
        <view class="info">
            <text class="title">{{name}}</text>
            <text class="profile u-line-2">{{advword}}</text>
        </view>
    </view>
</template>
<script>
export default {
    name:"shop",
    data(){
        return {

        }
    },
    props:['name','advword','id','image'],
    methods:{
        tap(){
            this.$emit("tap",{id:this.id})
        }
    }
}
</script>
<style lang="scss" scoped>
.shop{
    display: flex;
    width: 690rpx;
    height: 170rpx;
    margin: 0 auto;
    margin-bottom: 30rpx;
    border-radius: 5rpx;
    overflow: hidden;
    >image{
        width: 220rpx;
        height: 170rpx;
        flex-shrink: 0;
    }
    .info{
        display: flex;
        flex-direction: column;
        width: 100%;
        height: 100%;
        background-color: #f5f5f5;
        padding: 30rpx;
        >text:first-child{
            font-size: 30rpx;
            color:#333;
             
        }
        >text:last-child{
            font-size: 28rpx;
            color: #666;
            margin-top: 20rpx;
        }
    }
}
</style>