379 lines
16 KiB
Vue
379 lines
16 KiB
Vue
<template>
|
|
<v-layout row justify-center>
|
|
<v-dialog v-model="dialog_preparasisperma" persistent max-width="70%">
|
|
<v-card>
|
|
<v-card-title>
|
|
<span class="headline">PREPARASI SPERMA</span>
|
|
</v-card-title>
|
|
<v-card-text>
|
|
<v-layout mb-3 row>
|
|
<v-flex pl-0 xs4>
|
|
<v-select
|
|
class="mini-select"
|
|
item-text="name"
|
|
return-object
|
|
outline
|
|
:items="doctors"
|
|
v-model="selected_doctor"
|
|
hide-details
|
|
label="Dokter"
|
|
></v-select>
|
|
<p v-if="error_doctor" class="error pl-2 pr-2" style="color:#fff">Dokternya siapa ? jangan lupa ya ...</p>
|
|
</v-flex>
|
|
</v-layout>
|
|
<v-layout mb-2 row>
|
|
<v-flex class="font-weight-bold" xs12>
|
|
<v-select
|
|
class="mini-select"
|
|
item-text="name"
|
|
return-object
|
|
outline
|
|
:items="methodes"
|
|
v-model="selected_methode"
|
|
hide-details
|
|
label="Metode"
|
|
></v-select>
|
|
</v-flex>
|
|
</v-layout>
|
|
<v-layout row>
|
|
<v-flex xs12>
|
|
<v-layout mb-2 row>
|
|
<v-flex xs6>
|
|
<v-layout mb-2 row>
|
|
<v-flex class="font-weight-bold" xs12>Pre Preparasi</v-flex>
|
|
</v-layout>
|
|
<v-layout mb-2 row>
|
|
<v-flex xs4>Volume</v-flex>
|
|
<v-flex pa-1 xs2>
|
|
<v-text-field
|
|
label="Volume"
|
|
outline
|
|
v-model="results.Other_PreparasiSpermaPreVolume"
|
|
></v-text-field>
|
|
</v-flex>
|
|
</v-layout>
|
|
<v-layout row>
|
|
<v-flex xs4>Motilitas</v-flex>
|
|
<v-flex pa-1 xs2>
|
|
<v-text-field
|
|
label="Progresive"
|
|
outline
|
|
v-model="results.Other_PreparasiSpermaPreMotilitasA"
|
|
></v-text-field>
|
|
</v-flex>
|
|
<v-flex pa-1 xs2>
|
|
<v-text-field
|
|
label="Non Progresive"
|
|
outline
|
|
v-model="results.Other_PreparasiSpermaPreMotilitasB"
|
|
></v-text-field>
|
|
</v-flex>
|
|
<v-flex pa-1 xs2>
|
|
<v-text-field
|
|
label="Immotile"
|
|
outline
|
|
v-model="results.Other_PreparasiSpermaPreMotilitasC"
|
|
></v-text-field>
|
|
</v-flex>
|
|
</v-layout>
|
|
<v-layout row>
|
|
<v-flex xs4>Konsentrasi</v-flex>
|
|
<v-flex xs6>
|
|
<v-text-field
|
|
label="Konsentrasi"
|
|
outline
|
|
v-model="results.Other_PreparasiSpermaPreKonsentrasi"
|
|
></v-text-field>
|
|
</v-flex>
|
|
</v-layout>
|
|
<v-layout row>
|
|
<v-flex xs4>Kontaminan</v-flex>
|
|
<v-flex xs6>
|
|
<v-text-field
|
|
label="Kontaminan"
|
|
outline
|
|
v-model="results.Other_PreparasiSpermaPreKontaminan"
|
|
></v-text-field>
|
|
</v-flex>
|
|
</v-layout>
|
|
</v-flex>
|
|
<v-flex xs6>
|
|
<v-layout mb-2 row>
|
|
<v-flex class="font-weight-bold" xs12>Post Preparasi</v-flex>
|
|
</v-layout>
|
|
<v-layout mb-2 row>
|
|
<v-flex xs4>Volume</v-flex>
|
|
<v-flex pa-1 xs2>
|
|
<v-text-field
|
|
label="Volume"
|
|
outline
|
|
v-model="results.Other_PreparasiSpermaPostVolume"
|
|
></v-text-field>
|
|
</v-flex>
|
|
</v-layout>
|
|
<v-layout row>
|
|
<v-flex xs4>Motilitas</v-flex>
|
|
<v-flex pa-1 xs2>
|
|
<v-text-field
|
|
label="Progresive"
|
|
outline
|
|
v-model="results.Other_PreparasiSpermaPostMotilitasA"
|
|
></v-text-field>
|
|
</v-flex>
|
|
<v-flex pa-1 xs2>
|
|
<v-text-field
|
|
label="Non Progresive"
|
|
outline
|
|
v-model="results.Other_PreparasiSpermaPostMotilitasB"
|
|
></v-text-field>
|
|
</v-flex>
|
|
<v-flex pa-1 xs2>
|
|
<v-text-field
|
|
label="Immotile"
|
|
outline
|
|
v-model="results.Other_PreparasiSpermaPostMotilitasC"
|
|
></v-text-field>
|
|
</v-flex>
|
|
</v-layout>
|
|
<v-layout row>
|
|
<v-flex xs4>Konsentrasi</v-flex>
|
|
<v-flex xs6>
|
|
<v-text-field
|
|
label="Konsentrasi"
|
|
outline
|
|
v-model="results.Other_PreparasiSpermaPostKonsentrasi"
|
|
></v-text-field>
|
|
</v-flex>
|
|
</v-layout>
|
|
<v-layout row>
|
|
<v-flex xs4>Kontaminan</v-flex>
|
|
<v-flex xs6>
|
|
<v-text-field
|
|
label="Kontaminan"
|
|
outline
|
|
v-model="results.Other_PreparasiSpermaPostKontaminan"
|
|
></v-text-field>
|
|
</v-flex>
|
|
</v-layout>
|
|
</v-flex>
|
|
</v-layout>
|
|
<v-layout row>
|
|
<v-flex xs12>
|
|
<v-textarea
|
|
auto-grow
|
|
label="Keterangan"
|
|
outline
|
|
rows="2"
|
|
v-model="results.Other_PreparasiSpermaNote"
|
|
hide-details
|
|
></v-textarea>
|
|
</v-flex>
|
|
</v-layout>
|
|
</v-flex>
|
|
</v-layout>
|
|
<v-layout mt-1 style="border:1px solid black" align-center row pa-2>
|
|
<v-flex pa-2 xs6>
|
|
<v-layout row>
|
|
<v-flex pt-2 xs9>
|
|
<input type="file" id="files_pre" ref="prefile" multiple v-on:change="handleFileUploads('PRE')"/>
|
|
</v-flex>
|
|
<v-flex xs3 class="text-xs-right">
|
|
<v-btn :disabled="show_progrees_upload" small dark color="blue lighten-1" @click="submitFiles()">Upload | PRE</v-btn>
|
|
</v-flex>
|
|
|
|
</v-layout>
|
|
<v-layout v-if="error_image_pre" row>
|
|
<v-flex xs12>
|
|
<p class="mt-1 error pl-2 pr-2" style="color:#fff">Pilih 1 foto ya</p>
|
|
</v-flex>
|
|
</v-layout>
|
|
</v-flex>
|
|
<v-flex pa-2 xs6>
|
|
<v-layout row>
|
|
<v-flex pt-2 xs9>
|
|
<input type="file" id="files_post" ref="postfile" multiple v-on:change="handleFileUploads('POST')"/>
|
|
</v-flex>
|
|
<v-flex xs3 class="text-xs-right">
|
|
<v-btn :disabled="show_progrees_upload" small dark color="blue lighten-1" @click="submitFiles()">Upload | POST</v-btn>
|
|
|
|
</v-flex>
|
|
|
|
</v-layout>
|
|
<v-layout v-if="error_image_post" row>
|
|
<v-flex xs12>
|
|
<p class="mt-1 error pl-2 pr-2" style="color:#fff">Pilih 1 foto ya</p>
|
|
</v-flex>
|
|
</v-layout>
|
|
</v-flex>
|
|
</v-layout>
|
|
|
|
<v-layout v-if="show_progrees_upload" row align-center>
|
|
<v-flex xs12>
|
|
|
|
<v-progress-linear :indeterminate="true"></v-progress-linear>
|
|
|
|
</v-flex>
|
|
</v-layout>
|
|
<v-card class="mt-1">
|
|
<v-layout align-center row>
|
|
<v-flex pa-2 xs6>
|
|
<v-card>
|
|
<v-layout align-center justify-center row>
|
|
<v-flex xs12>
|
|
<v-img v-if="pre_image.image_url" :src="pre_image.image_url" aspect-ratio="1"></v-img>
|
|
<div v-if="!pre_image.image_url" class="display-2 text-xs-center ma-3">PRE IMAGE</div>
|
|
</v-flex>
|
|
</v-layout>
|
|
</v-card>
|
|
</v-flex>
|
|
<v-flex pa-2 xs6>
|
|
<v-card>
|
|
<v-layout align-center justify-center row>
|
|
<v-flex xs12>
|
|
<v-img v-if="post_image.image_url" :src="post_image.image_url" aspect-ratio="1"></v-img>
|
|
<div v-if="!post_image.image_url" class="display-2 text-xs-center ma-3">POST IMAGE</div>
|
|
</v-flex>
|
|
</v-layout>
|
|
</v-card>
|
|
</v-flex>
|
|
</v-layout>
|
|
</v-card>
|
|
</v-card-text>
|
|
<v-card-actions>
|
|
<v-spacer></v-spacer>
|
|
<v-btn color="blue darken-1" flat @click="dialog_preparasisperma = false">Tutup</v-btn>
|
|
<v-btn v-if="!onprocess" color="blue darken-1" @click="saveResult" flat >Simpan</v-btn>
|
|
</v-card-actions>
|
|
</v-card>
|
|
</v-dialog>
|
|
</v-layout>
|
|
</template>
|
|
|
|
<script>
|
|
module.exports = {
|
|
mounted() {
|
|
//this.$store.dispatch("re_preparasisperma/get_doctors",{token:''})
|
|
this.files = ''
|
|
},
|
|
data() {
|
|
return {
|
|
error_doctor:false,
|
|
error_image_pre:false,
|
|
error_image_post:false,
|
|
type_image:'PRE'
|
|
};
|
|
},
|
|
computed: {
|
|
pre_image(){
|
|
return this.$store.state.re_preparasisperma.pre_image
|
|
},
|
|
post_image(){
|
|
return this.$store.state.re_preparasisperma.post_image
|
|
},
|
|
show_progrees_upload: {
|
|
get() {
|
|
return this.$store.state.re_preparasisperma.show_progrees_upload
|
|
},
|
|
set(val) {
|
|
this.$store.commit("re_preparasisperma/update_show_progrees_upload", val)
|
|
}
|
|
},
|
|
images(){
|
|
return this.$store.state.re_preparasisperma.images
|
|
},
|
|
onprocess(){
|
|
return this.$store.state.re_preparasisperma.onprocess
|
|
},
|
|
dialog_preparasisperma: {
|
|
get() {
|
|
return this.$store.state.re_preparasisperma.dialog_preparasisperma
|
|
},
|
|
set(val) {
|
|
this.$store.commit("re_preparasisperma/update_dialog_preparasisperma", val)
|
|
}
|
|
},
|
|
results: {
|
|
get() {
|
|
return this.$store.state.re_preparasisperma.results
|
|
},
|
|
set(val) {
|
|
this.$store.commit("re_preparasisperma/update_results", val)
|
|
}
|
|
},
|
|
doctors(){
|
|
return this.$store.state.re_preparasisperma.doctors
|
|
},
|
|
selected_doctor: {
|
|
get() {
|
|
return this.$store.state.re_preparasisperma.selected_doctor
|
|
},
|
|
set(val) {
|
|
this.$store.commit("re_preparasisperma/update_selected_doctor", val)
|
|
}
|
|
},
|
|
methodes(){
|
|
return this.$store.state.re_preparasisperma.methodes
|
|
},
|
|
selected_methode: {
|
|
get() {
|
|
return this.$store.state.re_preparasisperma.selected_methode
|
|
},
|
|
set(val) {
|
|
this.$store.commit("re_preparasisperma/update_selected_methode", val)
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
handleFileUploads(value){
|
|
if(value === 'PRE'){
|
|
this.files = this.$refs.prefile.files;
|
|
//this.$refs.prefile.files = []
|
|
}
|
|
else{
|
|
this.files = this.$refs.postfile.files;
|
|
//this.$refs.postfile.files = []
|
|
}
|
|
console.log(this.files)
|
|
this.type_image = value
|
|
},
|
|
|
|
removeFile( key ){
|
|
this.files.splice( key, 1 );
|
|
},
|
|
submitFiles(){
|
|
this.error_image = false
|
|
this.error_image_pre = false
|
|
this.error_image_post = false
|
|
let formData = new FormData()
|
|
console.log(this.files)
|
|
for( var i = 0; i < this.files.length; i++ ){
|
|
let file = this.files[i];
|
|
formData.append('files[' + i + ']', file)
|
|
}
|
|
if(this.files.length == 1){
|
|
this.files = []
|
|
this.show_progrees_upload = true
|
|
formData.append('orderid', this.$store.state.re_patient.selected_patient.T_OrderHeaderID)
|
|
formData.append('labnumber', this.$store.state.re_patient.selected_patient.T_OrderHeaderLabNumber)
|
|
formData.append('token', one_token())
|
|
formData.append('type', this.type_image)
|
|
this.$store.dispatch("re_preparasisperma/uploadimage_preparasi_sperma",formData)
|
|
}
|
|
else{
|
|
if(this.type_image === 'PRE')
|
|
this.error_image_pre = true
|
|
else
|
|
this.error_image_post = true
|
|
}
|
|
|
|
},
|
|
saveResult(){
|
|
var selected_x = this.$store.state.re_preparasisperma.selected_preparasisperma
|
|
this.$store.commit("re_preparasisperma/update_onprocess", true)
|
|
this.$store.dispatch("re_preparasisperma/saveresult",{orderdetailid:selected_x.id,doctor:this.selected_doctor.id,methode:this.selected_methode.id,results:this.results})
|
|
}
|
|
}
|
|
|
|
}
|
|
</script>
|