You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
3188 lines
87 KiB
3188 lines
87 KiB
<template>
|
|
<!-- 拼团单一商家 -->
|
|
<view class="page1" @touchmove="onPageTouchMove">
|
|
<!-- 固定顶部导航栏（悬浮在背景图之上） -->
|
|
<view class="nav-bar"
|
|
:style="{'padding-top': menuButtonInfo.top +'px','background':((orderListWait.length > 0 && lastScrollTop>217) || (orderListWait.length == 0 && lastScrollTop>149))?'#fff':''}">
|
|
<view class="back-btn" @tap="back">
|
|
<uni-icons type="left" size="28"></uni-icons>
|
|
</view>
|
|
<view class="title-search">
|
|
<uni-icons type="search" size="18" style="margin: 9rpx;"></uni-icons>
|
|
<input type="text" placeholder="搜索" />
|
|
</view>
|
|
</view>
|
|
<!-- 背景头图（随页面滚动） -->
|
|
<view class="title">
|
|
<view class="hero-spark spark-a"></view>
|
|
<view class="hero-spark spark-b"></view>
|
|
<view class="hero-spark spark-c"></view>
|
|
</view>
|
|
<view class="content">
|
|
<view class="pintuan shop-card group-hero-card">
|
|
<view class="group-card-glow"></view>
|
|
<!-- <view class="shop-rally-badge">
|
|
<text>有件事你知道吗？</text>
|
|
<text class="shop-rally-dot"></text>
|
|
<text>拼团和期末不挂科一样重要！</text>
|
|
</view> -->
|
|
<view class="shop-top">
|
|
<view class="shop-img">
|
|
<img :src="shopItem.shopIcon" alt="">
|
|
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/6c4ab92a43c842d8bb22035bce1f65cc.png"
|
|
alt=""
|
|
style="width:30rpx;height:30rpx;position: absolute;top: 0;left: 0;background-size: 100%;" />
|
|
</view>
|
|
<view class="shop-content" @tap="goDetail('shopDetail')">
|
|
<view class="shop-name">
|
|
{{shopItem.shopName}}
|
|
</view>
|
|
<view class="shop-subtitle">
|
|
约上室友同学一起拼，越快成团越快开吃
|
|
</view>
|
|
<view class="shop-content-center">
|
|
<view class="shop-rate">
|
|
<view class="shop-rate-num">{{shopItem.shopScore}}</view>
|
|
<view>
|
|
<uni-rate :disabled="true" size="20" disabledColor="rgba(255, 184, 84, 1)"
|
|
:value="shopItem.shopScore" />
|
|
</view>
|
|
</view>
|
|
<view class="shop-tag">
|
|
<text
|
|
style="padding: 4rpx 10rpx;background: rgba(223, 255, 176, 1);color: #777;border-radius: 6rpx;">
|
|
{{shopItem.shopTypeTitle}}
|
|
</text>
|
|
</view>
|
|
</view>
|
|
<view class="shop-content-bottom">
|
|
<view class="shop-deal" @tap.stop="goDetail('shopEvaluate')" style="color: #777;">
|
|
店铺评价<uni-icons type="right" size="12"></uni-icons>
|
|
</view>
|
|
<view class="shop-deal1">
|
|
销量 <text> {{shopItem.saleCount != null ? shopItem.saleCount : 0}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="shop-bottom">
|
|
<text class="notice-label">公告</text>
|
|
<text>{{shopItem.remark}}</text>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="pintuan group-live-card" style="padding: 0;margin-top:20rpx;display: flex;"
|
|
v-if="orderListWait.length > 0" @tap="openOrderWait('')">
|
|
<view class="live-card-header">
|
|
<view class="live-title-wrap">
|
|
<image class="live-title-gif" src="/static/images/img/loading.gif" mode="aspectFit"></image>
|
|
<view class="live-title">你知道吗？拼团和期末不挂科一样重要！</view>
|
|
</view>
|
|
<view class="live-pill">去凑团</view>
|
|
</view>
|
|
<swiper class="zaixian-swiper" vertical circular :autoplay="orderListWait.length > 0"
|
|
:interval="onlineWorkerInterval" :duration="onlineWorkerDuration">
|
|
<swiper-item v-for="(item,index) in orderListWait" :key="index">
|
|
<view class="live-swiper-item">
|
|
<view class="pintuan-left">
|
|
<view class="pintuan-left-img">
|
|
<img :src="item.productPicture" alt="">
|
|
</view>
|
|
<view class="pintuan-left-box">
|
|
<view class="pintuan-left-name">
|
|
{{item.productName}}
|
|
</view>
|
|
<view class="pintuan-left-price">
|
|
拼团<text style="color: red;">￥{{item.groupPrice}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="pintuan-right">
|
|
<view class="pintuan-right-img">
|
|
<img src="/static/images/img/songshu.png"
|
|
alt="" />
|
|
<view class="weipincheng">+</view>
|
|
</view>
|
|
<view class="pintuan-right-cha">
|
|
差<text class="missing-count">{{item.targetMembers - item.currentMembers}}人</text>拼成
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</swiper-item>
|
|
</swiper>
|
|
</view>
|
|
<!-- 分类栏：移到goods-list外层，position:sticky才能生效 -->
|
|
<!-- 占位元素：当container吸顶时保持页面高度不塌缩 -->
|
|
<view v-if="isContainerSticky" :style="'height:' + containerHeight + 'px;margin-top:20rpx;'"></view>
|
|
<view class="container goods-panel" :style="containerStyle">
|
|
<scroll-view scroll-y id="menuList" class="menu-scroll"
|
|
style="border-right: 1px solid #eee;font-weight: 700;font-size: 28rpx;height: 100%;width: 160rpx;">
|
|
<view class="menu1" @tap="checkTab(index)" v-for="(item,index) in menuList" :key="index"
|
|
:style="{'border-top-right-radius':item.checked?'20rpx':'','border-bottom-right-radius':item.checked?'20rpx':'','color':item.checked?'rgba(0, 35, 28, 1)':'#777','background':item.checked?'#fff':''}">
|
|
<image class="menu-active-dot" v-if="item.checked" src="/static/images/img/loading.gif"
|
|
mode="aspectFit"></image>
|
|
<view style="width: 160rpx;">{{item.categoryName}}</view>
|
|
</view>
|
|
</scroll-view>
|
|
<scroll-view class="goods-list" scroll-y :scroll-into-view="scrollIntoViewId"
|
|
:scroll-top="goodsListScrollTop" @scroll="onGoodsListScroll" @scrolltoupper="onGoodsListScrollToTop"
|
|
:scroll-with-animation="true">
|
|
<view class="goods-member goods-card" :id="'category-' + item.categoryId"
|
|
v-for="(item,index) in productItem" :key="index" @tap="goDetail('product',item)">
|
|
<view class="goods-card-shine"></view>
|
|
<view @tap.stop="buyingye" v-if="item.status == 1"
|
|
style="width: 100%;height:100%;position: absolute;top: 0;background: rgba(0, 0, 0, 0.1);z-index: 999;border-radius: 20rpx;">
|
|
</view>
|
|
<view class="goods-top">
|
|
|
|
<view class="goods-img">
|
|
<img :src="item.productPicture" alt="" style="border-radius: 20rpx;">
|
|
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/6c4ab92a43c842d8bb22035bce1f65cc.png"
|
|
alt=""
|
|
style="width:30rpx;height:30rpx;position: absolute;top: 0;left: 0;background-size: 100%;" />
|
|
</view>
|
|
<view class="goods-content" @tap="goDetail('goodsDetail')">
|
|
<view class="goods-name">
|
|
{{item.productName}}
|
|
</view>
|
|
<view class="goods-vibe">
|
|
<text class="goods-vibe-tag">拼团价更香</text>
|
|
<text class="goods-vibe-copy">约人一起下单</text>
|
|
</view>
|
|
<view class="goods-content-center">
|
|
<view class="goods-deal1">
|
|
销量 <text> {{item.tailWarn != null ? item.tailWarn : 0}}</text>
|
|
</view>
|
|
</view>
|
|
<view class="shop-tag1">
|
|
<view class="goods-tag" @tap.stop="openOrderWait(item)"
|
|
v-if="item.orderListWait != undefined && item.orderListWait.length > 0">
|
|
<view class="pintuan-right-img">
|
|
<img src="/static/images/img/songshu.png"
|
|
alt="" />
|
|
<view class="weipincheng">+</view>
|
|
</view>
|
|
<view class="pintuan-right-cha">
|
|
差<text style="color: red;">{{item.minGroupCount}}人</text>拼成
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="goods-bottom">
|
|
|
|
<view v-if="item.productGroupBuyPrices != null && item.isMoreBuy != 1"
|
|
class="goods-btn group-buy-btn" style="margin-left: 6%;"
|
|
:style="{'float':groupId != ''?'right':''}" @tap="openPopup('xiadan','pintuan',item)">
|
|
<view class="btn-spark">
|
|
<view class="spark-dot spark-dot-1"></view>
|
|
<view class="spark-dot spark-dot-2"></view>
|
|
<view class="spark-dot spark-dot-3"></view>
|
|
</view>
|
|
<text>拼团购买¥{{ getGroupPrice(item) }}</text>
|
|
</view>
|
|
<view class="goods-btn solo-buy-btn" v-if="!groupId" @tap="openPopup('xiadan','dandu',item)"
|
|
style="background: rgba(166, 255, 234, 0.3);border: 1px solid rgba(166, 255, 234, 0.5);height:68rpx;">
|
|
直接购买¥{{item.attributeListPrice | sliceMsg}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<uni-load-more :status="loadStatus" @change="onChange" />
|
|
<view style="width: 100%;height: 160rpx;"></view>
|
|
</scroll-view>
|
|
|
|
</view>
|
|
</view>
|
|
<view style="width: 100%;height: 160rpx;"></view>
|
|
<view class="bottom checkout-bar">
|
|
<view class="bottom-left">
|
|
<view class="cart-bag-wrap" style="position: relative;width: 60rpx;height: 80rpx;margin-top: 20rpx;"
|
|
@tap="openPopup('car','','')">
|
|
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/60db52398a65459e9541881c926986a4.png"
|
|
alt="" />
|
|
<view class="bottom-dot" v-if="cartTotalCount > 0">{{cartTotalCount}}</view>
|
|
</view>
|
|
<view class="bottom-price">
|
|
<view class="bottom-price-label">已选合计</view>
|
|
<view>￥{{cartTotalPrice}}</view>
|
|
</view>
|
|
</view>
|
|
<view class="bottom-right checkout-btn" @tap="submitCartCheckout">
|
|
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/d93d893296ed46ea99cfd0e8e2835eaa.png" alt="" />
|
|
</view>
|
|
</view>
|
|
|
|
|
|
<!-- 购物车弹窗 -->
|
|
<uni-popup ref="carPopup" background-color="#fff">
|
|
<view class="car-content">
|
|
<view class="car-close" @tap="$refs.carPopup.close()">
|
|
<uni-icons type="close" size="30" color="#fff"></uni-icons>
|
|
</view>
|
|
<view class="car-title">
|
|
已加购商品（{{cartTotalCount}}）
|
|
</view>
|
|
|
|
<scroll-view scroll-y style="max-height: 400rpx;">
|
|
<view class="goods-top" style="padding: 20rpx 0;" v-for="(cartItem, index) in cartItems"
|
|
:key="index">
|
|
<view class="goods-img" style="width: 168rpx;height: 168rpx;">
|
|
<img :src="cartItem.item.productPicture" alt=""
|
|
style="border-radius: 20rpx;width:100%;height:100%;">
|
|
</view>
|
|
<view class="goods-content" style="padding-left: 20rpx;">
|
|
<view class="goods-name">
|
|
{{cartItem.item.productName}}
|
|
</view>
|
|
<view class="goods-content-center">
|
|
<view class="goods-deal1" v-if="cartItem.specs">
|
|
<text style="color: #999; font-size: 20rpx;">
|
|
已选规格:{{getSpecDisplayString(cartItem.specs)}}
|
|
</text>
|
|
</view>
|
|
</view>
|
|
<view class="goods-content-bottom" style="margin-top: 10rpx;">
|
|
<view
|
|
style="font-size: 28rpx;line-height: 54rpx;margin-right: 20rpx;flex: 1;color: red;">
|
|
￥{{cartItem.price}}
|
|
</view>
|
|
<view class="goods-num">
|
|
<view class="num-plus" style="background: #999;color: #fff;"
|
|
@tap="adjustCart(cartItem.cartId, -1)">
|
|
-
|
|
</view>
|
|
<view class="num">
|
|
{{cartItem.quantity}}
|
|
</view>
|
|
<view class="num-plus" @tap="adjustCart(cartItem.cartId, 1)">
|
|
+
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
|
|
<view style="width: 100%;height: 160rpx;"></view>
|
|
<view class="bottom" style="padding-bottom: 20rpx;">
|
|
<view class="bottom-left">
|
|
<view style="width: 60rpx;height: 80rpx;margin-top: 10rpx;" @tap="$refs.carPopup.close()">
|
|
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/60db52398a65459e9541881c926986a4.png"
|
|
alt="" />
|
|
</view>
|
|
<view class="bottom-price" style="line-height: 48rpx;">
|
|
<view>￥{{cartTotalPrice}}</view>
|
|
</view>
|
|
</view>
|
|
<view class="bottom-right" @tap="submitCartCheckout">
|
|
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/d93d893296ed46ea99cfd0e8e2835eaa.png"
|
|
alt="" />
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</uni-popup>
|
|
|
|
<!-- 警告弹出层 -->
|
|
<uni-popup ref="warnPopup" background-color="#fff">
|
|
<view class="warnImg">
|
|
<img @tap="$refs.warnPopup.close()"
|
|
src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/4996043b3987401794b974d359429b8e.png"
|
|
alt="购物车是空的" style="width:600rpx;height:740rpx;" />
|
|
</view>
|
|
</uni-popup>
|
|
<!-- 拼团和选规格弹窗 -->
|
|
<uni-popup ref="pintuanPopup" background-color="#fff">
|
|
<view class="car-content group-order-popup">
|
|
<view class="car-close" @tap="$refs.pintuanPopup.close()">
|
|
<uni-icons type="close" size="30" color="#fff"></uni-icons>
|
|
</view>
|
|
<view class="popup-rally-title" v-if="isPintuan">
|
|
<view class="popup-rally-main">拼团搭子哪里找-隔壁宿舍全是宝！</view>
|
|
</view>
|
|
<view class="goods-top popup-product-card">
|
|
<view class="goods-img">
|
|
<img :src="currentItem.productPicture" alt="" style="border-radius: 20rpx;">
|
|
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/6c4ab92a43c842d8bb22035bce1f65cc.png"
|
|
alt=""
|
|
style="width:30rpx;height:30rpx;position: absolute;top: 0;left: 0;background-size: 100%;" />
|
|
</view>
|
|
<view class="goods-content">
|
|
<view class="goods-name">
|
|
{{currentItem.productName}}
|
|
</view>
|
|
<view class="goods-content-center">
|
|
<view class="goods-deal1">
|
|
月售 <text> 100+</text>
|
|
</view>
|
|
</view>
|
|
<view class="goods-content-bottom">
|
|
<view class="popup-origin-price"
|
|
style="font-size: 28rpx;line-height: 54rpx;margin-right: 20rpx;">
|
|
￥{{currentItem.attributeListPrice | sliceMsg}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<scroll-view scroll-y style="max-height: 50vh;">
|
|
<view class="goods-spec" v-if="parsedSpecs.length > 0">
|
|
<view class="spec1" v-for="(spec, sIndex) in parsedSpecs" :key="sIndex">
|
|
<view class="spec11">
|
|
选{{spec.name}}（可选{{spec.canbuy}}个）
|
|
</view>
|
|
<view class="spec22">
|
|
<view :class="spec.selected.indexOf(option) !== -1 ? 'spec-check' : 'spec222'"
|
|
v-for="(option, oIndex) in spec.options" :key="oIndex"
|
|
@tap="selectSpec(sIndex, option)">
|
|
{{option}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<template
|
|
v-if="(groupId == null || groupId == '') && isPintuan && currentItem.productGroupBuyPrices && currentItem.productGroupBuyPrices.length > 0">
|
|
<view class="spec11">
|
|
成团选择
|
|
</view>
|
|
<view class="goods-team">
|
|
<view
|
|
:class="selectedGroupRule && selectedGroupRule.groupCount === rule.groupCount ? 'team-check team-rule-card' : 'team1 team-rule-card'"
|
|
v-for="(rule, rIndex) in currentItem.productGroupBuyPrices" :key="rIndex"
|
|
@tap="selectGroupRule(rule)">
|
|
<view class="team11" style="margin-top: 0;">
|
|
￥{{parseFloat(rule.groupPrice).toFixed(2)}}
|
|
</view>
|
|
<view class="team11">
|
|
{{rule.groupCount}}人团
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<view class="spec11" v-if="moreBuyList.length > 0 && isPintuan" style="display: flex;">
|
|
<view style="flex: 1;">
|
|
搭配小食
|
|
</view>
|
|
<view style="padding-top: 10rpx;">
|
|
<view class="goods-num">
|
|
<view class="num-plus" style="background: #999;color: #fff;"
|
|
@tap="changeValue('minus')">
|
|
-
|
|
</view>
|
|
<view class="num">
|
|
{{vModelValue}}
|
|
</view>
|
|
<view class="num-plus" @tap="changeValue('plus')">
|
|
+
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
<view class="goods-team" v-if="moreBuyList.length > 0 && isPintuan" style="min-height: 280rpx;">
|
|
<view :class="spec.isChecked ? 'team-check1' : 'team2'" v-for="(spec, sIndex) in moreBuyList"
|
|
:key="sIndex" @tap="selectMoreBuy(spec,sIndex)">
|
|
<view>
|
|
<img :src="spec.productPicture" alt=""
|
|
style="width: 70px;height: 70px;background-size: 100%;border-radius: 10px;">
|
|
</view>
|
|
<view class="team11" style="margin-top:10rpx;">
|
|
￥{{spec.attributeListPrice | sliceMsg}}
|
|
</view>
|
|
<view class="team11" style="margin-top:10rpx;">
|
|
{{spec.productName}}
|
|
</view>
|
|
<view class="jiaobiao" v-if="spec.quantity>0">
|
|
{{spec.quantity ? spec.quantity : ''}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 优惠券选择 -->
|
|
<view v-if="isFaceToFaceGroup" class="coupon-row"
|
|
style="display: flex;height: 80rpx;line-height: 80rpx;border-top: 1px solid #eee;font-size: 28rpx;font-weight: 700; align-items:center; margin-top: 20rpx;"
|
|
@tap="openCouponPopup">
|
|
<view style="flex: 1; color: #777;">
|
|
优惠券
|
|
</view>
|
|
<view style="color: #ff5722;" v-if="selectedCoupon">
|
|
-￥{{selectedCoupon.discountAmount.toFixed(2)}}
|
|
</view>
|
|
<view style="color: #0b9b73;" v-else-if="availableCoupons.length > 0">
|
|
有 {{availableCoupons.length}} 张可用
|
|
</view>
|
|
<view style="color: #999;" v-else>
|
|
无可用券
|
|
</view>
|
|
<uni-icons type="right" size="14" color="#999" style="margin-left:10rpx;"></uni-icons>
|
|
</view>
|
|
<view style="width: 100%;height: 160rpx;"></view>
|
|
</scroll-view>
|
|
<view class="bottom popup-bottom-bar" style="padding-bottom: 40rpx;height: 160rpx;z-index: 10;">
|
|
<view v-if="isPintuan" class="pintuan1">
|
|
<template v-if="!groupId">
|
|
<view class="pintuan2"
|
|
style="border-bottom-left-radius: 100rpx;border-top-left-radius: 100rpx;"
|
|
@tap.stop="submitPintuan(true)">
|
|
<uni-icons type="help" size="16" style="padding-right: 20rpx;margin-top: 4rpx;" @tap.stop="openMianRemark"></uni-icons>面对面团
|
|
</view>
|
|
<view class="pintuan2"
|
|
style="background: rgba(0, 35, 28, 1);border-bottom-right-radius: 100rpx;border-top-right-radius: 100rpx;color: rgba(166, 255, 234, 1);"
|
|
@tap.stop="submitPintuan(false)">
|
|
发起拼团￥{{selectedGroupRule && selectedGroupRule.groupPrice ? parseFloat(selectedGroupRule.groupPriceAndMore).toFixed(2) : '0.00'}}
|
|
</view>
|
|
</template>
|
|
<template v-else>
|
|
<view class="pintuan2" style="width: 100%; border-radius: 100rpx;"
|
|
@tap.stop="submitPintuan(false)">
|
|
参与拼团￥{{selectedGroupRule && selectedGroupRule.groupPriceAndMore ? parseFloat(selectedGroupRule.groupPriceAndMore).toFixed(2) : '0.00'}}
|
|
</view>
|
|
</template>
|
|
</view>
|
|
<view v-else class="pintuan0" @tap="submitAddToCart">
|
|
加入购物车
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</uni-popup>
|
|
<!-- 拼团和选规格弹窗 -->
|
|
<uni-popup ref="pintuanGroupPopup" background-color="#fff">
|
|
<view class="car-content join-team-popup">
|
|
<view class="car-close" @tap="$refs.pintuanGroupPopup.close()">
|
|
<uni-icons type="close" size="30" color="#fff"></uni-icons>
|
|
</view>
|
|
<view class="join-popup-title" style="font-size: 28rpx;font-weight: 700;">
|
|
<view class="join-popup-main">快来加入拼团吧！</view>
|
|
<view class="join-popup-sub">选一支快成团的队伍，马上省</view>
|
|
</view>
|
|
<scroll-view scroll-y style="max-height: 50vh;">
|
|
<template>
|
|
<!-- 占位假数据展示 -->
|
|
<view class="">
|
|
<view class="goods-center team-wait-card" v-for="(item, index) in orderListWait"
|
|
:key="index">
|
|
<view class="list-right">
|
|
<view class="list-right-img">
|
|
<img src="/static/images/img/songshu.png"
|
|
alt="" />
|
|
<view class="list-weipincheng">+</view>
|
|
</view>
|
|
<view class="list-right-cha">
|
|
<view class="cha11">
|
|
{{item.targetMembers}}人拼
|
|
</view>
|
|
<view style="line-height: 40rpx;padding-left: 10rpx;">
|
|
差<text
|
|
class="missing-count">{{item.targetMembers - item.currentMembers}}人</text>拼成
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="list-btn" @tap.stop="chooseOrderWait(item)">
|
|
去拼单
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<view style="width: 100%;height: 160rpx;"></view>
|
|
</scroll-view>
|
|
</view>
|
|
</uni-popup>
|
|
|
|
<!-- 支付弹出层 -->
|
|
<uni-popup ref="payPopup" background-color="#fff">
|
|
<view class="pay-popup"
|
|
style="height: auto;background: #fff;border-radius: 40rpx 40rpx 0 0;padding-top: 40rpx;">
|
|
<view class="content" style="height: 100%;margin-top:0">
|
|
<view class="box1">
|
|
<view style="display: flex;align-items: center;justify-content: center;height: 70rpx;">
|
|
支付剩余时间 <uni-countdown :show-day="false" :hour="00" :minute="59" :second="59" />
|
|
</view>
|
|
<view
|
|
style="height: 90rpx;line-height: 90rpx;text-align: center;font-weight: 700;font-size: 30rpx;">
|
|
￥<text
|
|
style="font-size: 60rpx;">{{backendTotalAmount ? backendTotalAmount.toFixed(2) : '0.00'}}</text>
|
|
</view>
|
|
<view style="height: 40rpx;text-align: center;color: #777;">
|
|
|
|
<text v-if="groupId != '' && isFaceToFaceGroup && groupdeliveryType == 1">配送费(均摊) {{tuanzhangOrder.deliveryFee}} 元
|
|
</text>
|
|
|
|
<text v-if="groupdeliveryType == 1 && currentItem.lunchBox > 0"> 打包费 {{currentItem.lunchBox}} 元</text>
|
|
</view>
|
|
<view style="height: 40rpx;text-align: center;color: #ff5722;" v-if="selectedCoupon">
|
|
优惠券抵扣 -￥{{selectedCoupon.discountAmount.toFixed(2)}}
|
|
</view>
|
|
<view style="height: 40rpx;text-align: center;color: red;">
|
|
若拼团失败，将会为您自动退款
|
|
</view>
|
|
</view>
|
|
<view class="box1" style="display: flex;padding: 40rpx;" v-if="groupdeliveryType == 2">
|
|
<view style="flex: 1;">
|
|
<view style="height: 42rpx;line-height: 42rpx;display: flex;">
|
|
<!-- <img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/4c8e0cc311db4d38ab43e019673c4b8c.png"
|
|
alt="" style="width: 42rpx;height: 42rpx;margin-right: 20rpx;" /> -->
|
|
<text style="font-size: 30rpx;font-weight: 700;">立即出餐</text>
|
|
</view>
|
|
<view style="color: #777;width: 500rpx;">
|
|
拼团单，拼团成功后立即出餐
|
|
</view>
|
|
</view>
|
|
<view style="width: 36rpx;padding-top: 20rpx;">
|
|
<view :class="nowMake ? 'radio-check' : 'radio-no-check'">
|
|
<uni-icons type="checkmarkempty" @tap="nowMakeMethod" size="12"></uni-icons>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="box1" style="display: flex;padding: 40rpx;">
|
|
<view style="flex: 1;">
|
|
<view style="height: 42rpx;line-height: 42rpx;display: flex;">
|
|
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/4c8e0cc311db4d38ab43e019673c4b8c.png"
|
|
alt="" style="width: 42rpx;height: 42rpx;margin-right: 20rpx;" />
|
|
<text style="font-size: 30rpx;font-weight: 700;">微信支付</text>
|
|
</view>
|
|
<view style="text-align: right;margin-left: 60rpx;color: #777;width: 146rpx;">
|
|
使用微信支付
|
|
</view>
|
|
</view>
|
|
<view style="width: 36rpx;padding-top: 20rpx;">
|
|
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/02bff7edc4e04caaa1868955ff684f1f.png"
|
|
alt="" style="width: 36rpx;height: 36rpx;" />
|
|
</view>
|
|
</view>
|
|
<view class="btn"
|
|
style="background: linear-gradient(90deg, rgba(227, 255, 150, 1), rgba(166, 255, 234, 1));width: 90%;height: 100rpx;border-radius: 100rpx;text-align: center;font-size: 28rpx;font-weight: 700;line-height: 100rpx;margin: 40rpx auto;"
|
|
@tap="wxPayment">
|
|
确认付款{{nowMake && groupdeliveryType == 2 ? '-即刻出餐' : ''}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</uni-popup>
|
|
<!-- 参团成功提示弹出层 -->
|
|
<uni-popup ref="tishiPopup" background-color="#fff">
|
|
<view class="tishi-popup">
|
|
<view class="tishi-copy" v-if="!isPindan">
|
|
<view class="tishi-copy-title">面对面团不会公开显示</view>
|
|
<view class="tishi-copy-desc">
|
|
选择<text class="tishi-copy-highlight">配送</text>时，订单会统一送达
|
|
</view>
|
|
</view>
|
|
<view class="tishi-copy" v-if="isPindan">
|
|
<view class="tishi-copy-title">拼单提醒</view>
|
|
<view class="tishi-copy-desc">
|
|
您已开启拼单模式，赶快选择心动的商品吧！
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</uni-popup>
|
|
<!-- 参团成功提示弹出层 -->
|
|
<uni-popup ref="joinSuccessPopup" background-color="#fff" @change="onJoinSuccessPopupChange">
|
|
<view class="pintuan-popup"
|
|
style="position: relative;height: 1200rpx;width: 100%;border-top-left-radius: 20rpx;border-top-right-radius: 20rpx;padding: 20rpx;">
|
|
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/ecd00dab1c9c44198d765bc08bc1bd71.png" alt=""
|
|
style="position: absolute;top: 0;right: 0;width: 240rpx;height: 180rpx;"
|
|
@tap="$refs.joinSuccessPopup.close()">
|
|
<view style="position: absolute;bottom: 0;width: 100%;height: 760rpx;">
|
|
<view class="kaituan1">
|
|
<view class="kaituan1-title"
|
|
style="margin-top: 100rpx;text-align: center;font-size: 40rpx;font-weight: bold;">
|
|
参团成功！
|
|
</view>
|
|
<view class="kaituan1-title1" style="text-align: center;margin-top: 20rpx;color: #777;">
|
|
您已成功参与拼团
|
|
</view>
|
|
</view>
|
|
<view class="kaituan2" style="display: flex;justify-content: center;margin-top: 60rpx;">
|
|
<view class="kaituan22">
|
|
<img src="/static/images/img/songshu.png"
|
|
alt=""
|
|
style="width: 90rpx;height: 90rpx;border-radius: 90rpx;margin: 0 auto;display: block;" />
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</uni-popup>
|
|
|
|
<!-- 优惠券选择弹出层 -->
|
|
<uni-popup ref="couponPopup" type="bottom" background-color="#F5F8F5">
|
|
<view style="width: 100%; height: 800rpx; display: flex; flex-direction: column;">
|
|
<view
|
|
style="height: 100rpx; line-height: 100rpx; text-align: center; font-size: 32rpx; font-weight: bold; border-bottom: 1px solid #eee; position: relative; background: #fff;">
|
|
选择优惠券
|
|
<uni-icons type="closeempty" size="24" @tap="$refs.couponPopup.close()"
|
|
style="position: absolute; right: 30rpx; top: 0;"></uni-icons>
|
|
</view>
|
|
<scroll-view scroll-y style="flex: 1; padding: 20rpx; box-sizing: border-box;">
|
|
<view v-for="(item, index) in availableCoupons" :key="index" @tap="selectCoupon(item)"
|
|
style="background: #fff; border-radius: 12rpx; padding: 30rpx 20rpx; margin-bottom: 20rpx; display: flex; align-items: center; justify-content: space-between;">
|
|
<view style="display: flex; align-items: center; flex: 1;">
|
|
<view style="color: #ff5722; font-size: 40rpx; font-weight: bold; width: 140rpx;">
|
|
<text style="font-size: 24rpx;">￥</text>{{item.discountAmount}}
|
|
</view>
|
|
<view
|
|
style="flex: 1; display: flex; flex-direction: column; justify-content: center; margin-left: 20rpx;">
|
|
<view style="font-size: 28rpx; font-weight: bold; color: #333; margin-bottom: 6rpx;">
|
|
{{item.couponName}}</view>
|
|
<view style="font-size: 22rpx; color: #999;" v-if="item.minAmount > 0">
|
|
满{{item.minAmount}}可用</view>
|
|
<view style="font-size: 22rpx; color: #999;" v-else>无门槛使用</view>
|
|
</view>
|
|
</view>
|
|
<uni-icons v-if="selectedCoupon && selectedCoupon.id === item.id" type="checkmarkempty"
|
|
size="20" color="#0b9b73"></uni-icons>
|
|
<view v-else style="width: 40rpx; height: 40rpx; border-radius: 50%; border: 1px solid #ddd;">
|
|
</view>
|
|
</view>
|
|
<view v-if="availableCoupons.length===0"
|
|
style="text-align:center; padding-top: 100rpx; color: #999;">
|
|
暂无可用优惠券
|
|
</view>
|
|
<view style="height:40rpx;"></view>
|
|
</scroll-view>
|
|
<view style="padding: 20rpx 40rpx; background: #fff;" v-if="availableCoupons.length>0">
|
|
<view @tap="selectCoupon(null)"
|
|
style="width: 100%; height: 80rpx; background: linear-gradient(90deg, #e3ff96, #a6ffea); font-size: 30rpx; font-weight: 700; line-height: 80rpx; text-align: center; border-radius: 100rpx;">
|
|
不使用优惠券
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</uni-popup>
|
|
<common-loading />
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
loadStatus: 'more',
|
|
type: '',
|
|
isPindan:true,
|
|
shopId: '',
|
|
shopItem: {
|
|
shopIcon: '',
|
|
shopName: '',
|
|
shopScore: '',
|
|
shopTypeTitle: '',
|
|
saleCount: '',
|
|
remark: '',
|
|
},
|
|
productId: '',
|
|
nowMake:true,
|
|
productItem: [],
|
|
tuanzhangOrder: {},
|
|
cartItems: [],
|
|
moreBuyData: [],
|
|
vModelValue: 0,
|
|
currentItem: {},
|
|
checkMoreBuyIndex: '',
|
|
parsedSpecs: [],
|
|
moreBuyList: [],
|
|
selectedGroupRule: {},
|
|
pageNum: 1,
|
|
total: 1,
|
|
chooseWaitType: false,
|
|
// 导航栏高度（用于sticky top偏移）
|
|
navBarHeight: 0,
|
|
orderListWait: [],
|
|
// 分类栏距离页面顶部的距离（用于上滑检测）
|
|
menuListOffsetTop: 0,
|
|
lastScrollTop: 0,
|
|
// 防止切换分类之后onPageScroll闪回的标志
|
|
isSwitching: false,
|
|
containerOriginalTop: 0,
|
|
scrollIntoViewId: '',
|
|
goodsListScrollTop: 0,
|
|
isAutoScrolling: false,
|
|
isContainerSticky: false,
|
|
containerHeight: 0,
|
|
pageScrollTop: 0,
|
|
searchForm: {
|
|
shopId: '',
|
|
delFlag: 1,
|
|
pageNum: 1,
|
|
pageSize: '100',
|
|
categoryId: ''
|
|
},
|
|
menuButtonInfo: {},
|
|
groupdeliveryType: '',
|
|
isPintuan: true,
|
|
groupId: null,
|
|
isFaceToFaceGroup: false,
|
|
targetMembers: 2,
|
|
backendTotalAmount: 0,
|
|
currentOrderId: '',
|
|
onlineWorkerInterval: 2500,
|
|
onlineWorkerDuration: 500,
|
|
menuList: [{
|
|
categoryName: '推荐',
|
|
id: 'tuijian',
|
|
checked: true
|
|
}],
|
|
shopRecommend: [],
|
|
availableCoupons: [],
|
|
selectedCoupon: null
|
|
}
|
|
},
|
|
components: {
|
|
|
|
},
|
|
computed: {
|
|
cartTotalCount() {
|
|
return this.cartItems.reduce((acc, curr) => acc + curr.quantity, 0);
|
|
},
|
|
cartTotalPrice() {
|
|
return this.cartItems.reduce((acc, curr) => acc + (curr.quantity * curr.price), 0).toFixed(2);
|
|
},
|
|
containerStyle() {
|
|
if (this.isContainerSticky) {
|
|
// 吸顶时：fixed定位，精确计算高度 = 屏幕高度 - 导航栏高度 - 底部栏高度
|
|
const sysInfo = uni.getSystemInfoSync();
|
|
const bottomBarPx = Math.round(80 * sysInfo.windowWidth / 375);
|
|
const h = sysInfo.windowHeight - this.navBarHeight - bottomBarPx;
|
|
return 'display:flex;position:fixed;left:0;top:' + this.navBarHeight +
|
|
'px;margin:0 auto;right:0;height:' + h + 'px;z-index:50;background:#F5F8F5;box-sizing:border-box;';
|
|
} else {
|
|
return 'display:flex;height:72%;margin-top:20rpx;';
|
|
}
|
|
}
|
|
},
|
|
filters: {
|
|
sliceMsg(val) {
|
|
var name = ''
|
|
if (typeof(val) == 'string') {
|
|
let newObj = JSON.parse(val)
|
|
for (let as in newObj) {
|
|
name = newObj[as].specPrice
|
|
}
|
|
}
|
|
return name;
|
|
},
|
|
slicePrice(val) {
|
|
let begin = ''
|
|
if (val != null) {
|
|
begin = val[0].groupPrice
|
|
for (let i = 0; i < val.length; i++) {
|
|
if (val[i].groupPrice < begin) {
|
|
begin = val[i].groupPrice
|
|
}
|
|
}
|
|
}
|
|
return begin;
|
|
}
|
|
},
|
|
onLoad(option) {
|
|
this.type = option.type;
|
|
if (option.groupId) {
|
|
this.groupId = option.groupId;
|
|
}
|
|
if (option.isFaceToFace) {
|
|
this.isFaceToFaceGroup = option.isFaceToFace === '1' || option.isFaceToFace === 'true';
|
|
if (this.isFaceToFaceGroup) {
|
|
this.tui.request("/mall/order/selectMallOrderByGroupId/" + this.groupId, "GET", {}, false, true).then((
|
|
res) => {
|
|
if (res.code == 200) {
|
|
this.tuanzhangOrder = res.result;
|
|
} else {
|
|
that.tui.toast(res.message, 1000)
|
|
return
|
|
}
|
|
uni.hideLoading()
|
|
}).catch((res) => {})
|
|
}
|
|
}
|
|
if (option.targetMembers) {
|
|
this.targetMembers = parseInt(option.targetMembers);
|
|
} else {
|
|
this.targetMembers = 2; // Default fallback
|
|
}
|
|
if (this.type == 'shop') {
|
|
try {
|
|
this.shopItem = JSON.parse(decodeURIComponent(option.item));
|
|
} catch (e) {
|
|
this.shopItem = JSON.parse(option.item);
|
|
}
|
|
if (this.shopItem.products) {
|
|
this.shopRecommend = this.shopItem.products
|
|
for (let i = 0; i < this.shopRecommend.length; i++) {
|
|
this.shopRecommend[i].categoryId = '1'
|
|
this.shopRecommend[i].isChecked = false
|
|
}
|
|
}
|
|
} else {
|
|
try {
|
|
this.productItem = JSON.parse(decodeURIComponent(option.item));
|
|
} catch (e) {
|
|
this.productItem = JSON.parse(option.item);
|
|
}
|
|
}
|
|
this.getCategory(this.shopItem.id);
|
|
this.getProduct('');
|
|
},
|
|
onShow() {
|
|
this.menuButtonInfo = uni.getMenuButtonBoundingClientRect();
|
|
this.fetchCoupons();
|
|
// 计算导航栏高度用于sticky offset：statusBarHeight + 40px内容区
|
|
const info = uni.getSystemInfoSync();
|
|
this.navBarHeight = info.statusBarHeight + 40;
|
|
},
|
|
onReady() {
|
|
// 记录container相对页面的初始偏移量
|
|
setTimeout(() => {
|
|
const query = uni.createSelectorQuery().in(this);
|
|
query.select('.container').boundingClientRect(rect => {
|
|
if (rect) {
|
|
this.containerOriginalTop = rect.top;
|
|
this.menuListOffsetTop = rect.top;
|
|
this.containerHeight = rect.height;
|
|
}
|
|
}).exec();
|
|
}, 500);
|
|
},
|
|
onPageScroll(e) {
|
|
this.lastScrollTop = e.scrollTop;
|
|
// 当页面滚动到container应该触顶的位置时，启用吸顶
|
|
const stickyThreshold = this.containerOriginalTop - this.navBarHeight;
|
|
if (stickyThreshold <= 0) return;
|
|
if (e.scrollTop >= stickyThreshold) {
|
|
if (!this.isContainerSticky) {
|
|
this.isContainerSticky = true;
|
|
}
|
|
// 限制页面滚动不超过吸顶阈值，防止吸顶后页面继续滚动
|
|
if (e.scrollTop > stickyThreshold + 5) {
|
|
uni.pageScrollTo({
|
|
scrollTop: stickyThreshold,
|
|
duration: 0
|
|
});
|
|
}
|
|
} else {
|
|
if (this.isContainerSticky) {
|
|
this.isContainerSticky = false;
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
nowMakeMethod(){
|
|
this.nowMake = !this.nowMake
|
|
},
|
|
// 页面touchmove事件：吸顶后阻止页面整体滑动（让goods-list接管滚动）
|
|
onPageTouchMove(e) {
|
|
|
|
},
|
|
// goods-list滚动事件：检测分类切换 + 滚回顶部取消吸顶
|
|
onGoodsListScroll(e) {
|
|
if (this.isAutoScrolling) return;
|
|
const scrollTop = e.detail.scrollTop;
|
|
|
|
// 根据滚动位置自动选中对应分类
|
|
this.detectCurrentCategory();
|
|
},
|
|
onGoodsListScrollToTop() {
|
|
if (this.isAutoScrolling) return;
|
|
|
|
},
|
|
// 检测当前可见的分类
|
|
detectCurrentCategory() {
|
|
if (this.isSwitching) return;
|
|
const query = uni.createSelectorQuery().in(this);
|
|
// 获取goods-list中所有goods-member的位置
|
|
query.selectAll('.goods-member').boundingClientRect();
|
|
query.select('.goods-list').boundingClientRect();
|
|
query.exec((res) => {
|
|
if (!res || !res[0] || !res[1]) return;
|
|
const items = res[0];
|
|
const listRect = res[1];
|
|
const listTop = listRect.top;
|
|
let currentCategoryId = '';
|
|
// 找到第一个顶部在goods-list可视区域内或刚过顶部的item
|
|
for (let i = items.length - 1; i >= 0; i--) {
|
|
if (items[i].top <= listTop + 10) {
|
|
// 从productItem中获取categoryId
|
|
if (this.productItem[i]) {
|
|
currentCategoryId = this.productItem[i].categoryId;
|
|
}
|
|
break;
|
|
}
|
|
}
|
|
if (currentCategoryId !== '' || currentCategoryId === '') {
|
|
// 在menuList中找到匹配的菜单并选中
|
|
let found = false;
|
|
for (let i = 0; i < this.menuList.length; i++) {
|
|
if (String(this.menuList[i].id) === String(currentCategoryId)) {
|
|
if (!this.menuList[i].checked) {
|
|
for (let j = 0; j < this.menuList.length; j++) {
|
|
this.menuList[j].checked = (j === i);
|
|
}
|
|
this.$forceUpdate();
|
|
}
|
|
found = true;
|
|
break;
|
|
}
|
|
}
|
|
// 如果没找到匹配的分类（如categoryId为空），选中"猜你喜欢"
|
|
if (!found && currentCategoryId === '') {
|
|
for (let j = 0; j < this.menuList.length; j++) {
|
|
this.menuList[j].checked = (j === 0);
|
|
}
|
|
this.$forceUpdate();
|
|
}
|
|
}
|
|
});
|
|
},
|
|
getProduct(categoryId) {
|
|
let that = this;
|
|
this.loadStatus = 'loading';
|
|
this.searchForm.shopId = this.shopItem.id;
|
|
this.searchForm.categoryId = categoryId;
|
|
that.tui.request("/app/product/getShareList", "POST", this.searchForm, false, false).then((res) => {
|
|
that.loadStatus = 'nomore';
|
|
if (res.code == 200) {
|
|
if (that.searchForm.pageNum == 1) {
|
|
that.productItem = res.result.records;
|
|
} else {
|
|
that.productItem = [...that.productItem, ...res.result.records];
|
|
}
|
|
let hasTuijian = false
|
|
let tuijianList = []
|
|
let putongList = []
|
|
for (let i = 0; i < that.productItem.length; i++) {
|
|
if (this.productItem[i].sellBeginTime != '' && this.productItem[i].sellEndTime != '') {
|
|
let isEndTime = this.isWithinBusinessHours(this.productItem[i].sellBeginTime, this
|
|
.productItem[i].sellEndTime)
|
|
|
|
this.productItem[i].status = isEndTime ? 0 : 1
|
|
}
|
|
if (that.productItem[i].isMoreBuy == 1) {
|
|
//搭配的小料商品
|
|
that.productItem[i].isChecked = false
|
|
that.moreBuyList.push(that.productItem[i])
|
|
}
|
|
if (that.productItem[i].isPush == 1) {
|
|
that.productItem[i].categoryId = 'tuijian'
|
|
hasTuijian = true
|
|
tuijianList.push(that.productItem[i])
|
|
} else {
|
|
putongList.push(that.productItem[i])
|
|
}
|
|
}
|
|
if (hasTuijian == false) {
|
|
that.menuList.splice(0, 1)
|
|
} else {
|
|
that.productItem = [...tuijianList, ...putongList];
|
|
}
|
|
//获取当前店铺待成团列表
|
|
that.getOrderWait();
|
|
|
|
that.total = res.result.pages; // pages = 总页数
|
|
that.pageNum = that.searchForm.pageNum;
|
|
that.$forceUpdate();
|
|
} else {
|
|
that.tui.toast(res.message, 1000);
|
|
return;
|
|
}
|
|
uni.hideLoading();
|
|
}).catch((res) => {});
|
|
},
|
|
getCategory(id) {
|
|
let that = this
|
|
that.tui.request("/app/productCategory/list", "GET", {
|
|
shopId: id
|
|
}, false, true).then((res) => {
|
|
if (res.code == 200) {
|
|
if (res.result.length > 0) {
|
|
for (let i = 0; i < res.result.length; i++) {
|
|
res.result[i].checked = false
|
|
that.menuList.push(res.result[i])
|
|
}
|
|
}
|
|
that.$forceUpdate()
|
|
} else {
|
|
that.tui.toast(res.message, 1000)
|
|
return
|
|
}
|
|
uni.hideLoading()
|
|
}).catch((res) => {})
|
|
},
|
|
checkTab(index) {
|
|
this.isSwitching = true;
|
|
for (let i = 0; i < this.menuList.length; i++) {
|
|
this.menuList[i].checked = (i === index);
|
|
}
|
|
|
|
const selectedCategory = this.menuList[index];
|
|
// 如果是"推荐"（id为tuijian或空），滚动到顶部
|
|
if (!selectedCategory.id && selectedCategory.id !== 0) {
|
|
this.goodsListScrollTop = 0;
|
|
this.$nextTick(() => {
|
|
this.goodsListScrollTop = 0;
|
|
});
|
|
setTimeout(() => {
|
|
this.isSwitching = false;
|
|
}, 300);
|
|
this.$forceUpdate();
|
|
return;
|
|
}
|
|
|
|
// 滚动到对应分类的首个商品
|
|
const doScrollToCategory = () => {
|
|
const targetId = 'category-' + selectedCategory.id;
|
|
this.scrollIntoViewId = '';
|
|
this.$nextTick(() => {
|
|
this.isAutoScrolling = true;
|
|
this.scrollIntoViewId = targetId;
|
|
setTimeout(() => {
|
|
this.isAutoScrolling = false;
|
|
this.isSwitching = false;
|
|
}, 500);
|
|
});
|
|
};
|
|
|
|
// 如果还没吸顶，先滚动页面到吸顶位置，再滚动商品列表
|
|
if (!this.isContainerSticky) {
|
|
const stickyThreshold = this.containerOriginalTop - this.navBarHeight;
|
|
uni.pageScrollTo({
|
|
scrollTop: stickyThreshold,
|
|
duration: 200,
|
|
complete: () => {
|
|
setTimeout(() => {
|
|
doScrollToCategory();
|
|
}, 250);
|
|
}
|
|
});
|
|
} else {
|
|
doScrollToCategory();
|
|
}
|
|
this.$forceUpdate();
|
|
},
|
|
openOrderWait(item) {
|
|
this.chooseWaitType = false
|
|
if (item != '') {
|
|
this.chooseWaitType = true
|
|
this.orderListWait = item.orderListWait
|
|
|
|
this.currentItem = item;
|
|
// Parse specifications
|
|
this.parsedSpecs = [];
|
|
if (item.attributeList && item.attributeList !== '{}') {
|
|
try {
|
|
let attrs = typeof item.attributeList === 'string' ? JSON.parse(item.attributeList) : item
|
|
.attributeList;
|
|
for (let key in attrs) {
|
|
if (attrs[key] && attrs[key].title && attrs[key].title.length > 0) {
|
|
let canbuy = attrs[key].canbuy || 1; // 历史数据没有canbuy字段默认为1
|
|
this.parsedSpecs.push({
|
|
name: key,
|
|
options: attrs[key].title,
|
|
canbuy: canbuy,
|
|
selected: [attrs[key].title[0]] // 默认选中第一个
|
|
});
|
|
}
|
|
}
|
|
} catch (e) {}
|
|
}
|
|
this.isPintuan = true;
|
|
|
|
if (this.groupId) {
|
|
// Determine best price match given targetMembers
|
|
let prices = item.productGroupBuyPrices || [];
|
|
let validPrices = prices.filter(p => p.groupCount <= this.targetMembers);
|
|
if (validPrices.length > 0) {
|
|
this.selectedGroupRule = validPrices.reduce((max, obj) => (obj.groupCount > max.groupCount ?
|
|
obj : max));
|
|
this.selectedGroupRule.groupPriceAndMore = this.selectedGroupRule.groupPrice
|
|
if (this.selectedCoupon) {
|
|
this.selectedGroupRule.groupPriceAndMore -= parseFloat(this.selectedCoupon.discountAmount);
|
|
if (this.selectedGroupRule.groupPriceAndMore <= 0) {
|
|
this.selectedGroupRule.groupPriceAndMore = 0.01
|
|
}
|
|
}
|
|
} else if (prices.length > 0) {
|
|
this.selectedGroupRule = prices.reduce((prev, curr) => (prev.groupCount < curr.groupCount ?
|
|
prev : curr));
|
|
this.selectedGroupRule.groupPriceAndMore = this.selectedGroupRule.groupPrice
|
|
if (this.selectedCoupon) {
|
|
this.selectedGroupRule.groupPriceAndMore -= parseFloat(this.selectedCoupon.discountAmount);
|
|
if (this.selectedGroupRule.groupPriceAndMore <= 0) {
|
|
this.selectedGroupRule.groupPriceAndMore = 0.01
|
|
}
|
|
}
|
|
} else {
|
|
this.selectedGroupRule = {};
|
|
}
|
|
} else {
|
|
// Normal init
|
|
if (item.productGroupBuyPrices && item.productGroupBuyPrices.length > 0) {
|
|
this.selectedGroupRule = item.productGroupBuyPrices[0];
|
|
this.selectedGroupRule.groupPriceAndMore = this.selectedGroupRule.groupPrice
|
|
if (this.selectedCoupon) {
|
|
this.selectedGroupRule.groupPriceAndMore -= parseFloat(this.selectedCoupon.discountAmount);
|
|
if (this.selectedGroupRule.groupPriceAndMore <= 0) {
|
|
this.selectedGroupRule.groupPriceAndMore = 0.01
|
|
}
|
|
}
|
|
} else {
|
|
this.selectedGroupRule = {};
|
|
}
|
|
}
|
|
|
|
let moreBuyPrice = 0
|
|
for (let i = 0; i < this.moreBuyList.length; i++) {
|
|
if (this.moreBuyList[i].quantity > 0) {
|
|
moreBuyPrice += Number((Number(this.moreBuyList[i].quantity) * Number(this.sliceMsg2(this
|
|
.moreBuyList[i].attributeListPrice))).toFixed(2))
|
|
}
|
|
}
|
|
this.selectedGroupRule.groupPriceAndMore = Number(this.selectedGroupRule.groupPrice) + moreBuyPrice
|
|
if (this.selectedCoupon) {
|
|
this.selectedGroupRule.groupPriceAndMore -= parseFloat(this.selectedCoupon.discountAmount);
|
|
if (this.selectedGroupRule.groupPriceAndMore <= 0) {
|
|
this.selectedGroupRule.groupPriceAndMore = 0.01
|
|
}
|
|
}
|
|
}
|
|
this.$refs.pintuanGroupPopup.open('bottom')
|
|
},
|
|
getOrderWait() {
|
|
let that = this
|
|
|
|
this.tui.request("/mall/order/getMallOrderGroupByShopId", "POST", {
|
|
shopId: this.shopItem.id,
|
|
status: 0,
|
|
isFace: 0,
|
|
}, false, false).then((res) => {
|
|
that.loadStatus = 'nomore';
|
|
if (res.code == 200) {
|
|
that.orderListWait = res.result;
|
|
for (let i = 0; i < that.productItem.length; i++) {
|
|
that.productItem[i].orderListWait = []
|
|
if (that.orderListWait != null) {
|
|
that.productItem[i].minGroupCount = that.orderListWait[0].targetMembers - that
|
|
.orderListWait[0].currentMembers
|
|
for (let y = 0; y < that.orderListWait.length; y++) {
|
|
if (that.productItem[i].id == that.orderListWait[y].productId) {
|
|
if (that.productItem[i].minGroupCount > (that.orderListWait[y]
|
|
.targetMembers - that.orderListWait[y].currentMembers)) {
|
|
that.productItem[i].minGroupCount = that.orderListWait[y]
|
|
.targetMembers - that.orderListWait[y].currentMembers
|
|
}
|
|
that.productItem[i].orderListWait.push(that.orderListWait[y])
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
that.$forceUpdate();
|
|
} else {
|
|
that.tui.toast(res.message, 1000);
|
|
return;
|
|
}
|
|
uni.hideLoading();
|
|
}).catch((res) => {});
|
|
},
|
|
chooseOrderWait(item) {
|
|
this.$refs.pintuanGroupPopup.close();
|
|
this.isPindan = true;
|
|
this.$refs.tishiPopup.open();
|
|
this.groupId = item.id;
|
|
this.targetMembers = parseInt(item.targetMembers);
|
|
this.selectedCoupon = null;
|
|
if (this.chooseWaitType) {
|
|
this.fetchCoupons();
|
|
this.$refs.pintuanPopup.open('bottom');
|
|
}
|
|
},
|
|
openPopup(type, index, item) {
|
|
if (type == 'car') {
|
|
this.$refs.carPopup.open('bottom')
|
|
} else if (type == 'xiadan') {
|
|
this.currentItem = item;
|
|
// Parse specifications
|
|
this.parsedSpecs = [];
|
|
if (item.attributeList && item.attributeList !== '{}') {
|
|
try {
|
|
let attrs = typeof item.attributeList === 'string' ? JSON.parse(item.attributeList) : item
|
|
.attributeList;
|
|
for (let key in attrs) {
|
|
if (attrs[key] && attrs[key].title && attrs[key].title.length > 0) {
|
|
let canbuy = attrs[key].canbuy || 1; // 历史数据没有canbuy字段默认为1
|
|
this.parsedSpecs.push({
|
|
name: key,
|
|
options: attrs[key].title,
|
|
canbuy: canbuy,
|
|
selected: [attrs[key].title[0]] // 默认选中第一个
|
|
});
|
|
}
|
|
}
|
|
} catch (e) {}
|
|
}
|
|
|
|
if (index == 'pintuan') {
|
|
this.isPintuan = true;
|
|
this.selectedCoupon = null;
|
|
|
|
if (this.groupId) {
|
|
// Determine best price match given targetMembers
|
|
let prices = item.productGroupBuyPrices || [];
|
|
let validPrices = prices.filter(p => p.groupCount <= this.targetMembers);
|
|
if (validPrices.length > 0) {
|
|
this.selectedGroupRule = validPrices.reduce((max, obj) => (obj.groupCount > max
|
|
.groupCount ? obj : max));
|
|
this.selectedGroupRule.groupPriceAndMore = this.selectedGroupRule.groupPrice
|
|
if (this.selectedCoupon) {
|
|
this.selectedGroupRule.groupPriceAndMore -= parseFloat(this.selectedCoupon
|
|
.discountAmount);
|
|
if (this.selectedGroupRule.groupPriceAndMore <= 0) {
|
|
this.selectedGroupRule.groupPriceAndMore = 0.01
|
|
}
|
|
}
|
|
} else if (prices.length > 0) {
|
|
this.selectedGroupRule = prices.reduce((prev, curr) => (prev.groupCount < curr.groupCount ?
|
|
prev : curr));
|
|
this.selectedGroupRule.groupPriceAndMore = this.selectedGroupRule.groupPrice
|
|
if (this.selectedCoupon) {
|
|
this.selectedGroupRule.groupPriceAndMore -= parseFloat(this.selectedCoupon
|
|
.discountAmount);
|
|
if (this.selectedGroupRule.groupPriceAndMore <= 0) {
|
|
this.selectedGroupRule.groupPriceAndMore = 0.01
|
|
}
|
|
}
|
|
} else {
|
|
this.selectedGroupRule = {};
|
|
}
|
|
|
|
if (this.isFaceToFaceGroup) {
|
|
if (this.parsedSpecs.length === 0) {
|
|
// No specs needed, jump straight to direct pay
|
|
this.submitFTFJoinPay({});
|
|
return;
|
|
}
|
|
}
|
|
} else {
|
|
// Normal init
|
|
if (item.productGroupBuyPrices && item.productGroupBuyPrices.length > 0) {
|
|
this.selectedGroupRule = item.productGroupBuyPrices[0];
|
|
this.selectedGroupRule.groupPriceAndMore = this.selectedGroupRule.groupPrice
|
|
if (this.selectedCoupon) {
|
|
this.selectedGroupRule.groupPriceAndMore -= parseFloat(this.selectedCoupon
|
|
.discountAmount);
|
|
if (this.selectedGroupRule.groupPriceAndMore <= 0) {
|
|
this.selectedGroupRule.groupPriceAndMore = 0.01
|
|
}
|
|
}
|
|
} else {
|
|
this.selectedGroupRule = {};
|
|
}
|
|
}
|
|
|
|
let moreBuyPrice = 0
|
|
for (let i = 0; i < this.moreBuyList.length; i++) {
|
|
if (this.moreBuyList[i].quantity > 0) {
|
|
moreBuyPrice += Number((Number(this.moreBuyList[i].quantity) * Number(this.sliceMsg2(this
|
|
.moreBuyList[i].attributeListPrice))).toFixed(2))
|
|
}
|
|
}
|
|
this.selectedGroupRule.groupPriceAndMore = Number(this.selectedGroupRule.groupPrice) + moreBuyPrice
|
|
|
|
this.fetchCoupons();
|
|
this.$refs.pintuanPopup.open('bottom');
|
|
} else {
|
|
this.isPintuan = false;
|
|
// If solo buy and NO specs, add immediately to cart
|
|
if (this.parsedSpecs.length === 0) {
|
|
this.addToCart(item, null);
|
|
uni.showToast({
|
|
title: '已加入购物车',
|
|
icon: 'none'
|
|
});
|
|
} else {
|
|
// Open popup to select specs
|
|
this.$refs.pintuanPopup.open('bottom');
|
|
}
|
|
}
|
|
}
|
|
},
|
|
selectSpec(sIndex, option) {
|
|
let spec = this.parsedSpecs[sIndex];
|
|
let idx = spec.selected.indexOf(option);
|
|
if (idx !== -1) {
|
|
// 已选中，取消选中（但至少保留一个选中）
|
|
if (spec.selected.length > 1) {
|
|
spec.selected.splice(idx, 1);
|
|
}
|
|
} else {
|
|
// 未选中
|
|
if (spec.selected.length < spec.canbuy) {
|
|
// 还没达到上限，直接添加
|
|
spec.selected.push(option);
|
|
} else if (spec.canbuy === 1) {
|
|
// 只能选1个，替换
|
|
spec.selected = [option];
|
|
} else {
|
|
// 已达到上限，提示
|
|
uni.showToast({
|
|
title: spec.name + '最多选' + spec.canbuy + '个',
|
|
icon: 'none'
|
|
});
|
|
}
|
|
}
|
|
this.$forceUpdate();
|
|
},
|
|
selectGroupRule(rule) {
|
|
this.selectedGroupRule = rule;
|
|
this.selectedGroupRule.groupPriceAndMore = this.selectedGroupRule.groupPrice
|
|
if (this.selectedCoupon) {
|
|
this.selectedGroupRule.groupPriceAndMore -= parseFloat(this.selectedCoupon.discountAmount);
|
|
if (this.selectedGroupRule.groupPriceAndMore <= 0) {
|
|
this.selectedGroupRule.groupPriceAndMore = 0.01
|
|
}
|
|
}
|
|
},
|
|
submitAddToCart() {
|
|
let specChoices = {};
|
|
for (let spec of this.parsedSpecs) {
|
|
specChoices[spec.name] = spec.canbuy === 1 ? spec.selected[0] : spec.selected;
|
|
}
|
|
this.addToCart(this.currentItem, specChoices);
|
|
uni.showToast({
|
|
title: '已加入购物车',
|
|
icon: 'none'
|
|
});
|
|
this.$refs.pintuanPopup.close();
|
|
},
|
|
submitPintuan(isFaceToFace) {
|
|
let specChoices = {};
|
|
for (let spec of this.parsedSpecs) {
|
|
specChoices[spec.name] = spec.canbuy === 1 ? spec.selected[0] : spec.selected;
|
|
}
|
|
let packageFee = parseFloat(this.currentItem.lunchBox || 0);
|
|
|
|
this.currentItem.moreBuyData = []
|
|
for (let i = 0; i < this.moreBuyData.length; i++) {
|
|
if (this.moreBuyData[i].quantity != undefined && this.moreBuyData[i].quantity > 0) {
|
|
this.currentItem.moreBuyData.push(this.moreBuyData[i])
|
|
}
|
|
}
|
|
if (this.groupId && this.isFaceToFaceGroup) {
|
|
// Direct face-to-face pay path
|
|
this.submitFTFJoinPay(specChoices);
|
|
return
|
|
}
|
|
|
|
// Pack data for checkout
|
|
|
|
let goData = {
|
|
item: this.currentItem,
|
|
groupRule: this.selectedGroupRule,
|
|
specs: specChoices,
|
|
orderType: 2, // 2 indicates Group Buy
|
|
groupId: this.groupId,
|
|
isFaceToFace: this.groupId ? this.isFaceToFaceGroup : (isFaceToFace || false)
|
|
};
|
|
uni.navigateTo({
|
|
url: '/package1/buyFood/buyFood?item=' + encodeURIComponent(JSON.stringify(goData)) +
|
|
'&shopItem=' + encodeURIComponent(JSON.stringify(this.shopItem)) + '&packageFee=' +
|
|
packageFee
|
|
});
|
|
this.$refs.pintuanPopup.close();
|
|
},
|
|
submitFTFJoinPay(specChoices) {
|
|
let items = [{
|
|
productId: this.currentItem.id,
|
|
specs: JSON.stringify(specChoices || {}),
|
|
price: parseFloat(this.selectedGroupRule && this.selectedGroupRule.groupPrice ? this
|
|
.selectedGroupRule.groupPrice : 0),
|
|
quantity: 1
|
|
}];
|
|
if (this.currentItem.moreBuyData) {
|
|
for (let a = 0; a < this.currentItem.moreBuyData.length; a++) {
|
|
items.push({
|
|
productId: this.currentItem.moreBuyData[a].id,
|
|
specs: '',
|
|
price: parseFloat(this.sliceMsg2(this.currentItem.moreBuyData[a].attributeListPrice))
|
|
.toFixed(2),
|
|
quantity: this.currentItem.moreBuyData[a].quantity
|
|
});
|
|
}
|
|
}
|
|
|
|
let packageFee = parseFloat(this.currentItem.lunchBox || 0);
|
|
|
|
let payload = {
|
|
userId: uni.getStorageSync('id') || 'test-user123',
|
|
shopId: this.shopItem.id,
|
|
deliveryType: this.tuanzhangOrder.deliveryType,
|
|
packageFee: this.tuanzhangOrder.deliveryType == 1 ? packageFee : 0,
|
|
remark: '',
|
|
items: items,
|
|
receiverName: '',
|
|
receiverPhone: '',
|
|
receiverAddress: '',
|
|
shopName: this.shopItem.shopName,
|
|
shopPhone: this.shopItem.shopPhone || '',
|
|
shopAddress: this.shopItem.shopAddress || '',
|
|
groupId: this.groupId,
|
|
userCouponId: this.selectedCoupon ? this.selectedCoupon.id : null
|
|
};
|
|
payload.regionId = JSON.parse(uni.getStorageSync('area')).id
|
|
uni.showLoading({
|
|
title: '创建订单中...'
|
|
});
|
|
this.tui.request("/mall/order/create", "POST", payload, false, false).then(res => {
|
|
uni.hideLoading();
|
|
if (res.success && res.result) {
|
|
this.currentOrderId = res.result.id;
|
|
this.groupdeliveryType = res.result.deliveryType;
|
|
this.backendTotalAmount = res.result.totalAmount;
|
|
if (res.result.isFreeOrder == 1) {
|
|
uni.showToast({
|
|
title: '锦鲤附身啦 免单' + res.result.freeAmount + '元',
|
|
icon: 'none'
|
|
});
|
|
}
|
|
this.$refs.payPopup.open('bottom');
|
|
if (this.$refs.pintuanPopup) this.$refs.pintuanPopup.close();
|
|
} else {
|
|
uni.showToast({
|
|
title: res.message || '下单失败',
|
|
icon: 'none'
|
|
});
|
|
}
|
|
}).catch(err => {
|
|
uni.hideLoading();
|
|
});
|
|
},
|
|
addToCart(item, specs) {
|
|
let specStr = specs ? JSON.stringify(specs) : '';
|
|
let cartId = item.id + '_' + specStr;
|
|
let existingItem = this.cartItems.find(c => c.cartId === cartId);
|
|
if (existingItem) {
|
|
existingItem.quantity++;
|
|
} else {
|
|
let priceToUse = 0;
|
|
if (item.attributeListPrice) {
|
|
try {
|
|
let pObj = typeof item.attributeListPrice === 'string' ? JSON.parse(item.attributeListPrice) :
|
|
item.attributeListPrice;
|
|
if (Array.isArray(pObj) && pObj.length > 0) {
|
|
priceToUse = parseFloat(pObj[0].specPrice);
|
|
} else {
|
|
for (let k in pObj) {
|
|
priceToUse = parseFloat(pObj[k].specPrice);
|
|
break;
|
|
}
|
|
}
|
|
} catch (e) {}
|
|
}
|
|
this.cartItems.push({
|
|
cartId: cartId,
|
|
item: item,
|
|
specs: specs,
|
|
quantity: 1,
|
|
price: priceToUse.toFixed(2)
|
|
});
|
|
}
|
|
},
|
|
//判断是否在营业时间内
|
|
isWithinBusinessHours(begin, end) {
|
|
// 获取当前时间的时和分
|
|
const now = new Date();
|
|
const currentMinutes = now.getHours() * 60 + now.getMinutes();
|
|
|
|
// 解析开始和结束时间（格式 "HH:MM"）
|
|
const parseTime = (timeStr) => {
|
|
const [hours, minutes] = timeStr.split(':').map(Number);
|
|
return hours * 60 + minutes;
|
|
};
|
|
|
|
const startMinutes = parseTime(begin);
|
|
const endMinutes = parseTime(end);
|
|
|
|
// 判断是否在区间内（包含端点）
|
|
return currentMinutes >= startMinutes && currentMinutes <= endMinutes;
|
|
},
|
|
adjustCart(cartId, delta) {
|
|
let index = this.cartItems.findIndex(c => c.cartId === cartId);
|
|
if (index !== -1) {
|
|
let newQty = this.cartItems[index].quantity + delta;
|
|
if (newQty <= 0) {
|
|
this.cartItems.splice(index, 1);
|
|
} else {
|
|
this.cartItems[index].quantity = newQty;
|
|
}
|
|
}
|
|
},
|
|
getSpecDisplayString(specs) {
|
|
if (!specs) return '';
|
|
let arr = [];
|
|
for (let k in specs) {
|
|
if (Array.isArray(specs[k])) {
|
|
arr.push(specs[k].join('+'));
|
|
} else {
|
|
arr.push(specs[k]);
|
|
}
|
|
}
|
|
return arr.join(',');
|
|
},
|
|
submitCartCheckout() {
|
|
if (this.cartItems.length === 0) {
|
|
this.$refs.warnPopup.open()
|
|
return;
|
|
}
|
|
|
|
let totalPackageFee = 0;
|
|
for (let cartItem of this.cartItems) {
|
|
totalPackageFee += parseFloat(cartItem.item.lunchBox || 0) * cartItem.quantity;
|
|
}
|
|
// 类似普通订单结算逻辑
|
|
uni.navigateTo({
|
|
url: '/package1/buyFood/buyFood?cart=' + encodeURIComponent(JSON.stringify(this.cartItems)) +
|
|
'&shopItem=' + encodeURIComponent(JSON.stringify(this.shopItem)) + '&packageFee=' +
|
|
totalPackageFee
|
|
});
|
|
},
|
|
goDetail(type) {
|
|
if (type == 'goodsDetail') {
|
|
// uni.navigateTo({
|
|
// url: '/package1/goods/goodsDetail'
|
|
// })
|
|
} else if (type == 'shopDetail') {
|
|
uni.navigateTo({
|
|
url: '/package2/group/groupBuyDetail?item=' + JSON.stringify(this.shopItem)
|
|
})
|
|
} else if (type == 'shopEvaluate') {
|
|
uni.navigateTo({
|
|
url: '/package2/group/shopEvaluate?item=' + JSON.stringify(this.shopItem)
|
|
})
|
|
}
|
|
},
|
|
buyingye() {
|
|
uni.showToast({
|
|
title: '商品不在售卖时间！',
|
|
icon: 'none'
|
|
});
|
|
},
|
|
getGroupPrice(item) {
|
|
if (!this.groupId) {
|
|
return this.$options.filters.slicePrice(item.productGroupBuyPrices);
|
|
}
|
|
let target = this.targetMembers;
|
|
let prices = item.productGroupBuyPrices || [];
|
|
if (prices.length === 0) return '0.00';
|
|
let validPrices = prices.filter(p => p.groupCount <= target);
|
|
if (validPrices.length === 0) {
|
|
let minRule = prices.reduce((prev, curr) => (prev.groupCount < curr.groupCount ? prev : curr));
|
|
return parseFloat(minRule.groupPrice).toFixed(2);
|
|
}
|
|
let bestRule = validPrices.reduce((max, obj) => (obj.groupCount > max.groupCount ? obj : max));
|
|
return parseFloat(bestRule.groupPrice).toFixed(2);
|
|
},
|
|
selectMoreBuy(item, index) {
|
|
this.checkMoreBuyIndex = item.id
|
|
this.moreBuyList[index].isChecked = !this.moreBuyList[index].isChecked;
|
|
let isHas = false
|
|
let index1 = ''
|
|
for (let i = 0; i < this.moreBuyList.length; i++) {
|
|
if (this.moreBuyList[i].id != item.id && this.moreBuyList[index].isChecked) {
|
|
this.moreBuyList[i].isChecked = false
|
|
}
|
|
}
|
|
for (let i = 0; i < this.moreBuyData.length; i++) {
|
|
if (this.moreBuyData[i].id == this.moreBuyList[index].id) {
|
|
isHas = true
|
|
index1 = i
|
|
this.vModelValue = this.moreBuyData[i].quantity ? this.moreBuyData[i].quantity : 0
|
|
this.moreBuyList[index].quantity = this.moreBuyData[i].quantity ? this.moreBuyData[i].quantity : 0
|
|
}
|
|
}
|
|
if (!isHas) {
|
|
this.vModelValue = 0
|
|
}
|
|
|
|
if (this.moreBuyList[index].isChecked && !isHas) {
|
|
item.quantity = 0
|
|
this.moreBuyData.push(item)
|
|
}
|
|
if (!this.moreBuyList[index].isChecked && isHas) {
|
|
this.moreBuyData.splice(index1, 1)
|
|
this.moreBuyList[index].quantity = 0
|
|
}
|
|
|
|
let moreBuyPrice = 0
|
|
for (let i = 0; i < this.moreBuyData.length; i++) {
|
|
if (this.moreBuyData[i].quantity > 0) {
|
|
moreBuyPrice += Number((Number(this.moreBuyData[i].quantity) * Number(this.sliceMsg2(this
|
|
.moreBuyData[i].attributeListPrice))).toFixed(2))
|
|
}
|
|
}
|
|
this.selectedGroupRule.groupPriceAndMore = Number(this.selectedGroupRule.groupPrice) + moreBuyPrice
|
|
if (this.selectedCoupon) {
|
|
this.selectedGroupRule.groupPriceAndMore -= parseFloat(this.selectedCoupon.discountAmount);
|
|
if (this.selectedGroupRule.groupPriceAndMore <= 0) {
|
|
this.selectedGroupRule.groupPriceAndMore = 0.01
|
|
}
|
|
}
|
|
},
|
|
sliceMsg2(val) {
|
|
var name = ''
|
|
if (typeof(val) == 'string') {
|
|
let newObj = JSON.parse(val)
|
|
for (let as in newObj) {
|
|
name = newObj[as].specPrice
|
|
}
|
|
}
|
|
return name;
|
|
},
|
|
changeValue(type) {
|
|
if (type == 'plus') {
|
|
this.vModelValue += 1
|
|
} else {
|
|
this.vModelValue = this.vModelValue > 0 ? this.vModelValue -= 1 : 0
|
|
}
|
|
let moreBuyPrice = 0
|
|
for (let i = 0; i < this.moreBuyList.length; i++) {
|
|
if (this.moreBuyList[i].id == this.checkMoreBuyIndex) {
|
|
this.moreBuyList[i].quantity = this.vModelValue
|
|
}
|
|
if (this.moreBuyList[i].quantity > 0) {
|
|
moreBuyPrice += Number((Number(this.moreBuyList[i].quantity) * Number(this.sliceMsg2(this
|
|
.moreBuyList[i].attributeListPrice))).toFixed(2))
|
|
}
|
|
}
|
|
this.selectedGroupRule.groupPriceAndMore = Number(this.selectedGroupRule.groupPrice) + moreBuyPrice
|
|
if (this.selectedCoupon) {
|
|
this.selectedGroupRule.groupPriceAndMore -= parseFloat(this.selectedCoupon.discountAmount);
|
|
if (this.selectedGroupRule.groupPriceAndMore <= 0) {
|
|
this.selectedGroupRule.groupPriceAndMore = 0.01
|
|
}
|
|
}
|
|
for (let i = 0; i < this.moreBuyData.length; i++) {
|
|
if (this.moreBuyData[i].id == this.checkMoreBuyIndex) {
|
|
this.moreBuyData[i].quantity = this.vModelValue
|
|
}
|
|
}
|
|
this.$forceUpdate()
|
|
},
|
|
wxPayment() {
|
|
let that = this;
|
|
if (!this.currentOrderId || !this.backendTotalAmount) return;
|
|
|
|
let amountInCents = Math.round(this.backendTotalAmount * 100);
|
|
let userRequireMake = 0
|
|
if(this.nowMake && this.groupdeliveryType == 2){
|
|
userRequireMake = 1
|
|
}
|
|
|
|
this.tui.request("/api/wechat/pay/unified-order", "POST", {
|
|
openid: uni.getStorageSync('miniProgramOpenid') || 'test-openid',
|
|
amount: amountInCents,
|
|
description: '商城订单',
|
|
userRequireMake:userRequireMake,
|
|
outTradeNo: this.currentOrderId
|
|
}, false, false).then((res) => {
|
|
if (res.code == 200) {
|
|
uni.requestPayment({
|
|
provider: 'wxpay',
|
|
timeStamp: res.timeStamp,
|
|
nonceStr: res.nonceStr,
|
|
package: res.package,
|
|
signType: res.signType,
|
|
paySign: res.paySign,
|
|
success: function(res2) {
|
|
/* uni.showToast({ title: '支付成功', icon: 'success' });
|
|
that.tui.request("/api/wechat/pay/paySuccess", "POST", {
|
|
outTradeNo: that.currentOrderId
|
|
}, false, false).then((res3) => {
|
|
if(res3.code == 200){
|
|
uni.redirectTo({
|
|
url: '/package1/order/orderConfirm?id=' + that.currentOrderId + '&groupId=' + that.groupId + '&amount=' + this.backendTotalAmount
|
|
});
|
|
}else{
|
|
that.tui.toast("订单创建失败，请联系客服处理");
|
|
}
|
|
}) */
|
|
uni.redirectTo({
|
|
url: '/package1/order/orderConfirm?id=' + that
|
|
.currentOrderId + '&groupId=' + that.groupId +
|
|
'&amount=' + that.backendTotalAmount
|
|
});
|
|
},
|
|
fail: function(err) {
|
|
that.tui.toast("支付失败或取消", 1000);
|
|
}
|
|
});
|
|
} else {
|
|
// 模拟支付成功
|
|
if (res.code == 404 || res.code == 500 || res.code == 400 || !res.code) {
|
|
that.tui.request(
|
|
`/hiver/order/payMallOrderSuccess?orderId=${that.currentOrderId}&workerId=`,
|
|
"POST", {}, false, false).then(res2 => {
|
|
that.$refs.payPopup.close();
|
|
uni.showToast({
|
|
title: '支付成功(模拟)',
|
|
icon: 'none'
|
|
});
|
|
setTimeout(() => {
|
|
that.$refs.joinSuccessPopup.open('bottom');
|
|
}, 1500);
|
|
});
|
|
} else {
|
|
that.tui.toast(res.message, 1000);
|
|
}
|
|
}
|
|
})
|
|
},
|
|
onJoinSuccessPopupChange(e) {
|
|
if (!e.show) {
|
|
uni.redirectTo({
|
|
url: '/package1/order/pendGroup?groupId=' + this.groupId
|
|
});
|
|
}
|
|
},
|
|
fetchCoupons() {
|
|
let userId = uni.getStorageSync('id');
|
|
if (!userId) return;
|
|
let amount = this.selectedGroupRule && this.selectedGroupRule.groupPriceAndMore ? this.selectedGroupRule
|
|
.groupPriceAndMore : 0;
|
|
this.tui.request('/mall/coupon/available', 'GET', {
|
|
userId: userId,
|
|
applyScene: 1,
|
|
regionId: JSON.parse(uni.getStorageSync('area')).id,
|
|
amount: amount,
|
|
merchantId: this.shopItem.id || '0'
|
|
}, false, true).then((res) => {
|
|
if (res.code == 200 && res.result) {
|
|
this.availableCoupons = res.result;
|
|
if (this.selectedCoupon) {
|
|
let stillValid = this.availableCoupons.find(c => c.id === this.selectedCoupon.id);
|
|
if (!stillValid) this.selectedCoupon = null;
|
|
}
|
|
}
|
|
});
|
|
},
|
|
openMianRemark(){
|
|
this.isPindan = false;
|
|
this.$refs.tishiPopup.open()
|
|
},
|
|
selectCoupon(item) {
|
|
this.selectedCoupon = item;
|
|
this.selectedGroupRule.groupPriceAndMore -= parseFloat(this.selectedCoupon.discountAmount);
|
|
if (this.selectedGroupRule.groupPriceAndMore <= 0) {
|
|
this.selectedGroupRule.groupPriceAndMore = 0.01
|
|
}
|
|
this.$refs.couponPopup.close();
|
|
},
|
|
openCouponPopup() {
|
|
this.fetchCoupons();
|
|
this.$refs.couponPopup.open('bottom');
|
|
},
|
|
back() {
|
|
uni.navigateBack()
|
|
}
|
|
}
|
|
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
page {
|
|
width: 100%;
|
|
height: 100%;
|
|
font-size: 24rpx;
|
|
background: #F5F8F5;
|
|
color: #00231C;
|
|
}
|
|
|
|
.page1 {
|
|
width: 100%;
|
|
height: 100%;
|
|
font-size: 24rpx;
|
|
position: relative;
|
|
}
|
|
|
|
/* 顶部背景图随页面滚动（不固定） */
|
|
.title {
|
|
background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/8bc15960c2dc40268e295d6dd23aecce.png') no-repeat;
|
|
width: 100%;
|
|
height: 340rpx;
|
|
background-size: 100%;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
|
|
/* 固定在顶部的导航栏，覆盖在背景图上 */
|
|
.nav-bar {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
z-index: 100;
|
|
padding: 16rpx 24rpx;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.radio-check {
|
|
background: linear-gradient(90deg, #e3ff96, #a6ffea);
|
|
width: 42rpx;
|
|
height: 42rpx;
|
|
border-radius: 42rpx;
|
|
text-align: center;
|
|
line-height: 42rpx;
|
|
margin: 0 18rpx 0 0;
|
|
box-shadow: 0 6rpx 16rpx rgba(49, 224, 183, 0.22);
|
|
}
|
|
|
|
.radio-no-check {
|
|
width: 42rpx;
|
|
height: 42rpx;
|
|
border-radius: 42rpx;
|
|
border: 2rpx solid #e8eeee;
|
|
margin: 0 18rpx 0 0;
|
|
background: #fff;
|
|
}
|
|
|
|
.title-search {
|
|
display: flex;
|
|
flex: 1;
|
|
background: rgba(255, 255, 255, 0.9);
|
|
height: 54rpx;
|
|
margin-left: 20rpx;
|
|
border-radius: 54rpx;
|
|
|
|
input {
|
|
height: 54rpx;
|
|
line-height: 54rpx;
|
|
}
|
|
}
|
|
|
|
.back-btn {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 60rpx;
|
|
height: 60rpx;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
/* content 上移，叠在背景图下方，减少头部空白 */
|
|
.content {
|
|
margin-top: -155rpx;
|
|
position: relative;
|
|
z-index: 1;
|
|
height: auto;
|
|
}
|
|
|
|
.shop-img {
|
|
width: 160rpx;
|
|
height: 160rpx;
|
|
position: relative;
|
|
|
|
img {
|
|
width: 100%;
|
|
background-size: 100%;
|
|
height: 100%;
|
|
border-radius: 20rpx;
|
|
}
|
|
}
|
|
|
|
.shop-top {
|
|
display: flex;
|
|
}
|
|
|
|
.shop-content {
|
|
flex: 1;
|
|
padding-left: 20rpx;
|
|
|
|
}
|
|
|
|
.shop-name {
|
|
font-size: 32rpx;
|
|
font-weight: 900;
|
|
}
|
|
|
|
.shop-content-center {
|
|
display: flex;
|
|
margin: 20rpx 0;
|
|
}
|
|
|
|
.shop-rate {
|
|
background: rgba(249, 212, 157, 0.34);
|
|
height: 40rpx;
|
|
display: flex;
|
|
border-radius: 20rpx;
|
|
padding: 0 10rpx 0 0;
|
|
}
|
|
|
|
.shop-rate-num {
|
|
width: 50rpx;
|
|
height: 100%;
|
|
text-align: center;
|
|
background: linear-gradient(90deg, rgba(255, 77, 0, 1), rgba(255, 184, 84, 1));
|
|
color: #fff;
|
|
line-height: 40rpx;
|
|
font-size: 22rpx;
|
|
border-bottom-left-radius: 20rpx;
|
|
border-top-left-radius: 20rpx;
|
|
border-bottom-right-radius: 10rpx;
|
|
border-top-right-radius: 10rpx;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.shop-tag {
|
|
flex: 1;
|
|
line-height: 40rpx;
|
|
text-align: right;
|
|
}
|
|
|
|
.shop-tag1 {
|
|
flex: 1;
|
|
line-height: 40rpx;
|
|
text-align: left;
|
|
}
|
|
|
|
.shop-content-bottom {
|
|
display: flex;
|
|
}
|
|
|
|
.shop-deal {
|
|
flex: 1;
|
|
}
|
|
|
|
.shop-bottom {
|
|
margin-top: 20rpx;
|
|
line-height: 40rpx;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.pintuan {
|
|
background: #fff;
|
|
padding: 20rpx;
|
|
width: 95%;
|
|
margin: 0 auto;
|
|
border-radius: 20rpx;
|
|
}
|
|
|
|
.pintuan-left {
|
|
display: flex;
|
|
padding: 20rpx;
|
|
flex: 1;
|
|
}
|
|
|
|
.pintuan-left-img {
|
|
width: 90rpx;
|
|
height: 90rpx;
|
|
|
|
img {
|
|
width: 100%;
|
|
height: 100%;
|
|
background-size: 100%;
|
|
border-radius: 20rpx;
|
|
}
|
|
}
|
|
|
|
.pintuan-left-box {
|
|
flex: 1;
|
|
padding-left: 20rpx;
|
|
}
|
|
|
|
.pintuan-right {
|
|
display: flex;
|
|
margin-top: 50rpx;
|
|
width: 30%;
|
|
}
|
|
|
|
.pintuan-right-img {
|
|
height: 40rpx;
|
|
display: flex;
|
|
|
|
img {
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
z-index: 98;
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.pintuan-left-name {
|
|
font-weight: 700;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
|
|
.pintuan-left-price {
|
|
display: inline;
|
|
padding: 10rpx;
|
|
background: rgba(255, 57, 57, 0.1);
|
|
border-radius: 10rpx;
|
|
}
|
|
|
|
.weipincheng {
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
background: rgba(166, 255, 234, 1);
|
|
border-radius: 40rpx;
|
|
text-align: center;
|
|
font-size: 28rpx;
|
|
font-weight: 700;
|
|
margin-left: -6rpx;
|
|
z-index: 97;
|
|
}
|
|
|
|
.pintuan-right-cha {
|
|
line-height: 40rpx;
|
|
padding-left: 10rpx;
|
|
}
|
|
|
|
.goods-member {
|
|
padding-bottom: 20rpx;
|
|
margin: 0 0 20rpx;
|
|
background: #fff;
|
|
position: relative;
|
|
}
|
|
|
|
.goods-list {
|
|
flex: 1;
|
|
height: 100%;
|
|
border-radius: 20rpx;
|
|
}
|
|
.fee-value {
|
|
color: #00231C;
|
|
font-weight: 800;
|
|
}
|
|
|
|
|
|
.goods-top {
|
|
padding: 20rpx;
|
|
display: flex;
|
|
}
|
|
|
|
.goods-content {
|
|
flex: 1;
|
|
padding-left: 20rpx;
|
|
}
|
|
|
|
.goods-name {
|
|
font-size: 32rpx;
|
|
font-weight: 900;
|
|
}
|
|
|
|
.goods-content-center {
|
|
display: flex;
|
|
margin: 16rpx 0;
|
|
}
|
|
|
|
.goods-rate {
|
|
background: rgba(249, 212, 157, 0.34);
|
|
height: 40rpx;
|
|
display: flex;
|
|
border-radius: 20rpx;
|
|
}
|
|
|
|
.goods-rate-num {
|
|
width: 50rpx;
|
|
height: 100%;
|
|
text-align: center;
|
|
background: linear-gradient(90deg, rgba(255, 77, 0, 1), rgba(255, 184, 84, 1));
|
|
color: #fff;
|
|
line-height: 40rpx;
|
|
font-size: 22rpx;
|
|
border-bottom-left-radius: 20rpx;
|
|
border-top-left-radius: 20rpx;
|
|
border-bottom-right-radius: 10rpx;
|
|
border-top-right-radius: 10rpx;
|
|
}
|
|
|
|
.goods-deal1 {
|
|
width: 60%;
|
|
}
|
|
|
|
.goods-tag {
|
|
display: flex;
|
|
margin: 0;
|
|
width: 100%;
|
|
}
|
|
|
|
.goods-content-bottom {
|
|
display: flex;
|
|
}
|
|
|
|
.goods-deal {
|
|
flex: 1;
|
|
}
|
|
|
|
.goods-img {
|
|
width: 160rpx;
|
|
height: 160rpx;
|
|
position: relative;
|
|
|
|
img {
|
|
width: 100%;
|
|
background-size: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.goods-bottom {
|
|
width: 95%;
|
|
margin: 0 auto;
|
|
height: 70rpx;
|
|
line-height: 70rpx;
|
|
}
|
|
|
|
.goods-btn {
|
|
background: linear-gradient(90deg, rgba(227, 255, 150, 1), rgba(166, 255, 234, 1));
|
|
width: 47%;
|
|
text-align: center;
|
|
font-size: 28rpx;
|
|
font-weight: 700;
|
|
border-radius: 20rpx;
|
|
float: right;
|
|
}
|
|
|
|
.bottom {
|
|
position: fixed;
|
|
bottom: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
display: flex;
|
|
background: #fff;
|
|
z-index: 98;
|
|
box-shadow: 0 -10rpx 10rpx rgba(0, 0, 0, 0.3);
|
|
}
|
|
|
|
.bottom-left {
|
|
flex: 1;
|
|
display: flex;
|
|
padding: 20rpx;
|
|
|
|
img {
|
|
width: 60rpx;
|
|
height: 80rpx;
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.bottom-price {
|
|
margin-left: 40rpx;
|
|
font-size: 40rpx;
|
|
color: red;
|
|
font-weight: 700;
|
|
line-height: 110rpx;
|
|
}
|
|
|
|
.bottom-right {
|
|
padding-top: 20rpx;
|
|
flex: 1;
|
|
|
|
img {
|
|
width: 360rpx;
|
|
height: 100rpx;
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.bottom-dot {
|
|
position: absolute;
|
|
top: 0;
|
|
right: -20rpx;
|
|
background: red;
|
|
color: #fff;
|
|
width: 32rpx;
|
|
height: 32rpx;
|
|
border-radius: 32rpx;
|
|
text-align: center;
|
|
line-height: 32rpx;
|
|
}
|
|
|
|
.car-content {
|
|
position: relative;
|
|
height: auto;
|
|
max-height: 1200rpx;
|
|
width: 100%;
|
|
border-top-left-radius: 20rpx;
|
|
border-top-right-radius: 20rpx;
|
|
padding: 20rpx;
|
|
overflow: scroll;
|
|
}
|
|
|
|
.car-close {
|
|
width: 60rpx;
|
|
height: 60rpx;
|
|
position: absolute;
|
|
top: -80rpx;
|
|
right: 20rpx;
|
|
}
|
|
|
|
.car-title {
|
|
height: 96rpx;
|
|
line-height: 60rpx;
|
|
margin: 0 auto;
|
|
font-size: 28rpx;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.num-plus {
|
|
width: 56rpx;
|
|
height: 56rpx;
|
|
font-size: 36rpx;
|
|
text-align: center;
|
|
font-weight: 700;
|
|
line-height: 48rpx;
|
|
border-radius: 10rpx;
|
|
|
|
background: rgba(0, 35, 28, 1);
|
|
color: rgba(166, 255, 234, 1);
|
|
|
|
}
|
|
|
|
.num {
|
|
width: 80rpx;
|
|
height: 56rpx;
|
|
text-align: center;
|
|
line-height: 56rpx;
|
|
font-size: 28rpx;
|
|
}
|
|
|
|
.goods-num {
|
|
display: flex;
|
|
height: 56rpx;
|
|
flex: 1;
|
|
margin-left: 40rpx;
|
|
}
|
|
|
|
.pintuan0 {
|
|
width: 90%;
|
|
height: 100rpx;
|
|
border-radius: 100rpx;
|
|
background: linear-gradient(90deg, rgba(227, 255, 150, 1), rgba(166, 255, 234, 1));
|
|
text-align: center;
|
|
font-size: 26rpx;
|
|
font-weight: 700;
|
|
line-height: 100rpx;
|
|
margin: auto;
|
|
}
|
|
|
|
.pintuan1 {
|
|
width: 90%;
|
|
height: 100rpx;
|
|
line-height: 100rpx;
|
|
display: flex;
|
|
text-align: center;
|
|
margin: auto;
|
|
font-size: 26rpx;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.pintuan2 {
|
|
flex: 1;
|
|
background: linear-gradient(90deg, rgba(227, 255, 150, 1), rgba(166, 255, 234, 1));
|
|
}
|
|
|
|
.spec11 {
|
|
height: 96rpx;
|
|
line-height: 96rpx;
|
|
font-size: 28rpx;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.spec22 {
|
|
display: flex;
|
|
white-space: nowrap;
|
|
overflow-x: scroll;
|
|
}
|
|
|
|
.spec222 {
|
|
display: inline-block;
|
|
padding: 0 20rpx;
|
|
background: rgba(247, 248, 248, 0.6);
|
|
color: #777;
|
|
height: 72rpx;
|
|
line-height: 72rpx;
|
|
text-align: center;
|
|
border-radius: 20rpx;
|
|
margin-right: 20rpx;
|
|
}
|
|
|
|
.spec-check {
|
|
display: inline-block;
|
|
padding: 0 20rpx;
|
|
background: rgba(166, 255, 234, 1);
|
|
height: 72rpx;
|
|
line-height: 72rpx;
|
|
text-align: center;
|
|
border-radius: 20rpx;
|
|
margin-right: 20rpx;
|
|
}
|
|
|
|
.team1 {
|
|
width: 154rpx;
|
|
background: rgba(247, 248, 248, 0.6);
|
|
border-radius: 20rpx;
|
|
font-size: 26rpx;
|
|
text-align: center;
|
|
line-height: 40rpx;
|
|
float: left;
|
|
margin-right: 40rpx;
|
|
font-weight: 700;
|
|
padding: 10px;
|
|
}
|
|
|
|
.team2 {
|
|
width: 190rpx;
|
|
height: 270rpx;
|
|
background: rgba(247, 248, 248, 0.6);
|
|
border-radius: 10px;
|
|
float: left;
|
|
text-align: center;
|
|
margin-right: 20px;
|
|
padding: 10px 10px 0;
|
|
position: relative;
|
|
}
|
|
|
|
.team-check1 {
|
|
width: 190rpx;
|
|
height: 270rpx;
|
|
background: rgba(166, 255, 234, 1);
|
|
border-radius: 10px;
|
|
float: left;
|
|
text-align: center;
|
|
margin-right: 20px;
|
|
padding: 10px 10px 0;
|
|
position: relative;
|
|
}
|
|
|
|
.team-check {
|
|
width: 154rpx;
|
|
height: auto;
|
|
background: rgba(166, 255, 234, 1);
|
|
border-radius: 20rpx;
|
|
font-size: 26rpx;
|
|
text-align: center;
|
|
line-height: 40rpx;
|
|
float: left;
|
|
margin-right: 40rpx;
|
|
position: relative;
|
|
padding: 10px;
|
|
}
|
|
|
|
.zaixian-swiper {
|
|
flex: 1;
|
|
height: 126rpx;
|
|
}
|
|
|
|
.zaixian-item {
|
|
height: 126rpx;
|
|
line-height: 126rpx;
|
|
font-size: 24rpx;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.team11 {
|
|
height: 35rpx;
|
|
margin-top: 18rpx;
|
|
}
|
|
|
|
.goods-team {
|
|
width: 100%;
|
|
min-height: 130rpx;
|
|
display: flex;
|
|
white-space: nowrap;
|
|
overflow-x: scroll;
|
|
}
|
|
|
|
.list-right {
|
|
display: flex;
|
|
width: 100%;
|
|
padding: 30rpx 0 30rpx 30rpx;
|
|
flex: 1;
|
|
}
|
|
|
|
.jiaobiao {
|
|
position: absolute;
|
|
top: -16rpx;
|
|
right: -12rpx;
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
border-radius: 40rpx;
|
|
background: red;
|
|
color: #fff;
|
|
text-align: center;
|
|
line-height: 40rpx;
|
|
font-size: 20rpx;
|
|
}
|
|
|
|
.list-right-img {
|
|
height: 80rpx;
|
|
display: flex;
|
|
|
|
img {
|
|
width: 80rpx;
|
|
height: 80rpx;
|
|
z-index: 98;
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.list-weipincheng {
|
|
width: 80rpx;
|
|
height: 80rpx;
|
|
background: #a6ffea;
|
|
border-radius: 80rpx;
|
|
text-align: center;
|
|
font-size: 28rpx;
|
|
font-weight: 700;
|
|
margin-left: -6rpx;
|
|
z-index: 97;
|
|
line-height: 80rpx;
|
|
}
|
|
|
|
.goods-center {
|
|
width: 100%;
|
|
margin: 0 auto 20rpx;
|
|
background: #f5f8f5;
|
|
height: 140rpx;
|
|
border-radius: 20rpx;
|
|
overflow: hidden;
|
|
display: flex;
|
|
}
|
|
|
|
.list-right-cha {
|
|
margin-left: 20rpx;
|
|
}
|
|
|
|
.list-right-price {
|
|
flex: 1;
|
|
text-align: right;
|
|
line-height: 80rpx;
|
|
color: red;
|
|
font-size: 28rpx;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.list-btn {
|
|
background: linear-gradient(90deg, #e3ff96, #a6ffea);
|
|
width: 130rpx;
|
|
text-align: center;
|
|
font-size: 28rpx;
|
|
font-weight: 600;
|
|
border-radius: 60rpx;
|
|
height: 60rpx;
|
|
line-height: 60rpx;
|
|
margin: 40rpx;
|
|
}
|
|
|
|
.cha11 {
|
|
font-size: 22rpx;
|
|
background: rgba(255, 57, 57, 0.2);
|
|
color: red;
|
|
display: inline-block;
|
|
padding: 6rpx;
|
|
border-radius: 10rpx;
|
|
margin-bottom: 10rpx;
|
|
}
|
|
|
|
.checked-img {
|
|
width: 180rpx;
|
|
height: 20rpx;
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
}
|
|
|
|
.menu1 {
|
|
width: 160rpx;
|
|
height: 90rpx;
|
|
position: relative;
|
|
text-align: center;
|
|
line-height: 90rpx;
|
|
}
|
|
|
|
.hero-spark {
|
|
position: absolute;
|
|
border-radius: 999rpx;
|
|
background: rgba(255, 255, 255, 0.78);
|
|
box-shadow: 0 0 22rpx rgba(255, 244, 183, 0.9);
|
|
animation: sparkFloat 3.2s ease-in-out infinite;
|
|
}
|
|
|
|
.spark-a {
|
|
width: 18rpx;
|
|
height: 18rpx;
|
|
top: 110rpx;
|
|
left: 80rpx;
|
|
}
|
|
.tishi-popup{
|
|
background:url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/629843c61a014d69bf3a1195f51a898b.png') no-repeat;
|
|
width: 300px;
|
|
height: 285px;
|
|
box-sizing: border-box;
|
|
background-size: 100% 100%;
|
|
position: relative;
|
|
text-align: center;
|
|
}
|
|
|
|
.tishi-copy {
|
|
position: absolute;
|
|
top: 72px;
|
|
left: 46px;
|
|
width: 194px;
|
|
}
|
|
|
|
.tishi-copy-title {
|
|
color: #21443c;
|
|
font-size: 16px;
|
|
font-weight: 900;
|
|
line-height: 23px;
|
|
letter-spacing: 0.2px;
|
|
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
|
|
}
|
|
|
|
.tishi-copy-desc {
|
|
margin-top: 13px;
|
|
color: #6d7d78;
|
|
font-size: 14px;
|
|
font-weight: 700;
|
|
line-height: 21px;
|
|
letter-spacing: 0.1px;
|
|
}
|
|
|
|
.tishi-copy-highlight {
|
|
color: #ff7043;
|
|
font-weight: 900;
|
|
}
|
|
.spark-b {
|
|
width: 24rpx;
|
|
height: 24rpx;
|
|
top: 190rpx;
|
|
right: 110rpx;
|
|
animation-delay: 0.6s;
|
|
}
|
|
|
|
.spark-c {
|
|
width: 14rpx;
|
|
height: 14rpx;
|
|
top: 82rpx;
|
|
right: 250rpx;
|
|
animation-delay: 1.1s;
|
|
}
|
|
|
|
.group-hero-card,
|
|
.group-live-card,
|
|
.goods-card {
|
|
position: relative;
|
|
overflow: hidden;
|
|
border: 1px solid rgba(255, 255, 255, 0.9);
|
|
box-shadow: 0 18rpx 42rpx rgba(0, 35, 28, 0.08);
|
|
}
|
|
|
|
.group-hero-card {
|
|
background:
|
|
radial-gradient(circle at 88% 8%, rgba(255, 216, 133, 0.44) 0, rgba(255, 216, 133, 0) 190rpx),
|
|
linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 255, 248, 0.95) 48%, rgba(233, 255, 247, 0.98) 100%);
|
|
animation: cardFloatIn 0.32s ease both;
|
|
}
|
|
|
|
.group-card-glow,
|
|
.goods-card-shine {
|
|
position: absolute;
|
|
width: 280rpx;
|
|
height: 240rpx;
|
|
top: -120rpx;
|
|
right: -150rpx;
|
|
border-radius: 50%;
|
|
background: rgba(166, 255, 234, 0.26);
|
|
pointer-events: none;
|
|
}
|
|
|
|
.shop-rally-badge {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
height: 42rpx;
|
|
margin-bottom: 18rpx;
|
|
padding: 0 18rpx;
|
|
border-radius: 999rpx;
|
|
background: linear-gradient(90deg, #fff2c6 0%, #a6ffea 100%);
|
|
color: #123d35;
|
|
font-size: 22rpx;
|
|
font-weight: 900;
|
|
box-shadow: 0 8rpx 18rpx rgba(0, 35, 28, 0.06);
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
|
|
.shop-rally-dot {
|
|
width: 8rpx;
|
|
height: 8rpx;
|
|
margin: 0 12rpx;
|
|
border-radius: 50%;
|
|
background: #ff7a4f;
|
|
box-shadow: 0 0 16rpx rgba(255, 122, 79, 0.7);
|
|
}
|
|
|
|
.shop-subtitle {
|
|
margin-top: 8rpx;
|
|
color: #6b7c77;
|
|
font-size: 22rpx;
|
|
font-weight: 700;
|
|
line-height: 32rpx;
|
|
}
|
|
|
|
.notice-label {
|
|
display: inline-block;
|
|
height: 34rpx;
|
|
line-height: 34rpx;
|
|
margin-right: 12rpx;
|
|
padding: 0 12rpx;
|
|
border-radius: 999rpx;
|
|
background: rgba(255, 117, 88, 0.12);
|
|
color: #ff5b36;
|
|
font-size: 20rpx;
|
|
font-weight: 900;
|
|
}
|
|
|
|
.group-live-card {
|
|
display: block !important;
|
|
padding: 12rpx 16rpx !important;
|
|
background:
|
|
radial-gradient(circle at 92% 0, rgba(166, 255, 234, 0.42) 0, rgba(166, 255, 234, 0) 150rpx),
|
|
linear-gradient(135deg, #f8fffb 0%, #fff7dc 48%, #eafff8 100%);
|
|
color: #123d35;
|
|
border: 1px solid rgba(166, 255, 234, 0.72);
|
|
border-radius: 26rpx;
|
|
box-shadow: 0 12rpx 28rpx rgba(0, 35, 28, 0.08);
|
|
}
|
|
|
|
.group-live-card::after {
|
|
content: '';
|
|
position: absolute;
|
|
width: 300rpx;
|
|
height: 520rpx;
|
|
top: -150rpx;
|
|
left: -340rpx;
|
|
background: linear-gradient(110deg, rgba(255, 255, 255, 0) 0%, rgba(255, 196, 102, 0.28) 46%, rgba(255, 255, 255, 0) 100%);
|
|
transform: rotate(18deg);
|
|
animation: lightSweep 3.8s ease-in-out infinite;
|
|
}
|
|
|
|
.live-card-header {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
position: relative;
|
|
z-index: 1;
|
|
margin-bottom: 6rpx;
|
|
}
|
|
|
|
.live-title-wrap {
|
|
display: flex;
|
|
align-items: center;
|
|
min-width: 0;
|
|
}
|
|
|
|
.live-title-gif {
|
|
width: 42rpx;
|
|
height: 42rpx;
|
|
margin-right: 8rpx;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.live-title {
|
|
font-size: 24rpx;
|
|
font-weight: 900;
|
|
line-height: 34rpx;
|
|
}
|
|
|
|
.live-subtitle {
|
|
color: #6d7c77;
|
|
font-size: 20rpx;
|
|
line-height: 26rpx;
|
|
}
|
|
|
|
.live-pill {
|
|
height: 48rpx;
|
|
line-height: 48rpx;
|
|
padding: 0 22rpx;
|
|
border-radius: 999rpx;
|
|
background: linear-gradient(90deg, #e3ff96, #a6ffea);
|
|
color: #00231c;
|
|
font-size: 22rpx;
|
|
font-weight: 900;
|
|
animation: ctaBreath 1.8s ease-in-out infinite;
|
|
}
|
|
|
|
.live-swiper-item {
|
|
display: flex;
|
|
align-items: center;
|
|
position: relative;
|
|
z-index: 1;
|
|
height: 92rpx;
|
|
border-radius: 22rpx;
|
|
background: rgba(255, 255, 255, 0.74);
|
|
border: 1px solid rgba(166, 255, 234, 0.46);
|
|
}
|
|
|
|
.group-live-card .pintuan-left {
|
|
min-width: 0;
|
|
padding: 8rpx 10rpx;
|
|
}
|
|
|
|
.group-live-card .pintuan-right {
|
|
width: 214rpx;
|
|
flex-shrink: 0;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
margin-top: 0;
|
|
color: #123d35;
|
|
}
|
|
|
|
.group-live-card .pintuan-left-img {
|
|
width: 70rpx;
|
|
height: 70rpx;
|
|
}
|
|
|
|
.group-live-card .pintuan-left-name {
|
|
margin-bottom: 8rpx;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.group-live-card .pintuan-left-price {
|
|
padding: 6rpx 10rpx;
|
|
font-size: 20rpx;
|
|
}
|
|
|
|
.group-live-card .pintuan-right-cha {
|
|
padding-left: 6rpx;
|
|
font-size: 20rpx;
|
|
line-height: 34rpx;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.group-live-card .pintuan-right-img {
|
|
height: 36rpx;
|
|
}
|
|
|
|
.group-live-card .pintuan-right-img img,
|
|
.group-live-card .weipincheng {
|
|
width: 36rpx;
|
|
height: 36rpx;
|
|
}
|
|
|
|
.group-live-card .weipincheng {
|
|
line-height: 36rpx;
|
|
font-size: 24rpx;
|
|
}
|
|
|
|
.group-live-card .zaixian-swiper {
|
|
height: 92rpx;
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.missing-count {
|
|
color: #ff5938;
|
|
font-size: 22rpx;
|
|
font-weight: 900;
|
|
padding: 0 4rpx;
|
|
animation: pricePop 1.5s ease-in-out infinite;
|
|
}
|
|
|
|
.goods-panel {
|
|
border-radius: 34rpx 34rpx 0 0;
|
|
overflow: hidden;
|
|
box-shadow: 0 -8rpx 28rpx rgba(0, 35, 28, 0.04);
|
|
}
|
|
|
|
.menu-scroll {
|
|
background: rgba(247, 255, 251, 0.9);
|
|
border-right: 0 !important;
|
|
}
|
|
|
|
.menu1 {
|
|
font-weight: 900;
|
|
transition: transform 0.18s ease, background 0.18s ease;
|
|
}
|
|
|
|
.menu1:active {
|
|
transform: scale(0.96);
|
|
}
|
|
|
|
.menu-active-dot {
|
|
position: absolute;
|
|
left: 6rpx;
|
|
top: 27rpx;
|
|
width: 36rpx;
|
|
height: 36rpx;
|
|
}
|
|
|
|
.goods-card {
|
|
width: 96%;
|
|
margin: 0 auto 22rpx;
|
|
border-radius: 30rpx;
|
|
background:
|
|
radial-gradient(circle at 92% 6%, rgba(255, 237, 176, 0.34) 0, rgba(255, 237, 176, 0) 150rpx),
|
|
#fff;
|
|
animation: cardFloatIn 0.28s ease both;
|
|
}
|
|
|
|
.goods-card:active {
|
|
transform: scale(0.985);
|
|
}
|
|
|
|
.goods-card .goods-img img:first-child {
|
|
box-shadow: 0 12rpx 22rpx rgba(0, 35, 28, 0.1);
|
|
}
|
|
|
|
.goods-vibe {
|
|
margin-top: 10rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.goods-vibe-tag {
|
|
height: 34rpx;
|
|
line-height: 34rpx;
|
|
padding: 0 12rpx;
|
|
border-radius: 999rpx;
|
|
background: linear-gradient(90deg, #fff2c6, #a6ffea);
|
|
color: #0f554a;
|
|
font-size: 20rpx;
|
|
font-weight: 900;
|
|
}
|
|
|
|
.goods-vibe-copy {
|
|
margin-left: 10rpx;
|
|
color: #88928f;
|
|
font-size: 20rpx;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.goods-card .goods-deal1 {
|
|
color: #71817c;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.group-buy-btn {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
height: 70rpx;
|
|
border-radius: 999rpx;
|
|
background: linear-gradient(90deg, #a6ffea 0%, #fff2a8 46%, #ff855d 100%) !important;
|
|
color: #0d332c;
|
|
box-shadow: 0 12rpx 24rpx rgba(255, 133, 93, 0.24);
|
|
animation: ctaBreath 1.35s ease-in-out infinite;
|
|
}
|
|
|
|
.btn-spark {
|
|
width: 36rpx;
|
|
height: 36rpx;
|
|
margin-right: 8rpx;
|
|
position: relative;
|
|
}
|
|
|
|
.btn-spark::before {
|
|
content: '';
|
|
position: absolute;
|
|
left: 4rpx;
|
|
width: 30rpx;
|
|
height: 30rpx;
|
|
border-radius: 50% 50% 50% 8rpx;
|
|
background: linear-gradient(135deg, #ff4d38 0%, #ffbd49 62%, #fff2a8 100%);
|
|
transform: rotate(-35deg);
|
|
box-shadow: 0 0 14rpx rgba(255, 120, 56, 0.5);
|
|
animation: flamePulse 1.2s ease-in-out infinite;
|
|
}
|
|
|
|
.spark-dot {
|
|
position: absolute;
|
|
width: 6rpx;
|
|
height: 6rpx;
|
|
border-radius: 50%;
|
|
background: #fff1a6;
|
|
box-shadow: 0 0 10rpx rgba(255, 193, 74, 0.8);
|
|
animation: sparkBurst 1.1s ease-in-out infinite;
|
|
}
|
|
|
|
.spark-dot-1 {
|
|
top: 0;
|
|
left: 14rpx;
|
|
}
|
|
|
|
.spark-dot-2 {
|
|
top: 10rpx;
|
|
right: 0;
|
|
animation-delay: 0.22s;
|
|
}
|
|
|
|
.spark-dot-3 {
|
|
left: 0;
|
|
bottom: 8rpx;
|
|
animation-delay: 0.42s;
|
|
}
|
|
|
|
.solo-buy-btn {
|
|
border-radius: 999rpx !important;
|
|
color: #1f685d;
|
|
box-shadow: inset 0 0 0 1px rgba(166, 255, 234, 0.36);
|
|
}
|
|
|
|
.checkout-bar {
|
|
left: 2.5%;
|
|
bottom: 18rpx;
|
|
width: 95%;
|
|
border-radius: 42rpx;
|
|
background: rgba(255, 255, 255, 0.96);
|
|
box-shadow: 0 -8rpx 34rpx rgba(0, 35, 28, 0.16);
|
|
overflow: hidden;
|
|
}
|
|
|
|
.cart-bag-wrap {
|
|
animation: bagBounce 2.2s ease-in-out infinite;
|
|
}
|
|
|
|
.checkout-bar .bottom-left {
|
|
align-items: center;
|
|
padding: 14rpx 22rpx;
|
|
}
|
|
|
|
.checkout-bar .bottom-price {
|
|
margin-left: 28rpx;
|
|
line-height: 42rpx;
|
|
color: #ff3d2e;
|
|
}
|
|
|
|
.bottom-price-label {
|
|
color: #7c8b86;
|
|
font-size: 20rpx;
|
|
font-weight: 700;
|
|
line-height: 26rpx;
|
|
}
|
|
|
|
.checkout-btn:active,
|
|
.group-buy-btn:active,
|
|
.solo-buy-btn:active,
|
|
.list-btn:active,
|
|
.pintuan2:active {
|
|
transform: scale(0.96);
|
|
}
|
|
|
|
.group-order-popup,
|
|
.join-team-popup {
|
|
border-top-left-radius: 40rpx;
|
|
border-top-right-radius: 40rpx;
|
|
background:
|
|
radial-gradient(circle at 92% 0, rgba(166, 255, 234, 0.34) 0, rgba(166, 255, 234, 0) 210rpx),
|
|
linear-gradient(180deg, #ffffff 0%, #f7fffb 100%);
|
|
}
|
|
|
|
.popup-rally-title,
|
|
.join-popup-title {
|
|
padding: 8rpx 20rpx 22rpx;
|
|
text-align: center;
|
|
}
|
|
|
|
.popup-rally-main,
|
|
.join-popup-main {
|
|
color: #103a32;
|
|
font-size: 28rpx;
|
|
font-weight: 900;
|
|
line-height: 34rpx;
|
|
}
|
|
|
|
.fee-label {
|
|
flex: 1;
|
|
color: #6f7f79;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.popup-rally-sub,
|
|
.join-popup-sub {
|
|
margin-top: 6rpx;
|
|
color: #74817d;
|
|
font-size: 24rpx;
|
|
font-weight: 700;
|
|
line-height: 34rpx;
|
|
}
|
|
|
|
.popup-product-card {
|
|
margin: 0 0 18rpx;
|
|
border-radius: 28rpx;
|
|
background: rgba(255, 255, 255, 0.82);
|
|
border: 1px solid rgba(166, 255, 234, 0.42);
|
|
box-shadow: 0 12rpx 26rpx rgba(0, 35, 28, 0.06);
|
|
}
|
|
|
|
.popup-origin-price {
|
|
color: #ff4d38;
|
|
font-weight: 900;
|
|
}
|
|
|
|
.team-rule-card {
|
|
box-shadow: 0 10rpx 20rpx rgba(0, 35, 28, 0.05);
|
|
transition: transform 0.18s ease;
|
|
}
|
|
|
|
.team-check.team-rule-card {
|
|
background: linear-gradient(135deg, #fff2c6, #a6ffea);
|
|
box-shadow: 0 12rpx 28rpx rgba(0, 35, 28, 0.1);
|
|
animation: cardPulse 1.8s ease-in-out infinite;
|
|
}
|
|
|
|
.coupon-row {
|
|
margin-top: 28rpx !important;
|
|
padding: 0 18rpx;
|
|
border: 1px solid rgba(255, 216, 133, 0.44) !important;
|
|
border-radius: 22rpx;
|
|
background: rgba(255, 248, 224, 0.64);
|
|
}
|
|
|
|
.popup-bottom-bar {
|
|
background: rgba(255, 255, 255, 0.98);
|
|
box-shadow: 0 -12rpx 28rpx rgba(0, 35, 28, 0.1);
|
|
}
|
|
|
|
.popup-bottom-bar .pintuan2 {
|
|
transition: transform 0.18s ease;
|
|
}
|
|
|
|
.popup-bottom-bar .pintuan2:last-child {
|
|
box-shadow: 0 12rpx 24rpx rgba(0, 35, 28, 0.18);
|
|
animation: ctaBreath 1.9s ease-in-out infinite;
|
|
}
|
|
|
|
.team-wait-card {
|
|
height: 156rpx;
|
|
border-radius: 30rpx;
|
|
background:
|
|
radial-gradient(circle at 90% 8%, rgba(255, 226, 142, 0.34) 0, rgba(255, 226, 142, 0) 130rpx),
|
|
#fff;
|
|
border: 1px solid rgba(166, 255, 234, 0.42);
|
|
box-shadow: 0 12rpx 26rpx rgba(0, 35, 28, 0.06);
|
|
}
|
|
|
|
.team-wait-card .list-btn {
|
|
background: linear-gradient(90deg, #ff855d, #ffd76d);
|
|
color: #fff;
|
|
box-shadow: 0 10rpx 18rpx rgba(255, 133, 93, 0.22);
|
|
}
|
|
|
|
@keyframes sparkFloat {
|
|
|
|
0%,
|
|
100% {
|
|
opacity: 0.5;
|
|
transform: translateY(0) scale(1);
|
|
}
|
|
|
|
50% {
|
|
opacity: 1;
|
|
transform: translateY(-22rpx) scale(1.25);
|
|
}
|
|
}
|
|
|
|
@keyframes lightSweep {
|
|
0% {
|
|
left: -360rpx;
|
|
opacity: 0;
|
|
}
|
|
|
|
28% {
|
|
opacity: 1;
|
|
}
|
|
|
|
64%,
|
|
100% {
|
|
left: 760rpx;
|
|
opacity: 0;
|
|
}
|
|
}
|
|
|
|
@keyframes ctaBreath {
|
|
|
|
0%,
|
|
100% {
|
|
transform: scale(1);
|
|
box-shadow: 0 12rpx 24rpx rgba(255, 133, 93, 0.22);
|
|
}
|
|
|
|
50% {
|
|
transform: scale(1.075);
|
|
box-shadow: 0 18rpx 34rpx rgba(255, 133, 93, 0.42);
|
|
}
|
|
}
|
|
|
|
@keyframes pricePop {
|
|
|
|
0%,
|
|
100% {
|
|
transform: scale(1);
|
|
}
|
|
|
|
50% {
|
|
transform: scale(1.16);
|
|
}
|
|
}
|
|
|
|
@keyframes flamePulse {
|
|
|
|
0%,
|
|
100% {
|
|
opacity: 0.92;
|
|
transform: rotate(-35deg) scale(1);
|
|
}
|
|
|
|
50% {
|
|
opacity: 1;
|
|
transform: rotate(-30deg) scale(1.14);
|
|
}
|
|
}
|
|
|
|
@keyframes sparkBurst {
|
|
|
|
0%,
|
|
100% {
|
|
opacity: 0.35;
|
|
transform: translateY(0) scale(0.8);
|
|
}
|
|
|
|
50% {
|
|
opacity: 1;
|
|
transform: translateY(-8rpx) scale(1.2);
|
|
}
|
|
}
|
|
|
|
@keyframes bagBounce {
|
|
|
|
0%,
|
|
100% {
|
|
transform: translateY(0);
|
|
}
|
|
|
|
50% {
|
|
transform: translateY(-8rpx);
|
|
}
|
|
}
|
|
|
|
@keyframes cardFloatIn {
|
|
0% {
|
|
opacity: 0;
|
|
transform: translateY(16rpx);
|
|
}
|
|
|
|
100% {
|
|
opacity: 1;
|
|
transform: translateY(0);
|
|
}
|
|
}
|
|
|
|
@keyframes cardPulse {
|
|
|
|
0%,
|
|
100% {
|
|
transform: scale(1);
|
|
}
|
|
|
|
50% {
|
|
transform: scale(1.03);
|
|
}
|
|
}
|
|
</style>
|