datang-meeting/大唐会议前台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">
			<view class="name">{{ userName }}</view>
			<image
				@click="handleBack"
				class="avatar"
				src="../../imgs/arrow-left.png"
				mode="widthFix"
			></image>
			<image
				@click="show = true"
				class="avatar"
				src="../../imgs/out.png"
				mode="widthFix"
			></image>
		</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>
::v-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>