4 changed files with 832 additions and 29 deletions
@ -0,0 +1,796 @@ |
|||||
|
<template> |
||||
|
<view class="bg"> |
||||
|
<view class="top-box" v-if="product"> |
||||
|
<view class="product-title">{{ product.title }}</view> |
||||
|
<view class="product-date">{{ selectDate.date }}</view> |
||||
|
<view class="product-num"> |
||||
|
<text class="product-text" v-for="(item, index) in sku" :key="index">{{ item.sku_name }}x{{ item.num }}</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="user-box"> |
||||
|
<view class="user-box-title">出行人信息</view> |
||||
|
|
||||
|
<view v-for="(skuItem, skuIndex) in sku" :key="skuIndex"> |
||||
|
<view class="user-item" v-for="(item, index) in skuItem.num" :key="index"> |
||||
|
<text class="user-item-text">{{ skuItem.sku_name }}</text> |
||||
|
|
||||
|
<view v-if="linkmans[skuIndex][index]" class="user-info"> |
||||
|
<text style="margin-right: 30rpx">{{ linkmans[skuIndex][index].name }}</text> |
||||
|
<text>{{ linkmans[skuIndex][index].tel }}</text> |
||||
|
</view> |
||||
|
|
||||
|
<img @tap="showLinkman(skuIndex)" v-if="linkmans[skuIndex][index]" src="https://static.ticket.sz-trip.com/dongtai/images/index/edit.png" class="icon-bianji1" /> |
||||
|
|
||||
|
<view @tap="showLinkman(skuIndex)" v-else class="add-btn"> |
||||
|
+ 添加 |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<!-- <view class="user-item"> |
||||
|
<text class="user-item-text">姓名</text> |
||||
|
<input v-model="reserve_name" placeholder="输入您的姓名" class="user-input"/> |
||||
|
</view> --> |
||||
|
<view class="user-item"> |
||||
|
<text class="user-item-text">联系电话</text> |
||||
|
<input type="number" v-model="reserve_phone" placeholder="输入您的手机号" maxlength="11" class="user-input"/> |
||||
|
<uni-icons type="closeempty" size="20" @click="reserve_phone = ''" v-if="reserve_phone!= ''" style="margin-left: 30rpx;"></uni-icons> |
||||
|
</view> |
||||
|
<view class="user-item" style="border-bottom: none"> |
||||
|
<text class="user-item-text">订单备注</text> |
||||
|
<input type="text" v-model="remark" placeholder="选填" class="user-input"/> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<navigator :url="'/subPackages/order/orderCoupon?allprice='+ price + '&sku_ids='+ sku_ids.toString()" class="coupon-box flex-between"> |
||||
|
<text>优惠券</text> |
||||
|
<view style="display: flex;align-items: center;"> |
||||
|
<view class="add-btn" v-if="!coupon">选择优惠券</view> |
||||
|
<view style="display: flex;align-items: center;color: #C3282E;font-weight: bold;" v-if="coupon && coupon.CouponActivity"> |
||||
|
<view>-¥{{coupon.CouponActivity.discounts/100}}</view> |
||||
|
</view> |
||||
|
<img src="https://static.ticket.sz-trip.com/changyoutaihu/images/user/rightIcon.png" class="icon-coupon"> |
||||
|
</view> |
||||
|
</navigator> |
||||
|
|
||||
|
<!-- <view class="xy-box"> |
||||
|
<view class="quan flex-center" @click="clickXy"> |
||||
|
<view class="quan-seld" v-if="xySeld"></view> |
||||
|
</view> |
||||
|
<view style="margin-left: 20rpx;"> |
||||
|
请您仔细阅读<span @click="openXz">线路标准退预定须知</span>,点击去支付即代表您已阅读条款内容 |
||||
|
</view> |
||||
|
</view> --> |
||||
|
|
||||
|
<view class="fixed-bottom"> |
||||
|
<view class="order-all-price"> |
||||
|
合计: |
||||
|
<text class="order-all-text"> |
||||
|
¥{{ priceTotal() / 100 }} |
||||
|
</text> |
||||
|
</view> |
||||
|
<view class="order-btn" @tap="order">去支付</view> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 协议弹框 --> |
||||
|
<!-- <uni-popup ref="popup" type="bottom" :safe-area="false"> |
||||
|
<view class="xzPopup"> |
||||
|
<view v-html="formateRichText(product.reserve_content)"></view> |
||||
|
<img src="https://static.ticket.sz-trip.com/taihu/images/scenic/cha.png" @click="closePopup"> |
||||
|
</view> |
||||
|
</uni-popup> --> |
||||
|
|
||||
|
<!-- 添加出行人弹窗 --> |
||||
|
<uni-popup ref="peoplePopup" type="bottom" backgroundColor="#F4F4F4"> |
||||
|
<view class="people-popup"> |
||||
|
<view class="popup-top"> |
||||
|
<view class="top flex-between"> |
||||
|
<text class="text-overflow" @click="changePeoplePopup('close')"></text> |
||||
|
<text class="confirm" @click="changePeoplePopup('')">确定</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
<navigator url="/subPackages/user/myContactsAdd?type=add" class="button">添加出行人</navigator> |
||||
|
<view class="popup-list" v-if="peopleList.length>0"> |
||||
|
<view :class="['popup-item', {'people-select': item.is_seld}]" v-for="(item,index) in peopleList" :key="index" @click="seldThisPeople(item, index)"> |
||||
|
<view class="item-top flex-between"> |
||||
|
<navigator :url="`/subPackages/user/myContactsAdd?type=edit&id=${item.id}`"><img |
||||
|
src="https://static.ticket.sz-trip.com/taizhou/images/detail/edit.png" class="editImg"> |
||||
|
</navigator> |
||||
|
<view class="name">{{ item.name }}</view> |
||||
|
<view class="subtitle"> |
||||
|
<view class="mobile">手机号 {{ item.tel }} <span v-if="item.is_default==1">默认</span></view> |
||||
|
<view class="idCard">{{ item.title }} {{ item.id_number }}</view> |
||||
|
</view> |
||||
|
<!-- <view class="status" :class="item.is_seld?'statuss':'noSelect'" |
||||
|
@click="seldThisPeople(item, index)"> |
||||
|
<img src="https://static.ticket.sz-trip.com/taihu/images/user/dui.png" |
||||
|
v-if="item.is_seld" class="selectImg"> |
||||
|
</view> --> |
||||
|
</view> |
||||
|
<!-- <view class="item-site" @click="changeDefaultPeople(item,index)"> |
||||
|
<view class="flex-around" v-if="item.is_default==1"> |
||||
|
<view></view> |
||||
|
</view> |
||||
|
<view v-else></view> |
||||
|
设为默认出行人 |
||||
|
</view> --> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</uni-popup> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
product: this.$store.state.user.lineInfo.product, |
||||
|
sku: this.$store.state.user.lineInfo.sku, |
||||
|
selectDate: this.$store.state.user.lineInfo.selectDate, |
||||
|
linkmans: [], |
||||
|
sku_ids: '', |
||||
|
price: this.$store.state.user.lineInfo.price, |
||||
|
skuIndex: null, |
||||
|
coupon: '', |
||||
|
reserve_name: '', |
||||
|
reserve_phone: '', |
||||
|
reserve_mobile: '', |
||||
|
remark: '', |
||||
|
peopleList: [], |
||||
|
linkmanList: [], |
||||
|
xySeld: false |
||||
|
} |
||||
|
}, |
||||
|
onReady() { |
||||
|
console.log('product',this.product) |
||||
|
console.log('sku',this.sku) |
||||
|
console.log('selectDate',this.selectDate) |
||||
|
console.log('price',this.price) |
||||
|
// 清除优惠券 |
||||
|
this.$store.commit("choseCoupon", ""); |
||||
|
// 自动获取手机号 |
||||
|
this.reserve_phone = JSON.parse(uni.getStorageSync('userInfo')).mobile || '' |
||||
|
|
||||
|
this.initLinkmansAndSkuIds(); |
||||
|
}, |
||||
|
onShow() { |
||||
|
this.coupon = this.$store.state.user.coupon |
||||
|
console.log('传过来的优惠券',this.coupon); |
||||
|
|
||||
|
this.getPeople() |
||||
|
}, |
||||
|
methods: { |
||||
|
// 初始化出行人信息和商品规格 ID 数组 |
||||
|
initLinkmansAndSkuIds() { |
||||
|
let linkmans = []; |
||||
|
let sku_ids = []; |
||||
|
this.sku.forEach((item) => { |
||||
|
const num = Number(item.num); |
||||
|
linkmans.push(new Array(num)); |
||||
|
sku_ids.push(item.id); |
||||
|
}); |
||||
|
this.linkmans = linkmans; |
||||
|
this.sku_ids = sku_ids; |
||||
|
}, |
||||
|
// 协议 |
||||
|
clickXy() { |
||||
|
this.xySeld = !this.xySeld |
||||
|
}, |
||||
|
openXz() { |
||||
|
this.$refs.popup.open('bottom') |
||||
|
}, |
||||
|
closePopup() { |
||||
|
this.$refs.popup.close() |
||||
|
}, |
||||
|
// 去支付 |
||||
|
order() { |
||||
|
let flag = true |
||||
|
let product_list = []; |
||||
|
this.sku.map((item, index) => { |
||||
|
if(item.num > 0) { |
||||
|
let linkmanArray = this.linkmans[index] || [] |
||||
|
let linkman = linkmanArray.filter(i => i); |
||||
|
if(linkman.length < item.num) { |
||||
|
flag = false |
||||
|
uni.showToast({ |
||||
|
title: '请选择对应的出行人', |
||||
|
icon: 'none' |
||||
|
}); |
||||
|
return; |
||||
|
} |
||||
|
let pId = [] |
||||
|
linkman.map(lItem => { |
||||
|
pId.push(lItem.id) |
||||
|
}) |
||||
|
product_list.push({ |
||||
|
type: 'line', |
||||
|
sku_id: item.id, |
||||
|
product_id: this.product.id, |
||||
|
product_num: item.num, |
||||
|
visitors: pId.toString(), |
||||
|
reserve_mobile: this.reserve_mobile, |
||||
|
use_date: this.selectDate.date |
||||
|
}); |
||||
|
} |
||||
|
}) |
||||
|
|
||||
|
// if(!this.idChinaName(this.reserve_name)) { |
||||
|
// flag = false |
||||
|
// uni.showToast({ |
||||
|
// title: '请输入联系人', |
||||
|
// icon: 'none' |
||||
|
// }); |
||||
|
// return; |
||||
|
// } |
||||
|
|
||||
|
if(!this.IsTel(this.reserve_phone)) { |
||||
|
flag = false |
||||
|
uni.showToast({ |
||||
|
title: '请输入联系方式', |
||||
|
icon: 'none' |
||||
|
}); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
// if(!this.xySeld) { |
||||
|
// flag = false |
||||
|
// uni.showToast({ |
||||
|
// title: '请先同意预订须知内容', |
||||
|
// icon: 'none' |
||||
|
// }); |
||||
|
// return; |
||||
|
// } |
||||
|
|
||||
|
if(flag){ |
||||
|
let data = { |
||||
|
product_list: product_list, |
||||
|
coupon_id: this.coupon ? this.coupon.id : null, |
||||
|
remark: this.remark |
||||
|
}; |
||||
|
|
||||
|
this.Post({ |
||||
|
data: JSON.stringify(data), |
||||
|
method: 'POST', |
||||
|
},'/api/order/create').then(res => { |
||||
|
console.log(res) |
||||
|
return; |
||||
|
if(res.code == 1) { |
||||
|
let order_id = res.data.order_id |
||||
|
this.$store.commit("changeLineInfo", null); |
||||
|
this.$store.commit("choseCoupon", ""); |
||||
|
|
||||
|
this.Post({ |
||||
|
order_id: order_id, |
||||
|
type: "miniprogram", |
||||
|
platform: 'miniprogram' |
||||
|
}, '/api/pay/unify').then(res => { |
||||
|
if (res.data) { |
||||
|
uni.requestPayment({ |
||||
|
nonceStr: res.data.nonceStr, |
||||
|
package: res.data.package, |
||||
|
paySign: res.data.paySign, |
||||
|
signType: res.data.signType, |
||||
|
timeStamp: res.data.timeStamp, |
||||
|
success: () => { |
||||
|
this.getSubscribeMessage() |
||||
|
}, |
||||
|
fail() { |
||||
|
uni.navigateTo({ |
||||
|
url: '/subPackages/order/trades' |
||||
|
}) |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
}, |
||||
|
// 总价 |
||||
|
priceTotal() { |
||||
|
let price = 0 |
||||
|
if(this.coupon) { |
||||
|
if (this.coupon.percent == 0) { |
||||
|
price = this.price - this.coupon.CouponActivity.discounts |
||||
|
} else{ |
||||
|
price = this.price - (this.price * this.coupon.CouponActivity.percent/100) |
||||
|
} |
||||
|
}else { |
||||
|
price = this.price |
||||
|
} |
||||
|
return price < 0 ? 0 : price |
||||
|
}, |
||||
|
// 获取出行人列表 |
||||
|
getPeople() { |
||||
|
this.Post({ |
||||
|
contactType: 'CONTACT', |
||||
|
offset: 0, |
||||
|
limit: 100 |
||||
|
},'/api/uservice/user/getContactOrConsignee').then(res => { |
||||
|
this.peopleList = res.data |
||||
|
this.reserve_mobile = this.peopleList[0].tel |
||||
|
// 如果是添加或者修改完出行人后需要默认选中已选择的出行人 |
||||
|
if (this.linkmanList.length > 0) { |
||||
|
this.linkmanList.forEach((linkman) => { |
||||
|
const foundIndex = this.peopleList.findIndex((people) => people.id === linkman.id); |
||||
|
if (foundIndex !== -1) { |
||||
|
this.linkmanList[foundIndex] = this.peopleList[foundIndex]; |
||||
|
this.peopleList[foundIndex].is_seld = true; |
||||
|
this.linkmanList[foundIndex].is_seld = true; |
||||
|
} |
||||
|
}); |
||||
|
this.$forceUpdate(); |
||||
|
} |
||||
|
}) |
||||
|
}, |
||||
|
// 设置默认出行人 |
||||
|
changeDefaultPeople(item, index) { |
||||
|
if (item.is_default == 1) { |
||||
|
return |
||||
|
} |
||||
|
this.Post({ |
||||
|
contactId: item.id |
||||
|
},'/api/uservice/user/setDefaultContact').then(res => { |
||||
|
if(res.code == 200){ |
||||
|
uni.showToast({ |
||||
|
title: '设置成功', |
||||
|
icon: 'none' |
||||
|
}); |
||||
|
for (let item of this.peopleList) item.is_default = 0 |
||||
|
this.peopleList[index].is_default = 1 |
||||
|
} |
||||
|
this.$forceUpdate() |
||||
|
}) |
||||
|
}, |
||||
|
// 选择出行人弹框 |
||||
|
showLinkman(skuIndex) { |
||||
|
this.skuIndex = skuIndex |
||||
|
|
||||
|
this.peopleList.map(item => { |
||||
|
if(item.is_seld && item.is_sku != this.sku[this.skuIndex].id) { |
||||
|
item.is_disable = true |
||||
|
}else { |
||||
|
item.is_disable = false |
||||
|
} |
||||
|
}) |
||||
|
|
||||
|
this.$refs.peoplePopup.open('bottom') |
||||
|
this.$forceUpdate() |
||||
|
}, |
||||
|
// 选择出行人 |
||||
|
seldThisPeople(item,index) { |
||||
|
let num = 0 |
||||
|
let list = [] |
||||
|
|
||||
|
if(item.is_seld && item.is_disable) { |
||||
|
uni.showToast({ |
||||
|
title: '该联系人已选择为其他规格', |
||||
|
icon: 'none' |
||||
|
}); |
||||
|
return; |
||||
|
} |
||||
|
this.linkmans[this.skuIndex] = [] |
||||
|
this.peopleList.map(items => { |
||||
|
if(items.id == item.id) { |
||||
|
items.is_seld = !items.is_seld |
||||
|
} |
||||
|
if(items.is_seld && !items.is_disable) { |
||||
|
num++; |
||||
|
items.is_sku = this.sku[this.skuIndex].id |
||||
|
this.linkmans[this.skuIndex].push(items) |
||||
|
} |
||||
|
if(items.is_seld) { |
||||
|
this.linkmanList.push(item) |
||||
|
} |
||||
|
}) |
||||
|
if(num > this.sku[this.skuIndex].num) { |
||||
|
item.is_seld = false |
||||
|
this.linkmans[this.skuIndex].splice(this.linkmans[this.skuIndex].findIndex(i => i.id == item.id),1) |
||||
|
uni.showToast({ |
||||
|
title: '该规格最多只能选择'+this.sku[this.skuIndex].num+'个出行人', |
||||
|
icon: 'none' |
||||
|
}); |
||||
|
return; |
||||
|
} |
||||
|
this.$forceUpdate() |
||||
|
console.log(this.peopleList,this.linkmans) |
||||
|
}, |
||||
|
// 确定取消 |
||||
|
changePeoplePopup(type,confirm) { |
||||
|
this.$refs.peoplePopup.close() |
||||
|
this.$forceUpdate() |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.bg { |
||||
|
background: #f6f6f6; |
||||
|
padding-bottom: 200rpx; |
||||
|
min-height: 100vh; |
||||
|
} |
||||
|
|
||||
|
.top-box { |
||||
|
padding: 30rpx 47rpx; |
||||
|
color: #333333; |
||||
|
font-size: 28rpx; |
||||
|
border-bottom: 1rpx solid #ccc; |
||||
|
|
||||
|
.product-title { |
||||
|
color: #000000; |
||||
|
font-size: 33rpx; |
||||
|
line-height: 47rpx; |
||||
|
margin-bottom: 30rpx; |
||||
|
} |
||||
|
|
||||
|
.product-num { |
||||
|
margin-top: 30rpx; |
||||
|
|
||||
|
.product-text { |
||||
|
margin-right: 50rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.user-box { |
||||
|
margin: 25rpx; |
||||
|
background: #ffffff; |
||||
|
border-radius: 9rpx; |
||||
|
|
||||
|
.user-box-title { |
||||
|
// border-bottom: 1rpx solid #ccc; |
||||
|
line-height: 113rpx; |
||||
|
font-size: 33rpx; |
||||
|
color: #000; |
||||
|
font-weight: bold; |
||||
|
padding: 0 20rpx; |
||||
|
} |
||||
|
|
||||
|
.user-item { |
||||
|
margin: 0 20rpx; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: space-between; |
||||
|
height: 126rpx; |
||||
|
border-top: 1rpx solid #B8B8B8; |
||||
|
|
||||
|
.user-item-text{ |
||||
|
flex-shrink: 0; |
||||
|
font-size: 31rpx; |
||||
|
color: #000; |
||||
|
font-weight: bold; |
||||
|
margin-right: 20rpx; |
||||
|
} |
||||
|
|
||||
|
.user-info { |
||||
|
font-size: 27rpx; |
||||
|
margin-right: 20rpx; |
||||
|
flex: 1; |
||||
|
text-align: left; |
||||
|
} |
||||
|
|
||||
|
.icon-bianji1 { |
||||
|
width: 36rpx; |
||||
|
height: 36rpx; |
||||
|
margin-right: 10rpx; |
||||
|
} |
||||
|
|
||||
|
.add-btn { |
||||
|
display: flex; |
||||
|
width: 153rpx; |
||||
|
height: 57rpx; |
||||
|
border: 1rpx solid #333333; |
||||
|
border-radius: 29rpx; |
||||
|
box-sizing: border-box; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
font-size: 28rpx; |
||||
|
color: #000; |
||||
|
} |
||||
|
|
||||
|
.user-input { |
||||
|
flex: 1; |
||||
|
font-size: 29rpx; |
||||
|
display: block; |
||||
|
text-align: right; |
||||
|
} |
||||
|
|
||||
|
.icon-coupon{ |
||||
|
width: 20rpx; |
||||
|
height: 20rpx; |
||||
|
margin-left: 15rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.people-popup { |
||||
|
padding: 26rpx; |
||||
|
min-height: 800rpx; |
||||
|
|
||||
|
.top-box { |
||||
|
height: 80rpx; |
||||
|
|
||||
|
.top { |
||||
|
position: fixed; |
||||
|
left: 0; |
||||
|
right: 0; |
||||
|
color: #000; |
||||
|
height: 80rpx; |
||||
|
font-size: 0; |
||||
|
overflow: hidden; |
||||
|
padding: 0 26rpx; |
||||
|
|
||||
|
text { |
||||
|
text-align: left; |
||||
|
font-size: 30rpx; |
||||
|
font-weight: 400; |
||||
|
color: #000000; |
||||
|
} |
||||
|
|
||||
|
.confirm { |
||||
|
font-weight: 400; |
||||
|
color: #000000; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.popup-list { |
||||
|
height: 666rpx; |
||||
|
overflow: scroll; |
||||
|
|
||||
|
.popup-item { |
||||
|
border-radius: 12rpx; |
||||
|
padding: 10rpx 20rpx; |
||||
|
margin-top: 24rpx; |
||||
|
font-size: 24rpx; |
||||
|
color: #333333; |
||||
|
font-weight: 400; |
||||
|
background-color: #FFFFFF; |
||||
|
|
||||
|
.item-top { |
||||
|
padding: 20rpx 12rpx; |
||||
|
|
||||
|
img { |
||||
|
color: #666666; |
||||
|
width: 40rpx; |
||||
|
height: 40rpx; |
||||
|
} |
||||
|
|
||||
|
.name { |
||||
|
font-size: 30rpx; |
||||
|
color: #000000; |
||||
|
margin: 0 20rpx; |
||||
|
overflow: hidden; |
||||
|
|
||||
|
text { |
||||
|
color: #999999; |
||||
|
margin: 0 20rpx; |
||||
|
} |
||||
|
|
||||
|
.tag { |
||||
|
border-radius: 8rpx; |
||||
|
text-align: center; |
||||
|
color: #333333; |
||||
|
font-size: 20rpx; |
||||
|
padding: 6rpx 15rpx; |
||||
|
background-color: #FFC825; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.com-flex-start { |
||||
|
margin: 0 0 30rpx; |
||||
|
} |
||||
|
|
||||
|
.subtitle { |
||||
|
font-weight: 400; |
||||
|
flex: 1; |
||||
|
text-align: left; |
||||
|
|
||||
|
.mobile { |
||||
|
margin-bottom: 36rpx; |
||||
|
|
||||
|
span { |
||||
|
margin-left: 10rpx; |
||||
|
padding: 0 7rpx; |
||||
|
line-height: 31rpx; |
||||
|
background: #6A8A27; |
||||
|
border-radius: 7rpx; |
||||
|
text-align: center; |
||||
|
font-weight: 400; |
||||
|
font-size: 21rpx; |
||||
|
color: #FFFFFF; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.status { |
||||
|
width: 40rpx; |
||||
|
height: 40rpx; |
||||
|
line-height: 40rpx; |
||||
|
border-radius: 50%; |
||||
|
text-align: center; |
||||
|
box-sizing: border-box; |
||||
|
|
||||
|
img { |
||||
|
width: 27rpx; |
||||
|
height: 21rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.statuss { |
||||
|
background: linear-gradient(90deg, #FA2B66, #FF9834); |
||||
|
border: none; |
||||
|
} |
||||
|
|
||||
|
.noSelect { |
||||
|
border: 1rpx solid #999999; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.item-site { |
||||
|
color: #666666; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
padding: 36rpx 0; |
||||
|
|
||||
|
view { |
||||
|
width: 23rpx; |
||||
|
height: 23rpx; |
||||
|
margin-right: 10rpx; |
||||
|
border: 1rpx solid #999999; |
||||
|
border-radius: 50%; |
||||
|
|
||||
|
view { |
||||
|
width: 8rpx; |
||||
|
height: 8rpx; |
||||
|
background: #000000; |
||||
|
border-radius: 50%; |
||||
|
margin: auto; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.people-select { |
||||
|
border: 2rpx solid #6A8A27; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.button { |
||||
|
font-size: 30rpx; |
||||
|
font-weight: 400; |
||||
|
color: #000000; |
||||
|
text-align: center; |
||||
|
width: 100%; |
||||
|
height: 80rpx; |
||||
|
line-height: 80rpx; |
||||
|
background-color: #FFFFFF; |
||||
|
border-radius: 60rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.fixed-bottom { |
||||
|
position: fixed; |
||||
|
left: 0; |
||||
|
right: 0; |
||||
|
bottom: 0; |
||||
|
height: 113rpx; |
||||
|
background: white; |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
padding: 0 26rpx; |
||||
|
box-sizing: border-box; |
||||
|
box-shadow: 0px 0px 16rpx 0px rgba(6, 0, 1, 0.1); |
||||
|
z-index: 1; |
||||
|
|
||||
|
.order-all-price { |
||||
|
flex: 1; |
||||
|
font-size: 29rpx; |
||||
|
color: #333; |
||||
|
font-weight: 500; |
||||
|
|
||||
|
.order-all-text { |
||||
|
flex: 1; |
||||
|
font-size: 36rpx; |
||||
|
color: #C3282E; |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.order-btn { |
||||
|
width: 293rpx; |
||||
|
background: #C3282E; |
||||
|
border-radius: 43rpx; |
||||
|
text-align: center; |
||||
|
line-height: 87rpx; |
||||
|
color: #fff; |
||||
|
font-size: 36rpx; |
||||
|
font-weight: 500; |
||||
|
margin-left: 30rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.xy-box { |
||||
|
width: 658rpx; |
||||
|
margin: 36rpx auto 0; |
||||
|
font-size: 27rpx; |
||||
|
font-family: PingFangSC; |
||||
|
font-weight: 400; |
||||
|
color: #999999; |
||||
|
display: flex; |
||||
|
|
||||
|
span { |
||||
|
color: #FEB419; |
||||
|
} |
||||
|
|
||||
|
.quan { |
||||
|
min-width: 23rpx; |
||||
|
min-height: 23rpx; |
||||
|
max-width: 23rpx; |
||||
|
max-height: 23rpx; |
||||
|
border: 1px solid #999999; |
||||
|
border-radius: 50%; |
||||
|
|
||||
|
.quan-seld { |
||||
|
width: 12rpx; |
||||
|
height: 12rpx; |
||||
|
background: #FEB419; |
||||
|
border-radius: 50%; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.xzPopup { |
||||
|
width: 750rpx; |
||||
|
padding: 33rpx 26rpx 20rpx; |
||||
|
box-sizing: border-box; |
||||
|
background-color: #FFFFFF; |
||||
|
position: relative; |
||||
|
height: 1200rpx; |
||||
|
overflow-y: scroll; |
||||
|
|
||||
|
view { |
||||
|
padding: 0 20rpx; |
||||
|
box-sizing: border-box; |
||||
|
margin-top: 35rpx; |
||||
|
} |
||||
|
|
||||
|
img { |
||||
|
width: 32rpx; |
||||
|
height: 32rpx; |
||||
|
position: absolute; |
||||
|
top: 33rpx; |
||||
|
right: 27rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.coupon-box { |
||||
|
height: 113rpx; |
||||
|
background: #FFFFFF; |
||||
|
border-radius: 13rpx; |
||||
|
font-weight: bold; |
||||
|
font-size: 31rpx; |
||||
|
color: #000000; |
||||
|
padding: 0 20rpx; |
||||
|
margin: 0 20rpx; |
||||
|
|
||||
|
.add-btn { |
||||
|
width: 153rpx; |
||||
|
line-height: 40rpx; |
||||
|
background: #C3282E; |
||||
|
border-radius: 9rpx; |
||||
|
text-align: center; |
||||
|
font-weight: 500; |
||||
|
font-size: 24rpx; |
||||
|
color: #FFFFFF; |
||||
|
} |
||||
|
|
||||
|
.icon-coupon{ |
||||
|
width: 20rpx; |
||||
|
height: 20rpx; |
||||
|
margin-left: 15rpx; |
||||
|
} |
||||
|
} |
||||
|
</style> |
Loading…
Reference in new issue