From 6803810f0045b0698164c09b63fb088c2c430332 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=BE=99=E8=BF=90=E6=A8=A1?= <1724894114@qq.com>
Date: Wed, 9 Oct 2024 20:06:33 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=8E=88=E6=9D=83=E5=B1=95?=
 =?UTF-8?q?=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/setting/company/add-permission.vue | 57 +++++++++++---------
 src/views/setting/user/view-permission.vue   | 55 ++++++++++---------
 2 files changed, 62 insertions(+), 50 deletions(-)

diff --git a/src/views/setting/company/add-permission.vue b/src/views/setting/company/add-permission.vue
index 39789a1..fc06b8c 100644
--- a/src/views/setting/company/add-permission.vue
+++ b/src/views/setting/company/add-permission.vue
@@ -6,31 +6,33 @@
 			</div>
 			<div class="right-panel"><div class="companyName">{{name}}</div></div>
 		</el-header>
-		<el-main class="nopadding">
-			<div class="treeTable">
-				<div :class="list.length===0?'thenTitle thenTitleBottom':'thenTitle'">
-					<div class="tr">
-						<div class="th module">功能模块</div>
-						<div class="th check"><el-checkbox :indeterminate="isCheckFun" @change="allCheckChange" v-model="checkedFun" :size="size" /></div>
-						<div class="th thFlex">
-							<div class="menu name">菜单</div>
-							<div class="th authority">数据操作权限</div>
+		<el-main class="nopadding" v-loading="loading" element-loading-text="加载中...">
+			<el-scrollbar>
+				<div class="treeTable">
+					<div :class="list.length===0?'thenTitle thenTitleBottom':'thenTitle'">
+						<div class="tr">
+							<div class="th module">功能模块</div>
+							<div class="th check"><el-checkbox :indeterminate="isCheckFun" @change="allCheckChange" v-model="checkedFun" :size="size" /></div>
+							<div class="th thFlex">
+								<div class="menu name">菜单</div>
+								<div class="th authority">数据操作权限</div>
+							</div>
 						</div>
 					</div>
-				</div>
-				<div class="tableBody">
-					<div class="tr" v-for="(item,index) in list" :key="index">
-						<div class="td module">{{item.meta.title}}</div>
-						<div class="td check"><el-checkbox v-model="item.checked" :indeterminate="item.isCheck" @change="menuCheckChange(item)" :size="size" /></div>
-						<div class="td tdChild">
-							<div class="nextTd" v-for="(em,ind) in item.children" :key="ind">
-								<div class="tdName menu">
-									<el-checkbox @change="moduleCheckChange(item,em)" :indeterminate="em.isCheck" v-model="em.checked" :size="size">{{em.meta.title}}</el-checkbox>
-								</div>
-								<div class="tdName authority">
-									<div class="childTr">
-										<div class="preBox" v-for="(li,lidex) in em.meta.data_permission" :key="lidex">
-											<el-checkbox @change="checkChange(item,em)" v-model="li.checked" :size="size">{{li.title}}</el-checkbox>
+					<div class="tableBody">
+						<div class="tr" v-for="(item,index) in list" :key="index">
+							<div class="td module">{{item.meta.title}}</div>
+							<div class="td check"><el-checkbox v-model="item.checked" :indeterminate="item.isCheck" @change="menuCheckChange(item)" :size="size" /></div>
+							<div class="td tdChild">
+								<div class="nextTd" v-for="(em,ind) in item.children" :key="ind">
+									<div class="tdName menu">
+										<el-checkbox @change="moduleCheckChange(item,em)" :indeterminate="em.isCheck" v-model="em.checked" :size="size">{{em.meta.title}}</el-checkbox>
+									</div>
+									<div class="tdName authority">
+										<div class="childTr">
+											<div class="preBox" v-for="(li,lidex) in em.meta.data_permission" :key="lidex">
+												<el-checkbox @change="checkChange(item,em)" v-model="li.checked" :size="size">{{li.title}}</el-checkbox>
+											</div>
 										</div>
 									</div>
 								</div>
@@ -38,7 +40,7 @@
 						</div>
 					</div>
 				</div>
-			</div>
+			</el-scrollbar>
 		</el-main>
 	</el-container>
 </template>
@@ -51,7 +53,8 @@ export default {
 			size:'small',
 			id: this.$route.query.id,
 			name:this.$route.query.name,
-			list:[]
+			list:[],
+			loading:false
 		}
 	},
 	computed:{
@@ -81,7 +84,9 @@ export default {
 			let params = {
 				company_id:this.id
 			}
+			this.loading = true;
 			const res = await this.$API.system.company.permission.post(params);
+			this.loading = false;
 			res.data.forEach(item=>{
 				if(item.children){
 					item.children.forEach(em=>{
@@ -333,6 +338,8 @@ export default {
 		.tdName{
 			padding: 0 10px;
 			min-height: 33px;
+			display: flex;
+			align-items: center;
 		}
 		.childTr{
 			display: flex;
diff --git a/src/views/setting/user/view-permission.vue b/src/views/setting/user/view-permission.vue
index 9065588..de1f9c9 100644
--- a/src/views/setting/user/view-permission.vue
+++ b/src/views/setting/user/view-permission.vue
@@ -13,31 +13,33 @@
 				<el-alert title="个人用户权限不可编辑，需要编辑请到到角色编辑对应的权限" type="warning" :closable="false" />
 			</div>
 		</el-header>
-		<el-main class="nopadding">
-			<div class="treeTable">
-				<div :class="list.length===0?'thenTitle thenTitleBottom':'thenTitle'">
-					<div class="tr">
-						<div class="th module">功能模块</div>
-						<div class="th check"><el-checkbox :indeterminate="isCheckFun" @change="allCheckChange" :disabled="showPermission" v-model="checkedFun" :size="size" /></div>
-						<div class="th thFlex">
-							<div class="menu name">菜单</div>
-							<div class="th authority">数据操作权限</div>
+		<el-main class="nopadding" v-loading="loading" element-loading-text="加载中...">
+			<el-scrollbar>
+				<div class="treeTable">
+					<div :class="list.length===0?'thenTitle thenTitleBottom':'thenTitle'">
+						<div class="tr">
+							<div class="th module">功能模块</div>
+							<div class="th check"><el-checkbox :indeterminate="isCheckFun" @change="allCheckChange" :disabled="showPermission" v-model="checkedFun" :size="size" /></div>
+							<div class="th thFlex">
+								<div class="menu name">菜单</div>
+								<div class="th authority">数据操作权限</div>
+							</div>
 						</div>
 					</div>
-				</div>
-				<div class="tableBody">
-					<div class="tr" v-for="(item,index) in list" :key="index">
-						<div class="td module">{{item.meta.title}}</div>
-						<div class="td check"><el-checkbox v-model="item.checked" :indeterminate="item.isCheck" @change="menuCheckChange(item)" :disabled="showPermission" :size="size" /></div>
-						<div class="td tdChild">
-							<div class="nextTd" v-for="(em,ind) in item.children" :key="ind">
-								<div class="tdName menu">
-									<el-checkbox @change="moduleCheckChange(item,em)" :indeterminate="em.isCheck" v-model="em.checked" :disabled="showPermission" :size="size">{{em.meta.title}}</el-checkbox>
-								</div>
-								<div class="tdName authority">
-									<div class="childTr">
-										<div class="preBox" v-for="(li,lidex) in em.meta.data_permission" :key="lidex">
-											<el-checkbox @change="checkChange(item,em,li)" v-model="li.checked" :disabled="showPermission" :size="size">{{li.title}}</el-checkbox>
+					<div class="tableBody">
+						<div class="tr" v-for="(item,index) in list" :key="index">
+							<div class="td module">{{item.meta.title}}</div>
+							<div class="td check"><el-checkbox v-model="item.checked" :indeterminate="item.isCheck" @change="menuCheckChange(item)" :disabled="showPermission" :size="size" /></div>
+							<div class="td tdChild">
+								<div class="nextTd" v-for="(em,ind) in item.children" :key="ind">
+									<div class="tdName menu">
+										<el-checkbox @change="moduleCheckChange(item,em)" :indeterminate="em.isCheck" v-model="em.checked" :disabled="showPermission" :size="size">{{em.meta.title}}</el-checkbox>
+									</div>
+									<div class="tdName authority">
+										<div class="childTr">
+											<div class="preBox" v-for="(li,lidex) in em.meta.data_permission" :key="lidex">
+												<el-checkbox @change="checkChange(item,em,li)" v-model="li.checked" :disabled="showPermission" :size="size">{{li.title}}</el-checkbox>
+											</div>
 										</div>
 									</div>
 								</div>
@@ -45,7 +47,7 @@
 						</div>
 					</div>
 				</div>
-			</div>
+			</el-scrollbar>
 		</el-main>
 	</el-container>
 </template>
@@ -60,7 +62,8 @@ export default {
 			name:this.$route.query.name,
 			user_roles:[],
 			list:[],
-			showPermission:false
+			showPermission:false,
+			loading:false,
 		}
 	},
 	computed:{
@@ -90,7 +93,9 @@ export default {
 			let params = {
 				user_id:this.id
 			}
+			this.loading = true;
 			const res = await this.$API.system.user.userPermission.post(params);
+			this.loading = false;
 			this.user_roles = res.data && res.data.role?res.data.role:[];
 			if(res.data && res.data.menu && res.data.menu.length>0){
 				res.data.menu.forEach(item=>{