jws-frontend/src/pages/09_task-order/form.ts

import { defineStore } from 'pinia';
import { useI18n } from 'vue-i18n';
import { ref } from 'vue';
import { dialog } from 'stores/utils';

// NOTE: Import types
import {
  SetTaskStatusPayload,
  TaskOrder,
  TaskOrderPayload,
  TaskStatus,
} from 'stores/task-order/types';
import { RequestWork } from 'src/stores/request-list';

// NOTE: Import stores
import { useTaskOrderStore } from 'src/stores/task-order';

export const useTaskOrderForm = defineStore('task-order-form', () => {
  const { t } = useI18n();
  const taskOrderStore = useTaskOrderStore();
  const DEFAULT_DATA: TaskOrderPayload = {
    taskList: [],
    institutionId: '',
    contactTel: '',
    contactName: '',
    taskName: '',
  };

  const state = ref<{
    mode: null | 'info' | 'create' | 'edit';
    setTaskStatusList: SetTaskStatusPayload[];
  }>({
    mode: null,
    setTaskStatusList: [],
  });

  let resetFormData = structuredClone(DEFAULT_DATA);

  const currentFormData = ref<TaskOrderPayload>(structuredClone(resetFormData));
  const fullTaskOrder = ref<TaskOrder>();

  function resetForm(clean = false) {
    if (clean) {
      currentFormData.value = structuredClone(DEFAULT_DATA);
      resetFormData = structuredClone(DEFAULT_DATA);
      return;
    }

    currentFormData.value = structuredClone(resetFormData);

    state.value.mode = 'info';
  }

  async function assignFormData(
    id: string,
    mode: 'info' | 'edit' | 'assign' = 'info',
    userId?: string,
  ) {
    const res = await taskOrderStore.getTaskOrderById(id, {
      taskAssignedUserId: userId,
    });

    if (!res) return;

    fullTaskOrder.value = structuredClone(res);
    resetFormData = Object.assign(res, {
      requestWork: res.taskList.map((v) => ({
        step: v.step,
        requestWorkId: v.requestWorkId,
      })),
    });

    currentFormData.value = structuredClone(resetFormData);

    if (mode === 'assign') return;

    state.value.mode = mode;
  }

  async function submitTask(opt?: {
    taskProduct?: {
      productId: string;
      discount?: number;
    }[];
  }) {
    let succeed = false;

    if (state.value.mode === 'create') {
      const mapTaskList = currentFormData.value.taskList.map((v) => ({
        step: v.step,
        requestWorkId: v.requestWorkId,
      }));
      const res = await taskOrderStore.createTaskOrder({
        ...currentFormData.value,
        taskProduct: opt?.taskProduct,
        taskList: mapTaskList,
      });

      if (res) {
        currentFormData.value.id = res.id;
        succeed = true;
      }
    }

    if (state.value.mode === 'edit' && !!currentFormData.value.id) {
      const res = await taskOrderStore.editTaskOrder(currentFormData.value);
      if (res) {
        succeed = true;
      }
    }

    return succeed;
  }

  async function changeStatus(
    value: {
      requestWorkId: string;
      step: number;
      failedComment?: string;
      failedType?: string;
    }[],
    status: TaskStatus,
    setRowStatus: () => void,
  ) {
    dialog({
      color: 'warning',
      icon: 'mdi-alert',
      title: t('dialog.title.confirmChangeStatus'),
      actionText: t('general.confirm'),
      persistent: true,
      message: t('dialog.message.confirmChangeStatus'),
      action: async () => {
        if (!currentFormData.value.id) return;

        const records = value.map((item) => ({
          failedComment: item.failedComment,
          failedType: item.failedType,
          taskStatus: status,
          requestWorkId: item.requestWorkId,
          step: item.step,
        }));

        const res = await taskOrderStore.changeTaskStatus(
          currentFormData.value.id,
          records,
        );

        if (res) setRowStatus();
      },
      cancel: () => {},
    });
  }

  return {
    currentFormData,
    state,
    fullTaskOrder,

    resetForm,
    assignFormData,
    submitTask,
    changeStatus,
  };
});