Settings page for clinic selection
This commit is contained in:
parent
15f5acbf52
commit
12a7c584a5
@ -26,6 +26,7 @@
|
|||||||
import RoutePlanner from './RoutePlanner.vue';
|
import RoutePlanner from './RoutePlanner.vue';
|
||||||
import RouteRecall from './RouteRecall.vue';
|
import RouteRecall from './RouteRecall.vue';
|
||||||
import RouteInbox from './RouteInbox.vue';
|
import RouteInbox from './RouteInbox.vue';
|
||||||
|
import RouteSettings from './RouteSettings.vue';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
@ -50,6 +51,7 @@
|
|||||||
{ name: 'Planner', href: '/planner' },
|
{ name: 'Planner', href: '/planner' },
|
||||||
{ name: 'Recall', href: '/recall' },
|
{ name: 'Recall', href: '/recall' },
|
||||||
{ name: 'Inbox', href: '/inbox' },
|
{ name: 'Inbox', href: '/inbox' },
|
||||||
|
{ name: 'Settings', href: '/settings' },
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
@ -72,6 +74,7 @@
|
|||||||
{ path: '/planner', component: RoutePlanner },
|
{ path: '/planner', component: RoutePlanner },
|
||||||
{ path: '/recall', component: RouteRecall },
|
{ path: '/recall', component: RouteRecall },
|
||||||
{ path: '/inbox', component: RouteInbox },
|
{ path: '/inbox', component: RouteInbox },
|
||||||
|
{ path: '/settings', component: RouteSettings },
|
||||||
].forEach(route => this.$root.$router.addRoute(route));
|
].forEach(route => this.$root.$router.addRoute(route));
|
||||||
await this.$root.$router.replace(this.$route);
|
await this.$root.$router.replace(this.$route);
|
||||||
}
|
}
|
||||||
|
@ -1,46 +1,39 @@
|
|||||||
<template>
|
<template>
|
||||||
<Subtitle value="Recall" />
|
<Subtitle value="Recall" />
|
||||||
<div>
|
<div class="card mb-3 shadow">
|
||||||
<div class="card mb-3 shadow">
|
<div class="card-header d-flex justify-content-between align-items-center">
|
||||||
<div class="card-header">Clinics</div>
|
<span>Recall list ({{patients_lost.length + patients_outstanding.length}})</span>
|
||||||
<div class="card-body">
|
<router-link to="/settings">Select clinics<template v-if="selection.length > 0"> ({{selection.length}})</template></router-link>
|
||||||
<ViewResourceLookup :client="client" v-model:selection="selection" />
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="card mb-3 shadow">
|
<div class="card-body">
|
||||||
<div class="card-header d-flex justify-content-between align-items-center">
|
<table class="table" style="font-family: monospace;" v-if="patients_lost && patients_lost.length > 0">
|
||||||
<span>Recall list ({{patients_lost.length + patients_outstanding.length}})</span>
|
<thead>
|
||||||
</div>
|
<tr><th>Lost ({{patients_lost.length}})</th><th>Last appt</th><th>Clinic</th><th>Days</th></tr>
|
||||||
<div class="card-body">
|
</thead>
|
||||||
<table class="table" style="font-family: monospace;" v-if="patients_lost && patients_lost.length > 0">
|
<tbody>
|
||||||
<thead>
|
<tr v-for="row in patients_lost" :style="{ backgroundColor: strHashHSL(row.Clinic, '90%') }">
|
||||||
<tr><th>Lost ({{patients_lost.length}})</th><th>Last appt</th><th>Clinic</th><th>Days</th></tr>
|
<td v-if="production"><router-link :to="'/patient/$' + row.key">{{row.Name}} <span :title="row.key">{{row.key.slice(-4)}}</span></router-link></td>
|
||||||
</thead>
|
<td v-else><router-link :title="strtr_unscramble(row.Name)" :to="'/patient/$' + row.Name.charAt(0) + row.key.slice(-4) + '?name=' + row.Name">{{row.Name}} <span :title="row.key">{{row.key.slice(-4)}}</span></router-link></td>
|
||||||
<tbody>
|
<td>{{datefmt(row.TimeLast)}} {{dow[row.TimeLast.getDay()]}}</td>
|
||||||
<tr v-for="row in patients_lost" :style="{ backgroundColor: strHashHSL(row.Clinic, '90%') }">
|
<td>{{row.Clinic}}</td>
|
||||||
<td v-if="production"><router-link :to="'/patient/$' + row.key">{{row.Name}} <span :title="row.key">{{row.key.slice(-4)}}</span></router-link></td>
|
<td>{{Math.round(row.TimeLastDiff/86400000)}}</td>
|
||||||
<td v-else><router-link :title="strtr_unscramble(row.Name)" :to="'/patient/$' + row.Name.charAt(0) + row.key.slice(-4) + '?name=' + row.Name">{{row.Name}} <span :title="row.key">{{row.key.slice(-4)}}</span></router-link></td>
|
</tr>
|
||||||
<td>{{datefmt(row.TimeLast)}} {{dow[row.TimeLast.getDay()]}}</td>
|
</tbody>
|
||||||
<td>{{row.Clinic}}</td>
|
</table>
|
||||||
<td>{{Math.round(row.TimeLastDiff/86400000)}}</td>
|
<table class="table" style="font-family: monospace;" v-if="patients_outstanding && patients_outstanding.length > 0">
|
||||||
</tr>
|
<thead>
|
||||||
</tbody>
|
<tr><th>Outstanding ({{patients_outstanding.length}})</th><th>Next appt</th><th>Clinic</th><th>Days</th></tr>
|
||||||
</table>
|
</thead>
|
||||||
<table class="table" style="font-family: monospace;" v-if="patients_outstanding && patients_outstanding.length > 0">
|
<tbody>
|
||||||
<thead>
|
<tr v-for="row in patients_outstanding" :style="{ backgroundColor: strHashHSL(row.Clinic, '90%') }">
|
||||||
<tr><th>Outstanding ({{patients_outstanding.length}})</th><th>Next appt</th><th>Clinic</th><th>Days</th></tr>
|
<td v-if="production"><router-link :to="'/patient/$' + row.key">{{row.Name}} <span :title="row.key">{{row.key.slice(-4)}}</span></router-link></td>
|
||||||
</thead>
|
<td v-else><router-link :title="strtr_unscramble(row.Name)" :to="'/patient/$' + row.Name.charAt(0) + row.key.slice(-4) + '?name=' + row.Name">{{row.Name}} <span :title="row.key">{{row.key.slice(-4)}}</span></router-link></td>
|
||||||
<tbody>
|
<td>{{datefmt(row.TimeNext)}} {{dow[row.TimeNext.getDay()]}}</td>
|
||||||
<tr v-for="row in patients_outstanding" :style="{ backgroundColor: strHashHSL(row.Clinic, '90%') }">
|
<td>{{row.Clinic}}</td>
|
||||||
<td v-if="production"><router-link :to="'/patient/$' + row.key">{{row.Name}} <span :title="row.key">{{row.key.slice(-4)}}</span></router-link></td>
|
<td>{{Math.round(row.TimeNextDiff/86400000)}}</td>
|
||||||
<td v-else><router-link :title="strtr_unscramble(row.Name)" :to="'/patient/$' + row.Name.charAt(0) + row.key.slice(-4) + '?name=' + row.Name">{{row.Name}} <span :title="row.key">{{row.key.slice(-4)}}</span></router-link></td>
|
</tr>
|
||||||
<td>{{datefmt(row.TimeNext)}} {{dow[row.TimeNext.getDay()]}}</td>
|
</tbody>
|
||||||
<td>{{row.Clinic}}</td>
|
</table>
|
||||||
<td>{{Math.round(row.TimeNextDiff/86400000)}}</td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@ -49,7 +42,6 @@
|
|||||||
import { groupByArray, strtr_unscramble, strHashHSL, strftime_vista, debounce } from './util.mjs';
|
import { groupByArray, strtr_unscramble, strHashHSL, strftime_vista, debounce } from './util.mjs';
|
||||||
|
|
||||||
import Subtitle from './Subtitle.vue';
|
import Subtitle from './Subtitle.vue';
|
||||||
import ViewResourceLookup from './ViewResourceLookup.vue';
|
|
||||||
|
|
||||||
function dateonly(date) {
|
function dateonly(date) {
|
||||||
return new Date(date.getFullYear(), date.getMonth(), date.getDate());
|
return new Date(date.getFullYear(), date.getMonth(), date.getDate());
|
||||||
@ -57,7 +49,7 @@
|
|||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
Subtitle, ViewResourceLookup
|
Subtitle
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
client: Object
|
client: Object
|
||||||
@ -73,10 +65,7 @@
|
|||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
selection: {
|
selection() { return (this.client) && (this.client.remotestate.resources) ? (this.client.remotestate.resources.split(',').filter(x => x) || []) : [] },
|
||||||
get() { return this.client.remotestate.resources ? (this.client.remotestate.resources.split(',').filter(x => x) || []) : [] },
|
|
||||||
set(value) { this.client.remotestate.resources = value.join(','); }
|
|
||||||
},
|
|
||||||
patients_lost() {
|
patients_lost() {
|
||||||
return this.patients.filter(x => x.TimeLastDiff >= 0).sort((a, b) => b.TimeLastDiff - a.TimeLastDiff);
|
return this.patients.filter(x => x.TimeLastDiff >= 0).sort((a, b) => b.TimeLastDiff - a.TimeLastDiff);
|
||||||
},
|
},
|
||||||
|
@ -1,27 +1,19 @@
|
|||||||
<template>
|
<template>
|
||||||
<Subtitle value="Schedule" />
|
<Subtitle value="Schedule" />
|
||||||
<div>
|
<div class="card mb-3 shadow">
|
||||||
<div class="card mb-3 shadow">
|
<div class="card-header d-flex justify-content-between align-items-center">
|
||||||
<div class="card-header">Clinics</div>
|
<span>Schedule</span>
|
||||||
<div class="card-body">
|
<router-link to="/settings">Select clinics<template v-if="selection.length > 0"> ({{selection.length}})</template></router-link>
|
||||||
<ViewResourceLookup :client="client" v-model:selection="selection" />
|
<DateRangePicker range="1D" direction="+1" v-model:date="date" v-model:date_end="date_end" />
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="card mb-3 shadow">
|
<div class="card-body">
|
||||||
<div class="card-header d-flex justify-content-between align-items-center">
|
<ViewSchedule :client="client" :selection="selection" :date_begin="date" :date_end="new Date(date_end.getTime() - 1)" />
|
||||||
<span>Schedule</span>
|
|
||||||
<DateRangePicker range="1D" direction="+1" v-model:date="date" v-model:date_end="date_end" />
|
|
||||||
</div>
|
|
||||||
<div class="card-body">
|
|
||||||
<ViewSchedule :client="client" :selection="selection" :date_begin="date" :date_end="new Date(date_end.getTime() - 1)" />
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import Subtitle from './Subtitle.vue';
|
import Subtitle from './Subtitle.vue';
|
||||||
import ViewResourceLookup from './ViewResourceLookup.vue';
|
|
||||||
import DateRangePicker from './DateRangePicker.vue';
|
import DateRangePicker from './DateRangePicker.vue';
|
||||||
import ViewSchedule from './ViewSchedule.vue';
|
import ViewSchedule from './ViewSchedule.vue';
|
||||||
|
|
||||||
@ -31,7 +23,7 @@
|
|||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
Subtitle, ViewResourceLookup, DateRangePicker, ViewSchedule
|
Subtitle, DateRangePicker, ViewSchedule
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
client: Object
|
client: Object
|
||||||
@ -43,10 +35,7 @@
|
|||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
selection: {
|
selection() { return (this.client) && (this.client.remotestate.resources) ? (this.client.remotestate.resources.split(',').filter(x => x) || []) : [] }
|
||||||
get() { return this.client.remotestate.resources ? (this.client.remotestate.resources.split(',').filter(x => x) || []) : [] },
|
|
||||||
set(value) { this.client.remotestate.resources = value.join(','); }
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
32
htdocs/RouteSettings.vue
Normal file
32
htdocs/RouteSettings.vue
Normal file
@ -0,0 +1,32 @@
|
|||||||
|
<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>
|
Loading…
Reference in New Issue
Block a user