<template>
  <div class="form-part form-title">
    <div v-if="isGenelYetkili" class="form-inner-comment alert-d">
      Bu piyangoda yetkili değilsiniz
    </div>
    <div class="form-title-buttons" v-if="!isGenelYetkili">
      <button class="button-c button-save" @click="SaveForm">Kaydet</button>
    </div>
  </div>
  <div :class="['form-part', formChanged ? 'changed' : '']" v-if="loaded">
    <div class="list-wrapper">
      <table class="table-border table-colored table-list">
        <thead>
          <tr>
            <th style="width: 20%">
              <div class="table-head-content">
                <span>Birim</span>
              </div>
            </th>
            <th>
              <div class="table-head-content">
                <span>Yetkili</span>
              </div>
            </th>
          </tr>
        </thead>
        <tbody>
          <template v-for="(row, i) in yetkiTable">
            <tr>
              <td>{{ row.title }}</td>
              <td class="table-cell-flx-row">
                <form-select
                  half
                  :disabled="YetkiliDisabled(row)"
                  disabledClass="disabled-show-name"
                  v-model="formData['onayverecekkisi' + row.id + 'birimId']"
                  :listData="appUserUnitStore.appUserUnits"
                  :extraData="row.id"
                  listVal="id"
                  listText="birimAdi"
                  :modelKey="'onayverecekkisi' + row.id + 'birimId'"
                  @change="ChangeBirim"
                  :invalidText="invalidTexts['onayverecekkisi' + row.id + 'birimId']">
                  <template #activator="data">
                    {{
                      data.activatorData !== undefined &&
                      Object.keys(data.activatorData).length > 0 &&
                      formData['onayverecekkisi' + row.id + 'birimId'] !== null &&
                      formData['onayverecekkisi' + row.id + 'birimId'] !== 0
                        ? data.activatorData.birimAdi
                        : YetkiliDisabled(row) &&
                          (formData['onayverecekkisi' + row.id + 'birimId'] === null ||
                            formData['onayverecekkisi' + row.id + 'birimId'] === 0)
                        ? 'Henüz yetkili ataması yapılmamış'
                        : 'Lütfen seçim yapınız'
                    }}
                  </template>
                </form-select>
                <form-select
                  half
                  :view="localView"
                  :extraData="row.view"
                  v-model="formData['onayverecekkisi' + row.id + 'Id']"
                  :listData="yetkiliLists['list' + row.id]"
                  listVal="id"
                  :disabled="IsDisabled(row)"
                  disabledClass="disabled-show-name"
                  listText="ad"
                  :modelKey="'onayverecekkisi' + row.id + 'Id'"
                  :invalidText="invalidTexts['onayverecekkisi' + row.id + 'Id']">
                  <template #activator="data">
                    {{
                      data.activatorData !== undefined &&
                      Object.keys(data.activatorData).length > 0 &&
                      formData['onayverecekkisi' + row.id + 'Id'] !== null
                        ? data.activatorData.ad +
                          ' ' +
                          data.activatorData.soyad +
                          ' - ' +
                          data.activatorData.kullaniciGorevi
                        : IsDisabled(row) &&
                          (formData['onayverecekkisi' + row.id + 'Id'] === null ||
                            formData['onayverecekkisi' + row.id + 'Id'] === 0)
                        ? 'Henüz yetkili ataması yapılmamış'
                        : 'Lütfen seçim yapınız'
                    }}
                  </template>
                  <template #option="data">
                    {{
                      data.optionData.ad +
                      ' ' +
                      data.optionData.soyad +
                      ' - ' +
                      data.optionData.kullaniciGorevi
                    }}
                  </template>
                </form-select>
              </td>
            </tr>
          </template>
        </tbody>
      </table>
    </div>
  </div>
</template>
<script setup lang="ts">
  import { onBeforeMount, ref, reactive, computed } from 'vue'

  import { useDataStore } from '@/stores/dataStore'
  const dataStore = useDataStore()
  import { useUsersStore } from '@/stores/usersStore'
  const usersStore = useUsersStore()
  import { usePiyangoStore } from '../../stores/piyangoStore'
  const piyangoStore = usePiyangoStore()

  import { useAppUserUnitStore } from '@/module/kullanicilar/stores/appUserUnitStore'
  const appUserUnitStore = useAppUserUnitStore()
  import { useAppUserUnitService } from '@/module/kullanicilar/service/appUserUnitService'
  const appUserUnitService = useAppUserUnitService()

  const formChanged = ref<boolean>(false)
  const loaded = ref<boolean>(false)
  const isNew = ref<boolean>(true)

  const yetkiTable = ref<Record<string, any>[]>([
    {
      title: 'Şube Müdürü',
      key: 'birimAdi',
      id: 1,
      view: 2,
      edit: [1]
    },
    {
      title: 'Şef',
      id: 2,
      view: 4,
      edit: [1, 2]
    },
    {
      title: 'Memur (VHKİ)',
      id: 3,
      view: 3,
      edit: [1, 2, 4]
    }
  ])

  const formData = reactive<Record<string, any>>({
    onayverecekkisi1Id: null,
    onayverecekkisi2Id: null,
    onayverecekkisi3Id: null,
    onayverecekkisi1birimId: null,
    onayverecekkisi2birimId: null,
    onayverecekkisi3birimId: null,
    cekilisId: piyangoStore.selectedLottery
  })
  const yetkiliLists = reactive<Record<string, any>>({})
  const invalidTexts = ref<Record<string, any>>({})

  const localView = (data: any, id: any): boolean => {
    return data.kullaniciGorevId === id
  }

  const ChangeBirim = async (
    e: Event,
    d: number,
    itm: Record<string, any>,
    ext: number
  ) => {
    yetkiliLists['list' + ext] = [] as Record<string, any>[]
    yetkiliLists['list' + ext] = await GetUserList(d)
  }
  const isGenelYetkili = computed<boolean>(() => {
    return (
      usersStore.userPosition !== 1 &&
      usersStore.userId !== formData.onayverecekkisi1Id &&
      usersStore.userId !== formData.onayverecekkisi2Id &&
      usersStore.userId !== formData.onayverecekkisi3Id
    )
  })
  const IsDisabled = (row: Record<string, any>): boolean => {
    return yetkiliLists['list' + row.id] === undefined || YetkiliDisabled(row) || isGenelYetkili.value
  }

  const YetkiliDisabled = (row: Record<string, any>): boolean => {
    return !row.edit.includes(usersStore.userPosition) || isGenelYetkili.value
  }

  const GetUserList = async (id: number) => {
    if (id !== null) {
      let data = await dataStore.dataGet('Auth/getuserlistBirim/' + id, {
        params: { pageNumber: 0 }
      })
      return data.data
    } else {
      return []
    }
  }
  const GetData = async () => {
    let data = await dataStore.dataGet(
      'OnayCekilis/Cekilis/' + piyangoStore.selectedLottery
    )
    if (data !== 'errorfalse') {
      Object.assign(formData, data.data)
      if (
        formData.onayverecekkisi1Id !== null ||
        formData.onayverecekkisi2Id !== null ||
        formData.onayverecekkisi3Id !== null
      )
        isNew.value = false

      CreateYetkiTable()
    }
  }
  const CreateYetkiTable = async () => {
    await yetkiTable.value.forEach(async (itm: Record<string, any>, i: number) => {
      if (yetkiliLists['list' + itm.id] === undefined) {
        yetkiliLists['list' + itm.id] = []
        yetkiliLists['list' + itm.id] = await GetUserList(
          formData['onayverecekkisi' + itm.id + 'birimId']
        )
      }
    })
    loaded.value = true
  }
  const SaveForm = async () => {
    let res: any
    let inData = Object.assign({}, formData)
    if (isNew.value) {
      delete inData.id
      res = await dataStore.dataPost('OnayCekilis/', {
        data: inData,
        toast: { toast: 'Yetkilendirmeler başarıyla kaydedildi.', type: 'success' }
      })
    } else {
      res = await dataStore.dataPut('OnayCekilis/' + formData.cekilisId, {
        data: inData,
        toast: { toast: 'Yetkilendirmeler başarıyla kaydedildi.', type: 'success' }
      })
    }

    if (res !== 'errorfalse') {
      piyangoStore.lotteryYetkiRefresh = true
      GetData()
    }
  }
  const RemoveAccountingUnit = () =>{
    let ind = appUserUnitStore.appUserUnits.findIndex((p) => p.id === 6)
    if (ind >= 0) appUserUnitStore.appUserUnits.splice(ind, 1)
  }
  onBeforeMount(async () => {
    await appUserUnitService.GetAppUserUnitList()
    RemoveAccountingUnit()
    await GetData()
  })
</script>
