andy/westone-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix slicing result entry

Browse Source
This commit is contained in:
Hanan Askarim
2024-08-19 15:44:22 +07:00
parent b3ad260791
commit 08e181f3ce
4 changed files with 293 additions and 298 deletions
Download Patch File Download Diff File Expand all files Collapse all files

252
result-entry/components/detailPatient.vue
View File

@@ -1,136 +1,138 @@
<template> <template>
<div> <div>
<v-row> <v-container class="bg-white rounded-lg" fluid>
<v-col cols="12">
<v-container class="bg-white rounded-lg">
<v-row class="pb-5"> <v-row>
<v-col cols="2"> <v-col cols="2">
<v-menu <v-menu
v-model="menu" v-model="menu"
:close-on-content-click="false" :close-on-content-click="false"
transition="scale-transition" transition="scale-transition"
offset-y offset-y
min-width="auto" min-width="auto"
max-width="290px" max-width="290px"
>
<template v-slot:activator="{ props }">
<v-text-field
:model-value="formatDate()"
label="Tanggal Mulai"
prepend-inner-icon="mdi-calendar"
hide-details
readonly
variant="outlined"
v-bind="props"
></v-text-field>
</template>
<v-date-picker
hide-header
show-adjacent-months
rounded="lg"
color="primary"
v-model="date"
@update:modelValue="menu=false"
></v-date-picker>
</v-menu>
</v-col>
<v-col cols="4">
<v-text-field
label="No Reg / Nama / Jenis Kelamin"
variant="outlined"
hide-details
></v-text-field>
</v-col>
<v-col cols="3">
<v-text-field
label="DOB / Umur"
variant="outlined"
hide-details
></v-text-field>
</v-col>
<v-col cols="3">
<v-text-field
label="Pengirim"
variant="outlined"
hide-details
></v-text-field>
</v-col>
</v-row>
<v-data-table
:headers="headers"
:items="xdetails"
return-object
hide-default-footer
> >
<template v-slot:item="{ item }"> <template v-slot:activator="{ props }">
<tr> <v-text-field
<td class="text-left" v-if="item.is_result == 'N'" colspan="8"> :model-value="formatDate()"
<p class="font-weight-medium">{{ item.t_testname }}</p> label="Tanggal Mulai"
</td> prepend-inner-icon="mdi-calendar"
<td class="text-left" v-if="item.is_result == 'Y'"> hide-details
<p class="font-weight-medium">{{ item.t_testname }}</p> readonly
</td> variant="outlined"
<td class="text-left" v-if="item.is_result == 'Y'"> v-bind="props"
<div class="pt-3 pb-3"> ></v-text-field>
<v-text-field
density="compact"
label=""
variant="outlined"
hide-details
auto-grow
></v-text-field>
</div>
</td>
<td class="text-left" v-if="item.is_result == 'Y'">
<p>{{ item.result_flag }}</p>
</td>
<td class="text-left" v-if="item.is_result == 'Y'">
{{ item.normal_note }}
</td>
<td class="text-left" v-if="item.is_result == 'Y'">
{{ item.unit_name }}
</td>
<td class="text-left" v-if="item.is_result == 'Y'">
<div class="d-flex justify-space-between">
<div>
{{ item.methode_name }}
</div>
<v-btn
variant="text"
small
color="primary"
class="bg-primary-lightens ma-0 float-left">
<iconify-icon
style="font-size: 2rem;"
icon="fluent:edit-20-regular"
></iconify-icon>
</v-btn>
</div>
</td>
<td class="text-left" v-if="item.is_result == 'Y'">
<div class="pt-3 pb-3">
<v-text-field
density="compact"
label=""
variant="outlined"
hide-details
auto-grow
></v-text-field>
</div>
</td>
</tr>
</template> </template>
</v-data-table> <v-date-picker
hide-header
show-adjacent-months
rounded="lg"
color="primary"
v-model="date"
@update:modelValue="menu=false"
></v-date-picker>
</v-menu>
</v-col>
<v-col cols="5">
<v-text-field
label="No Reg / Nama / Jenis Kelamin"
variant="outlined"
hide-details
></v-text-field>
</v-col>
<v-col cols="2.5">
<v-text-field
label="DOB / Umur"
variant="outlined"
hide-details
></v-text-field>
</v-col>
<v-col cols="2.5">
<v-text-field
label="Pengirim"
variant="outlined"
hide-details
></v-text-field>
</v-col>
</v-row>
</v-container> <v-data-table
</v-col> :headers="headers"
</v-row> :items="xdetails"
return-object
hide-default-footer
class="pt-5"
>
<template v-slot:item="{ item }">
<tr>
<td class="text-left" v-if="item.is_result == 'N'" colspan="8">
<p class="font-weight-medium">{{ item.t_testname }}</p>
</td>
<td class="text-left" v-if="item.is_result == 'Y'">
<p class="font-weight-medium">{{ item.t_testname }}</p>
</td>
<td class="text-left" v-if="item.is_result == 'Y'">
<div class="pt-3 pb-3">
<v-text-field
density="compact"
label=""
variant="outlined"
hide-details
auto-grow
></v-text-field>
</div>
</td>
<td class="text-left" v-if="item.is_result == 'Y'">
<p>{{ item.result_flag }}</p>
</td>
<td class="text-left" v-if="item.is_result == 'Y'">
{{ item.normal_note }}
</td>
<td class="text-left" v-if="item.is_result == 'Y'">
{{ item.unit_name }}
</td>
<td class="text-left" v-if="item.is_result == 'Y'">
<div class="d-flex justify-space-between align-center">
<div>
{{ item.methode_name }}
</div>
<v-btn
variant="text"
small
color="primary"
class="bg-primary-lightens ma-0 float-left">
<iconify-icon
style="font-size: 1.5rem;"
icon="fluent:edit-20-regular"
></iconify-icon>
</v-btn>
</div>
</td>
<td class="text-left" v-if="item.is_result == 'Y'">
<div class="pt-3 pb-3">
<v-text-field
density="compact"
label=""
variant="outlined"
hide-details
auto-grow
></v-text-field>
</div>
</td>
</tr>
</template>
</v-data-table>
</v-container>
</div> </div>
</template> </template>
<style scoped> <style scoped>
.v-table .v-table__wrapper > table > tbody > tr:not(:last-child) > td,
.v-table .v-table__wrapper > table > tbody > tr:not(:last-child) > th,
.v-table .v-table__wrapper > table > thead > tr > th {
border-bottom: dashed 1px #EEEEEE;
}
</style> </style>
<script type="module"> <script type="module">
@@ -168,7 +170,7 @@
align: 'start', align: 'start',
key: 'name', key: 'name',
sortable: false, sortable: false,
width: "15%", width: "10%",
title: "NILAI NORMAL", title: "NILAI NORMAL",
class: "bg-secondary-lighten font-weight-bold", class: "bg-secondary-lighten font-weight-bold",
}, },
@@ -184,7 +186,7 @@
align: 'start', align: 'start',
key: 'name', key: 'name',
sortable: false, sortable: false,
width: "15%", width: "20%",
title: "METODE", title: "METODE",
class: "bg-secondary-lighten font-weight-bold", class: "bg-secondary-lighten font-weight-bold",
}, },

75
result-entry/components/listPatient.vue
View File

@@ -1,47 +1,46 @@
<template> <template>
<div> <div>
<v-row> <v-container class="bg-white rounded-lg" fluid>
<v-col cols="12">
<v-container class="bg-white rounded-lg">
<v-data-table <v-data-table
:headers="headers" :headers="headers"
:items="xpatients" :items="xpatients"
return-object return-object
hide-default-footer hide-default-footer
> class="row-pointer"
<template v-slot:top> >
<v-toolbar flat class="bg-secondary-lighten"> <template v-slot:top>
<v-toolbar-title>{{ $t('message.toolbalTitle') }}</v-toolbar-title> <v-toolbar flat class="bg-secondary-lighten rounded-lg">
</v-toolbar> <v-toolbar-title class="text-black font-weight-bold">{{ $t('message.toolbalTitle') }}</v-toolbar-title>
</template> </v-toolbar>
</template>
<template v-slot:item="{ item }"> <template v-slot:item="{ item }">
<tr> <tr v-bind:class="{'bg-primary-lighten':isSelected(item)}" @click="selectMe(item)">
<td v-bind:class="{'blue-lighten-5':isSelected(item)}" @click="selectMe(item)"> <td>
<div> <div>
<p class="mt-2 mb-2">{{ item.noreg }}</p> <p class="mt-2 mb-2">{{ item.noreg }}</p>
<p class="mb-2" > <p class="mb-2" >
<v-chip label size="small"> <v-chip label size="small">
{{ item.orderdate }} {{ item.orderdate }}
</v-chip> </v-chip>
</p> </p>
</div> </div>
</td> </td>
<td v-bind:class="{'blue-lighten-5':isSelected(item)}" @click="selectMe(item)"> <td>
<p>{{ item.name }}</p> <p>{{ item.name }}</p>
</td> </td>
</tr> </tr>
</template> </template>
</v-data-table> </v-data-table>
</v-container> </v-container>
</v-col>
</v-row>
</div> </div>
</template> </template>
<style scoped> <style scoped>
.row-pointer >>> tbody tr :hover {
cursor: pointer;
}
</style> </style>
<script type="module"> <script type="module">
@@ -86,8 +85,8 @@
isSelected(p) { isSelected(p) {
return p.id == this.$store.state.entry.selected_patient.id return p.id == this.$store.state.entry.selected_patient.id
}, },
selectMe(c) { selectMe(data) {
console.log(c) this.$store.commit("entry/setSelectedPatient", data)
} }
}, },
wacth: { wacth: {

8
result-entry/components/mainEntry.vue
View File

@@ -3,14 +3,12 @@
<one-navbar></one-navbar> <one-navbar></one-navbar>
<v-main> <v-main>
<div class="pa-5 bg-primary-lighten ml-2 rounded-xl h-100"> <div class="pa-5 bg-primary-lighten ml-2 rounded-xl h-100">
<search-component></search-component>
<v-row> <v-row>
<v-col cols="12" md="12" sm="12" xs="12"> <v-col cols="12" md="3" sm="12" xs="12" class="mt-5">
<search-component></search-component>
</v-col>
<v-col cols="12" md="4" sm="12" xs="12">
<list-patient-component></list-patient-component> <list-patient-component></list-patient-component>
</v-col> </v-col>
<v-col cols="12" md="8" sm="12" xs="12"> <v-col cols="12" md="9" sm="12" xs="12" class="mt-5">
<detail-patient-component></detail-patient-component> <detail-patient-component></detail-patient-component>
</v-col> </v-col>
</v-row> </v-row>

256
result-entry/components/searchPatient.vue
View File

@@ -1,143 +1,139 @@
<template> <template>
<div> <div>
<v-row> <v-container class="bg-white rounded-lg" fluid>
<v-col cols="12"> <v-row>
<v-card class="bg-white rounded-lg pa-5"> <v-col cols="3">
<v-row> <div class="d-flex align-center ga-2">
<v-col cols="2"> <v-menu
<v-menu v-model="menuStartDate"
v-model="menuStartDate" :close-on-content-click="false"
:close-on-content-click="false" transition="scale-transition"
transition="scale-transition" offset-y
offset-y min-width="auto"
min-width="auto" max-width="290px"
max-width="290px" >
> <template v-slot:activator="{ props }">
<template v-slot:activator="{ props }"> <v-text-field
<v-text-field :model-value="formatDate()"
:model-value="formatDate()" label="Tanggal Mulai"
label="Tanggal Mulai" prepend-inner-icon="mdi-calendar"
prepend-inner-icon="mdi-calendar" hide-details
hide-details readonly
readonly variant="outlined"
variant="outlined" v-bind="props"
v-bind="props" ></v-text-field>
></v-text-field> </template>
</template> <v-date-picker
<v-date-picker hide-header
hide-header show-adjacent-months
show-adjacent-months rounded="lg"
rounded="lg" color="primary"
color="primary" v-model="date"
v-model="date" @update:modelValue="menuStartDate=false"
@update:modelValue="menuStartDate=false" ></v-date-picker>
></v-date-picker> </v-menu>
</v-menu> <v-menu
</v-col> v-model="menuEndDate"
<v-col cols="2"> :close-on-content-click="false"
<v-menu transition="scale-transition"
v-model="menuEndDate" offset-y
:close-on-content-click="false" min-width="auto"
transition="scale-transition" max-width="290px"
offset-y >
min-width="auto" <template v-slot:activator="{ props }">
max-width="290px" <v-text-field
> :model-value="formatDate()"
<template v-slot:activator="{ props }"> label="Tanggal Selesai"
<v-text-field prepend-inner-icon="mdi-calendar"
:model-value="formatDate()" hide-details
label="Tanggal Selesai" readonly
prepend-inner-icon="mdi-calendar" variant="outlined"
hide-details v-bind="props"
readonly ></v-text-field>
variant="outlined" </template>
v-bind="props" <v-date-picker
></v-text-field> hide-header
</template> show-adjacent-months
<v-date-picker rounded="lg"
hide-header color="primary"
show-adjacent-months v-model="date"
rounded="lg" @update:modelValue="menuEndDate=false"
color="primary" ></v-date-picker>
v-model="date" </v-menu>
@update:modelValue="menuEndDate=false" </div>
></v-date-picker> </v-col>
</v-menu> <v-col cols="2.5">
</v-col> <v-text-field
<v-col cols="2"> label="No Reg / Nama"
<v-text-field variant="outlined"
label="No Reg / Nama" hide-details
variant="outlined" append-inner-icon="mdi-magnify"
hide-details ></v-text-field>
append-inner-icon="mdi-magnify" </v-col>
></v-text-field> <v-col cols="2.5">
</v-col> <v-autocomplete
<v-col cols="2"> label="Grup Pemeriksaan"
<v-autocomplete variant="outlined"
label="Grup Pemeriksaan" hide-details
variant="outlined" menu-icon="mdi-chevron-down"
hide-details :items="['California', 'Colorado', 'Florida', 'Georgia', 'Texas', 'Wyoming']"
menu-icon="mdi-chevron-down" ></v-autocomplete>
:items="['California', 'Colorado', 'Florida', 'Georgia', 'Texas', 'Wyoming']" </v-col>
></v-autocomplete> <v-col cols="1">
</v-col> <v-btn
<v-col cols="1"> variant="flat"
<v-btn small
variant="flat" style="height: 100%;"
class="bg-primary rounded-lg">
<iconify-icon
style="font-size: 2rem;"
icon="fluent:search-20-regular"
></iconify-icon>
</v-btn>
</v-col>
<v-col cols="3">
<div style="height: 100%;">
<v-row class="pt-3 justify-end">
<v-btn fab
variant="tonal"
small small
style="height: 100%;" style="height: auto;"
class="bg-primary rounded-lg"> color="secondary"
class="bg-secondary-lighten rounded-lg mr-2">
<iconify-icon <iconify-icon
style="font-size: 2rem;" style="font-size: 2rem;"
icon="fluent:search-20-regular" icon="fluent:notepad-person-24-regular"
></iconify-icon> ></iconify-icon>
</v-btn> </v-btn>
</v-col>
<v-col cols="3">
<div style="height: 100%;">
<v-row class="pt-3 justify-end">
<v-btn fab
variant="tonal"
small
style="height: auto;"
color="secondary"
class="bg-secondary-lighten rounded-lg mr-2">
<iconify-icon
style="font-size: 2rem;"
icon="fluent:notepad-person-24-regular"
></iconify-icon>
</v-btn>
<div <div
class="pt-3 pa-3" class="pt-3 pa-3"
>
<v-btn
small
class="bg-primary-lighten"
variant="tonal"
color="primary"
> >
<v-btn HISTORY
small </v-btn>
class="bg-primary-lighten"
variant="tonal"
color="primary"
>
HISTORY
</v-btn>
</div>
<div
class="pt-3 pa-3"
>
<v-btn
variant="flat"
small
class="bg-primary text-white"
>
SIMPAN
</v-btn>
</div>
</v-row>
</div> </div>
</v-col> <div
</v-row> class="pt-3 pa-3"
</v-card> >
</v-col> <v-btn
</v-row> variant="flat"
small
class="bg-primary text-white"
>
SIMPAN
</v-btn>
</div>
</v-row>
</div>
</v-col>
</v-row>
</v-container>
</div> </div>
</template> </template>