tntd 3.0.28 → 3.0.29-beta.1

package/es/progress/progress.js

@@ -0,0 +1,132 @@
+import React from 'react';
+import { ConfigConsumer } from 'antd/es/config-provider';
+import AntdProgress from 'antd/es/progress';
+import classNames from 'classnames';
+import Ellipsis from '../ellipsis';
+import Icon from '../icon';
+import './progress.less';
+export * from 'antd/es/tooltip';
+const iconMap = {
+  line: {
+    success: 'check-circle',
+    exception: 'close-circle'
+  },
+  circle: {
+    success: 'check',
+    exception: 'close'
+  }
+};
+const ifPercentBottom = (type, percentPosition) => {
+  return type === 'line' && percentPosition === 'bottom';
+};
+const percentTransform = percent => {
+  return percent >= 100 ? 100 : percent <= 0 ? 0 : percent;
+};
+const themeStrokeColor = (status, strokeColor, percent) => {
+  return status !== 'success' && status !== 'exception' && !strokeColor && percent !== 100 ? 'var(--blue-5)' : '';
+};
+const Progress = props => {
+  const {
+    className,
+    type = 'line',
+    percentPosition = 'right',
+    percent = 0,
+    format,
+    size,
+    label,
+    width = 132,
+    status,
+    halfCircle,
+    gapDegree = props.halfCircle ? 135 : props.gapDegree,
+    strokeColor,
+    strokeWidth = 7
+  } = props;
+  const _percent = percentTransform(percent);
+  const _strokeColor = themeStrokeColor(status, strokeColor, _percent);
+  return React.createElement(ConfigConsumer, null, ({
+    getPrefixCls
+  }) => {
+    const prefixCls = getPrefixCls('progress');
+    const CusLabelOrPercent = props => {
+      const {
+        type,
+        theme
+      } = props;
+      const labelPercentClassName = classNames(`${prefixCls}-percent-bottom`, {
+        [`${prefixCls}-percent-bottom-${size}`]: size === 'small',
+        [`${prefixCls}-percent-bottom-${type}`]: type === 'line'
+      });
+      const showIcon = status => React.createElement(Icon, {
+        type: `${iconMap[type][status]}`,
+        theme: theme,
+        className: classNames({
+          [`${labelPercentClassName} ${labelPercentClassName}-${status || 'success'}`]: type === 'line'
+        })
+      });
+      const showPercent = React.createElement("div", {
+        className: labelPercentClassName
+      }, format ? format === null || format === void 0 ? void 0 : format(_percent) : _percent + '%');
+      let displayContent;
+      if (status === 'success' || status === 'exception') {
+        displayContent = showIcon(status);
+      } else if (status === 'normal' || status === 'active') {
+        displayContent = showPercent;
+      } else {
+        // 如果状态为空
+        displayContent = _percent === 100 ? showIcon('success') : showPercent;
+      }
+      return displayContent;
+    };
+    const CusCircleAndDashboardFormat = props => {
+      const {
+        widthNum
+      } = props;
+      return React.createElement("div", {
+        className: `${prefixCls}-cus-format`
+      }, !!label && React.createElement(Ellipsis, {
+        className: `${prefixCls}-cus-format-label`,
+        title: label,
+        widthLimit: widthNum <= 64 ? widthNum : 'calc(100% - 50px)',
+        placement: widthNum <= 64 ? 'bottom' : 'top'
+      }), React.createElement(CusLabelOrPercent, {
+        type: "circle",
+        theme: "outlined"
+      }));
+    };
+    //line
+    const LineProgress = () => React.createElement(AntdProgress, Object.assign({
+      strokeColor: _strokeColor
+    }, props, {
+      className: classNames('tnt-progress', className, {
+        [`${prefixCls}-percent-bottom`]: percentPosition === 'bottom'
+      })
+    }));
+    //circle,dashboard (额外新增label和半圆选项)
+    const CircleAndDashboardProgress = () => {
+      const widthNum = Number(String(width).split('px').shift());
+      return React.createElement(AntdProgress, Object.assign({
+        gapDegree: gapDegree,
+        strokeColor: _strokeColor,
+        strokeWidth: strokeWidth
+      }, props, {
+        type: halfCircle ? 'dashboard' : type,
+        className: classNames('tnt-progress', `${prefixCls}-circle-progress`, className, {
+          [`${prefixCls}-small-circle`]: widthNum <= 64 && label,
+          [`${prefixCls}-large-circle`]: widthNum > 64 && label,
+          [`${prefixCls}-small-half-circle`]: halfCircle && widthNum <= 64 && label,
+          [`${prefixCls}-large-half-circle`]: halfCircle && widthNum > 64 && label
+        }),
+        format: () => React.createElement(CusCircleAndDashboardFormat, {
+          widthNum: widthNum
+        })
+      }));
+    };
+    const progressMap = {
+      line: React.createElement(LineProgress, null),
+      circle: React.createElement(CircleAndDashboardProgress, null),
+      dashboard: React.createElement(CircleAndDashboardProgress, null)
+    };
+    return progressMap[type];
+  });
+};
+export default Progress;

package/es/progress/progress.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"progress.js","sourceRoot":"","sources":["../../src/progress/progress.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAA;AACxD,OAAO,YAAY,MAAM,kBAAkB,CAAA;AAC3C,OAAO,UAAU,MAAM,YAAY,CAAA;AACnC,OAAO,QAAQ,MAAM,aAAa,CAAA;AAClC,OAAO,IAAI,MAAM,SAAS,CAAA;AAC1B,OAAO,iBAAiB,CAAA;AACxB,cAAc,iBAAiB,CAAA;AAO/B,MAAM,OAAO,GAAG;IACd,IAAI,EAAE;QACJ,OAAO,EAAE,cAAc;QACvB,SAAS,EAAE,cAAc;KAC1B;IACD,MAAM,EAAE;QACN,OAAO,EAAE,OAAO;QAChB,SAAS,EAAE,OAAO;KACnB;CACF,CAAA;AACD,MAAM,eAAe,GAAG,CAAC,IAAY,EAAE,eAAuB,EAAE,EAAE;IAChE,OAAO,IAAI,KAAK,MAAM,IAAI,eAAe,KAAK,QAAQ,CAAA;AACxD,CAAC,CAAA;AACD,MAAM,gBAAgB,GAAG,CAAC,OAAe,EAAE,EAAE;IAC3C,OAAO,OAAO,IAAI,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,OAAO,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAA;AAC1D,CAAC,CAAA;AAED,MAAM,gBAAgB,GAAG,CAAC,MAAe,EAAE,WAA6B,EAAE,OAAgB,EAAE,EAAE;IAC5F,OAAO,MAAM,KAAK,SAAS,IAAI,MAAM,KAAK,WAAW,IAAI,CAAC,WAAW,IAAI,OAAO,KAAK,GAAG;QACtF,CAAC,CAAC,eAAe;QACjB,CAAC,CAAC,EAAE,CAAA;AACR,CAAC,CAAA;AAED,MAAM,QAAQ,GAA8C,CAAC,KAAK,EAAE,EAAE;IACpE,MAAM,EACJ,SAAS,EACT,IAAI,GAAG,MAAM,EACb,eAAe,GAAG,OAAO,EACzB,OAAO,GAAG,CAAC,EACX,MAAM,EACN,IAAI,EACJ,KAAK,EACL,KAAK,GAAG,GAAG,EACX,MAAM,EACN,UAAU,EACV,SAAS,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,SAAS,EACpD,WAAW,EACX,WAAW,GAAG,CAAC,GAChB,GAAG,KAAK,CAAA;IACT,MAAM,QAAQ,GAAG,gBAAgB,CAAC,OAAO,CAAC,CAAA;IAC1C,MAAM,YAAY,GAAG,gBAAgB,CAAC,MAAM,EAAE,WAAW,EAAE,QAAQ,CAAC,CAAA;IACpE,OAAO,CACL,oBAAC,cAAc,QACZ,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE;QACpB,MAAM,SAAS,GAAG,YAAY,CAAC,UAAU,CAAC,CAAA;QAE1C,MAAM,iBAAiB,GAAG,CAAC,KAAqD,EAAE,EAAE;YAClF,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,KAAK,CAAA;YAC7B,MAAM,qBAAqB,GAAG,UAAU,CAAC,GAAG,SAAS,iBAAiB,EAAE;gBACtE,CAAC,GAAG,SAAS,mBAAmB,IAAI,EAAE,CAAC,EAAE,IAAI,KAAK,OAAO;gBACzD,CAAC,GAAG,SAAS,mBAAmB,IAAI,EAAE,CAAC,EAAE,IAAI,KAAK,MAAM;aACzD,CAAC,CAAA;YAEF,MAAM,QAAQ,GAAG,CAAC,MAA+B,EAAE,EAAE,CAAC,CACpD,oBAAC,IAAI,IACH,IAAI,EAAE,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,EAAE,EAChC,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,UAAU,CAAC;oBACpB,CAAC,GAAG,qBAAqB,IAAI,qBAAqB,IAAI,MAAM,IAAI,SAAS,EAAE,CAAC,EAC1E,IAAI,KAAK,MAAM;iBAClB,CAAC,GACF,CACH,CAAA;YACD,MAAM,WAAW,GAAG,CAClB,6BAAK,SAAS,EAAE,qBAAqB,IAClC,MAAM,CAAC,CAAC,CAAC,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,QAAQ,GAAG,GAAG,CACzC,CACP,CAAA;YAED,IAAI,cAAc,CAAA;YAClB,IAAI,MAAM,KAAK,SAAS,IAAI,MAAM,KAAK,WAAW,EAAE;gBAClD,cAAc,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAA;aAClC;iBAAM,IAAI,MAAM,KAAK,QAAQ,IAAI,MAAM,KAAK,QAAQ,EAAE;gBACrD,cAAc,GAAG,WAAW,CAAA;aAC7B;iBAAM;gBACL,SAAS;gBACT,cAAc,GAAG,QAAQ,KAAK,GAAG,CAAC,CAAC,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,WAAW,CAAA;aACtE;YACD,OAAO,cAAc,CAAA;QACvB,CAAC,CAAA;QAED,MAAM,2BAA2B,GAAG,CAAC,KAA2B,EAAE,EAAE;YAClE,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAA;YAC1B,OAAO,CACL,6BAAK,SAAS,EAAE,GAAG,SAAS,aAAa;gBACtC,CAAC,CAAC,KAAK,IAAI,CACV,oBAAC,QAAQ,IACP,SAAS,EAAE,GAAG,SAAS,mBAAmB,EAC1C,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,QAAQ,IAAI,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,mBAAmB,EAC3D,SAAS,EAAE,QAAQ,IAAI,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,GAC5C,CACH;gBACD,oBAAC,iBAAiB,IAAC,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,UAAU,GAAG,CAChD,CACP,CAAA;QACH,CAAC,CAAA;QAED,MAAM;QACN,MAAM,YAAY,GAAa,GAAG,EAAE,CAAC,CACnC,oBAAC,YAAY,kBACX,WAAW,EAAE,YAAY,IACrB,KAAK,IACT,SAAS,EAAE,UAAU,CAAC,cAAc,EAAE,SAAS,EAAE;gBAC/C,CAAC,GAAG,SAAS,iBAAiB,CAAC,EAAE,eAAe,KAAK,QAAQ;aAC9D,CAAC,IACF,CACH,CAAA;QAED,mCAAmC;QACnC,MAAM,0BAA0B,GAAa,GAAG,EAAE;YAChD,MAAM,QAAQ,GAAG,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,KAAK,EAAE,CAAC,CAAA;YAC1D,OAAO,CACL,oBAAC,YAAY,kBACX,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,YAAY,EACzB,WAAW,EAAE,WAAW,IACpB,KAAK,IACT,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,IAAI,EACrC,SAAS,EAAE,UAAU,CAAC,cAAc,EAAE,GAAG,SAAS,kBAAkB,EAAE,SAAS,EAAE;oBAC/E,CAAC,GAAG,SAAS,eAAe,CAAC,EAAE,QAAQ,IAAI,EAAE,IAAI,KAAK;oBACtD,CAAC,GAAG,SAAS,eAAe,CAAC,EAAE,QAAQ,GAAG,EAAE,IAAI,KAAK;oBACrD,CAAC,GAAG,SAAS,oBAAoB,CAAC,EAAE,UAAU,IAAI,QAAQ,IAAI,EAAE,IAAI,KAAK;oBACzE,CAAC,GAAG,SAAS,oBAAoB,CAAC,EAAE,UAAU,IAAI,QAAQ,GAAG,EAAE,IAAI,KAAK;iBACzE,CAAC,EACF,MAAM,EAAE,GAAG,EAAE,CAAC,oBAAC,2BAA2B,IAAC,QAAQ,EAAE,QAAQ,GAAI,IACjE,CACH,CAAA;QACH,CAAC,CAAA;QAED,MAAM,WAAW,GAAG;YAClB,IAAI,EAAE,oBAAC,YAAY,OAAG;YACtB,MAAM,EAAE,oBAAC,0BAA0B,OAAG;YACtC,SAAS,EAAE,oBAAC,0BAA0B,OAAG;SAC1C,CAAA;QACD,OAAO,WAAW,CAAC,IAAI,CAAC,CAAA;IAC1B,CAAC,CACc,CAClB,CAAA;AACH,CAAC,CAAA;AAED,eAAe,QAAQ,CAAA","sourcesContent":["import React from 'react'\nimport type { ProgressProps } from 'antd/es/progress'\nimport type { ThemeType } from 'antd/es/icon'\nimport { ConfigConsumer } from 'antd/es/config-provider'\nimport AntdProgress from 'antd/es/progress'\nimport classNames from 'classnames'\nimport Ellipsis from '../ellipsis'\nimport Icon from '../icon'\nimport './progress.less'\nexport * from 'antd/es/tooltip'\n\ninterface ExtendsProgress {\n  percentPosition?: 'bottom' | 'right'\n  label?: React.ReactNode\n  halfCircle?: boolean\n}\nconst iconMap = {\n  line: {\n    success: 'check-circle',\n    exception: 'close-circle',\n  },\n  circle: {\n    success: 'check',\n    exception: 'close',\n  },\n}\nconst ifPercentBottom = (type: string, percentPosition: string) => {\n  return type === 'line' && percentPosition === 'bottom'\n}\nconst percentTransform = (percent: number) => {\n  return percent >= 100 ? 100 : percent <= 0 ? 0 : percent\n}\n\nconst themeStrokeColor = (status?: string, strokeColor?: string | object, percent?: number) => {\n  return status !== 'success' && status !== 'exception' && !strokeColor && percent !== 100\n    ? 'var(--blue-5)'\n    : ''\n}\n\nconst Progress: React.FC<ProgressProps & ExtendsProgress> = (props) => {\n  const {\n    className,\n    type = 'line',\n    percentPosition = 'right',\n    percent = 0,\n    format,\n    size,\n    label,\n    width = 132,\n    status,\n    halfCircle,\n    gapDegree = props.halfCircle ? 135 : props.gapDegree,\n    strokeColor,\n    strokeWidth = 7,\n  } = props\n  const _percent = percentTransform(percent)\n  const _strokeColor = themeStrokeColor(status, strokeColor, _percent)\n  return (\n    <ConfigConsumer>\n      {({ getPrefixCls }) => {\n        const prefixCls = getPrefixCls('progress')\n\n        const CusLabelOrPercent = (props: { type: 'line' | 'circle'; theme?: ThemeType }) => {\n          const { type, theme } = props\n          const labelPercentClassName = classNames(`${prefixCls}-percent-bottom`, {\n            [`${prefixCls}-percent-bottom-${size}`]: size === 'small',\n            [`${prefixCls}-percent-bottom-${type}`]: type === 'line',\n          })\n\n          const showIcon = (status: 'success' | 'exception') => (\n            <Icon\n              type={`${iconMap[type][status]}`}\n              theme={theme}\n              className={classNames({\n                [`${labelPercentClassName} ${labelPercentClassName}-${status || 'success'}`]:\n                  type === 'line',\n              })}\n            />\n          )\n          const showPercent = (\n            <div className={labelPercentClassName}>\n              {format ? format?.(_percent) : _percent + '%'}\n            </div>\n          )\n\n          let displayContent\n          if (status === 'success' || status === 'exception') {\n            displayContent = showIcon(status)\n          } else if (status === 'normal' || status === 'active') {\n            displayContent = showPercent\n          } else {\n            // 如果状态为空\n            displayContent = _percent === 100 ? showIcon('success') : showPercent\n          }\n          return displayContent\n        }\n\n        const CusCircleAndDashboardFormat = (props: { widthNum: number }) => {\n          const { widthNum } = props\n          return (\n            <div className={`${prefixCls}-cus-format`}>\n              {!!label && (\n                <Ellipsis\n                  className={`${prefixCls}-cus-format-label`}\n                  title={label}\n                  widthLimit={widthNum <= 64 ? widthNum : 'calc(100% - 50px)'}\n                  placement={widthNum <= 64 ? 'bottom' : 'top'}\n                />\n              )}\n              <CusLabelOrPercent type=\"circle\" theme=\"outlined\" />\n            </div>\n          )\n        }\n\n        //line\n        const LineProgress: React.FC = () => (\n          <AntdProgress\n            strokeColor={_strokeColor}\n            {...props}\n            className={classNames('tnt-progress', className, {\n              [`${prefixCls}-percent-bottom`]: percentPosition === 'bottom',\n            })}\n          />\n        )\n\n        //circle,dashboard (额外新增label和半圆选项)\n        const CircleAndDashboardProgress: React.FC = () => {\n          const widthNum = Number(String(width).split('px').shift())\n          return (\n            <AntdProgress\n              gapDegree={gapDegree}\n              strokeColor={_strokeColor}\n              strokeWidth={strokeWidth}\n              {...props}\n              type={halfCircle ? 'dashboard' : type}\n              className={classNames('tnt-progress', `${prefixCls}-circle-progress`, className, {\n                [`${prefixCls}-small-circle`]: widthNum <= 64 && label,\n                [`${prefixCls}-large-circle`]: widthNum > 64 && label,\n                [`${prefixCls}-small-half-circle`]: halfCircle && widthNum <= 64 && label,\n                [`${prefixCls}-large-half-circle`]: halfCircle && widthNum > 64 && label,\n              })}\n              format={() => <CusCircleAndDashboardFormat widthNum={widthNum} />}\n            />\n          )\n        }\n\n        const progressMap = {\n          line: <LineProgress />,\n          circle: <CircleAndDashboardProgress />,\n          dashboard: <CircleAndDashboardProgress />,\n        }\n        return progressMap[type]\n      }}\n    </ConfigConsumer>\n  )\n}\n\nexport default Progress\n"]}

package/es/progress/progress.less

@@ -0,0 +1,82 @@
+@import '../style/themes/index.less';
+@import '../style/mixins/index';
+@progress-prefix-cls: ~'@{ant-prefix}-progress';
+.tnt-progress.@{progress-prefix-cls} {
+    .ant-progress-text{
+    //   font-family: PingFang SC;
+      font-weight: 500;
+    }
+    .ant-progress-cus-format-label{
+      .ant-progress-cus-format-label{
+        padding-bottom: 4px;
+      }
+    }
+    &-percent-bottom{
+        .ant-progress-outer{
+          padding-right: 0;
+        }
+        .ant-progress-text{
+          width: 100%;
+          display: block;
+          text-align: right;
+          margin-left: 0;
+        }
+    }
+    &-circle-progress{
+      .@{progress-prefix-cls}-cus-format{
+        height: 100%;
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        align-items: center;
+      }
+    }
+    &-small-circle{
+      .ant-progress-text{
+        height: 100%;
+      }
+      .ant-progress-inner{
+        overflow:visible;
+      }
+      .tntd-ellipsis{
+        position: absolute;
+        bottom: -1.8em;
+        font-size: 0.75em;
+        // margin-bottom: 2px;
+        // color: #8B919E;
+        color:tint(@text-color, 50%);
+        font-family: Inter;
+        font-weight: 500;
+        text-align: center;
+      }
+    }
+    &-large-circle{
+      .ant-progress-text{
+        height: 100%;
+      }
+      .tntd-ellipsis{
+        font-size: 0.55em;
+        // margin-bottom: 2px;
+        color:tint(@text-color, 50%);
+        font-family: Inter;
+        font-weight: 500;
+        text-align: center;
+      }
+    }
+    &-small-half-circle{
+      .ant-progress-text{
+        height: 40%;
+      }
+      .tntd-ellipsis{
+        bottom: -1.5em;
+      }
+    }
+    &-large-half-circle{
+      .ant-progress-inner{
+        .ant-progress-text{
+          top: 42%
+        }
+      }
+    }
+}
+

package/es/query-form/Field/Checkbox.js

@@ -15,7 +15,7 @@ export default (_a => {
     } = _a,
     props = __rest(_a, ["value", "onChange"]);
   return React.createElement(Checkbox, Object.assign({}, props, {
-    checked: value,
+    checked: !!value,
     onChange: evt => {
       onChange === null || onChange === void 0 ? void 0 : onChange(evt.target.checked);
     }

package/es/query-form/Field/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../src/query-form/Field/Checkbox.js"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,QAAQ,MAAM,gBAAgB,CAAA;AAErC,eAAe,CAAC,EAA6B,EAAE,EAAE;QAAjC,EAAE,KAAK,EAAE,QAAQ,OAAY,EAAP,KAAK,cAA3B,qBAA6B,CAAF;IAAO,OAAA,CAChD,oBAAC,QAAQ,oBACH,KAAK,IACT,OAAO,EAAE,KAAK,EACd,QAAQ,EAAE,CAAC,GAAG,EAAE,EAAE;YAChB,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,GAAG,CAAC,MAAM,CAAC,OAAO,CAAC,CAAA;QAChC,CAAC,IACD,CACH,CAAA;CAAA,CAAA","sourcesContent":["import React from 'react'\n\nimport Checkbox from '../../checkbox'\n\nexport default ({ value, onChange, ...props }) => (\n  <Checkbox\n    {...props}\n    checked={value}\n    onChange={(evt) => {\n      onChange?.(evt.target.checked)\n    }}\n  />\n)\n"]}
+{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../src/query-form/Field/Checkbox.js"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,QAAQ,MAAM,gBAAgB,CAAA;AAErC,eAAe,CAAC,EAA6B,EAAE,EAAE;QAAjC,EAAE,KAAK,EAAE,QAAQ,OAAY,EAAP,KAAK,cAA3B,qBAA6B,CAAF;IAAO,OAAA,CAChD,oBAAC,QAAQ,oBACH,KAAK,IACT,OAAO,EAAE,CAAC,CAAC,KAAK,EAChB,QAAQ,EAAE,CAAC,GAAG,EAAE,EAAE;YAChB,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,GAAG,CAAC,MAAM,CAAC,OAAO,CAAC,CAAA;QAChC,CAAC,IACD,CACH,CAAA;CAAA,CAAA","sourcesContent":["import React from 'react'\n\nimport Checkbox from '../../checkbox'\n\nexport default ({ value, onChange, ...props }) => (\n  <Checkbox\n    {...props}\n    checked={!!value}\n    onChange={(evt) => {\n      onChange?.(evt.target.checked)\n    }}\n  />\n)\n"]}

package/es/query-form/Field/Composition/FieldPopover.js

@@ -0,0 +1,304 @@
+import _find from "lodash/find";
+import _filter from "lodash/filter";
+import _cloneDeep from "lodash/cloneDeep";
+var __rest = this && this.__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+import React, { useEffect, useState, forwardRef, useImperativeHandle } from 'react';
+import { Empty } from '../../../empty';
+import Popover from '../../../popover';
+import Ellipsis from '../../../ellipsis';
+import SelectOpt from './Select';
+import { highlightSubstring, formatLabel, isInput } from './utils';
+import fieldsMap from '../fieldsMap';
+import './FieldPopover.less';
+const FieldPopover = (_a, ref) => {
+  var {
+      visible,
+      setVisible,
+      searchText,
+      children,
+      value,
+      regex,
+      fieldItems,
+      propItem,
+      setFieldItem,
+      onChange,
+      form,
+      locale,
+      clsPrefix
+    } = _a,
+    props = __rest(_a, ["visible", "setVisible", "searchText", "children", "value", "regex", "fieldItems", "propItem", "setFieldItem", "onChange", "form", "locale", "clsPrefix"]);
+  const [searchTarget, setSearchTarget] = useState(undefined);
+  const [popoverContent, setPopoverContent] = useState(false);
+  const onPropsClick = props => {
+    const {
+      type = 'input',
+      component
+    } = props || {};
+    const copyValue = _cloneDeep(value);
+    if (!(copyValue === null || copyValue === void 0 ? void 0 : copyValue.find(v => v.key === props.name))) {
+      copyValue.push({
+        key: props.name,
+        value: type === 'array' ? [] : undefined,
+        closable: true
+      });
+    }
+    setFieldItem(props);
+    if (isInput(type) && !component) {
+      const target = copyValue.find(v => v.key === props.name);
+      onChange(target, true);
+      close();
+      return;
+    }
+    setVisible(true);
+    setPopoverContent(true);
+    onChange(copyValue);
+  };
+  useImperativeHandle(ref, () => ({
+    onPropsClick
+  }));
+  const onSelectChange = (v, isMultiple) => {
+    var _a, _b, _c, _d;
+    const propObj = (v === null || v === void 0 ? void 0 : v.propItem) || propItem || {};
+    const {
+      props: fieldProps
+    } = propObj; // 直接搜索拿v.xx的值
+    const copyValue = _cloneDeep(value || []);
+    let index;
+    if (v === null || v === void 0 ? void 0 : v.propItem) {
+      // 模糊搜索
+      const _index = copyValue.findIndex(vv => {
+        var _a;
+        return vv.key === ((_a = v.propItem) === null || _a === void 0 ? void 0 : _a.name);
+      });
+      if (_index > -1) {
+        index = _index;
+      } else {
+        copyValue.push({
+          key: (_a = v.propItem) === null || _a === void 0 ? void 0 : _a.name,
+          value: isMultiple ? [] : ''
+        });
+        index = copyValue.length - 1;
+      }
+      setFieldItem(v.propItem);
+    } else {
+      // 选择值
+      index = copyValue.findIndex(v => v.key === (propItem === null || propItem === void 0 ? void 0 : propItem.name));
+    }
+    if (isMultiple) {
+      if (!((_c = (_b = copyValue[index]) === null || _b === void 0 ? void 0 : _b.value) === null || _c === void 0 ? void 0 : _c.length)) {
+        copyValue[index].value = [v === null || v === void 0 ? void 0 : v.value];
+      } else {
+        if (((_d = copyValue[index].value) === null || _d === void 0 ? void 0 : _d.indexOf(v.value)) > -1) {
+          copyValue[index].value = copyValue[index].value.filter(val => val !== v.value);
+        } else {
+          copyValue[index].value.push(v.value);
+        }
+      }
+      // 如果是模糊搜索-展开多选项
+      if (v === null || v === void 0 ? void 0 : v.propItem) {
+        setFieldItem(v === null || v === void 0 ? void 0 : v.propItem);
+        setVisible(true);
+        setPopoverContent(true);
+      }
+    } else {
+      copyValue[index].value = v === null || v === void 0 ? void 0 : v.value;
+      close();
+    }
+    copyValue[index].closable = true;
+    onChange(copyValue, false, true);
+    (fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.onChange) && fieldProps.onChange(copyValue[index].value);
+  };
+  const onFieldChange = (...args) => {
+    var _a;
+    const {
+      type,
+      component,
+      props: fieldProps
+    } = propItem || {};
+    const copyValue = _cloneDeep(value);
+    const index = copyValue.findIndex(v => v.key === (propItem === null || propItem === void 0 ? void 0 : propItem.name));
+    copyValue[index].value = args[0];
+    if (['date', 'checkbox'].includes(type) || type === 'dateRange' && ((_a = args[1]) === null || _a === void 0 ? void 0 : _a[1])) {
+      close();
+    }
+    copyValue[index].closable = true;
+    onChange(copyValue, false, args[0] !== undefined, type !== 'selectInput');
+    (fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.onChange) && fieldProps.onChange(copyValue[index].value);
+  };
+  const close = () => {
+    setVisible(false);
+    setTimeout(() => {
+      setFieldItem();
+      setPopoverContent(false);
+    }, 1);
+  };
+  const handleVisibleChange = () => {
+    if (!visible && !regex.test(searchText)) {
+      setVisible(true);
+    } else {
+      close();
+    }
+  };
+  useEffect(() => {
+    let bool1 = false,
+      bool2 = false;
+    if (searchText && !propItem) {
+      fieldItems === null || fieldItems === void 0 ? void 0 : fieldItems.forEach(v => {
+        const {
+          name,
+          propsTitle,
+          title,
+          type,
+          props
+        } = v.props || {};
+        const _propsTitle = propsTitle || title || name;
+        if ((_propsTitle === null || _propsTitle === void 0 ? void 0 : _propsTitle.indexOf(searchText)) > -1) {
+          bool1 = true;
+        }
+        const sOptions = type !== 'select' ? [] : (props === null || props === void 0 ? void 0 : props.options) || [];
+        const fieldNames = props === null || props === void 0 ? void 0 : props.fieldNames;
+        const target = sOptions === null || sOptions === void 0 ? void 0 : sOptions.find(item => {
+          const labelKey = (fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.label) || 'label';
+          const label = item instanceof Object ? item[labelKey] : item + '';
+          return (React.isValidElement(label) ? formatLabel(label) : label).indexOf(searchText) > -1;
+        });
+        if (target) {
+          bool2 = true;
+        }
+      });
+      setSearchTarget(!bool2 && !bool1 ? null : {
+        propsTitle: bool1,
+        propsValue: bool2
+      });
+    } else {
+      setSearchTarget(undefined);
+    }
+  }, [fieldItems, searchText, propItem]);
+  const renderFirstOptions = () => {
+    const firstItems = searchText ? _filter(fieldItems, v => {
+      const {
+        name,
+        propsTitle,
+        title
+      } = v.props || {};
+      const _propsTitle = propsTitle || title || name;
+      return (_propsTitle === null || _propsTitle === void 0 ? void 0 : _propsTitle.indexOf(searchText)) > -1;
+    }) : fieldItems;
+    const secondItems = searchText ? _filter(fieldItems, v => {
+      const {
+        type,
+        props
+      } = v.props || {};
+      const {
+        options,
+        loadData,
+        fieldNames
+      } = props || {};
+      return type === 'select' && !loadData && !!_find(options, item => {
+        const labelKey = (fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.label) || 'label';
+        const label = item instanceof Object ? item[labelKey] : item + '';
+        const isReactDom = React.isValidElement(label);
+        const _label = isReactDom ? formatLabel(label) : label;
+        return (_label === null || _label === void 0 ? void 0 : _label.indexOf(searchText)) > -1;
+      });
+    }) : [];
+    return React.createElement("div", null, firstItems.length > 0 && React.createElement(React.Fragment, null, (!searchText || (searchTarget === null || searchTarget === void 0 ? void 0 : searchTarget.propsTitle)) && React.createElement("label", null, locale.propTitle), React.createElement("ul", {
+      className: "ant-select-dropdown-menu"
+    }, firstItems.map(v => {
+      const {
+        name,
+        propsTitle,
+        title,
+        type,
+        props
+      } = v.props || {};
+      const _propsTitle = propsTitle || title || name;
+      return React.createElement("li", {
+        className: "ant-select-dropdown-menu-item",
+        key: name,
+        value: name,
+        onMouseDown: e => e.preventDefault(),
+        onClick: () => {
+          onPropsClick(v.props);
+        }
+      }, React.createElement(Ellipsis, {
+        widthLimit: 220,
+        title: searchText ? React.createElement("span", {
+          dangerouslySetInnerHTML: {
+            __html: highlightSubstring(_propsTitle, searchText)
+          }
+        }) : _propsTitle
+      }));
+    }))), secondItems.length > 0 && React.createElement("div", null, (searchTarget === null || searchTarget === void 0 ? void 0 : searchTarget.propsValue) && React.createElement("label", null, locale.propValue), fieldItems === null || fieldItems === void 0 ? void 0 : fieldItems.map(v => {
+      const {
+        name,
+        type,
+        props
+      } = v.props || {};
+      const target = value === null || value === void 0 ? void 0 : value.find(v => v.key === name);
+      if (type === 'select') {
+        return React.createElement(SelectOpt, Object.assign({
+          key: name
+        }, props, {
+          searchText: searchText,
+          propItem: v.props,
+          onChange: onSelectChange,
+          value: target === null || target === void 0 ? void 0 : target.value
+        }));
+      }
+      return;
+    })), !firstItems.length && !secondItems.length && React.createElement(Empty, {
+      size: "mini"
+    }));
+  };
+  const renderSecondOptions = () => {
+    var _a;
+    const {
+      name,
+      propsTitle,
+      title,
+      type,
+      className,
+      component,
+      props: fieldProps
+    } = propItem || {};
+    const target = value === null || value === void 0 ? void 0 : value.find(v => v.key === name);
+    const Field = component || fieldsMap[type] || (() => null);
+    return React.createElement("div", {
+      onClick: e => e.stopPropagation(),
+      className: className
+    }, React.createElement("label", null, propsTitle || title || name), type === 'select' ? React.createElement(SelectOpt, Object.assign({}, fieldProps, {
+      searchText: searchText,
+      propItem: propItem,
+      onChange: onSelectChange,
+      value: target === null || target === void 0 ? void 0 : target.value
+    })) : React.createElement("div", {
+      className: `${clsPrefix}-field-popover-content`,
+      onClick: e => e.stopPropagation()
+    }, React.createElement(Field, Object.assign({
+      form: form,
+      value: target === null || target === void 0 ? void 0 : target.value
+    }, fieldProps, {
+      style: Object.assign(Object.assign({}, fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.style), {
+        width: ((_a = fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.style) === null || _a === void 0 ? void 0 : _a.width) || '250px'
+      }),
+      close: close,
+      onChange: onFieldChange
+    }))));
+  };
+  return React.createElement(Popover, Object.assign({
+    trigger: "click",
+    visible: visible,
+    overlayClassName: `${clsPrefix}-field-popover`,
+    content: !popoverContent ? renderFirstOptions() : renderSecondOptions(),
+    onVisibleChange: handleVisibleChange
+  }, props), children);
+};
+export default forwardRef(FieldPopover);

package/es/query-form/Field/Composition/FieldPopover.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldPopover.js","sourceRoot":"","sources":["../../../../src/query-form/Field/Composition/FieldPopover.js"],"names":[],"mappings":"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","sourcesContent":["import React, { useEffect, useState, forwardRef, useImperativeHandle } from 'react'\nimport { cloneDeep, filter, find } from 'lodash'\nimport { Empty } from '../../../empty'\nimport Popover from '../../../popover'\nimport Ellipsis from '../../../ellipsis'\nimport SelectOpt from './Select'\nimport { highlightSubstring, formatLabel, isInput } from './utils'\nimport fieldsMap from '../fieldsMap'\nimport './FieldPopover.less'\n\nconst FieldPopover = (\n  {\n    visible,\n    setVisible,\n    searchText,\n    children,\n    value,\n    regex,\n    fieldItems,\n    propItem,\n    setFieldItem,\n    onChange,\n    form,\n    locale,\n    clsPrefix,\n    ...props\n  },\n  ref\n) => {\n  const [searchTarget, setSearchTarget] = useState(undefined)\n  const [popoverContent, setPopoverContent] = useState(false)\n\n  const onPropsClick = (props) => {\n    const { type = 'input', component } = props || {}\n    const copyValue = cloneDeep(value)\n    if (!copyValue?.find((v) => v.key === props.name)) {\n      copyValue.push({\n        key: props.name,\n        value: type === 'array' ? [] : undefined,\n        closable: true,\n      })\n    }\n    setFieldItem(props)\n    if (isInput(type) && !component) {\n      const target = copyValue.find((v) => v.key === props.name)\n      onChange(target, true)\n      close()\n      return\n    }\n    setVisible(true)\n    setPopoverContent(true)\n    onChange(copyValue)\n  }\n\n  useImperativeHandle(ref, () => ({\n    onPropsClick,\n  }))\n\n  const onSelectChange = (v, isMultiple) => {\n    const propObj = v?.propItem || propItem || {}\n    const { props: fieldProps } = propObj // 直接搜索拿v.xx的值\n    const copyValue = cloneDeep(value || [])\n    let index\n    if (v?.propItem) {\n      // 模糊搜索\n      const _index = copyValue.findIndex((vv) => vv.key === v.propItem?.name)\n      if (_index > -1) {\n        index = _index\n      } else {\n        copyValue.push({\n          key: v.propItem?.name,\n          value: isMultiple ? [] : '',\n        })\n        index = copyValue.length - 1\n      }\n      setFieldItem(v.propItem)\n    } else {\n      // 选择值\n      index = copyValue.findIndex((v) => v.key === propItem?.name)\n    }\n\n    if (isMultiple) {\n      if (!copyValue[index]?.value?.length) {\n        copyValue[index].value = [v?.value]\n      } else {\n        if (copyValue[index].value?.indexOf(v.value) > -1) {\n          copyValue[index].value = copyValue[index].value.filter((val) => val !== v.value)\n        } else {\n          copyValue[index].value.push(v.value)\n        }\n      }\n      // 如果是模糊搜索-展开多选项\n      if (v?.propItem) {\n        setFieldItem(v?.propItem)\n        setVisible(true)\n        setPopoverContent(true)\n      }\n    } else {\n      copyValue[index].value = v?.value\n      close()\n    }\n\n    copyValue[index].closable = true\n    onChange(copyValue, false, true)\n    fieldProps?.onChange && fieldProps.onChange(copyValue[index].value)\n  }\n\n  const onFieldChange = (...args) => {\n    const { type, component, props: fieldProps } = propItem || {}\n    const copyValue = cloneDeep(value)\n    const index = copyValue.findIndex((v) => v.key === propItem?.name)\n    copyValue[index].value = args[0]\n    if (['date', 'checkbox'].includes(type) || (type === 'dateRange' && args[1]?.[1])) {\n      close()\n    }\n    copyValue[index].closable = true\n    onChange(copyValue, false, args[0] !== undefined, type !== 'selectInput')\n    fieldProps?.onChange && fieldProps.onChange(copyValue[index].value)\n  }\n\n  const close = () => {\n    setVisible(false)\n    setTimeout(() => {\n      setFieldItem()\n      setPopoverContent(false)\n    }, 1)\n  }\n  const handleVisibleChange = () => {\n    if (!visible && !regex.test(searchText)) {\n      setVisible(true)\n    } else {\n      close()\n    }\n  }\n\n  useEffect(() => {\n    let bool1 = false,\n      bool2 = false\n\n    if (searchText && !propItem) {\n      fieldItems?.forEach((v) => {\n        const { name, propsTitle, title, type, props } = v.props || {}\n        const _propsTitle = propsTitle || title || name\n        if (_propsTitle?.indexOf(searchText) > -1) {\n          bool1 = true\n        }\n        const sOptions = type !== 'select' ? [] : props?.options || []\n        const fieldNames = props?.fieldNames\n        const target = sOptions?.find((item) => {\n          const labelKey = fieldNames?.label || 'label'\n          const label = item instanceof Object ? item[labelKey] : item + ''\n          return (React.isValidElement(label) ? formatLabel(label) : label).indexOf(searchText) > -1\n        })\n        if (target) {\n          bool2 = true\n        }\n      })\n      setSearchTarget(!bool2 && !bool1 ? null : { propsTitle: bool1, propsValue: bool2 })\n    } else {\n      setSearchTarget(undefined)\n    }\n  }, [fieldItems, searchText, propItem])\n\n  const renderFirstOptions = () => {\n    const firstItems = searchText\n      ? filter(fieldItems, (v) => {\n          const { name, propsTitle, title } = v.props || {}\n          const _propsTitle = propsTitle || title || name\n          return _propsTitle?.indexOf(searchText) > -1\n        })\n      : fieldItems\n    const secondItems = searchText\n      ? filter(fieldItems, (v) => {\n          const { type, props } = v.props || {}\n          const { options, loadData, fieldNames } = props || {}\n          return (\n            type === 'select' &&\n            !loadData &&\n            !!find(options, (item) => {\n              const labelKey = fieldNames?.label || 'label'\n              const label = item instanceof Object ? item[labelKey] : item + ''\n              const isReactDom = React.isValidElement(label)\n              const _label = isReactDom ? formatLabel(label) : label\n              return _label?.indexOf(searchText) > -1\n            })\n          )\n        })\n      : []\n    return (\n      <div>\n        {firstItems.length > 0 && (\n          <>\n            {(!searchText || searchTarget?.propsTitle) && <label>{locale.propTitle}</label>}\n            <ul className=\"ant-select-dropdown-menu\">\n              {firstItems.map((v) => {\n                const { name, propsTitle, title, type, props } = v.props || {}\n                const _propsTitle = propsTitle || title || name\n                return (\n                  <li\n                    className=\"ant-select-dropdown-menu-item\"\n                    key={name}\n                    value={name}\n                    onMouseDown={(e) => e.preventDefault()}\n                    onClick={() => {\n                      onPropsClick(v.props)\n                    }}\n                  >\n                    <Ellipsis\n                      widthLimit={220}\n                      title={\n                        searchText ? (\n                          <span\n                            dangerouslySetInnerHTML={{\n                              __html: highlightSubstring(_propsTitle, searchText),\n                            }}\n                          />\n                        ) : (\n                          _propsTitle\n                        )\n                      }\n                    />\n                  </li>\n                )\n              })}\n            </ul>\n          </>\n        )}\n\n        {/* 可以对下拉框值筛选 */}\n        {secondItems.length > 0 && (\n          <div>\n            {searchTarget?.propsValue && <label>{locale.propValue}</label>}\n            {fieldItems?.map((v) => {\n              const { name, type, props } = v.props || {}\n              const target = value?.find((v) => v.key === name)\n              if (type === 'select') {\n                return (\n                  <SelectOpt\n                    key={name}\n                    {...props}\n                    searchText={searchText}\n                    propItem={v.props}\n                    onChange={onSelectChange}\n                    value={target?.value}\n                  />\n                )\n              }\n              return\n            })}\n          </div>\n        )}\n        {!firstItems.length && !secondItems.length && <Empty size=\"mini\" />}\n      </div>\n    )\n  }\n\n  const renderSecondOptions = () => {\n    const {\n      name,\n      propsTitle,\n      title,\n      type,\n      className,\n      component,\n      props: fieldProps,\n    } = propItem || {}\n    const target = value?.find((v) => v.key === name)\n    const Field = component || fieldsMap[type] || (() => null)\n    return (\n      <div onClick={(e) => e.stopPropagation()} className={className}>\n        <label>{propsTitle || title || name}</label>\n        {type === 'select' ? (\n          <SelectOpt\n            {...fieldProps}\n            searchText={searchText}\n            propItem={propItem}\n            onChange={onSelectChange}\n            value={target?.value}\n          />\n        ) : (\n          <div\n            className={`${clsPrefix}-field-popover-content`}\n            onClick={(e) => e.stopPropagation()}\n          >\n            <Field\n              form={form}\n              value={target?.value}\n              {...fieldProps}\n              style={{\n                ...fieldProps?.style,\n                width: fieldProps?.style?.width || '250px',\n              }}\n              close={close}\n              onChange={onFieldChange}\n            />\n          </div>\n        )}\n      </div>\n    )\n  }\n\n  return (\n    <Popover\n      trigger=\"click\"\n      visible={visible}\n      overlayClassName={`${clsPrefix}-field-popover`}\n      content={!popoverContent ? renderFirstOptions() : renderSecondOptions()}\n      onVisibleChange={handleVisibleChange}\n      {...props}\n    >\n      {children}\n    </Popover>\n  )\n}\nexport default forwardRef(FieldPopover)\n"]}

package/es/query-form/Field/Composition/FieldPopover.less

@@ -0,0 +1,35 @@
+.tnt-queryform-field-popover {
+  min-width: 280px;
+  .ant-popover-inner-content {
+    padding: @padding-sm 0;
+  }
+  // .ant-calendar-picker {
+  //   margin: @margin-xxs 0;
+  // }
+  label {
+    color: tint(@text-color, 50%);
+    margin-bottom: @margin-xs;
+    display: block;
+    padding: 0 @padding-sm;
+  }
+  .ant-select-dropdown-menu {
+    &-item {
+      padding: @padding-xxs @padding-sm;
+      &:hover {
+        background-color: @bg-color-quaternary;
+      }
+    }
+  }
+  &-content {
+    padding: @padding-xxs @padding-sm;
+  }
+  .ant-select-selected-icon {
+    position: absolute;
+    right: @margin-base;
+    top: @margin-xs;
+    color: @blue-6;
+  }
+  .tnt-highlight {
+    color: @blue-6;
+  }
+}