@teamix/pro 1.1.34 → 1.1.38

package/lib/actions/dialog.d.ts

@@ -1,12 +1,23 @@
 import React from 'react';
 import { QuickShowConfig } from '@alicloudfe/components/types/dialog';
 import { quickShowDrawerProps } from '@alicloudfe/components/types/drawer';
+import { IFormSchema, IFormSchemaItem } from '../form';
 import { RequestAction } from './request';
 export interface DialogAction extends Omit<RequestAction, 'url'>, Omit<QuickShowConfig, 'onError' | 'type'>, Omit<quickShowDrawerProps, 'trigger' | 'animation' | 'height' | 'locale' | 'onOk' | 'onCancel' | 'onError'> {
+    /** 点击「确认按钮」后的数据请求地址，非必填，不填就不发请求 */
     url?: string;
+    /** 弹窗类型，支持普通弹窗和抽屉两种模式，默认为普通弹窗 */
     dialogType?: 'dialog' | 'drawer';
+    /** 弹窗快捷调用类型 */
     dialogQuickShowType?: 'alert' | 'confirm';
+    /** 弹窗消息类型 */
     messageType?: 'success' | 'warning' | 'error' | 'notice' | 'help' | 'loading';
+    /** 位于弹窗内容上方的自定义内容区 */
+    beforeContent?: React.ReactNode;
+    /** 位于弹窗内容下方的自定义内容区 */
+    afterContent?: React.ReactNode;
+    /** 弹窗页脚描述区，位于按钮组的对面 */
+    footerDescription?: React.ReactNode | IFormSchema | IFormSchemaItem;
 }
 export declare function useDialogAction(action: DialogAction, context?: any): {
     [x: string]: (e: React.MouseEvent<HTMLElement, MouseEvent>) => void;

package/lib/actions/dialog.js

@@ -10,18 +10,25 @@ exports.useDialogAction = useDialogAction;
 
 var _react = _interopRequireWildcard(require("react"));
 
+var _classnames = _interopRequireDefault(require("classnames"));
+
 var _reactRouterDom = require("react-router-dom");
 
 var _components = require("@alicloudfe/components");
 
 var _utils = require("@teamix/utils");
 
+var _form = _interopRequireWildcard(require("../form"));
+
 var _base = require("./base");
 
 var _request = require("./request");
 
 var _excluded = ["url", "method", "params", "data", "extendParams", "successMsg", "errorMsg", "formatParams", "formatResult", "onSuccess", "onError"],
-    _excluded2 = ["title", "content", "component", "schema", "onFinish", "dialogType", "dialogQuickShowType", "messageType", "beforeRequest", "onTrigger", "link"];
+    _excluded2 = ["title", "content", "component", "schema", "onFinish", "dialogType", "dialogQuickShowType", "messageType", "beforeRequest", "onTrigger", "link", "beforeContent", "afterContent", "footerDescription", "footerAlign", "overlayProps"],
+    _excluded3 = ["className"];
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
@@ -31,16 +38,16 @@ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try
 
 function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
 
-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; }
-
 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; }
+
 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."); }
@@ -59,6 +66,27 @@ function addContextForReactNode(content, context) {
   }
 
   return content;
+}
+
+var FooterForm = function FooterForm(props) {
+  var schema = props.schema,
+      context = props.context,
+      formRef = props.formRef;
+  var form = (0, _form.createForm)();
+  (0, _react.useEffect)(function () {
+    formRef.current = form;
+  }, []);
+  return /*#__PURE__*/_react.default.createElement(_form.default, {
+    layout: "inline",
+    feedbackLayout: "none",
+    form: form,
+    schema: (0, _utils.getTargetValue)(schema, context)
+  });
+};
+
+function getFooterAlignClass(isDrawer, align) {
+  var footerAlign = align ? align : isDrawer ? 'left' : 'right';
+  return "footer-align-".concat(footerAlign);
 } // 弹窗 -> 请求（点击确认，发送数据请求）
 
 
@@ -68,8 +96,10 @@ function useDialogAction(action, context) {
       loading = _useState2[0],
       setLoading = _useState2[1];
 
+  var footerDescriptionRef = (0, _react.useRef)();
   var history = (0, _reactRouterDom.useHistory)();
-  return _objectSpread({}, (0, _base.eventHandler)(action, function () {
+
+  var onActionStart = function onActionStart() {
     var url = action.url,
         method = action.method,
         params = action.params,
@@ -96,19 +126,56 @@ function useDialogAction(action, context) {
         beforeRequest = _getTargetValue.beforeRequest,
         onTrigger = _getTargetValue.onTrigger,
         link = _getTargetValue.link,
-        dialogOtherProps = _objectWithoutProperties(_getTargetValue, _excluded2);
+        beforeContent = _getTargetValue.beforeContent,
+        afterContent = _getTargetValue.afterContent,
+        footerDescription = _getTargetValue.footerDescription,
+        footerAlign = _getTargetValue.footerAlign,
+        _getTargetValue$overl = _getTargetValue.overlayProps,
+        overlayProps = _getTargetValue$overl === void 0 ? {} : _getTargetValue$overl,
+        containerProps = _objectWithoutProperties(_getTargetValue, _excluded2);
+
+    var isDrawer = dialogType === 'drawer';
+    var container = isDrawer ? _components.Drawer : _components.Dialog;
+
+    var overlayClassName = overlayProps.className,
+        overlayOtherProps = _objectWithoutProperties(overlayProps, _excluded3);
 
-    var dialogMethod = dialogType === 'drawer' ? _components.Drawer : _components.Dialog;
-    var dialogProps = dialogType === 'drawer' ? {} : {
+    var dialogOnlyProps = {
       type: dialogQuickShowType,
       messageProps: {
         type: messageType
+      },
+      overlayProps: _objectSpread({
+        className: (0, _classnames.default)('teamix-pro-action-dialog', overlayClassName, {
+          'has-footer-description': !!footerDescription
+        })
+      }, overlayOtherProps)
+    };
+    var containerOtherProps = isDrawer ? {} : dialogOnlyProps;
+
+    var renderDialogFooterDescription = function renderDialogFooterDescription(footer) {
+      if (footer instanceof Array || footer.component) {
+        var _schema = footer instanceof Array ? footer : [footer];
+
+        return /*#__PURE__*/_react.default.createElement(FooterForm, {
+          formRef: footerDescriptionRef,
+          context: context,
+          schema: [{
+            component: 'FormFlex',
+            children: _schema
+          }]
+        });
       }
+
+      return footer;
     };
 
     var onOk = function onOk() {
       return new Promise( /*#__PURE__*/function () {
         var _ref = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(resolve) {
+          var _footerDescriptionRef;
+
+          var footerDescriptionValues, requestContext;
           return regeneratorRuntime.wrap(function _callee$(_context) {
             while (1) {
               switch (_context.prev = _context.next) {
@@ -128,29 +195,33 @@ function useDialogAction(action, context) {
 
                 case 5:
                   setLoading(true);
-                  _context.prev = 6;
-                  _context.next = 9;
-                  return (0, _request.doRequest)(action, context, history);
-
-                case 9:
+                  footerDescriptionValues = Object.assign({}, footerDescriptionRef === null || footerDescriptionRef === void 0 ? void 0 : (_footerDescriptionRef = footerDescriptionRef.current) === null || _footerDescriptionRef === void 0 ? void 0 : _footerDescriptionRef.values);
+                  _context.prev = 7;
+                  requestContext = Object.assign({
+                    footer: footerDescriptionValues
+                  }, context);
+                  _context.next = 11;
+                  return (0, _request.doRequest)(action, requestContext, history, footerDescriptionValues);
+
+                case 11:
                   onFinish && onFinish();
                   resolve(true);
-                  _context.next = 18;
+                  _context.next = 20;
                   break;
 
-                case 13:
-                  _context.prev = 13;
-                  _context.t0 = _context["catch"](6);
+                case 15:
+                  _context.prev = 15;
+                  _context.t0 = _context["catch"](7);
                   setLoading(false);
                   resolve(false);
                   return _context.abrupt("return");
 
-                case 18:
+                case 20:
                 case "end":
                   return _context.stop();
               }
             }
-          }, _callee, null, [[6, 13]]);
+          }, _callee, null, [[7, 15]]);
         }));
 
         return function (_x) {
@@ -171,17 +242,27 @@ function useDialogAction(action, context) {
     var dialogContext = Object.assign({}, context, {
       hide: hide
     });
-    var ret = dialogMethod.show(_objectSpread(_objectSpread({
+    var dialogContent = Component ? /*#__PURE__*/_react.default.createElement(Component, _objectSpread({
+      key: (0, _utils.uuid)()
+    }, componentProps)) : addContextForReactNode(content, dialogContext);
+    var ret = container.show(_objectSpread(_objectSpread({
       // @ts-ignore
       onOk: onOk,
       title: addContextForReactNode(title, dialogContext),
-      content: Component ? /*#__PURE__*/_react.default.createElement(Component, _objectSpread({
-        key: (0, _utils.uuid)()
-      }, componentProps)) : addContextForReactNode(content, dialogContext),
-      closeable: !loading
-    }, dialogProps), dialogOtherProps));
+      content: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, beforeContent && /*#__PURE__*/_react.default.createElement("div", {
+        className: "teamix-pro-dialog-before-content"
+      }, beforeContent), dialogContent, afterContent && /*#__PURE__*/_react.default.createElement("div", {
+        className: "teamix-pro-dialog-after-content"
+      }, afterContent), footerDescription && /*#__PURE__*/_react.default.createElement("div", {
+        className: (0, _classnames.default)('teamix-pro-dialog-footer-description', getFooterAlignClass(isDrawer, footerAlign))
+      }, renderDialogFooterDescription(footerDescription))),
+      closeable: !loading,
+      footerAlign: footerAlign
+    }, containerOtherProps), containerProps));
     store.hide = ret.hide;
-  }));
+  };
+
+  return _objectSpread({}, (0, _base.eventHandler)(action, onActionStart));
 }
 
 var _default = useDialogAction;

package/lib/actions/drawer-info.d.ts

@@ -0,0 +1,6 @@
+import { DialogInfoAction } from './dialog-info';
+export declare type DrawerInfoAction = DialogInfoAction;
+export declare function useDrawerInfoAction(action: DrawerInfoAction, context?: any): {
+    [x: string]: (e: import("react").MouseEvent<HTMLElement, MouseEvent>) => void;
+};
+export default useDrawerInfoAction;

package/lib/actions/drawer-info.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+exports.useDrawerInfoAction = useDrawerInfoAction;
+
+var _dialogInfo = require("./dialog-info");
+
+function useDrawerInfoAction(action, context) {
+  return (0, _dialogInfo.useDialogInfoAction)(Object.assign({
+    dialogType: 'drawer'
+  }, action), context);
+}
+
+var _default = useDrawerInfoAction;
+exports.default = _default;

package/lib/actions/index.d.ts

@@ -10,17 +10,17 @@ import { NoticeAction } from './notice';
 import { ErrorAction } from './error';
 import { DialogFormAction } from './dialog-form';
 import { DialogTableAction } from './dialog-table';
+import { DialogInfoAction } from './dialog-info';
 import { DrawerAction } from './drawer';
 import { DrawerFormAction } from './drawer-form';
 import { DrawerTableAction } from './drawer-table';
+import { DrawerInfoAction } from './drawer-info';
 import './index.scss';
 export declare type ActionConfig = ({
     type: 'link';
 } & LinkAction) | ({
     type: 'request';
 } & RequestAction) | ({
-    type: 'dialog';
-} & DialogAction) | ({
     type: 'confirm';
 } & ConfirmAction) | ({
     type: 'danger-confirm';
@@ -29,16 +29,22 @@ export declare type ActionConfig = ({
 } & NoticeAction) | ({
     type: 'error';
 } & ErrorAction) | ({
+    type: 'dialog';
+} & DialogAction) | ({
     type: 'dialog-form';
 } & DialogFormAction) | ({
+    type: 'dialog-table';
+} & DialogTableAction) | ({
+    type: 'dialog-info';
+} & DialogInfoAction) | ({
     type: 'drawer';
 } & DrawerAction) | ({
     type: 'drawer-form';
 } & DrawerFormAction) | ({
-    type: 'dialog-table';
-} & DialogTableAction) | ({
     type: 'drawer-table';
-} & DrawerTableAction);
+} & DrawerTableAction) | ({
+    type: 'drawer-info';
+} & DrawerInfoAction);
 export declare function registerActionHandler(id: string, extendActionId: string, defaultConfig: any): void;
 export declare const useAction: any;
 export interface IActionButton extends ButtonProps {

package/lib/actions/index.js

@@ -37,12 +37,16 @@ var _dialogForm = require("./dialog-form");
 
 var _dialogTable = require("./dialog-table");
 
+var _dialogInfo = require("./dialog-info");
+
 var _drawer = require("./drawer");
 
 var _drawerForm = require("./drawer-form");
 
 var _drawerTable = require("./drawer-table");
 
+var _drawerInfo = require("./drawer-info");
+
 require("./index.scss");
 
 var _excluded = ["type"],
@@ -131,6 +135,10 @@ var useAction = function useAction(config, context) {
     return (0, _dialogTable.useDialogTableAction)(others, context);
   }
 
+  if (type === 'dialog-info') {
+    return (0, _dialogInfo.useDialogInfoAction)(others, context);
+  }
+
   if (type === 'drawer') {
     return (0, _drawer.useDrawerAction)(others, context);
   }
@@ -143,6 +151,10 @@ var useAction = function useAction(config, context) {
     return (0, _drawerTable.useDrawerTableAction)(others, context);
   }
 
+  if (type === 'drawer-info') {
+    return (0, _drawerInfo.useDrawerInfoAction)(others, context);
+  }
+
   var registedAction = RegistedActions.get(type);
 
   if (!registedAction) {
@@ -197,33 +209,39 @@ var ActionButton = function ActionButton(props) {
 exports.ActionButton = ActionButton;
 
 function renderMenuButtonItem(item, key, context) {
-  var menuItemActionConfig = Object.assign({}, item.config, {
+  var config = item.config,
+      btnContext = item.context,
+      _onClick2 = item.onClick,
+      children = item.children,
+      icon = item.icon,
+      disabled = item.disabled;
+  var menuItemActionConfig = Object.assign({}, config, {
     trigger: 'onClick'
   });
 
-  var _useAction = useAction(menuItemActionConfig, item.context || context),
+  var _useAction = useAction(menuItemActionConfig, btnContext || context),
       loading = _useAction.loading,
       menuItemProps = _objectWithoutProperties(_useAction, _excluded3);
 
-  var buttonProps = item.onClick ? _objectSpread(_objectSpread({}, menuItemProps), {}, {
+  var buttonProps = _onClick2 ? _objectSpread(_objectSpread({}, menuItemProps), {}, {
     onClick: function onClick(e) {
-      return item.onClick(e, context);
+      return _onClick2(e, context);
     }
   }) : _objectSpread({}, menuItemProps);
   return /*#__PURE__*/_react.default.createElement(_components.MenuButton.Item, _objectSpread({
-    key: key
-  }, buttonProps), buttonContent(item.children, item.icon, undefined, context));
+    key: key,
+    disabled: disabled
+  }, buttonProps), buttonContent(children, icon, undefined, context));
 }
 
 function renderCommonActionButtonMenuItem(action, key, context) {
-  // @ts-ignore
-  if (action.actions && action.actions.length) {
+  var menuBtn = action;
+
+  if (menuBtn.actions && menuBtn.actions.length && menuBtn.disabled !== true) {
     return /*#__PURE__*/_react.default.createElement(_components.Menu.SubMenu, {
       key: key,
-      label: // @ts-ignore
-      action.label || action.children
-    }, //@ts-ignore
-    action.actions.map(function (a, j) {
+      label: menuBtn.label || menuBtn.children
+    }, menuBtn.actions.map(function (a, j) {
       return renderCommonActionButtonMenuItem(a, j, context);
     }));
   }

package/lib/actions/index.scss

@@ -29,6 +29,45 @@
   }
 }
 
+.teamix-pro-dialog-footer-description {
+  position: absolute;
+  z-index: 5;
+  display: flex;
+  align-items: center;
+  bottom: var(--dialog-footer-padding-top, 16px);
+  height: var(--btn-size-m-height, 32px);
+
+  &.footer-align-right {
+    left: var(--dialog-footer-padding-left-right, 20px);
+  }
+  &.footer-align-center {
+    left: var(--dialog-footer-padding-left-right, 20px);
+  }
+  &.footer-align-left {
+    right: var(--dialog-footer-padding-left-right, 20px);
+  }
+}
+
+.teamix-pro-action-dialog.has-footer-description {
+  .next-message {
+    position: static;
+  }
+}
+
+.teamix-pro-dialog-before-content {
+  margin-bottom: var(--s-2);
+}
+
+.teamix-pro-dialog-after-content {
+  margin-top: var(--s-2);
+}
+
 .next-menu-divider + .next-menu-divider {
   display: none;
 }
+
+.next-dialog-body {
+  .teamix-pro-form {
+    margin-bottom: -20px;
+  }
+}

package/lib/actions/link.js

@@ -8,6 +8,8 @@ exports.useLinkAction = useLinkAction;
 
 var _utils = require("@teamix/utils");
 
+var _reactRouterDom = require("react-router-dom");
+
 var _base = require("./base");
 
 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; }
@@ -17,19 +19,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; }
 
 function useLinkAction(action, context) {
-  var _getTargetValue = (0, _utils.getTargetValue)(action, context),
-      to = _getTargetValue.to,
-      search = _getTargetValue.search,
-      hash = _getTargetValue.hash,
-      blank = _getTargetValue.blank;
-
+  var history = (0, _reactRouterDom.useHistory)();
   return _objectSpread({}, (0, _base.eventHandler)(action, function () {
-    (0, _utils.goToLink)({
-      to: to,
-      search: search,
-      hash: hash,
-      blank: blank
-    });
+    var linkAction = (0, _utils.getTargetValue)(action, context);
+    (0, _utils.goToLink)(linkAction, history);
   }));
 }
 

package/lib/actions/request.d.ts

@@ -2,7 +2,7 @@ import { CommonRequestConfig } from '@teamix/utils';
 import { BaseAction } from './base';
 export interface RequestAction extends CommonRequestConfig, BaseAction {
 }
-export declare function doRequest(action: RequestAction, context?: any, history?: any): Promise<unknown>;
+export declare function doRequest(action: RequestAction, context?: any, history?: any, extraParams?: any): Promise<unknown>;
 export declare function useRequestAction(action: RequestAction, context?: any): {
     loading: boolean;
 };

package/lib/actions/request.js

@@ -41,14 +41,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; }
 
 // action 里的数据请求都默认是 post 类型
-function doRequest(action, context, history) {
+function doRequest(action, context, history, extraParams) {
   var _action$method = action.method,
       method = _action$method === void 0 ? 'post' : _action$method,
       others = _objectWithoutProperties(action, _excluded);
 
   return (0, _utils.doCommonRequest)(_objectSpread({
     method: method
-  }, others), context, history);
+  }, others), context, history, extraParams);
 }
 
 function useRequestAction(action, context) {