修复楼层多层切换状态同步

This commit is contained in:
lyf
2026-07-01 15:57:53 +08:00
parent cf37e7a40e
commit c43aa00038

View File

@@ -126,15 +126,11 @@
<text class="layer-mode-label">{{ layerModeActionLabel }}</text>
</view>
<scroll-view
<view
v-if="showIndoorRightControls && showFloor"
class="floor-switcher"
:class="`side-${floorSide}`"
:style="floorSwitcherStyle"
scroll-y
:show-scrollbar="false"
:scroll-into-view="activeFloorScrollIntoView"
:scroll-with-animation="true"
>
<view
v-if="showFloorHeader"
@@ -143,24 +139,33 @@
@tap.stop="handleFloorHeaderTap"
>
<text class="floor-header-icon"></text>
<text class="floor-header-label">楼层</text>
<text class="floor-header-label">{{ layerModeActionLabel }}</text>
</view>
<view
v-for="floor in floorItems"
:id="floor.scrollId"
:key="floor.id"
class="floor-item"
:class="{
active: activeFloorId === floor.id && layerMode !== 'multi',
pending: loadingFloorId === floor.id,
failed: failedFloorId === floor.id,
disabled: isFloorSwitchDisabled(floor.id)
}"
@tap.stop="handleFloorChange(floor)"
<scroll-view
class="floor-list"
:style="floorListStyle"
scroll-y
:show-scrollbar="false"
:scroll-into-view="activeFloorScrollIntoView"
:scroll-with-animation="true"
>
<text class="floor-label">{{ floor.label }}</text>
</view>
</scroll-view>
<view
v-for="floor in floorItems"
:id="floor.scrollId"
:key="floor.id"
class="floor-item"
:class="{
active: activeFloorId === floor.id,
pending: loadingFloorId === floor.id,
failed: failedFloorId === floor.id,
disabled: isFloorSwitchDisabled(floor.id)
}"
@tap.stop="handleFloorChange(floor)"
>
<text class="floor-label">{{ floor.label }}</text>
</view>
</scroll-view>
</view>
<view v-if="showZoomControls" class="zoom-controls" :style="zoomControlsStyle">
<view class="zoom-btn" @tap="handleZoomClick('in')">
@@ -506,8 +511,13 @@ const searchFieldStyle = computed(() => ({
}))
const floorSwitcherStyle = computed(() => ({
...(props.floorBottom ? { bottom: props.floorBottom } : { top: props.floorTop }),
...(props.floorMaxHeight ? { maxHeight: props.floorMaxHeight } : {})
...(props.floorBottom ? { bottom: props.floorBottom } : { top: props.floorTop })
}))
const floorListStyle = computed(() => ({
...(props.floorMaxHeight
? { maxHeight: props.showFloorHeader ? `calc(${props.floorMaxHeight} - 50px)` : props.floorMaxHeight }
: {})
}))
const layerModeToggleStyle = computed(() => ({
@@ -682,7 +692,7 @@ const handleLayerModeToggle = () => {
}
const handleFloorHeaderTap = () => {
handleLayerModeChange('multi')
handleLayerModeChange(props.layerMode === 'multi' ? 'single' : 'multi')
}
const handleToolClick = (tool: string) => {
@@ -1064,13 +1074,9 @@ defineExpose({
position: absolute;
width: 46px;
height: auto;
max-height: calc(100vh - 260px);
padding: 1px;
box-sizing: border-box;
overflow-y: auto;
overscroll-behavior: contain;
-webkit-overflow-scrolling: touch;
touch-action: pan-y;
overflow: hidden;
scrollbar-width: none;
background: rgba(255, 255, 255, 0.84);
border: 1px solid #dde5df;
@@ -1083,6 +1089,19 @@ defineExpose({
display: none;
}
.floor-list {
max-height: calc(100vh - 310px);
overflow-y: auto;
overscroll-behavior: contain;
-webkit-overflow-scrolling: touch;
touch-action: pan-y;
scrollbar-width: none;
}
.floor-list::-webkit-scrollbar {
display: none;
}
.floor-switcher.side-right {
right: 16px;
}
@@ -1092,9 +1111,7 @@ defineExpose({
}
.floor-header {
position: sticky;
top: 0;
z-index: 1;
position: relative;
min-height: 50px;
padding: 7px 4px 6px;
display: flex;