@teamix/pro 1.2.4 → 1.2.8

package/lib/card/index.scss

@@ -40,31 +40,196 @@
     }
   }
 
+  &-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);
+          }
+        }
+      }
+    }
   }
 
-  &.noBorder {
-    border: none;
+  & > .next-card-actions {
+    & > .teamix-pro-actions {
+      & > .next-btn {
+        margin-right: 0;
+        flex-grow: 1;
+      }
+
+      & > .next-divider {
+        margin: 0;
+      }
+    }
+  }
+
+  &.hoverable {
+    &:hover {
+      box-shadow: var(--shadow-3, 0px 6px 24px 0px rgba(0, 0, 0, 0.1));
+    }
   }
 
   &.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;
+    }
+    & > .next-card-content-container {
+      margin: 0;
+      padding: 0;
     }
   }
 
-  &.noHoveredShadow {
-    &:hover {
-      box-shadow: none;
+  &.border {
+    &-blue {
+      border-color: var(--color-notice-5);
+    }
+
+    &-orange {
+      border-color: var(--color-warning-5);
+    }
+
+    &-yellow {
+      border-color: var(--color-help-5);
+    }
+
+    &-red {
+      border-color: var(--color-error-5);
+    }
+
+    &-green {
+      border-color: var(--color-success-5);
+    }
+
+    &-grey {
+      border-color: var(--color-line1-1);
+    }
+
+    &-transparent {
+      border-color: transparent;
+    }
+
+    &-none {
+      border: none;
+    }
+  }
+
+  &-selectable {
+    cursor: pointer;
+
+    &-icon {
+      &-selected {
+        color: var(--color-notice-5);
+      }
+
+      &-unselected {
+        color: var(--color-line1-1);
+      }
     }
   }
 

package/lib/card/selectable.d.ts

@@ -0,0 +1,13 @@
+import { ProCardProps } from './index';
+export interface ProCardSelectableProps extends Omit<ProCardProps, 'onSelect'> {
+    selected?: boolean;
+    onSelect?: (selected: boolean) => void;
+}
+declare const ProCardSelectable: {
+    (props: ProCardSelectableProps): JSX.Element;
+    defaultProps: {
+        hoveredShadow: boolean;
+    };
+    isProCard: boolean;
+};
+export default ProCardSelectable;

package/lib/card/selectable.js

@@ -0,0 +1,60 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _icon = _interopRequireDefault(require("@teamix/icon"));
+
+var _utils = require("@teamix/utils");
+
+var _index = require("./index");
+
+var _excluded = ["selected", "onSelect", "className", "onClick"];
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+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 _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; }
+
+var cls = (0, _utils.baseClass)('teamix-pro-card-selectable');
+
+var ProCardSelectable = function ProCardSelectable(props) {
+  var selected = props.selected,
+      onSelect = props.onSelect,
+      className = props.className,
+      _onClick = props.onClick,
+      others = _objectWithoutProperties(props, _excluded);
+
+  return /*#__PURE__*/_react.default.createElement(_index.ProCard, _objectSpread({
+    className: (0, _classnames.default)(cls(), className),
+    borderColor: selected ? 'blue' : 'grey',
+    extra: /*#__PURE__*/_react.default.createElement(_icon.default, {
+      className: cls('icon', selected ? 'icon-selected' : 'icon-unselected'),
+      type: selected ? 'success-fill' : 'circle-line'
+    }),
+    onClick: function onClick(e) {
+      _onClick && _onClick(e);
+      onSelect && onSelect(!selected);
+    }
+  }, others));
+};
+
+ProCardSelectable.defaultProps = {
+  hoveredShadow: true
+};
+ProCardSelectable.isProCard = true;
+var _default = ProCardSelectable;
+exports.default = _default;

package/lib/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/lib/card/utils.js

@@ -0,0 +1,41 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.formatSpacing = formatSpacing;
+exports.getColClassAndStyle = getColClassAndStyle;
+
+var _utils = require("@teamix/utils");
+
+var cls = (0, _utils.baseClass)('teamix-pro-card');
+
+function formatSpacing(spacing) {
+  var spacingArray = spacing instanceof Array ? spacing : [spacing || 0, spacing || 0];
+  return {
+    horizonal: spacingArray[0] / 2,
+    vertical: spacingArray[1] / 2
+  };
+}
+
+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/lib/form/Components/ProField/index.js

@@ -40,12 +40,7 @@ var componentBuilder = function componentBuilder(type) {
     return /*#__PURE__*/_react.default.createElement(_field.default, _objectSpread(_objectSpread({}, props), {}, {
       type: type
     }));
-  }, (0, _react2.mapProps)(_utils.mapSize, _utils.mapStatus, _utils.mapDataSource, _utils.mapMode), (0, _react2.mapReadPretty)(function (props) {
-    return /*#__PURE__*/_react.default.createElement(_field.default, _objectSpread(_objectSpread({}, props), {}, {
-      type: type,
-      mode: "read"
-    }));
-  }));
+  }, (0, _react2.mapProps)(_utils.mapSize, _utils.mapStatus, _utils.mapDataSource, _utils.mapMode));
 };
 
 var _default = function () {

package/lib/form/Filter/index.js

@@ -50,8 +50,6 @@ 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; }
 
-var searchText = (0, _utils.getMessage)('search');
-
 var getEventProps = function getEventProps(triggerType, onFilter) {
   var keydownEvent = {
     onSubmit: onFilter
@@ -200,7 +198,8 @@ var AdvancedFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
               onResetValidateSuccess: onReset,
               style: _objectSpread({}, triggerType === 'submit' ? {} : {
                 marginRight: -16
-              })
+              }),
+              children: (0, _utils.getMessage)('reset')
             }
           }, {
             component: 'Submit',
@@ -209,9 +208,9 @@ var AdvancedFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
                 marginRight: -8
               } : {
                 display: 'none'
-              })
-            },
-            content: searchText
+              }),
+              children: (0, _utils.getMessage)('search')
+            }
           }]
         }]
       }])

package/lib/form/ProForm/index.js

@@ -27,9 +27,11 @@ var _useAutoSubmit = _interopRequireDefault(require("./useAutoSubmit"));
 
 var _useInitialRequest = _interopRequireDefault(require("./useInitialRequest"));
 
+var _validate = _interopRequireDefault(require("../locales/validate"));
+
 require("./index.scss");
 
-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 _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -47,12 +49,14 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 
 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; }
 
+(0, _core.registerValidateLocale)(_validate.default);
 var ProForm = /*#__PURE__*/(0, _react.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,
@@ -68,11 +72,18 @@ var ProForm = /*#__PURE__*/(0, _react.memo)(function (_ref) {
       otherProps = _objectWithoutProperties(_ref, _excluded);
 
   var form = (0, _react.useMemo)(function () {
-    return outerForm || (0, _core.createForm)();
+    return outerForm || (0, _core.createForm)({
+      validateFirst: true
+    });
   }, []);
   var prefixCls = (0, _utils.usePrefixCls)('', {
     prefix: 'teamix-pro-form'
   });
+  var mergedScope = (0, _react.useMemo)(function () {
+    return _objectSpread(_objectSpread({}, scope), {}, {
+      context: context
+    });
+  }, [scope, context]);
   var onAutoSubmit = (0, _useAutoSubmit.default)(onSubmit);
   var getTeamixLayout = (0, _react.useMemo)(function () {
     return breakpoints ? {
@@ -110,17 +121,12 @@ var ProForm = /*#__PURE__*/(0, _react.memo)(function (_ref) {
         form.setInitialValues(values);
       });
     }
+  }, []); // 配置国际化
+
+  (0, _react.useEffect)(function () {
+    (0, _core.setValidateLanguage)((0, _utils.getLanguage)() || 'zh-cn');
   }, []);
-  return outerForm === false ?
-  /*#__PURE__*/
-  // 特殊表单，无需渲染form实例，例如FormDialog等
-  _react.default.createElement(_formily.FormLayout, _objectSpread(_objectSpread({
-    className: (0, _classnames.default)(prefixCls, className)
-  }, otherProps), getTeamixLayout), /*#__PURE__*/_react.default.createElement(_SchemaForm.default, {
-    schema: schema,
-    scope: scope,
-    components: components
-  }), children) : /*#__PURE__*/_react.default.createElement(_formily.Form, _objectSpread(_objectSpread(_objectSpread({
+  return /*#__PURE__*/_react.default.createElement(_formily.Form, _objectSpread(_objectSpread(_objectSpread({
     className: (0, _classnames.default)(prefixCls, className)
   }, otherProps), getTeamixLayout), {}, {
     form: form,
@@ -128,9 +134,30 @@ var ProForm = /*#__PURE__*/(0, _react.memo)(function (_ref) {
     onAutoSubmitFailed: onSubmitFailed
   }), /*#__PURE__*/_react.default.createElement(_SchemaForm.default, {
     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/lib/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/lib/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/lib/form/ProForm/useAutoSubmit.js

@@ -15,7 +15,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; }
 
-var useAutoSubmit = function useAutoSubmit(onSubmit) {
+var useAutoSubmit = function useAutoSubmit(onSubmit, context) {
   if ((0, _utils.isObj)(onSubmit)) {
     var history = (0, _reactRouterDom.useHistory)();
     var submitConfig = onSubmit;
@@ -24,9 +24,9 @@ var useAutoSubmit = function useAutoSubmit(onSubmit) {
         method: 'POST'
       }, submitConfig), {}, {
         params: _objectSpread(_objectSpread({}, values), submitConfig.params || {})
-      }), {
+      }), _objectSpread({
         fields: values
-      }, history);
+      }, context), history);
     };
   }
 

package/lib/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/lib/form/ProForm/useInitialRequest.js

@@ -13,10 +13,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; }
 
-var useInitialRequest = function useInitialRequest(initialRequest) {
+var useInitialRequest = function useInitialRequest(initialRequest, context) {
   return (0, _utils.doCommonRequest)(_objectSpread({
     method: 'GET'
-  }, initialRequest));
+  }, initialRequest), context);
 };
 
 var _default = useInitialRequest;

package/lib/form/SchemaForm/initializeDataSource.js

@@ -21,7 +21,7 @@ var initializeDataSource = function initializeDataSource(dataSource) {
     var requestScopeName = (0, _utils2.getRandomName)('$request');
     var dataSourceScopeName = (0, _utils2.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, (0, _reactions.$request)(requestConfig)), _defineProperty(_scope, dataSourceScopeName, _reactions.$dataSource), _scope)
     };
   }

package/lib/form/SchemaForm/initializeFormButton.js

@@ -4,6 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
+var _utils = require("@teamix/utils");
+
 var _excluded = ["sticky", "container", "onAffix"];
 
 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; }
@@ -17,8 +20,8 @@ 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; }
 
 var buttonTextMap = {
-  Submit: '提交',
-  Reset: '重置'
+  Submit: (0, _utils.getMessage)('submit'),
+  Reset: (0, _utils.getMessage)('reset')
 };
 
 var initializeButton = function initializeButton(item) {

package/lib/form/SchemaForm/initializeRequest.js

@@ -13,10 +13,13 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 
 var initializeRequest = function initializeRequest(requestConfig) {
   if (requestConfig) {
+    var _scope;
+
     var requestScopeName = (0, _utils.getRandomName)('$request');
+    var contextScopeName = (0, _utils.getRandomName)('$context');
     return {
-      reactions: ["{{".concat(requestScopeName, "}}")],
-      scope: _defineProperty({}, requestScopeName, (0, _reactions.$request)(requestConfig))
+      reactions: ["{{".concat(contextScopeName, "(").concat(requestScopeName, ",").concat(requestConfig.onComplete, ",context)}}")],
+      scope: (_scope = {}, _defineProperty(_scope, requestScopeName, (0, _reactions.$request)(requestConfig)), _defineProperty(_scope, contextScopeName, _reactions.$context), _scope)
     };
   }
 

package/lib/form/SchemaForm/initializeRules.js

@@ -41,7 +41,7 @@ var initializeRules = function initializeRules(rules) {
       var validatorScopeName = (0, _utils2.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, (0, _reactions.$request)(validator)), _defineProperty(_scope, validatorScopeName, _reactions2.$validator), _scope)
       };

package/lib/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 };