feat:用户管理样式调整

shuishen

2025-06-26 15dfbe63e93d3f117fec2781ea12de3226114d67

feat:用户管理样式调整

 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;
}

 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>