827 lines
23 KiB
Vue
827 lines
23 KiB
Vue
<template>
|
||
<view class="gift-page">
|
||
<view class="cate-wrap">
|
||
<view class="cate-list">
|
||
<view
|
||
v-for="(item, index) in cateList"
|
||
:key="index"
|
||
:class="cateIndex === index ? 'curr' : ''"
|
||
class="cate-item"
|
||
@click="cateItemClickHanlde(item, index)"
|
||
>
|
||
{{ item.name }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="list-wrap">
|
||
<block v-if="isLoad">
|
||
<view v-if="cateIndex === 0" class="list-body">
|
||
<block v-if="sendList.length > 0">
|
||
<view
|
||
|
||
v-for="(item, index) in sendList"
|
||
:key="index"
|
||
class="gift-item"
|
||
>
|
||
<view
|
||
v-if="item.badgeText"
|
||
:class="['gift-badge',['wholesalerCustom', 'wholesalerPurchase'].includes(item.sceneType) ? 'gift-badge-blue' : 'gift-badge-orange']"
|
||
>
|
||
{{ item.badgeText }}
|
||
</view>
|
||
<view
|
||
v-for="(cart, cartIndex) in item.giftInfo"
|
||
:key="cartIndex"
|
||
class="gift-body"
|
||
@click="giftItemClickHanlde(item)"
|
||
>
|
||
<view class="gift-img">
|
||
<image
|
||
:src="cart.productInfo.image"
|
||
class="img"
|
||
/>
|
||
</view>
|
||
<view class="gift-good-info">
|
||
<view class="name more-t">
|
||
{{ cart.productInfo.storeName }}
|
||
</view>
|
||
<view v-if="cart.productInfo.attrInfo" class="attr-txt">
|
||
<view class="txt">{{ cart.productInfo.attrInfo.sku }}</view>
|
||
</view>
|
||
<view class="price-wrap">
|
||
<view class="price">
|
||
<text class="prefix">￥</text>{{ item.payPrice }}
|
||
</view>
|
||
<view class="num">已领取{{cart.receiveNum}}/{{ cart.cartNum }}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view v-if="item.isTravelGroup === 1" class="gift-body" @click="giftItemClickHanlde(item)">
|
||
<view class="gift-img">
|
||
<image
|
||
:src="item.giftInfoTravelGroup.travelGroupProductInfo.mainImage"
|
||
class="img"
|
||
/>
|
||
</view>
|
||
<view class="gift-good-info">
|
||
<view class="name more-t">
|
||
{{ item.giftInfoTravelGroup.travelGroupProductInfo.name }}
|
||
</view>
|
||
<view class="price-wrap">
|
||
<view class="price">
|
||
<text class="prefix">￥</text>{{ item.payPrice }}
|
||
</view>
|
||
<view class="num">已领取{{item.giftInfoTravelGroup.receiveNum}}/{{ item.giftInfoTravelGroup.totalNum }}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="gift-bottom">
|
||
<view class="gift-txt">
|
||
<!-- 赠言：{{ item.message || '' }} -->
|
||
</view>
|
||
<!-- 状态 0-待领取 1-已全部领取 2-已失效 -->
|
||
<button v-if="item.status === 0" @click="tuikuan(item)" class="btn1">退款</button>
|
||
<button
|
||
v-if="item.status === -1"
|
||
class="btn"
|
||
@click="goBuy(item)"
|
||
>
|
||
待付款
|
||
<image
|
||
:src="webUrl + '/icon/icon-gift-share.png'"
|
||
class="icon"
|
||
mode="widthFix"
|
||
/>
|
||
</button>
|
||
<button
|
||
v-if="item.status === 0"
|
||
open-type="share"
|
||
class="btn"
|
||
@click="shareGift(item)"
|
||
>
|
||
送给朋友
|
||
<image
|
||
:src="webUrl + '/icon/icon-gift-share.png'"
|
||
class="icon"
|
||
mode="widthFix"
|
||
/>
|
||
</button>
|
||
<view
|
||
v-if="item.status === 1"
|
||
class="btn"
|
||
>
|
||
已全部领取
|
||
</view>
|
||
<view
|
||
v-if="item.status === 2"
|
||
class="btn btn-grey"
|
||
>
|
||
已过期
|
||
</view>
|
||
<view
|
||
v-if="item.status === 9"
|
||
class="btn btn-grey"
|
||
>
|
||
已取消
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</block>
|
||
<view v-if="sendList.length > 0" class="load-more">
|
||
{{ sendLoading ? '加载中...' : (sendHasMore ? '上拉加载更多' : '没有更多了') }}
|
||
</view>
|
||
<view v-if="sendList.length === 0" class="noCart">
|
||
<view class="pictrue">
|
||
<image :src="webUrl + '/20240102232734472795.png'"/>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view v-if="cateIndex === 1" class="list-body">
|
||
<block v-if="receiveList.length > 0">
|
||
<view
|
||
v-for="(item, index) in receiveList"
|
||
:key="index"
|
||
class="gift-item"
|
||
>
|
||
<view
|
||
v-if="item.badgeText"
|
||
:class="['gift-badge', ['wholesalerCustom', 'wholesalerPurchase'].includes(item.sceneType) ? 'gift-badge-blue' : 'gift-badge-orange']"
|
||
>
|
||
{{ item.badgeText }}
|
||
</view>
|
||
<view
|
||
v-for="(cart, cartIndex) in item._renderGiftInfos"
|
||
:key="cartIndex"
|
||
class="gift-body"
|
||
@click="giftItemClickHanlde(item)"
|
||
v-if="item.isBlind === 0"
|
||
>
|
||
<view class="gift-img">
|
||
<image
|
||
:src="cart._displayImage"
|
||
class="img"
|
||
/>
|
||
</view>
|
||
<view class="gift-good-info">
|
||
<view class="name more-t">
|
||
{{ cart._displayName }}
|
||
</view>
|
||
<view v-if="cart._displaySku" class="attr-txt">
|
||
<view class="txt">{{ cart._displaySku }}</view>
|
||
</view>
|
||
<view v-if="cart._showPrice" class="price-wrap">
|
||
<view class="price">
|
||
<text class="prefix">￥</text>{{ cart._displayPrice }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view v-if="item.isBlind" class="gift-body" @click="giftItemClickHanlde(item)">
|
||
<view class="gift-img">
|
||
<image
|
||
:src="webUrl+'/orderIcon/盲盒礼包.png'"
|
||
class="img"
|
||
mode="widthFix"
|
||
/>
|
||
</view>
|
||
</view>
|
||
<view v-if="item.isTravelGroup === 1" class="gift-body" @click="giftItemClickHanlde(item)">
|
||
<view class="gift-img">
|
||
<image
|
||
:src="item.travelGroupProductInfo.mainImage"
|
||
class="img"
|
||
/>
|
||
</view>
|
||
<view class="gift-good-info">
|
||
<view class="name more-t">
|
||
{{ item.travelGroupProductInfo.name }}
|
||
</view>
|
||
<view class="price-wrap">
|
||
<view class="price">
|
||
<text class="prefix">￥</text>{{ item.travelGroupProductInfo.price }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="gift-bottom">
|
||
<view class="gift-txt">
|
||
<!-- 赠言：{{ item.message || '' }} -->
|
||
</view>
|
||
<view
|
||
:class="{
|
||
'btn-grey': [-2, 3].includes(+item._status._type)
|
||
}"
|
||
class="btn"
|
||
>
|
||
{{ item._status._title }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</block>
|
||
<view v-if="receiveList.length > 0" class="load-more">
|
||
{{ receiveLoading ? '加载中...' : (receiveHasMore ? '上拉加载更多' : '没有更多了') }}
|
||
</view>
|
||
<view v-if="receiveList.length === 0" class="noCart">
|
||
<view class="pictrue">
|
||
<image :src="webUrl + '/20240102232734472795.png'"/>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</block>
|
||
<goo-skeleton
|
||
v-else
|
||
:show-avatar="false"
|
||
/>
|
||
</view>
|
||
<view class="page-bottom">
|
||
<image
|
||
:src="webUrl + '/icon/icon-send-gift-notice-btn.png'"
|
||
class="icon"
|
||
mode="widthFix"
|
||
@click="showTips"
|
||
/>
|
||
</view>
|
||
<gift-tips
|
||
ref="giftTips"
|
||
:richText="giftNotice"
|
||
/>
|
||
<Payment v-model="pay" :types="payType" @checked="toPay" :balance="userInfo.nowMoney"></Payment>
|
||
<passkeyborad
|
||
:money="orderInfo.payPrice"
|
||
showMoney
|
||
:show="isShowPayPwdPop"
|
||
ref='payPwdPop'
|
||
v-if="isShowPayPwdPop"
|
||
@close="pwdPopClose"
|
||
@finish="pwdPopFinish"
|
||
></passkeyborad>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import passkeyborad from '@/components/yzc-paykeyboard/yzc-paykeyboard'
|
||
import {cancelOrderHandle, payOrderHandle, takeOrderHandle, yuePayOrderHandle, delOrderHandle} from "@/libs/order";
|
||
import Payment from "@/components/Payment";
|
||
import {
|
||
giftCardReceiveList,
|
||
giftCardSendList,
|
||
giftNotice,
|
||
refund
|
||
} from '@/api/giftList'
|
||
import {mapGetters} from "vuex";
|
||
import giftTips from '@/pkg_user/views/gift/components/giftTips.vue'
|
||
export default {
|
||
name: 'GiftLisPage',
|
||
components: {
|
||
giftTips,
|
||
passkeyborad,
|
||
Payment
|
||
},
|
||
data() {
|
||
return {
|
||
pay: false,
|
||
payType: ["yue", "weixin"],
|
||
webUrl: this.$VUE_APP_RESOURCES_URL,
|
||
giftNotice: '',
|
||
cateIndex: 0,
|
||
cateList: [
|
||
{
|
||
name: '送出的',
|
||
status: 1
|
||
},
|
||
{
|
||
name: '收到的',
|
||
status: 2
|
||
}
|
||
],
|
||
isLoad: false,
|
||
from: this.$deviceType,
|
||
sendList: [],
|
||
receiveList: [],
|
||
giftItem: {},
|
||
orderInfo: {},
|
||
isShowPayPwdPop: false,
|
||
pageSize: 10,
|
||
sendPage: 1,
|
||
receivePage: 1,
|
||
sendLoading: false,
|
||
receiveLoading: false,
|
||
sendHasMore: true,
|
||
receiveHasMore: true,
|
||
sendInited: false,
|
||
receiveInited: false
|
||
}
|
||
},
|
||
computed: mapGetters(["userInfo"]),
|
||
created() {
|
||
giftNotice().then(res => {
|
||
this.giftNotice = res.data
|
||
})
|
||
this.getGiftCardSendList(true)
|
||
},
|
||
onReachBottom() {
|
||
if (this.cateIndex === 0) {
|
||
this.getGiftCardSendList()
|
||
return
|
||
}
|
||
this.getGiftCardReceiveList()
|
||
},
|
||
onShareAppMessage() {
|
||
uni.updateShareMenu({
|
||
isPrivateMessage: true,
|
||
withShareTicket: true
|
||
})
|
||
return {
|
||
title: '礼笺轻启，礼藏心意',
|
||
path: `/pkg_user/views/gift/receive?code=${this.giftItem.code}&isTravelGroup=${this.giftItem.isTravelGroup ? 1 : 0}`,
|
||
imageUrl: this.giftItem.templateInfo.image
|
||
}
|
||
},
|
||
methods: {
|
||
tuikuan(item) {
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: '是否确定退款？',
|
||
success: (res) => {
|
||
if (res.confirm) {
|
||
uni.showLoading({
|
||
title: '退款中...',
|
||
mask: true
|
||
})
|
||
refund({
|
||
id: item.id
|
||
}).then(qRes => {
|
||
if (qRes.success) {
|
||
this.getGiftCardSendList(true)
|
||
}
|
||
}).finally(() => {
|
||
uni.hideLoading()
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
pwdPopFinish(payPwd) {
|
||
this.payPassword = payPwd;
|
||
|
||
this.toYuePay(payPwd);
|
||
|
||
this.isShowPayPwdPop = false;
|
||
},
|
||
toYuePay(payPwd) {
|
||
//网络请求
|
||
yuePayOrderHandle(this.orderInfo.orderId, "yue", this.from, payPwd).then(res => {
|
||
console.log(res);
|
||
this.getGiftCardSendList(true)
|
||
this.payPassword = "";
|
||
})
|
||
},
|
||
pwdPopClose() {
|
||
this.isShowPayPwdPop = false;
|
||
},
|
||
wechatPay(type) {
|
||
payOrderHandle(this.orderInfo.orderId, type, this.from).then(res => {
|
||
console.log(res);
|
||
this.getGiftCardSendList(true)
|
||
})
|
||
},
|
||
goBuy(order) {
|
||
this.pay = true
|
||
this.orderInfo = order
|
||
},
|
||
toPay(type) {
|
||
//余额支付需要输入支付密码
|
||
if (type == "yue") {
|
||
this.isShowPayPwdPop = true;
|
||
return;
|
||
} else {
|
||
this.wechatPay(type);
|
||
}
|
||
},
|
||
shareGift(item) {
|
||
this.giftItem = item
|
||
},
|
||
cateItemClickHanlde(item, index) {
|
||
if (this.cateIndex === index || !this.isLoad) return
|
||
this.cateIndex = index
|
||
if (this.cateIndex === 0 && !this.sendInited) {
|
||
this.getGiftCardSendList(true)
|
||
}
|
||
if (this.cateIndex === 1 && !this.receiveInited) {
|
||
this.getGiftCardReceiveList(true)
|
||
}
|
||
},
|
||
getListResult(data, page) {
|
||
const list = Array.isArray(data)
|
||
? data
|
||
: (data && (data.records || data.list || data.data)) || []
|
||
const pageCount = Number(
|
||
data && (data.pages || data.totalPage || data.last_page || data.pageCount || 0)
|
||
)
|
||
const total = Number(
|
||
data && (data.total || data.totalCount || data.count || 0)
|
||
)
|
||
let hasMore = false
|
||
if (pageCount > 0) {
|
||
hasMore = page < pageCount
|
||
} else if (total > 0) {
|
||
hasMore = page * this.pageSize < total
|
||
} else {
|
||
hasMore = list.length >= this.pageSize
|
||
}
|
||
return {
|
||
list,
|
||
hasMore
|
||
}
|
||
},
|
||
getGiftCardReceiveList(reset = false) {
|
||
if (this.receiveLoading) return
|
||
if (!reset && !this.receiveHasMore) return
|
||
const page = reset ? 1 : this.receivePage
|
||
if (reset) {
|
||
this.receivePage = 1
|
||
this.receiveHasMore = true
|
||
this.receiveList = []
|
||
}
|
||
if (page === 1 && this.cateIndex === 1) {
|
||
this.isLoad = false
|
||
}
|
||
this.receiveLoading = true
|
||
giftCardReceiveList({
|
||
page,
|
||
limit: this.pageSize
|
||
}).then(res => {
|
||
const { success, data } = res
|
||
if (success) {
|
||
const { list, hasMore } = this.getListResult(data, page)
|
||
const formatList = list.map(item => this.normalizeReceiveGiftItem(item))
|
||
this.receiveList = page === 1 ? formatList : this.receiveList.concat(formatList)
|
||
this.receiveHasMore = hasMore
|
||
this.receivePage = page + 1
|
||
this.receiveInited = true
|
||
}
|
||
}).catch(err => {
|
||
console.log(err)
|
||
}).finally(() => {
|
||
this.receiveLoading = false
|
||
if (this.cateIndex === 1) {
|
||
this.isLoad = true
|
||
}
|
||
})
|
||
},
|
||
getGiftCardSendList(reset = false) {
|
||
if (this.sendLoading) return
|
||
if (!reset && !this.sendHasMore) return
|
||
const page = reset ? 1 : this.sendPage
|
||
if (reset) {
|
||
this.sendPage = 1
|
||
this.sendHasMore = true
|
||
this.sendList = []
|
||
}
|
||
if (page === 1 && this.cateIndex === 0) {
|
||
this.isLoad = false
|
||
}
|
||
this.sendLoading = true
|
||
giftCardSendList({
|
||
page,
|
||
limit: this.pageSize
|
||
}).then(res => {
|
||
const { success, data } = res
|
||
if (success) {
|
||
const { list, hasMore } = this.getListResult(data, page)
|
||
this.sendList = page === 1 ? list : this.sendList.concat(list)
|
||
this.sendHasMore = hasMore
|
||
this.sendPage = page + 1
|
||
this.sendInited = true
|
||
}
|
||
}).catch(err => {
|
||
console.log(err)
|
||
}).finally(() => {
|
||
this.sendLoading = false
|
||
if (this.cateIndex === 0) {
|
||
this.isLoad = true
|
||
}
|
||
})
|
||
},
|
||
getStatus(order) {
|
||
const type = Number(order._status._type)
|
||
let status = ''
|
||
switch (type) {
|
||
case 0:
|
||
status = '待付款'
|
||
break
|
||
case 1:
|
||
status = '礼包待发货'
|
||
break
|
||
case 2:
|
||
status = '礼包待收货'
|
||
break
|
||
case 3:
|
||
status = '礼包已收货'
|
||
break
|
||
case 4:
|
||
status = '已完成'
|
||
break
|
||
case -1:
|
||
status = '退款中'
|
||
break
|
||
case -2:
|
||
status = '已退回'
|
||
break
|
||
case -3:
|
||
status = '退款失败'
|
||
break
|
||
case 9:
|
||
status = '已取消'
|
||
break
|
||
default:
|
||
break
|
||
}
|
||
return status
|
||
},
|
||
normalizeReceiveGiftItem(item = {}) {
|
||
return {
|
||
...item,
|
||
_renderGiftInfos: this.getReceiveGiftInfos(item)
|
||
}
|
||
},
|
||
getReceiveGiftInfos(item = {}) {
|
||
if (item.customGiftInfo && typeof item.customGiftInfo === 'object') {
|
||
const customGift = this.formatCustomGiftInfo(item.customGiftInfo)
|
||
if (customGift) {
|
||
return [customGift]
|
||
}
|
||
}
|
||
const giftInfos = Array.isArray(item.giftInfos) ? item.giftInfos : []
|
||
return giftInfos.map(gift => this.formatDefaultGiftInfo(gift))
|
||
},
|
||
formatCustomGiftInfo(customGiftInfo = {}) {
|
||
const giftImage = typeof customGiftInfo.giftImage === 'string'
|
||
? customGiftInfo.giftImage.trim()
|
||
: ''
|
||
const giftValue = customGiftInfo.giftValue
|
||
const hasGiftValue = giftValue !== '' && giftValue !== null && giftValue !== undefined
|
||
return {
|
||
...customGiftInfo,
|
||
_isCustomGift: true,
|
||
_displayImage: giftImage,
|
||
_displayName: customGiftInfo.giftName || '',
|
||
_displaySku: customGiftInfo.specName || '',
|
||
_displayPrice: hasGiftValue ? giftValue : '',
|
||
_showPrice: Number(customGiftInfo.isShowValue) === 1 && hasGiftValue
|
||
}
|
||
},
|
||
formatDefaultGiftInfo(gift = {}) {
|
||
const productInfo = gift.productInfo || {}
|
||
const attrInfo = productInfo.attrInfo || {}
|
||
const price = attrInfo.price
|
||
return {
|
||
...gift,
|
||
_displayImage: productInfo.image || '',
|
||
_displayName: productInfo.storeName || '',
|
||
_displaySku: attrInfo.sku || '',
|
||
_displayPrice: price,
|
||
_showPrice: price !== '' && price !== null && price !== undefined
|
||
}
|
||
},
|
||
showTips() {
|
||
this.$refs.giftTips.showTips = true
|
||
},
|
||
giftItemClickHanlde(item) {
|
||
if (item.isTravelGroup === 1) {
|
||
this.$yrouter.push({
|
||
path: '/pkg_product/views/sojoumOrderDetails',
|
||
query: {
|
||
id: item.orderId,
|
||
isView: 1
|
||
}
|
||
})
|
||
return
|
||
}
|
||
// if (this.cateIndex === 0) return
|
||
this.$yrouter.push({
|
||
path: '/pagesOrder/order/OrderDetails/index',
|
||
query: {
|
||
id: item.orderId,
|
||
isGift: this.cateIndex === 0 ? 1 : 0
|
||
}
|
||
})
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
.gift-page {
|
||
position: relative;
|
||
min-height: 100vh;
|
||
padding: 20rpx 20rpx 0 20rpx;
|
||
box-sizing: border-box;
|
||
background-color: #F6F6F6;
|
||
.cate-wrap {
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
right: 0;
|
||
z-index: 9;
|
||
padding: 20rpx 32rpx;
|
||
background-color: #F6F6F6;
|
||
.cate-list {
|
||
display: flex;
|
||
align-items: center;
|
||
height: 64rpx;
|
||
border-radius: 32rpx;
|
||
background-color: #fff;
|
||
.cate-item {
|
||
flex: 1;
|
||
height: 64rpx;
|
||
border-radius: 32rpx;
|
||
line-height: 64rpx;
|
||
text-align: center;
|
||
font-size: 30rpx;
|
||
color: #333;
|
||
background-color: #fff;
|
||
&.curr {
|
||
font-weight: bold;
|
||
color: #fff;
|
||
background-color: #C41617;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.list-wrap {
|
||
position: relative;
|
||
z-index: 2;
|
||
padding: 84rpx 0 80rpx 0;
|
||
.gift-item {
|
||
position: relative;
|
||
padding: 16rpx;
|
||
margin: 0 0 24rpx;
|
||
border-radius: 16rpx;
|
||
background-color: #ffff;
|
||
.gift-badge {
|
||
position: absolute;
|
||
top: 0;
|
||
right: 0;
|
||
z-index: 2;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: fit-content;
|
||
height: 48rpx;
|
||
border-radius: 0rpx 16rpx 0rpx 24rpx;
|
||
font-size: 26rpx;
|
||
color: #fff;
|
||
padding: 0 12rpx;
|
||
line-height: 1;
|
||
}
|
||
.gift-badge-blue {
|
||
background: #28AAF4;
|
||
}
|
||
.gift-badge-orange {
|
||
background: #FF9644;
|
||
}
|
||
.gift-body {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
.gift-img {
|
||
.img {
|
||
display: block;
|
||
width: 200rpx;
|
||
height: 200rpx;
|
||
border-radius: 16rpx;
|
||
}
|
||
}
|
||
.gift-good-info {
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: space-between;
|
||
width: calc(100% - 212rpx);
|
||
height: 200rpx;
|
||
.name {
|
||
font-weight: bold;
|
||
font-size: 28rpx;
|
||
color: #333;
|
||
line-height: 44rpx;
|
||
}
|
||
.attr-txt {
|
||
display: flex;
|
||
.txt {
|
||
// height: 42rpx;
|
||
padding: 0 12rpx;
|
||
border-radius: 24rpx;
|
||
border: 1px solid #999;
|
||
line-height: 42rpx;
|
||
color: #333;
|
||
font-size: 24rpx;
|
||
}
|
||
}
|
||
.price-wrap {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
.price {
|
||
color: #C52733;
|
||
font-size: 30rpx;
|
||
font-weight: bold;
|
||
.prefix {
|
||
font-weight: normal;
|
||
font-size: 22rpx;
|
||
}
|
||
}
|
||
.num {
|
||
font-size: 24rpx;
|
||
color: #666;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.gift-bottom {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding: 24rpx 0 0 0;
|
||
margin: 24rpx 0 0 0;
|
||
border-top: 1rpx solid #D2D2D2;
|
||
.gift-txt {
|
||
flex: 1;
|
||
font-size: 26rpx;
|
||
color: #666;
|
||
}
|
||
.btn {
|
||
display: flex;
|
||
align-items: center;
|
||
height: 46rpx;
|
||
padding: 0 12rpx;
|
||
margin: 0 0 0 24rpx;
|
||
border-radius: 100rpx;
|
||
color: #fff;
|
||
line-height: 46rpx;
|
||
font-size: 26rpx;
|
||
background-color: #C52733;
|
||
.icon {
|
||
display: block;
|
||
width: 20rpx;
|
||
height: 20rpx;
|
||
}
|
||
&.btn-grey {
|
||
color: #fff;
|
||
background-color: #C7C7C7;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.page-bottom {
|
||
position: fixed;
|
||
bottom: 0;
|
||
left: 0;
|
||
right: 0;
|
||
z-index: 9;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
height: 80rpx;
|
||
background-color: #F6F6F6;
|
||
.icon {
|
||
display: block;
|
||
width: 140rpx;
|
||
}
|
||
}
|
||
}
|
||
.noCart {
|
||
margin-top: 0.17 * 100rpx;
|
||
padding-top: 0.1 * 100rpx;
|
||
.pictrue {
|
||
width: 408rpx;
|
||
height: 414rpx;
|
||
overflow: hidden;
|
||
margin: 0.7 * 100rpx auto 0.5 * 100rpx auto;
|
||
image {
|
||
display: block;
|
||
width: 408rpx;
|
||
height: 414rpx;
|
||
}
|
||
}
|
||
}
|
||
.btn1{
|
||
background-color: #fff;
|
||
color: #333;
|
||
border-radius: 100rpx;
|
||
border: 1px solid #333;
|
||
font-weight: bold;
|
||
height: 46rpx;
|
||
padding: 0 12rpx;
|
||
margin: 0 0 0 24rpx;
|
||
line-height: 40rpx;
|
||
font-size: 26rpx;
|
||
}
|
||
.load-more {
|
||
padding: 0 0 24rpx;
|
||
text-align: center;
|
||
font-size: 24rpx;
|
||
color: #999;
|
||
}
|
||
</style>
|