fix(order): 修复移动端iOS Safari修改结账弹窗操作栏被截断及滚动卡死问题

- 架构重构:将修改结账、拒绝结账、发起争议弹窗的操作提交按钮从滚动体抽出,移入固定吸底的 popup-footer,保证任何情况下按钮始终完整可见、随手可点
- 视口适配:弹窗采用 85dvh 动态视口高度,配合 flex 列布局与 overflow: hidden,并在吸底栏集成 safe-area-inset-bottom,解决 iOS Safari 底部浮动地址栏遮挡
- 滚动解耦:弹窗内部 popup-body 独立滚动并开启 -webkit-overflow-scrolling 和 overscroll-behavior: contain,消除 WebKit 双层滚动容器死锁与橡皮筋卡死
- 防缩放优化:弹窗内全量输入框与 textarea 统一声明 16px 字体,杜绝 iOS Safari 聚焦时触发的强制页面缩放畸变
- 验证通过:运行全站门禁 ./scripts/check.sh(Go测试、MySQL测试、ESLint、Vue-TSC、Vite生产构建)全部通过
This commit is contained in:
yml2213
2026-10-10 17:58:09 +08:00
parent 5b2f36ac36
commit c9f6820882
2 changed files with 43 additions and 9 deletions
@@ -601,6 +601,8 @@ async function copyListingCode() {
<span>上传新证据截图:</span>
<input type="file" accept="image/*" @change="handleCounterEvidenceUpload" />
</div>
</div>
<footer class="popup-footer">
<van-button
type="warning"
block
@@ -612,7 +614,7 @@ async function copyListingCode() {
>
提交给对方确认
</van-button>
</div>
</footer>
</van-popup>
<!-- POPUP: Renter Reject Counter Proposal Reason -->
@@ -634,6 +636,8 @@ async function copyListingCode() {
placeholder="请详细叙述拒绝号主扣款的理由,这些信息将被客服作为判定依据"
class="popup-field"
/>
</div>
<footer class="popup-footer">
<van-button
type="danger"
block
@@ -645,7 +649,7 @@ async function copyListingCode() {
>
提交原因并提起争议
</van-button>
</div>
</footer>
</van-popup>
<!-- POPUP: Create Generic Order Dispute -->
@@ -690,6 +694,8 @@ async function copyListingCode() {
<span>上传证据截图:</span>
<input type="file" accept="image/*" @change="handleEvidenceUpload" />
</div>
</div>
<footer class="popup-footer">
<van-button
type="warning"
block
@@ -701,7 +707,7 @@ async function copyListingCode() {
>
提交申诉客服仲裁
</van-button>
</div>
</footer>
</van-popup>
</main>
</template>