97 lines
3.2 KiB
Vue
97 lines
3.2 KiB
Vue
<template>
|
|
<div>
|
|
<v-row>
|
|
<v-col cols="12">
|
|
<v-container class="bg-white rounded-lg">
|
|
|
|
<v-data-table
|
|
:headers="headers"
|
|
:items="xpatients"
|
|
return-object
|
|
hide-default-footer
|
|
>
|
|
<template v-slot:top>
|
|
<v-toolbar flat class="bg-secondary-lighten">
|
|
<v-toolbar-title>{{ $t('message.toolbalTitle') }}</v-toolbar-title>
|
|
</v-toolbar>
|
|
</template>
|
|
|
|
<template v-slot:item="{ item }">
|
|
<tr>
|
|
<td v-bind:class="{'blue-lighten-5':isSelected(item)}" @click="selectMe(item)">
|
|
<div>
|
|
<p class="mt-2 mb-2">{{ item.noreg }}</p>
|
|
<p class="mb-2" >
|
|
<v-chip label size="small">
|
|
{{ item.orderdate }}
|
|
</v-chip>
|
|
</p>
|
|
</div>
|
|
</td>
|
|
<td v-bind:class="{'blue-lighten-5':isSelected(item)}" @click="selectMe(item)">
|
|
<p>{{ item.name }}</p>
|
|
</td>
|
|
</tr>
|
|
</template>
|
|
</v-data-table>
|
|
</v-container>
|
|
</v-col>
|
|
</v-row>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
</style>
|
|
|
|
<script type="module">
|
|
export default {
|
|
name: "ListPatient",
|
|
data() {
|
|
return {
|
|
headers: [
|
|
{
|
|
align: 'start',
|
|
key: 'name',
|
|
sortable: false,
|
|
width: "50%",
|
|
title: this.$t('message.table.noreg'),
|
|
class: "font-weight-bold",
|
|
},
|
|
{
|
|
align: 'start',
|
|
key: 'name',
|
|
sortable: false,
|
|
width: "50%",
|
|
title: this.$t('message.table.name'),
|
|
class: "font-weight-bold",
|
|
},
|
|
],
|
|
};
|
|
},
|
|
computed: {
|
|
xpatients() {
|
|
return this.$store.state.entry.patients
|
|
},
|
|
selected_patient: {
|
|
get() {
|
|
return this.$store.state.entry.selected_patient
|
|
},
|
|
set(val) {
|
|
this.$store.commit("entry/setSelectedPatient", val)
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
isSelected(p) {
|
|
return p.id == this.$store.state.entry.selected_patient.id
|
|
},
|
|
selectMe(c) {
|
|
console.log(c)
|
|
}
|
|
},
|
|
wacth: {
|
|
|
|
}
|
|
}
|
|
</script> |