65 lines
2.1 KiB
Vue
65 lines
2.1 KiB
Vue
<template>
|
|
<ul class="nav nav-tabs">
|
|
<li v-if="label" class="nav-link disabled">{{label}}</li>
|
|
<li class="nav-item"><span class="nav-link" :class="{ active: view_new }" @click="view_new = true">Location</span></li>
|
|
<li v-if="view_new" class="nav-item d-flex justify-content-between align-items-center">
|
|
<div class="input-group">
|
|
<span class="input-group-text">🔎</span>
|
|
<input class="form-control" placeholder="Filter..." v-model="query" />
|
|
</div>
|
|
</li>
|
|
<li class="nav-item"><span class="nav-link" :class="{ active: !view_new }" @click="view_new = false">Encounter</span></li>
|
|
<li v-if="!view_new" class="nav-item d-flex justify-content-between align-items-center"><DateRangePicker v-else range="6M" direction="-1" v-model:date="visits_date_end" v-model:date_end="visits_date_begin" /></li>
|
|
</ul>
|
|
<div class="scroller">
|
|
<ViewLocationLookupNew v-if="view_new" :client="client" v-model:query="query" :modelValue="x_modelValue ? x_modelValue.IEN : null" @update:modelValue="x_modelValue = { IEN: $event }" />
|
|
<ViewLocationLookupExisting v-else :client="client" :dfn="dfn" :date_begin="visits_date_begin" :date_end="visits_date_end" v-model="x_modelValue" />
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
span.nav-link {
|
|
cursor: pointer;
|
|
}
|
|
div.scroller {
|
|
max-height: 25vh;
|
|
overflow-y: auto;
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
import DateRangePicker from './DateRangePicker.vue';
|
|
import ViewLocationLookupNew from './ViewLocationLookupNew.vue';
|
|
import ViewLocationLookupExisting from './ViewLocationLookupExisting.vue';
|
|
|
|
const now = new Date();
|
|
|
|
export default {
|
|
components: {
|
|
DateRangePicker, ViewLocationLookupNew, ViewLocationLookupExisting
|
|
},
|
|
props: {
|
|
client: Object,
|
|
dfn: String,
|
|
label: String,
|
|
modelValue: Object
|
|
},
|
|
emits: {
|
|
'update:modelValue': Object
|
|
},
|
|
data() {
|
|
return {
|
|
view_new: false,
|
|
query: '',
|
|
visits_date_begin: now,
|
|
visits_date_end: now,
|
|
x_modelValue: this.modelValue
|
|
};
|
|
},
|
|
watch: {
|
|
modelValue(value) { this.x_modelValue = value; },
|
|
x_modelValue(value) { this.$emit('update:modelValue', value); }
|
|
}
|
|
};
|
|
</script>
|