<template>
	<view class="page">
		<view class="searchbox">
			<text class="tipsword">查询日期</text>

			<picker mode="date" :value='date'  @change="bindDateChange">
				<view class="fill">{{date}}</view>
			</picker>
			<view class="searchbtn">搜索</view>
		</view>
		<view class="box">
			<view class="item">
				<view class="titlebox">
					<view class="type">审核中</view>
					<view class="word">帖子标题帖子标题帖子标题帖子帖...</view>
					<image src="../../static/del.png" mode="widthFix" class="del"></image>
				</view>
				<view class="wordarea">
					帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容...
				</view>
				<view class="numbox">
					<view class="time">2019-10-10 15:30:30</view>
					<view class="btnbox">
						<view class="zan">
							<image src="../../static/zan.png" mode="widthFix" class="icon"></image>399
						</view>
						<view class="people">
							<image src="../../static/people.png" mode="widthFix" class="icon"></image>399
						</view>
					</view>
				</view>
			</view>
			<view class="item">
				<view class="titlebox">
					<view class="type">审核中</view>
					<view class="word">帖子标题帖子标题帖子标题帖子帖...</view>
					<image src="../../static/del.png" mode="widthFix" class="del"></image>
				</view>
				<view class="wordarea">
					帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容...
				</view>
				<view class="numbox">
					<view class="time">2019-10-10 15:30:30</view>
					<view class="btnbox">
						<view class="zan">
							<image src="../../static/zan.png" mode="widthFix" class="icon"></image>399
						</view>
						<view class="people">
							<image src="../../static/people.png" mode="widthFix" class="icon"></image>399
						</view>
					</view>
				</view>
			</view>
			<view class="item">
				<view class="titlebox">
					<view class="type">审核中</view>
					<view class="word">帖子标题帖子标题帖子标题帖子帖...</view>
					<image src="../../static/del.png" mode="widthFix" class="del"></image>
				</view>
				<view class="wordarea">
					帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容帖子内容...
				</view>
				<view class="numbox">
					<view class="time">2019-10-10 15:30:30</view>
					<view class="btnbox">
						<view class="zan">
							<image src="../../static/zan.png" mode="widthFix" class="icon"></image>399
						</view>
						<view class="people">
							<image src="../../static/people.png" mode="widthFix" class="icon"></image>399
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import app from "../../App.vue";
	
	export default {
		
		data() {
			const currentDate = this.getDate({
				format: true
			})
			console.log(currentDate)
			return {
				page: 1,
				publishlist: [],
				date: currentDate,
			}
		},
		onLoad() {
			
			
			this.getpublish()
		},
		methods: {
			getpublish() {
				let that = this;
				var url = 'forum/get_my_forum';
				var params = {
					user_id: uni.getStorageSync("user_id"),
					page: that.page,
					pageNum: 10
				}
				console.log('7766554', params)
				app.post(url, params).then((res) => {
					console.log(res);
					that.publishlist = that.publishlist.concat(res.data.data);
					console.log(that.publishlist)


				}).catch((err) => {

				})
			},

			startDate() {
				return this.getDate('start');
			},
			endDate() {
				return this.getDate('end');
			},

			getDate(type) {
				const date = new Date();
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let day = date.getDate();

				if (type === 'start') {
					year = year - 60;
				} else if (type === 'end') {
					year = year + 2;
				}
				month = month > 9 ? month : '0' + month;;
				day = day > 9 ? day : '0' + day;
				return `${year}-${month}-${day}`;
			},
			bindDateChange: function(e) {
				this.date = e.target.value
			},
		}
	}
</script>

<style>
	
	page {
		background: #F7F7F7;
	}

	.searchbox {
		padding: 0 32rpx;
		box-sizing: border-box;
		background: #fff;
		height: 88rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.tipsword {
		font-size: 28rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: rgba(61, 69, 76, 1);
	}

	.searchbox .fill {
		width: 482rpx;
		height: 60rpx;
		line-height: 60rpx;
		padding: 0 24rpx;
		box-sizing: border-box;
		background: rgba(249, 249, 249, 1);
		border-radius: 32rpx;
		border: 2rpx solid rgba(238, 238, 238, 1);
		font-size: 24rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: rgba(189, 196, 206, 1);
	}

	.searchbtn {
		font-size: 28rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: rgba(61, 69, 76, 1);
	}

	.box {
		background: #fff;
		padding: 0 32rpx;
		box-sizing: border-box;
	}

	.item {
		padding: 32rpx 0;
		border-bottom: 1px solid #EEEEEE;
		box-sizing: border-box;
	}

	.titlebox {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.type {
		width: 100rpx;
		height: 36rpx;
		background: rgba(255, 255, 255, 1);
		border-radius: 4rpx;
		border: 2rpx solid rgba(194, 148, 69, 1);
		font-size: 22rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: rgba(194, 148, 69, 1);
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.word {
		font-size: 32rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 600;
		color: rgba(6, 18, 32, 1);
	}

	.del {
		width: 32rpx;
		height: 32rpx;
	}

	.wordarea {
		font-size: 28rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: rgba(60, 68, 76, 1);
		margin-top: 12rpx;
	}

	.numbox {
		margin-top: 18rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.time {
		font-size: 24rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: rgba(91, 94, 100, 1);
	}

	.btnbox {
		display: flex;
		align-items: center;
	}

	.zan,
	.people {
		display: flex;
		align-items: center;
		font-size: 28rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: rgba(91, 94, 100, 1);
	}

	.zan {
		margin-right: 32rpx;
	}

	.icon {
		width: 28rpx;
		margin-right: 8rpx;
	}
</style>