<template>
	<view style="height: 100vh;background: #F9FAFF;">
		<view class="notice-top">
			<navs :top='top' :page='pageName' :color='color'></navs>
		</view>
		<view class="notice-box">
			<view>
				<view class="time">1天前</view>
				<view class="notice">
					<view class="notice-title">反馈回复</view>
					<view class="notice-reply">
						<view>我的问题：进度怎么这么慢？</view>
						<view>客服回复：bug过多，抱歉</view>
					</view>
				</view>
			</view>
			<view>
				<view class="time">1天前</view>
				<view class="notice">
					<view class="notice-title">项目进展</view>
					<view class="notice-reply">设计已完成80%</view>
				</view>
			</view>
			<view>
				<view class="time">1天前</view>
				<view class="notice">
					<view class="notice-title">项目进展</view>
					<view class="notice-reply">设计已完成80%</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				pageName: '通知',
				color: 1,
				top: 0
			};
		},
		onLoad() {
			this.top = uni.getMenuButtonBoundingClientRect().top;
		},
	}
</script>

<style lang="scss">
	.notice-top {
		background-color: #fff;
		padding-bottom: 8rpx;
	}

	.notice-box {
		padding: 0 28rpx 0 32rpx;

		.time {
			color: #666666;
			font-size: 24rpx;
			text-align: center;
			line-height: 82rpx;
		}

		.notice {
			border-radius: 20rpx;
			background: #ffffff;
			padding: 0 23rpx;
			padding-top: 28rpx;

			.notice-title {
				font-size: 30rpx;
				color: #000;
				font-weight: 500;
			}

			.notice-reply {
				font-size: 26rpx;
				font-weight: 400;
				color: #666666;
				margin-top: 32rpx;
				padding-bottom: 32rpx;
				line-height: 45rpx;
			}
		}
	}
</style>
