nuVistA/htdocs/ViewOrderDialogLab.vue

162 lines
7.2 KiB
Vue
Raw Normal View History

2023-04-24 23:10:19 -04:00
<template>
<div v-if="options_facility && inputs" class="row">
<div class="col-6">
<div class="mb-3">
<ViewOrderableLookup :client="client" label="Lab tests" xref="S.LAB" :qocall="ien" v-model="inputs.ORDERABLE" />
</div>
</div>
<div class="col-6">
<template v-if="options_test">
<div v-if="(options_test['CollSamp']) && (options_test['CollSamp'].items)" class="form-floating mb-3">
<select class="form-select" v-model="inputs.SAMPLE"><option v-for="item in options_test['CollSamp'].items" :value="item.SampIEN">{{item.SampName}}</option></select>
<label>Collect Sample</label>
</div>
<div v-if="(options_test['Specimens']) && (options_test['Specimens'].items)" class="form-floating mb-3">
<select class="form-select" v-model="inputs.SPECIMEN"><option v-for="item in options_test['Specimens'].items" :value="item.value">{{item.text}}</option></select>
<label>Specimen</label>
</div>
<div v-if="(options_test['Urgencies']) && (options_test['Urgencies'].items)" class="form-floating mb-3">
<select class="form-select" v-model="inputs.URGENCY"><option v-for="item in options_test['Urgencies'].items" :value="item.value">{{item.text}}</option></select>
<label>Urgency</label>
</div>
</template>
</div>
<div class="col-3">
<div class="form-floating mb-3">
<select class="form-select" v-model="inputs.COLLECT"><option v-for="item in options_facility['Collection Types'].items" :value="item.value" :selected="item.default">{{item.text}}</option></select>
<label>Collection Type</label>
</div>
</div>
<div class="col-3">
<div class="mb-3">
<template v-if="(inputs.COLLECT == 'LC') && (options_facility['Lab Collection Times'])">
<Autocomplete label="Lab Collection Time" :items="Object.keys(mapping_START)" v-model="inputs.START" />
</template>
<template v-else-if="(inputs.COLLECT == 'WC') && (options_facility['Ward Collection Times'])">
<Autocomplete label="Ward Collection Time" :items="Object.keys(mapping_START)" v-model="inputs.START" />
</template>
<template v-else-if="(inputs.COLLECT == 'SP') && (options_facility['Send Patient Times'])">
<Autocomplete label="Send Patient Time" :items="Object.keys(mapping_START)" v-model="inputs.START" />
</template>
<template v-else>
<label>Collection Date/Time</label>
<DateTimePicker v-model="inputs.START" />
</template>
</div>
</div>
<div class="col-3">
<div class="form-floating mb-3">
<select class="form-select" v-model="inputs.SCHEDULE"><option v-for="item in options_facility['Schedules'].items" :value="item.value" :selected="item.default">{{item.text}}</option></select>
<label>How Often?</label>
</div>
</div>
<div class="col-3">
<div class="form-floating mb-3" title="Enter a number of days, or an 'X' followed by a number of times.">
<input type="text" class="form-control" placeholder=" " v-model="inputs.DAYS" />
<label>How Long?</label>
</div>
</div>
<div class="col-9">
<div v-if="preview" class="card mb-3" style="background-color: #fdfbd7;"><div class="card-body" style="font-family: monospace; white-space: pre-wrap;">{{preview}}</div></div>
<div v-if="(options_test) && (options_test['CollSamp']) && (options_test['CollSamp'].text)" class="card mb-3" style="background-color: #fdfbd7;"><div class="card-body" style="font-family: monospace; white-space: pre-wrap;">{{options_test['CollSamp'].text}}</div></div>
</div>
<div class="col-3">
<div class="btn-group-vertical mb-3" style="width: 100%;">
<button type="button" class="btn btn-primary" @click="e => $emit('submit', output)">Submit</button>
<button type="button" class="btn btn-danger" @click="e => $emit('cancel')">Cancel</button>
</div>
</div>
</div>
</template>
<script>
import { debounce } from './util.mjs';
import ViewOrderableLookup from './ViewOrderableLookup.vue';
import Autocomplete from './Autocomplete.vue';
import DateTimePicker from './DateTimePicker.vue';
export default {
components: {
ViewOrderableLookup, Autocomplete, DateTimePicker
},
props: {
client: Object,
ien: String,
dlgdef: Object,
bldqrsp: Object,
modelValue: Object
},
emits: [
'submit',
'cancel',
'update:modelValue'
],
data() {
return {
inputs: null,
options_facility: null,
options_test: null
};
},
computed: {
mapping_START() {
if((this.inputs) && (this.inputs.COLLECT) && (this.options_facility)) {
var mapping = this.inputs.COLLECT == 'LC' ? this.options_facility['Lab Collection Times'] : this.inputs.COLLECT == 'WC' ? this.options_facility['Ward Collection Times'] : this.inputs.COLLECT == 'SP' ? this.options_facility['Send Patient Times'] : null;
if((mapping) && (mapping.items)) return mapping.items.reduce((acc, val) => (acc[val.text] = val.value.substring(1), acc), {});
}
},
preview() {
if((this.options_test) && (this.inputs)) {
var res = [], inputs = this.inputs, x;
if(this.options_test['Test Name']) res.push(this.options_test['Test Name'].default);
if((inputs.SAMPLE) && (this.options_test['CollSamp']) && (x = this.options_test['CollSamp'].items.find(x => x.SampIEN == inputs.SAMPLE))) res.push(x.SampName.replace(/^\s+|\s+$/g, ''));
if((inputs.SPECIMEN) && (this.options_test['Specimens']) && (x = this.options_test['Specimens'].items.find(x => x.value == inputs.SPECIMEN))) res.push(x.text.replace(/^\s+|\s+$/g, ''));
if(inputs.COLLECT) res.push(inputs.COLLECT);
return res.join(' ');
}
},
output() {
if((this.dlgdef) && (this.inputs)) {
var inputs = Object.assign({}, this.inputs);
if((this.mapping_START) && (inputs.START) && (this.mapping_START.hasOwnProperty(inputs.START))) inputs.START = this.mapping_START[inputs.START];
return this.dlgdef.reduce((acc, val) => (acc['"' + val.promptIEN + '","1"'] = inputs[val.promptID], acc), {});
}
}
},
created() {
this.$watch(
() => this.client,
async () => {
this.options_facility = this.client ? await this.client.ORWDLR32_DEF(0, 0) : null;
},
{ immediate: true }
);
this.$watch(
() => (this.client, this.ien, this.dlgdef, {}),
async () => {
if((this.client) && (this.ien) && (this.dlgdef) && (this.bldqrsp)) {
this.inputs = this.dlgdef.reduce((acc, val) => (acc[val.promptID] = null, acc), {});
if((this.bldqrsp.ResponseID) && (this.bldqrsp.ResponseID != '0')) {
var loadrsp = await this.client.ORWDX_LOADRSP(this.bldqrsp.ResponseID, 0, 0);
if(loadrsp) Object.assign(this.inputs, loadrsp.reduce((acc, val) => (acc[val.promptID] = val.iValue, acc), {}));
}
} else this.inputs = null;
},
{ immediate: true }
);
this.$watch(
() => (this.client, this.inputs && this.inputs.ORDERABLE, {}),
async () => {
this.options_test = (this.client) && (this.inputs) && (this.inputs.ORDERABLE) ? await this.client.ORWDLR32_LOAD(this.inputs.ORDERABLE) : null;
}
);
this.$watch(
() => { return { dlgdef: this.dlgdef, inputs: this.inputs }; },
debounce(() => this.$emit('update:modelValue', this.output), 100),
{ deep: true }
);
}
};
</script>