<script setup>
import AlertSubList from "./AlertSubList.vue";
import AlertOutliersTable from "./AlertOutliersTable.vue";
import AlertTimeTable from "./AlertTimeTable.vue";
import AlertNotifyTable from "./AlertNotifyTable.vue";
import { ref, provide, onMounted, watch } from "vue";
import { getAlarmScheduleList, getNoticeList } from "@/apis/alert";
import { useI18n } from "vue-i18n";
const { locale } = useI18n();
const timesList = ref([]);
const noticeList = ref([]);

// const timesListData = async () => {
//   const res = await getAlarmScheduleList();
//   timesList.value = res.data.map((items) => ({
//     ...items,
//     key:items.id,
//     schedule_array: JSON.parse(items.schedule_json).map((time, index) => ({
//       day: index + 1,
//       time,
//     })),
//   }));
// };

const NoticeListData = async () => {
  const res = await getNoticeList(locale.value);
  noticeList.value = res.data;
};

watch(locale, () => {
  NoticeListData();
});

onMounted(() => {
  // timesListData();
  NoticeListData();
});

provide("notify_table", {
  timesList,
  noticeList,
  // timesListData
});
</script>

<template>
  <div>
    <AlertSubList />
    <AlertOutliersTable />
    <!-- <AlertTimeTable /> -->
    <AlertNotifyTable />
  </div>
</template>

<style lang="scss" scoped></style>
