import { ref, onMounted, defineAsyncComponent } from "vue";

import { employees } from "@/core/data/tables/dataTable";
import type { TableClickedAction, TableConfigs } from "@/types/common";
import type { Employee } from "@/types/tables/dataTable";

const Card = defineAsyncComponent(() => import("@/components/shared/card/Card.vue"));
const Table = defineAsyncComponent(() => import("@/components/shared/Table.vue"));

const employeeList = ref(employees);

const tableConfig = ref({
  columns: [
    { title: "Name", fieldValue: "name", sort: true },
    { title: "Position", fieldValue: "position", sort: true },
    { title: "Office", fieldValue: "office", sort: true },
    { title: "Age", fieldValue: "age", sort: true },
    { title: "Start date", fieldValue: "startDate", sort: true },
    { title: "Salary", fieldValue: "salary", sort: true },
  ],
  rowAction: [
    {
      label: "Delete",
      actionToPerform: "delete",
      icon: "trash1",
    },
  ],
  data: [] as Employee[],
});

onMounted(() => {
  tableConfig.value.data = employeeList.value;
});
function handleAction(value: TableClickedAction) {
  if (value.actionToPerform === "delete" && value.data) {
    employeeList.value = employeeList.value.filter(
      (employee: Employee) => employee.id !== (value.data as Employee).id
    );
    tableConfig.value = { ...tableConfig.value, data: employeeList.value };
  }
}

export const employees: Employee[] = [
  {
    id: 1,
    name: "Tiger Nixon",
    position: "System Architect",
    office: "Edinburgh",
    age: 61,
    startDate: "25/04/2011",
    salary: "$320,800",
  },
  {
    id: 2,
    name: "Garrett Winters",
    position: "Accountant",
    office: "Tokyo",
    age: 63,
    startDate: "25/07/2015",
    salary: "$170,750",
  },
  {
    id: 3,
    name: "Ashton Cox",
    position: "Junior Technical Author",
    office: "San Francisco",
    age: 66,
    startDate: "12/01/2009",
    salary: "$86,000",
  },
  {
    id: 4,
    name: "Cedric Kelly",
    position: "Senior Javascript Developer",
    office: "Edinburgh",
    age: 22,
    startDate: "29/03/2016",
    salary: "$433,060",
  },
  {
    id: 5,
    name: "Airi Satou",
    position: "Accountant",
    office: "Tokyo",
    age: 33,
    startDate: "28/11/2008",
    salary: "$162,700",
  },
  {
    id: 6,
    name: "Brielle Williamson",
    position: "Integration Specialist",
    office: "New York",
    age: 61,
    startDate: "02/12/2012",
    salary: "$372,000",
  },
  {
    id: 7,
    name: "Herrod Chandler",
    position: "Sales Assistant",
    office: "San Francisco",
    age: 59,
    startDate: "06/08/2012",
    salary: "$137,500",
  },
  {
    id: 8,
    name: "Rhona Davidson",
    position: "Integration Specialist",
    office: "Tokyo",
    age: 55,
    startDate: "14/10/2010",
    salary: "$327,900",
  },
  {
    id: 9,
    name: "Colleen Hurst",
    position: "Javascript Developer",
    office: "San Francisco",
    age: 39,
    startDate: "15/09/2009",
    salary: "$205,500",
  },
  {
    id: 10,
    name: "Sonya Frost",
    position: "Software Engineer",
    office: "Edinburgh",
    age: 23,
    startDate: "13/12/2008",
    salary: "$103,600",
  },
  {
    id: 11,
    name: "Jena Gaines",
    position: "Office Manager",
    office: "London",
    age: 30,
    startDate: "19/12/2008",
    salary: "$90,560",
  },
  {
    id: 12,
    name: "Quinn Flynn",
    position: "Support Lead",
    office: "Edinburgh",
    age: 22,
    startDate: "03/03/2013",
    salary: "$342,000",
  },
  {
    id: 13,
    name: "Charde Marshall",
    position: "Regional Director",
    office: "San Francisco",
    age: 36,
    startDate: "16/10/2008",
    salary: "$470,600",
  },
  {
    id: 15,
    name: "Donna Snider",
    position: "Customer Support",
    office: "New York",
    age: 27,
    startDate: "25/01/2011",
    salary: "$112,000",
  },
  {
    id: 16,
    name: "Amir Reyes",
    position: "JS Developer",
    office: "US",
    age: 22,
    startDate: "21/07/2024",
    salary: "$148,450",
  },
  {
    id: 17,
    name: "Leon Mann",
    position: "Software Engineer",
    office: "UK",
    age: 20,
    startDate: "23/08/2024",
    salary: "$250,400",
  },
  {
    id: 18,
    name: "Eliezer Orr",
    position: "Manager",
    office: "New York",
    age: 26,
    startDate: "12/05/2023",
    salary: "$587,480",
  },
  {
    id: 19,
    name: "Ana Hanson",
    position: "SEO",
    office: "New York",
    age: 28,
    startDate: "05/09/2024",
    salary: "$145,000",
  },
  {
    id: 20,
    name: "Kaia Kline",
    position: "HR",
    office: "Singapore",
    age: 24,
    startDate: "18/09/2022",
    salary: "$600,580",
  },
  {
    id: 21,
    name: "Tori Hale",
    position: "Customer Support",
    office: "San Francisco",
    age: 26,
    startDate: "29/10/2024",
    salary: "$120,000",
  },
];