import React, { createElement, Component, useState } from 'react';
import { project,config } from '@alilc/lowcode-engine';
import { IPublicEnumTransformStage } from '@alilc/lowcode-types';
import { modifyReport } from '../../../src/api/form';
import { Button } from '@alifd/next';
import { Base64 } from 'js-base64';
import { addReport } from '../../../src/api/form';
import schema from './schema';
import './index.scss';

const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
const applicationId = Number(urlParams.get('applicationId'));
const reportId = Number(Base64.decode(urlParams.get('form')).replace('abc567', ''));
interface CreateReportSetterProps {
  onChange: (string) => void;
  value: any;
}

const saveSchema = async () => {
  const schema = project.exportSchema(IPublicEnumTransformStage.Save);

  const datasetGroupIds = parseDatasetInSchema(schema);

  return await modifyReport({
    reportId,
    reportName: '子表单',
    reportDataJson: JSON.stringify(schema),
    datasetGroupIds,
    type: 5,
    componentVersion:config.get('version')
  });
};
// 解析schema中的数据集
const parseDatasetInSchema = (schema: any): string[] => {
  const tree = schema.componentsTree[0].children;
  const datasets: string[] = [];
  function getDataset(comps: any[] = []) {
    comps.forEach((e) => {
      const id = e?.props?.dataSource?.dataset?.id;
      if (id) {
        datasets.push(id);
      }
      if (e?.children) {
        getDataset(e?.children);
      }
    });
  }
  getDataset(tree);
  return datasets;
};

const salt = 'abc567';
const baseurl = `${location.origin}/` + (location.hostname==='localhost'?'':'lowcode/')

const CreateReportSetter: React.FC<CreateReportSetterProps> = (props) => {
  const { value, onChange } = props;

  const [reportId, setReportId] = useState(value);

  const jump2ChildrenForm = () => {
    if (value) {
      // 创建过直接跳转
      const baseId = Base64.encode(value + salt);
      window.open(
        baseurl +
          'report.html' +
          `?form=${baseId}&applicationId=${applicationId}`,
        '_blank',
      );
    } else {
      // 没创建去创建再跳转
      let params = {
        reportName: '子表单',
        applicationId,
        reportPno:'0',
        mainFlag: 2,
        reportDataJson: JSON.stringify(schema),
        type: 5
      };
      addReport(params).then((res) => {
        const id = res.data;
        setReportId(id);
        onChange(id);
        const baseId = Base64.encode(id + salt);
        saveSchema().then((res) => {
          if(res.code===200){
            window.open(
              baseurl +
                'report.html' +
                `?form=${baseId}&applicationId=${applicationId}`,
              '_blank',
            );
          }
        });
      });
    }
  };

  return (
    <Button onClick={jump2ChildrenForm} style={{ width: '100%' }} type="normal">{`${
      reportId ? '编辑' : '创建'
    }子表单`}</Button>
  );
};

export default class extends Component<CreateReportSetterProps> {
  render() {
    return <CreateReportSetter {...this.props} />;
  }
}