143 lines
4.9 KiB
Vue
143 lines
4.9 KiB
Vue
<template>
|
|
<div>
|
|
<v-container class="bg-white rounded-lg" fluid>
|
|
<v-data-table :headers="headers" :items="xdetails" return-object hide-default-footer class="pt-5">
|
|
<template v-slot:headers="{ columns }">
|
|
<tr>
|
|
<template v-for="column in columns" :key="column.key">
|
|
<td :class="column.class" :style="{ width: column.width, textAlign: column.align }">
|
|
<span>{{ column.title }}</span>
|
|
</td>
|
|
</template>
|
|
</tr>
|
|
</template>
|
|
<template v-slot:item="{ item }">
|
|
<tr>
|
|
<td class="text-center">
|
|
<v-checkbox v-model="item.chex" @change="selectMe()" />
|
|
</td>
|
|
<td class="text-center">
|
|
<div>
|
|
<p class="mt-2 mb-2">{{ item.ordernumber }}</p>
|
|
<p class="mb-2">
|
|
<v-chip label size="small">
|
|
{{ item.orderdate }}
|
|
</v-chip>
|
|
</p>
|
|
</div>
|
|
</td>
|
|
<td class="text-center">
|
|
<p class="font-weight-medium">{{ item.patient_fullname }}</p>
|
|
</td>
|
|
<td class="text-center">
|
|
<p class="mt-2 mb-2">{{ item.group_name }}</p>
|
|
<p class="mb-2">
|
|
<v-chip label size="small">
|
|
{{ item.delivery }}
|
|
</v-chip>
|
|
</p>
|
|
</td>
|
|
<td class="text-center">
|
|
<p>{{ item.test_name }}</p>
|
|
</td>
|
|
</tr>
|
|
</template>
|
|
</v-data-table>
|
|
</v-container>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.pointer {
|
|
cursor: pointer;
|
|
}
|
|
|
|
.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>
|
|
|
|
<script type="module">
|
|
export default {
|
|
name: "verificationRightList",
|
|
data() {
|
|
return {
|
|
menu: false,
|
|
headers: [
|
|
{
|
|
align: 'center',
|
|
key: 'select',
|
|
sortable: false,
|
|
width: "5%",
|
|
title: "", // kolom untuk checkbox
|
|
class: "font-weight-bold",
|
|
},
|
|
{
|
|
align: 'center',
|
|
key: 'noreg',
|
|
sortable: false,
|
|
width: "25%",
|
|
title: this.$t('message.tableDetailPatient.noreg'),
|
|
class: "font-weight-bold",
|
|
},
|
|
{
|
|
align: 'center',
|
|
key: 'name',
|
|
sortable: false,
|
|
width: "25%",
|
|
title: this.$t('message.tableDetailPatient.name'),
|
|
class: "font-weight-bold",
|
|
},
|
|
{
|
|
align: 'center',
|
|
key: 'group',
|
|
sortable: false,
|
|
width: "25%",
|
|
title: this.$t('message.tableDetailPatient.group'),
|
|
class: "font-weight-bold",
|
|
},
|
|
{
|
|
align: 'center',
|
|
key: 'examination',
|
|
sortable: false,
|
|
width: "25%",
|
|
title: this.$t('message.tableDetailPatient.examination'),
|
|
class: "font-weight-bold",
|
|
},
|
|
],
|
|
};
|
|
},
|
|
computed: {
|
|
xdetails() {
|
|
return this.$store.state.verification.details
|
|
},
|
|
btn_hide: {
|
|
get() {
|
|
return this.$store.state.verification.btn_hide
|
|
},
|
|
set(val) {
|
|
this.$store.commit("verification/update_btn_hide", val)
|
|
}
|
|
},
|
|
},
|
|
methods: {
|
|
selectMe() {
|
|
this.btn_hide = true
|
|
// Ambil item yang dipilih
|
|
var selectedItems = this.xdetails.filter(item => item.chex);
|
|
console.log("Selected items:", selectedItems);
|
|
if (selectedItems.length > 0) {
|
|
this.btn_hide = false
|
|
}
|
|
|
|
// Kirim data yang dipilih ke store
|
|
this.$store.commit("verification/setSelectedTransaction", selectedItems);
|
|
}
|
|
},
|
|
wacth: {
|
|
|
|
}
|
|
}
|
|
</script> |