From 6666ce5526b1ed17f5c3906c94620cad586745a5 Mon Sep 17 00:00:00 2001 From: RuoYi <yzz_ivy@163.com> Date: 星期五, 28 六月 2024 17:01:39 +0800 Subject: [PATCH] 优化代码 --- src/views/system/user/index.vue | 83 ++++++++++++++++++++--------------------- 1 files changed, 41 insertions(+), 42 deletions(-) diff --git a/src/views/system/user/index.vue b/src/views/system/user/index.vue index a9e5bf4..60754e8 100644 --- a/src/views/system/user/index.vue +++ b/src/views/system/user/index.vue @@ -19,6 +19,7 @@ :expand-on-click-node="false" :filter-node-method="filterNode" ref="deptTreeRef" + node-key="id" highlight-current default-expand-all @node-click="handleNodeClick" @@ -153,36 +154,16 @@ <el-table-column label="鎿嶄綔" align="center" width="150" class-name="small-padding fixed-width"> <template #default="scope"> <el-tooltip content="淇敼" placement="top" v-if="scope.row.userId !== 1"> - <el-button - type="text" - icon="Edit" - @click="handleUpdate(scope.row)" - v-hasPermi="['system:user:edit']" - ></el-button> + <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:user:edit']"></el-button> </el-tooltip> <el-tooltip content="鍒犻櫎" placement="top" v-if="scope.row.userId !== 1"> - <el-button - type="text" - icon="Delete" - @click="handleDelete(scope.row)" - v-hasPermi="['system:user:remove']" - ></el-button> + <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:user:remove']"></el-button> </el-tooltip> <el-tooltip content="閲嶇疆瀵嗙爜" placement="top" v-if="scope.row.userId !== 1"> - <el-button - type="text" - icon="Key" - @click="handleResetPwd(scope.row)" - v-hasPermi="['system:user:resetPwd']" - ></el-button> + <el-button link type="primary" icon="Key" @click="handleResetPwd(scope.row)" v-hasPermi="['system:user:resetPwd']"></el-button> </el-tooltip> <el-tooltip content="鍒嗛厤瑙掕壊" placement="top" v-if="scope.row.userId !== 1"> - <el-button - type="text" - icon="CircleCheck" - @click="handleAuthRole(scope.row)" - v-hasPermi="['system:user:edit']" - ></el-button> + <el-button link type="primary" icon="CircleCheck" @click="handleAuthRole(scope.row)" v-hasPermi="['system:user:edit']"></el-button> </el-tooltip> </template> </el-table-column> @@ -350,8 +331,7 @@ <script setup name="User"> import { getToken } from "@/utils/auth"; -import { treeselect } from "@/api/system/dept"; -import { changeUserStatus, listUser, resetUserPwd, delUser, getUser, updateUser, addUser } from "@/api/system/user"; +import { changeUserStatus, listUser, resetUserPwd, delUser, getUser, updateUser, addUser, deptTreeSelect } from "@/api/system/user"; const router = useRouter(); const { proxy } = getCurrentInstance(); @@ -411,7 +391,7 @@ rules: { userName: [{ required: true, message: "鐢ㄦ埛鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }, { min: 2, max: 20, message: "鐢ㄦ埛鍚嶇О闀垮害蹇呴』浠嬩簬 2 鍜� 20 涔嬮棿", trigger: "blur" }], nickName: [{ required: true, message: "鐢ㄦ埛鏄电О涓嶈兘涓虹┖", trigger: "blur" }], - password: [{ required: true, message: "鐢ㄦ埛瀵嗙爜涓嶈兘涓虹┖", trigger: "blur" }, { min: 5, max: 20, message: "鐢ㄦ埛瀵嗙爜闀垮害蹇呴』浠嬩簬 5 鍜� 20 涔嬮棿", trigger: "blur" }], + password: [{ required: true, message: "鐢ㄦ埛瀵嗙爜涓嶈兘涓虹┖", trigger: "blur" }, { min: 5, max: 20, message: "鐢ㄦ埛瀵嗙爜闀垮害蹇呴』浠嬩簬 5 鍜� 20 涔嬮棿", trigger: "blur" }, { pattern: /^[^<>"'|\\]+$/, message: "涓嶈兘鍖呭惈闈炴硶瀛楃锛�< > \" ' \\\ |", trigger: "blur" }], email: [{ type: "email", message: "璇疯緭鍏ユ纭殑閭鍦板潃", trigger: ["blur", "change"] }], phonenumber: [{ pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "璇疯緭鍏ユ纭殑鎵嬫満鍙风爜", trigger: "blur" }] } @@ -424,16 +404,19 @@ if (!value) return true; return data.label.indexOf(value) !== -1; }; + /** 鏍规嵁鍚嶇О绛涢�夐儴闂ㄦ爲 */ watch(deptName, val => { proxy.$refs["deptTreeRef"].filter(val); }); + /** 鏌ヨ閮ㄩ棬涓嬫媺鏍戠粨鏋� */ -function getTreeselect() { - treeselect().then(response => { +function getDeptTree() { + deptTreeSelect().then(response => { deptOptions.value = response.data; }); }; + /** 鏌ヨ鐢ㄦ埛鍒楄〃 */ function getList() { loading.value = true; @@ -443,22 +426,28 @@ total.value = res.total; }); }; + /** 鑺傜偣鍗曞嚮浜嬩欢 */ function handleNodeClick(data) { queryParams.value.deptId = data.id; handleQuery(); }; + /** 鎼滅储鎸夐挳鎿嶄綔 */ function handleQuery() { queryParams.value.pageNum = 1; getList(); }; + /** 閲嶇疆鎸夐挳鎿嶄綔 */ function resetQuery() { dateRange.value = []; proxy.resetForm("queryRef"); + queryParams.value.deptId = undefined; + proxy.$refs.deptTreeRef.setCurrentKey(null); handleQuery(); }; + /** 鍒犻櫎鎸夐挳鎿嶄綔 */ function handleDelete(row) { const userIds = row.userId || ids.value; @@ -469,12 +458,14 @@ proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛"); }).catch(() => {}); }; + /** 瀵煎嚭鎸夐挳鎿嶄綔 */ function handleExport() { proxy.download("system/user/export", { ...queryParams.value, },`user_${new Date().getTime()}.xlsx`); }; + /** 鐢ㄦ埛鐘舵�佷慨鏀� */ function handleStatusChange(row) { let text = row.status === "0" ? "鍚敤" : "鍋滅敤"; @@ -486,6 +477,7 @@ row.status = row.status === "0" ? "1" : "0"; }); }; + /** 鏇村鎿嶄綔 */ function handleCommand(command, row) { switch (command) { @@ -499,11 +491,13 @@ break; } }; + /** 璺宠浆瑙掕壊鍒嗛厤 */ function handleAuthRole(row) { const userId = row.userId; router.push("/system/user-auth/role/" + userId); }; + /** 閲嶇疆瀵嗙爜鎸夐挳鎿嶄綔 */ function handleResetPwd(row) { proxy.$prompt('璇疯緭鍏�"' + row.userName + '"鐨勬柊瀵嗙爜', "鎻愮ず", { @@ -512,53 +506,56 @@ closeOnClickModal: false, inputPattern: /^.{5,20}$/, inputErrorMessage: "鐢ㄦ埛瀵嗙爜闀垮害蹇呴』浠嬩簬 5 鍜� 20 涔嬮棿", + inputValidator: (value) => { + if (/<|>|"|'|\||\\/.test(value)) { + return "涓嶈兘鍖呭惈闈炴硶瀛楃锛�< > \" ' \\\ |" + } + }, }).then(({ value }) => { resetUserPwd(row.userId, value).then(response => { proxy.$modal.msgSuccess("淇敼鎴愬姛锛屾柊瀵嗙爜鏄細" + value); }); }).catch(() => {}); }; + /** 閫夋嫨鏉℃暟 */ function handleSelectionChange(selection) { ids.value = selection.map(item => item.userId); single.value = selection.length != 1; multiple.value = !selection.length; }; + /** 瀵煎叆鎸夐挳鎿嶄綔 */ function handleImport() { upload.title = "鐢ㄦ埛瀵煎叆"; upload.open = true; }; + /** 涓嬭浇妯℃澘鎿嶄綔 */ function importTemplate() { proxy.download("system/user/importTemplate", { }, `user_template_${new Date().getTime()}.xlsx`); }; + /**鏂囦欢涓婁紶涓鐞� */ const handleFileUploadProgress = (event, file, fileList) => { upload.isUploading = true; }; + /** 鏂囦欢涓婁紶鎴愬姛澶勭悊 */ const handleFileSuccess = (response, file, fileList) => { upload.open = false; upload.isUploading = false; - proxy.$refs["uploadRef"].clearFiles(); + proxy.$refs["uploadRef"].handleRemove(file); proxy.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "瀵煎叆缁撴灉", { dangerouslyUseHTMLString: true }); getList(); }; + /** 鎻愪氦涓婁紶鏂囦欢 */ function submitFileForm() { proxy.$refs["uploadRef"].submit(); }; -/** 鍒濆鍖栭儴闂ㄦ暟鎹� */ -function initTreeData() { - // 鍒ゆ柇閮ㄩ棬鐨勬暟鎹槸鍚﹀瓨鍦紝瀛樺湪涓嶈幏鍙栵紝涓嶅瓨鍦ㄥ垯鑾峰彇 - if (deptOptions.value === undefined) { - treeselect().then(response => { - deptOptions.value = response.data; - }); - } -}; + /** 閲嶇疆鎿嶄綔琛ㄥ崟 */ function reset() { form.value = { @@ -577,15 +574,16 @@ }; proxy.resetForm("userRef"); }; + /** 鍙栨秷鎸夐挳 */ function cancel() { open.value = false; reset(); }; + /** 鏂板鎸夐挳鎿嶄綔 */ function handleAdd() { reset(); - initTreeData(); getUser().then(response => { postOptions.value = response.posts; roleOptions.value = response.roles; @@ -594,10 +592,10 @@ form.value.password = initPassword.value; }); }; + /** 淇敼鎸夐挳鎿嶄綔 */ function handleUpdate(row) { reset(); - initTreeData(); const userId = row.userId || ids.value; getUser(userId).then(response => { form.value = response.data; @@ -610,6 +608,7 @@ form.password = ""; }); }; + /** 鎻愪氦鎸夐挳 */ function submitForm() { proxy.$refs["userRef"].validate(valid => { @@ -631,6 +630,6 @@ }); }; -getTreeselect(); +getDeptTree(); getList(); </script> -- Gitblit v1.9.3