contactus.vue 2.85 KB
Newer Older
Azrul Amir's avatar
Azrul Amir committed
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98
<template>
  <q-page >
    <div class="q-ma-md">
      <q-btn  class="full-width" color="green" icon="chat" label="Chat With Librarian"  />
    </div>

    <div class="q-ma-md text-center text-weight-medium">
      Corporate Department<br>
      Perpustakaan Tun Abdul Razak<br>
      40450 Shah Alam<br>
      Selangor Darul Ehsan, Malaysia
    </div>

    <div class="q-pa-md">
      <q-list bordered separator>
        <q-item clickable v-ripple>
          <q-item-section avatar>
            <q-avatar color="dark" text-color="white" icon="phone" />
          </q-item-section>
          <q-item-section>Customer Services</q-item-section>
        </q-item>

        <q-item clickable v-ripple>
          <q-item-section avatar>
            <q-avatar color="dark" text-color="white" icon="phone" />
          </q-item-section>
          <q-item-section>
            <q-item-label>Consultation Services 1</q-item-label>
          </q-item-section>
        </q-item>

        <q-item clickable v-ripple>
          <q-item-section avatar>
            <q-avatar color="dark" text-color="white" icon="phone" />
          </q-item-section>
          <q-item-section>
            <q-item-label>Consultation Services 2</q-item-label>
          </q-item-section>
        </q-item>
      </q-list>
    </div>

    <div class="q-pa-md">
      <q-list bordered separator >
        <q-item clickable v-ripple>
          <q-item-section avatar>
            <q-avatar color="red" text-color="white" icon="mail" />
          </q-item-section>
          <q-item-section>korporatptar@uitm.edu.my</q-item-section>
        </q-item>

        <q-item clickable v-ripple>
          <q-item-section avatar>
            <q-avatar color="blue" text-color="white" icon="send" />
          </q-item-section>
          <q-item-section>
            <q-item-label>Join Channel @UiTMLibrary</q-item-label>
          </q-item-section>
        </q-item>

        <q-item clickable v-ripple>
          <q-item-section avatar>
            <q-avatar color="green" text-color="white" icon="chat" />
          </q-item-section>
          <q-item-section>
            <q-item-label>Message us on Whatsapp</q-item-label>
          </q-item-section>
        </q-item>
      </q-list>
    </div>

    <div class="q-mt-md">
      <q-btn color="dark" class="full-width" label="Connect With Us" />
    </div>

    <div class="q-mt-md">
      <q-list bordered separator>

        <q-item clickable v-ripple>
          <q-item-section avatar>
            <q-avatar color="blue" text-color="white" icon="facebook" />
          </q-item-section>
          <q-item-section>
            <q-item-label>Facebook</q-item-label>
            <q-item-label caption lines="1">/KetuaPustakawanUiTM</q-item-label>

          </q-item-section>
        </q-item>
      </q-list>
    </div>
  </q-page>
</template>

<script>
export default {
  // name: 'PageName',
}
</script>