Merge branch 'master' of https://github.com/davila-erdianita/vuetify3 into ahdan-punya

pages/satu_rssa/jadwal_dokter/index.vue

@@ -0,0 +1,75 @@
+<template>
+    <div>
+        <v-app>
+            <v-main>
+                <v-container>
+                    <v-row>
+                        <v-col><h3>Jadwal Dokter</h3></v-col>
+                    </v-row>
+                    <v-card title="" flat class="mx-auto my-8 pt-3" elevation="3" min-width="300">
+                        <div class="d-inline-flex ml-5 mb-3">
+                            <v-text-field v-model="search" label="Search" prepend-inner-icon="mdi-magnify" variant="outlined" hide-details single-line class="rounded elevation-1"  width="500px"></v-text-field>
+                        </div>
+                            <v-data-table class="elevation-1 px-5" :headers="headers" :items="JadwalDokter" F :search="search" hide-default-header>
+                                <template v-slot:body="{items}">
+                                    <!-- <thead>-->
+                                        <tr>
+                                            <th>Hari</th>
+                                            <th>Waktu</th>
+                                            <th>Spesialis</th>
+                                            <th>Subspesialis</th>
+                                            <th>Namalengkap</th>
+                                        </tr>
+                                    <!-- </thead>  -->
+                                    <!-- <tbody> -->
+                                        <tr v-for="(item,index) in items" :key="index">
+                                            <td v-if="index===0||item.hari !== items[index-1].hari">{{ item.hari }}</td>
+                                            <td v-else></td>
+                                            <!-- <td>{{ item.hari }}</td> -->
+                                            <td>{{ item.waktu }}</td>
+                                            <td v-if="index===0||item.spesialis !== items[index-1].spesialis">{{ item.spesialis }}</td>
+                                            <td v-else></td>
+                                            <!-- <td>{{ item.spesialis }}</td> -->
+                                            <td v-if="index===0||item.subspesialis !== items[index-1].subspesialis">{{ item.subspesialis }}</td>
+                                            <td v-else></td>
+                                            <!-- <td>{{ item.subspesialis }}</td> -->
+                                            <td>{{ item.namalengkap }}</td>
+                                        </tr>
+                                    <!-- </tbody> -->
+                                </template>
+                            </v-data-table>
+                    </v-card>
+                </v-container>
+            </v-main>
+        </v-app>
+    </div>
+</template>
+
+<script setup>
+import { ref, onMounted } from 'vue';
+import { storeToRefs } from 'pinia';
+
+const {JadwalDokter} = storeToRefs(useJadwalDokter());
+const {loadJadwalDokter} = useJadwalDokter();
+const dataJadwalDokter = ref([]);
+const search = ref("");
+const headers = [
+    {
+        align:'start',
+        key:'name',
+        sortable:false,
+    },
+    {key:'hari', title:'hari'},
+    {key:'waktu', title:'waktu'},
+    {key:'spesialis', title:'spesialis'},
+    {key:'subspesialis', title:'subspesialis'},
+    {key:'namalengkap', title:'namalengkap'},
+]
+
+
+onMounted(()=> {
+    loadJadwalDokter();
+    // console.log(JadwalDokter)
+    // console.log(hari)
+})
+</script>