import { defineStore } from "pinia";
import loadingStore from './loading.js';
import pinia from '@/stores/main.js'
import {useToast} from 'vue-toast-notification';
import 'vue-toast-notification/dist/theme-sugar.css';
import moment from "moment";

const loading = loadingStore(pinia);
const $toast = useToast();
// Delay loading and toast 待模組化
let delay = (s = 0) =>  new Promise((resolve, reject) => setTimeout(resolve, s));

export default defineStore('allMapDataStore', {
  state: () => ({
    logId: null,
    traceId: 1,
    allProcessMap: {},
    allBpmn: {},
    allStats: {},
    allInsights: {},
    allTrace: [],
    allCase: [],
    allTraceTaskSeq: [],
    httpStatus: 200,
  }),
  getters: {
    processMap: state => {
      return state.allProcessMap;
    },
    bpmn: state => {
      return state.allBpmn;
    },
    stats: state => {
      return state.allStats;
    },
    insights: state => {
      return state.allInsights;
    },
    traces: state => {
      return state.allTrace;
    },
    cases: state => {
      return state.allCase;
    },
    traceTaskSeq: state => {
      return state.allTraceTaskSeq;
    }
  },
  actions: {
    /**
     * fetch discover api, include '/process-map, /bpmn, /stats, /insights'.
     */
    async getAllMapData() {
      let logId = this.logId;
      const api = `/api/logs/${logId}/discover`;

      try {
        const response = await this.$axios.get(api);
        this.allProcessMap = response.data.process_map;
        this.allBpmn = response.data.bpmn;
        this.allStats = response.data.stats;
        this.allInsights = response.data.insights;

        if(this.httpStatus < 300) loading.isLoading = false;
      } catch(error) {
        this.httpStatus = error.request.status;
        delay().then(() =>{
          loading.isLoading = true;
          return delay(1000);
        }).then(()=>{
          loading.isLoading = false;
          return delay(500);
        }).then(() => {
          $toast.default('Failed to load the Map.');
        })
      };
    },
    /**
     * fetch trace api.
     */
    async getAllTrace() {
      let logId = this.logId;
      const api = `/api/filters/params?log_id=${logId}`;

      try {
        const response = await this.$axios.get(api);
        this.allTrace = response.data.traces;

        if(this.httpStatus < 300) loading.isLoading = false;
      } catch(error) {
        this.httpStatus = error.request.status;
        delay().then(() =>{
          loading.isLoading = true;
          return delay(1000);
        }).then(()=>{
          loading.isLoading = false;
          return delay(500);
        }).then(() => {
          $toast.default('Failed to load the Trace.');
        })
      }
    },
    /**
     * fetch trace detail api.
     */
    async getTraceDetail() {
      let logId = this.logId;
      let traceId = this.traceId;
      const api = `/api/logs/${logId}/traces/${traceId}`;

      try {
        const response = await this.$axios.get(api);
        this.allTraceTaskSeq = response.data.task_seq;
        this.allCase = response.data.cases;
        this.allCase.map(c => {
          c.started_at = moment(c.started_at).format('YYYY-MM-DD HH:MM');
          c.completed_at = moment(c.completed_at).format('YYYY-MM-DD HH:MM');
          return this.allCase;
        });

        if(this.httpStatus < 300) loading.isLoading = false;
      } catch(error) {
        this.httpStatus = error.request.status;
        delay().then(() =>{
          loading.isLoading = true;
          return delay(1000);
        }).then(()=>{
          loading.isLoading = false;
          return delay(500);
        }).then(() => {
          $toast.default('Failed to load the Trace Detail.');
        });
      };
    },
  },
})