GSExamProj/pages/moreDetail/moreDetail.vue

<template>
	<view class="hole-page">
		<view class="nav-bar"></view>
		<view class="ipt">
			<uni-easyinput suffixIcon="search" v-model="iptVal" placeholder="请输入关键字" @iconClick="iconClick"></uni-easyinput>
		</view>
		<view class="lower-cont">
			<view class="single-notice"
				v-for="(notice, index) in noticeArr"
				:key="index"
				@click="toggleNotice(notice.id, notice.ifReceive, notice.ifSign, notice.noticeTheme, notice.noticeContent, notice.startTime, notice.endTime, notice.noticeType, notice.workTime)"
			>
				<view class="single-exam" v-show="notice.noticeType == 1">
					<!-- <view class="lef">
						<image src="../../static/examNotice.png" mode=""></image>
					</view> -->
					<view class="rig">
						<view style="font-size: 16px; font-weight: bold;">{{ notice.noticeTheme }}</view>
						<view style="color: #868686;">{{ notice.startTime + ' ~ ' + notice.endTime }}</view>
					</view>
					<!-- <view class="top-rig">
						<view class="greenDot" v-show="notice.ifReceive != 0"></view>
						<view class="redDot" v-show="notice.ifReceive == 0"></view>
					</view> -->
				</view>
				<view class="single-edu" v-show="notice.noticeType == 2">
					<!-- <view class="lef">
						<image src="../../static/eduNotice.png" mode=""></image>
					</view> -->
					<view class="rig">
						<view style="font-size: 16px; font-weight: bold;">{{ notice.noticeTheme }}</view>
						<view style="color: #868686;">{{ notice.startTime + ' ~ ' + notice.endTime }}</view>
					</view>
					<!-- <view class="top-rig">
						<view class="greenDot" v-show="notice.ifReceive != 0"></view>
						<view class="redDot" v-show="notice.ifReceive == 0"></view>
					</view> -->
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { publicPath } from '../../public.js'
	export default {
		data() {
			return {
				iptVal: '',
				noticeArr: []
			}
		},
		methods: {
			// 获取首页通知公告 1考试 2培训
			fetchHomeNotice (keyWord) {
				let that = this
				// that.noticeArr = []
				uni.request({
					url: publicPath + '/backstage/app/getAppNoticeList',
					method: 'POST',
					header: {
						'content-type':'application/x-www-form-urlencoded; charset=UTF-8'
					},
					data: {
						userId: uni.getStorageSync('id'),
						keyWord
					},
					success: (res) => {
						if (res.data.code == 200) {
							/* for (let i = 0; i < res.data.data.length; i++) {
								that.noticeArr.push(res.data.data[i])
							} */
							that.noticeArr = res.data.data
							console.log(that.noticeArr);
						} else {
							uni.showToast({
								icon: 'none',
								title: '当前暂无公告！'
							})
						}
					}
				})
				/* that.$api.index.getHomeNotice({
					userId: uni.getStorageSync('id'),
					keyWord
				}).then(res => {
					console.log(res)
					if (res.data.code == 200) {
						for (let i = 0; i < res.data.data.length; i++) {
							that.noticeArr.push(res.data.data[i])
						}
						that.noticeArr = res.data.data
						console.log(that.noticeArr);
					} else {
						uni.showToast({
							icon: 'none',
							title: '当前暂无公告！'
						})
					}
				}).catch(err => {
					console.log(err);
				}) */
			},
			toggleNotice (id, ifReceive, ifSign, theme, cont, sTime, eTime, type, workTime) {
				console.log(ifReceive);
				if (ifReceive == 0) {
					uni.request({
						url: publicPath + '/backstage/app/receiveNoticeById',
						method: 'POST',
						header: {
							'content-type':'application/x-www-form-urlencoded; charset=UTF-8'
						},
						data: {
							userId: uni.getStorageSync('id'),
							id: id
						},
						success: (res) => {
							console.log(res);
							if (res.data.code == 200) {
								uni.navigateTo({
									url: `/pages/noticePage/noticePage?id=${id}&ifReceive=${ifReceive}&ifSign=${ifSign}&theme=${theme}&cont=${cont}&sTime=${sTime}&eTime=${eTime}&type=${type}&workTime=${workTime}`
								})
							}
						}
					})
				} else {
					uni.navigateTo({
						url: `/pages/noticePage/noticePage?id=${id}&ifReceive=${ifReceive}&ifSign=${ifSign}&theme=${theme}&cont=${cont}&sTime=${sTime}&eTime=${eTime}&type=${type}&workTime=${workTime}`
					})
				}
			},
			iconClick () {
				let that = this
				console.log(that.iptVal);
				that.fetchHomeNotice(that.iptVal)
			}
		},
		onShow() {
			this.fetchHomeNotice('')
		}
	}
</script>

<style lang="scss">
	.hole-page{
		width: 100%;
		// background: linear-gradient(#9CD2FF, #F9FCFF, #FFFFFF);
		background-color: #f7fbfe;
		.nav-bar{
			width: 100%;
			height: var(--status-bar-height);
			padding-top: var(--status-bar-height);
		}
		.ipt{
			width: 90%;
			margin: 20rpx auto;
		}
		.lower-cont{
			width: 90%;
			margin: 20rpx auto;
			overflow-y: auto;
			font-size: 12px;
			.single-notice{
				width: 100%;
				box-sizing: border-box;
				padding: 12rpx;
				background-color: #fff;
				margin-bottom: 20rpx;
				.single-exam, .single-edu{
					width: 100%;
					height: 100rpx;
					box-sizing: border-box;
					padding: 8rpx;
					display: flex;
					/* .lef{
						width: 12%;
						height: 100%;
						image{
							width: 100%;
							height: 100%;
							overflow: hidden;
						}
					} */
					.rig{
						width: 100%;
						height: 100%;
						box-sizing: border-box;
						padding-left: 20rpx;
						display: flex;
						flex-direction: column;
						justify-content: space-around;
					}
					.top-rig{
						flex: 1;
						display: flex;
						.greenDot{
							width: 40%;
							height: 40%;
							border-radius: 50%;
							margin: auto;
							background-color: green;
						}
						.redDot{
							width: 40%;
							height: 40%;
							border-radius: 50%;
							margin: auto;
							background-color: red;
						}
					}
				}
			}
		}
	}
</style>