diff --git a/CHANGELOG.md b/CHANGELOG.md index 5fe1b2983d70d0672bef2f8829eb22449e3da893..4706a4a54913c4baca31dcade22bd7b13386100c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -63,6 +63,9 @@ ### Change +- 更新数组编辑器的样式 +- 更新搜索栏样式 +- 更新高级搜索表单样式 - 更新搜索栏和搜索表单样式 - 更新标题栏样式,更新链接按钮样式,更新搜索栏高级搜索打开时,底部不自动弹出添加抽屉 - 移除搜索表单保存条件UI相关代码 diff --git a/src/common/md-advaned-searchform/md-advaned-searchform.scss b/src/common/md-advaned-searchform/md-advaned-searchform.scss index 7c952eaa951d31ec5194abc1336aa15d79ceaf58..883a7eaa1d4f544774374be85a92bf2cbb7d8258 100644 --- a/src/common/md-advaned-searchform/md-advaned-searchform.scss +++ b/src/common/md-advaned-searchform/md-advaned-searchform.scss @@ -10,7 +10,7 @@ $md-advaned-searchform: ( footer-reset-color: getCssVar(color, text), footer-reset-bg-color: transparent, footer-confirm-color: getCssVar(color, default), - footer-confirm-bg-color: getCssVar(color, primary) + footer-confirm-bg-color: getCssVar(color, primary), ); @include b('md-advaned-searchform') { @include set-component-css-var( @@ -25,44 +25,18 @@ $md-advaned-searchform: ( flex: 1; overflow: auto; padding: getCssVar(md-advaned-searchform, content-padding); + + &.#{bem(control-searchform)} { + background-color: getCssVar(control-search-form-bg-color); + } } @include e('footer') { - flex-shrink: 0; + flex: none; + padding: getCssVar(spacing, base); display: flex; - gap: getCssVar(md-advaned-searchform, footer-item-gap); - padding: getCssVar(md-advaned-searchform, footer-padding); - @include m('reset') { - flex: 1; - padding: getCssVar(md-advaned-searchform, footer-item-padding); - box-shadow: getCssVar(md-advaned-searchform, footer-item-shadow); - background-color: getCssVar( - md-advaned-searchform, - footer-reset-bg-color - ); - color: getCssVar(md-advaned-searchform, text-color); - width: 100%; - text-align: center; - border-radius: getCssVar( - md-advaned-searchform, - footer-item-border-radius - ); - } - @include m('confirm') { - flex: 1; - padding: getCssVar(md-advaned-searchform, footer-item-padding); - box-shadow: getCssVar(md-advaned-searchform, footer-item-shadow); - background-color: getCssVar( - md-advaned-searchform, - footer-confirm-bg-color - ); - color: getCssVar(md-advaned-searchform, footer-confirm-color); - width: 100%; - text-align: center; - opacity: 0.9; - border-radius: getCssVar( - md-advaned-searchform, - footer-item-border-radius - ); + justify-content: space-between; + .van-button { + width: 48%; } } } diff --git a/src/common/md-advaned-searchform/md-advaned-searchform.tsx b/src/common/md-advaned-searchform/md-advaned-searchform.tsx index 698f38d323f4897ac649f66c38c34f4b0791017c..1aca22103b41e854295d9ccf9250b8d6228d3242 100644 --- a/src/common/md-advaned-searchform/md-advaned-searchform.tsx +++ b/src/common/md-advaned-searchform/md-advaned-searchform.tsx @@ -73,18 +73,16 @@ export const IBizMdAdvanedSearchfrom = defineComponent({ controller={this.c!} >
-
this.onCancel()} - > + {ibiz.i18n.t('control.form.searchForm.reset')} -
-
this.onConfirm()} + + {ibiz.i18n.t('control.form.searchForm.search')} -
+
); diff --git a/src/control/form/form-detail/form-item/form-item-container/form-item-container.scss b/src/control/form/form-detail/form-item/form-item-container/form-item-container.scss index 57fd712ebf10ead1cc8c0527d2d5cf6901c48d80..e71bf737c20e72153c1408582f0120ff3d93d58c 100644 --- a/src/control/form/form-detail/form-item/form-item-container/form-item-container.scss +++ b/src/control/form/form-detail/form-item/form-item-container/form-item-container.scss @@ -2,7 +2,7 @@ $form-item-container: ( // 颜色 require-mark-color: getCssVar(color, danger), - bg-color: getCssVar(color, bg, 1), + bg-color: getCssVar(color, bg, 2), label-text-color: getCssVar(color, text, 0), underline-color: getCssVar(color, border), diff --git a/src/control/search-bar/search-bar.scss b/src/control/search-bar/search-bar.scss index 4ca9fbabdab7d97af83fabd13e3d5a10dc9e2a96..5465dffa5d2edb256f4c2a72c0ee6d9a6fac3a64 100644 --- a/src/control/search-bar/search-bar.scss +++ b/src/control/search-bar/search-bar.scss @@ -121,7 +121,7 @@ $dropdown-popover: ( @include set-component-css-var(dropdown-popover, $dropdown-popover); background-color: getCssVar(dropdown-popover, color-popover-bg); flex-direction: column; - position: absolute; + position: fixed; left: 0; gap: 8px; width: 100vw; diff --git a/src/editor/array/ibiz-array/ibiz-array.scss b/src/editor/array/ibiz-array/ibiz-array.scss index 3471731587f33751cf4e92a6c9752b236adccc8e..a5d1b1eebf69109cfd2a46d547c5273af8dd827a 100644 --- a/src/editor/array/ibiz-array/ibiz-array.scss +++ b/src/editor/array/ibiz-array/ibiz-array.scss @@ -16,6 +16,8 @@ $array: ( // 高度 min-height: getCssVar(editor, default, line-height), + spacing-icons-gap: getCssVar(spacing, tight), + spacing-icons-margin-left: getCssVar(spacing,base), ); @include b(array) { @@ -25,7 +27,9 @@ $array: ( font-size: getCssVar(array, font-size); line-height: getCssVar(array, line-height); color: getCssVar(array, color); - text-align: getCssVar(array, text-align); + display: flex; + align-items: end; + flex-direction: column; --van-field-input-text-color: #{getCssVar(array, color)}; --van-cell-text-color: #{getCssVar(array, color)}; @@ -57,6 +61,10 @@ $array: ( } } +@include b('array-item'){ + width: 100%; +} + @include b(array-add-icon) { display: flex; align-items: center; @@ -67,4 +75,6 @@ $array: ( display: flex; align-items: center; min-height: getCssVar(array, min-height); + margin-left: getCssVar(array, spacing-icons-margin-left); + gap: getCssVar(array, spacing-icons-gap); } diff --git a/src/editor/array/ibiz-array/ibiz-array.tsx b/src/editor/array/ibiz-array/ibiz-array.tsx index 07bba54bf2458f8288cbca5310207ce5cd9cd381..59885850d51ec59834dd459d0e0fc46dbc067825 100644 --- a/src/editor/array/ibiz-array/ibiz-array.tsx +++ b/src/editor/array/ibiz-array/ibiz-array.tsx @@ -195,23 +195,31 @@ export const IBizArray = defineComponent({ onFocus={this.onFocus} onInput={(): void => this.handleInput()} {...useFilterAttribute(this.$attrs)} - > - {!(this.disabled || this.readonly) && ( -
- {(!this.limit || this.items.length < this.limit) && ( - this.addItem(index + 1)} - /> - )} - this.removeItem(index)} - /> -
- )} + > + {{ + extra: () => { + if (!(this.disabled || this.readonly)) { + return ( +
+ {(!this.limit || + this.items.length < this.limit) && ( + this.addItem(index + 1)} + /> + )} + this.removeItem(index)} + /> +
+ ); + } + }, + }} + ); }) diff --git a/src/panel-component/setting-container/setting-container.scss b/src/panel-component/setting-container/setting-container.scss index 7f9a246aa6bc9ec79619e9776456cc257e1a7853..c1a560243363c57945e1485e532369702df84dc2 100644 --- a/src/panel-component/setting-container/setting-container.scss +++ b/src/panel-component/setting-container/setting-container.scss @@ -9,7 +9,7 @@ $setting-container: ( @include b('setting-container') { @include set-component-css-var('setting-container', $setting-container); - + height: 100%; padding: getCssVar('setting-container', 'padding'); background-color: getCssVar('setting-container', 'bg-color');