diff --git a/.vscode/launch.json b/.vscode/launch.json new file mode 100644 index 0000000000000000000000000000000000000000..cb561fd0dd36dc37834b5317a3c279c8853ba649 --- /dev/null +++ b/.vscode/launch.json @@ -0,0 +1,23 @@ +{ + // 使用 IntelliSense 了解相关属性。 + // 悬停以查看现有属性的描述。 + // 欲了解更多信息，请访问: https://go.microsoft.com/fwlink/?linkid=830387 + "version": "0.2.0", + "configurations": [ + { + "args": ["--extensionDevelopmentPath=${workspaceFolder}"], + "name": "启动扩展", + "outFiles": ["${workspaceFolder}/out/**/*.js"], + "preLaunchTask": "npm", + "request": "launch", + "type": "extensionHost" + }, + { + "type": "chrome", + "request": "launch", + "name": "针对 localhost 启动 Chrome", + "url": "http://localhost:5173", + "webRoot": "${workspaceFolder}" + } + ] +} diff --git a/package.json b/package.json index 55d693614aca250a72ee7e8c5c13ea73f55f41e1..f338ede4ff1305f522459ddea2c903ea7bef0920 100644 --- a/package.json +++ b/package.json @@ -4,6 +4,8 @@ "version": "0.0.0", "type": "module", "scripts": { + "dev:debug": "node --inspect-brk node_modules/vite/bin/vite.js", + "build:debug": "node --inspect-brk node_modules/vite/bin/vite.js build", "serve": "vite", "dev": "vite", "pro": "vite --mode production", diff --git a/src/directives/hasPermi.js b/src/directives/hasPermi.js new file mode 100644 index 0000000000000000000000000000000000000000..2fc49ac331774e645762b241d88a914327b195fb --- /dev/null +++ b/src/directives/hasPermi.js @@ -0,0 +1,22 @@ +import useMenuStore from '@/stortes/menu'; // 引入仓库 +// 自定义指令 v-has-permi +export default { + mounted(el, binding) { + const useMenuStoresdata = useMenuStore(); + const permissions = useMenuStoresdata.btnPermsArry; + const requiredPermissions = binding.value; // 获取传递的权限数组 + const all_permission = '*:*:*'; // 假设有一个表示所有权限的值 + + // 判断是否拥有权限 + const hasPermission = permissions.some(permission => { + return all_permission === permission || requiredPermissions.includes(permission); + }); + + // 如果没有权限，隐藏元素 + if (!hasPermission) { + el.style.display = 'none'; + } else { + el.style.display = ''; // 如果有权限，显示元素 + } + }, +}; diff --git a/src/home.vue b/src/home.vue index 6ca31a6a986da911642bc93939275c63a2099356..6952b72f181dd88bcd1e6295ce7879487ee51afd 100644 --- a/src/home.vue +++ b/src/home.vue @@ -11,7 +11,6 @@
-
-
- - Open user menu - -
+ +
+ + Open user menu + +
+ +
@@ -95,6 +101,8 @@ const handleClickOutside = e => { // 确保 contextMenuElement 已经被赋值 if (contextMenuElement.value && !contextMenuElement.value.contains(e.target)) { contextMenuVisible.value = false; + } else { + contextMenuVisible.value = false; } }; // 定义函数 refresh @@ -133,34 +141,49 @@ const closeAll = () => { proxy.$router.push(editableTabsValue.value); }); }; + +const handleContextOut = e => { + if (e === 'contextout') { + // 退出登录 + proxy.$messageBox + .confirm('确定退出登录吗？', '提示', { + type: '提示', + }) + .then(() => { + proxy.$router.push('/login'); + }); + } +}; const handleContextMenu = e => { + contextMenuVisible.value = false; let result = findNodeById(userData.value, e.srcElement.id.split('-')[1]); - rightMouseKey.value = e.srcElement.id.split('-')[1]; - rightMouseData.value = result; - // 判断当前右键点击的是否是第0或者是第一项 - let index = activeTabArray.value.findIndex(item => item.url === rightMouseKey.value); - if (index == 0 || index == 1) { - isLeftMenu.value = false; - } else { - isLeftMenu.value = true; - } - // 判断当前右键点击的菜单项是否是当前路由 - if (rightMouseKey.value == editableTabsValue.value) { - isActiveMenu.value = true; - } else { - isActiveMenu.value = false; - } - // 如果当前右键点击的菜单项是最后一项那就就不显示 关闭右侧的li - if (rightMouseKey.value == activeTabArray.value[activeTabArray.value.length - 1].url) { - // isRightMenu 设置为false - isRightMenu.value = false; - } else { - isRightMenu.value = true; + if (result) { + contextMenuVisible.value = true; + left.value = e.clientX - 10; + top.value = e.clientY + 15; + rightMouseKey.value = e.srcElement.id.split('-')[1]; + rightMouseData.value = result; + // 判断当前右键点击的是否是第0或者是第一项 + let index = activeTabArray.value.findIndex(item => item.url === rightMouseKey.value); + if (index == 0 || index == 1) { + isLeftMenu.value = false; + } else { + isLeftMenu.value = true; + } + // 判断当前右键点击的菜单项是否是当前路由 + if (rightMouseKey.value == editableTabsValue.value) { + isActiveMenu.value = true; + } else { + isActiveMenu.value = false; + } + // 如果当前右键点击的菜单项是最后一项那就就不显示 关闭右侧的li + if (rightMouseKey.value == activeTabArray.value[activeTabArray.value.length - 1].url) { + // isRightMenu 设置为false + isRightMenu.value = false; + } else { + isRightMenu.value = true; + } } - e.preventDefault(); - contextMenuVisible.value = true; - left.value = e.clientX - 10; - top.value = e.clientY + 15; }; const removeTab = pane => { diff --git a/src/main.js b/src/main.js index e9656745ef733853c10c72e14f2a48d07cf3a445..86cde73107022e540736fcbff5a7ccffa6eda0c1 100644 --- a/src/main.js +++ b/src/main.js @@ -7,11 +7,17 @@ import axios from './utils/request'; import pinia from './stortes'; //引入 import * as ElementPlusIconsVue from '@element-plus/icons-vue'; import zhCn from 'element-plus/es/locale/lang/zh-cn'; // 引入中文语言包 +import { checkPermissions } from './utils/permissions'; +import hasPermi from './directives/hasPermi'; // 引入自定义指令 // import '@/assets/css/tailwind.css'; import 'uno.css'; const app = createApp(App); app.config.globalProperties.$api = axios; app.config.globalProperties.$icon = ElementPlusIconsVue; +// 引入权限校验方法 +app.config.globalProperties.$checkPermissions = checkPermissions; +// 注册全局指令 v-has-permi +app.directive('has-permi', hasPermi); // size: 'small', app.use(router).use(pinia).use(ElementPlus, { locale: zhCn, zIndex: 3000 }); for (const [key, component] of Object.entries(ElementPlusIconsVue)) { diff --git a/src/pages/login.vue b/src/pages/login.vue index a60f89db4f79e0287ff402304d491be18e78b41e..6d1322f544ef4206ad31d6caaea55ee4540e7e98 100644 --- a/src/pages/login.vue +++ b/src/pages/login.vue @@ -37,10 +37,10 @@ import useUserInfoStore from '@/stortes/user'; //引入仓库 import menuStore from '@/stortes/menu'; //引入仓库 import { storeToRefs } from 'pinia'; //引入pinia转换 const userInfoStore = useUserInfoStore(); -// const userdata = storeToRefs(userInfoStore); // 响应式 +const { userInfo } = storeToRefs(userInfoStore); // 响应式 const { proxy } = getCurrentInstance(); const menuInfoStore = menuStore(); -const { editableTabsValue } = storeToRefs(menuInfoStore); // 响应式 +const { editableTabsValue, btnPermsArry } = storeToRefs(menuInfoStore); // 响应式 let intervalId = null; let flag = ref(0); onMounted(async () => { @@ -96,6 +96,9 @@ const onSubmit = formEl => { const data = await proxy.$api.login(ruleForm); if (data.code == 200) { + console.log(userInfoStore, 'userInfoStoreuserInfoStore'); + menuInfoStore.getPerms(data.data.perms); + userInfoStore.changeUserInfo(data.data.informationObject); // userInfoStore.changeUserInfo(data.data); localStorage.setItem('token', data.data.token); localStorage.setItem('refreshToken', data.data.refreshToken); diff --git a/src/pages/product/product.vue b/src/pages/product/product.vue deleted file mode 100644 index b2ded6eb757860f05e3f26968f3cf11149c60884..0000000000000000000000000000000000000000 --- a/src/pages/product/product.vue +++ /dev/null @@ -1,10 +0,0 @@ - - - diff --git a/src/pages/systemSetting/internalusers.vue b/src/pages/systemSetting/internalusers.vue index 10b8dcf36ae081bfe9b810018c41b8d51a541690..406a29c523cbcfcf5109e6a44333c9bf0a6a682f 100644 --- a/src/pages/systemSetting/internalusers.vue +++ b/src/pages/systemSetting/internalusers.vue @@ -3,6 +3,7 @@
diff --git a/src/pages/systemSetting/menuResource.vue b/src/pages/systemSetting/menuResource.vue index e6f15355438257349dc3249dfe85e3942656e8e5..f20b56179bb7f0bdcb2e5cda59c0067afe619151 100644 --- a/src/pages/systemSetting/menuResource.vue +++ b/src/pages/systemSetting/menuResource.vue @@ -2,23 +2,22 @@
- 新增 + 新增
- + - @@ -136,7 +135,15 @@ - +
请选择图标
@@ -180,7 +187,7 @@