style(global): 统一全站搜索按钮文案及操作栏按钮样式
- 统一修改搜索按钮文案,CRUD搜索栏“搜索”改为“查询”,“清空条件”改为“重置” - 新增全局CSS,隐藏Avue CRUD操作栏按钮前图标,仅保留文字 - 统一操作栏按钮间距为4px,内边距调整为4px,提升界面紧凑度 - 变更影响全站所有Avue CRUD组件的搜索与操作栏样式与文案,非CRUD场景按钮不受影响
This commit is contained in:
@@ -29,3 +29,25 @@
|
|||||||
- 因此**回退了 cargo-type.vue 之前的两处页面级改动**(`page.layout` 与 scoped 隐藏样式),避免与全局方案两套机制并存;cargo-type 现由全局方案统一接管。
|
- 因此**回退了 cargo-type.vue 之前的两处页面级改动**(`page.layout` 与 scoped 隐藏样式),避免与全局方案两套机制并存;cargo-type 现由全局方案统一接管。
|
||||||
- 效果:全站所有 el-pagination(含 avue-crud 自带分页与 empty-pagination)均只保留「总条数/每页条数/页码/跳转」,首页/上一页/下一页/尾页全部隐藏;「跳转」按钮保留。
|
- 效果:全站所有 el-pagination(含 avue-crud 自带分页与 empty-pagination)均只保留「总条数/每页条数/页码/跳转」,首页/上一页/下一页/尾页全部隐藏;「跳转」按钮保留。
|
||||||
- 风险点:全局 `display:none !important` 会影响所有分页,符合"全站统一"诉求;如后续某页面需恢复导航按钮,需针对该页用更高优先级样式覆盖或单独处理。
|
- 风险点:全局 `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 一致
|
||||||
|
|||||||
@@ -128,7 +128,7 @@ export default {
|
|||||||
color: 'color',
|
color: 'color',
|
||||||
},
|
},
|
||||||
tagsView: {
|
tagsView: {
|
||||||
search: 'Search',
|
search: 'Query',
|
||||||
menu: 'menu',
|
menu: 'menu',
|
||||||
clearCache: 'Clear Cache',
|
clearCache: 'Clear Cache',
|
||||||
closeOthers: 'Close Others',
|
closeOthers: 'Close Others',
|
||||||
|
|||||||
@@ -37,7 +37,7 @@ export default {
|
|||||||
filter: {
|
filter: {
|
||||||
addBtn: '新增条件',
|
addBtn: '新增条件',
|
||||||
clearBtn: '清空数据',
|
clearBtn: '清空数据',
|
||||||
resetBtn: '清空条件',
|
resetBtn: '重置',
|
||||||
cancelBtn: '取 消',
|
cancelBtn: '取 消',
|
||||||
submitBtn: '确 定',
|
submitBtn: '确 定',
|
||||||
},
|
},
|
||||||
@@ -128,7 +128,7 @@ export default {
|
|||||||
color: '换色',
|
color: '换色',
|
||||||
},
|
},
|
||||||
tagsView: {
|
tagsView: {
|
||||||
search: '搜索',
|
search: '查询',
|
||||||
menu: '更多',
|
menu: '更多',
|
||||||
clearCache: '清除缓存',
|
clearCache: '清除缓存',
|
||||||
closeOthers: '关闭其它',
|
closeOthers: '关闭其它',
|
||||||
|
|||||||
@@ -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) {
|
@media (max-width: 768px) {
|
||||||
.avue-crud__pagination .el-pagination,
|
.avue-crud__pagination .el-pagination,
|
||||||
.empty-pagination .el-pagination,
|
.empty-pagination .el-pagination,
|
||||||
|
|||||||
@@ -154,6 +154,7 @@ export default {
|
|||||||
minRows: 4,
|
minRows: 4,
|
||||||
span: 24,
|
span: 24,
|
||||||
},
|
},
|
||||||
|
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
data: [],
|
data: [],
|
||||||
|
|||||||
Reference in New Issue
Block a user