<template>
    <div>
        <v-main>
          <v-container>
               <v-card title="List Kunjungan pasien" flat>
           
        
        <v-text-field v-model="search" label="Search" prepend-inner-icon="mdi-magnify" variant="outlined" hide-details single-line class="rounded elevation-1"></v-text-field>
        <v-data-table class="elevation-1" :headers="headers" :items="surkon.list_data" F :search="search">
                    </v-data-table>
                    
                  </v-card>
                </v-container>
              </v-main> 
            </div>
          
            
</template>
<script setup>

import { ref, reactive } from "vue";
import Swal from "sweetalert2";
import { storeToRefs } from "pinia";



const noRM = ref('');
const noSEP = ref('');
const tanggal_awal = ref('');
const tanggal_akhir = ref('');
const poliklinik = ref('');

// const itemsPerPage= 5;
const search = ref("");
const headers = [
  {
    align: 'start',
    key: 'name',
    sortable: false,
  },
  { key: 'Nomor_surat_kontrol', title: 'Tanggal Masuk' },
  { key: 'Nomor_sep', title: 'Jam Masuk' },
  { key: 'Tanggal_cetak_surat_kontrol', title: 'Nomer Rekam Medik' },
  { key: 'Tanggal_rencana_kontrol', title: 'Nama' },
  { key: 'No_rm', title: 'Umur' },
  { key: '', title: 'Jenis Kelamin' },
  { key: '', title: 'Ruang' },
  { key: '', title: 'Dpjp' },
];


const payload = {
  
    no_rm: "",
    no_sep: "",
    poliklinik: "",
    tanggal_awal: "",
    tanggal_akhir: "",
    tipe_surkon : "1",
    offset: "0",
  };

  const { surkon } = storeToRefs(useSurkonStorePost());
  const { loadSurKon } = useSurkonStorePost();


 const { subspesialis,loadSubspesialisData } = useSubspesialisStore();
  const headers2 = [
  {
    align: 'start',
    key: 'name',
    sortable: false,
  },
  { key: 'id', title: 'ID' },
  { key: 'Kode', title: 'Kode' },
  { key: 'Subspesialis', title: 'Subspesialis' },
  { key: 'FK_daftar_spesialis_ID', title: 'FK_daftar_spesialis_ID' },
  { key: 'Spesialis', title: 'Spesialis' },
  { text: "", value: "action" },
];


  const form_proses = async() => {
    payload.no_rm = noRM._value;
    payload.no_sep = noSEP._value;
    payload.tanggal_awal = tanggal_awal._value;
    payload.tanggal_akhir = tanggal_akhir._value;
    payload.poliklinik = poliklinik._value.toString();
    Swal.fire({

      title: 'Berhasil Menampilkan Data' ,
      icon: 'success',
      showConfirmButton: false,
      timer: 1000,
    })
    
    loadSurKon(payload);
  }
  

  onMounted(() => {
    loadSubspesialisData();
  });

  const dataedit = reactive({
    idxdaftar: '',
    noSEP: '',
    kodeHFIS: '',
    id_dokter: '',
    kodePoli: '',
    subspesialis: '',
    tglRencanaKontrol: '',
    user: '',
    kode_diagnosa: '',
    nama_diagnosa: '',
    tipe_surkon: '',
    tipe_rawat: '',
}) 
  const proses_edit = (item)=>{
    const {data_edit} = storeToRefs(useSurkonStorePost());
    
    const { proses_edit } = useSurkonStorePost();
    proses_edit(item);
    var aksi = false;
    watchEffect(() => {
    if (data_edit.value) {
        aksi=true;
        dataedit.idxdaftar = data_edit.value.Idx_daftar || '';
        dataedit.noSEP = data_edit.value.Nomor_sep || '';
        dataedit.kodeHFIS = data_edit.value.kodeHFIS || '';//?
        dataedit.id_dokter = data_edit.value.id_dokter || '';
        dataedit.kodePoli = data_edit.value.Kode_poli || '';
        dataedit.subspesialis = data_edit.value.Subspesialis || '';
        dataedit.tglRencanaKontrol = data_edit.value.Tanggal_rencana_kontrol || '';
        dataedit.user = data_edit.value.NamaDokter || '';
        dataedit.kode_diagnosa = data_edit.value.Kode_diagnosa || '';
        dataedit.nama_diagnosa = data_edit.value.Nama_diagnosa || '';
        dataedit.tipe_surkon = data_edit.value.Tipe_SurKon || '';
        dataedit.tipe_rawat = data_edit.value.tipe_rawat || '';//?
    }
})
}



const dialog = ref(false);
const hapusData = ref('');

const modal_hapus = (item) => {
 hapusData.value = item; 


}

const proses_hapus = () => {
  console.log("proses hapus")
  console.log(hapusData.value)
  // console.log(hapusData.value.id)
  dialog.dialog = false;
}
const tambah = reactive({
  dialog:false
})


</script>
