<template>
    <v-layout  column class="fill-height">
        <v-card v-if="vdelivery.length > 0" class="mb-2">
            <v-layout class="pb-3" row wrap>
                <v-flex xs12 >
                    <v-subheader red--text text--lighten-1> DATA PENGIRIMAN
                     <v-flex text-md-right>
                        <v-btn small v-if="vlaststatus === '2'" @click="openDialogDelivery()" color="primary">Tambah Pengiriman</v-btn>
                        <one-verification-dialog-delivery @add-data-delivery="(cval) => updateDataParentDelivery(cval)"></one-verification-dialog-delivery>
                    </v-flex>
                    </v-subheader>
                    <v-divider></v-divider>
                    <v-layout row wrap>
                        <v-flex v-for="(vd,index) in vdelivery" xs12 pa-1>
                            <one-field-verification-delivery-payment
                                :xdatalabel="vd.label"
                                :xdatacbx="vd.chex"
                                :xdatatxt="vd.note"
                                :xdatatype="vd.type"
                                @update-data-txt="(val) => updateDataTxtParentDelivery(index,val)"
                                @update-data-cbx="(val) => updateDataCbxParentDelivery(index,val)"
                                @update-data-delete="(val) => deleteDataParentDelivery(index,val)"
                            ></one-field-verification-delivery-payment>
                        </v-flex>
                    </v-layout>
                </v-flex>
            </v-flex>          
        </v-card>
        <v-card v-if="vpayment.length > 0">
            <v-layout class="pb-3" row>
                <v-flex pb-3 xs12>
                    <v-subheader red--text text--lighten-1> DATA PEMBAYARAN</v-subheader>
                    <v-divider></v-divider>
                    <v-layout row>
                        <v-flex class="text-xs-center" xs12 pa-3>
                            <v-layout row>
                                <v-flex xs3><b class="indigo--text">{{vselpatient.texttagihan}}</b></v-flex>
                                <v-flex xs7><b>Total Tagihan</b> <kbd>{{convertMoney(vselpatient.T_OrderHeaderTotal)}}</kbd> <b>Pembayaran</b> <kbd>{{convertMoney(vselpatient.paid)}}</kbd> | <span>{{persen(vselpatient.T_OrderHeaderTotal,vselpatient.paid)}}</span>%</v-flex>
                            </v-layout>
                        </v-flex>
                    </v-layout>
                        <one-field-verification-delivery-payment
                            v-for="(vp,idx) in vpayment" :key="vp.id"
                            :xdatalabel="vp.label"
                            :xdatacbx="vp.chex"
                            :xdatatxt="vp.note"
                            :xdatatype="vp.type"
                            @update-data-txt="(val) => updateDataTxtParentPayment(idx,val)"
                            @update-data-cbx="(val) => updateDataCbxParentPayment(idx,val)"
                        ></one-field-verification-delivery-payment>
                </v-flex>
            </v-flex>          
        </v-card>
        <v-card v-if="vpayment.length > 0" class="mt-2" >
         <v-subheader>
            CATATAN VERIFIKASI
         </v-subheader>
         <v-divider></v-divider>
            <v-flex xs12 class="pl-4 pr-4 pt-2 pb-2 mt-2">
               <v-textarea
                  label="Tulis catatan di sini"
                  rows="3"
                  v-model="verification_note"
                  outline
                  ></v-textarea>
            </v-flex>
      </v-card>
        <v-card v-if="vpayment.length > 0" v-if="vlaststatus === '2'" class="mt-2">
            <v-layout row wrap>
                <v-flex xs6 pa-2 >
                    <v-btn large  block @click="saveVerification('N')"  color="error">Tolak</v-btn>
                </v-flex>
                <v-flex xs6 pa-2 >
                    <v-btn large block  @click="saveVerification('Y')"  color="primary">Verifikasi</v-btn>
                </v-flex>
            </v-layout>       
        </v-card>
        <v-dialog v-model="dialogvalidation" persistent width="500">
        <v-card>
            <v-card-title class="headline">Peringatan !</v-card-title>
            <v-card-text>
                <v-alert v-for="item in msgdialogvalidation"
                    :value="true"
                    type="error"
                    >
                   {{item}} [ Belum ada alasan ]
                </v-alert>
            </v-card-text>
            <v-card-actions>
            <v-spacer></v-spacer>
            <v-btn color="green darken-1" flat @click="dialogvalidation = false">OK</v-btn>
            </v-card-actions>
        </v-card>
        </v-dialog>
    </v-layout>
</template>

<style scoped>

</style>

<script>
module.exports = {
    data () {
      return {
        dialogvalidation: false,
        msgdialogvalidation:[]
      }
    },
	components : {
        'one-field-verification' : httpVueLoader('../../common/oneFieldVerification.vue'),
        'one-field-verification-delivery-payment' : httpVueLoader('../../common/oneFieldVerificationDeliveryPayment.vue'),
        'one-verification-dialog-delivery' : httpVueLoader('./oneVerificationDialogDelivery.vue')
    },
    computed: {
        vselpatient() {
            return this.$store.state.patient.selected_patient
        },
        vlaststatus() {
            return this.$store.state.patient.selected_patient.check_status
        },
        vdelivery() {
            return this.$store.state.verification.verification_delivery
        },
        vpayment() {
            return this.$store.state.verification.verification_payment
        },
        verification_note: {
            get() {
                return this.$store.state.patient.selected_patient.verification_note
            },
            set(val) {
                var oldArr = this.$store.state.patient.selected_patient
                oldArr.verification_note = val
                this.$store.commit("patient/update_selected_patient",oldArr)  
            }
        }
    },
    methods : {
        updateDataTxtParentDelivery(idx, val) {
            var prm = {idx:idx,val:val}
            this.$store.commit("verification/update_testing_txt_parent_delivery",prm)  
        },
        updateDataCbxParentDelivery(idx, val) {
            var prm = {idx:idx,val:val}
            this.$store.commit("verification/update_testing_cbx_parent_delivery",prm)  
            var xcount = this.$store.state.patient.no_save + 1
            this.$store.commit("patient/update_no_save",xcount)
        },
        updateDataTxtParentPayment(idx, val) {
            var prm = {idx:idx,val:val}
            this.$store.commit("verification/update_testing_txt_parent_payment",prm)  
        },
        updateDataCbxParentPayment(idx, val) {
            var prm = {idx:idx,val:val}
            this.$store.commit("verification/update_testing_cbx_parent_payment",prm) 
            var xcount = this.$store.state.patient.no_save + 1
            this.$store.commit("patient/update_no_save",xcount) 
        },
        deleteDataParentDelivery(idx,val){
            var inx = parseInt(idx);
            var oldArr = this.$store.state.patient.selected_patient
            oldArr.verification_delivery.splice(inx,1)
 
            this.$store.commit("patient/update_selected_patient",oldArr) 
        },
        openDialogDelivery(){
            var oldArr = this.$store.state.delivery.deliveries
            this.$store.commit("delivery/update_selected_delivery",oldArr[0])
            this.$store.commit('verification/update_dialog_delivery_is_active',true)
        },
        updateDataParentDelivery(valx){
            var oldArr = this.$store.state.patient.selected_patient
            oldArr.verification_delivery.push(valx)
            this.$store.commit("patient/update_selected_patient",oldArr) 
            var xcount = this.$store.state.patient.no_save + 1
            this.$store.commit("patient/update_no_save",xcount)
        },
        convertMoney(money){
            return one_money(money)
        },
        persen(total,paid){
            return ((paid/total)*100).toFixed(2)
        },
        saveVerification(status){
            var xerrors = []
            var allArr = this.$store.state.patient.selected_patient 
            allArr.verification_patient.forEach(function(value) {
                if(value.chex === false && value.note === "")
                    xerrors.push(value.label);
            });
            allArr.verification_doctor.forEach(function(value) {
                if(value.chex === false && value.note === "")
                    xerrors.push(value.label);
            });
            allArr.verification_companymou.forEach(function(value) {
                if(value.chex === false && value.note === "")
                    xerrors.push(value.label);
            });
            allArr.verification_delivery.forEach(function(value) {
                if(value.chex === false && value.note === "")
                    xerrors.push(value.label);
            });
            allArr.verification_info.forEach(function(value) {
                if(value.chex === false && value.note === "")
                    xerrors.push(value.label);
            });
            allArr.verification_payment.forEach(function(value) {
                if(value.chex === false && value.note === "")
                    xerrors.push(value.label);
            });
            if(xerrors.length === 0){
                var prm = {patient: this.$store.state.patient.selected_patient, status : status}
                this.$store.dispatch("patient/save",prm)
            }
            else{
                var msg = ""
                xerrors.forEach(function(value) {
                    msg += '<v-alert :value="true" type="error">'+value+'</v-alert>'
                });
                this.msgdialogvalidation = xerrors
                this.dialogvalidation = true
            }
        }
        
    }
}
</script>
