<template>
  <view class="seckillshopdetailname">
    <view class="left">
      <view class="left1">
        <text class="icon">￥</text>
        <text class="money">{{price}}</text>
      </view>
      <view class="right1">
        <view class="yishou">已售{{yp_kp_bfb}}</view>
        <view class="huaxian">￥{{price_y}}</view>
      </view>
    </view>
    <view class="right">
      <view class="ale">距离结束仅剩</view>
      <view class="djs">
        <countdown :day="time[0]" :hour="time[1]" :minute="time[2]" :second="time[3]" showDay=true></countdown>
      </view>
    </view>
  </view>
</template>

<script>
import countdown from "../../components/seckill/countdown";
export default {
  name: "seckillshopdetailname",
  components: {
    countdown
  },
  data(){
    return {
      time:[]
    }
  },
  props:['price','price_y','yp_kp_bfb','times'],
  watch:{
    times(a){
      console.log(a)
      this.time = a
    }
  }
};
</script>

<style lang="scss">
.seckillshopdetailname {
  width: 100vw;
  height: 101upx;
  background: url("../../static/img/seckillshopdetail.png");
  background-size: 100% 100%;
  // position: absolute;
  // left: 0;
  //   float: left;
  display: flex;
  justify-content: space-between;
  .left {
    width: 151upx;
    margin-left: 28upx;
    color: white;
    line-height: 101upx;
    display: flex;
    .left1 {
      height: 30upx;
      .icon {
        font-size: 30upx;
      }
      .money {
        font-size: 41upx;
      }
    }
    .right1 {
      position: relative;
      top: -12upx;
      left: 10upx;
      .yishou {
        height: 20upx;
        color: #fff600;
        font-size: 18upx;
      }
      .huaxian {
        width: 100upx;
        font-size: 21upx;
        text-decoration: line-through;
      }
    }
  }
  .right {
    .ale {
      color: #e1484e;
      font-size: 22upx;
      text-align: center;
    }
    height: 61rpx;
    // margin: auto 0;
    margin-top: 16rpx;
    padding-right: 35upx;
  }
}
</style>