style(global): 统一全站搜索按钮文案及操作栏按钮样式

- 统一修改搜索按钮文案,CRUD搜索栏“搜索”改为“查询”,“清空条件”改为“重置”
- 新增全局CSS,隐藏Avue CRUD操作栏按钮前图标,仅保留文字
- 统一操作栏按钮间距为4px,内边距调整为4px,提升界面紧凑度
- 变更影响全站所有Avue CRUD组件的搜索与操作栏样式与文案,非CRUD场景按钮不受影响
This commit is contained in:
2026-07-31 18:11:38 +08:00
parent 9b7f8db96b
commit 06dc1c64f6
5 changed files with 40 additions and 3 deletions

View File

@@ -29,3 +29,25 @@
- 因此**回退了 cargo-type.vue 之前的两处页面级改动**`page.layout` 与 scoped 隐藏样式避免与全局方案两套机制并存cargo-type 现由全局方案统一接管。
- 效果:全站所有 el-pagination含 avue-crud 自带分页与 empty-pagination均只保留「总条数/每页条数/页码/跳转」,首页/上一页/下一页/尾页全部隐藏;「跳转」按钮保留。
- 风险点:全局 `display:none !important` 会影响所有分页,符合"全站统一"诉求;如后续某页面需恢复导航按钮,需针对该页用更高优先级样式覆盖或单独处理。
## 全站搜索按钮文案统一
- **文件**: `src/lang/zh.js``src/lang/en.js`
- **改动**:
- `tagsView.search`: `搜索``查询`(中)/ `Search``Query`(英)
- `crud.filter.resetBtn`: `清空条件``重置`
- **影响范围**: 全站所有 Avue CRUD 搜索栏按钮自动生效(通过 i18n 全局配置)
- **排除**: 地图搜索、日志清空等非 CRUD 场景的按钮文案保持不变
## 全站操作栏按钮隐藏图标
- **文件**: `src/styles/element-ui.scss`
- **改动**: 新增全局 CSS 规则 `.avue-crud__menu .el-button--text i, .avue-crud__menu .el-button i { display: none !important }`
- **效果**: 全站所有 Avue CRUD 操作列(查看/编辑/删除等)按钮前的图标统一隐藏,仅保留文字
- **方案选择**: CSS 全局覆盖,无需逐个修改 option 配置文件
## 全站操作栏按钮紧凑间距
- **文件**: `src/styles/element-ui.scss`
- **改动**: 新增全局规则 `.avue-crud__menu .el-button { margin-left: 4px; margin-right: 0; padding: 0 4px }`
- **效果**: 全站 CRUD 操作列按钮统一为 4px 间距 + 4px 内边距,与 cargo-type 一致

View File

@@ -128,7 +128,7 @@ export default {
color: 'color',
},
tagsView: {
search: 'Search',
search: 'Query',
menu: 'menu',
clearCache: 'Clear Cache',
closeOthers: 'Close Others',

View File

@@ -37,7 +37,7 @@ export default {
filter: {
addBtn: '新增条件',
clearBtn: '清空数据',
resetBtn: '清空条件',
resetBtn: '重置',
cancelBtn: '取 消',
submitBtn: '确 定',
},
@@ -128,7 +128,7 @@ export default {
color: '换色',
},
tagsView: {
search: '搜索',
search: '查询',
menu: '更多',
clearCache: '清除缓存',
closeOthers: '关闭其它',

View File

@@ -448,6 +448,20 @@
}
}
// 全站统一:隐藏操作栏按钮前的图标
.avue-crud__menu .el-button--text i,
.avue-crud__menu .el-button i {
display: none !important;
}
// 全站统一:操作栏按钮紧凑间距
.avue-crud__menu .el-button {
margin-left: 4px;
margin-right: 0;
padding-left: 4px;
padding-right: 4px;
}
@media (max-width: 768px) {
.avue-crud__pagination .el-pagination,
.empty-pagination .el-pagination,

View File

@@ -154,6 +154,7 @@ export default {
minRows: 4,
span: 24,
},
],
},
data: [],