<template>
	<Subtitle value="Settings" />
	<div class="card mb-3 shadow">
		<div class="card-header">Clinics</div>
		<div class="card-body">
			<ViewResourceLookup :client="client" v-model:selection="selection" />
		</div>
	</div>
</template>

<script>
	import Subtitle from './Subtitle.vue';
	import ViewResourceLookup from './ViewResourceLookup.vue';

	export default {
		components: {
			Subtitle, ViewResourceLookup
		},
		props: {
			client: Object
		},
		data() {
			return {};
		},
		computed: {
			selection: {
				get() { return (this.client) && (this.client.remotestate.resources) ? (this.client.remotestate.resources.split(',').filter(x => x) || []) : [] },
				set(value) { if(this.client) this.client.remotestate.resources = value.join(','); }
			}
		},
	};
</script>
