myPublish.vue 5.1 KB
<template>
	<view class="page">
		<view class="searchbox">
			<text class="tipsword">查询日期</text>
			<input type="text" value="" placeholder="2019-03-05" class="fill"/>
			<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>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</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;
		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>