Compare commits

..

80 Commits

Author SHA1 Message Date
Bryan
73d6bda8c3 Merge pull request #5092 from jumpserver/dev
merge: v4.10.4-lts
2025-07-17 15:04:47 +08:00
Bryan
3934b45367 Merge pull request #5064 from jumpserver/dev
v4.10.2
2025-06-19 20:13:12 +08:00
Bryan
0c5e84d1e3 Merge pull request #5010 from jumpserver/dev
v4.10.0
2025-05-15 17:12:07 +08:00
Bryan
18a3f42717 Merge pull request #4972 from jumpserver/dev
v4.9.0
2025-04-17 20:18:08 +08:00
Bryan
68030d98b2 Merge pull request #4890 from jumpserver/dev
v4.8.0
2025-03-20 18:44:31 +08:00
Bryan
a861f77609 Merge pull request #4659 from jumpserver/dev
v4.7.0
2025-02-20 10:20:32 +08:00
Bryan
e58ec6057c Merge pull request #4600 from jumpserver/dev
v4.6.0
2025-01-15 14:39:21 +08:00
Bryan
7ab20c5885 Merge pull request #4537 from jumpserver/dev
v4.5.0
2024-12-19 15:57:44 +08:00
Bryan
e47ddb5355 Merge pull request #4451 from jumpserver/dev
v4.4.0
2024-11-21 19:01:11 +08:00
Bryan
56aa3caa83 Merge pull request #4410 from jumpserver/dev
v4.3.0
2024-10-17 14:56:18 +08:00
Bryan
19b1dc0dbc Merge pull request #4367 from jumpserver/dev
merge: from dev to master
2024-09-19 19:36:42 +08:00
Bryan
77ef172a23 Merge pull request #4320 from jumpserver/dev
v4.1.0
2024-08-15 21:42:42 +08:00
Bryan
4596887bf1 Merge pull request #4178 from jumpserver/dev
v4.0.0
2024-07-03 19:06:07 +08:00
Bryan
0a3dc30c85 Merge pull request #4072 from jumpserver/dev
v3.10.11-lts
2024-06-19 16:04:12 +08:00
Bryan
51d24bc8e5 Merge pull request #3941 from jumpserver/dev
v3.10.10-lts
2024-05-16 16:05:04 +08:00
Bryan
1b15a4d043 Merge pull request #3871 from jumpserver/dev
v3.10.9 (dev to master)
2024-04-22 19:44:33 +08:00
Bryan
7d3f818242 Merge pull request #3864 from jumpserver/v3.10
v3.10.8
2024-04-18 17:58:05 +08:00
Bryan
4e26f18d77 Merge pull request #3862 from jumpserver/dev
v3.10.8
2024-04-18 17:17:36 +08:00
Bryan
b22613617a Revert "build(deps): bump follow-redirects from 1.15.3 to 1.15.4"
This reverts commit e971cbf4a8.
2024-03-27 16:16:07 +08:00
dependabot[bot]
e971cbf4a8 build(deps): bump follow-redirects from 1.15.3 to 1.15.4
Bumps [follow-redirects](https://github.com/follow-redirects/follow-redirects) from 1.15.3 to 1.15.4.
- [Release notes](https://github.com/follow-redirects/follow-redirects/releases)
- [Commits](https://github.com/follow-redirects/follow-redirects/compare/v1.15.3...v1.15.4)

---
updated-dependencies:
- dependency-name: follow-redirects
  dependency-type: indirect
...

Signed-off-by: dependabot[bot] <support@github.com>
2024-03-27 16:11:26 +08:00
wangruidong
4672abae35 fix: 刷新页面根据搜索条件过滤出对应的资源 2024-03-04 19:17:05 +08:00
Bryan
ba36d72602 Merge pull request #3761 from jumpserver/master
v3.10.4 (branch-v3.10)
2024-02-29 16:26:13 +08:00
Bryan
4bfbbba4c5 Merge pull request #3760 from jumpserver/dev
v3.10.4
2024-02-29 16:15:33 +08:00
Bryan
ea038ce43a Merge pull request #3697 from jumpserver/master
v3.10.2
2024-01-17 13:34:12 +00:00
Bryan
e16b19666c Merge pull request #3696 from jumpserver/dev
v3.10.2
2024-01-17 13:33:22 +00:00
Bryan
c7f5409eb6 Merge pull request #3694 from jumpserver/master
v3.10.2
2024-01-17 07:35:33 -04:00
Bryan
fdbd7d2222 Merge pull request #3693 from jumpserver/dev
v3.10.2
2024-01-17 07:24:50 -04:00
Bryan
ddbaeeafea Merge pull request #3668 from jumpserver/master
v3.10.1
2023-12-29 11:34:04 +05:00
Bryan
efb0e9dacb Merge pull request #3665 from jumpserver/dev
v3.10.1
2023-12-29 11:14:54 +05:00
huailei
f6f8301ad5 Revert "perf: 账号收集翻译"
This reverts commit 9a63ae63d4.
2023-12-22 15:25:31 +08:00
“huailei000”
9a63ae63d4 perf: 账号收集翻译 2023-12-22 11:31:45 +08:00
Bryan
1e007ccda3 Merge pull request #3642 from jumpserver/dev
v3.10
2023-12-21 15:15:52 +05:00
老广
d1d0b06b53 Merge pull request #3546 from jumpserver/dev
v3.9.0
2023-11-16 18:25:10 +08:00
Bryan
5fb70d2f24 Merge pull request #3450 from jumpserver/dev
v3.8.0
2023-10-19 03:33:53 -05:00
Bryan
b54a95430f Merge pull request #3404 from jumpserver/dev
v3.7.0
2023-09-21 17:04:42 +08:00
Bryan
4d8b4c45af Merge pull request #3355 from jumpserver/dev
v3.6.0
2023-08-17 14:00:33 +05:00
Bryan
a6d642df60 Merge pull request #3283 from jumpserver/dev
v3.5.0
2023-07-20 19:04:29 +08:00
Jiangjie.Bai
2e74f1522f Merge pull request #3222 from jumpserver/dev
v3.4.0
2023-06-15 14:51:36 +08:00
Jiangjie.Bai
fe615e0314 Merge pull request #3219 from jumpserver/dev
v3.4.0
2023-06-15 14:17:46 +08:00
Jiangjie.Bai
09f734e6fc Merge pull request #3135 from jumpserver/dev
v3.3.0
2023-05-18 19:18:11 +08:00
Jiangjie.Bai
3117046342 Merge pull request #3061 from jumpserver/dev
v3.2.0
2023-04-20 18:40:08 +08:00
Bai
b68aecb5cc fix: 批量更新资产平台help-text 2023-04-20 18:39:22 +08:00
Jiangjie.Bai
1c9b155d97 Merge pull request #3057 from jumpserver/dev
v3.2.0
2023-04-20 18:22:46 +08:00
Jiangjie.Bai
75b1be9864 Merge pull request #3019 from jumpserver/dev
v3.2.0 rc2
2023-04-14 19:01:37 +08:00
Jiangjie.Bai
615c3c1cf4 Merge pull request #3014 from jumpserver/dev
v3.2.0 rc1
2023-04-13 20:02:38 +08:00
Jiangjie.Bai
4d82231af4 Merge pull request #3012 from jumpserver/dev
v3.2.0 rc1
2023-04-13 19:22:38 +08:00
“huailei000”
c6cf6571b6 perf: ldap导入用户列表-组织下拉框设置最大宽度 2023-03-16 16:44:36 +08:00
Bai
8ea990d070 fix: 修复创建资产添加账号模版报错问题 2023-03-16 16:44:36 +08:00
“huailei000”
f4a32170d5 perf: message 2023-03-16 16:44:36 +08:00
ibuler
073508675e perf: 添加默认的信息 2023-03-16 16:44:36 +08:00
Jiangjie.Bai
1d6ca0a93a Merge pull request #2924 from jumpserver/dev
v3.1.0 rc4
2023-03-15 19:46:31 +08:00
Jiangjie.Bai
36aea652d6 Merge pull request #2788 from jumpserver/dev
v3.0.0
2023-02-23 20:16:41 +08:00
Jiangjie.Bai
1a42ce90ab Merge pull request #2760 from jumpserver/dev
v3.0.0-rc-latest
2023-02-22 22:21:54 +08:00
Jiangjie.Bai
31a401b55d Merge pull request #2463 from jumpserver/dev
v3.0.0-rc4
2023-01-31 18:55:34 +08:00
Jiangjie.Bai
582a84178d Merge pull request #2187 from jumpserver/dev
v2.28.0
2022-11-17 17:44:19 +08:00
Jiangjie.Bai
9b9f7c936c Merge pull request #2184 from jumpserver/dev
v2.28.0-rc5
2022-11-17 14:18:15 +08:00
Jiangjie.Bai
2a6100957f Merge pull request #2182 from jumpserver/dev
v2.28.0-rc4
2022-11-16 21:08:55 +08:00
Jiangjie.Bai
16606d6a27 Merge pull request #2176 from jumpserver/dev
v2.28.0-rc2
2022-11-14 10:01:05 +08:00
Jiangjie.Bai
0a612f50e6 Merge pull request #2164 from jumpserver/dev
v2.28.0-rc1
2022-11-10 17:45:47 +08:00
Jiangjie.Bai
fe36fa9390 Merge pull request #2117 from jumpserver/dev
v2.27.0-rc4
2022-10-18 21:02:10 +08:00
Jiangjie.Bai
ba109900ec Merge pull request #2113 from jumpserver/dev
v2.27.0-rc3
2022-10-18 11:20:57 +08:00
Jiangjie.Bai
ec7768267f Merge pull request #2105 from jumpserver/dev
v2.27.0-rc2
2022-10-14 11:01:32 +08:00
Jiangjie.Bai
cc58b374ab Merge pull request #2101 from jumpserver/dev
v2.27.0-rc1
2022-10-13 17:44:53 +08:00
Jiangjie.Bai
04ffbb8fd6 Merge pull request #2097 from jumpserver/dev
v2.27.0-rc1
2022-10-13 15:14:40 +08:00
Jiangjie.Bai
49880f6739 Merge pull request #2059 from jumpserver/dev
v2.26.0
2022-09-15 17:49:44 +08:00
Jiangjie.Bai
e6f98d58c4 Merge pull request #2057 from jumpserver/dev
v2.26.0-rc4
2022-09-15 16:18:03 +08:00
Jiangjie.Bai
fd1f16d43c Merge pull request #2050 from jumpserver/dev
v2.26.0-rc2
2022-09-13 17:41:39 +08:00
Jiangjie.Bai
968b2415b1 Merge pull request #2043 from jumpserver/dev
v2.26.0-rc1
2022-09-08 15:46:44 +08:00
Jiangjie.Bai
776090d6ba Merge pull request #2001 from jumpserver/dev
v2.25.0
2022-08-18 16:12:45 +08:00
Jiangjie.Bai
3a37952288 Merge pull request #1996 from jumpserver/dev
v2.25.0-rc4
2022-08-17 16:53:23 +08:00
Jiangjie.Bai
62b8fc0e3b Merge pull request #1994 from jumpserver/dev
v2.25.0-rc3
2022-08-16 19:08:23 +08:00
Jiangjie.Bai
b2028869cb Merge pull request #1986 from jumpserver/dev
v2.25.0-rc2
2022-08-12 18:06:56 +08:00
Jiangjie.Bai
5277a725f8 Merge pull request #1973 from jumpserver/dev
v2.25.0-rc1
2022-08-11 14:11:59 +08:00
Jiangjie.Bai
f137788c1a Merge pull request #1957 from jumpserver/dev
v2.24.0-rc5
2022-07-20 19:06:03 +08:00
Jiangjie.Bai
f7d17c8de7 Merge pull request #1954 from jumpserver/dev
v2.24.0-rc4
2022-07-19 16:18:13 +08:00
Jiangjie.Bai
feea70b0be Merge pull request #1944 from jumpserver/dev
v2.24.0-rc3
2022-07-18 12:05:42 +08:00
Jiangjie.Bai
04696ef3d6 Merge pull request #1940 from jumpserver/dev
v2.24.0-rc2
2022-07-15 18:07:37 +08:00
Jiangjie.Bai
1731f4f788 Merge pull request #1934 from jumpserver/dev
v2.24.0-rc1
2022-07-14 18:27:51 +08:00
Jiangjie.Bai
6f25d93909 Merge pull request #1931 from jumpserver/dev
v2.24.0-rc1
2022-07-14 17:51:58 +08:00
Jiangjie.Bai
46461ec324 Merge pull request #1925 from jumpserver/dev
v2.24.0-rc1
2022-07-14 15:12:15 +08:00
573 changed files with 8731 additions and 15802 deletions

View File

@@ -14,97 +14,64 @@ module.exports = {
window: true, window: true,
_: true _: true
}, },
plugins: ['vue', 'spellcheck'],
// add your custom rules here // add your custom rules here
// it is base on https://github.com/vuejs/eslint-config-vue // it is base on https://github.com/vuejs/eslint-config-vue
rules: { rules: {
'vue/max-attributes-per-line': [ 'vue/max-attributes-per-line': [2, {
2, 'singleline': 10,
{ 'multiline': {
singleline: 10, 'max': 1,
multiline: { 'allowFirstLine': false
max: 1,
allowFirstLine: false
}
} }
], }],
'vue/singleline-html-element-content-newline': 'off', 'vue/singleline-html-element-content-newline': 'off',
'vue/multiline-html-element-content-newline': 'off', 'vue/multiline-html-element-content-newline': 'off',
'vue/name-property-casing': ['error', 'PascalCase'], 'vue/name-property-casing': ['error', 'PascalCase'],
'vue/no-v-html': 'off', 'vue/no-v-html': 'off',
'accessor-pairs': 2, 'accessor-pairs': 2,
'arrow-spacing': [ 'arrow-spacing': [2, {
2, 'before': true,
{ 'after': true
before: true, }],
after: true
}
],
'block-spacing': [2, 'always'], 'block-spacing': [2, 'always'],
'brace-style': [ 'brace-style': [2, '1tbs', {
2, 'allowSingleLine': true
'1tbs', }],
{ 'camelcase': [0, {
allowSingleLine: true 'properties': 'always'
} }],
],
camelcase: [
0,
{
properties: 'always'
}
],
'comma-dangle': [2, 'never'], 'comma-dangle': [2, 'never'],
'comma-spacing': [ 'comma-spacing': [2, {
2, 'before': false,
{ 'after': true
before: false, }],
after: true
}
],
'comma-style': [2, 'last'], 'comma-style': [2, 'last'],
'constructor-super': 2, 'constructor-super': 2,
curly: [2, 'multi-line'], 'curly': [2, 'multi-line'],
'dot-location': [2, 'property'], 'dot-location': [2, 'property'],
'eol-last': 2, 'eol-last': 2,
eqeqeq: ['error', 'always', { null: 'ignore' }], 'eqeqeq': ['error', 'always', { 'null': 'ignore' }],
'generator-star-spacing': [ 'generator-star-spacing': [2, {
2, 'before': true,
{ 'after': true
before: true, }],
after: true
}
],
'handle-callback-err': [2, '^(err|error)$'], 'handle-callback-err': [2, '^(err|error)$'],
indent: [ 'indent': [2, 2, {
2, 'SwitchCase': 1
2, }],
{
SwitchCase: 1
}
],
'jsx-quotes': [2, 'prefer-single'], 'jsx-quotes': [2, 'prefer-single'],
'key-spacing': [ 'key-spacing': [2, {
2, 'beforeColon': false,
{ 'afterColon': true
beforeColon: false, }],
afterColon: true 'keyword-spacing': [2, {
} 'before': true,
], 'after': true
'keyword-spacing': [ }],
2, 'new-cap': [2, {
{ 'newIsCap': true,
before: true, 'capIsNew': false
after: true }],
}
],
'new-cap': [
2,
{
newIsCap: true,
capIsNew: false
}
],
'new-parens': 2, 'new-parens': 2,
'no-array-constructor': 2, 'no-array-constructor': 2,
'no-caller': 2, 'no-caller': 2,
@@ -135,23 +102,17 @@ module.exports = {
'no-irregular-whitespace': 2, 'no-irregular-whitespace': 2,
'no-iterator': 2, 'no-iterator': 2,
'no-label-var': 2, 'no-label-var': 2,
'no-labels': [ 'no-labels': [2, {
2, 'allowLoop': false,
{ 'allowSwitch': false
allowLoop: false, }],
allowSwitch: false
}
],
'no-lone-blocks': 2, 'no-lone-blocks': 2,
'no-mixed-spaces-and-tabs': 2, 'no-mixed-spaces-and-tabs': 2,
'no-multi-spaces': 2, 'no-multi-spaces': 2,
'no-multi-str': 2, 'no-multi-str': 2,
'no-multiple-empty-lines': [ 'no-multiple-empty-lines': [2, {
2, 'max': 1
{ }],
max: 1
}
],
'no-native-reassign': 2, 'no-native-reassign': 2,
'no-negated-in-lhs': 2, 'no-negated-in-lhs': 2,
'no-new-object': 2, 'no-new-object': 2,
@@ -179,126 +140,62 @@ module.exports = {
'no-undef-init': 2, 'no-undef-init': 2,
'no-unexpected-multiline': 2, 'no-unexpected-multiline': 2,
'no-unmodified-loop-condition': 2, 'no-unmodified-loop-condition': 2,
'no-unneeded-ternary': [ 'no-unneeded-ternary': [2, {
2, 'defaultAssignment': false
{ }],
defaultAssignment: false
}
],
'no-unreachable': 2, 'no-unreachable': 2,
'no-unsafe-finally': 2, 'no-unsafe-finally': 2,
'no-unused-vars': [ 'no-unused-vars': [2, {
2, 'vars': 'all',
{ 'args': 'none'
vars: 'all', }],
args: 'none'
}
],
'no-useless-call': 2, 'no-useless-call': 2,
'no-useless-computed-key': 2, 'no-useless-computed-key': 2,
'no-useless-constructor': 2, 'no-useless-constructor': 2,
'no-useless-escape': 0, 'no-useless-escape': 0,
'no-whitespace-before-property': 2, 'no-whitespace-before-property': 2,
'no-with': 2, 'no-with': 2,
'one-var': [ 'one-var': [2, {
2, 'initialized': 'never'
{ }],
initialized: 'never' 'operator-linebreak': [2, 'after', {
'overrides': {
'?': 'before',
':': 'before'
} }
], }],
'operator-linebreak': [
2,
'after',
{
overrides: {
'?': 'before',
':': 'before'
}
}
],
'padded-blocks': [2, 'never'], 'padded-blocks': [2, 'never'],
quotes: [ 'quotes': [2, 'single', {
2, 'avoidEscape': true,
'single', 'allowTemplateLiterals': true
{ }],
avoidEscape: true, 'semi': [2, 'never'],
allowTemplateLiterals: true 'semi-spacing': [2, {
} 'before': false,
], 'after': true
semi: [2, 'never'], }],
'semi-spacing': [
2,
{
before: false,
after: true
}
],
'space-before-blocks': [2, 'always'], 'space-before-blocks': [2, 'always'],
'space-before-function-paren': [ 'space-before-function-paren': [2, 'never'],
2,
{ anonymous: 'never', named: 'never', asyncArrow: 'always' }
],
'space-in-parens': [2, 'never'], 'space-in-parens': [2, 'never'],
'space-infix-ops': 2, 'space-infix-ops': 2,
'space-unary-ops': [ 'space-unary-ops': [2, {
2, 'words': true,
{ 'nonwords': false
words: true, }],
nonwords: false 'spaced-comment': [2, 'always', {
} 'markers': ['global', 'globals', 'eslint', 'eslint-disable', '*package', '!', ',']
], }],
'object-curly-spacing': [2, 'always'],
'spaced-comment': [
2,
'always',
{
markers: ['global', 'globals', 'eslint', 'eslint-disable', '*package', '!', ',']
}
],
'template-curly-spacing': [2, 'never'], 'template-curly-spacing': [2, 'never'],
'use-isnan': 2, 'use-isnan': 2,
'valid-typeof': 2, 'valid-typeof': 2,
'wrap-iife': [2, 'any'], 'wrap-iife': [2, 'any'],
'yield-star-spacing': [2, 'both'], 'yield-star-spacing': [2, 'both'],
yoda: [2, 'never'], 'yoda': [2, 'never'],
'prefer-const': 2, 'prefer-const': 2,
'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0, 'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
'array-bracket-spacing': [2, 'never'], 'object-curly-spacing': [2, 'always', {
'spellcheck/spell-checker': [ objectsInObjects: false
'warn', }],
{ 'array-bracket-spacing': [2, 'never']
comments: true,
strings: false,
identifiers: false,
lang: 'en_US',
skipWords: [
'echarts',
'resize',
'vue',
'eslint',
'babel',
'jsx',
'scss',
'v-deep',
'calc',
'vw',
'vh',
'px',
'rgba',
'rgb',
'var',
'lang',
'scoped',
'pdf',
'rbac'
],
skipIfMatch: [
'http://[^s]*',
'^[-\\w]+/[-\\w\\.]+$',
String.raw`^\/api\/[a-z0-9\/._-]+$`,
],
minLength: 3
}
]
} }
} }

View File

@@ -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
View File

@@ -0,0 +1,11 @@
{
"printWidth": 100,
"tabWidth": 2,
"useTabs": false,
"singleQuote": true,
"semi": false,
"trailingComma": "none",
"bracketSpacing": true,
"arrowParens": "avoid",
"endOfLine": "lf"
}

View File

@@ -1,11 +0,0 @@
module.exports = {
singleQuote: true,
semi: false,
trailingComma: 'none',
printWidth: 100,
tabWidth: 2,
useTabs: false,
bracketSpacing: true,
arrowParens: 'avoid',
endOfLine: 'auto'
}

View File

@@ -1,4 +1,4 @@
FROM jumpserver/lina-base:20260114_045651 AS stage-build FROM jumpserver/lina-base:20250709_063112 AS stage-build
ARG VERSION ARG VERSION
ENV VERSION=$VERSION ENV VERSION=$VERSION

View File

@@ -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` 配置正确。

View File

@@ -1,25 +1,13 @@
import Mock from 'mockjs' import Mock from 'mockjs'
import { param2Obj } from '../src/utils'
import user from './user' import user from './user'
import table from './table' import table from './table'
export function param2Obj(url) { const mocks = [
const search = url.split('?')[1] ...user,
if (!search) { ...table
return {} ]
}
return JSON.parse(
'{"' +
decodeURIComponent(search)
.replace(/"/g, '\\"')
.replace(/&/g, '","')
.replace(/=/g, '":"')
.replace(/\+/g, ' ') +
'"}'
)
}
const mocks = [...user, ...table]
// for front mock // for front mock
// please use it cautiously, it will redefine XMLHttpRequest, // please use it cautiously, it will redefine XMLHttpRequest,

View File

@@ -1,145 +1,148 @@
{ {
"name": "lina", "name": "lina",
"version": "v4.0.0", "version": "v4.0.0",
"description": "JumpServer Web UI", "description": "JumpServer Web UI",
"author": "JumpServer Team <support@lxware.hk>", "author": "JumpServer Team <support@lxware.hk>",
"license": "GPL-3.0-or-later", "license": "GPL-3.0-or-later",
"scripts": { "scripts": {
"dev": "NODE_OPTIONS=--openssl-legacy-provider vue-cli-service serve", "dev": "NODE_OPTIONS=--openssl-legacy-provider vue-cli-service serve",
"serve": "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": "NODE_OPTIONS=--openssl-legacy-provider vue-cli-service build",
"build:prod": "vue-cli-service build", "build:prod": "vue-cli-service build",
"build:stage": "vue-cli-service build --mode staging", "build:stage": "vue-cli-service build --mode staging",
"preview": "node build/index.js --preview", "preview": "node build/index.js --preview",
"lint": "eslint --ext .js,.vue src", "lint": "eslint --ext .js,.vue src",
"fix": "eslint --ext .js,.vue --fix src", "fix": "eslint --ext .js,.vue --fix src",
"test:unit": "jest --clearCache && vue-cli-service test:unit", "test:unit": "jest --clearCache && vue-cli-service test:unit",
"test:ci": "npm run lint && npm run test:unit", "test:ci": "npm run lint && npm run test:unit",
"svgo": "svgo -f src/icons/svg --config=src/icons/svgo.yml", "svgo": "svgo -f src/icons/svg --config=src/icas/svgo.yml",
"vue-i18n-extract": "vue-i18n-extract", "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": "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-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", "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", "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" "apply-i18n": "python ./src/i18n/langs/i18n-util.py apply en ja zh_Hant"
}, },
"dependencies": { "dependencies": {
"@babel/plugin-proposal-optional-chaining": "^7.13.12", "@babel/plugin-proposal-optional-chaining": "^7.13.12",
"@fontsource/open-sans": "^5.0.24", "@fontsource/open-sans": "^5.0.24",
"@kangc/v-md-editor": "^1.7.12", "@traptitech/markdown-it-katex": "^3.6.0",
"@traptitech/markdown-it-katex": "^3.6.0", "@ztree/ztree_v3": "3.5.44",
"@ztree/ztree_v3": "3.5.44", "axios": "0.28.0",
"axios": "0.28.0", "axios-retry": "^3.1.9",
"axios-retry": "^3.1.9", "caniuse-lite": "^1.0.30001642",
"babel-loader": "^10.0.0", "cron-parser": "^4.0.0",
"cache-loader": "^4.1.0", "crypto-js": "^4.1.1",
"caniuse-lite": "^1.0.30001642", "css-color-function": "^1.3.3",
"cron-parser": "^4.0.0", "decimal.js": "^10.4.3",
"crypto-js": "^4.1.1", "deepmerge": "^4.2.2",
"css-color-function": "^1.3.3", "dompurify": "^3.1.6",
"decimal.js": "^10.4.3", "echarts": "4.7.0",
"deepmerge": "^4.2.2", "elementui-lts": "^2.16.0",
"dompurify": "^3.2.4", "eslint-plugin-html": "^6.0.0",
"echarts": "4.7.0", "highlight.js": "^11.9.0",
"element-ui": "https://github.com/jumpserver-dev/element/releases/download/v2.15.15/jumpserver-element-ui-2.15.15.tgz", "install": "^0.13.0",
"eslint-plugin-html": "^6.0.0", "jquery": "^3.6.1",
"highlight.js": "^11.9.0", "js-cookie": "2.2.0",
"install": "^0.13.0", "jsencrypt": "^3.2.1",
"jquery": "^3.6.1", "less": "^3.10.3",
"js-cookie": "2.2.0", "less-loader": "^5.0.0",
"jsencrypt": "^3.2.1", "lodash": "^4.17.21",
"less": "^3.10.3", "lodash.clonedeep": "^4.5.0",
"less-loader": "^5.0.0", "lodash.frompairs": "^4.0.1",
"lodash": "^4.17.21", "lodash.get": "^4.4.2",
"markdown-it": "^13.0.2", "lodash.has": "^4.5.2",
"markdown-it-link-attributes": "^4.0.1", "lodash.includes": "^4.3.0",
"moment": "^2.29.4", "lodash.isempty": "^4.4.0",
"moment-parseformat": "^4.0.0", "lodash.isequal": "^4.5.0",
"normalize.css": "7.0.0", "lodash.isplainobject": "^4.0.6",
"npm": "^7.8.0", "lodash.set": "^4.3.2",
"nprogress": "0.2.0", "lodash.topairs": "^4.3.0",
"path-to-regexp": "3.3.0", "lodash.values": "^4.3.0",
"sortablejs": "^1.15.6", "markdown-it": "^13.0.2",
"v-sanitize": "^0.0.13", "markdown-it-link-attributes": "^4.0.1",
"vue": "2.7.16", "moment": "^2.29.4",
"vue-codemirror": "4.0.6", "moment-parseformat": "^4.0.0",
"vue-cookie": "^1.1.4", "normalize.css": "7.0.0",
"vue-echarts": "^5.0.0-beta.0", "npm": "^7.8.0",
"vue-i18n": "^8.15.5", "nprogress": "0.2.0",
"vue-json-editor": "^1.4.3", "path-to-regexp": "3.3.0",
"vue-markdown": "^2.2.4", "sortablejs": "^1.15.6",
"vue-password-strength-meter": "^1.7.2", "v-sanitize": "^0.0.13",
"vue-router": "3.0.6", "vue": "2.6.10",
"vue-select": "^3.9.5", "vue-codemirror": "4.0.6",
"vuejs-logger": "^1.5.4", "vue-cookie": "^1.1.4",
"vuex": "3.1.0", "vue-echarts": "^5.0.0-beta.0",
"watermark-js-plus": "^1.5.8", "vue-i18n": "^8.15.5",
"xss": "^1.0.14", "vue-json-editor": "^1.4.3",
"xterm": "^4.5.0", "vue-markdown": "^2.2.4",
"xterm-addon-fit": "^0.3.0", "vue-password-strength-meter": "^1.7.2",
"zxcvbn": "^4.4.2" "vue-router": "3.0.6",
}, "vue-select": "^3.9.5",
"devDependencies": { "vuejs-logger": "^1.5.4",
"@babel/core": "7.18.6", "vuex": "3.1.0",
"@babel/register": "7.0.0", "watermark-js-plus": "^1.5.8",
"@vue/cli-plugin-babel": "3.6.0", "xss": "^1.0.14",
"@vue/cli-plugin-eslint": "^3.9.1", "xterm": "^4.5.0",
"@vue/cli-plugin-unit-jest": "3.6.3", "xterm-addon-fit": "^0.3.0",
"@vue/cli-service": "3.6.0", "zxcvbn": "^4.4.2"
"@vue/test-utils": "1.0.0-beta.29", },
"autoprefixer": "^9.5.1", "devDependencies": {
"babel-core": "6.26.3", "@babel/core": "7.18.6",
"babel-eslint": "10.0.1", "@babel/register": "7.0.0",
"babel-jest": "23.6.0", "@vue/cli-plugin-babel": "3.6.0",
"chalk": "2.4.2", "@vue/cli-plugin-eslint": "^3.9.1",
"compression-webpack-plugin": "^6.1.1", "@vue/cli-plugin-unit-jest": "3.6.3",
"connect": "3.6.6", "@vue/cli-service": "3.6.0",
"deasync": "^0.1.29", "@vue/test-utils": "1.0.0-beta.29",
"eslint": "^5.15.3", "autoprefixer": "^9.5.1",
"eslint-config-prettier": "^6.15.0", "babel-core": "7.0.0-bridge.0",
"eslint-plugin-prettier": "^3.4.1", "babel-eslint": "10.0.1",
"eslint-plugin-spellcheck": "^0.0.20", "babel-jest": "23.6.0",
"eslint-plugin-vue": "5.2.2", "chalk": "2.4.2",
"eslint-plugin-vue-i18n": "^0.3.0", "compression-webpack-plugin": "^6.1.1",
"github-markdown-css": "^5.1.0", "connect": "3.6.6",
"html-webpack-plugin": "3.2.0", "deasync": "^0.1.29",
"husky": "^4.2.3", "eslint": "^5.15.3",
"less-loader": "^5.0.0", "eslint-plugin-vue": "5.2.2",
"lint-staged": "^10.1.2", "eslint-plugin-vue-i18n": "^0.3.0",
"mockjs": "1.0.1-beta3", "github-markdown-css": "^5.1.0",
"prettier": "^3.6.2", "html-webpack-plugin": "3.2.0",
"pretty-bytes": "^5.6.0", "husky": "^4.2.3",
"runjs": "^4.3.2", "less-loader": "^5.0.0",
"sass": "~1.32.6", "lint-staged": "^10.1.2",
"sass-loader": "^7.1.0", "mockjs": "1.0.1-beta3",
"script-ext-html-webpack-plugin": "2.1.3", "pretty-bytes": "^5.6.0",
"script-loader": "0.7.2", "runjs": "^4.3.2",
"serve-static": "^1.16.0", "sass": "~1.32.6",
"strip-ansi": "^7.1.0", "sass-loader": "^7.1.0",
"svg-sprite-loader": "4.1.3", "script-ext-html-webpack-plugin": "2.1.3",
"svgo": "1.2.2", "script-loader": "0.7.2",
"vue-i18n-extract": "^1.1.1", "serve-static": "^1.16.0",
"vue-template-compiler": "2.7.16", "strip-ansi": "^7.1.0",
"webpack": "^4.28.4" "svg-sprite-loader": "4.1.3",
}, "svgo": "1.2.2",
"engines": { "vue-i18n-extract": "^1.1.1",
"node": ">=12", "vue-template-compiler": "2.6.10"
"npm": ">= 3.0.0" },
}, "engines": {
"browserslist": [ "node": ">=8.9",
"> 1%", "npm": ">= 3.0.0"
"last 4 versions", },
"ie 11" "browserslist": [
], "> 1%",
"husky": { "last 4 versions",
"hooks": { "ie 11"
"pre-commit": "lint-staged" ],
} "husky": {
}, "hooks": {
"lint-staged": { "pre-commit": "lint-staged"
"src/**/*.{js,vue}": [ }
"eslint --fix" },
] "lint-staged": {
}, "src/**/*.{js,vue}": [
"packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e" "eslint --fix"
]
},
"packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
} }

View File

@@ -61,14 +61,13 @@ export function stopJob(form) {
}) })
} }
export function JobUploadFile(form, config = {}) { export function JobUploadFile(form) {
return request({ return request({
url: '/api/v1/ops/jobs/upload/', url: '/api/v1/ops/jobs/upload/',
method: 'post', method: 'post',
headers: { 'Content-Type': 'multipart/form-data' }, headers: { 'Content-Type': 'multipart/form-data' },
timeout: 60 * 60 * 1000, timeout: 60 * 60 * 1000,
data: form, data: form
...config
}) })
} }

View File

@@ -18,14 +18,14 @@ export function toggleLockSession(data) {
export function getAllCommandStorage() { export function getAllCommandStorage() {
return request({ return request({
url: '/api/v1/terminal/command-storages/', url: `/api/v1/terminal/command-storages/`,
method: 'get' method: 'get'
}) })
} }
export function getAllReplayStorage() { export function getAllReplayStorage() {
return request({ return request({
url: '/api/v1/terminal/replay-storages/', url: `/api/v1/terminal/replay-storages/`,
method: 'get' method: 'get'
}) })
} }

Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.5 KiB

After

Width:  |  Height:  |  Size: 55 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 16 KiB

After

Width:  |  Height:  |  Size: 584 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 110 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 22 KiB

After

Width:  |  Height:  |  Size: 1.4 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 55 KiB

View File

@@ -1 +0,0 @@
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1752631175762" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4421" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M93.866667 234.666667c-34.133333 12.8-51.2 25.6-51.2 34.133333 0 4.266667 51.2 64 115.2 136.533333 64 68.266667 115.2 128 115.2 128s-51.2 59.733333-115.2 128C93.866667 729.6 42.666667 793.6 42.666667 797.866667c4.266667 17.066667 59.733333 42.666667 98.133333 42.666666 64 0 81.066667-12.8 217.6-162.133333 68.266667-76.8 128-140.8 128-140.8 0-4.266667-55.466667-64-123.733333-140.8-85.333333-102.4-132.266667-145.066667-153.6-157.866667-29.866667-12.8-81.066667-17.066667-115.2-4.266666z m725.333333 4.266666c-21.333333 8.533333-68.266667 59.733333-153.6 153.6-68.266667 76.8-123.733333 140.8-123.733333 140.8 0 4.266667 55.466667 68.266667 128 140.8 136.533333 153.6 153.6 162.133333 217.6 162.133334 42.666667 0 98.133333-21.333333 98.133333-42.666667 0-4.266667-51.2-68.266667-115.2-136.533333-64-68.266667-115.2-128-115.2-128s51.2-59.733333 115.2-128c64-68.266667 115.2-128 115.2-136.533334-4.266667-17.066667-55.466667-38.4-98.133333-38.4-34.133333 0-46.933333 4.266667-68.266667 12.8z" fill="#E57000" p-id="4422"></path><path d="M238.933333 136.533333c-42.666667 21.333333-42.666667 25.6-4.266666 68.266667 221.866667 243.2 273.066667 302.933333 277.333333 302.933333 4.266667 0 311.466667-332.8 315.733333-341.333333 0-4.266667-8.533333-12.8-21.333333-21.333333-17.066667-12.8-34.133333-17.066667-68.266667-17.066667-64-4.266667-85.333333 8.533333-162.133333 93.866667-34.133333 38.4-64 72.533333-64 72.533333s-29.866667-29.866667-64-68.266667c-34.133333-38.4-72.533333-76.8-89.6-85.333333-25.6-17.066667-89.6-21.333333-119.466667-4.266667zM354.133333 725.333333c-85.333333 93.866667-153.6 170.666667-153.6 174.933334 0 4.266667 8.533333 12.8 21.333334 21.333333 17.066667 12.8 34.133333 17.066667 68.266666 17.066667 59.733333 4.266667 85.333333-8.533333 162.133334-98.133334 34.133333-38.4 64-68.266667 64-68.266666s29.866667 29.866667 64 68.266666c81.066667 89.6 98.133333 102.4 162.133333 98.133334 34.133333 0 51.2-4.266667 68.266667-17.066667 12.8-8.533333 21.333333-17.066667 21.333333-21.333333-4.266667-8.533333-311.466667-345.6-315.733333-341.333334-8.533333 0-76.8 76.8-162.133334 166.4z" p-id="4423"></path></svg>

Before

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 210 KiB

View File

@@ -1,6 +1,5 @@
import { UpdateToken, UploadSecret } from '@/components/Form/FormFields' import { UpdateToken, UploadSecret } from '@/components/Form/FormFields'
import Select2 from '@/components/Form/FormFields/Select2.vue' import Select2 from '@/components/Form/FormFields/Select2.vue'
import AssetSelect from '@/components/Apps/AssetSelect/index.vue'
import { Required, RequiredChange } from '@/components/Form/DataForm/rules' import { Required, RequiredChange } from '@/components/Form/DataForm/rules'
import AutomationParamsForm from '@/views/assets/Platform/AutomationParamsSetting.vue' import AutomationParamsForm from '@/views/assets/Platform/AutomationParamsSetting.vue'
@@ -15,28 +14,19 @@ export const accountFieldsMeta = (vm) => {
} }
return { return {
nodes: { assets: {
component: Select2, component: Select2,
label: vm.$t('Node'), label: vm.$t('Asset'),
rules: [Required],
el: { el: {
value: [], multiple: true,
ajax: { ajax: {
url: '/api/v1/assets/nodes/', url: '/api/v1/assets/assets/',
transformOption: (item) => { transformOption: (item) => {
return { label: item.full_value, value: item.id } return { label: item.name + '(' + item.address + ')', value: item.id }
} }
} }
}, },
hidden: () => {
return !vm.addTemplate
}
},
assets: {
component: AssetSelect,
label: vm.$t('Asset'),
el: {
multiple: false
},
hidden: () => { hidden: () => {
return vm.platform || vm.asset return vm.platform || vm.asset
} }
@@ -48,7 +38,7 @@ export const accountFieldsMeta = (vm) => {
get disabled() { get disabled() {
return vm.isDisabled return vm.isDisabled
}, },
multiple: vm.addTemplate, multiple: false,
ajax: { ajax: {
url: '/api/v1/accounts/account-templates/', url: '/api/v1/accounts/account-templates/',
transformOption: (item) => { transformOption: (item) => {

View File

@@ -11,7 +11,7 @@
<script> <script>
import AutoDataForm from '@/components/Form/AutoDataForm/index.vue' import AutoDataForm from '@/components/Form/AutoDataForm/index.vue'
import { encryptPassword } from '@/utils/secure' import { encryptPassword } from '@/utils/crypto'
import { accountFieldsMeta } from '@/components/Apps/AccountCreateUpdateForm/const' import { accountFieldsMeta } from '@/components/Apps/AccountCreateUpdateForm/const'
export default { export default {
@@ -63,7 +63,7 @@ export default {
encryptedFields: ['secret'], encryptedFields: ['secret'],
fields: [ fields: [
[this.$t('Basic'), ['name', 'username', 'privileged', 'su_from', 'su_from_username', 'template']], [this.$t('Basic'), ['name', 'username', 'privileged', 'su_from', 'su_from_username', 'template']],
[this.$t('Asset'), ['nodes', 'assets']], [this.$t('Asset'), ['assets']],
[this.$t('Secret'), [ [this.$t('Secret'), [
'secret_type', 'password', 'ssh_key', 'token', 'secret_type', 'password', 'ssh_key', 'token',
'access_key', 'passphrase', 'api_key', 'access_key', 'passphrase', 'api_key',

View File

@@ -11,7 +11,7 @@
<script> <script>
import { GenericUpdateFormDialog } from '@/layout/components' import { GenericUpdateFormDialog } from '@/layout/components'
import { accountFieldsMeta } from '@/components/Apps/AccountCreateUpdateForm/const' import { accountFieldsMeta } from '@/components/Apps/AccountCreateUpdateForm/const'
import { encryptPassword } from '@/utils/secure' import { encryptPassword } from '@/utils/crypto'
export default { export default {
name: 'AccountBulkUpdateDialog', name: 'AccountBulkUpdateDialog',

View File

@@ -93,8 +93,8 @@ export default {
iVisible = true iVisible = true
data = formValue data = formValue
url = `/api/v1/accounts/accounts/bulk/` url = `/api/v1/accounts/accounts/bulk/`
if ((!data.assets || data.assets.length === 0) && (!data.nodes || data.nodes.length === 0)) { if (data.assets.length === 0) {
this.$message.error(this.$tc('PleaseSelectAssetOrNode')) this.$message.error(this.$tc('PleaseSelectAsset'))
return return
} }
} }
@@ -107,10 +107,6 @@ export default {
this.$emit('add', true) this.$emit('add', true)
} }
}).catch(error => { }).catch(error => {
if (error?.response?.data?.code === 'no_valid_assets') {
this.$message.error(error?.response?.data?.detail)
return
}
this.iVisible = true this.iVisible = true
this.handleResult(null, error) this.handleResult(null, error)
}) })

View File

@@ -52,7 +52,7 @@
<script> <script>
import { mapGetters } from 'vuex' import { mapGetters } from 'vuex'
import { accountOtherActions, accountQuickFilters, connectivityMeta, isDirectoryServiceAccount } from './const' import { accountOtherActions, accountQuickFilters, connectivityMeta, isDirectoryServiceAccount } from './const'
import { openTaskPage } from '@/utils/jms/index' import { openTaskPage } from '@/utils/jms'
import { import {
AccountConnectFormatter, AccountConnectFormatter,
ActionsFormatter, ActionsFormatter,
@@ -341,7 +341,7 @@ export default {
can: () => { can: () => {
return vm.$hasPerm('accounts.add_account') && !vm.$store.getters.currentOrgIsRoot return vm.$hasPerm('accounts.add_account') && !vm.$store.getters.currentOrgIsRoot
}, },
callback: async () => { callback: async() => {
await this.getAssetDetail() await this.getAssetDetail()
setTimeout(() => { setTimeout(() => {
vm.iAsset = this.asset vm.iAsset = this.asset
@@ -362,7 +362,7 @@ export default {
can: ({ selectedRows }) => { can: ({ selectedRows }) => {
return selectedRows.length > 0 && return selectedRows.length > 0 &&
['clickhouse', 'redis', 'website', 'chatgpt'].indexOf(selectedRows[0].asset.type.value) === -1 && ['clickhouse', 'redis', 'website', 'chatgpt'].indexOf(selectedRows[0].asset.type.value) === -1 &&
!this.$store.getters.currentOrgIsRoot && vm.$hasPerm('accounts.verify_account') !this.$store.getters.currentOrgIsRoot
}, },
callback: function({ selectedRows }) { callback: function({ selectedRows }) {
const ids = selectedRows.map(v => { const ids = selectedRows.map(v => {
@@ -478,7 +478,7 @@ export default {
this.$refs.ListTable.reloadTable() this.$refs.ListTable.reloadTable()
}, },
async getAssetDetail() { async getAssetDetail() {
const { query: { asset } } = this.$route const { query: { asset }} = this.$route
if (asset) { if (asset) {
this.iAsset = await this.$axios.get(`/api/v1/assets/assets/${asset}/`) this.iAsset = await this.$axios.get(`/api/v1/assets/assets/${asset}/`)
} }

View File

@@ -6,7 +6,7 @@
@confirm="closeDialog" @confirm="closeDialog"
v-on="$listeners" v-on="$listeners"
> >
<el-alert style="margin-bottom: 10px" type="info"> <el-alert style="margin-bottom: 10px" type="success">
<span v-for="item of summary" :key="item.key"><b>{{ item.label }}</b>: {{ item.value }} </span> <span v-for="item of summary" :key="item.key"><b>{{ item.label }}</b>: {{ item.value }} </span>
</el-alert> </el-alert>
<DataTable :config="config" /> <DataTable :config="config" />
@@ -49,10 +49,6 @@ export default {
prop: 'asset', prop: 'asset',
label: this.$t('Asset') label: this.$t('Asset')
}, },
{
prop: 'account',
label: this.$t('Account')
},
{ {
prop: 'state', prop: 'state',
label: this.$t('Status'), label: this.$t('Status'),

View File

@@ -12,7 +12,7 @@
<script> <script>
import Dialog from '@/components/Dialog/index.vue' import Dialog from '@/components/Dialog/index.vue'
import { openTaskPage } from '@/utils/jms/index' import { openTaskPage } from '@/utils/jms'
export default { export default {
name: 'RemoveAccount', name: 'RemoveAccount',

View File

@@ -23,7 +23,7 @@
<script> <script>
import Dialog from '@/components/Dialog/index.vue' import Dialog from '@/components/Dialog/index.vue'
import { accountFieldsMeta } from '@/components/Apps/AccountCreateUpdateForm/const' import { accountFieldsMeta } from '@/components/Apps/AccountCreateUpdateForm/const'
import { encryptPassword } from '@/utils/secure' import { encryptPassword } from '@/utils/crypto'
import AutoDataForm from '@/components/Form/AutoDataForm/index.vue' import AutoDataForm from '@/components/Form/AutoDataForm/index.vue'
export default { export default {

View File

@@ -61,8 +61,7 @@
import Dialog from '@/components/Dialog/index.vue' import Dialog from '@/components/Dialog/index.vue'
import PasswordHistoryDialog from './PasswordHistoryDialog.vue' import PasswordHistoryDialog from './PasswordHistoryDialog.vue'
import { SecretViewerFormatter } from '@/components/Table/TableFormatters' import { SecretViewerFormatter } from '@/components/Table/TableFormatters'
import { encryptPassword } from '@/utils/secure' import { encryptPassword } from '@/utils/crypto'
import { mapGetters } from 'vuex'
export default { export default {
name: 'ShowSecretInfo', name: 'ShowSecretInfo',
@@ -112,9 +111,6 @@ export default {
} }
}, },
computed: { computed: {
...mapGetters({
publicSettings: 'publicSettings'
}),
secretTypeLabel() { secretTypeLabel() {
return this.account['secret_type'].label || 'Password' return this.account['secret_type'].label || 'Password'
}, },
@@ -150,11 +146,7 @@ export default {
}) })
}, },
showSecretDialog() { showSecretDialog() {
if (!this.publicSettings.SECURITY_ACCOUNT_SECRET_READ) { return this.$axios.get(this.url, { disableFlashErrorMsg: true }).then((res) => {
this.$message.warning(this.$tc('AccountSecretReadDisabled'))
return
}
return this.$axios.get(this.url).then((res) => {
this.secretInfo = res this.secretInfo = res
this.sshKeyFingerprint = res?.spec_info?.ssh_key_fingerprint || '-' this.sshKeyFingerprint = res?.spec_info?.ssh_key_fingerprint || '-'
this.showSecret = true this.showSecret = true
@@ -175,54 +167,54 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.item-textarea ::v-deep .el-textarea__inner { .item-textarea ::v-deep .el-textarea__inner {
height: 110px; height: 110px;
}
.el-form-item {
border-bottom: 1px solid #EBEEF5;
padding: 5px 0;
margin-bottom: 0;
&:last-child {
border-bottom: none;
} }
::v-deep .el-form-item__label { .el-form-item {
display: flex; border-bottom: 1px solid #EBEEF5;
align-items: center; padding: 5px 0;
justify-content: flex-start; margin-bottom: 0;
padding-right: 20px;
line-height: 30px;
word-break: keep-all;
overflow-wrap: break-word;
white-space: normal;
}
::v-deep .el-form-item__content { &:last-child {
line-height: 30px; border-bottom: none;
}
pre { ::v-deep .el-form-item__label {
margin: 0; display: flex;
align-items: center;
justify-content: flex-start;
padding-right: 20px;
line-height: 30px;
word-break: keep-all;
overflow-wrap: break-word;
white-space: normal;
}
::v-deep .el-form-item__content {
line-height: 30px;
pre {
margin: 0;
}
} }
} }
}
ul { ul {
margin: 0; margin: 0;
} }
li { li {
display: block; display: block;
font-size: 13px; font-size: 13px;
margin-bottom: 8px; margin-bottom: 8px;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
.title { .title {
color: #303133; color: #303133;
font-weight: 500; font-weight: 500;
}
} }
}
</style> </style>

View File

@@ -1,5 +1,5 @@
import { ChoicesFormatter } from '@/components/Table/TableFormatters' import { ChoicesFormatter } from '@/components/Table/TableFormatters'
import { openTaskPage } from '@/utils/jms/index' import { openTaskPage } from '@/utils/jms'
export const connectivityMeta = { export const connectivityMeta = {
formatter: ChoicesFormatter, formatter: ChoicesFormatter,
@@ -40,7 +40,7 @@ export function isDirectoryServiceAccount(account, vm) {
return vm.asset && vm.asset.id !== account.asset.id return vm.asset && vm.asset.id !== account.asset.id
} }
export const accountOtherActions = vm => { export const accountOtherActions = (vm) => {
return [ return [
{ {
name: 'View', name: 'View',
@@ -62,11 +62,9 @@ export const accountOtherActions = vm => {
name: 'Update', name: 'Update',
title: vm.$t('Edit'), title: vm.$t('Edit'),
can: ({ row }) => { can: ({ row }) => {
return ( return vm.$hasPerm('accounts.change_account') &&
vm.$hasPerm('accounts.change_account') &&
!vm.$store.getters.currentOrgIsRoot && !vm.$store.getters.currentOrgIsRoot &&
!isDirectoryServiceAccount(row, vm) !isDirectoryServiceAccount(row, vm)
)
}, },
callback: ({ row }) => { callback: ({ row }) => {
vm.isUpdateAccount = true vm.isUpdateAccount = true
@@ -87,11 +85,9 @@ export const accountOtherActions = vm => {
name: 'UpdateSecret', name: 'UpdateSecret',
title: vm.$t('EditSecret'), title: vm.$t('EditSecret'),
can: ({ row }) => { can: ({ row }) => {
return ( return vm.$hasPerm('accounts.change_account') &&
vm.$hasPerm('accounts.change_account') &&
!vm.$store.getters.currentOrgIsRoot && !vm.$store.getters.currentOrgIsRoot &&
!isDirectoryServiceAccount(row, vm) !isDirectoryServiceAccount(row, vm)
)
}, },
callback: ({ row }) => { callback: ({ row }) => {
const data = { const data = {
@@ -114,11 +110,9 @@ export const accountOtherActions = vm => {
return !vm.asset return !vm.asset
}, },
can: ({ row }) => { can: ({ row }) => {
return ( return vm.$hasPerm('accounts.add_account') &&
vm.$hasPerm('accounts.add_account') &&
!vm.$store.getters.currentOrgIsRoot && !vm.$store.getters.currentOrgIsRoot &&
!isDirectoryServiceAccount(row, vm) !isDirectoryServiceAccount(row, vm)
)
}, },
callback: ({ row }) => { callback: ({ row }) => {
vm.account = { vm.account = {
@@ -144,26 +138,29 @@ export const accountOtherActions = vm => {
row.asset['auto_config'].ansible_enabled && row.asset['auto_config'].ansible_enabled &&
row.asset['auto_config'].ping_enabled, row.asset['auto_config'].ping_enabled,
callback: ({ row }) => { callback: ({ row }) => {
vm.$axios vm.$axios.post(
.post(`/api/v1/accounts/accounts/tasks/`, { action: 'verify', accounts: [row.id] }) `/api/v1/accounts/accounts/tasks/`,
.then(res => { { action: 'verify', accounts: [row.id] }
openTaskPage(res['task']) ).then(res => {
}) openTaskPage(res['task'])
})
} }
}, },
{ {
name: 'ClearSecret', name: 'ClearSecret',
title: vm.$t('ClearSecret'), title: vm.$t('ClearSecret'),
can: ({ row }) => { can: ({ row }) => {
return vm.$hasPerm('accounts.change_account') && !isDirectoryServiceAccount(row, vm) return vm.$hasPerm('accounts.change_account') &&
!isDirectoryServiceAccount(row, vm)
}, },
type: 'primary', type: 'primary',
callback: ({ row }) => { callback: ({ row }) => {
vm.$axios vm.$axios.patch(
.patch(`/api/v1/accounts/accounts/clear-secret/`, { account_ids: [row.id] }) `/api/v1/accounts/accounts/clear-secret/`,
.then(() => { { account_ids: [row.id] }
vm.$message.success(vm.$tc('ClearSuccessMsg')) ).then(() => {
}) vm.$message.success(vm.$tc('ClearSuccessMsg'))
})
} }
}, },
{ {
@@ -187,11 +184,9 @@ export const accountOtherActions = vm => {
type: 'primary', type: 'primary',
divided: true, divided: true,
can: ({ row }) => { can: ({ row }) => {
return ( return vm.$hasPerm('accounts.add_account') &&
vm.$hasPerm('accounts.add_account') &&
!vm.$store.getters.currentOrgIsRoot && !vm.$store.getters.currentOrgIsRoot &&
!isDirectoryServiceAccount(row, vm) !isDirectoryServiceAccount(row, vm)
)
}, },
has: () => { has: () => {
return !vm.asset return !vm.asset
@@ -209,11 +204,9 @@ export const accountOtherActions = vm => {
title: vm.$t('MoveToAsset'), title: vm.$t('MoveToAsset'),
type: 'primary', type: 'primary',
can: ({ row }) => { can: ({ row }) => {
return ( return vm.$hasPerm('accounts.add_account') &&
vm.$hasPerm('accounts.delete_account') &&
!vm.$store.getters.currentOrgIsRoot && !vm.$store.getters.currentOrgIsRoot &&
!isDirectoryServiceAccount(row, vm) !isDirectoryServiceAccount(row, vm)
)
}, },
has: () => { has: () => {
return !vm.asset return !vm.asset
@@ -229,7 +222,7 @@ export const accountOtherActions = vm => {
] ]
} }
export const accountQuickFilters = vm => [ export const accountQuickFilters = (vm) => [
{ {
label: vm.$t('Recent (7 days)'), label: vm.$t('Recent (7 days)'),
options: [ options: [

View File

@@ -20,7 +20,7 @@
<script> <script>
import TreeTable from '../../Table/TreeTable/index.vue' import TreeTable from '../../Table/TreeTable/index.vue'
import { getShowCurrentAssetValue, setRouterQuery, setUrlParam } from '@/utils/common/index' import { setRouterQuery, setUrlParam } from '@/utils/common'
import $ from '@/utils/jquery-vendor' import $ from '@/utils/jquery-vendor'
export default { export default {
@@ -160,7 +160,7 @@ export default {
return str return str
}, },
decorateRMenu() { decorateRMenu() {
const show_current_asset = getShowCurrentAssetValue(this.$cookie) const show_current_asset = this.$cookie.get('show_current_asset') || '0'
if (show_current_asset === '1') { if (show_current_asset === '1') {
$('#m_show_asset_all_children_node').css('color', '#606266') $('#m_show_asset_all_children_node').css('color', '#606266')
$('#m_show_asset_only_current_node').css('color', 'green') $('#m_show_asset_only_current_node').css('color', 'green')
@@ -172,7 +172,6 @@ export default {
getAssetsUrl(treeNode) { getAssetsUrl(treeNode) {
let url = this.treeSetting?.url || this.url let url = this.treeSetting?.url || this.url
const showCurrentAsset = getShowCurrentAssetValue(this.$cookie)
const setParam = (param, value, delay) => { const setParam = (param, value, delay) => {
setTimeout(() => { setTimeout(() => {
@@ -184,12 +183,10 @@ export default {
const nodeId = treeNode.meta.data.id const nodeId = treeNode.meta.data.id
setParam('node_id', nodeId) setParam('node_id', nodeId)
setParam('asset_id', '') setParam('asset_id', '')
setParam('show_current_asset', showCurrentAsset)
} else if (treeNode.meta.type === 'asset') { } else if (treeNode.meta.type === 'asset') {
const assetId = treeNode.meta.data?.id || treeNode.id const assetId = treeNode.meta.data?.id || treeNode.id
setParam('node_id', '') setParam('node_id', '')
setParam('asset_id', assetId) setParam('asset_id', assetId)
setParam('show_current_asset', showCurrentAsset)
} else if (treeNode.meta.type === 'category') { } else if (treeNode.meta.type === 'category') {
setParam('category', treeNode.meta.category) setParam('category', treeNode.meta.category)
} else if (treeNode.meta.type === 'type') { } else if (treeNode.meta.type === 'type') {

View File

@@ -77,9 +77,9 @@
<script> <script>
import MessageText from './MessageText.vue' import MessageText from './MessageText.vue'
import { mapGetters, mapState } from 'vuex' import { mapGetters, mapState } from 'vuex'
import { copy } from '@/utils/common/index' import { copy } from '@/utils/common'
import { useChat } from '../../useChat.js' import { useChat } from '../../useChat.js'
import { reconnect } from '@/utils/request' import { reconnect } from '@/utils/socket'
const { setLoading, removeLoadingMessageInChat } = useChat() const { setLoading, removeLoadingMessageInChat } = useChat()

View File

@@ -17,7 +17,7 @@ import mdKatex from '@traptitech/markdown-it-katex'
import mila from 'markdown-it-link-attributes' import mila from 'markdown-it-link-attributes'
import hljs from 'highlight.js' import hljs from 'highlight.js'
import 'highlight.js/styles/atom-one-dark.css' import 'highlight.js/styles/atom-one-dark.css'
import { copy } from '@/utils/common/index' import { copy } from '@/utils/common'
export default { export default {
props: { props: {
@@ -69,7 +69,7 @@ export default {
return vm.highlightBlock(hljs.highlightAuto(code).value, '') return vm.highlightBlock(hljs.highlightAuto(code).value, '')
} }
}) })
this.markdown.use(mila, { attrs: { target: '_blank', rel: 'noopener', class: 'link-style' } }) this.markdown.use(mila, { attrs: { target: '_blank', rel: 'noopener', class: 'link-style' }})
this.markdown.use(mdKatex, { blockClass: 'katexmath-block rounded-md', errorColor: ' #cc0000' }) this.markdown.use(mdKatex, { blockClass: 'katexmath-block rounded-md', errorColor: ' #cc0000' })
}, },
highlightBlock(str, lang) { highlightBlock(str, lang) {

View File

@@ -37,7 +37,7 @@
import ChatInput from './ChatInput.vue' import ChatInput from './ChatInput.vue'
import ChatMessage from './ChatMessage.vue' import ChatMessage from './ChatMessage.vue'
import { mapState } from 'vuex' import { mapState } from 'vuex'
import { closeWebSocket, createWebSocket, onSend, ws } from '@/utils/request' import { closeWebSocket, createWebSocket, onSend, ws } from '@/utils/socket'
import { getInputFocus, useChat } from '../../useChat.js' import { getInputFocus, useChat } from '../../useChat.js'
const { const {

View File

@@ -13,8 +13,6 @@
</template> </template>
<script> <script>
import { BASE_URL } from '@/utils/common/index'
export default { export default {
props: { props: {
active: { active: {
@@ -43,16 +41,6 @@ export default {
}, },
handleExpand() { handleExpand() {
this.$emit('expand-full') 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
} }
} }
} }

View File

@@ -1,6 +1,5 @@
<template> <template>
<DrawerPanel <DrawerPanel
v-if="visible"
ref="drawer" ref="drawer"
:default-show-panel="!!defaultShowPanel" :default-show-panel="!!defaultShowPanel"
:expanded="expanded" :expanded="expanded"
@@ -46,10 +45,9 @@
import Sidebar from './components/Sidebar/index.vue' import Sidebar from './components/Sidebar/index.vue'
import Chat from './components/ChitChat/index.vue' import Chat from './components/ChitChat/index.vue'
import { getInputFocus } from './useChat.js' import { getInputFocus } from './useChat.js'
import { ws } from '@/utils/request' import { ws } from '@/utils/socket'
import DrawerPanel from '@/components/Apps/DrawerPanel/index.vue' import DrawerPanel from '@/components/Apps/DrawerPanel/index.vue'
import { ObjectLocalStorage } from '@/utils/common' import { ObjectLocalStorage } from '@/utils/common'
import { mapGetters } from 'vuex'
const aiPannelLocalStorage = new ObjectLocalStorage('ai_panel_settings') const aiPannelLocalStorage = new ObjectLocalStorage('ai_panel_settings')
export default { export default {
@@ -76,7 +74,6 @@ export default {
}, },
data() { data() {
return { return {
visible: false,
active: 'chat', active: 'chat',
robotUrl: require('@/assets/img/robot-assistant.png'), robotUrl: require('@/assets/img/robot-assistant.png'),
height: '400px', height: '400px',
@@ -85,44 +82,14 @@ export default {
currentTerminalContent: {} currentTerminalContent: {}
} }
}, },
computed: {
...mapGetters([
'publicSettings'
])
},
watch: { watch: {
'publicSettings.CHAT_AI_METHOD': {
handler(newVal) {
this.visible = newVal === 'api'
}
}
}, },
mounted() { mounted() {
this.handleStartChat() const expanded = aiPannelLocalStorage.get('expanded')
this.updateExpandedState(expanded)
this.handlePostMessage()
}, },
methods: { methods: {
handleStartChat() {
if (this.publicSettings.CHAT_AI_METHOD === 'api') {
this.visible = true
const expanded = aiPannelLocalStorage.get('expanded')
this.updateExpandedState(expanded)
this.handlePostMessage()
} else if (this.publicSettings.CHAT_AI_METHOD === 'embed') {
const embedScriptId = 'chat-ai-embed-id'
if (document.getElementById(embedScriptId)) {
return
}
const script = document.createElement('script')
script.id = embedScriptId
script.src = this.publicSettings.CHAT_AI_EMBED_URL
script.async = true
script.onload = () => {
const loadEvent = new Event('load', { bubbles: false, cancelable: false })
window.dispatchEvent(loadEvent)
}
document.body.appendChild(script)
}
},
handlePostMessage() { handlePostMessage() {
window.addEventListener('message', (event) => { window.addEventListener('message', (event) => {
if (event.data === 'show-chat-panel') { if (event.data === 'show-chat-panel') {

View File

@@ -1,5 +1,5 @@
import store from '@/store' import store from '@/store'
import { pageScroll } from '@/utils/common/index' import { pageScroll } from '@/utils/common'
export const getInputFocus = () => { export const getInputFocus = () => {
const dom = document.querySelector('.chat-input .el-textarea__inner') const dom = document.querySelector('.chat-input .el-textarea__inner')
@@ -9,11 +9,11 @@ export const getInputFocus = () => {
export function useChat() { export function useChat() {
const chatStore = {} const chatStore = {}
const setLoading = loading => { const setLoading = (loading) => {
store.commit('chat/setLoading', loading) store.commit('chat/setLoading', loading)
} }
const onNewChat = name => { const onNewChat = (name) => {
const data = { const data = {
name: name || `new chat`, name: name || `new chat`,
id: 1, id: 1,
@@ -27,7 +27,7 @@ export function useChat() {
store.commit('chat/clearChats') store.commit('chat/clearChats')
} }
const addMessageToActiveChat = chat => { const addMessageToActiveChat = (chat) => {
store.commit('chat/addMessageToActiveChat', chat) store.commit('chat/addMessageToActiveChat', chat)
} }
@@ -35,7 +35,7 @@ export function useChat() {
store.commit('chat/removeLoadingMessageInChat') store.commit('chat/removeLoadingMessageInChat')
} }
const addChatMessageById = chat => { const addChatMessageById = (chat) => {
store.commit('chat/addMessageToActiveChat', chat) store.commit('chat/addMessageToActiveChat', chat)
if (chat?.conversation_id) { if (chat?.conversation_id) {
store.commit('chat/setActiveChatConversationId', chat.conversation_id) store.commit('chat/setActiveChatConversationId', chat.conversation_id)
@@ -54,7 +54,7 @@ export function useChat() {
addChatMessageById(temporaryChat) addChatMessageById(temporaryChat)
} }
const newChatAndAddMessageById = chat => { const newChatAndAddMessageById = (chat) => {
onNewChat(chat.message.content) onNewChat(chat.message.content)
addChatMessageById(chat) addChatMessageById(chat)
} }

View File

@@ -34,7 +34,7 @@
<script> <script>
import Dialog from '@/components/Dialog/index.vue' import Dialog from '@/components/Dialog/index.vue'
import { openTaskPage } from '@/utils/jms/index' import { openTaskPage } from '@/utils/jms'
export default { export default {
name: 'GatewayDialog', name: 'GatewayDialog',

View File

@@ -85,7 +85,7 @@ export default {
hasTree: true, hasTree: true,
columnsExtra: ['view_account'], columnsExtra: ['view_account'],
columnsExclude: ['spec_info'], columnsExclude: ['spec_info'],
columns: ['id', 'name', 'address', 'comment', 'labels', 'connectivity', 'platform', 'view_account', 'actions'], columns: ['id', 'name', 'address', 'platform', 'view_account', 'actions'],
columnsShow: { columnsShow: {
min: ['name', 'address', 'accounts'], min: ['name', 'address', 'accounts'],
default: ['name', 'address', 'platform', 'view_account', 'actions'] default: ['name', 'address', 'platform', 'view_account', 'actions']
@@ -109,6 +109,11 @@ export default {
}, },
connectivity: connectivityMeta, connectivity: connectivityMeta,
comment: { ...this.comment } comment: { ...this.comment }
},
tableAttrs: {
rowClassName({ row }) {
return !row.is_active ? 'row_disabled' : ''
}
} }
}, },
headerActions: { headerActions: {

View File

@@ -37,12 +37,8 @@ export default {
}, },
headerActions: { headerActions: {
hasExport: true, hasExport: false,
hasImport: true, hasImport: false,
importOptions: {
encryptFields: [''], // 这里不加密 password''只是为了保证数组有值
canImportUpdate: false
},
hasCreate: true, hasCreate: true,
hasSearch: true, hasSearch: true,
hasRefresh: true, hasRefresh: true,

View File

@@ -6,7 +6,7 @@
<script> <script>
import { DrawerListTable as ListTable } from '@/components' import { DrawerListTable as ListTable } from '@/components'
import { toM2MJsonParams } from '@/utils/jms/index' import { toM2MJsonParams } from '@/utils/jms'
import { DetailFormatter } from '@/components/Table/TableFormatters' import { DetailFormatter } from '@/components/Table/TableFormatters'
import TwoCol from '@/layout/components/Page/TwoColPage.vue' import TwoCol from '@/layout/components/Page/TwoColPage.vue'
@@ -25,7 +25,6 @@ export default {
}, },
data() { data() {
const [key, value] = toM2MJsonParams(this.object.assets) const [key, value] = toM2MJsonParams(this.object.assets)
const org_id = this.object.org_id || this.$store.getters.currentOrg.id
return { return {
config: { config: {
headerActions: { headerActions: {
@@ -34,7 +33,7 @@ export default {
hasExport: false hasExport: false
}, },
tableConfig: { 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'], columns: ['name', 'address', 'platform', 'type', 'is_active'],
columnsShow: { columnsShow: {
min: ['name', 'address'], min: ['name', 'address'],
@@ -46,7 +45,7 @@ export default {
formatter: DetailFormatter, formatter: DetailFormatter,
formatterArgs: { formatterArgs: {
getRoute: ({ row }) => { getRoute: ({ row }) => {
return { name: 'AssetDetail', params: { id: row.id } } return { name: 'AssetDetail', params: { id: row.id }}
} }
} }
}, },

View File

@@ -6,7 +6,7 @@
<script> <script>
import { DrawerListTable as ListTable } from '@/components' import { DrawerListTable as ListTable } from '@/components'
import { toM2MJsonParams } from '@/utils/jms/index' import { toM2MJsonParams } from '@/utils/jms'
import TwoCol from '@/layout/components/Page/TwoColPage.vue' import TwoCol from '@/layout/components/Page/TwoColPage.vue'
import { DetailFormatter } from '@/components/Table/TableFormatters' import { DetailFormatter } from '@/components/Table/TableFormatters'
@@ -25,7 +25,6 @@ export default {
}, },
data() { data() {
const [key, value] = toM2MJsonParams(this.object.users) const [key, value] = toM2MJsonParams(this.object.users)
const org_id = this.object.org_id || this.$store.getters.currentOrg.id
return { return {
config: { config: {
headerActions: { headerActions: {
@@ -34,7 +33,7 @@ export default {
hasExport: false hasExport: false
}, },
tableConfig: { tableConfig: {
url: `/api/v1/users/users/?${key}=${value}&oid=${org_id}`, url: `/api/v1/users/users/?${key}=${value}`,
columns: [ columns: [
'name', 'username', 'email', 'groups', 'system_roles', 'name', 'username', 'email', 'groups', 'system_roles',
'org_roles', 'source', 'is_valid' 'org_roles', 'source', 'is_valid'

View File

@@ -30,8 +30,8 @@
<script> <script>
import IBox from '@/components/Common/IBox/index.vue' import IBox from '@/components/Common/IBox/index.vue'
import DiffDetail from '@/components/Dialog/DiffDetail.vue' import DiffDetail from '@/components/Dialog/DiffDetail.vue'
import { openTaskPage } from '@/utils/jms/index' import { openTaskPage } from '@/utils/jms'
import { toSafeLocalDateStr } from '@/utils/common/time' import { toSafeLocalDateStr } from '@/utils/time'
import TwoCol from '@/layout/components/Page/TwoColPage.vue' import TwoCol from '@/layout/components/Page/TwoColPage.vue'
export default { export default {

View File

@@ -8,17 +8,22 @@
:visible.sync="visible" :visible.sync="visible"
class="dialog-content" class="dialog-content"
v-bind="$attrs" v-bind="$attrs"
width="600px" width="740px"
@confirm="visible = false" @confirm="visible = false"
v-on="$listeners" v-on="$listeners"
> >
<div v-if="confirmTypeRequired === 'relogin'"> <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-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-col>
</el-row> </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-col :md="24" :sm="24">
<el-button class="confirm-btn" size="mini" type="primary" @click="logout"> <el-button class="confirm-btn" size="mini" type="primary" @click="logout">
{{ this.$t('ReLogin') }} {{ this.$t('ReLogin') }}
@@ -27,11 +32,11 @@
</el-row> </el-row>
</div> </div>
<div v-else> <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-col :md="24" :sm="24" :span="24" class="add">
<el-select <el-select
v-model="subTypeSelected" v-model="subTypeSelected"
style="width: 100%; margin-bottom: 20px" style="width: 100%; margin-bottom: 20px;"
@change="handleSubTypeChange" @change="handleSubTypeChange"
> >
<el-option <el-option
@@ -44,22 +49,19 @@
</el-select> </el-select>
</el-col> </el-col>
</el-row> </el-row>
<el-row v-if="!noCodeMFA.includes(subTypeSelected)" :gutter="24" style="margin: 0 auto"> <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-col :md="24" :sm="24" style="display: flex; align-items: center; ">
<el-input <el-input
v-model="secretValue" v-model="secretValue"
:placeholder="inputPlaceholder" :placeholder="inputPlaceholder"
:show-password="showPassword" :show-password="showPassword"
@keyup.enter.native="handleConfirm" @keyup.enter.native="handleConfirm"
/> />
<span <span v-if="subTypeSelected === 'sms' || subTypeSelected === 'email'" style="margin: -1px 0 0 20px;">
v-if="subTypeSelected === 'sms' || subTypeSelected === 'email'"
style="margin: -1px 0 0 20px"
>
<el-button <el-button
:disabled="smsBtnDisabled" :disabled="smsBtnDisabled"
size="mini" size="mini"
style="line-height: 14px; float: right" style="line-height: 14px; float: right;"
type="primary" type="primary"
@click="sendCode" @click="sendCode"
> >
@@ -70,17 +72,21 @@
</el-row> </el-row>
<el-row> <el-row>
<el-col> <el-col>
<iframe v-if="passkeyVisible" :src="passkeyUrl" style="display: none" />
<iframe <iframe
v-if="isFaceCaptureVisible && subTypeSelected === 'face' && faceCaptureUrl" v-if="passkeyVisible"
:src="passkeyUrl"
style="display: none"
/>
<iframe
v-if="isFaceCaptureVisible && subTypeSelected ==='face' && faceCaptureUrl"
:src="faceCaptureUrl" :src="faceCaptureUrl"
allow="camera" allow="camera"
sandbox="allow-scripts allow-same-origin" sandbox="allow-scripts allow-same-origin"
style="width: 100%; height: 600px; border: none" style="width: 100%; height: 600px;border: none;"
/> />
</el-col> </el-col>
</el-row> </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-col :md="24" :sm="24">
<el-button <el-button
v-if="!noCodeMFA.includes(subTypeSelected)" v-if="!noCodeMFA.includes(subTypeSelected)"
@@ -118,7 +124,7 @@
</template> </template>
<script> <script>
import Dialog from '@/components/Dialog/index.vue' import Dialog from '@/components/Dialog/index.vue'
import { encryptPassword } from '@/utils/secure' import { encryptPassword } from '@/utils/crypto'
export default { export default {
name: 'UserConfirmDialog', name: 'UserConfirmDialog',
@@ -189,65 +195,55 @@ export default {
this.$log.debug('perform confirm action') this.$log.debug('perform confirm action')
const confirmType = response.data?.code const confirmType = response.data?.code
const confirmUrl = '/api/v1/authentication/confirm/' const confirmUrl = '/api/v1/authentication/confirm/'
this.$axios this.$axios.get(confirmUrl, { params: { confirm_type: confirmType }}).then((data) => {
.get(confirmUrl, { params: { confirm_type: confirmType } }) this.confirmTypeRequired = data.confirm_type
.then(data => {
this.confirmTypeRequired = data.confirm_type
if (this.confirmTypeRequired === 'relogin') { if (this.confirmTypeRequired === 'relogin') {
this.$axios this.$axios.post(confirmUrl, { 'confirm_type': 'relogin', 'secret_key': 'x' }).then(() => {
.post(confirmUrl, { confirm_type: 'relogin', secret_key: 'x' }) this.callback()
.then(() => { this.visible = false
this.callback() }).catch(() => {
this.visible = false this.title = this.$t('NeedReLogin')
}) this.visible = true
.catch(() => { })
this.title = this.$t('NeedReLogin') return
this.visible = true }
}) this.subTypeChoices = data.content
return const defaultSubType = this.subTypeChoices.filter(item => !item.disabled)[0]
} this.subTypeSelected = defaultSubType.name
this.subTypeChoices = data.content this.inputPlaceholder = defaultSubType.placeholder
const defaultSubType = this.subTypeChoices.filter(item => !item.disabled)[0] this.visible = true
this.subTypeSelected = defaultSubType.name }).catch((err) => {
this.inputPlaceholder = defaultSubType.placeholder const data = err.response?.data
this.visible = true const msg = data?.error || data?.detail || data?.msg || this.$t('GetConfirmTypeFailed')
}) this.$message.error(msg)
.catch(err => { this.cancel(err)
const data = err.response?.data }).finally(() => {
const msg = data?.error || data?.detail || data?.msg || this.$t('GetConfirmTypeFailed') this.processing = false
this.$message.error(msg) })
this.cancel(err)
})
.finally(() => {
this.processing = false
})
}, 500), }, 500),
logout() { logout() {
window.location.href = `${process.env.VUE_APP_LOGOUT_PATH}?next=${this.$route.fullPath}` window.location.href = `${process.env.VUE_APP_LOGOUT_PATH}?next=${this.$route.fullPath}`
}, },
sendCode() { sendCode() {
this.$axios this.$axios.post(`/api/v1/authentication/mfa/select/`, { type: this.subTypeSelected }).then(res => {
.post(`/api/v1/authentication/mfa/select/`, { type: this.subTypeSelected }) this.$message.success(this.$tc('VerificationCodeSent'))
.then(res => { let time = 60
this.$message.success(this.$tc('VerificationCodeSent')) this.smsBtnDisabled = true
let time = 60
this.smsBtnDisabled = true
const interval = setInterval(() => { const interval = setInterval(() => {
time -= 1 time -= 1
this.smsBtnText = `${this.$t('Pending')}: ${time}` this.smsBtnText = `${this.$t('Pending')}: ${time}`
if (time <= 0) { if (time <= 0) {
clearInterval(interval) clearInterval(interval)
this.smsBtnText = this.$t('SendVerificationCode') this.smsBtnText = this.$t('SendVerificationCode')
this.smsBtnDisabled = false this.smsBtnDisabled = false
} }
}, 1000) }, 1000)
}) }).catch(() => {
.catch(() => { this.$message.error(this.$tc('FailedToSendVerificationCode'))
this.$message.error(this.$tc('FailedToSendVerificationCode')) })
})
}, },
handlePasskeyVerify() { handlePasskeyVerify() {
this.passkeyVisible = true this.passkeyVisible = true
@@ -271,26 +267,23 @@ export default {
}, },
startFaceCapture() { startFaceCapture() {
const url = '/api/v1/authentication/face/context/' const url = '/api/v1/authentication/face/context/'
this.$axios this.$axios.post(url).then(data => {
.post(url) const token = data['token']
.then(data => { this.faceCaptureUrl = '/facelive/capture?token=' + token
const token = data['token'] this.isFaceCaptureVisible = true
this.faceCaptureUrl = '/facelive/capture?token=' + token
this.isFaceCaptureVisible = true
const timer = setInterval(() => { const timer = setInterval(() => {
this.$axios.get(url + `?token=${token}`).then(data => { this.$axios.get(url + `?token=${token}`).then(data => {
if (data['is_finished']) { if (data['is_finished']) {
clearInterval(timer) clearInterval(timer)
this.isFaceCaptureVisible = false this.isFaceCaptureVisible = false
this.handleConfirm() this.handleConfirm()
} }
}) })
}, 1000) }, 1000)
}) }).catch(() => {
.catch(() => { this.$message.error(this.$tc('FailedToStartFaceCapture'))
this.$message.error(this.$tc('FailedToStartFaceCapture')) })
})
}, },
handleFaceCapture() { handleFaceCapture() {
this.startFaceCapture() this.startFaceCapture()
@@ -313,22 +306,16 @@ export default {
const data = { const data = {
confirm_type: this.confirmTypeRequired, confirm_type: this.confirmTypeRequired,
mfa_type: this.confirmTypeRequired === 'mfa' ? this.subTypeSelected : '', mfa_type: this.confirmTypeRequired === 'mfa' ? this.subTypeSelected : '',
secret_key: secret_key: this.confirmTypeRequired === 'password' ? encryptPassword(this.secretValue) : this.secretValue
this.confirmTypeRequired === 'password'
? encryptPassword(this.secretValue)
: this.secretValue
} }
this.$axios this.$axios.post(`/api/v1/authentication/confirm/`, data).then(() => {
.post(`/api/v1/authentication/confirm/`, data) this.onSuccess()
.then(() => { }).catch((err) => {
this.onSuccess() this.$message.error(err.message || this.$tc('ConfirmFailed'))
}) this.faceCaptureUrl = null
.catch(err => { this.isFaceCaptureVisible = false
this.$message.error(err.message || this.$tc('ConfirmFailed')) })
this.faceCaptureUrl = null
this.isFaceCaptureVisible = false
})
} }
} }
} }

View File

@@ -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>

View File

@@ -1,5 +1,5 @@
<script type="text/jsx"> <script type="text/jsx">
import { toSafeLocalDateStr } from '@/utils/common/time' import { toSafeLocalDateStr } from '@/utils/time'
export default { export default {
name: 'ItemValue', name: 'ItemValue',

View File

@@ -12,8 +12,8 @@
<script> <script>
import DetailCard from './index.vue' import DetailCard from './index.vue'
import { copy } from '@/utils/common/index' import { copy } from '@/utils/common'
import { toSafeLocalDateStr } from '@/utils/common/time' import { toSafeLocalDateStr } from '@/utils/time'
import IBox from '@/components/Common/IBox/index.vue' import IBox from '@/components/Common/IBox/index.vue'
import LabelsDetailFormatter from '../Formatters/LabelsDetailFormatter.vue' import LabelsDetailFormatter from '../Formatters/LabelsDetailFormatter.vue'

View File

@@ -5,7 +5,7 @@
<div v-if="item.has !== false" :key="item.key" :class="item.class " :label="item.key" class="el-form-item"> <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 slot="label" class="el-form-item__label"> {{ formateLabel(item.key) }}</span>
<span class="item-value el-form-item__content"> <span class="item-value el-form-item__content">
<component <template
:is="item.component" :is="item.component"
v-if="item.component" v-if="item.component"
v-bind="{...item}" v-bind="{...item}"

View File

@@ -5,7 +5,7 @@
v-if="action.dropdown" v-if="action.dropdown"
v-show="action.dropdown.length > 0" v-show="action.dropdown.length > 0"
:key="action.name" :key="action.name"
:class="[action.name, { grouped: action.grouped, 'table-action-text': isTableActionText }]" :class="[action.name, {grouped: action.grouped }]"
:size="action.size" :size="action.size"
:split-button="!!action.split" :split-button="!!action.split"
:type="action.type" :type="action.type"
@@ -16,32 +16,29 @@
@command="handleDropdownCallback" @command="handleDropdownCallback"
> >
<span v-if="action.split" :style="{ cursor: action.disabled ? 'not-allowed' : 'pointer' }"> <span v-if="action.split" :style="{ cursor: action.disabled ? 'not-allowed' : 'pointer' }">
<Icon v-if="isEllipsisAction(action)" class="ellipsis-icon" icon="fa-ellipsis-v" /> {{ action.title }}
<span v-else>{{ getActionTitle(action) }}</span>
</span> </span>
<el-button <el-button
v-else v-else
:class="[action.name, { 'table-action-text': isTableActionText }]" :class="action.name"
:size="size" :size="size"
class="more-action" class="more-action"
v-bind="{ ...cleanButtonAction(action), icon: '' }" v-bind="{...cleanButtonAction(action), icon: ''}"
> >
<span class="pre-icon"> <span class="pre-icon">
<Icon v-if="action.icon" :icon="action.icon" /> <Icon v-if="action.icon" :icon="action.icon" />
</span> </span>
<span v-if="action.title"> <span v-if="action.title">
<Icon v-if="isEllipsisAction(action)" class="ellipsis-icon" icon="fa-ellipsis-v" /> {{ action.title }}<i class="el-icon-arrow-down el-icon--right" />
<span v-else>{{ getActionTitle(action) }}</span>
<i class="el-icon-arrow-down el-icon--right" />
</span> </span>
</el-button> </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"> <template v-for="option in action.dropdown">
<div <div
v-if="option.group" v-if="option.group"
:key="'group:' + option.name" :key="'group:'+option.name"
class="dropdown-menu-title" class="dropdown-menu-title"
style="width: 130px" style="width:130px"
> >
{{ option.group }} {{ option.group }}
</div> </div>
@@ -57,7 +54,7 @@
:command="[option, action]" :command="[option, action]"
:title="option.tip" :title="option.tip"
class="dropdown-item" class="dropdown-item"
v-bind="{ ...option, icon: '' }" v-bind="{...option, icon: ''}"
> >
<span v-if="actionsHasIcon(action.dropdown)" class="pre-icon"> <span v-if="actionsHasIcon(action.dropdown)" class="pre-icon">
<Icon v-if="option.icon" :icon="option.icon" /> <Icon v-if="option.icon" :icon="option.icon" />
@@ -72,10 +69,10 @@
<el-button <el-button
v-else v-else
:key="action.name" :key="action.name"
:class="[action.name, { grouped: action.grouped, 'table-action-text': isTableActionText }]" :class="[action.name, {grouped: action.grouped }]"
:size="size" :size="size"
class="action-item" class="action-item"
v-bind="{ ...cleanButtonAction(action), icon: '' }" v-bind="{...cleanButtonAction(action), icon: ''}"
@click="handleClick(action)" @click="handleClick(action)"
> >
<el-tooltip :content="action.tip" :disabled="!action.tip" placement="top"> <el-tooltip :content="action.tip" :disabled="!action.tip" placement="top">
@@ -83,8 +80,7 @@
<span v-if="action.icon" style="vertical-align: initial"> <span v-if="action.icon" style="vertical-align: initial">
<Icon :icon="action.icon" /> <Icon :icon="action.icon" />
</span> </span>
<Icon v-if="isEllipsisAction(action)" class="ellipsis-icon" icon="fa-ellipsis-v" /> {{ action.title }}
<span v-else>{{ getActionTitle(action) }}</span>
</span> </span>
</el-tooltip> </el-tooltip>
</el-button> </el-button>
@@ -93,7 +89,7 @@
</template> </template>
<script> <script>
import { toSentenceCase } from '@/utils/common/index' import { toSentenceCase } from '@/utils/common'
import Icon from '@/components/Widgets/Icon/index.vue' import Icon from '@/components/Widgets/Icon/index.vue'
export default { export default {
@@ -122,21 +118,9 @@ export default {
computed: { computed: {
iActions() { iActions() {
return this.cleanActions(this.actions) return this.cleanActions(this.actions)
},
tableActionButtonType() {
return this.$store?.state?.settings?.tableActionButtonType || 'default'
},
isTableActionText() {
return this.tableActionButtonType === 'text'
} }
}, },
methods: { methods: {
getActionTitle(action) {
return action?.title
},
isEllipsisAction(action) {
return this.isTableActionText && action?.title === '...'
},
actionsHasIcon(actions) { actionsHasIcon(actions) {
return actions.some(action => action.icon) return actions.some(action => action.icon)
}, },
@@ -244,10 +228,9 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
$btn-text-color: #ffffff; $btn-text-color: #ffffff;
$color-btn-background: var(--color-primary-light-3, #e8f7f4); $color-btn-background: #E8F7F4;
$color-btn-focus-background: var(--color-primary-light-1, var(--color-primary)); $color-btn-focus-background: #83CBBA;
$color-text-hover: var(--color-primary-light-1); $color-divided: #E4E7ED;
$color-divided: #e4e7ed;
$color-drop-menu-title: #909399; $color-drop-menu-title: #909399;
$color-drop-menu-border: #e4e7ed; $color-drop-menu-border: #e4e7ed;
@@ -275,11 +258,9 @@ $color-drop-menu-border: #e4e7ed;
.action-item.el-dropdown { .action-item.el-dropdown {
font-size: 11px; font-size: 11px;
.more-action { .more-action.el-button--default {
.el-button--default { ::v-deep .el-icon-arrow-down.el-icon--right {
::v-deep .el-icon-arrow-down.el-icon--right { color: var(--color-icon-primary) !important;
color: var(--color-icon-primary) !important;
}
} }
} }
@@ -303,8 +284,6 @@ $color-drop-menu-border: #e4e7ed;
.el-button { .el-button {
padding: 2px 5px; padding: 2px 5px;
line-height: 1.3;
font-size: 13px;
&:not(.is-plain) { &:not(.is-plain) {
color: $btn-text-color; color: $btn-text-color;
@@ -335,29 +314,12 @@ $color-drop-menu-border: #e4e7ed;
background-color: $color-btn-focus-background; background-color: $color-btn-focus-background;
} }
} }
.action-item.table-action-text.el-button,
::v-deep .action-item.table-action-text.el-dropdown .el-button {
color: var(--color-primary) !important;
background-color: transparent !important;
border-color: transparent !important;
transition: color 0.2s ease;
}
.action-item.table-action-text.el-button:hover,
.action-item.table-action-text.el-button:focus,
::v-deep .action-item.table-action-text.el-dropdown .el-button:hover,
::v-deep .action-item.table-action-text.el-dropdown .el-button:focus {
color: $color-text-hover !important;
background-color: transparent !important;
border-color: transparent !important;
box-shadow: none !important;
}
} }
// 下拉 options // 下拉 options
.el-dropdown-menu { .el-dropdown-menu {
::v-deep .more-batch-processing { ::v-deep .more-batch-processing {
&:hover { &:hover {
background-color: transparent !important; background-color: transparent !important;
} }

View File

@@ -26,7 +26,7 @@
import Switcher from '@/components/Form/FormFields/Switcher.vue' import Switcher from '@/components/Form/FormFields/Switcher.vue'
import Select2 from '@/components/Form/FormFields/Select2.vue' import Select2 from '@/components/Form/FormFields/Select2.vue'
import UpdateSelect from '@/components/Form/FormFields/UpdateSelect.vue' import UpdateSelect from '@/components/Form/FormFields/UpdateSelect.vue'
import { toSentenceCase } from '@/utils/common/index' import { toSentenceCase } from '@/utils/common'
class Action { class Action {
constructor() { constructor() {

View File

@@ -1,6 +1,6 @@
<template> <template>
<div> <div class="content">
<Echart <echarts
ref="echarts" ref="echarts"
:options="options" :options="options"
:autoresize="true" :autoresize="true"
@@ -12,10 +12,9 @@
// eslint-disable-next-line no-unused-vars // eslint-disable-next-line no-unused-vars
import * as echarts from 'echarts' import * as echarts from 'echarts'
import { mix } from '@/utils/theme/color' import { mix } from '@/utils/theme/color'
import Echart from '@/components/Dashboard/Echart.vue'
export default { export default {
components: { Echart }, components: {},
props: { props: {
datesMetrics: { datesMetrics: {
type: Array, type: Array,

View File

@@ -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>

View File

@@ -1,12 +1,14 @@
<template> <template>
<div> <div>
<Echart <echarts
ref="echarts" ref="echarts"
:options="options" :options="options"
:autoresize="true" :autoresize="true"
theme="light" theme="light"
@finished="genSnapshot" class="disabled-when-print"
@finished="getDataUrl"
/> />
<img v-if="dataUrl" :src="dataUrl" class="enabled-when-print" style="display: none;width: 100%;">
</div> </div>
</template> </template>
@@ -14,11 +16,9 @@
// eslint-disable-next-line no-unused-vars // eslint-disable-next-line no-unused-vars
import * as echarts from 'echarts' import * as echarts from 'echarts'
import { mix } from '@/utils/theme/color' import { mix } from '@/utils/theme/color'
import Echart from '@/components/Dashboard/Echart.vue'
export default { export default {
name: 'LoginMetric', name: 'LoginMetric',
components: { Echart },
props: { props: {
range: { range: {
type: String, type: String,
@@ -110,6 +110,7 @@ export default {
}, },
axisLabel: { axisLabel: {
textStyle: { textStyle: {
// 坐标轴颜色
color: '#8F959E' color: '#8F959E'
} }
}, },
@@ -154,7 +155,7 @@ export default {
type: 'line', type: 'line',
smooth: true, smooth: true,
areaStyle: { areaStyle: {
// 区域填充样式 // 区域填充样式
normal: { normal: {
color: new echarts.graphic.LinearGradient( color: new echarts.graphic.LinearGradient(
0, 0,
@@ -186,7 +187,7 @@ export default {
type: 'line', type: 'line',
smooth: true, smooth: true,
areaStyle: { areaStyle: {
// 区域填充样式 // 区域填充样式
normal: { normal: {
color: new echarts.graphic.LinearGradient( color: new echarts.graphic.LinearGradient(
0, 0,
@@ -219,58 +220,23 @@ export default {
}, },
watch: { watch: {
range() { range() {
this.genSnapshot() this.getMetricData()
},
datesMetrics() {
this.genSnapshot()
},
primaryData() {
this.genSnapshot()
},
secondaryData() {
this.genSnapshot()
} }
}, },
mounted() { mounted() {
this.genSnapshot() this.getMetricData()
this._before = () => this.genSnapshot(true)
this._after = () => this.forceResize()
window.addEventListener('beforeprint', this._before)
window.addEventListener('afterprint', this._after)
// 兼容某些浏览器Safari触发 print 媒体切换
this._mql = window.matchMedia && window.matchMedia('print')
if (this._mql) {
const handler = e => (e.matches ? this._before() : this._after())
this._mql.addEventListener?.('change', handler)
this._mql.addListener?.(handler)
this._mql._handler = handler
}
},
beforeDestroy() {
window.removeEventListener('beforeprint', this._before)
window.removeEventListener('afterprint', this._after)
if (this._mql) {
this._mql.removeEventListener?.('change', this._mql._handler)
this._mql.removeListener?.(this._mql._handler)
}
}, },
methods: { methods: {
forceResize() { getDataUrl() {
const inst = this.$refs.echarts?.echartsInstance const instance = this.$refs.echarts.echartsInstance
if (inst) inst.resize() if (instance) {
}, this.dataUrl = instance.getDataURL()
async genSnapshot(force = false) {
if (force) this.forceResize()
const inst = this.$refs.echarts?.echartsInstance
if (!inst) return
try {
this.dataUrl = inst.getDataURL({ pixelRatio: 2, backgroundColor: '#ffffff' })
} catch (e) {
this.dataUrl = ''
} }
},
getMetricData() {
this.getDataUrl()
} }
} }
} }
</script> </script>
@@ -279,4 +245,16 @@ export default {
width: 100%; width: 100%;
height: 272px; height: 272px;
} }
@media print {
.disabled-when-print {
display: none;
}
.enabled-when-print {
display: inherit !important;
}
.print-margin {
margin-top: 10px;
}
}
</style> </style>

View File

@@ -1,6 +1,6 @@
<template> <template>
<div> <div>
<Echart <echarts
ref="echarts" ref="echarts"
:options="options" :options="options"
:autoresize="true" :autoresize="true"
@@ -13,10 +13,8 @@
// eslint-disable-next-line no-unused-vars // eslint-disable-next-line no-unused-vars
import * as echarts from 'echarts' import * as echarts from 'echarts'
import { mix } from '@/utils/theme/color' import { mix } from '@/utils/theme/color'
import Echart from '@/components/Dashboard/Echart.vue'
export default { export default {
components: { Echart },
props: { props: {
colors: { colors: {
type: Array, type: Array,
@@ -37,15 +35,14 @@ export default {
} }
}, },
data() { data() {
return {} return {
}
}, },
computed: { computed: {
options() { options() {
const seriesList = [] const seriesList = []
const labels = this.data.map(item => item.label) const labels = this.data.map(item => item.label)
const total = _.sumBy(this.data, function(i) { const total = _.sumBy(this.data, function(i) { return i.total })
return i.total
})
for (let i = 0, len = this.data.length; i < len; i++) { for (let i = 0, len = this.data.length; i < len; i++) {
const current = this.data[i] const current = this.data[i]
let num = (current.total / total) * 100 let num = (current.total / total) * 100
@@ -180,8 +177,8 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.echarts { .echarts {
width: 100%; width: 100%;
height: 72px; height: 72px;
} }
</style> </style>

View File

@@ -9,7 +9,7 @@
class="table" class="table"
style="width: 100%" style="width: 100%"
> >
<el-table-column :label="$tc('Ranking')" width="100"> <el-table-column :label="$tc('Ranking')">
<template #header> <template #header>
<el-tooltip :content="$t('Ranking')" placement="top" :open-delay="500"> <el-tooltip :content="$t('Ranking')" placement="top" :open-delay="500">
<span style="cursor: pointer;">{{ $t('Ranking') }}</span> <span style="cursor: pointer;">{{ $t('Ranking') }}</span>

View File

@@ -38,7 +38,7 @@ export default {
{ {
title: this.$t('OnlineSessions'), title: this.$t('OnlineSessions'),
body: { body: {
route: { name: `SessionList`, params: { activeMenu: 'OnlineList' } }, route: { name: `SessionList`, params: { activeMenu: 'OnlineList' }},
count: this.counter.total_count_online_sessions, count: this.counter.total_count_online_sessions,
disabled: !this.$hasPerm('terminal.view_session') disabled: !this.$hasPerm('terminal.view_session')
} }
@@ -46,7 +46,7 @@ export default {
{ {
title: this.$t('CurrentConnectionUsers'), title: this.$t('CurrentConnectionUsers'),
body: { body: {
route: { name: `SessionList`, params: { activeMenu: 'OnlineList' } }, route: { name: `SessionList`, params: { activeMenu: 'OnlineList' }},
count: this.counter.total_count_online_users, count: this.counter.total_count_online_users,
disabled: !this.$hasPerm('terminal.view_session') disabled: !this.$hasPerm('terminal.view_session')
} }

View File

@@ -1,6 +1,6 @@
<template> <template>
<div> <div>
<Echart <echarts
ref="echarts" ref="echarts"
:autoresize="true" :autoresize="true"
:options="options" :options="options"
@@ -13,15 +13,12 @@ import 'echarts/lib/chart/line'
import 'echarts/lib/component/legend' import 'echarts/lib/component/legend'
import Decimal from 'decimal.js' import Decimal from 'decimal.js'
import Echart from '@/components/Dashboard/Echart.vue'
export default { export default {
components: { Echart },
props: { props: {
config: { config: {
type: Object, type: Object,
default: () => { default: () => {}
}
} }
}, },
computed: { computed: {
@@ -36,7 +33,7 @@ export default {
const formatTitle = (text) => { const formatTitle = (text) => {
if (!text) return '' if (!text) return ''
const maxLength = 25 const maxLength = 23
const lines = [] const lines = []
for (let i = 0; i < text.length; i += maxLength) { for (let i = 0; i < text.length; i += maxLength) {
lines.push(text.slice(i, i + maxLength)) lines.push(text.slice(i, i + maxLength))
@@ -91,7 +88,6 @@ export default {
{ {
name: title, name: title,
type: 'pie', type: 'pie',
minAngle: 5,
radius: ['72%', '90%'], radius: ['72%', '90%'],
avoidLabelOverlap: false, avoidLabelOverlap: false,
itemStyle: { itemStyle: {

View File

@@ -16,13 +16,11 @@
<script> <script>
export default { export default {
props: { props: {
name: {
type: String,
default: 'dashboardDays'
},
days: { days: {
type: [String, Number], type: String,
default: null default: () => {
return localStorage.getItem('dashboardDays') || '7'
}
}, },
options: { options: {
type: Array, type: Array,
@@ -49,28 +47,8 @@ export default {
iOptions: this.options.length > 0 ? this.options : defaultOptions iOptions: this.options.length > 0 ? this.options : defaultOptions
} }
}, },
created() {
let days = this.days
if (!days) {
days = this.$route.query.days
}
if (!days) {
days = localStorage.getItem(this.name)
}
if (!days) {
days = '7'
}
if (days && days !== this.select) {
this.select = days
this.$emit('change', days)
}
},
mounted() {
this.$emit('change', this.select)
},
methods: { methods: {
onChange(val) { onChange(val) {
localStorage.setItem(this.name, val)
this.$emit('change', val) this.$emit('change', val)
} }
} }

View File

@@ -28,7 +28,7 @@
<script> <script>
import i18n from '@/i18n/i18n' import i18n from '@/i18n/i18n'
import { copy } from '@/utils/common/index' import { copy } from '@/utils/common'
import Dialog from '@/components/Dialog/index' import Dialog from '@/components/Dialog/index'
export default { export default {

View File

@@ -30,7 +30,7 @@
</template> </template>
<script> <script>
import { getDrawerWidth } from '@/utils/common/index' import { getDrawerWidth } from '@/utils/common'
export default { export default {
props: { props: {

View File

@@ -5,7 +5,6 @@
ref="dataForm" ref="dataForm"
:fields="totalFields" :fields="totalFields"
:form="iForm" :form="iForm"
:server-errors="serverErrors"
v-bind="$attrs" v-bind="$attrs"
v-on="$listeners" v-on="$listeners"
> >
@@ -29,7 +28,6 @@
import DataForm from '../DataForm/index.vue' import DataForm from '../DataForm/index.vue'
import FormGroupHeader from '@/components/Form/FormGroupHeader/index.vue' import FormGroupHeader from '@/components/Form/FormGroupHeader/index.vue'
import { FormFieldGenerator } from '@/components/Form/AutoDataForm/utils' import { FormFieldGenerator } from '@/components/Form/AutoDataForm/utils'
import { UniqueCheck } from '@/components/Form/DataForm/rules'
export default { export default {
name: 'AutoDataForm', name: 'AutoDataForm',
@@ -67,8 +65,7 @@ export default {
totalFields: [], totalFields: [],
loading: true, loading: true,
groups: [], groups: [],
errors: {}, errors: {}
serverErrors: {}
} }
}, },
computed: { computed: {
@@ -97,7 +94,7 @@ export default {
}, },
methods: { methods: {
async optionUrlMetaAndGenerateColumns() { async optionUrlMetaAndGenerateColumns() {
let data = { actions: {} } let data = { actions: {}}
if (this.url) { if (this.url) {
data = await this.$store.dispatch('common/getUrlMeta', { url: this.url }) data = await this.$store.dispatch('common/getUrlMeta', { url: this.url })
} }
@@ -106,8 +103,6 @@ export default {
this.generateColumns() this.generateColumns()
this.$emit('afterGenerateColumns', this.totalFields) this.$emit('afterGenerateColumns', this.totalFields)
this.cleanFormValue() this.cleanFormValue()
// 初始化时清空错误
this.serverErrors = {}
this.loading = false this.loading = false
}, },
generateColumns() { generateColumns() {
@@ -115,47 +110,6 @@ export default {
this.totalFields = generator.generateFields(this.fields, this.fieldsMeta, this.remoteMeta) this.totalFields = generator.generateFields(this.fields, this.fieldsMeta, this.remoteMeta)
this.groups = generator.groups this.groups = generator.groups
this.$log.debug('Total fields: ', this.totalFields) 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) { _cleanFormValue(form, remoteMeta) {
if (!form) { if (!form) {
@@ -185,69 +139,15 @@ export default {
cleanFormValue() { cleanFormValue() {
this._cleanFormValue(this.iForm, this.remoteMeta) 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) { setFieldError(name, error) {
error = (error || '').toString().replace(/[。.]+$/, '') error = error.replace(/[。.]+$/, '')
const elForm = this._getElFormInstance() const field = this.totalFields.find((v) => v.prop === name)
if (elForm && Array.isArray(elForm.fields)) { if (!field) {
const item = elForm.fields.find(f => f.prop === name) return
if (item) {
item.validateMessage = error
item.validateState = error ? 'error' : ''
}
} }
// 不写入 totalFields避免触发 innerContent 变化导致表单值被覆盖 if (typeof error === 'string') {
this.$set(this.serverErrors, name, error) field.el.errors = error
}, field.attrs.error = 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' : ''
})
} }
}, },
groupHidden(group, i) { groupHidden(group, i) {

View File

@@ -4,7 +4,7 @@ import NestedField from '@/components/Form/AutoDataForm/components/NestedField.v
import rules from '@/components/Form/DataForm/rules' import rules from '@/components/Form/DataForm/rules'
import BasicTree from '@/components/Form/FormFields/BasicTree.vue' import BasicTree from '@/components/Form/FormFields/BasicTree.vue'
import JsonEditor from '@/components/Form/FormFields/JsonEditor.vue' import JsonEditor from '@/components/Form/FormFields/JsonEditor.vue'
import { assignIfNot, toSentenceCase } from '@/utils/common/index' import { assignIfNot, toSentenceCase } from '@/utils/common'
import TagInput from '@/components/Form/FormFields/TagInput.vue' import TagInput from '@/components/Form/FormFields/TagInput.vue'
import i18n from '@/i18n/i18n' import i18n from '@/i18n/i18n'
@@ -177,10 +177,7 @@ export class FormFieldGenerator {
const systemLang = document.cookie.django_language const systemLang = document.cookie.django_language
if (helpTextAsPlaceholder !== undefined) { if (helpTextAsPlaceholder !== undefined) {
helpTextAsPlaceholder = !!helpTextAsPlaceholder helpTextAsPlaceholder = !!helpTextAsPlaceholder
} else if ( } else if (placeholderType.indexOf(field.type) === -1 && placeholderComponent.indexOf(field.component) === -1) {
placeholderType.indexOf(field.type) === -1 &&
placeholderComponent.indexOf(field.component) === -1
) {
helpTextAsPlaceholder = false helpTextAsPlaceholder = false
} else if ((helpTextWordLength <= 5 || helpText.length <= 10) && systemLang === 'en') { } else if ((helpTextWordLength <= 5 || helpText.length <= 10) && systemLang === 'en') {
helpTextAsPlaceholder = true helpTextAsPlaceholder = true

View File

@@ -6,7 +6,6 @@
:prop="prop" :prop="prop"
:rules="_show && Array.isArray(data.rules) ? data.rules : []" :rules="_show && Array.isArray(data.rules) ? data.rules : []"
v-bind="data.attrs" v-bind="data.attrs"
:error="errorText"
> >
<template v-if="data.label" #label> <template v-if="data.label" #label>
<span :title="data.label"> <span :title="data.label">
@@ -20,8 +19,7 @@
placement="right" placement="right"
popper-class="help-tips" popper-class="help-tips"
> >
<div slot="content" v-sanitize="data.helpTip" class="help-tip-content" /> <div slot="content" v-sanitize="data.helpTip" class="help-tip-content" /> <!-- Noncompliant -->
<!-- Noncompliant -->
<i class="fa fa-question-circle-o help-tip-icon" /> <i class="fa fa-question-circle-o help-tip-icon" />
</el-tooltip> </el-tooltip>
</span> </span>
@@ -29,7 +27,11 @@
<template v-if="readonly && hasReadonlyContent"> <template v-if="readonly && hasReadonlyContent">
<div <div
v-if="data.type === 'input'" 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 }} {{ itemValue }}
</div> </div>
@@ -48,7 +50,11 @@
v-on="listeners" v-on="listeners"
> >
<template v-for="opt in options"> <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 <el-checkbox-button
v-else-if="data.type === 'checkbox-group' && data.style === 'button'" v-else-if="data.type === 'checkbox-group' && data.style === 'button'"
:key="opt.value" :key="opt.value"
@@ -105,10 +111,10 @@
<script> <script>
import getEnableWhenStatus from '../util/enable-when' import getEnableWhenStatus from '../util/enable-when'
import { noop } from '../util/utils' import { noop } from '../util/utils'
import _get from 'lodash/get' import _get from 'lodash.get'
import _includes from 'lodash/includes' import _includes from 'lodash.includes'
import _topairs from 'lodash/toPairs' import _topairs from 'lodash.topairs'
import _frompairs from 'lodash/fromPairs' import _frompairs from 'lodash.frompairs'
function validator(data) { function validator(data) {
if (!data) { if (!data) {
@@ -146,10 +152,6 @@ export default {
props: { props: {
// eslint-disable-next-line vue/require-default-prop // eslint-disable-next-line vue/require-default-prop
data: Object, data: Object,
serverErrors: {
type: Object,
default: () => ({})
},
prop: { prop: {
type: String, type: String,
default() { default() {
@@ -168,8 +170,7 @@ export default {
data() { data() {
return { return {
propsInner: {}, propsInner: {},
isBlurTrigger: isBlurTrigger: this.data.rules &&
this.data.rules &&
this.data.rules.some(rule => { this.data.rules.some(rule => {
return rule.required && rule.trigger === 'blur' return rule.required && rule.trigger === 'blur'
}) })
@@ -178,7 +179,7 @@ export default {
computed: { computed: {
// 解构运算符会处理 undefined 的情况 // 解构运算符会处理 undefined 的情况
componentProps: ({ data: { el }, propsInner }) => ({ ...el, ...propsInner }), 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), hiddenStatus: ({ data: { hidden = () => false }, data, value }) => hidden(value, data),
enableWhenStatus: ({ data: { enableWhen }, value }) => getEnableWhenStatus(enableWhen, value), enableWhenStatus: ({ data: { enableWhen }, value }) => getEnableWhenStatus(enableWhen, value),
// 是否显示 // 是否显示
@@ -188,11 +189,6 @@ export default {
classes() { classes() {
return 'el-form-item-' + this.data.prop + ' ' + (this.data.attrs?.class || '') 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() { listeners() {
const { const {
data: { data: {
@@ -208,7 +204,10 @@ export default {
} = this } = this
return { return {
..._frompairs( ..._frompairs(
_topairs(on).map(([eName, handler]) => [eName, (...args) => handler(args, updateForm)]) _topairs(on).map(([eName, handler]) => [
eName,
(...args) => handler(args, updateForm)
]),
), ),
// 手动更新表单数据 // 手动更新表单数据
input: (value, ...rest) => { input: (value, ...rest) => {
@@ -233,7 +232,9 @@ export default {
multipleValue: ({ data, itemValue, options = [] }) => { multipleValue: ({ data, itemValue, options = [] }) => {
const multipleSelectValue = const multipleSelectValue =
_get(data, 'el.multiple') && Array.isArray(itemValue) ? itemValue : [itemValue] _get(data, 'el.multiple') && Array.isArray(itemValue)
? itemValue
: [itemValue]
return multipleSelectValue return multipleSelectValue
.map(val => (options.find(op => op.value === val) || {}).label) .map(val => (options.find(op => op.value === val) || {}).label)
.join() .join()
@@ -253,7 +254,8 @@ export default {
if (v.url === oldV.url || v.request === oldV.request) return if (v.url === oldV.url || v.request === oldV.request) return
} }
const isOptionsCase = const isOptionsCase =
['select', 'checkbox-group', 'radio-group'].indexOf(this.data.type) > -1 ['select', 'checkbox-group', 'radio-group'].indexOf(this.data.type) >
-1
const { const {
url, url,
request = () => this.$axios.get(url).then(resp => resp.data), request = () => this.$axios.get(url).then(resp => resp.data),
@@ -321,7 +323,7 @@ export default {
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang='scss' scoped>
.help-tips { .help-tips {
opacity: 0.8; opacity: 0.8;
line-height: 2; line-height: 2;
@@ -330,7 +332,7 @@ export default {
.help-block { .help-block {
::v-deep .el-alert__icon { ::v-deep .el-alert__icon {
font-size: 16px; font-size: 16px
} }
&.checkbox { &.checkbox {

View File

@@ -1,18 +1,11 @@
<template> <template>
<el-form <el-form ref="elForm" :model="value" class="el-form-renderer" v-bind="$attrs">
ref="elForm"
:model="value"
class="el-form-renderer"
v-bind="$attrs"
@submit.native.prevent
>
<template v-for="item in innerContent"> <template v-for="item in innerContent">
<slot v-if="!isHidden(item)" :name="`id:${item.id}`" /> <slot v-if="!isHidden(item)" :name="`id:${item.id}`" />
<component <component
:is="item.type === GROUP ? 'render-form-group' : 'render-form-item'" :is="item.type === GROUP ? 'render-form-group' : 'render-form-item'"
:key="item.id" :key="item.id"
:data="item" :data="item"
:server-errors="serverErrors"
:disabled="disabled || item.disabled" :disabled="disabled || item.disabled"
:item-value="value[item.id]" :item-value="value[item.id]"
:options="options[item.id]" :options="options[item.id]"
@@ -26,19 +19,13 @@
</el-form> </el-form>
</template> </template>
<script> <script>
import _set from 'lodash/set' import _set from 'lodash.set'
import _isequal from 'lodash/isEqual' import _isequal from 'lodash.isequal'
import _clonedeep from 'lodash/cloneDeep' import _clonedeep from 'lodash.clonedeep'
import RenderFormGroup from './components/render-form-group.vue' import RenderFormGroup from './components/render-form-group.vue'
import RenderFormItem from './components/render-form-item.vue' import RenderFormItem from './components/render-form-item.vue'
import transformContent from './util/transform-content' import transformContent from './util/transform-content'
import { import { collect, correctValue, mergeValue, transformInputValue, transformOutputValue } from './util/utils'
collect,
correctValue,
mergeValue,
transformInputValue,
transformOutputValue
} from './util/utils'
const GROUP = 'group' const GROUP = 'group'
@@ -60,10 +47,6 @@ export default {
type: Array, type: Array,
required: true required: true
}, },
serverErrors: {
type: Object,
default: () => ({})
},
disabled: { disabled: {
type: Boolean, type: Boolean,
default: false default: false

View File

@@ -1,5 +1,5 @@
import _get from 'lodash/get' import _get from 'lodash.get'
import _has from 'lodash/has' import _has from 'lodash.has'
/** /**
* 处理 enableWhen * 处理 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)
} }

View File

@@ -1,5 +1,5 @@
/* eslint-disable no-sequences */ /* eslint-disable no-sequences */
import _ from 'lodash' import _kebabcase from 'lodash.kebabcase'
/** /**
* content 的每一项会浅拷贝一层 * content 的每一项会浅拷贝一层
* 只可以在 item 层新增修改属性,如 item.a = b * 只可以在 item 层新增修改属性,如 item.a = b
@@ -13,7 +13,7 @@ export default function transformContent(content) {
removeDollarInKey(item) removeDollarInKey(item)
extractRulesFromComponent(item) extractRulesFromComponent(item)
// 有些旧写法是 checkboxGroup & radioGroup // 有些旧写法是 checkboxGroup & radioGroup
item.type = _.kebabCase(item.type) item.type = _kebabcase(item.type)
} }
return item return item
@@ -34,5 +34,8 @@ export function extractRulesFromComponent(item) {
if (!component || typeof component === 'string') return if (!component || typeof component === 'string') return
const { rules = [] } = component const { rules = [] } = component
item.rules = [...(item.rules || []), ...(typeof rules === 'function' ? rules(item) : rules)] item.rules = [
...(item.rules || []),
...(typeof rules === 'function' ? rules(item) : rules)
]
} }

View File

@@ -1,5 +1,5 @@
import _frompairs from 'lodash/fromPairs' import _frompairs from 'lodash.frompairs'
import _isplainobject from 'lodash/isPlainObject' import _isplainobject from 'lodash.isplainobject'
export function noop() {} export function noop() {}
@@ -12,9 +12,11 @@ export function collect(content, key) {
value: item.type === 'group' ? collect(item.items, key) : item[key] value: item.type === 'group' ? collect(item.items, key) : item[key]
})) }))
.filter( .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]),
) )
} }

View File

@@ -8,10 +8,8 @@
:form="basicForm" :form="basicForm"
:label-position="iLabelPosition" :label-position="iLabelPosition"
class="form-fields" class="form-fields"
:label-width="labelWidth" label-width="25%"
:style="{ '--label-width': labelWidth }"
v-bind="$attrs" v-bind="$attrs"
:server-errors="serverErrors"
v-on="$listeners" v-on="$listeners"
> >
<!-- slot 透传 --> <!-- slot 透传 -->
@@ -56,7 +54,7 @@
<el-button <el-button
v-for="button in moreButtons" v-for="button in moreButtons"
v-show="!iHidden(button)" v-show="!button.hidden"
:key="button.title" :key="button.title"
:loading="button.loading" :loading="button.loading"
size="small" size="small"
@@ -72,20 +70,8 @@
<script> <script>
import ElFormRender from './components/el-form-renderer' import ElFormRender from './components/el-form-renderer'
import { randomString } from '@/utils/common/index' import { randomString } from '@/utils/string'
import { scrollToError } from '@/utils'
const scrollToError = (
el,
scrollOption = {
behavior: 'smooth',
block: 'center'
}
) => {
setTimeout(() => {
const isError = el.getElementsByClassName('is-error')
isError[0].scrollIntoView(scrollOption)
}, 0)
}
export default { export default {
components: { components: {
@@ -122,10 +108,6 @@ export default {
type: Boolean, type: Boolean,
default: true default: true
}, },
serverErrors: {
type: Object,
default: () => ({})
},
fields: { fields: {
type: Array, type: Array,
default: () => [] default: () => []
@@ -146,10 +128,6 @@ export default {
labelPosition: { labelPosition: {
type: String, type: String,
default: '' default: ''
},
labelWidth: {
type: String,
default: '25%'
} }
}, },
data() { data() {
@@ -231,9 +209,6 @@ export default {
}, },
getFormValue() { getFormValue() {
return this.$refs.form.getFormValue() return this.$refs.form.getFormValue()
},
iHidden(item) {
return typeof item.hidden === 'function' ? item.hidden() : item.hidden
} }
} }
} }
@@ -244,10 +219,6 @@ export default {
margin-right: 80px; margin-right: 80px;
margin-bottom: 20px; margin-bottom: 20px;
.el-form {
margin-right: 0;
}
::v-deep .el-input-group__prepend { ::v-deep .el-input-group__prepend {
border-radius: 0; border-radius: 0;
} }
@@ -292,7 +263,7 @@ export default {
} }
.el-form-item__content { .el-form-item__content {
width: calc(100% - var(--label-width)); width: 75%;
line-height: 32px; line-height: 32px;
// 禁用的输入框 // 禁用的输入框
@@ -366,7 +337,7 @@ export default {
::v-deep .form-buttons { ::v-deep .form-buttons {
margin-top: 30px; margin-top: 30px;
margin-left: var(--label-width); margin-left: 25%;
} }
} }

View File

@@ -1,5 +1,4 @@
import i18n from '@/i18n/i18n' import i18n from '@/i18n/i18n'
import request from '@/utils/request'
export const Required = { export const Required = {
required: true, message: i18n.t('FieldRequiredError'), trigger: 'blur' required: true, message: i18n.t('FieldRequiredError'), trigger: 'blur'
@@ -119,69 +118,3 @@ export default {
matchAlphanumericUnderscore, matchAlphanumericUnderscore,
MatchExcludeParenthesis 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']
}
}

View File

@@ -14,7 +14,6 @@
<el-button <el-button
:type="item.el && item.el.type" :type="item.el && item.el.type"
class="start-stop-btn" class="start-stop-btn"
:disabled="item.disabled"
size="mini" size="mini"
@click="item.callback()" @click="item.callback()"
> >

View File

@@ -13,7 +13,7 @@
<script> <script>
import parser from 'cron-parser' import parser from 'cron-parser'
import { toSafeLocalDateStr } from '@/utils/common/time' import { toSafeLocalDateStr } from '@/utils/time'
export default { export default {
name: 'CrontabResult', name: 'CrontabResult',

View File

@@ -10,7 +10,7 @@
<script> <script>
import BaseFormatter from '@/components/Table/TableFormatters/base.vue' import BaseFormatter from '@/components/Table/TableFormatters/base.vue'
import { setUrlParam } from '@/utils/common/index' import { setUrlParam } from '@/utils/common'
export default { export default {
name: 'ValueFormatter', name: 'ValueFormatter',

View File

@@ -42,9 +42,9 @@ import DataTable from '@/components/Table/DataTable/index.vue'
import ValueFormatter from './ValueFormatter.vue' import ValueFormatter from './ValueFormatter.vue'
import AttrFormDialog from './AttrFormDialog.vue' import AttrFormDialog from './AttrFormDialog.vue'
import AttrMatchResultDialog from './AttrMatchResultDialog.vue' import AttrMatchResultDialog from './AttrMatchResultDialog.vue'
import { setUrlParam } from '@/utils/common/index' import { setUrlParam } from '@/utils/common'
import { attrMatchOptions } from '@/components/const' import { attrMatchOptions } from '@/components/const'
import { toM2MJsonParams } from '@/utils/jms/index' import { toM2MJsonParams } from '@/utils/jms'
export default { export default {
name: 'JSONManyToManySelect', name: 'JSONManyToManySelect',
@@ -109,7 +109,7 @@ export default {
columns: [ columns: [
{ prop: 'name', label: this.$t('AttrName'), formatter: tableFormatter('name') }, { prop: 'name', label: this.$t('AttrName'), formatter: tableFormatter('name') },
{ prop: 'match', label: this.$t('Match'), formatter: tableFormatter('match') }, { prop: 'match', label: this.$t('Match'), formatter: tableFormatter('match') },
{ prop: 'value', label: this.$t('AttrValue'), formatter: ValueFormatter, formatterArgs: { attrs: this.attrs } }, { prop: 'value', label: this.$t('AttrValue'), formatter: ValueFormatter, formatterArgs: { attrs: this.attrs }},
{ {
prop: 'action', prop: 'action',
label: this.$t('Action'), label: this.$t('Action'),

View File

@@ -2,7 +2,7 @@
<div class="json-editor"> <div class="json-editor">
<JsonEditor <JsonEditor
v-model="resultInfo" v-model="resultInfo"
:class="{ resize: resize === 'vertical' }" :class="{resize: resize === 'vertical'}"
:mode="'code'" :mode="'code'"
:show-btns="false" :show-btns="false"
@json-change="onJsonChange" @json-change="onJsonChange"
@@ -24,7 +24,7 @@ export default {
}, },
resize: { resize: {
type: String, type: String,
validator: value => { validator: (value) => {
return ['none', 'vertical'].indexOf(value) !== -1 return ['none', 'vertical'].indexOf(value) !== -1
}, },
default: 'vertical' default: 'vertical'
@@ -52,7 +52,7 @@ export default {
this.$emit('change', this.resultInfo) this.$emit('change', this.resultInfo)
}, 500) }, 500)
}, },
onError: _.debounce(function (value) { onError: _.debounce(function(value) {
this.$message.error(this.$tc('FormatError')) this.$message.error(this.$tc('FormatError'))
}, 1500) }, 1500)
} }
@@ -60,38 +60,35 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import '~@/styles/variables'; @import "~@/styles/variables";
.json-editor {
.resize {
& ::v-deep .jsoneditor {
resize: vertical;
cursor: s-resize;
}
}
.json-editor {
.resize {
& ::v-deep .jsoneditor { & ::v-deep .jsoneditor {
resize: vertical; border: 1px solid #e5e6e7;
cursor: s-resize; }
& ::v-deep .jsoneditor-compact {
display: none;
}
& ::v-deep .jsoneditor-modes {
display: none;
}
& ::v-deep .jsoneditor-poweredBy {
display: none;
}
& ::v-deep .jsoneditor-menu {
background: var(--color-primary);
border-bottom: 1px solid var(--color-primary);
} }
} }
& ::v-deep .jsoneditor {
border: 1px solid #e5e6e7;
border-left: unset;
border-top: unset;
border-radius: 2px;
}
& ::v-deep .jsoneditor-compact {
display: none;
}
& ::v-deep .jsoneditor-modes {
display: none;
}
& ::v-deep .jsoneditor-poweredBy {
display: none;
}
& ::v-deep .jsoneditor-menu {
background: var(--color-primary);
border-bottom: 1px solid var(--color-primary);
}
}
</style> </style>

View File

@@ -19,7 +19,7 @@ export default {
props: { props: {
value: { value: {
type: [Array, String, Number, Boolean, Object], type: [Array, String, Number, Boolean, Object],
default: () => [] default: () => ([])
}, },
multiple: { multiple: {
type: Boolean, type: Boolean,
@@ -36,7 +36,7 @@ export default {
}, },
computed: { computed: {
attrsWithoutValue() { attrsWithoutValue() {
const attrs = Object.assign({ clearable: this.clearable }, this.$attrs) const attrs = Object.assign({}, this.$attrs)
delete attrs.value delete attrs.value
return attrs return attrs
}, },
@@ -50,13 +50,6 @@ export default {
const value = this.objectsToValues(this.value) const value = this.objectsToValues(this.value)
return value return value
} }
},
clearable() {
if (this.$attrs.clearable === undefined) {
return this.multiple
} else {
return this.$attrs.clearable
}
} }
}, },
methods: { methods: {
@@ -78,11 +71,8 @@ export default {
value = value.map(v => { value = value.map(v => {
// uuid v4 // 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 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' return typeof v === 'object' ? v
? v : this.$attrs?.allowCreate && !uuid.test(v) ? { [this.customLabelKeyName]: v } : { pk: v }
: this.$attrs?.allowCreate && !uuid.test(v)
? { [this.customLabelKeyName]: v }
: { pk: v }
}) })
if (!this.multiple) { if (!this.multiple) {
value = value[0] value = value[0]
@@ -97,13 +87,9 @@ export default {
if (!Array.isArray(val)) { if (!Array.isArray(val)) {
val = [val] val = [val]
} }
val = val.map(v => { val = val.map((v) => {
if (v && typeof v === 'object') { if (v && typeof v === 'object') {
return ( return v.pk || v.id || (this.$attrs?.allowCreate ? (v?.[this.customLabelKeyName] + ':' + v?.value) : '')
v.pk ||
v.id ||
(this.$attrs?.allowCreate ? v?.[this.customLabelKeyName] + ':' + v?.value : '')
)
} else { } else {
return v return v
} }
@@ -117,4 +103,6 @@ export default {
} }
</script> </script>
<style scoped></style> <style scoped>
</style>

View File

@@ -46,7 +46,7 @@ export default {
} }
}, },
mounted() { mounted() {
const defaults = { code: this.getDefaultCode(), phone: '' } const defaults = { code: localStorage.getItem('prePhoneCode') || '+86', phone: '' }
this.rawValue = this.value || defaults this.rawValue = this.value || defaults
this.$axios.get('/api/v1/common/countries/').then(res => { this.$axios.get('/api/v1/common/countries/').then(res => {
this.countries = res.map(item => { this.countries = res.map(item => {
@@ -56,22 +56,6 @@ export default {
this.$emit('input', this.fullPhone) this.$emit('input', this.fullPhone)
}, },
methods: { methods: {
getDefaultCode() {
const mapper = {
'zh': '+86',
'en': '+1',
'ja': '+81',
'ko': '+82',
'fr': '+33',
'de': '+49',
'es': '+34',
'it': '+39',
'ru': '+7',
'ar': '+966'
}
const locale = this.$i18n.locale.split('-')[0]
return localStorage.getItem('prePhoneCode') || mapper[locale] || '+86'
},
onChange(countryCode) { onChange(countryCode) {
this.rawValue.code = countryCode this.rawValue.code = countryCode
this.onInputChange() this.onInputChange()

View File

@@ -12,7 +12,7 @@
width="800px" width="800px"
v-on="$listeners" v-on="$listeners"
> >
<el-alert v-if="disabled && platformDetail" style="margin-bottom: 10px" type="info"> <el-alert v-if="disabled && platformDetail" style="margin-bottom: 10px" type="success">
{{ $t('InheritPlatformConfig') }} {{ $t('InheritPlatformConfig') }}
<el-link :href="platformDetail" class="link-more" target="_blank"> <el-link :href="platformDetail" class="link-more" target="_blank">
{{ $t('View') }} {{ $t('View') }}
@@ -62,7 +62,9 @@ export default {
hasButtons: !this.disabled, hasButtons: !this.disabled,
url: '/api/v1/assets/protocol-settings/?name=' + this.protocol.name, url: '/api/v1/assets/protocol-settings/?name=' + this.protocol.name,
fields: [ fields: [
[vm.$t('Basic'), ['primary', 'required', 'default', 'public']], [vm.$t('Basic'), [
'primary', 'required', 'default', 'public'
]],
[vm.$t('Advanced'), ['setting']] [vm.$t('Advanced'), ['setting']]
], ],
fieldsMeta: { fieldsMeta: {
@@ -70,23 +72,23 @@ export default {
fields: '__all__', fields: '__all__',
fieldsMeta: { fieldsMeta: {
username_selector: { username_selector: {
hidden: formValue => formValue['autofill'] !== 'basic' hidden: (formValue) => formValue['autofill'] !== 'basic'
}, },
password_selector: { password_selector: {
hidden: formValue => formValue['autofill'] !== 'basic' hidden: (formValue) => formValue['autofill'] !== 'basic'
}, },
submit_selector: { submit_selector: {
hidden: formValue => formValue['autofill'] !== 'basic' hidden: (formValue) => formValue['autofill'] !== 'basic'
}, },
script: { script: {
component: JsonEditor, component: JsonEditor,
hidden: formValue => formValue['autofill'] !== 'script' hidden: (formValue) => formValue['autofill'] !== 'script'
} }
} }
}, },
public: { public: {
disabled: this.protocol.name === 'winrm', disabled: this.protocol.name === 'winrm',
hidden: formValue => { hidden: (formValue) => {
if (this.protocol.name === 'winrm') { if (this.protocol.name === 'winrm') {
formValue['public'] = false formValue['public'] = false
} }

View File

@@ -33,9 +33,6 @@
> >
<i :class="[isCheckShowPassword ? 'fa-eye-slash' : 'fa-eye']" class="fa" /> <i :class="[isCheckShowPassword ? 'fa-eye-slash' : 'fa-eye']" class="fa" />
</span> </span>
<span v-if="filterTags.length > 0" class="clear-icon" @click="handleClearAll">
<i class="el-icon-circle-close" :title="$t('Clear')" />
</span>
</div> </div>
</template> </template>
@@ -103,7 +100,7 @@ export default {
methods: { methods: {
handleTagClose(tag) { handleTagClose(tag) {
this.filterTags.splice(this.filterTags.indexOf(tag), 1) this.filterTags.splice(this.filterTags.indexOf(tag), 1)
this.$emit('change', this.filterTags) this.handleConfirm()
}, },
handleSelect(item) { handleSelect(item) {
this.filterValue = item.value this.filterValue = item.value
@@ -143,11 +140,6 @@ export default {
}, },
handleShowPassword() { handleShowPassword() {
this.isCheckShowPassword = !this.isCheckShowPassword 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; line-height: 30px;
&:hover { &:hover {
border-color: #c0c4cc; border-color: #C0C4CC;
} }
& ::v-deep .el-tag { & ::v-deep .el-tag {
margin-bottom: 2px; margin-bottom: 1px;
margin-top: 2px;
font-family: sans-serif !important; font-family: sans-serif !important;
margin-left: 5px; margin-left: 5px;
} }
@@ -186,7 +177,6 @@ export default {
.search-input { .search-input {
flex: 1; flex: 1;
min-width: 150px;
& ::v-deep .el-input__inner { & ::v-deep .el-input__inner {
max-width: 100%; max-width: 100%;
@@ -214,15 +204,4 @@ export default {
color: #999999; color: #999999;
} }
} }
.clear-icon {
display: inherit;
padding-right: 6px;
cursor: pointer;
color: #c0c4cc;
&:hover {
color: #606164;
}
}
</style> </style>

View File

@@ -68,7 +68,7 @@ export default {
return { label: item.name, value: item.id } return { label: item.name, value: item.id }
}) })
const url = vm.url || vm.ajax.url const url = vm.url || vm.ajax.url
const getPageData = async ({ pageIndex, pageSize, keyword }) => { const getPageData = async({ pageIndex, pageSize, keyword }) => {
const limit = pageSize const limit = pageSize
const offset = (pageIndex - 1) * pageSize const offset = (pageIndex - 1) * pageSize
const params = { const params = {

View File

@@ -24,7 +24,7 @@
<script> <script>
import Select2 from './Select2.vue' import Select2 from './Select2.vue'
import { hasUUID } from '@/utils/common/index' import { hasUUID } from '@/utils/common'
export default { export default {
components: { components: {

View File

@@ -20,7 +20,7 @@
</template> </template>
<script> <script>
import { randomString } from '@/utils/common/index' import { randomString } from '@/utils/string'
export default { export default {
props: { props: {

View File

@@ -1,53 +0,0 @@
<template>
<div>
<el-checkbox v-model="iValue">
{{ $t('ReadAgreeTo') }}
<a href="/core/auth/agreement/" target="_blank" style="color: #409eff">
{{ $t('TermsOfService') }}
</a>
{{ $t('and') }}
<a href="/core/auth/privacy/" target="_blank" style="color: #409eff">
{{ $t('PrivacyPolicy') }}
</a>
</el-checkbox>
</div>
</template>
<script>
export default {
props: {
value: {
type: Boolean,
default: () => false
}
},
data() {
return {
iValue: false
}
},
watch: {
iValue: {
handler(v) {
this.$emit('input', v)
}
}
},
created() {
this.iValue = this.value
},
computed: {
iValue: {
get() {
return this.value
},
set(v) {
this.$emit('update:value', v)
}
}
},
methods: {}
}
</script>
<style lang="scss" scoped></style>

View File

@@ -1,71 +1,76 @@
<template> <template>
<div class="krry-main"> <div class="krry-main">
<krry-box <el-row :gutter="10">
ref="noSelect" <el-col :md="11" :sm="24">
:async="async" <krry-box
:async-search-flag="asyncSearchFlag" ref="noSelect"
:data-show-list="notSelectDataList" :async="async"
:filter-placeholder="filterPlaceholder[0] || $tc('Search')" :async-search-flag="asyncSearchFlag"
:filterable="filterable" :data-show-list="notSelectDataList"
:highlight-color="highlightColor" :filter-placeholder="filterPlaceholder[0] || $tc('Search')"
:is-highlight="isHighlight" :filterable="filterable"
:is-last-page="isLastPage" :highlight-color="highlightColor"
:operate-id="0" :is-highlight="isHighlight"
:page-size="pageSize" :is-last-page="isLastPage"
:page-texts="pageTexts" :operate-id="0"
:show-clear-btn="showClearBtn" :page-size="pageSize"
:title="boxTitle[0] || $tc('Selection')" :page-texts="pageTexts"
@check-district="noCheckSelect" :show-clear-btn="showClearBtn"
@search-word="searchWord" :title="boxTitle[0] || $tc('Selection')"
@check-disable="checkDisable" @check-district="noCheckSelect"
@get-data="getData" @search-word="searchWord"
@get-data-by-keyword="getDataByKeyword" @check-disable="checkDisable"
@clear-input="clearQueryInp('left')" @get-data="getData"
/> @get-data-by-keyword="getDataByKeyword"
@clear-input="clearQueryInp('left')"
<div class="opera">
<svg-icon v-if="transferOnCheck" class="arrow" icon-class="arrow" />
<template v-else>
<el-button
:disabled="disablePre"
class="el-transfer__button"
icon="el-icon-arrow-left"
size="mini"
@click="deleteData"
/> />
<el-button </el-col>
:disabled="disableNex" <el-col :md="2" :sm="24" class="buttons">
class="el-transfer__button" <div class="opera">
icon="el-icon-arrow-right" <svg-icon v-if="transferOnCheck" class="arrow" icon-class="arrow" />
size="mini" <template v-else>
type="primary" <el-button
@click="addData" :disabled="disablePre"
class="el-transfer__button"
icon="el-icon-arrow-left"
size="mini"
@click="deleteData"
/>
<el-button
:disabled="disableNex"
class="el-transfer__button"
icon="el-icon-arrow-right"
size="mini"
type="primary"
@click="addData"
/>
</template>
</div>
</el-col>
<el-col :md="11" :sm="24">
<krry-box
ref="hasSelect"
:data-show-list="checkedData"
:filter-placeholder="filterPlaceholder[1] || $tc('Search')"
:filterable="filterable"
:highlight-color="highlightColor"
:is-highlight="isHighlight"
:operate-id="1"
:page-size="pageSize"
:page-texts="pageTexts"
:show-clear-btn="showClearBtn"
:title="boxTitle[1] || $tc('Selected')"
@check-district="hasCheckSelect"
@search-word="searchWord"
@check-disable="checkDisable"
@clear-input="clearQueryInp('right')"
/> />
</template> </el-col>
</div> </el-row>
<krry-box
ref="hasSelect"
:data-show-list="checkedData"
:filter-placeholder="filterPlaceholder[1] || $tc('Search')"
:filterable="filterable"
:highlight-color="highlightColor"
:is-highlight="isHighlight"
:operate-id="1"
:page-size="pageSize"
:page-texts="pageTexts"
:show-clear-btn="showClearBtn"
:title="boxTitle[1] || $tc('Selected')"
@check-district="hasCheckSelect"
@search-word="searchWord"
@check-disable="checkDisable"
@clear-input="clearQueryInp('right')"
/>
</div> </div>
</template> </template>
<script> <script>
/* eslint-disable */
import krryBox from './models/box' import krryBox from './models/box'
export default { export default {
@@ -207,14 +212,20 @@ export default {
// this.checkedData 为空 且 从来没有将已选区置为空,则从 selectedData 获取 // this.checkedData 为空 且 从来没有将已选区置为空,则从 selectedData 获取
if ((!this.checkedData.length && !this.manualEmpty) || selectedChange) { if ((!this.checkedData.length && !this.manualEmpty) || selectedChange) {
this.checkedData = JSON.parse(JSON.stringify(this.selectedData)) this.checkedData = JSON.parse(JSON.stringify(this.selectedData))
const keywords = this.$refs.hasSelect ? this.$refs.hasSelect.searchWord : '' const keywords = this.$refs.hasSelect
? this.$refs.hasSelect.searchWord
: ''
keywords && this.searchWord(keywords, 1) keywords && this.searchWord(keywords, 1)
} }
if (!this.async) { if (!this.async) {
this.selectListCheck = JSON.parse(JSON.stringify(this.checkedData)) this.selectListCheck = JSON.parse(JSON.stringify(this.checkedData))
const checkDataId = this.selectListCheck.map(ele => ele.id) const checkDataId = this.selectListCheck.map(ele => ele.id)
this.notSelectDataList = this.originList.filter(ele => !checkDataId.includes(ele.id)) this.notSelectDataList = this.originList.filter(
this.dataListNoCheck = JSON.parse(JSON.stringify(this.notSelectDataList)) ele => !checkDataId.includes(ele.id)
)
this.dataListNoCheck = JSON.parse(
JSON.stringify(this.notSelectDataList)
)
} else { } else {
if (selectedChange) { if (selectedChange) {
this.selectListCheck = JSON.parse(JSON.stringify(this.checkedData)) this.selectListCheck = JSON.parse(JSON.stringify(this.checkedData))
@@ -225,7 +236,9 @@ export default {
!checkDataId.includes(ele.id) && !checkDataId.includes(ele.id) &&
(ele.label.includes(this.noSelectKeyword) || this.asyncSearchFlag) (ele.label.includes(this.noSelectKeyword) || this.asyncSearchFlag)
) )
this.dataListNoCheck = this.originList.filter(ele => !checkDataId.includes(ele.id)) this.dataListNoCheck = this.originList.filter(
ele => !checkDataId.includes(ele.id)
)
} }
}, },
searchWord(keyword, titleId) { searchWord(keyword, titleId) {
@@ -234,11 +247,15 @@ export default {
if (titleId === 0) { if (titleId === 0) {
this.noSelectKeyword = keyword this.noSelectKeyword = keyword
if (!this.asyncSearchFlag) { if (!this.asyncSearchFlag) {
this.notSelectDataList = this.dataListNoCheck.filter(val => val.label.includes(keyword)) this.notSelectDataList = this.dataListNoCheck.filter(val =>
val.label.includes(keyword)
)
} }
} else { } else {
this.haSelectKeyword = keyword this.haSelectKeyword = keyword
this.checkedData = this.selectListCheck.filter(val => val.label.includes(keyword)) this.checkedData = this.selectListCheck.filter(val =>
val.label.includes(keyword)
)
} }
const refsName = titleId === 0 ? 'noSelect' : 'hasSelect' const refsName = titleId === 0 ? 'noSelect' : 'hasSelect'
// 延迟执行 // 延迟执行
@@ -277,21 +294,29 @@ export default {
!noCheckDataId.includes(ele.id) && !noCheckDataId.includes(ele.id) &&
(ele.label.includes(this.noSelectKeyword) || this.asyncSearchFlag) (ele.label.includes(this.noSelectKeyword) || this.asyncSearchFlag)
) )
this.dataListNoCheck = this.dataListNoCheck.filter(ele => !noCheckDataId.includes(ele.id)) this.dataListNoCheck = this.dataListNoCheck.filter(
ele => !noCheckDataId.includes(ele.id)
)
// 已选区数据增加 // 已选区数据增加
if (!this.async && this.sort) { if (!this.async && this.sort) {
// 排序,从固定不变的所有数据中过滤,顺序就不会乱。但若数据量大就会比较卡 // 排序,从固定不变的所有数据中过滤,顺序就不会乱。但若数据量大就会比较卡
// 异步分页不支持排序 // 异步分页不支持排序
const dataListNoCheckId = this.dataListNoCheck.map(ele => ele.id) const dataListNoCheckId = this.dataListNoCheck.map(ele => ele.id)
this.checkedData = this.originList.filter( this.checkedData = this.originList.filter(
ele => !dataListNoCheckId.includes(ele.id) && ele.label.includes(this.haSelectKeyword) ele =>
!dataListNoCheckId.includes(ele.id) &&
ele.label.includes(this.haSelectKeyword)
)
this.selectListCheck = this.originList.filter(
ele => !dataListNoCheckId.includes(ele.id)
) )
this.selectListCheck = this.originList.filter(ele => !dataListNoCheckId.includes(ele.id))
} else { } else {
// 这种效率更高的方法,但不能排序 // 这种效率更高的方法,但不能排序
this.checkedData.push(...this.noCheckData) this.checkedData.push(...this.noCheckData)
this.selectListCheck.push(...this.noCheckData) this.selectListCheck.push(...this.noCheckData)
this.checkedData = this.checkedData.filter(ele => ele.label.includes(this.haSelectKeyword)) this.checkedData = this.checkedData.filter(ele =>
ele.label.includes(this.haSelectKeyword)
)
} }
}, },
// 从已选中删除 // 从已选中删除
@@ -299,9 +324,13 @@ export default {
// 已选区数据过滤 // 已选区数据过滤
const hasCheckDataId = this.hasCheckData.map(ele => ele.id) const hasCheckDataId = this.hasCheckData.map(ele => ele.id)
this.checkedData = this.checkedData.filter( this.checkedData = this.checkedData.filter(
ele => !hasCheckDataId.includes(ele.id) && ele.label.includes(this.haSelectKeyword) ele =>
!hasCheckDataId.includes(ele.id) &&
ele.label.includes(this.haSelectKeyword)
)
this.selectListCheck = this.selectListCheck.filter(
ele => !hasCheckDataId.includes(ele.id)
) )
this.selectListCheck = this.selectListCheck.filter(ele => !hasCheckDataId.includes(ele.id))
this.manualEmpty = !this.checkedData.length this.manualEmpty = !this.checkedData.length
@@ -314,7 +343,9 @@ export default {
!selectListCheckId.includes(ele.id) && !selectListCheckId.includes(ele.id) &&
(ele.label.includes(this.noSelectKeyword) || this.asyncSearchFlag) (ele.label.includes(this.noSelectKeyword) || this.asyncSearchFlag)
) )
this.dataListNoCheck = this.originList.filter(ele => !selectListCheckId.includes(ele.id)) this.dataListNoCheck = this.originList.filter(
ele => !selectListCheckId.includes(ele.id)
)
}, },
// 提供获取已选数据的钩子 // 提供获取已选数据的钩子
getSelectedData() { getSelectedData() {
@@ -339,7 +370,11 @@ export default {
this.$nextTick(() => { this.$nextTick(() => {
this.$refs.noSelect.asyncSearch = true this.$refs.noSelect.asyncSearch = true
}) })
const resData = await this.getSearchData(keyword, pageIndex, this.pageSize) const resData = await this.getSearchData(
keyword,
pageIndex,
this.pageSize
)
if (Array.isArray(resData) && resData.length) { if (Array.isArray(resData) && resData.length) {
this.asyncDataList = resData this.asyncDataList = resData
this.notSelectDataList = resData this.notSelectDataList = resData
@@ -381,34 +416,45 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.krry-main { .krry-main {
display: flex;
align-items: center;
justify-content: space-around;
min-width: 600px; min-width: 600px;
}
.opera { .inner-center {
position: relative; margin: 0 5px;
display: flex; }
justify-content: center;
align-items: center;
height: 415px;
.arrow { .buttons {
width: 1.25em; vertical-align: middle;
height: 1.25em; }
color: #888888;
}
.el-button.is-circle { .opera {
border-radius: 50%; position: relative;
padding: 12px; display: flex;
display: block; justify-content: center;
margin: 25px auto; align-items: center;
} height: 415px;
.el-transfer__button { .arrow {
padding: 5px; width: 1.25em;
} height: 1.25em;
color: #888888;
}
@media screen and (max-width: 992px) {
margin: 8px 8px;
text-align: start
}
.el-button.is-circle {
border-radius: 50%;
padding: 12px;
display: block;
margin: 25px auto;
}
.el-transfer__button {
padding: 5px;
} }
} }
</style> </style>

View File

@@ -23,7 +23,7 @@
<script type="text/jsx"> <script type="text/jsx">
import Sortable from 'sortablejs' import Sortable from 'sortablejs'
import DataTable from '@/components/Table/DataTable/index.vue' import DataTable from '@/components/Table/DataTable/index.vue'
import { newURL, ObjectLocalStorage, replaceAllUUID } from '@/utils/common/index' import { newURL, ObjectLocalStorage, replaceAllUUID } from '@/utils/common'
import ColumnSettingPopover from './components/ColumnSettingPopover.vue' import ColumnSettingPopover from './components/ColumnSettingPopover.vue'
import { TableColumnsGenerator } from './utils' import { TableColumnsGenerator } from './utils'
@@ -60,24 +60,25 @@ export default {
}, },
isDeactivated: false, isDeactivated: false,
tableColumnsStorage: this.getTableColumnsStorage(), tableColumnsStorage: this.getTableColumnsStorage(),
sortable: null, sortable: null
inited: false
} }
}, },
watch: { watch: {
config: { config: {
immediate: false,
handler: _.debounce(function(iNew, iOld) { handler: _.debounce(function(iNew, iOld) {
if (this.isDeactivated || !this.inited) { if (this.isDeactivated) {
return return
} }
const changed = this.isConfigChanged(iNew, iOld) try {
if (!changed) { if (JSON.stringify(iNew) === JSON.stringify(iOld)) {
return return
}
} catch (error) {
this.$log.error('JsonStringify Error: ', error)
} }
this.optionUrlMetaAndGenCols() this.optionUrlMetaAndGenCols()
this.$log.debug('AutoDataTable Config change found') this.$log.debug('AutoDataTable Config change found, ', this.isDeactivated)
}, 200) }, 200)
} }
}, },
@@ -92,35 +93,6 @@ export default {
this.isDeactivated = false this.isDeactivated = false
}, },
methods: { methods: {
isConfigChanged(iNew, iOld) {
const _iNew = _.cloneDeep(iNew)
const _iOld = _.cloneDeep(iOld)
delete _iNew.columns
delete _iOld.columns
const oldMeta = _iNew.columnsMeta
const newMeta = _iOld.columnsMeta
const metas = [oldMeta, newMeta]
for (const meta of metas) {
if (!meta) {
continue
}
for (const [key, value] of Object.entries(meta)) {
if (!key || !value || typeof value !== 'object') {
continue
}
delete value['formatter']
}
}
try {
if (JSON.stringify(_iNew) === JSON.stringify(_iOld)) {
return false
}
} catch (error) {
this.$log.error('JsonStringify Error: ', error)
}
return true
},
setColumnDraggable() { setColumnDraggable() {
const el = this.$el.querySelector('.el-table__header-wrapper thead tr') const el = this.$el.querySelector('.el-table__header-wrapper thead tr')
if (!el) { if (!el) {
@@ -266,7 +238,6 @@ export default {
if (this.$refs.dataTable) { if (this.$refs.dataTable) {
this.$refs.dataTable.getList() this.$refs.dataTable.getList()
} }
this.inited = true
}) })
}, },
orderingColumns(columns) { orderingColumns(columns) {

View File

@@ -1,4 +1,4 @@
import { toSentenceCase } from '@/utils/common/index' import { toSentenceCase } from '@/utils/common'
import i18n from '@/i18n/i18n' import i18n from '@/i18n/i18n'
import { import {
@@ -225,15 +225,11 @@ export class TableColumnsGenerator {
padding = '6px' padding = '6px'
value = '-' value = '-'
} }
return h( return h('span', {
'span', 'style': {
{ marginLeft: padding
style: { }
marginLeft: padding }, [value])
}
},
[value]
)
} }
} }
return col return col
@@ -285,11 +281,10 @@ export class TableColumnsGenerator {
} }
return ( return (
<span> <span>{column.label}
{column.label}
<el-tooltip {...binds}> <el-tooltip {...binds}>
<div slot='content' v-sanitize={helpTip} /> <div slot='content' v-sanitize={helpTip}/>
<i class='fa fa-question-circle-o help-tip-icon' style='padding-left: 2px' /> <i class='fa fa-question-circle-o help-tip-icon' style='padding-left: 2px'/>
</el-tooltip> </el-tooltip>
</span> </span>
) )
@@ -304,13 +299,16 @@ export class TableColumnsGenerator {
return col return col
} }
if (column.type === 'boolean') { if (column.type === 'boolean') {
col.filters = [{ text: i18n.t('Yes'), value: true }, { text: i18n.t('No'), value: false }] col.filters = [
{ text: i18n.t('Yes'), value: true },
{ text: i18n.t('No'), value: false }
]
col.sortable = false col.sortable = false
col['column-key'] = col.prop col['column-key'] = col.prop
} }
if (column.type === 'choice' && column.choices) { if (column.type === 'choice' && column.choices) {
col.filters = column.choices.map(item => { col.filters = column.choices.map(item => {
if (typeof item.value === 'boolean') { if (typeof (item.value) === 'boolean') {
if (item.value) { if (item.value) {
return { text: item['label'], value: 'True' } return { text: item['label'], value: 'True' }
} else { } else {

View File

@@ -99,9 +99,9 @@ export default {
totalData: [], totalData: [],
page: defaultFirstPage, page: defaultFirstPage,
extraQuery: {}, extraQuery: {},
paginationSize: 12, paginationSize: 6,
paginationLayout: 'total, sizes, prev, pager, next', paginationLayout: 'total, sizes, prev, pager, next',
paginationSizes: [12, 24, 36], paginationSizes: [6, 18, 27],
loading: true, loading: true,
axiosConfig: { axiosConfig: {
raw: 1, raw: 1,
@@ -212,7 +212,7 @@ export default {
this.$confirm(msg, this.$tc('Info'), { this.$confirm(msg, this.$tc('Info'), {
type: 'warning', type: 'warning',
confirmButtonClass: 'el-button--danger', confirmButtonClass: 'el-button--danger',
beforeClose: async (action, instance, done) => { beforeClose: async(action, instance, done) => {
if (action !== 'confirm') return done() if (action !== 'confirm') return done()
const deleteFunc = this.tableConfig.onDelete || this.defaultPerformDelete const deleteFunc = this.tableConfig.onDelete || this.defaultPerformDelete
await deleteFunc(obj) await deleteFunc(obj)
@@ -261,7 +261,7 @@ export default {
min-width: 330px; min-width: 330px;
position: relative; position: relative;
margin-bottom: 20px; margin-bottom: 20px;
height: 180px; //height: 230px;
width: 380px; width: 380px;
padding: 15px; padding: 15px;

View File

@@ -5,11 +5,6 @@
<slot name="no-data" /> <slot name="no-data" />
</template> </template>
<template v-else> <template v-else>
<!--
过滤 selection 相关事件的透传避免父组件收到 el-table 原生的当前页 selection
导致跨页选择persistSelection被覆盖只剩当页数据
选择事件统一走 selectStrategy在内部维护全量 selected 并向外 emit
-->
<el-table <el-table
ref="table" ref="table"
v-loading="tableLoading" v-loading="tableLoading"
@@ -17,7 +12,7 @@
:row-class-name="rowClassName" :row-class-name="rowClassName"
v-bind="tableAttrs" v-bind="tableAttrs"
@select="selectStrategy.onSelect" @select="selectStrategy.onSelect"
v-on="forwardListeners" v-on="$listeners"
@selection-change="selectStrategy.onSelectionChange" @selection-change="selectStrategy.onSelectionChange"
@select-all="handleSelectAll($event, canSelect)" @select-all="handleSelectAll($event, canSelect)"
@sort-change="onSortChange" @sort-change="onSortChange"
@@ -28,18 +23,27 @@
<template v-if="hasSelect"> <template v-if="hasSelect">
<el-data-table-column <el-data-table-column
key="selection-key" 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"> <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 <span
v-if="iconShow(scope.$index, scope.row)" v-if="iconShow(scope.$index, scope.row)"
class="tree-ctrl" class="tree-ctrl"
@click="toggleExpanded(scope.$index)" @click="toggleExpanded(scope.$index)"
> >
<i :class="`el-icon-${scope.row._expanded ? 'minus' : 'plus'}`" /> <i
:class="`el-icon-${scope.row._expanded ? 'minus' : 'plus'}`"
/>
</span> </span>
{{ scope.row[columns[1].prop] }} {{ scope.row[columns[1].prop] }}
</template> </template>
@@ -48,16 +52,23 @@
<el-data-table-column <el-data-table-column
v-for="col in columns.filter((c, i) => i !== 0 && i !== 1)" v-for="col in columns.filter((c, i) => i !== 0 && i !== 1)"
:key="col.prop" :key="col.prop"
v-bind="{ align: columnsAlign, ...col }" v-bind="{align: columnsAlign, ...col}"
/> />
</template> </template>
<!--无选择--> <!--无选择-->
<template v-else> <template v-else>
<!--展开这列, 丢失 el-data-table-column属性--> <!--展开这列, 丢失 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"> <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 <span
v-if="iconShow(scope.$index, scope.row)" v-if="iconShow(scope.$index, scope.row)"
@@ -73,19 +84,14 @@
<el-data-table-column <el-data-table-column
v-for="col in columns.filter((c, i) => i !== 0)" v-for="col in columns.filter((c, i) => i !== 0)"
:key="col.prop" :key="col.prop"
v-bind="{ align: columnsAlign, ...col }" v-bind="{align: columnsAlign, ...col}"
/> />
</template> </template>
</template> </template>
<!--非树--> <!--非树-->
<template v-else> <template v-else>
<el-data-table-column <el-data-table-column v-if="hasSelection" :align="selectionAlign" :selectable="canSelect" type="selection" />
v-if="hasSelection"
:align="selectionAlign"
:selectable="canSelect"
type="selection"
/>
<el-data-table-column <el-data-table-column
v-for="col in columns" v-for="col in columns"
:key="col.prop" :key="col.prop"
@@ -94,14 +100,14 @@
:filters="col.filters || null" :filters="col.filters || null"
:formatter="typeof col.formatter === 'function' ? col.formatter : null" :formatter="typeof col.formatter === 'function' ? col.formatter : null"
:title="col.label" :title="col.label"
v-bind="{ align: columnsAlign, ...col }" v-bind="{align: columnsAlign, ...col}"
> >
<template #header> <template #header>
<span :title="col.label">{{ col.label }}</span> <span :title="col.label">{{ col.label }}</span>
</template> </template>
<template <template
v-if="col.formatter && typeof col.formatter !== 'function'" v-if="col.formatter && typeof col.formatter !== 'function'"
v-slot:default="{ row, column, $index }" v-slot:default="{row, column, $index}"
> >
<div <div
:is="col.formatter" :is="col.formatter"
@@ -155,9 +161,9 @@
</template> </template>
<script> <script>
import _get from 'lodash/get' import _get from 'lodash.get'
import _values from 'lodash/values' import _values from 'lodash.values'
import _isEmpty from 'lodash/isEmpty' import _isEmpty from 'lodash.isempty'
import SelfLoadingButton from './components/self-loading-button.vue' import SelfLoadingButton from './components/self-loading-button.vue'
import TheDialog, { dialogModes } from './components/the-dialog.vue' import TheDialog, { dialogModes } from './components/the-dialog.vue'
import ElDataTableColumn from './components/el-data-table-column' import ElDataTableColumn from './components/el-data-table-column'
@@ -269,7 +275,8 @@ export default {
*/ */
beforeSearch: { beforeSearch: {
type: Function, type: Function,
default() {} default() {
}
}, },
/** /**
* 单选, 适用场景: 不可以批量删除 * 单选, 适用场景: 不可以批量删除
@@ -434,7 +441,8 @@ export default {
*/ */
onEdit: { onEdit: {
type: Function, type: Function,
default(row) {} default(row) {
}
}, },
/** /**
* 点击删除按钮时的方法, 当默认删除方法不满足需求时使用, 需要返回promise * 点击删除按钮时的方法, 当默认删除方法不满足需求时使用, 需要返回promise
@@ -443,7 +451,9 @@ export default {
onDelete: { onDelete: {
type: Function, type: Function,
default(data) { 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) return this.$axios.delete(this.url + '/' + ids + '/', this.axiosConfig)
} }
}, },
@@ -697,8 +707,8 @@ export default {
} }
}, },
/* /*
* 设置默认对齐方式 * 设置默认对齐方式
*/ */
defaultAlign: { defaultAlign: {
type: String, type: String,
default: 'center' default: 'center'
@@ -713,7 +723,8 @@ export default {
}, },
extraPaginationAttrs: { extraPaginationAttrs: {
type: Object, type: Object,
default: () => {} default: () => {
}
}, },
hasSelection: { hasSelection: {
type: Boolean, type: Boolean,
@@ -799,16 +810,6 @@ export default {
selectStrategy() { selectStrategy() {
return getSelectStrategy(this) 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() { searchLocatedSlotKeys() {
return getLocatedSlotKeys(this.$slots, 'search:') return getLocatedSlotKeys(this.$slots, 'search:')
}, },
@@ -896,7 +897,9 @@ export default {
} }
Object.assign(query, this._extraQuery) Object.assign(query, this._extraQuery)
Object.assign(query, this.innerQuery) 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 const pageOffset = this.firstPage - defaultFirstPage
@@ -978,7 +981,9 @@ export default {
formValue = this.$refs.searchForm.getFormValue() formValue = this.$refs.searchForm.getFormValue()
Object.assign(query, formValue) Object.assign(query, formValue)
} }
const queryStr = (url.indexOf('?') > -1 ? '&' : '?') + queryUtil.stringify(query, '=', '&') const queryStr =
(url.indexOf('?') > -1 ? '&' : '?') +
queryUtil.stringify(query, '=', '&')
// 请求开始 // 请求开始
this.tableLoading = loading this.tableLoading = loading
@@ -998,7 +1003,10 @@ export default {
// 不分页 // 不分页
if (!this.hasPagination) { if (!this.hasPagination) {
data = _get(resp, this.dataPath) || _get(resp, noPaginationDataPath) || [] data =
_get(resp, this.dataPath) ||
_get(resp, noPaginationDataPath) ||
[]
this.total = data.length this.total = data.length
} else { } else {
data = _get(resp, this.dataPath) || [] data = _get(resp, this.dataPath) || []
@@ -1181,7 +1189,7 @@ export default {
this.$confirm(this.deleteMessage(data), this.$t('Info'), { this.$confirm(this.deleteMessage(data), this.$t('Info'), {
type: 'warning', type: 'warning',
confirmButtonClass: 'el-button--danger', confirmButtonClass: 'el-button--danger',
beforeClose: async (action, instance, done) => { beforeClose: async(action, instance, done) => {
if (action !== 'confirm') return done() if (action !== 'confirm') return done()
instance.confirmButtonLoading = true instance.confirmButtonLoading = true
@@ -1217,7 +1225,11 @@ export default {
} }
const remain = this.data.length - deleteCount const remain = this.data.length - deleteCount
const lastPage = Math.ceil(this.total / this.size) 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-- this.page--
} }
}, },
@@ -1245,14 +1257,20 @@ export default {
tmp.push(record) tmp.push(record)
if (record[this.treeChildKey] && record[this.treeChildKey].length > 0) { 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) tmp = tmp.concat(children)
} }
}) })
return tmp return tmp
}, },
rowClassName(...args) { 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 (typeof rcn === 'function') rcn = rcn(...args)
if (this.isTree) rcn += ' ' + this.showRow(...args) if (this.isTree) rcn += ' ' + this.showRow(...args)
return rcn return rcn

View File

@@ -1,9 +1,14 @@
/**
* 两种多选策略Normal 和 PersistSelection
*/
/** /**
* 多选策略接口 * 多选策略接口
*/ */
class StrategyAbstract { class StrategyAbstract {
constructor(elDataTable) { constructor(elDataTable) {
this.elDataTable = elDataTable this.elDataTable = elDataTable
// 绑定this后可直接在template中使用
this.onSelectionChange = this.onSelectionChange.bind(this) this.onSelectionChange = this.onSelectionChange.bind(this)
this.onSelect = this.onSelect.bind(this) this.onSelect = this.onSelect.bind(this)
this.onSelectAll = this.onSelectAll.bind(this) this.onSelectAll = this.onSelectAll.bind(this)
@@ -13,22 +18,39 @@ class StrategyAbstract {
return this.elDataTable.$refs.table return this.elDataTable.$refs.table
} }
onSelectionChange() {} onSelectionChange() {
onSelect() {} }
onSelectAll() {}
toggleRowSelection() {} onSelect() {
clearSelection() {} }
updateElTableSelection() {}
onSelectAll() {
}
toggleRowSelection() {
}
clearSelection() {
}
updateElTableSelection() {
}
} }
/** /**
* 普通策略。由 el-table 自己维护 selection * 普通策略。由el-table维护selected
*/ */
class StrategyNormal extends StrategyAbstract { class StrategyNormal extends StrategyAbstract {
/**
* normal模式下只需要监听selection-change事件
*/
onSelectionChange(val) { onSelectionChange(val) {
this.elDataTable.selected = val this.elDataTable.selected = val
} }
/**
* toggleRowSelection和clearSelection的表现与el-table一致
*/
toggleRowSelection(...args) { toggleRowSelection(...args) {
return this.elTable.toggleRowSelection(...args) return this.elTable.toggleRowSelection(...args)
} }
@@ -39,28 +61,44 @@ class StrategyNormal extends StrategyAbstract {
} }
/** /**
* 跨页保存多选策略 * 跨页保存多选策略。手动维护selected数组
*/ */
class StrategyPersistSelection extends StrategyAbstract { class StrategyPersistSelection extends StrategyAbstract {
/**
* el-table的selection-change事件不适用于开启跨页保存的情况。
* 比如当开启persistSelection时发生以下两个场景
* 1. 用户点击翻页
* 2. 用户点击行首的切换全选项按钮,清空当前页多选项数据
* 其中场景1应该保持selected不变而场景2只应该从selected移除当前页所有行保留其他页面的多选状态。
* 但el-table的selection-change事件在两个场景中无差别发生所以这里不处理这个事件
*/
/**
* 用户切换某一行的多选
*/
onSelect(selection, row) { onSelect(selection, row) {
const isChosen = selection.indexOf(row) > -1 const isChosen = selection.indexOf(row) > -1
this.toggleRowSelection(row, isChosen) this.toggleRowSelection(row, isChosen)
// el-table 原生 selection-change 仅包含当前页。为保证跨页勾选有效,
// 在内部策略维护完 selected 后,向外部同步“全量已选”。
this.elDataTable.$emit('selection-change', this.elDataTable.selected)
} }
/**
* 用户切换当前页的多选
*/
onSelectAll(selection, selectable = () => true) { onSelectAll(selection, selectable = () => true) {
const { id, selected, data } = this.elDataTable const { id, selected, data } = this.elDataTable
const selectableRows = data.filter(selectable) const selectableRows = data.filter(selectable)
// const isSelected = !!selection.length
// 创建已选择项的 id 集合,用于快速查找
const selectedIds = new Set(selected.map(r => r[id])) const selectedIds = new Set(selected.map(r => r[id]))
const currentPageIds = new Set(selectableRows.map(row => row[id])) const currentPageIds = new Set(selectableRows.map(row => row[id]))
// 前页面的选中状态
const currentPageSelectedCount = selectableRows.filter(row => const currentPageSelectedCount = selectableRows.filter(row =>
selectedIds.has(row[id]) selectedIds.has(row[id])
).length ).length
// 判断是全选还是取消全选
const shouldSelectAll = currentPageSelectedCount < selectableRows.length const shouldSelectAll = currentPageSelectedCount < selectableRows.length
this.elTable?.clearSelection() this.elTable?.clearSelection()
@@ -68,11 +106,15 @@ class StrategyPersistSelection extends StrategyAbstract {
if (shouldSelectAll) { if (shouldSelectAll) {
selectableRows.forEach(row => { selectableRows.forEach(row => {
if (!selectedIds.has(row[id])) selected.push(row) if (!selectedIds.has(row[id])) selected.push(row)
this.elTable.toggleRowSelection(row, true) this.elTable.toggleRowSelection(row, true)
// ! 这里需要触发事件,否则在 el-table 中无法触发 selection-change 事件
this.elDataTable.$emit('toggle-row-selection', true, row) this.elDataTable.$emit('toggle-row-selection', true, row)
}) })
} else { } else {
const newSelected = [] const newSelected = []
selected.forEach(row => { selected.forEach(row => {
if (!currentPageIds.has(row[id])) { if (!currentPageIds.has(row[id])) {
newSelected.push(row) newSelected.push(row)
@@ -80,12 +122,17 @@ class StrategyPersistSelection extends StrategyAbstract {
this.elDataTable.$emit('toggle-row-selection', false, row) this.elDataTable.$emit('toggle-row-selection', false, row)
} }
}) })
this.elDataTable.selected = newSelected this.elDataTable.selected = newSelected
} }
this.elDataTable.$emit('selection-change', this.elDataTable.selected) this.elDataTable.$emit('selection-change', this.elDataTable.selected)
} }
/**
* toggleRowSelection和clearSelection管理elDataTable的selected数组
* 记得最后要将状态同步到el-table中
*/
toggleRowSelection(row, isSelected) { toggleRowSelection(row, isSelected) {
const { id, selected } = this.elDataTable const { id, selected } = this.elDataTable
const foundIndex = selected.findIndex(r => r[id] === row[id]) 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.elDataTable.$emit('toggle-row-selection', isSelected, row)
this.updateElTableSelection() this.updateElTableSelection()
// 切换后同步全量 selection跨页
this.elDataTable.$emit('selection-change', this.elDataTable.selected)
} }
clearSelection() { clearSelection() {
this.elDataTable.selected = [] this.elDataTable.selected = []
this.updateElTableSelection() this.updateElTableSelection()
// 清空后也同步给外部,保持外层状态一致
this.elDataTable.$emit('selection-change', this.elDataTable.selected)
} }
/**
* 将selected状态同步到el-table中
*/
updateElTableSelection() { updateElTableSelection() {
const { data, id, selected } = this.elDataTable const { data, id, selected } = this.elDataTable
const selectedIds = new Set(selected.map(r => r[id])) const selectedIds = new Set(selected.map(r => r[id]))
this.elTable?.clearSelection() this.elTable?.clearSelection()
data.forEach(row => { data.forEach(row => {
const shouldBeSelected = selectedIds.has(row[id]) const shouldBeSelected = selectedIds.has(row[id])
if (!this.elTable) return
if (shouldBeSelected) { if (shouldBeSelected) {
this.elTable.toggleRowSelection(row, true) this.elTable.toggleRowSelection(row, true)
} }

View File

@@ -10,7 +10,7 @@
</template> </template>
<script> <script>
import { newURL, ObjectLocalStorage } from '@/utils/common/index' import { newURL, ObjectLocalStorage } from '@/utils/common'
import { default as ElDatableTable } from './compenents/el-data-table' import { default as ElDatableTable } from './compenents/el-data-table'
import { mapGetters } from 'vuex' import { mapGetters } from 'vuex'
@@ -65,7 +65,7 @@ export default {
onEdit: (row) => { onEdit: (row) => {
const defaultOnEdit = (row) => { const defaultOnEdit = (row) => {
const routeName = userTableActions.editRoute const routeName = userTableActions.editRoute
this.$router.push({ name: routeName, params: { id: row.id } }) this.$router.push({ name: routeName, params: { id: row.id }})
} }
let onEdit = userTableActions.onEdit let onEdit = userTableActions.onEdit
if (!onEdit) { if (!onEdit) {
@@ -167,6 +167,7 @@ export default {
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.el-data-table { .el-data-table {
::v-deep .el-pagination.is-background .el-pager li { ::v-deep .el-pagination.is-background .el-pager li {

View File

@@ -22,9 +22,8 @@
<script> <script>
import ListTable from '../ListTable' import ListTable from '../ListTable'
import Drawer from '@/components/Drawer/index.vue' import Drawer from '@/components/Drawer/index.vue'
import { setUrlParam, toLowerCaseExcludeAbbr, toSentenceCase } from '@/utils/common/index' import { setUrlParam, toLowerCaseExcludeAbbr, toSentenceCase } from '@/utils/common'
import { mapGetters } from 'vuex' import { mapGetters } from 'vuex'
import { resolveRoute } from '@/utils/vue/index'
const drawerType = [String, Function] const drawerType = [String, Function]
@@ -107,8 +106,8 @@ export default {
const formatterArgs = value?.formatterArgs const formatterArgs = value?.formatterArgs
// console.log('>>> name: ', key) // console.log('>>> name: ', key)
// console.log('>>> formatter: ', formatter) // console.log('>>> formatter: ', formatter)
const detailFormatters = ['AmountFormatter', 'DetailFormatter'] const detailFormaters = ['AmountFormatter', 'DetailFormatter']
if (formatter && detailFormatters.includes(formatter.name) && formatterArgs.drawer !== false) { if (formatter && detailFormaters.includes(formatter.name) && formatterArgs.drawer !== false) {
formatterArgs.onClick = this.onDetail formatterArgs.onClick = this.onDetail
} }
} }
@@ -167,9 +166,9 @@ export default {
} }
this.drawerComponent = '' this.drawerComponent = ''
}, },
getDetailDrawerTitle({ col, row, cellValue, payload = {} }) { getDetailDrawerTitle({ col, row, cellValue, payload = {}}) {
this.$log.debug('>>> getDetailDrawerTitle: ', col, row, cellValue, payload) this.$log.debug('>>> getDetailDrawerTitle: ', col, row, cellValue, payload)
const { detailRoute = {}, formatterArgs = {} } = payload const { detailRoute = {}, formatterArgs = {}} = payload
const getTitle = formatterArgs.getDrawerTitle const getTitle = formatterArgs.getDrawerTitle
this.$log.debug('>>> getTitle: ', getTitle) this.$log.debug('>>> getTitle: ', getTitle)
if (getTitle && typeof getTitle === 'function') { if (getTitle && typeof getTitle === 'function') {
@@ -178,7 +177,7 @@ export default {
if (formatterArgs.title) { if (formatterArgs.title) {
return formatterArgs.title return formatterArgs.title
} }
const resolvedRoute = resolveRoute(detailRoute, this.$router) const resolvedRoute = this.resolveRoute(detailRoute)
let title = cellValue || row.name let title = cellValue || row.name
if (formatterArgs.getTitle) { if (formatterArgs.getTitle) {
title = formatterArgs.getTitle({ col, row, cellValue }) title = formatterArgs.getTitle({ col, row, cellValue })
@@ -223,6 +222,7 @@ export default {
} }
title = actionLabel + this.$t('WordSep') + toLowerCaseExcludeAbbr(title) title = actionLabel + this.$t('WordSep') + toLowerCaseExcludeAbbr(title)
return title return title
}, },
getDefaultDrawer(action) { getDefaultDrawer(action) {
@@ -232,38 +232,53 @@ export default {
}, },
getRouteNameComponent(name, action) { getRouteNameComponent(name, action) {
const route = { name: name } const route = { name: name }
if (action === 'detail' || action === 'update') { if (action === 'detail' || action === 'update') {
route.params = { id: '1' } route.params = { id: '1' }
} }
const routes = this.$router.resolve(route)
const resolved = resolveRoute(route, this.$router) if (!routes) {
return
if (resolved && resolved.components && resolved.components.default) { }
return resolved.components.default const matched = routes.resolved.matched.filter(item => item.name === name && item.components)
if (matched.length === 0) {
return
} }
return '' if (matched[0] && matched[0].components?.default) {
const component = matched[0].components.default
return component
}
},
resolveRoute(route) {
const routes = this.$router.resolve(route)
if (!routes) {
return
}
const matched = routes.resolved.matched.filter(item => item.name === route.name && item.components)
if (matched.length === 0) {
return
}
if (matched[0] && matched[0].components?.default) {
return matched[0]
}
}, },
getDetailComponent({ detailRoute }) { getDetailComponent({ detailRoute }) {
if (!detailRoute) { if (!detailRoute) {
return this.detailDrawer return this.detailDrawer
} }
this.$log.debug('>>> getDetailComponent: ', detailRoute)
const route = resolveRoute(detailRoute, this.$router) const route = this.resolveRoute(detailRoute)
let component = null let component = null
if (route) {
if (route && route.components && route.components.default) {
component = route.components.default component = route.components.default
} }
if (!component) { if (!component) {
component = this.detailDrawer component = this.detailDrawer
} }
return component return component
}, },
getDrawerComponent(action, payload) { getDrawerComponent(action, payload) {
this.$log.debug('>>> getDrawerComponent: ', action, payload)
switch (action) { switch (action) {
case 'create': case 'create':
return this.createDrawer return this.createDrawer
@@ -278,7 +293,7 @@ export default {
} }
}, },
async showDrawer(action, { row = {}, col = {}, query = {}, cellValue = '', payload = {} } = {}) { async showDrawer(action, { row = {}, col = {}, query = {}, cellValue = '', payload = {}} = {}) {
try { try {
// 1. 先重置状态 // 1. 先重置状态
this.drawerVisible = false this.drawerVisible = false
@@ -294,6 +309,7 @@ export default {
// 3. 设置组件 // 3. 设置组件
this.drawerComponent = this.getDrawerComponent(action, payload) this.drawerComponent = this.getDrawerComponent(action, payload)
this.$log.debug('>>> drawerComponent: ', this.drawerComponent) this.$log.debug('>>> drawerComponent: ', this.drawerComponent)
this.drawerTitle = this.getActionDrawerTitle({ action, row, col, cellValue, payload })
// 4. 如果没有组件,尝试获取默认组件 // 4. 如果没有组件,尝试获取默认组件
if (!this.drawerComponent) { if (!this.drawerComponent) {
@@ -310,7 +326,6 @@ export default {
const actionMeta = await this.$store.getters['common/drawerActionMeta'] const actionMeta = await this.$store.getters['common/drawerActionMeta']
this.title = this.getDrawerTitle({ action, ...actionMeta }) this.title = this.getDrawerTitle({ action, ...actionMeta })
} }
this.drawerTitle = this.getActionDrawerTitle({ action, row, col, cellValue, payload })
// 7. 等待下一个 tick确保组件已设置 // 7. 等待下一个 tick确保组件已设置
await this.$nextTick() await this.$nextTick()
@@ -355,7 +370,7 @@ export default {
await this.$store.dispatch('common/setDrawerActionMeta', { await this.$store.dispatch('common/setDrawerActionMeta', {
action: 'detail', row: row, col: col, id: id action: 'detail', row: row, col: col, id: id
}) })
await this.showDrawer('detail', { row, col, cellValue, payload: { detailRoute, formatterArgs } }) await this.showDrawer('detail', { row, col, cellValue, payload: { detailRoute, formatterArgs }})
}, },
async onCreate(meta) { async onCreate(meta) {
if (!meta) { if (!meta) {
@@ -365,14 +380,14 @@ export default {
await this.$store.dispatch('common/setDrawerActionMeta', { action: 'create', ...meta }) await this.$store.dispatch('common/setDrawerActionMeta', { action: 'create', ...meta })
await this.showDrawer('create', meta) await this.showDrawer('create', meta)
}, },
async onClone({ row, col, query = {} }) { async onClone({ row, col, query = {}}) {
this.$route.params.id = '' this.$route.params.id = ''
await this.$store.dispatch('common/setDrawerActionMeta', { await this.$store.dispatch('common/setDrawerActionMeta', {
action: 'clone', row: row, col: col, id: row.id action: 'clone', row: row, col: col, id: row.id
}) })
await this.showDrawer('clone', { query }) await this.showDrawer('clone', { query })
}, },
async onUpdate({ row, col, query = {} }) { async onUpdate({ row, col, query = {}}) {
this.$route.params.id = row.id this.$route.params.id = row.id
this.$route.params.action = 'update' this.$route.params.action = 'update'
await this.$store.dispatch('common/setDrawerActionMeta', { await this.$store.dispatch('common/setDrawerActionMeta', {

View File

@@ -4,11 +4,15 @@
<div class="panel-title"> <div class="panel-title">
<el-avatar :src="imageUrl" shape="square" /> <el-avatar :src="imageUrl" shape="square" />
<div class="title-display"> <div class="title-display">
<p class="name" :title="object.name">{{ object.name }}</p> <span class="name">{{ object.name }}</span>
<span class="comment">{{ object.provider.label }}</span> <span class="comment">{{ object.provider.label }}</span>
</div> </div>
</div> </div>
<div v-if="iActions.length !== 0" class="panel-actions" @click="handleClick($event)"> <div
v-if="iActions.length !== 0"
class="panel-actions"
@click="handleClick($event)"
>
<el-dropdown> <el-dropdown>
<el-button size="mini"> <el-button size="mini">
<i class="el-icon-more el-icon--right" /> <i class="el-icon-more el-icon--right" />
@@ -60,19 +64,21 @@ export default {
}, },
getImage: { getImage: {
type: Function, type: Function,
default: obj => '' default: (obj) => ''
}, },
getInfos: { getInfos: {
type: Function, type: Function,
default: obj => [] default: (obj) => []
}, },
handleUpdate: { handleUpdate: {
type: Function, type: Function,
default: () => {} default: () => {
}
}, },
onView: { onView: {
type: Function, type: Function,
default: () => {} default: () => {
}
} }
}, },
data() { data() {
@@ -146,13 +152,13 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
div.info-panel { div.info-panel {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding: 10px; padding: 10px;
gap: unset; gap: 10px;
cursor: pointer; cursor: pointer;
height: initial !important;
.panel-header { .panel-header {
padding: 10px 20px; padding: 10px 20px;
@@ -169,23 +175,12 @@ div.info-panel {
.title-display { .title-display {
display: flex; display: flex;
flex-basis: 225px;
flex-direction: column; flex-direction: column;
justify-content: center; text-align: left;
align-items: flex-start;
max-width: 225px;
min-width: 0;
overflow-x: hidden;
.name { .name {
font-size: 1.1em; font-size: 1.1em;
color: #555555; color: #555555;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
width: 100%;
margin: unset;
text-align: start;
} }
.comment { .comment {
@@ -198,7 +193,6 @@ div.info-panel {
::v-deep { ::v-deep {
.el-avatar { .el-avatar {
background: #fff; background: #fff;
flex-shrink: 0;
} }
} }
} }

View File

@@ -49,7 +49,7 @@
import Dialog from '@/components/Dialog/index.vue' import Dialog from '@/components/Dialog/index.vue'
import { createSourceIdCache } from '@/api/common' import { createSourceIdCache } from '@/api/common'
import * as queryUtil from '@/components/Table/DataTable/compenents/el-data-table/utils/query' import * as queryUtil from '@/components/Table/DataTable/compenents/el-data-table/utils/query'
import { download } from '@/utils/common/index' import { download } from '@/utils/common'
export default { export default {
name: 'ExportDialog', name: 'ExportDialog',

View File

@@ -22,8 +22,8 @@
<div style="line-height: 1.5"> <div style="line-height: 1.5">
<span class="el-upload__tip"> <span class="el-upload__tip">
{{ downloadTemplateTitle }} {{ downloadTemplateTitle }}
<el-link type="primary" @click="downloadTemplateFile('csv')"> CSV </el-link> <el-link type="success" @click="downloadTemplateFile('csv')"> CSV </el-link>
<el-link type="primary" @click="downloadTemplateFile('xlsx')"> XLSX </el-link> <el-link type="success" @click="downloadTemplateFile('xlsx')"> XLSX </el-link>
</span> </span>
</div> </div>
</el-form-item> </el-form-item>
@@ -58,7 +58,6 @@
:import-option="importOption" :import-option="importOption"
:json-data="jsonData" :json-data="jsonData"
:url="url" :url="url"
v-bind="$attrs"
@cancel="cancelUpload" @cancel="cancelUpload"
@finish="closeDialog" @finish="closeDialog"
/> />
@@ -69,7 +68,7 @@
<script> <script>
import Dialog from '@/components/Dialog/index.vue' import Dialog from '@/components/Dialog/index.vue'
import ImportTable from '@/components/Table/ListTable/TableAction/ImportTable.vue' import ImportTable from '@/components/Table/ListTable/TableAction/ImportTable.vue'
import { download, getErrorResponseMsg } from '@/utils/common/index' import { download, getErrorResponseMsg } from '@/utils/common'
import { createSourceIdCache } from '@/api/common' import { createSourceIdCache } from '@/api/common'
export default { export default {
@@ -248,46 +247,46 @@ export default {
</script> </script>
<style lang='scss' scoped> <style lang='scss' scoped>
@import "~@/styles/variables"; @import "~@/styles/variables";
.error-msg { .error-msg {
color: $--color-danger; 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;
} }
.tableFilter { .error-msg.error-results {
padding-bottom: 10px; background-color: #f3f3f4;
max-height: 200px;
overflow: auto
} }
}
.importTable ::v-deep .el-dialog__body { .file-uploader ::v-deep .el-upload {
padding-bottom: 20px; width: 100%;
} //padding-right: 150px;
}
.export-item { .file-uploader ::v-deep .el-upload-dragger {
margin-left: 80px; 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 { .export-item:first-child {
margin-left: 0; margin-left: 0;

View File

@@ -42,10 +42,10 @@
<script> <script>
import DataTable from '@/components/Table/DataTable/index.vue' import DataTable from '@/components/Table/DataTable/index.vue'
import { getUpdateObjURL } from '@/utils/common/index' import { getUpdateObjURL } from '@/utils/common'
import { sleep } from '@/utils/common/time' import { sleep } from '@/utils/time'
import { EditableInputFormatter } from '@/components/Table/TableFormatters' import { EditableInputFormatter } from '@/components/Table/TableFormatters'
import { encryptPassword } from '@/utils/secure' import { encryptPassword } from '@/utils/crypto'
import getStatusColumnMeta from '@/components/Table/ListTable/TableAction/const' import getStatusColumnMeta from '@/components/Table/ListTable/TableAction/const'
export default { export default {
@@ -97,10 +97,6 @@ export default {
origin: { origin: {
type: String, type: String,
default: '' default: ''
},
encryptFields: {
type: Array,
default: () => []
} }
}, },
data() { data() {
@@ -277,15 +273,11 @@ export default {
} }
return columns return columns
}, },
getEncryptFields() {
const fromProp = Array.isArray(this.encryptFields) && this.encryptFields.length ? this.encryptFields : null
return fromProp || ['password', 'secret', 'private_key']
},
generateTableData(tableTitles, tableData) { generateTableData(tableTitles, tableData) {
const totalData = [] const totalData = []
tableData.forEach(item => { tableData.forEach(item => {
this.$set(item, '@status', 'pending') this.$set(item, '@status', 'pending')
const encryptFields = this.getEncryptFields() const encryptFields = ['password', 'secret', 'private_key']
for (const field of encryptFields) { for (const field of encryptFields) {
if (item[field]) { if (item[field]) {
item[field] = encryptPassword(item[field]) item[field] = encryptPassword(item[field])

View File

@@ -1,6 +1,11 @@
<template> <template>
<div class="label-search"> <div class="label-search">
<el-button v-if="!showLabelSearch" class="label-button" size="small" @click="showSearchSelect"> <el-button
v-if="!showLabelSearch"
class="label-button"
size="small"
@click="showSearchSelect"
>
<svg-icon icon-class="tag" /> <svg-icon icon-class="tag" />
</el-button> </el-button>
<el-cascader <el-cascader
@@ -95,7 +100,7 @@ export default {
setTimeout(() => { setTimeout(() => {
this.$refs.labelCascader.updateStyle() this.$refs.labelCascader.updateStyle()
input.style.height = '30px' input.style.height = '30px'
}) },)
return return
} else { } else {
input.style.height = '30px' input.style.height = '30px'
@@ -142,44 +147,41 @@ export default {
}, 200) }, 200)
}, },
listenViewPort() { listenViewPort() {
window.addEventListener( window.addEventListener('resize', debounce((e) => {
'resize', const viewPort = e?.target?.innerWidth
debounce(e => { this.showLabelSearch = viewPort < 992
const viewPort = e?.target?.innerWidth }, 100), false)
this.showLabelSearch = viewPort < 992
}, 100),
false
)
} }
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang='scss' scoped>
.label-search { .label-search {
margin-right: 10px;
border: 1px solid var(--color-border); border: 1px solid var(--color-border);
overflow: hidden; overflow: hidden;
::v-deep .el-button.label-button { ::v-deep .el-button.label-button {
height: 28px; height: 28px;
border: none; border: none;
padding: 8px;
} }
.label-cascader { .label-cascader {
width: 300px; width: 300px;
height: 28px; height: 28px;
line-height: unset !important; line-height: 28px;
::v-deep .el-input { ::v-deep .el-input {
.el-input__inner { .el-input__inner {
height: 28px !important; height: 28px !important;
line-height: 28px;
font-size: 13px; font-size: 13px;
border: none; border: none;
} }
.el-input__suffix { .el-input__suffix {
color: var(--color-icon-primary) !important; color: var(--color-icon-primary) !important;;
} }
} }

View File

@@ -10,7 +10,7 @@
<script> <script>
import { cleanActions } from './utils' import { cleanActions } from './utils'
import { createSourceIdCache } from '@/api/common' import { createSourceIdCache } from '@/api/common'
import { getErrorResponseMsg } from '@/utils/common/index' import { getErrorResponseMsg } from '@/utils/common'
import i18n from '@/i18n/i18n' import i18n from '@/i18n/i18n'
import DataActions from '@/components/Common/DataActions/index.vue' import DataActions from '@/components/Common/DataActions/index.vue'
@@ -240,7 +240,7 @@ export default {
type: 'warning', type: 'warning',
confirmButtonClass: 'el-button--danger', confirmButtonClass: 'el-button--danger',
showCancelButton: true, showCancelButton: true,
beforeClose: async (action, instance, done) => { beforeClose: async(action, instance, done) => {
if (action !== 'confirm') return done() if (action !== 'confirm') return done()
instance.confirmButtonLoading = true instance.confirmButtonLoading = true
try { try {

View File

@@ -45,7 +45,7 @@
<script> <script>
import SummaryCard from '@/components/Cards/SummaryCard/index.vue' import SummaryCard from '@/components/Cards/SummaryCard/index.vue'
import { setUrlParam } from '@/utils/common/index' import { setUrlParam } from '@/utils/common'
export default { export default {
name: 'QuickFilter', name: 'QuickFilter',

View File

@@ -17,7 +17,7 @@
import ActionsGroup from '@/components/Common/ActionsGroup/index.vue' import ActionsGroup from '@/components/Common/ActionsGroup/index.vue'
import ImExportDialog from './ImExportDialog.vue' import ImExportDialog from './ImExportDialog.vue'
import { cleanActions } from './utils' import { cleanActions } from './utils'
import { assignIfNot } from '@/utils/common/index' import { assignIfNot } from '@/utils/common'
const defaultTrue = { type: [Boolean, Function, String], default: true } const defaultTrue = { type: [Boolean, Function, String], default: true }
@@ -111,7 +111,7 @@ export default {
{ {
name: 'actionFilter', name: 'actionFilter',
icon: 'filter', icon: 'filter',
tip: this.$t('QuickFilter'), tip: this.$t('Filter'),
has: this.hasQuickFilter, has: this.hasQuickFilter,
callback: this.handleFilterClick.bind(this) callback: this.handleFilterClick.bind(this)
}, },

View File

@@ -49,7 +49,7 @@ import LeftSide from './LeftSide.vue'
import RightSide from './RightSide.vue' import RightSide from './RightSide.vue'
import AutoDataSearch from '@/components/Table/AutoDataSearch/index.vue' import AutoDataSearch from '@/components/Table/AutoDataSearch/index.vue'
import DatetimeRangePicker from '@/components/Form/FormFields/DatetimeRangePicker.vue' import DatetimeRangePicker from '@/components/Form/FormFields/DatetimeRangePicker.vue'
import { getDaysAgo, getDaysFuture } from '@/utils/common/time' import { getDaysAgo, getDaysFuture } from '@/utils/time'
import LabelSearch from '@/components/Table/ListTable/TableAction/LabelSearch.vue' import LabelSearch from '@/components/Table/ListTable/TableAction/LabelSearch.vue'
const defaultTrue = { type: Boolean, default: true } const defaultTrue = { type: Boolean, default: true }
@@ -86,11 +86,13 @@ export default {
}, },
datePick: { datePick: {
type: Function, type: Function,
default: val => {} default: (val) => {
}
}, },
searchTable: { searchTable: {
type: Function, type: Function,
default: val => {} default: (val) => {
}
}, },
selectedRows: { selectedRows: {
type: Array, type: Array,
@@ -151,7 +153,7 @@ export default {
} }
</script> </script>
<style lang="scss" scoped> <style lang='scss' scoped>
$innerHeight: 28px; $innerHeight: 28px;
$headerHeight: 30px; $headerHeight: 30px;
@@ -178,7 +180,6 @@ $headerHeight: 30px;
.right-side-item.action-search { .right-side-item.action-search {
border: 1px solid var(--color-border); border: 1px solid var(--color-border);
overflow: hidden; overflow: hidden;
border-radius: 4px;
} }
} }
@@ -190,8 +191,6 @@ $headerHeight: 30px;
.search.right { .search.right {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
align-items: center;
gap: 8px;
padding-right: 10px; padding-right: 10px;
} }
} }
@@ -240,4 +239,5 @@ $headerHeight: 30px;
display: block; display: block;
padding: 5px 20px; padding: 5px 20px;
} }
</style> </style>

View File

@@ -9,7 +9,7 @@
/> />
<TableAction <TableAction
v-if="hasActions" v-if="hasActions"
:class="{ 'filter-expand': filterExpand }" :class="{'filter-expand': filterExpand}"
:date-pick="handleDateChange" :date-pick="handleDateChange"
:has-quick-filter="iHasQuickFilter" :has-quick-filter="iHasQuickFilter"
:quick-filter-expand.sync="filterExpand" :quick-filter-expand.sync="filterExpand"
@@ -34,7 +34,7 @@
</template> </template>
<script> <script>
import { getResourceFromApiUrl } from '@/utils/jms/index' import { getResourceFromApiUrl } from '@/utils/jms'
import deepmerge from 'deepmerge' import deepmerge from 'deepmerge'
import { mapGetters } from 'vuex' import { mapGetters } from 'vuex'
import IBox from '@/components/Common/IBox/index.vue' import IBox from '@/components/Common/IBox/index.vue'
@@ -42,8 +42,8 @@ import TableAction from './TableAction/index.vue'
import Emitter from '@/mixins/emitter' import Emitter from '@/mixins/emitter'
import AutoDataTable from '../AutoDataTable/index.vue' import AutoDataTable from '../AutoDataTable/index.vue'
import QuickFilter from './TableAction/QuickFilter.vue' import QuickFilter from './TableAction/QuickFilter.vue'
import { getDayEnd, getDaysAgo } from '@/utils/common/time' import { getDayEnd, getDaysAgo } from '@/utils/time'
import { ObjectLocalStorage } from '@/utils/common/index' import { ObjectLocalStorage } from '@/utils/common'
export default { export default {
name: 'ListTable', name: 'ListTable',
@@ -85,13 +85,10 @@ export default {
date_from: getDaysAgo(7).toISOString(), date_from: getDaysAgo(7).toISOString(),
date_to: this.$moment(getDayEnd()).add(1, 'day').toISOString() date_to: this.$moment(getDayEnd()).add(1, 'day').toISOString()
} }
this.headerActions.datePicker = Object.assign( this.headerActions.datePicker = Object.assign({
{ dateStart: extraQuery.date_from,
dateStart: extraQuery.date_from, dateEnd: extraQuery.date_to
dateEnd: extraQuery.date_to }, this.headerActions.datePicker)
},
this.headerActions.datePicker
)
} }
if (this.$route.query.order) { if (this.$route.query.order) {
extraQuery['order'] = this.$route.query.order extraQuery['order'] = this.$route.query.order
@@ -107,9 +104,7 @@ export default {
tablePath: new URL(this.tableConfig.url || '', 'http://127.0.0.1').pathname, tablePath: new URL(this.tableConfig.url || '', 'http://127.0.0.1').pathname,
objStorage: new ObjectLocalStorage('filterExpand'), objStorage: new ObjectLocalStorage('filterExpand'),
iFilterExpand: null, iFilterExpand: null,
reloadTable: _.debounce(this._reloadTable, 300), reloadTable: _.debounce(this._reloadTable, 300)
searchQuery: {},
filterQuery: {}
} }
}, },
computed: { computed: {
@@ -172,7 +167,7 @@ export default {
extraQuery: this.extraQuery extraQuery: this.extraQuery
}) })
const checkRoot = !(this.$route.meta?.disableOrgsChange === true) const checkRoot = !(this.$route.meta?.disableOrgsChange === true)
const checkPermAndRoot = action => { const checkPermAndRoot = (action) => {
if (!this.hasActionPerm(action)) { if (!this.hasActionPerm(action)) {
return this.$t('NoPermission') return this.$t('NoPermission')
} }
@@ -303,26 +298,19 @@ export default {
this.$delete(this.extraQuery, key) this.$delete(this.extraQuery, key)
} }
}, },
getMergedQuery() {
return { ...this.searchQuery, ...this.filterQuery }
},
search(attrs) { search(attrs) {
const init = this.updateInitQuery(attrs) const init = this.updateInitQuery(attrs)
if (init) { if (init) {
return return
} }
this.searchQuery = attrs
const merged = this.getMergedQuery()
this.$log.debug('ListTable: search table', attrs) this.$log.debug('ListTable: search table', attrs)
this.$emit('TagSearch', attrs) this.$emit('TagSearch', attrs)
this.$refs.dataTable?.$refs.dataTable?.search(merged, true) this.$refs.dataTable?.$refs.dataTable?.search(attrs, true)
}, },
filter(attrs) { filter(attrs) {
this.filterQuery = attrs
const merged = this.getMergedQuery()
this.$emit('TagFilter', attrs) this.$emit('TagFilter', attrs)
this.$log.debug('ListTable: found filter change', attrs) this.$log.debug('ListTable: found filter change', attrs)
this.$refs.dataTable?.$refs.dataTable?.search(merged, true) this.search(attrs)
}, },
hasActionPerm(action) { hasActionPerm(action) {
const permRequired = this.permissions[action] const permRequired = this.permissions[action]
@@ -390,4 +378,9 @@ export default {
} }
} }
} }
//修改颜色
.el-button--text {
color: #409EFF;
}
</style> </style>

View File

@@ -23,7 +23,7 @@ const defaultPerformDelete = function({ row, col }) {
const defaultUpdateCallback = function({ row, col }) { const defaultUpdateCallback = function({ row, col }) {
const id = row.id const id = row.id
let route = { params: { id: id } } let route = { params: { id: id }}
const updateRoute = this.colActions.updateRoute const updateRoute = this.colActions.updateRoute
if (typeof updateRoute === 'object') { if (typeof updateRoute === 'object') {
@@ -39,7 +39,7 @@ const defaultUpdateCallback = function({ row, col }) {
const defaultViewCallback = function({ row, col }) { const defaultViewCallback = function({ row, col }) {
const id = row.id const id = row.id
let route = { params: { id: id } } let route = { params: { id: id }}
const viewRoute = this.colActions.viewRoute const viewRoute = this.colActions.viewRoute
if (typeof updateRoute === 'object') { if (typeof updateRoute === 'object') {
@@ -55,7 +55,7 @@ const defaultViewCallback = function({ row, col }) {
const defaultCloneCallback = function({ row, col }) { const defaultCloneCallback = function({ row, col }) {
const id = row.id const id = row.id
let route = { query: { clone_from: id } } let route = { query: { clone_from: id }}
const cloneRoute = this.colActions.cloneRoute const cloneRoute = this.colActions.cloneRoute
if (typeof cloneRoute === 'object') { if (typeof cloneRoute === 'object') {
@@ -82,7 +82,7 @@ const defaultDeleteCallback = function({ row, col, cellValue, reload }) {
type: 'warning', type: 'warning',
confirmButtonClass: 'el-button--danger', confirmButtonClass: 'el-button--danger',
showCancelButton: true, showCancelButton: true,
beforeClose: async (action, instance, done) => { beforeClose: async(action, instance, done) => {
if (action !== 'confirm') return done() if (action !== 'confirm') return done()
instance.confirmButtonLoading = true instance.confirmButtonLoading = true
try { try {

View File

@@ -21,7 +21,7 @@ const formatterArgsDefault = {
false: 'fa-times-circle' false: 'fa-times-circle'
}, },
classChoices: { classChoices: {
true: 'text-success', true: 'text-primary',
false: 'text-danger' false: 'text-danger'
}, },
getKey({ row, cellValue }) { getKey({ row, cellValue }) {
@@ -100,3 +100,7 @@ export default {
methods: {} methods: {}
} }
</script> </script>
<style scoped>
</style>

View File

@@ -1,6 +1,6 @@
<script> <script>
import BaseFormatter from './base.vue' import BaseFormatter from './base.vue'
import { copy } from '@/utils/common/index' import { copy } from '@/utils/common'
export default { export default {
name: 'CopyableFormatter', name: 'CopyableFormatter',

Some files were not shown because too many files have changed in this diff Show More