<template>
 
    <VContainer class="central">
        <v-alert
            class="mb-5"
            v-model="alert.alert"
            closable
            type="success"
        >
        This is a success alert that is closable.
        </v-alert>
        <VCard width="850" class="ma-auto">
            <VCardTitle class="text-center">
                {{ title }}
            </VCardTitle>
            <VCardText>
                <VForm 
                ref="form"
                @submit.prevent="form_proses">
                    <v-container>
                        <v-row justify="space-around">
                            <v-col cols="12" md="6">
                                <v-text-field
                                :rules="[v => !!v || '*ID belum terisi']"
                                name="idxdaftar"
                                v-model="payload.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"
                                v-model="payload.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"
                                v-model="payload.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"
                                v-model="payload.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"
                                v-model="payload.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"
                                v-model="payload.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"
                                v-model="payload.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"
                                v-model="payload.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"
                                v-model="payload.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"
                                v-model="payload.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"
                                v-model="payload.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"
                                v-model="payload.tipe_rawat"
                                label="tipe rawat"
                                v-if="aksi == true"
                                ></v-text-field>
                            </v-col>
                        </v-row>
                        <v-row>
                            <v-col col="12" md="6">
                                <VBtn 
                                variant="tonal"
                                to="/Surat-Kontrol"
                                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>
    </VContainer>
</template>

<script setup lang="ts">
import { ref, reactive, watchEffect } from "vue";
import { useTheme } from "vuetify";
import { VForm } from 'vuetify/components';
import { storeToRefs } from "pinia";
import {useSubspesialisStorePost} from "@/stores/users"

const theme = useTheme();

function toggleTheme () {
  theme.global.name.value = theme.global.current.value.dark ? 'light' : 'myTheme';
}

// const {idxdaftar} = storeToRefs(useSubspesialisStore());
// function handleSubmit() {
      
//     }

const alert = reactive({
    alert:false
})


const payload = reactive({
    idxdaftar: '',
    noSEP: '',
    kodeHFIS: '',
    id_dokter: '',
    kodePoli: '',
    subspesialis: '',
    tglRencanaKontrol: '',
    user: '',
    kode_diagnosa: '',
    nama_diagnosa: '',
    tipe_surkon: '',
    tipe_rawat: '',
}) 


const load = ref(false);
const { surkon } = storeToRefs(useSurkonStorePost());
const { simpan_SurKon } = useSurkonStorePost();


const {data_edit} = storeToRefs(useSurkonStorePost());
console.log(data_edit.value)

var aksi = false;
watchEffect(() => {
    if (data_edit.value) {
        aksi=true;
        payload.idxdaftar = data_edit.value.Idx_daftar || '';
        payload.noSEP = data_edit.value.Nomor_sep || '';
        payload.kodeHFIS = data_edit.value.kodeHFIS || '';//?
        payload.id_dokter = data_edit.value.id_dokter || '';
        payload.kodePoli = data_edit.value.Kode_poli || '';
        payload.subspesialis = data_edit.value.Subspesialis || '';
        payload.tglRencanaKontrol = data_edit.value.Tanggal_rencana_kontrol || '';
        payload.user = data_edit.value.user || '';//?
        payload.kode_diagnosa = data_edit.value.Kode_diagnosa || '';
        payload.nama_diagnosa = data_edit.value.Nama_diagnosa || '';
        payload.tipe_surkon = data_edit.value.Tipe_SurKon || '';
        payload.tipe_rawat = data_edit.value.tipe_rawat || '';//?
    }
})

const form_proses = async() => {
    if(data_edit.value){
        //alert.alert=true
        console.log("proses edit dijalankan")
        //navigateTo(`/`)
    }else{
        console.log(payload.idxdaftar)
        simpan_SurKon(payload);
        //alert.alert=true
        console.log("proses tambah yang dijalankan")
        //navigateTo(`/`)
    }
}
const title = computed(()=>data_edit.value ? 'UBAH DATA' : "TAMBAH DATA")
</script>

<style scoped>

</style>