1、待核销二维码的报名信息展示

2、待支付、已完成等报名信息展示,但是有滚动条存在
This commit is contained in:
wangzimeng 2025-08-05 18:30:02 +08:00
parent 1aeec910c9
commit 2d17393e1e
3 changed files with 141 additions and 12 deletions

View File

@ -1062,7 +1062,7 @@
.bottom {
width: 100%;
margin-bottom: 10rpx;
margin-bottom: 20rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
font-size: 26rpx;

View File

@ -10,7 +10,7 @@
<view class="first-box flex flex-start flex-column justify-start">
<view class="flex align-items justify-center" @click="openInfo()">
<image class="head_img" v-if="detail.images.length > 0" :src="detail.images[0]" mode=""></image>
<image class="head_img" v-if="detail.images!=[]" :src="detail.images[0]" mode=""></image>
<view style="margin-left: 20rpx;">
<view class="flex align-items">
<span class="first-name" style="font-weight: 600;">{{detail.title}}</span>
@ -18,7 +18,8 @@
<view class="first-image flex align-items" style="margin-top: 25rpx;">
<image :src="detailAny.user.avatar" mode=""
style="width: 36rpx;height: 36rpx;border-radius: 50%;"></image>
<span class="white-space" style="color:#9C9C9C;margin-left: 10rpx;width: 210rpx;">{{ detailAny.user.nickname }}</span>
<span class="white-space"
style="color:#9C9C9C;margin-left: 10rpx;width: 210rpx;">{{ detailAny.user.nickname }}</span>
<text style="color:#9C9C9C;margin-left: 20rpx;">/</text>
<span
style="color:#9C9C9C;margin-left: 20rpx;">{{ detailAny.join_info.people_number }}人玩过</span>
@ -55,6 +56,33 @@
</view>
<!-- 报名信息 -->
<view class="signUpInfo">
<view class="signInfo-top flex align-items">
<view>报名信息
<image class="icons" src="/static/detail/xiangqing.png"></image>
</view>
</view>
<scroll-view class="signBoxList" scroll-y="true" :show-scrollbar="false">
<view class="sign-item" v-for="(item,index) in detailAny.ordercode" :key="index">
<view style="font-size: 28rpx;font-weight: 400;line-height: 28rpx;color: #323232;">{{item.name}}
</view>
<view
style="font-size: 24rpx;margin-top: 10rpx;font-weight: 400;color: #9c9c9c;line-height: 24rpx;">
{{item.idnum}}
</view>
</view>
<!-- <view class="signList">
</view> -->
</scroll-view>
</view>
<view class="third flex flex-column" style="justify-content: flex-start;">
<view class="third-center">
<view class="flex w-100 space-between hui align-items" style="margin-top: 8rpx;">
@ -82,8 +110,7 @@
<span>付款时间</span>
<span style="color: #323232;">{{ formattime(detailAny.paytime)}}</span>
</view>
<view class="flex w-100 space-between hui align-items"
style="margin-top: 30rpx;">
<view class="flex w-100 space-between hui align-items" style="margin-top: 30rpx;">
<span>备注</span>
<span style="color: #323232;">{{ detailAny.desc}}</span>
</view>
@ -169,12 +196,10 @@
} from '../../utils/dateFormat'
export default {
computed: {
// formattedTitle() {
// if (this.detail.title.length > 9) {
// return this.detail.title.slice(0, 9) + '..';
// }
// return this.detail.title;
// },
scrollViewHeight() {
// 80rpx 100rpx
return Math.max(this.detailAny.ordercode.length * 80, 100);
},
formattedTimeList() {
return this.timeList.map(item => {
const startTime = dayjs.unix(item.start_time).format('YYYY-MM-DD HH:mm:ss');
@ -492,6 +517,13 @@
</script>
<style lang="scss" scoped>
/* 微信小程序隐藏滚动条 */
::-webkit-scrollbar {
width: 0;
height: 0;
display: none;
}
.detail_all {
background-color: #f7f7f7;
height: 100vh;
@ -517,6 +549,10 @@
align-items: center;
}
.grid {
display: grid;
}
.flex-column {
flex-flow: column;
}
@ -655,6 +691,97 @@
}
.signUpInfo {
width: 690rpx;
height: 366rpx;
padding: 30rpx;
margin-top: 30rpx;
box-sizing: border-box;
background-color: #ffffff;
border-radius: 44rpx;
.signInfo-top {
font-family: PingFang SC, PingFang SC;
font-weight: 700;
font-size: 36rpx;
color: #323232;
line-height: 50rpx;
// margin-top: 30rpx;
// margin-left: 30rpx;
position: relative;
z-index: 10;
view {
position: relative;
.icons {
width: 37rpx;
height: 20rpx;
position: absolute;
left: 0;
bottom: 0;
z-index: -1;
}
}
}
.signBoxList {
display: grid;
justify-content: flex-start;
align-items: center;
border: none !important;
box-shadow: none !important;
margin-top: 10rpx;
width: 630rpx;
height: 246rpx;
padding-right: 0 !important;
overflow: hidden;
// overflow-y: auto;
// scrollbar-width: none;/* Firefox */
// -ms-overflow-style: none;/* IE/Edge */
// overflow-clip-margin: content-box;
overflow-y: auto;
-webkit-overflow-scrolling: touch; /* 平滑滚动 */
scrollbar-width: none; /* Firefox */
-ms-overflow-style: none; /* IE/Edge */
&::-webkit-scrollbar {
display: none !important;
width: 0 !important;
height: 0 !important;
}
// &::-webkit-scrollbar {
// display: none !important; /* Chrome/Safari */
// }
// ::v-deep .signBoxList::-webkit-scrollbar {
// display: none !important;
// }
.scroll-view-class .inner-content {
margin: 0;
padding: 0;
/* 避免内容溢出容器 */
box-sizing: border-box;
}
.sign-item {
width: 630rpx;
margin-top: 20rpx;
margin-bottom: 20rpx;
}
}
}
.line {

View File

@ -17,6 +17,8 @@
</view>
<view style="text-align: center;font-size: 28rpx;margin-top: 15rpx;font-weight: 600;">{{item.name}}
</view>
<view style="text-align: center;font-size: 28rpx;margin-top: 10rpx;font-weight: 600;">{{item.idnum}}
</view>
</swiper-item>
</swiper>
@ -52,7 +54,7 @@
data() {
return {
currentIndex: 0,
swiperHeight: 350 //
swiperHeight: 400 //
};
},
methods: {