xsl/meida_applet
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'develop' of https://gitee.com/yudaocode/yudao-mall-uniapp

Browse Source
This commit is contained in:
YunaiV
2024-10-07 15:23:47 +08:00
parent b6635a5d5c 1ffa754dbe
commit 545d4259c4
9 changed files with 1244 additions and 1312 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/activity/point/list.vue
+55 -57
View File
@@ -1,78 +1,76 @@
<!-- 积分商城：商品列表 -->
<template>
<s-layout title="积分商城">
<view class="ss-p-20">
<view v-for="item in state.pagination.data" :key="item.id" class="ss-m-b-20">
<s-point-card
size="sl"
:data="item"
priceColor="#FF3000"
@tap="sheep.$router.go('/pages/goods/point', { id: item.id })"
/>
</view>
</view>
<s-empty
v-if="state.pagination.total === 0"
icon="/static/goods-empty.png"
text="暂无积分商品"
/>
<uni-load-more
v-if="state.pagination.total > 0"
:status="state.loadStatus"
:content-text="{
contentdown: '上拉加载更多',
}"
@tap="loadmore"
/>
<s-layout title="积分商城" navbar="normal" :leftWidth="0" :rightWidth="0">
<scroll-view
class="scroll-box"
:style="{ height: pageHeight + 'rpx' }"
scroll-y="true"
:scroll-with-animation="false"
:enable-back-to-top="true"
>
<s-point-card ref="sPointCardRef" class="ss-p-x-20 ss-m-t-20"/>
<s-empty
v-if="activityTotal === 0"
icon="/static/goods-empty.png"
text="暂无积分商品"
></s-empty>
<uni-load-more
v-if="activityTotal > 0"
:status="loadStatus"
:content-text="{
contentdown: '上拉加载更多',
}"
@tap="loadMore"
/>
</scroll-view>
</s-layout>
</template>
<script setup>
import sheep from '@/sheep';
import { onLoad, onReachBottom } from '@dcloudio/uni-app';
import { reactive } from 'vue';
import _ from 'lodash';
import { reactive, ref } from 'vue';
import PointApi from '@/sheep/api/promotion/point';
import SLayout from '@/sheep/components/s-layout/s-layout.vue';
const state = reactive({
pagination: {
data: [],
current_page: 1,
total: 1,
last_page: 1,
},
loadStatus: '',
// 计算页面高度
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 sPointCardRef = ref();
// 查询活动列表
const activityPageParams = reactive({
pageNo: 1, // 页码
pageSize: 5, // 每页数量
});
async function getData(page = 1, list_rows = 5) {
// TODO @puhui999：分页重写成，我们的代码风格。原先的有点复杂
state.loadStatus = 'loading';
let res = await sheep.$api.app.scoreShop.list({
list_rows,
page,
});
if (res.error === 0) {
let couponlist = _.concat(state.pagination.data, res.data.data);
state.pagination = {
...res.data,
data: couponlist,
};
if (state.pagination.current_page < state.pagination.last_page) {
state.loadStatus = 'more';
} else {
state.loadStatus = 'noMore';
}
}
const activityTotal = ref(0); // 活动总数
const activityCount = ref(0); // 已加载活动数量
const loadStatus = ref(''); // 页面加载状态
async function getActivityList() {
loadStatus.value = 'loading';
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';
}
// 加载更多
function loadmore() {
function loadMore() {
if (state.loadStatus !== 'noMore') {
getData(state.pagination.current_page + 1);
activityPageParams.pageNo += 1;
getActivityList();
}
}
// 上拉加载更多
onReachBottom(() => {
loadmore();
loadMore();
});
onLoad(() => {
getData();
getActivityList();
});
</script>
pages/goods/point.vue
+69 -114
View File
@@ -28,29 +28,25 @@
/>
<!-- 价格+标题 -->
<view class="title-card ss-m-y-14 ss-m-x-20 ss-p-x-20 ss-p-y-34">
<view class="price-box ss-flex ss-row-between ss-m-b-18">
<view class="ss-flex">
<view class="price-text ss-m-r-16">
{{ getShowPriceText }}
</view>
<view class="tig ss-flex ss-col-center">
<view class="tig-icon ss-flex ss-col-center ss-row-center">
<text class="cicon-alarm"></text>
</view>
<view class="tig-title">积分价</view>
</view>
<view class="title-card detail-card ss-p-y-40 ss-p-x-20">
<view class="ss-flex ss-row-between ss-col-center ss-m-b-18">
<view class="price-box ss-flex ss-col-bottom">
<image
:src="sheep.$url.static('/static/img/shop/goods/score1.svg')"
class="point-img"
></image>
<text class="point-text ss-m-r-16">
{{ getShowPrice.point }}
{{ !getShowPrice.price || getShowPrice.price === 0 ? '' : `+￥${getShowPrice.price}` }}
</text>
</view>
<view class="sales-text">
{{ formatExchange(state.goodsInfo.sales_show_type, state.goodsInfo.sales) }}
</view>
</view>
<view class="ss-flex ss-row-between ss-m-b-60">
<view class="origin-price ss-flex ss-col-center" v-if="state.goodsInfo.marketPrice">
原价
<view class="origin-price-text">
{{ fen2yuan(state.selectedSku.marketPrice || state.goodsInfo.marketPrice) }}
</view>
</view>
<view class="origin-price-text ss-m-b-60" v-if="state.goodsInfo.marketPrice">
原价：￥{{ fen2yuan(state.selectedSku.marketPrice || state.goodsInfo.marketPrice) }}
</view>
<view class="title-text ss-line-2 ss-m-b-6">{{ state.goodsInfo.name || '' }}</view>
<view class="subtitle-text ss-line-1">{{ state.goodsInfo.introduction }}</view>
</view>
@@ -98,8 +94,15 @@
"
:disabled="state.goodsInfo.stock === 0"
>
<view class="price-text">
{{getShowPriceText}}
<view class="price-box ss-flex">
<image
:src="sheep.$url.static('/static/img/shop/goods/score1.svg')"
style="width: 36rpx;height: 36rpx;margin: 0 4rpx;"
></image>
<text class="point-text ss-m-r-16">
{{ getShowPrice.point }}
{{ !getShowPrice.price || getShowPrice.price === 0 ? '' : `+￥${getShowPrice.price}` }}
</text>
</view>
<view v-if="state.goodsInfo.stock === 0">已售罄</view>
<view v-else>立即兑换</view>
@@ -115,7 +118,7 @@
import { onLoad, onPageScroll } from '@dcloudio/uni-app';
import sheep from '@/sheep';
import { isEmpty } from 'lodash-es';
import { fen2yuan, formatGoodsSwiper } from '@/sheep/hooks/useGoods';
import { fen2yuan, formatExchange, formatGoodsSwiper } from '@/sheep/hooks/useGoods';
import detailNavbar from './components/detail/detail-navbar.vue';
import detailCellSku from './components/detail/detail-cell-sku.vue';
import detailTabbar from './components/detail/detail-tabbar.vue';
@@ -126,7 +129,7 @@
import { PromotionActivityTypeEnum } from '@/sheep/util/const';
import PointApi from '@/sheep/api/promotion/point';
const headerBg = sheep.$url.css('/static/img/shop/goods/seckill-bg.png');
const headerBg = sheep.$url.css('/static/img/shop/goods/score-bg.png');
const btnBg = sheep.$url.css('/static/img/shop/goods/seckill-btn.png');
const disabledBtnBg = sheep.$url.css('/static/img/shop/goods/activity-btn-disabled.png');
const seckillBg = sheep.$url.css('/static/img/shop/goods/seckill-tip-bg.png');
@@ -192,11 +195,25 @@
const activity = ref();
const getShowPriceText = computed(() => {
let priceText = `${activity.value.point}积分${!activity.value.price ? '' : `+￥${fen2yuan(activity.value.price)}`}`;
const getShowPrice = computed(() => {
if (!isEmpty(state.selectedSku)) {
const sku = state.selectedSku;
priceText = `${sku.point}积分${!sku.pointPrice ? '' : `+￥${fen2yuan(sku.pointPrice)}`}`;
return {
point: sku.point,
price: !sku.pointPrice ? '' : fen2yuan(sku.pointPrice),
};
}
return {
point: activity.value.point,
price: !activity.value.price ? '' : fen2yuan(activity.value.price),
};
});
const getShowPriceText = computed(() => {
let priceText = `￥${fen2yuan(state.goodsInfo.price)}`;
if (!isEmpty(state.selectedSku)) {
const sku = state.selectedSku;
priceText = `${sku.point}${!sku.pointPrice ? '' : `+￥${fen2yuan(sku.pointPrice)}`}`;
}
return priceText;
});
@@ -264,102 +281,47 @@
.title-card {
width: 710rpx;
box-sizing: border-box;
// height: 320rpx;
background-size: 100% 100%;
border-radius: 10rpx;
background-image: v-bind(headerBg);
background-repeat: no-repeat;
.price-box {
.point-img {
width: 36rpx;
height: 36rpx;
margin: 0 4rpx;
}
.point-text {
font-size: 42rpx;
font-weight: 500;
color: #ff3000;
line-height: 36rpx;
font-family: OPPOSANS;
}
.price-text {
font-size: 30rpx;
font-size: 42rpx;
font-weight: 500;
color: #fff;
line-height: normal;
color: #ff3000;
line-height: 36rpx;
font-family: OPPOSANS;
}
}
.origin-price {
font-size: 24rpx;
.origin-price-text {
font-size: 26rpx;
font-weight: 400;
color: #fff;
opacity: 0.7;
.origin-price-text {
text-decoration: line-through;
font-family: OPPOSANS;
&::before {
content: '￥';
}
}
text-decoration: line-through;
color: $gray-c;
font-family: OPPOSANS;
}
.tig {
border: 2rpx solid #ffffff;
border-radius: 4rpx;
width: 126rpx;
height: 38rpx;
.tig-icon {
width: 40rpx;
height: 40rpx;
margin-left: -2rpx;
background: #ffffff;
border-radius: 4rpx 0 0 4rpx;
.cicon-alarm {
font-size: 32rpx;
color: #fc6e6f;
}
}
.tig-title {
width: 86rpx;
font-size: 24rpx;
font-weight: 500;
line-height: normal;
color: #ffffff;
display: flex;
justify-content: center;
align-items: center;
}
}
.countdown-title {
.sales-text {
font-size: 26rpx;
font-weight: 500;
color: #ffffff;
}
.countdown-time {
font-size: 26rpx;
font-weight: 500;
color: #ffffff;
.countdown-h {
font-size: 24rpx;
font-family: OPPOSANS;
font-weight: 500;
color: #ffffff;
padding: 0 4rpx;
height: 40rpx;
background: rgba(#000000, 0.1);
border-radius: 6rpx;
}
.countdown-num {
font-size: 24rpx;
font-family: OPPOSANS;
font-weight: 500;
color: #ffffff;
width: 40rpx;
height: 40rpx;
background: rgba(#000000, 0.1);
border-radius: 6rpx;
}
color: $gray-c;
}
.discounts-box {
@@ -392,15 +354,13 @@
font-size: 30rpx;
font-weight: bold;
line-height: 42rpx;
color: #fff;
}
.subtitle-text {
font-size: 26rpx;
font-weight: 400;
color: #ffffff;
color: $dark-9;
line-height: 42rpx;
opacity: 0.9;
}
}
@@ -517,9 +477,4 @@
color: #333333;
}
}
image {
width: 100%;
height: 100%;
}
</style>
pages/order/confirm.vue
+29 -8
View File
@@ -41,24 +41,39 @@
</view>
</view>
<view
v-if="state.orderPayload.pointActivityId"
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">
<image
:src="sheep.$url.static('/static/img/shop/goods/score1.svg')"
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="item-title">积分抵扣</view>
<view class="ss-flex ss-col-center">
{{ state.pointStatus ? '剩余积分' : '当前积分' }}
{{ state.pointStatus || state.orderPayload.pointActivityId ? '剩余积分' : '当前积分' }}
<image
:src="sheep.$url.static('/static/img/shop/goods/score1.svg')"
class="score-img"
/>
<text class="item-value ss-m-r-24">
{{
state.pointStatus
state.pointStatus || state.orderPayload.pointActivityId
? state.orderInfo.totalPoint - state.orderInfo.usePoint
: state.orderInfo.totalPoint || 0
}}
</text>
<checkbox-group @change="changeIntegral">
<checkbox-group @change="changeIntegral" v-if="!state.orderPayload.pointActivityId">
<checkbox
:checked="state.pointStatus"
:disabled="!state.orderInfo.totalPoint || state.orderInfo.totalPoint <= 0"
@@ -305,9 +320,15 @@
}
// 跳转到支付页面
sheep.$router.redirect('/pages/pay/index', {
id: data.payOrderId,
});
if (data.payOrderId && data.payOrderId > 0) {
sheep.$router.redirect('/pages/pay/index', {
id: data.payOrderId,
});
} else {
sheep.$router.redirect('/pages/order/detail', {
id: data.id,
});
}
}
// 检查库存 & 计算订单价格
@@ -331,7 +352,7 @@
return;
}
state.orderInfo = data;
state.couponInfo = data.coupons;
state.couponInfo = data.coupons || [];
// 设置收货地址
if (state.orderInfo.address) {
addressState.value.addressInfo = state.orderInfo.address;