jyio/nuVistA
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Compare commits

base: jyio:d08f76ec99a508272dc358858b0e3e963c813147
Branches Tags
jyio:main
...
compare: jyio:ffc2d4c6fa2e2f4c69dc5f4661c6e26f6f146409
Branches Tags
jyio:main

5 Commits
d08f76ec99 ... ffc2d4c6fa

Author SHA1 Message Date
inportb
ffc2d4c6fa Non-anchoring bottom element 2023-05-28 21:15:56 -04:00
inportb
4b9d27b553 Dynamic layout for document display 2023-05-28 21:14:10 -04:00
inportb
f011b88bf4 Fix list group item styling 2023-05-28 20:51:40 -04:00
inportb
6fcd3825c8 Conservative lookahead in reportloader_chunk 2023-05-28 20:17:27 -04:00
inportb
cdbcc51927 More selective scroll detection 2023-05-27 09:39:56 -04:00
2 changed files with 38 additions and 19 deletions
Show Stats Expand all files Collapse all files

39
htdocs/RoutePatientDocuments.vue
View File

@ -2,12 +2,12 @@
<Subtitle value="Documents" />
<Subtitle :value="patient_info.name" />
<div class="row">
<div class="selector col-12 col-xl-4">
<div class="selector col-12" :class="{ 'col-xl-4': selection_text }">
<div class="card mb-3 shadow">
<div class="card-header"><template v-if="resultset.length > 0">{{resultset.length}}<template v-if="has_more">+</template></template><template v-else-if="is_loading">Loading</template><template v-else>No</template> record{{resultset.length == 1 ? '' : 's'}}</div>
<ul class="scroller list-group list-group-flush" ref="scroller">
<ul class="scroller list-group list-group-flush" :class="{ 'list-skinny': selection_text }" ref="scroller">
<router-link v-for="item in resultset" :to="'/patient/' + patient_dfn + '/document/' + item.IEN" replace custom v-slot="{ navigate, href }">
<li :key="item" class="record" :class="{ 'active': selection == item.IEN }" :title="datetimestring(strptime_vista(item.time)) + '\n' + item.title + '\n' + item.location + '\n' + item.author.byline" @click="navigate">
<li :key="item" class="record list-group-item" :class="{ 'active': selection == item.IEN }" :title="datetimestring(strptime_vista(item.time)) + '\n' + item.title + '\n' + item.location + '\n' + item.author.byline" @click="navigate">
<div class="row">
<div class="cell col-4"><router-link :to="href" replace>{{datestring(strptime_vista(item.time))}}</router-link></div>
<div class="cell col-8">{{item.title}}</div>
@ -16,13 +16,16 @@
</div>
</li>
</router-link>
<li ref="bottom" />
<li class="bottom list-group-item" ref="bottom" />
</ul>
</div>
</div>
<div v-if="selection_text" class="col-12 col-xl-8">
<div class="card mb-3 shadow">
<div class="card-header">{{doctitle(selection_text) || 'Document'}}</div>
<div class="card-header d-flex justify-content-between align-items-center">
<span>{{doctitle(selection_text) || 'Document'}}</span>
<router-link class="close" :to="'/patient/' + patient_dfn + '/document'" replace>❌</router-link>
</div>
<div class="detail card-body">{{selection_text}}</div>
</div>
</div>
@ -35,7 +38,7 @@
top: 1.15rem;
z-index: 1;
}
ul.scroller {
ul.scroller.list-skinny {
max-height: 25vh;
overflow-y: auto;
}
@ -54,11 +57,18 @@
color: #fff;
background-color: #0d6efd;
}
li.bottom {
overflow-anchor: none;
}
div.cell {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
a.close {
cursor: default;
text-decoration: none;
}
div.detail {
font-family: monospace;
white-space: pre-wrap;
@ -67,7 +77,7 @@
div.selector {
position: static;
}
ul.scroller {
ul.scroller.list-skinny {
max-height: 75vh;
}
div.cell.secondary {
@ -105,7 +115,8 @@
resultset: [],
selection: null,
selection_text: null,
observer_bottom: null
observer_scroller: null,
observer_viewport: null
};
},
watch: {
@ -164,9 +175,6 @@
} finally {
this.is_loading = false;
}
},
handle_bottom([entry]) {
if((entry.isIntersecting) && (this.has_more) && (!this.is_loading)) this.load_more();
}
},
created() {
@ -189,11 +197,14 @@
);
},
mounted() {
this.observer_bottom = new IntersectionObserver(this.handle_bottom, { root: this.$refs.scroller, rootMargin: '25%' });
this.observer_bottom.observe(this.$refs.bottom);
this.observer_scroller = new IntersectionObserver(([entry]) => { if((entry.isIntersecting) && (this.selection_text) && (this.has_more) && (!this.is_loading)) this.load_more(); }, { root: this.$refs.scroller, rootMargin: '25%' });
this.observer_scroller.observe(this.$refs.bottom);
this.observer_viewport = new IntersectionObserver(([entry]) => { if((entry.isIntersecting) && (!this.selection_text) && (this.has_more) && (!this.is_loading)) this.load_more(); }, { rootMargin: '25%' });
this.observer_viewport.observe(this.$refs.bottom);
},
destroyed() {
if(this.observer_bottom) this.observer_bottom.disconnect();
if(this.observer_viewport) this.observer_viewport.disconnect();
if(this.observer_scroller) this.observer_scroller.disconnect();
}
};
</script>

18
htdocs/RoutePatientReports.vue
View File

@ -82,6 +82,9 @@
color: #fff;
background-color: #0d6efd;
}
li.bottom {
overflow-anchor: none;
}
li.bottom button {
width: 100%;
}
@ -292,7 +295,13 @@
}
function data_endtime(data) {
for(var i = data.length - 1; i >= 0; --i) if((data[i].time) && (!isNaN(data[i].time))) return data[i].time;
for(var i = data.length - 1, time; i >= 0; --i) if((time = data[i].time) && (!isNaN(time))) return time;
}
function data_endtime_conservative(data) {
var dt_end = data_endtime(data);
if(dt_end) for(var i = data.length - 1, time; i >= 0; --i) if((time = data[i].time) && (time > dt_end)) return time;
return dt_end;
}
function data_interval(data) {
@ -388,8 +397,7 @@
} else var res = [];
if(hasmore) { // lookahead
var batch = (await client.ORWRP_REPORT_TEXT_LONGCACHE(dfn, rpt_id, '', SZ_RANGE, '', -1, cursor.toFixed(9))).map(fn_map).sort((a, b) => b.time - a.time);
res.dt_next = data_endtime(batch);
if(res.dt_next) res.next = strftime_vista(res.dt_next);
if(res.dt_next = (batch.length >= SZ_WINDOW ? data_endtime_conservative : data_endtime)(batch)) res.next = strftime_vista(res.dt_next);
}
if((!res.dt_next) && (cursor) && (data.length > 0) && ((res.length < 1) || (res[res.length - 1] !== data[data.length - 1]))) res.dt_next = strptime_vista(res.next = cursor);
return res;
@ -532,9 +540,9 @@
);
},
mounted() {
this.observer_scroller = new IntersectionObserver(() => { if((this.date_next) && (!this.query.replace(/^\s+|\s+$/g, '')) && (this.selection)) this.date_begin = this.date_next; }, { root: this.$refs.scroller, rootMargin: '25%' });
this.observer_scroller = new IntersectionObserver(([entry]) => { if((entry.isIntersecting) && (this.selection) && (this.date_next) && (!this.is_loading) && (!this.query.replace(/^\s+|\s+$/g, ''))) this.date_begin = this.date_next; }, { root: this.$refs.scroller, rootMargin: '25%' });
this.observer_scroller.observe(this.$refs.bottom);
this.observer_viewport = new IntersectionObserver(() => { if((this.date_next) && (!this.query.replace(/^\s+|\s+$/g, '')) && (!this.selection)) this.date_begin = this.date_next; }, { rootMargin: '25%' });
this.observer_viewport = new IntersectionObserver(([entry]) => { if((entry.isIntersecting) && (!this.selection) && (this.date_next) && (!this.is_loading) && (!this.query.replace(/^\s+|\s+$/g, ''))) this.date_begin = this.date_next; }, { rootMargin: '25%' });
this.observer_viewport.observe(this.$refs.bottom);
},
destroyed() {