526 lines
12 KiB
Vue
526 lines
12 KiB
Vue
<template>
|
|
<view class="pay order">
|
|
<view class="pay-info">
|
|
<view style="text-align: center;">
|
|
<up-icon class="icon" name="checkmark-circle-fill" :color="Color" size="50" />
|
|
</view>
|
|
|
|
<view class="title">订单支付成功</view>
|
|
<view class="pay-info-text">
|
|
<text>下单时间</text>
|
|
<text class="text">{{item.created_at}}</text>
|
|
</view>
|
|
<view class="pay-info-text">
|
|
<text>支付方式</text>
|
|
<text class="text">支付宝支付</text>
|
|
</view>
|
|
<view class="pay-info-text">
|
|
<text>支付金额</text>
|
|
<text class="text">¥{{item.total_price}}</text>
|
|
</view>
|
|
<view class="pay-info-text">
|
|
<text>支付状态</text>
|
|
<text class="text">成功</text>
|
|
</view>
|
|
</view>
|
|
<view class="pay-btn">
|
|
<text class="btn2" @click="toWeb(0)" v-if="is_subscribe == 0">关注公众号 订阅物流</text>
|
|
<text class="btn2" @click="toWeb(1)" v-else-if="is_subscribe == 1">逛逛首页</text>
|
|
<text class="btn1" @click="toOrder">查看订单</text>
|
|
</view>
|
|
|
|
<buy-succsess :showBuy="showBuy" @close="showBuy = false" :payPrice="item.total_price" :from="from" :link_id="link_id" @share="shareSuccess"></buy-succsess>
|
|
|
|
<!-- 隐私协议弹窗 -->
|
|
<privacy-popup :show-dialog="showPrivacy" @close="showPrivacy = false" @agree="agreePrivacy()" @refuse="refusePrivacy()"></privacy-popup>
|
|
|
|
<!-- 为你推荐 -->
|
|
<view class="forYou" v-if="hotList.length">
|
|
<image class="pic" src="https://ct-upimg.yx090.com/ju8hn6/shop/image/2024/06/04/46htQZUX302oWnlo09LHUlbUL0gt1VaWftK34mUl.png"></image>
|
|
<view class="groupBox">
|
|
<view v-for="item in hotList" :key="item.id" class="item" @click.stop="hanleJump(item.id)">
|
|
<image :src="item.face_img" class="img" mode="aspectFill"></image>
|
|
<view class="zong">
|
|
<view class="tit">{{item.title}}</view>
|
|
<view class="number">
|
|
<text class="icon">￥</text>
|
|
<text v-if="item.price > 0">{{item.price}}</text>
|
|
<block v-else>
|
|
<text v-if="item.max_price == item.min_price">{{item.min_price}}</text>
|
|
<text v-else>{{item.min_price}}~{{item.max_price}}</text>
|
|
</block>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="bottom" v-if="page >= lastPage">— 没有更多啦 —</view>
|
|
</view>
|
|
|
|
<up-popup :show="showCase" :customStyle="customStyle" catchtouchmove="preventD" :closeOnClickOverlay="false" mode="center">
|
|
<view class="caseBox">
|
|
<view class="title">您的跟团分享社群积分已到账</view>
|
|
<view class="num">积分<text>+{{scoreShareInfo.share_score * 1}}</text></view>
|
|
<view class="copycase" @click="showCase = false">知道了</view>
|
|
</view>
|
|
</up-popup>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { ref, reactive, toRefs } from 'vue'
|
|
import { get, post } from '@/api/request.js'
|
|
import buySuccsess from '@/components/buy/BuySuccess.vue'
|
|
import privacyPopup from '@/components/privacyPopup/index.vue'
|
|
import { Style } from '@/utils/list.js'
|
|
import { uniShare } from '@/components/common.js'
|
|
|
|
export default {
|
|
components: {
|
|
buySuccsess,
|
|
privacyPopup
|
|
},
|
|
setup() {
|
|
const data = reactive({
|
|
customStyle: {
|
|
width: '86%',
|
|
'border-radius': '10px'
|
|
},
|
|
showBuy: false,
|
|
id: '',
|
|
type: '',
|
|
item: {},
|
|
goods: {},
|
|
shareUrl: '',
|
|
imageUrl: '',
|
|
pay_id: '',
|
|
role: Number(uni.getStorageSync('role')) !== 1,
|
|
score_on: Number(uni.getStorageSync('score_on')) === 1,
|
|
from: 0,
|
|
link_id: 0,
|
|
Color: uni.getStorageSync('theme_color'),
|
|
priceColor: Style[uni.getStorageSync('theme_index') * 1].priceColor,
|
|
needPrivacy: false,
|
|
showPrivacy: false,
|
|
is_subscribe: -1,
|
|
page: 1,
|
|
lastPage: 0,
|
|
hotList: [],
|
|
scoreShareInfo: {},
|
|
showCase: false
|
|
})
|
|
|
|
async function getInfo() {
|
|
let res = ''
|
|
if (data.type == 1) {
|
|
res = await get(`/api/v1/orderMain/${data.id}`)
|
|
} else {
|
|
res = await get(`/api/v1/order/${data.id}`)
|
|
}
|
|
data.item = res.data
|
|
let price = 0
|
|
if (data.type == 1) {
|
|
let oeder = res.data.orders
|
|
oeder.forEach((i) => {
|
|
i.items.forEach((j) => {
|
|
if (j.price * 1 > price) {
|
|
price = j.price
|
|
data.goods = j
|
|
}
|
|
})
|
|
})
|
|
} else {
|
|
let list = res.data.items
|
|
list.forEach((j) => {
|
|
if (j.price > price) {
|
|
price = j.price
|
|
data.goods = j
|
|
}
|
|
})
|
|
}
|
|
console.log(data.goods)
|
|
}
|
|
|
|
function toOrder() {
|
|
uni.redirectTo({
|
|
url: '/pages/order/list/index'
|
|
})
|
|
}
|
|
|
|
// 分享路径
|
|
async function getShareUrl() {
|
|
if(data.link_id) {
|
|
let query = `id=${data.goods.shop_goods_id}&pay_id=${data.pay_id}&link_id=${data.link_id}`
|
|
await post('/api/v1/user/share', {
|
|
page: 'pages/smallshop/classTwo',
|
|
query: query
|
|
}).then((res) => {
|
|
data.shareUrl = res.data.path
|
|
})
|
|
} else if (data.goods.shop_group_goods_id != 0) {
|
|
let query = `id=${data.goods.shop_group_goods_id}`
|
|
if(data.role && data.score_on && !data.from) {
|
|
query = `id=${data.goods.shop_group_goods_id}&pay_id=${data.pay_id}`
|
|
}
|
|
await post('/api/v1/user/share', {
|
|
page: 'pages/groups/index',
|
|
query: query
|
|
}).then((res) => {
|
|
data.shareUrl = res.data.path
|
|
})
|
|
} else {
|
|
let query = `id=${data.goods.shop_goods_id}`
|
|
if(data.role && data.score_on && !data.from) {
|
|
query = `id=${data.goods.shop_goods_id}&pay_id=${data.pay_id}`
|
|
}
|
|
await post('/api/v1/user/share', {
|
|
page: 'pages/productDetails/index',
|
|
query: query
|
|
}).then((res) => {
|
|
data.shareUrl = res.data.path
|
|
})
|
|
}
|
|
console.log('分享链接', data.shareUrl, data.goods.shop_group_goods_id)
|
|
}
|
|
|
|
const toWeb = (val) => {
|
|
if(val == 0) {
|
|
uni.navigateTo({
|
|
url: '/pages/article/index'
|
|
})
|
|
} else if(val == 1) {
|
|
uni.switchTab({
|
|
url: '/pages/index/index'
|
|
})
|
|
}
|
|
}
|
|
|
|
// 获取分享图
|
|
async function getShareTemplate() {
|
|
await get(`/api/v1/goods/share/${data.goods.shop_goods_id}`, { type: 6 }).then((res) => {
|
|
data.imageUrl = res.data.image
|
|
})
|
|
}
|
|
|
|
function completeAvatar() {
|
|
data.showBuy = true
|
|
}
|
|
|
|
function getShowPrivacy() {
|
|
if(uni.getPrivacySetting) {
|
|
uni.getPrivacySetting({
|
|
success: res => {
|
|
console.log("是否需要授权:", res.needAuthorization, ", 隐私协议的名称为:", res.privacyContractName)
|
|
if (res.needAuthorization) {
|
|
data.needPrivacy = true
|
|
} else{
|
|
data.needPrivacy = false
|
|
}
|
|
},
|
|
fail: () => { },
|
|
complete: () => { },
|
|
})
|
|
} else {
|
|
// 低版本基础库不支持 wx.getPrivacySetting 接口，隐私接口可以直接调用
|
|
data.needPrivacy = false
|
|
}
|
|
}
|
|
|
|
function refusePrivacy() {
|
|
data.showPrivacy = false
|
|
data.needPrivacy = true
|
|
}
|
|
|
|
function agreePrivacy() {
|
|
data.showPrivacy = false
|
|
data.needPrivacy = false
|
|
}
|
|
|
|
function getUserInfo() {
|
|
get('/api/v1/shopScore/user').then((res) => {
|
|
data.is_subscribe = res.data.user && res.data.user.is_subscribe
|
|
uni.setStorageSync('subscribe', data.is_subscribe)
|
|
})
|
|
}
|
|
|
|
const getHotGroup = () => {
|
|
get('/api/v1/special/hot', { page: data.page }).then((res) => {
|
|
data.hotList = data.hotList.concat(res.data)
|
|
data.lastPage = res.meta.last_page
|
|
})
|
|
}
|
|
|
|
const hanleJump = (id) => {
|
|
uni.navigateTo({
|
|
url: '/pages/groups/index?id=' + id
|
|
})
|
|
}
|
|
|
|
function receiveScoreShare() {
|
|
post('/api/v1/shopScore/share/receive', { pay_id: data.pay_id }).then((res) => {
|
|
// 1下单人 2下单人当前销售 其他人返回值为空数组
|
|
if(res.data.length === 0) {
|
|
|
|
} else {
|
|
data.scoreShareInfo = res.data
|
|
data.showCase = true
|
|
}
|
|
})
|
|
}
|
|
|
|
function shareSuccess() {
|
|
data.showBuy = false
|
|
let title = '老板，跟团成功了，期待早日收到货~'
|
|
let imageUrl = data.imageUrl
|
|
let path = data.shareUrl
|
|
uniShare(title, imageUrl, path)
|
|
receiveScoreShare()
|
|
}
|
|
|
|
return {
|
|
uniShare,
|
|
...toRefs(data),
|
|
getInfo,
|
|
toOrder,
|
|
getShareUrl,
|
|
toWeb,
|
|
getShareTemplate,
|
|
completeAvatar,
|
|
getUserInfo,
|
|
getShowPrivacy,
|
|
refusePrivacy,
|
|
agreePrivacy,
|
|
getHotGroup,
|
|
hanleJump,
|
|
receiveScoreShare,
|
|
shareSuccess
|
|
}
|
|
},
|
|
async onLoad(options) {
|
|
// await this.$onLaunched
|
|
this.id = options.id
|
|
this.link_id = options.link_id || 0
|
|
this.type = options.type
|
|
this.pay_id = options.pay_id || ''
|
|
this.from = Number(options.from) || 0
|
|
await this.getInfo()
|
|
setTimeout(async() => {
|
|
await this.getShareUrl()
|
|
}, 500)
|
|
await this.getShareTemplate()
|
|
if(uni.getStorageSync('is_default_avatar')) {
|
|
|
|
} else {
|
|
this.showBuy = true
|
|
}
|
|
this.getShowPrivacy()
|
|
this.getHotGroup()
|
|
},
|
|
onShow() {
|
|
this.getUserInfo()
|
|
},
|
|
onReachBottom() {
|
|
if (this.page < this.lastPage) {
|
|
this.page++
|
|
this.getHotGroup()
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.pay {
|
|
margin: 100rpx 24rpx;
|
|
box-sizing: border-box;
|
|
&-info {
|
|
position: relative;
|
|
background-color: #fff;
|
|
border-radius: 10rpx;
|
|
padding: 30rpx;
|
|
box-sizing: border-box;
|
|
.icon {
|
|
position: absolute;
|
|
top: -50rpx;
|
|
left: 50%;
|
|
transform: translate(-50%);
|
|
}
|
|
.title {
|
|
text-align: center;
|
|
font-size: 34rpx;
|
|
font-weight: bold;
|
|
padding: 30rpx 0 15rpx;
|
|
}
|
|
&-text {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
height: 90rpx;
|
|
font-size: 30rpx;
|
|
|
|
.text {
|
|
font-size: 26rpx;
|
|
color: #555555;
|
|
}
|
|
}
|
|
&-text:not(:last-child) {
|
|
border-bottom: 2rpx solid #e5e5e5;
|
|
}
|
|
}
|
|
|
|
&-btn {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
margin-top: 40rpx;
|
|
.btn1,
|
|
.btn2 {
|
|
font-size: 30rpx;
|
|
width: 100%;
|
|
height: 77rpx;
|
|
line-height: 77rpx;
|
|
border-radius: 49rpx;
|
|
text-align: center;
|
|
margin-top: 30rpx;
|
|
}
|
|
.btn1 {
|
|
border: 1px solid #98989f;
|
|
margin-right: 40rpx;
|
|
background-color: #fff;
|
|
}
|
|
.btn2 {
|
|
color: #fff;
|
|
background: v-bind('Color');
|
|
}
|
|
}
|
|
}
|
|
|
|
.order {
|
|
&-icon {
|
|
display: flex;
|
|
justify-content: center;
|
|
font-size: 34rpx;
|
|
text {
|
|
margin-left: 10rpx;
|
|
}
|
|
}
|
|
&-text {
|
|
color: #666666;
|
|
font-size: 26rpx;
|
|
margin-top: 20rpx;
|
|
}
|
|
.popup {
|
|
padding: 100rpx 0;
|
|
text-align: center;
|
|
image {
|
|
width: 335rpx;
|
|
height: 335rpx;
|
|
background: #bbbbbb;
|
|
border-radius: 8rpx;
|
|
}
|
|
}
|
|
}
|
|
.forYou{
|
|
padding-top: 80rpx;
|
|
.pic{
|
|
width: 180px;
|
|
height: 18px;
|
|
display: block;
|
|
margin: 20rpx auto;
|
|
}
|
|
.groupBox{
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: space-between;
|
|
text-align: center;
|
|
padding: 20rpx 0;
|
|
box-sizing: border-box;
|
|
.item{
|
|
width: 48.5%;
|
|
margin-bottom: 20rpx;
|
|
background: #fff;
|
|
border-radius: 10rpx;
|
|
.img{
|
|
width: 100%;
|
|
height: 343rpx;
|
|
border-radius: 8rpx 8rpx 0 0;
|
|
}
|
|
.zong {
|
|
padding: 0 20rpx;
|
|
box-sizing: border-box;
|
|
padding-bottom: 20rpx;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
flex-direction: column;
|
|
height: 200rpx;
|
|
.tit{
|
|
margin: 10rpx 0;
|
|
text-align: left;
|
|
font-size: 30rpx;
|
|
font-family: Source Han Sans CN;
|
|
font-weight: 400;
|
|
overflow: hidden !important;
|
|
text-overflow: ellipsis !important;
|
|
display: -webkit-box !important;
|
|
-webkit-line-clamp: 2 !important;
|
|
-webkit-box-orient: vertical !important;
|
|
}
|
|
.number{
|
|
text-align: left;
|
|
margin-bottom: 10rpx;
|
|
color: v-bind('priceColor');
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.bottom {
|
|
text-align: center;
|
|
font-size: 24rpx;
|
|
color: #999999;
|
|
padding: 0 0 60rpx;
|
|
}
|
|
}
|
|
.caseBox{
|
|
padding: 40rpx;
|
|
box-sizing: border-box;
|
|
.tit{
|
|
font-size: 30rpx;
|
|
color: #000;
|
|
font-weight: 600;
|
|
padding: 40rpx;
|
|
text-align: center;
|
|
line-height: 50rpx;
|
|
}
|
|
.copycase{
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
height: 80rpx;
|
|
width: 100%;
|
|
border-radius: 8rpx;
|
|
background: v-bind('Color');
|
|
font-size: 26rpx;
|
|
color: #fff;
|
|
}
|
|
.title{
|
|
font-size: 30rpx;
|
|
color: #000;
|
|
font-weight: 600;
|
|
padding: 20rpx 0 40rpx;
|
|
text-align: center;
|
|
}
|
|
.num{
|
|
text-align: center;
|
|
font-size: 28rpx;
|
|
padding-bottom: 40rpx;
|
|
text{
|
|
color: v-bind('Color');
|
|
font-weight: 600;
|
|
font-size: 36rpx;
|
|
}
|
|
}
|
|
}
|
|
</style>
|