<template>
	<Subtitle value="Orders" />
	<Subtitle :value="patient_info.name" />
	<div class="card mb-3 shadow">
		<div class="card-header">Order entry</div>
		<div class="card-body"><ViewOrderMenu :client="client" :dfn="patient_dfn" /></div>
	</div>
	<div class="card mb-3 shadow">
		<div class="card-header d-flex justify-content-between align-items-center">
			<span>Order view</span>
			<OrderFilterPicker :client="client" v-model="orders_filter" />
			<DateRangePicker range="6M" direction="-1" v-model:date="orders_date" v-model:date_end="orders_date_begin" />
		</div>
		<div class="card-body"><ViewOrders :client="client" :dfn="patient_dfn" :filter="orders_filter" :date_begin="orders_date_begin" :date_end="orders_date" /></div>
	</div>
</template>

<script>
	import Subtitle from './Subtitle.vue';
	import DateRangePicker from './DateRangePicker.vue';
	import OrderFilterPicker from './OrderFilterPicker.vue';
	import ViewOrderMenu from './ViewOrderMenu.vue';
	import ViewOrders from './ViewOrders.vue';

	var now = new Date();

	export default {
		components: {
			Subtitle, DateRangePicker, OrderFilterPicker, ViewOrderMenu, ViewOrders
		},
		props: {
			client: Object,
			sensitive: Boolean,
			patient_dfn: String,
			patient_info: Object
		},
		data() {
			return {
				orders_filter: 2,
				orders_date: now,
				orders_date_begin: now
			};
		}
	};
</script>
