commit 4847600a471f2a748c05d04bab02cd29d7a657de Author: fhysy <1149505133@qq.com> Date: Thu Dec 12 14:48:12 2024 +0800 💥 feat(compiler): 初始化 diff --git a/.env b/.env new file mode 100644 index 0000000..a10cc6f --- /dev/null +++ b/.env @@ -0,0 +1,11 @@ +# port 端口号 +VITE_PORT = 8888 + +# open 运行 npm run dev 时自动打开浏览器 +VITE_OPEN = false + +# 打包是否开启 cdn（源文件 utils/build.js），可自行修改 +VITE_OPEN_CDN = false + +# public path 配置线上环境路径（打包）、本地通过 http-server 访问时，请置空即可 +VITE_PUBLIC_PATH = \ No newline at end of file diff --git a/.env.development b/.env.development new file mode 100644 index 0000000..83fd5c5 --- /dev/null +++ b/.env.development @@ -0,0 +1,5 @@ +# 本地环境 +ENV = development + +# 本地环境接口地址 +VITE_API_URL = http://localhost:8888/ \ No newline at end of file diff --git a/.env.production b/.env.production new file mode 100644 index 0000000..478a841 --- /dev/null +++ b/.env.production @@ -0,0 +1,5 @@ +# 线上环境 +ENV = production + +# 线上环境接口地址 +VITE_API_URL = https://lyt-top.gitee.io/vue-next-admin-preview/ \ No newline at end of file diff --git a/.eslintignore b/.eslintignore new file mode 100644 index 0000000..cfc877d --- /dev/null +++ b/.eslintignore @@ -0,0 +1,18 @@ + +*.sh +node_modules +lib +*.md +*.scss +*.woff +*.ttf +.vscode +.idea +dist +mock +public +bin +build +config +index.html +src/assets \ No newline at end of file diff --git a/.eslintrc.js b/.eslintrc.js new file mode 100644 index 0000000..f4a9b6e --- /dev/null +++ b/.eslintrc.js @@ -0,0 +1,76 @@ +module.exports = { + root: true, + env: { + browser: true, + es2021: true, + node: true, + }, + parser: 'vue-eslint-parser', + parserOptions: { + ecmaVersion: 12, + parser: '@typescript-eslint/parser', + sourceType: 'module', + }, + extends: ['plugin:vue/vue3-essential', 'plugin:vue/essential', 'eslint:recommended'], + plugins: ['vue', '@typescript-eslint'], + overrides: [ + { + files: ['*.ts', '*.tsx', '*.vue'], + rules: { + 'no-undef': 'off', + }, + }, + ], + rules: { + // http://eslint.cn/docs/rules/ + // https://eslint.vuejs.org/rules/ + // https://typescript-eslint.io/rules/no-unused-vars/ + '@typescript-eslint/ban-ts-ignore': 'off', + '@typescript-eslint/explicit-function-return-type': 'off', + '@typescript-eslint/no-explicit-any': 'off', + '@typescript-eslint/no-var-requires': 'off', + '@typescript-eslint/no-empty-function': 'off', + '@typescript-eslint/no-use-before-define': 'off', + '@typescript-eslint/ban-ts-comment': 'off', + '@typescript-eslint/ban-types': 'off', + '@typescript-eslint/no-non-null-assertion': 'off', + '@typescript-eslint/explicit-module-boundary-types': 'off', + '@typescript-eslint/no-redeclare': 'error', + '@typescript-eslint/no-non-null-asserted-optional-chain': 'off', + '@typescript-eslint/no-unused-vars': [2], + 'vue/custom-event-name-casing': 'off', + 'vue/attributes-order': 'off', + 'vue/one-component-per-file': 'off', + 'vue/html-closing-bracket-newline': 'off', + 'vue/max-attributes-per-line': 'off', + 'vue/multiline-html-element-content-newline': 'off', + 'vue/singleline-html-element-content-newline': 'off', + 'vue/attribute-hyphenation': 'off', + 'vue/html-self-closing': 'off', + 'vue/no-multiple-template-root': 'off', + 'vue/require-default-prop': 'off', + 'vue/no-v-model-argument': 'off', + 'vue/no-arrow-functions-in-watch': 'off', + 'vue/no-template-key': 'off', + 'vue/no-v-html': 'off', + 'vue/comment-directive': 'off', + 'vue/no-parsing-error': 'off', + 'vue/no-deprecated-v-on-native-modifier': 'off', + 'vue/multi-word-component-names': 'off', + 'no-useless-escape': 'off', + 'no-sparse-arrays': 'off', + 'no-prototype-builtins': 'off', + 'no-constant-condition': 'off', + 'no-use-before-define': 'off', + 'no-restricted-globals': 'off', + 'no-restricted-syntax': 'off', + 'generator-star-spacing': 'off', + 'no-unreachable': 'off', + 'no-multiple-template-root': 'off', + 'no-unused-vars': 'error', + 'no-v-model-argument': 'off', + 'no-case-declarations': 'off', + 'no-console': 'error', + 'no-redeclare': 'off', + }, +}; diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..403adbc --- /dev/null +++ b/.gitignore @@ -0,0 +1,23 @@ +.DS_Store +node_modules +/dist + + +# local env files +.env.local +.env.*.local + +# Log files +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* + +# Editor directories and files +.idea +.vscode +*.suo +*.ntvs* +*.njsproj +*.sln +*.sw? diff --git a/.prettierrc.js b/.prettierrc.js new file mode 100644 index 0000000..cff490a --- /dev/null +++ b/.prettierrc.js @@ -0,0 +1,39 @@ +module.exports = { + // 一行最多多少个字符 + printWidth: 150, + // 指定每个缩进级别的空格数 + tabWidth: 2, + // 使用制表符而不是空格缩进行 + useTabs: true, + // 在语句末尾打印分号 + semi: true, + // 使用单引号而不是双引号 + singleQuote: true, + // 更改引用对象属性的时间 可选值"" + quoteProps: 'as-needed', + // 在JSX中使用单引号而不是双引号 + jsxSingleQuote: false, + // 多行时尽可能打印尾随逗号。（例如，单行数组永远不会出现逗号结尾。） 可选值""，默认none + trailingComma: 'es5', + // 在对象文字中的括号之间打印空格 + bracketSpacing: true, + // jsx 标签的反尖括号需要换行 + jsxBracketSameLine: false, + // 在单独的箭头函数参数周围包括括号 always：(x) => x \ avoid：x => x + arrowParens: 'always', + // 这两个选项可用于格式化以给定字符偏移量（分别包括和不包括）开始和结束的代码 + rangeStart: 0, + rangeEnd: Infinity, + // 指定要使用的解析器，不需要写文件开头的 @prettier + requirePragma: false, + // 不需要自动在文件开头插入 @prettier + insertPragma: false, + // 使用默认的折行标准 always\never\preserve + proseWrap: 'preserve', + // 指定HTML文件的全局空格敏感度 css\strict\ignore + htmlWhitespaceSensitivity: 'css', + // Vue文件脚本和样式标签缩进 + vueIndentScriptAndStyle: false, + // 换行符使用 lf 结尾是 可选值"" + endOfLine: 'lf', +}; diff --git a/CHANGELOG.md b/CHANGELOG.md new file mode 100644 index 0000000..b3da66d --- /dev/null +++ b/CHANGELOG.md @@ -0,0 +1,73 @@ +# vue-next-admin-template-js（不带国际化） 更新日志 + +🎉🎉🔥 `vue-next-admin-template-js` 基于 （vue-next-admin-template v2.4.33 版本） vue3.x 、vite、Element plus 等，适配手机、平板、pc 的后台开源免费模板库（vue2.x 请切换 vue-prev-admin 分支） + +## 2.4.33 + +`2023.04.12` + +- 🎉 同步 vue-next-admin-template 基础版本（不带国际化） 分支 v2.4.33 版本内容，具体查看 master 分支 CHANGELOG.md + +## 2.4.32 + +`2023.03.26` + +- 🎉 同步 vue-next-admin-template 基础版本（不带国际化） 分支 v2.4.32 版本内容，具体查看 master 分支 CHANGELOG.md + +## 2.4.31 + +`2023.03.10` + +- 🎉 同步 vue-next-admin-template 基础版本（不带国际化） 分支 v2.4.31 版本内容，具体查看 master 分支 CHANGELOG.md + +## 2.4.3 + +`2023.02.23` + +🚩🚩🚩 感谢 [驰骋工作流引擎-表单引擎-低代码开发平台](http://www.ccflow.org/) 赞助商的赞助。驰骋公司为社会提供流程引擎+表单引擎+低代码开发平台一体的开源软件解决方案，欢迎广大开发者前去体验！ + +- 🎉 同步 vue-next-admin-template 基础版本（不带国际化） 分支 v2.4.3 版本内容，具体查看 master 分支 CHANGELOG.md + +## 2.4.21 + +`2022.12.12` + +- 🎉 同步 vue-next-admin-template 基础版本（不带国际化） 分支 v2.4.21 版本内容，具体查看 master 分支 CHANGELOG.md + +## 2.4.2 + +`2022.12.10` + +- 🎉 同步 vue-next-admin-template 基础版本（不带国际化） 分支 v2.4.2 版本内容，具体查看 master 分支 CHANGELOG.md + +## 2.4.1 + +`2022.12.01` + +- 🎉 同步 vue-next-admin-template 基础版本（不带国际化） 分支 v2.4.1 版本内容，具体查看 master 分支 CHANGELOG.md + +## 2.3.0 + +`2022.11.16` + +- 🎉 同步 vue-next-admin-template 基础版本（不带国际化） 分支 v2.3.0 版本内容，具体查看 master 分支 CHANGELOG.md + +## 2.2.0 + +`2022.07.11` + +- 🎉 同步 vue-next-admin-template 基础版本（不带国际化） 分支 v2.2.0 版本内容，具体查看 master 分支 CHANGELOG.md + +## 2.1.1 + +- 🎉 同步 vue-next-admin-template 基础版本（不带国际化） 分支 v2.1.1 版本内容，具体查看 master 分支 CHANGELOG.md + +## 2.0.2 + +- 🎉 同步 vue-next-admin-template 基础版本（不带国际化） 分支 v2.0.2 版本内容，具体查看 master 分支 CHANGELOG.md + +## 0.1.0 + +`2021.12.27` + +- 🎉 新增 vue-next-admin-template 基础版本（不带国际化），切换 `vue-next-admin-template-js` 分支 diff --git a/LICENSE b/LICENSE new file mode 100644 index 0000000..6f6a7ea --- /dev/null +++ b/LICENSE @@ -0,0 +1,21 @@ +MIT License + +Copyright (c) 2021 lyt-Top + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. \ No newline at end of file diff --git a/README.md b/README.md new file mode 100644 index 0000000..4d66ed6 --- /dev/null +++ b/README.md @@ -0,0 +1,143 @@ +
+ +

+ + vue + + + element plus + + + typescript + + + vite + + + license + +

+

 

+
+ +#### 💝 长期赞助商 + + + + + +#### 🌈 介绍 基础版 js（不带国际化，基于 vue-next-admin-template V2.4.33 版，setup 语法糖） + +基于 vue3.x + CompositionAPI setup 语法糖 + typescript + vite + element plus + vue-router-next + pinia 技术，适配手机、平板、pc 的后台开源免费模板，希望减少工作量，帮助大家实现快速开发。 + +#### ⛱️ 线上预览 + +- vue3.x 版本预览（vue-next-admin）https://lyt-top.gitee.io/vue-next-admin-preview/#/login +- vue2.x 版本预览（vue-prev-admin）https://lyt-top.gitee.io/vue-prev-admin-preview/#/login +- vue3.x + uni-app 商城 H5（vue-next-admin-shop）https://lyt-top.gitee.io/vue-next-admin-shop-preview + +#### 💒 代码仓库 + +- vue3.x 版本 https://gitee.com/lyt-top/vue-next-admin +- vue2.x 版本 https://gitee.com/lyt-top/vue-next-admin/tree/vue-prev-admin + +#### 🚧 安装 cnpm、yarn + +- 复制代码(桌面 cmd 运行) `npm install -g cnpm --registry=https://registry.npm.taobao.org` +- 复制代码(桌面 cmd 运行) `npm install -g yarn` + +#### 🏭 环境支持 + +| Edge | Firefox | Chrome | Safari | +| --------- | ------------ | ----------- | ----------- | +| Edge ≥ 88 | Firefox ≥ 78 | Chrome ≥ 87 | Safari ≥ 13 | + +> 由于 Vue3 不再支持 IE11，故而 ElementPlus 也不支持 IE11 及之前版本。 + +#### ⚡ 使用说明 + +建议使用 cnpm，因为 yarn 有时会报错。node 版本 > 14.18+/16+ + +> Vite 不再支持 Node 12 / 13 / 15，因为上述版本已经进入了 EOL 阶段。现在你必须使用 Node 14.18+ / 16+ 版本。 + +```bash +# 克隆项目 +git clone https://gitee.com/lyt-top/vue-next-admin.git + +# 进入项目 +cd vue-next-admin + +# 切换分支 +git checkout vue-next-admin-template-js + +# 安装依赖 +cnpm install + +# 运行项目 +cnpm run dev + +# 打包发布 +cnpm run build +``` + +#### 📚 开发文档 + +- 查看开发文档：vue-next-admin-doc + +#### 💯 学习交流加 QQ 群 + +> 1 - 4 交流群已满，请加 vue-next-admin 交流群 5 + +群号：556254895 + +其它交流群请查看文档首页 [vueNextAdmin 解疑问](https://lyt-top.gitee.io/vue-next-admin-doc-preview/) + +#### 💒 集成后端 + +- @zuohuaijun Admin.NET +- @熊猫 PandaGoAdmin +- @甜蜜蜜 GoPro 平台 +- @甜蜜蜜 NiuPi 平台 +- @游子 GFast-V3 +- @diygw.com gw-ui-php +- @zsvg vboot-net +- @zsvg vboot-java +- @青红造了个白 buildadmin +- @Goodwell iotfast(一个开源的物联网平台) + +#### ❤️ 鸣谢列表 + +- vue +- vue-next +- element-ui +- element-plus +- vue-router-nex +- vuex +- echarts +- axios +- mitt +- nprogress +- screenfull +- sortablejs +- sass +- typescript +- vite +- pinia +- js-cookie +- vite-plugin-cdn-import +- vite-plugin-compression +- vite-plugin-vue-setup-extend-plus + +#### 💕 特别感谢 + +特别感谢老哥们的建议、指导与帮忙，谢谢！ + +- @省长 +- @唐参 +- @川歌 +- @华仔 + +#### 💌 支持作者 + +如果觉得框架不错，或者已经在使用了，希望你可以去 Github 或者 +Gitee 帮我点个 ⭐ Star，这将是对我极大的鼓励与支持。 diff --git a/index.html b/index.html new file mode 100644 index 0000000..5e83ac0 --- /dev/null +++ b/index.html @@ -0,0 +1,24 @@ + + + + + + + + 网关采集配置器 + + + +
+ + + + diff --git a/jsconfig.json b/jsconfig.json new file mode 100644 index 0000000..ca6cd38 --- /dev/null +++ b/jsconfig.json @@ -0,0 +1,21 @@ +{ + "compilerOptions": { + "target": "esnext", + "module": "esnext", + "lib": ["esnext", "dom", "dom.iterable", "scripthost"], + "jsx": "preserve", + "isolatedModules": true, + "strict": true, + "allowSyntheticDefaultImports": true, + "esModuleInterop": true, + "experimentalDecorators": true, + "skipLibCheck": true, + "forceConsistentCasingInFileNames": true, + "moduleResolution": "node", + "baseUrl": ".", + "types": ["vite/client"], + "paths": { + "/@/*": ["src/*"] + } + } +} diff --git a/package.json b/package.json new file mode 100644 index 0000000..c9e6372 --- /dev/null +++ b/package.json @@ -0,0 +1,71 @@ +{ + "name": "vue-next-admin-template-js", + "version": "2.4.33", + "description": "vue3 vite next admin template js setup", + "author": "lyt_20201208", + "license": "MIT", + "scripts": { + "dev": "vite --force", + "build": "vite build", + "lint-fix": "eslint --fix --ext .js --ext .jsx --ext .vue src/" + }, + "dependencies": { + "@element-plus/icons-vue": "^2.1.0", + "axios": "^1.3.5", + "echarts": "^5.4.2", + "element-plus": "^2.5.0", + "js-cookie": "^3.0.1", + "mitt": "^3.0.0", + "nprogress": "^0.2.0", + "pinia": "^2.0.34", + "qrcodejs2-fixes": "^0.0.2", + "qs": "^6.11.1", + "screenfull": "^6.0.2", + "sortablejs": "^1.15.0", + "vue": "^3.2.47", + "vue-clipboard3": "^2.0.0", + "vue-demi": "^0.13.11", + "vue-next-admin-template-js": "file:", + "vue-router": "^4.1.6" + }, + "devDependencies": { + "@vitejs/plugin-vue": "^4.1.0", + "@vue/compiler-sfc": "^3.2.47", + "eslint": "^8.38.0", + "eslint-plugin-vue": "^9.10.0", + "prettier": "^2.8.7", + "sass": "^1.62.0", + "vite": "^4.2.1", + "vite-plugin-cdn-import": "^0.3.5", + "vite-plugin-compression": "^0.5.1", + "vite-plugin-vue-setup-extend-plus": "^0.1.0", + "vue-eslint-parser": "^9.1.1" + }, + "browserslist": [ + "> 1%", + "last 2 versions", + "not dead" + ], + "bugs": { + "url": "https://gitee.com/lyt-top/vue-next-admin/issues" + }, + "engines": { + "node": ">=16.0.0", + "npm": ">= 7.0.0" + }, + "keywords": [ + "vue", + "vue3", + "vuejs/vue-next", + "vuejs/vue-next-template", + "vuejs/vue-next-template-js", + "element-ui", + "element-plus", + "vue-next-admin", + "next-admin" + ], + "repository": { + "type": "git", + "url": "https://gitee.com/lyt-top/vue-next-admin.git" + } +} diff --git a/public/config.js b/public/config.js new file mode 100644 index 0000000..67b8ea3 --- /dev/null +++ b/public/config.js @@ -0,0 +1,8 @@ +// 手动配置的地址 +window.baseConfig = { + ip: 'digital-core.drgyen.com', + port: '', + prodApi: '', + protocol: 'https://', + wsProtocol: 'wss://' +} diff --git a/public/favicon.ico b/public/favicon.ico new file mode 100644 index 0000000..d7c508a Binary files /dev/null and b/public/favicon.ico differ diff --git a/src/App.vue b/src/App.vue new file mode 100644 index 0000000..0a2c80b --- /dev/null +++ b/src/App.vue @@ -0,0 +1,95 @@ + + + diff --git a/src/api/login/index.js b/src/api/login/index.js new file mode 100644 index 0000000..cf9504b --- /dev/null +++ b/src/api/login/index.js @@ -0,0 +1,27 @@ +import request from '/@/utils/request'; + +/** + * （不建议写成 request.post(xxx)，因为这样 post 时，无法 params 与 data 同时传参） + * + * 登录api接口集合 + * @method signIn 用户登录 + * @method signOut 用户退出登录 + */ +export function useLoginApi() { + return { + signIn: (data) => { + return request({ + url: '/user/signIn', + method: 'post', + data, + }); + }, + signOut: (data) => { + return request({ + url: '/user/signOut', + method: 'post', + data, + }); + }, + }; +} diff --git a/src/api/menu/index.js b/src/api/menu/index.js new file mode 100644 index 0000000..1c92825 --- /dev/null +++ b/src/api/menu/index.js @@ -0,0 +1,31 @@ +import request from '/@/utils/request'; + +/** + * 以下为模拟接口地址，gitee 的不通，就换自己的真实接口地址 + * + * （不建议写成 request.post(xxx)，因为这样 post 时，无法 params 与 data 同时传参） + * + * 后端控制菜单模拟json，路径在 https://gitee.com/lyt-top/vue-next-admin-images/tree/master/menu + * 后端控制路由，isRequestRoutes 为 true，则开启后端控制路由 + * @method getAdminMenu 获取后端动态路由菜单(admin) + * @method getTestMenu 获取后端动态路由菜单(test) + */ + +export function useMenuApi() { + return { + getAdminMenu: (params) => { + return request({ + url: '/gitee/lyt-top/vue-next-admin-images/raw/master/menu/adminMenu.json', + method: 'get', + params, + }); + }, + getTestMenu: (params) => { + return request({ + url: '/gitee/lyt-top/vue-next-admin-images/raw/master/menu/testMenu.json', + method: 'get', + params, + }); + }, + }; +} diff --git a/src/assets/ccflowRightNextAdmin.png b/src/assets/ccflowRightNextAdmin.png new file mode 100644 index 0000000..2d882ef Binary files /dev/null and b/src/assets/ccflowRightNextAdmin.png differ diff --git a/src/assets/login-bg.svg b/src/assets/login-bg.svg new file mode 100644 index 0000000..a345a54 --- /dev/null +++ b/src/assets/login-bg.svg @@ -0,0 +1,19 @@ + + + Layer 1 + + + + + + Layer 1 + + + + + + + + \ No newline at end of file diff --git a/src/assets/login-icon-two.svg b/src/assets/login-icon-two.svg new file mode 100644 index 0000000..b930211 --- /dev/null +++ b/src/assets/login-icon-two.svg @@ -0,0 +1 @@ +sunlight \ No newline at end of file diff --git a/src/assets/login-main.svg b/src/assets/login-main.svg new file mode 100644 index 0000000..60dbe7c --- /dev/null +++ b/src/assets/login-main.svg @@ -0,0 +1 @@ +static_assets \ No newline at end of file diff --git a/src/assets/logo-mini.svg b/src/assets/logo-mini.svg new file mode 100644 index 0000000..53df94c --- /dev/null +++ b/src/assets/logo-mini.svg @@ -0,0 +1,9 @@ + + + + + + + \ No newline at end of file diff --git a/src/components/iconSelector/index.vue b/src/components/iconSelector/index.vue new file mode 100644 index 0000000..c88eb9f --- /dev/null +++ b/src/components/iconSelector/index.vue @@ -0,0 +1,240 @@ + + + diff --git a/src/components/iconSelector/list.vue b/src/components/iconSelector/list.vue new file mode 100644 index 0000000..27b007c --- /dev/null +++ b/src/components/iconSelector/list.vue @@ -0,0 +1,84 @@ + + + + + diff --git a/src/components/svgIcon/index.vue b/src/components/svgIcon/index.vue new file mode 100644 index 0000000..3e3a665 --- /dev/null +++ b/src/components/svgIcon/index.vue @@ -0,0 +1,63 @@ + + + diff --git a/src/directive/authDirective.js b/src/directive/authDirective.js new file mode 100644 index 0000000..b1b2cb1 --- /dev/null +++ b/src/directive/authDirective.js @@ -0,0 +1,39 @@ +import { useUserInfo } from '/@/stores/userInfo'; +import { judementSameArr } from '/@/utils/arrayOperation'; + +/** + * 用户权限指令 + * @directive 单个权限验证（v-auth="xxx"） + * @directive 多个权限验证，满足一个则显示（v-auths="[xxx,xxx]"） + * @directive 多个权限验证，全部满足则显示（v-auth-all="[xxx,xxx]"） + */ +export function authDirective(app) { + // 单个权限验证（v-auth="xxx"） + app.directive('auth', { + mounted(el, binding) { + const stores = useUserInfo(); + if (!stores.userInfos.authBtnList.some((v) => v === binding.value)) el.parentNode.removeChild(el); + }, + }); + // 多个权限验证，满足一个则显示（v-auths="[xxx,xxx]"） + app.directive('auths', { + mounted(el, binding) { + let flag = false; + const stores = useUserInfo(); + stores.userInfos.authBtnList.map((val) => { + binding.value.map((v) => { + if (val === v) flag = true; + }); + }); + if (!flag) el.parentNode.removeChild(el); + }, + }); + // 多个权限验证，全部满足则显示（v-auth-all="[xxx,xxx]"） + app.directive('auth-all', { + mounted(el, binding) { + const stores = useUserInfo(); + const flag = judementSameArr(binding.value, stores.userInfos.authBtnList); + if (!flag) el.parentNode.removeChild(el); + }, + }); +} diff --git a/src/directive/customDirective.js b/src/directive/customDirective.js new file mode 100644 index 0000000..120bf21 --- /dev/null +++ b/src/directive/customDirective.js @@ -0,0 +1,176 @@ +/** + * 按钮波浪指令 + * @directive 默认方式：v-waves，如 `
` + * @directive 参数方式：v-waves=" |light|red|orange|purple|green|teal"，如 `
` + */ +export function wavesDirective(app) { + app.directive('waves', { + mounted(el, binding) { + el.classList.add('waves-effect'); + binding.value && el.classList.add(`waves-${binding.value}`); + function setConvertStyle(obj) { + let style = ''; + for (let i in obj) { + if (obj.hasOwnProperty(i)) style += `${i}:${obj[i]};`; + } + return style; + } + function onCurrentClick(e) { + let elDiv = document.createElement('div'); + elDiv.classList.add('waves-ripple'); + el.appendChild(elDiv); + let styles = { + left: `${e.layerX}px`, + top: `${e.layerY}px`, + opacity: 1, + transform: `scale(${(el.clientWidth / 100) * 10})`, + 'transition-duration': `750ms`, + 'transition-timing-function': `cubic-bezier(0.250, 0.460, 0.450, 0.940)`, + }; + elDiv.setAttribute('style', setConvertStyle(styles)); + setTimeout(() => { + elDiv.setAttribute( + 'style', + setConvertStyle({ + opacity: 0, + transform: styles.transform, + left: styles.left, + top: styles.top, + }) + ); + setTimeout(() => { + elDiv && el.removeChild(elDiv); + }, 750); + }, 450); + } + el.addEventListener('mousedown', onCurrentClick, false); + }, + unmounted(el) { + el.addEventListener('mousedown', () => {}); + }, + }); +} + +/** + * 自定义拖动指令 + * @description 使用方式：v-drag="[dragDom,dragHeader]"，如 `
` + * @description dragDom 要拖动的元素，dragHeader 要拖动的 Header 位置 + * @link 注意：https://github.com/element-plus/element-plus/issues/522 + * @lick 参考：https://blog.csdn.net/weixin_46391323/article/details/105228020?utm_medium=distribute.pc_relevant.none-task-blog-baidujs_title-10&spm=1001.2101.3001.4242 + */ +export function dragDirective(app) { + app.directive('drag', { + mounted(el, binding) { + if (!binding.value) return false; + + const dragDom = document.querySelector(binding.value[0]); + const dragHeader = document.querySelector(binding.value[1]); + + dragHeader.onmouseover = () => (dragHeader.style.cursor = `move`); + + function down(e, type) { + // 鼠标按下，计算当前元素距离可视区的距离 + const disX = type === 'pc' ? e.clientX - dragHeader.offsetLeft : e.touches[0].clientX - dragHeader.offsetLeft; + const disY = type === 'pc' ? e.clientY - dragHeader.offsetTop : e.touches[0].clientY - dragHeader.offsetTop; + + // body当前宽度 + const screenWidth = document.body.clientWidth; + // 可见区域高度(应为body高度，可某些环境下无法获取) + const screenHeight = document.documentElement.clientHeight; + + // 对话框宽度 + const dragDomWidth = dragDom.offsetWidth; + // 对话框高度 + const dragDomheight = dragDom.offsetHeight; + + const minDragDomLeft = dragDom.offsetLeft; + const maxDragDomLeft = screenWidth - dragDom.offsetLeft - dragDomWidth; + + const minDragDomTop = dragDom.offsetTop; + const maxDragDomTop = screenHeight - dragDom.offsetTop - dragDomheight; + + // 获取到的值带px 正则匹配替换 + let styL = getComputedStyle(dragDom).left; + let styT = getComputedStyle(dragDom).top; + + // 注意在ie中 第一次获取到的值为组件自带50% 移动之后赋值为px + if (styL.includes('%')) { + styL = +document.body.clientWidth * (+styL.replace(/\%/g, '') / 100); + styT = +document.body.clientHeight * (+styT.replace(/\%/g, '') / 100); + } else { + styL = +styL.replace(/\px/g, ''); + styT = +styT.replace(/\px/g, ''); + } + + return { + disX, + disY, + minDragDomLeft, + maxDragDomLeft, + minDragDomTop, + maxDragDomTop, + styL, + styT, + }; + } + + function move(e, type, obj) { + let { disX, disY, minDragDomLeft, maxDragDomLeft, minDragDomTop, maxDragDomTop, styL, styT } = obj; + + // 通过事件委托，计算移动的距离 + let left = type === 'pc' ? e.clientX - disX : e.touches[0].clientX - disX; + let top = type === 'pc' ? e.clientY - disY : e.touches[0].clientY - disY; + + // 边界处理 + if (-left > minDragDomLeft) { + left = -minDragDomLeft; + } else if (left > maxDragDomLeft) { + left = maxDragDomLeft; + } + + if (-top > minDragDomTop) { + top = -minDragDomTop; + } else if (top > maxDragDomTop) { + top = maxDragDomTop; + } + + // 移动当前元素 + dragDom.style.cssText += `;left:${left + styL}px;top:${top + styT}px;`; + } + + /** + * pc端 + * onmousedown 鼠标按下触发事件 + * onmousemove 鼠标按下时持续触发事件 + * onmouseup 鼠标抬起触发事件 + */ + dragHeader.onmousedown = (e) => { + const obj = down(e, 'pc'); + document.onmousemove = (e) => { + move(e, 'pc', obj); + }; + document.onmouseup = () => { + document.onmousemove = null; + document.onmouseup = null; + }; + }; + + /** + * 移动端 + * ontouchstart 当按下手指时，触发ontouchstart + * ontouchmove 当移动手指时，触发ontouchmove + * ontouchend 当移走手指时，触发ontouchend + */ + dragHeader.ontouchstart = (e) => { + const obj = down(e, 'app'); + document.ontouchmove = (e) => { + move(e, 'app', obj); + }; + document.ontouchend = () => { + document.ontouchmove = null; + document.ontouchend = null; + }; + }; + }, + }); +} diff --git a/src/directive/index.js b/src/directive/index.js new file mode 100644 index 0000000..1c46fc9 --- /dev/null +++ b/src/directive/index.js @@ -0,0 +1,17 @@ +import { authDirective } from './authDirective'; +import { wavesDirective, dragDirective } from '/@/directive/customDirective'; + +/** + * 导出指令方法：v-xxx + * @methods authDirective 用户权限指令，用法：v-auth + * @methods wavesDirective 按钮波浪指令，用法：v-waves + * @methods dragDirective 自定义拖动指令，用法：v-drag + */ +export function directive(app) { + // 用户权限指令 + authDirective(app); + // 按钮波浪指令 + wavesDirective(app); + // 自定义拖动指令 + dragDirective(app); +} diff --git a/src/layout/component/aside.vue b/src/layout/component/aside.vue new file mode 100644 index 0000000..2f55062 --- /dev/null +++ b/src/layout/component/aside.vue @@ -0,0 +1,162 @@ + + + diff --git a/src/layout/component/columnsAside.vue b/src/layout/component/columnsAside.vue new file mode 100644 index 0000000..a383fb4 --- /dev/null +++ b/src/layout/component/columnsAside.vue @@ -0,0 +1,301 @@ + + + + + diff --git a/src/layout/component/header.vue b/src/layout/component/header.vue new file mode 100644 index 0000000..c9814a3 --- /dev/null +++ b/src/layout/component/header.vue @@ -0,0 +1,18 @@ + + + diff --git a/src/layout/component/main.vue b/src/layout/component/main.vue new file mode 100644 index 0000000..d062527 --- /dev/null +++ b/src/layout/component/main.vue @@ -0,0 +1,65 @@ + + + diff --git a/src/layout/footer/index.vue b/src/layout/footer/index.vue new file mode 100644 index 0000000..b10d0d4 --- /dev/null +++ b/src/layout/footer/index.vue @@ -0,0 +1,25 @@ + + + + + diff --git a/src/layout/index.vue b/src/layout/index.vue new file mode 100644 index 0000000..331cf29 --- /dev/null +++ b/src/layout/index.vue @@ -0,0 +1,50 @@ + + + diff --git a/src/layout/lockScreen/index.vue b/src/layout/lockScreen/index.vue new file mode 100644 index 0000000..3666e66 --- /dev/null +++ b/src/layout/lockScreen/index.vue @@ -0,0 +1,352 @@ + + + + + diff --git a/src/layout/logo/index.vue b/src/layout/logo/index.vue new file mode 100644 index 0000000..b8ad31b --- /dev/null +++ b/src/layout/logo/index.vue @@ -0,0 +1,75 @@ + + + + + diff --git a/src/layout/main/classic.vue b/src/layout/main/classic.vue new file mode 100644 index 0000000..6a620f5 --- /dev/null +++ b/src/layout/main/classic.vue @@ -0,0 +1,72 @@ + + + diff --git a/src/layout/main/columns.vue b/src/layout/main/columns.vue new file mode 100644 index 0000000..bbc3889 --- /dev/null +++ b/src/layout/main/columns.vue @@ -0,0 +1,73 @@ + + + diff --git a/src/layout/main/defaults.vue b/src/layout/main/defaults.vue new file mode 100644 index 0000000..d064bc3 --- /dev/null +++ b/src/layout/main/defaults.vue @@ -0,0 +1,85 @@ + + + diff --git a/src/layout/main/transverse.vue b/src/layout/main/transverse.vue new file mode 100644 index 0000000..1ad45d1 --- /dev/null +++ b/src/layout/main/transverse.vue @@ -0,0 +1,60 @@ + + + diff --git a/src/layout/navBars/index.vue b/src/layout/navBars/index.vue new file mode 100644 index 0000000..ed45c38 --- /dev/null +++ b/src/layout/navBars/index.vue @@ -0,0 +1,35 @@ + + + + + diff --git a/src/layout/navBars/tagsView/contextmenu.vue b/src/layout/navBars/tagsView/contextmenu.vue new file mode 100644 index 0000000..f21fab4 --- /dev/null +++ b/src/layout/navBars/tagsView/contextmenu.vue @@ -0,0 +1,133 @@ + + + + + diff --git a/src/layout/navBars/tagsView/tagsView.vue b/src/layout/navBars/tagsView/tagsView.vue new file mode 100644 index 0000000..4533f49 --- /dev/null +++ b/src/layout/navBars/tagsView/tagsView.vue @@ -0,0 +1,733 @@ + + + + + diff --git a/src/layout/navBars/topBar/breadcrumb.vue b/src/layout/navBars/topBar/breadcrumb.vue new file mode 100644 index 0000000..80cc226 --- /dev/null +++ b/src/layout/navBars/topBar/breadcrumb.vue @@ -0,0 +1,145 @@ + + + + + diff --git a/src/layout/navBars/topBar/closeFull.vue b/src/layout/navBars/topBar/closeFull.vue new file mode 100644 index 0000000..418789a --- /dev/null +++ b/src/layout/navBars/topBar/closeFull.vue @@ -0,0 +1,53 @@ + + + + + diff --git a/src/layout/navBars/topBar/index.vue b/src/layout/navBars/topBar/index.vue new file mode 100644 index 0000000..2a805a2 --- /dev/null +++ b/src/layout/navBars/topBar/index.vue @@ -0,0 +1,107 @@ + + + + + diff --git a/src/layout/navBars/topBar/search.vue b/src/layout/navBars/topBar/search.vue new file mode 100644 index 0000000..116d01f --- /dev/null +++ b/src/layout/navBars/topBar/search.vue @@ -0,0 +1,123 @@ + + + + + diff --git a/src/layout/navBars/topBar/setings.vue b/src/layout/navBars/topBar/setings.vue new file mode 100644 index 0000000..0417535 --- /dev/null +++ b/src/layout/navBars/topBar/setings.vue @@ -0,0 +1,813 @@ + + + + + diff --git a/src/layout/navBars/topBar/user.vue b/src/layout/navBars/topBar/user.vue new file mode 100644 index 0000000..70376e8 --- /dev/null +++ b/src/layout/navBars/topBar/user.vue @@ -0,0 +1,245 @@ + + + + + diff --git a/src/layout/navBars/topBar/userNews.vue b/src/layout/navBars/topBar/userNews.vue new file mode 100644 index 0000000..0e0382d --- /dev/null +++ b/src/layout/navBars/topBar/userNews.vue @@ -0,0 +1,107 @@ + + + + + diff --git a/src/layout/navMenu/horizontal.vue b/src/layout/navMenu/horizontal.vue new file mode 100644 index 0000000..4f0d047 --- /dev/null +++ b/src/layout/navMenu/horizontal.vue @@ -0,0 +1,139 @@ + + + + + diff --git a/src/layout/navMenu/subItem.vue b/src/layout/navMenu/subItem.vue new file mode 100644 index 0000000..778c35e --- /dev/null +++ b/src/layout/navMenu/subItem.vue @@ -0,0 +1,48 @@ + + + diff --git a/src/layout/navMenu/vertical.vue b/src/layout/navMenu/vertical.vue new file mode 100644 index 0000000..1bf1d39 --- /dev/null +++ b/src/layout/navMenu/vertical.vue @@ -0,0 +1,102 @@ + + + diff --git a/src/layout/routerView/iframes.vue b/src/layout/routerView/iframes.vue new file mode 100644 index 0000000..127cc28 --- /dev/null +++ b/src/layout/routerView/iframes.vue @@ -0,0 +1,101 @@ +