var oneListPatientComponent= {
  template: `
  <v-container>
      <v-layout>
  <v-data-table
     v-model="selected"
     :headers="headers"
     :items="desserts"
     :pagination.sync="pagination"
     select-all
     item-key="name"
     class="elevation-1"
   >
     <template slot="headers" slot-scope="props">
       <tr>
         <th>
           <v-checkbox
             :input-value="props.all"
             :indeterminate="props.indeterminate"
             primary
             hide-details
             @click.stop="toggleAll"
           ></v-checkbox>
         </th>
         <th
           v-for="header in props.headers"
           :key="header.text"
           :class="['column sortable', pagination.descending ? 'desc' : 'asc', header.value === pagination.sortBy ? 'active' : '']"
           @click="changeSort(header.value)"
         >
           <v-icon small>arrow_upward</v-icon>
           {{ header.text }}
         </th>
       </tr>
     </template>
     <template slot="items" slot-scope="props">
       <tr :active="props.selected" @click="props.selected = !props.selected">
         <td>
           <v-checkbox
             :input-value="props.selected"
             primary
             hide-details
           ></v-checkbox>
         </td>
         <td>{{ props.item.name }}</td>
         <td class="text-xs-right">{{ props.item.calories }}</td>
         <td class="text-xs-right">{{ props.item.fat }}</td>
         <td class="text-xs-right">{{ props.item.carbs }}</td>

       </tr>
     </template>
   </v-data-table>
   </v-layout>
   </v-container>

  `,
  data: function() {
    return {
      pagination: {
       sortBy: 'name'
     },
     selected: [],
     headers: [
       {
         text: 'Pemeriksaan',
         align: 'left',
         value: 'name'
       },
       { text: 'Harga', value: 'calories' },
       { text: 'Diskon', value: 'fat' },
       { text: 'Total (g)', value: 'carbs' },

     ],
     desserts: [
       {
         name: 'Frozen Yogurt',
         calories: 159,
         fat: 6.0,
         carbs: 24,

       },
       {
         name: 'Ice cream sandwich',
         calories: 237,
         fat: 9.0,
         carbs: 37,

       },
       {
         name: 'Eclair',
         calories: 262,
         fat: 16.0,
         carbs: 23,

       },
       {
         name: 'Cupcake',
         calories: 305,
         fat: 3.7,
         carbs: 67,

       },
       {
         name: 'Gingerbread',
         calories: 356,
         fat: 16.0,
         carbs: 49,

       },
       {
         name: 'Jelly bean',
         calories: 375,
         fat: 0.0,
         carbs: 94,

       },
       {
         name: 'Lollipop',
         calories: 392,
         fat: 0.2,
         carbs: 98,

       },
       {
         name: 'Honeycomb',
         calories: 408,
         fat: 3.2,
         carbs: 87,

       },
       {
         name: 'Donut',
         calories: 452,
         fat: 25.0,
         carbs: 51,

       },
       {
         name: 'KitKat',
         calories: 518,
         fat: 26.0,
         carbs: 65,

       }
     ]

    };
  },
  methods: {
      validate () {
        if (this.$refs.form.validate()) {
          this.snackbar = true
        }
      },
      reset () {
        this.$refs.form.reset()
      },
      resetValidation () {
        this.$refs.form.resetValidation()
      }
  }
};

export { oneListPatientComponent };