123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233 |
- <template>
- <view>
- <view class="presale2" :style="'background-image:url('+imgUrl+'preSale/pre_sale_bg.png);background-size:100% 100%;background-repeat:no-repeat;margin-top:-26rpx;position:relative'">
- <view class="presale1_left">
- <!-- 进行中 -->
- <view class="presale1_price">
- <view class="presale1_title">{{$L("预售价")}}: </view>
- <view class="presale1_title_b"><text>¥</text><text>{{preSellInfo.presellPrice}}</text></view>
- <view class="presale1_price1 presale1_price2">
- <image :src="imgUrl + 'site/yushouhuore.png'"></image>
- <view>
- <!-- <view class="presale1_prices" v-if="preSellInfo.presellPrice">¥{{preSellInfo.presellPrice}}</view> -->
- <view class="presale_oragin_price">{{$L("原价")}}:{{preSellInfo.productPrice}}</view>
- </view>
- </view>
- </view>
- </view>
- <view class="presale1_right">
- <view class="collect_deposit" v-if="preSellInfo.type==1">
- <text>{{$L("预售定金")}}</text>
- <text>¥{{preSellInfo.firstMoney}}</text>
- <text v-if="preSellInfo.firstExpand!=0">{{$L("可抵")}}</text>
- <text v-if="preSellInfo.firstExpand!=0">¥{{preSellInfo.firstExpand}}</text>
- </view>
- <view class="collect_deposit" v-if="preSellInfo.type==2&&preSellInfo.pre_run!=1">
- <text>{{$L("已售")}}</text>
- <text>{{' '}}{{preSellInfo.saleNum}}{{$L("件")}}</text>
- </view>
- <view class="collect_deposit" v-if="preSellInfo.type==2&&preSellInfo.pre_run==1">
- <text></text>
- <text>即将开始</text>
- </view>
- <view class="presale1_start_time" v-if="preSellInfo.pre_run == 1">{{$L("活动开始时间")}}:{{preSellInfo.startTime}}</view>
- <view class="presale1_start_time1" v-else>{{$L("活动结束时间")}}:{{preSellInfo.endTime}}</view>
- </view>
- </view>
- <view class="presale3" v-if="preSellInfo.pre_run!=1">
- <view class="presale_desc" v-if="preSellInfo.type==1">{{$L("付尾款时间")}}:{{preSellInfo.remainStartTime}} ~ {{preSellInfo.remainEndTime}}</view>
- <view class="presale_desc">{{$L("发货时间")}}:{{preSellInfo.deliverTime.split(' ')[0]}}</view>
- </view>
- </view>
- </template>
- <script>
- export default{
- props:['preSellInfo'],
- data(){
- return{
- imgUrl:getApp().globalData.imgUrl
- }
- },
- created() {
- let countTime = 0;
- let now = new Date()
- let startTime = new Date(this.preSellInfo.startTime)
- if (now < startTime) {
- countTime = (startTime.getTime() - now.getTime()) / 1000
-
- } else {
- countTime = this.preSellInfo.distanceEndTime
- }
- this.secInterval = setInterval(() => {
- if (countTime == 0) {
- //倒计时结束,清除倒计时
- clearInterval(this.secInterval);
- this.$emit('getGoodsDetail')
- } else {
- countTime--;
- }
- }, 1000)
- }
- }
- </script>
- <style lang="scss">
- .presale3{
- background-color: #fff;
- padding: 20rpx;
- .presale_desc{
-
- font-size: 26rpx;
- color: #999999;
- &:nth-child(2){
- margin-top: 14rpx;
- }
- }
- }
-
- .presale1 {
- width: 100%;
- height: 163rpx;
- display: flex;
- justify-content: space-between;
- align-items: center;
- padding: 0 20rpx 0 53rpx;
- box-sizing: border-box;
- }
-
- .presale1_left {
- display: flex;
- flex-direction: column;
- padding-top: 15rpx;
- height: 100%;
- }
-
- .presale1_price {
- display: flex;
- flex-direction: column;
-
- }
-
- .presale1_title {
- font-size: 28rpx;
- font-family: PingFang SC;
- font-weight: nornal;
- color: rgba(254, 254, 254, 1);
- line-height: 40rpx;
- }
-
- .presale1_title_b {
- font-size: 28rpx;
- font-family: PingFang SC;
- font-weight: nornal;
- color: rgba(254, 254, 254, 1);
- line-height: 46rpx;
- margin-left: 40rpx;
- text:nth-child(2){
- font-size: 45rpx;
- }
- }
-
- .presale1_price1 {
- display: flex;
- align-items: center;
- }
-
- .presale1_price2 {
- display: flex;
- align-items: flex-start;
- margin-top: 10rpx;
- }
-
- .presale1_price1 image {
- width: 24rpx;
- height: 28rpx;
- }
-
- .presale1_prices {
- display: flex;
- font-size: 30rpx;
- font-family: PingFang SC;
- font-weight: 500;
- color: rgba(255, 255, 255, 1);
- }
-
- .presale_oragin_price {
- font-size: 22rpx;
- font-family: PingFang SC;
- font-weight: 400;
- text-decoration: line-through;
- color: rgba(254, 254, 254, 1);
- opacity: 0.7;
- margin-left: 36rpx;
- }
-
- .presale1_right {
- display: flex;
- flex-direction: column;
- align-items: center;
- }
-
- .presale2 {
- width: 100%;
- height: 163rpx;
- display: flex;
- justify-content: space-between;
- align-items: center;
- padding: 0 20rpx 0 39rpx;
- box-sizing: border-box;
- }
-
- .collect_deposit {
- display: flex;
- font-size: 24rpx;
- font-family: PingFang SC;
- font-weight: 500;
- color: rgba(255, 255, 255, 1);
- align-items: center;
- white-space: pre-wrap;
- }
-
- .collect_deposit text:nth-child(2){
- font-size: 40rpx;
- margin-right: 10rpx;
- font-weight: bold;
- white-space: pre-wrap;
- }
- .collect_deposit text:nth-child(4) {
- font-size: 26rpx;
- margin-right: 10rpx;
- font-weight: bold;
- white-space: pre-wrap;
- }
-
- .presale1_start_time {
- width: 380rpx;
- height: 30rpx;
- background: rgba(255, 255, 255, 1);
- border-radius: 15rpx;
- font-size: 20rpx;
- font-family: PingFang SC;
- font-weight: 500;
- color: #F91573;
- text-align: center;
- line-height: 30rpx;
- margin-top: 10rpx;
- }
-
- .presale1_start_time1 {
- width: 380rpx;
- height: 30rpx;
- background:rgba(255, 255, 255, 1);
- border-radius: 15rpx;
- font-size: 20rpx;
- font-family: PingFang SC;
- font-weight: 500;
- color: #F91573;
- text-align: center;
- line-height: 30rpx;
- margin-top: 10rpx;
- }
- </style>
|