<template>
	<view>
		<scroll-view scroll-y class="page">
			<cu-custom bgColor="bg-cyan" :isBack="true"><block slot="backText">返回</block><block slot="content">交接列表</block></cu-custom>
			<view class="cu-bar bg-white solid-bottom">
				<view class="action">
					<text class="cuIcon-title text-green" style="color:#2CC9EA;"></text>
					<text style="color:#B4B4C3;">交接列表</text>
				</view>
			</view>
			<view class="cu-list menu-avatar" style="margin-top:5px;">
				<view class="cu-item" v-for="(value,index) in handDetailsInfo" :key="index">
					<view class="cu-avatar round lg" style="background-image:url(https://lekapi.opmonitor.com/static/image/avatar.png);"></view>
					<view class="content">
						<view class="text-grey text-sm flex" style="">
							<text style="width:100px;">{{value.handName}}</text>
							<text style='margin-left:5%;width:100px;font-family:Montserrat-Regular;'>{{value.type}}</text>
						</view>
						<view class="text-grey text-sm flex">
							<text class="cuIcon-locationfill text-red margin-right-xs"></text>
							<text style="width:90px;">{{value.department}}</text>
							<text style="margin-left:5%;width:100px;font-size: 12px;font-weight:bold;color:red;">{{value.totalWeight}}</text>
						</view>
					</view>
					<view class="action">
						<view class="text-grey text-xs">{{value.handTime}}</view>
					</view>
				</view>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				handDetailsInfo: []
			}
		},
		mounted(){
			// 获取全局变量中的数据
			this.hospital  = getApp().globalData.hospital
			this.sortHospital = getApp().globalData.sortHospital
			this.department = getApp().globalData.department
			this.duty = getApp().globalData.duty
			this.getHandDetailsInfo();
		},
		methods: {
			getHandDetailsInfo(){
				let that = this;
				uni.request({
					url: "https://lekapi.opmonitor.com/?c=app_api&a=getHandDetailsInfo",
					data: {hospital: that.hospital, sortHospital: that.sortHospital, department: that.department, duty: that.duty},
					header: {
						'Content-type': 'application/json'
					},
					success: function(res){
						that.handDetailsInfo = res.data.data
					},
					fail: () => {
						console.info('小程序域名不正确，请检查域名的正确性')
					}
				})
			}
		}
	}
</script>

<style>
	.bg-gradual-pink{
		vertical-align: middle;
		font-size:18px;
		background:linear-gradient(135deg,rgba(45,201,235,1) 0%,rgba(20,210,184,1) 100%);
	}
	
	.cu{
		height:89px;
	}
	
	.page {
		width: 100vw;
		height: 100Vh;
	}
	
	.page.show {
		overflow: hidden;
	}
	
	.cuIcon-locationfill{
		color:#2CC9EA;
	}
</style>
