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.

185 lines
4.0 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<view class="ordercontainer">
<view class="confirmbox">
<view class="confirmpicinfo">
<view class="imgbox">
<image src="../../static/confirmimg.jpg" mode="widthFix"></image>
</view>
<view class="pictitle">蟹太太大闸蟹红金款999型</view>
<text>公4.0两母3.0 4 8只装</text>
</view>
</view>
<view class="confirmlist" style="background-image: url(../../static/confirmbg2.jpg);">
<view class="iconimg">
<image src="../../static/icon1.png" mode="widthFix"></image>
</view>
<view class="confirmright">
<text class="confirmmarker">收货日期</text>
<view class="flex-li confirmdate">
<text>2024年9月28日</text>
<text class="smallfont">农历八月十三</text>
</view>
<view class="flex-li confirmdate">
<text>0900-1500</text>
<text class="smallfont">[周三]</text>
</view>
</view>
</view>
<view class="confirmlist" style="background-image: url(../../static/confirmbg3.jpg);">
<view class="iconimg">
<image src="../../static/icon2.png" mode="widthFix"></image>
</view>
<view class="confirmright">
<text class="confirmmarker">收货地址</text>
<view class="flex-li confirmaddress">
<text>浙江省杭州市滨江区银泰海威国际xxxx</text>
</view>
</view>
</view>
<view class="confirmlist" style="background-image: url(../../static/confirmbg4.jpg);">
<view class="iconimg">
<image src="../../static/icon3.png" mode="widthFix"></image>
</view>
<view class="confirmright">
<text class="confirmmarker">收货人</text>
<view class="flex-li confirmcontact">
<text>王冰冰</text>
<text>15326589454</text>
</view>
</view>
</view>
<view class="confirmbtn">
<text class="edit">返回修改</text>
<text class="confirmtab">确认提货</text>
</view>
</view>
</template>
<script>
export default {
data() {
return {
}
},
onLoad() {
},
methods: {
}
}
</script>
<style scoped lang="scss">
.ordercontainer{
background: #f0efed;
width: 100%;
height: 100vh;
padding: 42rpx 50rpx 300rpx;
overflow-y: scroll;
}
.confirmbox{
width: 100%;
padding-top: 22rpx;
padding-bottom: 35rpx;
background: url(../../static/confirmbg1.jpg) no-repeat center top;
background-size: cover;
border-radius: 10rpx;
box-shadow: 0 5rpx 15rpx rgba(0,0,0,.47);
}
.confirmpicinfo{
text-align: center;
font-size: 24rpx;
color: #d5c7b5;
line-height: 42rpx;
}
.imgbox{
width: 307rpx;
margin: 0 auto;
border-radius: 10rpx;
border: 1px solid #ba8b45;
overflow: hidden;
margin-bottom: 14rpx;
}
.imgbox image{
width:100%;
height: auto;
vertical-align: middle;
}
.confirmpicinfo .pictitle{
color: #ba8b45;
}
.confirmlist{
margin-top: 30rpx;
border-radius: 10rpx;
overflow: hidden;
display: flex;
align-items: center;
justify-content: space-between;
background-repeat: no-repeat;
background-position: center top;
background-size: cover;
box-shadow: 0 5rpx 15rpx rgba(0,0,0,.47);
padding: 10rpx 10rpx 10rpx 20rpx;
}
.confirmlist image{
width: 62rpx;
height: auto;
}
.confirmlist .confirmright{
width: 550rpx;
background: #fff;
border-radius: 10rpx;
padding: 45rpx 20rpx 25rpx;
}
.confirmmarker{
display: block;
font-size:24rpx;
color: #000;
font-weight: bold;
margin-bottom: 8rpx;
}
.flex-li{
display: flex;
justify-content: space-between;
color: #000;
font-size: 30rpx;
line-height: 60rpx;
}
.confirmdate text.smallfont{
font-size: 24rpx;
}
.confirmbtn{
position: fixed;
bottom: 0;
left: 0;
width: 100%;
height: 115rpx;
display: flex;
padding: 0 10rpx;
justify-content: space-between;
background: #fff;
align-items: center;
}
.confirmbtn text{
display: inline-block;
width: 284rpx;
line-height: 74rpx;
height: 74rpx;
text-align: center;
border-radius: 74rpx;
border: 1rpx solid #d1d1d0;
margin: 0 38rpx;
font-size: 29rpx;
color:#000;
}
.confirmbtn text.confirmtab{
color: #fff;
border: 1rpx solid #ba8b45;
background: #ba8b45;
}
</style>