@teamix/pro 1.2.0 → 1.2.5

package/es/card/index.scss

@@ -40,12 +40,130 @@
     }
   }
 
+  &-title {
+    display: flex;
+    align-items: center;
+
+    & > div {
+      display: flex;
+      align-items: center;
+      &:not(:last-child) {
+        margin-right: var(--s-2, 8px);
+      }
+    }
+
+    &-collapse {
+      cursor: pointer;
+
+      & > i {
+        transition: transform 0.2s;
+        color: var(--color-text1-8, #848484);
+        margin-right: var(--s-2, 8px);
+      }
+
+      &.collapsed {
+        & > i {
+          transform: rotate(-90deg);
+        }
+      }
+    }
+
+    &-description,
+    &-tooltip {
+      color: var(--color-text1-8, #848484);
+      font-weight: normal;
+    }
+
+    &-description {
+      font-size: 12px;
+    }
+  }
+
+  &-divider {
+    flex: none;
+    background-color: var(--color-line1-1, #eaeaea);
+  }
+
   &-content {
     &.centered {
       display: flex;
       align-items: center;
       justify-content: center;
     }
+
+    &.contain-pro-card {
+      display: flex;
+
+      &.flex-wrap {
+        flex-wrap: wrap;
+      }
+
+      &.flex-direction {
+        &-row {
+          flex-direction: row;
+
+          .teamix-pro-card-divider {
+            width: 1px;
+          }
+        }
+
+        &-row-reverse {
+          flex-direction: row-reverse;
+          .teamix-pro-card-divider {
+            width: 1px;
+          }
+        }
+
+        &-column {
+          flex-direction: column;
+          .teamix-pro-card-divider {
+            height: 1px;
+          }
+        }
+
+        &-column-reverse {
+          flex-direction: column-reverse;
+          .teamix-pro-card-divider {
+            height: 1px;
+          }
+        }
+      }
+
+      &.split-horizontal,
+      &.split-vertical {
+        & > .teamix-pro-card-col > .teamix-pro-card {
+          border: none;
+        }
+      }
+
+      &.split-horizontal {
+        & > .teamix-pro-card-col {
+          &:not(:last-child) {
+            border-right: 1px solid var(--color-line1-1, #eaeaea);
+          }
+        }
+      }
+      &.split-vertical {
+        & > .teamix-pro-card-col {
+          &:not(:last-child) {
+            border-bottom: 1px solid var(--color-line1-1, #eaeaea);
+          }
+        }
+      }
+    }
+  }
+
+  & > .next-card-actions {
+    & > .teamix-pro-actions {
+      & > .next-btn {
+        margin-right: 0;
+        flex-grow: 1;
+      }
+
+      & > .next-divider {
+        margin: 0;
+      }
+    }
   }
 
   &.noBorder {
@@ -54,17 +172,14 @@
 
   &.compacted {
     border: none;
-    --card-body-padding-bottom: 0px;
-    --card-padding-lr: 0px;
 
-    .next-card-content-container {
-      --card-body-show-divider-padding-top: 0px;
+    & > .next-card-header {
+      margin-top: 0;
+      padding: 0;
     }
-  }
-
-  &.noHoveredShadow {
-    &:hover {
-      box-shadow: none;
+    & > .next-card-content-container {
+      margin: 0;
+      padding: 0;
     }
   }
 

package/es/card/utils.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+export declare function formatSpacing(spacing?: [number, number] | number): {
+    horizonal: number;
+    vertical: number;
+};
+export declare function getColClassAndStyle(col?: number | string): {
+    className?: string;
+    style: React.CSSProperties;
+};

package/es/card/utils.js

@@ -0,0 +1,30 @@
+import { baseClass } from '@teamix/utils';
+var cls = baseClass('teamix-pro-card');
+export function formatSpacing(spacing) {
+  var spacingArray = spacing instanceof Array ? spacing : [spacing || 0, spacing || 0];
+  return {
+    horizonal: spacingArray[0] / 2,
+    vertical: spacingArray[1] / 2
+  };
+}
+export function getColClassAndStyle(col) {
+  if (!col) {
+    return {
+      style: {}
+    };
+  }
+
+  if (typeof col === 'number') {
+    return {
+      className: cls("col-".concat(col)),
+      style: {}
+    };
+  }
+
+  return {
+    style: {
+      width: col,
+      flexShrink: 0
+    }
+  };
+}

package/es/form/Components/ProField/index.js

@@ -17,7 +17,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 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; }
 
 import React from 'react';
-import { connect, mapProps, mapReadPretty } from '@formily/react';
+import { connect, mapProps } from '@formily/react';
 import { mapSize, mapStatus, mapDataSource, mapMode } from '../../utils';
 import ProField from '../../../field';
 import fieldTypeMap from '../../fieldTypeMap';
@@ -27,11 +27,7 @@ var componentBuilder = function componentBuilder(type) {
     return /*#__PURE__*/React.createElement(ProField, _objectSpread(_objectSpread({}, props), {}, {
       type: type
     }));
-  }, mapProps(mapSize, mapStatus, mapDataSource, mapMode), mapReadPretty(function (props) {
-    return /*#__PURE__*/React.createElement(ProField, _objectSpread(_objectSpread({}, props), {}, {
-      mode: "read"
-    }));
-  }));
+  }, mapProps(mapSize, mapStatus, mapDataSource, mapMode));
 };
 
 export default (function () {

package/es/form/ProForm/index.js

@@ -1,4 +1,4 @@
-var _excluded = ["form", "initialValues", "initialRequest", "schema", "scope", "components", "children", "layout", "labelAlign", "wrapperAlign", "labelCol", "wrapperCol", "breakpoints", "onChange", "onSubmit", "onSubmitFailed", "className"];
+var _excluded = ["form", "initialValues", "initialRequest", "schema", "scope", "context", "components", "children", "layout", "labelAlign", "wrapperAlign", "labelCol", "wrapperCol", "breakpoints", "onChange", "onSubmit", "onSubmitFailed", "className"];
 
 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; }
 
@@ -12,21 +12,24 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 import React, { memo, useEffect, useMemo } from 'react';
 import cls from 'classnames';
-import { createForm, onFormValuesChange } from '@formily/core';
+import { createForm, onFormValuesChange, registerValidateLocale, setValidateLanguage } from '@formily/core';
 import { toJS } from '@formily/reactive';
-import { Form, FormLayout } from '@teamix/formily';
-import { usePrefixCls } from '@teamix/utils';
+import { Form } from '@teamix/formily';
+import { usePrefixCls, getLanguage } from '@teamix/utils';
 import SchemaForm from '../SchemaForm';
 import { mergeArrayValue } from '../utils';
 import useAutoSubmit from './useAutoSubmit';
 import useInitialRequest from './useInitialRequest';
+import validateLocale from '../locales/validate';
 import './index.scss';
+registerValidateLocale(validateLocale);
 var ProForm = /*#__PURE__*/memo(function (_ref) {
   var outerForm = _ref.form,
       initialValues = _ref.initialValues,
       initialRequest = _ref.initialRequest,
       schema = _ref.schema,
       scope = _ref.scope,
+      context = _ref.context,
       components = _ref.components,
       children = _ref.children,
       layout = _ref.layout,
@@ -42,11 +45,18 @@ var ProForm = /*#__PURE__*/memo(function (_ref) {
       otherProps = _objectWithoutProperties(_ref, _excluded);
 
   var form = useMemo(function () {
-    return outerForm || createForm();
+    return outerForm || createForm({
+      validateFirst: true
+    });
   }, []);
   var prefixCls = usePrefixCls('', {
     prefix: 'teamix-pro-form'
   });
+  var mergedScope = useMemo(function () {
+    return _objectSpread(_objectSpread({}, scope), {}, {
+      context: context
+    });
+  }, [scope, context]);
   var onAutoSubmit = useAutoSubmit(onSubmit);
   var getTeamixLayout = useMemo(function () {
     return breakpoints ? {
@@ -84,17 +94,12 @@ var ProForm = /*#__PURE__*/memo(function (_ref) {
         form.setInitialValues(values);
       });
     }
+  }, []); // 配置国际化
+
+  useEffect(function () {
+    setValidateLanguage(getLanguage() || 'zh-cn');
   }, []);
-  return outerForm === false ?
-  /*#__PURE__*/
-  // 特殊表单，无需渲染form实例，例如FormDialog等
-  React.createElement(FormLayout, _objectSpread(_objectSpread({
-    className: cls(prefixCls, className)
-  }, otherProps), getTeamixLayout), /*#__PURE__*/React.createElement(SchemaForm, {
-    schema: schema,
-    scope: scope,
-    components: components
-  }), children) : /*#__PURE__*/React.createElement(Form, _objectSpread(_objectSpread(_objectSpread({
+  return /*#__PURE__*/React.createElement(Form, _objectSpread(_objectSpread(_objectSpread({
     className: cls(prefixCls, className)
   }, otherProps), getTeamixLayout), {}, {
     form: form,
@@ -102,9 +107,30 @@ var ProForm = /*#__PURE__*/memo(function (_ref) {
     onAutoSubmitFailed: onSubmitFailed
   }), /*#__PURE__*/React.createElement(SchemaForm, {
     schema: schema,
-    scope: scope,
+    scope: mergedScope,
     components: components
-  }), children);
+  }), children); // return outerForm === false ? ( // 特殊表单，无需渲染form实例，例如FormDialog等
+  //   <FormLayout
+  //     className={cls(prefixCls, className)}
+  //     {...otherProps}
+  //     {...getTeamixLayout}
+  //   >
+  //     <SchemaForm schema={schema} scope={scope} components={components} />
+  //     {children}
+  //   </FormLayout>
+  // ) : (
+  //   <Form
+  //     className={cls(prefixCls, className)}
+  //     {...otherProps}
+  //     {...getTeamixLayout}
+  //     form={form}
+  //     onAutoSubmit={onAutoSubmit}
+  //     onAutoSubmitFailed={onSubmitFailed}
+  //   >
+  //     <SchemaForm schema={schema} scope={scope} components={components} />
+  //     {children}
+  //   </Form>
+  // );
 });
 ProForm.defaultProps = {
   colon: false,

package/es/form/ProForm/index.scss

@@ -244,7 +244,6 @@
   right: 0;
   width: 100% !important;
   height: 56px !important;
-  padding-left: 24px;
   background: var(--color-fill1-1, #fff) !important;
   box-shadow: 0 -1px 5px 0 rgba(38, 38, 38, 0.14);
   z-index: 2;

package/es/form/ProForm/useAutoSubmit.d.ts

@@ -1,6 +1,6 @@
 import { CommonRequestConfig } from '@teamix/utils';
 interface IUseAutoSubmit {
-    (onSubmit?: ((values: any) => any) | CommonRequestConfig): any;
+    (onSubmit?: ((values: any) => any) | CommonRequestConfig, context?: any): any;
 }
 declare const useAutoSubmit: IUseAutoSubmit;
 export default useAutoSubmit;

package/es/form/ProForm/useAutoSubmit.js

@@ -7,7 +7,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 import { useHistory } from 'react-router-dom';
 import { doCommonRequest, isObj } from '@teamix/utils';
 
-var useAutoSubmit = function useAutoSubmit(onSubmit) {
+var useAutoSubmit = function useAutoSubmit(onSubmit, context) {
   if (isObj(onSubmit)) {
     var history = useHistory();
     var submitConfig = onSubmit;
@@ -16,9 +16,9 @@ var useAutoSubmit = function useAutoSubmit(onSubmit) {
         method: 'POST'
       }, submitConfig), {}, {
         params: _objectSpread(_objectSpread({}, values), submitConfig.params || {})
-      }), {
+      }), _objectSpread({
         fields: values
-      }, history);
+      }, context), history);
     };
   }
 

package/es/form/ProForm/useInitialRequest.d.ts

@@ -1,6 +1,6 @@
 import { CommonRequestConfig } from '@teamix/utils';
 interface IUseInitialRequest {
-    (initialRequest: CommonRequestConfig): Promise<any>;
+    (initialRequest: CommonRequestConfig, context?: any): Promise<any>;
 }
 declare const useInitialRequest: IUseInitialRequest;
 export default useInitialRequest;

package/es/form/ProForm/useInitialRequest.js

@@ -6,10 +6,10 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 
 import { doCommonRequest } from '@teamix/utils';
 
-var useInitialRequest = function useInitialRequest(initialRequest) {
+var useInitialRequest = function useInitialRequest(initialRequest, context) {
   return doCommonRequest(_objectSpread({
     method: 'GET'
-  }, initialRequest));
+  }, initialRequest), context);
 };
 
 export default useInitialRequest;

package/es/form/SchemaForm/initializeDataSource.js

@@ -12,7 +12,7 @@ var initializeDataSource = function initializeDataSource(dataSource) {
     var requestScopeName = getRandomName('$request');
     var dataSourceScopeName = getRandomName('$dataSource');
     return {
-      reactions: ["{{".concat(dataSourceScopeName, "(").concat(requestScopeName, ",").concat(requestConfig.onComplete, ")}}")],
+      reactions: ["{{".concat(dataSourceScopeName, "(").concat(requestScopeName, ",").concat(requestConfig.onComplete, ",context)}}")],
       scope: (_scope = {}, _defineProperty(_scope, requestScopeName, $request(requestConfig)), _defineProperty(_scope, dataSourceScopeName, $dataSource), _scope)
     };
   }

package/es/form/SchemaForm/initializeFormButton.js

@@ -10,9 +10,10 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 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; }
 
+import { getMessage } from '@teamix/utils';
 var buttonTextMap = {
-  Submit: '提交',
-  Reset: '重置'
+  Submit: getMessage('submit'),
+  Reset: getMessage('reset')
 };
 
 var initializeButton = function initializeButton(item) {

package/es/form/SchemaForm/initializeRequest.js

@@ -1,14 +1,17 @@
 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; }
 
-import { $request } from '../SchemaForm/reactions';
+import { $request, $context } from '../SchemaForm/reactions';
 import { getRandomName } from '../utils';
 
 var initializeRequest = function initializeRequest(requestConfig) {
   if (requestConfig) {
+    var _scope;
+
     var requestScopeName = getRandomName('$request');
+    var contextScopeName = getRandomName('$context');
     return {
-      reactions: ["{{".concat(requestScopeName, "}}")],
-      scope: _defineProperty({}, requestScopeName, $request(requestConfig))
+      reactions: ["{{".concat(contextScopeName, "(").concat(requestScopeName, ",").concat(requestConfig.onComplete, ",context)}}")],
+      scope: (_scope = {}, _defineProperty(_scope, requestScopeName, $request(requestConfig)), _defineProperty(_scope, contextScopeName, $context), _scope)
     };
   }
 

package/es/form/SchemaForm/initializeRules.js

@@ -31,7 +31,7 @@ var initializeRules = function initializeRules(rules) {
       var validatorScopeName = getRandomName('$validator');
       return {
         rules: _objectSpread(_objectSpread({}, rule), {}, {
-          validator: "{{".concat(validatorScopeName, "(").concat(requestScopeName, ",").concat(validator.onComplete, ")}}")
+          validator: "{{".concat(validatorScopeName, "(").concat(requestScopeName, ",").concat(validator.onComplete, ",context)}}")
         }),
         scope: (_scope = {}, _defineProperty(_scope, requestScopeName, $request(validator)), _defineProperty(_scope, validatorScopeName, $validator), _scope)
       };

package/es/form/SchemaForm/reactions.d.ts

@@ -1,5 +1,6 @@
 import type { ProFormRequestConfig } from '../typing';
-declare const $request: (requestConfig: ProFormRequestConfig) => (field: any) => Promise<unknown>;
-declare const $validator: (services: any, onComplete?: any) => (value: any, rules: any, { field }: any) => any;
-declare const $dataSource: (services: any, onComplete?: any) => (field: any) => any;
-export { $request, $dataSource, $validator };
+declare const $request: (requestConfig: ProFormRequestConfig) => (field: any, context: any) => Promise<unknown>;
+declare const $context: (services: any, onComplete: any, context: any) => (field: any) => any;
+declare const $validator: (services: any, onComplete: any, context: any) => (value: any, rules: any, { field }: any) => any;
+declare const $dataSource: (services: any, onComplete: any, context: any) => (field: any) => any;
+export { $request, $context, $dataSource, $validator };

package/es/form/SchemaForm/reactions.js

@@ -7,44 +7,53 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 import { isFn, isPlainObj, doCommonRequest } from '@teamix/utils'; // 配置请求
 
 var $request = function $request(requestConfig) {
-  return function (field) {
+  return function (field, context) {
     var _field$data;
 
     var refresh = field === null || field === void 0 ? void 0 : (_field$data = field.data) === null || _field$data === void 0 ? void 0 : _field$data.refresh;
     var beforeRequest = requestConfig.beforeRequest,
         onSuccess = requestConfig.onSuccess;
     var refreshResult = isPlainObj(refresh) ? refresh : {};
-    var beforeRequestResult = isFn(beforeRequest) ? beforeRequest(field) : {};
+    var beforeRequestResult = isFn(beforeRequest) ? beforeRequest(field, context) : {};
     return doCommonRequest(_objectSpread(_objectSpread({}, requestConfig), {}, {
       params: _objectSpread(_objectSpread(_objectSpread({}, requestConfig.params), beforeRequestResult), refreshResult),
       beforeRequest: function beforeRequest() {
         return beforeRequestResult;
       },
       onSuccess: isFn(onSuccess) ? function (res) {
-        return onSuccess(res, field);
+        return onSuccess(res, field, context);
       } : onSuccess
-    }), field);
+    }), context);
+  };
+}; // 配置上下文
+
+
+var $context = function $context(services, onComplete, context) {
+  return function (field) {
+    return services(field, context).then(function (res) {
+      return onComplete && onComplete(res, field, context);
+    });
   };
 }; // 配置校验
 
 
-var $validator = function $validator(services, onComplete) {
+var $validator = function $validator(services, onComplete, context) {
   return function (value, rules, _ref) {
     var field = _ref.field;
-    return services(field).then(function (res) {
-      return onComplete && onComplete(res, field);
+    return services(field, context).then(function (res) {
+      return onComplete && onComplete(res, field, context);
     });
   };
 }; // 配置DataSource
 
 
-var $dataSource = function $dataSource(services, onComplete) {
+var $dataSource = function $dataSource(services, onComplete, context) {
   return function (field) {
     field.setState({
       loading: true,
       readOnly: true
     });
-    return services(field).then(function (res) {
+    return services(field, context).then(function (res) {
       var _res$map;
 
       var isValueInDataSource = res === null || res === void 0 ? void 0 : (_res$map = res.map(function (v) {
@@ -58,7 +67,7 @@ var $dataSource = function $dataSource(services, onComplete) {
         loading: false,
         readOnly: false
       }, clearValue));
-      return onComplete && onComplete(res, field);
+      return onComplete && onComplete(res, field, context);
     }).catch(function () {
       field.setState({
         loading: false,
@@ -68,4 +77,4 @@ var $dataSource = function $dataSource(services, onComplete) {
   };
 };
 
-export { $request, $dataSource, $validator };
+export { $request, $context, $dataSource, $validator };