<template>
  <div clas="itc-create-flow">
    <div class="toolbar">
      <a-space wrap>
        <a-button>提交</a-button>
        <a-button>暂存</a-button>
        <a-button>关闭</a-button>
        <a-button>打印</a-button>
        <a-button>流程图</a-button>
      </a-space>
    </div>
    <div class="flow-content">
      <FormInformation
        :key="randKey"
        ref="formInformation"
        :disabled="false"
        :formAssignmentData="data.formAssignmentData"
        :formInfos="data.formInfos"
        :opinions="data.opinions"
        :opinionsComponents="data.opinionsComponents"
      />
    </div>
  </div>
</template>

<script setup>
  import { useRouter } from 'vue-router';
  import userTaskItem from '/@/views/workflow/task/hooks/userTaskItem';
  import FormInformation from '/@/views/secondDev/FormInformation.vue';
  import { getStartProcessInfo, getReStartProcessInfo } from '/@/api/workflow/task';
  import { useMultipleTabStore } from '/@/store/modules/multipleTab';

  const router = useRouter();
  const tabStore = useMultipleTabStore();

  import { nextTick, onMounted, ref, toRaw } from 'vue';

  const { data, initProcessData } = userTaskItem();
  const currentRoute = router.currentRoute;
  const rParams = currentRoute.value.query;
  const rSchemaId = rParams.schemaId;
  let formInformation = ref();
  let randKey = ref('randkey'); // 强制表单重新渲染

  const props = defineProps({
    schemaId: {
      type: String,
      required: true,
    },
    draftsJsonStr: {
      type: String,
    },
    draftsId: {
      type: String,
    },
    taskId: {
      type: String,
      required: false,
      default: '',
    },
    processId: {
      type: String,
      required: false,
      default: '',
    },
    formData: {
      type: Object,
    },
    formId: {
      type: String,
    },
    rowKeyData: {
      type: String,
    },
  });

  onMounted(async () => {
    try {
      if (props.processId) {
        // 重新发起
        let res = await getReStartProcessInfo(props.taskId, props.processId);
        res.taskApproveOpinions = [];
        initProcessData(res);
      } else if (props.schemaId && props.formId) {
        let res = await getStartProcessInfo(props.schemaId);

        if (props.formData && props.formId) {
          res.formInfos.map((m) => {
            if (m.formConfig.formId === props.formId) {
              m.formData = toRaw(props.formData);
            }
          });
        }
        initProcessData(res);
      } else {
        // 发起流程
        let res = await getStartProcessInfo(rSchemaId);
        const title = res?.schemaInfo?.name;
        if (title) {
          tabStore.changeTitle('new_' + rSchemaId, '新建 - ' + title);
        }
        initProcessData(res);
      }
    } catch (error) {}

    await nextTick();
    initDraftsFormData();

    randKey.value = Math.random() + '';
  });

  async function initDraftsFormData() {
    //isPublish.value = Object.keys(data.formInfos).length > 0 ? false : true;
    if (props.draftsJsonStr) {
      let formDataJson = JSON.parse(props.draftsJsonStr);
      let formData = [];

      data.formInfos.forEach((item) => {
        if (
          formDataJson &&
          item.formConfig &&
          item.formConfig.key &&
          formDataJson[item.formConfig.key]
        ) {
          formData.push(item.formConfig.key ? formDataJson[item.formConfig.key] : {});
        }
      });
      await formInformation.value.setFormData(formData);
    }
  }
</script>
