component, master loket, edit loket

pages/Setting/Master-Loket.vue

@@ -0,0 +1,61 @@
+<template>
+  <v-container>
+    <v-card>
+      <v-card-title class="d-flex justify-space-between align-center">
+        <span>Master Loket</span>
+        <v-btn color="primary" @click="tambahLoket">Tambah Baru</v-btn>
+      </v-card-title>
+      <TabelData
+        :headers="loketHeaders"
+        :items="loketData"
+        title="Master Loket"
+      >
+        <template #actions="{ item }">
+          <v-btn small color="info" @click="editLoket(item)" class="mr-2">Edit</v-btn>
+          <v-btn small color="error" @click="deleteLoket(item)">Delete</v-btn>
+        </template>
+      </TabelData>
+    </v-card>
+  </v-container>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+import TabelData from '../../components/TabelData.vue';
+import { useRouter } from 'vue-router';
+
+const router = useRouter();
+
+const loketHeaders = ref([
+  { title: 'No', value: 'no' },
+  { title: 'Nama Loket', value: 'namaLoket' },
+  { title: 'Kuota', value: 'kuota' },
+  { title: 'Pelayanan', value: 'pelayanan' },
+  { title: 'Pembayaran', value: 'pembayaran' },
+  { title: 'Keterangan', value: 'keterangan' },
+  { title: 'Aksi', value: 'aksi', sortable: false }, // 'value' harus 'actions'
+]);
+
+// Master-Loket.vue
+const loketData = ref([
+  { id: 1, no: 1, namaLoket: 'Loket 1', kuota: 500, pelayanan: ['RADIOTERAPI', 'REHAB MEDIK', 'TINDAKAN'], pembayaran: 'JKN', keterangan: 'ONLINE' },
+  { id: 2, no: 2, namaLoket: 'Loket 2', kuota: 666, pelayanan: ['JIWA', 'SARAF'], pembayaran: 'JKN', keterangan: 'ONLINE' },
+  { id: 3, no: 3, namaLoket: 'Loket 3', kuota: 666, pelayanan: ['ANESTESI', 'JANTUNG'], pembayaran: 'JKN', keterangan: 'ONLINE' },
+  { id: 4, no: 4, namaLoket: 'Loket 4', kuota: 3676, pelayanan: ['KULIT KELAMIN', 'PARU'], pembayaran: 'JKN', keterangan: 'ONLINE' },
+]);
+
+const editLoket = (item) => {
+  router.push({ path: `/Setting/Edit-Loket/${item.id}` });
+};
+
+const deleteLoket = (item) => {
+  const index = loketData.value.findIndex(loket => loket.id === item.id);
+  if (index !== -1) {
+    loketData.value.splice(index, 1);
+  }
+};
+
+const tambahLoket = () => {
+  router.push({ path: '/Setting/Tambah-Loket' });
+};
+</script>