优化用户页面

src/modules/base/pages/login/components/captcha.vue

@@ -19,7 +19,7 @@ export default defineComponent({
 		// base64
 		const base64 = ref<string>("");
 
-		// svg1233
+		// svg
 		const svg = ref<string>("");
 
 		function refresh() {

src/modules/base/views/components/dept-tree.vue

@@ -17,8 +17,8 @@
 				</li>
 
 				<li v-show="isDrag" class="no">
-					<el-button type="text" @click="treeOrder(true)">保存</el-button>
-					<el-button type="text" @click="treeOrder(false)">取消</el-button>
+					<el-button type="text" @click="treeOrder(true)" size="small">保存</el-button>
+					<el-button type="text" @click="treeOrder(false)" size="small">取消</el-button>
 				</li>
 			</ul>
 		</div>
@@ -68,7 +68,7 @@ import { deepTree, revDeepTree } from "/@/cool/utils";
 import { isArray } from "lodash";
 import { ContextMenu, useForm } from "@cool-vue/crud";
 import { Refresh, Operation, MoreFilled } from "@element-plus/icons-vue";
-import { useBaseStore } from "/$/base";
+import { useBaseStore, checkPerm } from "/$/base";
 
 export default defineComponent({
 	name: "dept-tree",
@@ -181,7 +181,7 @@ export default defineComponent({
 				],
 				form: e,
 				on: {
-					submit: (data: any, { done, close }: any) => {
+					submit(data, { done, close }) {
 						service.base.sys.department[method]({
 							id: e.id,
 							parentId: e.parentId,
@@ -295,13 +295,13 @@ export default defineComponent({
 			}
 
 			// 权限
-			const prem = service.base.sys.department._permission;
+			const perm = service.base.sys.department.permission;
 
 			ContextMenu.open(e, {
 				list: [
 					{
 						label: "新增",
-						hidden: (n && n.level >= props.level) || !prem.add,
+						hidden: (n && n.level >= props.level) || !checkPerm(perm.add),
 						callback(done) {
 							rowEdit({
 								name: "",
@@ -313,7 +313,7 @@ export default defineComponent({
 					},
 					{
 						label: "编辑",
-						hidden: !prem.update,
+						hidden: !checkPerm(perm.update),
 						callback(done) {
 							rowEdit(d);
 							done();
@@ -321,7 +321,7 @@ export default defineComponent({
 					},
 					{
 						label: "删除",
-						hidden: !d.parentId || !prem.delete,
+						hidden: !d.parentId || !checkPerm(perm.delete),
 						callback(done) {
 							rowDel(d);
 							done();
@@ -329,7 +329,7 @@ export default defineComponent({
 					},
 					{
 						label: "新增成员",
-						hidden: !service.base.sys.user.permission.add,
+						hidden: !checkPerm(perm.add),
 						callback(done) {
 							emit("user-add", d);
 							done();

src/modules/base/views/user.vue

@@ -49,15 +49,17 @@
 							>
 								<!-- 权限 -->
 								<template #column-roleName="{ scope }">
-									<el-tag
-										v-for="(item, index) in scope.row.roleNameList"
-										:key="index"
-										disable-transitions
-										size="small"
-										effect="dark"
-										style="margin: 2px"
-										>{{ item }}</el-tag
-									>
+									<template v-if="scope.row.roleName">
+										<el-tag
+											v-for="(item, index) in scope.row.roleName.split(',')"
+											:key="index"
+											disable-transitions
+											size="small"
+											effect="dark"
+											style="margin: 2px"
+											>{{ item }}</el-tag
+										>
+									</template>
 								</template>
 
 								<!-- 单个转移 -->
@@ -115,22 +117,7 @@ const dept = ref<any[]>([]);
 // cl-crud 配置
 const Crud = useCrud(
 	{
-		service: service.base.sys.user,
-		async onRefresh(params, { next, render }) {
-			const { list } = await next(params);
-
-			render(
-				list.map((e: any) => {
-					if (e.roleName) {
-						e.roleNameList = e.roleName.split(",");
-					}
-
-					e.status = Boolean(e.status);
-
-					return e;
-				})
-			);
-		}
+		service: service.base.sys.user
 	},
 	(app) => {
 		app.refresh();
@@ -175,7 +162,15 @@ const Table = useTable({
 			prop: "roleName",
 			label: "角色",
 			headerAlign: "center",
-			minWidth: 200
+			minWidth: 120
+		},
+		{
+			prop: "status",
+			label: "状态",
+			minWidth: 120,
+			component: {
+				name: "cl-switch"
+			}
 		},
 		{
 			prop: "phone",
@@ -187,23 +182,6 @@ const Table = useTable({
 			label: "备注",
 			minWidth: 150
 		},
-		{
-			prop: "status",
-			label: "状态",
-			minWidth: 120,
-			dict: [
-				{
-					label: "启用",
-					value: 1,
-					type: "success"
-				},
-				{
-					label: "禁用",
-					value: 0,
-					type: "danger"
-				}
-			]
-		},
 		{
 			prop: "createTime",
 			label: "创建时间",
@@ -213,7 +191,7 @@ const Table = useTable({
 		{
 			type: "op",
 			buttons: ["slot-btn", "edit", "delete"],
-			width: 180
+			width: 240
 		}
 	]
 });
@@ -494,6 +472,8 @@ async function toMove(e?: any) {
 			}
 
 			.icon {
+				display: flex;
+				align-items: center;
 				position: absolute;
 				left: 0;
 				top: 0;
@@ -502,7 +482,6 @@ async function toMove(e?: any) {
 				background-color: #fff;
 				height: 40px;
 				width: 80px;
-				line-height: 40px;
 				padding-left: 10px;
 			}
 		}