index.md 5.63 KB

函数编辑器

import { request, QxFunctionOperationModal } from '@qx/common';
import React, { useState, useMemo } from 'react';
import { FIELD_TYPE_PROPS } from '../constant';

const numWidgets = ['qxNumber', 'qxMoney', 'qxPercent', 'qxFormula'];
const dateWidgets = ['qxDatetime'];
const boolWidgets = ['qxSwitch'];


/**
 * 归类字段类型
 */
const getOperationsType = (data: any) => {
  if (!data) {
    return undefined;
  }
  const fieldType = data.fieldType;
  if (!fieldType) {
    return FIELD_TYPE_PROPS.EMPTY;
  }
  let fileTypeTem: FIELD_TYPE_PROPS;
  if (fieldType.startsWith(FIELD_TYPE_PROPS.USER)) {
    fileTypeTem = FIELD_TYPE_PROPS.USER;
  } else if (fieldType.indexOf(FIELD_TYPE_PROPS.ORG) !== -1) {
    fileTypeTem = FIELD_TYPE_PROPS.ORG;
  } else if (
    fieldType === 'DATETIME' ||
    fieldType === FIELD_TYPE_PROPS.DATE ||
    fieldType === 'TIME' ||
    // fieldType.startsWith(FIELD_TYPE_PROPS.HOUR) ||
    fieldType.startsWith(FIELD_TYPE_PROPS.YEAR)
  ) {
    fileTypeTem = FIELD_TYPE_PROPS.DATE;
  } else if (
    fieldType === FIELD_TYPE_PROPS.DOUBLE ||
    fieldType === FIELD_TYPE_PROPS.DECIMAL ||
    fieldType === FIELD_TYPE_PROPS.INTEGER ||
    fieldType === FIELD_TYPE_PROPS.FORMULA ||
    fieldType === FIELD_TYPE_PROPS.PERCENT
  ) {
    fileTypeTem = FIELD_TYPE_PROPS.NUM;
  } else if (
    fieldType === FIELD_TYPE_PROPS.ENUM ||
    fieldType === FIELD_TYPE_PROPS.ENUM_MULTI ||
    fieldType === FIELD_TYPE_PROPS.TREE ||
    fieldType === FIELD_TYPE_PROPS.REL ||
    fieldType === FIELD_TYPE_PROPS.REL_MULTI ||
    fieldType === FIELD_TYPE_PROPS.TABLE ||
    fieldType === FIELD_TYPE_PROPS.FILE ||
    fieldType === FIELD_TYPE_PROPS.BOOL
  ) {
    fileTypeTem = fieldType;
  } else if (fieldType === FIELD_TYPE_PROPS.REL_FIELD) {
    fileTypeTem = data.refType;
  } else if (fieldType === 'HOUR_MIN' || fieldType === 'HOUR_SEC') {
    fileTypeTem = FIELD_TYPE_PROPS.TIME;
  } else if (fieldType === 'LOCATION') {
    fileTypeTem = FIELD_TYPE_PROPS.LOCATION;
  } else {
    fileTypeTem = FIELD_TYPE_PROPS.TEXT;
  }
  return fileTypeTem;
};

const getOperationsTypeByWidget = (widget: string, qxProps?: any, max?: number) => {
  if (!widget) {
    return FIELD_TYPE_PROPS.EMPTY;
  }
  let fileTypeTem: FIELD_TYPE_PROPS | undefined;
  if (widget === 'userSelector') {
    fileTypeTem = FIELD_TYPE_PROPS.USER;
  } else if (widget === 'orgSelector') {
    fileTypeTem = FIELD_TYPE_PROPS.ORG;
  } else if (
    dateWidgets.includes(widget) ||
    (widget === 'qxFormula' &&
      qxProps?.calculateMode === 'DATE' &&
      qxProps?.calculate?.formula === 'INC_DEC')
  ) {
    fileTypeTem = FIELD_TYPE_PROPS.DATE;
  } else if (numWidgets.includes(widget)) {
    fileTypeTem = FIELD_TYPE_PROPS.NUM;
  } else if (boolWidgets.includes(widget)) {
    fileTypeTem = FIELD_TYPE_PROPS.BOOL;
  } else if (widget === 'relField') {
    fileTypeTem = getOperationsType({ fieldType: qxProps?.refFieldType || '' });
  } else if (widget === 'qxTime') {
    fileTypeTem = FIELD_TYPE_PROPS.TIME;
  } else if (widget === 'qxLocation') {
    fileTypeTem = FIELD_TYPE_PROPS.LOCATION;
  } else if (widget === 'qxSelect') {
    fileTypeTem = FIELD_TYPE_PROPS.ENUM;
  } else if (widget === 'qxMultiSelect') {
    fileTypeTem = FIELD_TYPE_PROPS.ENUM_MULTI;
  } else if (widget === 'relSelector') {
    if (max === 1) {
      fileTypeTem = FIELD_TYPE_PROPS.REL;
    } else {
      fileTypeTem = FIELD_TYPE_PROPS.REL_MULTI;
    }
  } else if (widget === 'qxTree') {
    fileTypeTem = FIELD_TYPE_PROPS.TREE;
  } else if (widget === 'qxUpload' || widget === 'qxUploadImage') {
    fileTypeTem = FIELD_TYPE_PROPS.FILE;
  } else {
    fileTypeTem = FIELD_TYPE_PROPS.TEXT;
  }
  // if (textWidgets.includes(widget)) {
  //   fileTypeTem =
  // })
  return fileTypeTem;
};


export default () => {
  const [modalVisible, setModalVisible] = useState(true);

  const [props, setProps] = useState({
    value: {
      type: 'FORMULA',
      expression: undefined,
      values: undefined,
      customScript: false,
    },
    schema: {
      qxProps: {
        widget: 'qxInput',
        fieldName: {
          title: '文本11',
        },
        calculateMode: '',
        calculate: {
          formula: '',
        },
        refFieldType: '', // 关联属性需要
        relId: ''
      }
    }
  });

  const formulaColsTree = useMemo(() => {
    return [];
  }, []);


  const uniKey = useMemo(() => {
    return '';
  }, []);

  const handleFxChange = (val: string, usedFuncList?: string, scriptEdit?: boolean) => {
    setProps((prev) => ({
      ...prev,
      value: {
        type: 'FORMULA',
        expression: val,
        functionList: usedFuncList,
        customScript: scriptEdit,
      }
    }));
  };

  return (
      <QxFunctionOperationModal
        modalParams={{
          visible: modalVisible,
          onCancel:() => setModalVisible(false),
          onOk:() => setModalVisible(false),
        }}
        autofocus={true}
        colsTree={formulaColsTree}
        value={props?.value?.type === 'FORMULA' ? (props?.value?.values || props?.value?.expression || '') : ''}
        onChange={handleFxChange}
        isScriptEditMode={props.value?.customScript}
        fieldName={props.schema?.fieldName?.title || props?.addons?.formData?.title || ''}
        uniKey={uniKey}
        isInSubForm={false}
        defaultSetting={{
          widget: props?.schema?.qxProps?.widget,
          fieldName: props.schema?.fieldName?.title || props?.addons?.formData?.title || '',
          fieldGroupType: getOperationsTypeByWidget(props?.schema?.qxProps?.widget, props?.schema?.qxProps),
          currentRelId: props?.schema?.qxProps?.relId,
        }}
      />
  );
};