fix(payment): 售后弹窗滚动容器改用 no-scrollbar,消除弹窗边缘滚动栏
mini-scrollbar 是 3px 可见细滚动条(举报弹窗 600px 宽弹窗用的写法); modal-mini 这类带炫彩横幅的表单弹窗,主题统一走禁封申诉/记录弹窗的口径: scroll-y + no-scrollbar 完全隐藏滚动条(含细滚动条)+ 50vh 内层滚动。 申请与售后详细两个滚动容器一并切换,滚动行为不变、只是不再露出滚动栏。
This commit is contained in:
@@ -115,7 +115,8 @@
|
|||||||
var html = '<div class="aksrt-after-sale-apply-modal">';
|
var html = '<div class="aksrt-after-sale-apply-modal">';
|
||||||
html += colorfulHeader('申请售后', 'fa-undo-alt');
|
html += colorfulHeader('申请售后', 'fa-undo-alt');
|
||||||
html += '<form class="aksrt-after-sale-form" data-aksrt-after-sale-order="' + escapeHtml((order && order.order_number) || '') + '" novalidate>';
|
html += '<form class="aksrt-after-sale-form" data-aksrt-after-sale-order="' + escapeHtml((order && order.order_number) || '') + '" novalidate>';
|
||||||
html += '<div class="scroll-y mini-scrollbar max-vh5">';
|
// 滚动容器与禁封申诉弹窗一致:no-scrollbar 完全隐藏滚动条(含细滚动条)+ 50vh 内层滚动。
|
||||||
|
html += '<div class="scroll-y no-scrollbar max-vh5">';
|
||||||
html += orderSummaryHtml(order);
|
html += orderSummaryHtml(order);
|
||||||
|
|
||||||
if (reasons.length) {
|
if (reasons.length) {
|
||||||
@@ -174,7 +175,7 @@
|
|||||||
|
|
||||||
var html = '<div class="aksrt-after-sale-detail-modal">';
|
var html = '<div class="aksrt-after-sale-detail-modal">';
|
||||||
html += colorfulHeader('售后详细', 'fa-clipboard-list');
|
html += colorfulHeader('售后详细', 'fa-clipboard-list');
|
||||||
html += '<div class="scroll-y mini-scrollbar max-vh5 aksrt-after-sale-detail__body">';
|
html += '<div class="scroll-y no-scrollbar max-vh5 aksrt-after-sale-detail__body">';
|
||||||
html += orderSummaryHtml(order);
|
html += orderSummaryHtml(order);
|
||||||
|
|
||||||
html += '<div class="aksrt-after-sale-detail__statusRow">' +
|
html += '<div class="aksrt-after-sale-detail__statusRow">' +
|
||||||
|
|||||||
@@ -253,6 +253,12 @@ test('frontend after-sale modals are standalone and config-driven', () => {
|
|||||||
assert.match(js, /modal-colorful-header colorful-bg jb-blue/)
|
assert.match(js, /modal-colorful-header colorful-bg jb-blue/)
|
||||||
assert.match(js, /AksrtModalRuntime\.open\(\{/)
|
assert.match(js, /AksrtModalRuntime\.open\(\{/)
|
||||||
|
|
||||||
|
// 滚动容器与禁封申诉弹窗同口径:no-scrollbar 完全隐藏滚动条(含细滚动条),
|
||||||
|
// 避免 modal-mini 弹窗边缘出现可见滚动栏。
|
||||||
|
assert.match(js, /'<div class="scroll-y no-scrollbar max-vh5">'/)
|
||||||
|
assert.match(js, /'<div class="scroll-y no-scrollbar max-vh5 aksrt-after-sale-detail__body">'/)
|
||||||
|
assert.ok(!js.includes('mini-scrollbar'), 'after-sale modals must not render a visible scrollbar')
|
||||||
|
|
||||||
// 申请表单:预置原因徽章、所需资料、必填申请说明(placeholder 取后台配置)
|
// 申请表单:预置原因徽章、所需资料、必填申请说明(placeholder 取后台配置)
|
||||||
assert.match(js, /reasonOptions\(\)/)
|
assert.match(js, /reasonOptions\(\)/)
|
||||||
assert.match(js, /materialOptions\(\)/)
|
assert.match(js, /materialOptions\(\)/)
|
||||||
|
|||||||
Reference in New Issue
Block a user