<template>
  <div class="form-part">
    <div class="form-part-title">
      <h4>Çekiliş Tutanağı</h4>
      <div class="form-part-title-buttons">
        <icon-button
          v-if="usersStore.isPanelUser"
          icon="plus"
          class="ico-section ico-section-header-btn"
          @click="AddNewDocument" />
      </div>
    </div>
    <div class="form-part-content" v-if="cekilisTutanagiStore.loaded">
      <template v-if="cekilisTutanagiStore.cekilisTutanagiList.length > 0">
        <template v-for="(file, i) in cekilisTutanagiStore.cekilisTutanagiList">
          <file-list-item
            :editable="false"
            :data="file"
            title="dokumanAdi"
            :filePath="file.url">
            <template #actionButtons v-if="usersStore.isPanelUser">
              <i
                class="ico-c ico-btn ico-section back-grad-alert"
                @click.stop="DeleteDocumentPop(file)">
                <svg><use href="/src/assets/images/icons.svg#trash"></use></svg>
              </i>
            </template>
          </file-list-item>
        </template>
      </template>
      <template v-else>
        <div class="form-inner-comment" v-if="usersStore.isPanelUser">
          Eklenmiş dosya bulunamadı.
        </div>
        <div class="form-inner-comment" v-else>
          Eklenmiş dosya bulunamadı.
        </div>
      </template>
    </div>
  </div>
  <panel-wrapper
    v-if="cekilisTutanagiStore.documentPanel"
    v-model="cekilisTutanagiStore.documentPanel"
    panel-title="Doküman Ekle">
    <template #panelContent>
      <panel-piyango-cekilis-tutanagi />
    </template>
    <template #footerButton>
      <div class="button-c button-save" @click="cekilisTutanagiService.SaveDocument">
        Ekle
      </div>
    </template>
  </panel-wrapper>
</template>
<script setup lang="ts">
  import { ref, onBeforeMount } from 'vue'

  import PanelPiyangoCekilisTutanagi from '../panel/PanelPiyangoCekilisTutanagi.vue'
  import PanelWrapper from '@/components/PanelWrapper.vue'

  import { useUsersStore } from '@/stores/usersStore'
  const usersStore = useUsersStore()
  import { usePiyangoCekilisTutanagiStore } from '../../stores/piyangoCekilisTutanagiStore'
  const cekilisTutanagiStore = usePiyangoCekilisTutanagiStore()
  import { usePiyangoCekilisTutanagiService } from '../../service/piyangoCekilisTutanagiService'
  const cekilisTutanagiService = usePiyangoCekilisTutanagiService()
  import { useDialogStore } from '@/components/global/dialogStore'
  const dialogStore = useDialogStore()
  import { useDataStore } from '@/stores/dataStore'
  const dataStore = useDataStore()

  const AddNewDocument = () => {
    cekilisTutanagiStore.ResetForm()
    cekilisTutanagiStore.isUpdate = false
    cekilisTutanagiStore.documentPanel = true
  }

  const DeleteDocumentPop = (data: Record<string, any>) => {
    dialogStore.CreateDialog({
      title: 'Doküman Sil',
      id: 'deletedoc',
      content: 'Dokümanı silmek istediğinize emin misiniz? Bu işlem geri alınamaz.',
      closeText: 'Vazgeç',
      buttons: [
        {
          label: 'Doküman Sil',
          type: 'alert',
          function: () => DeleteDocument(data.id)
        }
      ]
    })
  }

  const DeleteDocument = async (id: number | string) => {
    var dt = await dataStore.dataDelete('CekilisTutanak/' + id)

    if (dt !== 'errorfalse') {
      dialogStore.CloseDialog('deletedoc')
      await cekilisTutanagiService.GetDocumentList()
    }
  }

  onBeforeMount(async () => {
    await cekilisTutanagiService.GetDocumentList()
  })
</script>

