diff --git a/packages/opendesign/src/dialog/style/media.scss b/packages/opendesign/src/dialog/style/media.scss
index 8fc2231447b76625e6c79fca235bebe5f925e26f..1cab5aeb27e4f2315e6923f2c3ca9e202b8ae580 100644
--- a/packages/opendesign/src/dialog/style/media.scss
+++ b/packages/opendesign/src/dialog/style/media.scss
@@ -122,6 +122,7 @@
--dlg-edge-gap: 16px;
--dlg-inner-gap: 12px;
+ --dlg-header-gap: 12px;
}
@include respond-to('pad_h') {
--dlg-width: 50%;
diff --git a/packages/opendesign/src/dialog/style/style.scss b/packages/opendesign/src/dialog/style/style.scss
index 97152bed2a523b340ff1343f3ad7ef6b6e520171..b57340c0cc70a153ce325e72e96d92107b82aa76 100644
--- a/packages/opendesign/src/dialog/style/style.scss
+++ b/packages/opendesign/src/dialog/style/style.scss
@@ -57,7 +57,7 @@
overflow: visible;
min-height: 0;
- .o-scrollbar {
+ > .o-scrollbar {
--scrollbar-y-right: calc(-1 * var(--dlg-edge-gap));
}
}
diff --git a/packages/opendesign/src/input/__demo__/InputAutoWidth.vue b/packages/opendesign/src/input/__demo__/InputAutoWidth.vue
index fc7a9df3975fb948918bde37ba1776d40d3339b0..b05fb2b01e3ea06f1a05ed36f66ca3b8a77030ca 100644
--- a/packages/opendesign/src/input/__demo__/InputAutoWidth.vue
+++ b/packages/opendesign/src/input/__demo__/InputAutoWidth.vue
@@ -21,7 +21,7 @@ const format = (v: string) => {
min-width: 200px:
diff --git a/packages/opendesign/src/input/__demo__/InputBasic.vue b/packages/opendesign/src/input/__demo__/InputBasic.vue
index d857bb079c8febc7b731337df4982cdfb87ed8e4..d0fc49d21f3d57386dc560c0f46e7594d833849d 100644
--- a/packages/opendesign/src/input/__demo__/InputBasic.vue
+++ b/packages/opendesign/src/input/__demo__/InputBasic.vue
@@ -21,9 +21,9 @@ const check = (val: string) => Boolean(Number(val) % 2);
diff --git a/packages/opendesign/src/input/style/style.scss b/packages/opendesign/src/input/style/style.scss
index f7a2eb552f0fdc343f16e9019761e6775f6a1b7e..2b5c5c854c39320013f28095743b2aec0b61df9e 100644
--- a/packages/opendesign/src/input/style/style.scss
+++ b/packages/opendesign/src/input/style/style.scss
@@ -4,3 +4,6 @@
.o-input {
display: inline-flex;
}
+.o-input-wrap {
+ width: 100%;
+}
diff --git a/packages/opendesign/src/scrollbar/OScrollbar.vue b/packages/opendesign/src/scrollbar/OScrollbar.vue
index 5c828a9116af31058163f67c89ea8345b0a735c8..807d34b4a3daa21afd6f62ef7cc4c53a73fb7f40 100644
--- a/packages/opendesign/src/scrollbar/OScrollbar.vue
+++ b/packages/opendesign/src/scrollbar/OScrollbar.vue
@@ -315,6 +315,7 @@ defineExpose({
class="o-scrollbar"
ref="rootRef"
:class="[
+ props.barClass,
`o-scrollbar-${props.size}`,
{
'o-scrollbar-auto-show': props.showType === 'auto',
diff --git a/packages/opendesign/src/scrollbar/types.ts b/packages/opendesign/src/scrollbar/types.ts
index 419340e72e59117a825ada7010c84a545014aec9..b3f825505b0c44196929d00081906899e063b8ac 100644
--- a/packages/opendesign/src/scrollbar/types.ts
+++ b/packages/opendesign/src/scrollbar/types.ts
@@ -50,6 +50,13 @@ export const baseScrollarProps = {
autoUpdateOnScrollSize: {
type: Boolean,
},
+
+ /**
+ * 滚动条尺寸大小
+ */
+ barClass: {
+ type: String,
+ },
};
export type BaseScrollerPropsT = ExtractPropTypes;
diff --git a/packages/opendesign/src/select/OSelect.vue b/packages/opendesign/src/select/OSelect.vue
index 6f58c34234491dfa4e7c51c87d77c8d8c2330b7d..a6a4b1f187a6a20ae67d689ba9cd19b647ecb533 100644
--- a/packages/opendesign/src/select/OSelect.vue
+++ b/packages/opendesign/src/select/OSelect.vue
@@ -363,6 +363,7 @@ const onselectDlgOkClick = () => {
'is-loading': props.loading,
}"
size="small"
+ :scrollbar="false"
@change="onSelectDlgChange"
>
@@ -376,21 +377,23 @@ const onselectDlgOkClick = () => {
{{ t('select.confirm') }}
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
@@ -411,7 +414,7 @@ const onselectDlgOkClick = () => {
:before-hide="props.beforeOptionsHide"
@change="onOptionVisibleChange"
>
-
+
diff --git a/packages/opendesign/src/select/SelectOption.vue b/packages/opendesign/src/select/SelectOption.vue
index 41f295660131d7ce0abd6d5d151801713acd86ad..bb8fdad82313523941dc4a2d8e402b62b69d82df 100644
--- a/packages/opendesign/src/select/SelectOption.vue
+++ b/packages/opendesign/src/select/SelectOption.vue
@@ -4,7 +4,6 @@ import { IconLoading } from '../_utils/icons';
import { OOptionList } from '../option';
import type { SizeT } from '../_utils/types';
import slot from './slot';
-import { BaseScrollerPropsT } from '../scrollbar';
interface OptionPropT {
size?: SizeT;
@@ -12,12 +11,13 @@ interface OptionPropT {
loading?: boolean;
optionTitle?: string;
multiple?: boolean;
- // 是否使用scrollbar
- scrollbar?: boolean | Partial;
}
-const props = withDefaults(defineProps(), {
- scrollbar: true,
-});
+const props = defineProps();
+const scrollbarCfg = {
+ barClass: 'o-select-options-scrollbar',
+ size: 'small',
+ showType: 'hover',
+};
(), {
},
]"
>
-
+
diff --git a/packages/opendesign/src/select/style/style.scss b/packages/opendesign/src/select/style/style.scss
index ada2eceaa2fedf9c309bcfe4b6f378a3cec5aa37..722570920e42579c757569eb5ac2d69f85bc8647 100644
--- a/packages/opendesign/src/select/style/style.scss
+++ b/packages/opendesign/src/select/style/style.scss
@@ -135,9 +135,6 @@
}
}
-.o-select-options {
- overflow: hidden;
-}
.o-select-option-wrap {
max-height: var(--option-list-max-height, var(--option-list-max-height-default));
}
@@ -162,9 +159,12 @@
.o-select-actions {
border-top: 1px solid var(--o-color-control4);
}
+
// <=pad
.o-select-options-dlg {
- padding-bottom: 4px;
+ .o-select-options-scrollbar {
+ --scrollbar-y-right: calc(-1 * var(--dlg-edge-gap));
+ }
}
// 多选
diff --git a/packages/opendesign/src/select/style/var.scss b/packages/opendesign/src/select/style/var.scss
index f30ad438a36fd39ef32913839f26e3113b2eb01c..d57e4c11e96b8b2d0a16af82090fa261754ad6e6 100644
--- a/packages/opendesign/src/select/style/var.scss
+++ b/packages/opendesign/src/select/style/var.scss
@@ -193,4 +193,5 @@
.o-select-dlg {
--dlg-radius: var(--o-radius_control-s);
--dlg-body-padding: 16px 24px;
+ --option-list-padding: 0;
}