wuxueyu
/
Industrial-image-management-system---web
1
0
Fork 2
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化审批台的搜索框看不清的问题

This commit is contained in:
Mr.j 2025-08-07 17:38:41 +08:00
parent e83579dc57
commit d6f87cd0db
2 changed files with 79 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
src/views/system-resource/device-management/approval/components/ApprovalSearch.vue
View File

@ -195,6 +195,14 @@ watch(() => props.loading, (newVal) => {
<style scoped lang="scss">
.approval-search-container {
// 确保搜索区域有良好的背景对比度
background: #ffffff;
padding: 20px;
border-radius: 8px;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
margin-bottom: 16px;
border: 1px solid #e8e8e8;
.search-form {
.arco-form-item {
margin-bottom: 0;
@ -211,6 +219,61 @@ watch(() => props.loading, (newVal) => {
.arco-select,
.arco-picker {
border-radius: 4px;
// 确保输入框文字颜色清晰可见
.arco-input-inner {
color: #333 !important;
font-weight: 500;
}
// 确保占位符文字颜色清晰
.arco-input-inner::placeholder {
color: #666 !important;
font-weight: 400;
}
// 确保选择框文字颜色清晰
.arco-select-view-input {
color: #333 !important;
font-weight: 500;
}
// 确保选择框占位符颜色清晰
.arco-select-view-placeholder {
color: #666 !important;
font-weight: 400;
}
// 确保日期选择器文字颜色清晰
.arco-picker-input {
color: #333 !important;
font-weight: 500;
}
// 确保日期选择器占位符颜色清晰
.arco-picker-input::placeholder {
color: #666 !important;
font-weight: 400;
}
// 确保所有输入框在聚焦时有更好的对比度
&:focus-within {
.arco-input-inner,
.arco-select-view-input,
.arco-picker-input {
color: #000 !important;
font-weight: 600;
}
}
// 确保输入框在悬停时有更好的对比度
&:hover {
.arco-input-inner,
.arco-select-view-input,
.arco-picker-input {
color: #000 !important;
}
}
}
.arco-btn {

16
src/views/system-resource/device-management/approval/index.vue
View File

@ -781,6 +781,22 @@ onMounted(() => {
color: var(--color-text-4);
font-style: italic;
}
// 确保搜索区域有良好的对比度
.approval-search-container {
background: #ffffff;
padding: 16px;
border-radius: 8px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
margin-bottom: 16px;
.search-form {
.arco-form-item-label {
color: #333 !important;
font-weight: 600;
}
}
}
}
// 响应式设计