<template>
    <div>
        <v-layout class="mb-2 " column>
            <v-card flat color="#8c8c8c" height="800px" >
                <v-toolbar class="mb-2" dense>

                    <v-toolbar-title style="text-align:center!important" class="title">PEMERIKSAAN</v-toolbar-title>

                    <v-spacer></v-spacer>

                </v-toolbar>
                    <div style="height:60px">
                        <v-layout class="ma-2" row>
                        <v-flex xs12>
                            <v-card  color="#fff">
                                <v-card-title>
                                    <div class="body">Kesan Umum / Penampilan</div>
                                </v-card-title>
                                <v-divider></v-divider>
                                <v-card-text>
                                    <v-layout row>
                                        <v-flex xs12>
                                            <v-textarea
                                                label="Keterangan"
                                                v-model="kesan_umum"
                                                outline
                                                rows="1"
                                                auto-grow
                                                :disabled="selected_patient.orderIsScreening === 'D'"
                                                hide-details
                                            ></v-textarea>
                                        </v-flex>
                                    </v-layout>
                                    
                                </v-card-text>
                            </v-card>
                        </v-flex>
                    </v-layout>
                    <v-layout class="ma-2" row>
                        <v-flex class="pr-1" xs4>
                            <v-card  color="#fff">
                                <v-card-title>
                                    <div class="body">Kesadaran</div>
                                </v-card-title>
                                <v-divider></v-divider>
                                <v-card-text>
                                    <v-radio-group class="mt-0 mb-0" hide-details v-model="kesadaran" column>
                                        <v-radio
                                            label="Sadar Penuh"
                                            color="primary"
                                            value="SP"
                                            :disabled="selected_patient.orderIsScreening === 'D'"
                                        ></v-radio>
                                        <v-radio
                                            label="Tampak Mengantuk / Gelisah"
                                            color="primary"
                                            value="TMG"
                                            :disabled="selected_patient.orderIsScreening === 'D'"
                                        ></v-radio>
                                        <v-radio
                                            label="Tidak Sadar"
                                            color="error"
                                            value="TSD"
                                            :disabled="selected_patient.orderIsScreening === 'D'"
                                        ></v-radio>
                                    </v-radio-group>
                                </v-card-text>
                                <v-divider></v-divider>
                                <v-card-actions>
                                    <v-progress-linear
                                        :color="kesadaran === 'TSD'?'error':'primary'"
                                        height="20"
                                        value="100"
                                    ></v-progress-linear>
                                </v-card-actions>
                            </v-card>
                        </v-flex>
                        <v-flex xs4 class="pl-1 pr-1">
                            <v-card  color="#fff">
                                <v-card-title>
                                    <div class="body">Pernafasan</div>
                                </v-card-title>
                                <v-divider></v-divider>
                                <v-card-text>
                                    <v-radio-group class="mt-0 mb-0" hide-details v-model="pernafasan" column>
                                        <v-radio
                                            label="Nafas Normal"
                                            color="primary"
                                            value="NN"
                                            :disabled="selected_patient.orderIsScreening === 'D'"
                                        ></v-radio>
                                        <v-radio
                                            label="Tampak Sesak"
                                            color="primary"
                                            value="TS"
                                            :disabled="selected_patient.orderIsScreening === 'D'"
                                        ></v-radio>
                                        <v-radio
                                            label="Tidak Bernafas"
                                            color="error"
                                            value="TB"
                                            :disabled="selected_patient.orderIsScreening === 'D'"
                                        ></v-radio>
                                    </v-radio-group>
                                </v-card-text>
                                <v-divider></v-divider>
                                <v-card-actions>
                                    <v-progress-linear
                                        :color="pernafasan === 'TB'?'error':'primary'"
                                        height="20"
                                        value="100"
                                    ></v-progress-linear>
                                </v-card-actions>
                            </v-card>
                        </v-flex>
                        <v-flex xs4 class="pl-1">
                            <v-card  color="#fff">
                                <v-card-title>
                                    <div class="body">Resiko Jatuh</div>
                                </v-card-title>
                                <v-divider></v-divider>
                                <v-card-text>
                                    <v-radio-group class="mt-0 mb-0" hide-details v-model="resiko_jatuh" column>
                                        <v-radio
                                            label="Resiko Rendah"
                                            color="primary"
                                            value="RR"
                                            :disabled="selected_patient.orderIsScreening === 'D'"
                                        ></v-radio>
                                        <v-radio
                                            label="Resiko Sedang"
                                            color="primary"
                                            value="RS"
                                            :disabled="selected_patient.orderIsScreening === 'D'"
                                        ></v-radio>
                                        <v-radio
                                            label="Resiko Tinggi"
                                            color="error"
                                            value="RT"
                                            :disabled="selected_patient.orderIsScreening === 'D'"
                                        ></v-radio>
                                    </v-radio-group>
                                </v-card-text>
                                <v-divider></v-divider>
                                <v-card-actions>
                                    <v-progress-linear
                                        :color="resiko_jatuh === 'RT'?'error':'primary'"
                                        height="20"
                                        value="100"
                                    ></v-progress-linear>
                                </v-card-actions>
                            </v-card>
                        </v-flex>
                    </v-layout>
                    <v-layout class="ma-2" row>
                        <v-flex class="pr-1" xs4>
                            <v-card  color="#fff">
                                <v-card-title>
                                    <div class="body">Nyeri Dada</div>
                                </v-card-title>
                                <v-divider></v-divider>
                                <v-card-text>
                                    <v-radio-group class="mt-0 mb-0" hide-details v-model="nyeri_dada" column>
                                        <v-radio
                                            label="Tidak Ada"
                                            color="primary"
                                            value="TA"
                                            :disabled="selected_patient.orderIsScreening === 'D'"
                                        ></v-radio>
                                        <v-radio
                                            label="Ada (Tingkat Sedang)"
                                            color="primary"
                                            value="AS"
                                            :disabled="selected_patient.orderIsScreening === 'D'"
                                        ></v-radio>
                                        <v-radio
                                            label="Nyeri Dada Kiri Tembus Punggung	"
                                            color="error"
                                            value="NDKTP"
                                            :disabled="selected_patient.orderIsScreening === 'D'"
                                        ></v-radio>
                                    </v-radio-group>
                                </v-card-text>
                                <v-divider></v-divider>
                                <v-card-actions>
                                    <v-progress-linear
                                        :color="kesadaran === 'NDKTP'?'error':'primary'"
                                        height="20"
                                        value="100"
                                    ></v-progress-linear>
                                </v-card-actions>
                            </v-card>
                        </v-flex>
                        <v-flex xs4 class="pl-1 pr-1">
                            <v-card  color="#fff">
                                <v-card-title>
                                    <div class="body">Skala Nyeri</div>
                                </v-card-title>
                                <v-divider></v-divider>
                                <v-card-text>
                                    <v-radio-group class="mt-0 mb-0" hide-details v-model="skala_nyeri" column>
                                        <v-radio
                                            label="1 - 3"
                                            color="success"
                                            value="13"
                                            :disabled="selected_patient.orderIsScreening === 'D'"
                                        ></v-radio>
                                        <v-radio
                                            label="4 - 6"
                                            color="warning"
                                            value="46"
                                            :disabled="selected_patient.orderIsScreening === 'D'"
                                        ></v-radio>
                                        <v-radio
                                            label="7 - 10"
                                            color="error"
                                            value="710"
                                            :disabled="selected_patient.orderIsScreening === 'D'"
                                        ></v-radio>
                                    </v-radio-group>
                                </v-card-text>
                                <v-divider></v-divider>
                                <v-card-actions>
                                    <v-progress-linear
                                        v-if="skala_nyeri === '13'"
                                        color="success"
                                        height="20"
                                        value="100"
                                    ></v-progress-linear>
                                    <v-progress-linear
                                        v-if="skala_nyeri === '46'"
                                        color="warning"
                                        height="20"
                                        value="100"
                                    ></v-progress-linear>
                                    <v-progress-linear
                                        v-if="skala_nyeri === '710'"
                                        color="error"
                                        height="20"
                                        value="100"
                                    ></v-progress-linear>
                                </v-card-actions>
                            </v-card>
                        </v-flex>
                        <v-flex xs4 class="pl-1">
                            <v-card  color="#fff" >
                                <v-card-title>
                                    <div class="body">Batuk</div>
                                </v-card-title>
                                <v-divider></v-divider>
                                <v-card-text style="min-height:123px">
                                    <v-radio-group class="mt-0 mb-0" hide-details v-model="batuk" column>
                                        <v-radio
                                            label="Tidak Ada"
                                            color="primary"
                                            value="TAB"
                                            :disabled="selected_patient.orderIsScreening === 'D'"
                                        ></v-radio>
                                        <v-radio
                                            label="Batuk > 2 Minggu"
                                            color="error"
                                            value="B2M"
                                            :disabled="selected_patient.orderIsScreening === 'D'"
                                        ></v-radio>
                                    </v-radio-group>
                                </v-card-text>
                                <v-divider></v-divider>
                                <v-card-actions>
                                    <v-progress-linear
                                        :color="batuk === 'B2M'?'error':'primary'"
                                        height="20"
                                        value="100"
                                    ></v-progress-linear>
                                </v-card-actions>
                            </v-card>
                        </v-flex>
                    </v-layout>
                    <v-layout class="ma-2" row>
                        <v-flex xs12>
                            <v-card  color="#fff">
                                <v-card-title>
                                    <div class="body">KEPUTUSAN</div>
                                </v-card-title>
                                <v-divider></v-divider>
                                <v-card-text class="pa-2">
                                    <v-layout class="pa-0" row>
                                        <v-flex class="pa-2" xs4>
                                            <v-btn block depressed v-if="keputusan === 'SA'"  color="success">
                                                <v-icon left dark>check</v-icon>
                                                Sesuai Antrian
                                            </v-btn>
                                            <v-btn block @click="changeKeputusan('SA')" v-if="keputusan !== 'SA'" color="success">
                                                <v-icon left dark>close</v-icon>
                                                Sesuai Antrian
                                            </v-btn>
                                        </v-flex>
                                        <v-flex class="pa-2" xs4>
                                            <v-btn  block v-if="keputusan !== 'AD'" @click="changeKeputusan('AD')" color="warning">
                                                <v-icon left dark>close</v-icon>
                                                Antrian Didahulukan
                                            </v-btn>
                                            <v-btn  block depressed v-if="keputusan === 'AD'" color="warning">
                                                <v-icon left dark>check</v-icon>
                                                Antrian Didahulukan
                                            </v-btn>
                                        </v-flex>
                                        <v-flex class="pa-2" xs4>
                                            <v-btn  block v-if="keputusan !== 'PAS'" @click="changeKeputusan('PAS')" color="error">
                                                <v-icon left dark>close</v-icon>
                                                Penanganan Awal Segera
                                            </v-btn>
                                            <v-btn  block depressed  v-if="keputusan === 'PAS'" color="error">
                                                <v-icon left dark>check</v-icon>
                                                Penanganan Awal Segera
                                            </v-btn>
                                        </v-flex>
                                    </v-layout>
                                    
                                </v-card-text>
                            </v-card>
                        </v-flex>
                    </v-layout>
                    </div>
                    
                    
            </v-card>
        </v-layout>
       
        
       
       
     
      
    </div>
</template>

<style scoped>
.div_bottom {
    position: absolute;
right:    0;
bottom:   0;
}
</style>

<script>
module.exports = {
    mounted() {
      //  this.$store.dispatch('patient/get_data')
    },
    data: () => ({

    }),
    computed: {
        keputusan: {
            get() {
                return this.$store.state.patient.keputusan
            },
            set(val) {
                this.$store.commit("patient/update_keputusan", val)
            }
        },
        batuk: {
            get() {
                return this.$store.state.patient.batuk
            },
            set(val) {
                this.$store.commit("patient/update_batuk", val)
            }
        },
        skala_nyeri: {
            get() {
                return this.$store.state.patient.skala_nyeri
            },
            set(val) {
                this.$store.commit("patient/update_skala_nyeri", val)
            }
        },
        nyeri_dada: {
            get() {
                return this.$store.state.patient.nyeri_dada
            },
            set(val) {
                this.$store.commit("patient/update_nyeri_dada", val)
            }
        },
        resiko_jatuh: {
            get() {
                return this.$store.state.patient.resiko_jatuh
            },
            set(val) {
                this.$store.commit("patient/update_resiko_jatuh", val)
            }
        },
        pernafasan: {
            get() {
                return this.$store.state.patient.pernafasan
            },
            set(val) {
                this.$store.commit("patient/update_pernafasan", val)
            }
        },
        kesan_umum: {
            get() {
                return this.$store.state.patient.kesan_umum
            },
            set(val) {
                this.$store.commit("patient/update_kesan_umum", val)
            }
        },
        kesadaran: {
            get() {
                return this.$store.state.patient.kesadaran
            },
            set(val) {
                this.$store.commit("patient/update_kesadaran", val)
            }
        },
        doctors: {
            get() {
                return this.$store.state.patient.doctors
            },
            set(val) {
                this.$store.commit("patient/update_doctors", val)
            }
        },
        selected_doctor: {
            get() {
                return this.$store.state.patient.selected_doctor
            },
            set(val) {
                this.$store.commit("patient/update_selected_doctor", val)
            }
        },
        selected_patient: {
            get() {
                return this.$store.state.patient.selected_patient
            },
            set(val) {
                this.$store.commit("patient/update_selected_patient", val)
            }
        },
        doctor_pj() {

return this.$store.state.patient.doctor_pj
},
        tabs() {
            return this.$store.state.patient.tabs
        },
        selected_tab: {
            get() {
                return this.$store.state.patient.selected_tab
            },
            set(val) {
                this.$store.commit("patient/update_selected_tab", val)
            }
        },
        pgrs_save() {

            return this.$store.state.patient.pgrs_save
        },
        active() {
            return this.$store.state.button_active
        },
        dialogconfirmationdelete: {
            get() {
                return this.$store.state.patient.dialog_confirmation_delete
            },
            set(val) {
                this.$store.commit("patient/update_dialog_confirmation_delete", val)
            }
        }
    },
    methods: {
        changeKeputusan(value){
            if(this.selected_patient.orderIsScreening !== 'D')
            this.keputusan = value
        },
        endSession(){
            this.$store.dispatch("patient/endsession",this.selected_patient)
        },
        isSelected(id){
            return id == this.selected_tab.id
        },
        changeButton(tab) {
            this.selected_tab = tab
            this.$store.commit("patient/update_header_tab", 0)
            
            if(tab.id !== "VITAL"){
                this.$store.commit("patient/update_type_field", "TEXT")
            }

            this.$store.dispatch("patient/get_data")

            if(tab.id !== 'ADDITIONAL'){
                let difftest = this.compareSelectedTest()
                if(difftest){
                    this.$store.commit("patient/update_msginfo", "Anda belum melakukan simpan")
                    this.$store.commit("patient/update_dialoginfo", true)
                    this.selected_tab = {id:'ADDITIONAL',name:'Pemeriksaan Penunjang'}
                }
            }
        },
        checkError(value) {
            var errors = this.$store.state.patient.errors
            if (errors.includes(value)) {
                return true
            } else {
                return false
            }
        },
        compareSelectedTest(){
            let seltest = this.$store.state.patient.selected_test
            let seltest_before = this.$store.state.patient.selected_test_before
            let found_diff = false
            seltest.forEach( function(test) {
                let exist_test = seltest_before.filter(function(item) {
                return item.T_TestID === test.T_TestID
                })
                if(exist_test.length === 0)
                found_diff = true
            })

            return found_diff
        
        },
    }
}
</script>