import React, { useEffect, useState } from 'react';
import ZdyTable from '@/webPublic/one_stop_public/Table';
import styles from './index.less';
import { fetchTemplateByCode, fetchTableItem } from '@/webPublic/Services';

export default function RenderForm({ get = 'web', isCg = 'yes', ...rest }) {
  return (
    <div className={styles.zyd_onestop_style_class}>
      <ZdyTable get={get} isCg={isCg} {...rest} />
    </div>
  );
}

/**
 * 根据表单code渲染表单
 * @param {Object} content 表单内容,传入对象
 * @param {String} templateCode 表单模板
 */
export function RenderFormByContent({ content, templateCode, form, get, isCg }) {
  const [formTemplate, setFormTemplate] = useState();
  useEffect(
    () => {
      fetchTemplateByCode(templateCode).then(res => {
        if (res) {
          setFormTemplate(res);
        }
      });
    },
    [templateCode]
  );

  return formTemplate ? (
    <RenderForm
      get={get}
      isCg={isCg}
      postData={{
        content: JSON.stringify(content),
        unifiedServicePatternModel: formTemplate,
      }}
      form={form}
    />
  ) : null;
}

/**
 *渲染元数据库中的某条数据
 * @param {Object} objId 元数据库id
 * @param {String} dataTypeKey 元数据库表格键
 * @param {String} dataTypeValue 键对应的值
 * @param {Function} onLoad 数据加载的回调函数
 */
export function RenderFormByObjId({
  objId,
  dataTypeKey,
  dataTypeValue,
  onLoad,
  templateCode,
  form,
  get,
  isCg,
}) {
  const [content, setContent] = useState({});
  useEffect(
    () => {
      fetchTableItem({ dataObjId: objId, key: dataTypeKey, value: dataTypeValue }).then(res => {
        setContent(res || {});
        if (onLoad) {
          onLoad(res);
        }
      });
    },
    [objId, dataTypeKey, dataTypeValue]
  );

  return (
    <RenderFormByContent
      get={get}
      isCg={isCg}
      content={content}
      templateCode={templateCode}
      form={form}
    />
  );
}