<script setup>
import { defineProps, computed } from "vue";
import { useI18n } from "vue-i18n";
const { t } = useI18n();
const props = defineProps({
  SaveCheckAuth: Object,
  NoticeData: Object,
  onChange: Function,
});

const columns = computed(() => [
  {
    title: t('alert.choose'),
    key: "SaveCheckAuth",
    width: 150,
  },
  {
    title: t('alert.notify_items'),
    key: "system_key",
  },
]);

</script>

<template>
  <Table :columns="columns" :dataSource="props.NoticeData" :withStyle="false">
    <template #bodyCell="{ record, column }">
      <template v-if="column.key === 'SaveCheckAuth'">
        <Checkbox :checked="props.SaveCheckAuth.includes(record.system_value)" name="notices"
          :value="record.system_value" :onChange="onChange" />
      </template>
      <template v-else>
        <pre>{{ record[column.key] }}</pre>
      </template>
    </template>
  </Table>
</template>

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