choerodon-ui
Version:
An enterprise-class UI design language and React-based implementation
290 lines (233 loc) • 10.7 kB
JavaScript
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _react = _interopRequireWildcard(require("react"));
var _mobxReactLite = require("mobx-react-lite");
var _mobx = require("mobx");
var _isPromise = _interopRequireDefault(require("is-promise"));
var _classnames = _interopRequireDefault(require("classnames"));
var _isString = _interopRequireDefault(require("lodash/isString"));
var _isObject = _interopRequireDefault(require("lodash/isObject"));
var _button = _interopRequireDefault(require("../button"));
var _enum = require("../button/enum");
var _dropdown = _interopRequireDefault(require("../dropdown"));
var _menu = _interopRequireDefault(require("../menu"));
var _localeContext = require("../locale-context");
var _useComputed = _interopRequireDefault(require("../use-computed"));
var _interface = require("../table/interface");
var _enum2 = require("./enum");
var _excluded = ["afterClick"];
var CardCommand = function CardCommand(props) {
var record = props.record,
prefixCls = props.prefixCls,
command = props.command,
_props$renderCommand = props.renderCommand,
renderCommand = _props$renderCommand === void 0 ? function (_ref) {
var command = _ref.command;
return command;
} : _props$renderCommand,
dataSet = props.dataSet,
viewMode = props.viewMode,
_props$commandsLimit = props.commandsLimit,
commandsLimit = _props$commandsLimit === void 0 ? 1 : _props$commandsLimit;
var _useState = (0, _react.useState)(null),
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
item = _useState2[0],
setItem = _useState2[1];
var cardCommand = (0, _useComputed["default"])(function () {
if (typeof command === 'function') {
var colC = command({
dataSet: dataSet,
record: record
});
return renderCommand({
command: colC,
viewMode: viewMode,
dataSet: dataSet,
record: record
});
}
return renderCommand({
command: command,
viewMode: viewMode,
dataSet: dataSet,
record: record
});
}, [record, command, dataSet, renderCommand]);
var handleCommandDelete = (0, _react.useCallback)(function (e) {
e.stopPropagation();
dataSet["delete"](record);
}, [dataSet, record]);
var renderCommands = (0, _react.useCallback)( /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2() {
var classString, commands, result;
return _regenerator["default"].wrap(function _callee2$(_context2) {
while (1) {
switch (_context2.prev = _context2.next) {
case 0:
classString = (0, _classnames["default"])("".concat(prefixCls, "-command"));
if (!cardCommand) {
_context2.next = 13;
break;
}
commands = [];
if (!(0, _isPromise["default"])(cardCommand)) {
_context2.next = 9;
break;
}
_context2.next = 6;
return cardCommand;
case 6:
_context2.t0 = _context2.sent;
_context2.next = 10;
break;
case 9:
_context2.t0 = cardCommand;
case 10:
result = _context2.t0;
result.forEach(function (button) {
var tableButtonProps = {};
if ((0, _mobx.isArrayLike)(button)) {
tableButtonProps = button[1] || {};
button = button[0];
}
if ((0, _isString["default"])(button) && button in _interface.TableCommandType) {
var getButtonProps = function getButtonProps(type) {
switch (type) {
case _interface.TableCommandType["delete"]:
return {
funcType: _enum.FuncType.link,
onClick: handleCommandDelete,
// disabled,
children: (0, _localeContext.$l)('Table', 'delete_button')
};
default:
}
};
var defaultButtonProps = getButtonProps(button);
if (defaultButtonProps) {
var _tableButtonProps = tableButtonProps,
afterClick = _tableButtonProps.afterClick,
buttonProps = (0, _objectWithoutProperties2["default"])(_tableButtonProps, _excluded);
if (afterClick) {
var onClick = defaultButtonProps.onClick;
defaultButtonProps.onClick = /*#__PURE__*/function () {
var _ref3 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(e) {
return _regenerator["default"].wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
e.persist();
e.stopPropagation();
_context.prev = 2;
_context.next = 5;
return onClick(e);
case 5:
_context.prev = 5;
afterClick(e);
return _context.finish(5);
case 8:
case "end":
return _context.stop();
}
}
}, _callee, null, [[2,, 5, 8]]);
}));
return function (_x) {
return _ref3.apply(this, arguments);
};
}();
}
var otherProps = (0, _extends2["default"])({}, defaultButtonProps);
commands.push( /*#__PURE__*/_react["default"].createElement(_button["default"], (0, _extends2["default"])({}, otherProps, buttonProps, {
className: (0, _classnames["default"])(classString, otherProps.className, buttonProps.className)
})));
}
} else if ( /*#__PURE__*/(0, _react.isValidElement)(button)) {
commands.push( /*#__PURE__*/(0, _react.cloneElement)(button, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, button.props), {}, {
onClick: function onClick(e) {
e.stopPropagation();
button.props.onClick(e);
},
funcType: _enum.FuncType.link,
className: (0, _classnames["default"])(classString, button.props.className)
})));
} else if ((0, _isObject["default"])(button)) {
commands.push( /*#__PURE__*/_react["default"].createElement(_button["default"], (0, _extends2["default"])({}, button, {
funcType: _enum.FuncType.link,
className: (0, _classnames["default"])(classString, button.className)
})));
}
});
return _context2.abrupt("return", commands);
case 13:
case "end":
return _context2.stop();
}
}
}, _callee2);
})), [prefixCls, record, cardCommand, handleCommandDelete]);
(0, _react.useEffect)(function () {
var renderMenuItem = /*#__PURE__*/function () {
var _ref4 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3() {
var result;
return _regenerator["default"].wrap(function _callee3$(_context3) {
while (1) {
switch (_context3.prev = _context3.next) {
case 0:
_context3.next = 2;
return renderCommands();
case 2:
result = _context3.sent;
setItem(result); // 更新状态
case 4:
case "end":
return _context3.stop();
}
}
}, _callee3);
}));
return function renderMenuItem() {
return _ref4.apply(this, arguments);
};
}();
renderMenuItem();
}, []);
var renderMoreBtns = (0, _react.useCallback)(function () {
if (commandsLimit >= item.length) {
return null;
}
return /*#__PURE__*/_react["default"].createElement(_dropdown["default"], {
popupClassName: "".concat(prefixCls, "-quote-container-extra-popup"),
overlay: function overlay() {
return /*#__PURE__*/_react["default"].createElement(_menu["default"], null, item.slice(commandsLimit).map(function (cmd) {
return /*#__PURE__*/_react["default"].createElement(_menu["default"].Item, {
key: cmd.key || "".concat(record.id, "_cmd")
}, cmd);
}));
}
}, /*#__PURE__*/_react["default"].createElement(_button["default"], {
icon: "more_horiz",
funcType: _enum.FuncType.flat,
onClick: function onClick(e) {
return e.stopPropagation();
}
}));
}, [item, commandsLimit]);
return item ? viewMode === _enum2.ViewMode.kanban ? /*#__PURE__*/_react["default"].createElement("div", {
className: "".concat(prefixCls, "-quote-container-extra")
}, item.slice(0, commandsLimit), renderMoreBtns()) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, item.slice(0, commandsLimit), renderMoreBtns()) : null;
};
CardCommand.displayName = 'CardCommand';
var _default = (0, _mobxReactLite.observer)(CardCommand);
exports["default"] = _default;
//# sourceMappingURL=CardCommand.js.map
;