From 15dfbe63e93d3f117fec2781ea12de3226114d67 Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Thu, 26 Jun 2025 10:04:35 +0800
Subject: [PATCH] feat:用户管理样式调整
---
src/styles/base.scss | 44 +++++++++++++++++++++-
src/views/system/user.vue | 31 ++++++++-------
2 files changed, 59 insertions(+), 16 deletions(-)
diff --git a/src/styles/base.scss b/src/styles/base.scss
index 05cae89..98f1396 100644
--- a/src/styles/base.scss
+++ b/src/styles/base.scss
@@ -34,6 +34,14 @@
flex: 7;
}
+.manage-flex-8 {
+ flex: 8;
+}
+
+.manage-flex-9 {
+ flex: 9;
+}
+
.manage-w-0 {
width: 0;
}
@@ -50,10 +58,42 @@
height: 100%;
}
+.manage-m-all-10 {
+ margin: 10px;
+}
+
.manage-p-all-10 {
- padding: 10px;
+ padding: 10px;
+}
+
+.manage-p-all-16 {
+ padding: 16px;
+}
+
+.manage-p-all-20 {
+ padding: 20px;
}
.manage-p-t-0 {
- padding-top: 0;
+ padding-top: 0;
+}
+
+.manage-p-b-0 {
+ padding-bottom: 0;
+}
+
+.manage-b-c-w {
+ background-color: white;
+}
+
+.manage-b-r-5 {
+ border-radius: 5px;
+}
+
+.manage-overflow-h {
+ overflow: hidden;
+}
+
+.manage-box-s-b-b {
+ box-sizing: border-box;
}
\ No newline at end of file
diff --git a/src/views/system/user.vue b/src/views/system/user.vue
index e805178..89fbc7f 100644
--- a/src/views/system/user.vue
+++ b/src/views/system/user.vue
@@ -1,17 +1,19 @@
<template>
<div class="manage-p-all-10 manage-p-t-0 manage-h-0 manage-flex-1 manage-flex">
- <div class="manage-flex-2 manage-h-100">
- <div class="box">
+ <div
+ class="manage-p-all-20 manage-flex-2 manage-h-100 manage-b-r-5 manage-box-s-b-b manage-overflow-h manage-b-c-w">
+ <div class="box ">
<el-scrollbar>
- <basic-container>
+ <div class="manage-w-100 manage-h-100">
<avue-tree :option="treeOption" :data="treeData" @node-click="nodeClick" />
- </basic-container>
+ </div>
</el-scrollbar>
</div>
</div>
- <div class="manage-flex-6 manage-h-100 manage-flex manage-f-d-c">
- <basic-container>
+ <div
+ class="manage-p-all-10 manage-p-t-0 manage-p-b-0 manage-flex-9 manage-h-100 manage-flex manage-box-s-b-b manage-f-d-c">
+ <div class="manage-p-all-20 manage-h-100 manage-box-s-b-b manage-b-c-w manage-b-r-5">
<avue-crud :option="option" v-model:search="search" :table-loading="loading" :data="data" ref="crud"
v-model="form" :permission="permissionList" @row-del="rowDel" @row-update="rowUpdate" @row-save="rowSave"
:before-open="beforeOpen" v-model:page="page" @search-change="searchChange" @search-reset="searchReset"
@@ -104,7 +106,7 @@
</template>
</avue-crud>
</el-dialog>
- </basic-container>
+ </div>
</div>
</div>
</template>
@@ -223,8 +225,6 @@
},
},
option: {
- // height: 'auto',
- // calcHeight: 140,
tip: false,
searchShow: true,
searchMenuSpan: 6,
@@ -235,6 +235,9 @@
viewBtn: true,
dialogType: 'drawer',
dialogClickModal: false,
+
+ height: 'auto',
+ calcHeight: 0,
column: [
{
label: '登录账号',
@@ -1165,16 +1168,16 @@
}
</script>
-<style lang="scss">
+<style lang="scss" scoped>
.box {
height: 100%;
}
-.el-scrollbar {
+::v-deep(.el-scrollbar) {
height: 100%;
-}
-.box .el-scrollbar__wrap {
- overflow: scroll;
+ .el-scrollbar__wrap {
+ overflow: auto;
+ }
}
</style>
--
Gitblit v1.9.3