czg_team/cashier_weapp
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

订单详情页部分完成

Browse Source
This commit is contained in:
duan
2024-05-13 09:18:11 +08:00
parent 7c1a4edbaf
commit 1d00f35bc9
7 changed files with 210 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
pages/product/index.vue
View File

@@ -180,19 +180,21 @@
<view class="fixedview flex-between">
<view class="fixedview_letr flex-start">
<view class="fixedview_letr_item flex-colum" @click="eeInfoindex">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/product/index.png" mode="aspectFill"></image>
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/product/index.png" mode="aspectFill">
</image>
<text>首页</text>
</view>
<view class="fixedview_letr_item flex-colum" @click="makePhoneCall">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/product/Call.png" mode="aspectFill"></image>
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/product/Call.png" mode="aspectFill">
</image>
<text>客服</text>
</view>
</view>
<view class="fixedview_tow">
<!-- <view class="fixedview_towone" @click="overlayshowsboxs(1)">
<!-- <view class="fixedview_towone" @click="overlayshowsboxs(1)">
加入购物车
</view> -->
<view class="fixedview_towtow" @click="overlayshowsboxs(2)">
<view class="fixedview_towtow" @click="overlayshowsboxs(listdata)">
立即购买
</view>
<!-- <view class="fixedview_towtow" style="background: #ccc;">
@@ -381,6 +383,14 @@
//#endif
},
methods: {
overlayshowsboxs(e) {
// this.cartshping = e
// this.overlayshow = true
let _this = this
uni.pro.navigateTo('product/placeOrder', {
id: _this.indexform
})
},
//打电话
clickphone(e) {
uni.makePhoneCall({
@@ -517,7 +527,7 @@
height: 72rpx;
text-align: center;
line-height: 72rpx;
background: linear-gradient( 110deg, #F1A666 0%, #FF4C11 100%);
background: linear-gradient(110deg, #F1A666 0%, #FF4C11 100%);
border-radius: 48rpx 48rpx 48rpx 48rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: bold;

172
pages/product/placeOrder.vue Normal file
View File

@@ -0,0 +1,172 @@
<template>
<view class="placeOrder">
<view class="placetop">
<view class="placetopone">
<view style="display: flex;">
<image :src="info.proImg"
style="width: 102rpx;height: 102rpx;border-radius: 50%;margin-left: 28rpx;" mode=""></image>
<view class="placetopInfo">
<view>{{info.proName.length>12?info.proName.substring(0,12)+'...':info.proName}} </view>
<view>{{info.avaTime}} </view>
<view>{{info.proDetail}} </view>
</view>
</view>
<view class="placetopmoney">
<view>
<text>￥12</text>
<text>￥13</text>
</view>
<u-number-box v-model="Quantity">
<view slot="minus" class="minus">
<u-icon name="minus" color="#CCCCCC" bold size="40"></u-icon>
</view>
<text slot="input" style="width: 20px;text-align: center;">{{Quantity}}</text>
<view slot="plus" class="plus">
<u-icon name="plus" color="#FF4B10" bold size="30"></u-icon>
</view>
</u-number-box>
</view>
</view>
<view class="redMoney">
<view class="">
红包/低佣券
</view>
<view class="">
有20张优惠券可选择
</view>
</view>
</view>
</view>
</template>
<script>
export default {
onLoad(e) {
this.getInfo(e.id)
},
data() {
return {
info: null,
Quantity: 1
}
},
methods: {
valChange(e) {
console.log('当前值为: ' + e.value)
},
async getInfo(id) {
let res = await this.api.getproductorderConfirm({
productId: id,
})
if (res.code == 0) {
this.info = res.data
console.log(this.info, 'tiaoshi1')
}
}
}
}
</script>
<style lang="less" scoped>
.placeOrder {
.placetop {
width: 750rpx;
background: #FFFFFF;
border-radius: 16rpx 16rpx 16rpx 16rpx;
padding: 30rpx;
.placetopone {
.df(space-between);
.placetopInfo {
margin-left: 18rpx;
>view:first-child {
font-weight: 400;
font-size: 32rpx;
color: #333333;
}
>view:nth-child(2),
>view:last-child {
font-weight: 400;
font-size: 24rpx;
color: #666666;
}
}
.placetopmoney {
>view:first-child {
margin-bottom: 20rpx;
>text:first-child {
text-decoration: line-through;
color: #999;
font-weight: 400;
font-size: 24rpx;
}
>text:last-child {
font-weight: bold;
font-size: 28rpx;
color: #333333;
}
}
}
}
.redMoney {
.df(space-between);
margin-top: 30rpx;
.m(30rpx);
>view:first-child {
.df
}
}
}
}
.m(@top, @right: 0, @bottom: 0, @left: 0) {
margin: @top, @right, @bottom, @left
}
.df(@start: flex-start, @position: center) {
display: flex;
align-items: @position;
justify-content: @start;
}
</style>
<style lang="scss">
.minus {
width: 22px;
height: 22px;
border-width: 1px;
border-color: #F0F0F0;
border-style: solid;
border-top-left-radius: 100px;
border-top-right-radius: 100px;
border-bottom-left-radius: 100px;
border-bottom-right-radius: 100px;
@include flex;
justify-content: center;
align-items: center;
}
.plus {
width: 22px;
height: 22px;
background-color: #FFF1EC;
border-radius: 50%;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
justify-content: center;
align-items: center;
}
</style>