outsource/mahjong_group
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

32

Browse Source
This commit is contained in:
zpc 2025-09-12 21:00:34 +08:00
parent 955fb965e4
commit bedf4c3bfe
2 changed files with 246 additions and 95 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
common/server/interface/sq.js
View File

@ -14,4 +14,43 @@ export const getReservationList = async (index = 1, size = 20) => {
return res.data;
}
return null;
}
/**
* 获取我的预约记录
* @param {number} type 0 参与者，1发起者
* @param {number} index 起始页
* @param {number} size 页大小
* @returns {Promise<any>}
*/
export const getMyReservation = async (type = 0, index = 1, size = 10) => {
const res = await request.get("sq/GetMyReservation", {
type: type,
index: index,
size: size
});
if (res.code == 0) {
return res.data;
}
return null;
}
/**
* 获取正在进行的预约
* @returns {Promise<any>}
*/
export const getMyUseReservation = async () => {
const res = await request.get("sq/GetMyUseReservation");
if (res.code == 0) {
return res.data;
}
return null;
}
export const sqInterface = {
getReservationList,
getMyReservation,
getMyUseReservation
}

302
pages/me/appointment-record-page.vue
View File

@ -8,64 +8,59 @@
</view>
<view class="row" style="width: 90%; margin: 30rpx auto 0; font-size: 26rpx;">
<text :style="currentIndex == 0?'color:#FA0D0D':'color:#000000'" @click="click1()">我发起的</text>
<text :style="currentIndex == 0 ? 'color:#FA0D0D' : 'color:#000000'" @click="click1()">我参与的</text>
<text style="margin-left: 50rpx;" :style="currentIndex == 1?'color:#FA0D0D':'color:#000000'"
@click="click2()">我参与的</text>
<text style="margin-left: 50rpx;" :style="currentIndex == 1 ? 'color:#FA0D0D' : 'color:#000000'"
@click="click2()">我发起的</text>
</view>
<view class="" style="width: 100%; overflow-y: auto; margin-top: 30rpx;">
<view class="column" style="width: 90%; margin: 0 auto 0; font-size: 24rpx;">
<!-- 加载状态 -->
<view v-if="loading" class="loading-container">
<text>加载中...</text>
</view>
<view class="" v-for="(item,index) in 4"
<!-- 空状态 -->
<view v-else-if="reservationList.length === 0" class="empty-container">
<text>暂无预约记录</text>
</view>
<!-- 预约记录列表 -->
<view v-else class="reservation-item" v-for="item in reservationList" :key="item.id"
style="width: 100%; border-radius: 10rpx; background-color: #F2F3F5; margin-bottom: 40rpx;">
<view class="column" style="width: 95%; margin: 20rpx auto 20rpx;">
<view class="row title" style="justify-content: space-between;">
<view style="title">{{ item.title || '麻将预约' }}</view>
<view style="font-size:24rpx;" :style="getStatusStyle(item.status)">{{
getStatusText(item.status) }}</view>
</view>
<view class="row" style="justify-content: space-between;">
<text>通宵，来高手</text>
<text>已结束</text>
<view class="row row-text" style="align-items: center; margin-top: 20rpx;">
<text style="margin-left: 20rpx;">{{ formatTimeRange(item.start_time, item.end_time)
}}</text>
</view>
<view class="row" style="align-items: center; margin-top: 20rpx;">
<image src="/static/time.png" style="width: 30rpx; height: 30rpx;" mode=""></image>
<text style="margin-left: 20rpx;">2025/08/27 20:00 ~ 2025/08/28 04：30 \n共8小时30分钟</text>
<text style="margin-left: 20rpx;" class="row-text">{{ item.room_name || '' }}</text>
</view>
<view class="row" style="align-items: center; margin-top: 20rpx;">
<image src="/static/location.png" style="width: 30rpx; height: 30rpx;" mode=""></image>
<text style="margin-left: 20rpx;">305包厢-大包，4人</text>
</view>
<view class="row" style="align-items: center; margin-top: 20rpx;">
<image src="/static/requirement.png" style="width: 30rpx; height: 30rpx;" mode=""></image>
<text style="margin-left: 20rpx;">可吸烟、男、信誉≧4.0</text>
</view>
<view class="row" style="align-items: center; margin-top: 40rpx;">
<image src="" v-for="(item,index) in 4"
style="width: 40rpx; height: 40rpx; background-color: aquamarine; border-radius: 50%; margin-right: 20rpx;"
mode=""></image>
<view class="center" @click="openEvaluatePop()"
<text style="margin-left: 20rpx;" class="row-text">已约牌友：</text>
<image v-for="(participant, pIndex) in item.participants" :key="pIndex"
:src="participant.avatarImage || '/static/default-avatar.png'"
style="width: 40rpx; height: 40rpx; border-radius: 50%; margin-right: 20rpx;"
mode="aspectFill">
</image>
<view class="center" @click="openEvaluatePop(item)"
style="width: 120rpx; height: 30px; background-color: #1989FA; border-radius: 10rpx; margin-left: auto;">
<text style="font-size: 24rpx; color: white;">牌友评价</text>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
@ -81,12 +76,9 @@
请对每位牌友进行评价
</text>
<view class="row" @click="openUserPop()"
<view class="row"
style="width: 100%; background-color: #F2F3F5; border-radius: 10rpx; padding-top: 20rpx; padding-bottom: 20rpx; margin-top: 20rpx;">
<image src=""
style="width: 40rpx; height: 40rpx; background-color: aqua; border-radius: 50rpx; margin-left: 20rpx;"
mode=""></image>
<text style="font-size: 24rpx; margin-left: 20rpx;">树下的胖子</text>
<up-picker :show="show" :columns="array"></up-picker>
<image src="/static/down.png"
style="width: 40rpx; height: 40rpx; margin-left: auto; margin-right: 20rpx;" mode=""></image>
@ -155,13 +147,13 @@
<view class="" style="width: 400rpx; background-color: white; border-radius: 10rpx; padding: 20rpx;">
<view class="row" v-for="(item,index) in 3"
<view class="row" v-for="(user, userIndex) in currentReservation" :key="userIndex"
style="width: 100%; background-color: #F2F3F5; border-radius: 10rpx; padding-top: 20rpx; padding-bottom: 20rpx; margin-top: 20rpx;">
<image src=""
<image :src="user.avatarImage || '/static/default-avatar.png'"
style="width: 40rpx; height: 40rpx; background-color: aqua; border-radius: 50rpx; margin-left: 20rpx;"
mode=""></image>
<text style="font-size: 24rpx; margin-left: 20rpx;">树下的胖子</text>
<text style="font-size: 24rpx; margin-left: 20rpx;">{{ user.nickName }}</text>
</view>
@ -172,65 +164,185 @@
</template>
<script>
export default {
data() {
return {
<script setup>
import { ref, onMounted, watch } from 'vue'
import { sqInterface } from '@/common/server/interface/sq.js'
currentIndex: 0,
rateValue1: 0,
rateValue2: 0,
keepAppointment: '',
readonly: false,
// 响应式数据
const currentIndex = ref(0)
const loading = ref(false)
const reservationList = ref([])
const rateValue1 = ref(0)
const rateValue2 = ref(0)
const keepAppointment = ref('')
const readonly = ref(false)
const currentReservation = ref(null)
}
},
methods: {
goBack() {
// 返回上一页
uni.navigateBack({
delta: 1
});
},
click1() {
this.currentIndex = 0;
},
click2() {
this.currentIndex = 1;
},
openEvaluatePop() {
this.$refs.evaluatePop.open();
},
openUserPop() {
this.$refs.userPop.open();
},
keepAppointmentChange(e) {
this.keepAppointment = e.detail.value;
if (this.keepAppointment == "r1") {
this.readonly = false;
} else {
this.readonly = true;
this.rateValue1 = 0;
this.rateValue2 = 0;
}
}
var array = ['中国', '美国', '巴西', '日本']
var index = 0
const show = ref(false);
const bindPickerChange = (e) => {
}
// 弹窗引用
const evaluatePop = ref(null)
const userPop = ref(null)
// 获取预约记录
const getReservationList = async (type = 0) => {
try {
loading.value = true
const data = await sqInterface.getMyReservation(type, 1, 20)
if (data) {
reservationList.value = data
}
} catch (error) {
console.error('获取预约记录失败:', error)
uni.showToast({
title: '获取预约记录失败',
icon: 'none'
})
} finally {
loading.value = false
}
}
// 标签切换
const click1 = () => {
currentIndex.value = 0
}
const click2 = () => {
currentIndex.value = 1
}
// 监听标签切换
watch(currentIndex, (newIndex) => {
getReservationList(newIndex)
})
// 打开评价弹窗
const openEvaluatePop = (reservation) => {
currentReservation.value = reservation
evaluatePop.value.open()
}
// 打开用户选择弹窗
const openUserPop = () => {
userPop.value.open()
}
// 赴约状态改变
const keepAppointmentChange = (e) => {
keepAppointment.value = e.detail.value
if (keepAppointment.value === "r1") {
readonly.value = false
} else {
readonly.value = true
rateValue1.value = 0
rateValue2.value = 0
}
}
// 格式化时间范围
const formatTimeRange = (startTime, endTime) => {
if (!startTime || !endTime) return '时间未设置'
const start = new Date(startTime)
const end = new Date(endTime)
const startStr = `${start.getFullYear()}-${String(start.getMonth() + 1).padStart(2, '0')}-${String(start.getDate()).padStart(2, '0')} ${String(start.getHours()).padStart(2, '0')}:${String(start.getMinutes()).padStart(2, '0')}`
const endStr = `${end.getFullYear()}-${String(end.getMonth() + 1).padStart(2, '0')}-${String(end.getDate()).padStart(2, '0')} ${String(end.getHours()).padStart(2, '0')}:${String(end.getMinutes()).padStart(2, '0')}`
// 计算时长
const duration = end - start
const hours = Math.floor(duration / (1000 * 60 * 60))
const minutes = Math.floor((duration % (1000 * 60 * 60)) / (1000 * 60))
return `${startStr} ~ ${endStr}`
}
// 获取状态文本
const getStatusText = (status) => {
const statusMap = {
0: '进行中',
1: '已结束',
2: '已结束'
}
return statusMap[status] || '未知状态'
}
// 获取状态样式
const getStatusStyle = (status) => {
const styleMap = {
0: 'color: #1989FA',
1: 'color: #999',
2: 'color: #999'
}
return styleMap[status] || 'color: #999'
}
// 返回上一页
const goBack = () => {
uni.navigateBack({
delta: 1
})
}
// 页面加载时获取数据
onMounted(() => {
getReservationList(0)
})
</script>
<style lang="scss">
.content {
width: 100%;
height: 100vh;
<style lang="scss" scoped>
@import 'uview-plus/theme.scss';
.content {
width: 100%;
height: 100vh;
background: #F7F7F7;
}
.title {
font-family: PingFang SC, PingFang SC;
font-weight: 500;
font-size: 35rpx;
color: #322A2A;
text-align: left;
font-style: normal;
text-transform: none;
}
.row-text {
font-family: PingFang SC, PingFang SC;
font-weight: 400;
font-size: 30rpx;
color: #575757;
text-align: left;
font-style: normal;
text-transform: none;
}
.loading-container,
.empty-container {
display: flex;
justify-content: center;
align-items: center;
height: 400rpx;
font-size: 28rpx;
color: #999;
}
.reservation-item {
background: linear-gradient(180deg, #D7F0DD 0%, #FFFFFF 100%);
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 0, 0, 0.25);
border-radius: 46rpx 46rpx 46rpx 46rpx;
transition: transform 0.2s;
&:active {
transform: scale(0.98);
}
}
</style>