<template>
   <v-layout column pb-0>
      <v-dialog
      v-model="dialog_alert_msg"
      width="60%"
    >
      

      <v-card >
        <v-card-title
          class="subtitle-1 white--text"
          style="background:#ee7777"
         
        >
          PEMBERITAHUAN !
        </v-card-title>

        <v-card-text v-html="alert_msg">
          
        </v-card-text>

        <v-divider></v-divider>

        <v-card-actions>
          <v-spacer></v-spacer>
          <v-btn
            color="grey"
            flat
            @click="dialog_alert_msg = false"
          >
            OK ... saya mengerti
          </v-btn>
        </v-card-actions>
      </v-card>
    </v-dialog>
      <!--#95eaf3-->
      <v-card flat>
         <table>
            <tr style="background:#64b2cd">
            <!--   <th style="width:5%;font-weight:bold;font-size:12px;color:#fff" class="text-md-center pt-2 pb-2">  </th>
               <th style="width:7%;font-weight:bold;font-size:12px;color:#fff" class="text-md-center pt-2 pb-2">CITO</th> -->
               <th style="width:42%;font-weight:bold;font-size:12px;color:#fff" class="text-md-center pt-2 pb-2">PEMERIKSAAN</th>
               <th style="width:12%;font-weight:bold;font-size:12px;color:#fff" class="text-md-center pt-2 pb-2">BRUTO</th>
               <th style="width:12%;font-weight:bold;font-size:12px;color:#fff" class="text-md-center pt-2 pb-2">DISKON</th>
               <th style="width:12%;font-weight:bold;font-size:12px;color:#fff" class="text-md-center pt-2 pb-2">TOTAL</th>
            </tr>
            <tr  v-if="selected_test.length === 0" >
               <td class="pa-2 text-xs-center caption" colspan="6">Belum ada order pemeriksaan</td>
            </tr>
            <tr v-if="selected_test.length > 0" style="font-size:12px" v-for="t in selected_test" v-bind:key="t.T_TestID">
             <!--  <td class="text-md-center">
                  <v-icon color="#ee7777" @click="deletePx(t)">delete</v-icon>
               </td>
               <td class="text-md-left pl-3">
                     <v-checkbox hide-details class="smr-1" 
                        :value="t.T_TestID"
                        v-model="cito_test"
                     ></v-checkbox>
               </td>
            -->
               <td class="text-md-left pl-3">
                <!--  <p class="mb-0 mono caption font-weight-bold" style="color:#3c70a4;font-size:10px!important">{{getTimeX(t.promise)}}</p> -->
                  <p class="mb-1">{{ t.T_TestName}}</p>
                  <p class="mb-0 caption" v-show="child_test_show(t)">{{child_test(t.child_test)}}</p>
               </td>
               <td class="text-md-right mono pr-2">{{ one_money(t.T_PriceAmount) }}</td>
               <td class="text-md-right mono pr-2">{{ one_money(calc_discount(t))  }}</td>
               <td class="text-md-right mono font-weight-black pr-2">{{ one_money(calc_netto(t)) }}</td>
            </tr>

            
            <!-- TEST PANEL -->
            <template v-for="p in selected_panel">
               <tr class="tr-panel">
                <!--  <td class="text-md-center">
                     <v-icon color="red" @click="deletePanel(p)">delete</v-icon>
                  </td> -->
                  <td class="text-md-left pl-3 pr-2" colspan="4">{{ p.T_TestPanelName}}</td>
               </tr>
               <tr v-for="t in p.test" v-bind:key="t.T_TestID">
                  <td class="text-md-center">
                     &nbsp;
                  </td>
                  <td class="text-md-left pl-3">{{ t.T_TestName}}</td>
                  <td class="text-md-right pr-2">{{ one_money(t.T_PriceAmount) }}</td>
                  <td class="text-md-right pr-2">{{ one_money(calc_discount(t))  }}</td>
                  <td class="text-md-right pr-2">{{ one_money(calc_netto(t)) }}</td>
               </tr>
            </template>
            <!--/ TEST PANEL -->

            <tfoot>
               <tr>
                 <!-- <th style="background:#3c70a4;color:#fff" colspan="2" class="text-md-right pr-5 pt-2 pb-2"></th> -->
                  <th style="background:#3c70a4;color:#fff"  class="text-md-left pl-3 pt-2 pb-2">TOTAL</th>
                  <th style="background:#3c70a4;color:#fff" class="text-md-right pr-2 pt-2 pb-2">{{ one_money(bruto_total)  }}</th>
                  <th style="background:#3c70a4;color:#fff" class="text-md-right pr-2 pt-2 pb-2">{{ one_money(diskon_total)  }}</th>
                  <th style="background:#3c70a4;color:#fff" class="text-md-right pr-2 pt-2 pb-2" >{{ one_money(sub_total)  }}</th>
               </tr>
               <tr style="display:none">
                  <th colspan="2"  class="text-md-right pr-2 pt-1 pb-1">DISKON PEMBULATAN</th>
                  <th class="text-md-right pr-2 pt-1 pb-1"  colspan="2">{{ one_money(discount_pembulatan) }}</th>
               </tr>
            </tfoot>
         </table>
      </v-card>
      <v-card   flat>
         <v-layout row>
            <v-flex  xs4>
               <v-btn block  v-if="btn_save_enabled && !loading_process" title="simpan order"  @click="save_order()" class="mb-1 mt-2 ml-0 mr-0" dark color="#3c70a4">
                  simpan 
               </v-btn>
               <v-btn block  v-if="!btn_save_enabled" title="simpan order"  @click="check_msg_alert()" class="mb-1 mt-2 ml-0 mr-0 grey darken-1"  dark>
                  simpan 
               </v-btn>
            </v-flex>
         </v-layout>
      </v-card>
      <one-dialog-loading></one-dialog-loading>
   </v-layout>
</template>

<style scoped>
.nota {
   font-size: 2em;
   font-weight: bold;
   text-align: left;
}
.total {
   min-height:76px;
}
table {
   font-family: arial, sans-serif;
   border-collapse: collapse;
   width: 100%;
   background:white;
   border: 0px;
}

th, td {
   border: 1px solid black;
   border-collapse: collapse;
   padding-top: 2px;
   padding-bottom: 2px;
}
table>tr>td {
   padding: 8px;
}
table>tr>td:first {
   padding-left:15px!important;
}

.vintage-text{
   text-shadow: 0px -2px 0px #fff, 0px 2px 3px #fff;
}

.v-input--selection-controls {
    margin-top: 0px;
    padding-top: 0px;
}

</style>
<script>
module.exports = {
    components : {
        'one-dialog-loading': httpVueLoader('../../common/oneDialogLoading.vue')
    },
   data () {
      return {
         current_cito_change : [],
         dialog_alert_msg:false,
         alert_msg:''

      }
   }, 
   watch : {
      cito_test (n, o) {
         if (n != o) {
            if (n.length == 0)
               this.current_cito_change = [o[0], "N"]
            else if (o.length == 0)
               this.current_cito_change = [n[0], "Y"]
            else if (o.length > n.length) {
               for (let i in o) 
                  if (n.indexOf(o[i]) < 0) this.current_cito_change = [o[i], "N"]
            }
            else {
               for (let i in n) 
                  if (o.indexOf(n[i]) < 0) this.current_cito_change = [n[i], "Y"]
            }
         }     
         
            let is_cito = "N";
            if (n.length > 0)
                is_cito = "Y";
            this.$store.commit('px/update_is_cito', is_cito);

         this.$store.dispatch('px/get_price', {
               test_id:this.current_cito_change[0], 
               mou_id:this.$store.state.company.selected_mou.M_MouID,
               cito:this.current_cito_change[1]})
      }
   },

   methods: {
       getTimeX(xtime) {
            var xvar = xtime
            if(xvar)
                xvar = xvar.split(",")
            else 
                xvar = []
            
            var new_time = []
            if(xvar.length > 0){
               xvar.forEach(function(xxtime) {
                  //console.log(xxtime)
                  let xxxtime = moment(xxtime).format('DD-MM-YYYY HH:mm')
                  //console.log(xxxtime)
                  new_time.push(xxxtime)
               })
            }
            console.log(new_time)
            if(new_time.length > 0)
                return new_time.join(', ')
            else
                return ''
        },
      one_money(p) {
         return window.one_money(p)
      },

      update_req(px) {
         this.$store.dispatch("px/update_req", px)
      },

      deletePanel(panel) {
         let sel = this.selected_panel

         sel.forEach(function(p,idx) {
            if(p.T_TestPanelID == panel.T_TestPanelID) {
               sel.splice(idx,1)
            }
         });

         this.$store.commit("px/update_selected_panel",sel)
         let panels = this.$store.state.px.panels
         if ( panels == undefined ) panels = [] 
         panels.push(panel)
         let dt = {
            records : panels,
            total: panels.length
         }
         this.$store.commit("px/update_panels",dt)
         this.update_req()
      },

      deletePx(test) {
         this.$store.dispatch("px/delete_px", test)
      },

      calc_netto(t) {
         return one_float(t.T_PriceAmount) - one_float(t.T_PriceDisc) / 100 * one_float(t.T_PriceAmount)
            - one_float(t.T_PriceDiscRp)
      },

      calc_discount(t) {
         return ( one_float(t.T_PriceDisc) / 100 * one_float(t.T_PriceAmount) )
            + one_float(t.T_PriceDiscRp)
      },

      save_order() {
            if (!window.one_token()) {
                this.$store.commit('update_message_error', 'Maaf, koneksi Anda sempat terputus silahkan Log Out dan Login kembali')
                this.$store.commit('update_dialog_error', true)
                return
            }
          // Loading
          this.$store.commit('order/update_loading_process', true)
          this.$store.commit('update_dialog_loading', true)
         this.$store.dispatch("order/save")
         return
      },

        child_test(x) {
            let y = []
            for (let i in x)
                y.push(x[i].T_TestName)
            return y.join(', ')
        },

        child_test_show(t) {
            if (!t.child_test)
                return false

            if (t.child_test.length < 1)
                return false

            if (t.px_type != 'PN')
                return false

            return true
        },
        check_msg_alert () {
         // console.log(this.$store.state.patient.selected_patient.M_PatientID)
         var msg = ""
         if (!this.$store.state.patient.selected_patient.M_PatientID)
            msg = msg +"<p class='caption mono mb-1'>- Ibarat ibu-ibu kalo belok tanpa lampu sein, bingung dong kalo belum dipilih pasien</p>"

            if (this.$store.state.px.req_status == 'X')
            msg = msg +"<p class='caption mono mb-1'>- Kalo mau ijab harus pakai mas kawin, kalo mau periksa harus ditanya dulu apakah persyaratan sudah memenuhi ?</p>"

         if (this.$store.state.px.req_status == 'N' && this.$store.state.px.reqs.length < 1)
           msg = msg +"<p class='caption mono mb-1'>- Yang tidak memenuhi persyaratannya apa ya ?</p>"

        /*  if (
            !this.$store.state.doctor.selected_doctor.M_DoctorID ||
            !this.$store.state.doctor.selected_address.M_DoctorAddressID )
         msg = msg +"<p class='caption mono mb-1'>- Pergi beli es krim naik kereta, kalo tanpa pengirim bayar JPA ke siapa ?</p>"


         

         var deliveries = this.$store.state.delivery.data_deliveries
         var checked_deliveries = _.filter(deliveries, function(o) { return o.chex === 'Y' })

         if (checked_deliveries.length === 0)
             msg = msg +"<p class='caption mono mb-1'>- Dari sekian banyak wanita haya kau yang ku pilih, jangan lupa ya ... pengiriman hasil dipilih salah satu</p>"
         */
         if (this.$store.state.px.selected_test.length < 1)
             msg = msg +"<p class='caption mono mb-1'>- Jadi total semua nya 0 rupi...eh, ini kok belum ada pemeriksaan ? </p>"

         this.alert_msg = msg
         this.dialog_alert_msg = true
      },
   },
   computed: {
      loading_process() {
         return this.$store.state.order.loading_process
      },
      selected_panel() {
         return this.$store.state.px.selected_panel
      },
      selected_test() {
         return this.$store.state.px.selected_test
      },
      discount_pembulatan() {
         //sipe : set to 0
         return 0
         let st = this.sub_total
         let part = st%1000
         if (part > 500) return part - 500
         if (part < 500 && part > 0 ) return part
         return 0
      },
      grand_total() {
         let gt = this.sub_total - this.discount_pembulatan
         return gt
      },
      sub_total() {
         let tests = this.selected_test
         sub_total = 0
         tests.forEach(function(t,idx) {
            let price = t.T_PriceAmount - t.T_PriceDisc / 100 * t.T_PriceAmount 
               - t.T_PriceDiscRp
            sub_total +=  price
         })
         let panels = this.selected_panel
         panels.forEach(function(p) {
            let tests = p.test
            tests.forEach(function(t,idx) {
               let price = t.T_PriceAmount - t.T_PriceDisc / 100 * t.T_PriceAmount 
                  - t.T_PriceDiscRp
               sub_total +=  price
            })

         })
         return sub_total
      },
      bruto_total() {
         let tests = this.selected_test
         bruto_total = 0
         tests.forEach(function(t,idx) {
            //console.log(t.T_PriceAmount)
            bruto_total +=  parseInt(t.T_PriceAmount)
            //console.log(bruto_total)
         })
         let panels = this.selected_panel
         panels.forEach(function(p) {
            let tests = p.test
            tests.forEach(function(t,idx) {
               bruto_total +=  parseInt(t.T_PriceAmount)
            })

         })
         return bruto_total
      },
      diskon_total() {
         let tests = this.selected_test
         diskon_total = 0
         tests.forEach(function(t,idx) {
            let price = parseInt(t.T_PriceDisc) / 100 * parseInt(t.T_PriceAmount) + parseInt(t.T_PriceDiscRp)
            diskon_total +=  price
         })
         let panels = this.selected_panel
         panels.forEach(function(p) {
            let tests = p.test
            tests.forEach(function(t,idx) {
               let price = parseInt(t.T_PriceDisc) / 100 * parseInt(t.T_PriceAmount) + parseInt(t.T_PriceDiscRp)
               diskon_total +=  price
            })

         })
         return diskon_total
      },
      btn_save_enabled () {
         // console.log(this.$store.state.patient.selected_patient.M_PatientID)
         if (!this.$store.state.patient.selected_patient.M_PatientID ||
            !this.$store.state.patient.selected_patient.M_PatientName ||
            !this.$store.state.patient.selected_patient.M_PatientNoReg ||
            !this.$store.state.patient.selected_patient.M_PatientDOB ||
            !this.$store.state.patient.selected_patient.patient_age ||
            this.$store.state.px.selected_test.length < 1)
         return false;

         if (this.$store.state.px.req_status == 'X')
         return false

         //alert(this.$store.state.px.req_status)
         if (this.$store.state.px.req_status == 'N' && this.$store.state.px.reqs.length < 1)
            return false


       /* 

         

         var deliveries = this.$store.state.delivery.data_deliveries
         var checked_deliveries = _.filter(deliveries, function(o) { return o.chex === 'Y' })

         if (checked_deliveries.length === 0)
            return false
      */

       
       
         return true;
      },

      cito_test : {
         get () {
            return this.$store.state.px.cito.test
         },
         set (v) {
            this.$store.commit('px/update_cito', {t:'test', v:v})
               
            return
         }
      }
   }

}
</script>
