update:订单&团队

This commit is contained in:
ltx 2026-04-03 00:47:20 +08:00
parent cb2a26600c
commit 75753df0bb
18 changed files with 955 additions and 3 deletions

View File

@ -41,7 +41,11 @@
"points/points",
"cert/cert",
"records/records",
"auth/auth"
"auth/auth",
"team/team",
"team-detail/team-detail",
"order/order",
"order-detail/order-detail"
]
}
],

View File

@ -73,11 +73,11 @@ Page({
},
goToOrders() {
wx.showToast({ title: '我的订单功能开发中', icon: 'none' });
wx.navigateTo({ url: '/subpackages/mine/order/order' });
},
goToTeam() {
wx.showToast({ title: '我的团队功能开发中', icon: 'none' });
wx.navigateTo({ url: '/subpackages/mine/team/team' });
},
onChooseAvatar() {

View File

@ -0,0 +1,43 @@
Page({
data: {
detail: {
eventName: '2024上海市学生运动会跳绳比赛',
statusText: '交易成功',
statusKey: 'success',
payMethod: '线上支付',
actualAmount: '689',
payTimeStr: '2025-08-05 16:26',
refundAmount: '689',
refundTimeStr: '2025-08-05 16:26',
orderNo: '13123421516216512515 1',
items: [
{ id: 1, projectName: '30秒单摇', groupName: '少年儿童组', fee: 23 },
{ id: 2, projectName: '交互绳', groupName: '成年组', fee: 411 },
{ id: 3, projectName: '交互绳', groupName: '少年儿童组', fee: 32 },
{ id: 4, projectName: '交互绳', groupName: '成年组', fee: 12 }
]
}
},
onLoad(options) {
const id = options && options.id;
// TODO: 根据 id 调用接口获取订单详情
// this.loadDetail(id);
},
onBack() {
if (getCurrentPages().length > 1) {
wx.navigateBack();
} else {
wx.navigateTo({ url: '/subpackages/mine/order/order' });
}
},
onCopyOrderNo() {
const orderNo = this.data.detail.orderNo || '';
wx.setClipboardData({
data: orderNo,
success: () => wx.showToast({ title: '已复制', icon: 'success' })
});
}
});

View File

@ -0,0 +1,6 @@
{
"navigationStyle": "custom",
"usingComponents": {
"mp-navigation-bar": "weui-miniprogram/navigation-bar/navigation-bar"
}
}

View File

@ -0,0 +1,79 @@
<view class="detail-page">
<mp-navigation-bar
title="订单详情"
background-color="#ffffff"
color="#333"
bind:click-left="onBack"
left-arrow
></mp-navigation-bar>
<scroll-view class="scroll" scroll-y>
<!-- 顶部状态标题 -->
<view class="status-header">
<text class="status-title status-{{detail.statusKey}}">{{detail.statusText}}</text>
</view>
<!-- 基本信息卡 -->
<view class="info-card">
<!-- 赛事名 + 状态 -->
<view class="info-row info-row--top">
<text class="info-event-name">{{detail.eventName}}</text>
<text class="info-status status-{{detail.statusKey}}">{{detail.statusText}}</text>
</view>
<view class="divider"></view>
<!-- 支付方式 -->
<view class="info-row">
<text class="info-label">支付方式</text>
<text class="info-value">{{detail.payMethod}}</text>
</view>
<!-- 实付金额 -->
<view class="info-row">
<text class="info-label">实付金额</text>
<text class="info-value">¥{{detail.actualAmount}}</text>
</view>
<!-- 支付时间 -->
<view class="info-row">
<text class="info-label">支付时间</text>
<text class="info-value">{{detail.payTimeStr}}</text>
</view>
<!-- 退款金额(有则显示) -->
<view class="info-row" wx:if="{{detail.refundAmount}}">
<text class="info-label">退款金额</text>
<text class="info-value">¥{{detail.refundAmount}}</text>
</view>
<!-- 退款时间(有则显示) -->
<view class="info-row" wx:if="{{detail.refundTimeStr}}">
<text class="info-label">退款时间</text>
<text class="info-value">{{detail.refundTimeStr}}</text>
</view>
<!-- 订单编号 -->
<view class="info-row info-row--last">
<text class="info-label">订单编号</text>
<view class="order-no-wrap">
<text class="info-value order-no">{{detail.orderNo}}</text>
<view class="copy-btn" bindtap="onCopyOrderNo">
<text class="copy-icon">⎘</text>
</view>
</view>
</view>
</view>
<!-- 项目列表表格 -->
<view class="table-card" wx:if="{{detail.items && detail.items.length > 0}}">
<view class="table-head">
<text class="th">项目</text>
<text class="th">组别</text>
<text class="th th-right">费用(元)</text>
</view>
<view class="table-body">
<view class="tr" wx:for="{{detail.items}}" wx:key="id">
<text class="td">{{item.projectName}}</text>
<text class="td">{{item.groupName}}</text>
<text class="td td-right">{{item.fee}}</text>
</view>
</view>
</view>
</scroll-view>
</view>

View File

@ -0,0 +1,162 @@
/* ===== 页面 ===== */
.detail-page {
min-height: 100vh;
background: #f5f7fa;
}
.scroll {
height: calc(100vh - 88rpx);
padding: 0 32rpx 60rpx;
box-sizing: border-box;
}
/* ===== 顶部状态标题 ===== */
.status-header {
padding: 40rpx 8rpx 24rpx;
}
.status-title {
font-size: 40rpx;
font-weight: 700;
}
.status-success {
color: #07c160;
}
.status-cancelled {
color: #ff4d4f;
}
.status-pending {
color: #fa8c16;
}
/* ===== 基本信息卡 ===== */
.info-card {
background: #ffffff;
border-radius: 20rpx;
padding: 0 40rpx;
overflow: hidden;
}
.info-row {
display: flex;
align-items: center;
justify-content: space-between;
padding: 32rpx 0;
border-bottom: 1rpx solid #f5f5f5;
}
.info-row--top {
align-items: flex-start;
padding: 36rpx 0 28rpx;
}
.info-row--last {
border-bottom: none;
}
.divider {
height: 1rpx;
background: #f0f0f0;
}
.info-event-name {
flex: 1;
font-size: 30rpx;
color: #1a1a1a;
font-weight: 600;
padding-right: 24rpx;
line-height: 1.4;
}
.info-status {
flex-shrink: 0;
font-size: 26rpx;
font-weight: 500;
}
.info-label {
font-size: 28rpx;
color: #666;
}
.info-value {
font-size: 28rpx;
color: #333;
}
/* 订单编号行 */
.order-no-wrap {
display: flex;
align-items: center;
gap: 12rpx;
}
.order-no {
font-size: 24rpx;
color: #333;
}
.copy-btn {
width: 44rpx;
height: 44rpx;
display: flex;
align-items: center;
justify-content: center;
}
.copy-icon {
font-size: 32rpx;
color: #999;
}
/* ===== 项目表格卡 ===== */
.table-card {
margin-top: 24rpx;
background: #ffffff;
border-radius: 20rpx;
overflow: hidden;
}
.table-head {
display: flex;
align-items: center;
background: #1a56db;
padding: 28rpx 0;
}
.th {
flex: 1;
text-align: center;
font-size: 28rpx;
color: #ffffff;
font-weight: 600;
}
.th-right {
text-align: center;
}
.tr {
display: flex;
align-items: center;
padding: 32rpx 0;
border-bottom: 1rpx solid #f5f5f5;
}
.tr:last-child {
border-bottom: none;
}
.td {
flex: 1;
text-align: center;
font-size: 28rpx;
color: #333;
}
.td-right {
text-align: center;
}

View File

@ -0,0 +1,67 @@
Page({
data: {
loading: false,
noMore: false,
orders: [
{
id: 1,
eventName: '2024上海市学生运动会跳绳比赛',
statusText: '交易成功',
statusKey: 'success',
payTimeStr: '2025-08-05 16:26',
actualAmount: '859',
refundAmount: ''
},
{
id: 2,
eventName: '2024上海市学生运动会跳绳比赛',
statusText: '交易取消',
statusKey: 'cancelled',
payTimeStr: '2025-08-05 16:26',
actualAmount: '859',
refundAmount: '859'
},
{
id: 3,
eventName: '2024上海市学生运动会跳绳比赛',
statusText: '交易成功',
statusKey: 'success',
payTimeStr: '2025-08-05 16:26',
actualAmount: '859',
refundAmount: ''
},
{
id: 4,
eventName: '2024上海市学生运动会跳绳比赛',
statusText: '交易成功',
statusKey: 'success',
payTimeStr: '2025-08-05 16:26',
actualAmount: '859',
refundAmount: ''
}
]
},
onLoad() {},
onPullDownRefresh() {
wx.stopPullDownRefresh();
},
onBack() {
if (getCurrentPages().length > 1) {
wx.navigateBack();
} else {
wx.switchTab({ url: '/pages/mine/mine' });
}
},
onOrderTap(e) {
const { id } = e.currentTarget.dataset;
wx.navigateTo({ url: `/subpackages/mine/order-detail/order-detail?id=${id}` });
},
onLoadMore() {
// TODO: 分页加载
}
});

View File

@ -0,0 +1,7 @@
{
"navigationStyle": "custom",
"enablePullDownRefresh": true,
"usingComponents": {
"mp-navigation-bar": "weui-miniprogram/navigation-bar/navigation-bar"
}
}

View File

@ -0,0 +1,51 @@
<view class="order-page">
<mp-navigation-bar
title="我的订单"
background-color="#ffffff"
color="#333"
bind:click-left="onBack"
left-arrow
></mp-navigation-bar>
<scroll-view
class="list"
scroll-y
lower-threshold="80"
bindscrolltolower="onLoadMore"
>
<!-- 订单卡片列表 -->
<view
class="order-card"
wx:for="{{orders}}"
wx:key="id"
bindtap="onOrderTap"
data-id="{{item.id}}"
>
<!-- 第一行:赛事名 + 状态 -->
<view class="card-row card-row--top">
<text class="event-name">{{item.eventName}}</text>
<text class="order-status status-{{item.statusKey}}">{{item.statusText}}</text>
</view>
<!-- 第二行:支付时间 -->
<view class="card-row">
<text class="pay-time">支付时间:{{item.payTimeStr}}</text>
</view>
<!-- 第三行:金额信息 -->
<view class="card-row card-row--amount">
<text class="amount-item">实付金额:<text class="amount-val">¥{{item.actualAmount}}</text></text>
<text class="amount-item" wx:if="{{item.refundAmount}}">退款金额:<text class="amount-val">¥{{item.refundAmount}}</text></text>
</view>
</view>
<!-- 空状态 -->
<view wx:if="{{orders.length === 0 && !loading}}" class="empty">
<text class="empty-text">暂无订单</text>
</view>
<!-- 加载更多 -->
<view class="list-footer" wx:if="{{orders.length > 0}}">
<text wx:if="{{noMore}}" class="footer-text">没有更多了</text>
<text wx:elif="{{loading}}" class="footer-text">加载中...</text>
</view>
</scroll-view>
</view>

View File

@ -0,0 +1,111 @@
/* ===== 页面 ===== */
.order-page {
min-height: 100vh;
background: #f5f7fa;
}
.list {
height: calc(100vh - 88rpx);
padding: 24rpx 32rpx 40rpx;
box-sizing: border-box;
}
/* ===== 订单卡片 ===== */
.order-card {
background: #ffffff;
border-radius: 20rpx;
padding: 36rpx 40rpx;
margin-bottom: 24rpx;
}
.card-row {
display: flex;
align-items: center;
margin-bottom: 12rpx;
}
.card-row:last-child {
margin-bottom: 0;
}
.card-row--top {
justify-content: space-between;
align-items: flex-start;
margin-bottom: 16rpx;
}
.card-row--amount {
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 6rpx;
margin-top: 4rpx;
}
.event-name {
flex: 1;
font-size: 30rpx;
color: #1a1a1a;
font-weight: 600;
padding-right: 24rpx;
line-height: 1.4;
}
/* 状态文字颜色 */
.order-status {
flex-shrink: 0;
font-size: 26rpx;
font-weight: 500;
}
.status-success {
color: #07c160;
}
.status-cancelled {
color: #ff4d4f;
}
.status-pending {
color: #fa8c16;
}
.pay-time {
font-size: 24rpx;
color: #999;
}
.amount-item {
font-size: 24rpx;
color: #999;
}
.amount-val {
color: #333;
font-weight: 500;
}
/* ===== 空状态 ===== */
.empty {
display: flex;
flex-direction: column;
align-items: center;
padding-top: 200rpx;
}
.empty-text {
font-size: 28rpx;
color: #999;
margin-top: 24rpx;
}
/* ===== 列表底部 ===== */
.list-footer {
text-align: center;
padding: 24rpx 0 40rpx;
}
.footer-text {
font-size: 24rpx;
color: #c0c4cc;
}

View File

@ -0,0 +1,31 @@
Page({
data: {
detail: {
name: '队伍名称',
memberCount: 9,
leaderName: '此文为/1234145121',
coachName: '此为/1234213211',
createdTimeStr: '2025-08-05 16:26',
members: [
{ id: 1, name: '我121', gender: '男', age: 23 },
{ id: 2, name: '我121', gender: '女', age: 12 },
{ id: 3, name: '我121', gender: '女', age: 32 },
{ id: 4, name: '我121', gender: '女', age: 12 }
]
}
},
onLoad(options) {
const id = options && options.id;
// TODO: 根据 id 调用接口获取团队详情
// this.loadDetail(id);
},
onBack() {
if (getCurrentPages().length > 1) {
wx.navigateBack();
} else {
wx.navigateTo({ url: '/subpackages/mine/team/team' });
}
}
});

View File

@ -0,0 +1,6 @@
{
"navigationStyle": "custom",
"usingComponents": {
"mp-navigation-bar": "weui-miniprogram/navigation-bar/navigation-bar"
}
}

View File

@ -0,0 +1,52 @@
<view class="detail-page">
<!-- 导航栏 -->
<mp-navigation-bar
title="团队详情"
background-color="#ffffff"
color="#333"
bind:click-left="onBack"
left-arrow
></mp-navigation-bar>
<!-- 基本信息 -->
<view class="info-card">
<view class="info-row">
<text class="info-label">队伍名称</text>
<text class="info-value highlight">{{detail.memberCount}}人</text>
</view>
<view class="info-row">
<text class="info-label">领队</text>
<text class="info-value">{{detail.leaderName || '—'}}</text>
</view>
<view class="info-row">
<text class="info-label">教练</text>
<text class="info-value">{{detail.coachName || '—'}}</text>
</view>
<view class="info-row last">
<text class="info-label">创建时间</text>
<text class="info-value">{{detail.createdTimeStr || '—'}}</text>
</view>
</view>
<!-- 成员列表 -->
<view class="member-card">
<!-- 表头 -->
<view class="table-head">
<text class="th th-name">姓名</text>
<text class="th th-gender">性别</text>
<text class="th th-age">年龄</text>
</view>
<!-- 表体 -->
<view class="table-body">
<view class="tr" wx:for="{{detail.members}}" wx:key="id">
<text class="td td-name">{{item.name}}</text>
<text class="td td-gender">{{item.gender}}</text>
<text class="td td-age">{{item.age}}</text>
</view>
<!-- 空状态 -->
<view wx:if="{{!detail.members || detail.members.length === 0}}" class="table-empty">
<text class="table-empty-text">暂无成员</text>
</view>
</view>
</view>
</view>

View File

@ -0,0 +1,96 @@
/* ===== 页面 ===== */
.detail-page {
min-height: 100vh;
background: #f5f7fa;
}
/* ===== 基本信息卡 ===== */
.info-card {
margin: 24rpx 32rpx 0;
background: #ffffff;
border-radius: 20rpx;
padding: 0 40rpx;
overflow: hidden;
}
.info-row {
display: flex;
align-items: center;
justify-content: space-between;
padding: 36rpx 0;
border-bottom: 1rpx solid #f0f0f0;
}
.info-row.last {
border-bottom: none;
}
.info-label {
font-size: 28rpx;
color: #666;
}
.info-value {
font-size: 28rpx;
color: #333;
}
.info-value.highlight {
color: #1a56db;
font-weight: 600;
}
/* ===== 成员表格卡 ===== */
.member-card {
margin: 24rpx 32rpx 48rpx;
background: #ffffff;
border-radius: 20rpx;
overflow: hidden;
}
/* 表头 */
.table-head {
display: flex;
align-items: center;
background: #1a56db;
padding: 28rpx 0;
}
.th {
flex: 1;
text-align: center;
font-size: 28rpx;
color: #ffffff;
font-weight: 600;
}
/* 表体行 */
.tr {
display: flex;
align-items: center;
padding: 32rpx 0;
border-bottom: 1rpx solid #f5f5f5;
}
.tr:last-child {
border-bottom: none;
}
.td {
flex: 1;
text-align: center;
font-size: 28rpx;
color: #333;
}
/* 空状态 */
.table-empty {
display: flex;
justify-content: center;
padding: 80rpx 0;
}
.table-empty-text {
font-size: 28rpx;
color: #999;
}

View File

@ -0,0 +1,34 @@
Page({
data: {
orgName: '上海市跳绳键球协会', // 所在单位,后续接口替换
loading: false,
teams: [
{ id: 1, name: '队伍名称', memberCount: 9, pendingCount: 0 },
{ id: 2, name: '队伍名称', memberCount: 91, pendingCount: 0 },
{ id: 3, name: '队伍名称', memberCount: 9, pendingCount: 3 }
]
},
onLoad() {},
onPullDownRefresh() {
wx.stopPullDownRefresh();
},
onBack() {
if (getCurrentPages().length > 1) {
wx.navigateBack();
} else {
wx.switchTab({ url: '/pages/mine/mine' });
}
},
onViewOrgPoints() {
wx.showToast({ title: '单位积分功能开发中', icon: 'none' });
},
onTeamTap(e) {
const { id } = e.currentTarget.dataset;
wx.navigateTo({ url: `/subpackages/mine/team-detail/team-detail?id=${id}` });
}
});

View File

@ -0,0 +1,7 @@
{
"navigationStyle": "custom",
"enablePullDownRefresh": true,
"usingComponents": {
"mp-navigation-bar": "weui-miniprogram/navigation-bar/navigation-bar"
}
}

View File

@ -0,0 +1,48 @@
<view class="team-page">
<!-- 导航栏 -->
<mp-navigation-bar
title="我的团队"
background-color="#ffffff"
color="#333"
bind:click-left="onBack"
left-arrow
></mp-navigation-bar>
<!-- 所在单位卡片 -->
<view class="org-card" wx:if="{{orgName}}">
<view class="org-bg"></view>
<view class="org-content">
<view class="org-info">
<text class="org-name">{{orgName}}</text>
<text class="org-label">所在单位</text>
</view>
<view class="org-btn" bindtap="onViewOrgPoints">
<text class="org-btn-icon">○</text>
<text class="org-btn-text">查看单位积分</text>
</view>
</view>
</view>
<!-- 团队列表 -->
<view class="list-wrap">
<view
class="team-item"
wx:for="{{teams}}"
wx:key="id"
bindtap="onTeamTap"
data-id="{{item.id}}"
data-item="{{item}}"
>
<text class="team-name">{{item.name}}</text>
<view class="team-right">
<text class="team-count">{{item.memberCount}}人{{item.pendingCount ? item.pendingCount : ''}}</text>
<text class="team-arrow">›</text>
</view>
</view>
<!-- 空状态 -->
<view wx:if="{{teams.length === 0 && !loading}}" class="empty">
<text class="empty-text">暂无团队</text>
</view>
</view>
</view>

View File

@ -0,0 +1,148 @@
/* ===== 页面 ===== */
.team-page {
min-height: 100vh;
background: #f5f7fa;
}
/* ===== 单位卡片 ===== */
.org-card {
position: relative;
margin: 24rpx 32rpx 0;
border-radius: 20rpx;
overflow: hidden;
height: 160rpx;
}
.org-bg {
position: absolute;
inset: 0;
background: linear-gradient(135deg, #1a3a8a 0%, #1a56db 100%);
}
/* 背景纹理点缀 */
.org-bg::before,
.org-bg::after {
content: '';
position: absolute;
border-radius: 50%;
background: rgba(255, 255, 255, 0.08);
}
.org-bg::before {
width: 200rpx;
height: 200rpx;
top: -60rpx;
right: 40rpx;
}
.org-bg::after {
width: 140rpx;
height: 140rpx;
bottom: -50rpx;
right: 160rpx;
}
.org-content {
position: relative;
z-index: 1;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 40rpx;
height: 100%;
}
.org-info {
display: flex;
flex-direction: column;
gap: 8rpx;
}
.org-name {
font-size: 32rpx;
font-weight: 700;
color: #ffffff;
}
.org-label {
font-size: 22rpx;
color: rgba(255, 255, 255, 0.7);
}
.org-btn {
display: flex;
align-items: center;
gap: 8rpx;
background: rgba(255, 255, 255, 0.15);
border: 2rpx solid rgba(255, 255, 255, 0.4);
border-radius: 40rpx;
padding: 12rpx 28rpx;
}
.org-btn-icon {
font-size: 24rpx;
color: #ffffff;
}
.org-btn-text {
font-size: 24rpx;
color: #ffffff;
}
/* ===== 团队列表 ===== */
.list-wrap {
margin: 24rpx 32rpx 0;
background: #ffffff;
border-radius: 20rpx;
overflow: hidden;
}
.team-item {
display: flex;
align-items: center;
justify-content: space-between;
padding: 40rpx 40rpx;
border-bottom: 1rpx solid #f0f0f0;
}
.team-item:last-child {
border-bottom: none;
}
.team-name {
font-size: 30rpx;
color: #1a1a1a;
font-weight: 500;
}
.team-right {
display: flex;
align-items: center;
gap: 12rpx;
}
.team-count {
font-size: 28rpx;
color: #1a56db;
font-weight: 500;
}
.team-arrow {
font-size: 36rpx;
color: #c0c4cc;
line-height: 1;
}
/* ===== 空状态 ===== */
.empty {
display: flex;
flex-direction: column;
align-items: center;
padding: 120rpx 0;
}
.empty-text {
font-size: 28rpx;
color: #999;
margin-top: 24rpx;
}