sunmao-sdk/es/layout/CpComposite.js

榫卯-开箱即用赋能-sdk

import "antd/es/spin/style";
import _Spin from "antd/es/spin";
var _excluded = ["schema", "defaultSchemaMap", "initData", "refreshSchema", "name", "title", "api", "filterParams", "widgets"],
    _excluded2 = ["data", "exactData"];

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }

function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }

function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }

function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }

function _iterableToArrayLimit(arr, i) { var _i = arr && (typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]); if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }

function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }

function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

import React, { useRef, useState, useEffect } from "react";
import { isArray, isString } from "lodash";
import CpBase from "./CpBase";
import { handleAppParams, postNew } from "./../net/request";
import * as commonUtils from "./../utils/commonUtils";
import { CP } from "..";
import "./index.css";
var displayName = "CpComposite";

var CpComposite = function CpComposite(props) {
  var schema = props.schema,
      defaultSchemaMap = props.defaultSchemaMap,
      initData = props.initData,
      refreshSchema = props.refreshSchema,
      name = props.name,
      title = props.title,
      _props$api = props.api,
      api = _props$api === void 0 ? {} : _props$api,
      filterParams = props.filterParams,
      widgets = props.widgets,
      otherProps = _objectWithoutProperties(props, _excluded);

  var url = schema.url,
      _schema$okPath = schema.okPath,
      okPath = _schema$okPath === void 0 ? "data" : _schema$okPath,
      table = schema.table;
  var requestFunc = CP.getCPInfo().requestFunc || postNew;

  var _useState = useState(false),
      _useState2 = _slicedToArray(_useState, 2),
      loading = _useState2[0],
      setLoading = _useState2[1]; // 首次渲染不因 initData 请求


  var hasPageSchema = useRef(false); // 用于上下文传递， 作为子页面的initData

  var _useState3 = useState(null),
      _useState4 = _slicedToArray(_useState3, 2),
      pageData = _useState4[0],
      setPageData = _useState4[1]; // 页面级接口请求入参 事件回调需要useRef


  var searchParams = useRef({}); // 赋值页面上下文数据   initData变更需刷新页面

  useEffect(function () {
    // 此处有待调优
    if (hasPageSchema.current) {
      onSdkSearch(initData);
    } else {
      // 页面首次渲染
      onSdkSearch(initData);
    }
  }, [initData]);
  /**
   * 必备函数
   * 表格请求函数
   * 暂支持post请求，因get用长度限制，避免过多参数
   * @param params 搜索项信息
   */

  var onSdkSearch = function onSdkSearch(params) {
    var _params = _objectSpread(_objectSpread({}, searchParams.current), params); // 是否有 请求配置


    if (url) {
      setLoading(true);
      requestFunc(commonUtils.getUrl(url), handleAppParams(_params, filterParams), okPath).then(function (_ref) {
        var data = _ref.data,
            exactData = _ref.exactData,
            other = _objectWithoutProperties(_ref, _excluded2);

        if (!data) {
          throw new Error("请求错误，自行处理，该请求可自行设计，只要返回正确数据格式即可！");
        } else {
          // 将页面数据作为 子页面的initData
          var resData = exactData || data; // 当返回数据是数组时， 嵌套一层

          var extInitData = isArray(resData) || isString(resData) ? {
            data: resData
          } : resData; // 将页面数据作为 子页面的initData

          setSearchParams(_objectSpread(_objectSpread({}, _params), extInitData));
        }
      }).catch(function (err) {
        console.error("err", err, displayName);
      }).finally(function () {
        setLoading(false);
      });
    } else {
      // 无请求配置， 直接设置页面级上下文数据
      setSearchParams(_params);
    }
  };
  /**
   * 设置页面级上下文数据
   * @param {页面级入参} params
   */


  var setSearchParams = function setSearchParams(params) {
    // 同步事件params
    searchParams.current = params; // 刷新所有子页面

    setPageData(params);
  };
  /**
   * 获取自组件的分子、分母
   * @param {分数字符串} fraction
   * @returns 默认 [1,1]即100%宽度
   */


  var getFraction = function getFraction(fraction) {
    try {
      return fraction.split("-").map(function (s) {
        return parseInt(s);
      });
    } catch (_unused) {
      return [1, 1];
    }
  };
  /**
   * 通过分子分母计算出宽度
   * @param {分子} fenZi
   * @param {分母} fenMu
   * @returns 返回组件宽度
   */


  var getWidth = function getWidth(fenZi, fenMu) {
    return "calc(100%*".concat(fenZi / fenMu, " - ").concat(fenMu - fenZi, "*20px/").concat(fenMu, ")");
  };

  var childRender = function childRender(renderInfo) {
    var pageType = renderInfo.pageType,
        name = renderInfo.name,
        title = renderInfo.title,
        key = renderInfo.key,
        sdkRender = renderInfo.sdkRender,
        fraction = renderInfo.fraction,
        height = renderInfo.height; // 模块name  支持 不展示模块标题

    var pageTitle = title === "null-Title" ? "" : title || name; // 用于计算宽度。 默认100%  1/1

    var _getFraction = getFraction(fraction),
        _getFraction2 = _slicedToArray(_getFraction, 2),
        fenZi = _getFraction2[0],
        fenMu = _getFraction2[1]; // 通过分子分母计算出宽度


    var width = getWidth(fenZi, fenMu); // 获取自定义渲染函数

    var renderFunc = commonUtils.getFunc(sdkRender, api);
    return /*#__PURE__*/React.createElement("div", {
      style: {
        width: width,
        // 通过fraction占比设置
        height: height || "auto",
        //  输入框设置，设置出错不兼容
        overflow: "scroll"
      }
    }, pageType === "sunmao_composite" || pageType === "sunmao_tabs" ? /*#__PURE__*/React.createElement("div", null, "\u6682\u4E0D\u652F\u6301\u5D4C\u5957\u590D\u6742\u8BE6\u60C5\u9875\uFF0C\u8BF7\u91CD\u65B0\u914D\u7F6E\u8BE5\u90E8\u5206\u5B9E\u73B0") : renderFunc ? renderFunc(renderInfo, pageData) : /*#__PURE__*/React.createElement(CpBase, _extends({
      flag: key,
      initData: pageData,
      api: api,
      widgets: widgets,
      defaultSchemaMap: defaultSchemaMap,
      title: pageTitle,
      filterParams: filterParams,
      tableProps: {
        title: pageTitle
      }
    }, otherProps)));
  };

  return !!pageData ? /*#__PURE__*/React.createElement(_Spin, {
    spinning: loading
  }, /*#__PURE__*/React.createElement("div", {
    className: "sunmao_composite"
  }, table.columnItems.map(childRender))) : /*#__PURE__*/React.createElement("div", null, "\u9875\u9762\u6784\u5EFA\u4E2D...");
};

export default CpComposite;