<template>
   <div>
      <v-snackbar v-model="snackbar" color="success" :auto-height="true" :timeout="5000" :right="true"
         :multi-line="false" :vertical="false" :bottom="true">
         {{msgsnackbar}}
         <v-btn flat @click="updateAlert_success(false)">
            Tutup
         </v-btn>
      </v-snackbar>
      <v-dialog v-model="dialog_timeline_delivery" max-width="510px">
         <v-card>
            <v-card-title>
               <h4 class="font-weight-bold">GARIS WAKTU PENGIRIMAN</h5>

            </v-card-title>
            <v-card-text>

               <template>

                  <v-timeline dense clipped>
                     <v-timeline-item fill-dot class="mb-5" color="orange" large>
                        <template v-slot:icon>
                           <span>
                              <v-icon dark>local_shipping</v-icon>
                           </span>
                        </template>
                        <p class="mb-1">

                           {{selected_delivery.long_destination}}

                        </p>
                     </v-timeline-item>
                     <v-timeline-item class="align-center" v-for="xtd in timeline_delivery" class="mb-4" color="orange"
                        icon-color="orange lighten-2" small>
                        <v-layout class="mb-1 mt-1" align-center justify-space-between>
                           <v-flex xs7>
                              <p class="mb-0">
                                 <v-chip class="white--text ml-0" color="blue" label small>
                                    {{xtd.status}}
                                 </v-chip>

                                 <v-chip class="white--text ml-0" color="red" label small>
                                    {{xtd.username}}
                                 </v-chip>
                              </p>
                              <p v-if="xtd.xnote !== ''" style="color:#bd4147" class="mb-1"><kbd
                                    style="background:#24aaa4">{{xtd.xnote}}</kbd></p>
                              <p v-if="xtd.xperson !== ''" class="mb-0 caption font-weight-black">{{xtd.xperson}}</p>

                           </v-flex>
                           <v-flex xs5 text-xs-right><kbd>{{xtd.xtime}}</kbd></v-flex>
                        </v-layout>
                     </v-timeline-item>

               </template>

            </v-card-text>
            <v-card-actions>
               <v-btn small dark color="orange" @click="dialog_timeline_delivery = false">Tutup</v-btn>
            </v-card-actions>
         </v-card>
      </v-dialog>
      <v-dialog v-model="dialogbarcode" persistent max-width="490">
         <v-card>
            <v-card-title style="color:#fff" class="headline grey darken-1">Cetak Barcode</v-card-title>
            <v-card-text>
               <v-layout pa-2 class="grey lighten-2" row>
                  <v-flex xs1>
                     <v-checkbox style="padding-top:0;margin-top:0" hide-details color="grey darken-1"
                        :indeterminate="indeterminatex" @change="changeCbxAll(bar_chx_all)" v-model="bar_chx_all">
                     </v-checkbox>
                  </v-flex>
                  <v-flex xs5>
                     SPECIMEN
                  </v-flex>
                  <v-flex xs4>
                     BARCODE
                  </v-flex>
                  <v-flex xs2>
                     CETAK
                  </v-flex>
               </v-layout>
               <v-layout align-center pa-2 v-for="(vs,idx) in barcodes" :key="vs.id" class="grey lighten-4" row>

                  <v-flex xs1>
                     <v-checkbox v-if="vs.type === 'barcode' || vs.type === 'formulir'"
                        style="padding-top:0;margin-top:0" color="grey darken-1" hide-details v-model="vs.chex"
                        @change="checkTop()"></v-checkbox>
                  </v-flex>
                  <v-flex xs5>
                     {{vs.T_SampleTypeName}}
                  </v-flex>
                  <v-flex xs4>
                     {{vs.T_BarcodeLabBarcode}}
                  </v-flex>
                  <v-flex xs2>
                     <span @click="printSingleBarcode(vs)"
                        class="icon-medium-fill-base-small xs1 white--text grey darken-1  ml-1 icon-print"></span>
                  </v-flex>
               </v-layout>
            </v-card-text>
            <v-card-actions>
               <v-spacer></v-spacer>
               <v-btn color="grey darken-1" flat @click="dialogbarcode = false">Tutup</v-btn>
               <v-btn dark color="grey darken-3" @click="printRobo">Cetak Robo </v-btn>
               <v-btn dark color="grey darken-1" @click="printMultipleBarcode">Cetak terpilih [
                  {{}} ]</v-btn>

            </v-card-actions>
         </v-card>
      </v-dialog>
      <v-dialog v-model="dialogtimeline" max-width="500px">
         <v-card>
            <v-card-title class="headline grey lighten-2" primary-title>
               <span>Garis Waktu</span>
               <v-spacer></v-spacer>
            </v-card-title>
            <v-card-text>
               ...
            </v-card-text>
            <v-card-actions>
               <v-btn color="primary" flat @click="dialogtimeline=false">Tutup</v-btn>
            </v-card-actions>
         </v-card>
      </v-dialog>
      <v-dialog v-model="dialog_update_dob" max-width="500px">
         <v-card>
            <v-card-title class="headline grey lighten-2" primary-title>
               <span>Revisi Tanggal Lahir</span>
               <v-spacer></v-spacer>
            </v-card-title>
            <v-card-text>
               <p class="mb-2 red--text" v-if="show_form_dob === 'Y'">
                  <v-icon color="red">info</v-icon>
                  Sudah ada yang disampling, perubahan tanggal lahir di sini, tidak akan langsung merubah umur, hanya
                  memberikan info ke bagian proses
               </p>
               <v-divider v-if="show_form_dob === 'Y'"></v-divider>
               <p class="mt-3">
                  <v-text-field label="Tanggal" mask="##-##-####" v-model="data_patient.dob"
                     @change="changeUpdateDOB(data_patient.dob)" class="pb-1" hide-details></v-text-field>
               </p>
            </v-card-text>
            <v-card-actions>
               <v-spacer></v-spacer>
               <v-btn color="error" flat @click="dialog_update_dob=false">Tutup</v-btn>
               <v-btn color="primary" flat @click="updateDOB()">Simpan</v-btn>
            </v-card-actions>
         </v-card>
      </v-dialog>
      <v-dialog v-model="xpromisedialog" persistent max-width="30%">
         <v-card>
            <v-card-title class="headline teal white--text pt-2 pb-2" primary-title>
               <h4 dark>PERINGATAN !</h4>
            </v-card-title>
            <v-card-text class="pt-2 pb-2">
               <v-layout wrap>
                  <v-flex xs12>
                     <v-layout v-if="selected_patient.date_coming" row>
                        <v-flex text-xs-right xs12>
                           <p class="mb-0 caption text--orange">* terakhir bahan datang : 01-10-2020</p>
                        </v-flex>
                     </v-layout>
                     <v-layout v-if="bahan_belum.length > 0" row>
                        <v-flex xs12>
                           <p class="mb-0 caption">BAHAN BELUM :</p>
                        </v-flex>
                     </v-layout>
                     <v-layout v-if="bahan_belum.length > 0" row>
                        <v-flex pl-0 text-xs-left xs12>
                           <v-btn class="ml-0 mr-1 mb-1" 
                                 v-for="bahan in selected_patient.bahan_belum" 
                                 dark small 
                                 color="deep-orange darken-4">
                                 {{bahan.T_BahanName}}
                           </v-btn>
                        </v-flex>
                     </v-layout>
                     <v-layout row>
                        <v-flex xs12>
                           <blockquote class="blockquote subheading font-weight-light font-italic">
                                Contoh umbi-umbian : Ubi jalar, Ketela pohon, Talas, Kentang. 
                                Pasiennya benar sudah datang ?
                           </blockquote>
                        </v-flex>
                     </v-layout>
                  </v-flex>
               </v-layout>
            </v-card-text>
            <v-divider class="mt-2"></v-divider>
            <v-card-actions>
               <v-spacer></v-spacer>
               <v-btn color="cyan" flat @click="doSavePromise()">
                  Benar
               </v-btn>
               <v-btn color="black" flat @click="xpromisedialog = false">
                  Tidak jadi
               </v-btn>
            </v-card-actions>
         </v-card>
      </v-dialog>
      <v-layout class="fill-height" column>
         <v-card class="mb-2 pa-2 searchbox">
            <v-layout align-center row>
               <v-flex xs3>
                  <v-menu v-model="menufilterdatestart" :close-on-content-click="false" :nudge-right="40" lazy
                     transition="scale-transition" offset-y full-width max-width="290px" min-width="290px">
                     <template v-slot:activator="{ on }">
                        <v-text-field class="mr-2" v-model="filterComputedDateFormattedStart" label="Tanggal Awal"
                           outline hide-details readonly v-on="on"
                           @blur="date = deFormatedDate(filterComputedDateFormattedStart)"></v-text-field>
                     </template>
                     <v-date-picker v-model="xdatestart" no-title @input="menufilterdatestart = false"></v-date-picker>
                  </v-menu>
               </v-flex>
               <v-flex xs3>
                  <v-menu v-model="menufilterdateend" :close-on-content-click="false" :nudge-right="40" lazy
                     transition="scale-transition" offset-y full-width max-width="290px" min-width="290px">
                     <template v-slot:activator="{ on }">
                        <v-text-field class="mr-2" v-model="filterComputedDateFormattedEnd" label="Tanggal Akhir"
                           outline hide-details readonly v-on="on"
                           @blur="date = deFormatedDate(filterComputedDateFormattedEnd)"></v-text-field>
                     </template>
                     <v-date-picker v-model="xdateend" no-title @input="menufilterdateend = false"></v-date-picker>
                  </v-menu>
               </v-flex>
               <v-flex xs3>
                  <v-text-field style="font-size:14px" label="No Reg / Nama" class="mr-1" outline
                     v-on:keyup.enter="searchPatient" v-model="searchnamelab" hide-details></v-text-field>
               </v-flex>
               <v-flex xs3>
                  <v-autocomplete label="Dokter" v-model="selected_doctor" class="ma-1" :items="xdoctors"
                     :search-input.sync="search_doctor" auto-select-first hide-details style="font-size:14px" outline
                     no-filter item-text="name" return-object :loading="isLoading" no-data-text="Semua Dokter">
                     <template slot="item" slot-scope="{ item }">
                        <v-list-tile-content>
                           <v-list-tile-title v-text="item.name"></v-list-tile-title>
                        </v-list-tile-content>
                     </template>
                  </v-autocomplete>
               </v-flex>
               <v-flex xs3>
                  <v-autocomplete label="Kel. Pelanggan" v-model="selected_company" class="ma-1" :items="xcompanies"
                     :search-input.sync="search_company" auto-select-first hide-details style="font-size:14px" outline
                     no-filter item-text="name" return-object :loading="isLoading" no-data-text="Semua Kel. Pelanggan">
                     <template slot="item" slot-scope="{ item }">
                        <v-list-tile-content>
                           <v-list-tile-title v-text="item.name"></v-list-tile-title>
                        </v-list-tile-content>
                     </template>
                  </v-autocomplete>
               </v-flex>
               <v-flex class="text-xs-right pr-2" xs3>
                  <v-autocomplete label="Pemeriksaan" v-model="selected_filter_test" class="ma-1" :items="filter_tests"
                     :search-input.sync="search_test" auto-select-first hide-details style="font-size:14px" outline
                     no-filter item-text="name" return-object :loading="isLoading" no-data-text="Semua Pemeriksaan">
                     <template slot="item" slot-scope="{ item }">
                        <v-list-tile-content>
                           <v-list-tile-title v-text="item.name"></v-list-tile-title>
                        </v-list-tile-content>
                     </template>
                  </v-autocomplete>
               </v-flex>
            </v-layout>
         </v-card>
         <v-card>
            <v-layout pl-2 pt-2 row>
               <h5>TOTAL PASIEN : <span class="info--text">{{total_patients_all}}</span> ORANG</h5>
            </v-layout>
            <v-layout align-center row>
               <v-flex xs12 pl-2 pr-2 pt-2 pb-2>
                  <v-data-table :headers="headers" :items="patients" :loading="isLoading" hide-actions
                     class="elevation-1">
                     <template slot="items" slot-scope="props">
                        <tr :class="{notlunas: props.item.flaglunas=='N'} ">
                           <td class="text-xs-center pa-2" :class="{'warning':props.item.not_sampled !== 'Y','teal':props.item.not_sampled === 'Y','blue darken-2':props.item.not_sampled === 'R'}" @click="selectMe(props.item)">
                              <v-icon  @click="openDetails(props.item)" title="tampilkan detail" style="cursor:pointer"
                                 dark>more_vert</v-icon>
                           </td>
                           <td class=" text-xs-center pa-2"
                              v-bind:class="{'':isSelected(props.item),'cito':  props.item.T_OrderHeaderIsCito === 'Y'}"
                              @click="selectMe(props.item)">
                              {{ props.item.rownumber}}
                           </td>
                           <td class=" text-xs-left pa-2"
                              v-bind:class="{'':isSelected(props.item),'cito':  props.item.T_OrderHeaderIsCito === 'Y'}"
                              @click="selectMe(props.item)">
                              <span class="font-weight-bold" style="color:#000000">{{ props.item.T_OrderHeaderLabNumber}}</span>
                              <br />
                              <span class="font-weight-bold" style="color:#800000">
                                 {{props.item.external_numbering}}
                              </span>
                           </td>
                           <td class=" text-xs-left pa-2"
                              v-bind:class="{'':isSelected(props.item),'cito':  props.item.T_OrderHeaderIsCito === 'Y'}"
                              @click="selectMe(props.item)">
                              <p class="font-weight-bold mb-0">{{ props.item.patient_fullname}}</p>
                              <p class="mb-0"><kbd>{{props.item.username}}</kbd></p>
                              <p class='mb-0'><kbd>{{props.item.order_datetime}}</kbd></p>
                           </td>
                           <td class="text-xs-left pa-2"
                              v-bind:class="{'':isSelected(props.item),'cito':  props.item.T_OrderHeaderIsCito === 'Y'}"
                              @click="selectMe(props.item)"><span>{{ props.item.M_CompanyName}}</span> : <span class="caption">{{ props.item.M_MouName}}</span>
                           </td>
                           <td class=" text-xs-left pa-2"
                              v-bind:class="{'':isSelected(props.item),'cito':  props.item.T_OrderHeaderIsCito === 'Y'}"
                              @click="selectMe(props.item)" v-html="props.item.dotor_fullname"></td>
                           <td class=" text-xs-left pa-2"
                              v-bind:class="{'':isSelected(props.item),'cito':  props.item.T_OrderHeaderIsCito === 'Y'}"
                              @click="selectMe(props.item)" v-html="(props.item.janji)">
                           </td>
                           <td class="text-xs-left pa-2 "
                              v-bind:class="{'':isSelected(props.item) , 'cito': props.item.T_OrderHeaderIsCito === 'Y'}"
                              @click="selectMe(props.item)" v-html="splittest(props.item.test)">
                           </td>
                           <td class="text-xs-left pa-2"
                              v-bind:class="{'':isSelected(props.item),'cito': props.item.T_OrderHeaderIsCito === 'Y'}"
                              @click="selectMe(props.item)">
                              <v-btn small dark label color="light-blue" v-for="xdelivery in props.item.delivery"
                                 @click="getTimeline(xdelivery)" :title="xdelivery.long_destination" text-color="white"
                                 class="cursor_pointer">
                                 {{xdelivery.delivery_name}}
                              </v-btn>
                           </td>
                           <td class="text-xs-left pa-2"
                              v-bind:class="{'':isSelected(props.item),'cito': props.item.T_OrderHeaderIsCito === 'Y'}"
                              @click="selectMe(props.item)">
                              <span title="total tagihan" style="color:black!important;font-weight:bold">
                                 {{ number_format(props.item.totalbill) }}
                              </span><br>
                              <span title="kurang bayar" v-if="props.item.flaglunas === 'N'">
                                 {{ number_format(props.item.unpaid) }}
                              </span>

                           </td>
                        </tr>
                     </template>
                  </v-data-table>
                  <v-divider></v-divider>
                  <v-layout>
                     <v-flex>
                        <v-pagination style="margin-top:10px;margin-bottom:10px" v-model="curr_page"
                           :length="xtotal_page">
                        </v-pagination>
                     </v-flex>
                     <v-flex>

                     </v-flex>
                  </v-layout>
               </v-flex>
            </v-layout>
         </v-card>
         <one-dialog-alert :status="openalertnopay" :msg="msgalertnopay" @forget-dialog-alert="forgetAlertNoPay()"
            @close-dialog-alert="closeAlertNoPay()"></one-dialog-alert>
         <div class="text-xs-left">
            <v-bottom-sheet persistent v-model="sheet">
               <v-card tile>
                  <v-layout align-center row>
                     <v-flex xs3>
                        <v-btn
                          color="black"
                           flat
                           
                        >
                           {{selected_patient.T_OrderHeaderLabNumber}} / {{selected_patient.external_numbering}}
                        </v-btn>
                     </v-flex>
                     <v-flex xs8>
                        <v-layout row>
                           <v-flex pa-1 v-if="selected_patient.not_sampled === 'Y'" :class="{'xs6':selected_patient.not_sampled !== 'Y','xs4':selected_patient.not_sampled == 'Y'}">
                              <v-btn
                                 @click="patientComing()"
                                 :class="{'warning':selected_patient.not_sampled !== 'Y','teal':selected_patient.not_sampled == 'Y'}"
                                 block
                                 dark
                              >
                                 BAHAN DATANG
                              </v-btn>
                           </v-flex>
                           <v-flex pa-1 :class="{'xs6':selected_patient.not_sampled !== 'Y','xs4':selected_patient.not_sampled == 'Y'}">
                              <v-btn
                                 @click="openBarcode()"
                                 :class="{'warning':selected_patient.not_sampled !== 'Y','teal':selected_patient.not_sampled == 'Y'}"
                                 block
                                 dark
                              >
                                 BARCODE
                              </v-btn>
                           </v-flex>
                           <v-flex pa-1 :class="{'xs6':selected_patient.not_sampled !== 'Y','xs4':selected_patient.not_sampled == 'Y'}">
                              <v-btn
                                  @click="opendialogDob()"
                                :class="{'warning':selected_patient.not_sampled !== 'Y','teal':selected_patient.not_sampled == 'Y'}"
                                 block
                                 dark
                              >
                                 REVISI TANGGAL LAHIR
                              </v-btn>
                           </v-flex>
                        </v-layout>
                     </v-flex>
                     <v-flex text-xs-center xs1>
                        <v-btn @click="sheet = false" icon>
                           <v-icon>close</v-icon>
                        </v-btn>
                     </v-flex>
                  <v-layout>
               </v-card>
            </v-bottom-sheet>
         </div>
      </v-layout>
</template>

<style scoped>
   .notlunas {
      color:#c42d2d;
   }

   .cito {
      color: rgba(255, 255, 255, 0.945);
      background-color: #fb8c0087;
   }

   .citoo {
      color: #c42d2d;
   }

   span.xtd {
      margin-right: 10px;
   }

   .searchbox .v-input.v-text-field .v-input__slot {
      min-height: 40px;
   }

   .searchbox .v-btn {
      min-height: 40px;
   }

   table.v-table tbody td,
   table.v-table tbody th {
      height: 40px;
   }

   table.v-table thead tr {
      height: 40px;
   }

   .v-messages {
      min-height: 0px !important;
   }

   .cursor_pointer {
      cursor: 'pointer' !important;
   }
</style>

<script>
   module.exports = {
      components: {
         'one-dialog-info': httpVueLoader('../../common/oneDialogInfo.vue'),
         'one-dialog-alert': httpVueLoader('../../common/oneDialogAlert.vue')
      },
      mounted() {
         //this.$store.dispatch("patient/searchcompany", this.search_company)
         this.$store.dispatch("patient/search", {
            startdate: this.$store.state.patient.start_date,
            enddate: this.$store.state.patient.end_date,
            search: this.searchnamelab,
            doctorid: this.$store.state.patient.selected_doctor.id,
            doctorcode: this.$store.state.patient.selected_doctor.code,
            companyid: this.$store.state.patient.selected_company.id,
            testid: this.$store.state.patient.selected_filter_test.id,
            current_page: 1,
            lastidx: -1
         })
      },
      methods: {
         updateAlert_success(val) {
            this.$store.commit("patient/update_alert_success", val)
         },
         changeUpdateDOB(value) {
            this.data_patient.M_PatientDOB = value
         },
         updateDOB() {
            var xval = this.$store.state.patient.data_patient
            xval.status = this.show_form_dob
            this.$store.dispatch("patient/updatedob", xval)
         },
         opendialogDob() {
            this.$store.dispatch("patient/getdatadob", this.selected_patient)
         },
         getTimeline(value) {
            this.selected_delivery = value
            console.log(this.selected_delivery)
            if (value.delivery_type_id === '2') {
               this.$store.dispatch("patient/gettimelinedelivery", value)
            }
         },
         changeCbxAll(value) {
            var arr = _.filter(this.barcodes, function (o) {
               return o.type === 'barcode' || o.type === 'formulir'
            })
            this.indeterminatex = false
            arr.forEach((el) => {
               el.chex = value
            })
            var selected = _.filter(arr, function (o) {
               return o.chex;
            })
            this.selected_barcode = selected
         },
         checkTop() {
            var barcodes = _.filter(this.barcodes, function (o) {
               return o.type === 'barcode' || o.type === 'formulir'
            })
            var selected = _.filter(barcodes, function (o) {
               return o.chex;
            })
            this.bar_chx_all = false
            this.indeterminatex = false
            if (selected.length > 0 && barcodes.length === selected.length) {
               this.bar_chx_all = true
               this.indeterminatex = false
            }
            if (selected.length > 0 && barcodes.length > selected.length) {
               this.bar_chx_all = false
               this.indeterminatex = true
            }
            this.selected_barcode = selected
            console.log(selected)
         },
         printSingleBarcode(value) {
            var label = value.T_BarcodeLabBarcode
            if (value.type === 'barcode')
               one_print_barcode_pk(label)
            if (value.type === 'formulir')
               one_print_barcode_formulir(value.id)
            if (value.type === 'nonlab')
               one_print_barcode_amplop_so(value.T_SampleTypeID)
            if (value.type === 'nonlab_group')
               one_print_barcode_amplop_so_group(value.orderid)
         },
         printRobo() {
            var arr = this.barcodes
            var xarrtojoin = []
            _.forEach(arr, function (value) {
               if (value.type === 'barcode') {
                  xarrtojoin.push(value.T_BarcodeLabBarcode)
               }
            })
            if (xarrtojoin.length > 0) {
               one_print_robo(xarrtojoin.join(','))
            }
         },
         printMultipleBarcode() {
            var arr = this.barcodes
            var xarrtojoin = []
            var xformulir = {}
            _.forEach(arr, function (value) {
               if (value.chex && value.type === 'barcode') {
                  xarrtojoin.push(value.T_BarcodeLabBarcode)
               }
               if (value.chex && value.type === 'formulir') {
                  xformulir = value
               }
            })
            if (xarrtojoin.length > 0) {
               one_print_barcode_pk(xarrtojoin.join(','))
            }

            if (!_.isEmpty(xformulir)) {
               one_print_barcode_formulir(xformulir.id)
            }

         },
         openDetails(value) {
            this.$store.commit("patient/update_selected_patient", value)
            this.sheet = true
         },
         openBarcode() {
            this.bar_chx_all = false
            this.indeterminatex = false
            this.dialogbarcode = true
            this.selected_barcode = []
            this.$store.dispatch("patient/getdatabarcodes", this.selected_patient)
         },
         number_format(val) {
            return numeral(val).format('0,0');
         },
         notToday(item) {
            return item.order_date !== moment(new Date()).format('YYYY-MM-DD')
         },
         splittest(inp) {
            if (inp != '') {
               let a_test = inp.split(',')
               let s_test = ''
               for (let i = 0; i < a_test.length; i++) {
                  let test = a_test[i]
                  let a_cito = test.split('^')
                  s_test += '<p class="mb-0 '
                  if (a_cito[1] == 'Y') s_test += 'citoo'
                  s_test += '" >'
                  s_test += a_cito[0] + '</p>'
               }
               return s_test
            } else {
               return ''
            }

         },
         formatDate(date) {
            if (!date) return null

            const [year, month, day] = date.split('-')
            return `${day}-${month}-${year}`
         },
         deFormatedDate(date) {
            if (!date) return null

            const [day, month, year] = date.split('-')
            return `${year}-${month.padStart(2, '0')}-${day.padStart(2, '0')}`
         },
         isSelected(p) {
            return p.T_OrderHeaderID == this.$store.state.patient.selected_patient.T_OrderHeaderID
         },
         isCito(p) {
            return p.cito == 1
         },
         async searchPatient() {
            let inp_no = this.searchnamelab

            this.$store.dispatch("patient/search", {
               startdate: this.$store.state.patient.start_date,
               enddate: this.$store.state.patient.end_date,
               search: inp_no,
               doctorid: this.$store.state.patient.selected_doctor.id,
               doctorcode: this.$store.state.patient.selected_doctor.code,
               companyid: this.$store.state.patient.selected_company.id,
               testid: this.$store.state.patient.selected_filter_test.id,
               current_page: 1,
               lastidx: -1
            })
         },
         selectMe(pat) {
            var patients = this.$store.state.patient.patients
            var idx = _.findIndex(patients, function (o) {
               return o.T_OrderHeaderID == pat.T_OrderHeaderID
            })
            this.$store.commit("patient/update_lastidx", idx)
            this.$store.commit("patient/update_selected_patient", pat)
         },
         closeAlertNoPay() {
            this.$store.commit("patient/update_open_alert_no_pay", false)
         },
         forgetAlertNoPay() {
            var xval = this.$store.state.payment.types
            var valpay = 0
            xval.forEach(function (obj) {
               obj.leftvalue = 0
               obj.rightvalue = 0
            })
            this.$store.commit("payment/update_total_payment", 0)
            this.$store.commit("patient/update_open_alert_no_pay", false)
         },
         patientComing() {
            var prm = this.$store.state.patient.selected_patient
            this.xpromisedialog = true
            //this.$store.dispatch("patient/lookup_promises", prm)
         },
         doSavePromise() {
           
            var prm = {
               data: this.$store.state.patient.selected_patient
            }

            prm.search = {
               startdate: this.$store.state.patient.start_date,
               enddate: this.$store.state.patient.end_date,
               search: this.searchnamelab,
               doctorid: this.$store.state.patient.selected_doctor.id,
               doctorcode: this.$store.state.patient.selected_doctor.code,
               companyid: this.$store.state.patient.selected_company.id,
               testid: this.$store.state.patient.selected_filter_test.id,
               current_page: this.$store.state.patient.current_page,
               lastidx: this.$store.state.patient.lastidx
            }
               
            this.$store.dispatch("patient/savepromises", prm)
            

         },
         thr_search_company: _.debounce(function () {
            this.$store.dispatch("patient/searchcompany", this.search_company)
         }, 2000),
         thr_search_doctor: _.debounce(function () {
            this.$store.dispatch("patient/searchdoctor", this.search_doctor)
         }, 2000),
         thr_search_test: _.debounce(function () {
            this.$store.dispatch("patient/searchtest", this.search_test)
         }, 2000),
      },
      computed: {
         filter_tests: {
            get() {
               return this.$store.state.patient.filter_tests
            },
            set(val) {
               this.$store.commit("patient/update_filter_tests", val)
            }
         },
         selected_filter_test: {
            get() {
               return this.$store.state.patient.selected_filter_test
            },
            set(val) {
               this.$store.commit("patient/update_selected_filter_test", val)
                this.searchPatient()
            }
            
         },
         bahan_belum(){
            if(!_.isEmpty(this.selected_patient) && this.selected_patient.bahan_belum){
               return this.selected_patient.bahan_belum
            }
            else
            return []
         },
         snackbar: {
            get() {
               return this.$store.state.patient.alert_success
            },
            set(val) {
               this.$store.commit("patient/update_alert_success", val)
            }
         },
         msgsnackbar() {
            return this.$store.state.patient.msg_success
         },
         data_patient: {
            get() {
               return this.$store.state.patient.data_patient
            },
            set(val) {
               this.$store.commit("patient/update_data_patient", val)
            }
         },
         show_form_dob: {
            get() {
               return this.$store.state.patient.show_form_dob
            },
            set(val) {
               this.$store.commit("patient/update_show_form_dob", val)
            }
         },
         dialog_update_dob: {
            get() {
               return this.$store.state.patient.dialog_update_dob
            },
            set(val) {
               this.$store.commit("patient/update_dialog_update_dob", val)
            }
         },
         timeline_delivery: {
            get() {
               return this.$store.state.patient.timeline_delivery
            },
            set(val) {
               this.$store.commit("patient/update_timeline_delivery", val)
            }
         },
         dialog_timeline_delivery: {
            get() {
               return this.$store.state.patient.dialog_timeline_delivery
            },
            set(val) {
               this.$store.commit("patient/update_dialog_timeline_delivery", val)
            }
         },
         xcompanies() {
            return this.$store.state.patient.companies
         },
         selected_company: {
            get() {
               return this.$store.state.patient.selected_company
            },
            set(val) {
               this.$store.commit("patient/update_selected_company", val)
               this.searchPatient()
            }
         },
         xdoctors() {
            return this.$store.state.patient.doctors
         },
         selected_doctor: {
            get() {
               return this.$store.state.patient.selected_doctor
            },
            set(val) {
               this.$store.commit("patient/update_selected_doctor", val)
               this.searchPatient()
            }
         },
         filterComputedDateFormattedStart() {
            return this.formatDate(this.xdatestart)
         },
         filterComputedDateFormattedEnd() {
            return this.formatDate(this.xdateend)
         },
         xdatestart: {
            get() {
               return this.$store.state.patient.start_date
            },
            set(val) {
               this.$store.commit("patient/update_start_date", val)
               this.searchPatient()
            }
         },
         xdateend: {
            get() {
               return this.$store.state.patient.end_date
            },
            set(val) {
               this.$store.commit("patient/update_end_date", val)
               this.searchPatient()
            }
         },
         dialogbarcode: {
            get() {
               return this.$store.state.patient.dialog_barcode
            },
            set(val) {
               this.$store.commit("patient/update_dialog_barcode", val)
            }
         },
         barcodes: {
            get() {
               return this.$store.state.patient.barcodes
            },
            set(val) {
               this.$store.commit("patient/update_barcodes", val)
            }
         },
         total_patients_all() {
            return this.$store.state.patient.total_patients_all
         },
         xpromisedialog: {
            get() {
               return this.$store.state.patient.promise_dialog
            },
            set(val) {
               this.$store.commit("patient/update_promise_dialog", val)
            }
         },
         xpromises: {
            get() {
               return this.$store.state.patient.promises
            },
            set(val) {
               this.$store.commit("patient/update_promises", val)
            }
         },
         xenddate: {
            get() {
               return this.$store.state.patient.end_date
            },
            set(val) {
               this.$store.commit("patient/update_end_date", val)
               this.searchPatient()
            }
         },
         searchnamelab: {
            get() {
               return this.$store.state.patient.search
            },
            set(val) {
               this.$store.commit("patient/update_search", val)
               //this.searchPatient()
            }
         },
         statuses() {
            return this.$store.state.patient.statuses
         },
         status: {
            get() {
               return this.$store.state.patient.selected_status
            },
            set(val) {
               this.$store.commit("patient/update_selected_status", val)
               this.searchPatient()
            }
         },
         startDateFormatted() {
            return this.formatDate(this.xstartdate)
         },
         endDateFormatted() {
            return this.formatDate(this.xenddate)
         },
         isLoading() {
            return this.$store.state.patient.search_status == 1
         },
         patients() {
            return this.$store.state.patient.patients
         },
         selected_patient: {
            get() {
               let sp = this.$store.state.patient.selected_patient
               if (sp == undefined) return {}
               if (!sp.hasOwnProperty('T_OrderHeaderLabNumber')) {
                  sp["T_OrderHeaderLabNumber"] = ""
                  sp["M_PatientName"] = ""
               }
               return sp
            },
            set(val) {
               this.$store.commit("patient/update_selected_patient", val)
            }
         },
         openalertnopay: {
            get() {
               return this.$store.state.patient.open_alert_no_pay
            },
            set(val) {
               this.$store.commit("patient/update_open_alert_no_pay", false)
            }
         },
         msgalertnopay() {
            return this.$store.state.patient.msg_alert_no_pay
         },
         curr_page: {
            get() {
               return this.$store.state.patient.current_page
            },
            set(val) {
               this.$store.commit("patient/update_current_page", val)
               this.$store.dispatch("patient/search", {
                  startdate: this.$store.state.patient.start_date,
                  enddate: this.$store.state.patient.end_date,
                  search: this.searchnamelab,
                  search: this.searchnamelab,
                  doctorid: this.$store.state.patient.selected_doctor.id,
                  companyid: this.$store.state.patient.selected_company.id,
                  testid: this.$store.state.patient.selected_filter_test.id,
                  current_page: val,
                  lastidx: -1
               })
            }
         },
         xtotal_page: {
            get() {
               return this.$store.state.patient.total_page
            },
            set(val) {
               this.$store.commit("patient/update_total_page", val)
            }
         },

         xtotal_patients: {
            get() {
               return this.$store.state.patient.total_patient
            },
            set(val) {
               this.$store.commit("patient/update_total_patient", val)
            }
         },

         xtotalpatients() {
            return this.$store.state.patient.total_patients
         },
         xtotalfilterpatients() {
            return this.$store.state.patient.total_filter_patients
         },
         filters: {
            get() {
               return this.$store.state.patient.filters
            },
            set(val) {
               this.$store.commit("patient/update_filters", val)
            }
         },
         selected_filter: {
            get() {
               return this.$store.state.patient.selected_filter
            },
            set(val) {
               this.$store.commit("patient/update_selected_filter", val)
               this.searchPatient()
            }
         },
      },
      watch: {
         search_company(val, old) {
            if (val == old) return;
            if (!val) return;
            if (val.length < 1) return;
            if (this.$store.state.patient.update_autocomplete_status == 1) return;
            this.thr_search_company();
         },
         search_doctor(val, old) {
            if (val == old) return;
            if (!val) return;
            if (val.length < 1) return;
            if (this.$store.state.patient.update_autocomplete_status == 1) return;
            this.thr_search_doctor();
         },
         search_test(val, old) {
            if (val == old) return;
            if (!val) return;
            if (val.length < 1) return;
            if (this.$store.state.patient.update_autocomplete_status == 1) return;
            this.thr_search_test();
         }
      },
      data() {
         return {
            selected_delivery: {},
            search_company: '',
            search_test: '',
            menufilterdatestart: false,
            menufilterdateend: false,
            date: new Date().toISOString().substr(0, 10),
            items: [],
            menustartdate: false,
            menuenddate: false,
            errors: [],
            sheet: false,
            indeterminatex: false,
            checkednotall: false,
            bar_chx_all: false,
            selected_barcode: [],
            dialogtimeline: false,
            search_doctor: '',
            headers: [{
                  text: "",
                  align: "center",
                  sortable: false,
                  value: "lab",
                  width: "2%",
                  class: "pa-2 blue darken-2 white--text"
               },
               {
                  text: "NO",
                  align: "center",
                  sortable: false,
                  value: "lab",
                  width: "5%",
                  class: "pa-2 blue darken-2 white--text"
               },
               {
                  text: "NO REG",
                  align: "center",
                  sortable: false,
                  value: "lab",
                  width: "8%",
                  class: "pa-2 blue darken-2 white--text"
               },
               {
                  text: "NAMA",
                  align: "center",
                  sortable: false,
                  value: "name",
                  width: "15%",
                  class: "pa-2 blue darken-2 white--text"
               },
               {
                  text: "AGREEMENT",
                  align: "center",
                  sortable: false,
                  value: "name",
                  width: "15%",
                  class: "pa-2 blue darken-2 white--text"
               },
               {
                  text: "DOKTER",
                  align: "center",
                  sortable: false,
                  value: "name",
                  width: "15%",
                 class: "pa-2 blue darken-2 white--text"
               },
               {
                  text: "JANJI HASIL",
                  align: "center",
                  sortable: false,
                  value: "status",
                  width: "12%",
                  class: "pa-2 blue darken-2 white--text"
               },

               {
                  text: "PEMERIKSAAN",
                  align: "center",
                  sortable: false,
                  value: "status",
                  width: "20%",
                 class: "pa-2 blue darken-2 white--text"
               },

               {
                  text: "PENGIRIMAN",
                  align: "center",
                  sortable: false,
                  value: "status",
                  width: "10%",
                  class: "pa-2 blue darken-2 white--text"
               },

               {
                  text: "TOTAL",
                  align: "center",
                  sortable: false,
                  value: "status",
                  width: "5%",
                  class: "pa-2 blue darken-2 white--text"
               }
            ],
         }
      }
   }
</script>
