<template>
	<view class="main">
		<view class="list">
			<view class="item" v-for="(item, index) in list" :key="index" @click="check(item)">
				<view class="title omit">
					<text class="icon check" v-if="item.check" style="color: #4581fb">&#xe6ad;</text>
					<text class="icon check" v-else>&#xe8bb;</text>
					<text>{{ item.name }}</text>
				</view>
			</view>
			<u-empty v-if="list.length == 0" text="暂无患者"></u-empty>
		</view>
		<view class="mfooter">
			<button class="btn" @click="go()" v-if="selected.length > 0">选中{{ selected.length }}人</button>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			list: [],
			selected: []
		};
	},
	onLoad(e) {
		this.getData();
		this.selected = JSON.parse(e.selected) || [];
	},
	methods: {
		getData() {
			this.http.request({
				url: '/work/record/visit/list',
				data: this.param,
				success: (res) => {
					this.list = res.data.data;
					this.list.forEach((item) => {
						item.check = this.selected.some((i) => i.id === item.id);
					});
					this.$forceUpdate();
				}
			});
		},
		check(item) {
			item.check = !item.check;
			this.selected = this.list.filter((item) => item.check);
			this.$forceUpdate();
		},
		go() {
			uni.$emit('selectUser', this.selected);
			uni.navigateBack();
		}
	}
};
</script>

<style lang="scss">
.list {
	background-color: white;
	border-radius: 10px;
	margin-top: -10px;
	.item {
		padding: 16px 12px 16px 12px;
		border-bottom: 1px solid $line;
		overflow: hidden;
		.title {
			font-size: 15px;
			font-weight: bold;
			.check {
				color: #737373;
				font-size: 13px;
				font-weight: normal;
				padding-right: 5px;
			}
		}
	}
}
</style>
