<template>
    <v-layout column mb-2 >
        <v-card>
            <v-subheader>
            DATA SUPPLIES
            <v-flex text-md-right>
                <v-btn v-if="btnsaveseen" small @click="saveSupplies()" color="primary">Simpan</v-btn>
                <v-progress-linear v-if="pgrssave" :indeterminate="true"></v-progress-linear>
                <one-dialog-alert :status="openalertsupplies" :msg="msgalertsupplies" @forget-dialog-alert="forgetAlertSupplies()" @close-dialog-alert="closeAlertSupplies()"></one-dialog-alert>
            </v-flex>
            </v-subheader>
            <v-divider></v-divider>
            <v-layout row wrap>
                <v-flex xs4 pa-2 v-for="(vs,idx) in vsupplies" :key="vs.id">
                    <one-field-verification-supply
                        :xdatalabel="vs.name"
                        :xdatacbx="vs.chex"
                        :xdatatxt="vs.qty"
                        @update-data-txt="(val) => updateDataTxtParentSupplies(idx,val)"
                        @update-data-cbx="(val) => updateDataCbxParentSupplies(idx,val)"
                    ></one-field-verification-supply>
                </v-flex>
            </v-layout>       
        </v-card>
    </v-layout>
</template>

<style scoped>
.v-messages, .v-text-field__details{
    min-height:0px!important;
}
</style>

<script>
module.exports = {
   components : {
      'one-field-verification-supply':httpVueLoader('../../common/oneFieldVerificationSupply.vue'),
      'one-dialog-alert':httpVueLoader('../../common/oneDialogAlert.vue')
   },
   computed: {
        vsupplies() {
            return this.$store.state.verification.verification_supplies
        },
        openalertsupplies: {
            get() {
                return this.$store.state.supplies.open_alert_supplies
            },
            set(val) {
                this.$store.commit("supplies/open_alert_supplies",false)
            }
        },
        msgalertsupplies(){
            return this.$store.state.supplies.msg_alert_supplies
        },
        btnsaveseen(){
            return this.$store.state.supplies.btn_save_seen
        },
        pgrssave(){
            return this.$store.state.supplies.pgrs_save
        }
   },
   methods : {
      updateDataTxtParentSupplies(idx, val) {
         var prm = {idx:idx,val:val}
         this.$store.commit("verification/update_testing_txt_parent_supplies",prm)
      },
      updateDataCbxParentSupplies(idx, val) {
         var prm = {idx:idx,val:val}
         var xcount = this.$store.state.supplies.no_save + 1
         this.$store.commit("verification/update_testing_cbx_parent_supplies",prm)  
         this.$store.commit("supplies/update_no_save",xcount)
      },
      saveSupplies(){
          var orderid = this.$store.state.patient.selected_patient.T_OrderHeaderID
          var prm = {orderid: orderid, supplies:this.$store.state.verification.verification_supplies,barcode:this.$store.state.verification.verification_barcode}
          console.log(prm)
          this.$store.dispatch("supplies/save",prm)
      },
      closeAlertSupplies(){
          this.$store.commit("supplies/update_open_alert_supplies",false)
      },
      forgetAlertSupplies(){
          this.$store.commit("supplies/update_no_save",0)
          this.$store.commit("supplies/update_open_alert_supplies",false)
      }
   }
}
</script>
