Merge branch 'arco-design:main' into main

arco-design · Sep 8, 2023 · c440c48 · c440c48
2 parents caaf31b + d614142
commit c440c48
Show file tree

Hide file tree

Showing 41 changed files with 857 additions and 189 deletions.
diff --git a/packages/web-vue/CHANGELOG.md b/packages/web-vue/CHANGELOG.md
@@ -2,6 +2,47 @@
 changelog: true
 ```
 
+## 2.51.1
+
+`2023-09-08`
+
+### 🐛 BugFix
+
+- **cascader:** fix empty state in Cascader Virtual list ([#2686](https://github.com/arco-design/arco-design-vue/pull/2686))
+
+
+## 2.51.0
+
+`2023-09-01`
+
+### ⚠️ Important Attention
+
+- **form:** `form-item` render element adds `id` attribute, please pay attention to the impact on the original web page
+
+### 🆕 Feature
+
+- **form:** add scroll into view to the field ([#2680](https://github.com/arco-design/arco-design-vue/pull/2680))
+- **table:** Support displaying empty subtrees ([#2673](https://github.com/arco-design/arco-design-vue/pull/2673))
+- **select:** support boolean type ([#2661](https://github.com/arco-design/arco-design-vue/pull/2661))
+
+### 🐛 BugFix
+
+- **typography:** Fix the problem of missing related component styles when importing on demand ([#2682](https://github.com/arco-design/arco-design-vue/pull/2682))
+
+
+## 2.50.2
+
+`2023-08-25`
+
+### 🐛 BugFix
+
+- fix the wrong scrolling position of the virtual list ([#2665](https://github.com/arco-design/arco-design-vue/pull/2665))
+
+### 💎 Enhancement
+
+- **input-number:** Optimize the long-press effect of the step button ([#2668](https://github.com/arco-design/arco-design-vue/pull/2668))
+
+
 ## 2.50.1
 
 `2023-08-18`

diff --git a/packages/web-vue/CHANGELOG.zh-CN.md b/packages/web-vue/CHANGELOG.zh-CN.md
@@ -2,6 +2,47 @@
 changelog: true
 ```
 
+## 2.51.1
+
+`2023-09-08`
+
+### 🐛 问题修复
+
+- **cascader:** 修复开启虚拟列表时空状态不显示 ([#2686](https://github.com/arco-design/arco-design-vue/pull/2686))
+
+
+## 2.51.0
+
+`2023-09-01`
+
+### ⚠️ 重点注意
+
+- **form:** `form-item` 渲染元素增加 `id` 属性，请注意对原始网页的影响
+
+### 🆕 新增功能
+
+- **form:** 新增滚动到指定表单字段 ([#2680](https://github.com/arco-design/arco-design-vue/pull/2680))
+- **table:** 支持显示空子树 ([#2673](https://github.com/arco-design/arco-design-vue/pull/2673))
+- **select:** 支持`boolean` 类型 ([#2661](https://github.com/arco-design/arco-design-vue/pull/2661))
+
+### 🐛 问题修复
+
+- **typography:** 修复按需导入时缺少相关组件样式的问题 ([#2682](https://github.com/arco-design/arco-design-vue/pull/2682))
+
+
+## 2.50.2
+
+`2023-08-25`
+
+### 🐛 问题修复
+
+- 修复虚拟滚动 scrollTop 位置不对 ([#2665](https://github.com/arco-design/arco-design-vue/pull/2665))
+
+### 💎 功能优化
+
+- **input-number:** 优化步长按钮的长按效果 ([#2668](https://github.com/arco-design/arco-design-vue/pull/2668))
+
+
 ## 2.50.1
 
 `2023-08-18`

diff --git a/packages/web-vue/components/_components/virtual-list-v2/virtual-list.vue b/packages/web-vue/components/_components/virtual-list-v2/virtual-list.vue
@@ -165,15 +165,6 @@ export default defineComponent({
       buffer,
     });
 
-    const shouldScroll = ref(true);
-    const scrollData = reactive({
-      scrollTop: 0,
-      scrollHeight: 0,
-    });
-    // 数据发生修改
-    watch(dataKeys, () => {
-      shouldScroll.value = false;
-    });
     const currentList = computed(() => {
       if (props.threshold && data.value.length <= props.threshold) {
         return data.value;
@@ -185,27 +176,17 @@ export default defineComponent({
     const onScroll = (ev: Event) => {
       const { scrollTop, scrollHeight, offsetHeight } =
         ev.target as HTMLElement;
-      if (shouldScroll.value) {
-        scrollData.scrollTop = scrollTop;
-        scrollData.scrollHeight = scrollHeight;
-        const _start = getStartByScroll(scrollTop);
-        if (_start !== start.value) {
-          setStart(_start);
-        }
-        emit('scroll', ev);
-        const bottom = Math.floor(scrollHeight - (scrollTop + offsetHeight));
-        if (bottom <= 0) {
-          emit('reachBottom', ev);
-        }
-      } else {
-        // 数据发生修改完成 (是否采用MutationObserver)
-        if (scrollHeight !== scrollData.scrollHeight) {
-          shouldScroll.value = true;
-          setTimeout(() => {
-            scrollTo(scrollData.scrollTop);
-          }, 10);
-        }
-        scrollTo(scrollData.scrollTop);
+      const _start = getStartByScroll(scrollTop);
+      if (_start !== start.value) {
+        setStart(_start);
+        nextTick(() => {
+          scrollTo(scrollTop);
+        });
+      }
+      emit('scroll', ev);
+      const bottom = Math.floor(scrollHeight - (scrollTop + offsetHeight));
+      if (bottom <= 0) {
+        emit('reachBottom', ev);
       }
     };
 

diff --git a/packages/web-vue/components/cascader/CHANGELOG.md b/packages/web-vue/components/cascader/CHANGELOG.md
@@ -2,6 +2,15 @@
 changelog: true
 ```
 
+## 2.51.1
+
+`2023-09-08`
+
+### 🐛 BugFix
+
+- fix empty state in Cascader Virtual list ([#2686](https://github.com/arco-design/arco-design-vue/pull/2686))
+
+
 ## 2.49.0
 
 `2023-07-21`

diff --git a/packages/web-vue/components/cascader/CHANGELOG.zh-CN.md b/packages/web-vue/components/cascader/CHANGELOG.zh-CN.md
@@ -2,6 +2,15 @@
 changelog: true
 ```
 
+## 2.51.1
+
+`2023-09-08`
+
+### 🐛 问题修复
+
+- 修复开启虚拟列表时空状态不显示 ([#2686](https://github.com/arco-design/arco-design-vue/pull/2686))
+
+
 ## 2.49.0
 
 `2023-07-21`

diff --git a/packages/web-vue/components/cascader/cascader-column.tsx b/packages/web-vue/components/cascader/cascader-column.tsx
@@ -53,7 +53,11 @@ export default defineComponent({
           class={`${prefixCls}-panel-column`}
           style={{ zIndex: props.totalLevel - props.level }}
         >
-          {isVirtual.value ? (
+          {props.column.length === 0 ? (
+            <Scrollbar class={`${prefixCls}-column-content`}>
+              <div class={`${prefixCls}-list-empty`}>{renderEmpty()}</div>
+            </Scrollbar>
+          ) : isVirtual.value ? (
             <VirtualList
               key={props.column?.length}
               {...props.virtualListProps}
@@ -78,37 +82,33 @@ export default defineComponent({
             />
           ) : (
             <Scrollbar class={`${prefixCls}-column-content`}>
-              {props.column.length === 0 ? (
-                <div class={`${prefixCls}-list-empty`}>{renderEmpty()}</div>
-              ) : (
-                <ul
-                  role="menu"
-                  class={[
-                    `${prefixCls}-list`,
-                    {
-                      [`${prefixCls}-list-multiple`]: Boolean(props?.multiple),
-                      [`${prefixCls}-list-strictly`]: Boolean(
-                        props?.checkStrictly
-                      ),
-                    },
-                  ]}
-                >
-                  {props.column.map((item) => {
-                    return (
-                      <CascaderOption
-                        key={item.key}
-                        option={item}
-                        active={
-                          props.selectedPath.includes(item.key) ||
-                          item.key === props.activeKey
-                        }
-                        multiple={props.multiple}
-                        checkStrictly={props.checkStrictly}
-                      />
-                    );
-                  })}
-                </ul>
-              )}
+              <ul
+                role="menu"
+                class={[
+                  `${prefixCls}-list`,
+                  {
+                    [`${prefixCls}-list-multiple`]: Boolean(props?.multiple),
+                    [`${prefixCls}-list-strictly`]: Boolean(
+                      props?.checkStrictly
+                    ),
+                  },
+                ]}
+              >
+                {props.column.map((item) => {
+                  return (
+                    <CascaderOption
+                      key={item.key}
+                      option={item}
+                      active={
+                        props.selectedPath.includes(item.key) ||
+                        item.key === props.activeKey
+                      }
+                      multiple={props.multiple}
+                      checkStrictly={props.checkStrictly}
+                    />
+                  );
+                })}
+              </ul>
             </Scrollbar>
           )}
         </div>

diff --git a/packages/web-vue/components/form/CHANGELOG.md b/packages/web-vue/components/form/CHANGELOG.md
@@ -2,6 +2,15 @@
 changelog: true
 ```
 
+## 2.51.0
+
+`2023-09-01`
+
+### 🆕 Feature
+
+- add scroll into view to the field ([#2680](https://github.com/arco-design/arco-design-vue/pull/2680))
+
+
 ## 2.44.2
 
 `2023-03-17`

diff --git a/packages/web-vue/components/form/CHANGELOG.zh-CN.md b/packages/web-vue/components/form/CHANGELOG.zh-CN.md
@@ -2,6 +2,15 @@
 changelog: true
 ```
 
+## 2.51.0
+
+`2023-09-01`
+
+### 🆕 新增功能
+
+- 新增滚动到指定表单字段 ([#2680](https://github.com/arco-design/arco-design-vue/pull/2680))
+
+
 ## 2.44.2
 
 `2023-03-17`

diff --git a/packages/web-vue/components/form/README.en-US.md b/packages/web-vue/components/form/README.en-US.md
@@ -32,6 +32,8 @@ description: A form with data collection, verification and submission functions,
 
 @import ./__demo__/custom.md
 
+@import ./__demo__/scroll.md
+
 ## API
 
 
@@ -48,6 +50,7 @@ description: A form with data collection, verification and submission functions,
 |disabled|Whether to disable the form|`boolean`|`-`||
 |rules|Form item validation rules|`Record<string, FieldRule \| FieldRule[]>`|`-`||
 |auto-label-width|Whether to enable automatic label width, it only takes effect under `layout="horizontal"`.|`boolean`|`false`|2.13.0|
+|scroll-to-first-error|Scroll to the first error field after verification fails|`boolean`|`false`|2.51.0|
 ### `<form>` Events
 
 |Event Name|Description|Parameters|
@@ -57,13 +60,14 @@ description: A form with data collection, verification and submission functions,
 |submit-failed|Triggered when verification failed|data: `{values: Record<string, any>; errors: Record<string, ValidatedError>}`<br>ev: `Event`|
 ### `<form>` Methods
 
-|Method|Description|Parameters|Return|
-|---|---|---|:---:|
-|validate|Verify all form data|callback: `(errors: undefined \| Record<string, ValidatedError>) => void`|Promise<undefined \| Record<string, ValidatedError>>|
-|validateField|Validate part of the form data|field: `string \| string[]`<br>callback: `(errors: undefined \| Record<string, ValidatedError>) => void`|Promise<undefined \| Record<string, ValidatedError>>|
-|resetFields|Reset form data|field: `string \| string[]`|-|
-|clearValidate|Clear verification status|field: `string \| string[]`|-|
-|setFields|Set the value and status of the form item|data: `Record<string, FieldData>`|-|
+|Method|Description|Parameters|Return|version|
+|---|---|---|:---:|:---|
+|validate|Verify all form data|callback: `(errors: undefined \| Record<string, ValidatedError>) => void`|Promise<undefined \| Record<string, ValidatedError>>||
+|validateField|Validate part of the form data|field: `string \| string[]`<br>callback: `(errors: undefined \| Record<string, ValidatedError>) => void`|Promise<undefined \| Record<string, ValidatedError>>||
+|resetFields|Reset form data|field: `string \| string[]`|-||
+|clearValidate|Clear verification status|field: `string \| string[]`|-||
+|setFields|Set the value and status of the form item|data: `Record<string, FieldData>`|-||
+|scrollToField|Scroll to the specified form item|field: `string`|-|2.51.0|
 
 
 

diff --git a/packages/web-vue/components/form/README.zh-CN.md b/packages/web-vue/components/form/README.zh-CN.md
@@ -30,6 +30,8 @@ description: 具有数据收集、校验和提交功能的表单，包含复选
 
 @import ./__demo__/custom.md
 
+@import ./__demo__/scroll.md
+
 ## API
 
 
@@ -46,6 +48,8 @@ description: 具有数据收集、校验和提交功能的表单，包含复选
 |disabled|是否禁用表单|`boolean`|`-`||
 |rules|表单项校验规则|`Record<string, FieldRule \| FieldRule[]>`|`-`||
 |auto-label-width|是否开启自动标签宽度，仅在 `layout="horizontal"` 下生效。|`boolean`|`false`|2.13.0|
+|id|表单控件 `id` 的前缀|`string`|`-`||
+|scroll-to-first-error|验证失败后滚动到第一个错误字段|`boolean`|`false`|2.51.0|
 ### `<form>` Events
 
 |事件名|描述|参数|
@@ -55,13 +59,14 @@ description: 具有数据收集、校验和提交功能的表单，包含复选
 |submit-failed|验证失败时触发|data: `{values: Record<string, any>; errors: Record<string, ValidatedError>}`<br>ev: `Event`|
 ### `<form>` Methods
 
-|方法名|描述|参数|返回值|
-|---|---|---|---|
-|validate|校验全部表单数据|callback: `(errors: undefined \| Record<string, ValidatedError>) => void`|Promise<undefined \| Record<string, ValidatedError>>|
-|validateField|校验部分表单数据|field: `string \| string[]`<br>callback: `(errors: undefined \| Record<string, ValidatedError>) => void`|Promise<undefined \| Record<string, ValidatedError>>|
-|resetFields|重置表单数据|field: `string \| string[]`|-|
-|clearValidate|清除校验状态|field: `string \| string[]`|-|
-|setFields|设置表单项的值和状态|data: `Record<string, FieldData>`|-|
+|方法名|描述|参数|返回值|版本|
+|---|---|---|---|:---|
+|validate|校验全部表单数据|callback: `(errors: undefined \| Record<string, ValidatedError>) => void`|Promise<undefined \| Record<string, ValidatedError>>||
+|validateField|校验部分表单数据|field: `string \| string[]`<br>callback: `(errors: undefined \| Record<string, ValidatedError>) => void`|Promise<undefined \| Record<string, ValidatedError>>||
+|resetFields|重置表单数据|field: `string \| string[]`|-||
+|clearValidate|清除校验状态|field: `string \| string[]`|-||
+|setFields|设置表单项的值和状态|data: `Record<string, FieldData>`|-||
+|scrollToField|滚动到指定表单项|field: `string`|-|2.51.0|
 
 
 

diff --git a/packages/web-vue/components/form/TEMPLATE.md b/packages/web-vue/components/form/TEMPLATE.md
@@ -41,6 +41,8 @@ description: A form with data collection, verification and submission functions,
 
 @import ./__demo__/custom.md
 
+@import ./__demo__/scroll.md
+
 ## API
 
 %%API(form.vue)%%