REVIEW 用户管理（调整布局）

src/views/system/tenantPackage/TenantPackageForm.vue

@@ -91,7 +91,7 @@ const formRules = reactive({
 const formRef = ref() // 表单 Ref
 const formRef = ref() // 表单 Ref
 const menuOptions = ref<any[]>([]) // 树形结构数据
 const menuOptions = ref<any[]>([]) // 树形结构数据
 const menuExpand = ref(false) // 展开/折叠
 const menuExpand = ref(false) // 展开/折叠
-const treeRef = ref<ElTree>() // 树组件 Ref
+const treeRef = ref<InstanceType<typeof ElTree>>() // 树组件 Ref
 const treeNodeAll = ref(false) // 全选/全不选
 const treeNodeAll = ref(false) // 全选/全不选
 
 
 /** 打开弹窗 */
 /** 打开弹窗 */

src/views/system/user/index.vue

 <template>
 <template>
-  <div class="app-container">
-    <content-wrap>
   <!-- 搜索工作栏 -->
   <!-- 搜索工作栏 -->
   <el-row :gutter="20">
   <el-row :gutter="20">
     <!--部门数据-->
     <!--部门数据-->
     <el-col :span="4" :xs="24">
     <el-col :span="4" :xs="24">
+      <content-wrap class="h-1/1">
         <UserDeptTree @node-click="handleDeptNodeClick" />
         <UserDeptTree @node-click="handleDeptNodeClick" />
+      </content-wrap>
     </el-col>
     </el-col>
     <!--用户数据-->
     <!--用户数据-->
     <el-col :span="20" :xs="24">
     <el-col :span="20" :xs="24">
+      <content-wrap>
         <el-form
         <el-form
           :model="queryParams"
           :model="queryParams"
           ref="queryFormRef"
           ref="queryFormRef"
@@ -43,9 +44,9 @@
             >
             >
               <el-option
               <el-option
                 v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)"
                 v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)"
-                  :key="dict.value as number"
+                :key="dict.value"
                 :label="dict.label"
                 :label="dict.label"
-                  :value="dict.value as number"
+                :value="dict.value"
               />
               />
             </el-select>
             </el-select>
           </el-form-item>
           </el-form-item>
@@ -61,44 +62,32 @@
             />
             />
           </el-form-item>
           </el-form-item>
           <el-form-item>
           <el-form-item>
-              <el-button type="primary" @click="handleQuery"
-                ><Icon icon="ep:search" />搜索</el-button
-              >
+            <el-button type="primary" @click="handleQuery"><Icon icon="ep:search" />搜索</el-button>
             <el-button @click="resetQuery"><Icon icon="ep:refresh" />重置</el-button>
             <el-button @click="resetQuery"><Icon icon="ep:refresh" />重置</el-button>
-            </el-form-item>
-          </el-form>
-
-          <el-row :gutter="10" class="mb-8px">
-            <el-col :span="1.5">
-              <el-button
-                type="primary"
-                plain
-                size="small"
-                @click="handleAdd"
-                v-hasPermi="['system:user:create']"
-                ><Icon icon="ep:plus" />新增</el-button
-              >
-            </el-col>
-            <el-col :span="1.5">
+            <el-button type="primary" plain @click="handleAdd" v-hasPermi="['system:user:create']">
+              <Icon icon="ep:plus" /> 新增
+            </el-button>
             <el-button
             <el-button
               type="info"
               type="info"
               size="small"
               size="small"
               @click="handleImport"
               @click="handleImport"
               v-hasPermi="['system:user:import']"
               v-hasPermi="['system:user:import']"
-                ><Icon icon="ep:upload" />导入</el-button
             >
             >
-            </el-col>
-            <el-col :span="1.5">
+              <Icon icon="ep:upload" /> 导入
+            </el-button>
             <el-button
             <el-button
               type="warning"
               type="warning"
               size="small"
               size="small"
               @click="handleExport"
               @click="handleExport"
               :loading="exportLoading"
               :loading="exportLoading"
               v-hasPermi="['system:user:export']"
               v-hasPermi="['system:user:export']"
-                ><Icon icon="ep:download" />导出</el-button
             >
             >
-            </el-col>
-          </el-row>
+              <Icon icon="ep:download" />导出
+            </el-button>
+          </el-form-item>
+        </el-form>
+      </content-wrap>
+      <content-wrap>
         <el-table v-loading="loading" :data="userList">
         <el-table v-loading="loading" :data="userList">
           <el-table-column
           <el-table-column
             label="用户编号"
             label="用户编号"
@@ -216,16 +205,16 @@
           v-model:limit="queryParams.pageSize"
           v-model:limit="queryParams.pageSize"
           @pagination="getList"
           @pagination="getList"
         />
         />
+      </content-wrap>
     </el-col>
     </el-col>
   </el-row>
   </el-row>
-    </content-wrap>
+
   <!-- 添加或修改用户对话框 -->
   <!-- 添加或修改用户对话框 -->
   <UserForm ref="userFormRef" @success="getList" />
   <UserForm ref="userFormRef" @success="getList" />
   <!-- 用户导入对话框 -->
   <!-- 用户导入对话框 -->
   <UserImportForm ref="userImportFormRef" @success="getList" />
   <UserImportForm ref="userImportFormRef" @success="getList" />
   <!-- 分配角色 -->
   <!-- 分配角色 -->
   <UserAssignRoleForm ref="userAssignRoleFormRef" @success="getList" />
   <UserAssignRoleForm ref="userAssignRoleFormRef" @success="getList" />
-  </div>
 </template>
 </template>
 
 
 <script setup lang="ts" name="User">
 <script setup lang="ts" name="User">
@@ -280,7 +269,8 @@ const columns = ref([
   { key: 5, label: `状态`, visible: true },
   { key: 5, label: `状态`, visible: true },
   { key: 6, label: `创建时间`, visible: true }
   { key: 6, label: `创建时间`, visible: true }
 ])
 ])
-/* 查询列表 */
+
+/** 查询列表 */
 const getList = () => {
 const getList = () => {
   loading.value = true
   loading.value = true
   getUserPageApi(queryParams).then((response) => {
   getUserPageApi(queryParams).then((response) => {
@@ -289,6 +279,7 @@ const getList = () => {
     loading.value = false
     loading.value = false
   })
   })
 }
 }
+
 /** 搜索按钮操作 */
 /** 搜索按钮操作 */
 const handleQuery = () => {
 const handleQuery = () => {
   queryParams.pageNo = 1
   queryParams.pageNo = 1