<template>
  <view class="shopserviceShop">
      <view class="shopinfo">
          <img :src="shoppic" alt="" class="pic">
          <view class="carname">{{shopname}}</view>
      </view>
      <view class="price">
          <view class="pri"><text class="icon">￥</text>{{pri}}</view>
          <view class="num">x{{num}}</view>
      </view>
  </view>
</template>

<script>
export default {
    name:'shopserviceShop',
    props:{
        shoppic: {
            type:String
        },
        shopname:{
            type:String
        },
        pri:{
            type:Number
        },
        num:{
            type:Number
        }
    }

}
</script>

<style lang="scss">
.shopserviceShop{
    height: 139upx;
    background-color: white;
    display: flex;
    justify-content: space-between;
    .shopinfo{
        width: 577upx;
        height:104upx;
        display: flex;
        margin-left: 21upx;
        .pic{
            width: 104upx;
            height: 104upx;
        }
        .carname{
            color: #333333;
            font-size: 26upx;
            width:437upx;
            margin: auto 0;
            line-height: 44upx;
            margin-left:35upx;
        }
    }
    .price{
        width: 45upx;
        height: 61upx;
        margin-right: 80upx;
       margin-top: 15upx;
        .pri{
            font-size: 25upx;
            color: #DF3348;
            .icon{
                font-size:23upx;
            }
        }
        .num{
            color: #494949;
            font-size: 22upx;
            text-align: center;
            margin-top: 21upx;
        }
    }
}
</style>