<template>
  <v-app-bar>
        <v-app-bar-title>Hello</v-app-bar-title>
        <v-spacer />
        <v-btn @click="toggleTheme">
          <v-icon>ph:sun</v-icon>
          toggle thema</v-btn>
      </v-app-bar>


  <div class="text-center pa-4" >
    <v-dialog
      v-model="dialog.dialog"
      max-width="850"
    >
      <template v-slot:activator="{ props: activatorProps }">
        <v-btn v-bind="activatorProps">
          Open Dialog
        </v-btn>
      </template>
      <VCard width="850" class="ma-auto" >
            <VCardTitle class="text-center">
               
            </VCardTitle>
            <VCardText>
                <VForm 
                ref="form"
               >
                    <v-container>
                        <v-row justify="space-around">
                            <v-col cols="12" md="6">
                                <v-text-field
                                :rules="[v => !!v || '*ID belum terisi']"
                                name="idxdaftar"
                             
                                label="idx daftar"
                                ></v-text-field>
                            </v-col>
                            <v-col cols="12" md="6">
                                <v-text-field
                                :rules="[v => !!v || '*No SEP belum terisi']"
                                name="noSEP"
                               
                                label="No.SEP"
                                ></v-text-field>
                            </v-col>
                        </v-row>
                        <v-row>
                            <v-col cols="12" md="6">
                                <v-text-field
                                :rules="[v => !!v || '*kode HFIS belum terisi']"
                                name="kodeHFIS"
                        
                                label="kode HFIS"
                                ></v-text-field>
                            </v-col>
                            <v-col cols="12" md="6">
                                <v-text-field
                                :rules="[v => !!v || '*ID dokter belum terisi']"
                                name="id_dokter"
                              
                                label="ID dokter"
                                ></v-text-field>
                            </v-col>
                        </v-row>
                        <v-row>
                            <v-col cols="12" md="6">
                                <v-text-field
                                :rules="[v => !!v || '*kode Poli belum terisi']"
                                name="kodePoli"
                              
                                label="kode Poli"
                                ></v-text-field>
                            </v-col>
                            <v-col cols="12" md="6">
                                <v-text-field
                                :rules="[v => !!v || '*Sub spesialis belum terisi']"
                                name="subspesialis"
                              
                                label="sub spesialis"
                                ></v-text-field>
                            </v-col>
                        </v-row>
                        <v-row>
                            <v-col cols="12" md="6">
                                <v-text-field
                                :rules="[v => !!v || '*tanggal rencana kontrol belum terisi']"
                                name="tglRencanaKontrol"
                               
                                label="tanggal rencana kontrol"
                                ></v-text-field>
                            </v-col>
                            <v-col cols="12" md="6">
                                <v-text-field
                                :rules="[v => !!v || '*Nama Dokter belum terisi']"
                                name="user"
                               
                                label="Nama Dokter"
                                ></v-text-field>
                            </v-col>
                        </v-row>
                        <v-row>
                            <v-col cols="12" md="6">
                                <v-text-field
                                :rules="[v => !!v || '*kode diagnosa belum terisi']"
                                name="kode_diagnosa"
                               
                                label="kode diagnosa"
                                ></v-text-field>
                            </v-col>
                            <v-col cols="12" md="6">
                                <v-text-field
                                :rules="[v => !!v || '*Nama diagnosa belum terisi']"
                                name="nama_diagnosa"
                               
                                label="Nama Diagnosa"
                                ></v-text-field>
                            </v-col>
                        </v-row>
                        <v-row>
                            <v-col cols="12" md="6">
                                <v-text-field
                                :rules="[v => !!v || '*tipe surkon belum terisi']"
                                name="tipe_surkon"
                                
                                label="tipe surkon"
                                ></v-text-field>
                            </v-col>
                            <v-col cols="12" md="6">
                                <v-text-field
                                :rules="[v => !!v || '*tipe rawat belum terisi']"
                                name="tipe_rawat"
                               
                                label="tipe rawat"
                              
                                ></v-text-field>
                            </v-col>
                        </v-row>
                        <v-row>
                            <v-col col="12" md="6">
                                <VBtn 
                                variant="tonal"
                                to="/"
                                block>
                                K E M B A L I
                            </VBtn>
                            </v-col>
                            <v-col col="12" md="6">
                                <VBtn 
                                variant="tonal"
                                type="submit"
                                block>
                                S I M P A N
                            </VBtn>
                            </v-col>
                </v-row>
                    </v-container>
                </VForm>
            </VCardText>
        </VCard>
    </v-dialog>
  </div>
  
</template>

<script lang="ts" setup>
import { ref } from "vue";
import { useTheme } from "vuetify";
import { storeToRefs } from "pinia";


const dialog = reactive({
  dialog:false
})

const aksi = () => {
  console.log("data berhasil di hapus")
  dialog.dialog=false
}

</script>

<style>

</style>