root/zyejMAll-mobile
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

积分兑换详情页替换与接口对接

Browse Source
This commit is contained in:
77 2024-10-22 10:50:18 +08:00
parent deee0ca751
commit 54f8adf15e
4 changed files with 671 additions and 553 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

288
pages/activity/point/exchange_detail.vue
View File

@ -2,13 +2,14 @@
<template>
<s-layout title="兑换详情" navbar="normal" :leftWidth="0" :rightWidth="0">
<view class="main">
<!-- 收货地址 -->
<view class="t-address">
<view class="t">
<text class="l">TEST TQQQ</text>
<text class="r">13615935246</text>
<text class="l">{{ state.orderInfo.receiverName }}</text>
<text class="r">{{ state.orderInfo.receiverMobile }}</text>
</view>
<view class="b">
北京市 北京市 北京市 北京市
{{ state.orderInfo.receiverAreaName }} {{ state.orderInfo.receiverDetailAddress }}
</view>
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/0f01dda22fb349c40c4659d73cb346a1423fee44c9d53eb07bdae1a1e11b5299.png"
@ -17,22 +18,23 @@
<view class="c-goods">
<view class="t">
共1件商品
共{{item.count}}件商品
</view>
<view class="b-detail">
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/21cf998c40ecd9d506f884bbd7540afc2e7928ab0e4ab54afede1fcc48a10972.png"
class="img" mode=""></image>
<view class="b-detail" v-for="(item,index) in state.orderInfo.items" :key="item.goods_id">
<image :src="item.picUrl" class="img" mode=""></image>
<view class="right">
<view class="t">
Xiaomi Citi 2 冰冰蓝 8GB + 128GB <text class="r">x1</text>
<view class="ss-line-2" style=" width: 88%;">
{{item.spuName}}
</view>
<text class="r">x{{item.count}}</text>
</view>
<view class="c">
冰冰蓝，8+128
{{item.properties.map((property) => property.valueName).join(' ')}}
</view>
<view class="b">
10积分
10积分（待对接接口）
</view>
</view>
</view>
@ -44,8 +46,8 @@
订单编号:
</view>
<view class="r">
wx23556151561321321351213
<view class="copy-btn">
{{ state.orderInfo.no }}
<view class="copy-btn" @click="onCopy">
复制
</view>
</view>
@ -56,7 +58,7 @@
订单状态:
</view>
<view class="r">
未发货
{{ formatOrderStatus(state.orderInfo) }}
</view>
</view>
<view class="ddxx">
@ -64,7 +66,7 @@
下单时间:
</view>
<view class="r">
2024-10-18 15:46:03
{{ sheep.$helper.timeFormat(state.orderInfo.createTime, 'yyyy-mm-dd hh:MM:ss') }}
</view>
</view>
<view class="ddxx">
@ -72,7 +74,7 @@
支付积分
</view>
<view class="r">
10
10（待接口对接）
</view>
</view>
</view>
@ -82,61 +84,189 @@
<script setup>
import sheep from '@/sheep';
import {
onLoad,
onReachBottom
onLoad
} from '@dcloudio/uni-app';
import {
reactive,
ref
} from 'vue';
import PointApi from '@/sheep/api/promotion/point';
import SLayout from '@/sheep/components/s-layout/s-layout.vue';
import {
isEmpty
} from 'lodash-es';
import {
fen2yuan,
formatOrderStatus,
formatOrderStatusDescription,
handleOrderButtons,
} from '@/sheep/hooks/useGoods';
import OrderApi from '@/sheep/api/trade/order';
import DeliveryApi from '@/sheep/api/trade/delivery';
import PickUpVerify from '@/pages/order/pickUpVerify.vue';
// 计算页面高度
const {
safeAreaInsets,
safeArea
} = sheep.$platform.device;
const statusBarHeight = sheep.$platform.device.statusBarHeight * 2;
const pageHeight =
(safeArea.height + safeAreaInsets.bottom) * 2 + statusBarHeight - sheep.$platform.navbar - 350;
const headerBg = sheep.$url.css('/static/img/shop/order/order_bg.png');
const sPointCardRef = ref();
// 查询活动列表
const activityPageParams = reactive({
pageNo: 1, // 页码
pageSize: 5, // 每页数量
const state = reactive({
orderInfo: {},
merchantTradeNo: '', // 商户订单号
comeinType: '', // 进入订单详情的来源类型
});
const activityTotal = ref(0); // 活动总数
const activityCount = ref(0); // 已加载活动数量
const loadStatus = ref(''); // 页面加载状态
async function getActivityList() {
loadStatus.value = 'loading';
// ========== 门店自提（核销） ==========
const systemStore = ref({}); // 门店信息
// 复制
const onCopy = () => {
sheep.$helper.copyText(state.orderInfo.no);
};
// 去支付
function onPay(payOrderId) {
sheep.$router.go('/pages/pay/index', {
id: payOrderId,
});
}
// 查看商品
function onGoodsDetail(id) {
sheep.$router.go('/pages/goods/index', {
id,
});
}
// 取消订单
async function onCancel(orderId) {
uni.showModal({
title: '提示',
content: '确定要取消订单吗?',
success: async function(res) {
if (!res.confirm) {
return;
}
const {
code
} = await OrderApi.cancelOrder(orderId);
if (code === 0) {
await getOrderDetail(orderId);
}
},
});
}
// 查看物流
async function onExpress(id) {
sheep.$router.go('/pages/order/express/log', {
id,
});
}
// 确认收货 TODO 芋艿：待测试
async function onConfirm(orderId, ignore = false) {
// 需开启确认收货组件
// todo: 芋艿：待接入微信
// 1.怎么检测是否开启了发货组件功能？如果没有开启的话就不能在这里return出去
// 2.如果开启了走mpConfirm方法,需要在App.vue的show方法中拿到确认收货结果
let isOpenBusinessView = true;
if (
sheep.$platform.name === 'WechatMiniProgram' &&
!isEmpty(state.orderInfo.wechat_extra_data) &&
isOpenBusinessView &&
!ignore
) {
mpConfirm(orderId);
return;
}
// 正常的确认收货流程
const {
code
} = await OrderApi.receiveOrder(orderId);
if (code === 0) {
await getOrderDetail(orderId);
}
}
// #ifdef MP-WEIXIN
// 小程序确认收货组件
function mpConfirm(orderId) {
if (!wx.openBusinessView) {
sheep.$helper.toast(`请升级微信版本`);
return;
}
wx.openBusinessView({
businessType: 'weappOrderConfirm',
extraData: {
merchant_trade_no: state.orderInfo.wechat_extra_data.merchant_trade_no,
transaction_id: state.orderInfo.wechat_extra_data.transaction_id,
},
success(response) {
console.log('success:', response);
if (response.errMsg === 'openBusinessView:ok') {
if (response.extraData.status === 'success') {
onConfirm(orderId, true);
}
}
},
fail(error) {
console.log('error:', error);
},
complete(result) {
console.log('result:', result);
},
});
}
// #endif
// 评价
function onComment(id) {
sheep.$router.go('/pages/goods/comment/add', {
id,
});
}
const pickUpVerifyRef = ref();
async function getOrderDetail(id) {
// 对详情数据进行适配
let res;
if (state.comeinType === 'wechat') {
// TODO 芋艿：微信场景下
res = await OrderApi.getOrder(id, {
merchant_trade_no: state.merchantTradeNo,
});
} else {
res = await OrderApi.getOrder(id);
}
if (res.code === 0) {
state.orderInfo = res.data;
handleOrderButtons(state.orderInfo);
// 配送方式：门店自提
if (res.data.pickUpStoreId) {
const {
data
} = await PointApi.getPointActivityPage(activityPageParams);
await sPointCardRef.value.concatActivity(data.list);
activityCount.value = sPointCardRef.value.getActivityCount();
activityTotal.value = data.total;
loadStatus.value = activityCount.value < activityTotal.value ? 'more' : 'noMore';
} = await DeliveryApi.getDeliveryPickUpStore(res.data.pickUpStoreId);
systemStore.value = data || {};
}
// 加载更多
function loadMore() {
if (state.loadStatus !== 'noMore') {
activityPageParams.pageNo += 1;
getActivityList();
if (state.orderInfo.deliveryType === 2 && state.orderInfo.payStatus) {
pickUpVerifyRef.value && pickUpVerifyRef.value.markCode(res.data.pickUpVerifyCode);
}
} else {
sheep.$router.back();
}
}
// 上拉加载更多
onReachBottom(() => {
loadMore();
});
onLoad(() => {
getActivityList();
onLoad(async (options) => {
let id = 0;
if (options.id) {
id = options.id;
}
// TODO 芋艿：下面两个变量，后续接入
state.comeinType = options.comein_type;
if (state.comeinType === 'wechat') {
state.merchantTradeNo = options.merchant_trade_no;
}
await getOrderDetail(id);
});
</script>
@ -149,7 +279,7 @@
padding-bottom: 0;
.t {
font-size: 19px;
font-size: 30rpx;
color: black;
display: flex;
font-weight: 700;
@ -161,7 +291,7 @@
}
.b {
font-size: 17px;
font-size: 26rpx;
color: rgba(156, 143, 114);
}
@ -177,7 +307,7 @@
background: white;
&>.t {
font-size: 19px;
font-size: 30rpx;
border-bottom: 1px solid rgba(240, 240, 240);
padding-bottom: 15px;
}
@ -194,11 +324,13 @@
.right {
flex: 1;
.t {
font-size: 14px;
font-size: 26rpx;
font-weight: 500;
display: flex;
justify-content: space-between;
.r {
color: rgba(134, 139, 151);
}
@ -218,30 +350,52 @@
.b-goodsDetail {
margin: 9px 0;
padding: 15px 10px;
padding: 7px 10px;
background: white;
}
.ddxx {
display: flex;
justify-content: space-between;
margin: 10px 0;
margin: 8px 0;
.l {
font-size: 17px;
.r{
}
font-size: 15px;
.r {}
}
.r {
font-size: 16px;
font-size: 14px;
color: rgba(102, 102, 102);
display: flex;
align-items: center;
.copy-btn {
width: 3.125rem;
line-height: 1.5625rem;
border-radius: 0.78125rem;
padding: 0;
background: #eeeeee;
font-size: 0.6875rem;
font-weight: 400;
color: #333333;
position: relative;
text-align: center;
margin-left: 10px;
padding:3px 5px;
border:1px solid black;
&:after {
content: ' ';
width: 200%;
height: 200%;
position: absolute;
top: 0;
left: 0;
// border: 1px solid rgba(0, 0, 0, 0.2);
transform: scale(0.5);
transform-origin: 0 0;
box-sizing: border-box;
border-radius: 10px;
}
}
}

1
pages/goods/point.vue
View File

@ -166,6 +166,7 @@
count: sku.count,
},
],
point: true,
}),
});
}

156
pages/order/confirm.vue
View File

@ -5,26 +5,14 @@
<!-- 商品信息 -->
<view class="order-card-box ss-m-b-14">
<s-goods-item
v-for="item in state.orderInfo.items"
:key="item.skuId"
:img="item.picUrl"
:title="item.spuName"
:skuText="item.properties.map((property) => property.valueName).join(' ')"
:price="item.price"
:num="item.count"
marginBottom="10"
/>
<s-goods-item v-for="item in state.orderInfo.items" :key="item.skuId" :img="item.picUrl"
:title="item.spuName" :skuText="item.properties.map((property) => property.valueName).join(' ')"
:price="item.price" :num="item.count" marginBottom="10" />
<view class="order-item ss-flex ss-col-center ss-row-between ss-p-x-20 bg-white ss-r-10">
<view class="item-title">订单备注</view>
<view class="ss-flex ss-col-center">
<uni-easyinput
maxlength="20"
placeholder="建议留言前先与商家沟通"
v-model="state.orderPayload.remark"
:inputBorder="false"
:clearable="false"
/>
<uni-easyinput maxlength="20" placeholder="建议留言前先与商家沟通" v-model="state.orderPayload.remark"
:inputBorder="false" :clearable="false" />
</view>
</view>
</view>
@ -40,32 +28,25 @@
</text>
</view>
</view>
<view
v-if="state.orderPayload.pointActivityId"
class="order-item ss-flex ss-col-center ss-row-between"
>
<view v-if="state.orderPayload.pointActivityId" class="order-item ss-flex ss-col-center ss-row-between">
<view class="item-title">兑换积分</view>
<view class="ss-flex ss-col-center">
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/b0c400b1b30a9ca45031093595e42533de267823285c702fed250061920debf0.png"
class="score-img"
/>
class="score-img" />
<text class="item-value ss-m-r-24">
{{ state.orderInfo.usePoint }}
</text>
</view>
</view>
<view
class="order-item ss-flex ss-col-center ss-row-between"
v-if="state.orderInfo.type === 0 || state.orderPayload.pointActivityId"
>
<view class="order-item ss-flex ss-col-center ss-row-between"
v-if="state.orderInfo.type === 0 || state.orderPayload.pointActivityId">
<view class="item-title">积分抵扣</view>
<view class="ss-flex ss-col-center">
{{ state.pointStatus || state.orderPayload.pointActivityId ? '剩余积分' : '当前积分' }}
<image
src="https://zysc.fjptzykj.com:3000/shangcheng/b0c400b1b30a9ca45031093595e42533de267823285c702fed250061920debf0.png"
class="score-img"
/>
class="score-img" />
<text class="item-value ss-m-r-24">
{{
state.pointStatus || state.orderPayload.pointActivityId
@ -74,18 +55,13 @@
}}
</text>
<checkbox-group @change="changeIntegral" v-if="!state.orderPayload.pointActivityId">
<checkbox
:checked="state.pointStatus"
:disabled="!state.orderInfo.totalPoint || state.orderInfo.totalPoint <= 0"
/>
<checkbox :checked="state.pointStatus"
:disabled="!state.orderInfo.totalPoint || state.orderInfo.totalPoint <= 0" />
</checkbox-group>
</view>
</view>
<!-- 快递配置时，信息的展示 -->
<view
class="order-item ss-flex ss-col-center ss-row-between"
v-if="addressState.deliveryType === 1"
>
<view class="order-item ss-flex ss-col-center ss-row-between" v-if="addressState.deliveryType === 1">
<view class="item-title">运费</view>
<view class="ss-flex ss-col-center">
<text class="item-value ss-m-r-24" v-if="state.orderInfo.price.deliveryPrice > 0">
@ -95,55 +71,32 @@
</view>
</view>
<!-- 门店自提时，需要填写姓名和手机号 -->
<view
class="order-item ss-flex ss-col-center ss-row-between"
v-if="addressState.deliveryType === 2"
>
<view class="order-item ss-flex ss-col-center ss-row-between" v-if="addressState.deliveryType === 2">
<view class="item-title">联系人</view>
<view class="ss-flex ss-col-center">
<uni-easyinput
maxlength="20"
placeholder="请填写您的联系姓名"
v-model="addressState.receiverName"
:inputBorder="false"
:clearable="false"
/>
<uni-easyinput maxlength="20" placeholder="请填写您的联系姓名" v-model="addressState.receiverName"
:inputBorder="false" :clearable="false" />
</view>
</view>
<view
class="order-item ss-flex ss-col-center ss-row-between"
v-if="addressState.deliveryType === 2"
>
<view class="order-item ss-flex ss-col-center ss-row-between" v-if="addressState.deliveryType === 2">
<view class="item-title">联系电话</view>
<view class="ss-flex ss-col-center">
<uni-easyinput
maxlength="20"
placeholder="请填写您的联系电话"
v-model="addressState.receiverMobile"
:inputBorder="false"
:clearable="false"
/>
<uni-easyinput maxlength="20" placeholder="请填写您的联系电话" v-model="addressState.receiverMobile"
:inputBorder="false" :clearable="false" />
</view>
</view>
<!-- 优惠劵：只有 type = 0 普通订单（非拼团、秒杀、砍价），才可以使用优惠劵 -->
<view
class="order-item ss-flex ss-col-center ss-row-between"
v-if="state.orderInfo.type === 0"
>
<view class="order-item ss-flex ss-col-center ss-row-between" v-if="state.orderInfo.type === 0">
<view class="item-title">优惠券</view>
<view class="ss-flex ss-col-center" @tap="state.showCoupon = true">
<text class="item-value text-red" v-if="state.orderPayload.couponId > 0">
-￥{{ fen2yuan(state.orderInfo.price.couponPrice) }}
</text>
<text
class="item-value"
:class="
<text class="item-value" :class="
state.couponInfo.filter((coupon) => coupon.match).length > 0
? 'text-red'
: 'text-disabled'
"
v-else
>
" v-else>
{{
state.couponInfo.filter((coupon) => coupon.match).length > 0
? state.couponInfo.filter((coupon) => coupon.match).length + ' 张可用'
@ -153,10 +106,8 @@
<text class="_icon-forward item-icon" />
</view>
</view>
<view
class="order-item ss-flex ss-col-center ss-row-between"
v-if="state.orderInfo.price.discountPrice > 0"
>
<view class="order-item ss-flex ss-col-center ss-row-between"
v-if="state.orderInfo.price.discountPrice > 0">
<view class="item-title">活动优惠</view>
<view class="ss-flex ss-col-center" @tap="state.showDiscount = true">
<text class="item-value text-red">
@ -165,10 +116,7 @@
<text class="_icon-forward item-icon" />
</view>
</view>
<view
class="order-item ss-flex ss-col-center ss-row-between"
v-if="state.orderInfo.price.vipPrice > 0"
>
<view class="order-item ss-flex ss-col-center ss-row-between" v-if="state.orderInfo.price.vipPrice > 0">
<view class="item-title">会员优惠</view>
<view class="ss-flex ss-col-center">
<text class="item-value text-red">
@ -187,19 +135,11 @@
</view>
<!-- 选择优惠券弹框 -->
<s-coupon-select
v-model="state.couponInfo"
:show="state.showCoupon"
@confirm="onSelectCoupon"
@close="state.showCoupon = false"
/>
<s-coupon-select v-model="state.couponInfo" :show="state.showCoupon" @confirm="onSelectCoupon"
@close="state.showCoupon = false" />
<!-- 满额折扣弹框 TODO @puhui999：【折扣】后续要把优惠信息打进去 -->
<s-discount-list
v-model="state.orderInfo"
:show="state.showDiscount"
@close="state.showDiscount = false"
/>
<s-discount-list v-model="state.orderInfo" :show="state.showDiscount" @close="state.showDiscount = false" />
<!-- 底部 -->
<su-fixed bottom :opacity="false" bg="bg-white" placeholder :noFixed="false" :index="200">
@ -209,10 +149,7 @@
￥{{ fen2yuan(state.orderInfo.price.payPrice) }}
</view>
</view>
<button
class="ss-reset-button ui-BG-Main-Gradient ss-r-40 submit-btn ui-Shadow-Main"
@tap="onConfirm"
>
<button class="ss-reset-button ui-BG-Main-Gradient ss-r-40 submit-btn ui-Shadow-Main" @tap="onConfirm">
提交订单
</button>
</view>
@ -221,13 +158,21 @@
</template>
<script setup>
import { reactive, ref, watch } from 'vue';
import { onLoad } from '@dcloudio/uni-app';
import {
reactive,
ref,
watch
} from 'vue';
import {
onLoad
} from '@dcloudio/uni-app';
import AddressSelection from '@/pages/order/addressSelection.vue';
import sheep from '@/sheep';
import OrderApi from '@/sheep/api/trade/order';
import TradeConfigApi from '@/sheep/api/trade/config';
import { fen2yuan } from '@/sheep/hooks/useGoods';
import {
fen2yuan
} from '@/sheep/hooks/useGoods';
const state = reactive({
orderPayload: {},
@ -296,7 +241,10 @@
// 创建订单&跳转
async function submitOrder() {
const { code, data } = await OrderApi.createOrder({
const {
code,
data
} = await OrderApi.createOrder({
items: state.orderPayload.items,
couponId: state.orderPayload.couponId,
remark: state.orderPayload.remark,
@ -324,10 +272,14 @@
sheep.$router.redirect('/pages/pay/index', {
id: data.payOrderId,
});
} else {
} else if(!state.orderPayload.point) {
sheep.$router.redirect('/pages/order/detail', {
id: data.id,
});
}else{
sheep.$router.redirect('/pages/activity/point/exchange_detail', {
id: data.id,
});
}
}
@ -368,7 +320,10 @@
}
const { data, code } = await OrderApi.settlementOrder(parm);
const {
data,
code
} = await OrderApi.settlementOrder(parm);
if (code !== 0) {
return;
}
@ -388,7 +343,10 @@
state.orderPayload = JSON.parse(options.data);
await getOrderInfo();
// 获取交易配置
const { data, code } = await TradeConfigApi.getTradeConfig();
const {
data,
code
} = await TradeConfigApi.getTradeConfig();
if (code === 0) {
addressState.value.isPickUp = data.deliveryPickUpEnabled;
}

5
pages/user/user_vip/list.vue
View File

@ -138,8 +138,13 @@
},
}).then((res) => {
console.log(res,"-----------试用---------------")
if(res.code == 200){
sheep.$helper.toast('试用开通成功');
sheep.$router.go('/pages/index/user')
}else{
sheep.$helper.toast(res.msg);
}
});
}