@qn-pandora/pandora-component 3.0.0 → 3.1.0

package/es/components/DateTimePicker/Collapse/Panel/index.d.ts

@@ -0,0 +1,41 @@
+import * as React from 'react';
+interface IPanelProps {
+    /**
+     * 当前panel的key
+     */
+    panelKey?: string;
+    /**
+     * tab的标题
+     */
+    title: string;
+    /**
+     * 当前panel是都激活
+     * @default true
+     */
+    isActive?: boolean;
+    /**
+     * title的样式
+     */
+    titleClassName?: string;
+    /**
+     * content的样式
+     */
+    contentClassName?: string;
+    /**
+     * 容器样式
+     */
+    className?: string;
+    /**
+     * panel折叠状态发生变化
+     */
+    onToggle?: (isActive: boolean, key?: string) => void;
+    /**
+     * 是否禁止toggle
+     */
+    disableToggle?: boolean;
+}
+/**
+ * 折叠面板组件封装
+ */
+export default function Panel(props: React.PropsWithChildren<IPanelProps>): JSX.Element;
+export {};

package/es/components/DateTimePicker/Collapse/Panel/index.js

@@ -0,0 +1,51 @@
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+import * as React from 'react';
+import classnames from 'classnames';
+import { Icon as LegacyIcon } from '@ant-design/compatible';
+import { SDK_PREFIX } from '../../../../constants/style';
+var useEffect = React.useEffect, useCallback = React.useCallback, useState = React.useState;
+/**
+ * 折叠面板组件封装
+ */
+export default function Panel(props) {
+    var _a, _b;
+    var _c = props.isActive, baseIsActive = _c === void 0 ? true : _c, disableToggle = props.disableToggle, onToggle = props.onToggle, panelKey = props.panelKey, title = props.title, titleClassName = props.titleClassName, className = props.className, contentClassName = props.contentClassName;
+    var _d = __read(useState(baseIsActive || false), 2), isActive = _d[0], setIsActive = _d[1];
+    useEffect(function () {
+        if (baseIsActive !== isActive) {
+            setIsActive(baseIsActive || false);
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [baseIsActive]);
+    var onTogglePanel = useCallback(function () {
+        if (disableToggle) {
+            return;
+        }
+        setIsActive(!isActive);
+        if (onToggle) {
+            onToggle(!isActive, panelKey);
+        }
+    }, [disableToggle, panelKey, isActive, onToggle]);
+    return (React.createElement("div", { className: classnames(SDK_PREFIX + "-panel", className), key: panelKey },
+        React.createElement("div", { className: classnames(titleClassName, (_a = {}, _a[SDK_PREFIX + "-panel-disable"] = disableToggle, _a), SDK_PREFIX + "-panel-title"), onClick: onTogglePanel },
+            React.createElement("span", null, title),
+            disableToggle ? null : (React.createElement(LegacyIcon, { type: isActive ? 'down' : 'up', className: SDK_PREFIX + "-panel-icon" }))),
+        React.createElement("div", { className: classnames(SDK_PREFIX + "-panel-content", contentClassName, (_b = {},
+                _b[SDK_PREFIX + "-panel-hidden"] = !isActive,
+                _b)) }, props.children)));
+}

package/es/components/{Collapse → DateTimePicker/Collapse}/Panel/style.less

@@ -1,4 +1,4 @@
-@import '../../../style/theme.less';
+@import '../../../../style/theme.less';
 
 .@{sdk-prefix}-panel-title {
   display: flex;

package/es/components/DateTimePicker/Collapse/index.d.ts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+interface ICollapseProps {
+    /**
+     * 根节点 class name
+     */
+    className?: string;
+    /**
+     * 默认展开的panel的keys
+     */
+    defaultActiveKey?: string[] | 'all' | 'none';
+    /**
+     * 手风琴模式，最多智能打开一个折叠板
+     * @default false
+     */
+    accordion?: boolean;
+}
+/**
+ * 折叠面板组件封装
+ */
+declare function Collapse(props: React.PropsWithChildren<ICollapseProps>): JSX.Element;
+declare namespace Collapse {
+    var Panel: typeof import("./Panel").default;
+}
+export default Collapse;

package/es/components/DateTimePicker/Collapse/index.js

@@ -0,0 +1,42 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import * as React from 'react';
+import { get } from 'lodash';
+import Panel from './Panel';
+/**
+ * 折叠面板组件封装
+ */
+function Collapse(props) {
+    var children = props.children, defaultActiveKey = props.defaultActiveKey, className = props.className;
+    var getPanels = React.useCallback(function () {
+        var newChildren = [];
+        React.Children.forEach(children, function (child, index) {
+            if (!child) {
+                return;
+            }
+            var key = get(child, 'key') || "" + index;
+            var isActive = false;
+            if (defaultActiveKey && typeof defaultActiveKey === 'string') {
+                isActive = defaultActiveKey === 'none' ? false : true;
+            }
+            else {
+                isActive = (defaultActiveKey || []).indexOf(key) > -1;
+            }
+            var props = __assign(__assign({}, child.props), { panelKey: key, isActive: isActive });
+            newChildren.push(React.cloneElement(child, props));
+        });
+        return newChildren;
+    }, [children, defaultActiveKey]);
+    return React.createElement("div", { className: className }, getPanels());
+}
+Collapse.Panel = Panel;
+export default Collapse;

package/es/components/DateTimePicker/DisplayInput/index.d.ts

@@ -7,5 +7,6 @@ export interface IInputProps extends InputProps {
     presets?: IPreset[];
 }
 export default class DisplayInput extends React.PureComponent<IInputProps, any> {
+    static contextType: React.Context<import("antd/es/config-provider").ConfigConsumerProps>;
     render(): JSX.Element;
 }

package/es/components/DateTimePicker/DisplayInput/index.js

@@ -36,6 +36,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import * as React from 'react';
 import { CalendarOutlined } from '@ant-design/icons';
 import { Input } from 'antd';
+import { ConfigContext } from 'antd/es/config-provider';
 import Time from '../time';
 var DisplayInput = /** @class */ (function (_super) {
     __extends(DisplayInput, _super);
@@ -44,9 +45,11 @@ var DisplayInput = /** @class */ (function (_super) {
     }
     DisplayInput.prototype.render = function () {
         var _a = this.props, className = _a.className, value = _a.value, timeFormat = _a.timeFormat, presets = _a.presets, otherProps = __rest(_a, ["className", "value", "timeFormat", "presets"]);
-        var text = new Time(value || {}, { presets: presets }).getDisplayText(timeFormat);
+        var locale = this.context.locale;
+        var text = new Time(value || {}, { presets: presets }).getDisplayText(timeFormat, locale);
         return (React.createElement(Input, __assign({ readOnly: true, className: className, suffix: React.createElement(CalendarOutlined, { onClick: this.props.onClick }), value: text }, otherProps)));
     };
+    DisplayInput.contextType = ConfigContext;
     return DisplayInput;
 }(React.PureComponent));
 export default DisplayInput;

package/es/components/DateTimePicker/DisplayInput/style.css

@@ -132,8 +132,8 @@ textarea.ant-input-affix-wrapper {
   outline: none;
 }
 .ant-input-affix-wrapper > input.ant-input:focus {
-  -webkit-box-shadow: none;
-          box-shadow: none;
+  -webkit-box-shadow: none !important;
+          box-shadow: none !important;
 }
 .ant-input-affix-wrapper::before {
   width: 0;
@@ -158,7 +158,7 @@ textarea.ant-input-affix-wrapper {
 .ant-input-suffix {
   margin-left: 4px;
 }
-.ant-input-clear-icon {
+.anticon.ant-input-clear-icon {
   margin: 0 4px;
   color: rgba(0, 0, 0, 0.25);
   font-size: 12px;
@@ -167,16 +167,16 @@ textarea.ant-input-affix-wrapper {
   -webkit-transition: color 0.3s;
   transition: color 0.3s;
 }
-.ant-input-clear-icon:hover {
+.anticon.ant-input-clear-icon:hover {
   color: rgba(0, 0, 0, 0.45);
 }
-.ant-input-clear-icon:active {
+.anticon.ant-input-clear-icon:active {
   color: rgba(0, 0, 0, 0.65);
 }
-.ant-input-clear-icon-hidden {
+.anticon.ant-input-clear-icon-hidden {
   visibility: hidden;
 }
-.ant-input-clear-icon:last-child {
+.anticon.ant-input-clear-icon:last-child {
   margin-right: 0;
 }
 .ant-input-affix-wrapper-textarea-with-clear-btn {
@@ -391,6 +391,16 @@ textarea.ant-input {
 .ant-input-group-addon .ant-select-focused .ant-select-selector {
   color: #7a869a;
 }
+.ant-input-group-addon .ant-cascader-picker {
+  margin: -9px -12px;
+  background-color: transparent;
+}
+.ant-input-group-addon .ant-cascader-picker .ant-cascader-input {
+  text-align: left;
+  border: 0;
+  -webkit-box-shadow: none;
+          box-shadow: none;
+}
 .ant-input-group > .ant-input:first-child,
 .ant-input-group-addon:first-child {
   border-top-right-radius: 0;

package/es/components/DateTimePicker/constants.d.ts

@@ -17,11 +17,6 @@ export declare enum RangePreset {
     AfterTime = "afterTime",
     BetweenTime = "betweenTime"
 }
-export declare const rangePresetMapping: {
-    beforeTime: string;
-    afterTime: string;
-    betweenTime: string;
-};
 export declare const rangePresetOptions: {
     value: RangePreset;
     text: string;
@@ -197,6 +192,10 @@ export interface IBaseProps {
      * 绝对时间的标题
      */
     absoluteTitle?: string;
+    /**
+     * 语言
+     */
+    locale?: string;
 }
 export interface ITimeRange {
     relative?: IRelativeTime;

package/es/components/DateTimePicker/constants.js

@@ -9,8 +9,8 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var _a;
 import moment from 'moment';
+import { DateTimeLocale } from '../../constants/language/datetime/type';
 export var TimeType;
 (function (TimeType) {
     TimeType["Preset"] = "1";
@@ -29,28 +29,23 @@ export var RangePreset;
     RangePreset["AfterTime"] = "afterTime";
     RangePreset["BetweenTime"] = "betweenTime";
 })(RangePreset || (RangePreset = {}));
-export var rangePresetMapping = (_a = {},
-    _a[RangePreset.BeforeTime] = '在此之前',
-    _a[RangePreset.AfterTime] = '在此之后',
-    _a[RangePreset.BetweenTime] = '介于',
-    _a);
 export var rangePresetOptions = [
     {
         value: RangePreset.BeforeTime,
-        text: rangePresetMapping[RangePreset.BeforeTime]
+        text: DateTimeLocale.range.beforeTime
     },
     {
         value: RangePreset.BetweenTime,
-        text: rangePresetMapping[RangePreset.BetweenTime]
+        text: DateTimeLocale.range.betweenTime
     },
     {
         value: RangePreset.AfterTime,
-        text: rangePresetMapping[RangePreset.AfterTime]
+        text: DateTimeLocale.range.afterTime
     }
 ];
 export var defaultPresets = [
     {
-        text: '前5分钟',
+        text: DateTimeLocale.preset.m5,
         value: 'm5',
         time: function () { return ({
             start: moment().subtract(5, 'minutes'),
@@ -58,7 +53,7 @@ export var defaultPresets = [
         }); }
     },
     {
-        text: '前15分钟',
+        text: DateTimeLocale.preset.m15,
         value: 'm15',
         time: function () { return ({
             start: moment().subtract(15, 'minutes'),
@@ -66,7 +61,7 @@ export var defaultPresets = [
         }); }
     },
     {
-        text: '前30分钟',
+        text: DateTimeLocale.preset.m30,
         value: 'm30',
         time: function () { return ({
             start: moment().subtract(30, 'minutes'),
@@ -74,7 +69,7 @@ export var defaultPresets = [
         }); }
     },
     {
-        text: '前60分钟',
+        text: DateTimeLocale.preset.m60,
         value: 'm60',
         time: function () { return ({
             start: moment().subtract(60, 'minutes'),
@@ -82,7 +77,7 @@ export var defaultPresets = [
         }); }
     },
     {
-        text: '前3小时',
+        text: DateTimeLocale.preset.h3,
         value: 'h3',
         time: function () { return ({
             start: moment().subtract(3, 'hours'),
@@ -90,7 +85,7 @@ export var defaultPresets = [
         }); }
     },
     {
-        text: '前4小时',
+        text: DateTimeLocale.preset.h4,
         value: 'h4',
         time: function () { return ({
             start: moment().subtract(4, 'hours'),
@@ -98,7 +93,7 @@ export var defaultPresets = [
         }); }
     },
     {
-        text: '前6小时',
+        text: DateTimeLocale.preset.h6,
         value: 'h6',
         time: function () { return ({
             start: moment().subtract(6, 'hours'),
@@ -106,7 +101,7 @@ export var defaultPresets = [
         }); }
     },
     {
-        text: '前12小时',
+        text: DateTimeLocale.preset.h12,
         value: 'h12',
         time: function () { return ({
             start: moment().subtract(12, 'hours'),
@@ -114,7 +109,7 @@ export var defaultPresets = [
         }); }
     },
     {
-        text: '前24小时',
+        text: DateTimeLocale.preset.h24,
         value: 'h24',
         time: function () { return ({
             start: moment().subtract(24, 'hours'),
@@ -122,7 +117,7 @@ export var defaultPresets = [
         }); }
     },
     {
-        text: '过去3天',
+        text: DateTimeLocale.preset.d3,
         value: 'd3',
         time: function () { return ({
             start: moment().subtract(3, 'days'),
@@ -130,7 +125,7 @@ export var defaultPresets = [
         }); }
     },
     {
-        text: '过去7天',
+        text: DateTimeLocale.preset.d7,
         value: 'd7',
         time: function () { return ({
             start: moment().subtract(7, 'days'),
@@ -138,7 +133,7 @@ export var defaultPresets = [
         }); }
     },
     {
-        text: '过去30天',
+        text: DateTimeLocale.preset.d30,
         value: 'd30',
         time: function () { return ({
             start: moment().subtract(30, 'days'),
@@ -146,32 +141,32 @@ export var defaultPresets = [
         }); }
     },
     {
-        text: '今天',
+        text: DateTimeLocale.preset.today,
         value: 'today',
         time: function () { return ({ start: moment().startOf('day'), end: moment() }); }
     },
     {
-        text: '本周',
+        text: DateTimeLocale.preset.week,
         value: 'week',
         time: function () { return ({ start: moment().startOf('week'), end: moment() }); }
     },
     {
-        text: '本月',
+        text: DateTimeLocale.preset.month,
         value: 'month',
         time: function () { return ({ start: moment().startOf('month'), end: moment() }); }
     },
     {
-        text: '本季度',
+        text: DateTimeLocale.preset.quarter,
         value: 'quarter',
         time: function () { return ({ start: moment().startOf('quarter'), end: moment() }); }
     },
     {
-        text: '本年度',
+        text: DateTimeLocale.preset.year,
         value: 'year',
         time: function () { return ({ start: moment().startOf('year'), end: moment() }); }
     },
     {
-        text: '昨天',
+        text: DateTimeLocale.preset.yesterDay,
         value: 'yesterDay',
         time: function () { return ({
             start: moment().subtract(1, 'days').startOf('day'),
@@ -179,7 +174,7 @@ export var defaultPresets = [
         }); }
     },
     {
-        text: '前天',
+        text: DateTimeLocale.preset.theDayBeforYesterDay,
         value: 'theDayBeforYesterDay',
         time: function () { return ({
             start: moment().subtract(2, 'days').startOf('day'),
@@ -187,7 +182,7 @@ export var defaultPresets = [
         }); }
     },
     {
-        text: '上周',
+        text: DateTimeLocale.preset.previousWeek,
         value: 'previousWeek',
         time: function () { return ({
             start: moment().subtract(1, 'weeks').startOf('weeks'),
@@ -195,7 +190,7 @@ export var defaultPresets = [
         }); }
     },
     {
-        text: '上月',
+        text: DateTimeLocale.preset.previousMonth,
         value: 'previousMonth',
         time: function () { return ({
             start: moment().subtract(1, 'months').startOf('months'),
@@ -203,7 +198,7 @@ export var defaultPresets = [
         }); }
     },
     {
-        text: '上季度',
+        text: DateTimeLocale.preset.previousQuarter,
         value: 'previousQuarter',
         time: function () { return ({
             start: moment().subtract(1, 'quarters').startOf('quarters'),
@@ -211,7 +206,7 @@ export var defaultPresets = [
         }); }
     },
     {
-        text: '上年度',
+        text: DateTimeLocale.preset.previousYear,
         value: 'previousYear',
         time: function () { return ({
             start: moment().subtract(1, 'years').startOf('years'),
@@ -219,7 +214,7 @@ export var defaultPresets = [
         }); }
     },
     {
-        text: '所有时间',
+        text: DateTimeLocale.preset.AllTime,
         value: 'AllTime',
         time: function () { return ({
             start: moment(0),
@@ -249,52 +244,52 @@ export var RelativeUnitValue;
 })(RelativeUnitValue || (RelativeUnitValue = {}));
 export var relativeTimeUnits = [
     {
-        text: '现在(实时)',
+        text: DateTimeLocale.relative.now,
         value: RelativeUnitValue.Now,
         time: function (_) { return moment(); }
     },
     {
-        text: '现在(固定时间)',
+        text: DateTimeLocale.relative['now-static'],
         value: RelativeUnitValue.NowStatic,
         time: function (_) { return moment(); }
     },
     {
-        text: '秒前',
+        text: DateTimeLocale.relative.s,
         value: RelativeUnitValue.Second,
         time: function (num) { return moment().subtract(num, 'seconds'); }
     },
     {
-        text: '分钟前',
+        text: DateTimeLocale.relative.m,
         value: RelativeUnitValue.Minute,
         time: function (num) { return moment().subtract(num, 'minutes'); }
     },
     {
-        text: '小时前',
+        text: DateTimeLocale.relative.h,
         value: RelativeUnitValue.Hour,
         time: function (num) { return moment().subtract(num, 'hours'); }
     },
     {
-        text: '天前',
+        text: DateTimeLocale.relative.d,
         value: RelativeUnitValue.Day,
         time: function (num) { return moment().subtract(num, 'days'); }
     },
     {
-        text: '周前',
+        text: DateTimeLocale.relative.w,
         value: RelativeUnitValue.Week,
         time: function (num) { return moment().subtract(num, 'weeks'); }
     },
     {
-        text: '周前',
+        text: DateTimeLocale.relative.M,
         value: RelativeUnitValue.Month,
         time: function (num) { return moment().subtract(num, 'months'); }
     },
     {
-        text: '季度前',
+        text: DateTimeLocale.relative.Q,
         value: RelativeUnitValue.Quarter,
         time: function (num) { return moment().subtract(num, 'quarters'); }
     },
     {
-        text: '年前',
+        text: DateTimeLocale.relative.y,
         value: RelativeUnitValue.Year,
         time: function (num) { return moment().subtract(num, 'years'); }
     }
@@ -303,7 +298,7 @@ export var relativeTimeUnitsWithoutNowStatic = relativeTimeUnits
     .filter(function (item) { return item.value !== RelativeUnitValue.NowStatic; })
     .map(function (item) {
     return item.value === RelativeUnitValue.Now
-        ? __assign(__assign({}, item), { text: '现在' }) : __assign({}, item);
+        ? __assign(__assign({}, item), { text: DateTimeLocale.relative.now_text }) : __assign({}, item);
 });
 export var relativeMap = (function () {
     var res = {};