Compare commits
82 Commits
pr@dev@per
...
v4.10.7-lt
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
2302da2c22 | ||
|
|
7b568ec84f | ||
|
|
73d6bda8c3 | ||
|
|
3934b45367 | ||
|
|
0c5e84d1e3 | ||
|
|
18a3f42717 | ||
|
|
68030d98b2 | ||
|
|
a861f77609 | ||
|
|
e58ec6057c | ||
|
|
7ab20c5885 | ||
|
|
e47ddb5355 | ||
|
|
56aa3caa83 | ||
|
|
19b1dc0dbc | ||
|
|
77ef172a23 | ||
|
|
4596887bf1 | ||
|
|
0a3dc30c85 | ||
|
|
51d24bc8e5 | ||
|
|
1b15a4d043 | ||
|
|
7d3f818242 | ||
|
|
4e26f18d77 | ||
|
|
b22613617a | ||
|
|
e971cbf4a8 | ||
|
|
4672abae35 | ||
|
|
ba36d72602 | ||
|
|
4bfbbba4c5 | ||
|
|
ea038ce43a | ||
|
|
e16b19666c | ||
|
|
c7f5409eb6 | ||
|
|
fdbd7d2222 | ||
|
|
ddbaeeafea | ||
|
|
efb0e9dacb | ||
|
|
f6f8301ad5 | ||
|
|
9a63ae63d4 | ||
|
|
1e007ccda3 | ||
|
|
d1d0b06b53 | ||
|
|
5fb70d2f24 | ||
|
|
b54a95430f | ||
|
|
4d8b4c45af | ||
|
|
a6d642df60 | ||
|
|
2e74f1522f | ||
|
|
fe615e0314 | ||
|
|
09f734e6fc | ||
|
|
3117046342 | ||
|
|
b68aecb5cc | ||
|
|
1c9b155d97 | ||
|
|
75b1be9864 | ||
|
|
615c3c1cf4 | ||
|
|
4d82231af4 | ||
|
|
c6cf6571b6 | ||
|
|
8ea990d070 | ||
|
|
f4a32170d5 | ||
|
|
073508675e | ||
|
|
1d6ca0a93a | ||
|
|
36aea652d6 | ||
|
|
1a42ce90ab | ||
|
|
31a401b55d | ||
|
|
582a84178d | ||
|
|
9b9f7c936c | ||
|
|
2a6100957f | ||
|
|
16606d6a27 | ||
|
|
0a612f50e6 | ||
|
|
fe36fa9390 | ||
|
|
ba109900ec | ||
|
|
ec7768267f | ||
|
|
cc58b374ab | ||
|
|
04ffbb8fd6 | ||
|
|
49880f6739 | ||
|
|
e6f98d58c4 | ||
|
|
fd1f16d43c | ||
|
|
968b2415b1 | ||
|
|
776090d6ba | ||
|
|
3a37952288 | ||
|
|
62b8fc0e3b | ||
|
|
b2028869cb | ||
|
|
5277a725f8 | ||
|
|
f137788c1a | ||
|
|
f7d17c8de7 | ||
|
|
feea70b0be | ||
|
|
04696ef3d6 | ||
|
|
1731f4f788 | ||
|
|
6f25d93909 | ||
|
|
46461ec324 |
@@ -294,8 +294,7 @@ module.exports = {
|
||||
],
|
||||
skipIfMatch: [
|
||||
'http://[^s]*',
|
||||
'^[-\\w]+/[-\\w\\.]+$',
|
||||
String.raw`^\/api\/[a-z0-9\/._-]+$`,
|
||||
'^[-\\w]+/[-\\w\\.]+$' // For import paths
|
||||
],
|
||||
minLength: 3
|
||||
}
|
||||
|
||||
@@ -1,57 +0,0 @@
|
||||
# Dependencies
|
||||
node_modules/
|
||||
dist/
|
||||
build/
|
||||
lina/
|
||||
|
||||
# Logs
|
||||
*.log
|
||||
logs/
|
||||
|
||||
# Runtime data
|
||||
pids/
|
||||
*.pid
|
||||
*.seed
|
||||
|
||||
# Coverage directory used by tools like istanbul
|
||||
coverage/
|
||||
|
||||
# Generated files
|
||||
*.min.js
|
||||
*.min.css
|
||||
|
||||
# Package files
|
||||
*.tgz
|
||||
*.tar.gz
|
||||
|
||||
# Lock files
|
||||
package-lock.json
|
||||
yarn.lock
|
||||
|
||||
# Build outputs
|
||||
*.map
|
||||
|
||||
# Config files that shouldn't be formatted
|
||||
.eslintrc.js
|
||||
babel.config.js
|
||||
jest.config.js
|
||||
vue.config.js
|
||||
postcss.config.js
|
||||
|
||||
# Theme files
|
||||
src/styles/fonts/
|
||||
public/fonts/
|
||||
lina/fonts/
|
||||
|
||||
# Assets
|
||||
src/assets/
|
||||
public/
|
||||
|
||||
# Mock data
|
||||
mock/
|
||||
|
||||
# Test files
|
||||
tests/
|
||||
|
||||
# Documentation
|
||||
*.md
|
||||
11
.prettierrc
Normal file
@@ -0,0 +1,11 @@
|
||||
{
|
||||
"printWidth": 100,
|
||||
"tabWidth": 2,
|
||||
"useTabs": false,
|
||||
"singleQuote": true,
|
||||
"semi": false,
|
||||
"trailingComma": "none",
|
||||
"bracketSpacing": true,
|
||||
"arrowParens": "avoid",
|
||||
"endOfLine": "lf"
|
||||
}
|
||||
@@ -1,4 +1,4 @@
|
||||
FROM jumpserver/lina-base:20251105_092554 AS stage-build
|
||||
FROM jumpserver/lina-base:20250805_081024 AS stage-build
|
||||
|
||||
ARG VERSION
|
||||
ENV VERSION=$VERSION
|
||||
|
||||
76
PRETTIER.md
@@ -1,76 +0,0 @@
|
||||
# Prettier 配置说明
|
||||
|
||||
本项目已配置 Prettier 代码格式化工具,**仅在保存时自动格式化**,不进行批量格式化,以保持现有代码风格。
|
||||
|
||||
## 配置文件
|
||||
|
||||
- `.prettierrc` - Prettier 配置文件
|
||||
- `.prettierignore` - 忽略格式化的文件列表
|
||||
- `.vscode/settings.json` - VSCode 编辑器配置(保存时自动格式化)
|
||||
- `.vscode/extensions.json` - 推荐的 VSCode 扩展
|
||||
|
||||
## 使用方法
|
||||
|
||||
### 1. 安装依赖
|
||||
项目已安装以下依赖:
|
||||
- `prettier@^2.8.8` - Prettier 核心
|
||||
- `eslint-plugin-prettier@^3.1.4` - ESLint 与 Prettier 集成
|
||||
- `eslint-config-prettier@^6.15.0` - 禁用与 Prettier 冲突的 ESLint 规则
|
||||
|
||||
### 2. 命令行使用
|
||||
|
||||
```bash
|
||||
# ESLint 检查和修复
|
||||
npm run fix
|
||||
```
|
||||
|
||||
**注意**:本项目配置为仅在保存时自动格式化,不提供批量格式化命令。
|
||||
|
||||
### 3. VSCode 编辑器配置
|
||||
|
||||
确保安装了推荐的扩展:
|
||||
- Prettier - Code formatter (esbenp.prettier-vscode)
|
||||
- ESLint (dbaeumer.vscode-eslint)
|
||||
- Vetur (octref.vetur)
|
||||
|
||||
配置已设置为保存时自动格式化。
|
||||
|
||||
### 4. Git 提交钩子
|
||||
|
||||
项目使用 `husky` 和 `lint-staged` 在提交时进行代码检查:
|
||||
- 提交时运行 ESLint 检查和修复
|
||||
- 不进行批量格式化,保持原有代码风格
|
||||
|
||||
## Prettier 配置说明
|
||||
|
||||
```json
|
||||
{
|
||||
"semi": false, // 不使用分号
|
||||
"singleQuote": true, // 使用单引号
|
||||
"tabWidth": 0, // 不使用缩进
|
||||
"useTabs": false, // 使用空格而不是制表符
|
||||
"trailingComma": "none", // 不使用尾随逗号
|
||||
"printWidth": 100, // 行宽 100 字符
|
||||
"bracketSpacing": true, // 对象括号内有空格
|
||||
"arrowParens": "avoid", // 箭头函数单参数时不使用括号
|
||||
"endOfLine": "lf", // 使用 LF 换行符
|
||||
"vueIndentScriptAndStyle": false // Vue 文件中 script 和 style 标签不缩进
|
||||
}
|
||||
```
|
||||
|
||||
## 常见问题
|
||||
|
||||
### Q: 如何临时禁用格式化?
|
||||
A: 使用注释:
|
||||
```javascript
|
||||
// prettier-ignore
|
||||
const uglyCode = {
|
||||
a:1,b:2
|
||||
}
|
||||
```
|
||||
|
||||
### Q: 如何添加文件到忽略列表?
|
||||
A: 编辑 `.prettierignore` 文件,添加文件或目录路径。
|
||||
|
||||
### Q: VSCode 保存时没有自动格式化?
|
||||
A: 检查是否安装了 Prettier 扩展,并确认 `.vscode/settings.json` 配置正确。
|
||||
290
package.json
@@ -1,144 +1,150 @@
|
||||
{
|
||||
"name": "lina",
|
||||
"version": "v4.0.0",
|
||||
"description": "JumpServer Web UI",
|
||||
"author": "JumpServer Team <support@lxware.hk>",
|
||||
"license": "GPL-3.0-or-later",
|
||||
"scripts": {
|
||||
"dev": "NODE_OPTIONS=--openssl-legacy-provider vue-cli-service serve",
|
||||
"serve": "NODE_OPTIONS=--openssl-legacy-provider vue-cli-service serve",
|
||||
"build": "NODE_OPTIONS=--openssl-legacy-provider vue-cli-service build",
|
||||
"build:prod": "vue-cli-service build",
|
||||
"build:stage": "vue-cli-service build --mode staging",
|
||||
"preview": "node build/index.js --preview",
|
||||
"lint": "eslint --ext .js,.vue src",
|
||||
"fix": "eslint --ext .js,.vue --fix src",
|
||||
"test:unit": "jest --clearCache && vue-cli-service test:unit",
|
||||
"test:ci": "npm run lint && npm run test:unit",
|
||||
"svgo": "svgo -f src/icons/svg --config=src/icas/svgo.yml",
|
||||
"vue-i18n-extract": "vue-i18n-extract",
|
||||
"vue-i18n-report": "vue-i18n-extract report -v './src/**/*.?(js|vue)' -l './src/i18n/langs/**/*.json'",
|
||||
"vue-i18n-report-json": "vue-i18n-extract report -v './src/**/*.?(js|vue)' -l './src/i18n/langs/**/*.json' -o /tmp/abc.json",
|
||||
"vue-i18n-report-add-miss": "vue-i18n-extract report -v './src/**/*.?(js|vue)' -l './src/i18n/langs/**/*.json' -a",
|
||||
"diff-i18n": "python ./src/i18n/langs/i18n-util.py diff en ja zh_Hant",
|
||||
"apply-i18n": "python ./src/i18n/langs/i18n-util.py apply en ja zh_Hant"
|
||||
},
|
||||
"dependencies": {
|
||||
"@babel/plugin-proposal-optional-chaining": "^7.13.12",
|
||||
"@fontsource/open-sans": "^5.0.24",
|
||||
"@kangc/v-md-editor": "^1.7.12",
|
||||
"@traptitech/markdown-it-katex": "^3.6.0",
|
||||
"@ztree/ztree_v3": "3.5.44",
|
||||
"axios": "0.28.0",
|
||||
"axios-retry": "^3.1.9",
|
||||
"babel-loader": "^10.0.0",
|
||||
"cache-loader": "^4.1.0",
|
||||
"caniuse-lite": "^1.0.30001642",
|
||||
"cron-parser": "^4.0.0",
|
||||
"crypto-js": "^4.1.1",
|
||||
"css-color-function": "^1.3.3",
|
||||
"decimal.js": "^10.4.3",
|
||||
"deepmerge": "^4.2.2",
|
||||
"dompurify": "^3.2.4",
|
||||
"echarts": "4.7.0",
|
||||
"element-ui": "https://github.com/jumpserver-dev/element/releases/download/v2.15.15/jumpserver-element-ui-2.15.15.tgz",
|
||||
"eslint-plugin-html": "^6.0.0",
|
||||
"highlight.js": "^11.9.0",
|
||||
"install": "^0.13.0",
|
||||
"jquery": "^3.6.1",
|
||||
"js-cookie": "2.2.0",
|
||||
"jsencrypt": "^3.2.1",
|
||||
"less": "^3.10.3",
|
||||
"less-loader": "^5.0.0",
|
||||
"lodash": "^4.17.21",
|
||||
"markdown-it": "^13.0.2",
|
||||
"markdown-it-link-attributes": "^4.0.1",
|
||||
"moment": "^2.29.4",
|
||||
"moment-parseformat": "^4.0.0",
|
||||
"normalize.css": "7.0.0",
|
||||
"npm": "^7.8.0",
|
||||
"nprogress": "0.2.0",
|
||||
"path-to-regexp": "3.3.0",
|
||||
"sortablejs": "^1.15.6",
|
||||
"v-sanitize": "^0.0.13",
|
||||
"vue": "2.7.16",
|
||||
"vue-codemirror": "4.0.6",
|
||||
"vue-cookie": "^1.1.4",
|
||||
"vue-echarts": "^5.0.0-beta.0",
|
||||
"vue-i18n": "^8.15.5",
|
||||
"vue-json-editor": "^1.4.3",
|
||||
"vue-markdown": "^2.2.4",
|
||||
"vue-password-strength-meter": "^1.7.2",
|
||||
"vue-router": "3.0.6",
|
||||
"vue-select": "^3.9.5",
|
||||
"vuejs-logger": "^1.5.4",
|
||||
"vuex": "3.1.0",
|
||||
"watermark-js-plus": "^1.5.8",
|
||||
"xss": "^1.0.14",
|
||||
"xterm": "^4.5.0",
|
||||
"xterm-addon-fit": "^0.3.0",
|
||||
"zxcvbn": "^4.4.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "7.18.6",
|
||||
"@babel/register": "7.0.0",
|
||||
"@vue/cli-plugin-babel": "3.6.0",
|
||||
"@vue/cli-plugin-eslint": "^3.9.1",
|
||||
"@vue/cli-plugin-unit-jest": "3.6.3",
|
||||
"@vue/cli-service": "3.6.0",
|
||||
"@vue/test-utils": "1.0.0-beta.29",
|
||||
"autoprefixer": "^9.5.1",
|
||||
"babel-core": "6.26.3",
|
||||
"babel-eslint": "10.0.1",
|
||||
"babel-jest": "23.6.0",
|
||||
"chalk": "2.4.2",
|
||||
"compression-webpack-plugin": "^6.1.1",
|
||||
"connect": "3.6.6",
|
||||
"deasync": "^0.1.29",
|
||||
"eslint": "^5.15.3",
|
||||
"eslint-config-prettier": "^6.15.0",
|
||||
"eslint-plugin-prettier": "^3.4.1",
|
||||
"eslint-plugin-spellcheck": "^0.0.20",
|
||||
"eslint-plugin-vue": "5.2.2",
|
||||
"eslint-plugin-vue-i18n": "^0.3.0",
|
||||
"github-markdown-css": "^5.1.0",
|
||||
"html-webpack-plugin": "3.2.0",
|
||||
"husky": "^4.2.3",
|
||||
"less-loader": "^5.0.0",
|
||||
"lint-staged": "^10.1.2",
|
||||
"mockjs": "1.0.1-beta3",
|
||||
"prettier": "^3.6.2",
|
||||
"pretty-bytes": "^5.6.0",
|
||||
"runjs": "^4.3.2",
|
||||
"sass": "~1.32.6",
|
||||
"sass-loader": "^7.1.0",
|
||||
"script-ext-html-webpack-plugin": "2.1.3",
|
||||
"script-loader": "0.7.2",
|
||||
"serve-static": "^1.16.0",
|
||||
"strip-ansi": "^7.1.0",
|
||||
"svg-sprite-loader": "4.1.3",
|
||||
"svgo": "1.2.2",
|
||||
"vue-i18n-extract": "^1.1.1",
|
||||
"vue-template-compiler": "2.7.16",
|
||||
"webpack": "^4.28.4"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12",
|
||||
"npm": ">= 3.0.0"
|
||||
},
|
||||
"browserslist": [
|
||||
"> 1%",
|
||||
"last 4 versions",
|
||||
"ie 11"
|
||||
],
|
||||
"husky": {
|
||||
"hooks": {
|
||||
"pre-commit": "lint-staged"
|
||||
}
|
||||
},
|
||||
"lint-staged": {
|
||||
"src/**/*.{js,vue}": [
|
||||
"eslint --fix"
|
||||
]
|
||||
}
|
||||
"name": "lina",
|
||||
"version": "v4.0.0",
|
||||
"description": "JumpServer Web UI",
|
||||
"author": "JumpServer Team <support@lxware.hk>",
|
||||
"license": "GPL-3.0-or-later",
|
||||
"scripts": {
|
||||
"dev": "NODE_OPTIONS=--openssl-legacy-provider vue-cli-service serve",
|
||||
"serve": "NODE_OPTIONS=--openssl-legacy-provider vue-cli-service serve",
|
||||
"build": "NODE_OPTIONS=--openssl-legacy-provider vue-cli-service build",
|
||||
"build:prod": "vue-cli-service build",
|
||||
"build:stage": "vue-cli-service build --mode staging",
|
||||
"preview": "node build/index.js --preview",
|
||||
"lint": "eslint --ext .js,.vue src",
|
||||
"fix": "eslint --ext .js,.vue --fix src",
|
||||
"test:unit": "jest --clearCache && vue-cli-service test:unit",
|
||||
"test:ci": "npm run lint && npm run test:unit",
|
||||
"svgo": "svgo -f src/icons/svg --config=src/icas/svgo.yml",
|
||||
"vue-i18n-extract": "vue-i18n-extract",
|
||||
"vue-i18n-report": "vue-i18n-extract report -v './src/**/*.?(js|vue)' -l './src/i18n/langs/**/*.json'",
|
||||
"vue-i18n-report-json": "vue-i18n-extract report -v './src/**/*.?(js|vue)' -l './src/i18n/langs/**/*.json' -o /tmp/abc.json",
|
||||
"vue-i18n-report-add-miss": "vue-i18n-extract report -v './src/**/*.?(js|vue)' -l './src/i18n/langs/**/*.json' -a",
|
||||
"diff-i18n": "python ./src/i18n/langs/i18n-util.py diff en ja zh_Hant",
|
||||
"apply-i18n": "python ./src/i18n/langs/i18n-util.py apply en ja zh_Hant"
|
||||
},
|
||||
"dependencies": {
|
||||
"@babel/plugin-proposal-optional-chaining": "^7.13.12",
|
||||
"@fontsource/open-sans": "^5.0.24",
|
||||
"@traptitech/markdown-it-katex": "^3.6.0",
|
||||
"@ztree/ztree_v3": "3.5.44",
|
||||
"axios": "0.28.0",
|
||||
"axios-retry": "^3.1.9",
|
||||
"caniuse-lite": "^1.0.30001642",
|
||||
"cron-parser": "^4.0.0",
|
||||
"crypto-js": "^4.1.1",
|
||||
"css-color-function": "^1.3.3",
|
||||
"decimal.js": "^10.4.3",
|
||||
"deepmerge": "^4.2.2",
|
||||
"dompurify": "^3.1.6",
|
||||
"echarts": "4.7.0",
|
||||
"element-ui": "^2.15.14",
|
||||
"elementui-lts": "^2.16.0",
|
||||
"eslint-plugin-html": "^6.0.0",
|
||||
"highlight.js": "^11.9.0",
|
||||
"install": "^0.13.0",
|
||||
"jquery": "^3.6.1",
|
||||
"js-cookie": "2.2.0",
|
||||
"jsencrypt": "^3.2.1",
|
||||
"less": "^3.10.3",
|
||||
"less-loader": "^5.0.0",
|
||||
"lodash": "^4.17.21",
|
||||
"lodash.clonedeep": "^4.5.0",
|
||||
"lodash.frompairs": "^4.0.1",
|
||||
"lodash.get": "^4.4.2",
|
||||
"lodash.has": "^4.5.2",
|
||||
"lodash.includes": "^4.3.0",
|
||||
"lodash.isempty": "^4.4.0",
|
||||
"lodash.isequal": "^4.5.0",
|
||||
"lodash.isplainobject": "^4.0.6",
|
||||
"lodash.set": "^4.3.2",
|
||||
"lodash.topairs": "^4.3.0",
|
||||
"lodash.values": "^4.3.0",
|
||||
"markdown-it": "^13.0.2",
|
||||
"markdown-it-link-attributes": "^4.0.1",
|
||||
"moment": "^2.29.4",
|
||||
"moment-parseformat": "^4.0.0",
|
||||
"normalize.css": "7.0.0",
|
||||
"npm": "^7.8.0",
|
||||
"nprogress": "0.2.0",
|
||||
"path-to-regexp": "3.3.0",
|
||||
"sortablejs": "^1.15.6",
|
||||
"v-sanitize": "^0.0.13",
|
||||
"vue": "2.6.10",
|
||||
"vue-codemirror": "4.0.6",
|
||||
"vue-cookie": "^1.1.4",
|
||||
"vue-echarts": "^5.0.0-beta.0",
|
||||
"vue-i18n": "^8.15.5",
|
||||
"vue-json-editor": "^1.4.3",
|
||||
"vue-markdown": "^2.2.4",
|
||||
"vue-password-strength-meter": "^1.7.2",
|
||||
"vue-router": "3.0.6",
|
||||
"vue-select": "^3.9.5",
|
||||
"vuejs-logger": "^1.5.4",
|
||||
"vuex": "3.1.0",
|
||||
"watermark-js-plus": "^1.5.8",
|
||||
"xss": "^1.0.14",
|
||||
"xterm": "^4.5.0",
|
||||
"xterm-addon-fit": "^0.3.0",
|
||||
"zxcvbn": "^4.4.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "7.18.6",
|
||||
"@babel/register": "7.0.0",
|
||||
"@vue/cli-plugin-babel": "3.6.0",
|
||||
"@vue/cli-plugin-eslint": "^3.9.1",
|
||||
"@vue/cli-plugin-unit-jest": "3.6.3",
|
||||
"@vue/cli-service": "3.6.0",
|
||||
"@vue/test-utils": "1.0.0-beta.29",
|
||||
"autoprefixer": "^9.5.1",
|
||||
"babel-core": "7.0.0-bridge.0",
|
||||
"babel-eslint": "10.0.1",
|
||||
"babel-jest": "23.6.0",
|
||||
"chalk": "2.4.2",
|
||||
"compression-webpack-plugin": "^6.1.1",
|
||||
"connect": "3.6.6",
|
||||
"deasync": "^0.1.29",
|
||||
"eslint": "^5.15.3",
|
||||
"eslint-plugin-spellcheck": "^0.0.20",
|
||||
"eslint-plugin-vue": "5.2.2",
|
||||
"eslint-plugin-vue-i18n": "^0.3.0",
|
||||
"github-markdown-css": "^5.1.0",
|
||||
"html-webpack-plugin": "3.2.0",
|
||||
"husky": "^4.2.3",
|
||||
"less-loader": "^5.0.0",
|
||||
"lint-staged": "^10.1.2",
|
||||
"mockjs": "1.0.1-beta3",
|
||||
"pretty-bytes": "^5.6.0",
|
||||
"runjs": "^4.3.2",
|
||||
"sass": "~1.32.6",
|
||||
"sass-loader": "^7.1.0",
|
||||
"script-ext-html-webpack-plugin": "2.1.3",
|
||||
"script-loader": "0.7.2",
|
||||
"serve-static": "^1.16.0",
|
||||
"strip-ansi": "^7.1.0",
|
||||
"svg-sprite-loader": "4.1.3",
|
||||
"svgo": "1.2.2",
|
||||
"vue-i18n-extract": "^1.1.1",
|
||||
"vue-template-compiler": "2.6.10"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8.9",
|
||||
"npm": ">= 3.0.0"
|
||||
},
|
||||
"browserslist": [
|
||||
"> 1%",
|
||||
"last 4 versions",
|
||||
"ie 11"
|
||||
],
|
||||
"husky": {
|
||||
"hooks": {
|
||||
"pre-commit": "lint-staged"
|
||||
}
|
||||
},
|
||||
"lint-staged": {
|
||||
"src/**/*.{js,vue}": [
|
||||
"eslint --fix"
|
||||
]
|
||||
},
|
||||
"packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
|
||||
}
|
||||
|
||||
@@ -61,14 +61,13 @@ export function stopJob(form) {
|
||||
})
|
||||
}
|
||||
|
||||
export function JobUploadFile(form, config = {}) {
|
||||
export function JobUploadFile(form) {
|
||||
return request({
|
||||
url: '/api/v1/ops/jobs/upload/',
|
||||
method: 'post',
|
||||
headers: { 'Content-Type': 'multipart/form-data' },
|
||||
timeout: 60 * 60 * 1000,
|
||||
data: form,
|
||||
...config
|
||||
data: form
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
@@ -18,14 +18,14 @@ export function toggleLockSession(data) {
|
||||
|
||||
export function getAllCommandStorage() {
|
||||
return request({
|
||||
url: '/api/v1/terminal/command-storages/',
|
||||
url: `/api/v1/terminal/command-storages/`,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
export function getAllReplayStorage() {
|
||||
return request({
|
||||
url: '/api/v1/terminal/replay-storages/',
|
||||
url: `/api/v1/terminal/replay-storages/`,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
|
Before Width: | Height: | Size: 8.5 KiB After Width: | Height: | Size: 55 KiB |
|
Before Width: | Height: | Size: 16 KiB After Width: | Height: | Size: 584 KiB |
|
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 110 KiB |
|
Before Width: | Height: | Size: 22 KiB After Width: | Height: | Size: 1.4 MiB |
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 55 KiB |
|
Before Width: | Height: | Size: 210 KiB |
@@ -15,25 +15,10 @@ export const accountFieldsMeta = (vm) => {
|
||||
}
|
||||
|
||||
return {
|
||||
nodes: {
|
||||
component: Select2,
|
||||
label: vm.$t('Node'),
|
||||
el: {
|
||||
value: [],
|
||||
ajax: {
|
||||
url: '/api/v1/assets/nodes/',
|
||||
transformOption: (item) => {
|
||||
return { label: item.full_value, value: item.id }
|
||||
}
|
||||
}
|
||||
},
|
||||
hidden: () => {
|
||||
return !vm.addTemplate
|
||||
}
|
||||
},
|
||||
assets: {
|
||||
component: AssetSelect,
|
||||
label: vm.$t('Asset'),
|
||||
rules: [Required],
|
||||
el: {
|
||||
multiple: false
|
||||
},
|
||||
@@ -48,7 +33,7 @@ export const accountFieldsMeta = (vm) => {
|
||||
get disabled() {
|
||||
return vm.isDisabled
|
||||
},
|
||||
multiple: vm.addTemplate,
|
||||
multiple: false,
|
||||
ajax: {
|
||||
url: '/api/v1/accounts/account-templates/',
|
||||
transformOption: (item) => {
|
||||
|
||||
@@ -63,7 +63,7 @@ export default {
|
||||
encryptedFields: ['secret'],
|
||||
fields: [
|
||||
[this.$t('Basic'), ['name', 'username', 'privileged', 'su_from', 'su_from_username', 'template']],
|
||||
[this.$t('Asset'), ['nodes', 'assets']],
|
||||
[this.$t('Asset'), ['assets']],
|
||||
[this.$t('Secret'), [
|
||||
'secret_type', 'password', 'ssh_key', 'token',
|
||||
'access_key', 'passphrase', 'api_key',
|
||||
|
||||
@@ -93,8 +93,8 @@ export default {
|
||||
iVisible = true
|
||||
data = formValue
|
||||
url = `/api/v1/accounts/accounts/bulk/`
|
||||
if ((!data.assets || data.assets.length === 0) && (!data.nodes || data.nodes.length === 0)) {
|
||||
this.$message.error(this.$tc('PleaseSelectAssetOrNode'))
|
||||
if (data.assets.length === 0) {
|
||||
this.$message.error(this.$tc('PleaseSelectAsset'))
|
||||
return
|
||||
}
|
||||
}
|
||||
@@ -107,10 +107,6 @@ export default {
|
||||
this.$emit('add', true)
|
||||
}
|
||||
}).catch(error => {
|
||||
if (error?.response?.data?.code === 'no_valid_assets') {
|
||||
this.$message.error(error?.response?.data?.detail)
|
||||
return
|
||||
}
|
||||
this.iVisible = true
|
||||
this.handleResult(null, error)
|
||||
})
|
||||
|
||||
@@ -49,10 +49,6 @@ export default {
|
||||
prop: 'asset',
|
||||
label: this.$t('Asset')
|
||||
},
|
||||
{
|
||||
prop: 'account',
|
||||
label: this.$t('Account')
|
||||
},
|
||||
{
|
||||
prop: 'state',
|
||||
label: this.$t('Status'),
|
||||
|
||||
@@ -13,8 +13,6 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { BASE_URL } from '@/utils/common/index'
|
||||
|
||||
export default {
|
||||
props: {
|
||||
active: {
|
||||
@@ -43,16 +41,6 @@ export default {
|
||||
},
|
||||
handleExpand() {
|
||||
this.$emit('expand-full')
|
||||
},
|
||||
async openWebsite() {
|
||||
let url = `${BASE_URL}/?_=${Date.now()}`
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
url = url.replace('9528', '5173')
|
||||
}
|
||||
|
||||
const newUrl = new URL(url)
|
||||
window.open(newUrl.toString(), '_blank')
|
||||
return url
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -109,6 +109,11 @@ export default {
|
||||
},
|
||||
connectivity: connectivityMeta,
|
||||
comment: { ...this.comment }
|
||||
},
|
||||
tableAttrs: {
|
||||
rowClassName({ row }) {
|
||||
return !row.is_active ? 'row_disabled' : ''
|
||||
}
|
||||
}
|
||||
},
|
||||
headerActions: {
|
||||
|
||||
@@ -37,12 +37,8 @@ export default {
|
||||
|
||||
},
|
||||
headerActions: {
|
||||
hasExport: true,
|
||||
hasImport: true,
|
||||
importOptions: {
|
||||
encryptFields: [''], // 这里不加密 password,''只是为了保证数组有值
|
||||
canImportUpdate: false
|
||||
},
|
||||
hasExport: false,
|
||||
hasImport: false,
|
||||
hasCreate: true,
|
||||
hasSearch: true,
|
||||
hasRefresh: true,
|
||||
|
||||
@@ -25,7 +25,6 @@ export default {
|
||||
},
|
||||
data() {
|
||||
const [key, value] = toM2MJsonParams(this.object.assets)
|
||||
const org_id = this.object.org_id || this.$store.getters.currentOrg.id
|
||||
return {
|
||||
config: {
|
||||
headerActions: {
|
||||
@@ -34,7 +33,7 @@ export default {
|
||||
hasExport: false
|
||||
},
|
||||
tableConfig: {
|
||||
url: `/api/v1/assets/assets/?${key}=${value}&oid=${org_id}`,
|
||||
url: `/api/v1/assets/assets/?${key}=${value}`,
|
||||
columns: ['name', 'address', 'platform', 'type', 'is_active'],
|
||||
columnsShow: {
|
||||
min: ['name', 'address'],
|
||||
|
||||
@@ -25,7 +25,6 @@ export default {
|
||||
},
|
||||
data() {
|
||||
const [key, value] = toM2MJsonParams(this.object.users)
|
||||
const org_id = this.object.org_id || this.$store.getters.currentOrg.id
|
||||
return {
|
||||
config: {
|
||||
headerActions: {
|
||||
@@ -34,7 +33,7 @@ export default {
|
||||
hasExport: false
|
||||
},
|
||||
tableConfig: {
|
||||
url: `/api/v1/users/users/?${key}=${value}&oid=${org_id}`,
|
||||
url: `/api/v1/users/users/?${key}=${value}`,
|
||||
columns: [
|
||||
'name', 'username', 'email', 'groups', 'system_roles',
|
||||
'org_roles', 'source', 'is_valid'
|
||||
|
||||
@@ -13,12 +13,17 @@
|
||||
v-on="$listeners"
|
||||
>
|
||||
<div v-if="confirmTypeRequired === 'relogin'">
|
||||
<el-row :gutter="24" style="margin: 0 auto">
|
||||
<el-row :gutter="24" style="margin: 0 auto;">
|
||||
<el-col :md="24" :sm="24">
|
||||
<el-alert :title="$tc('ReLoginTitle')" center style="margin-bottom: 20px" type="error" />
|
||||
<el-alert
|
||||
:title="$tc('ReLoginTitle')"
|
||||
center
|
||||
style="margin-bottom: 20px;"
|
||||
type="error"
|
||||
/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24" style="margin: 0 auto">
|
||||
<el-row :gutter="24" style="margin: 0 auto;">
|
||||
<el-col :md="24" :sm="24">
|
||||
<el-button class="confirm-btn" size="mini" type="primary" @click="logout">
|
||||
{{ this.$t('ReLogin') }}
|
||||
@@ -27,11 +32,11 @@
|
||||
</el-row>
|
||||
</div>
|
||||
<div v-else>
|
||||
<el-row :gutter="24" style="margin: 0 auto">
|
||||
<el-row :gutter="24" style="margin: 0 auto;">
|
||||
<el-col :md="24" :sm="24" :span="24" class="add">
|
||||
<el-select
|
||||
v-model="subTypeSelected"
|
||||
style="width: 100%; margin-bottom: 20px"
|
||||
style="width: 100%; margin-bottom: 20px;"
|
||||
@change="handleSubTypeChange"
|
||||
>
|
||||
<el-option
|
||||
@@ -44,22 +49,19 @@
|
||||
</el-select>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="!noCodeMFA.includes(subTypeSelected)" :gutter="24" style="margin: 0 auto">
|
||||
<el-col :md="24" :sm="24" style="display: flex; align-items: center">
|
||||
<el-row v-if="!noCodeMFA.includes(subTypeSelected)" :gutter="24" style="margin: 0 auto;">
|
||||
<el-col :md="24" :sm="24" style="display: flex; align-items: center; ">
|
||||
<el-input
|
||||
v-model="secretValue"
|
||||
:placeholder="inputPlaceholder"
|
||||
:show-password="showPassword"
|
||||
@keyup.enter.native="handleConfirm"
|
||||
/>
|
||||
<span
|
||||
v-if="subTypeSelected === 'sms' || subTypeSelected === 'email'"
|
||||
style="margin: -1px 0 0 20px"
|
||||
>
|
||||
<span v-if="subTypeSelected === 'sms' || subTypeSelected === 'email'" style="margin: -1px 0 0 20px;">
|
||||
<el-button
|
||||
:disabled="smsBtnDisabled"
|
||||
size="mini"
|
||||
style="line-height: 14px; float: right"
|
||||
style="line-height: 14px; float: right;"
|
||||
type="primary"
|
||||
@click="sendCode"
|
||||
>
|
||||
@@ -70,17 +72,21 @@
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col>
|
||||
<iframe v-if="passkeyVisible" :src="passkeyUrl" style="display: none" />
|
||||
<iframe
|
||||
v-if="isFaceCaptureVisible && subTypeSelected === 'face' && faceCaptureUrl"
|
||||
v-if="passkeyVisible"
|
||||
:src="passkeyUrl"
|
||||
style="display: none"
|
||||
/>
|
||||
<iframe
|
||||
v-if="isFaceCaptureVisible && subTypeSelected ==='face' && faceCaptureUrl"
|
||||
:src="faceCaptureUrl"
|
||||
allow="camera"
|
||||
sandbox="allow-scripts allow-same-origin"
|
||||
style="width: 100%; height: 600px; border: none"
|
||||
style="width: 100%; height: 600px;border: none;"
|
||||
/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24" style="margin: 20px auto 10px">
|
||||
<el-row :gutter="24" style="margin: 20px auto 10px;">
|
||||
<el-col :md="24" :sm="24">
|
||||
<el-button
|
||||
v-if="!noCodeMFA.includes(subTypeSelected)"
|
||||
@@ -189,65 +195,55 @@ export default {
|
||||
this.$log.debug('perform confirm action')
|
||||
const confirmType = response.data?.code
|
||||
const confirmUrl = '/api/v1/authentication/confirm/'
|
||||
this.$axios
|
||||
.get(confirmUrl, { params: { confirm_type: confirmType } })
|
||||
.then(data => {
|
||||
this.confirmTypeRequired = data.confirm_type
|
||||
this.$axios.get(confirmUrl, { params: { confirm_type: confirmType } }).then((data) => {
|
||||
this.confirmTypeRequired = data.confirm_type
|
||||
|
||||
if (this.confirmTypeRequired === 'relogin') {
|
||||
this.$axios
|
||||
.post(confirmUrl, { confirm_type: 'relogin', secret_key: 'x' })
|
||||
.then(() => {
|
||||
this.callback()
|
||||
this.visible = false
|
||||
})
|
||||
.catch(() => {
|
||||
this.title = this.$t('NeedReLogin')
|
||||
this.visible = true
|
||||
})
|
||||
return
|
||||
}
|
||||
this.subTypeChoices = data.content
|
||||
const defaultSubType = this.subTypeChoices.filter(item => !item.disabled)[0]
|
||||
this.subTypeSelected = defaultSubType.name
|
||||
this.inputPlaceholder = defaultSubType.placeholder
|
||||
this.visible = true
|
||||
})
|
||||
.catch(err => {
|
||||
const data = err.response?.data
|
||||
const msg = data?.error || data?.detail || data?.msg || this.$t('GetConfirmTypeFailed')
|
||||
this.$message.error(msg)
|
||||
this.cancel(err)
|
||||
})
|
||||
.finally(() => {
|
||||
this.processing = false
|
||||
})
|
||||
if (this.confirmTypeRequired === 'relogin') {
|
||||
this.$axios.post(confirmUrl, { 'confirm_type': 'relogin', 'secret_key': 'x' }).then(() => {
|
||||
this.callback()
|
||||
this.visible = false
|
||||
}).catch(() => {
|
||||
this.title = this.$t('NeedReLogin')
|
||||
this.visible = true
|
||||
})
|
||||
return
|
||||
}
|
||||
this.subTypeChoices = data.content
|
||||
const defaultSubType = this.subTypeChoices.filter(item => !item.disabled)[0]
|
||||
this.subTypeSelected = defaultSubType.name
|
||||
this.inputPlaceholder = defaultSubType.placeholder
|
||||
this.visible = true
|
||||
}).catch((err) => {
|
||||
const data = err.response?.data
|
||||
const msg = data?.error || data?.detail || data?.msg || this.$t('GetConfirmTypeFailed')
|
||||
this.$message.error(msg)
|
||||
this.cancel(err)
|
||||
}).finally(() => {
|
||||
this.processing = false
|
||||
})
|
||||
}, 500),
|
||||
logout() {
|
||||
window.location.href = `${process.env.VUE_APP_LOGOUT_PATH}?next=${this.$route.fullPath}`
|
||||
},
|
||||
sendCode() {
|
||||
this.$axios
|
||||
.post(`/api/v1/authentication/mfa/select/`, { type: this.subTypeSelected })
|
||||
.then(res => {
|
||||
this.$message.success(this.$tc('VerificationCodeSent'))
|
||||
let time = 60
|
||||
this.smsBtnDisabled = true
|
||||
this.$axios.post(`/api/v1/authentication/mfa/select/`, { type: this.subTypeSelected }).then(res => {
|
||||
this.$message.success(this.$tc('VerificationCodeSent'))
|
||||
let time = 60
|
||||
this.smsBtnDisabled = true
|
||||
|
||||
const interval = setInterval(() => {
|
||||
time -= 1
|
||||
this.smsBtnText = `${this.$t('Pending')}: ${time}`
|
||||
const interval = setInterval(() => {
|
||||
time -= 1
|
||||
this.smsBtnText = `${this.$t('Pending')}: ${time}`
|
||||
|
||||
if (time <= 0) {
|
||||
clearInterval(interval)
|
||||
this.smsBtnText = this.$t('SendVerificationCode')
|
||||
this.smsBtnDisabled = false
|
||||
}
|
||||
}, 1000)
|
||||
})
|
||||
.catch(() => {
|
||||
this.$message.error(this.$tc('FailedToSendVerificationCode'))
|
||||
})
|
||||
if (time <= 0) {
|
||||
clearInterval(interval)
|
||||
this.smsBtnText = this.$t('SendVerificationCode')
|
||||
this.smsBtnDisabled = false
|
||||
}
|
||||
}, 1000)
|
||||
}).catch(() => {
|
||||
this.$message.error(this.$tc('FailedToSendVerificationCode'))
|
||||
})
|
||||
},
|
||||
handlePasskeyVerify() {
|
||||
this.passkeyVisible = true
|
||||
@@ -271,26 +267,23 @@ export default {
|
||||
},
|
||||
startFaceCapture() {
|
||||
const url = '/api/v1/authentication/face/context/'
|
||||
this.$axios
|
||||
.post(url)
|
||||
.then(data => {
|
||||
const token = data['token']
|
||||
this.faceCaptureUrl = '/facelive/capture?token=' + token
|
||||
this.isFaceCaptureVisible = true
|
||||
this.$axios.post(url).then(data => {
|
||||
const token = data['token']
|
||||
this.faceCaptureUrl = '/facelive/capture?token=' + token
|
||||
this.isFaceCaptureVisible = true
|
||||
|
||||
const timer = setInterval(() => {
|
||||
this.$axios.get(url + `?token=${token}`).then(data => {
|
||||
if (data['is_finished']) {
|
||||
clearInterval(timer)
|
||||
this.isFaceCaptureVisible = false
|
||||
this.handleConfirm()
|
||||
}
|
||||
})
|
||||
}, 1000)
|
||||
})
|
||||
.catch(() => {
|
||||
this.$message.error(this.$tc('FailedToStartFaceCapture'))
|
||||
})
|
||||
const timer = setInterval(() => {
|
||||
this.$axios.get(url + `?token=${token}`).then(data => {
|
||||
if (data['is_finished']) {
|
||||
clearInterval(timer)
|
||||
this.isFaceCaptureVisible = false
|
||||
this.handleConfirm()
|
||||
}
|
||||
})
|
||||
}, 1000)
|
||||
}).catch(() => {
|
||||
this.$message.error(this.$tc('FailedToStartFaceCapture'))
|
||||
})
|
||||
},
|
||||
handleFaceCapture() {
|
||||
this.startFaceCapture()
|
||||
@@ -313,22 +306,16 @@ export default {
|
||||
const data = {
|
||||
confirm_type: this.confirmTypeRequired,
|
||||
mfa_type: this.confirmTypeRequired === 'mfa' ? this.subTypeSelected : '',
|
||||
secret_key:
|
||||
this.confirmTypeRequired === 'password'
|
||||
? encryptPassword(this.secretValue)
|
||||
: this.secretValue
|
||||
secret_key: this.confirmTypeRequired === 'password' ? encryptPassword(this.secretValue) : this.secretValue
|
||||
}
|
||||
|
||||
this.$axios
|
||||
.post(`/api/v1/authentication/confirm/`, data)
|
||||
.then(() => {
|
||||
this.onSuccess()
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err.message || this.$tc('ConfirmFailed'))
|
||||
this.faceCaptureUrl = null
|
||||
this.isFaceCaptureVisible = false
|
||||
})
|
||||
this.$axios.post(`/api/v1/authentication/confirm/`, data).then(() => {
|
||||
this.onSuccess()
|
||||
}).catch((err) => {
|
||||
this.$message.error(err.message || this.$tc('ConfirmFailed'))
|
||||
this.faceCaptureUrl = null
|
||||
this.isFaceCaptureVisible = false
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,100 +0,0 @@
|
||||
<template>
|
||||
<Dialog
|
||||
:show-cancel="false"
|
||||
:show-confirm="false"
|
||||
:title="title"
|
||||
:visible.sync="iVisible"
|
||||
class="help-dialog"
|
||||
top="1vh"
|
||||
width="50%"
|
||||
>
|
||||
<p>{{ variablesHelpText }}</p>
|
||||
<table border="1" class="help-table">
|
||||
<tr>
|
||||
<th>{{ $tc('Variable') }}</th>
|
||||
<th>{{ $tc('Description') }}</th>
|
||||
<th>{{ $tc('Example') }}</th>
|
||||
</tr>
|
||||
<tr v-for="(item, index) in variables" :key="index">
|
||||
<td :title="$tc('ClickCopy')" class="item-td text-link" @click="onCopy(item.name)">
|
||||
<label class="item-label">{{ item.name }}</label>
|
||||
</td>
|
||||
<td><span>{{ item.label }}</span></td>
|
||||
<td><span>{{ item.default }}</span></td>
|
||||
</tr>
|
||||
</table>
|
||||
</Dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Dialog from '@/components/Dialog/index.vue'
|
||||
import { copy } from '@/utils/common/index'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Dialog
|
||||
},
|
||||
props: {
|
||||
visible: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
variables: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
},
|
||||
variablesHelpText: {
|
||||
type: String,
|
||||
default() {
|
||||
return this.$t('WatermarkVariableHelpText')
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
title: this.$t('BuiltinVariable')
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
iVisible: {
|
||||
set(val) {
|
||||
this.$emit('update:visible', val)
|
||||
},
|
||||
get() {
|
||||
return this.visible
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onCopy(key) {
|
||||
copy(key)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
::v-deep .help-dialog.dialog .el-dialog__footer {
|
||||
border-top: none;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.help-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
border: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
::v-deep .help-table th,
|
||||
::v-deep .help-table td {
|
||||
height: 40px;
|
||||
padding: 0 8px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
::v-deep .help-table .item-td,
|
||||
::v-deep .help-table .item-label {
|
||||
cursor: pointer;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
</style>
|
||||
@@ -5,7 +5,7 @@
|
||||
<div v-if="item.has !== false" :key="item.key" :class="item.class " :label="item.key" class="el-form-item">
|
||||
<span slot="label" class="el-form-item__label"> {{ formateLabel(item.key) }}</span>
|
||||
<span class="item-value el-form-item__content">
|
||||
<component
|
||||
<template
|
||||
:is="item.component"
|
||||
v-if="item.component"
|
||||
v-bind="{...item}"
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
v-if="action.dropdown"
|
||||
v-show="action.dropdown.length > 0"
|
||||
:key="action.name"
|
||||
:class="[action.name, { grouped: action.grouped }]"
|
||||
:class="[action.name, {grouped: action.grouped }]"
|
||||
:size="action.size"
|
||||
:split-button="!!action.split"
|
||||
:type="action.type"
|
||||
@@ -23,7 +23,7 @@
|
||||
:class="action.name"
|
||||
:size="size"
|
||||
class="more-action"
|
||||
v-bind="{ ...cleanButtonAction(action), icon: '' }"
|
||||
v-bind="{...cleanButtonAction(action), icon: ''}"
|
||||
>
|
||||
<span class="pre-icon">
|
||||
<Icon v-if="action.icon" :icon="action.icon" />
|
||||
@@ -32,13 +32,13 @@
|
||||
{{ action.title }}<i class="el-icon-arrow-down el-icon--right" />
|
||||
</span>
|
||||
</el-button>
|
||||
<el-dropdown-menu slot="dropdown" style="overflow: auto; max-height: 60vh">
|
||||
<el-dropdown-menu slot="dropdown" style="overflow: auto;max-height: 60vh">
|
||||
<template v-for="option in action.dropdown">
|
||||
<div
|
||||
v-if="option.group"
|
||||
:key="'group:' + option.name"
|
||||
:key="'group:'+option.name"
|
||||
class="dropdown-menu-title"
|
||||
style="width: 130px"
|
||||
style="width:130px"
|
||||
>
|
||||
{{ option.group }}
|
||||
</div>
|
||||
@@ -54,7 +54,7 @@
|
||||
:command="[option, action]"
|
||||
:title="option.tip"
|
||||
class="dropdown-item"
|
||||
v-bind="{ ...option, icon: '' }"
|
||||
v-bind="{...option, icon: ''}"
|
||||
>
|
||||
<span v-if="actionsHasIcon(action.dropdown)" class="pre-icon">
|
||||
<Icon v-if="option.icon" :icon="option.icon" />
|
||||
@@ -69,10 +69,10 @@
|
||||
<el-button
|
||||
v-else
|
||||
:key="action.name"
|
||||
:class="[action.name, { grouped: action.grouped }]"
|
||||
:class="[action.name, {grouped: action.grouped }]"
|
||||
:size="size"
|
||||
class="action-item"
|
||||
v-bind="{ ...cleanButtonAction(action), icon: '' }"
|
||||
v-bind="{...cleanButtonAction(action), icon: ''}"
|
||||
@click="handleClick(action)"
|
||||
>
|
||||
<el-tooltip :content="action.tip" :disabled="!action.tip" placement="top">
|
||||
@@ -228,9 +228,9 @@ export default {
|
||||
|
||||
<style lang="scss" scoped>
|
||||
$btn-text-color: #ffffff;
|
||||
$color-btn-background: #e8f7f4;
|
||||
$color-btn-focus-background: #83cbba;
|
||||
$color-divided: #e4e7ed;
|
||||
$color-btn-background: #E8F7F4;
|
||||
$color-btn-focus-background: #83CBBA;
|
||||
$color-divided: #E4E7ED;
|
||||
$color-drop-menu-title: #909399;
|
||||
$color-drop-menu-border: #e4e7ed;
|
||||
|
||||
@@ -284,8 +284,6 @@ $color-drop-menu-border: #e4e7ed;
|
||||
|
||||
.el-button {
|
||||
padding: 2px 5px;
|
||||
line-height: 1.3;
|
||||
font-size: 13px;
|
||||
|
||||
&:not(.is-plain) {
|
||||
color: $btn-text-color;
|
||||
@@ -321,6 +319,7 @@ $color-drop-menu-border: #e4e7ed;
|
||||
// 下拉 options
|
||||
.el-dropdown-menu {
|
||||
::v-deep .more-batch-processing {
|
||||
|
||||
&:hover {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<Echart
|
||||
<div class="content">
|
||||
<echarts
|
||||
ref="echarts"
|
||||
:options="options"
|
||||
:autoresize="true"
|
||||
@@ -12,10 +12,9 @@
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
import * as echarts from 'echarts'
|
||||
import { mix } from '@/utils/theme/color'
|
||||
import Echart from '@/components/Dashboard/Echart.vue'
|
||||
|
||||
export default {
|
||||
components: { Echart },
|
||||
components: {},
|
||||
props: {
|
||||
datesMetrics: {
|
||||
type: Array,
|
||||
|
||||
@@ -1,71 +0,0 @@
|
||||
<template>
|
||||
<echarts
|
||||
:options="iOptions"
|
||||
v-bind="$attrs"
|
||||
@finished="onFinished"
|
||||
v-on="$listeners"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import 'echarts'
|
||||
|
||||
export default {
|
||||
components: {},
|
||||
props: {
|
||||
options: {
|
||||
type: Object,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
const urlParams = new URLSearchParams(window.location.search)
|
||||
const isExport = urlParams.get('export') === 'true'
|
||||
return {
|
||||
isExport: isExport
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
iOptions() {
|
||||
return {
|
||||
...this.options,
|
||||
animation: !this.isExport
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if (!window._echarts) {
|
||||
window._echarts = {
|
||||
total: new Set(),
|
||||
finished: new Set()
|
||||
}
|
||||
}
|
||||
// 唯一 id,避免重复计数
|
||||
this._chartId = `chart_${Date.now()}_${Math.random().toString(36).slice(2)}`
|
||||
window._echarts.total.add(this._chartId)
|
||||
},
|
||||
beforeDestroy() {
|
||||
if (window._echarts) {
|
||||
window._echarts.total.delete(this._chartId)
|
||||
window._echarts.finished.delete(this._chartId)
|
||||
// 可选:当没有图表时清理全局对象
|
||||
if (window._echarts.total.size === 0) {
|
||||
delete window._echarts
|
||||
delete window.echartsFinished
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onFinished() {
|
||||
if (!window._echarts) return
|
||||
window._echarts.finished.add(this._chartId)
|
||||
if (window._echarts.finished.size === window._echarts.total.size) {
|
||||
window.echartsFinished = true
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
</style>
|
||||
@@ -1,12 +1,20 @@
|
||||
<template>
|
||||
<div>
|
||||
<Echart
|
||||
<echarts
|
||||
ref="echarts"
|
||||
:options="options"
|
||||
:autoresize="true"
|
||||
theme="light"
|
||||
:class="{'disabled-when-print': !!dataUrl}"
|
||||
@finished="genSnapshot"
|
||||
/>
|
||||
<img
|
||||
v-if="dataUrl"
|
||||
:src="dataUrl"
|
||||
class="enabled-when-print"
|
||||
style="display: none;width: 100%;"
|
||||
alt="chart snapshot"
|
||||
>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -14,11 +22,9 @@
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
import * as echarts from 'echarts'
|
||||
import { mix } from '@/utils/theme/color'
|
||||
import Echart from '@/components/Dashboard/Echart.vue'
|
||||
|
||||
export default {
|
||||
name: 'LoginMetric',
|
||||
components: { Echart },
|
||||
props: {
|
||||
range: {
|
||||
type: String,
|
||||
@@ -279,4 +285,14 @@ export default {
|
||||
width: 100%;
|
||||
height: 272px;
|
||||
}
|
||||
|
||||
@media print {
|
||||
.disabled-when-print {
|
||||
display: none !important;
|
||||
}
|
||||
.enabled-when-print {
|
||||
display: block !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<Echart
|
||||
<echarts
|
||||
ref="echarts"
|
||||
:options="options"
|
||||
:autoresize="true"
|
||||
@@ -13,10 +13,8 @@
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
import * as echarts from 'echarts'
|
||||
import { mix } from '@/utils/theme/color'
|
||||
import Echart from '@/components/Dashboard/Echart.vue'
|
||||
|
||||
export default {
|
||||
components: { Echart },
|
||||
props: {
|
||||
colors: {
|
||||
type: Array,
|
||||
@@ -37,15 +35,14 @@ export default {
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {}
|
||||
return {
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
options() {
|
||||
const seriesList = []
|
||||
const labels = this.data.map(item => item.label)
|
||||
const total = _.sumBy(this.data, function(i) {
|
||||
return i.total
|
||||
})
|
||||
const total = _.sumBy(this.data, function(i) { return i.total })
|
||||
for (let i = 0, len = this.data.length; i < len; i++) {
|
||||
const current = this.data[i]
|
||||
let num = (current.total / total) * 100
|
||||
@@ -180,8 +177,8 @@ export default {
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.echarts {
|
||||
width: 100%;
|
||||
height: 72px;
|
||||
}
|
||||
.echarts {
|
||||
width: 100%;
|
||||
height: 72px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -38,7 +38,7 @@ export default {
|
||||
{
|
||||
title: this.$t('OnlineSessions'),
|
||||
body: {
|
||||
route: { name: `SessionList`, params: { activeMenu: 'OnlineList' } },
|
||||
route: { name: `SessionList`, params: { activeMenu: 'OnlineList' }},
|
||||
count: this.counter.total_count_online_sessions,
|
||||
disabled: !this.$hasPerm('terminal.view_session')
|
||||
}
|
||||
@@ -46,7 +46,7 @@ export default {
|
||||
{
|
||||
title: this.$t('CurrentConnectionUsers'),
|
||||
body: {
|
||||
route: { name: `SessionList`, params: { activeMenu: 'OnlineList' } },
|
||||
route: { name: `SessionList`, params: { activeMenu: 'OnlineList' }},
|
||||
count: this.counter.total_count_online_users,
|
||||
disabled: !this.$hasPerm('terminal.view_session')
|
||||
}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<Echart
|
||||
<echarts
|
||||
ref="echarts"
|
||||
:autoresize="true"
|
||||
:options="options"
|
||||
@@ -13,15 +13,12 @@ import 'echarts/lib/chart/line'
|
||||
import 'echarts/lib/component/legend'
|
||||
|
||||
import Decimal from 'decimal.js'
|
||||
import Echart from '@/components/Dashboard/Echart.vue'
|
||||
|
||||
export default {
|
||||
components: { Echart },
|
||||
props: {
|
||||
config: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
}
|
||||
default: () => {}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
@@ -5,7 +5,6 @@
|
||||
ref="dataForm"
|
||||
:fields="totalFields"
|
||||
:form="iForm"
|
||||
:server-errors="serverErrors"
|
||||
v-bind="$attrs"
|
||||
v-on="$listeners"
|
||||
>
|
||||
@@ -29,7 +28,6 @@
|
||||
import DataForm from '../DataForm/index.vue'
|
||||
import FormGroupHeader from '@/components/Form/FormGroupHeader/index.vue'
|
||||
import { FormFieldGenerator } from '@/components/Form/AutoDataForm/utils'
|
||||
import { UniqueCheck } from '@/components/Form/DataForm/rules'
|
||||
|
||||
export default {
|
||||
name: 'AutoDataForm',
|
||||
@@ -67,8 +65,7 @@ export default {
|
||||
totalFields: [],
|
||||
loading: true,
|
||||
groups: [],
|
||||
errors: {},
|
||||
serverErrors: {}
|
||||
errors: {}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
@@ -106,8 +103,6 @@ export default {
|
||||
this.generateColumns()
|
||||
this.$emit('afterGenerateColumns', this.totalFields)
|
||||
this.cleanFormValue()
|
||||
// 初始化时清空错误
|
||||
this.serverErrors = {}
|
||||
this.loading = false
|
||||
},
|
||||
generateColumns() {
|
||||
@@ -115,47 +110,6 @@ export default {
|
||||
this.totalFields = generator.generateFields(this.fields, this.fieldsMeta, this.remoteMeta)
|
||||
this.groups = generator.groups
|
||||
this.$log.debug('Total fields: ', this.totalFields)
|
||||
this.applyUniqueRules()
|
||||
},
|
||||
applyUniqueRules() {
|
||||
const fields = this.totalFields || []
|
||||
const currentIdGetter = () => {
|
||||
return this.$route?.params?.id || this.form?.id || this.iForm?.id
|
||||
}
|
||||
|
||||
// 移除 url 后拼接的参数
|
||||
const defaultListUrl = (() => {
|
||||
try {
|
||||
const u = new URL(this.url, location.origin)
|
||||
u.pathname = u.pathname.replace(/\/(\d+|[0-9a-fA-F-]{8}(?:-[0-9a-fA-F]{4}){3}-[0-9a-fA-F]{12})\/?$/, '/')
|
||||
return u.origin ? u.origin + u.pathname : u.pathname
|
||||
} catch (e) {
|
||||
return (this.url || '').replace(/\/(\d+|[0-9a-fA-F-]{8}(?:-[0-9a-fA-F]{4}){3}-[0-9a-fA-F]{12})\/?($|\?)/, '/$2')
|
||||
}
|
||||
})()
|
||||
|
||||
fields.forEach(field => {
|
||||
const conf = field?.uniqueCheck
|
||||
|
||||
if (!conf) return
|
||||
|
||||
const confObj = (typeof conf === 'object') ? conf : {}
|
||||
const param = confObj.param || field.prop || field.id
|
||||
const url = confObj.url || defaultListUrl
|
||||
const label = confObj.label || field.label || param
|
||||
const entityName = confObj.entityName || ''
|
||||
|
||||
if (!Array.isArray(field.rules)) field.rules = []
|
||||
|
||||
field.rules.push(UniqueCheck({
|
||||
url,
|
||||
param,
|
||||
label,
|
||||
entityName,
|
||||
getIgnoreId: currentIdGetter,
|
||||
fieldName: field.prop || field.id
|
||||
}))
|
||||
})
|
||||
},
|
||||
_cleanFormValue(form, remoteMeta) {
|
||||
if (!form) {
|
||||
@@ -185,69 +139,15 @@ export default {
|
||||
cleanFormValue() {
|
||||
this._cleanFormValue(this.iForm, this.remoteMeta)
|
||||
},
|
||||
_getElFormInstance() {
|
||||
try {
|
||||
return this.$refs?.dataForm?.$refs?.form?.$refs?.elForm || null
|
||||
} catch (e) {
|
||||
return null
|
||||
}
|
||||
},
|
||||
/**
|
||||
* @description 仅清理 UI 的错误展示,不触发表单内容重建
|
||||
*/
|
||||
clearAllFieldErrors() {
|
||||
const elForm = this._getElFormInstance()
|
||||
if (elForm && Array.isArray(elForm.fields)) {
|
||||
elForm.fields.forEach((item) => {
|
||||
item.validateMessage = ''
|
||||
item.validateState = ''
|
||||
})
|
||||
}
|
||||
// 不修改 totalFields/attrs,避免触发 content 重建导致输入丢失
|
||||
this.serverErrors = {}
|
||||
},
|
||||
setFieldError(name, error) {
|
||||
error = (error || '').toString().replace(/[。.]+$/, '')
|
||||
const elForm = this._getElFormInstance()
|
||||
if (elForm && Array.isArray(elForm.fields)) {
|
||||
const item = elForm.fields.find(f => f.prop === name)
|
||||
if (item) {
|
||||
item.validateMessage = error
|
||||
item.validateState = error ? 'error' : ''
|
||||
}
|
||||
error = error.replace(/[。.]+$/, '')
|
||||
const field = this.totalFields.find((v) => v.prop === name)
|
||||
if (!field) {
|
||||
return
|
||||
}
|
||||
// 不写入 totalFields,避免触发 innerContent 变化导致表单值被覆盖
|
||||
this.$set(this.serverErrors, name, error)
|
||||
},
|
||||
setErrors(errors) {
|
||||
const mapped = {}
|
||||
Object.entries(errors || {}).forEach(([k, v]) => {
|
||||
let msg = v
|
||||
console.log(k, v)
|
||||
// v是数组并且数组都是字符串,则拼接为字符串
|
||||
if (Array.isArray(v) && v.every(item => typeof item === 'string')) msg = v.join('; ')
|
||||
// 处理 [{"port":["请确保该值小于或者等于 65535。"]},{},{}] 这种情况
|
||||
else if (Array.isArray(v) && v.every(item => _.isPlainObject(item))) {
|
||||
const subMsg = []
|
||||
v.forEach((subItem) => {
|
||||
Object.values(subItem).forEach((subMsgArr) => {
|
||||
if (Array.isArray(subMsgArr)) {
|
||||
subMsg.push(...subMsgArr)
|
||||
}
|
||||
})
|
||||
})
|
||||
msg = subMsg.join(' ')
|
||||
} else if (typeof v === 'object' && v !== null) msg = JSON.stringify(v)
|
||||
mapped[k] = String(msg || '')
|
||||
})
|
||||
this.serverErrors = mapped
|
||||
const elForm = this._getElFormInstance()
|
||||
if (elForm && Array.isArray(elForm.fields)) {
|
||||
elForm.fields.forEach((item) => {
|
||||
const msg = mapped[item.prop] || ''
|
||||
item.validateMessage = msg
|
||||
item.validateState = msg ? 'error' : ''
|
||||
})
|
||||
if (typeof error === 'string') {
|
||||
field.el.errors = error
|
||||
field.attrs.error = error
|
||||
}
|
||||
},
|
||||
groupHidden(group, i) {
|
||||
|
||||
@@ -6,7 +6,6 @@
|
||||
:prop="prop"
|
||||
:rules="_show && Array.isArray(data.rules) ? data.rules : []"
|
||||
v-bind="data.attrs"
|
||||
:error="errorText"
|
||||
>
|
||||
<template v-if="data.label" #label>
|
||||
<span :title="data.label">
|
||||
@@ -20,8 +19,7 @@
|
||||
placement="right"
|
||||
popper-class="help-tips"
|
||||
>
|
||||
<div slot="content" v-sanitize="data.helpTip" class="help-tip-content" />
|
||||
<!-- Noncompliant -->
|
||||
<div slot="content" v-sanitize="data.helpTip" class="help-tip-content" /> <!-- Noncompliant -->
|
||||
<i class="fa fa-question-circle-o help-tip-icon" />
|
||||
</el-tooltip>
|
||||
</span>
|
||||
@@ -29,7 +27,11 @@
|
||||
<template v-if="readonly && hasReadonlyContent">
|
||||
<div
|
||||
v-if="data.type === 'input'"
|
||||
:style="componentProps.type === 'textarea' ? { padding: '10px 0', lineHeight: 1.5 } : ''"
|
||||
:style="
|
||||
componentProps.type === 'textarea'
|
||||
? {padding: '10px 0', lineHeight: 1.5}
|
||||
: ''
|
||||
"
|
||||
>
|
||||
{{ itemValue }}
|
||||
</div>
|
||||
@@ -48,7 +50,11 @@
|
||||
v-on="listeners"
|
||||
>
|
||||
<template v-for="opt in options">
|
||||
<el-option v-if="data.type === 'select'" :key="opt.label" v-bind="opt" />
|
||||
<el-option
|
||||
v-if="data.type === 'select'"
|
||||
:key="opt.label"
|
||||
v-bind="opt"
|
||||
/>
|
||||
<el-checkbox-button
|
||||
v-else-if="data.type === 'checkbox-group' && data.style === 'button'"
|
||||
:key="opt.value"
|
||||
@@ -105,10 +111,10 @@
|
||||
<script>
|
||||
import getEnableWhenStatus from '../util/enable-when'
|
||||
import { noop } from '../util/utils'
|
||||
import _get from 'lodash/get'
|
||||
import _includes from 'lodash/includes'
|
||||
import _topairs from 'lodash/toPairs'
|
||||
import _frompairs from 'lodash/fromPairs'
|
||||
import _get from 'lodash.get'
|
||||
import _includes from 'lodash.includes'
|
||||
import _topairs from 'lodash.topairs'
|
||||
import _frompairs from 'lodash.frompairs'
|
||||
|
||||
function validator(data) {
|
||||
if (!data) {
|
||||
@@ -146,10 +152,6 @@ export default {
|
||||
props: {
|
||||
// eslint-disable-next-line vue/require-default-prop
|
||||
data: Object,
|
||||
serverErrors: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
},
|
||||
prop: {
|
||||
type: String,
|
||||
default() {
|
||||
@@ -168,8 +170,7 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
propsInner: {},
|
||||
isBlurTrigger:
|
||||
this.data.rules &&
|
||||
isBlurTrigger: this.data.rules &&
|
||||
this.data.rules.some(rule => {
|
||||
return rule.required && rule.trigger === 'blur'
|
||||
})
|
||||
@@ -178,7 +179,7 @@ export default {
|
||||
computed: {
|
||||
// 解构运算符会处理 undefined 的情况
|
||||
componentProps: ({ data: { el }, propsInner }) => ({ ...el, ...propsInner }),
|
||||
hasReadonlyContent: ({ data: { type } }) => _includes(['input', 'select'], type),
|
||||
hasReadonlyContent: ({ data: { type }}) => _includes(['input', 'select'], type),
|
||||
hiddenStatus: ({ data: { hidden = () => false }, data, value }) => hidden(value, data),
|
||||
enableWhenStatus: ({ data: { enableWhen }, value }) => getEnableWhenStatus(enableWhen, value),
|
||||
// 是否显示
|
||||
@@ -188,11 +189,6 @@ export default {
|
||||
classes() {
|
||||
return 'el-form-item-' + this.data.prop + ' ' + (this.data.attrs?.class || '')
|
||||
},
|
||||
errorText() {
|
||||
const fromAttrs = this.data?.attrs?.error
|
||||
const fromServer = this.serverErrors ? this.serverErrors[this.data.prop] : ''
|
||||
return fromAttrs || fromServer || ''
|
||||
},
|
||||
listeners() {
|
||||
const {
|
||||
data: {
|
||||
@@ -208,7 +204,10 @@ export default {
|
||||
} = this
|
||||
return {
|
||||
..._frompairs(
|
||||
_topairs(on).map(([eName, handler]) => [eName, (...args) => handler(args, updateForm)])
|
||||
_topairs(on).map(([eName, handler]) => [
|
||||
eName,
|
||||
(...args) => handler(args, updateForm)
|
||||
]),
|
||||
),
|
||||
// 手动更新表单数据
|
||||
input: (value, ...rest) => {
|
||||
@@ -233,7 +232,9 @@ export default {
|
||||
|
||||
multipleValue: ({ data, itemValue, options = [] }) => {
|
||||
const multipleSelectValue =
|
||||
_get(data, 'el.multiple') && Array.isArray(itemValue) ? itemValue : [itemValue]
|
||||
_get(data, 'el.multiple') && Array.isArray(itemValue)
|
||||
? itemValue
|
||||
: [itemValue]
|
||||
return multipleSelectValue
|
||||
.map(val => (options.find(op => op.value === val) || {}).label)
|
||||
.join()
|
||||
@@ -253,7 +254,8 @@ export default {
|
||||
if (v.url === oldV.url || v.request === oldV.request) return
|
||||
}
|
||||
const isOptionsCase =
|
||||
['select', 'checkbox-group', 'radio-group'].indexOf(this.data.type) > -1
|
||||
['select', 'checkbox-group', 'radio-group'].indexOf(this.data.type) >
|
||||
-1
|
||||
const {
|
||||
url,
|
||||
request = () => this.$axios.get(url).then(resp => resp.data),
|
||||
@@ -321,7 +323,7 @@ export default {
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
<style lang='scss' scoped>
|
||||
.help-tips {
|
||||
opacity: 0.8;
|
||||
line-height: 2;
|
||||
@@ -330,7 +332,7 @@ export default {
|
||||
|
||||
.help-block {
|
||||
::v-deep .el-alert__icon {
|
||||
font-size: 16px;
|
||||
font-size: 16px
|
||||
}
|
||||
|
||||
&.checkbox {
|
||||
|
||||
@@ -1,18 +1,11 @@
|
||||
<template>
|
||||
<el-form
|
||||
ref="elForm"
|
||||
:model="value"
|
||||
class="el-form-renderer"
|
||||
v-bind="$attrs"
|
||||
@submit.native.prevent
|
||||
>
|
||||
<el-form ref="elForm" :model="value" class="el-form-renderer" v-bind="$attrs" @submit.native.prevent>
|
||||
<template v-for="item in innerContent">
|
||||
<slot v-if="!isHidden(item)" :name="`id:${item.id}`" />
|
||||
<component
|
||||
:is="item.type === GROUP ? 'render-form-group' : 'render-form-item'"
|
||||
:key="item.id"
|
||||
:data="item"
|
||||
:server-errors="serverErrors"
|
||||
:disabled="disabled || item.disabled"
|
||||
:item-value="value[item.id]"
|
||||
:options="options[item.id]"
|
||||
@@ -26,19 +19,13 @@
|
||||
</el-form>
|
||||
</template>
|
||||
<script>
|
||||
import _set from 'lodash/set'
|
||||
import _isequal from 'lodash/isEqual'
|
||||
import _clonedeep from 'lodash/cloneDeep'
|
||||
import _set from 'lodash.set'
|
||||
import _isequal from 'lodash.isequal'
|
||||
import _clonedeep from 'lodash.clonedeep'
|
||||
import RenderFormGroup from './components/render-form-group.vue'
|
||||
import RenderFormItem from './components/render-form-item.vue'
|
||||
import transformContent from './util/transform-content'
|
||||
import {
|
||||
collect,
|
||||
correctValue,
|
||||
mergeValue,
|
||||
transformInputValue,
|
||||
transformOutputValue
|
||||
} from './util/utils'
|
||||
import { collect, correctValue, mergeValue, transformInputValue, transformOutputValue } from './util/utils'
|
||||
|
||||
const GROUP = 'group'
|
||||
|
||||
@@ -60,10 +47,6 @@ export default {
|
||||
type: Array,
|
||||
required: true
|
||||
},
|
||||
serverErrors: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
},
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import _get from 'lodash/get'
|
||||
import _has from 'lodash/has'
|
||||
import _get from 'lodash.get'
|
||||
import _has from 'lodash.has'
|
||||
|
||||
/**
|
||||
* 处理 enableWhen
|
||||
@@ -20,5 +20,7 @@ export default function getEnableWhenStatus(enableWhen, value) {
|
||||
})
|
||||
}
|
||||
|
||||
return Array.isArray(enableWhen) ? enableWhen.some(handleCondition) : handleCondition(enableWhen)
|
||||
return Array.isArray(enableWhen)
|
||||
? enableWhen.some(handleCondition)
|
||||
: handleCondition(enableWhen)
|
||||
}
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
/* eslint-disable no-sequences */
|
||||
import _ from 'lodash'
|
||||
import _kebabcase from 'lodash.kebabcase'
|
||||
/**
|
||||
* content 的每一项会浅拷贝一层
|
||||
* 只可以在 item 层新增修改属性,如 item.a = b
|
||||
@@ -13,7 +13,7 @@ export default function transformContent(content) {
|
||||
removeDollarInKey(item)
|
||||
extractRulesFromComponent(item)
|
||||
// 有些旧写法是 checkboxGroup & radioGroup
|
||||
item.type = _.kebabCase(item.type)
|
||||
item.type = _kebabcase(item.type)
|
||||
}
|
||||
|
||||
return item
|
||||
@@ -34,5 +34,8 @@ export function extractRulesFromComponent(item) {
|
||||
if (!component || typeof component === 'string') return
|
||||
|
||||
const { rules = [] } = component
|
||||
item.rules = [...(item.rules || []), ...(typeof rules === 'function' ? rules(item) : rules)]
|
||||
item.rules = [
|
||||
...(item.rules || []),
|
||||
...(typeof rules === 'function' ? rules(item) : rules)
|
||||
]
|
||||
}
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import _frompairs from 'lodash/fromPairs'
|
||||
import _isplainobject from 'lodash/isPlainObject'
|
||||
import _frompairs from 'lodash.frompairs'
|
||||
import _isplainobject from 'lodash.isplainobject'
|
||||
|
||||
export function noop() {}
|
||||
|
||||
@@ -12,9 +12,11 @@ export function collect(content, key) {
|
||||
value: item.type === 'group' ? collect(item.items, key) : item[key]
|
||||
}))
|
||||
.filter(
|
||||
({ type, value }) => value !== undefined || (type === 'group' && Object.keys(value).length)
|
||||
({ type, value }) =>
|
||||
value !== undefined ||
|
||||
(type === 'group' && Object.keys(value).length),
|
||||
)
|
||||
.map(({ id, value }) => [id, value])
|
||||
.map(({ id, value }) => [id, value]),
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
@@ -11,7 +11,6 @@
|
||||
:label-width="labelWidth"
|
||||
:style="{ '--label-width': labelWidth }"
|
||||
v-bind="$attrs"
|
||||
:server-errors="serverErrors"
|
||||
v-on="$listeners"
|
||||
>
|
||||
<!-- slot 透传 -->
|
||||
@@ -56,7 +55,7 @@
|
||||
|
||||
<el-button
|
||||
v-for="button in moreButtons"
|
||||
v-show="!iHidden(button)"
|
||||
v-show="!button.hidden"
|
||||
:key="button.title"
|
||||
:loading="button.loading"
|
||||
size="small"
|
||||
@@ -122,10 +121,6 @@ export default {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
serverErrors: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
},
|
||||
fields: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
@@ -231,9 +226,6 @@ export default {
|
||||
},
|
||||
getFormValue() {
|
||||
return this.$refs.form.getFormValue()
|
||||
},
|
||||
iHidden(item) {
|
||||
return typeof item.hidden === 'function' ? item.hidden() : item.hidden
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -244,10 +236,6 @@ export default {
|
||||
margin-right: 80px;
|
||||
margin-bottom: 20px;
|
||||
|
||||
.el-form {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
::v-deep .el-input-group__prepend {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
import i18n from '@/i18n/i18n'
|
||||
import request from '@/utils/request'
|
||||
|
||||
export const Required = {
|
||||
required: true, message: i18n.t('FieldRequiredError'), trigger: 'blur'
|
||||
@@ -119,69 +118,3 @@ export default {
|
||||
matchAlphanumericUnderscore,
|
||||
MatchExcludeParenthesis
|
||||
}
|
||||
/**
|
||||
* @description 表单唯一性校验
|
||||
*
|
||||
* @param {Object} options
|
||||
* @param {string} 列表查询地址
|
||||
* @param {string} 查询参数名
|
||||
* @param {string} 字段中文名
|
||||
* @param {string} 字段名
|
||||
* @param {function(): (string|number)} 返回更新场景下的当前对象 id
|
||||
*/
|
||||
export function UniqueCheck(options = {}) {
|
||||
const { url, param, label, fieldName, getIgnoreId } = options
|
||||
|
||||
function existsInResponse(res) {
|
||||
if (Array.isArray(res)) return res.length > 0
|
||||
if (res && typeof res === 'object') {
|
||||
if (typeof res.count === 'number') return res.count > 0
|
||||
if (Array.isArray(res.results)) return res.results.length > 0
|
||||
}
|
||||
return !!res
|
||||
}
|
||||
|
||||
function extractIds(res) {
|
||||
if (Array.isArray(res)) return res.map(i => i?.id).filter(Boolean)
|
||||
if (res && Array.isArray(res.results)) return res.results.map(i => i?.id).filter(Boolean)
|
||||
return []
|
||||
}
|
||||
|
||||
return {
|
||||
async validator(rule, value, callback) {
|
||||
try {
|
||||
let v = value
|
||||
|
||||
if (typeof v === 'string') v = v.trim()
|
||||
if (v === '' || v === undefined || v === null) return callback()
|
||||
if (!url || !param) return callback()
|
||||
|
||||
const res = await request.get(url, { params: { [param]: v } })
|
||||
let duplicated = existsInResponse(res)
|
||||
|
||||
if (duplicated && typeof getIgnoreId === 'function') {
|
||||
const curId = getIgnoreId()
|
||||
if (curId) {
|
||||
const ids = extractIds(res)
|
||||
|
||||
// 查询结果只包含自身,因此不被视为重复
|
||||
if (ids.length >= 1 && ids.every(id => id === curId)) {
|
||||
duplicated = false
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (duplicated) {
|
||||
const _label = label || fieldName || ''
|
||||
const msg = `${_label}${i18n.t('Existing')}`
|
||||
callback(new Error(msg))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
} catch (e) {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: ['blur']
|
||||
}
|
||||
}
|
||||
|
||||
@@ -14,7 +14,6 @@
|
||||
<el-button
|
||||
:type="item.el && item.el.type"
|
||||
class="start-stop-btn"
|
||||
:disabled="item.disabled"
|
||||
size="mini"
|
||||
@click="item.callback()"
|
||||
>
|
||||
|
||||
@@ -19,7 +19,7 @@ export default {
|
||||
props: {
|
||||
value: {
|
||||
type: [Array, String, Number, Boolean, Object],
|
||||
default: () => []
|
||||
default: () => ([])
|
||||
},
|
||||
multiple: {
|
||||
type: Boolean,
|
||||
@@ -36,7 +36,7 @@ export default {
|
||||
},
|
||||
computed: {
|
||||
attrsWithoutValue() {
|
||||
const attrs = Object.assign({ clearable: this.clearable }, this.$attrs)
|
||||
const attrs = Object.assign({}, this.$attrs)
|
||||
delete attrs.value
|
||||
return attrs
|
||||
},
|
||||
@@ -50,13 +50,6 @@ export default {
|
||||
const value = this.objectsToValues(this.value)
|
||||
return value
|
||||
}
|
||||
},
|
||||
clearable() {
|
||||
if (this.$attrs.clearable === undefined) {
|
||||
return this.multiple
|
||||
} else {
|
||||
return this.$attrs.clearable
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
@@ -78,11 +71,8 @@ export default {
|
||||
value = value.map(v => {
|
||||
// uuid v4
|
||||
const uuid = /^[0-9A-F]{8}-[0-9A-F]{4}-[4][0-9A-F]{3}-[89AB][0-9A-F]{3}-[0-9A-F]{12}$/i
|
||||
return typeof v === 'object'
|
||||
? v
|
||||
: this.$attrs?.allowCreate && !uuid.test(v)
|
||||
? { [this.customLabelKeyName]: v }
|
||||
: { pk: v }
|
||||
return typeof v === 'object' ? v
|
||||
: this.$attrs?.allowCreate && !uuid.test(v) ? { [this.customLabelKeyName]: v } : { pk: v }
|
||||
})
|
||||
if (!this.multiple) {
|
||||
value = value[0]
|
||||
@@ -97,13 +87,9 @@ export default {
|
||||
if (!Array.isArray(val)) {
|
||||
val = [val]
|
||||
}
|
||||
val = val.map(v => {
|
||||
val = val.map((v) => {
|
||||
if (v && typeof v === 'object') {
|
||||
return (
|
||||
v.pk ||
|
||||
v.id ||
|
||||
(this.$attrs?.allowCreate ? v?.[this.customLabelKeyName] + ':' + v?.value : '')
|
||||
)
|
||||
return v.pk || v.id || (this.$attrs?.allowCreate ? (v?.[this.customLabelKeyName] + ':' + v?.value) : '')
|
||||
} else {
|
||||
return v
|
||||
}
|
||||
@@ -117,4 +103,6 @@ export default {
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
|
||||
@@ -33,9 +33,6 @@
|
||||
>
|
||||
<i :class="[isCheckShowPassword ? 'fa-eye-slash' : 'fa-eye']" class="fa" />
|
||||
</span>
|
||||
<span v-if="filterTags.length > 0" class="clear-icon" @click="handleClearAll">
|
||||
<i class="el-icon-circle-close" :title="$t('Clear')" />
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -143,11 +140,6 @@ export default {
|
||||
},
|
||||
handleShowPassword() {
|
||||
this.isCheckShowPassword = !this.isCheckShowPassword
|
||||
},
|
||||
handleClearAll() {
|
||||
this.filterTags = []
|
||||
this.$emit('change', this.filterTags)
|
||||
this.$emit('input', this.filterTags)
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -169,12 +161,11 @@ export default {
|
||||
line-height: 30px;
|
||||
|
||||
&:hover {
|
||||
border-color: #c0c4cc;
|
||||
border-color: #C0C4CC;
|
||||
}
|
||||
|
||||
& ::v-deep .el-tag {
|
||||
margin-bottom: 2px;
|
||||
margin-top: 2px;
|
||||
margin-bottom: 1px;
|
||||
font-family: sans-serif !important;
|
||||
margin-left: 5px;
|
||||
}
|
||||
@@ -186,7 +177,6 @@ export default {
|
||||
|
||||
.search-input {
|
||||
flex: 1;
|
||||
min-width: 150px;
|
||||
|
||||
& ::v-deep .el-input__inner {
|
||||
max-width: 100%;
|
||||
@@ -214,15 +204,4 @@ export default {
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
|
||||
.clear-icon {
|
||||
display: inherit;
|
||||
padding-right: 6px;
|
||||
cursor: pointer;
|
||||
color: #c0c4cc;
|
||||
|
||||
&:hover {
|
||||
color: #606164;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -68,7 +68,7 @@ export default {
|
||||
return { label: item.name, value: item.id }
|
||||
})
|
||||
const url = vm.url || vm.ajax.url
|
||||
const getPageData = async ({ pageIndex, pageSize, keyword }) => {
|
||||
const getPageData = async({ pageIndex, pageSize, keyword }) => {
|
||||
const limit = pageSize
|
||||
const offset = (pageIndex - 1) * pageSize
|
||||
const params = {
|
||||
|
||||
@@ -5,11 +5,6 @@
|
||||
<slot name="no-data" />
|
||||
</template>
|
||||
<template v-else>
|
||||
<!--
|
||||
过滤 selection 相关事件的透传,避免父组件收到 el-table 原生的“当前页” selection,
|
||||
导致跨页选择(persistSelection)被覆盖,只剩当页数据。
|
||||
选择事件统一走 selectStrategy,在内部维护全量 selected 并向外 emit。
|
||||
-->
|
||||
<el-table
|
||||
ref="table"
|
||||
v-loading="tableLoading"
|
||||
@@ -17,7 +12,7 @@
|
||||
:row-class-name="rowClassName"
|
||||
v-bind="tableAttrs"
|
||||
@select="selectStrategy.onSelect"
|
||||
v-on="forwardListeners"
|
||||
v-on="$listeners"
|
||||
@selection-change="selectStrategy.onSelectionChange"
|
||||
@select-all="handleSelectAll($event, canSelect)"
|
||||
@sort-change="onSortChange"
|
||||
@@ -28,18 +23,27 @@
|
||||
<template v-if="hasSelect">
|
||||
<el-data-table-column
|
||||
key="selection-key"
|
||||
v-bind="{ align: columnsAlign, ...columns[0] }"
|
||||
v-bind="{align: columnsAlign, ...columns[0]}"
|
||||
/>
|
||||
|
||||
<el-data-table-column key="tree-ctrl" v-bind="{ align: columnsAlign, ...columns[1] }">
|
||||
<el-data-table-column
|
||||
key="tree-ctrl"
|
||||
v-bind="{align: columnsAlign, ...columns[1]}"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span v-for="space in scope.row._level" :key="space" class="ms-tree-space" />
|
||||
<span
|
||||
v-for="space in scope.row._level"
|
||||
:key="space"
|
||||
class="ms-tree-space"
|
||||
/>
|
||||
<span
|
||||
v-if="iconShow(scope.$index, scope.row)"
|
||||
class="tree-ctrl"
|
||||
@click="toggleExpanded(scope.$index)"
|
||||
>
|
||||
<i :class="`el-icon-${scope.row._expanded ? 'minus' : 'plus'}`" />
|
||||
<i
|
||||
:class="`el-icon-${scope.row._expanded ? 'minus' : 'plus'}`"
|
||||
/>
|
||||
</span>
|
||||
{{ scope.row[columns[1].prop] }}
|
||||
</template>
|
||||
@@ -48,16 +52,23 @@
|
||||
<el-data-table-column
|
||||
v-for="col in columns.filter((c, i) => i !== 0 && i !== 1)"
|
||||
:key="col.prop"
|
||||
v-bind="{ align: columnsAlign, ...col }"
|
||||
v-bind="{align: columnsAlign, ...col}"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<!--无选择-->
|
||||
<template v-else>
|
||||
<!--展开这列, 丢失 el-data-table-column属性-->
|
||||
<el-data-table-column key="tree-ctrl" v-bind="{ align: columnsAlign, ...columns[0] }">
|
||||
<el-data-table-column
|
||||
key="tree-ctrl"
|
||||
v-bind="{align: columnsAlign, ...columns[0]}"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span v-for="space in scope.row._level" :key="space" class="ms-tree-space" />
|
||||
<span
|
||||
v-for="space in scope.row._level"
|
||||
:key="space"
|
||||
class="ms-tree-space"
|
||||
/>
|
||||
|
||||
<span
|
||||
v-if="iconShow(scope.$index, scope.row)"
|
||||
@@ -73,19 +84,14 @@
|
||||
<el-data-table-column
|
||||
v-for="col in columns.filter((c, i) => i !== 0)"
|
||||
:key="col.prop"
|
||||
v-bind="{ align: columnsAlign, ...col }"
|
||||
v-bind="{align: columnsAlign, ...col}"
|
||||
/>
|
||||
</template>
|
||||
</template>
|
||||
|
||||
<!--非树-->
|
||||
<template v-else>
|
||||
<el-data-table-column
|
||||
v-if="hasSelection"
|
||||
:align="selectionAlign"
|
||||
:selectable="canSelect"
|
||||
type="selection"
|
||||
/>
|
||||
<el-data-table-column v-if="hasSelection" :align="selectionAlign" :selectable="canSelect" type="selection" />
|
||||
<el-data-table-column
|
||||
v-for="col in columns"
|
||||
:key="col.prop"
|
||||
@@ -94,14 +100,14 @@
|
||||
:filters="col.filters || null"
|
||||
:formatter="typeof col.formatter === 'function' ? col.formatter : null"
|
||||
:title="col.label"
|
||||
v-bind="{ align: columnsAlign, ...col }"
|
||||
v-bind="{align: columnsAlign, ...col}"
|
||||
>
|
||||
<template #header>
|
||||
<span :title="col.label">{{ col.label }}</span>
|
||||
</template>
|
||||
<template
|
||||
v-if="col.formatter && typeof col.formatter !== 'function'"
|
||||
v-slot:default="{ row, column, $index }"
|
||||
v-slot:default="{row, column, $index}"
|
||||
>
|
||||
<div
|
||||
:is="col.formatter"
|
||||
@@ -155,9 +161,9 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import _get from 'lodash/get'
|
||||
import _values from 'lodash/values'
|
||||
import _isEmpty from 'lodash/isEmpty'
|
||||
import _get from 'lodash.get'
|
||||
import _values from 'lodash.values'
|
||||
import _isEmpty from 'lodash.isempty'
|
||||
import SelfLoadingButton from './components/self-loading-button.vue'
|
||||
import TheDialog, { dialogModes } from './components/the-dialog.vue'
|
||||
import ElDataTableColumn from './components/el-data-table-column'
|
||||
@@ -269,7 +275,8 @@ export default {
|
||||
*/
|
||||
beforeSearch: {
|
||||
type: Function,
|
||||
default() {}
|
||||
default() {
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 单选, 适用场景: 不可以批量删除
|
||||
@@ -434,7 +441,8 @@ export default {
|
||||
*/
|
||||
onEdit: {
|
||||
type: Function,
|
||||
default(row) {}
|
||||
default(row) {
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 点击删除按钮时的方法, 当默认删除方法不满足需求时使用, 需要返回promise
|
||||
@@ -443,7 +451,9 @@ export default {
|
||||
onDelete: {
|
||||
type: Function,
|
||||
default(data) {
|
||||
const ids = Array.isArray(data) ? data.map(v => v[this.id]).join(',') : data[this.id]
|
||||
const ids = Array.isArray(data)
|
||||
? data.map(v => v[this.id]).join(',')
|
||||
: data[this.id]
|
||||
return this.$axios.delete(this.url + '/' + ids + '/', this.axiosConfig)
|
||||
}
|
||||
},
|
||||
@@ -697,8 +707,8 @@ export default {
|
||||
}
|
||||
},
|
||||
/*
|
||||
* 设置默认对齐方式
|
||||
*/
|
||||
* 设置默认对齐方式
|
||||
*/
|
||||
defaultAlign: {
|
||||
type: String,
|
||||
default: 'center'
|
||||
@@ -713,7 +723,8 @@ export default {
|
||||
},
|
||||
extraPaginationAttrs: {
|
||||
type: Object,
|
||||
default: () => {}
|
||||
default: () => {
|
||||
}
|
||||
},
|
||||
hasSelection: {
|
||||
type: Boolean,
|
||||
@@ -799,16 +810,6 @@ export default {
|
||||
selectStrategy() {
|
||||
return getSelectStrategy(this)
|
||||
},
|
||||
// 过滤会与内部选择策略冲突的事件,避免父组件只拿到当前页 selection
|
||||
forwardListeners() {
|
||||
const listeners = { ...this.$listeners }
|
||||
delete listeners['selection-change']
|
||||
delete listeners['select']
|
||||
delete listeners['select-all']
|
||||
// 外层如需监听 selection 变化,请监听本组件透出的 selection-change,
|
||||
// 该事件来自选择策略,已汇总跨页后的全量 selected
|
||||
return listeners
|
||||
},
|
||||
searchLocatedSlotKeys() {
|
||||
return getLocatedSlotKeys(this.$slots, 'search:')
|
||||
},
|
||||
@@ -896,7 +897,9 @@ export default {
|
||||
}
|
||||
Object.assign(query, this._extraQuery)
|
||||
Object.assign(query, this.innerQuery)
|
||||
query[this.pageSizeKey] = this.hasPagination ? this.size : this.noPaginationSize
|
||||
query[this.pageSizeKey] = this.hasPagination
|
||||
? this.size
|
||||
: this.noPaginationSize
|
||||
|
||||
// 根据偏移值计算接口正确的页数
|
||||
const pageOffset = this.firstPage - defaultFirstPage
|
||||
@@ -978,7 +981,9 @@ export default {
|
||||
formValue = this.$refs.searchForm.getFormValue()
|
||||
Object.assign(query, formValue)
|
||||
}
|
||||
const queryStr = (url.indexOf('?') > -1 ? '&' : '?') + queryUtil.stringify(query, '=', '&')
|
||||
const queryStr =
|
||||
(url.indexOf('?') > -1 ? '&' : '?') +
|
||||
queryUtil.stringify(query, '=', '&')
|
||||
|
||||
// 请求开始
|
||||
this.tableLoading = loading
|
||||
@@ -998,7 +1003,10 @@ export default {
|
||||
|
||||
// 不分页
|
||||
if (!this.hasPagination) {
|
||||
data = _get(resp, this.dataPath) || _get(resp, noPaginationDataPath) || []
|
||||
data =
|
||||
_get(resp, this.dataPath) ||
|
||||
_get(resp, noPaginationDataPath) ||
|
||||
[]
|
||||
this.total = data.length
|
||||
} else {
|
||||
data = _get(resp, this.dataPath) || []
|
||||
@@ -1181,7 +1189,7 @@ export default {
|
||||
this.$confirm(this.deleteMessage(data), this.$t('Info'), {
|
||||
type: 'warning',
|
||||
confirmButtonClass: 'el-button--danger',
|
||||
beforeClose: async (action, instance, done) => {
|
||||
beforeClose: async(action, instance, done) => {
|
||||
if (action !== 'confirm') return done()
|
||||
|
||||
instance.confirmButtonLoading = true
|
||||
@@ -1217,7 +1225,11 @@ export default {
|
||||
}
|
||||
const remain = this.data.length - deleteCount
|
||||
const lastPage = Math.ceil(this.total / this.size)
|
||||
if (remain === 0 && this.page === lastPage && this.page > defaultFirstPage) {
|
||||
if (
|
||||
remain === 0 &&
|
||||
this.page === lastPage &&
|
||||
this.page > defaultFirstPage
|
||||
) {
|
||||
this.page--
|
||||
}
|
||||
},
|
||||
@@ -1245,14 +1257,20 @@ export default {
|
||||
tmp.push(record)
|
||||
|
||||
if (record[this.treeChildKey] && record[this.treeChildKey].length > 0) {
|
||||
const children = this.tree2Array(record[this.treeChildKey], expandAll, record, _level)
|
||||
const children = this.tree2Array(
|
||||
record[this.treeChildKey],
|
||||
expandAll,
|
||||
record,
|
||||
_level
|
||||
)
|
||||
tmp = tmp.concat(children)
|
||||
}
|
||||
})
|
||||
return tmp
|
||||
},
|
||||
rowClassName(...args) {
|
||||
let rcn = this.tableAttrs.rowClassName || this.tableAttrs['row-class-name'] || ''
|
||||
let rcn =
|
||||
this.tableAttrs.rowClassName || this.tableAttrs['row-class-name'] || ''
|
||||
if (typeof rcn === 'function') rcn = rcn(...args)
|
||||
if (this.isTree) rcn += ' ' + this.showRow(...args)
|
||||
return rcn
|
||||
|
||||
@@ -1,9 +1,14 @@
|
||||
/**
|
||||
* 两种多选策略:Normal 和 PersistSelection
|
||||
*/
|
||||
|
||||
/**
|
||||
* 多选策略接口
|
||||
*/
|
||||
class StrategyAbstract {
|
||||
constructor(elDataTable) {
|
||||
this.elDataTable = elDataTable
|
||||
// 绑定this后可直接在template中使用
|
||||
this.onSelectionChange = this.onSelectionChange.bind(this)
|
||||
this.onSelect = this.onSelect.bind(this)
|
||||
this.onSelectAll = this.onSelectAll.bind(this)
|
||||
@@ -13,22 +18,39 @@ class StrategyAbstract {
|
||||
return this.elDataTable.$refs.table
|
||||
}
|
||||
|
||||
onSelectionChange() {}
|
||||
onSelect() {}
|
||||
onSelectAll() {}
|
||||
toggleRowSelection() {}
|
||||
clearSelection() {}
|
||||
updateElTableSelection() {}
|
||||
onSelectionChange() {
|
||||
}
|
||||
|
||||
onSelect() {
|
||||
}
|
||||
|
||||
onSelectAll() {
|
||||
}
|
||||
|
||||
toggleRowSelection() {
|
||||
}
|
||||
|
||||
clearSelection() {
|
||||
}
|
||||
|
||||
updateElTableSelection() {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 普通策略。由 el-table 自己维护 selection
|
||||
* 普通策略。由el-table维护selected
|
||||
*/
|
||||
class StrategyNormal extends StrategyAbstract {
|
||||
/**
|
||||
* normal模式下只需要监听selection-change事件
|
||||
*/
|
||||
onSelectionChange(val) {
|
||||
this.elDataTable.selected = val
|
||||
}
|
||||
|
||||
/**
|
||||
* toggleRowSelection和clearSelection的表现与el-table一致
|
||||
*/
|
||||
toggleRowSelection(...args) {
|
||||
return this.elTable.toggleRowSelection(...args)
|
||||
}
|
||||
@@ -39,28 +61,44 @@ class StrategyNormal extends StrategyAbstract {
|
||||
}
|
||||
|
||||
/**
|
||||
* 跨页保存多选策略
|
||||
* 跨页保存多选策略。手动维护selected数组
|
||||
*/
|
||||
class StrategyPersistSelection extends StrategyAbstract {
|
||||
/**
|
||||
* el-table的selection-change事件不适用于开启跨页保存的情况。
|
||||
* 比如,当开启persistSelection时,发生以下两个场景:
|
||||
* 1. 用户点击翻页
|
||||
* 2. 用户点击行首的切换全选项按钮,清空当前页多选项数据
|
||||
* 其中场景1应该保持selected不变;而场景2只应该从selected移除当前页所有行,保留其他页面的多选状态。
|
||||
* 但el-table的selection-change事件在两个场景中无差别发生,所以这里不处理这个事件
|
||||
*/
|
||||
|
||||
/**
|
||||
* 用户切换某一行的多选
|
||||
*/
|
||||
onSelect(selection, row) {
|
||||
const isChosen = selection.indexOf(row) > -1
|
||||
this.toggleRowSelection(row, isChosen)
|
||||
// el-table 原生 selection-change 仅包含当前页。为保证跨页勾选有效,
|
||||
// 在内部策略维护完 selected 后,向外部同步“全量已选”。
|
||||
this.elDataTable.$emit('selection-change', this.elDataTable.selected)
|
||||
}
|
||||
|
||||
/**
|
||||
* 用户切换当前页的多选
|
||||
*/
|
||||
onSelectAll(selection, selectable = () => true) {
|
||||
const { id, selected, data } = this.elDataTable
|
||||
const selectableRows = data.filter(selectable)
|
||||
// const isSelected = !!selection.length
|
||||
|
||||
// 创建已选择项的 id 集合,用于快速查找
|
||||
const selectedIds = new Set(selected.map(r => r[id]))
|
||||
const currentPageIds = new Set(selectableRows.map(row => row[id]))
|
||||
|
||||
// 前页面的选中状态
|
||||
const currentPageSelectedCount = selectableRows.filter(row =>
|
||||
selectedIds.has(row[id])
|
||||
).length
|
||||
|
||||
// 判断是全选还是取消全选
|
||||
const shouldSelectAll = currentPageSelectedCount < selectableRows.length
|
||||
|
||||
this.elTable?.clearSelection()
|
||||
@@ -68,11 +106,15 @@ class StrategyPersistSelection extends StrategyAbstract {
|
||||
if (shouldSelectAll) {
|
||||
selectableRows.forEach(row => {
|
||||
if (!selectedIds.has(row[id])) selected.push(row)
|
||||
|
||||
this.elTable.toggleRowSelection(row, true)
|
||||
|
||||
// ! 这里需要触发事件,否则在 el-table 中无法触发 selection-change 事件
|
||||
this.elDataTable.$emit('toggle-row-selection', true, row)
|
||||
})
|
||||
} else {
|
||||
const newSelected = []
|
||||
|
||||
selected.forEach(row => {
|
||||
if (!currentPageIds.has(row[id])) {
|
||||
newSelected.push(row)
|
||||
@@ -80,12 +122,17 @@ class StrategyPersistSelection extends StrategyAbstract {
|
||||
this.elDataTable.$emit('toggle-row-selection', false, row)
|
||||
}
|
||||
})
|
||||
|
||||
this.elDataTable.selected = newSelected
|
||||
}
|
||||
|
||||
this.elDataTable.$emit('selection-change', this.elDataTable.selected)
|
||||
}
|
||||
|
||||
/**
|
||||
* toggleRowSelection和clearSelection管理elDataTable的selected数组
|
||||
* 记得最后要将状态同步到el-table中
|
||||
*/
|
||||
toggleRowSelection(row, isSelected) {
|
||||
const { id, selected } = this.elDataTable
|
||||
const foundIndex = selected.findIndex(r => r[id] === row[id])
|
||||
@@ -102,24 +149,26 @@ class StrategyPersistSelection extends StrategyAbstract {
|
||||
|
||||
this.elDataTable.$emit('toggle-row-selection', isSelected, row)
|
||||
this.updateElTableSelection()
|
||||
// 切换后同步全量 selection(跨页)
|
||||
this.elDataTable.$emit('selection-change', this.elDataTable.selected)
|
||||
}
|
||||
|
||||
clearSelection() {
|
||||
this.elDataTable.selected = []
|
||||
this.updateElTableSelection()
|
||||
// 清空后也同步给外部,保持外层状态一致
|
||||
this.elDataTable.$emit('selection-change', this.elDataTable.selected)
|
||||
}
|
||||
|
||||
/**
|
||||
* 将selected状态同步到el-table中
|
||||
*/
|
||||
updateElTableSelection() {
|
||||
const { data, id, selected } = this.elDataTable
|
||||
const selectedIds = new Set(selected.map(r => r[id]))
|
||||
|
||||
this.elTable?.clearSelection()
|
||||
|
||||
data.forEach(row => {
|
||||
const shouldBeSelected = selectedIds.has(row[id])
|
||||
if (!this.elTable) return
|
||||
|
||||
if (shouldBeSelected) {
|
||||
this.elTable.toggleRowSelection(row, true)
|
||||
}
|
||||
|
||||
@@ -107,8 +107,8 @@ export default {
|
||||
const formatterArgs = value?.formatterArgs
|
||||
// console.log('>>> name: ', key)
|
||||
// console.log('>>> formatter: ', formatter)
|
||||
const detailFormatters = ['AmountFormatter', 'DetailFormatter']
|
||||
if (formatter && detailFormatters.includes(formatter.name) && formatterArgs.drawer !== false) {
|
||||
const detailFormaters = ['AmountFormatter', 'DetailFormatter']
|
||||
if (formatter && detailFormaters.includes(formatter.name) && formatterArgs.drawer !== false) {
|
||||
formatterArgs.onClick = this.onDetail
|
||||
}
|
||||
}
|
||||
@@ -223,6 +223,7 @@ export default {
|
||||
}
|
||||
|
||||
title = actionLabel + this.$t('WordSep') + toLowerCaseExcludeAbbr(title)
|
||||
|
||||
return title
|
||||
},
|
||||
getDefaultDrawer(action) {
|
||||
@@ -294,6 +295,7 @@ export default {
|
||||
// 3. 设置组件
|
||||
this.drawerComponent = this.getDrawerComponent(action, payload)
|
||||
this.$log.debug('>>> drawerComponent: ', this.drawerComponent)
|
||||
this.drawerTitle = this.getActionDrawerTitle({ action, row, col, cellValue, payload })
|
||||
|
||||
// 4. 如果没有组件,尝试获取默认组件
|
||||
if (!this.drawerComponent) {
|
||||
@@ -310,7 +312,6 @@ export default {
|
||||
const actionMeta = await this.$store.getters['common/drawerActionMeta']
|
||||
this.title = this.getDrawerTitle({ action, ...actionMeta })
|
||||
}
|
||||
this.drawerTitle = this.getActionDrawerTitle({ action, row, col, cellValue, payload })
|
||||
|
||||
// 7. 等待下一个 tick,确保组件已设置
|
||||
await this.$nextTick()
|
||||
|
||||
@@ -58,7 +58,6 @@
|
||||
:import-option="importOption"
|
||||
:json-data="jsonData"
|
||||
:url="url"
|
||||
v-bind="$attrs"
|
||||
@cancel="cancelUpload"
|
||||
@finish="closeDialog"
|
||||
/>
|
||||
@@ -248,46 +247,46 @@ export default {
|
||||
</script>
|
||||
|
||||
<style lang='scss' scoped>
|
||||
@import "~@/styles/variables";
|
||||
@import "~@/styles/variables";
|
||||
|
||||
.error-msg {
|
||||
color: $--color-danger;
|
||||
}
|
||||
|
||||
.error-msg.error-results {
|
||||
background-color: #f3f3f4;
|
||||
max-height: 200px;
|
||||
overflow: auto
|
||||
}
|
||||
|
||||
.file-uploader ::v-deep .el-upload {
|
||||
width: 100%;
|
||||
//padding-right: 150px;
|
||||
}
|
||||
|
||||
.file-uploader ::v-deep .el-upload-dragger {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.importTableZone {
|
||||
padding: 0 20px;
|
||||
|
||||
.importTable {
|
||||
overflow: auto;
|
||||
.error-msg {
|
||||
color: $--color-danger;
|
||||
}
|
||||
|
||||
.tableFilter {
|
||||
padding-bottom: 10px;
|
||||
.error-msg.error-results {
|
||||
background-color: #f3f3f4;
|
||||
max-height: 200px;
|
||||
overflow: auto
|
||||
}
|
||||
}
|
||||
|
||||
.importTable ::v-deep .el-dialog__body {
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
.file-uploader ::v-deep .el-upload {
|
||||
width: 100%;
|
||||
//padding-right: 150px;
|
||||
}
|
||||
|
||||
.export-item {
|
||||
margin-left: 80px;
|
||||
}
|
||||
.file-uploader ::v-deep .el-upload-dragger {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.importTableZone {
|
||||
padding: 0 20px;
|
||||
|
||||
.importTable {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.tableFilter {
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.importTable ::v-deep .el-dialog__body {
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
.export-item {
|
||||
margin-left: 80px;
|
||||
}
|
||||
|
||||
.export-item:first-child {
|
||||
margin-left: 0;
|
||||
|
||||
@@ -97,10 +97,6 @@ export default {
|
||||
origin: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
encryptFields: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
}
|
||||
},
|
||||
data() {
|
||||
@@ -277,15 +273,11 @@ export default {
|
||||
}
|
||||
return columns
|
||||
},
|
||||
getEncryptFields() {
|
||||
const fromProp = Array.isArray(this.encryptFields) && this.encryptFields.length ? this.encryptFields : null
|
||||
return fromProp || ['password', 'secret', 'private_key']
|
||||
},
|
||||
generateTableData(tableTitles, tableData) {
|
||||
const totalData = []
|
||||
tableData.forEach(item => {
|
||||
this.$set(item, '@status', 'pending')
|
||||
const encryptFields = this.getEncryptFields()
|
||||
const encryptFields = ['password', 'secret', 'private_key']
|
||||
for (const field of encryptFields) {
|
||||
if (item[field]) {
|
||||
item[field] = encryptPassword(item[field])
|
||||
|
||||
@@ -86,11 +86,13 @@ export default {
|
||||
},
|
||||
datePick: {
|
||||
type: Function,
|
||||
default: val => {}
|
||||
default: (val) => {
|
||||
}
|
||||
},
|
||||
searchTable: {
|
||||
type: Function,
|
||||
default: val => {}
|
||||
default: (val) => {
|
||||
}
|
||||
},
|
||||
selectedRows: {
|
||||
type: Array,
|
||||
@@ -151,7 +153,7 @@ export default {
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
<style lang='scss' scoped>
|
||||
$innerHeight: 28px;
|
||||
$headerHeight: 30px;
|
||||
|
||||
@@ -237,4 +239,5 @@ $headerHeight: 30px;
|
||||
display: block;
|
||||
padding: 5px 20px;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
@@ -9,7 +9,7 @@
|
||||
/>
|
||||
<TableAction
|
||||
v-if="hasActions"
|
||||
:class="{ 'filter-expand': filterExpand }"
|
||||
:class="{'filter-expand': filterExpand}"
|
||||
:date-pick="handleDateChange"
|
||||
:has-quick-filter="iHasQuickFilter"
|
||||
:quick-filter-expand.sync="filterExpand"
|
||||
@@ -85,13 +85,10 @@ export default {
|
||||
date_from: getDaysAgo(7).toISOString(),
|
||||
date_to: this.$moment(getDayEnd()).add(1, 'day').toISOString()
|
||||
}
|
||||
this.headerActions.datePicker = Object.assign(
|
||||
{
|
||||
dateStart: extraQuery.date_from,
|
||||
dateEnd: extraQuery.date_to
|
||||
},
|
||||
this.headerActions.datePicker
|
||||
)
|
||||
this.headerActions.datePicker = Object.assign({
|
||||
dateStart: extraQuery.date_from,
|
||||
dateEnd: extraQuery.date_to
|
||||
}, this.headerActions.datePicker)
|
||||
}
|
||||
if (this.$route.query.order) {
|
||||
extraQuery['order'] = this.$route.query.order
|
||||
@@ -172,7 +169,7 @@ export default {
|
||||
extraQuery: this.extraQuery
|
||||
})
|
||||
const checkRoot = !(this.$route.meta?.disableOrgsChange === true)
|
||||
const checkPermAndRoot = action => {
|
||||
const checkPermAndRoot = (action) => {
|
||||
if (!this.hasActionPerm(action)) {
|
||||
return this.$t('NoPermission')
|
||||
}
|
||||
@@ -393,6 +390,6 @@ export default {
|
||||
|
||||
//修改颜色
|
||||
.el-button--text {
|
||||
color: #409eff;
|
||||
color: #409EFF;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -23,7 +23,7 @@ const defaultPerformDelete = function({ row, col }) {
|
||||
|
||||
const defaultUpdateCallback = function({ row, col }) {
|
||||
const id = row.id
|
||||
let route = { params: { id: id } }
|
||||
let route = { params: { id: id }}
|
||||
const updateRoute = this.colActions.updateRoute
|
||||
|
||||
if (typeof updateRoute === 'object') {
|
||||
@@ -39,7 +39,7 @@ const defaultUpdateCallback = function({ row, col }) {
|
||||
|
||||
const defaultViewCallback = function({ row, col }) {
|
||||
const id = row.id
|
||||
let route = { params: { id: id } }
|
||||
let route = { params: { id: id }}
|
||||
const viewRoute = this.colActions.viewRoute
|
||||
|
||||
if (typeof updateRoute === 'object') {
|
||||
@@ -55,7 +55,7 @@ const defaultViewCallback = function({ row, col }) {
|
||||
|
||||
const defaultCloneCallback = function({ row, col }) {
|
||||
const id = row.id
|
||||
let route = { query: { clone_from: id } }
|
||||
let route = { query: { clone_from: id }}
|
||||
const cloneRoute = this.colActions.cloneRoute
|
||||
|
||||
if (typeof cloneRoute === 'object') {
|
||||
@@ -82,7 +82,7 @@ const defaultDeleteCallback = function({ row, col, cellValue, reload }) {
|
||||
type: 'warning',
|
||||
confirmButtonClass: 'el-button--danger',
|
||||
showCancelButton: true,
|
||||
beforeClose: async (action, instance, done) => {
|
||||
beforeClose: async(action, instance, done) => {
|
||||
if (action !== 'confirm') return done()
|
||||
instance.confirmButtonLoading = true
|
||||
try {
|
||||
|
||||
@@ -16,7 +16,7 @@
|
||||
closable
|
||||
size="small"
|
||||
type="info"
|
||||
@click="handleTagClick(v, k)"
|
||||
@click="handleTagClick(v,k)"
|
||||
@close.stop="handleTagClose(k)"
|
||||
>
|
||||
<strong v-if="v.label">{{ v.label + ':' }}</strong>
|
||||
@@ -40,6 +40,7 @@
|
||||
/>
|
||||
<span :class="isFocus ? 'is-focus ' : ''" class="keydown-focus">/</span>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -48,7 +49,8 @@ export default {
|
||||
props: {
|
||||
config: {
|
||||
type: Object,
|
||||
default: () => {}
|
||||
default: () => {
|
||||
}
|
||||
},
|
||||
options: {
|
||||
type: Array,
|
||||
@@ -88,14 +90,13 @@ export default {
|
||||
},
|
||||
filterMaps() {
|
||||
const data = {}
|
||||
const keyword = 'search'
|
||||
for (let key in this.filterTags) {
|
||||
const value = this.filterTags[key]['value']
|
||||
if (key === '') {
|
||||
key = keyword
|
||||
key = 'search'
|
||||
}
|
||||
if (key.startsWith(keyword)) {
|
||||
data[keyword] = (data[keyword] ? data[keyword] + ',' : '') + value
|
||||
if (key.startsWith('search')) {
|
||||
data['search'] = (data.search ? data.search + ',' : '') + value
|
||||
} else {
|
||||
data[key] = value
|
||||
}
|
||||
@@ -137,7 +138,7 @@ export default {
|
||||
this.emptyCount = 1
|
||||
}
|
||||
},
|
||||
$route(to, from) {
|
||||
'$route'(to, from) {
|
||||
if (from.query !== to.query) {
|
||||
this.filterTags = {}
|
||||
if (to.query && Object.keys(to.query).length) {
|
||||
@@ -168,7 +169,7 @@ export default {
|
||||
// 获取url中的查询条件,判断是不是包含在当前查询条件里
|
||||
checkInTableColumns(options) {
|
||||
const searchFieldOptions = {}
|
||||
const queryInfoValues = options.map(i => i.value)
|
||||
const queryInfoValues = options.map((i) => i.value)
|
||||
const routeQuery = this.getUrlQuery ? this.$route?.query : {}
|
||||
const routeQueryKeysLength = Object.keys(routeQuery).length
|
||||
if (routeQueryKeysLength < 1) return searchFieldOptions
|
||||
@@ -243,10 +244,12 @@ export default {
|
||||
delete routeFilter.search
|
||||
}
|
||||
const asFilterTags = _.cloneDeep(this.filterTags)
|
||||
this.filterTags = {
|
||||
...asFilterTags,
|
||||
...routeFilter
|
||||
}
|
||||
setTimeout(() => {
|
||||
this.filterTags = {
|
||||
...asFilterTags,
|
||||
...routeFilter
|
||||
}
|
||||
}, 100)
|
||||
},
|
||||
getValueLabel(key, value) {
|
||||
for (const field of this.options) {
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
class="left"
|
||||
>
|
||||
<span v-if="component === 'AutoDataZTree'" class="title">
|
||||
{{ title }}
|
||||
{{ $t('AssetTree') }}
|
||||
</span>
|
||||
<component
|
||||
:is="component"
|
||||
@@ -111,13 +111,6 @@ export default {
|
||||
headerActions: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
},
|
||||
title: {
|
||||
// eslint-disable-next-line vue/require-prop-type-constructor
|
||||
type: String,
|
||||
default() {
|
||||
return this.$t('AssetTree')
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
|
||||
@@ -421,8 +421,12 @@ export default {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.data-z-tree ::v-deep .icon {
|
||||
width: 10px;
|
||||
margin-right: 3px;
|
||||
.data-z-tree {
|
||||
::v-deep {
|
||||
.icon {
|
||||
width: 10px;
|
||||
margin-right: 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,52 +1,20 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
v-if="enabled && showModal"
|
||||
:visible.sync="dialogVisible"
|
||||
:title="title"
|
||||
:close-on-click-modal="false"
|
||||
:close-on-press-escape="false"
|
||||
:show-close="false"
|
||||
width="35%"
|
||||
class="announcement-dialog"
|
||||
center
|
||||
>
|
||||
<div class="announcement-content">
|
||||
<div class="content-wrapper">
|
||||
<MarkDown :value="announcement.content" class="markdown" />
|
||||
</div>
|
||||
<div v-if="announcement.link" class="link-section">
|
||||
<el-link :href="announcement.link" class="link-more" target="_blank" type="info">
|
||||
{{ $t('ViewMore') }}
|
||||
</el-link>
|
||||
<i class="fa fa-external-link icon" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="onModalConfirm">
|
||||
{{ $t('Confirm') }}
|
||||
</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<el-alert
|
||||
v-if="enabled && showAlert"
|
||||
:center="false"
|
||||
:title="title"
|
||||
class="announcement"
|
||||
type="success"
|
||||
@close="onAlertClose"
|
||||
>
|
||||
<MarkDown :value="announcement.content" class="markdown" />
|
||||
<span v-if="announcement.link">
|
||||
<el-link :href="announcement.link" class="link-more" target="_blank" type="info">
|
||||
{{ $t('ViewMore') }}
|
||||
</el-link>
|
||||
<i class="fa fa-external-link icon" />
|
||||
</span>
|
||||
</el-alert>
|
||||
</div>
|
||||
<el-alert
|
||||
v-if="enabled && !isViewed()"
|
||||
:center="false"
|
||||
:title="title"
|
||||
class="announcement"
|
||||
type="success"
|
||||
@close="onClose"
|
||||
>
|
||||
<MarkDown :value="announcement.content" class="markdown" />
|
||||
<span v-if="announcement.link">
|
||||
<el-link :href="announcement.link" class="link-more" target="_blank" type="info">
|
||||
{{ $t('ViewMore') }}
|
||||
</el-link>
|
||||
<i class="fa fa-external-link icon" />
|
||||
</span>
|
||||
</el-alert>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -58,11 +26,7 @@ export default {
|
||||
components: { MarkDown },
|
||||
data() {
|
||||
return {
|
||||
viewedKey: 'AnnouncementViewed',
|
||||
modalConfirmedKey: 'AnnouncementModalConfirmed',
|
||||
dialogVisible: false,
|
||||
modalConfirmed: false,
|
||||
alertViewed: false
|
||||
viewedKey: 'AnnouncementViewed'
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
@@ -94,200 +58,48 @@ export default {
|
||||
const start = new Date(this.announcement.date_start)
|
||||
const end = new Date(this.announcement.date_end)
|
||||
return now >= start && now <= end
|
||||
},
|
||||
showModal() {
|
||||
return !this.modalConfirmed
|
||||
},
|
||||
showAlert() {
|
||||
return this.modalConfirmed && !this.alertViewed
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
enabled: {
|
||||
handler(val) {
|
||||
if (val) {
|
||||
this.initializeState()
|
||||
this.checkAndShowDialog()
|
||||
}
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.initializeState()
|
||||
this.checkAndShowDialog()
|
||||
},
|
||||
methods: {
|
||||
initializeState() {
|
||||
this.modalConfirmed = this.isModalConfirmed()
|
||||
this.alertViewed = this.isAlertViewed()
|
||||
},
|
||||
checkAndShowDialog() {
|
||||
if (this.enabled && this.showModal) {
|
||||
this.dialogVisible = true
|
||||
}
|
||||
},
|
||||
onModalConfirm() {
|
||||
localStorage.setItem(this.modalConfirmedKey, this.announcement.id)
|
||||
this.modalConfirmed = true
|
||||
this.dialogVisible = false
|
||||
|
||||
this.$emit('announcement-modal-confirmed', {
|
||||
id: this.announcement.id,
|
||||
subject: this.announcement.subject,
|
||||
confirmedAt: new Date().toISOString()
|
||||
})
|
||||
},
|
||||
onAlertClose() {
|
||||
onClose() {
|
||||
localStorage.setItem(this.viewedKey, this.announcement.id)
|
||||
this.alertViewed = true
|
||||
|
||||
this.$emit('announcement-read', {
|
||||
id: this.announcement.id,
|
||||
subject: this.announcement.subject,
|
||||
readAt: new Date().toISOString()
|
||||
})
|
||||
},
|
||||
isModalConfirmed() {
|
||||
const confirmedId = localStorage.getItem(this.modalConfirmedKey)
|
||||
return confirmedId === this.announcement.id
|
||||
},
|
||||
isAlertViewed() {
|
||||
const viewedId = localStorage.getItem(this.viewedKey)
|
||||
return viewedId === this.announcement.id
|
||||
},
|
||||
isViewed() {
|
||||
return this.isAlertViewed()
|
||||
const viewedId = localStorage.getItem(this.viewedKey)
|
||||
return viewedId === this.announcement.id
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.announcement-dialog ::v-deep .el-dialog {
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.announcement-dialog ::v-deep .el-dialog__wrapper {
|
||||
backdrop-filter: blur(4px);
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.announcement-dialog ::v-deep .el-dialog {
|
||||
width: 95% !important;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.announcement-content {
|
||||
padding: 20px 25px 15px;
|
||||
|
||||
.content-wrapper {
|
||||
padding: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.dialog-footer {
|
||||
.el-button {
|
||||
padding: 10px;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.announcement-dialog ::v-deep .el-dialog__header {
|
||||
border-radius: 8px 8px 0 0;
|
||||
padding: 10px 20px 10px 20px;
|
||||
|
||||
.el-dialog__title {
|
||||
color: black;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
.announcement-dialog ::v-deep .el-dialog__body {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.announcement-content {
|
||||
padding: 25px 30px 20px;
|
||||
|
||||
.link-section {
|
||||
margin-top: 20px;
|
||||
padding-top: 15px;
|
||||
border-top: 1px solid #e4e7ed;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.dialog-footer {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
|
||||
.el-button {
|
||||
padding: 10px 20px;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
.announcement ::v-deep .el-alert__content {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.announcement-main {
|
||||
word-wrap: break-word;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
.icon {
|
||||
vertical-align: text-bottom;
|
||||
color: var(--color-info) !important;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.markdown {
|
||||
background-color: transparent !important;
|
||||
font-size: 14px;
|
||||
line-height: 1.8;
|
||||
color: #2c3e50;
|
||||
|
||||
.link-more {
|
||||
font-size: 13px;
|
||||
color: #409eff !important;
|
||||
text-decoration: none;
|
||||
padding: 4px 8px;
|
||||
border-radius: 4px;
|
||||
background: rgba(64, 158, 255, 0.1);
|
||||
transition: all 0.3s;
|
||||
|
||||
&:hover {
|
||||
background: #409eff;
|
||||
color: white !important;
|
||||
}
|
||||
font-size: 10px;
|
||||
margin-left: 10px;
|
||||
border-bottom: solid 1px;
|
||||
color: var(--color-info) !important;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
margin: 0 0 15px 0;
|
||||
color: #303133;
|
||||
font-weight: 600;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
h4, h5, h6 {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
p {
|
||||
margin-bottom: 16px;
|
||||
line-height: 1.8;
|
||||
color: #4b5563;
|
||||
h1, h2, h3, h4, h5 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -33,7 +33,7 @@ export default {
|
||||
const first = matched[0]
|
||||
|
||||
if (!this.isDashboard(first)) {
|
||||
matched = [{ path: '/dashboard', meta: { title: 'dashboard' } }].concat(matched)
|
||||
matched = [{ path: '/dashboard', meta: { title: 'dashboard' }}].concat(matched)
|
||||
}
|
||||
|
||||
this.levelList = matched.filter(item => item.meta && item.meta.title && item.meta.breadcrumb !== false)
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<script>
|
||||
export default {
|
||||
name: 'Icon',
|
||||
name: 'Index',
|
||||
props: {
|
||||
icon: {
|
||||
type: String,
|
||||
|
||||
@@ -37,4 +37,3 @@ export { default as Pagination } from './Table/Pagination'
|
||||
export { default as Tooltip } from './Widgets/Tooltip'
|
||||
export { default as ResourceActivity } from './Apps/ResourceActivity'
|
||||
export { default as MarkDown } from './Widgets/MarkDown'
|
||||
export { default as VariablesHelpTextDialog } from './Apps/VariablesHelpTextDialog'
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
// i18n.js
|
||||
import Vue from 'vue'
|
||||
import locale from 'element-ui/lib/locale'
|
||||
import locale from 'elementui-lts/lib/locale'
|
||||
import VueI18n from 'vue-i18n'
|
||||
import messages from './langs'
|
||||
import date from './date'
|
||||
@@ -54,7 +54,7 @@ export async function fetchTranslationsFromAPI() {
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
alert(error)
|
||||
} finally {
|
||||
await store.dispatch('app/setI18nLoaded', true)
|
||||
}
|
||||
|
||||
@@ -1,44 +1,45 @@
|
||||
import zhLocale from 'elementui-lts/lib/locale/lang/zh-CN'
|
||||
import zhTWLocale from 'elementui-lts/lib/locale/lang/zh-TW'
|
||||
import enLocale from 'elementui-lts/lib/locale/lang/en'
|
||||
import jaLocale from 'elementui-lts/lib/locale/lang/ja'
|
||||
import ptBrLocale from 'elementui-lts/lib/locale/lang/pt-br'
|
||||
import esLocale from 'elementui-lts/lib/locale/lang/es'
|
||||
import ruLocale from 'elementui-lts/lib/locale/lang/ru-RU'
|
||||
import koLocale from 'elementui-lts/lib/locale/lang/ko'
|
||||
import zh from './zh.json'
|
||||
import zh_hant from './zh_hant.json'
|
||||
import zhHant from './zh_hant.json'
|
||||
import en from './en.json'
|
||||
import ja from './ja.json'
|
||||
|
||||
// Map app locales to Element-UI locale file names
|
||||
const elementLocaleNameByAppLocale = {
|
||||
zh: 'zh-CN',
|
||||
zh_hant: 'zh-TW',
|
||||
en: 'en',
|
||||
ja: 'ja',
|
||||
pt_br: 'pt-br',
|
||||
es: 'es',
|
||||
ru: 'ru-RU',
|
||||
ko: 'ko',
|
||||
vi: 'vi'
|
||||
}
|
||||
|
||||
function loadElementLocale(localeName) {
|
||||
try {
|
||||
// eslint-disable-next-line import/no-dynamic-require, global-require
|
||||
const mod = require(`element-ui/lib/locale/lang/${localeName}`)
|
||||
return (mod && (mod.default || mod)) || {}
|
||||
} catch (e) {
|
||||
return {}
|
||||
const messages = {
|
||||
zh: {
|
||||
...zhLocale,
|
||||
...zh
|
||||
},
|
||||
zh_hant: {
|
||||
...zhTWLocale,
|
||||
...zhHant
|
||||
},
|
||||
en: {
|
||||
...enLocale,
|
||||
...en
|
||||
},
|
||||
ja: {
|
||||
...jaLocale,
|
||||
...ja
|
||||
},
|
||||
pt_br: {
|
||||
...ptBrLocale
|
||||
},
|
||||
es: {
|
||||
...esLocale
|
||||
},
|
||||
ru: {
|
||||
...ruLocale
|
||||
},
|
||||
ko: {
|
||||
...koLocale
|
||||
}
|
||||
}
|
||||
|
||||
const appLocaleMessages = {
|
||||
zh,
|
||||
zh_hant,
|
||||
en,
|
||||
ja
|
||||
}
|
||||
|
||||
const messages = Object.keys(elementLocaleNameByAppLocale).reduce((acc, appLocale) => {
|
||||
const elementLocaleName = elementLocaleNameByAppLocale[appLocale]
|
||||
const elementLocale = loadElementLocale(elementLocaleName)
|
||||
const appMessages = appLocaleMessages[appLocale] || {}
|
||||
acc[appLocale] = { ...elementLocale, ...appMessages }
|
||||
return acc
|
||||
}, {})
|
||||
|
||||
export default messages
|
||||
|
||||
@@ -78,3 +78,6 @@ export default {
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss">
|
||||
</style>
|
||||
|
||||
@@ -225,9 +225,24 @@ export default {
|
||||
default(error, method, vm) {
|
||||
const response = error.response
|
||||
const data = response.data
|
||||
if (response.status === 400 && data && typeof data === 'object') {
|
||||
// 覆盖式设置错误映射,避免触发表单内容重建
|
||||
this.$refs.form.setErrors(data)
|
||||
if (response.status === 400) {
|
||||
for (const key of Object.keys(data)) {
|
||||
let err = ''
|
||||
let errorTips = data[key]
|
||||
if (errorTips instanceof Array) {
|
||||
errorTips = _.filter(errorTips, (item) => Object.keys(item).length > 0)
|
||||
for (const i of errorTips) {
|
||||
if (i instanceof Object) {
|
||||
err += i?.port?.join(',')
|
||||
} else {
|
||||
err += i
|
||||
}
|
||||
}
|
||||
} else {
|
||||
err = errorTips
|
||||
}
|
||||
this.$refs.form.setFieldError(key, err)
|
||||
}
|
||||
}
|
||||
this.$emit('performError', data)
|
||||
}
|
||||
|
||||
@@ -137,15 +137,14 @@ export default {
|
||||
this.$emit('submitError', error)
|
||||
const response = error.response
|
||||
const data = response.data
|
||||
// 不要逐个设置字段的 attrs.error 或改动 fields 引用。
|
||||
// 这样会触发表单 content 重建,导致用户已输入的内容被覆盖/清空,
|
||||
// 且可能出现只能显示一个字段错误的现象。
|
||||
// 这里改为使用 AutoDataForm 暴露的 setErrors(errors) 覆盖式设置:
|
||||
// - 直接同步到 UI 的 el-form-item.validateMessage
|
||||
// - 支持同时显示多个字段错误
|
||||
// - 不修改 fields/attrs 引用,避免输入丢失
|
||||
if (response.status === 400 && data && typeof data === 'object') {
|
||||
this.$refs.form.setErrors(data)
|
||||
if (response.status === 400) {
|
||||
for (const key of Object.keys(data)) {
|
||||
let value = data[key]
|
||||
if (value instanceof Array) {
|
||||
value = value.join(';')
|
||||
}
|
||||
this.$refs.form.setFieldError(key, value)
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
@@ -71,7 +71,7 @@ export default {
|
||||
},
|
||||
async logout() {
|
||||
const currentOrg = this.$store.getters.currentOrg
|
||||
if (currentOrg && (currentOrg.autoEnter || currentOrg.is_system)) {
|
||||
if (currentOrg.autoEnter || currentOrg.is_system) {
|
||||
await this.$store.dispatch('users/setCurrentOrg', this.$store.getters.preOrg)
|
||||
}
|
||||
window.location.href = `${process.env.VUE_APP_LOGOUT_PATH}?next=${this.$route.fullPath}`
|
||||
|
||||
@@ -4,7 +4,6 @@
|
||||
:placeholder="$tc('Select')"
|
||||
:value="currentOrgId"
|
||||
class="org-select"
|
||||
:style="{ width: selectWidth }"
|
||||
filterable
|
||||
popper-class="switch-org"
|
||||
@change="changeOrg"
|
||||
@@ -55,8 +54,7 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
orgOption: [],
|
||||
selectWidth: 'auto'
|
||||
orgOption: []
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
@@ -65,17 +63,6 @@ export default {
|
||||
'usingOrgs',
|
||||
'currentViewRoute'
|
||||
]),
|
||||
currentOrgDisplayName() {
|
||||
const currentOrgId = this.currentOrg?.id
|
||||
if (!currentOrgId) {
|
||||
return this.$tc('Select')
|
||||
}
|
||||
const matchedOrg = this.usingOrgs.find(item => item.id === currentOrgId)
|
||||
if (matchedOrg?.name) {
|
||||
return matchedOrg.name
|
||||
}
|
||||
return this.currentOrg.name || this.$tc('Select')
|
||||
},
|
||||
orgActionsGroup() {
|
||||
const orgActions = {
|
||||
label: this.$t('OrganizationList'),
|
||||
@@ -120,53 +107,7 @@ export default {
|
||||
return currentOrgId
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
currentOrgDisplayName() {
|
||||
this.updateWidth()
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.updateWidth()
|
||||
},
|
||||
methods: {
|
||||
updateWidth() {
|
||||
this.$nextTick(() => {
|
||||
// 创建临时元素来测量文本宽度
|
||||
const tempSpan = document.createElement('span')
|
||||
tempSpan.style.visibility = 'hidden'
|
||||
tempSpan.style.position = 'absolute'
|
||||
tempSpan.style.whiteSpace = 'nowrap'
|
||||
tempSpan.style.fontSize = '14px'
|
||||
tempSpan.style.fontFamily = '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif'
|
||||
tempSpan.style.fontWeight = 'normal'
|
||||
tempSpan.style.letterSpacing = 'normal'
|
||||
|
||||
// 获取当前组织显示名称
|
||||
const orgName = this.currentOrgDisplayName
|
||||
|
||||
tempSpan.textContent = orgName
|
||||
document.body.appendChild(tempSpan)
|
||||
|
||||
// 测量文本宽度
|
||||
const textWidth = tempSpan.offsetWidth
|
||||
|
||||
// 固定空间:左侧图标 + padding + 右侧箭头
|
||||
const iconWidth = 15 // 左侧图标
|
||||
const paddingWidth = 35 // 左右 padding
|
||||
const arrowWidth = 20 // 右侧箭头
|
||||
const totalWidth = textWidth + iconWidth + paddingWidth + arrowWidth
|
||||
|
||||
// 设置合理的边界
|
||||
const minWidth = 100
|
||||
const maxWidth = 400
|
||||
const finalWidth = Math.max(minWidth, Math.min(maxWidth, totalWidth))
|
||||
|
||||
this.selectWidth = finalWidth + 'px'
|
||||
|
||||
// 清理临时元素
|
||||
document.body.removeChild(tempSpan)
|
||||
})
|
||||
},
|
||||
changeOrg(orgId) {
|
||||
const org = this.usingOrgs.find(item => item.id === orgId)
|
||||
|
||||
@@ -180,7 +121,6 @@ export default {
|
||||
default:
|
||||
orgUtil.changeOrg(org, true, this)
|
||||
}
|
||||
this.updateWidth()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,637 +0,0 @@
|
||||
<template>
|
||||
<span ref="root" class="global-search">
|
||||
<!-- 搜索触发按钮 -->
|
||||
<div class="search-trigger" @click="openPanel">
|
||||
<el-input
|
||||
v-model="search"
|
||||
:placeholder="$t('Search')"
|
||||
class="search-input"
|
||||
readonly
|
||||
prefix-icon="el-icon-search"
|
||||
@keydown.esc.prevent="closePanel"
|
||||
@clear="clearSearch"
|
||||
>
|
||||
<template slot="suffix">
|
||||
<span class="search-shortcut">{{ shortcutText }}</span>
|
||||
</template>
|
||||
</el-input>
|
||||
</div>
|
||||
|
||||
<!-- 搜索模态框 -->
|
||||
<el-dialog
|
||||
:visible.sync="isOpen"
|
||||
:close-on-click-modal="true"
|
||||
:close-on-press-escape="true"
|
||||
:append-to-body="true"
|
||||
custom-class="search-modal"
|
||||
width="70%"
|
||||
@close="closePanel"
|
||||
>
|
||||
<div class="search-modal-content">
|
||||
<!-- 搜索框 -->
|
||||
<div class="search-input-wrapper">
|
||||
<el-input
|
||||
ref="panelSearchInput"
|
||||
v-model="search"
|
||||
:placeholder="$t('Search')"
|
||||
:clearable="true"
|
||||
size="large"
|
||||
prefix-icon="el-icon-search"
|
||||
@input="onInput"
|
||||
@keydown.enter.prevent="onEnter"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- 搜索结果内容 -->
|
||||
<div class="search-results">
|
||||
<div v-if="loading" class="section loading">{{ $t('Loading') }}...</div>
|
||||
|
||||
<template v-if="showHistory">
|
||||
<div class="section-title">
|
||||
<span>{{ $t('History') }}</span>
|
||||
<el-link class="clear-history-btn" @click="clearHistory">
|
||||
{{ $t('Clear') }}
|
||||
</el-link>
|
||||
</div>
|
||||
<ul class="list">
|
||||
<li
|
||||
v-for="(item, index) in history"
|
||||
:key="'h-' + index"
|
||||
class="item"
|
||||
@click="applyHistory(item)"
|
||||
>
|
||||
<i class="el-icon-time icon" />
|
||||
<span class="label">{{ item.q }}</span>
|
||||
<i class="el-icon-arrow-right go" />
|
||||
</li>
|
||||
</ul>
|
||||
</template>
|
||||
|
||||
<template v-if="routeSuggestions.length">
|
||||
<div class="section-title">{{ $t('Routes') }}</div>
|
||||
<ul class="list">
|
||||
<li
|
||||
v-for="route in routeSuggestions"
|
||||
:key="'r-' + route.name + route.path"
|
||||
class="item"
|
||||
@click="navigateRoute(route)"
|
||||
>
|
||||
<i class="el-icon-location-outline icon" />
|
||||
<span class="label">{{ route.title || route.name || route.path }}</span>
|
||||
<span class="sub">{{ route.path }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</template>
|
||||
|
||||
<template v-if="options.length">
|
||||
<div v-for="group in options" :key="'g-' + group.label" class="section">
|
||||
<div class="section-title">{{ group.label }}</div>
|
||||
<ul class="list">
|
||||
<li
|
||||
v-for="item in group.options"
|
||||
:key="item.value"
|
||||
class="item"
|
||||
@click="handleSearch(item)"
|
||||
>
|
||||
<Icon :icon="iconMap[item.model] || 'el-icon-document'" class="icon" />
|
||||
<span class="label">{{ item.name }}</span>
|
||||
<span class="sub">{{ item.content }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<div v-if="search && isEmpty" class="section empty">
|
||||
{{ $t('NoData') }}
|
||||
</div>
|
||||
|
||||
<div v-if="!search && history.length === 0" class="section placeholder">
|
||||
<div class="placeholder-content">
|
||||
<div class="supported-types">
|
||||
<div class="types-title">{{ $t('SupportedTypes') }}:</div>
|
||||
<div class="types-list">
|
||||
<span v-for="(icon, type) in iconMap" :key="type" class="type-item">
|
||||
<Icon :icon="icon" class="type-icon" />
|
||||
{{ $t(type) }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import _ from 'lodash'
|
||||
import { mapGetters } from 'vuex'
|
||||
import { ObjectLocalStorage } from '@/utils/common'
|
||||
import Icon from '@/components/Widgets/Icon/index.vue'
|
||||
|
||||
export default {
|
||||
name: 'Search',
|
||||
components: {
|
||||
Icon
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
search: '',
|
||||
loading: false,
|
||||
options: [],
|
||||
isOpen: false,
|
||||
history: [],
|
||||
routeSuggestions: [],
|
||||
routes: [],
|
||||
iconMap: {
|
||||
'Account': 'accounts',
|
||||
'Asset': 'assets',
|
||||
'User': 'user-o',
|
||||
'UserGroup': 'user-group',
|
||||
'AssetPermission': 'permission'
|
||||
},
|
||||
historyStore: new ObjectLocalStorage('globalSearchHistory')
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'viewRoutes'
|
||||
]),
|
||||
isEmpty() {
|
||||
return !this.routeSuggestions.length && this.options.length === 0
|
||||
},
|
||||
showHistory() {
|
||||
return this.history.length > 0 && !this.search
|
||||
},
|
||||
shortcutText() {
|
||||
return this.isMac ? '⌘K' : 'Ctrl+K'
|
||||
},
|
||||
isMac() {
|
||||
return navigator.platform.toUpperCase().indexOf('MAC') >= 0
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.loadHistory()
|
||||
this.buildRouteSuggestions()
|
||||
this.bindKeyboardShortcut()
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.unbindKeyboardShortcut()
|
||||
},
|
||||
methods: {
|
||||
openPanel() {
|
||||
this.isOpen = true
|
||||
this.buildRouteSuggestions()
|
||||
this.$nextTick(() => {
|
||||
this.$refs.panelSearchInput?.focus()
|
||||
})
|
||||
},
|
||||
closePanel() {
|
||||
this.isOpen = false
|
||||
},
|
||||
onInput() {
|
||||
this.openPanel()
|
||||
this.debouncedQuery()
|
||||
},
|
||||
clearSearch() {
|
||||
this.search = ''
|
||||
this.options = []
|
||||
this.buildRouteSuggestions()
|
||||
},
|
||||
onEnter() {
|
||||
if (this.options.length > 0) {
|
||||
this.handleSearch(this.options[0].options[0])
|
||||
}
|
||||
},
|
||||
debouncedQuery: _.debounce(function() {
|
||||
this.searchQuery(this.search)
|
||||
}, 300),
|
||||
async searchQuery(q) {
|
||||
if (!q) {
|
||||
this.options = []
|
||||
return
|
||||
}
|
||||
this.loading = true
|
||||
const url = '/api/v1/search/?q=' + q
|
||||
try {
|
||||
const res = await this.$axios.get(url)
|
||||
let options = res || []
|
||||
options = _.groupBy(res, 'model_label')
|
||||
this.options = Object.keys(options).map(key => ({
|
||||
label: key,
|
||||
options: options[key]
|
||||
}))
|
||||
} catch (error) {
|
||||
console.error('Search error:', error)
|
||||
this.options = []
|
||||
} finally {
|
||||
this.loading = false
|
||||
}
|
||||
},
|
||||
handleSearch(item) {
|
||||
const route = {
|
||||
name: item.model + 'Detail',
|
||||
params: { id: item.id }
|
||||
}
|
||||
this.addToHistory(this.search)
|
||||
this.$router.push(route)
|
||||
this.closePanel()
|
||||
},
|
||||
navigateRoute(route) {
|
||||
this.$router.push(route.path)
|
||||
this.closePanel()
|
||||
},
|
||||
filterRouteSuggestions(q) {
|
||||
if (!q) {
|
||||
this.routeSuggestions = []
|
||||
return
|
||||
}
|
||||
this.routeSuggestions = this.routes.filter(r => {
|
||||
const title = r.title || r.name || r.path
|
||||
return title.toLowerCase().includes(q.toLowerCase()) || r.path.toLowerCase().includes(q.toLowerCase())
|
||||
}).slice(0, 5)
|
||||
},
|
||||
buildRouteSuggestions() {
|
||||
if (this.routes.length > 0) {
|
||||
return
|
||||
}
|
||||
const allRoutes = this.viewRoutes
|
||||
const flat = []
|
||||
const walk = (routes, parentPath = '') => {
|
||||
for (const r of routes) {
|
||||
const path = parentPath + r.path
|
||||
if (r.path && r.path !== '/' && !r.hidden) {
|
||||
flat.push({
|
||||
name: r.name,
|
||||
path: path,
|
||||
title: r.meta?.title
|
||||
})
|
||||
}
|
||||
|
||||
if (r.children && r.children.length) {
|
||||
walk(r.children, path)
|
||||
}
|
||||
}
|
||||
}
|
||||
walk(allRoutes)
|
||||
this.routes = flat
|
||||
},
|
||||
loadHistory() {
|
||||
this.history = (this.historyStore.get('list') || []).filter(i => i.q)
|
||||
},
|
||||
addToHistory(q) {
|
||||
const entry = { q: q }
|
||||
const list = this.historyStore.get('list') || []
|
||||
const next = [
|
||||
entry,
|
||||
...list.filter(i => i.q !== entry.q)
|
||||
].slice(0, 10)
|
||||
this.historyStore.set('list', next)
|
||||
this.history = next
|
||||
},
|
||||
applyHistory(h) {
|
||||
this.search = h.q
|
||||
this.onInput()
|
||||
},
|
||||
clearHistory() {
|
||||
this.historyStore.set('list', [])
|
||||
this.history = []
|
||||
},
|
||||
bindKeyboardShortcut() {
|
||||
document.addEventListener('keydown', this.handleKeyboardShortcut)
|
||||
},
|
||||
unbindKeyboardShortcut() {
|
||||
document.removeEventListener('keydown', this.handleKeyboardShortcut)
|
||||
},
|
||||
handleKeyboardShortcut(event) {
|
||||
// 检查是否按下了正确的快捷键
|
||||
const isCorrectKey = event.key === 'k' || event.key === 'K'
|
||||
const isCorrectModifier = this.isMac ? event.metaKey : event.ctrlKey
|
||||
|
||||
if (isCorrectKey && isCorrectModifier) {
|
||||
// 阻止默认行为
|
||||
event.preventDefault()
|
||||
|
||||
// 如果当前有输入框聚焦,不触发搜索
|
||||
const activeElement = document.activeElement
|
||||
const isInputFocused = activeElement && (
|
||||
activeElement.tagName === 'INPUT' ||
|
||||
activeElement.tagName === 'TEXTAREA' ||
|
||||
activeElement.contentEditable === 'true'
|
||||
)
|
||||
|
||||
if (!isInputFocused) {
|
||||
this.openPanel()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.global-search {
|
||||
position: relative;
|
||||
width: 200px;
|
||||
height: 40px;
|
||||
padding: 5px 0;
|
||||
min-width: 200px;
|
||||
margin-right: 5px;
|
||||
|
||||
.search-trigger {
|
||||
height: 30px;
|
||||
line-height: 1;
|
||||
|
||||
.search-input {
|
||||
height: 30px;
|
||||
line-height: 1;
|
||||
background-color: rgba(5, 5, 5, 0.1);
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background-color: rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
::v-deep {
|
||||
.el-input__inner {
|
||||
height: 30px;
|
||||
line-height: 1;
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
|
||||
&::placeholder {
|
||||
color: #fff;
|
||||
opacity: 0.7;
|
||||
}
|
||||
}
|
||||
|
||||
.el-input__prefix .el-input__icon {
|
||||
font-size: 15px;
|
||||
line-height: 32px;
|
||||
}
|
||||
|
||||
.el-input__suffix {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.search-shortcut {
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
font-size: 11px;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
||||
font-weight: 500;
|
||||
letter-spacing: 0.5px;
|
||||
padding: 2px 6px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border-radius: 3px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.2);
|
||||
user-select: none;
|
||||
pointer-events: none;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 18px;
|
||||
line-height: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 搜索模态框全局样式 */
|
||||
::v-deep .search-modal {
|
||||
&.el-dialog {
|
||||
position: fixed;
|
||||
top: 5px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
max-height: calc(100vh - 10px);
|
||||
max-width: calc(100vw - 10px);
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 0 8px 4px #00000014;
|
||||
|
||||
.el-dialog__body {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.el-dialog__header {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep body .v-modal {
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
::v-deep .search-modal-content {
|
||||
height: 70vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
::v-deep .search-input-wrapper {
|
||||
padding: 20px;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
// background: #fff;
|
||||
|
||||
.el-input {
|
||||
.el-input__inner {
|
||||
font-size: 14px;
|
||||
height: 34px;
|
||||
line-height: 34px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .search-results {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
|
||||
/* 自定义滚动条 */
|
||||
&::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-track {
|
||||
background: #f1f1f1;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background: #c1c1c1;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-thumb:hover {
|
||||
background: #a8a8a8;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .section-title {
|
||||
padding: 12px 24px 6px;
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
color: #909399;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
border-top: 1px solid #f0f0f0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.clear-history-btn {
|
||||
background: none;
|
||||
border: none;
|
||||
padding: 4px;
|
||||
cursor: pointer;
|
||||
border-radius: 4px;
|
||||
transition: all 0.2s ease;
|
||||
color: red;
|
||||
|
||||
&:hover {
|
||||
background: #f5f5f5;
|
||||
color: #f56c6c;
|
||||
}
|
||||
|
||||
.clear-icon {
|
||||
font-size: 14px;
|
||||
color: red;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .list {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 8px 24px;
|
||||
cursor: pointer;
|
||||
border-bottom: 1px solid #f8f9fa;
|
||||
transition: all 0.2s ease;
|
||||
position: relative;
|
||||
|
||||
&:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: 3px;
|
||||
background: transparent;
|
||||
transition: background 0.2s ease;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: #f8f9fa;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.icon {
|
||||
// color: var(--color-primary, #409eff);
|
||||
margin-right: 12px;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.label {
|
||||
flex: 1;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
font-weight: 500;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
max-width: 60%;
|
||||
}
|
||||
|
||||
.sub {
|
||||
color: #909399;
|
||||
font-size: 12px;
|
||||
margin-left: 12px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
flex-shrink: 0;
|
||||
width: 40%;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.go {
|
||||
color: #c0c4cc;
|
||||
font-size: 12px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .loading,
|
||||
::v-deep .empty {
|
||||
padding: 32px 24px;
|
||||
color: #909399;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
::v-deep .section.placeholder {
|
||||
padding: 32px 24px;
|
||||
|
||||
.placeholder-content {
|
||||
text-align: center;
|
||||
|
||||
.supported-types {
|
||||
margin-bottom: 24px;
|
||||
|
||||
.types-title {
|
||||
margin-bottom: 12px;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.types-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
gap: 16px;
|
||||
|
||||
.type-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 8px 12px;
|
||||
background: #f8f9fa;
|
||||
border-radius: 6px;
|
||||
font-size: 13px;
|
||||
color: #666;
|
||||
transition: all 0.2s ease;
|
||||
|
||||
&:hover {
|
||||
background: #e9ecef;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.type-icon {
|
||||
margin-right: 6px;
|
||||
font-size: 14px;
|
||||
color: #409eff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,9 +1,6 @@
|
||||
<template>
|
||||
<div class="navbar">
|
||||
<ul class="navbar-right">
|
||||
<li class="header-item header-icon none-hover">
|
||||
<Search @search-open="handleSearchOpen" />
|
||||
</li>
|
||||
<li class="header-item header-icon">
|
||||
<el-tooltip :content="$tc('SiteMessageList')" :open-delay="500" effect="dark">
|
||||
<SiteMessages />
|
||||
@@ -34,18 +31,14 @@
|
||||
<AccountDropdown />
|
||||
</li>
|
||||
</ul>
|
||||
<hamburger
|
||||
:is-active="sidebar.opened"
|
||||
class="hamburger-container is-show-menu"
|
||||
@toggleClick="toggleSideBar"
|
||||
/>
|
||||
<hamburger :is-active="sidebar.opened" class="hamburger-container is-show-menu" @toggleClick="toggleSideBar" />
|
||||
<ul class="navbar-left">
|
||||
<li class="left-item">
|
||||
<div class="nav-logo">
|
||||
<Logo v-if="showLogo" :collapse="false" />
|
||||
</div>
|
||||
</li>
|
||||
<li v-if="orgsShow" class="left-item" style="margin-left: 20px">
|
||||
<li v-if="orgsShow" class="left-item" style="margin-left: 20px;">
|
||||
<Organization :disabled="orgsDisabled" class="organization" />
|
||||
</li>
|
||||
</ul>
|
||||
@@ -64,7 +57,6 @@ import Organization from './Organization'
|
||||
import SystemSetting from './SystemSetting'
|
||||
import Logo from '../NavLeft/Logo'
|
||||
import Language from './Language'
|
||||
import Search from './Search'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
@@ -77,22 +69,19 @@ export default {
|
||||
SiteMessages,
|
||||
SystemSetting,
|
||||
Logo,
|
||||
Language,
|
||||
Search
|
||||
Language
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
searchOpen: false
|
||||
}
|
||||
return {}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['sidebar', 'publicSettings', 'currentOrgRoles', 'currentViewRoute', 'isMobile']),
|
||||
...mapGetters([
|
||||
'sidebar', 'publicSettings', 'currentOrgRoles', 'currentViewRoute', 'isMobile'
|
||||
]),
|
||||
ticketsEnabled() {
|
||||
return (
|
||||
this.publicSettings['TICKETS_ENABLED'] &&
|
||||
return this.publicSettings['TICKETS_ENABLED'] &&
|
||||
this.$hasLicense() &&
|
||||
this.$hasPerm('tickets.view_ticket')
|
||||
)
|
||||
},
|
||||
showLogo() {
|
||||
return this.$store.state.settings.sidebarLogo
|
||||
@@ -101,188 +90,178 @@ export default {
|
||||
return this.$route.meta?.disableOrgsChange === true
|
||||
},
|
||||
orgsShow() {
|
||||
return this.$route.meta?.showOrganization !== false && this.$hasLicense()
|
||||
return (this.$route.meta?.showOrganization !== false) && this.$hasLicense()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
toggleSideBar() {
|
||||
this.$store.dispatch('app/toggleSideBar')
|
||||
},
|
||||
handleSearchOpen(val) {
|
||||
// this.searchOpen = val
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@import '~@/styles/variables.scss';
|
||||
@import "~@/styles/variables.scss";
|
||||
|
||||
.navbar {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
background-color: var(--banner-bg);
|
||||
.navbar {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
background-color: var(--banner-bg);
|
||||
|
||||
ul {
|
||||
margin: 0;
|
||||
padding-inline-start: 0;
|
||||
}
|
||||
ul {
|
||||
margin: 0;
|
||||
padding-inline-start: 0;
|
||||
}
|
||||
|
||||
.is-show-menu {
|
||||
display: none;
|
||||
}
|
||||
.is-show-menu {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.hamburger-container {
|
||||
float: left;
|
||||
height: 25px;
|
||||
line-height: 25px;
|
||||
margin: 8px;
|
||||
padding: 1px 8px !important;
|
||||
border-radius: 5px;
|
||||
border-color: $--color-primary;
|
||||
background-color: white;
|
||||
color: var(--text-primary);
|
||||
cursor: pointer;
|
||||
transition: 0.2s;
|
||||
opacity: 0.7;
|
||||
}
|
||||
.hamburger-container {
|
||||
float: left;
|
||||
height: 25px;
|
||||
line-height: 25px;
|
||||
margin: 8px;
|
||||
padding: 1px 8px !important;
|
||||
border-radius: 5px;
|
||||
border-color: $--color-primary;
|
||||
background-color: white;
|
||||
color: var(--text-primary);
|
||||
cursor: pointer;
|
||||
transition: .2s;
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.navbar-left {
|
||||
float: left;
|
||||
display: flex;
|
||||
height: 100%;
|
||||
|
||||
.left-item {
|
||||
.navbar-left {
|
||||
float: left;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
list-style: none;
|
||||
height: 100%;
|
||||
|
||||
.nav-logo {
|
||||
width: 200px;
|
||||
.left-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
list-style: none;
|
||||
|
||||
.nav-logo {
|
||||
width: 200px;
|
||||
|
||||
&:hover {
|
||||
background: rgba(0, 0, 0, 12%);
|
||||
}
|
||||
}
|
||||
|
||||
.organization {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 0 0 15px !important;
|
||||
border-radius: 3px;
|
||||
background-color: rgba(255, 255, 255, .10);
|
||||
color: #fff;
|
||||
font-weight: 600;
|
||||
font-size: 15px;
|
||||
max-width: 250px;
|
||||
|
||||
::v-deep .el-input__inner {
|
||||
padding-left: 25px;
|
||||
}
|
||||
|
||||
::v-deep .el-input.is-disabled > input {
|
||||
background: none;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: rgba(0, 0, 0, .12) !important;
|
||||
}
|
||||
}
|
||||
|
||||
// 未找到与之对应的
|
||||
& ::v-deep .el-submenu__title {
|
||||
font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
padding: 0 8px;
|
||||
line-height: $headerHeight;
|
||||
height: $headerHeight;
|
||||
}
|
||||
|
||||
// 未找到与之对应的
|
||||
& ::v-deep .svg-icon {
|
||||
color: #FFF !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-right {
|
||||
display: flex;
|
||||
float: right;
|
||||
align-items: center;
|
||||
margin-right: 10px;
|
||||
|
||||
.header-item {
|
||||
display: flex;
|
||||
line-height: $headerHeight;
|
||||
padding-right: 10px;
|
||||
padding-left: 10px;
|
||||
|
||||
& ::v-deep .svg-icon {
|
||||
line-height: 40px;
|
||||
color: #FFF !important;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
& ::v-deep .el-badge {
|
||||
vertical-align: top;
|
||||
|
||||
.el-link {
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
.el-badge__content--primary {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.el-badge__content {
|
||||
top: 8px;
|
||||
height: 15px;
|
||||
line-height: 15px;
|
||||
border: none;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
}
|
||||
|
||||
& ::v-deep i {
|
||||
color: #FFF;
|
||||
font-size: 16px;
|
||||
|
||||
&.el-icon-arrow-down {
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
& ::v-deep i.el-dialog__close.el-icon-close {
|
||||
color: #7c7e7f;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: rgba(0, 0, 0, 12%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.organization {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 0 0 15px ;
|
||||
border-radius: 3px;
|
||||
// background-color: rgba(5, 5, 5, 0.1);
|
||||
color: #fff;
|
||||
font-weight: 600;
|
||||
font-size: 15px;
|
||||
max-width: 250px;
|
||||
|
||||
::v-deep .el-input__inner {
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
::v-deep .el-input.is-disabled > input {
|
||||
background: none;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
@media screen and (max-width: 1006px) {
|
||||
.navbar {
|
||||
.is-show-menu {
|
||||
display: block;
|
||||
}
|
||||
|
||||
// 未找到与之对应的
|
||||
& ::v-deep .el-submenu__title {
|
||||
font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||
padding: 0 8px;
|
||||
line-height: $headerHeight;
|
||||
height: $headerHeight;
|
||||
}
|
||||
|
||||
// 未找到与之对应的
|
||||
& ::v-deep .svg-icon {
|
||||
color: #fff !important;
|
||||
.navbar-left {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-right {
|
||||
display: flex;
|
||||
float: right;
|
||||
align-items: center;
|
||||
margin-right: 10px;
|
||||
|
||||
.header-item {
|
||||
display: flex;
|
||||
line-height: $headerHeight;
|
||||
padding-right: 10px;
|
||||
padding-left: 10px;
|
||||
|
||||
& ::v-deep .svg-icon {
|
||||
line-height: 40px;
|
||||
color: #fff;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
& ::v-deep .el-badge {
|
||||
vertical-align: top;
|
||||
|
||||
.el-link {
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
.el-badge__content--primary {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.el-badge__content {
|
||||
top: 8px;
|
||||
height: 15px;
|
||||
line-height: 15px;
|
||||
border: none;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
}
|
||||
|
||||
& ::v-deep i {
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
|
||||
&.el-icon-arrow-down {
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
& ::v-deep i.el-dialog__close.el-icon-close {
|
||||
color: #7c7e7f;
|
||||
}
|
||||
|
||||
&.none-hover {
|
||||
padding: 0;
|
||||
&:hover {
|
||||
background: none;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: rgba(0, 0, 0, 12%);
|
||||
}
|
||||
@media screen and (max-width: 480px) {
|
||||
.active-menu {
|
||||
display: none !important;;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1006px) {
|
||||
.navbar {
|
||||
.is-show-menu {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.navbar-left {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
.active-menu {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,24 +1,18 @@
|
||||
<template>
|
||||
<div
|
||||
:class="{ 'has-logo': showLogo, 'show-orgs': showOrgs, collapsed: isCollapse }"
|
||||
class="left-side-wrapper"
|
||||
>
|
||||
<div :class="{'has-logo': showLogo, 'show-orgs': showOrgs, 'collapsed': isCollapse}" class="left-side-wrapper">
|
||||
<div class="nav-header">
|
||||
<div class="active-mobile">
|
||||
<Organization v-if="$hasLicense()" class="organization" />
|
||||
</div>
|
||||
<div class="nav-title">
|
||||
<span :class="switchViewOtherClasses" class="switch-view active-switch-view">
|
||||
<el-popover :open-delay="200" placement="right-start" trigger="hover">
|
||||
<el-popover
|
||||
:open-delay="200"
|
||||
placement="right-start"
|
||||
trigger="hover"
|
||||
>
|
||||
<span slot="reference" style="width: 100%">
|
||||
<el-tooltip
|
||||
v-show="!isCollapse"
|
||||
:content="isRouteMeta.title"
|
||||
:open-delay="1000"
|
||||
placement="bottom"
|
||||
effect="dark"
|
||||
class="view-title"
|
||||
>
|
||||
<el-tooltip v-show="!isCollapse" :content="isRouteMeta.title" :open-delay="1000" placement="bottom" effect="dark" class="view-title">
|
||||
<span class="text-overflow">{{ isRouteMeta.title || '' }}</span>
|
||||
</el-tooltip>
|
||||
<span class="icon-zone">
|
||||
@@ -55,14 +49,10 @@
|
||||
</div>
|
||||
<div class="nav-footer">
|
||||
<div class="toggle-bar">
|
||||
<Hamburger
|
||||
:is-active="sidebar.opened"
|
||||
class="hamburger-container"
|
||||
@toggleClick="toggleSideBar"
|
||||
/>
|
||||
<Hamburger :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
|
||||
</div>
|
||||
</div>
|
||||
<div :class="{ 'is-show': viewShown }" class="mobile-menu" @click="viewShown = false">
|
||||
<div :class="{'is-show': viewShown}" class="mobile-menu" @click="viewShown = false">
|
||||
<ViewSwitcher :mode="'vertical'" />
|
||||
</div>
|
||||
</div>
|
||||
@@ -91,7 +81,10 @@ export default {
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['currentViewRoute', 'sidebar']),
|
||||
...mapGetters([
|
||||
'currentViewRoute',
|
||||
'sidebar'
|
||||
]),
|
||||
defaultOpensMenu() {
|
||||
return []
|
||||
},
|
||||
@@ -134,7 +127,8 @@ export default {
|
||||
return this.currentViewRoute.meta || {}
|
||||
}
|
||||
},
|
||||
mounted() {},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
toggleSideBar() {
|
||||
this.$store.dispatch('app/toggleSideBar')
|
||||
@@ -149,9 +143,7 @@ export default {
|
||||
}, 500)
|
||||
},
|
||||
setLeastMenuOpen() {
|
||||
const hasOpened = document.querySelector(
|
||||
'.el-submenu-sidebar.submenu-item.el-submenu.is-opened'
|
||||
)
|
||||
const hasOpened = document.querySelector('.el-submenu-sidebar.submenu-item.el-submenu.is-opened')
|
||||
if (hasOpened) {
|
||||
return
|
||||
}
|
||||
@@ -164,7 +156,7 @@ export default {
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@import '~@/styles/variables.scss';
|
||||
@import "~@/styles/variables.scss";
|
||||
|
||||
$mobileHeight: 40px;
|
||||
$origin-color: #ffffff;
|
||||
@@ -243,7 +235,7 @@ $hover-border-color: #d2d2d2;
|
||||
|
||||
.view-title {
|
||||
width: calc(100% - 10px);
|
||||
display: inline-block;
|
||||
display: inline-block
|
||||
}
|
||||
|
||||
.icon-zone {
|
||||
@@ -307,7 +299,7 @@ $hover-border-color: #d2d2d2;
|
||||
}
|
||||
|
||||
.is-show {
|
||||
display: block !important;
|
||||
display: block !important;;
|
||||
}
|
||||
|
||||
.mobile-menu {
|
||||
|
||||
@@ -167,7 +167,8 @@ export default {
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
<style lang='scss' scoped>
|
||||
|
||||
.page.no-title {
|
||||
::v-deep {
|
||||
.page-submenu .el-tabs__header {
|
||||
@@ -198,14 +199,6 @@ export default {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
&.is-disabled {
|
||||
cursor: not-allowed;
|
||||
|
||||
&:hover {
|
||||
color: #c0c4cc;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.el-tabs__nav-next {
|
||||
|
||||
@@ -276,8 +276,10 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
// reset element css of el-icon-close
|
||||
<style lang="scss">
|
||||
//reset element css of el-icon-close
|
||||
.tags-view-wrapper {
|
||||
.tags-view-item {
|
||||
.el-icon-close {
|
||||
|
||||
12
src/main.js
@@ -1,5 +1,5 @@
|
||||
import Vue from 'vue'
|
||||
import ElementUI from 'element-ui'
|
||||
import ElementUI from 'elementui-lts'
|
||||
import locale from 'elementLocale'
|
||||
import '@/styles/index.scss' // global css
|
||||
import App from './App'
|
||||
@@ -25,7 +25,6 @@ import xss from '@/utils/secure'
|
||||
import ElTableTooltipPatch from '@/utils/vue/elTableTooltipPatch.js'
|
||||
import VSanitize from 'v-sanitize'
|
||||
import moment from 'moment'
|
||||
|
||||
moment.locale('zh-cn')
|
||||
|
||||
/**
|
||||
@@ -36,11 +35,10 @@ moment.locale('zh-cn')
|
||||
* Currently MockJs will be used in the production environment,
|
||||
* please remove it before going online ! ! !
|
||||
*/
|
||||
// 使用 mockXHR 无法使用 axios 中的 onUploadProgress 回调函数
|
||||
// if (process.env.NODE_ENV === 'development') {
|
||||
// const { mockXHR } = require('../mock')
|
||||
// mockXHR()
|
||||
// }
|
||||
if (process.env.NODE_ENV === 'development') {
|
||||
const { mockXHR } = require('../mock')
|
||||
mockXHR()
|
||||
}
|
||||
|
||||
// set ElementUI lang to EN
|
||||
ElementUI.Tooltip.props.openDelay.default = 1000
|
||||
|
||||
@@ -18,7 +18,7 @@ export default [
|
||||
component: () => import('@/views/reports/users/index.vue'),
|
||||
meta: {
|
||||
title: i18n.t('UserReport'),
|
||||
permissions: ['rbac.view_userloginreport | rbac.view_userchangepasswordreport']
|
||||
permissions: []
|
||||
}
|
||||
}
|
||||
]
|
||||
@@ -40,7 +40,7 @@ export default [
|
||||
component: () => import('@/views/reports/assets/index.vue'),
|
||||
meta: {
|
||||
title: i18n.t('AssetReport'),
|
||||
permissions: ['rbac.view_assetactivityreport | rbac.view_assetstatisticsreport']
|
||||
permissions: []
|
||||
}
|
||||
}
|
||||
]
|
||||
@@ -62,7 +62,7 @@ export default [
|
||||
component: () => import('@/views/reports/accounts/index.vue'),
|
||||
meta: {
|
||||
title: i18n.t('AccountReport'),
|
||||
permissions: ['rbac.view_accountstatisticsreport | rbac.view_accountautomationreport']
|
||||
permissions: []
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
@@ -22,7 +22,6 @@ export default [
|
||||
component: () => import('@/views/accounts/Account/index.vue'),
|
||||
meta: {
|
||||
title: i18n.t('AssetAccount'),
|
||||
showInSearch: true,
|
||||
app: 'accounts',
|
||||
permissions: ['accounts.view_account']
|
||||
}
|
||||
@@ -30,8 +29,8 @@ export default [
|
||||
{
|
||||
path: ':id',
|
||||
component: () => import('@/views/accounts/Account/AccountDetail/index.vue'),
|
||||
name: 'AccountDetail',
|
||||
meta: { title: i18n.t('AccountDetail') },
|
||||
name: 'AssetAccountDetail',
|
||||
meta: { title: i18n.t('AssetAccountDetail') },
|
||||
hidden: true
|
||||
}
|
||||
]
|
||||
|
||||
@@ -34,9 +34,7 @@ export default [
|
||||
name: 'UserLoginACLList',
|
||||
component: () => import('@/views/acls/UserLoginACL/UserLoginACLList.vue'),
|
||||
meta: {
|
||||
title: i18n.t('UserLoginACLs'),
|
||||
menuTitle: i18n.t('UserLogin'),
|
||||
activeMenu: ''
|
||||
title: i18n.t('UserLoginACLs'), menuTitle: i18n.t('UserLogin'), activeMenu: ''
|
||||
}
|
||||
},
|
||||
{
|
||||
@@ -76,7 +74,7 @@ export default [
|
||||
},
|
||||
name: 'CmdACL',
|
||||
meta: {
|
||||
title: i18n.t('CommandFilterACLs'),
|
||||
title: i18n.t('CommandFilterACLs',),
|
||||
menuTitle: i18n.t('CommandFilter'),
|
||||
app: 'acls',
|
||||
resource: 'commandfilteracl'
|
||||
@@ -138,11 +136,7 @@ export default [
|
||||
path: '',
|
||||
name: 'AssetACLList',
|
||||
component: () => import('@/views/acls/AssetLoginACL/AssetLoginAclList.vue'),
|
||||
meta: {
|
||||
title: i18n.t('AssetACLs'),
|
||||
activeMenu: '',
|
||||
menuTitle: i18n.t('AssetConnect')
|
||||
}
|
||||
meta: { title: i18n.t('AssetACLs'), activeMenu: '', menuTitle: i18n.t('AssetConnect') }
|
||||
},
|
||||
{
|
||||
path: 'create',
|
||||
@@ -167,53 +161,6 @@ export default [
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: 'data-masking-rules',
|
||||
component: empty,
|
||||
redirect: {
|
||||
name: 'DataMaskingRuleList'
|
||||
},
|
||||
name: 'DataMaskingRules',
|
||||
meta: {
|
||||
title: i18n.t('DataMasking'),
|
||||
licenseRequired: true,
|
||||
app: 'acls',
|
||||
resource: 'datamaskingrule'
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: '',
|
||||
name: 'DataMaskingRuleList',
|
||||
component: () => import('@/views/acls/DataMaskingRule/DataMaskingRuleList.vue'),
|
||||
meta: {
|
||||
title: i18n.t('DataMasking'),
|
||||
activeMenu: '',
|
||||
menuTitle: i18n.t('DataMasking')
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'create',
|
||||
name: 'DataMaskingRuleCreate',
|
||||
component: () => import('@/views/acls/DataMaskingRule/DataMaskingRuleCreateUpdate.vue'),
|
||||
hidden: true,
|
||||
meta: { title: '', activeMenu: '' }
|
||||
},
|
||||
{
|
||||
path: ':id',
|
||||
name: 'DataMaskingRuleDetail',
|
||||
component: () => import('@/views/acls/DataMaskingRule/DataMaskingRuleDetail/index'),
|
||||
hidden: true,
|
||||
meta: { title: i18n.t('AssetACLDetail'), activeMenu: '' }
|
||||
},
|
||||
{
|
||||
path: ':id/update',
|
||||
name: 'DataMaskingRuleUpdate',
|
||||
component: () => import('@/views/acls/DataMaskingRule/DataMaskingRuleCreateUpdate.vue'),
|
||||
hidden: true,
|
||||
meta: { title: '', activeMenu: '' }
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: 'cmd-groups',
|
||||
component: empty,
|
||||
@@ -290,11 +237,7 @@ export default [
|
||||
path: '',
|
||||
name: 'ConnectMethodACLList',
|
||||
component: () => import('@/views/acls/ConnectMethodACL/ConnectMethodAclList.vue'),
|
||||
meta: {
|
||||
title: i18n.t('ConnectMethodACLs'),
|
||||
activeMenu: '',
|
||||
menuTitle: i18n.t('ConnectMethod')
|
||||
}
|
||||
meta: { title: i18n.t('ConnectMethodACLs'), activeMenu: '', menuTitle: i18n.t('ConnectMethod') }
|
||||
},
|
||||
{
|
||||
path: 'create',
|
||||
|
||||
@@ -20,7 +20,7 @@ export default [
|
||||
path: '',
|
||||
name: 'AssetList',
|
||||
component: () => import('@/views/assets/Asset/AssetList/index.vue'),
|
||||
meta: { title: i18n.t('AssetList'), showInSearch: true }
|
||||
meta: { title: i18n.t('AssetList') }
|
||||
},
|
||||
{
|
||||
path: ':id',
|
||||
|
||||
@@ -22,7 +22,6 @@ export default {
|
||||
showNavSwitcher: () => {
|
||||
return store.getters.consoleOrgs.length > 0
|
||||
},
|
||||
|
||||
permissions: []
|
||||
},
|
||||
children: [
|
||||
|
||||
@@ -34,12 +34,14 @@ export default [
|
||||
{
|
||||
path: `${BASE_URL}/luna/?_=${Date.now()}`,
|
||||
name: 'WebTerminal',
|
||||
// component: () => window.open(`/luna/?_=${Date.now()}`),
|
||||
meta: { title: i18n.t('WebTerminal') }
|
||||
// hidden: true
|
||||
},
|
||||
{
|
||||
path: `${BASE_URL}/koko/elfinder/sftp/?`,
|
||||
name: 'FileManagement',
|
||||
// component: () => window.open(`/koko/elfinder/sftp/?`),
|
||||
meta: { title: i18n.t('FileManagement') }
|
||||
}
|
||||
]
|
||||
|
||||
@@ -6,7 +6,7 @@ export default [
|
||||
component: () => import('@/views/reports/accounts/AccountStatistics.vue'), // Parent router-view
|
||||
name: 'AccountStatistics',
|
||||
meta: {
|
||||
permissions: ['rbac.view_accountstatisticsreport'],
|
||||
permissions: [],
|
||||
expanded: true,
|
||||
icon: 'user-o',
|
||||
title: i18n.t('AccountStatisticsReport')
|
||||
@@ -17,7 +17,7 @@ export default [
|
||||
component: () => import('@/views/reports/accounts/AccountAutomation.vue'), // Parent router-view
|
||||
name: 'AccountAutomationReport',
|
||||
meta: {
|
||||
permissions: ['rbac.view_accountautomationreport'],
|
||||
permissions: [],
|
||||
expanded: true,
|
||||
icon: 'user-o',
|
||||
title: i18n.t('AccountAutomationReport')
|
||||
|
||||
@@ -6,7 +6,7 @@ export default [
|
||||
component: () => import('@/views/reports/assets/AssetActivity.vue'), // Parent router-view
|
||||
name: 'AssetReport',
|
||||
meta: {
|
||||
permissions: ['rbac.view_assetactivityreport'],
|
||||
permissions: [],
|
||||
icon: 'user-o',
|
||||
expanded: true,
|
||||
title: i18n.t('AssetActivityReport')
|
||||
@@ -17,7 +17,7 @@ export default [
|
||||
component: () => import('@/views/reports/assets/AssetStatistics.vue'), // Parent router-view
|
||||
name: 'AssetStatistics',
|
||||
meta: {
|
||||
permissions: ['rbac.view_assetstatisticsreport'],
|
||||
permissions: [],
|
||||
expanded: true,
|
||||
icon: 'user-o',
|
||||
title: i18n.t('AssetStatisticsReport')
|
||||
|
||||
@@ -1,48 +0,0 @@
|
||||
import i18n from '@/i18n/i18n'
|
||||
|
||||
export default [
|
||||
{
|
||||
path: 'console',
|
||||
component: () => import('@/views/reports/console/index.vue'), // Parent router-view
|
||||
name: 'ConsoleReport',
|
||||
meta: {
|
||||
permissions: ['rbac.view_console'],
|
||||
icon: 'user-o',
|
||||
expanded: true,
|
||||
title: i18n.t('ConsoleReport')
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'pam',
|
||||
component: () => import('@/views/reports/pam/Dashboard/index.vue'), // Parent router-view
|
||||
name: 'PamReport',
|
||||
meta: {
|
||||
permissions: ['rbac.view_pam'],
|
||||
expanded: true,
|
||||
icon: 'user-o',
|
||||
title: i18n.t('PamReport')
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'audits',
|
||||
component: () => import('@/views/reports/audits/Dashboard.vue'), // Parent router-view
|
||||
name: 'AuditsReport',
|
||||
meta: {
|
||||
permissions: ['rbac.view_audit'],
|
||||
expanded: true,
|
||||
icon: 'user-o',
|
||||
title: i18n.t('AuditsReport')
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'change-secret',
|
||||
component: () => import('@/views/reports/pam/ChangeSecret/index.vue'),
|
||||
name: 'ChangeSecretReport',
|
||||
meta: {
|
||||
permissions: ['accounts.view_changesecretautomation'],
|
||||
expanded: true,
|
||||
icon: 'user-o',
|
||||
title: i18n.t('ChangeSecretReport')
|
||||
}
|
||||
}
|
||||
]
|
||||
@@ -4,7 +4,6 @@ import empty from '@/layout/empty'
|
||||
import users from './users'
|
||||
import assets from './assets'
|
||||
import accounts from './accounts'
|
||||
import dashboard from './dashboard'
|
||||
|
||||
export default {
|
||||
path: '/reports',
|
||||
@@ -18,18 +17,6 @@ export default {
|
||||
permissions: []
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: '/reports/dashboard',
|
||||
component: empty,
|
||||
redirect: 'dashboard',
|
||||
name: 'ReportsDashboard',
|
||||
meta: {
|
||||
title: i18n.t('ReportsDashboard'),
|
||||
icon: 'reports',
|
||||
permissions: []
|
||||
},
|
||||
children: dashboard
|
||||
},
|
||||
{
|
||||
path: '/reports/users',
|
||||
component: empty,
|
||||
|
||||
@@ -6,7 +6,7 @@ export default [
|
||||
component: () => import('@/views/reports/users/UserActivity.vue'), // Parent router-view
|
||||
name: 'UserReport',
|
||||
meta: {
|
||||
permissions: ['rbac.view_userloginreport'],
|
||||
permissions: [],
|
||||
icon: 'user-o',
|
||||
expanded: true,
|
||||
title: i18n.t('UserLoginReport')
|
||||
@@ -17,7 +17,7 @@ export default [
|
||||
component: () => import('@/views/reports/users/ChangePassword.vue'), // Parent router-view
|
||||
name: 'ChangePassword',
|
||||
meta: {
|
||||
permissions: ['rbac.view_userchangepasswordreport'],
|
||||
permissions: [],
|
||||
expanded: true,
|
||||
icon: 'user-o',
|
||||
title: i18n.t('UserChangePasswordReport')
|
||||
|
||||
@@ -6,21 +6,19 @@
|
||||
|
||||
/* Transition
|
||||
-------------------------- */
|
||||
$--all-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1) !default;
|
||||
$--all-transition: all .3s cubic-bezier(.645,.045,.355,1) !default;
|
||||
$--fade-transition: opacity 300ms cubic-bezier(0.23, 1, 0.32, 1) !default;
|
||||
$--fade-linear-transition: opacity 200ms linear !default;
|
||||
$--md-fade-transition:
|
||||
transform 300ms cubic-bezier(0.23, 1, 0.32, 1),
|
||||
opacity 300ms cubic-bezier(0.23, 1, 0.32, 1) !default;
|
||||
$--border-transition-base: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1) !default;
|
||||
$--color-transition-base: color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1) !default;
|
||||
$--md-fade-transition: transform 300ms cubic-bezier(0.23, 1, 0.32, 1), opacity 300ms cubic-bezier(0.23, 1, 0.32, 1) !default;
|
||||
$--border-transition-base: border-color .2s cubic-bezier(.645,.045,.355,1) !default;
|
||||
$--color-transition-base: color .2s cubic-bezier(.645,.045,.355,1) !default;
|
||||
|
||||
/* Color
|
||||
-------------------------- */
|
||||
/// color|1|Brand Color|0
|
||||
$--color-primary: #1ab394 !default;
|
||||
/// color|1|Background Color|4
|
||||
$--color-white: #ffffff !default;
|
||||
$--color-white: #FFFFFF !default;
|
||||
/// color|1|Background Color|4
|
||||
$--color-black: #000000 !default;
|
||||
$--color-primary-light-1: mix($--color-white, $--color-primary, 10%) !default; /* 53a8ff */
|
||||
@@ -57,19 +55,19 @@ $--color-text-regular: #606266 !default;
|
||||
/// color|1|Font Color|2
|
||||
$--color-text-secondary: #909399 !default;
|
||||
/// color|1|Font Color|2
|
||||
$--color-text-placeholder: #c0c4cc !default;
|
||||
$--color-text-placeholder: #C0C4CC !default;
|
||||
/// color|1|Border Color|3
|
||||
$--border-color-base: #dcdfe6 !default;
|
||||
$--border-color-base: #DCDFE6 !default;
|
||||
/// color|1|Border Color|3
|
||||
$--border-color-light: #e4e7ed !default;
|
||||
$--border-color-light: #E4E7ED !default;
|
||||
/// color|1|Border Color|3
|
||||
$--border-color-lighter: #ebeef5 !default;
|
||||
$--border-color-lighter: #EBEEF5 !default;
|
||||
/// color|1|Border Color|3
|
||||
$--border-color-extra-light: #f2f6fc !default;
|
||||
$--border-color-extra-light: #F2F6FC !default;
|
||||
|
||||
// Background
|
||||
/// color|1|Background Color|4
|
||||
$--background-color-base: #f5f7fa !default;
|
||||
$--background-color-base: #F5F7FA !default;
|
||||
|
||||
/* Link
|
||||
-------------------------- */
|
||||
@@ -93,13 +91,9 @@ $--border-radius-zero: 0 !default;
|
||||
|
||||
// Box-shadow
|
||||
/// boxShadow|1|Shadow|1
|
||||
$--box-shadow-base:
|
||||
0 2px 4px rgba(0, 0, 0, 0.12),
|
||||
0 0 6px rgba(0, 0, 0, 0.04) !default;
|
||||
$--box-shadow-base: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04) !default;
|
||||
// boxShadow|1|Shadow|1
|
||||
$--box-shadow-dark:
|
||||
0 2px 4px rgba(0, 0, 0, 0.12),
|
||||
0 0 6px rgba(0, 0, 0, 0.12) !default;
|
||||
$--box-shadow-dark: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .12) !default;
|
||||
/// boxShadow|1|Shadow|1
|
||||
$--box-shadow-light: 0 2px 12px 0 rgba(0, 0, 0, 0.1) !default;
|
||||
|
||||
@@ -216,6 +210,8 @@ $--checkbox-button-checked-font-color: $--color-white !default;
|
||||
/// color||Color|0
|
||||
$--checkbox-button-checked-border-color: $--color-primary !default;
|
||||
|
||||
|
||||
|
||||
/* Radio
|
||||
-------------------------- */
|
||||
/// fontSize||Font|1
|
||||
@@ -484,8 +480,8 @@ $--cascader-menu-radius: $--border-radius-base !default;
|
||||
$--cascader-menu-border: solid 1px $--border-color-light !default;
|
||||
$--cascader-menu-shadow: $--box-shadow-light !default;
|
||||
$--cascader-node-background-hover: $--background-color-base !default;
|
||||
$--cascader-node-color-disabled: $--color-text-placeholder !default;
|
||||
$--cascader-color-empty: $--color-text-placeholder !default;
|
||||
$--cascader-node-color-disabled:$--color-text-placeholder !default;
|
||||
$--cascader-color-empty:$--color-text-placeholder !default;
|
||||
$--cascader-tag-background: #f0f2f5;
|
||||
|
||||
/* Group
|
||||
@@ -595,6 +591,7 @@ $--button-info-background-color: $--color-info !default;
|
||||
$--button-hover-tint-percent: 20% !default;
|
||||
$--button-active-shade-percent: 10% !default;
|
||||
|
||||
|
||||
/* cascader
|
||||
-------------------------- */
|
||||
$--cascader-height: 200px !default;
|
||||
@@ -642,7 +639,7 @@ $--table-row-hover-background-color: $--background-color-base !default;
|
||||
$--table-current-row-background-color: $--color-primary-light-9 !default;
|
||||
/// color||Color|0
|
||||
$--table-header-background-color: $--color-white !default;
|
||||
$--table-fixed-box-shadow: 0 0 10px rgba(0, 0, 0, 0.12) !default;
|
||||
$--table-fixed-box-shadow: 0 0 10px rgba(0, 0, 0, .12) !default;
|
||||
|
||||
/* Pagination
|
||||
-------------------------- */
|
||||
@@ -830,8 +827,8 @@ $--loading-fullscreen-spinner-size: 50px !default;
|
||||
|
||||
/* Scrollbar
|
||||
--------------------------*/
|
||||
$--scrollbar-background-color: rgba($--color-text-secondary, 0.3) !default;
|
||||
$--scrollbar-hover-background-color: rgba($--color-text-secondary, 0.5) !default;
|
||||
$--scrollbar-background-color: rgba($--color-text-secondary, .3) !default;
|
||||
$--scrollbar-hover-background-color: rgba($--color-text-secondary, .5) !default;
|
||||
|
||||
/* Carousel
|
||||
--------------------------*/
|
||||
@@ -940,7 +937,7 @@ $--link-info-font-color: $--color-info !default;
|
||||
/// border||Other|4
|
||||
$--calendar-border: $--table-border !default;
|
||||
/// color||Other|4
|
||||
$--calendar-selected-background-color: #f2f8fe !default;
|
||||
$--calendar-selected-background-color: #F2F8FE !default;
|
||||
$--calendar-cell-width: 85px !default;
|
||||
|
||||
/* Form
|
||||
@@ -953,7 +950,7 @@ $--form-label-font-size: $--font-size-base !default;
|
||||
/// color||Color|0
|
||||
$--avatar-font-color: #fff !default;
|
||||
/// color||Color|0
|
||||
$--avatar-background-color: #c0c4cc !default;
|
||||
$--avatar-background-color: #C0C4CC !default;
|
||||
/// fontSize||Font Size|1
|
||||
$--avatar-text-font-size: 14px !default;
|
||||
/// fontSize||Font Size|1
|
||||
@@ -975,52 +972,26 @@ $--lg: 1200px !default;
|
||||
$--xl: 1920px !default;
|
||||
|
||||
$--breakpoints: (
|
||||
'xs': (
|
||||
max-width: $--sm - 1
|
||||
),
|
||||
'sm': (
|
||||
min-width: $--sm
|
||||
),
|
||||
'md': (
|
||||
min-width: $--md
|
||||
),
|
||||
'lg': (
|
||||
min-width: $--lg
|
||||
),
|
||||
'xl': (
|
||||
min-width: $--xl
|
||||
)
|
||||
'xs' : (max-width: $--sm - 1),
|
||||
'sm' : (min-width: $--sm),
|
||||
'md' : (min-width: $--md),
|
||||
'lg' : (min-width: $--lg),
|
||||
'xl' : (min-width: $--xl)
|
||||
);
|
||||
|
||||
$--breakpoints-spec: (
|
||||
'xs-only': (
|
||||
max-width: $--sm - 1
|
||||
),
|
||||
'sm-and-up': (
|
||||
min-width: $--sm
|
||||
),
|
||||
'sm-only': '(min-width: #{$--sm}) and (max-width: #{$--md - 1})',
|
||||
'sm-and-down': (
|
||||
max-width: $--md - 1
|
||||
),
|
||||
'md-and-up': (
|
||||
min-width: $--md
|
||||
),
|
||||
'md-only': '(min-width: #{$--md}) and (max-width: #{$--lg - 1})',
|
||||
'md-and-down': (
|
||||
max-width: $--lg - 1
|
||||
),
|
||||
'lg-and-up': (
|
||||
min-width: $--lg
|
||||
),
|
||||
'lg-only': '(min-width: #{$--lg}) and (max-width: #{$--xl - 1})',
|
||||
'lg-and-down': (
|
||||
max-width: $--xl - 1
|
||||
),
|
||||
'xl-only': (
|
||||
min-width: $--xl
|
||||
)
|
||||
'xs-only' : (max-width: $--sm - 1),
|
||||
'sm-and-up' : (min-width: $--sm),
|
||||
'sm-only': "(min-width: #{$--sm}) and (max-width: #{$--md - 1})",
|
||||
'sm-and-down': (max-width: $--md - 1),
|
||||
'md-and-up' : (min-width: $--md),
|
||||
'md-only': "(min-width: #{$--md}) and (max-width: #{$--lg - 1})",
|
||||
'md-and-down': (max-width: $--lg - 1),
|
||||
'lg-and-up' : (min-width: $--lg),
|
||||
'lg-only': "(min-width: #{$--lg}) and (max-width: #{$--xl - 1})",
|
||||
'lg-and-down': (max-width: $--xl - 1),
|
||||
'xl-only' : (min-width: $--xl),
|
||||
);
|
||||
|
||||
$--font-path: '~element-ui/lib/theme-chalk/fonts';
|
||||
@import '~element-ui/packages/theme-chalk/src/index';
|
||||
$--font-path: '~elementui-lts/lib/theme-chalk/fonts';
|
||||
@import "~elementui-lts/packages/theme-chalk/src/index";
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
//@import './transition.scss';
|
||||
@import './sidebar.scss';
|
||||
@import './menu.scss';
|
||||
@import './fonts.scss';
|
||||
@import "./fonts.scss";
|
||||
@import './fonts/font-awesome.min.css';
|
||||
|
||||
::-webkit-scrollbar {
|
||||
@@ -24,7 +24,7 @@
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
border-radius: 8px;
|
||||
box-shadow: 8px 10px 20px #c6c6c6 inset;
|
||||
box-shadow: 8px 10px 20px #C6C6C6 inset;
|
||||
border-left: 2px solid rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
@@ -38,7 +38,7 @@ body {
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
-webkit-font-smoothing: auto;
|
||||
color: var(--color-text-primary);
|
||||
font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||
font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size: 13px;
|
||||
line-height: 1.428;
|
||||
}
|
||||
@@ -84,7 +84,7 @@ div:focus {
|
||||
visibility: hidden;
|
||||
display: block;
|
||||
font-size: 0;
|
||||
content: ' ';
|
||||
content: " ";
|
||||
clear: both;
|
||||
height: 0;
|
||||
}
|
||||
@@ -94,8 +94,7 @@ div:focus {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.small,
|
||||
small {
|
||||
.small, small {
|
||||
font-size: 85%;
|
||||
}
|
||||
|
||||
@@ -103,8 +102,7 @@ small {
|
||||
color: $--color-primary;
|
||||
}
|
||||
|
||||
b,
|
||||
strong {
|
||||
b, strong {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
@@ -116,37 +114,19 @@ p {
|
||||
margin: 0 0 10px;
|
||||
}
|
||||
|
||||
.h1,
|
||||
.h2,
|
||||
.h3,
|
||||
.h4,
|
||||
.h5,
|
||||
.h6,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
|
||||
font-family: inherit;
|
||||
font-weight: 500;
|
||||
line-height: 1.1;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.h4,
|
||||
.h5,
|
||||
.h6,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
.h4, .h5, .h6, h4, h5, h6 {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
h3,
|
||||
h4,
|
||||
h5 {
|
||||
h3, h4, h5 {
|
||||
margin-top: 5px;
|
||||
font-weight: 600;
|
||||
}
|
||||
@@ -155,12 +135,8 @@ h4 {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
font-family: 'Open Sans', sans-serif !important;
|
||||
button, input, optgroup, select, textarea {
|
||||
font-family: "Open Sans", sans-serif !important;
|
||||
}
|
||||
|
||||
// main-container global css
|
||||
@@ -201,7 +177,7 @@ textarea {
|
||||
word-break: keep-all;
|
||||
}
|
||||
|
||||
input[type='file'] {
|
||||
input[type=file] {
|
||||
font-size: 12px;
|
||||
opacity: 80;
|
||||
}
|
||||
@@ -238,14 +214,11 @@ input[type='file'] {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
|
||||
.el-input.is-disabled .el-input__inner {
|
||||
color: #737373 !important;
|
||||
}
|
||||
|
||||
.el-select-dropdown.switch-org {
|
||||
width: 220px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 992px) {
|
||||
.el-select-dropdown.switch-org {
|
||||
left: 0 !important;
|
||||
@@ -283,7 +256,7 @@ input[type='file'] {
|
||||
color: var(--color-text-primary);
|
||||
|
||||
a {
|
||||
color: #1c84c6;
|
||||
color: #1c84c6
|
||||
}
|
||||
}
|
||||
|
||||
@@ -330,7 +303,7 @@ input[type='file'] {
|
||||
white-space: nowrap;
|
||||
|
||||
&:hover {
|
||||
border-right: 2px solid #ebeef5;
|
||||
border-right: 2px solid #EBEEF5;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -341,7 +314,7 @@ input[type='file'] {
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
border-right: 1px solid #ebeef5 !important;
|
||||
border-right: 1px solid #EBEEF5 !important;
|
||||
|
||||
.cell {
|
||||
border-right: none;
|
||||
@@ -380,7 +353,7 @@ input[type='file'] {
|
||||
|
||||
&:last-child {
|
||||
padding: 0;
|
||||
border-right: 1px solid #ebeef5 !important;
|
||||
border-right: 1px solid #EBEEF5 !important;
|
||||
|
||||
.cell {
|
||||
vertical-align: unset;
|
||||
@@ -418,8 +391,7 @@ input[type='file'] {
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.el-drawer.rtl,
|
||||
.drawer-panel {
|
||||
.el-drawer.rtl, .drawer-panel {
|
||||
border-radius: 5px 0 0 5px;
|
||||
}
|
||||
|
||||
@@ -427,15 +399,13 @@ input[type='file'] {
|
||||
color: #909399 !important;
|
||||
}
|
||||
|
||||
.el-button.el-button--small,
|
||||
.el-button--small.is-round {
|
||||
.el-button.el-button--small, .el-button--small.is-round {
|
||||
font-weight: 400;
|
||||
padding: 8px 12px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.el-button.el-button--mini,
|
||||
.el-button--mini.is-round {
|
||||
.el-button.el-button--mini, .el-button--mini.is-round {
|
||||
font-size: 0.7rem;
|
||||
font-weight: 400;
|
||||
border-radius: 2px;
|
||||
@@ -465,19 +435,18 @@ input[type='file'] {
|
||||
}
|
||||
|
||||
.el-input__icon {
|
||||
vertical-align: super;
|
||||
vertical-align: super
|
||||
}
|
||||
}
|
||||
|
||||
.el-form .el-input__inner,
|
||||
.el-dialog__body .el-input__inner {
|
||||
.el-form .el-input__inner, .el-dialog__body .el-input__inner {
|
||||
height: 30px;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.el-input input::placeholder {
|
||||
font-weight: 400 !important;
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
font-family: "Open Sans", sans-serif;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
@@ -521,19 +490,19 @@ $tooltip-arrow-color: #c2d1e1;
|
||||
|
||||
// 使用 SCSS 的嵌套和变量来简化代码
|
||||
.el-tooltip__popper.is-light {
|
||||
&[x-placement^='right'] .popper__arrow {
|
||||
&[x-placement^=right] .popper__arrow {
|
||||
border-right-color: $tooltip-arrow-color !important;
|
||||
}
|
||||
|
||||
&[x-placement^='left'] .popper__arrow {
|
||||
&[x-placement^=left] .popper__arrow {
|
||||
border-left-color: $tooltip-arrow-color !important;
|
||||
}
|
||||
|
||||
&[x-placement^='top'] .popper__arrow {
|
||||
&[x-placement^=top] .popper__arrow {
|
||||
border-top-color: $tooltip-arrow-color !important;
|
||||
}
|
||||
|
||||
&[x-placement^='bottom'] .popper__arrow {
|
||||
&[x-placement^=bottom] .popper__arrow {
|
||||
border-bottom-color: $tooltip-arrow-color !important;
|
||||
}
|
||||
}
|
||||
@@ -629,6 +598,7 @@ li.rmenu i.fa {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//.link-btn {
|
||||
// span {
|
||||
// color: var(--color-link);
|
||||
@@ -653,12 +623,12 @@ li.rmenu i.fa {
|
||||
}
|
||||
|
||||
.el-input-number {
|
||||
.el-input-number__decrease,
|
||||
.el-input-number__increase {
|
||||
.el-input-number__decrease, .el-input-number__increase {
|
||||
line-height: 26px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.el-form--label-top.el-form {
|
||||
//.el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label:after {
|
||||
// content: '*';
|
||||
@@ -669,6 +639,7 @@ li.rmenu i.fa {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.el-form-item {
|
||||
.CodeMirror {
|
||||
height: 200px;
|
||||
@@ -735,15 +706,3 @@ div.el-loading-parent--relative {
|
||||
.el-drawer__header .drawer-title {
|
||||
color: var(--color-text-primary);
|
||||
}
|
||||
|
||||
.margin-top-10 {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.margin-top-20 {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.el-message {
|
||||
z-index: 999999 !important;
|
||||
}
|
||||
|
||||
@@ -149,11 +149,6 @@ export function getErrorResponseMsg(error) {
|
||||
.join('; ')
|
||||
} else if (typeof data === 'string') {
|
||||
return data
|
||||
} else if (_.isPlainObject(data)) {
|
||||
return Object.values(data)
|
||||
.map(item => getErrorResponseMsg(item))
|
||||
.filter(i => i)
|
||||
.join('; ')
|
||||
} else {
|
||||
msg = error.toString()
|
||||
}
|
||||
|
||||
@@ -3,7 +3,7 @@ import i18n from '@/i18n/i18n'
|
||||
import { eventBus } from '@/utils/vue/eventbus'
|
||||
import { getTokenFromCookie } from '@/utils/jms/auth'
|
||||
import { getErrorResponseMsg } from '@/utils/common'
|
||||
import { MessageBox } from 'element-ui'
|
||||
import { MessageBox } from 'elementui-lts'
|
||||
import { message } from '@/utils/vue/message'
|
||||
import store from '@/store'
|
||||
import axiosRetry from 'axios-retry'
|
||||
|
||||
@@ -21,16 +21,3 @@ export function getComponentFromRoute(route, router) {
|
||||
}
|
||||
return r.components.default
|
||||
}
|
||||
|
||||
export function getRouteUrl(route, router) {
|
||||
if (typeof route === 'string') {
|
||||
route = { name: route }
|
||||
}
|
||||
|
||||
const r = router.match(route)
|
||||
|
||||
if (!r) {
|
||||
return
|
||||
}
|
||||
return r.path
|
||||
}
|
||||
|
||||
@@ -1,18 +1,11 @@
|
||||
// 重置message,防止重复点击重复弹出message弹框
|
||||
import { Message as elMessage } from 'element-ui'
|
||||
import { toSentenceCase } from '@/utils/common/index'
|
||||
|
||||
let messageDom = null
|
||||
const DEFAULT_Z_INDEX = 20000
|
||||
|
||||
const message = options => {
|
||||
// 判断弹窗是否已存在, 若存在则关闭
|
||||
if (messageDom) messageDom.close()
|
||||
|
||||
if (typeof options === 'string') {
|
||||
options = { message: options }
|
||||
}
|
||||
|
||||
options.zIndex = options.zIndex || DEFAULT_Z_INDEX
|
||||
|
||||
messageDom = elMessage(options)
|
||||
}
|
||||
|
||||
|
||||
@@ -107,10 +107,6 @@ export default {
|
||||
data.secret = data[secretType]
|
||||
delete data[secretType]
|
||||
}
|
||||
|
||||
if (data.ssh_key_change_strategy === 'add') {
|
||||
data.ssh_key_change_strategy = this.initial.ssh_key_change_strategy
|
||||
}
|
||||
return data
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div v-if="this.$hasPerm('accounts.view_changesecretautomation')" class="change-secret-container">
|
||||
<ChangeSecretReport :nav="false" :only-charts="true" />
|
||||
<ChangeSecretReport :nav="false" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -116,7 +116,6 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
handleConfirm() {
|
||||
this.$message.warning(this.$tc('ProcessingMessage'))
|
||||
const url = `/api/v1/accounts/gathered-accounts/${this.account.id}/`
|
||||
this.$axios.delete(url, {
|
||||
params: {
|
||||
|
||||
@@ -117,10 +117,6 @@ export default {
|
||||
data.secret = data[secretType]
|
||||
delete data[secretType]
|
||||
}
|
||||
|
||||
if (data.ssh_key_change_strategy === 'add') {
|
||||
data.ssh_key_change_strategy = this.initial.ssh_key_change_strategy
|
||||
}
|
||||
return data
|
||||
}
|
||||
}
|
||||
@@ -144,6 +140,11 @@ export default {
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
if (!this.$store.getters.hasValidLicense) {
|
||||
delete this.fields[3]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleAfterGetRemoteMeta(meta) {
|
||||
const needSetOptionFields = [
|
||||
|
||||
@@ -43,9 +43,7 @@ export default {
|
||||
asset: ''
|
||||
},
|
||||
treeSetting: {
|
||||
showMenu: (node) => {
|
||||
return node?.meta?.type === 'asset'
|
||||
},
|
||||
showMenu: true,
|
||||
showRefresh: true,
|
||||
showSearch: true,
|
||||
showAssets: true,
|
||||
@@ -57,7 +55,7 @@ export default {
|
||||
menu: [
|
||||
{
|
||||
id: 'check',
|
||||
name: this.$t('RiskDetection'),
|
||||
name: this.$t('Check'),
|
||||
icon: 'scan',
|
||||
callback: (node) => {
|
||||
vm.detectDialog.asset = node.id
|
||||
|
||||
@@ -6,6 +6,7 @@
|
||||
class="risk-review-drawer"
|
||||
destroy-on-close
|
||||
direction="rtl"
|
||||
style="z-index: 999"
|
||||
>
|
||||
<div class="drawer-container">
|
||||
<div class="drawer-body">
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
import i18n from '@/i18n/i18n'
|
||||
|
||||
const accountExistCache = new Map()
|
||||
|
||||
async function checkAccountExist(username, asset) {
|
||||
@@ -9,10 +8,9 @@ async function checkAccountExist(username, asset) {
|
||||
}
|
||||
const url = `/api/v1/accounts/accounts/?username=${encodeURIComponent(username)}&asset=${asset}`
|
||||
const data = await this.$axios.get(url)
|
||||
const results = data
|
||||
const isExist = results.length > 0
|
||||
accountExistCache.set(cacheKey, isExist)
|
||||
return isExist
|
||||
const result = data.length > 0
|
||||
accountExistCache.set(cacheKey, result)
|
||||
return result
|
||||
}
|
||||
|
||||
async function checkAccountsExist() {
|
||||
|
||||
@@ -141,9 +141,9 @@ export default {
|
||||
},
|
||||
async handleCommon(cmd, payload) {
|
||||
let rows = this.rows
|
||||
this.processing = true
|
||||
if (this.rows.length === 0) {
|
||||
rows = [this.row]
|
||||
this.processing = true
|
||||
}
|
||||
if (!payload) {
|
||||
payload = {}
|
||||
|
||||
@@ -18,13 +18,16 @@ export default {
|
||||
return {
|
||||
initial: {},
|
||||
fields: [
|
||||
[this.$t('Basic'), ['name']],
|
||||
[this.$t('Basic'), ['name', 'priority']],
|
||||
[this.$t('Users'), ['users']],
|
||||
[this.$t('ConnectMethod'), ['connect_methods']],
|
||||
[this.$t('Action'), ['action', 'reviewers']],
|
||||
[this.$t('Other'), ['is_active', 'comment']]
|
||||
],
|
||||
fieldsMeta: {
|
||||
priority: {
|
||||
rules: [rules.Required]
|
||||
},
|
||||
assets: assetJSONSelectMeta(this),
|
||||
users: userJSONSelectMeta(this, true),
|
||||
connect_methods: {
|
||||
|
||||
@@ -34,7 +34,7 @@ export default {
|
||||
key: this.$t('Reviewer'),
|
||||
value: this.object.reviewers.map(item => item.name).join(', ')
|
||||
},
|
||||
'date_created', 'created_by', 'comment'
|
||||
'priority', 'date_created', 'created_by', 'comment'
|
||||
]
|
||||
}
|
||||
},
|
||||
|
||||