<template>
	<view style="height: 100%;width: 100%;">
		<view class="v" v-for="item,index in tcTeam" :key='index' :data-index="index">
			<view class="list">
				<!-- 上半部分 -->
				<view style="width: 100%;">
					<view class="flex justify-between align-center bg-white" style="padding: 28rpx;border-radius: 16rpx;">
						<view class="jinxing">
							<text style="display: inline-block;width: 12rpx;height: 12rpx;border-radius: 50%;background-color:#EEAA3F;margin-right: 8rpx;"></text>
							<text v-if="item.status==1">待审核</text>
							<text v-else-if="item.status==2">审核通过</text>
							<text v-else-if="item.status==3">审核拒绝</text>
						</view>
						<text class="phonezi">我的评价</text>
					</view>
				</view>
			</view>
			<!-- 下半部分 -->
			<view style="width: 100%;height: 100%;;border-radius: 15rpx;">
				<view class="flex align-center margin-top-sm">
					<view class="text-lg text-bold margin-left-sm">
						{{item.order.docter.name}}
					</view>
					<view class="text-gray margin-left-sm">
						{{item.order.product_type==1?'电话咨询':'图文咨询'}}
					</view>
					<view class="margin-left-sm">
						<u-rate :count="count" :disabled="true" v-model="item.score"></u-rate>
					</view>
				</view>
				<view style="margin: 30rpx 28rpx 30rpx 28rpx;">
					<text class="evaluate">{{item.content}}</text>
				</view>
				<u-line color="#EFEFEF" />
				<view style="padding: 24rpx 28rpx;font-size: 26rpx;color: #666666;display: flex;justify-content: space-between;align-items: center;">
					<text style="margin-right: 50rpx;">{{item.order.order_sn}}</text>
					<text>{{item.created_at}}</text>
				</view>
			</view>
		</view>
		<u-empty text="暂无数据" :show="show" mode="order" margin-top="250"></u-empty>
		<u-no-network></u-no-network>
		<view class="cu-tabbar-height"></view>
		<view class="cu-tabbar-height"></view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				tcTeam: [],
				pageindex: 1,
				count: 5,
				show: false
			}
		},
		mounted() {
			this.getevaluateList()
		},
		onReachBottom() {
			this.getevaluateList()
		},
		methods: {
			getevaluateList: async function() {
				let res = await this.$request.post("/api/v1/evaluate/evaluateList", {
					page: this.pageindex
				})
				console.log(res)
				if (res.status == 0) {
					if (this.pageindex > res.data.last_page) {
						uni.showToast({
							title: "没有更多了",
							icon: "none"
						})
					} else {
						this.tcTeam = this.tcTeam.concat(res.data.data)
						this.pageindex++
					}
				}
				if (this.tcTeam.length == 0) {
					this.show = true
				} else {
					this.show = false
				}
			}
		}
	}
</script>

<style lang="scss">
	.text_style {
		font-weight: 400;
		margin-left: 15rpx;
		background-color: #E5F5FF;
		color: #0B73B9;
		width: 100rpx;
		height: 28rpx;
		font-size: 20rpx;
		border-radius: 10rpx;
		text-align: center;
		align-items: center;
	}

	.nametaile {
		font-size: 30rpx;
		font-weight: 500;
		color: #333333;
	}

	.textstyle {
		font-size: 26rpx;
		color: #666666;
		font-weight: 400;
	}

	.phonezi {
		width: 160rpx;
		height: 54rpx;
		background: #F6F6F6;
		border-radius: 27rpx;
		font-size: 28rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #666666;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.jinxing {
		height: 30rpx;
		font-size: 30rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #EEAA3F;
		display: flex;
		align-items: center;
	}

	.v {
		margin: 20rpx 28rpx 0rpx 28rpx;
		border-radius: 15rpx;
		box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.08);
		width: auto;
		height: auto;
		background-color: #fbfbfb;
	}

	.list {
		border-radius: 15rpx;
		display: flex;
		width: auto;
		height: auto;
		background-color: #FFFFFF;

		.title {
			width: 100%;
			display: flex;
			// justify-content: center;
			// align-items: center;

			.img {
				width: 68rpx;
				height: 68rpx;
				border-radius: 50%;
				margin-right: 20rpx;
			}

			//文字
			.text {
				height: auto;

				//名字+标签
				.name {
					font-size: 25rpx;
					font-weight: bold;
					display: flex;
					align-items: center;
					margin-bottom: 14rpx;

					.label {
						font-weight: 400;
						margin-right: 15rpx;
						background-color: #E5F5FF;
						color: #0B73B9;
						width: 100rpx;
						height: 28rpx;
						font-size: 20rpx;
						border-radius: 10rpx;
						display: flex;
						justify-content: center;
						align-items: center;
					}
				}

				//科室
				.department {
					font-size: 18rpx;
					color: #666666;

					text {
						margin-right: 15rpx;
					}
				}

				// // 选项 图文电话门诊
				// .option {
				// 	display: flex;

				// 	view {
				// 		background-color: #E4E4E4;
				// 		width: 100rpx;
				// 		height: 48rpx;
				// 		border-radius: 12px;
				// 		margin-right: 15rpx;
				// 		display: flex;
				// 		justify-content: center;
				// 		align-items: center;
				// 	}
				// }
			}
		}

		.score {
			margin: 30rpx 30rpx 30rpx 78rpx;
			width: 100%;
			display: flex;
			background-color: #FFFFFF;
		}



	}

	.evaluate {
		font-size: 26rpx;
		color: #666666;
	}
</style>
