import { type Ref, defineComponent, inject, ref } from 'vue';
import { useRoute, useRouter } from 'vue-router';

import EventService from './event.service';
import useDataUtils from '@/shared/data/data-utils.service';
import { type IEvent } from '@/shared/model/event.model';
import { useAlertService } from '@/shared/alert/alert.service';
import { useDateFormat } from '@/shared/composables';
import type { IRegistration } from '@/shared/model/registration.model';
import RegistrationService from '@/entities/registration/registration.service';
import UserService from '@/entities/user/user.service';
import type AccountService from '@/account/account.service';
import { useStore } from '@/store';
// import type EventService from '@/account/account.service';

export default defineComponent({
  compatConfig: { MODE: 3 },
  name: 'EventDetails',
  setup() {
    console.log('jestem tu');
    const eventService = inject('eventService', () => new EventService());
    const alertService = inject('alertService', () => useAlertService(), true);
    const { formatDateShort } = useDateFormat();
    const dataUtils = useDataUtils();
    const isCurrentEvent = ref(false);

    const registrationService = inject('registrationService', () => new RegistrationService());
    const accountService = inject<AccountService>('accountService');

    const route = useRoute();
    const router = useRouter();

    const previousState = () => router.go(-1);
    const event: Ref<IEvent> = ref({});
    const sortedAndIndexedRegistrations: Ref<IRegistration[]> = ref([]);

    let store = useStore();

    const retrieveEvent = async (eventId: string) => {
      try {
        console.log('event' + eventId);
        let currentEventId = '' + store.currentEventId;
        if (eventId == 'useCurrentEventId') {
          eventId = currentEventId;
          console.log('event2' + eventId);
        }
        const res = await eventService().find(eventId);
        isCurrentEvent.value = eventId == currentEventId;
        event.value = res;
        // sortedAndIndexedRegistrations.value = res.registrations;
        sortedAndIndexedRegistrations.value = res.registrations.sort(
          (a, b) => new Date(a.dateTime).getTime() - new Date(b.dateTime).getTime(),
        );
      } catch (error) {
        alertService.showHttpError(error.response);
      }
    };

    console.log('asdfasd' + route.meta?.eventId);
    if (route.params?.eventId) {
      retrieveEvent(route.params.eventId as string);
    } else if (route.meta?.eventId) {
      retrieveEvent(route.meta.eventId as string);
    }

    // const sortedAndIndexedRegistrations = () => {
    //   console.log('asdfasdfasdf', event.value.registrations)
    //   console.log('asdfasdfasdf', event.value)
    //   return [...(event.value.registrations || [])].sort((a, b) =>
    //     new Date(a.dateTime).getTime() - new Date(b.dateTime).getTime()
    //   );
    // };

    const getRegistrationIndex = (index: number) => {
      const activeCount = sortedAndIndexedRegistrations.value.slice(0, index).filter(r => r.active).length;
      return sortedAndIndexedRegistrations.value[index].active ? activeCount + 1 : '';
    };

    const hasAnyAuthorityValues: Ref<any> = ref({});
    const removeId: Ref<number> = ref(null);
    const removeEntity = ref<any>(null);
    const prepareRemove = (instance: IRegistration) => {
      removeId.value = instance.id;
      removeEntity.value.show();
    };
    const closeDialog = () => {
      removeEntity.value.hide();
    };
    const removeRegistration = async () => {
      try {
        await registrationService().delete(removeId.value);
        var eventId = removeEntity.value.id;
        const message = `A Registration is deleted with identifier ${removeId.value}`;
        alertService.showInfo(message, { variant: 'danger' });
        removeId.value = null;
        await retrieveEvent(event.value.id);
        // console.log('asdfdsa' , event.value.id);
        // const res = await eventService().find(eventId);
        // event.value = res;
        // sortedAndIndexedRegistrations.value = res.registrations;
        // sortedAndIndexedRegistrations.value = res.registrations.sort(
        //   (a, b) => new Date(a.dateTime).getTime() - new Date(b.dateTime).getTime(),
        // );
        closeDialog();
      } catch (error) {
        alertService.showHttpError(error.response);
      }
    };
    const userService = inject('userService', () => new UserService());
    // const loggedUser: Ref<IUser> = ref(new User());
    const currentUserId = ref('');
    userService()
      .fetchAccountDetails()
      .then(account => {
        currentUserId.value = `${account.id}`;
      });

    // console.log('asdfasdf', sortedAndIndexedRegistrations())
    return {
      currentUserId,
      alertService,
      hasAnyAuthorityValues,
      accountService,
      eventService,
      event,
      isCurrentEvent,
      ...dataUtils,
      formatDateShort,
      previousState,
      sortedAndIndexedRegistrations,
      getRegistrationIndex,
      removeId,
      removeEntity,
      prepareRemove,
      closeDialog,
      removeRegistration,
    };
  },
  methods: {
    hasAnyAuthority(authorities: any): boolean {
      this.accountService.hasAnyAuthorityAndCheckAuth(authorities).then(value => {
        if (this.hasAnyAuthorityValues[authorities] !== value) {
          this.hasAnyAuthorityValues = { ...this.hasAnyAuthorityValues, [authorities]: value };
        }
      });
      return this.hasAnyAuthorityValues[authorities] ?? false;
    },
    settle(): void {
      this.isSaving = true;
      if (this.event.id) {
        this.eventService()
          .settle(this.event)
          .then(param => {
            this.isSaving = false;
            // this.previousState();
            this.alertService.showInfo(`The event has been settled up`);
          })
          .catch(error => {
            this.isSaving = false;
            this.alertService.showHttpError(error.response);
          });
      }
    },
  },
});