test/amis
1
0
Fork 0
mirror of https://gitee.com/baidu/amis.git synced 2024-12-04 21:08:55 +08:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Merge branch 'master' into feat-comp-context

Browse Source
This commit is contained in:
lvxiaojiao 2023-05-05 15:30:28 +08:00
commit c4f7a05fa9
8 changed files with 60 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
packages/amis-ui/scss/components/form/_range.scss
View File

@ -291,10 +291,16 @@
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;
}
}
}

1
packages/amis-ui/src/components/DatePicker.tsx
View File

@ -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';

44
packages/amis-ui/src/components/Range.tsx
View File

@ -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<RangeItemProps, any> {
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<RangeItemProps, any> {
<div className={cx('InputRange-marks')}>
{keys(marks).map((key: keyof MarksType) => {
const offsetLeft = this.getOffsetLeft(key);
const markMaxWidth = this.getMarkMaxWidth(key, marks);
if (MARKS_REG.test(offsetLeft)) {
return (
<div key={key} style={{left: offsetLeft}}>
<span style={(marks[key] as any)?.style}>
{(marks[key] as any)?.label || marks[key]}
</span>
<div
key={key}
style={{left: offsetLeft, width: markMaxWidth}}
>
<TooltipWrapper
placement={'bottom'}
tooltip={(marks[key] as any)?.label || marks[key]}
trigger={['hover', 'focus']}
rootClose={false}
>
<span style={(marks[key] as any)?.style}>
{(marks[key] as any)?.label || marks[key]}
</span>
</TooltipWrapper>
</div>
);
} else {

6
packages/amis-ui/src/components/Tree.tsx
View File

@ -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<
<i
className={cx(
`Tree-itemIcon ${
item.children ? 'Tree-folderIcon' : 'Tree-leafIcon'
(Array.isArray(item.children) && item.children.length) ? 'Tree-folderIcon' : 'Tree-leafIcon'
}`
)}
onClick={() =>

12
packages/amis/__tests__/renderers/Form/__snapshots__/range.test.tsx.snap
View File

@ -170,42 +170,42 @@ exports[`Renderer:range with marks 1`] = `
class="cxd-InputRange-marks"
>
<div
style="left: 0%;"
style="left: 0%; width: 10%;"
>
<span>
0
</span>
</div>
<div
style="left: 20%;"
style="left: 20%; width: 10%;"
>
<span>
20Mbps
</span>
</div>
<div
style="left: 40%;"
style="left: 40%; width: 10%;"
>
<span>
40Mbps
</span>
</div>
<div
style="left: 60%;"
style="left: 60%; width: 10%;"
>
<span>
60Mbps
</span>
</div>
<div
style="left: 80%;"
style="left: 80%; width: 10%;"
>
<span>
80Mbps
</span>
</div>
<div
style="left: 100%;"
style="left: 100%; width: 10%;"
>
<span>
100

2
packages/amis/__tests__/renderers/__snapshots__/CRUD.test.tsx.snap
View File

@ -4649,6 +4649,7 @@ exports[`Renderer:crud loadDataOnce 1`] = `
</div>
<span
class="cxd-TableCell-sortBtn"
data-index="8"
>
<i
class="cxd-TableCell-sortBtn--down"
@ -5557,6 +5558,7 @@ exports[`Renderer:crud loadDataOnce 1`] = `
</div>
<span
class="cxd-TableCell-sortBtn"
data-index="8"
>
<i
class="cxd-TableCell-sortBtn--down"

1
packages/amis/src/renderers/Form/InputDate.tsx
View File

@ -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';

1
packages/amis/src/renderers/Form/InputDateRange.tsx
View File

@ -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';