|
@ -9,6 +9,30 @@ |
|
|
<!-- 商品信息 --> |
|
|
<!-- 商品信息 --> |
|
|
<view class="content-wrapper"> |
|
|
<view class="content-wrapper"> |
|
|
|
|
|
|
|
|
|
|
|
<!-- 快捷下单内容展示 --> |
|
|
|
|
|
<view class="quick-order-content" v-if="quickOrderContent.type"> |
|
|
|
|
|
<view class="section-wrapper"> |
|
|
|
|
|
<view class="section-title"> |
|
|
|
|
|
<view class="title-bar"></view> |
|
|
|
|
|
<text>{{getOrderTypeName(quickOrderContent.type)}}</text> |
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
<!-- 拍照订单显示图片 --> |
|
|
|
|
|
<view class="photo-content" v-if="quickOrderContent.type === '0' && quickOrderContent.imageUrl"> |
|
|
|
|
|
<image :src="quickOrderContent.imageUrl" mode="aspectFill" class="order-image" @click="previewImage"></image> |
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
<!-- 语音订单显示语音信息 --> |
|
|
|
|
|
<voice-player |
|
|
|
|
|
v-if="quickOrderContent.type === '2' && quickOrderContent.voiceUrl" |
|
|
|
|
|
:voiceUrl="quickOrderContent.voiceUrl" |
|
|
|
|
|
@playStarted="onVoicePlayStarted" |
|
|
|
|
|
@playEnded="onVoicePlayEnded" |
|
|
|
|
|
@playError="onVoicePlayError" |
|
|
|
|
|
></voice-player> |
|
|
|
|
|
</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
<uv-checkbox-group |
|
|
<uv-checkbox-group |
|
|
shape="circle" |
|
|
shape="circle" |
|
|
v-model="checkboxValue"> |
|
|
v-model="checkboxValue"> |
|
@ -93,10 +117,14 @@ |
|
|
</view> |
|
|
</view> |
|
|
|
|
|
|
|
|
<!-- 底部按钮 --> |
|
|
<!-- 底部按钮 --> |
|
|
<view class="order-submit"> |
|
|
|
|
|
|
|
|
<view class="order-submit" v-ifan class="s">="productInfo.isPay != 'Y'"> |
|
|
<button class="submit-btn-close" @click="cancelOrderFast">取消</button> |
|
|
<button class="submit-btn-close" @click="cancelOrderFast">取消</button> |
|
|
<button class="submit-btn" @click="submitOrder">快捷下单(¥{{ totalPrice }})</button> |
|
|
<button class="submit-btn" @click="submitOrder">快捷下单(¥{{ totalPrice }})</button> |
|
|
</view> |
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
<view class="order-submit" v-else> |
|
|
|
|
|
<button class="submit-btn" style="background-color: #999999; color: #cccccc;">已下单</button> |
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
<!-- 地址选择弹窗 --> |
|
|
<!-- 地址选择弹窗 --> |
|
|
<uv-popup ref="addressPopup" :round="30" style="padding-bottom: 90rpx;"> |
|
|
<uv-popup ref="addressPopup" :round="30" style="padding-bottom: 90rpx;"> |
|
@ -113,10 +141,12 @@ |
|
|
<script> |
|
|
<script> |
|
|
import redactAddressForm from '../components/address/redactAddressForm.vue'; |
|
|
import redactAddressForm from '../components/address/redactAddressForm.vue'; |
|
|
import addressList from '../components/address/addressList.vue'; |
|
|
import addressList from '../components/address/addressList.vue'; |
|
|
|
|
|
import VoicePlayer from '@/components/VoicePlayer.vue'; |
|
|
export default { |
|
|
export default { |
|
|
components: { |
|
|
components: { |
|
|
redactAddressForm, |
|
|
redactAddressForm, |
|
|
addressList |
|
|
|
|
|
|
|
|
addressList, |
|
|
|
|
|
VoicePlayer |
|
|
}, |
|
|
}, |
|
|
data() { |
|
|
data() { |
|
|
return { |
|
|
return { |
|
@ -133,7 +163,12 @@ |
|
|
addressTotal: 0, |
|
|
addressTotal: 0, |
|
|
orderInfo: [], |
|
|
orderInfo: [], |
|
|
isLoading: false, // 加载状态 |
|
|
isLoading: false, // 加载状态 |
|
|
shouldSubmitOrder: false // 标记是否应该在获取地址后自动提交订单 |
|
|
|
|
|
|
|
|
shouldSubmitOrder: false, // 标记是否应该在获取地址后自动提交订单 |
|
|
|
|
|
quickOrderContent: { // 快捷下单内容 |
|
|
|
|
|
type: '', |
|
|
|
|
|
imageUrl: '', |
|
|
|
|
|
voiceUrl: '' |
|
|
|
|
|
} |
|
|
}; |
|
|
}; |
|
|
}, |
|
|
}, |
|
|
computed: { |
|
|
computed: { |
|
@ -161,6 +196,7 @@ |
|
|
// 获取地址列表 |
|
|
// 获取地址列表 |
|
|
this.getAddressList(); |
|
|
this.getAddressList(); |
|
|
}, |
|
|
}, |
|
|
|
|
|
|
|
|
methods: { |
|
|
methods: { |
|
|
// 获取订单信息 |
|
|
// 获取订单信息 |
|
|
getOrderInfo() { |
|
|
getOrderInfo() { |
|
@ -197,6 +233,13 @@ |
|
|
console.log(res.result); |
|
|
console.log(res.result); |
|
|
|
|
|
|
|
|
this.productInfo = res.result; |
|
|
this.productInfo = res.result; |
|
|
|
|
|
|
|
|
|
|
|
// 提取快捷下单内容 |
|
|
|
|
|
this.quickOrderContent = { |
|
|
|
|
|
type: res.result.type || '', |
|
|
|
|
|
imageUrl: res.result.imageUrl || '', |
|
|
|
|
|
voiceUrl: res.result.voiceUrl || '' |
|
|
|
|
|
}; |
|
|
} |
|
|
} |
|
|
}); |
|
|
}); |
|
|
}, |
|
|
}, |
|
@ -335,6 +378,7 @@ |
|
|
this.$api('createSumOrder', data, res => { |
|
|
this.$api('createSumOrder', data, res => { |
|
|
uni.hideLoading(); |
|
|
uni.hideLoading(); |
|
|
if (res.code === 200) { |
|
|
if (res.code === 200) { |
|
|
|
|
|
this.productInfo.isPay = 'Y' |
|
|
uni.$emit('getQuickOrderInfo') |
|
|
uni.$emit('getQuickOrderInfo') |
|
|
uni.requestPaymentWxPay(res) |
|
|
uni.requestPaymentWxPay(res) |
|
|
.then(e => { |
|
|
.then(e => { |
|
@ -383,13 +427,52 @@ |
|
|
} |
|
|
} |
|
|
}) |
|
|
}) |
|
|
}, |
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
// 获取订单类型名称 |
|
|
|
|
|
getOrderTypeName(type) { |
|
|
|
|
|
const typeMap = { |
|
|
|
|
|
'0': '拍照下单', |
|
|
|
|
|
'2': '语音下单' |
|
|
|
|
|
}; |
|
|
|
|
|
return typeMap[type] || '快捷下单'; |
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
// 预览图片 |
|
|
|
|
|
previewImage() { |
|
|
|
|
|
if (!this.quickOrderContent.imageUrl) { |
|
|
|
|
|
uni.showToast({ |
|
|
|
|
|
title: '图片不存在', |
|
|
|
|
|
icon: 'none' |
|
|
|
|
|
}); |
|
|
|
|
|
return; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
uni.previewImage({ |
|
|
|
|
|
current: this.quickOrderContent.imageUrl, |
|
|
|
|
|
urls: [this.quickOrderContent.imageUrl] |
|
|
|
|
|
}); |
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
// 语音播放开始事件 |
|
|
|
|
|
onVoicePlayStarted() { |
|
|
|
|
|
console.log('语音播放开始'); |
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
// 语音播放结束事件 |
|
|
|
|
|
onVoicePlayEnded() { |
|
|
|
|
|
console.log('语音播放结束'); |
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
// 语音播放错误事件 |
|
|
|
|
|
onVoicePlayError(error) { |
|
|
|
|
|
console.error('语音播放错误', error); |
|
|
|
|
|
}, |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
</script> |
|
|
</script> |
|
|
|
|
|
|
|
|
<style scoped lang="scss"> |
|
|
<style scoped lang="scss"> |
|
|
.hand-firm { |
|
|
.hand-firm { |
|
|
min-height: 100vh; |
|
|
|
|
|
background-color: #f6f6f6; |
|
|
background-color: #f6f6f6; |
|
|
padding-bottom: 120rpx; |
|
|
padding-bottom: 120rpx; |
|
|
|
|
|
|
|
@ -598,5 +681,25 @@ |
|
|
border-radius: 45rpx; |
|
|
border-radius: 45rpx; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.quick-order-content { |
|
|
|
|
|
.photo-content { |
|
|
|
|
|
padding: 30rpx; |
|
|
|
|
|
text-align: center; |
|
|
|
|
|
|
|
|
|
|
|
.order-image { |
|
|
|
|
|
width: 200rpx; |
|
|
|
|
|
height: 200rpx; |
|
|
|
|
|
border-radius: 12rpx; |
|
|
|
|
|
margin-bottom: 20rpx; |
|
|
|
|
|
background-color: #f9f9f9; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.image-desc { |
|
|
|
|
|
font-size: 26rpx; |
|
|
|
|
|
color: #666; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
} |
|
|
} |
|
|
</style> |
|
|
</style> |