Files
FE_CPONE/test/vuex/one-md-regonline-carousel/components/oneMdPatientDetail.vue
2026-04-27 10:13:31 +07:00

490 lines
19 KiB
Vue

<template>
<v-layout class="mb-2" column>
<v-dialog v-model="dialogconfirmationdelete" persistent max-width="290">
<v-card>
<v-card-title dark class="headline error pt-2 pb-2" primary-title style="color:white">
<h4 dark>Konfirmasi</h4>
</v-card-title>
<v-card-text>
{{msgconfirmationdelete}}
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn small color="error darken-1 text-sm-left" flat @click="doDeleteData()">Hapus</v-btn>
<v-btn small color="primary darken-1 text-sm-right" flat @click="dialogconfirmationdelete = false">Batal</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<v-dialog v-model="dialogalert" persistent max-width="290">
<v-card>
<v-card-title dark class="headline error pt-2 pb-2" primary-title style="color:white">
<h4 dark>Alert</h4>
</v-card-title>
<v-card-text>
{{msgalert}}
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn small color="primary darken-1 text-sm-right" flat @click="dialogalert = false">Tutup</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<v-card>
<v-layout row>
<v-flex xs12>
<v-subheader red--text text--lighten-1>
<v-flex text-md-right>
<v-btn v-if="xact === 'edit' && !pgrs_save" @click="deleteData()" small color="error">Hapus</v-btn>
<v-btn v-if="xact === 'edit' && !pgrs_save" @click="saveData()" small color="primary">Simpan</v-btn>
</v-flex>
</v-subheader>
<v-divider></v-divider>
<v-layout row wrap>
<v-flex xs12 pa-2>
<v-layout row>
<v-flex xs2 pa-1>
<v-text-field type="number" outline v-model="xorder" label="Urutan" hide-details></v-text-field>
</v-flex>
<v-flex xs4 pa-1>
<v-btn style="height:44px" dark v-if="xstatus === 'N'" @click="changeStatus(xstatus)" depressed small color="error"> Status Inactive</v-btn>
<v-btn style="height:44x" dark v-if="xstatus === 'Y'" @click="changeStatus(xstatus)" depressed small color="green">Status Active</v-btn>
</v-flex>
</v-layout>
<v-layout row>
<v-flex xs12 pa-1>
<v-card>
<v-img :src="selected_patient.xurl"></v-img>
</v-card>
</v-flex>
</v-layout>
</v-flex>
</v-layout>
</v-flex>
</v-layout>
</v-card>
</v-layout>
</template>
<style scoped>
table,
td,
th {
border: 1px solid #ddd;
text-align: left;
}
table {
border-collapse: collapse;
width: 100%;
}
th,
td {
padding-top: 5px;
padding-bottom: 5px;
padding-left: 8px;
padding-right: 5px;
}
.mini-input .v-input {
margin-top: 0px;
}
.mini-input .v-input,
.mini-input .v-input--selection-controls,
.mini-input .v-input__slot {
margin-top: 0px;
margin-bottom: 0px;
margin-left: 3px;
}
.mini-input .v-messages {
min-height: 0px;
}
input.fhm-input {
border: 1px solid black;
border-radius: 2px;
-webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.1),
0 0 4px rgba(0, 0, 0, 0.1);
-moz-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.1),
0 0 4px rgba(0, 0, 0, 0.1);
box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.1),
0 0 4px rgba(0, 0, 0, 0.1);
padding: 2px 4px;
background: rgba(255, 255, 255, 0.5);
margin: 0 0 1px 0;
width: 30px;
text-align: center;
}
</style>
<script>
module.exports = {
data: () => ({
dialogalert:false,
msgalert:''
}),
computed: {
xorder: {
get() {
return this.$store.state.patient.xorder
},
set(val) {
this.$store.commit("patient/update_xorder", val)
this.$store.commit("patient/update_no_save", 1)
}
},
xstatus: {
get() {
return this.$store.state.patient.xstatus
},
set(val) {
this.$store.commit("patient/update_xstatus", val)
this.$store.commit("patient/update_no_save", 1)
}
},
selected_patient: {
get() {
return this.$store.state.patient.selected_patient
},
set(val) {
this.$store.commit("patient/update_selected_patient", val)
}
},
pgrs_save(){
return this.$store.state.patient.pgrs_save
},
dialogconfirmationdelete: {
get() {
return this.$store.state.patient.dialog_confirmation_delete
},
set(val) {
this.$store.commit("patient/update_dialog_confirmation_delete", val)
}
},
msgconfirmationdelete() {
return this.$store.state.patient.msg_confirmation_delete
},
xact() {
return this.$store.state.patient.act
},
detail() {
return this.$store.state.patient.selected_patient
},
xtitles() {
return this.$store.state.patient.titles
},
xtitle: {
get() {
return this.$store.state.patient.selected_title
},
set(val) {
this.$store.commit("patient/update_selected_title", val)
this.$store.commit("patient/update_no_save", 1)
}
},
xpatientprefix: {
get() {
return this.$store.state.patient.patient_prefix
},
set(val) {
this.$store.commit("patient/update_patient_prefix", val)
this.$store.commit("patient/update_no_save", 1)
}
},
xpatientname: {
get() {
return this.$store.state.patient.patient_name
},
set(val) {
this.$store.commit("patient/update_patient_name", val)
this.$store.commit("patient/update_no_save", 1)
}
},
xpatientsuffix: {
get() {
return this.$store.state.patient.patient_suffix
},
set(val) {
this.$store.commit("patient/update_patient_suffix", val)
this.$store.commit("patient/update_no_save", 1)
}
},
xnorm: {
get() {
return this.$store.state.patient.norm
},
set(val) {
this.$store.commit("patient/update_norm", val)
this.$store.commit("patient/update_no_save", 1)
}
},
xdob: {
get() {
return this.$store.state.patient.dob
},
set(val) {
this.$store.commit("patient/update_errors", [])
var errors = this.$store.state.patient.errors
var aDOB = moment(val, 'DD-MM-YYYY', true)
var isValidDOB = aDOB.isValid()
if (!isValidDOB) {
errors.push("wrongformatdob")
}
this.$store.commit("patient/update_dob", val)
this.$store.commit("patient/update_no_save", 1)
}
},
xsexes() {
return this.$store.state.patient.sexes
},
xsex: {
get() {
return this.$store.state.patient.selected_sex
},
set(val) {
this.$store.commit("patient/update_selected_sex", val)
this.$store.commit("patient/update_no_save", 1)
}
},
xreligions() {
return this.$store.state.patient.religions
},
xreligion: {
get() {
return this.$store.state.patient.selected_religion
},
set(val) {
this.$store.commit("patient/update_selected_religion", val)
this.$store.commit("patient/update_no_save", 1)
}
},
xphone: {
get() {
return this.$store.state.patient.phone
},
set(val) {
this.$store.commit("patient/update_phone", val)
this.$store.commit("patient/update_no_save", 1)
}
},
xhp: {
get() {
return this.$store.state.patient.hp
},
set(val) {
this.$store.commit("patient/update_hp", val)
this.$store.commit("patient/update_no_save", 1)
}
},
xemail: {
get() {
return this.$store.state.patient.email
},
set(val) {
this.$store.commit("patient/update_email", val)
this.$store.commit("patient/update_no_save", 1)
}
},
xpob: {
get() {
return this.$store.state.patient.pob
},
set(val) {
this.$store.commit("patient/update_pob", val)
this.$store.commit("patient/update_no_save", 1)
}
},
xkartuidentitass() {
return this.$store.state.patient.kartuidentitass
},
xkartuidentitas: {
get() {
return this.$store.state.patient.selected_kartuidentitas
},
set(val) {
this.$store.commit("patient/update_selected_kartuidentitas", val)
this.$store.commit("patient/update_no_save", 1)
}
},
xnoidentitas: {
get() {
return this.$store.state.patient.noidentitas
},
set(val) {
this.$store.commit("patient/update_noidentitas", val)
this.$store.commit("patient/update_no_save", 1)
}
},
xnote: {
get() {
return this.$store.state.patient.note
},
set(val) {
this.$store.commit("patient/update_note", val)
this.$store.commit("patient/update_no_save", 1)
}
},
xjob: {
get() {
return this.$store.state.patient.job
},
set(val) {
this.$store.commit("patient/update_job", val)
this.$store.commit("patient/update_no_save", 1)
}
},
xnik: {
get() {
return this.$store.state.patient.nik
},
set(val) {
this.$store.commit("patient/update_nik", val)
this.$store.commit("patient/update_no_save", 1)
}
},
xjabatan: {
get() {
return this.$store.state.patient.jabatan
},
set(val) {
this.$store.commit("patient/update_jabatan", val)
this.$store.commit("patient/update_no_save", 1)
}
},
xkedudukan: {
get() {
return this.$store.state.patient.kedudukan
},
set(val) {
this.$store.commit("patient/update_kedudukan", val)
this.$store.commit("patient/update_no_save", 1)
}
},
xpj: {
get() {
return this.$store.state.patient.pj
},
set(val) {
this.$store.commit("patient/update_pj", val)
this.$store.commit("patient/update_no_save", 1)
}
},
xlocation: {
get() {
return this.$store.state.patient.location
},
set(val) {
this.$store.commit("patient/update_location", val)
this.$store.commit("patient/update_no_save", 1)
}
},
},
methods: {
changeStatus(value){
var newval = value === 'Y'?'N':'Y'
var datas = this.$store.state.patient.patients
var xid = this.$store.state.patient.selected_patient.M_CarouselID
var xfiltered = _.filter(datas, function(o) { return o.M_CarouselStatus === 'Y' && o.M_CarouselID !== xid })
console.log(xfiltered)
if((newval == 'Y' && xfiltered.length < 5) || newval == 'N'){
this.xstatus = newval
}
else{
this.msgalert = 'Maksimal 5 yang statusnya ACTIVE'
this.dialogalert = true
}
},
checkError(value) {
var errors = this.$store.state.patient.errors
if (errors.includes(value)) {
return true
} else {
return false
}
},
saveData() {
this.$store.commit("patient/update_errors", [])
var errors = this.$store.state.patient.errors
if (errors.length === 0) {
var prm = {}
prm.M_CarouselID = this.$store.state.patient.selected_patient.M_CarouselID
prm.M_CarouselOrder = this.xorder
prm.M_CarouselStatus = this.xstatus
this.$store.commit("patient/update_pgrs_save", true)
this.$store.dispatch("patient/save", prm)
}
},
saveNewPatient() {
this.$store.commit("patient/update_errors", [])
var errors = this.$store.state.patient.errors
var aDOB = moment(this.xdob, 'DD-MM-YYYY', true)
console.log(this.xdob)
console.log(aDOB)
var isValidDOB = aDOB.isValid()
if (!isValidDOB) {
errors.push("wrongformatdob")
}
if (this.xpatientname === '') {
errors.push("requirename")
}
if (this.xdob === '') {
errors.push("requiredob")
}
if (_.isEmpty(this.xsex)) {
errors.push("requiresex")
}
if (_.isEmpty(this.xtitle)) {
errors.push("requiretitle")
}
if (errors.length === 0) {
var prm = {}
prm.M_PatientID = 0
prm.M_PatientM_TitleID = this.$store.state.patient.selected_title.M_TitleID
prm.M_PatientPrefix = this.xpatientprefix
prm.M_PatientName = this.xpatientname
prm.M_PatientSuffix = this.xpatientsuffix
prm.M_PatientDOB = this.xdob
prm.M_PatientM_SexID = this.$store.state.patient.selected_sex.M_SexID
prm.M_PatientM_ReligionID = this.$store.state.patient.selected_religion.M_ReligionID
prm.M_PatientEmail = this.xemail
prm.M_PatientPOB = this.xpob
prm.M_PatientHP = this.xhp
prm.M_PatientPhone = this.xphone
prm.M_PatientM_IdTypeID = this.$store.state.patient.selected_kartuidentitas.M_IdTypeID
prm.M_PatientIDNumber = this.xnoidentitas
prm.M_PatientNote = this.xnote
prm.M_PatientNIK = this.xnik
prm.M_PatientJabatan = this.xjabatan
prm.M_PatientKedudukan = this.xkedudukan
prm.M_PatientPJ = this.xpj
prm.M_PatientLocation = this.xlocation
prm.M_PatientJob = this.xjob
this.$store.commit("patient/update_pgrs_save", true)
this.$store.dispatch("patient/newpatient", prm)
}
},
deleteData() {
var xname = this.$store.state.patient.selected_patient.M_CarouselImageUrl
let msg = "Yakin, akan menghapus data image " + xname + " ?"
this.$store.commit("patient/update_msg_confirmation_delete", msg)
this.$store.commit("patient/update_dialog_confirmation_delete", true)
},
doDeleteData() {
var prm = {}
prm.M_CarouselID = this.$store.state.patient.selected_patient.M_CarouselID
prm.M_CarouselImageUrl = this.$store.state.patient.selected_patient.M_CarouselImageUrl
this.$store.commit("patient/update_pgrs_save", true)
this.$store.dispatch("patient/delete", prm)
}
}
}
</script>