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

<template>
	<view class="box">
		<image class="back" src='../../imgs/back.png' mode="widthFix" @click="handleBack"></image>
		<image class="logo" src='../../imgs/logo.png' alt="" mode="widthFix" ></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 :detailsId='detailsId' :infos='listData.infos'></MeetingList>
					</view>
				</view>
			</view>
			<u-modal v-if="show" :show="show" @cancel="show = false" :showCancelButton="true" content='是否确认退出登录？' @confirm="handleOut"></u-modal>
		</view>
		<!-- 底部背景图 -->
		<view class="view-backimg">
			<view class="view-backimg-top"></view>
			<view class="view-backimg-bottom"></view>
		</view>
		<!-- 头像 - 头像 -->
		<view class="avatarobx">
			<image class="avatar" src='../../imgs/tx.png' mode="widthFix" ></image>
			<view class="name">{{userName}}</view>
			<view class="view-out" @click="show = true">退出登录</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: [],
				userName: uni.getStorageSync("userName"),
				show: false,
				detailsId:'',
			};
		},

		created() {
			let routes = getCurrentPages(); // 获取当前打开过的页面路由数组
			let curParam = routes[routes.length - 1].options; //获取路由参数
			this.detailsId = curParam.id
			console.log('curParam', this.detailsId)
			this.getMeetingDetails(curParam.id) //获取会议列表
		},
		methods: {
			// 退出登录
			handleOut(){
				uni.clearStorage();
				uni.reLaunch({
					url: '/pages/user/login',
				});
			},
			// logo 回到首页
			handleBack() {
				uni.navigateTo({
					url: `/pages/index/index`,
				});
				// uni.navigateBack({
				// 	delta: 1
				// });
			},
			// 查看详情
			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>
	/deep/ .u-modal__content{
		text-align: center;
	}
	.avatar{
	}
	.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>