<script setup lang="ts" name="notification-update">
  import FormContent from '@/views/operation/notification/components/form-content.vue';
  import { onBeforeRouteLeave, useRoute, useRouter } from 'vue-router';
  import { onMounted, ref } from 'vue';
  import { pick } from 'lodash';
  import useNotificationApi from '@/http/notification';
  import { Message } from '@arco-design/web-vue';
  import { AttributeData } from '@/types/global';

  const router = useRouter();

  const notifyKey = Number(useRoute().params?.id);
  const { show, update } = useNotificationApi;

  const formValue = ref<any>({});

  const onSubmit = (value: AttributeData) =>
    update(notifyKey, value).then(() => {
      Message.success(`更新通知：${value.title}`);
      router.replace({ name: 'operation-notification' });
    });

  onBeforeRouteLeave((to, from) => {
    if (from.meta.from === to.name) {
      to.meta.reload = false;
    }
  });

  onMounted(() => {
    show(notifyKey).then((res) => {
      Object.assign(formValue.value, {
        ...pick(res, [
          'title',
          'type',
          'cover',
          'content',
          'rich_content',
          'publish_type',
          'publish_to',
          'link_type',
          'link_id',
          'link_name',
          'is_alert',
        ]),
        publish_count: res.items_count || 0,
        publish_at: res.publish_type === 1 ? '' : res.publish_at,
      });
    });
  });
</script>

<template>
  <page-view has-bread has-card>
    <form-content v-model="formValue" :submit="onSubmit" />
  </page-view>
</template>

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