1 | import _extends from "@babel/runtime/helpers/esm/extends";
|
2 | import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
3 | import "antd/es/config-provider/style";
|
4 | import _ConfigProvider from "antd/es/config-provider";
|
5 | import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
6 | var _excluded = ["children", "className", "extra", "style", "renderContent"];
|
7 | import classNames from 'classnames';
|
8 | import omit from 'omit.js';
|
9 | import React, { useContext, useEffect, useMemo } from 'react';
|
10 | import { RouteContext } from '../../index';
|
11 | import './index.less';
|
12 |
|
13 | var FooterToolbar = function FooterToolbar(props) {
|
14 | var children = props.children,
|
15 | className = props.className,
|
16 | extra = props.extra,
|
17 | style = props.style,
|
18 | renderContent = props.renderContent,
|
19 | restProps = _objectWithoutProperties(props, _excluded);
|
20 |
|
21 | var _useContext = useContext(_ConfigProvider.ConfigContext),
|
22 | getPrefixCls = _useContext.getPrefixCls;
|
23 |
|
24 | var prefixCls = props.prefixCls || getPrefixCls('pro');
|
25 | var baseClassName = "".concat(prefixCls, "-footer-bar");
|
26 | var value = useContext(RouteContext);
|
27 | var width = useMemo(function () {
|
28 | var hasSiderMenu = value.hasSiderMenu,
|
29 | isMobile = value.isMobile,
|
30 | siderWidth = value.siderWidth;
|
31 |
|
32 | if (!hasSiderMenu) {
|
33 | return undefined;
|
34 | }
|
35 |
|
36 |
|
37 | if (!siderWidth) {
|
38 | return '100%';
|
39 | }
|
40 |
|
41 | return isMobile ? '100%' : "calc(100% - ".concat(siderWidth, "px)");
|
42 | }, [value.collapsed, value.hasSiderMenu, value.isMobile, value.siderWidth]);
|
43 | var dom = React.createElement(React.Fragment, null, React.createElement("div", {
|
44 | className: "".concat(baseClassName, "-left")
|
45 | }, extra), React.createElement("div", {
|
46 | className: "".concat(baseClassName, "-right")
|
47 | }, children));
|
48 |
|
49 |
|
50 | useEffect(function () {
|
51 | if (!value || !(value === null || value === void 0 ? void 0 : value.setHasFooterToolbar)) {
|
52 | return function () {};
|
53 | }
|
54 |
|
55 | value === null || value === void 0 ? void 0 : value.setHasFooterToolbar(true);
|
56 | return function () {
|
57 | var _value$setHasFooterTo;
|
58 |
|
59 | value === null || value === void 0 ? void 0 : (_value$setHasFooterTo = value.setHasFooterToolbar) === null || _value$setHasFooterTo === void 0 ? void 0 : _value$setHasFooterTo.call(value, false);
|
60 | };
|
61 | }, []);
|
62 | return React.createElement("div", _extends({
|
63 | className: classNames(className, "".concat(baseClassName)),
|
64 | style: _objectSpread({
|
65 | width: width
|
66 | }, style)
|
67 | }, omit(restProps, ['prefixCls'])), renderContent ? renderContent(_objectSpread(_objectSpread(_objectSpread({}, props), value), {}, {
|
68 | leftWidth: width
|
69 | }), dom) : dom);
|
70 | };
|
71 |
|
72 | export default FooterToolbar; |
\ | No newline at end of file |