InputDataBuku

<template xmlns:v-slot="http://www.w3.org/1999/XSL/Transform">
  <q-page padding class="items-center-justify-center bg-grey-3">
    <q-card flat class="bg-white q-pa-md">
      <span class="text-h5 text-weight-light q-pa-md">
        <span class="text-blue-grey-14">Tambah Data Buku</span>
      </span>
      <div class="q-pa-md">
        <q-form
          class="q-gutter-md"
        >

          <q-input
            label="Judul Buku"
            lazy-rules
            color="teal"
            v-model="judulBuku"
            :rules="[
            val => val !== null && val !== '' || 'Nama Poktan Dibutuhkan'
            ]">
            <template v-slot:append>
              <q-icon name="person"/>
            </template>
          </q-input>

          <div>
            <q-btn
              unelevated
              icon="add"
              label="Tambah Data Poktan"
              style="height: 50px"
              color="teal-6"/>
          </div>
        </q-form>
      </div>
    </q-card>
  </q-page>
</template>

<script>
export default {
  data () {
    return {
      judulBuku: null
    }
  }
}
</script>

<style scoped>

</style>