✨ 拼团：拼团订单列表
YunaiV
parent
c3bb0a2ddc
commit
93c721a526
|
|
@ -1,3 +1,4 @@
|
|||
<!-- 拼团订单的详情 -->
|
||||
<template>
|
||||
<s-layout title="拼团详情" class="detail-wrap" :navbar="state.data && !state.loading ? 'inner': 'normal'" :onShareAppMessage="shareInfo">
|
||||
<view v-if="state.loading"></view>
|
||||
|
|
@ -202,6 +203,7 @@
|
|||
combinationHeadId: null, // 拼团团长编号
|
||||
});
|
||||
|
||||
// todo 芋艿：分享要再接下
|
||||
const shareInfo = computed(() => {
|
||||
if (isEmpty(state.data)) return {};
|
||||
return sheep.$platform.share.getShareInfo(
|
||||
|
|
@ -231,7 +233,7 @@
|
|||
});
|
||||
}
|
||||
|
||||
//去开团
|
||||
// 去开团
|
||||
function onCreateGroupon() {
|
||||
state.grouponAction = 'create';
|
||||
state.grouponId = 0;
|
||||
|
|
|
|||
|
|
@ -1,16 +1,18 @@
|
|||
<!-- 拼团活动列表 -->
|
||||
<template>
|
||||
<s-layout navbar="inner" :bgStyle="{ color: '#FE832A' }">
|
||||
<view
|
||||
class="page-bg"
|
||||
:style="[{ marginTop: '-' + Number(statusBarHeight + 88) + 'rpx' }]"
|
||||
></view>
|
||||
<view class="page-bg" :style="[{ marginTop: '-' + Number(statusBarHeight + 88) + 'rpx' }]" />
|
||||
<view class="list-content">
|
||||
<!-- 参团会员统计 -->
|
||||
<view class="content-header ss-flex-col ss-col-center 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"
|
||||
:style='index === 6 ? "position: relative" : "position: static"'>
|
||||
<span class="avatar" :style='`background-image: url(${item})`'></span>
|
||||
<view
|
||||
v-for="(item, index) in state.summaryData.avatars"
|
||||
: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">
|
||||
<i>···</i>
|
||||
</span>
|
||||
|
|
@ -25,7 +27,7 @@
|
|||
:scroll-with-animation="false"
|
||||
: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
|
||||
class=""
|
||||
size="lg"
|
||||
|
|
@ -54,55 +56,60 @@
|
|||
import { reactive } from 'vue';
|
||||
import { onLoad, onReachBottom } from '@dcloudio/uni-app';
|
||||
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 sysNavBar = sheep.$platform.navbar;
|
||||
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 state = reactive({
|
||||
pagination: {
|
||||
data: [],
|
||||
list: [],
|
||||
total: 0,
|
||||
pageNo: 1,
|
||||
total: 1,
|
||||
pageSize: 10,
|
||||
},
|
||||
loadStatus: '',
|
||||
summaryData: {}
|
||||
summaryData: {},
|
||||
});
|
||||
|
||||
// 加载统计数据
|
||||
const getSummary = async () => {
|
||||
const { data } = await CombinationApi.getCombinationRecordSummary()
|
||||
state.summaryData = data
|
||||
}
|
||||
const { data } = await CombinationApi.getCombinationRecordSummary();
|
||||
state.summaryData = data;
|
||||
};
|
||||
|
||||
// 加载活动列表
|
||||
async function getList(pageNo = 1, pageSize = 10) {
|
||||
async function getList() {
|
||||
state.loadStatus = 'loading';
|
||||
const { data } = await CombinationApi.getCombinationActivityPage({
|
||||
pageNo,
|
||||
pageSize,
|
||||
pageNo: state.pagination.pageNo,
|
||||
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.pageNo = pageNo;
|
||||
state.loadStatus = state.pagination.data.length < state.pagination.total ? 'more' : 'noMore';
|
||||
state.loadStatus = state.pagination.list.length < state.pagination.total ? 'more' : 'noMore';
|
||||
}
|
||||
|
||||
// 加载更多
|
||||
function loadMore() {
|
||||
if (state.loadStatus !== 'noMore') {
|
||||
getList(state.pagination.pageNo + 1);
|
||||
if (state.loadStatus === 'noMore') {
|
||||
return;
|
||||
}
|
||||
state.pagination.pageNo++;
|
||||
getList();
|
||||
}
|
||||
|
||||
// 上拉加载更多
|
||||
onReachBottom(() => loadMore());
|
||||
|
||||
// 页面初始化
|
||||
onLoad( () => {
|
||||
onLoad(() => {
|
||||
getSummary();
|
||||
getList();
|
||||
});
|
||||
|
|
@ -171,7 +178,7 @@
|
|||
width: auto;
|
||||
height: auto;
|
||||
background: linear-gradient(90deg, #ff6600 0%, #fe832a 100%);
|
||||
color: #FFFFFF;
|
||||
color: #ffffff;
|
||||
border-radius: 19rpx;
|
||||
padding: 4rpx 14rpx;
|
||||
}
|
||||
|
|
@ -186,9 +193,9 @@
|
|||
opacity: 1;
|
||||
position: absolute;
|
||||
left: -2rpx;
|
||||
color: #FFF;
|
||||
color: #fff;
|
||||
top: 2rpx;
|
||||
i{
|
||||
i {
|
||||
font-style: normal;
|
||||
font-size: 20rpx;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<!-- 页面 -->
|
||||
<!-- 我的拼团订单列表 -->
|
||||
<template>
|
||||
<s-layout title="我的拼团">
|
||||
<su-sticky bgColor="#fff">
|
||||
|
|
@ -9,31 +9,28 @@
|
|||
:current="state.currentTab"
|
||||
></su-tabs>
|
||||
</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
|
||||
class="order-list-card-box bg-white ss-r-10 ss-m-t-14 ss-m-20"
|
||||
v-for="order in state.pagination.list"
|
||||
:key="order.id"
|
||||
v-for="record in state.pagination.list"
|
||||
:key="record.id"
|
||||
>
|
||||
<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="ss-font-26" :class="formatOrderColor(order)">
|
||||
{{ formatOrderStatus(order) }}
|
||||
<view class="order-no">拼团编号：{{ record.id }}</view>
|
||||
<view class="ss-font-26" :class="formatOrderColor(record)">
|
||||
{{ tabMaps.find((item) => item.value === record.status).name }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="border-bottom" v-for="item in order.items" :key="item.id">
|
||||
<view class="border-bottom">
|
||||
<s-goods-item
|
||||
:img="item.picUrl"
|
||||
:title="item.spuName"
|
||||
:skuText="item.properties.map((property) => property.valueName).join(' ')"
|
||||
:price="item.price"
|
||||
:num="item.count"
|
||||
:img="record.picUrl"
|
||||
:title="record.spuName"
|
||||
:price="record.combinationPrice"
|
||||
>
|
||||
<template #groupon>
|
||||
<view class="ss-flex">
|
||||
<view class="sales-title"> {{ item.num }}人团 </view>
|
||||
<!-- <view class="num-title ss-m-l-20"> 已拼{{ order.goods.sales }}件 </view> -->
|
||||
<view class="sales-title"> {{ record.userSize }} 人团 </view>
|
||||
</view>
|
||||
</template>
|
||||
</s-goods-item>
|
||||
|
|
@ -41,16 +38,16 @@
|
|||
<view class="order-card-footer ss-flex ss-row-right ss-p-x-20">
|
||||
<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
|
||||
class="tool-btn ss-reset-button"
|
||||
:class="{ 'ui-BG-Main-Gradient': order.status === 0 }"
|
||||
@tap="sheep.$router.go('/pages/activity/groupon/detail', { id: order.id })"
|
||||
:class="{ 'ui-BG-Main-Gradient': record.status === 0 }"
|
||||
@tap="sheep.$router.go('/pages/activity/groupon/detail', { id: record.id })"
|
||||
>
|
||||
{{ order.status === 0 ? '邀请拼团' : '拼团详情' }}
|
||||
{{ record.status === 0 ? '邀请拼团' : '拼团详情' }}
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -67,21 +64,22 @@
|
|||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed, reactive } from 'vue';
|
||||
import { reactive } from 'vue';
|
||||
import { onLoad, onReachBottom, onPullDownRefresh } from '@dcloudio/uni-app';
|
||||
import sheep from '@/sheep';
|
||||
import _ from 'lodash';
|
||||
import OrderApi from "@/sheep/api/trade/order";
|
||||
import {formatOrderColor, formatOrderStatus} from "@/sheep/hooks/useGoods";
|
||||
import {formatOrderColor} from "@/sheep/hooks/useGoods";
|
||||
import { resetPagination } from '@/sheep/util';
|
||||
import CombinationApi from '@/sheep/api/promotion/combination';
|
||||
|
||||
// 数据
|
||||
const state = reactive({
|
||||
currentTab: 0,
|
||||
pagination: {
|
||||
list: [],
|
||||
total: 1,
|
||||
total: 0,
|
||||
pageNo: 1,
|
||||
pageSize: 1,
|
||||
pageSize: 5,
|
||||
},
|
||||
loadStatus: '',
|
||||
deleteOrderId: 0,
|
||||
|
|
@ -107,75 +105,25 @@
|
|||
|
||||
// 切换选项卡
|
||||
function onTabsChange(e) {
|
||||
state.pagination = {
|
||||
data: [],
|
||||
pageNo: 1,
|
||||
total: 1,
|
||||
pageSize: 5,
|
||||
};
|
||||
resetPagination(state.pagination);
|
||||
state.currentTab = e.index;
|
||||
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() {
|
||||
state.loadStatus = 'loading';
|
||||
// todo: 缺少拼团订单接口
|
||||
const { code, data } = await OrderApi.getOrderPage({
|
||||
const { code, data } = await CombinationApi.getCombinationRecordPage({
|
||||
pageNo: state.pagination.pageNo,
|
||||
pageSize: state.pagination.pageSize,
|
||||
status: tabMaps[state.currentTab].value,
|
||||
commentStatus: tabMaps[state.currentTab].value === 30 ? false : null
|
||||
});
|
||||
if (code !== 0) {
|
||||
return;
|
||||
}
|
||||
state.pagination.list = _.concat(state.pagination.list, data.list)
|
||||
state.pagination.total = data.total;
|
||||
if (state.pagination.list.length < state.pagination.total) {
|
||||
state.loadStatus = 'more';
|
||||
} else {
|
||||
state.loadStatus = 'noMore';
|
||||
}
|
||||
state.loadStatus = state.pagination.list.length < state.pagination.total ? 'more' : 'noMore';
|
||||
}
|
||||
|
||||
onLoad((options) => {
|
||||
|
|
@ -187,16 +135,18 @@
|
|||
|
||||
// 加载更多
|
||||
function loadMore() {
|
||||
if (state.loadStatus !== 'noMore') {
|
||||
state.pagination.pageNo++;
|
||||
getGrouponList();
|
||||
if (state.loadStatus === 'noMore') {
|
||||
return;
|
||||
}
|
||||
state.pagination.pageNo++;
|
||||
getGrouponList();
|
||||
}
|
||||
|
||||
// 上拉加载更多
|
||||
onReachBottom(() => {
|
||||
loadMore();
|
||||
});
|
||||
|
||||
//下拉刷新
|
||||
onPullDownRefresh(() => {
|
||||
getGrouponList();
|
||||
|
|
|
|||
|
|
@ -1,67 +1,76 @@
|
|||
import request from "@/sheep/request";
|
||||
import request from '@/sheep/request';
|
||||
|
||||
// 拼团 API
|
||||
const CombinationApi = {
|
||||
// 获得拼团活动列表
|
||||
getCombinationActivityList: (count) => {
|
||||
return request({
|
||||
url: "/app-api/promotion/combination-activity/list",
|
||||
method: 'GET',
|
||||
params: {count}
|
||||
});
|
||||
},
|
||||
// 获得拼团活动列表
|
||||
getCombinationActivityList: (count) => {
|
||||
return request({
|
||||
url: '/app-api/promotion/combination-activity/list',
|
||||
method: 'GET',
|
||||
params: { count },
|
||||
});
|
||||
},
|
||||
|
||||
// 获得拼团活动分页
|
||||
getCombinationActivityPage: (params) => {
|
||||
return request({
|
||||
url: "/app-api/promotion/combination-activity/page",
|
||||
method: 'GET',
|
||||
params
|
||||
});
|
||||
},
|
||||
// 获得拼团活动分页
|
||||
getCombinationActivityPage: (params) => {
|
||||
return request({
|
||||
url: '/app-api/promotion/combination-activity/page',
|
||||
method: 'GET',
|
||||
params,
|
||||
});
|
||||
},
|
||||
|
||||
// 获得拼团活动明细
|
||||
getCombinationActivity: (id) => {
|
||||
return request({
|
||||
url: "/app-api/promotion/combination-activity/get-detail",
|
||||
method: 'GET',
|
||||
params: {
|
||||
id
|
||||
}
|
||||
});
|
||||
},
|
||||
// 获得拼团活动明细
|
||||
getCombinationActivity: (id) => {
|
||||
return request({
|
||||
url: '/app-api/promotion/combination-activity/get-detail',
|
||||
method: 'GET',
|
||||
params: {
|
||||
id,
|
||||
},
|
||||
});
|
||||
},
|
||||
|
||||
// 获得最近 n 条拼团记录（团长发起的）
|
||||
getHeadCombinationRecordList: (activityId, status, count) => {
|
||||
return request({
|
||||
url: "/app-api/promotion/combination-record/get-head-list",
|
||||
method: 'GET',
|
||||
params: {
|
||||
activityId,
|
||||
status,
|
||||
count
|
||||
}
|
||||
});
|
||||
},
|
||||
// 获得最近 n 条拼团记录（团长发起的）
|
||||
getHeadCombinationRecordList: (activityId, status, count) => {
|
||||
return request({
|
||||
url: '/app-api/promotion/combination-record/get-head-list',
|
||||
method: 'GET',
|
||||
params: {
|
||||
activityId,
|
||||
status,
|
||||
count,
|
||||
},
|
||||
});
|
||||
},
|
||||
|
||||
// 获得拼团记录明细
|
||||
getCombinationRecordDetail: (id) => {
|
||||
return request({
|
||||
url: "/app-api/promotion/combination-record/get-detail",
|
||||
method: 'GET',
|
||||
params: {
|
||||
id
|
||||
}
|
||||
});
|
||||
},
|
||||
// 获得我的拼团记录分页
|
||||
getCombinationRecordPage: (params) => {
|
||||
return request({
|
||||
url: "/app-api/promotion/combination-record/page",
|
||||
method: 'GET',
|
||||
params
|
||||
});
|
||||
},
|
||||
|
||||
// 获得拼团记录的概要信息
|
||||
getCombinationRecordSummary: () => {
|
||||
return request({
|
||||
url: "/app-api/promotion/combination-record/get-summary",
|
||||
method: 'GET',
|
||||
});
|
||||
}
|
||||
}
|
||||
// 获得拼团记录明细
|
||||
getCombinationRecordDetail: (id) => {
|
||||
return request({
|
||||
url: '/app-api/promotion/combination-record/get-detail',
|
||||
method: 'GET',
|
||||
params: {
|
||||
id,
|
||||
},
|
||||
});
|
||||
},
|
||||
|
||||
export default CombinationApi
|
||||
// 获得拼团记录的概要信息
|
||||
getCombinationRecordSummary: () => {
|
||||
return request({
|
||||
url: '/app-api/promotion/combination-record/get-summary',
|
||||
method: 'GET',
|
||||
});
|
||||
},
|
||||
};
|
||||
|
||||
export default CombinationApi;
|
||||
|
|
|
|||
Loading…
Reference in New Issue