pengyuthon/gzth
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

!8239 mobile

Browse Source 
Merge pull request !8239 from 李鹏宇/dev
This commit is contained in:
李鹏宇
2026-01-23 04:53:23 +00:00
committed by Gitee
parent f2e36555b3 596f941bd8
commit ea56f9673c
2 changed files with 178 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
k_ry_mobile_form/static/src/js/status_bar_buttons.js
+96 -13
View File
@@ -42,10 +42,28 @@ patch(StatusBarButtons, {
container.style.setProperty('left', '0', 'important');
container.style.setProperty('right', '0', 'important');
container.style.setProperty('z-index', '9999', 'important');
// 确保背景色可见
if (!container.style.backgroundColor) {
container.style.setProperty('background-color', '#ffffff', 'important');
}
// 强制设置背景色可见
container.style.setProperty('background-color', '#ffffff', 'important');
container.style.setProperty('background', '#ffffff', 'important');
container.style.setProperty('min-height', '60px', 'important');
container.style.setProperty('width', '100%', 'important');
// 同时修复容器内的按钮
const buttons = container.querySelectorAll('button, a.btn, .btn, a[role="button"], .o_statusbar_buttons > * > button, .o_statusbar_buttons > * > a');
buttons.forEach(button => {
button.style.setProperty('visibility', 'visible', 'important');
button.style.setProperty('opacity', '1', 'important');
button.style.setProperty('display', 'inline-block', 'important');
button.style.setProperty('font-size', '14px', 'important');
// 如果按钮没有可见的背景色，强制设置
const computedStyle = getComputedStyle(button);
const bgColor = computedStyle.backgroundColor;
if (bgColor === 'transparent' || bgColor === 'rgba(0, 0, 0, 0)' ||
(bgColor === 'rgb(255, 255, 255)' && computedStyle.color === 'rgb(255, 255, 255)')) {
button.style.setProperty('background-color', '#007bff', 'important');
button.style.setProperty('color', '#ffffff', 'important');
}
});
});
// 隐藏桌面端按钮
@@ -92,14 +110,15 @@ if (typeof window !== 'undefined' && typeof document !== 'undefined') {
container.style.setProperty('left', '0', 'important');
container.style.setProperty('right', '0', 'important');
container.style.setProperty('z-index', '9999', 'important');
// 确保背景色可见
if (!container.style.backgroundColor || container.style.backgroundColor === 'transparent') {
container.style.setProperty('background-color', '#ffffff', 'important');
}
// 强制设置背景色可见
container.style.setProperty('background-color', '#ffffff', 'important');
container.style.setProperty('background', '#ffffff', 'important');
container.style.setProperty('min-height', '60px', 'important');
container.style.setProperty('width', '100%', 'important');
}
// 修复按钮的交互性
const buttons = container.querySelectorAll('button, a.btn, .btn, a[role="button"], .o_statusbar_buttons > * > button');
// 修复按钮的交互性和可见性
const buttons = container.querySelectorAll('button, a.btn, .btn, a[role="button"], .o_statusbar_buttons > * > button, .o_statusbar_buttons > * > a');
buttons.forEach(button => {
// 使用 setProperty 强制设置样式
button.style.setProperty('pointer-events', 'auto', 'important');
@@ -108,9 +127,73 @@ if (typeof window !== 'undefined' && typeof document !== 'undefined') {
button.style.setProperty('visibility', 'visible', 'important');
button.style.setProperty('opacity', '1', 'important');
button.style.setProperty('display', 'inline-block', 'important');
// 确保按钮有最小高度
if (!button.style.minHeight) {
button.style.setProperty('min-height', '44px', 'important');
// 确保按钮有最小高度和宽度
button.style.setProperty('min-height', '44px', 'important');
button.style.setProperty('min-width', '60px', 'important');
// 强制设置字体大小，确保文字可见
button.style.setProperty('font-size', '14px', 'important');
button.style.setProperty('font-weight', '500', 'important');
button.style.setProperty('line-height', '1.5', 'important');
// 强制设置内边距
button.style.setProperty('padding', '8px 16px', 'important');
// 确保文字对齐
button.style.setProperty('text-align', 'center', 'important');
button.style.setProperty('text-decoration', 'none', 'important');
// 检查按钮是否有背景色和文字颜色
const computedStyle = getComputedStyle(button);
const bgColor = computedStyle.backgroundColor;
const textColor = computedStyle.color;
// 如果背景色是透明或白色，且文字颜色也是白色或透明，强制设置颜色
const isTransparent = bgColor === 'transparent' || bgColor === 'rgba(0, 0, 0, 0)';
const isWhiteBg = bgColor === 'rgb(255, 255, 255)' || bgColor === '#ffffff' || bgColor === '#fff';
const isWhiteText = textColor === 'rgb(255, 255, 255)' || textColor === '#ffffff' || textColor === '#fff';
const isTransparentText = textColor === 'transparent' || textColor === 'rgba(0, 0, 0, 0)';
// 如果按钮不可见（白色背景+白色文字，或透明背景），强制设置颜色
if (isTransparent || (isWhiteBg && (isWhiteText || isTransparentText))) {
// 根据按钮类型设置颜色
const hasPrimary = button.classList.contains('btn-primary') || button.classList.contains('o_statusbar_status');
const hasSecondary = button.classList.contains('btn-secondary');
const hasSuccess = button.classList.contains('btn-success');
const hasDanger = button.classList.contains('btn-danger');
const hasWarning = button.classList.contains('btn-warning');
const hasInfo = button.classList.contains('btn-info');
if (hasPrimary || hasSuccess) {
button.style.setProperty('background-color', '#007bff', 'important');
button.style.setProperty('color', '#ffffff', 'important');
button.style.setProperty('border-color', '#0056b3', 'important');
} else if (hasSecondary) {
button.style.setProperty('background-color', '#6c757d', 'important');
button.style.setProperty('color', '#ffffff', 'important');
button.style.setProperty('border-color', '#545b62', 'important');
} else if (hasDanger) {
button.style.setProperty('background-color', '#dc3545', 'important');
button.style.setProperty('color', '#ffffff', 'important');
button.style.setProperty('border-color', '#c82333', 'important');
} else if (hasWarning) {
button.style.setProperty('background-color', '#ffc107', 'important');
button.style.setProperty('color', '#212529', 'important');
button.style.setProperty('border-color', '#e0a800', 'important');
} else if (hasInfo) {
button.style.setProperty('background-color', '#17a2b8', 'important');
button.style.setProperty('color', '#ffffff', 'important');
button.style.setProperty('border-color', '#117a8b', 'important');
} else {
// 默认蓝色按钮
button.style.setProperty('background-color', '#007bff', 'important');
button.style.setProperty('color', '#ffffff', 'important');
button.style.setProperty('border-color', '#0056b3', 'important');
}
// 确保有边框
if (!computedStyle.border || computedStyle.border === '0px none rgb(0, 0, 0)') {
button.style.setProperty('border', '1px solid', 'important');
}
// 确保有圆角
button.style.setProperty('border-radius', '4px', 'important');
}
});
});
k_ry_mobile_form/static/src/scss/status_bar_buttons.scss
+82 -7
View File
@@ -8,10 +8,11 @@ html body .o_statusbar_buttons_mobile_fixed {
left: 0 !important;
right: 0 !important;
z-index: 9999 !important; // 提高z-index，确保在最上层
background-color: $o-view-background-color !important;
background: $o-view-background-color !important; // 双重保险
border-top: 1px solid $border-color !important;
box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
// 强制设置背景色，确保容器可见
background-color: #ffffff !important;
background: #ffffff !important;
border-top: 1px solid #dee2e6 !important;
box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.15) !important;
padding: map-get($spacers, 2) map-get($spacers, 3) !important;
// 为底部悬浮栏预留空间，避免内容被遮挡（支持 iOS safe area）
padding-bottom: calc(#{map-get($spacers, 2)} + env(safe-area-inset-bottom, 0px)) !important;
@@ -29,6 +30,11 @@ html body .o_statusbar_buttons_mobile_fixed {
overflow: visible !important;
clip: auto !important;
clip-path: none !important;
// 确保容器有最小高度
min-height: 60px !important;
// 确保容器宽度
width: 100% !important;
max-width: 100% !important;
}
.o_statusbar_buttons {
@@ -62,6 +68,7 @@ html body .o_statusbar_buttons_mobile_fixed {
text-overflow: ellipsis !important;
// 确保按钮有足够的点击区域
min-height: 44px !important;
height: auto !important;
// iOS Safari 修复：确保按钮可点击
cursor: pointer !important;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0.1) !important;
@@ -82,9 +89,77 @@ html body .o_statusbar_buttons_mobile_fixed {
display: inline-block !important;
visibility: visible !important;
opacity: 1 !important;
// 确保按钮背景和文字可见
background-color: inherit !important;
color: inherit !important;
// 强制设置按钮颜色和背景，确保可见性
background-color: #007bff !important;
background: #007bff !important;
color: #ffffff !important;
// 确保文字大小可见
font-size: 14px !important;
font-weight: 500 !important;
line-height: 1.5 !important;
// 添加边框和圆角，增强可见性
border: 1px solid #0056b3 !important;
border-radius: 4px !important;
// 确保内边距
padding: 8px 16px !important;
// 确保按钮内容可见
text-align: center !important;
text-decoration: none !important;
}
// 特殊处理不同类型的按钮，确保都有可见的样式
> button.btn-primary,
> a.btn-primary,
> .btn-primary {
background-color: #007bff !important;
background: #007bff !important;
color: #ffffff !important;
border-color: #0056b3 !important;
}
> button.btn-secondary,
> a.btn-secondary,
> .btn-secondary {
background-color: #6c757d !important;
background: #6c757d !important;
color: #ffffff !important;
border-color: #545b62 !important;
}
> button.btn-success,
> a.btn-success,
> .btn-success {
background-color: #28a745 !important;
background: #28a745 !important;
color: #ffffff !important;
border-color: #1e7e34 !important;
}
> button.btn-danger,
> a.btn-danger,
> .btn-danger {
background-color: #dc3545 !important;
background: #dc3545 !important;
color: #ffffff !important;
border-color: #c82333 !important;
}
> button.btn-warning,
> a.btn-warning,
> .btn-warning {
background-color: #ffc107 !important;
background: #ffc107 !important;
color: #212529 !important;
border-color: #e0a800 !important;
}
> button.btn-info,
> a.btn-info,
> .btn-info {
background-color: #17a2b8 !important;
background: #17a2b8 !important;
color: #ffffff !important;
border-color: #117a8b !important;
}
}
}