Files
FE_CPONE/test/vuex/one-fo-registration-future/components/patientDetail.vue
2026-04-27 10:13:31 +07:00

304 lines
9.9 KiB
Vue

<template>
<div>
<v-dialog
v-model="dialog_card"
width="65%"
>
<v-card>
<v-card-title
class="red subheading white--text pt-2 pb-2"
primary-title
align-center
>
<span class="font-weight-thin">KARTU ANGGOTA</span>
</v-card-title>
<v-card-text class="pt-2 pb-1">
<v-layout>
<v-flex xs12>
<object :data="rpt_card"
width="100%" height="512px"></object>
</v-flex>
</v-layout>
</v-card-text>
</v-card>
</v-dialog>
<v-layout align-center row>
<v-flex xs12>
<v-card tile flat color=" pa-2 red lighten-4">
<h5 class=" subtitle-1 font-weight-bold">DATA PASIEN</h5>
</v-card>
</v-flex>
</v-layout>
<v-layout row wrap>
<v-flex xs12>
<v-layout>
<v-flex xs3 pa-2>
<v-layout row wrap>
<v-flex v-if="patient.info" xs12>
<v-btn
class="mt-0 mb-0"
deppressed
small
@click="getHistories(patient.info.visit)"
color="red lighten-3 white--text"
block
>
kunjungan ke {{ patient.info.visit }}
</v-btn>
</v-flex>
<v-flex xs12>
<v-card tile >
<v-img
:src="patient_photo"
aspect-ratio="1"
class="red lighten-2 pt-2"
contain
>
<template v-slot:placeholder>
<v-layout
fill-height
align-center
justify-center
ma-0
>
<v-progress-circular indeterminate color="grey lighten-5"></v-progress-circular>
</v-layout>
</template>
</v-img>
</v-card>
</v-flex>
<v-flex xs12>
<v-btn
class="mt-0 mb-0"
deppressed
small
color="red lighten-3 white--text"
:dark="patient.M_PatientID ? true : false"
block
@click="update_photo"
:disabled="!patient.M_PatientID"
>
Update Foto
</v-btn>
</v-flex>
<v-flex xs12>
<v-btn
small
color="red lighten-3 white--text"
:dark="patient.M_PatientID ? true : false"
block
@click="edit_patient"
:disabled="!patient.M_PatientID"
class="mt-1"
>
Ubah Data
</v-btn>
</v-flex>
<v-flex xs12>
<v-btn
small
color="red lighten-3 white--text"
:dark="patient.M_PatientID ? true : false"
block
@click="generate_card"
:disabled="!patient.M_PatientID"
class="mt-1"
>
Cetak Kartu
</v-btn>
</v-flex>
<v-divider></v-divider>
<v-flex mt-0 xs12>
<patient-history-dialog> </patient-history-dialog>
</v-flex>
<!--<v-flex xs12 v-if="patient.info">
<div v-show="patient.info.birthday == 'Y'">Happy Birthday !</div>
</v-flex>-->
</v-layout>
</v-flex>
<v-flex xs9>
<v-flex xs12>
<v-layout class="text-truncate" pt-2>
<v-flex xs5 pa-1>
<v-text-field
label="Nama"
placeholder=""
style="font-size:12px;padding:4px 0"
:value="patient.M_PatientName"
:title="patient.M_PatientName"
readonly
></v-text-field>
</v-flex>
<v-flex xs2 pa-1>
<v-text-field
label="PID"
style="font-size:12px;padding:4px 0"
placeholder=""
:value="patient.M_PatientNoReg"
readonly
></v-text-field>
</v-flex>
<v-flex xs2 pa-1>
<v-text-field
style="font-size:12px;padding:4px 0"
label="Tanggal Lahir"
placeholder=""
:value="patient_dob"
readonly
></v-text-field>
</v-flex>
<v-flex xs3 pa-1>
<v-text-field
style="font-size:12px;padding:4px 0"
label="Umur"
placeholder=""
v-model="patient_age"
readonly
></v-text-field>
</v-flex>
</v-layout>
</v-flex>
<v-flex xs12 pa-1>
<v-textarea
style="font-size:12px;padding:4px 0"
auto-grow
rows="3"
label="Alamat"
:value="patient.M_PatientAddress"
readonly
></v-textarea>
</v-flex>
<v-flex xs12 pa-1>
<v-textarea
auto-grow
placeholder=""
label="Catatan Pasien"
rows="1"
style="font-size:12px;padding:4px 0"
v-model="patient_note"
></v-textarea>
</v-flex>
<v-flex xs12 pa-1>
<v-textarea
auto-grow
label="Diagnosa"
rows="1"
style="font-size:12px;padding:4px 0"
v-model="diagnosa"
></v-textarea>
</v-flex>
</v-flex>
</v-layout>
</v-flex>
<patient-photo-dialog></patient-photo-dialog>
</v-layout>
</div>
</template>
<style scoped>
.v-messages { display:none; }
.v-input__slot {
margin-bottom: 0px;
}
</style>
<script>
module.exports = {
components : {
'patient-search-dialog': httpVueLoader('./patientSearchDialog.vue'),
'patient-history-dialog': httpVueLoader('./patientHistoryDialog.vue'),
'patient-photo-dialog': httpVueLoader('./oneDialogPhoto.vue')
},
data() {
return {
showinfo:false,
dialog_card:false,
rpt_card:''
};
},
computed : {
diagnosa: {
get() {
return this.$store.state.order.diagnosa
},
set(val) {
this.$store.commit('order/update_diagnosa',val)
}
},
patient() {
return this.$store.state.patient.selected_patient
},
patient_note: {
get() {
return this.$store.state.order.patient_note
},
set(val) {
this.$store.commit('order/update_patient_note',val)
}
},
patient_age: {
get () {
return this.$store.state.patient.selected_patient.patient_age
},
set (v) {
return
}
},
patient_dob () {
try {
return this.$store.state.patient.selected_patient.M_PatientDOB.split('-').reverse().join('-')
} catch (e) {
}
},
patient_photo () {
return this.$store.state.photo.photo_url
}
},
methods : {
update_photo () {
this.$store.commit('photo/update_dialog_photo', true)
},
edit_patient () {
this.$store.commit('patient/update_edit', true)
this.$store.commit('patient/update_patient_new_dialog_is_active', true)
},
getHistories(visit){
console.log(visit)
if(parseInt(visit) > 1){
this.$store.dispatch('history/search')
}
},
generate_card(){
var xid = this.$store.state.patient.selected_patient.M_PatientID
this.rpt_card = "/birt/run?__report=report/one/fo/rpt_card.rptdesign&__format=pdf&username=admin%20&PID="+xid
this.dialog_card = true
}
}
}
</script>