yudao
/
mall-uniapp
mirror of https://gitee.com/yudaocode/yudao-mall-uniapp.git
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

✨ 拼团：拼团订单列表

pull/37/head
YunaiV 2024-01-13 19:08:55 +08:00
parent c3bb0a2ddc
commit 93c721a526
4 changed files with 137 additions and 169 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
pages/activity/groupon/detail.vue
View File

@ -1,3 +1,4 @@
<!-- 拼团订单的详情 -->
<template> <template>
<s-layout title="拼团详情" class="detail-wrap" :navbar="state.data && !state.loading ? 'inner': 'normal'" :onShareAppMessage="shareInfo"> <s-layout title="拼团详情" class="detail-wrap" :navbar="state.data && !state.loading ? 'inner': 'normal'" :onShareAppMessage="shareInfo">
<view v-if="state.loading"></view> <view v-if="state.loading"></view>
@ -202,6 +203,7 @@
combinationHeadId: null, // 拼团团长编号 combinationHeadId: null, // 拼团团长编号
}); });
// todo 芋艿：分享要再接下
const shareInfo = computed(() => { const shareInfo = computed(() => {
if (isEmpty(state.data)) return {}; if (isEmpty(state.data)) return {};
return sheep.$platform.share.getShareInfo( return sheep.$platform.share.getShareInfo(
@ -231,7 +233,7 @@
}); });
} }
//去开团 // 去开团
function onCreateGroupon() { function onCreateGroupon() {
state.grouponAction = 'create'; state.grouponAction = 'create';
state.grouponId = 0; state.grouponId = 0;

67
pages/activity/groupon/list.vue
View File

@ -1,16 +1,18 @@
<!-- 拼团活动列表 -->
<template> <template>
<s-layout navbar="inner" :bgStyle="{ color: '#FE832A' }"> <s-layout navbar="inner" :bgStyle="{ color: '#FE832A' }">
<view <view class="page-bg" :style="[{ marginTop: '-' + Number(statusBarHeight + 88) + 'rpx' }]" />
class="page-bg"
:style="[{ marginTop: '-' + Number(statusBarHeight + 88) + 'rpx' }]"
></view>
<view class="list-content"> <view class="list-content">
<!-- 参团会员统计 --> <!-- 参团会员统计 -->
<view class="content-header ss-flex-col ss-col-center ss-row-center"> <view class="content-header ss-flex-col ss-col-center ss-row-center">
<view class="content-header-title ss-flex ss-row-center"> <view class="content-header-title ss-flex ss-row-center">
<view v-for="(item, index) in state.summaryData.avatars" :key="index" class="picture" <view
:style='index === 6 ? "position: relative" : "position: static"'> v-for="(item, index) in state.summaryData.avatars"
<span class="avatar" :style='`background-image: url(${item})`'></span> :key="index"
class="picture"
:style="index === 6 ? 'position: relative' : 'position: static'"
>
<span class="avatar" :style="`background-image: url(${item})`" />
<span v-if="index === 6 && state.summaryData.avatars.length > 3" class="mengceng"> <span v-if="index === 6 && state.summaryData.avatars.length > 3" class="mengceng">
<i>···</i> <i>···</i>
</span> </span>
@ -25,7 +27,7 @@
:scroll-with-animation="false" :scroll-with-animation="false"
:enable-back-to-top="true" :enable-back-to-top="true"
> >
<view class="goods-box ss-m-b-20" v-for="item in state.pagination.data" :key="item.id"> <view class="goods-box ss-m-b-20" v-for="item in state.pagination.list" :key="item.id">
<s-goods-column <s-goods-column
class="" class=""
size="lg" size="lg"
@ -54,55 +56,60 @@
import { reactive } from 'vue'; import { reactive } from 'vue';
import { onLoad, onReachBottom } from '@dcloudio/uni-app'; import { onLoad, onReachBottom } from '@dcloudio/uni-app';
import sheep from '@/sheep'; import sheep from '@/sheep';
import CombinationApi from "@/sheep/api/promotion/combination"; import CombinationApi from '@/sheep/api/promotion/combination';
const { safeAreaInsets, safeArea } = sheep.$platform.device; const { safeAreaInsets, safeArea } = sheep.$platform.device;
const sysNavBar = sheep.$platform.navbar; const sysNavBar = sheep.$platform.navbar;
const statusBarHeight = sheep.$platform.device.statusBarHeight * 2; const statusBarHeight = sheep.$platform.device.statusBarHeight * 2;
const pageHeight = (safeArea.height + safeAreaInsets.bottom) * 2 + statusBarHeight - sysNavBar - 350; const pageHeight =
(safeArea.height + safeAreaInsets.bottom) * 2 + statusBarHeight - sysNavBar - 350;
const headerBg = sheep.$url.css('/static/img/shop/goods/groupon-header.png'); const headerBg = sheep.$url.css('/static/img/shop/goods/groupon-header.png');
const state = reactive({ const state = reactive({
pagination: { pagination: {
data: [], list: [],
total: 0,
pageNo: 1, pageNo: 1,
total: 1, pageSize: 10,
}, },
loadStatus: '', loadStatus: '',
summaryData: {} summaryData: {},
}); });
// 加载统计数据 // 加载统计数据
const getSummary = async () => { const getSummary = async () => {
const { data } = await CombinationApi.getCombinationRecordSummary() const { data } = await CombinationApi.getCombinationRecordSummary();
state.summaryData = data state.summaryData = data;
} };
// 加载活动列表 // 加载活动列表
async function getList(pageNo = 1, pageSize = 10) { async function getList() {
state.loadStatus = 'loading'; state.loadStatus = 'loading';
const { data } = await CombinationApi.getCombinationActivityPage({ const { data } = await CombinationApi.getCombinationActivityPage({
pageNo, pageNo: state.pagination.pageNo,
pageSize, pageSize: state.pagination.pageSize,
});
data.list.forEach((activity) => {
state.pagination.list.push({ ...activity, price: activity.combinationPrice });
}); });
data.list.forEach(activity => {
state.pagination.data.push({...activity, price: activity.combinationPrice})
})
state.pagination.total = data.total; state.pagination.total = data.total;
state.pagination.pageNo = pageNo; state.loadStatus = state.pagination.list.length < state.pagination.total ? 'more' : 'noMore';
state.loadStatus = state.pagination.data.length < state.pagination.total ? 'more' : 'noMore';
} }
// 加载更多 // 加载更多
function loadMore() { function loadMore() {
if (state.loadStatus !== 'noMore') { if (state.loadStatus === 'noMore') {
getList(state.pagination.pageNo + 1); return;
} }
state.pagination.pageNo++;
getList();
} }
// 上拉加载更多 // 上拉加载更多
onReachBottom(() => loadMore()); onReachBottom(() => loadMore());
// 页面初始化 // 页面初始化
onLoad( () => { onLoad(() => {
getSummary(); getSummary();
getList(); getList();
}); });
@ -171,7 +178,7 @@
width: auto; width: auto;
height: auto; height: auto;
background: linear-gradient(90deg, #ff6600 0%, #fe832a 100%); background: linear-gradient(90deg, #ff6600 0%, #fe832a 100%);
color: #FFFFFF; color: #ffffff;
border-radius: 19rpx; border-radius: 19rpx;
padding: 4rpx 14rpx; padding: 4rpx 14rpx;
} }
@ -186,9 +193,9 @@
opacity: 1; opacity: 1;
position: absolute; position: absolute;
left: -2rpx; left: -2rpx;
color: #FFF; color: #fff;
top: 2rpx; top: 2rpx;
i{ i {
font-style: normal; font-style: normal;
font-size: 20rpx; font-size: 20rpx;
} }

110
pages/activity/groupon/order.vue
View File

@ -1,4 +1,4 @@
<!-- 页面 --> <!-- 我的拼团订单列表 -->
<template> <template>
<s-layout title="我的拼团"> <s-layout title="我的拼团">
<su-sticky bgColor="#fff"> <su-sticky bgColor="#fff">
@ -9,31 +9,28 @@
:current="state.currentTab" :current="state.currentTab"
></su-tabs> ></su-tabs>
</su-sticky> </su-sticky>
<s-empty v-if="state.pagination.total === 0" icon="/static/goods-empty.png"> </s-empty> <s-empty v-if="state.pagination.total === 0" icon="/static/goods-empty.png" />
<view v-if="state.pagination.total > 0"> <view v-if="state.pagination.total > 0">
<view <view
class="order-list-card-box bg-white ss-r-10 ss-m-t-14 ss-m-20" class="order-list-card-box bg-white ss-r-10 ss-m-t-14 ss-m-20"
v-for="order in state.pagination.list" v-for="record in state.pagination.list"
:key="order.id" :key="record.id"
> >
<view class="order-card-header ss-flex ss-col-center ss-row-between ss-p-x-20"> <view class="order-card-header ss-flex ss-col-center ss-row-between ss-p-x-20">
<view class="order-no">订单号：{{ order.no }}</view> <view class="order-no">拼团编号：{{ record.id }}</view>
<view class="ss-font-26" :class="formatOrderColor(order)"> <view class="ss-font-26" :class="formatOrderColor(record)">
{{ formatOrderStatus(order) }} {{ tabMaps.find((item) => item.value === record.status).name }}
</view> </view>
</view> </view>
<view class="border-bottom" v-for="item in order.items" :key="item.id"> <view class="border-bottom">
<s-goods-item <s-goods-item
:img="item.picUrl" :img="record.picUrl"
:title="item.spuName" :title="record.spuName"
:skuText="item.properties.map((property) => property.valueName).join(' ')" :price="record.combinationPrice"
:price="item.price"
:num="item.count"
> >
<template #groupon> <template #groupon>
<view class="ss-flex"> <view class="ss-flex">
<view class="sales-title"> {{ item.num }}人团 </view> <view class="sales-title"> {{ record.userSize }} 人团 </view>
<!-- <view class="num-title ss-m-l-20"> 已拼{{ order.goods.sales }}件 </view> -->
</view> </view>
</template> </template>
</s-goods-item> </s-goods-item>
@ -41,16 +38,16 @@
<view class="order-card-footer ss-flex ss-row-right ss-p-x-20"> <view class="order-card-footer ss-flex ss-row-right ss-p-x-20">
<button <button
class="detail-btn ss-reset-button" class="detail-btn ss-reset-button"
@tap="sheep.$router.go('/pages/order/detail', { id: order.id })" @tap="sheep.$router.go('/pages/order/detail', { id: record.id })"
> >
订单详情 订单详情
</button> </button>
<button <button
class="tool-btn ss-reset-button" class="tool-btn ss-reset-button"
:class="{ 'ui-BG-Main-Gradient': order.status === 0 }" :class="{ 'ui-BG-Main-Gradient': record.status === 0 }"
@tap="sheep.$router.go('/pages/activity/groupon/detail', { id: order.id })" @tap="sheep.$router.go('/pages/activity/groupon/detail', { id: record.id })"
> >
{{ order.status === 0 ? '邀请拼团' : '拼团详情' }} {{ record.status === 0 ? '邀请拼团' : '拼团详情' }}
</button> </button>
</view> </view>
</view> </view>
@ -67,21 +64,22 @@
</template> </template>
<script setup> <script setup>
import { computed, reactive } from 'vue'; import { reactive } from 'vue';
import { onLoad, onReachBottom, onPullDownRefresh } from '@dcloudio/uni-app'; import { onLoad, onReachBottom, onPullDownRefresh } from '@dcloudio/uni-app';
import sheep from '@/sheep'; import sheep from '@/sheep';
import _ from 'lodash'; import _ from 'lodash';
import OrderApi from "@/sheep/api/trade/order"; import {formatOrderColor} from "@/sheep/hooks/useGoods";
import {formatOrderColor, formatOrderStatus} from "@/sheep/hooks/useGoods"; import { resetPagination } from '@/sheep/util';
import CombinationApi from '@/sheep/api/promotion/combination';
// 数据 // 数据
const state = reactive({ const state = reactive({
currentTab: 0, currentTab: 0,
pagination: { pagination: {
list: [], list: [],
total: 1, total: 0,
pageNo: 1, pageNo: 1,
pageSize: 1, pageSize: 5,
}, },
loadStatus: '', loadStatus: '',
deleteOrderId: 0, deleteOrderId: 0,
@ -107,75 +105,25 @@
// 切换选项卡 // 切换选项卡
function onTabsChange(e) { function onTabsChange(e) {
state.pagination = { resetPagination(state.pagination);
data: [],
pageNo: 1,
total: 1,
pageSize: 5,
};
state.currentTab = e.index; state.currentTab = e.index;
getGrouponList(); getGrouponList();
} }
// 订单详情
function onDetail(orderSN) {
sheep.$router.go('/pages/order/detail', {
orderSN,
});
}
// 继续支付
function onPay(orderSN) {
sheep.$router.go('/pages/pay/index', {
orderSN,
});
}
// 评价
function onComment(orderSN) {
sheep.$router.go('/pages/order/comment/add', {
orderSN,
});
}
// 确认收货
async function onConfirm(orderId) {
const { error, data } = await sheep.$api.order.confirm(orderId);
if (error === 0) {
let index = state.pagination.list.findIndex((order) => order.id === orderId);
state.pagination.list[index] = data;
}
}
// 取消订单
async function onCancel(orderId) {
const { error, data } = await sheep.$api.order.cancel(orderId);
if (error === 0) {
let index = state.pagination.list.findIndex((order) => order.id === orderId);
state.pagination.list[index] = data;
}
}
// 获取订单列表 // 获取订单列表
async function getGrouponList() { async function getGrouponList() {
state.loadStatus = 'loading'; state.loadStatus = 'loading';
// todo: 缺少拼团订单接口 const { code, data } = await CombinationApi.getCombinationRecordPage({
const { code, data } = await OrderApi.getOrderPage({
pageNo: state.pagination.pageNo, pageNo: state.pagination.pageNo,
pageSize: state.pagination.pageSize, pageSize: state.pagination.pageSize,
status: tabMaps[state.currentTab].value, status: tabMaps[state.currentTab].value,
commentStatus: tabMaps[state.currentTab].value === 30 ? false : null
}); });
if (code !== 0) { if (code !== 0) {
return; return;
} }
state.pagination.list = _.concat(state.pagination.list, data.list) state.pagination.list = _.concat(state.pagination.list, data.list)
state.pagination.total = data.total; state.pagination.total = data.total;
if (state.pagination.list.length < state.pagination.total) { state.loadStatus = state.pagination.list.length < state.pagination.total ? 'more' : 'noMore';
state.loadStatus = 'more';
} else {
state.loadStatus = 'noMore';
}
} }
onLoad((options) => { onLoad((options) => {
@ -187,16 +135,18 @@
// 加载更多 // 加载更多
function loadMore() { function loadMore() {
if (state.loadStatus !== 'noMore') { if (state.loadStatus === 'noMore') {
state.pagination.pageNo++; return;
getGrouponList();
} }
state.pagination.pageNo++;
getGrouponList();
} }
// 上拉加载更多 // 上拉加载更多
onReachBottom(() => { onReachBottom(() => {
loadMore(); loadMore();
}); });
//下拉刷新 //下拉刷新
onPullDownRefresh(() => { onPullDownRefresh(() => {
getGrouponList(); getGrouponList();

125
sheep/api/promotion/combination.js
View File

@ -1,67 +1,76 @@
import request from "@/sheep/request"; import request from '@/sheep/request';
// 拼团 API // 拼团 API
const CombinationApi = { const CombinationApi = {
// 获得拼团活动列表 // 获得拼团活动列表
getCombinationActivityList: (count) => { getCombinationActivityList: (count) => {
return request({ return request({
url: "/app-api/promotion/combination-activity/list", url: '/app-api/promotion/combination-activity/list',
method: 'GET', method: 'GET',
params: {count} params: { count },
}); });
}, },
// 获得拼团活动分页 // 获得拼团活动分页
getCombinationActivityPage: (params) => { getCombinationActivityPage: (params) => {
return request({ return request({
url: "/app-api/promotion/combination-activity/page", url: '/app-api/promotion/combination-activity/page',
method: 'GET', method: 'GET',
params params,
}); });
}, },
// 获得拼团活动明细 // 获得拼团活动明细
getCombinationActivity: (id) => { getCombinationActivity: (id) => {
return request({ return request({
url: "/app-api/promotion/combination-activity/get-detail", url: '/app-api/promotion/combination-activity/get-detail',
method: 'GET', method: 'GET',
params: { params: {
id id,
} },
}); });
}, },
// 获得最近 n 条拼团记录（团长发起的） // 获得最近 n 条拼团记录（团长发起的）
getHeadCombinationRecordList: (activityId, status, count) => { getHeadCombinationRecordList: (activityId, status, count) => {
return request({ return request({
url: "/app-api/promotion/combination-record/get-head-list", url: '/app-api/promotion/combination-record/get-head-list',
method: 'GET', method: 'GET',
params: { params: {
activityId, activityId,
status, status,
count count,
} },
}); });
}, },
// 获得拼团记录明细 // 获得我的拼团记录分页
getCombinationRecordDetail: (id) => { getCombinationRecordPage: (params) => {
return request({ return request({
url: "/app-api/promotion/combination-record/get-detail", url: "/app-api/promotion/combination-record/page",
method: 'GET', method: 'GET',
params: { params
id });
} },
});
},
// 获得拼团记录的概要信息 // 获得拼团记录明细
getCombinationRecordSummary: () => { getCombinationRecordDetail: (id) => {
return request({ return request({
url: "/app-api/promotion/combination-record/get-summary", url: '/app-api/promotion/combination-record/get-detail',
method: 'GET', method: 'GET',
}); params: {
} id,
} },
});
},
export default CombinationApi // 获得拼团记录的概要信息
getCombinationRecordSummary: () => {
return request({
url: '/app-api/promotion/combination-record/get-summary',
method: 'GET',
});
},
};
export default CombinationApi;