diff --git a/CHANGELOG.md b/CHANGELOG.md index 3b98a86be552ff648a051704e2985eae3d516aa8..6fc2098947a57f1512b3a7147e2279835c2cfb55 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -36,6 +36,8 @@ - 修复模态、抽屉中多数据、卡片等部件无法垂直滚动 - 修复分页导航上分页时在ios中出现溢出省略异常 - 修复markdown编辑器在ios中光标错位异常 +- 修复多行文本框在ios中右对齐时换行时光标位置异常 +- 修复多数据、卡片视图启用下拉刷新时无法滚动查看数据 ## [0.7.41-alpha.21] - 2025-11-28 diff --git a/src/control/data-view/data-view.scss b/src/control/data-view/data-view.scss index 19b1f4cdeec418611fbfcbb7328ccef8200cc214..0f1f23fca36554e619cd1b53f3502ae5711870b9 100644 --- a/src/control/data-view/data-view.scss +++ b/src/control/data-view/data-view.scss @@ -33,7 +33,7 @@ $control-dataview: ( flex-wrap: wrap; max-height: 100%; gap: getCssVar(control-dataview, spacing-item-gap); - overflow-y: auto; + overflow: getCssVar(control, overflow); padding: getCssVar(control-dataview, spacing-padding); .van-list__loading,.van-list__finished-text,.van-list__error-text { diff --git a/src/control/list/md-ctrl/md-ctrl.scss b/src/control/list/md-ctrl/md-ctrl.scss index 190bad73d4ffbe0fa873826dffdbc1ffb47e11a1..bacc7ffe3cc289f47125c08fff7de60af454d104 100644 --- a/src/control/list/md-ctrl/md-ctrl.scss +++ b/src/control/list/md-ctrl/md-ctrl.scss @@ -31,7 +31,7 @@ $control-mobmdctrl: ( @include e(content) { width: 100%; height: 100%; - overflow-y: auto; + overflow: getCssVar(control, overflow); @include when(show-under-line) { .van-hairline--bottom:after { diff --git a/src/editor/text-box/input/input.tsx b/src/editor/text-box/input/input.tsx index b402c6b516d29b6856e41c5ab089fc736d77fed8..959ed8c84261daccacbc69425adc6228b670d3e7 100644 --- a/src/editor/text-box/input/input.tsx +++ b/src/editor/text-box/input/input.tsx @@ -1,4 +1,11 @@ -import { computed, defineComponent, ref, watch } from 'vue'; +import { + computed, + defineComponent, + nextTick, + onMounted, + ref, + watch, +} from 'vue'; import { debounce } from 'lodash-es'; import { base64ToStr, isEmoji } from '@ibiz-template/core'; import { @@ -8,6 +15,7 @@ import { useFilterAttribute, } from '@ibiz-template/vue3-util'; import './input.scss'; +import { getPlatformType, PlatformType } from '@ibiz-template/runtime'; import { TextBoxEditorController } from '../text-box-editor.controller'; /** @@ -33,6 +41,12 @@ export const IBizInput = defineComponent({ // 是否显示密码 const showPassword = ref(false); + // 搭载平台类型 + const platformType = getPlatformType(); + + // 文本对齐 + const textAlign = ref('left'); + // 是否显示切换明文、暗文密码图标 let enableshowpwd = false; @@ -65,6 +79,14 @@ export const IBizInput = defineComponent({ } }); + const getTextAlign = () => { + if (inputRef.value) { + const computedStyle = getComputedStyle(inputRef.value.$el); + return computedStyle.textAlign; + } + return 'left'; + }; + const currentVal = ref(''); watch( @@ -83,6 +105,12 @@ export const IBizInput = defineComponent({ { immediate: true }, ); + onMounted(() => { + if (inputRef.value) { + textAlign.value = getTextAlign(); + } + }); + let isDebounce = false; let awaitSearch: () => void; let blurCacheValue: string | undefined; @@ -102,15 +130,43 @@ export const IBizInput = defineComponent({ 300, { leading: true }, ); + + // 修复ios中文本域换行后光标错位问题,需手动添加空格 + const fixCursorPosition = () => { + // 只有右对齐才处理 + if ( + type.value === 'textarea' && + platformType === PlatformType.IOS && + textAlign.value === 'right' + ) { + const textarea = inputRef.value.$el.querySelector('textarea'); + if (textarea) { + const val = `${currentVal.value} `; + emit('change', val); + nextTick(() => { + textarea.setSelectionRange(val.length + 1, val.length + 1); + }); + } + } + }; // 值变更 const handleChange = (evt: IData) => { - const val = evt.target.value; + let val = evt.target.value; + // 兼容ios中文本域换行后光标错位问题 + if ( + type.value === 'textarea' && + textAlign.value === 'right' && + platformType === PlatformType.IOS + ) { + val = val.replace(/([\r\n]+)\s/, '$1'); + } isDebounce = true; debounceChange(val); }; const handleKeyUp = (e: KeyboardEvent) => { if (e && e.code === 'Enter') { + fixCursorPosition(); if (isDebounce) { awaitSearch = () => { inputRef.value.$el.dispatchEvent(e); diff --git a/src/panel-component/view-content-panel-container/view-content-panel-container.scss b/src/panel-component/view-content-panel-container/view-content-panel-container.scss index 50696acd6ea2013d9d18e62dbecc234041c6d603..7697352a79c4742853e30166b07d619ec2b52f65 100644 --- a/src/panel-component/view-content-panel-container/view-content-panel-container.scss +++ b/src/panel-component/view-content-panel-container/view-content-panel-container.scss @@ -38,6 +38,10 @@ $control: ( @include when(scroll) { overflow-y: auto; #{getCssVarName(control, overflow)}: unset unset; + + .#{bem(col)} { + flex: none; + } } @include when(embed) { diff --git a/src/panel-component/view-content-panel-container/view-content-panel-container.tsx b/src/panel-component/view-content-panel-container/view-content-panel-container.tsx index f12e56ee312a4b5c4bbbd36fa6fad440e3dbaead..5394f01b335945372f52d4cefe98b04a305851a5 100644 --- a/src/panel-component/view-content-panel-container/view-content-panel-container.tsx +++ b/src/panel-component/view-content-panel-container/view-content-panel-container.tsx @@ -36,6 +36,7 @@ export const ViewContentPanelContainer: Component = defineComponent({ const ns = useNamespace('view-content'); const isRefreshing = ref(false); + const refreshDisabled = ref(false); const ctx = useMobCtx(); const { view } = ctx; @@ -106,6 +107,13 @@ export const ViewContentPanelContainer: Component = defineComponent({ return false; }); + const onScroll = () => { + // 只要离开顶部就禁用下拉 + if (contentRef.value) { + refreshDisabled.value = contentRef.value.$el.scrollTop > 0; + } + }; + return { ns, viewModel, @@ -114,7 +122,9 @@ export const ViewContentPanelContainer: Component = defineComponent({ classArr, contentRef, showBackTop, + refreshDisabled, refresh, + onScroll, }; }, render() { @@ -125,6 +135,7 @@ export const ViewContentPanelContainer: Component = defineComponent({ class={this.classArr} layout={this.modelData.layout} ref='contentRef' + onScroll={this.onScroll} > {this.contentRef && this.showBackTop && ( @@ -134,11 +145,16 @@ export const ViewContentPanelContainer: Component = defineComponent({ if (!props || !props.controller) { return slot; } + const { layoutPos } = props.modelData; + if (this.viewModel.enablePullDownRefresh === true) { + Object.assign(layoutPos, { + heightMode: 'AUTO', + grow: 0, + basis: 0, + }); + } return ( - + {slot} ); @@ -150,6 +166,7 @@ export const ViewContentPanelContainer: Component = defineComponent({ {content}