<template>
  
    <v-dialog
      v-model="dialog"
      width="75%"
      persistent
    >
      <!-- <v-btn
        color="blue"
        slot="activator"
        dark
        @click="search"
        class="one-btn-icon ma-1"
      >
        <span class="icon-search"></span>
      </v-btn> -->

      <v-card>
        <v-card-title
            class="red subheading  white--text pt-2 pb-2"
            primary-title
            align-center
            >
            <span class="font-weight-thin">LISTING PASIEN</span>
         </v-card-title>
        <v-card-text class="pt-2 pb-2">
          <patient-search-result></patient-search-result>
        </v-card-text>
        <v-divider></v-divider>

        <v-card-actions>
          <v-spacer></v-spacer>
          <v-btn
            color="grey"
            flat
            @click="dialog = false"
          >
            Tutup
          </v-btn>
        </v-card-actions>
      </v-card>
    </v-dialog>
  
</template>

<style scoped>
.one-btn-icon { font-size: 1.5em; height: 42px; }
</style>

<script>
module.exports = {
    components : {
        'patient-search-result': httpVueLoader('./patientSearchResult.vue')
    },
    methods : {
       search: function() {
          this.$store.dispatch('patient/search')
       }
    },
    computed : {
       dialog: {
          get() {
             return this.$store.state.patient.search_dialog_is_active;
          },
          set(val) {                
             this.$store.commit('patient/update_search_dialog_is_active',val);
          }
       }
    },

    watch : {
    }
}
</script>
