<template style="background-color: #b1b1b1;">
	<view style="width: 100%;height: 100%;">
		<view class="topbut">
			<!-- 正序 -->
			<view v-if="sort" @click="sort = false">
				<text style="margin-right: 20rpx;">时间正序</text>
				<u-icon name="arrow-down-fill" color="#3b9bff"></u-icon>
			</view>
			<!-- 倒序 -->
			<view v-else @click="sort = true">
				<text style="margin-right: 20rpx;">时间倒序</text>
				<u-icon name="arrow-up-fill" color="#3b9bff"></u-icon>
			</view>
		</view>
		<view style="width: 100%;height: 100rpx;"></view>
		<!-- 卡片 -->
		<view class="list_view" v-for="item,index in list" :key='index' @click="next" :data-index="index">
			<!-- 左边内容 -->
			<view style="width: 80%;">
				<!-- 名字 -->
				<view style="margin-bottom: 20rpx;">
					<text style="width: 130rpx;color: #666666;display: inline-block;">患者:</text>
					<text>{{item.patient_name}}</text>
				</view>
				<!-- 年龄 -->
				<view style="margin-bottom: 20rpx;">
					<text style="width: 130rpx;color: #666666;display: inline-block;">年龄:</text>
					<text>{{item.numBirthday}}</text>
					
				</view>
				<!-- 订单号 -->
				<view style="margin-bottom: 20rpx;">
					<text style="width: 130rpx;color: #666666;display: inline-block;">订单号:</text>
					<text>{{item.order_sn}}</text>
				</view>
				<!-- 填写时间 -->
				<view style="margin-bottom: 20rpx;">
					<text style="width: 130rpx;color: #666666;display: inline-block;">填写时间:</text>
					<text>{{item.created_at}}</text>
				</view>
			</view>
			<!-- 右边按钮 -->
			<view style="width: 20%;" class="flex justify-center">
				<view style="padding: 12rpx 24rpx;border-radius: 20rpx;background-color:#eaeaea ;height: 50rpx;color: b1b1b1;" class="flex justify-center align-center">意见单</view>
			</view>
		</view>
		<view style="width: 100%;height: 100rpx;"></view>
	</view>
</template>

<script>
	export default {
		onLoad(options) {

		},
		mounted() {

		},
		data() {
			return {
				//排序
				sort: true,
				//列表
				list: []
			}
		},
		onLoad() {
			this.getList();
		},
		methods: {
			next(e){
				console.log()
				uni.navigateTo({
					url:'opiniondetails?id='+this.list[e.currentTarget.dataset.index].id
				})
			},
			/**
			 * 渲染患者列表
			 */
			getList:async function(){
				let that = this;
				let res = await that.$request.post('suggest/suggestList',{"curPage":1,'pageSize':10});
				if(res.status==0 && res.data!=''){
					let data = res.data;
					console.log('我是data',data); 
					that.list=data;
				}
			}
		}
	};
</script>

<style lang="scss">
	.topbut {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		background-color: #FFFFFF;
		z-index: 1;
	}


	//每张卡片的样式
	.list_view {
		margin: 20rpx 28rpx 0 28rpx;
		padding: 35rpx 40rpx;
		background-color: #FFFFFF;
		box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.04);
		border-radius: 12px;
		display: flex;
		font-size: 26rpx;
	}
</style>
