jp-education-student/pages/parents/activity/list.vue

<template>
	<view>
		<u-navbar title="2025迎新春活动" :is-back="false"></u-navbar>

		<view class="main">
			<view class="item" v-for="(item,index) in activityList" :key="index"
				@click="toUpdate(item)">
				<view class="infos">
					<view class="course">
						<view class="name">
							ddbddb
						</view>
					</view>
				</view>
			</view>
		</view>
		
		<view class="btn">
			<button @click="toAdd">报 名</button>
		</view>
	</view>
</template>

<script>
	import * as activityApi from '@/apis/parents/activity.js'

	export default {
		data() {
			return {
				activityList: []
			}
		},
		onReady() {
			this.getActivityList();
		},
		methods: {
			toUpdate(item) {
				uni.navigateTo({
					url: '/pages/parents/activity/add?id=' + item.id
				})
			},
			toAdd() {
				uni.navigateTo({
					url: '/pages/parents/activity/add'
				})
			},
			getActivityList() {
				uni.showLoading({
					title: "加载中",
					mask: true,
				})
				activityApi.pageList({
					name: '',
					pageIndex: 1,
					pageSize: 1000
				}).then((response) => {
					uni.hideLoading();
				}).catch(error => {
					uni.showToast({
						title: error,
						icon: "none"
					})
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.main {
		margin-top:88rpx;
		.item {
			.date {
				padding: 24rpx 32rpx;
				color: rgba(119, 119, 119, 1);
			}

			.infos {
				background-color: #fff;
				padding: 24rpx 36rpx;
				display: flex;
				align-items: center;

				.picture {
					width: 92rpx;
					height: 92rpx;

					img {
						width: 100%;
						height: 100%;
					}
				}

				.course {
					margin-left: 24rpx;

					.name {
						color: rgba(51, 51, 51, 1);
						font-size: 16px;
						font-weight: bold;
					}

					.season-hour {
						display: flex;
						color: rgba(119, 119, 119, 1);
						margin-top: 8rpx;

						.hour {
							margin-left: 8rpx;
						}
					}

				}

				.price {
					color: rgba(16, 16, 16, 1);
					font-size: 18px;
					font-weight: bold;
					margin-left: auto;
				}
			}
		}
	}
	
	.btn {
		padding: 20rpx 0;
		background-color: #fff;
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
	
		button {
			width: 91.4%;
			border-radius: 50px;
			background-color: rgba(13, 186, 199, 1);
			color: rgba(255, 255, 255, 1);
			font-size: 16px;
			line-height: 80rpx;
	
		}
	}
</style>