acupuncture/大唐会议前台1/pages/index/details.vue

<template>
	<view class="box">
		<image class="logo" src='../../imgs/logo.png' alt="" mode="widthFix" @click="handleLogo"></image>
		<view class="box-cent">
			<view class="box-cent1">
				<view class="view-box">
					<view style="text-align: center;">
						<span class="view-title"> {{listData.title}}</span>
					</view>
					<view class="view-ul">
						<MeetingList :infos='listData.infos'></MeetingList>
					</view>
				</view>
			</view>
		</view>
	<!-- 底部背景图 -->
	<view class="view-backimg">
		<view class="view-backimg-top"></view>
		<view class="view-backimg-bottom"></view>
	</view>
	</view>
</template>

<script>
	
	import {
		queryMeeting,
		meetingDetails
	} from "@/common/api";
	import {
		mapMutations
	} from 'vuex';
	import MeetingList from "../components/MeetingList.vue"
	
	export default {
		components: {MeetingList},
		data() {
			return {
				listData: [],
				data: []
			};
		},
		
		created() {
			let routes = getCurrentPages(); // 获取当前打开过的页面路由数组
			let curParam = routes[routes.length - 1].options; //获取路由参数
			console.log('curParam', curParam)
			this.getMeetingDetails(curParam.id) //获取会议列表
		},
		methods: {
			// logo 回到首页
			handleLogo(){
				// uni.navigateTo({
				// 	url: `/pages/index/index`,
				// });
				uni.navigateBack({
					delta: 2
				});
			},
			// 查看详情
			handleItemClaick(_item) {
				// enable false 不可查看详情
				if (!_item.enable) return
				uni.navigateTo({
					url: `/pages/index/details?id=${_item.id}`,
				});
			},
			// 获取验证码
			async getMeetingDetails(meetingId) {
				const res = await meetingDetails({
					param: {
						meetingId,
					}
				});
				const {
					code,
					data,
					msg
				} = res;
				if (code === 200) {
					this.listData = data
					console.log(this.listData)
				}
			},
		},
		// 页面显示调用接口
		onLoad() {},
	};
</script>

<style lang="scss" scoped>
	.view-box{
		margin-top:50px ;
	}
	.view-ul {
		text-align: left;
		margin-bottom: 16px;

		.view-li {
			font-size: 18px;
			line-height: 26px;
			
		}
	}

	.view-title {
		display: inline-block;
		border: 1px solid #000;
		padding: 0 14px;
		margin-bottom: 30px;
		line-height: 50px;
		border-radius: 6px;
		font-size: 20px;
		font-weight: bold;
	}

	.box {
		height: 100vh;
		box-sizing: border-box;
		padding: 20px 100px;
		display: flex;
		flex-direction: column;

		.box-cent {
			flex: 1;
			margin-top: 70px;
			position: relative;
		}

		.box-cent1 {
			position: absolute;
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			overflow: auto;
		}
	}
</style>
<style></style>