From b3ffa25e449c80b27fe99928699f432e8405a011 Mon Sep 17 00:00:00 2001 From: limengyang03 Date: Tue, 8 Nov 2022 17:17:08 +0800 Subject: [PATCH 1/4] =?UTF-8?q?feat:=20input-range=E5=B1=9E=E6=80=A7?= =?UTF-8?q?=E9=85=8D=E7=BD=AE=E4=B8=8B=E7=9A=84=E4=B8=8B=E6=A0=87=E5=86=85?= =?UTF-8?q?=E5=AE=B9=E8=BF=87=E9=95=BF=E6=97=B6=E9=81=AE=E6=8C=A1=E6=BB=91?= =?UTF-8?q?=E5=9D=97=E4=B8=8B=E7=9A=84=E5=85=B6=E4=BB=96=E7=BB=84=E4=BB=B6?= =?UTF-8?q?=E5=90=8D=E7=A7=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../amis-ui/scss/components/form/_range.scss | 7 +++ packages/amis-ui/src/components/Range.tsx | 44 +++++++++++++++++-- .../Form/__snapshots__/range.test.tsx.snap | 12 ++--- 3 files changed, 53 insertions(+), 10 deletions(-) diff --git a/packages/amis-ui/scss/components/form/_range.scss b/packages/amis-ui/scss/components/form/_range.scss index 068ad02ee..e81319a7c 100644 --- a/packages/amis-ui/scss/components/form/_range.scss +++ b/packages/amis-ui/scss/components/form/_range.scss @@ -266,13 +266,20 @@ &-marks { position: relative; top: 8px; + div { position: absolute; top: 0; + transform: translateX(-50%); + span { position: absolute; left: 50%; transform: translateX(-50%); + white-space: nowrap; + max-width: 100%; + overflow: hidden; + text-overflow: ellipsis; } } } diff --git a/packages/amis-ui/src/components/Range.tsx b/packages/amis-ui/src/components/Range.tsx index 8dbb72334..e611b0280 100644 --- a/packages/amis-ui/src/components/Range.tsx +++ b/packages/amis-ui/src/components/Range.tsx @@ -9,6 +9,7 @@ import keys from 'lodash/keys'; import isString from 'lodash/isString'; import difference from 'lodash/difference'; import React from 'react'; +import TooltipWrapper from './TooltipWrapper'; import {uncontrollable} from 'amis-core'; import {Overlay} from 'amis-core'; @@ -451,6 +452,30 @@ export class Range extends React.Component { return ((value - min) * 100) / (max - min) + '%'; } + /** + * 计算每个刻度标记mark 的最大宽度 max-width + * 通过给父元素div的width赋值，从而继承 + * @param value 刻度标记key + * @param marks 整个刻度标记对象 + * @returns 刻度标记的最大宽度 string + */ + @autobind + getMarkMaxWidth(value: keyof MarksType, marks: MarksType) { + const {max, min} = this.props; + const curNum = isString(value) ? parseInt(value, 10) : value; + // 给最大宽度赋初始值 默认最大 + let maxWidth = Math.abs(max - min); + // 遍历刻度标记masks 寻找距离当前节点最近的刻度标记 并记录差值 + keys(marks).forEach((mKey: keyof MarksType) => { + const mNum = isString(mKey) ? parseInt(mKey, 10) : mKey; + if (mKey !== value) { + maxWidth = Math.min(Math.abs(curNum - mNum), maxWidth); + } + }); + // 差值的1/2 即为此刻度标记的最大宽度 + return Math.floor(maxWidth / 2) + '%'; + } + render() { const { classnames: cx, @@ -552,12 +577,23 @@ export class Range extends React.Component {
{keys(marks).map((key: keyof MarksType) => { const offsetLeft = this.getOffsetLeft(key); + const markMaxWidth = this.getMarkMaxWidth(key, marks); if (MARKS_REG.test(offsetLeft)) { return ( -
- - {(marks[key] as any)?.label || marks[key]} - +
+ + + {(marks[key] as any)?.label || marks[key]} + +
); } else { diff --git a/packages/amis/__tests__/renderers/Form/__snapshots__/range.test.tsx.snap b/packages/amis/__tests__/renderers/Form/__snapshots__/range.test.tsx.snap index c3680c0cb..f6880a408 100644 --- a/packages/amis/__tests__/renderers/Form/__snapshots__/range.test.tsx.snap +++ b/packages/amis/__tests__/renderers/Form/__snapshots__/range.test.tsx.snap @@ -170,42 +170,42 @@ exports[`Renderer:range with marks 1`] = ` class="cxd-InputRange-marks" >
0
20Mbps
40Mbps
60Mbps
80Mbps
100 From 6c51c9a4e8f1c58edd7141bd96a77c339de5dd47 Mon Sep 17 00:00:00 2001 From: qianxiaofendou Date: Fri, 5 May 2023 11:34:01 +0800 Subject: [PATCH 2/4] =?UTF-8?q?chore:=20Tree=E7=BB=84=E4=BB=B6onleyleaf?= =?UTF-8?q?=E4=B8=BAtrue=E6=97=B6children=E4=B8=A5=E6=A0=BC=E5=88=A4?= =?UTF-8?q?=E6=96=AD=E7=B1=BB=E5=9E=8B=20(#6012)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: liaoxuezhi <2betop.cn@gmail.com> --- packages/amis-ui/src/components/Tree.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/amis-ui/src/components/Tree.tsx b/packages/amis-ui/src/components/Tree.tsx index d053745d1..3dfae5bf2 100644 --- a/packages/amis-ui/src/components/Tree.tsx +++ b/packages/amis-ui/src/components/Tree.tsx @@ -449,7 +449,7 @@ export class TreeSelector extends React.Component< return; } - if (onlyLeaf && node.children) { + if (onlyLeaf && (Array.isArray(node.children) && node.children.length)) { return; } @@ -1096,7 +1096,7 @@ export class TreeSelector extends React.Component< const iconValue = item[iconField] || (enableDefaultIcon !== false - ? item.children + ? (Array.isArray(item.children) && item.children.length) ? 'folder' : 'file' : false); @@ -1159,7 +1159,7 @@ export class TreeSelector extends React.Component< From 47cceaa9b8d6f0f053fa81c68b09c0ca0cb5ee07 Mon Sep 17 00:00:00 2001 From: 2betop <2betop.cn@gmail.com> Date: Fri, 5 May 2023 13:41:38 +0800 Subject: [PATCH 3/4] =?UTF-8?q?=E6=9B=B4=E6=96=B0=20snapshot?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../amis/__tests__/renderers/__snapshots__/CRUD.test.tsx.snap | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/amis/__tests__/renderers/__snapshots__/CRUD.test.tsx.snap b/packages/amis/__tests__/renderers/__snapshots__/CRUD.test.tsx.snap index 7fd420e6d..f7233c332 100644 --- a/packages/amis/__tests__/renderers/__snapshots__/CRUD.test.tsx.snap +++ b/packages/amis/__tests__/renderers/__snapshots__/CRUD.test.tsx.snap @@ -4649,6 +4649,7 @@ exports[`Renderer:crud loadDataOnce 1`] = `
Date: Fri, 5 May 2023 09:06:12 +0200 Subject: [PATCH 4/4] Added support for German to momentjs calendar (#6580) --- packages/amis-ui/src/components/DatePicker.tsx | 1 + packages/amis/src/renderers/Form/InputDate.tsx | 1 + packages/amis/src/renderers/Form/InputDateRange.tsx | 1 + 3 files changed, 3 insertions(+) diff --git a/packages/amis-ui/src/components/DatePicker.tsx b/packages/amis-ui/src/components/DatePicker.tsx index ab2dab501..2f4e5ab4f 100644 --- a/packages/amis-ui/src/components/DatePicker.tsx +++ b/packages/amis-ui/src/components/DatePicker.tsx @@ -7,6 +7,7 @@ import React from 'react'; import moment from 'moment'; import 'moment/locale/zh-cn'; +import 'moment/locale/de'; import {Icon} from './icons'; import {PopOver} from 'amis-core'; import PopUp from './PopUp'; diff --git a/packages/amis/src/renderers/Form/InputDate.tsx b/packages/amis/src/renderers/Form/InputDate.tsx index 0401190b9..e03321d00 100644 --- a/packages/amis/src/renderers/Form/InputDate.tsx +++ b/packages/amis/src/renderers/Form/InputDate.tsx @@ -9,6 +9,7 @@ import cx from 'classnames'; import {filterDate, isPureVariable, resolveVariableAndFilter} from 'amis-core'; import moment from 'moment'; import 'moment/locale/zh-cn'; +import 'moment/locale/de'; import {DatePicker} from 'amis-ui'; import {FormBaseControlSchema, SchemaObject} from '../../Schema'; import {createObject, anyChanged, isMobile, autobind} from 'amis-core'; diff --git a/packages/amis/src/renderers/Form/InputDateRange.tsx b/packages/amis/src/renderers/Form/InputDateRange.tsx index 0369e8047..975ff91a6 100644 --- a/packages/amis/src/renderers/Form/InputDateRange.tsx +++ b/packages/amis/src/renderers/Form/InputDateRange.tsx @@ -8,6 +8,7 @@ import { import cx from 'classnames'; import {filterDate, parseDuration} from 'amis-core'; import 'moment/locale/zh-cn'; +import 'moment/locale/de'; import {DateRangePicker} from 'amis-ui'; import {isMobile, createObject, autobind} from 'amis-core'; import {ActionObject} from 'amis-core';