<script lang="ts" setup>
  import { ref } from 'vue';
  import { ImmediateExecuteTaskType, TaskRecordType } from '/@/api/task/model';
  import { BasicForm, useForm } from '/@/components/Form';
  import { BasicModal, useModalInner } from '/@/components/Modal';
  import { TaskTargetEnum, TaskTypeNameEnum } from '../../config';
  import { FormFieldsEnum, FormValue, TargetNameType, TargetType, formSchemas } from './config';
  import { unref } from 'vue';
  import { immediateExecute } from '/@/api/task';
  import { useMessage } from '/@/hooks/web/useMessage';
  const props = defineProps<{
    reload: Fn;
    fromOrigin?: boolean;
    tbDeviceId?: string;
  }>();

  defineEmits(['register']);

  const dataSource = ref<TaskRecordType>();

  const updateExecuteTargetType = (options: Recordable[]) => {
    updateSchema({
      field: FormFieldsEnum.EXECUTE_TARGET_TYPE,
      componentProps: {
        options,
      },
    });
  };

  const [registerModal, { closeModal }] = useModalInner((record: TaskRecordType) => {
    resetFields();
    dataSource.value = record;
    if (record) {
      setFieldsValue({ taskRecord: JSON.stringify(record) } as FormValue);
      // 如果是从设备详情里面的任务进来的
      if (props.fromOrigin) {
        setFieldsValue({ tbDeviceId: props.tbDeviceId } as FormValue);
        setFieldsValue({ [FormFieldsEnum.EXECUTE_TARGET_TYPE]: TargetType.ASSIGN } as FormValue);
        setFieldsValue({ [FormFieldsEnum.TARGET_IDS]: [props.tbDeviceId] } as FormValue);
        updateExecuteTargetType([{ label: TargetNameType.ASSIGN, value: TargetType.ASSIGN }]);
      } else {
        updateExecuteTargetType([
          { label: TargetNameType.ALL, value: TargetType.ALL },
          { label: TargetNameType.ASSIGN, value: TargetType.ASSIGN },
        ]);
      }
    }
  });

  const [registerForm, { setFieldsValue, getFieldsValue, resetFields, validate, updateSchema }] =
    useForm({
      schemas: formSchemas,
      showActionButtonGroup: false,
    });

  const composeData = (record: FormValue): ImmediateExecuteTaskType => {
    const { executeTarget, targetIds } = record;
    return {
      executeTarget:
        executeTarget === TargetType.ASSIGN
          ? TaskTargetEnum.DEVICES
          : unref(dataSource)!.targetType,
      id: unref(dataSource)!.id,
      targetIds:
        executeTarget === TargetType.ASSIGN ? targetIds : unref(dataSource)?.executeTarget.data,
      cronExpression: unref(dataSource)!.executeTime.cron,
      name: unref(dataSource)!.name,
    };
  };

  const loading = ref(false);
  const { createMessage } = useMessage();
  const handleOk = async () => {
    await validate();
    const record = getFieldsValue() as FormValue;
    const value = composeData(record);
    try {
      loading.value = true;
      const { data } = await immediateExecute(value);
      data ? createMessage.success('运行成功') : createMessage.error('运行失败');
      if (data) {
        closeModal();
        props.reload?.();
      }
    } catch (error) {
      throw error;
    } finally {
      loading.value = false;
    }
  };
</script>

<template>
  <BasicModal
    @register="registerModal"
    title="运行任务"
    :okButtonProps="{ loading }"
    @ok="handleOk"
  >
    <BasicForm @register="registerForm">
      <template #taskName>
        <div class="font-semibold">
          {{ dataSource?.name }}
        </div>
      </template>
      <template #taskType>
        <div class="font-semibold">
          {{
            dataSource ? TaskTypeNameEnum[dataSource.executeContent.type] : TaskTypeNameEnum.CUSTOM
          }}
        </div>
      </template>
    </BasicForm>
  </BasicModal>
</template>