|
|
@ -8,10 +8,22 @@ |
|
|
:interval="3000" |
|
|
:interval="3000" |
|
|
:duration="500" |
|
|
:duration="500" |
|
|
circular |
|
|
circular |
|
|
style="width: 100%; height: 320rpx;" |
|
|
|
|
|
|
|
|
style="width: 100%; height: 400rpx;" |
|
|
> |
|
|
> |
|
|
<swiper-item v-for="(item, index) in bannerList" :key="item.id || index"> |
|
|
<swiper-item v-for="(item, index) in bannerList" :key="item.id || index"> |
|
|
<image :src="item.image" mode="aspectFill" style="width: 100%; height: 100%;" /> |
|
|
|
|
|
|
|
|
<video |
|
|
|
|
|
v-if="item.type == 1" |
|
|
|
|
|
:src="item.image" |
|
|
|
|
|
autoplay |
|
|
|
|
|
muted |
|
|
|
|
|
loop |
|
|
|
|
|
:controls="false" |
|
|
|
|
|
:show-play-btn="false" |
|
|
|
|
|
:show-center-play-btn="false" |
|
|
|
|
|
object-fit="cover" |
|
|
|
|
|
style="width: 100%; height: 100%;" |
|
|
|
|
|
></video> |
|
|
|
|
|
<image v-else :src="item.image" mode="aspectFill" style="width: 100%; height: 100%;" /> |
|
|
</swiper-item> |
|
|
</swiper-item> |
|
|
</swiper> |
|
|
</swiper> |
|
|
</view> |
|
|
</view> |
|
|
@ -25,9 +37,9 @@ |
|
|
:key="category.id || index" |
|
|
:key="category.id || index" |
|
|
class="category-item" |
|
|
class="category-item" |
|
|
:class="{ active: currentCategory === index }" |
|
|
:class="{ active: currentCategory === index }" |
|
|
@tap="switchCategory(index)" |
|
|
|
|
|
|
|
|
@click="switchCategory(index)" |
|
|
> |
|
|
> |
|
|
<view class="category-dot" v-if="getCategoryItemCount(index) > 0"></view> |
|
|
|
|
|
|
|
|
<view class="category-dot" v-if="getCategoryItemCount(index) > 0">{{ getCategoryItemCount(index) }}</view> |
|
|
{{ category.title }} |
|
|
{{ category.title }} |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
@ -36,24 +48,24 @@ |
|
|
<scroll-view class="goods-content" scroll-y @scrolltolower="loadMoreGoods"> |
|
|
<scroll-view class="goods-content" scroll-y @scrolltolower="loadMoreGoods"> |
|
|
<view class="goods-section"> |
|
|
<view class="goods-section"> |
|
|
<view class="goods-item" v-for="(item, index) in recycleList" :key="index"> |
|
|
<view class="goods-item" v-for="(item, index) in recycleList" :key="index"> |
|
|
<image v-if="item.image" :src="item.image" class="goods-item-img" mode="aspectFill" /> |
|
|
|
|
|
|
|
|
<image v-if="item.image" :src="item.image" class="goods-item-img" mode="aspectFit" /> |
|
|
<view class="goods-info-wrap"> |
|
|
<view class="goods-info-wrap"> |
|
|
<view class="goods-header"> |
|
|
<view class="goods-header"> |
|
|
<view class="goods-name">{{item.name}}</view> |
|
|
|
|
|
<!-- <view class="rules-link" @tap="showRules(item)"> |
|
|
|
|
|
<view class="rules"> |
|
|
|
|
|
<text>回收规则</text> |
|
|
|
|
|
<uni-icons type="right" size="14" color="#999"></uni-icons> |
|
|
|
|
|
|
|
|
<text class="goods-name">{{item.name}}</text> |
|
|
|
|
|
<view class="brand-check-placeholder" v-if="item.shopCion"> |
|
|
|
|
|
<view class="brand-check" @click="checkBrand(index)"> |
|
|
|
|
|
<text>查看品牌</text> |
|
|
|
|
|
<uni-icons type="right" size="12" color="#ff7a0e"></uni-icons> |
|
|
</view> |
|
|
</view> |
|
|
</view> --> |
|
|
|
|
|
<view class="rules-link" v-if="item.shopCion" @tap="checkBrand(index)"> |
|
|
|
|
|
<view class="rules"> |
|
|
|
|
|
<text>查看品牌</text> |
|
|
|
|
|
<uni-icons type="right" size="14" color="#999"></uni-icons> |
|
|
|
|
|
</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
<text class="goods-desc">{{item.service}}</text> |
|
|
<text class="goods-desc">{{item.service}}</text> |
|
|
|
|
|
<view class="rules-link" @click="showRules(item)"> |
|
|
|
|
|
<view class="rules"> |
|
|
|
|
|
<text>回收规则</text> |
|
|
|
|
|
<uni-icons type="right" size="14" color="#999"></uni-icons> |
|
|
|
|
|
</view> |
|
|
|
|
|
</view> |
|
|
<view class="goods-info"> |
|
|
<view class="goods-info"> |
|
|
<view class="price-info"> |
|
|
<view class="price-info"> |
|
|
<text class="price-symbol">¥</text> |
|
|
<text class="price-symbol">¥</text> |
|
|
@ -61,19 +73,11 @@ |
|
|
<text class="price-unit">/件</text> |
|
|
<text class="price-unit">/件</text> |
|
|
</view> |
|
|
</view> |
|
|
<view class="quantity-control"> |
|
|
<view class="quantity-control"> |
|
|
<button class="btn-minus" @tap="updateQuantity(index, -1)">-</button> |
|
|
|
|
|
|
|
|
<button class="btn-minus" @click="updateQuantity(index, -1)">-</button> |
|
|
<text class="quantity">{{item.quantity || 0}}</text> |
|
|
<text class="quantity">{{item.quantity || 0}}</text> |
|
|
<button class="btn-plus" @tap="updateQuantity(index, 1)">+</button> |
|
|
|
|
|
|
|
|
<button class="btn-plus" @click="updateQuantity(index, 1)">+</button> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
<!-- <view class="brand-check" v-if="item.shopCion" @tap="checkBrand(index)"> |
|
|
|
|
|
<text>查看品牌</text> |
|
|
|
|
|
<uni-icons type="right" size="14" color="#ff7a0e"></uni-icons> |
|
|
|
|
|
</view> --> |
|
|
|
|
|
<view class="brand-check" @tap="showRules(item)"> |
|
|
|
|
|
<text>回收规则</text> |
|
|
|
|
|
<uni-icons type="right" size="14" color="#ff7a0e"></uni-icons> |
|
|
|
|
|
</view> |
|
|
|
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
@ -88,7 +92,7 @@ |
|
|
<text class="other-unrecycle-price">¥ — /件</text> |
|
|
<text class="other-unrecycle-price">¥ — /件</text> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
<button class="other-unrecycle-btn" disabled>+</button> |
|
|
|
|
|
|
|
|
<button class="other-unrecycle-btn" open-type="contact">+</button> |
|
|
</view> |
|
|
</view> |
|
|
<view v-if="loadingMore" class="loading-more">加载中...</view> |
|
|
<view v-if="loadingMore" class="loading-more">加载中...</view> |
|
|
<view v-else-if="finished" class="loading-more">没有更多了</view> |
|
|
<view v-else-if="finished" class="loading-more">没有更多了</view> |
|
|
@ -105,22 +109,22 @@ |
|
|
<view class="bottom-left"> |
|
|
<view class="bottom-left"> |
|
|
<view class="summary-row"> |
|
|
<view class="summary-row"> |
|
|
<text class="summary-label">已选 <text class="summary-count">{{totalCount}}</text> 件 预计回收可得</text> |
|
|
<text class="summary-label">已选 <text class="summary-count">{{totalCount}}</text> 件 预计回收可得</text> |
|
|
<uni-icons type="help" size="18" color="#b2b2b2" style="margin: 0 8rpx;" /> |
|
|
|
|
|
|
|
|
<uni-icons type="help" size="18" color="#b2b2b2" style="margin: 0 8rpx;" @tap="showPriceInfoPopups" /> |
|
|
</view> |
|
|
</view> |
|
|
<view class="amount-row"> |
|
|
<view class="amount-row"> |
|
|
<uni-icons :type="showDetailPanel ? 'up' : 'down'" size="18" color="#5e5e5e" style="margin-right: 8rpx;vertical-align: middle;" @tap="toggleDetailPanel" /> |
|
|
|
|
|
|
|
|
<uni-icons :type="showDetailPanel ? 'up' : 'down'" size="18" color="#5e5e5e" style="margin-right: 8rpx;vertical-align: middle;" @click="toggleDetailPanel" /> |
|
|
<text class="amount">¥{{priceRange.min}}-{{priceRange.max}}</text> |
|
|
<text class="amount">¥{{priceRange.min}}-{{priceRange.max}}</text> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
<button class="submit-btn" @tap="submitOrder">预约上门取件</button> |
|
|
|
|
|
|
|
|
<button class="submit-btn" @click="submitOrder">预约上门取件</button> |
|
|
</view> |
|
|
</view> |
|
|
<view class="bottom-bar-divider"></view> |
|
|
<view class="bottom-bar-divider"></view> |
|
|
</view> |
|
|
</view> |
|
|
|
|
|
|
|
|
<!-- 明细弹窗遮罩和弹窗 --> |
|
|
<!-- 明细弹窗遮罩和弹窗 --> |
|
|
<view v-if="showDetailPanel" class="detail-popup-mask" @tap.self="toggleDetailPanel"> |
|
|
|
|
|
<view class="detail-popup" @tap.stop> |
|
|
|
|
|
<view class="detail-popup-close" @tap="toggleDetailPanel">×</view> |
|
|
|
|
|
|
|
|
<view v-if="showDetailPanel" class="detail-popup-mask" @click.self="toggleDetailPanel"> |
|
|
|
|
|
<view class="detail-popup" @click.stop> |
|
|
|
|
|
<view class="detail-popup-close" @click="toggleDetailPanel">×</view> |
|
|
<view class="green-tip-bar popup-green-tip"> |
|
|
<view class="green-tip-bar popup-green-tip"> |
|
|
回收范围仅支持回收以上品类，按件回收预计比称重回收多 |
|
|
回收范围仅支持回收以上品类，按件回收预计比称重回收多 |
|
|
<text class="tip-highlight"> 3.76元</text> |
|
|
<text class="tip-highlight"> 3.76元</text> |
|
|
@ -137,9 +141,9 @@ |
|
|
<text class="panel-item-price">¥{{item.price}}/件</text> |
|
|
<text class="panel-item-price">¥{{item.price}}/件</text> |
|
|
</view> |
|
|
</view> |
|
|
<view class="panel-quantity-control"> |
|
|
<view class="panel-quantity-control"> |
|
|
<button class="btn-minus" @tap="updateQuantityByProduct(item, -1)">-</button> |
|
|
|
|
|
|
|
|
<button class="btn-minus" @click="updateQuantityByProduct(item, -1)">-</button> |
|
|
<text class="quantity">{{item.quantity}}</text> |
|
|
<text class="quantity">{{item.quantity}}</text> |
|
|
<button class="btn-plus" @tap="updateQuantityByProduct(item, 1)">+</button> |
|
|
|
|
|
|
|
|
<button class="btn-plus" @click="updateQuantityByProduct(item, 1)">+</button> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</scroll-view> |
|
|
</scroll-view> |
|
|
@ -147,18 +151,40 @@ |
|
|
<view class="bottom-left"> |
|
|
<view class="bottom-left"> |
|
|
<view class="summary-row"> |
|
|
<view class="summary-row"> |
|
|
<text class="summary-label">已选 <text class="summary-count">{{totalCount}}</text> 件 预计回收可得</text> |
|
|
<text class="summary-label">已选 <text class="summary-count">{{totalCount}}</text> 件 预计回收可得</text> |
|
|
<uni-icons type="help" size="18" color="#b2b2b2" style="margin: 0 8rpx;" /> |
|
|
|
|
|
|
|
|
<uni-icons type="help" size="18" color="#b2b2b2" style="margin: 0 8rpx;" @tap="showPriceInfoPopups" /> |
|
|
</view> |
|
|
</view> |
|
|
<view class="amount-row"> |
|
|
<view class="amount-row"> |
|
|
<uni-icons :type="showDetailPanel ? 'up' : 'down'" size="18" color="#5e5e5e" style="margin-right: 8rpx;vertical-align: middle;" @tap="toggleDetailPanel" /> |
|
|
|
|
|
|
|
|
<uni-icons :type="showDetailPanel ? 'up' : 'down'" size="18" color="#5e5e5e" style="margin-right: 8rpx;vertical-align: middle;" @click="toggleDetailPanel" /> |
|
|
<text class="amount">¥{{priceRange.min}}-{{priceRange.max}}</text> |
|
|
<text class="amount">¥{{priceRange.min}}-{{priceRange.max}}</text> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
<button class="submit-btn" @tap="submitOrder">预约上门取件</button> |
|
|
|
|
|
|
|
|
<button class="submit-btn" @click="submitOrder">预约上门取件</button> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
<!-- 价格说明弹窗 --> |
|
|
|
|
|
<view v-if="showPriceInfoPopup" class="price-info-popup-mask" @click.self="closePriceInfoPopup"> |
|
|
|
|
|
<view class="price-info-popup"> |
|
|
|
|
|
<view class="price-info-popup-title">回收规则</view> |
|
|
|
|
|
<scroll-view class="price-info-popup-content" scroll-y> |
|
|
|
|
|
<view class="price-info-section"> |
|
|
|
|
|
<view class="price-info-heading">关于旧衣质检</view> |
|
|
|
|
|
<view class="price-info-text">请确认本次回收旧衣是可以进行二次穿着的程度，如回收旧衣有破损磨损、开线变形、起球发黄、染色污渍、配饰脱落或款式老旧等问题，无法通过质检。</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
<view class="price-info-section"> |
|
|
|
|
|
<view class="price-info-heading">质检报告</view> |
|
|
|
|
|
<view class="price-info-text">回收商收到衣后1-3个工作日内完成衣质检报告。</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
<view class="price-info-section"> |
|
|
|
|
|
<view class="price-info-heading">质检结果与回收价格</view> |
|
|
|
|
|
<view class="price-info-text">若回收旧衣质检通过，质检价格与用户提交订单时的预估价格一致，回收商将按照预估价打款至您的小程序账户余额。</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
</scroll-view> |
|
|
|
|
|
<button class="price-info-popup-btn" @click="closePriceInfoPopup">我知道了</button> |
|
|
|
|
|
</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
<!-- 根据角色显示不同的导航栏 --> |
|
|
<!-- 根据角色显示不同的导航栏 --> |
|
|
<uv-tabbar |
|
|
<uv-tabbar |
|
|
v-if="ishow" |
|
|
v-if="ishow" |
|
|
@ -197,7 +223,7 @@ |
|
|
<view v-if="showBrandPopup" class="brand-popup-mask"> |
|
|
<view v-if="showBrandPopup" class="brand-popup-mask"> |
|
|
<view class="brand-popup"> |
|
|
<view class="brand-popup"> |
|
|
<view class="brand-popup-header"> |
|
|
<view class="brand-popup-header"> |
|
|
<text class="brand-popup-close" @tap="closeBrandPopup">关闭</text> |
|
|
|
|
|
|
|
|
<text class="brand-popup-close" @click="closeBrandPopup">关闭</text> |
|
|
<text class="brand-popup-title">可回收的品牌</text> |
|
|
<text class="brand-popup-title">可回收的品牌</text> |
|
|
</view> |
|
|
</view> |
|
|
<view class="brand-popup-search"> |
|
|
<view class="brand-popup-search"> |
|
|
@ -206,28 +232,26 @@ |
|
|
<scroll-view class="brand-popup-list" scroll-y :scroll-into-view="scrollToView"> |
|
|
<scroll-view class="brand-popup-list" scroll-y :scroll-into-view="scrollToView"> |
|
|
<view v-for="letter in brandIndexList" :key="letter" :id="'brand-letter-' + letter"> |
|
|
<view v-for="letter in brandIndexList" :key="letter" :id="'brand-letter-' + letter"> |
|
|
<view class="brand-letter">{{letter}}</view> |
|
|
<view class="brand-letter">{{letter}}</view> |
|
|
<view v-for="brand in filteredBrandList.filter(b => b.letter === letter)" :key="brand.name" class="brand-item" @tap="openBrandConfirm(brand)"> |
|
|
|
|
|
|
|
|
<view v-for="brand in filteredBrandList.filter(b => b.letter === letter)" :key="brand.name" class="brand-item" @click="openBrandConfirm(brand)"> |
|
|
<image :src="brand.logo" class="brand-logo" mode="aspectFit" /> |
|
|
<image :src="brand.logo" class="brand-logo" mode="aspectFit" /> |
|
|
<text class="brand-name">{{brand.name}}</text> |
|
|
<text class="brand-name">{{brand.name}}</text> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</scroll-view> |
|
|
</scroll-view> |
|
|
<view class="brand-index-bar"> |
|
|
<view class="brand-index-bar"> |
|
|
<text v-for="letter in brandIndexList" :key="letter" :class="{active: currentLetter === letter}" @tap="scrollToLetter(letter)">{{letter}}</text> |
|
|
|
|
|
|
|
|
<text v-for="letter in brandIndexList" :key="letter" :class="{active: currentLetter === letter}" @click="scrollToLetter(letter)">{{letter}}</text> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
|
|
|
|
|
|
<!-- 回收规则弹窗 --> |
|
|
<!-- 回收规则弹窗 --> |
|
|
<view v-if="showRulePopup" class="rule-popup-mask" @tap.self="closeRulePopup"> |
|
|
|
|
|
|
|
|
<view v-if="showRulePopup" class="rule-popup-mask" @click.self="closeRulePopup"> |
|
|
<view class="rule-popup"> |
|
|
<view class="rule-popup"> |
|
|
<view class="rule-popup-title">回收规则</view> |
|
|
<view class="rule-popup-title">回收规则</view> |
|
|
<scroll-view class="rule-popup-content" scroll-y> |
|
|
<scroll-view class="rule-popup-content" scroll-y> |
|
|
<rich-text :nodes="ruleHtml"/> |
|
|
|
|
|
|
|
|
<rich-text :nodes="ruleHtml" /> |
|
|
</scroll-view> |
|
|
</scroll-view> |
|
|
<button class="rule-popup-btn" @tap="closeRulePopup" :class="{ disabled: ruleCountdown > 0 }"> |
|
|
|
|
|
{{ ruleCountdown > 0 ? `我知道了(${ruleCountdown}s)` : '我知道了' }} |
|
|
|
|
|
</button> |
|
|
|
|
|
|
|
|
<button class="rule-popup-btn" @click="closeRulePopup">我知道了</button> |
|
|
<!-- <view class="rule-popup-close" @tap="closeRulePopup"> |
|
|
<!-- <view class="rule-popup-close" @tap="closeRulePopup"> |
|
|
<uni-icons type="close" size="36" color="#fff" /> |
|
|
<uni-icons type="close" size="36" color="#fff" /> |
|
|
</view> --> |
|
|
</view> --> |
|
|
@ -239,20 +263,20 @@ |
|
|
<view class="pickup-confirm-popup"> |
|
|
<view class="pickup-confirm-popup"> |
|
|
<view class="pickup-confirm-title">温馨提示</view> |
|
|
<view class="pickup-confirm-title">温馨提示</view> |
|
|
<view class="pickup-confirm-content"> |
|
|
<view class="pickup-confirm-content"> |
|
|
1.当前回收快递免费上门，由于快递成本较高，为避免不必要的成本及资源二次浪费不属于可回收品类或不符合回收标准的物品请勿寄出。<br/><br/> |
|
|
|
|
|
2.已通过的回收物品将正常结算。不符合回收要求的物品可选择快递取回，运费自付。请在订单结算后48小时内联系在线客服安排取回，逾期未联系将默认捐赠，无法再次取回。<br/><br/> |
|
|
|
|
|
3.若用户寄出大量不可回收的物品，平台有权限制下次回收权限，或取消下次包邮服务。<br/><br/> |
|
|
|
|
|
4.对于合格率高的回收订单，平台将根据实际情况，给予额外回收奖励。 |
|
|
|
|
|
|
|
|
<view class="confirm-item confirm-item-red">1.当前回收快递免费上门，由于快递成本较高，为避免不必要的成本及资源二次浪费不属于可回收品类或不符合回收标准的物品请勿寄出。</view> |
|
|
|
|
|
<view class="confirm-item">2.已通过的回收物品将正常结算。不符合回收要求的物品可选择快递取回，运费自付。请在订单结算后48小时内联系在线客服安排取回，逾期未联系将默认捐赠，无法再次取回。</view> |
|
|
|
|
|
<view class="confirm-item">3.若用户寄出大量不可回收的物品，平台有权限制下次回收权限，或取消下次包邮服务。</view> |
|
|
|
|
|
<view class="confirm-item">4.对于合格率高的回收订单，平台将根据实际情况，给予额外回收奖励。</view> |
|
|
</view> |
|
|
</view> |
|
|
<view class="pickup-confirm-btn-row"> |
|
|
<view class="pickup-confirm-btn-row"> |
|
|
<button class="pickup-confirm-btn" @tap="handlePickupCancel">取消回收</button> |
|
|
|
|
|
<button class="pickup-confirm-btn agree" @tap="handlePickupAgree">我同意</button> |
|
|
|
|
|
|
|
|
<button class="pickup-confirm-btn" @click="handlePickupCancel">取消回收</button> |
|
|
|
|
|
<button class="pickup-confirm-btn agree" @click="handlePickupAgree">我同意</button> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
|
|
|
|
|
|
<!-- 品牌确认弹窗 --> |
|
|
<!-- 品牌确认弹窗 --> |
|
|
<view v-if="showBrandConfirm" class="brand-confirm-mask" @tap.self="closeBrandConfirm"> |
|
|
|
|
|
|
|
|
<view v-if="showBrandConfirm" class="brand-confirm-mask" @click.self="closeBrandConfirm"> |
|
|
<view class="brand-confirm-popup"> |
|
|
<view class="brand-confirm-popup"> |
|
|
<view class="brand-confirm-title">品牌确认提示</view> |
|
|
<view class="brand-confirm-title">品牌确认提示</view> |
|
|
<view class="brand-confirm-logo-wrap"> |
|
|
<view class="brand-confirm-logo-wrap"> |
|
|
@ -261,8 +285,8 @@ |
|
|
<view class="brand-confirm-name">{{ brandConfirmInfo.name }}</view> |
|
|
<view class="brand-confirm-name">{{ brandConfirmInfo.name }}</view> |
|
|
<view class="brand-confirm-desc">请确认所选品牌是否与实物品牌信息一致，否则将无法进行回收。</view> |
|
|
<view class="brand-confirm-desc">请确认所选品牌是否与实物品牌信息一致，否则将无法进行回收。</view> |
|
|
<view class="brand-confirm-btn-row"> |
|
|
<view class="brand-confirm-btn-row"> |
|
|
<button class="brand-confirm-btn retry" @tap="closeBrandConfirm">重新选择</button> |
|
|
|
|
|
<button class="brand-confirm-btn confirm" @tap="confirmBrand">确认一致</button> |
|
|
|
|
|
|
|
|
<button class="brand-confirm-btn retry" @click="closeBrandConfirm">重新选择</button> |
|
|
|
|
|
<button class="brand-confirm-btn confirm" @click="confirmBrand">确认一致</button> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
@ -304,10 +328,8 @@ export default { |
|
|
loadingMore: false, |
|
|
loadingMore: false, |
|
|
finished: false, |
|
|
finished: false, |
|
|
pendingBrandIndex: null, // 记录待加一的品牌商品index |
|
|
pendingBrandIndex: null, // 记录待加一的品牌商品index |
|
|
shownRuleItems: new Set(), // 记录已经显示过规则弹窗的商品ID |
|
|
|
|
|
ruleCountdown: 0, // 规则弹窗倒计时 |
|
|
|
|
|
ruleCountdownTimer: null, // 倒计时定时器 |
|
|
|
|
|
pendingAddItem: null, // 待添加的商品信息 |
|
|
|
|
|
|
|
|
showPriceInfoPopup: false, |
|
|
|
|
|
isWaitingForBrandSelection: false, // 等待品牌选择的标志 |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
computed: { |
|
|
computed: { |
|
|
@ -357,9 +379,22 @@ export default { |
|
|
categories() { |
|
|
categories() { |
|
|
const list = getApp().globalData.pricePreviewList || [] |
|
|
const list = getApp().globalData.pricePreviewList || [] |
|
|
return list.filter(item => item.pid === '0').sort((a, b) => a.sort - b.sort) |
|
|
return list.filter(item => item.pid === '0').sort((a, b) => a.sort - b.sort) |
|
|
|
|
|
}, |
|
|
|
|
|
minMoney() { |
|
|
|
|
|
const config = getApp().globalData.configData || []; |
|
|
|
|
|
const item = config.find(i => i.keyName === 'min_money'); |
|
|
|
|
|
return item ? parseFloat(item.keyContent) : 0; |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
methods: { |
|
|
methods: { |
|
|
|
|
|
showPriceInfoPopups() { |
|
|
|
|
|
console.log('showPriceInfoPopup called'); |
|
|
|
|
|
this.showPriceInfoPopup = true |
|
|
|
|
|
}, |
|
|
|
|
|
closePriceInfoPopup() { |
|
|
|
|
|
console.log('closePriceInfoPopup called'); |
|
|
|
|
|
this.showPriceInfoPopup = false |
|
|
|
|
|
}, |
|
|
changeTo(e){ |
|
|
changeTo(e){ |
|
|
this.value = e |
|
|
this.value = e |
|
|
if(e==2){ |
|
|
if(e==2){ |
|
|
@ -411,37 +446,16 @@ export default { |
|
|
const categoryId = this.categories[this.currentCategory]?.id |
|
|
const categoryId = this.categories[this.currentCategory]?.id |
|
|
const item = this.allProducts[categoryId]?.[index] |
|
|
const item = this.allProducts[categoryId]?.[index] |
|
|
if (!item) return |
|
|
if (!item) return |
|
|
|
|
|
|
|
|
const currentQuantity = item.quantity || 0 |
|
|
|
|
|
let newQuantity = currentQuantity + delta |
|
|
|
|
|
if (newQuantity < 0) newQuantity = 0 |
|
|
|
|
|
|
|
|
|
|
|
// 如果是第一次添加商品（从0变为1）且未显示过规则弹窗 |
|
|
|
|
|
if (currentQuantity === 0 && delta > 0 && !this.shownRuleItems.has(item.id)) { |
|
|
|
|
|
// 品牌商品需要先选择品牌 |
|
|
|
|
|
if (item.shopCion) { |
|
|
|
|
|
this.pendingBrandIndex = index |
|
|
|
|
|
this.getGoodsBrandList(item.shopCion) |
|
|
|
|
|
this.showBrandPopup = true |
|
|
|
|
|
return |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
// 普通商品直接显示规则弹窗 |
|
|
|
|
|
this.pendingAddItem = { categoryId, index, item } |
|
|
|
|
|
this.showRulesWithCountdown(item) |
|
|
|
|
|
return |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
// 品牌商品且数量为0且加一时弹出品牌索引弹窗（非第一次添加或已显示过规则） |
|
|
|
|
|
if (item.shopCion && currentQuantity === 0 && delta > 0) { |
|
|
|
|
|
|
|
|
// 品牌商品且数量为0且加一时 |
|
|
|
|
|
if (item.isPin === 'Y' && (item.quantity || 0) === 0 && delta > 0) { |
|
|
this.pendingBrandIndex = index |
|
|
this.pendingBrandIndex = index |
|
|
this.getGoodsBrandList(item.shopCion) |
|
|
|
|
|
this.showBrandPopup = true |
|
|
|
|
|
|
|
|
this.isWaitingForBrandSelection = true; |
|
|
|
|
|
this.showRules(item); // 先显示回收规则 |
|
|
return |
|
|
return |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
// 直接更新数量 |
|
|
|
|
|
this.$set(item, 'quantity', newQuantity) |
|
|
|
|
|
|
|
|
let newQuantity = (item.quantity || 0) + delta |
|
|
|
|
|
if (newQuantity < 0) newQuantity = 0 |
|
|
|
|
|
this.$set(item, 'quantity', newQuantity) |
|
|
}, |
|
|
}, |
|
|
// 显示回收规则 |
|
|
// 显示回收规则 |
|
|
showRules(item) { |
|
|
showRules(item) { |
|
|
@ -455,32 +469,6 @@ export default { |
|
|
this.showRulePopup = true |
|
|
this.showRulePopup = true |
|
|
}) |
|
|
}) |
|
|
}, |
|
|
}, |
|
|
|
|
|
|
|
|
// 显示带倒计时的回收规则弹窗 |
|
|
|
|
|
showRulesWithCountdown(item) { |
|
|
|
|
|
// 获取回收规则富文本 |
|
|
|
|
|
this.$api('getGoodsRecycleRule', { goodsId: item.id }, res => { |
|
|
|
|
|
if (res.code === 200 && res.result) { |
|
|
|
|
|
this.ruleHtml = res.result |
|
|
|
|
|
} else { |
|
|
|
|
|
this.ruleHtml = '<p>暂无回收规则</p>' |
|
|
|
|
|
} |
|
|
|
|
|
this.showRulePopup = true |
|
|
|
|
|
this.startRuleCountdown() |
|
|
|
|
|
}) |
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
// 开始规则弹窗倒计时 |
|
|
|
|
|
startRuleCountdown() { |
|
|
|
|
|
this.ruleCountdown = 3 |
|
|
|
|
|
this.ruleCountdownTimer = setInterval(() => { |
|
|
|
|
|
this.ruleCountdown-- |
|
|
|
|
|
if (this.ruleCountdown <= 0) { |
|
|
|
|
|
clearInterval(this.ruleCountdownTimer) |
|
|
|
|
|
this.ruleCountdownTimer = null |
|
|
|
|
|
} |
|
|
|
|
|
}, 1000) |
|
|
|
|
|
}, |
|
|
|
|
|
showMore() { |
|
|
showMore() { |
|
|
uni.showToast({ |
|
|
uni.showToast({ |
|
|
title: '更多规则请咨询客服', |
|
|
title: '更多规则请咨询客服', |
|
|
@ -488,9 +476,16 @@ export default { |
|
|
}) |
|
|
}) |
|
|
}, |
|
|
}, |
|
|
submitOrder() { |
|
|
submitOrder() { |
|
|
if (this.totalCount === 0) { |
|
|
|
|
|
|
|
|
if (this.totalCount < 3) { |
|
|
|
|
|
uni.showToast({ |
|
|
|
|
|
title: '各品类混合需要满3件才能回收哦', |
|
|
|
|
|
icon: 'none' |
|
|
|
|
|
}) |
|
|
|
|
|
return |
|
|
|
|
|
} |
|
|
|
|
|
if (Number(this.totalPrice) < this.minMoney) { |
|
|
uni.showToast({ |
|
|
uni.showToast({ |
|
|
title: '请选择要回收的物品', |
|
|
|
|
|
|
|
|
title: `回收总价需满${this.minMoney}元才能预约`, |
|
|
icon: 'none' |
|
|
icon: 'none' |
|
|
}) |
|
|
}) |
|
|
return |
|
|
return |
|
|
@ -540,6 +535,9 @@ export default { |
|
|
}, |
|
|
}, |
|
|
closeBrandPopup() { |
|
|
closeBrandPopup() { |
|
|
this.showBrandPopup = false |
|
|
this.showBrandPopup = false |
|
|
|
|
|
// 如果用户取消品牌选择，重置状态 |
|
|
|
|
|
this.pendingBrandIndex = null; |
|
|
|
|
|
this.isWaitingForBrandSelection = false; |
|
|
}, |
|
|
}, |
|
|
scrollToLetter(letter) { |
|
|
scrollToLetter(letter) { |
|
|
this.currentLetter = letter |
|
|
this.currentLetter = letter |
|
|
@ -587,29 +585,19 @@ export default { |
|
|
this.showRulePopup = true |
|
|
this.showRulePopup = true |
|
|
}, |
|
|
}, |
|
|
closeRulePopup() { |
|
|
closeRulePopup() { |
|
|
// 倒计时未结束时不能关闭 |
|
|
|
|
|
if (this.ruleCountdown > 0) { |
|
|
|
|
|
uni.showToast({ |
|
|
|
|
|
title: `请阅读完规则，还需等待${this.ruleCountdown}秒`, |
|
|
|
|
|
icon: 'none' |
|
|
|
|
|
}) |
|
|
|
|
|
return |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
this.showRulePopup = false |
|
|
|
|
|
this.ruleCountdown = 0 |
|
|
|
|
|
if (this.ruleCountdownTimer) { |
|
|
|
|
|
clearInterval(this.ruleCountdownTimer) |
|
|
|
|
|
this.ruleCountdownTimer = null |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
// 如果有待添加的商品，现在添加它 |
|
|
|
|
|
if (this.pendingAddItem) { |
|
|
|
|
|
const { categoryId, index, item } = this.pendingAddItem |
|
|
|
|
|
this.$set(item, 'quantity', 1) |
|
|
|
|
|
// 记录该商品已显示过规则弹窗 |
|
|
|
|
|
this.shownRuleItems.add(item.id) |
|
|
|
|
|
this.pendingAddItem = null |
|
|
|
|
|
|
|
|
this.showRulePopup = false; |
|
|
|
|
|
// 如果是在等待品牌选择的状态下关闭规则弹窗，则接着打开品牌选择 |
|
|
|
|
|
if (this.isWaitingForBrandSelection) { |
|
|
|
|
|
this.isWaitingForBrandSelection = false; // 清除等待状态 |
|
|
|
|
|
const categoryId = this.categories[this.currentCategory]?.id; |
|
|
|
|
|
const item = this.allProducts[categoryId]?.[this.pendingBrandIndex]; |
|
|
|
|
|
if (item?.isPin === 'Y') { |
|
|
|
|
|
this.getGoodsBrandList(item.shopCion); |
|
|
|
|
|
this.showBrandPopup = true; // 打开品牌索引弹窗 |
|
|
|
|
|
} else { |
|
|
|
|
|
// 如果商品不是品牌商品，或者出现意外情况，重置状态 |
|
|
|
|
|
this.pendingBrandIndex = null; |
|
|
|
|
|
} |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
loadMoreGoods() { |
|
|
loadMoreGoods() { |
|
|
@ -634,6 +622,7 @@ export default { |
|
|
}, |
|
|
}, |
|
|
openBrandConfirm(brand) { |
|
|
openBrandConfirm(brand) { |
|
|
this.brandConfirmInfo = { |
|
|
this.brandConfirmInfo = { |
|
|
|
|
|
id: brand.id, |
|
|
logo: brand.logo, |
|
|
logo: brand.logo, |
|
|
name: brand.name |
|
|
name: brand.name |
|
|
} |
|
|
} |
|
|
@ -645,19 +634,13 @@ export default { |
|
|
confirmBrand() { |
|
|
confirmBrand() { |
|
|
this.showBrandConfirm = false |
|
|
this.showBrandConfirm = false |
|
|
this.showBrandPopup = false |
|
|
this.showBrandPopup = false |
|
|
// 确认后将待加一的商品数量+1 |
|
|
|
|
|
|
|
|
// 确认后将待加一的商品数量+1，并记录品牌ID |
|
|
if (this.pendingBrandIndex !== null) { |
|
|
if (this.pendingBrandIndex !== null) { |
|
|
const categoryId = this.categories[this.currentCategory]?.id |
|
|
const categoryId = this.categories[this.currentCategory]?.id |
|
|
const item = this.allProducts[categoryId]?.[this.pendingBrandIndex] |
|
|
const item = this.allProducts[categoryId]?.[this.pendingBrandIndex] |
|
|
if (item) { |
|
|
if (item) { |
|
|
// 如果是第一次添加且未显示过规则弹窗，需要先显示规则弹窗 |
|
|
|
|
|
if ((item.quantity || 0) === 0 && !this.shownRuleItems.has(item.id)) { |
|
|
|
|
|
this.pendingAddItem = { categoryId, index: this.pendingBrandIndex, item } |
|
|
|
|
|
this.showRulesWithCountdown(item) |
|
|
|
|
|
} else { |
|
|
|
|
|
// 直接添加数量 |
|
|
|
|
|
this.$set(item, 'quantity', 1) |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
this.$set(item, 'quantity', 1) |
|
|
|
|
|
this.$set(item, 'pinId', this.brandConfirmInfo.id); |
|
|
} |
|
|
} |
|
|
this.pendingBrandIndex = null |
|
|
this.pendingBrandIndex = null |
|
|
} |
|
|
} |
|
|
@ -670,6 +653,7 @@ export default { |
|
|
// 获取品牌名称的拼音首字母 |
|
|
// 获取品牌名称的拼音首字母 |
|
|
const firstChar = this.getPinyinFirstLetter(item.name) |
|
|
const firstChar = this.getPinyinFirstLetter(item.name) |
|
|
return { |
|
|
return { |
|
|
|
|
|
id: item.id, |
|
|
logo: item.image || '/static/brand/alexander.png', |
|
|
logo: item.image || '/static/brand/alexander.png', |
|
|
name: item.name, |
|
|
name: item.name, |
|
|
letter: firstChar |
|
|
letter: firstChar |
|
|
@ -690,14 +674,9 @@ export default { |
|
|
return key.charAt(0).toUpperCase() |
|
|
return key.charAt(0).toUpperCase() |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
let index = this.brandIndexList.indexOf(firstChar.toUpperCase()) |
|
|
|
|
|
if (index != -1) { |
|
|
|
|
|
return this.brandIndexList[index] |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
return '#' |
|
|
return '#' |
|
|
}, |
|
|
}, |
|
|
|
|
|
|
|
|
}, |
|
|
}, |
|
|
created() { |
|
|
created() { |
|
|
this.currentCategory = 0 |
|
|
this.currentCategory = 0 |
|
|
@ -751,11 +730,6 @@ export default { |
|
|
uni.$off('bannerListUpdated') |
|
|
uni.$off('bannerListUpdated') |
|
|
// 移除事件监听 |
|
|
// 移除事件监听 |
|
|
uni.$off('clearRecycleOrderData') |
|
|
uni.$off('clearRecycleOrderData') |
|
|
// 清理倒计时定时器 |
|
|
|
|
|
if (this.ruleCountdownTimer) { |
|
|
|
|
|
clearInterval(this.ruleCountdownTimer) |
|
|
|
|
|
this.ruleCountdownTimer = null |
|
|
|
|
|
} |
|
|
|
|
|
}, |
|
|
}, |
|
|
onShow() { |
|
|
onShow() { |
|
|
const id = getApp().globalData.targetRecycleCategoryId |
|
|
const id = getApp().globalData.targetRecycleCategoryId |
|
|
@ -835,10 +809,11 @@ export default { |
|
|
.banner { |
|
|
.banner { |
|
|
background: linear-gradient(135deg, #ff9500,#ff5e00); |
|
|
background: linear-gradient(135deg, #ff9500,#ff5e00); |
|
|
position: relative; |
|
|
position: relative; |
|
|
|
|
|
height: 350rpx; |
|
|
z-index: 1; |
|
|
z-index: 1; |
|
|
image { |
|
|
image { |
|
|
width: 100%; |
|
|
width: 100%; |
|
|
height: 100%; |
|
|
|
|
|
|
|
|
height: 90%; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
@ -871,11 +846,11 @@ export default { |
|
|
} |
|
|
} |
|
|
.category-item { |
|
|
.category-item { |
|
|
position: relative; |
|
|
position: relative; |
|
|
padding: 30rpx 10rpx; |
|
|
|
|
|
|
|
|
padding: 28rpx 20rpx; |
|
|
text-align: center; |
|
|
text-align: center; |
|
|
font-family: PingFang SC; |
|
|
font-family: PingFang SC; |
|
|
font-weight: 600; |
|
|
font-weight: 600; |
|
|
font-size: 30rpx; |
|
|
|
|
|
|
|
|
font-size: 15px; |
|
|
line-height: 100%; |
|
|
line-height: 100%; |
|
|
letter-spacing: 0px; |
|
|
letter-spacing: 0px; |
|
|
color: #666; |
|
|
color: #666; |
|
|
@ -884,10 +859,16 @@ export default { |
|
|
position: absolute; |
|
|
position: absolute; |
|
|
top: 15rpx; |
|
|
top: 15rpx; |
|
|
right: 15rpx; |
|
|
right: 15rpx; |
|
|
width: 12rpx; |
|
|
|
|
|
height: 12rpx; |
|
|
|
|
|
|
|
|
min-width: 32rpx; |
|
|
|
|
|
height: 32rpx; |
|
|
|
|
|
padding: 0 6rpx; |
|
|
background: #ff7a0e; |
|
|
background: #ff7a0e; |
|
|
border-radius: 50%; |
|
|
|
|
|
|
|
|
border-radius: 16rpx; |
|
|
|
|
|
color: #fff; |
|
|
|
|
|
font-size: 20rpx; |
|
|
|
|
|
text-align: center; |
|
|
|
|
|
line-height: 32rpx; |
|
|
|
|
|
box-sizing: border-box; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
&.active { |
|
|
&.active { |
|
|
@ -914,7 +895,7 @@ export default { |
|
|
.goods-content { |
|
|
.goods-content { |
|
|
flex: 1; |
|
|
flex: 1; |
|
|
height: 100%; |
|
|
height: 100%; |
|
|
padding: 0 20rpx; |
|
|
|
|
|
|
|
|
padding: 0 30rpx; |
|
|
background: #ffffff; |
|
|
background: #ffffff; |
|
|
width: 70%; |
|
|
width: 70%; |
|
|
margin: 1rpx; |
|
|
margin: 1rpx; |
|
|
@ -937,8 +918,8 @@ export default { |
|
|
border-bottom: 1rpx solid #f5f5f5; |
|
|
border-bottom: 1rpx solid #f5f5f5; |
|
|
|
|
|
|
|
|
.goods-item-img { |
|
|
.goods-item-img { |
|
|
width: 160rpx; |
|
|
|
|
|
height: 180rpx; |
|
|
|
|
|
|
|
|
width: 120rpx; |
|
|
|
|
|
height: 120rpx; |
|
|
border-radius: 24rpx; |
|
|
border-radius: 24rpx; |
|
|
background: #f8f8f8; |
|
|
background: #f8f8f8; |
|
|
margin-right: 28rpx; |
|
|
margin-right: 28rpx; |
|
|
@ -954,7 +935,6 @@ export default { |
|
|
} |
|
|
} |
|
|
.goods-header { |
|
|
.goods-header { |
|
|
display: flex; |
|
|
display: flex; |
|
|
|
|
|
|
|
|
justify-content: space-between; |
|
|
justify-content: space-between; |
|
|
align-items: center; |
|
|
align-items: center; |
|
|
margin-bottom: 10rpx; |
|
|
margin-bottom: 10rpx; |
|
|
@ -969,10 +949,32 @@ export default { |
|
|
vertical-align: middle; |
|
|
vertical-align: middle; |
|
|
color: #333; |
|
|
color: #333; |
|
|
font-weight: bold; |
|
|
font-weight: bold; |
|
|
overflow:hidden; //超出的文本隐藏 |
|
|
|
|
|
text-overflow:ellipsis; //溢出用省略号显示 |
|
|
|
|
|
white-space:nowrap; //溢出不换行 |
|
|
|
|
|
width: 160rpx; |
|
|
|
|
|
|
|
|
flex-shrink: 1; |
|
|
|
|
|
flex-grow: 1; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.brand-check-placeholder { |
|
|
|
|
|
flex-shrink: 0; |
|
|
|
|
|
margin-left: 10rpx; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.brand-check { |
|
|
|
|
|
display: flex; |
|
|
|
|
|
flex-direction: row; |
|
|
|
|
|
align-items: center; |
|
|
|
|
|
justify-content: center; |
|
|
|
|
|
border: 1px solid #f8a01d; |
|
|
|
|
|
border-radius: 8rpx; |
|
|
|
|
|
color: #ff7a0e; |
|
|
|
|
|
font-family: PingFang SC; |
|
|
|
|
|
font-weight: 400; |
|
|
|
|
|
font-size: 12px; |
|
|
|
|
|
padding: 4rpx 10rpx; |
|
|
|
|
|
line-height: 1; |
|
|
|
|
|
white-space: nowrap; |
|
|
|
|
|
text { |
|
|
|
|
|
margin-right: 4rpx; |
|
|
|
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.goods-desc { |
|
|
.goods-desc { |
|
|
@ -980,6 +982,9 @@ export default { |
|
|
color: #999; |
|
|
color: #999; |
|
|
display: block; |
|
|
display: block; |
|
|
margin-bottom: 20rpx; |
|
|
margin-bottom: 20rpx; |
|
|
|
|
|
white-space: nowrap; |
|
|
|
|
|
overflow: hidden; |
|
|
|
|
|
text-overflow: ellipsis; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.goods-info { |
|
|
.goods-info { |
|
|
@ -1024,7 +1029,7 @@ export default { |
|
|
justify-content: center; |
|
|
justify-content: center; |
|
|
font-size: 28rpx; |
|
|
font-size: 28rpx; |
|
|
color: #666; |
|
|
color: #666; |
|
|
background: #f8f8f8; |
|
|
|
|
|
|
|
|
background: #ffffff; |
|
|
border: none; |
|
|
border: none; |
|
|
border-radius: 50%; |
|
|
border-radius: 50%; |
|
|
|
|
|
|
|
|
@ -1045,41 +1050,22 @@ export default { |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.brand-check { |
|
|
|
|
|
// margin-top: 20rpx; |
|
|
|
|
|
// margin:0 auto; |
|
|
|
|
|
|
|
|
.rules-link { |
|
|
|
|
|
margin-top: 20rpx; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.rules-link .rules { |
|
|
display: flex; |
|
|
display: flex; |
|
|
flex-direction: row; |
|
|
|
|
|
align-items: center; |
|
|
align-items: center; |
|
|
// justify-content: center; |
|
|
|
|
|
border: 1px solid #f8a01d; |
|
|
|
|
|
width: 40%; |
|
|
|
|
|
// background: #fff7f0; |
|
|
|
|
|
border-radius: 8rpx; |
|
|
|
|
|
color: #ff7a0e; |
|
|
|
|
|
font-family: PingFang SC; |
|
|
font-family: PingFang SC; |
|
|
font-weight: 400; |
|
|
font-weight: 400; |
|
|
font-size: 12px; |
|
|
font-size: 12px; |
|
|
line-height: 140%; |
|
|
line-height: 140%; |
|
|
letter-spacing: 0%; |
|
|
letter-spacing: 0%; |
|
|
text { |
|
|
|
|
|
// margin-right: 8rpx; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
color: #666; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.rules-link{ |
|
|
|
|
|
flex-shrink: 0; |
|
|
|
|
|
.rules{ |
|
|
|
|
|
font-family: PingFang SC; |
|
|
|
|
|
font-weight: 400; |
|
|
|
|
|
font-size: 12px; |
|
|
|
|
|
line-height: 140%; |
|
|
|
|
|
letter-spacing: 0%; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.other-unrecycle-card { |
|
|
.other-unrecycle-card { |
|
|
display: flex; |
|
|
display: flex; |
|
|
align-items: center; |
|
|
align-items: center; |
|
|
@ -1090,8 +1076,8 @@ export default { |
|
|
margin: 30rpx 0 0 0; |
|
|
margin: 30rpx 0 0 0; |
|
|
} |
|
|
} |
|
|
.other-unrecycle-img { |
|
|
.other-unrecycle-img { |
|
|
width: 160rpx; |
|
|
|
|
|
height: 180rpx; |
|
|
|
|
|
|
|
|
width: 120rpx; |
|
|
|
|
|
height: 120rpx; |
|
|
border-radius: 24rpx; |
|
|
border-radius: 24rpx; |
|
|
background: #f8f8f8; |
|
|
background: #f8f8f8; |
|
|
margin-right: 28rpx; |
|
|
margin-right: 28rpx; |
|
|
@ -1113,13 +1099,9 @@ export default { |
|
|
word-break: break-all; |
|
|
word-break: break-all; |
|
|
white-space: normal; |
|
|
white-space: normal; |
|
|
overflow: visible; |
|
|
overflow: visible; |
|
|
overflow:hidden; //超出的文本隐藏 |
|
|
|
|
|
text-overflow:ellipsis; //溢出用省略号显示 |
|
|
|
|
|
white-space:nowrap; //溢出不换行 |
|
|
|
|
|
width: 280rpx; |
|
|
|
|
|
} |
|
|
} |
|
|
.other-unrecycle-desc { |
|
|
.other-unrecycle-desc { |
|
|
font-size: 20rpx; |
|
|
|
|
|
|
|
|
font-size: 24rpx; |
|
|
color: #999; |
|
|
color: #999; |
|
|
margin-bottom: 12rpx; |
|
|
margin-bottom: 12rpx; |
|
|
text-overflow: ellipsis; |
|
|
text-overflow: ellipsis; |
|
|
@ -1140,14 +1122,13 @@ export default { |
|
|
height: 60rpx; |
|
|
height: 60rpx; |
|
|
margin-left: 24rpx; |
|
|
margin-left: 24rpx; |
|
|
border-radius: 50%; |
|
|
border-radius: 50%; |
|
|
background: #f5f5f5; |
|
|
|
|
|
color: #ccc; |
|
|
|
|
|
|
|
|
background: #fff; |
|
|
|
|
|
color: #666; |
|
|
font-size: 36rpx; |
|
|
font-size: 36rpx; |
|
|
border: none; |
|
|
border: none; |
|
|
display: flex; |
|
|
display: flex; |
|
|
align-items: center; |
|
|
align-items: center; |
|
|
justify-content: center; |
|
|
justify-content: center; |
|
|
pointer-events: none; |
|
|
|
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.fixed-bottom-wrap { |
|
|
.fixed-bottom-wrap { |
|
|
@ -1385,7 +1366,7 @@ export default { |
|
|
justify-content: center; |
|
|
justify-content: center; |
|
|
font-size: 32rpx; |
|
|
font-size: 32rpx; |
|
|
color: #666; |
|
|
color: #666; |
|
|
background: #f5f5f5; |
|
|
|
|
|
|
|
|
background: #ffffff; |
|
|
border: none; |
|
|
border: none; |
|
|
border-radius: 50%; |
|
|
border-radius: 50%; |
|
|
&::after { |
|
|
&::after { |
|
|
@ -1672,14 +1653,6 @@ export default { |
|
|
&:active { |
|
|
&:active { |
|
|
opacity: 0.9; |
|
|
opacity: 0.9; |
|
|
} |
|
|
} |
|
|
&.disabled { |
|
|
|
|
|
background: #ccc; |
|
|
|
|
|
color: #999; |
|
|
|
|
|
box-shadow: none; |
|
|
|
|
|
&:active { |
|
|
|
|
|
opacity: 1; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
} |
|
|
.rule-popup-close { |
|
|
.rule-popup-close { |
|
|
position: absolute; |
|
|
position: absolute; |
|
|
@ -1729,11 +1702,21 @@ export default { |
|
|
margin-bottom: 24rpx; |
|
|
margin-bottom: 24rpx; |
|
|
} |
|
|
} |
|
|
.pickup-confirm-content { |
|
|
.pickup-confirm-content { |
|
|
|
|
|
width: 100%; |
|
|
font-size: 26rpx; |
|
|
font-size: 26rpx; |
|
|
color: #333; |
|
|
color: #333; |
|
|
text-align: left; |
|
|
text-align: left; |
|
|
line-height: 1.7; |
|
|
line-height: 1.7; |
|
|
margin-bottom: 36rpx; |
|
|
margin-bottom: 36rpx; |
|
|
|
|
|
.confirm-item { |
|
|
|
|
|
margin-bottom: 24rpx; |
|
|
|
|
|
&:last-child { |
|
|
|
|
|
margin-bottom: 0; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
.confirm-item-red { |
|
|
|
|
|
color: red; |
|
|
|
|
|
} |
|
|
} |
|
|
} |
|
|
.pickup-confirm-btn-row { |
|
|
.pickup-confirm-btn-row { |
|
|
width: 100%; |
|
|
width: 100%; |
|
|
@ -1861,4 +1844,77 @@ export default { |
|
|
color: #fff; |
|
|
color: #fff; |
|
|
border: none; |
|
|
border: none; |
|
|
} |
|
|
} |
|
|
|
|
|
.price-info-popup-mask { |
|
|
|
|
|
position: fixed; |
|
|
|
|
|
left: 0; |
|
|
|
|
|
right: 0; |
|
|
|
|
|
top: 0; |
|
|
|
|
|
bottom: 0; |
|
|
|
|
|
background: rgba(0,0,0,0.4); |
|
|
|
|
|
z-index: 6000; |
|
|
|
|
|
display: flex; |
|
|
|
|
|
align-items: center; |
|
|
|
|
|
justify-content: center; |
|
|
|
|
|
} |
|
|
|
|
|
.price-info-popup { |
|
|
|
|
|
width: 85vw; |
|
|
|
|
|
max-width: 600rpx; |
|
|
|
|
|
background: #fff; |
|
|
|
|
|
border-radius: 24rpx; |
|
|
|
|
|
box-shadow: 0 8rpx 32rpx rgba(0,0,0,0.12); |
|
|
|
|
|
display: flex; |
|
|
|
|
|
flex-direction: column; |
|
|
|
|
|
align-items: center; |
|
|
|
|
|
position: relative; |
|
|
|
|
|
padding: 40rpx 40rpx; |
|
|
|
|
|
.price-info-popup-title { |
|
|
|
|
|
font-size: 34rpx; |
|
|
|
|
|
color: #333; |
|
|
|
|
|
font-weight: bold; |
|
|
|
|
|
text-align: center; |
|
|
|
|
|
margin-bottom: 30rpx; |
|
|
|
|
|
} |
|
|
|
|
|
.price-info-popup-content { |
|
|
|
|
|
width: 100%; |
|
|
|
|
|
max-height: 50vh; |
|
|
|
|
|
.price-info-section { |
|
|
|
|
|
margin-bottom: 30rpx; |
|
|
|
|
|
&:last-child { |
|
|
|
|
|
margin-bottom: 0; |
|
|
|
|
|
} |
|
|
|
|
|
.price-info-heading { |
|
|
|
|
|
font-size: 28rpx; |
|
|
|
|
|
color: #333; |
|
|
|
|
|
font-weight: 500; |
|
|
|
|
|
margin-bottom: 15rpx; |
|
|
|
|
|
} |
|
|
|
|
|
.price-info-text { |
|
|
|
|
|
font-size: 26rpx; |
|
|
|
|
|
color: #666; |
|
|
|
|
|
line-height: 1.6; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
.price-info-popup-btn { |
|
|
|
|
|
width: 100%; |
|
|
|
|
|
height: 88rpx; |
|
|
|
|
|
background: linear-gradient(to right, #ffd01e, #ff8917); |
|
|
|
|
|
border-radius: 44rpx; |
|
|
|
|
|
color: #fff; |
|
|
|
|
|
font-size: 32rpx; |
|
|
|
|
|
font-weight: bold; |
|
|
|
|
|
display: flex; |
|
|
|
|
|
align-items: center; |
|
|
|
|
|
justify-content: center; |
|
|
|
|
|
border: none; |
|
|
|
|
|
margin-top: 40rpx; |
|
|
|
|
|
box-shadow: 0 4rpx 16rpx rgba(255, 156, 0, 0.08); |
|
|
|
|
|
&::after { |
|
|
|
|
|
border: none; |
|
|
|
|
|
} |
|
|
|
|
|
&:active { |
|
|
|
|
|
opacity: 0.9; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
</style> |
|
|
</style> |
