1

merge: v4.10.4-lts

.prettierignore

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

.prettierrc

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

Dockerfile

@@ -1,4 +1,4 @@
-FROM jumpserver/lina-base:20250910_084112 AS stage-build
+FROM jumpserver/lina-base:20250805_081024 AS stage-build
 
 ARG VERSION
 ENV VERSION=$VERSION

PRETTIER.md

@@ -1,76 +0,0 @@
-# Prettier 配置说明
-
-本项目已配置 Prettier 代码格式化工具，**仅在保存时自动格式化**，不进行批量格式化，以保持现有代码风格。
-
-## 配置文件
-
-- `.prettierrc` - Prettier 配置文件
-- `.prettierignore` - 忽略格式化的文件列表
-- `.vscode/settings.json` - VSCode 编辑器配置（保存时自动格式化）
-- `.vscode/extensions.json` - 推荐的 VSCode 扩展
-
-## 使用方法
-
-### 1. 安装依赖
-项目已安装以下依赖：
-- `prettier@^2.8.8` - Prettier 核心
-- `eslint-plugin-prettier@^3.1.4` - ESLint 与 Prettier 集成
-- `eslint-config-prettier@^6.15.0` - 禁用与 Prettier 冲突的 ESLint 规则
-
-### 2. 命令行使用
-
-```bash
-# ESLint 检查和修复
-npm run fix
-```
-
-**注意**：本项目配置为仅在保存时自动格式化，不提供批量格式化命令。
-
-### 3. VSCode 编辑器配置
-
-确保安装了推荐的扩展：
-- Prettier - Code formatter (esbenp.prettier-vscode)
-- ESLint (dbaeumer.vscode-eslint)
-- Vetur (octref.vetur)
-
-配置已设置为保存时自动格式化。
-
-### 4. Git 提交钩子
-
-项目使用 `husky` 和 `lint-staged` 在提交时进行代码检查：
-- 提交时运行 ESLint 检查和修复
-- 不进行批量格式化，保持原有代码风格
-
-## Prettier 配置说明
-
-```json
-{
-  "semi": false,              // 不使用分号
-  "singleQuote": true,        // 使用单引号
-  "tabWidth": 0,              // 不使用缩进
-  "useTabs": false,           // 使用空格而不是制表符
-  "trailingComma": "none",    // 不使用尾随逗号
-  "printWidth": 100,          // 行宽 100 字符
-  "bracketSpacing": true,     // 对象括号内有空格
-  "arrowParens": "avoid",     // 箭头函数单参数时不使用括号
-  "endOfLine": "lf",          // 使用 LF 换行符
-  "vueIndentScriptAndStyle": false  // Vue 文件中 script 和 style 标签不缩进
-}
-```
-
-## 常见问题
-
-### Q: 如何临时禁用格式化？
-A: 使用注释：
-```javascript
-// prettier-ignore
-const uglyCode = {
-    a:1,b:2
-}
-```
-
-### Q: 如何添加文件到忽略列表？
-A: 编辑 `.prettierignore` 文件，添加文件或目录路径。
-
-### Q: VSCode 保存时没有自动格式化？
-A: 检查是否安装了 Prettier 扩展，并确认 `.vscode/settings.json` 配置正确。

package.json

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

src/components/Apps/VariablesHelpTextDialog/index.vue

@@ -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.key)">
-          <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>
-.help-dialog.dialog .el-dialog__footer {
-  border-top: none;
-  padding: 8px;
-}
-</style>
-
-<style lang="scss" scoped>
-.help-table {
-  width: 100%;
-  border-collapse: collapse;
-  border: 1px solid #dee2e6;
-
-  &::v-deep th, td {
-    height: 40px;
-    padding: 0 8px;
-    text-align: left;
-  }
-
-  &::v-deep .item-td, .item-label {
-    cursor: pointer;
-    color: var(--color-primary);
-  }
-}
-</style>

src/components/Common/DataActions/index.vue

@@ -5,7 +5,7 @@
         v-if="action.dropdown"
         v-show="action.dropdown.length > 0"
         :key="action.name"
-        :class="[action.name, { grouped: action.grouped }]"
+        :class="[action.name, {grouped: action.grouped }]"
         :size="action.size"
         :split-button="!!action.split"
         :type="action.type"
@@ -23,7 +23,7 @@
           :class="action.name"
           :size="size"
           class="more-action"
-          v-bind="{ ...cleanButtonAction(action), icon: '' }"
+          v-bind="{...cleanButtonAction(action), icon: ''}"
         >
           <span class="pre-icon">
             <Icon v-if="action.icon" :icon="action.icon" />
@@ -32,13 +32,13 @@
             {{ action.title }}<i class="el-icon-arrow-down el-icon--right" />
           </span>
         </el-button>
-        <el-dropdown-menu slot="dropdown" style="overflow: auto; max-height: 60vh">
+        <el-dropdown-menu slot="dropdown" style="overflow: auto;max-height: 60vh">
           <template v-for="option in action.dropdown">
             <div
               v-if="option.group"
-              :key="'group:' + option.name"
+              :key="'group:'+option.name"
               class="dropdown-menu-title"
-              style="width: 130px"
+              style="width:130px"
             >
               {{ option.group }}
             </div>
@@ -54,7 +54,7 @@
                 :command="[option, action]"
                 :title="option.tip"
                 class="dropdown-item"
-                v-bind="{ ...option, icon: '' }"
+                v-bind="{...option, icon: ''}"
               >
                 <span v-if="actionsHasIcon(action.dropdown)" class="pre-icon">
                   <Icon v-if="option.icon" :icon="option.icon" />
@@ -69,10 +69,10 @@
       <el-button
         v-else
         :key="action.name"
-        :class="[action.name, { grouped: action.grouped }]"
+        :class="[action.name, {grouped: action.grouped }]"
         :size="size"
         class="action-item"
-        v-bind="{ ...cleanButtonAction(action), icon: '' }"
+        v-bind="{...cleanButtonAction(action), icon: ''}"
         @click="handleClick(action)"
       >
         <el-tooltip :content="action.tip" :disabled="!action.tip" placement="top">
@@ -228,9 +228,9 @@ export default {
 
 <style lang="scss" scoped>
 $btn-text-color: #ffffff;
-$color-btn-background: #e8f7f4;
-$color-btn-focus-background: #83cbba;
-$color-divided: #e4e7ed;
+$color-btn-background: #E8F7F4;
+$color-btn-focus-background: #83CBBA;
+$color-divided: #E4E7ED;
 $color-drop-menu-title: #909399;
 $color-drop-menu-border: #e4e7ed;
 
@@ -284,8 +284,6 @@ $color-drop-menu-border: #e4e7ed;
 
   .el-button {
     padding: 2px 5px;
-    line-height: 1.3;
-    font-size: 13px;
 
     &:not(.is-plain) {
       color: $btn-text-color;
@@ -321,6 +319,7 @@ $color-drop-menu-border: #e4e7ed;
 // 下拉 options
 .el-dropdown-menu {
   ::v-deep .more-batch-processing {
+
     &:hover {
       background-color: transparent !important;
     }

src/components/Dashboard/ColumnChart.vue

@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div class="content">
     <echarts
       ref="echarts"
       :options="options"

src/components/Dashboard/Echart.vue

@@ -1,57 +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.totalCharts) {
-      window.totalCharts = 0
-    }
-    window.totalCharts++
-  },
-  methods: {
-    onFinished() {
-      if (!window.finishedCharts) {
-        window.finishedCharts = 0
-      }
-      window.finishedCharts++
-      if (window.finishedCharts === window.totalCharts) {
-        window.echartsFinished = true
-      }
-    }
-  }
-}
-</script>
-
-<style scoped lang="scss">
-</style>

src/components/Dashboard/LineChart.vue

@@ -5,8 +5,16 @@
       :options="options"
       :autoresize="true"
       theme="light"
+      :class="{'disabled-when-print': !!dataUrl}"
       @finished="genSnapshot"
     />
+    <img
+      v-if="dataUrl"
+      :src="dataUrl"
+      class="enabled-when-print"
+      style="display: none;width: 100%;"
+      alt="chart snapshot"
+    >
   </div>
 </template>
 
@@ -277,4 +285,14 @@ export default {
   width: 100%;
   height: 272px;
 }
+
+@media print {
+  .disabled-when-print {
+    display: none !important;
+  }
+  .enabled-when-print {
+    display: block !important;
+    width: 100% !important;
+  }
+}
 </style>

src/components/Dashboard/RealTimeSummary.vue

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

src/components/Form/DataForm/components/el-form-renderer/components/render-form-item.vue

@@ -179,7 +179,7 @@ export default {
   computed: {
     // 解构运算符会处理 undefined 的情况
     componentProps: ({ data: { el }, propsInner }) => ({ ...el, ...propsInner }),
-    hasReadonlyContent: ({ data: { type } }) => _includes(['input', 'select'], type),
+    hasReadonlyContent: ({ data: { type }}) => _includes(['input', 'select'], type),
     hiddenStatus: ({ data: { hidden = () => false }, data, value }) => hidden(value, data),
     enableWhenStatus: ({ data: { enableWhen }, value }) => getEnableWhenStatus(enableWhen, value),
     // 是否显示

src/components/Form/DataForm/index.vue

@@ -55,7 +55,7 @@
 
         <el-button
           v-for="button in moreButtons"
-          v-show="!iHidden(button)"
+          v-show="!button.hidden"
           :key="button.title"
           :loading="button.loading"
           size="small"
@@ -226,9 +226,6 @@ export default {
     },
     getFormValue() {
       return this.$refs.form.getFormValue()
-    },
-    iHidden(item) {
-      return typeof item.hidden === 'function' ? item.hidden() : item.hidden
     }
   }
 }

src/components/Form/FormFields/NestedObjectSelect2.vue

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

src/components/Form/FormFields/TagInput.vue

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

src/components/Form/FormFields/TransferSelect.vue

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

src/components/Table/DataTable/compenents/el-data-table/el-data-table.vue

@@ -5,11 +5,6 @@
       <slot name="no-data" />
     </template>
     <template v-else>
-      <!--
-        过滤 selection 相关事件的透传，避免父组件收到 el-table 原生的“当前页” selection，
-        导致跨页选择（persistSelection）被覆盖，只剩当页数据。
-        选择事件统一走 selectStrategy，在内部维护全量 selected 并向外 emit。
-      -->
       <el-table
         ref="table"
         v-loading="tableLoading"
@@ -17,7 +12,7 @@
         :row-class-name="rowClassName"
         v-bind="tableAttrs"
         @select="selectStrategy.onSelect"
-        v-on="forwardListeners"
+        v-on="$listeners"
         @selection-change="selectStrategy.onSelectionChange"
         @select-all="handleSelectAll($event, canSelect)"
         @sort-change="onSortChange"
@@ -815,16 +810,6 @@ export default {
     selectStrategy() {
       return getSelectStrategy(this)
     },
-    // 过滤会与内部选择策略冲突的事件，避免父组件只拿到当前页 selection
-    forwardListeners() {
-      const listeners = { ...this.$listeners }
-      delete listeners['selection-change']
-      delete listeners['select']
-      delete listeners['select-all']
-      // 外层如需监听 selection 变化，请监听本组件透出的 selection-change，
-      // 该事件来自选择策略，已汇总跨页后的全量 selected
-      return listeners
-    },
     searchLocatedSlotKeys() {
       return getLocatedSlotKeys(this.$slots, 'search:')
     },
@@ -1204,7 +1189,7 @@ export default {
       this.$confirm(this.deleteMessage(data), this.$t('Info'), {
         type: 'warning',
         confirmButtonClass: 'el-button--danger',
-        beforeClose: async (action, instance, done) => {
+        beforeClose: async(action, instance, done) => {
           if (action !== 'confirm') return done()
 
           instance.confirmButtonLoading = true

src/components/Table/DataTable/compenents/el-data-table/utils/select-strategy.js

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

src/components/Table/TableFormatters/ActionsFormatter.vue

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

src/components/Table/TagSearch/index.vue

@@ -244,10 +244,12 @@ export default {
         delete routeFilter.search
       }
       const asFilterTags = _.cloneDeep(this.filterTags)
-      this.filterTags = {
-        ...asFilterTags,
-        ...routeFilter
-      }
+      setTimeout(() => {
+        this.filterTags = {
+          ...asFilterTags,
+          ...routeFilter
+        }
+      }, 100)
     },
     getValueLabel(key, value) {
       for (const field of this.options) {

src/components/Widgets/Announcement/index.vue

@@ -1,52 +1,20 @@
 <template>
-  <div>
-    <el-dialog
-      v-if="enabled && showModal"
-      :visible.sync="dialogVisible"
-      :title="title"
-      :close-on-click-modal="false"
-      :close-on-press-escape="false"
-      :show-close="false"
-      width="35%"
-      class="announcement-dialog"
-      center
-    >
-      <div class="announcement-content">
-        <div class="content-wrapper">
-          <MarkDown :value="announcement.content" class="markdown" />
-        </div>
-        <div v-if="announcement.link" class="link-section">
-          <el-link :href="announcement.link" class="link-more" target="_blank" type="info">
-            {{ $t('ViewMore') }}
-          </el-link>
-          <i class="fa fa-external-link icon" />
-        </div>
-      </div>
-
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="onModalConfirm">
-          {{ $t('Confirm') }}
-        </el-button>
-      </div>
-    </el-dialog>
-
-    <el-alert
-      v-if="enabled && showAlert"
-      :center="false"
-      :title="title"
-      class="announcement"
-      type="success"
-      @close="onAlertClose"
-    >
-      <MarkDown :value="announcement.content" class="markdown" />
-      <span v-if="announcement.link">
-        <el-link :href="announcement.link" class="link-more" target="_blank" type="info">
-          {{ $t('ViewMore') }}
-        </el-link>
-        <i class="fa fa-external-link icon" />
-      </span>
-    </el-alert>
-  </div>
+  <el-alert
+    v-if="enabled && !isViewed()"
+    :center="false"
+    :title="title"
+    class="announcement"
+    type="success"
+    @close="onClose"
+  >
+    <MarkDown :value="announcement.content" class="markdown" />
+    <span v-if="announcement.link">
+      <el-link :href="announcement.link" class="link-more" target="_blank" type="info">
+        {{ $t('ViewMore') }}
+      </el-link>
+      <i class="fa fa-external-link icon" />
+    </span>
+  </el-alert>
 </template>
 
 <script>
@@ -58,11 +26,7 @@ export default {
   components: { MarkDown },
   data() {
     return {
-      viewedKey: 'AnnouncementViewed',
-      modalConfirmedKey: 'AnnouncementModalConfirmed',
-      dialogVisible: false,
-      modalConfirmed: false,
-      alertViewed: false
+      viewedKey: 'AnnouncementViewed'
     }
   },
   computed: {
@@ -94,200 +58,48 @@ export default {
       const start = new Date(this.announcement.date_start)
       const end = new Date(this.announcement.date_end)
       return now >= start && now <= end
-    },
-    showModal() {
-      return !this.modalConfirmed
-    },
-    showAlert() {
-      return this.modalConfirmed && !this.alertViewed
     }
   },
-  watch: {
-    enabled: {
-      handler(val) {
-        if (val) {
-          this.initializeState()
-          this.checkAndShowDialog()
-        }
-      },
-      immediate: true
-    }
-  },
-  mounted() {
-    this.initializeState()
-    this.checkAndShowDialog()
-  },
   methods: {
-    initializeState() {
-      this.modalConfirmed = this.isModalConfirmed()
-      this.alertViewed = this.isAlertViewed()
-    },
-    checkAndShowDialog() {
-      if (this.enabled && this.showModal) {
-        this.dialogVisible = true
-      }
-    },
-    onModalConfirm() {
-      localStorage.setItem(this.modalConfirmedKey, this.announcement.id)
-      this.modalConfirmed = true
-      this.dialogVisible = false
-
-      this.$emit('announcement-modal-confirmed', {
-        id: this.announcement.id,
-        subject: this.announcement.subject,
-        confirmedAt: new Date().toISOString()
-      })
-    },
-    onAlertClose() {
+    onClose() {
       localStorage.setItem(this.viewedKey, this.announcement.id)
-      this.alertViewed = true
-
-      this.$emit('announcement-read', {
-        id: this.announcement.id,
-        subject: this.announcement.subject,
-        readAt: new Date().toISOString()
-      })
-    },
-    isModalConfirmed() {
-      const confirmedId = localStorage.getItem(this.modalConfirmedKey)
-      return confirmedId === this.announcement.id
-    },
-    isAlertViewed() {
-      const viewedId = localStorage.getItem(this.viewedKey)
-      return viewedId === this.announcement.id
     },
     isViewed() {
-      return this.isAlertViewed()
+      const viewedId = localStorage.getItem(this.viewedKey)
+      return viewedId === this.announcement.id
     }
   }
 }
 </script>
 
 <style lang="scss" scoped>
-.announcement-dialog ::v-deep .el-dialog {
-  border-radius: 5px;
-}
-
-.announcement-dialog ::v-deep .el-dialog__wrapper {
-  backdrop-filter: blur(4px);
-}
-
-@media (max-width: 768px) {
-  .announcement-dialog ::v-deep .el-dialog {
-    width: 95% !important;
-    margin: 0 auto;
-  }
-
-  .announcement-content {
-    padding: 20px 25px 15px;
-
-    .content-wrapper {
-      padding: 15px;
-    }
-  }
-
-  .dialog-footer {
-    .el-button {
-      padding: 10px;
-      font-size: 14px;
-    }
-  }
-}
-
-.announcement-dialog ::v-deep .el-dialog__header {
-  border-radius: 8px 8px 0 0;
-  padding: 10px 20px 10px 20px;
-
-  .el-dialog__title {
-    color: black;
-    font-weight: 600;
-  }
-}
-
-.announcement-dialog ::v-deep .el-dialog__body {
-  padding: 0;
-}
-
-.announcement-content {
-  padding: 25px 30px 20px;
-
-  .link-section {
-    margin-top: 20px;
-    padding-top: 15px;
-    border-top: 1px solid #e4e7ed;
-    text-align: center;
-  }
-}
-
-.dialog-footer {
-  display: flex;
-  justify-content: end;
-  align-items: center;
-
-  .el-button {
-    padding: 10px 20px;
-    font-size: 14px;
-  }
-}
-
 .announcement ::v-deep .el-alert__content {
   width: 100%;
 }
 
+.announcement-main {
+  word-wrap: break-word;
+  white-space: pre-wrap;
+}
+
 .icon {
   vertical-align: text-bottom;
   color: var(--color-info) !important;
-  margin-left: 5px;
 }
 
 .markdown {
   background-color: transparent !important;
-  font-size: 14px;
-  line-height: 1.8;
-  color: #2c3e50;
 
   .link-more {
-    font-size: 13px;
-    color: #409eff !important;
-    text-decoration: none;
-    padding: 4px 8px;
-    border-radius: 4px;
-    background: rgba(64, 158, 255, 0.1);
-    transition: all 0.3s;
-
-    &:hover {
-      background: #409eff;
-      color: white !important;
-    }
+    font-size: 10px;
+    margin-left: 10px;
+    border-bottom: solid 1px;
+    color: var(--color-info) !important;
   }
 
-  h1, h2, h3, h4, h5, h6 {
-    margin: 0 0 15px 0;
-    color: #303133;
-    font-weight: 600;
-    line-height: 1.4;
-  }
-
-  h1 {
-    font-size: 20px;
-  }
-
-  h2 {
-    font-size: 18px;
-  }
-
-  h3 {
-    font-size: 16px;
-  }
-
-  h4, h5, h6 {
-    font-size: 14px;
-  }
-
-  p {
-    margin-bottom: 16px;
-    line-height: 1.8;
-    color: #4b5563;
+  h1, h2, h3, h4, h5 {
+    margin-top: 0;
+    margin-bottom: 10px;
   }
 }
 </style>

src/components/Widgets/Breadcrumb/index.vue

@@ -33,7 +33,7 @@ export default {
       const first = matched[0]
 
       if (!this.isDashboard(first)) {
-        matched = [{ path: '/dashboard', meta: { title: 'dashboard' } }].concat(matched)
+        matched = [{ path: '/dashboard', meta: { title: 'dashboard' }}].concat(matched)
       }
 
       this.levelList = matched.filter(item => item.meta && item.meta.title && item.meta.breadcrumb !== false)

src/components/Widgets/Icon/index.vue

@@ -1,6 +1,6 @@
 <script>
 export default {
-  name: 'Icon',
+  name: 'Index',
   props: {
     icon: {
       type: String,

src/components/index.js

@@ -37,4 +37,3 @@ export { default as Pagination } from './Table/Pagination'
 export { default as Tooltip } from './Widgets/Tooltip'
 export { default as ResourceActivity } from './Apps/ResourceActivity'
 export { default as MarkDown } from './Widgets/MarkDown'
-export { default as VariablesHelpTextDialog } from './Apps/VariablesHelpTextDialog'

src/layout/components/NavHeader/AccountDropdown.vue

@@ -71,7 +71,7 @@ export default {
     },
     async logout() {
       const currentOrg = this.$store.getters.currentOrg
-      if (currentOrg && (currentOrg.autoEnter || currentOrg.is_system)) {
+      if (currentOrg.autoEnter || currentOrg.is_system) {
         await this.$store.dispatch('users/setCurrentOrg', this.$store.getters.preOrg)
       }
       window.location.href = `${process.env.VUE_APP_LOGOUT_PATH}?next=${this.$route.fullPath}`

src/layout/components/NavHeader/Search.vue

@@ -1,633 +0,0 @@
-<template>
-  <span ref="root" class="global-search">
-    <!-- 搜索触发按钮 -->
-    <div class="search-trigger" @click="openPanel">
-      <el-input
-        v-model="search"
-        :placeholder="$t('Search')"
-        class="search-input"
-        readonly
-        prefix-icon="el-icon-search"
-        @keydown.esc.prevent="closePanel"
-        @clear="clearSearch"
-      >
-        <template slot="suffix">
-          <span class="search-shortcut">{{ shortcutText }}</span>
-        </template>
-      </el-input>
-    </div>
-
-    <!-- 搜索模态框 -->
-    <el-dialog
-      :visible.sync="isOpen"
-      :close-on-click-modal="true"
-      :close-on-press-escape="true"
-      :append-to-body="true"
-      custom-class="search-modal"
-      width="70%"
-      @close="closePanel"
-    >
-      <div class="search-modal-content">
-        <!-- 搜索框 -->
-        <div class="search-input-wrapper">
-          <el-input
-            ref="panelSearchInput"
-            v-model="search"
-            :placeholder="$t('Search')"
-            :clearable="true"
-            size="large"
-            prefix-icon="el-icon-search"
-            @input="onInput"
-            @keydown.enter.prevent="onEnter"
-          />
-        </div>
-
-        <!-- 搜索结果内容 -->
-        <div class="search-results">
-          <div v-if="loading" class="section loading">{{ $t('Loading') }}...</div>
-
-          <template v-if="showHistory">
-            <div class="section-title">
-              <span>{{ $t('History') }}</span>
-              <el-link class="clear-history-btn" @click="clearHistory">
-                {{ $t('Clear') }}
-              </el-link>
-            </div>
-            <ul class="list">
-              <li
-                v-for="(item, index) in history"
-                :key="'h-' + index"
-                class="item"
-                @click="applyHistory(item)"
-              >
-                <i class="el-icon-time icon" />
-                <span class="label">{{ item.q }}</span>
-                <i class="el-icon-arrow-right go" />
-              </li>
-            </ul>
-          </template>
-
-          <template v-if="routeSuggestions.length">
-            <div class="section-title">{{ $t('Routes') }}</div>
-            <ul class="list">
-              <li
-                v-for="route in routeSuggestions"
-                :key="'r-' + route.name + route.path"
-                class="item"
-                @click="navigateRoute(route)"
-              >
-                <i class="el-icon-location-outline icon" />
-                <span class="label">{{ route.title || route.name || route.path }}</span>
-                <span class="sub">{{ route.path }}</span>
-              </li>
-            </ul>
-          </template>
-
-          <template v-if="options.length">
-            <div v-for="group in options" :key="'g-' + group.label" class="section">
-              <div class="section-title">{{ group.label }}</div>
-              <ul class="list">
-                <li
-                  v-for="item in group.options"
-                  :key="item.value"
-                  class="item"
-                  @click="handleSearch(item)"
-                >
-                  <Icon :icon="iconMap[item.model] || 'el-icon-document'" class="icon" />
-                  <span class="label">{{ item.name }}</span>
-                  <span class="sub">{{ item.content }}</span>
-                </li>
-              </ul>
-            </div>
-          </template>
-
-          <div v-if="search && isEmpty" class="section empty">
-            {{ $t('NoData') }}
-          </div>
-
-          <div v-if="!search && history.length === 0" class="section placeholder">
-            <div class="placeholder-content">
-              <div class="supported-types">
-                <div class="types-title">{{ $t('SupportedTypes') }}:</div>
-                <div class="types-list">
-                  <span v-for="(icon, type) in iconMap" :key="type" class="type-item">
-                    <Icon :icon="icon" class="type-icon" />
-                    {{ $t(type) }}
-                  </span>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </el-dialog>
-  </span>
-</template>
-
-<script>
-import _ from 'lodash'
-import { mapGetters } from 'vuex'
-import { ObjectLocalStorage } from '@/utils/common'
-import Icon from '@/components/Widgets/Icon/index.vue'
-
-export default {
-  name: 'Search',
-  components: {
-    Icon
-  },
-  data() {
-    return {
-      search: '',
-      loading: false,
-      options: [],
-      isOpen: false,
-      history: [],
-      routeSuggestions: [],
-      routes: [],
-      iconMap: {
-        'Account': 'accounts',
-        'Asset': 'assets',
-        'User': 'user-o',
-        'UserGroup': 'user-group',
-        'AssetPermission': 'permission'
-      },
-      historyStore: new ObjectLocalStorage('globalSearchHistory')
-    }
-  },
-  computed: {
-    ...mapGetters([
-      'viewRoutes'
-    ]),
-    isEmpty() {
-      return !this.routeSuggestions.length && this.options.length === 0
-    },
-    showHistory() {
-      return this.history.length > 0 && !this.search
-    },
-    shortcutText() {
-      return this.isMac ? '⌘K' : 'Ctrl+K'
-    },
-    isMac() {
-      return navigator.platform.toUpperCase().indexOf('MAC') >= 0
-    }
-  },
-  mounted() {
-    this.loadHistory()
-    this.buildRouteSuggestions()
-    this.bindKeyboardShortcut()
-  },
-  beforeDestroy() {
-    this.unbindKeyboardShortcut()
-  },
-  methods: {
-    openPanel() {
-      this.isOpen = true
-      this.buildRouteSuggestions()
-      this.$nextTick(() => {
-        this.$refs.panelSearchInput?.focus()
-      })
-    },
-    closePanel() {
-      this.isOpen = false
-    },
-    onInput() {
-      this.openPanel()
-      this.debouncedQuery()
-    },
-    clearSearch() {
-      this.search = ''
-      this.options = []
-      this.buildRouteSuggestions()
-    },
-    onEnter() {
-      if (this.options.length > 0) {
-        this.handleSearch(this.options[0].options[0])
-      }
-    },
-    debouncedQuery: _.debounce(function() {
-      this.searchQuery(this.search)
-    }, 300),
-    async searchQuery(q) {
-      if (!q) {
-        this.options = []
-        return
-      }
-      this.loading = true
-      const url = '/api/v1/search/?q=' + q
-      try {
-        const res = await this.$axios.get(url)
-        let options = res || []
-        options = _.groupBy(res, 'model_label')
-        this.options = Object.keys(options).map(key => ({
-          label: key,
-          options: options[key]
-        }))
-      } catch (error) {
-        console.error('Search error:', error)
-        this.options = []
-      } finally {
-        this.loading = false
-      }
-    },
-    handleSearch(item) {
-      const route = {
-        name: item.model + 'Detail',
-        params: { id: item.id }
-      }
-      this.addToHistory(this.search)
-      this.$router.push(route)
-      this.closePanel()
-    },
-    navigateRoute(route) {
-      this.$router.push(route.path)
-      this.closePanel()
-    },
-    filterRouteSuggestions(q) {
-      if (!q) {
-        this.routeSuggestions = []
-        return
-      }
-      this.routeSuggestions = this.routes.filter(r => {
-        const title = r.title || r.name || r.path
-        return title.toLowerCase().includes(q.toLowerCase()) || r.path.toLowerCase().includes(q.toLowerCase())
-      }).slice(0, 5)
-    },
-    buildRouteSuggestions() {
-      if (this.routes.length > 0) {
-        return
-      }
-      const allRoutes = this.viewRoutes
-      const flat = []
-      const walk = (routes, parentPath = '') => {
-        for (const r of routes) {
-          const path = parentPath + r.path
-          if (r.path && r.path !== '/' && !r.hidden) {
-            flat.push({
-              name: r.name,
-              path: path,
-              title: r.meta?.title
-            })
-          }
-
-          if (r.children && r.children.length) {
-            walk(r.children, path)
-          }
-        }
-      }
-      walk(allRoutes)
-      this.routes = flat
-    },
-    loadHistory() {
-      this.history = (this.historyStore.get('list') || []).filter(i => i.q)
-    },
-    addToHistory(q) {
-      const entry = { q: q }
-      const list = this.historyStore.get('list') || []
-      const next = [
-        entry,
-        ...list.filter(i => i.q !== entry.q)
-      ].slice(0, 10)
-      this.historyStore.set('list', next)
-      this.history = next
-    },
-    applyHistory(h) {
-      this.search = h.q
-      this.onInput()
-    },
-    clearHistory() {
-      this.historyStore.set('list', [])
-      this.history = []
-    },
-    bindKeyboardShortcut() {
-      document.addEventListener('keydown', this.handleKeyboardShortcut)
-    },
-    unbindKeyboardShortcut() {
-      document.removeEventListener('keydown', this.handleKeyboardShortcut)
-    },
-    handleKeyboardShortcut(event) {
-      // 检查是否按下了正确的快捷键
-      const isCorrectKey = event.key === 'k' || event.key === 'K'
-      const isCorrectModifier = this.isMac ? event.metaKey : event.ctrlKey
-
-      if (isCorrectKey && isCorrectModifier) {
-        // 阻止默认行为
-        event.preventDefault()
-
-        // 如果当前有输入框聚焦，不触发搜索
-        const activeElement = document.activeElement
-        const isInputFocused = activeElement && (
-          activeElement.tagName === 'INPUT' ||
-          activeElement.tagName === 'TEXTAREA' ||
-          activeElement.contentEditable === 'true'
-        )
-
-        if (!isInputFocused) {
-          this.openPanel()
-        }
-      }
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.global-search {
-  position: relative;
-  width: 200px;
-  height: 40px;
-  padding: 5px 0;
-  min-width: 200px;
-
-  .search-trigger {
-    height: 30px;
-    line-height: 1;
-
-    .search-input {
-      height: 30px;
-      line-height: 1;
-      background-color: rgba(255, 255, 255, 0.1);
-      border-radius: 4px;
-      cursor: pointer;
-
-      &:hover {
-        background-color: rgba(0, 0, 0, 0.1);
-      }
-
-      ::v-deep .el-input__inner {
-        height: 30px;
-        line-height: 1;
-        background: transparent;
-        border: none;
-        color: #fff;
-        cursor: pointer;
-      }
-
-      ::v-deep .el-input__inner::placeholder {
-        color: #fff;
-        opacity: 0.7;
-      }
-
-      ::v-deep .el-input__suffix {
-        display: flex;
-        align-items: center;
-        height: 100%;
-      }
-
-      .search-shortcut {
-        color: rgba(255, 255, 255, 0.6);
-        font-size: 11px;
-        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
-        font-weight: 500;
-        letter-spacing: 0.5px;
-        padding: 2px 6px;
-        background: rgba(255, 255, 255, 0.1);
-        border-radius: 3px;
-        border: 1px solid rgba(255, 255, 255, 0.2);
-        user-select: none;
-        pointer-events: none;
-        display: inline-flex;
-        align-items: center;
-        justify-content: center;
-        height: 18px;
-        line-height: 1;
-      }
-    }
-  }
-}
-</style>
-
-<style lang="scss">
-/* 搜索模态框全局样式 */
-.search-modal {
-  &.el-dialog {
-    position: fixed;
-    top: 5px;
-    left: 50%;
-    transform: translateX(-50%);
-    max-height: calc(100vh - 10px);
-    max-width: calc(100vw - 10px);
-    border-radius: 5px;
-    // box-shadow: 0 0 8px 4px #00000014;
-    box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 3px -2px, rgba(0, 0, 0, 0.14) 0px 3px 4px 0px, rgba(0, 0, 0, 0.12) 0px 1px 8px 0px;
-
-    .el-dialog__body {
-      padding: 0;
-    }
-
-    .el-dialog__header {
-      display: none;
-    }
-  }
-}
-
-body .v-modal {
-  opacity: 0.3;
-}
-
-.search-modal-content {
-  height: 70vh;
-  display: flex;
-  flex-direction: column;
-}
-
-.search-input-wrapper {
-  padding: 20px;
-  border-bottom: 1px solid #f0f0f0;
-  // background: #fff;
-
-  .el-input {
-    .el-input__inner {
-      font-size: 14px;
-      height: 34px;
-      line-height: 34px;
-    }
-  }
-}
-
-.search-results {
-  flex: 1;
-  overflow-y: auto;
-  overflow-x: hidden;
-
-  /* 自定义滚动条 */
-  &::-webkit-scrollbar {
-    width: 6px;
-  }
-
-  &::-webkit-scrollbar-track {
-    background: #f1f1f1;
-    border-radius: 3px;
-  }
-
-  &::-webkit-scrollbar-thumb {
-    background: #c1c1c1;
-    border-radius: 3px;
-  }
-
-  &::-webkit-scrollbar-thumb:hover {
-    background: #a8a8a8;
-  }
-}
-
-.section-title {
-  padding: 12px 24px 6px;
-  font-size: 12px;
-  line-height: 1.5;
-  color: #909399;
-  font-weight: 600;
-  text-transform: uppercase;
-  letter-spacing: 0.5px;
-  border-top: 1px solid #f0f0f0;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-
-  .clear-history-btn {
-    background: none;
-    border: none;
-    padding: 4px;
-    cursor: pointer;
-    border-radius: 4px;
-    transition: all 0.2s ease;
-    color: red;
-
-    &:hover {
-      background: #f5f5f5;
-      color: #f56c6c;
-    }
-
-    .clear-icon {
-      font-size: 14px;
-    color: red;
-    }
-  }
-}
-
-.list {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-
-  .item {
-    display: flex;
-    align-items: center;
-    padding: 8px 24px;
-    cursor: pointer;
-    border-bottom: 1px solid #f8f9fa;
-    transition: all 0.2s ease;
-    position: relative;
-
-    &:before {
-      content: '';
-      position: absolute;
-      left: 0;
-      top: 0;
-      bottom: 0;
-      width: 3px;
-      background: transparent;
-      transition: background 0.2s ease;
-    }
-
-    &:hover {
-      background: #f8f9fa;
-    }
-
-    &:last-child {
-      border-bottom: none;
-    }
-
-    .icon {
-      // color: var(--color-primary, #409eff);
-      margin-right: 12px;
-      font-size: 14px;
-      font-weight: 400;
-    }
-
-    .label {
-      flex: 1;
-      font-size: 14px;
-      color: #333;
-      font-weight: 500;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      max-width: 60%;
-    }
-
-    .sub {
-      color: #909399;
-      font-size: 12px;
-      margin-left: 12px;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      flex-shrink: 0;
-      width: 40%;
-      text-align: right;
-    }
-
-    .go {
-      color: #c0c4cc;
-      font-size: 12px;
-      flex-shrink: 0;
-    }
-  }
-}
-
-.loading,
-.empty {
-  padding: 32px 24px;
-  color: #909399;
-  text-align: center;
-  font-size: 14px;
-}
-
-.section.placeholder {
-  padding: 32px 24px;
-
-  .placeholder-content {
-    text-align: center;
-
-    .supported-types {
-      margin-bottom: 24px;
-
-      .types-title {
-        margin-bottom: 12px;
-        font-size: 14px;
-        font-weight: 500;
-        color: #333;
-      }
-
-      .types-list {
-        display: flex;
-        flex-wrap: wrap;
-        justify-content: center;
-        gap: 16px;
-
-        .type-item {
-          display: flex;
-          align-items: center;
-          padding: 8px 12px;
-          background: #f8f9fa;
-          border-radius: 6px;
-          font-size: 13px;
-          color: #666;
-          transition: all 0.2s ease;
-
-          &:hover {
-            background: #e9ecef;
-            color: #333;
-          }
-
-          .type-icon {
-            margin-right: 6px;
-            font-size: 14px;
-            color: #409eff;
-          }
-        }
-      }
-    }
-  }
-}
-</style>
-

src/layout/components/NavHeader/index.vue

@@ -1,9 +1,6 @@
 <template>
   <div class="navbar">
     <ul class="navbar-right">
-      <li class="header-item header-icon none-hover">
-        <Search @search-open="handleSearchOpen" />
-      </li>
       <li class="header-item header-icon">
         <el-tooltip :content="$tc('SiteMessageList')" :open-delay="500" effect="dark">
           <SiteMessages />
@@ -34,18 +31,14 @@
         <AccountDropdown />
       </li>
     </ul>
-    <hamburger
-      :is-active="sidebar.opened"
-      class="hamburger-container is-show-menu"
-      @toggleClick="toggleSideBar"
-    />
+    <hamburger :is-active="sidebar.opened" class="hamburger-container is-show-menu" @toggleClick="toggleSideBar" />
     <ul class="navbar-left">
       <li class="left-item">
         <div class="nav-logo">
           <Logo v-if="showLogo" :collapse="false" />
         </div>
       </li>
-      <li v-if="orgsShow" class="left-item" style="margin-left: 20px">
+      <li v-if="orgsShow" class="left-item" style="margin-left: 20px;">
         <Organization :disabled="orgsDisabled" class="organization" />
       </li>
     </ul>
@@ -64,7 +57,6 @@ import Organization from './Organization'
 import SystemSetting from './SystemSetting'
 import Logo from '../NavLeft/Logo'
 import Language from './Language'
-import Search from './Search'
 
 export default {
   components: {
@@ -77,22 +69,19 @@ export default {
     SiteMessages,
     SystemSetting,
     Logo,
-    Language,
-    Search
+    Language
   },
   data() {
-    return {
-      searchOpen: false
-    }
+    return {}
   },
   computed: {
-    ...mapGetters(['sidebar', 'publicSettings', 'currentOrgRoles', 'currentViewRoute', 'isMobile']),
+    ...mapGetters([
+      'sidebar', 'publicSettings', 'currentOrgRoles', 'currentViewRoute', 'isMobile'
+    ]),
     ticketsEnabled() {
-      return (
-        this.publicSettings['TICKETS_ENABLED'] &&
+      return this.publicSettings['TICKETS_ENABLED'] &&
         this.$hasLicense() &&
         this.$hasPerm('tickets.view_ticket')
-      )
     },
     showLogo() {
       return this.$store.state.settings.sidebarLogo
@@ -101,188 +90,178 @@ export default {
       return this.$route.meta?.disableOrgsChange === true
     },
     orgsShow() {
-      return this.$route.meta?.showOrganization !== false && this.$hasLicense()
+      return (this.$route.meta?.showOrganization !== false) && this.$hasLicense()
     }
   },
   methods: {
     toggleSideBar() {
       this.$store.dispatch('app/toggleSideBar')
-    },
-    handleSearchOpen(val) {
-      // this.searchOpen = val
     }
   }
 }
 </script>
 <style lang="scss" scoped>
-@import '~@/styles/variables.scss';
+  @import "~@/styles/variables.scss";
 
-.navbar {
-  position: relative;
-  overflow: hidden;
-  background-color: var(--banner-bg);
+  .navbar {
+    position: relative;
+    overflow: hidden;
+    background-color: var(--banner-bg);
 
-  ul {
-    margin: 0;
-    padding-inline-start: 0;
-  }
+    ul {
+      margin: 0;
+      padding-inline-start: 0;
+    }
 
-  .is-show-menu {
-    display: none;
-  }
+    .is-show-menu {
+      display: none;
+    }
 
-  .hamburger-container {
-    float: left;
-    height: 25px;
-    line-height: 25px;
-    margin: 8px;
-    padding: 1px 8px !important;
-    border-radius: 5px;
-    border-color: $--color-primary;
-    background-color: white;
-    color: var(--text-primary);
-    cursor: pointer;
-    transition: 0.2s;
-    opacity: 0.7;
-  }
+    .hamburger-container {
+      float: left;
+      height: 25px;
+      line-height: 25px;
+      margin: 8px;
+      padding: 1px 8px !important;
+      border-radius: 5px;
+      border-color: $--color-primary;
+      background-color: white;
+      color: var(--text-primary);
+      cursor: pointer;
+      transition: .2s;
+      opacity: 0.7;
+    }
 
-  .navbar-left {
-    float: left;
-    display: flex;
-    height: 100%;
-
-    .left-item {
+    .navbar-left {
+      float: left;
       display: flex;
-      align-items: center;
-      list-style: none;
+      height: 100%;
 
-      .nav-logo {
-        width: 200px;
+      .left-item {
+        display: flex;
+        align-items: center;
+        list-style: none;
+
+        .nav-logo {
+          width: 200px;
+
+          &:hover {
+            background: rgba(0, 0, 0, 12%);
+          }
+        }
+
+        .organization {
+          display: flex;
+          align-items: center;
+          padding: 0 0 0 15px !important;
+          border-radius: 3px;
+          background-color: rgba(255, 255, 255, .10);
+          color: #fff;
+          font-weight: 600;
+          font-size: 15px;
+          max-width: 250px;
+
+          ::v-deep .el-input__inner {
+            padding-left: 25px;
+          }
+
+          ::v-deep .el-input.is-disabled > input {
+            background: none;
+          }
+
+          &:hover {
+            background-color: rgba(0, 0, 0, .12) !important;
+          }
+        }
+
+        // 未找到与之对应的
+        & ::v-deep .el-submenu__title {
+          font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
+          padding: 0 8px;
+          line-height: $headerHeight;
+          height: $headerHeight;
+        }
+
+        // 未找到与之对应的
+        & ::v-deep .svg-icon {
+          color: #FFF !important;
+        }
+      }
+    }
+
+    .navbar-right {
+      display: flex;
+      float: right;
+      align-items: center;
+      margin-right: 10px;
+
+      .header-item {
+        display: flex;
+        line-height: $headerHeight;
+        padding-right: 10px;
+        padding-left: 10px;
+
+        & ::v-deep .svg-icon {
+          line-height: 40px;
+          color: #FFF !important;
+          font-size: 15px;
+        }
+
+        & ::v-deep .el-badge {
+          vertical-align: top;
+
+          .el-link {
+            vertical-align: baseline;
+          }
+
+          .el-badge__content--primary {
+            background-color: #fff;
+          }
+
+          .el-badge__content {
+            top: 8px;
+            height: 15px;
+            line-height: 15px;
+            border: none;
+            color: var(--color-primary);
+          }
+        }
+
+        & ::v-deep i {
+          color: #FFF;
+          font-size: 16px;
+
+          &.el-icon-arrow-down {
+            font-size: 13px;
+          }
+        }
+
+        & ::v-deep i.el-dialog__close.el-icon-close {
+          color: #7c7e7f;
+        }
 
         &:hover {
           background: rgba(0, 0, 0, 12%);
         }
       }
+    }
+  }
 
-      .organization {
-        display: flex;
-        align-items: center;
-        padding: 0 0 0 15px !important;
-        border-radius: 3px;
-        background-color: rgba(255, 255, 255, 0.1);
-        color: #fff;
-        font-weight: 600;
-        font-size: 15px;
-        max-width: 250px;
-
-        ::v-deep .el-input__inner {
-          padding-left: 25px;
-        }
-
-        ::v-deep .el-input.is-disabled > input {
-          background: none;
-        }
-
-        &:hover {
-          background-color: rgba(0, 0, 0, 0.12) !important;
-        }
+  @media screen and (max-width: 1006px) {
+    .navbar {
+      .is-show-menu {
+        display: block;
       }
 
-      // 未找到与之对应的
-      & ::v-deep .el-submenu__title {
-        font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
-        padding: 0 8px;
-        line-height: $headerHeight;
-        height: $headerHeight;
-      }
-
-      // 未找到与之对应的
-      & ::v-deep .svg-icon {
-        color: #fff !important;
+      .navbar-left {
+        display: none;
       }
     }
   }
 
-  .navbar-right {
-    display: flex;
-    float: right;
-    align-items: center;
-    margin-right: 10px;
-
-    .header-item {
-      display: flex;
-      line-height: $headerHeight;
-      padding-right: 10px;
-      padding-left: 10px;
-
-      & ::v-deep .svg-icon {
-        line-height: 40px;
-        color: #fff;
-        font-size: 15px;
-      }
-
-      & ::v-deep .el-badge {
-        vertical-align: top;
-
-        .el-link {
-          vertical-align: baseline;
-        }
-
-        .el-badge__content--primary {
-          background-color: #fff;
-        }
-
-        .el-badge__content {
-          top: 8px;
-          height: 15px;
-          line-height: 15px;
-          border: none;
-          color: var(--color-primary);
-        }
-      }
-
-      & ::v-deep i {
-        color: #fff;
-        font-size: 16px;
-
-        &.el-icon-arrow-down {
-          font-size: 13px;
-        }
-      }
-
-      & ::v-deep i.el-dialog__close.el-icon-close {
-        color: #7c7e7f;
-      }
-
-      &.none-hover {
-        padding: 0;
-        &:hover {
-          background: none;
-        }
-      }
-
-      &:hover {
-        background: rgba(0, 0, 0, 12%);
-      }
+  @media screen and (max-width: 480px) {
+    .active-menu {
+      display: none !important;;
     }
   }
-}
-
-@media screen and (max-width: 1006px) {
-  .navbar {
-    .is-show-menu {
-      display: block;
-    }
-
-    .navbar-left {
-      display: none;
-    }
-  }
-}
-
-@media screen and (max-width: 480px) {
-  .active-menu {
-    display: none !important;
-  }
-}
 </style>

src/layout/components/NavLeft/index.vue

@@ -1,24 +1,18 @@
 <template>
-  <div
-    :class="{ 'has-logo': showLogo, 'show-orgs': showOrgs, collapsed: isCollapse }"
-    class="left-side-wrapper"
-  >
+  <div :class="{'has-logo': showLogo, 'show-orgs': showOrgs, 'collapsed': isCollapse}" class="left-side-wrapper">
     <div class="nav-header">
       <div class="active-mobile">
         <Organization v-if="$hasLicense()" class="organization" />
       </div>
       <div class="nav-title">
         <span :class="switchViewOtherClasses" class="switch-view active-switch-view">
-          <el-popover :open-delay="200" placement="right-start" trigger="hover">
+          <el-popover
+            :open-delay="200"
+            placement="right-start"
+            trigger="hover"
+          >
             <span slot="reference" style="width: 100%">
-              <el-tooltip
-                v-show="!isCollapse"
-                :content="isRouteMeta.title"
-                :open-delay="1000"
-                placement="bottom"
-                effect="dark"
-                class="view-title"
-              >
+              <el-tooltip v-show="!isCollapse" :content="isRouteMeta.title" :open-delay="1000" placement="bottom" effect="dark" class="view-title">
                 <span class="text-overflow">{{ isRouteMeta.title || '' }}</span>
               </el-tooltip>
               <span class="icon-zone">
@@ -55,14 +49,10 @@
     </div>
     <div class="nav-footer">
       <div class="toggle-bar">
-        <Hamburger
-          :is-active="sidebar.opened"
-          class="hamburger-container"
-          @toggleClick="toggleSideBar"
-        />
+        <Hamburger :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
       </div>
     </div>
-    <div :class="{ 'is-show': viewShown }" class="mobile-menu" @click="viewShown = false">
+    <div :class="{'is-show': viewShown}" class="mobile-menu" @click="viewShown = false">
       <ViewSwitcher :mode="'vertical'" />
     </div>
   </div>
@@ -91,7 +81,10 @@ export default {
     }
   },
   computed: {
-    ...mapGetters(['currentViewRoute', 'sidebar']),
+    ...mapGetters([
+      'currentViewRoute',
+      'sidebar'
+    ]),
     defaultOpensMenu() {
       return []
     },
@@ -134,7 +127,8 @@ export default {
       return this.currentViewRoute.meta || {}
     }
   },
-  mounted() {},
+  mounted() {
+  },
   methods: {
     toggleSideBar() {
       this.$store.dispatch('app/toggleSideBar')
@@ -149,9 +143,7 @@ export default {
       }, 500)
     },
     setLeastMenuOpen() {
-      const hasOpened = document.querySelector(
-        '.el-submenu-sidebar.submenu-item.el-submenu.is-opened'
-      )
+      const hasOpened = document.querySelector('.el-submenu-sidebar.submenu-item.el-submenu.is-opened')
       if (hasOpened) {
         return
       }
@@ -164,7 +156,7 @@ export default {
 }
 </script>
 <style lang="scss" scoped>
-@import '~@/styles/variables.scss';
+@import "~@/styles/variables.scss";
 
 $mobileHeight: 40px;
 $origin-color: #ffffff;
@@ -243,7 +235,7 @@ $hover-border-color: #d2d2d2;
 
           .view-title {
             width: calc(100% - 10px);
-            display: inline-block;
+            display: inline-block
           }
 
           .icon-zone {
@@ -307,7 +299,7 @@ $hover-border-color: #d2d2d2;
   }
 
   .is-show {
-    display: block !important;
+    display: block !important;;
   }
 
   .mobile-menu {

src/router/audit/index.js

@@ -90,8 +90,7 @@ export default {
       meta: {
         title: i18n.t('Report'),
         icon: 'report',
-        permissions: [],
-        licenseRequired: true
+        permissions: []
       },
       children: ReportsRoutes
     }

src/router/audit/reports.js

@@ -18,7 +18,7 @@ export default [
         component: () => import('@/views/reports/users/index.vue'),
         meta: {
           title: i18n.t('UserReport'),
-          permissions: ['rbac.view_userloginreport | rbac.view_userchangepasswordreport']
+          permissions: []
         }
       }
     ]
@@ -40,7 +40,7 @@ export default [
         component: () => import('@/views/reports/assets/index.vue'),
         meta: {
           title: i18n.t('AssetReport'),
-          permissions: ['rbac.view_assetactivityreport | rbac.view_assetstatisticsreport']
+          permissions: []
         }
       }
     ]
@@ -62,7 +62,7 @@ export default [
         component: () => import('@/views/reports/accounts/index.vue'),
         meta: {
           title: i18n.t('AccountReport'),
-          permissions: ['rbac.view_accountstatisticsreport | rbac.view_accountautomationreport']
+          permissions: []
         }
       }
     ]

src/router/console/accounts.js

@@ -22,7 +22,6 @@ export default [
         component: () => import('@/views/accounts/Account/index.vue'),
         meta: {
           title: i18n.t('AssetAccount'),
-          showInSearch: true,
           app: 'accounts',
           permissions: ['accounts.view_account']
         }
@@ -30,8 +29,8 @@ export default [
       {
         path: ':id',
         component: () => import('@/views/accounts/Account/AccountDetail/index.vue'),
-        name: 'AccountDetail',
-        meta: { title: i18n.t('AccountDetail') },
+        name: 'AssetAccountDetail',
+        meta: { title: i18n.t('AssetAccountDetail') },
         hidden: true
       }
     ]

src/router/console/assets.js

@@ -20,7 +20,7 @@ export default [
         path: '',
         name: 'AssetList',
         component: () => import('@/views/assets/Asset/AssetList/index.vue'),
-        meta: { title: i18n.t('AssetList'), showInSearch: true }
+        meta: { title: i18n.t('AssetList') }
       },
       {
         path: ':id',

src/router/console/index.js

@@ -22,7 +22,6 @@ export default {
     showNavSwitcher: () => {
       return store.getters.consoleOrgs.length > 0
     },
-
     permissions: []
   },
   children: [

src/router/console/sessions.js

@@ -34,12 +34,14 @@ export default [
   {
     path: `${BASE_URL}/luna/?_=${Date.now()}`,
     name: 'WebTerminal',
+    // component: () => window.open(`/luna/?_=${Date.now()}`),
     meta: { title: i18n.t('WebTerminal') }
     // hidden: true
   },
   {
     path: `${BASE_URL}/koko/elfinder/sftp/?`,
     name: 'FileManagement',
+    // component: () => window.open(`/koko/elfinder/sftp/?`),
     meta: { title: i18n.t('FileManagement') }
   }
 ]

src/router/reports/accounts.js

@@ -6,7 +6,7 @@ export default [
     component: () => import('@/views/reports/accounts/AccountStatistics.vue'), // Parent router-view
     name: 'AccountStatistics',
     meta: {
-      permissions: ['rbac.view_accountstatisticsreport'],
+      permissions: [],
       expanded: true,
       icon: 'user-o',
       title: i18n.t('AccountStatisticsReport')
@@ -17,7 +17,7 @@ export default [
     component: () => import('@/views/reports/accounts/AccountAutomation.vue'), // Parent router-view
     name: 'AccountAutomationReport',
     meta: {
-      permissions: ['rbac.view_accountautomationreport'],
+      permissions: [],
       expanded: true,
       icon: 'user-o',
       title: i18n.t('AccountAutomationReport')

src/router/reports/assets.js

@@ -6,7 +6,7 @@ export default [
     component: () => import('@/views/reports/assets/AssetActivity.vue'), // Parent router-view
     name: 'AssetReport',
     meta: {
-      permissions: ['rbac.view_assetactivityreport'],
+      permissions: [],
       icon: 'user-o',
       expanded: true,
       title: i18n.t('AssetActivityReport')
@@ -17,7 +17,7 @@ export default [
     component: () => import('@/views/reports/assets/AssetStatistics.vue'), // Parent router-view
     name: 'AssetStatistics',
     meta: {
-      permissions: ['rbac.view_assetstatisticsreport'],
+      permissions: [],
       expanded: true,
       icon: 'user-o',
       title: i18n.t('AssetStatisticsReport')

src/router/reports/dashboard.js

@@ -1,48 +0,0 @@
-import i18n from '@/i18n/i18n'
-
-export default [
-  {
-    path: 'console',
-    component: () => import('@/views/reports/console/index.vue'), // Parent router-view
-    name: 'ConsoleReport',
-    meta: {
-      permissions: ['rbac.view_console'],
-      icon: 'user-o',
-      expanded: true,
-      title: i18n.t('ConsoleReport')
-    }
-  },
-  {
-    path: 'pam',
-    component: () => import('@/views/reports/pam/Dashboard/index.vue'), // Parent router-view
-    name: 'PamReport',
-    meta: {
-      permissions: ['rbac.view_pam'],
-      expanded: true,
-      icon: 'user-o',
-      title: i18n.t('PamReport')
-    }
-  },
-  {
-    path: 'audits',
-    component: () => import('@/views/reports/audits/Dashboard.vue'), // Parent router-view
-    name: 'AuditsReport',
-    meta: {
-      permissions: ['rbac.view_audits'],
-      expanded: true,
-      icon: 'user-o',
-      title: i18n.t('AuditsReport')
-    }
-  },
-  {
-    path: 'change-secret',
-    component: () => import('@/views/reports/pam/ChangeSecret/index.vue'),
-    name: 'ChangeSecretReport',
-    meta: {
-      permissions: ['accounts.view_changesecretautomation'],
-      expanded: true,
-      icon: 'user-o',
-      title: i18n.t('ChangeSecretReport')
-    }
-  }
-]

src/router/reports/index.js

@@ -4,7 +4,6 @@ import empty from '@/layout/empty'
 import users from './users'
 import assets from './assets'
 import accounts from './accounts'
-import dashboard from './dashboard'
 
 export default {
   path: '/reports',
@@ -18,18 +17,6 @@ export default {
     permissions: []
   },
   children: [
-    {
-      path: '/reports/dashboard',
-      component: empty,
-      redirect: 'dashboard',
-      name: 'ReportsDashboard',
-      meta: {
-        title: i18n.t('ReportsDashboard'),
-        icon: 'reports',
-        permissions: []
-      },
-      children: dashboard
-    },
     {
       path: '/reports/users',
       component: empty,

src/router/reports/users.js

@@ -6,7 +6,7 @@ export default [
     component: () => import('@/views/reports/users/UserActivity.vue'), // Parent router-view
     name: 'UserReport',
     meta: {
-      permissions: ['rbac.view_userloginreport'],
+      permissions: [],
       icon: 'user-o',
       expanded: true,
       title: i18n.t('UserLoginReport')
@@ -17,7 +17,7 @@ export default [
     component: () => import('@/views/reports/users/ChangePassword.vue'), // Parent router-view
     name: 'ChangePassword',
     meta: {
-      permissions: ['rbac.view_userchangepasswordreport'],
+      permissions: [],
       expanded: true,
       icon: 'user-o',
       title: i18n.t('UserChangePasswordReport')

src/styles/index.scss

@@ -2,7 +2,7 @@
 //@import './transition.scss';
 @import './sidebar.scss';
 @import './menu.scss';
-@import './fonts.scss';
+@import "./fonts.scss";
 @import './fonts/font-awesome.min.css';
 
 ::-webkit-scrollbar {
@@ -24,7 +24,7 @@
 
 ::-webkit-scrollbar-thumb {
   border-radius: 8px;
-  box-shadow: 8px 10px 20px #c6c6c6 inset;
+  box-shadow: 8px 10px 20px #C6C6C6 inset;
   border-left: 2px solid rgba(0, 0, 0, 0);
 }
 
@@ -38,7 +38,7 @@ body {
   -moz-osx-font-smoothing: grayscale;
   -webkit-font-smoothing: auto;
   color: var(--color-text-primary);
-  font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+  font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
   font-size: 13px;
   line-height: 1.428;
 }
@@ -84,7 +84,7 @@ div:focus {
     visibility: hidden;
     display: block;
     font-size: 0;
-    content: ' ';
+    content: " ";
     clear: both;
     height: 0;
   }
@@ -94,8 +94,7 @@ div:focus {
   background-color: #ffffff;
 }
 
-.small,
-small {
+.small, small {
   font-size: 85%;
 }
 
@@ -103,8 +102,7 @@ small {
   color: $--color-primary;
 }
 
-b,
-strong {
+b, strong {
   font-weight: 700;
 }
 
@@ -116,37 +114,19 @@ p {
   margin: 0 0 10px;
 }
 
-.h1,
-.h2,
-.h3,
-.h4,
-.h5,
-.h6,
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
+.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
   font-family: inherit;
   font-weight: 500;
   line-height: 1.1;
   color: inherit;
 }
 
-.h4,
-.h5,
-.h6,
-h4,
-h5,
-h6 {
+.h4, .h5, .h6, h4, h5, h6 {
   margin-top: 10px;
   margin-bottom: 10px;
 }
 
-h3,
-h4,
-h5 {
+h3, h4, h5 {
   margin-top: 5px;
   font-weight: 600;
 }
@@ -155,12 +135,8 @@ h4 {
   font-size: 14px;
 }
 
-button,
-input,
-optgroup,
-select,
-textarea {
-  font-family: 'Open Sans', sans-serif !important;
+button, input, optgroup, select, textarea {
+  font-family: "Open Sans", sans-serif !important;
 }
 
 // main-container global css
@@ -201,7 +177,7 @@ textarea {
   word-break: keep-all;
 }
 
-input[type='file'] {
+input[type=file] {
   font-size: 12px;
   opacity: 80;
 }
@@ -238,6 +214,7 @@ input[type='file'] {
   overflow: auto;
 }
 
+
 .el-input.is-disabled .el-input__inner {
   color: #737373 !important;
 }
@@ -279,7 +256,7 @@ input[type='file'] {
     color: var(--color-text-primary);
 
     a {
-      color: #1c84c6;
+      color: #1c84c6
     }
   }
 
@@ -326,7 +303,7 @@ input[type='file'] {
       white-space: nowrap;
 
       &:hover {
-        border-right: 2px solid #ebeef5;
+        border-right: 2px solid #EBEEF5;
       }
     }
 
@@ -337,7 +314,7 @@ input[type='file'] {
     }
 
     &:last-child {
-      border-right: 1px solid #ebeef5 !important;
+      border-right: 1px solid #EBEEF5 !important;
 
       .cell {
         border-right: none;
@@ -376,7 +353,7 @@ input[type='file'] {
 
       &:last-child {
         padding: 0;
-        border-right: 1px solid #ebeef5 !important;
+        border-right: 1px solid #EBEEF5 !important;
 
         .cell {
           vertical-align: unset;
@@ -414,8 +391,7 @@ input[type='file'] {
   font-weight: 400;
 }
 
-.el-drawer.rtl,
-.drawer-panel {
+.el-drawer.rtl, .drawer-panel {
   border-radius: 5px 0 0 5px;
 }
 
@@ -423,15 +399,13 @@ input[type='file'] {
   color: #909399 !important;
 }
 
-.el-button.el-button--small,
-.el-button--small.is-round {
+.el-button.el-button--small, .el-button--small.is-round {
   font-weight: 400;
   padding: 8px 12px;
   border-radius: 2px;
 }
 
-.el-button.el-button--mini,
-.el-button--mini.is-round {
+.el-button.el-button--mini, .el-button--mini.is-round {
   font-size: 0.7rem;
   font-weight: 400;
   border-radius: 2px;
@@ -461,19 +435,18 @@ input[type='file'] {
   }
 
   .el-input__icon {
-    vertical-align: super;
+    vertical-align: super
   }
 }
 
-.el-form .el-input__inner,
-.el-dialog__body .el-input__inner {
+.el-form .el-input__inner, .el-dialog__body .el-input__inner {
   height: 30px;
   font-size: 13px;
 }
 
 .el-input input::placeholder {
   font-weight: 400 !important;
-  font-family: 'Open Sans', sans-serif;
+  font-family: "Open Sans", sans-serif;
   font-size: 13px;
 }
 
@@ -517,19 +490,19 @@ $tooltip-arrow-color: #c2d1e1;
 
 // 使用 SCSS 的嵌套和变量来简化代码
 .el-tooltip__popper.is-light {
-  &[x-placement^='right'] .popper__arrow {
+  &[x-placement^=right] .popper__arrow {
     border-right-color: $tooltip-arrow-color !important;
   }
 
-  &[x-placement^='left'] .popper__arrow {
+  &[x-placement^=left] .popper__arrow {
     border-left-color: $tooltip-arrow-color !important;
   }
 
-  &[x-placement^='top'] .popper__arrow {
+  &[x-placement^=top] .popper__arrow {
     border-top-color: $tooltip-arrow-color !important;
   }
 
-  &[x-placement^='bottom'] .popper__arrow {
+  &[x-placement^=bottom] .popper__arrow {
     border-bottom-color: $tooltip-arrow-color !important;
   }
 }
@@ -625,6 +598,7 @@ li.rmenu i.fa {
   }
 }
 
+
 //.link-btn {
 //  span {
 //    color: var(--color-link);
@@ -649,12 +623,12 @@ li.rmenu i.fa {
 }
 
 .el-input-number {
-  .el-input-number__decrease,
-  .el-input-number__increase {
+  .el-input-number__decrease, .el-input-number__increase {
     line-height: 26px;
   }
 }
 
+
 .el-form--label-top.el-form {
   //.el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label:after {
   //  content: '*';
@@ -665,6 +639,7 @@ li.rmenu i.fa {
   }
 }
 
+
 .el-form-item {
   .CodeMirror {
     height: 200px;
@@ -731,11 +706,3 @@ div.el-loading-parent--relative {
 .el-drawer__header .drawer-title {
   color: var(--color-text-primary);
 }
-
-.margin-top-10 {
-  margin-top: 10px;
-}
-
-.margin-top-20 {
-  margin-top: 20px;
-}

src/utils/vue/index.js

@@ -21,16 +21,3 @@ export function getComponentFromRoute(route, router) {
   }
   return r.components.default
 }
-
-export function getRouteUrl(route, router) {
-  if (typeof route === 'string') {
-    route = { name: route }
-  }
-
-  const r = router.match(route)
-
-  if (!r) {
-    return
-  }
-  return r.path
-}

src/utils/vue/message.js

@@ -1,18 +1,11 @@
+// 重置message，防止重复点击重复弹出message弹框
 import { Message as elMessage } from 'element-ui'
 import { toSentenceCase } from '@/utils/common/index'
 
 let messageDom = null
-const DEFAULT_Z_INDEX = 20000
-
 const message = options => {
+  // 判断弹窗是否已存在, 若存在则关闭
   if (messageDom) messageDom.close()
-
-  if (typeof options === 'string') {
-    options = { message: options }
-  }
-
-  options.zIndex = options.zIndex || DEFAULT_Z_INDEX
-
   messageDom = elMessage(options)
 }
 

src/views/accounts/AccountChangeSecret/Overview/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div v-if="this.$hasPerm('accounts.view_changesecretautomation')" class="change-secret-container">
-    <ChangeSecretReport :nav="false" :only-charts="true" />
+    <ChangeSecretReport :nav="false" />
   </div>
 </template>
 

src/views/assets/Asset/AssetCreateUpdate/DatabaseCreateUpdate.vue

@@ -86,8 +86,6 @@ export default {
           component: UploadKey
         }
       }
-
-      fieldsMeta['db_name']['rules'] = []
       if (['mongodb', 'postgresql'].indexOf(platform) !== -1) {
         fieldsMeta['db_name']['rules'] = [rules.Required]
       }

src/views/assets/Asset/AssetList/DatabaseList.vue

@@ -22,7 +22,7 @@ export default {
               icon: 'cloud-provider',
               has: () => this.$hasPerm('xpack.view_account') && this.$hasLicense(),
               callback: () => this.$router.push(
-                { name: 'CloudAccountList', query: { category: 'database' } }
+                { name: 'CloudAccountList', query: { category: 'database' }}
               )
             }
           ]

src/views/assets/Cloud/Account/components/ResultPanel.vue

@@ -50,7 +50,7 @@ export default {
   },
   methods: {
     handleClick() {
-      this.$router.push({ name: 'CloudAccountDetail', params: { id: this.object.id } })
+      this.$router.push({ name: 'CloudAccountDetail', params: { id: this.object.id }})
       this.handleClose()
     },
     handleClose() {

src/views/assets/Cloud/Account/components/TimingPanel.vue

@@ -58,7 +58,7 @@ export default {
           }
         ],
         getNextRoute: (res, method) => {
-          return { name: 'CloudAccountDetail', params: { id: res.account.id } }
+          return { name: 'CloudAccountDetail', params: { id: res.account.id }}
         }
       }
     }

src/views/assets/Cloud/Strategy/StrategyCreateUpdate.vue

@@ -36,8 +36,8 @@ export default {
           component: ActionInput
         }
       },
-      updateSuccessNextRoute: { name: 'CloudAccountList', params: { activeMenu: 'StrategyList' } },
-      createSuccessNextRoute: { name: 'CloudAccountList', params: { activeMenu: 'StrategyList' } },
+      updateSuccessNextRoute: { name: 'CloudAccountList', params: { activeMenu: 'StrategyList' }},
+      createSuccessNextRoute: { name: 'CloudAccountList', params: { activeMenu: 'StrategyList' }},
       cleanFormValue: (value) => {
         value['category'] = this.$route.query.category || 'host'
         return value

src/views/assets/Platform/PlatformDetail/PlatformDetailUpdateDialog.vue

@@ -38,7 +38,7 @@ export default {
   data() {
     return {
       initial: {},
-      successUrl: { name: 'Settings', params: { activeMenu: 'Basic' } },
+      successUrl: { name: 'Settings', params: { activeMenu: 'Basic' }},
       url: `/api/v1/assets/platforms/`,
       hasReset: false,
       hasDetailInMsg: false,

src/views/assets/Platform/PlatformList.vue

@@ -110,7 +110,7 @@ export default {
             formatterArgs: {
               canClone: () => vm.$hasPerm('assets.add_platform'),
               onClone({ row }) {
-                vm.$refs.genericListTable.onClone({ row, query: { type: row.type.value, category: row.category.value } })
+                vm.$refs.genericListTable.onClone({ row, query: { type: row.type.value, category: row.category.value }})
               },
               canUpdate: ({ row }) => !row.internal && vm.$hasPerm('assets.change_platform'),
               canDelete: ({ row }) => !row.internal && vm.$hasPerm('assets.delete_platform'),
@@ -140,7 +140,7 @@ export default {
         },
         moreCreates: {
           callback: (item) => {
-            this.$refs.genericListTable.onCreate({ query: { type: item.name, category: item.category } })
+            this.$refs.genericListTable.onCreate({ query: { type: item.name, category: item.category }})
           },
           dropdown: []
         }
@@ -167,7 +167,7 @@ export default {
 
     if (platform) {
       this.$nextTick(() => {
-        this.$refs.genericListTable.onDetail({ row: { id: platform, name } })
+        this.$refs.genericListTable.onDetail({ row: { id: platform, name }})
       })
     }
   },

src/views/assets/Zone/ZoneDetail/GatewayCreateUpdate.vue

@@ -13,7 +13,7 @@ export default {
   data() {
     return {
       url: '/api/v1/assets/gateways/',
-      updateInitial: async (initial) => {
+      updateInitial: async(initial) => {
         const url = `/api/v1/assets/platforms/?name__startswith=Gateway`
         const platform = await this.$axios.get(url)
         initial.platform = parseInt(platform[0].id)

src/views/assets/Zone/ZoneDetail/GatewayList.vue

@@ -116,7 +116,7 @@ export default {
                 query: { zone: this.object.id, platform_type: 'linux', 'category': 'host' }
               },
               onClone: ({ row }) => {
-                this.$refs.ListTable.onClone({ row: { ...row, payload: 'pam_asset_clone' } })
+                this.$refs.ListTable.onClone({ row: { ...row, payload: 'pam_asset_clone' }})
               },
               performDelete: ({ row }) => {
                 const id = row.id
@@ -175,16 +175,16 @@ export default {
             name: 'GatewayAdd',
             title: this.$t('Add'),
             can: !this.$store.getters.currentOrgIsRoot,
-            callback: async () => {
+            callback: async() => {
               // 由于修改成为了抽屉形式，导致传入到 AddGateway 组件中的 obj 任然为最初的数量，就会导致新增的 item 依然会出现可选的情况
               // 此时修改为在打开 AddGateway 额外从 tableConfig.url 的接口中获取最新的 gateways 数目
               try {
                 const res = await this.$axios.get(this.tableConfig.url)
 
-                if (res && res.results) {
+                if (res) {
                   this.transObject = {
                     ...this.object,
-                    gateways: res.results.map(item => {
+                    gateways: res.map(item => {
                       return {
                         name: item.name,
                         id: item.id
@@ -203,7 +203,7 @@ export default {
           }
         ],
         onCreate: () => {
-          vm.$refs.ListTable.onCreate({ query: { zone: vm.object.id, platform_type: 'linux', category: 'host' } })
+          vm.$refs.ListTable.onCreate({ query: { zone: vm.object.id, platform_type: 'linux', category: 'host' }})
         }
       },
       addGatewaySetting: {

src/views/dashboard/Audit/index.vue

@@ -2,7 +2,7 @@
   <Page>
     <div v-if="this.$hasPerm('rbac.view_audit')">
       <Announcement />
-      <AuditReport :only-charts="true" :nav="false" />
+      <AuditReport :only-charts="true" />
     </div>
     <Page403 v-else />
   </Page>

src/views/dashboard/Console/index.vue

@@ -2,7 +2,7 @@
   <Page>
     <div v-if="this.$hasPerm('rbac.view_console')">
       <Announcement />
-      <ConsoleReport :nav="false" :only-charts="true" />
+      <ConsoleReport :nav="false" />
     </div>
     <Page403 v-else />
   </Page>

src/views/dashboard/Pam/index.vue

@@ -2,7 +2,7 @@
   <Page>
     <div v-if="this.$hasPerm('rbac.view_pam')">
       <Announcement />
-      <PamReport :nav="false" :only-charts="true" />
+      <PamReport :nav="false" />
     </div>
     <Page403 v-else />
   </Page>

src/views/labels/BindDialog.vue

@@ -55,7 +55,7 @@ export default {
   },
   data() {
     const vm = this
-    const getPageData = async ({ pageIndex, pageSize, keyword }) => {
+    const getPageData = async({ pageIndex, pageSize, keyword }) => {
       const limit = pageSize
       const offset = (pageIndex - 1) * pageSize
       const params = {

src/views/ops/Adhoc/QuickJob.vue

@@ -141,7 +141,7 @@ export default {
             align: 'left',
             value: '',
             placeholder: this.$tc('EnterRunUser'),
-            // tip: this.$tc('RunasHelpText'),
+            tip: this.$tc('RunasHelpText'),
             el: {
               autoComplete: true,
               query: (query, cb) => {
@@ -151,7 +151,7 @@ export default {
                   this.$message.warning(`${this.$t('RequiredAssetOrNode')}`)
                   return cb([])
                 }
-                cb([]) // 先返回空，避免输入时出现下拉闪烁
+
                 this.$axios.post('/api/v1/ops/username-hints/', {
                   nodes: nodes,
                   assets: hosts,

src/views/ops/File/index.vue

@@ -181,7 +181,6 @@ export default {
           autoComplete: true,
           query: (query, cb) => {
             const { hosts, nodes } = this.getSelectedNodesAndHosts()
-            cb([]) // 先返回空，避免输入时出现下拉闪烁
             this.$axios.post('/api/v1/ops/username-hints/', {
               nodes: nodes,
               assets: hosts,
@@ -523,8 +522,7 @@ export default {
   min-width: 925px;
 
   ::v-deep .el-card__body {
-    > div:first-child {
-      //不要影响到 el-progress
+    div {
       display: flex;
       position: relative;
 

src/views/perms/AssetPermission/components/AccountFormatter.vue

@@ -16,7 +16,7 @@
       </el-radio-group>
 
       <div v-if="showSpecZone" class="spec-accounts spec-zone">
-        <!-- <div class="group-title">{{ $t('SpecAccount') }}</div> -->
+        <div class="group-title">{{ $t('SpecAccount') }}</div>
         <TagInput
           v-model="specAccountsInput"
           :autocomplete="autocomplete"
@@ -33,10 +33,10 @@
         </span>
       </div>
 
-      <div v-if="showExcludeZone" class="not-accounts spec-zone">
-        <!-- <div class="group-title">{{ $t('ExcludeAccount') }}</div> -->
-        <TagInput v-model="excludeAccountsInput" @change="handleTagChange" />
-      </div>
+      <!--      <div v-if="showNotAccounts" class="not-accounts spec-zone">-->
+      <!--        <div class="group-title">{{ $t('ExcludeAccount') }}</div>-->
+      <!--        <TagInput v-model="excludeAccountsInput" @change="handleTagChange" />-->
+      <!--      </div>-->
 
       <div v-if="enableVirtualAccount" class="spec-zone virtual-choices">
         <el-checkbox v-model="virtualChecked" @change="handleVirtualChecked">
@@ -83,7 +83,7 @@ import {
   AllAccount,
   AnonymousAccount,
   ManualAccount,
-  ExcludeAccount,
+  NotAccount,
   realChoices,
   SameAccount,
   SpecAccount,
@@ -139,7 +139,7 @@ export default {
       ALL: AllAccount,
       SPEC: SpecAccount,
       VIRTUAL: virtual,
-      EXCLUDE: ExcludeAccount,
+      EXCLUDE: NotAccount,
       showTemplateDialog: false,
       realRadioSelected: this.ALL,
       realChoices: realChoices,
@@ -215,7 +215,7 @@ export default {
       const value = this.value || []
       const specAccountsInput = this.getSpecValues(value)
 
-      const excludeAccountsInput = this.getExcludeChoices(value)
+      // const excludeAccountsInput = this.getExcludeChoices(value)
       // 先清理 radio
       const isAll = value.includes(this.ALL)
 
@@ -224,10 +224,9 @@ export default {
       } else if (specAccountsInput.length > 0 || value.includes(this.SPEC)) {
         this.realRadioSelected = this.SPEC
         this.specAccountsInput = specAccountsInput
-      } else if (excludeAccountsInput.length > 0) {
-        this.realRadioSelected = this.EXCLUDE
-        this.excludeAccountsInput = excludeAccountsInput
-        this.showExcludeZone = true
+        // } else if (excludeAccountsInput.length > 0) {
+        //   this.realRadioSelected = this.EXCLUDE
+        //   this.excludeAccountsInput = excludeAccountsInput
       } else {
         this.realRadioSelected = NoneAccount
       }
@@ -272,9 +271,10 @@ export default {
         choicesSelected = [this.realRadioSelected, ...this.specAccountsInput, ...templateIds]
       } else if (this.realRadioSelected === NoneAccount) {
         choicesSelected = []
-      } else if (this.realRadioSelected === this.EXCLUDE && this.excludeAccountsInput) {
-        choicesSelected = [...this.excludeAccountsInput].map(i => '!' + i)
       }
+      // else if (this.realRadioSelected === this.EXCLUDE && this.excludeAccountsInput) {
+      //   choicesSelected = [...this.excludeAccountsInput].map(i => '!' + i)
+      // }
 
       if (this.virtualChecked) {
         choicesSelected = [...choicesSelected, ...this.virtualSelected]
@@ -317,7 +317,6 @@ export default {
 .spec-zone {
   border-bottom: dashed 1px var(--color-border);
   padding-bottom: 10px;
-  padding-top: 5px;
 
   &:last-child {
     border-bottom: none;

src/views/perms/const.js

@@ -154,7 +154,7 @@ export const AssetPermissionListPageSearchConfigOptions = [
 
 export const AllAccount = '@ALL'
 export const SpecAccount = '@SPEC'
-export const ExcludeAccount = '@NOT'
+export const NotAccount = '@NOT'
 export const SameAccount = '@USER'
 export const ManualAccount = '@INPUT'
 export const AnonymousAccount = '@ANON'
@@ -163,7 +163,7 @@ export const NoneAccount = '@NONE'
 export const AccountLabelMapper = {
   [AllAccount]: i18n.t('AllAccounts'),
   [SpecAccount]: i18n.t('SpecAccount'),
-  [ExcludeAccount]: i18n.t('ExcludeAccount'),
+  [NotAccount]: i18n.t('ExcludeAccount'),
   [NoneAccount]: i18n.t('None'),
   [SameAccount]: i18n.t('SameAccount'),
   [ManualAccount]: i18n.t('ManualAccount'),
@@ -187,15 +187,15 @@ export const realChoices = [
     value: SpecAccount,
     tip: i18n.t('SpecAccountTip')
   },
-  {
-    label: AccountLabelMapper[ExcludeAccount],
-    value: ExcludeAccount,
-    tip: i18n.t('ExcludeAccountTip')
-  },
   {
     label: AccountLabelMapper[NoneAccount],
     value: NoneAccount
   }
+  // {
+  //   label: AccountLabelMapper[NotAccount],
+  //   value: NotAccount,
+  //   tip: i18n.t('NotAccountTip')
+  // }
 ]
 
 export const virtualAccounts = [

src/views/reports/accounts/AccountAutomation.vue

@@ -211,6 +211,7 @@ export default {
   methods: {
     onChange(val) {
       this.days = val
+      localStorage.setItem('reportDays', val)
     },
     async getData() {
       const data = await this.$axios.get(`/api/v1/reports/reports/account-automation/?days=${this.days}`)

src/views/reports/accounts/index.vue

@@ -6,7 +6,7 @@
           <h5>{{ title }}</h5>
           <ul class="folder-list m-b-md" style="padding: 0">
             <li
-              v-for="chart in chartItems"
+              v-for="chart in charts"
               :key="chart.name"
               :class="{ active: selectedChart && selectedChart.name === chart.name }"
             >
@@ -46,27 +46,18 @@ export default {
         {
           title: this.$t('AccountStatisticsReport'),
           name: 'AccountStatistics',
-          icon: 'fa fa-users',
-          hidden: this.$hasPerm('rbac.view_accountstatisticsreport')
+          icon: 'fa fa-users'
         },
         {
           title: this.$t('AccountAutomationReport'),
           name: 'AccountAutomationReport',
-          icon: 'fa fa-cogs',
-          hidden: this.$hasPerm('rbac.view_accountautomationreport')
+          icon: 'fa fa-cogs'
         }
       ]
     }
   },
-  computed: {
-    chartItems() {
-      return this.charts.filter(chart => chart.hidden)
-    }
-  },
   created() {
-    if (this.chartItems.length > 0) {
-      this.handleChangeChart(this.chartItems[0])
-    }
+    this.handleChangeChart(this.charts[0])
   },
   methods: {
     handleChangeChart(chart) {

src/views/reports/assets/index.vue

@@ -6,7 +6,7 @@
           <h5>{{ title }}</h5>
           <ul class="folder-list m-b-md" style="padding: 0">
             <li
-              v-for="chart in chartItems"
+              v-for="chart in charts"
               :key="chart.name"
               :class="{ active: selectedChart && selectedChart.name === chart.name }"
             >
@@ -46,27 +46,18 @@ export default {
         {
           title: this.$t('AssetStatisticsReport'),
           name: 'AssetStatistics',
-          icon: 'fa fa-database',
-          hidden: this.$hasPerm('rbac.view_assetstatisticsreport')
+          icon: 'fa fa-database'
         },
         {
           title: this.$t('AssetActivityReport'),
           name: 'AssetReport',
-          icon: 'fa fa-exchange',
-          hidden: this.$hasPerm('rbac.view_assetactivityreport')
+          icon: 'fa fa-exchange'
         }
       ]
     }
   },
-  computed: {
-    chartItems() {
-      return this.charts.filter(chart => chart.hidden)
-    }
-  },
   created() {
-    if (this.chartItems.length > 0) {
-      this.handleChangeChart(this.chartItems[0])
-    }
+    this.handleChangeChart(this.charts[0])
   },
   methods: {
     handleChangeChart(chart) {

src/views/reports/audits/Dashboard.vue

@@ -1,20 +1,13 @@
 <template>
-  <BaseReport
-    :url="url"
-    :nav="nav"
-    :title="$t('AuditsDashboard')"
-    :disable-charts-padding="true"
-    name="AuditsDashboard"
-    v-bind="$attrs"
-  >
+  <BaseReport v-bind="$attrs">
     <SwitchDate class="switch-date" :name="name" @change="onChange" />
     <CardSummary :days="days" />
-    <el-row :gutter="10">
-      <el-col :span="12" :md="12">
-        <DataSummary class="chart-container" :days="days" />
+    <el-row :gutter="16">
+      <el-col :lg="12" :md="12" :sm="24">
+        <DataSummary :days="days" />
       </el-col>
-      <el-col :span="12" :md="12">
-        <RightSummary class="chart-container" :days="days" />
+      <el-col :lg="12" :md="12" :sm="24">
+        <RightSummary :days="days" />
       </el-col>
     </el-row>
     <TrendSummary :days="days" />
@@ -28,7 +21,6 @@ import DataSummary from './components/DataSummary'
 import CardSummary from './components/CardSummary.vue'
 import RightSummary from './components/RightSummary.vue'
 import BaseReport from '../base/BaseReport.vue'
-import { getRouteUrl } from '@/utils/vue'
 
 export default {
   components: {
@@ -39,17 +31,10 @@ export default {
     RightSummary,
     BaseReport
   },
-  props: {
-    nav: {
-      type: Boolean,
-      default: true
-    }
-  },
   data() {
     return {
       name: 'AuditsDashboard',
-      days: localStorage.getItem(this.name) || '7',
-      url: getRouteUrl('AuditsReport', this.$router)
+      days: localStorage.getItem(this.name) || '7'
     }
   },
   methods: {
@@ -59,8 +44,3 @@ export default {
   }
 }
 </script>
-<style lang="scss" scoped>
-.chart-container {
-  margin-top: 16px;
-}
-</style>

src/views/reports/audits/components/CardSummary.vue

@@ -1,10 +1,10 @@
 <template>
-  <div class="chart-container full-width">
+  <div>
     <el-row :gutter="16">
-      <el-col :lg="12" :sm="24">
+      <el-col :lg="12" :sm="24" class="margin-top-10">
         <SummaryCountCard :config="logConfig" :items="LogItems" />
       </el-col>
-      <el-col :lg="12" :sm="24">
+      <el-col :lg="12" :sm="24" class="margin-top-10">
         <SummaryCountCard :config="sessionConfig" :items="sessionItems" />
       </el-col>
     </el-row>
@@ -124,5 +124,7 @@ export default {
 </script>
 
 <style scoped>
-
+.margin-top-10 {
+  margin-top: 10px;
+}
 </style>

src/views/reports/audits/components/DataSummary.vue

@@ -1,6 +1,6 @@
 <template>
-  <el-row>
-    <el-col :span="12">
+  <el-row :gutter="16">
+    <el-col :lg="12" :sm="12" class="margin-top-10">
       <DataCard :config="logConfig">
         <div class="custom">
           <span>{{ logConfig.total }}</span>
@@ -10,7 +10,7 @@
         </div>
       </DataCard>
     </el-col>
-    <el-col :span="12">
+    <el-col :lg="12" :sm="12" class="margin-top-10">
       <DataCard :config="assetConfig">
         <div class="custom">
           <span>{{ assetConfig.total }}</span>
@@ -115,5 +115,11 @@ export default {
 </script>
 
 <style scoped>
+.left, .right {
+  display: inline-block;
+}
 
+.margin-top-10 {
+  margin-top: 10px;
+}
 </style>

src/views/reports/audits/components/RightSummary.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="chart-container transport-box">
+  <div>
     <div class="box">
       <div class="head">
         <Title :config="config" />
@@ -109,19 +109,19 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.chart-container  {
-  padding: 0 !important;
+.margin-top-10 {
+  margin-top: 10px;
 }
 
 .box {
+  margin-top: 10px;
+  padding: 20px;
   background: #fff;
-  padding: 30px;
 
   .head {
     display: flex;
     justify-content: space-between;
     margin-bottom: 8px;
   }
-
 }
 </style>

src/views/reports/audits/components/TrendSummary.vue

@@ -1,6 +1,6 @@
 <template>
-  <div class="chart-container full-width">
-    <Title :config="config" style="margin: 10px 0;" />
+  <div class="box">
+    <Title :config="config" style="margin-bottom: 16px;" />
     <ColumnChart v-bind="columnChartConfig" />
   </div>
 </template>
@@ -52,7 +52,9 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.chart-container {
-  padding-bottom: 20px;
+.box {
+  margin-top: 16px;
+  padding: 20px;
+  background-color: #fff;
 }
 </style>

src/views/reports/base/BaseReport.vue

@@ -1,5 +1,5 @@
 <template>
-  <div :class="{ 'only-charts': onlyCharts, 'nav': nav }">
+  <div :class="{ 'no-padding': onlyCharts, 'nav': nav }">
     <div v-if="!onlyCharts && nav" class="header nav-bar">
       <div class="nav-bar-logo">
         <Logo />
@@ -15,24 +15,18 @@
             [{{ new Date().toLocaleString() }}]
           </span>
 
-          <!-- <span v-if="!nav && url" class="export-btn">
+          <span v-if="!nav && url" style="float: right; line-height: 40px;">
             <el-button type="text" @click="openNewWindow">
               <i class="fa fa-external-link" style="font-size: 15px;" />
               {{ $t('Export') }}
             </el-button>
-          </span> -->
+          </span>
         </div>
         <div v-if="isDescription" class="description">
           {{ description }}
         </div>
       </div>
-      <span v-if="!nav && url" class="export-btn">
-        <el-button type="text" @click="openNewWindow">
-          <i class="fa fa-external-link" style="font-size: 15px;" />
-          {{ $t('Export') }}
-        </el-button>
-      </span>
-      <div class="charts-zone" :class="{ 'charts-zone--no-padding': disableChartsPadding }">
+      <div class="charts-zone">
         <slot />
       </div>
     </div>
@@ -72,10 +66,6 @@ export default {
     url: {
       type: String,
       default: ''
-    },
-    disableChartsPadding: {
-      type: Boolean,
-      default: false
     }
   },
   data() {
@@ -94,7 +84,7 @@ export default {
       try {
         if (!this.win || this.win.closed) {
           // 计算窗口居中位置
-          const width = 1024
+          const width = 1048
           const height = 800
           const left = (screen.width - width) / 2
           const top = (screen.height - height) / 2
@@ -136,10 +126,6 @@ export default {
   height: 40px;
 }
 
-.title-bar {
-  display: inline-block;
-}
-
 .title {
   height: 40px;
   background-color: white;
@@ -163,14 +149,7 @@ export default {
   background-color: white;
 }
 
-.export-btn {
-  float: right;
-  line-height: 40px;
-  margin-right: 23px;
-}
-
 .content {
-  // background-color: white;
   background-color: #F1F1F1;
   height: calc(100vh - 40px);
   overflow-y: auto;
@@ -192,38 +171,24 @@ export default {
   }
 }
 
-.only-charts {
+.no-padding {
   .content {
     height: auto;
     overflow-y: hidden;
     overflow-x: hidden;
-
-    .title-bar {
-      margin: 0 30px;
-    }
-
-    .export-btn {
-      position: absolute;
-      top: 5px;
-      right: 20px;
-    }
   }
 
   .charts-zone {
-    padding: 2px 0;
+    padding: 0;
   }
 }
 
 .nav {
   .content {
     .charts-zone {
-      width: 1000px;
+      width: 1040px;
     }
   }
-
-  .title-bar {
-    width: 100%;
-  }
 }
 
 @page {
@@ -301,10 +266,6 @@ export default {
       &.full-width {
         max-width: calc(100vw - 60px);
       }
-
-      &.transport-box {
-        background: transparent;
-      }
     }
 
     .chart-container-title {
@@ -329,9 +290,5 @@ export default {
   }
 }
 
-.charts-zone--no-padding {
-  padding: 0 !important;
-}
-
 </style>
 

src/views/reports/console/index.vue

@@ -1,13 +1,5 @@
 <template>
-  <BaseReport
-    :title="$t('ConsoleDashboard')"
-    :url="reportUrl"
-    :nav="nav"
-    :only-charts="onlyCharts"
-    :charts-padding="0"
-    :disable-charts-padding="true"
-    name="ConsoleDashboard"
-  >
+  <BaseReport :only-charts="!nav">
     <el-row :gutter="16">
       <el-col :lg="12" :sm="24">
         <RealTimeSummary />
@@ -29,7 +21,6 @@ import DataSummary from './DataSummary'
 import AssetProportionSummary from './AssetProportionSummary'
 import RankSummary from './RankSummary'
 import BaseReport from '../base/BaseReport.vue'
-import { getRouteUrl } from '@/utils/vue'
 
 export default {
   name: 'Dashboard',
@@ -45,22 +36,13 @@ export default {
     nav: {
       type: Boolean,
       default: true
-    },
-    onlyCharts: {
-      type: Boolean,
-      default: false
     }
   },
   data() {
     return {
-      url: '/api/v1/index/?total_count_type_to_assets_amount=1',
-      reportUrl: ''
+      url: '/api/v1/index/?total_count_type_to_assets_amount=1'
     }
-  },
-  mounted() {
-    this.reportUrl = getRouteUrl('ConsoleReport', this.$router)
   }
-
 }
 </script>
 

src/views/reports/pam/ChangeSecret/AccountSummary.vue

@@ -9,7 +9,7 @@
 
 <script>
 import Title from '@/components/Dashboard/Title.vue'
-import LineChart from '@/components/Dashboard/LineChart.vue'
+import LineChart from './LineChart.vue'
 
 export default {
   components: {

src/views/reports/pam/ChangeSecret/LineChart.vue

@@ -0,0 +1,174 @@
+<template>
+  <div>
+    <!-- 只有当已有快照时，打印才隐藏图表 -->
+    <echarts
+      ref="echarts"
+      :options="options"
+      :autoresize="true"
+      theme="light"
+      :class="{ 'disabled-when-print': !!dataUrl }"
+      @finished="genSnapshot"
+    />
+    <!-- 打印专用位图 -->
+    <img
+      v-if="dataUrl"
+      :src="dataUrl"
+      class="enabled-when-print"
+      alt="chart snapshot"
+    >
+  </div>
+</template>
+
+<script>
+import * as echarts from 'echarts'
+import { mix } from '@/utils/theme/color'
+
+export default {
+  name: 'LoginMetric',
+  props: {
+    range: { type: String, default: 'weekly' },
+    datesMetrics: { type: Array, default: () => [] },
+    primaryName: { type: String, default: '' },
+    primaryData: { type: Array, default: () => [] },
+    secondaryName: { type: String, default: '' },
+    secondaryData: { type: Array, default: () => [] }
+  },
+  data() {
+    return {
+      dataUrl: ''
+    }
+  },
+  computed: {
+    mixColors() {
+      const s = document.documentElement.style
+      const primary = s.getPropertyValue('--color-primary')
+      const colorValue = primary.replace(/#/g, '')
+      return {
+        primary,
+        TwoLevelColor: mix(colorValue, 'ffffff', 38),
+        ThreeLevelColor: mix(colorValue, 'ffffff', 20),
+        shadowColor: mix(colorValue, 'ffffff', 1)
+      }
+    },
+    options() {
+      const { primary, TwoLevelColor, ThreeLevelColor, shadowColor } = this.mixColors
+      return {
+        title: { show: false },
+        tooltip: { trigger: 'axis', axisPointer: { type: 'cross', label: { backgroundColor: '#6a7985' } } },
+        legend: { left: 'auto', icon: 'rect', itemWidth: 10, itemHeight: 10 },
+        grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true },
+        color: [primary, '#F3B44B'],
+        xAxis: [{
+          type: 'category', boundaryGap: false,
+          axisLine: { lineStyle: { color: '#8F959E' } },
+          axisLabel: { textStyle: { color: '#8F959E' } },
+          axisTick: { show: false },
+          data: this.datesMetrics
+        }],
+        yAxis: [{
+          type: 'value',
+          axisLine: { show: false, lineStyle: { color: '#fff' } },
+          axisLabel: { textStyle: { color: '#8F959E' } },
+          axisTick: { show: false },
+          splitLine: { show: true, lineStyle: { color: '#EFF0F1' } }
+        }],
+        animationDuration: 500,
+        series: [
+          {
+            name: this.primaryName, type: 'line', smooth: true,
+            areaStyle: {
+              normal: {
+                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                  { offset: 0, color: primary },
+                  { offset: 0.6, color: TwoLevelColor },
+                  { offset: 0.8, color: ThreeLevelColor }
+                ], false),
+                shadowColor, shadowBlur: 5
+              }
+            },
+            data: this.primaryData, showSymbol: false, lineStyle: { width: 2 }
+          },
+          {
+            name: this.secondaryName, type: 'line', smooth: true,
+            areaStyle: {
+              normal: {
+                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                  { offset: 0, color: 'rgba(249,199,79,0.6)' },
+                  { offset: 0.6, color: 'rgba(249,199,79,0.2)' },
+                  { offset: 0.8, color: 'rgba(249,199,79,0.1)' }
+                ], false),
+                shadowColor: 'rgba(249,199,79,0.1)', shadowBlur: 6
+              }
+            },
+            data: this.secondaryData, showSymbol: false, lineStyle: { width: 2 }
+          }
+        ]
+      }
+    }
+  },
+  watch: {
+    range() { this.genSnapshot() },
+    datesMetrics() { this.genSnapshot() },
+    primaryData() { this.genSnapshot() },
+    secondaryData() { this.genSnapshot() }
+  },
+  mounted() {
+    this.genSnapshot()
+    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: {
+    forceResize() {
+      const inst = this.$refs.echarts?.echartsInstance
+
+      if (inst) inst.resize()
+    },
+    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 = ''
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.echarts { width: 100%; height: 272px; }
+
+/* 打印：有快照时隐藏图表，用位图替代 */
+@media print {
+  .disabled-when-print { display: none !important; }
+  .enabled-when-print { display: block !important; width: 100% !important; }
+}
+</style>

src/views/reports/pam/ChangeSecret/index.vue

@@ -1,12 +1,5 @@
 <template>
-  <BaseReport
-    :nav="nav"
-    :title="$t('ChangeSecretDashboard')"
-    :disable-charts-padding="true"
-    name="ChangeSecretDashboard"
-    :url="reportUrl"
-    v-bind="$attrs"
-  >
+  <BaseReport :only-charts="!nav">
     <div class="switch-date-wrapper">
       <SwitchDate class="switch-date" :name="name" @change="onChange" />
     </div>
@@ -37,7 +30,6 @@ import SwitchDate from '@/components/Dashboard/SwitchDate'
 import AccountSummary from './AccountSummary.vue'
 import FailedAccountSummary from './FailedAccountSummary.vue'
 import BaseReport from '../../base/BaseReport.vue'
-import { getRouteUrl } from '@/utils/vue'
 
 export default {
   name: 'ChangeSecret',
@@ -58,8 +50,7 @@ export default {
   data() {
     return {
       name: 'ChangeSecretDashboard',
-      days: localStorage.getItem(this.name) || '7',
-      reportUrl: getRouteUrl('ChangeSecretReport', this.$router)
+      days: localStorage.getItem(this.name) || '7'
     }
   },
   methods: {

src/views/reports/pam/Dashboard/index.vue

@@ -1,12 +1,5 @@
 <template>
-  <BaseReport
-    :nav="nav"
-    :url="reportUrl"
-    :title="$t('PamDashboard')"
-    :disable-charts-padding="true"
-    name="PamDashboard"
-    v-bind="$attrs"
-  >
+  <BaseReport :only-charts="!nav">
     <div class="summary-container">
       <el-row :gutter="20">
         <el-col :span="14" :xs="24">
@@ -39,7 +32,6 @@ import AssetProportionSummary from './AssetProportionSummary.vue'
 import MissionSummery from './MissionSummery.vue'
 import AccountSecretSummary from '@/views/reports/pam/ChangeSecret/AccountSummary.vue'
 import BaseReport from '../../base/BaseReport.vue'
-import { getRouteUrl } from '@/utils/vue'
 
 export default {
   name: 'Dashboard',
@@ -59,8 +51,7 @@ export default {
   },
   data() {
     return {
-      url: '/api/v1/accounts/pam-dashboard/?total_count_type_to_accounts=1',
-      reportUrl: getRouteUrl('PamReport', this.$router)
+      url: '/api/v1/accounts/pam-dashboard/?total_count_type_to_accounts=1'
     }
   }
 }

src/views/reports/users/UserActivity.vue

@@ -23,7 +23,7 @@
           <div class="chart-container-title">
             <div class="chart-container-title-text">{{ $t('UserLoginTrends') }}</div>
             <div class="chart">
-              <Echart
+              <echarts
                 ref="loginTrend"
                 :options="loginTrendOptions"
                 :autoresize="true"
@@ -36,7 +36,7 @@
           <div class="chart-container-title">
             <div class="chart-container-title-text">{{ $t('LoginSource') }}</div>
             <div class="chart">
-              <Echart
+              <echarts
                 :options="LoginSourceOptions"
                 :autoresize="true"
               />
@@ -48,7 +48,7 @@
           <div class="chart-container-title">
             <div class="chart-container-title-text">{{ $t('VisitTimeDistribution') }}</div>
             <div class="chart">
-              <Echart
+              <echarts
                 :options="VisitTimeOptions"
                 :autoresize="true"
               />
@@ -60,7 +60,7 @@
           <div class="chart-container-title">
             <div class="chart-container-title-text">{{ $t('LoginMethodStatistics') }}</div>
             <div class="chart">
-              <Echart
+              <echarts
                 :options="loginMethodOptions"
                 :autoresize="true"
               />
@@ -78,14 +78,12 @@ import SwitchDate from '@/components/Dashboard/SwitchDate'
 import * as echarts from 'echarts'
 import { mixColors } from '@/views/reports/const'
 import SummaryCountCard from '@/components/Dashboard/SummaryCountCard.vue'
-import Echart from '@/components/Dashboard/Echart.vue'
 
 export default {
   components: {
     SummaryCountCard,
     BaseReport,
-    SwitchDate,
-    Echart
+    SwitchDate
   },
   props: {
     nav: {

src/views/reports/users/index.vue

@@ -6,7 +6,7 @@
           <h5>{{ title }}</h5>
           <ul class="folder-list m-b-md" style="padding: 0">
             <li
-              v-for="chart in chartItems"
+              v-for="chart in charts"
               :key="chart.name"
               :class="{ active: selectedChart && selectedChart.name === chart.name }"
             >
@@ -46,27 +46,18 @@ export default {
         {
           title: this.$t('UserLoginReport'),
           name: 'UserReport',
-          icon: 'fa fa-sign-in',
-          hidden: this.$hasPerm('rbac.view_userloginreport')
+          icon: 'fa fa-sign-in'
         },
         {
           title: this.$t('UserChangePasswordReport'),
           name: 'ChangePassword',
-          icon: 'fa fa-key',
-          hidden: this.$hasPerm('rbac.view_userchangepasswordreport')
+          icon: 'fa fa-key'
         }
       ]
     }
   },
-  computed: {
-    chartItems() {
-      return this.charts.filter(chart => chart.hidden)
-    }
-  },
   created() {
-    if (this.chartItems.length > 0) {
-      this.handleChangeChart(this.chartItems[0])
-    }
+    this.handleChangeChart(this.charts[0])
   },
   methods: {
     handleChangeChart(chart) {

src/views/settings/Feature/Ops.vue

@@ -29,7 +29,7 @@ export default {
         ],
         fieldsMeta: {
         },
-        successUrl: { name: 'Settings', params: { activeMenu: 'Basic' } },
+        successUrl: { name: 'Settings', params: { activeMenu: 'Basic' }},
         url: '/api/v1/settings/setting/?category=ops',
         hasReset: false,
         submitMethod() {

src/views/settings/Feature/Ticket.vue

@@ -33,7 +33,7 @@ export default {
         ],
         fieldsMeta: {
         },
-        successUrl: { name: 'Settings', params: { activeMenu: 'Basic' } },
+        successUrl: { name: 'Settings', params: { activeMenu: 'Basic' }},
         url: '/api/v1/settings/setting/?category=ticket',
         hasReset: false,
         submitMethod() {

src/views/settings/Feature/VirtualApp.vue

@@ -27,7 +27,7 @@ export default {
         fields: ['VIRTUAL_APP_ENABLED'],
         fieldsMeta: {
         },
-        successUrl: { name: 'Settings', params: { activeMenu: 'Basic' } },
+        successUrl: { name: 'Settings', params: { activeMenu: 'Basic' }},
         url: '/api/v1/settings/setting/?category=virtualapp',
         hasReset: false,
         submitMethod() {

src/views/settings/Msg/Email/EmailTemplate.vue

@@ -1,14 +1,11 @@
 <template>
   <div>
-    <el-button size="mini" type="primary" icon="el-icon-setting" @click="visible = !visible"> {{
-      $t("Setting")
-    }}
-    </el-button>
+    <el-button size="mini" type="primary" icon="el-icon-setting" @click="visible = !visible"> {{ $t("Setting") }} </el-button>
     <Dialog
       v-if="visible"
       :show-cancel="false"
       :show-confirm="false"
-      :title="$tc('Msg Template')"
+      :title="$tc('EmailTemplate')"
       :visible.sync="visible"
       width="70%"
       @confirm="onConfirm()"
@@ -24,7 +21,7 @@ import GenericCreateUpdateForm from '@/layout/components/GenericCreateUpdateForm
 import { Dialog } from '@/components'
 
 export default {
-  name: 'MsgTemplate',
+  name: 'EmailTemplate',
   components: {
     GenericCreateUpdateForm,
     Dialog
@@ -40,7 +37,7 @@ export default {
           ]
         ]
       ],
-      successUrl: { name: 'Settings', params: { activeMenu: 'EmailContent' } },
+      successUrl: { name: 'Settings', params: { activeMenu: 'EmailContent' }},
       fieldsMeta: {
         'EMAIL_CUSTOM_USER_CREATED_BODY': {
           el: {

src/views/settings/Msg/Email/index.vue

@@ -16,8 +16,8 @@
 import { IBox } from '@/components'
 import { GenericCreateUpdateForm } from '@/layout/components'
 import { testEmailSetting } from '@/api/settings'
-import rules from '@/components/Form/DataForm/rules'
 import EmailTemplate from './EmailTemplate.vue'
+import rules from '@/components/Form/DataForm/rules'
 
 export default {
   name: 'Email',

src/views/settings/Msg/Email/markDownEditor.vue

@@ -1,49 +0,0 @@
-<template>
-  <div style="border: 1px solid #ccc; padding: 10px;">
-    <vue-markdown-editor v-model="localValue" :right-toolbar="rightToolbar" :left-toolbar="leftToolbar" height="400px" />
-  </div>
-</template>
-<script>
-import VueMarkdownEditor, { xss } from '@kangc/v-md-editor'
-import '@kangc/v-md-editor/lib/style/base-editor.css'
-import vuepressTheme from '@kangc/v-md-editor/lib/theme/vuepress.js'
-import '@kangc/v-md-editor/lib/theme/style/vuepress.css'
-import Prism from 'prismjs'
-
-VueMarkdownEditor.use(vuepressTheme, {
-  Prism
-})
-
-export default {
-  name: 'RichEditor',
-  components: { VueMarkdownEditor },
-  props: {
-    value: {
-      type: String,
-      default: ''
-    }
-  },
-  data() {
-    return {
-      localValue: this.value,
-      rightToolbar: 'preview  sync-scroll fullscreen',
-      leftToolbar: 'undo redo clear | h bold italic strikethrough quote | ul ol hr | link  code '
-    }
-  },
-  computed: {
-    html() {
-      return xss.process(VueMarkdownEditor.themeConfig.markdownParser.render(this.localValue))
-    }
-  },
-  watch: {
-    value(val) {
-      if (val !== this.localValue) {
-        this.localValue = val
-      }
-    },
-    localValue(val) {
-      this.$emit('input', val)
-    }
-  }
-}
-</script>

src/views/settings/Msg/MsgTemplate/index.vue

@@ -1,144 +0,0 @@
-<template>
-  <div>
-    <IBox>
-      <GenericCreateUpdateForm
-        :create-success-next-route="successUrl"
-        :update-success-next-route="successUrl"
-        v-bind="$data"
-      />
-    </IBox>
-    <VariablesHelpTextDialog
-      :variables-help-text="variablesHelpText"
-      :variables="variables"
-      :visible.sync="showHelpDialog"
-    />
-  </div>
-</template>
-
-<script>
-import { IBox } from '@/components'
-import { GenericCreateUpdateForm } from '@/layout/components'
-import MarkDownEditor from '@/views/settings/Msg/Email/markDownEditor.vue'
-import { Select2 } from '@/components/Form/FormFields'
-import VariablesHelpTextDialog from '@/components/Apps/VariablesHelpTextDialog'
-import variable from '@/views/ops/Template/components/Variable.vue'
-
-export default {
-  name: 'MsgTemplate',
-  components: {
-    GenericCreateUpdateForm,
-    IBox,
-    VariablesHelpTextDialog
-  },
-  data() {
-    const vm = this
-    return {
-      initial: {
-        EMAIL_TEMPLATE_NAME: localStorage.getItem('selectTemplateName') || 'terminal/_msg_session_sharing.html'
-      },
-      helpText: this.$t('EmailHelpText'),
-      encryptedFields: ['EMAIL_HOST_PASSWORD'],
-      fields: [
-        [this.$t('Basic'), [
-          'EMAIL_TEMPLATE_NAME',
-          'EMAIL_TEMPLATE_CONTENT'
-        ]]
-      ],
-      fieldsMeta: {
-        EMAIL_TEMPLATE_NAME: {
-          label: this.$t('Name'),
-          helpTextFormatter: () => {
-            const handleClick = () => {
-              this.showHelpDialog = true
-            }
-            return (
-              <i onClick={handleClick} class='fa fa-question-circle' style='cursor: pointer'>{this.$t('Help')}</i>
-            )
-          },
-          component: Select2,
-          el: {
-            multiple: false,
-            options: []
-          },
-          on: {
-            input: ([event], updateForm) => {
-              setTimeout(() => {
-                vm.templates.map(item => {
-                  if (item.template_name === event) {
-                    this.selectTemplateName = item.template_name
-                    localStorage.setItem('selectTemplateName', item.template_name)
-                    this.variables = item.contexts
-                    this.source = item.source
-                    updateForm({
-                      EMAIL_TEMPLATE_CONTENT: item.content.trimStart()
-                    })
-                  }
-                })
-              },
-              500
-              )
-            }
-          }
-        },
-        EMAIL_TEMPLATE_CONTENT: {
-          component: MarkDownEditor
-        }
-      },
-      templates: [],
-      successUrl: { name: 'Msg' },
-      showHelpDialog: false,
-      variables: [],
-      source: 'original',
-      selectTemplateName: '',
-      variablesHelpText: '您可以选择一个模板在模板内容中使用 {{ key }} 读取内置变量,注意：只支持 {{ }} 语法，其他语法不支持。例如  {% if title %}',
-      hasSaveContinue: false,
-      performSubmit(validValues) {
-        return this.$axios['patch']('/api/v1/notifications/templates/edit/', validValues).then(res => {
-          this.$router.push({ name: 'Msg', query: { t: new Date().getTime() } })
-        })
-      },
-      moreButtons: [
-        {
-          title: this.$t('Reset'),
-          type: 'default',
-          // hidden: () => this.source === 'original',
-          callback: (value, form, btn) => {
-            console.log(value, form, btn)
-            return this.$axios['post']('/api/v1/notifications/templates/reset/', { template_name: this.selectTemplateName }).then(
-              () => {
-                this.$router.push({ name: 'Msg', query: { t: new Date().getTime() } })
-                this.$message.success(this.$t('ResetSuccessfully'))
-              }
-            )
-          }
-        }
-      ]
-    }
-  },
-  computed: {
-    variable() {
-      return variable
-    }
-  },
-  mounted() {
-    this.fetchTemplates()
-  },
-  methods: {
-    fetchTemplates() {
-      this.$axios.get('/api/v1/notifications/templates/').then(data => {
-        if (data.length > 0) {
-          this.templates = data
-          this.fieldsMeta.EMAIL_TEMPLATE_NAME.el.options = data.map(item => ({
-            label: item.subject,
-            value: item.template_name
-          }))
-        }
-      })
-    }
-  }
-}
-</script>
-
-<style scoped>
-
-</style>

src/views/settings/Msg/index.vue

@@ -9,13 +9,12 @@
 <script>
 import TabPage from '@/layout/components/TabPage/index.vue'
 import Email from './Email/index.vue'
-import MsgTemplate from '@/views/settings/Msg/MsgTemplate/index.vue'
 import Subscribe from './Subscribe/index.vue'
 import SMS from './SMS/index.vue'
 
 export default {
   name: 'Index',
-  components: { TabPage, Email, MsgTemplate, Subscribe, SMS },
+  components: { TabPage, Email, Subscribe, SMS },
   data() {
     return {
       activeMenu: 'Email',
@@ -25,11 +24,6 @@ export default {
           name: 'Email',
           hidden: !this.$hasPerm('settings.change_email')
         },
-        {
-          title: this.$t('Msg Template'),
-          name: 'MsgTemplate',
-          hidden: !this.$hasPerm('settings.change_email') || !this.$store.getters.hasValidLicense
-        },
         {
           title: this.$t('SMS'),
           name: 'SMS',

src/views/settings/Org/OrganizationDetail/index.vue

@@ -43,7 +43,7 @@ export default {
               type: 'warning',
               confirmButtonClass: 'el-button--danger',
               showCancelButton: true,
-              beforeClose: async (action, instance, done) => {
+              beforeClose: async(action, instance, done) => {
                 if (action !== 'confirm') return done()
                 instance.confirmButtonLoading = true
                 try {

src/views/settings/Org/OrganizationList.vue

@@ -91,7 +91,7 @@ export default {
                   type: 'warning',
                   confirmButtonClass: 'el-button--danger',
                   showCancelButton: true,
-                  beforeClose: async (action, instance, done) => {
+                  beforeClose: async(action, instance, done) => {
                     if (action !== 'confirm') return done()
                     instance.confirmButtonLoading = true
                     try {

src/views/settings/Security/AuthLimit.vue

@@ -55,7 +55,7 @@ export default {
           ]
         ]
       ],
-      successUrl: { name: 'Settings', params: { activeMenu: 'EmailContent' } },
+      successUrl: { name: 'Settings', params: { activeMenu: 'EmailContent' }},
       fieldsMeta: {
         SECURITY_VIEW_BLOCKED_IPS: {
           component: BlockedIPs,

src/views/settings/Security/Session.vue

@@ -9,7 +9,7 @@
 <script>
 import IBox from '@/components/Common/IBox/index.vue'
 import GenericCreateUpdateForm from '@/layout/components/GenericCreateUpdateForm/index.vue'
-import WatermarkHelpDialog from '@/components/Apps/VariablesHelpTextDialog'
+import WatermarkHelpDialog from './WatermarkHelpDialog.vue'
 
 export default {
   name: 'SessionSecurity',
@@ -18,21 +18,21 @@ export default {
     return {
       showSessionHelpDialog: false,
       showConsoleHelpDialog: false,
-      sessionVariables: [
-        { name: 'userId', label: this.$t('userId'), default: '00000000-0000-0000-0000-000000000001' },
-        { name: 'name', label: this.$t('name'), default: '张三' },
-        { name: 'userName', label: this.$t('userName'), default: 'zhangsan' },
-        { name: 'currentTime', label: this.$t('currentTime'), default: '2025-06-01 12:00:00' },
-        { name: 'assetId', label: this.$t('assetId'), default: '00000000-0000-0000-0000-000000000001' },
-        { name: 'assetName', label: this.$t('assetName'), default: '服务器01' },
-        { name: 'assetAddress', label: this.$t('assetAddress'), default: '192.168.1.1' }
-      ],
-      consoleVariables: [
-        { name: 'userId', label: this.$t('userId'), default: '00000000-0000-0000-0000-000000000001' },
-        { name: 'name', label: this.$t('name'), default: '张三' },
-        { name: 'userName', label: this.$t('userName'), default: 'zhangsan' },
-        { name: 'currentTime', label: this.$t('currentTime'), default: '2025-06-01 12:00:00' }
-      ],
+      sessionVariables: {
+        'userId': this.$t('userId'),
+        'name': this.$t('name'),
+        'userName': this.$t('userName'),
+        'currentTime': this.$t('currentTime'),
+        'assetId': this.$t('assetId'),
+        'assetName': this.$t('assetName'),
+        'assetAddress': this.$t('assetAddress')
+      },
+      consoleVariables: {
+        'userId': this.$t('userId'),
+        'name': this.$t('name'),
+        'userName': this.$t('userName'),
+        'currentTime': this.$t('currentTime')
+      },
       config: {
         url: '/api/v1/settings/setting/?category=security_session',
         hasDetailInMsg: false,
@@ -100,7 +100,7 @@ export default {
             }
           }
         },
-        onSubmit: async (validValues) => {
+        onSubmit: async(validValues) => {
           const url = '/api/v1/settings/setting/?category=security_session'
 
           try {

src/views/settings/Security/WatermarkHelpDialog.vue

@@ -8,19 +8,17 @@
     top="1vh"
     width="50%"
   >
-    <p>{{ variablesHelpText }}</p>
+    <p>{{ $t('WatermarkVariableHelpText') }}</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.key)">
-          <label class="item-label">{{ item.key }}</label>
+      <tr v-for="(val, key, index) in variables" :key="index">
+        <td :title="$tc('ClickCopy')" class="item-td text-link" @click="onCopy(key)">
+          <label class="item-label">{{ key }}</label>
         </td>
-        <td><span>{{ item.label }}</span></td>
-        <td><span>{{ item.example }}</span></td>
+        <td><span>{{ val }}</span></td>
       </tr>
     </table>
   </Dialog>
@@ -40,14 +38,8 @@ export default {
       default: false
     },
     variables: {
-      type: Array,
-      default: () => []
-    },
-    variablesHelpText: {
-      type: String,
-      default() {
-        return this.$t('WatermarkVariableHelpText')
-      }
+      type: Object,
+      default: () => ({})
     }
   },
   data() {

src/views/settings/Storage/CommandStorage.vue

@@ -34,7 +34,7 @@ export default {
         hasMoreActions: false,
         moreCreates: {
           callback: (item) => {
-            this.$refs.ListTable.onCreate({ query: { type: item.name } })
+            this.$refs.ListTable.onCreate({ query: { type: item.name }})
           },
           dropdown: [
             {

src/views/settings/Storage/CommandStorageCreateUpdate.vue

@@ -19,7 +19,7 @@ export default {
   data() {
     const commandType = this.$route.query.type || 'es'
     return {
-      successUrl: { name: 'Storage', params: { activeMenu: 'CommandStorage' } },
+      successUrl: { name: 'Storage', params: { activeMenu: 'CommandStorage' }},
       initial: {
         type: commandType,
         doc_type: 'command',

src/views/settings/Storage/ObjectStorage.vue

@@ -29,7 +29,7 @@ export default {
         hasMoreActions: false,
         moreCreates: {
           callback: (item) => {
-            this.$refs.ListTable.onCreate({ query: { type: item.name } })
+            this.$refs.ListTable.onCreate({ query: { type: item.name }})
           },
           dropdown: storageOptions
         }
@@ -75,7 +75,7 @@ export default {
                 return (row.name !== 'default' && row.name !== 'null' && vm.$hasPerm('terminal.delete_replaystorage'))
               },
               onUpdate: ({ row }) => {
-                this.$refs.ListTable.onUpdate({ row, query: { type: row.type.value } })
+                this.$refs.ListTable.onUpdate({ row, query: { type: row.type.value }})
               },
               hasClone: false,
               extraActions: [

src/views/settings/Terminal/Component/TerminalUpdate.vue

@@ -19,7 +19,7 @@ export default {
   },
   data() {
     return {
-      successUrl: { name: 'TerminalSetting', params: { activeMenu: 'TerminalList' } },
+      successUrl: { name: 'TerminalSetting', params: { activeMenu: 'TerminalList' }},
       url: '/api/v1/terminal/terminals/',
       fields: [
         [this.$t('Info'), ['name', 'remote_addr', 'command_storage', 'replay_storage']],

src/views/settings/Terminal/EndpointRule/EndpointRuleCreateUpdate.vue

@@ -20,7 +20,7 @@ export default {
       initial: {
         ip_group: ['*']
       },
-      successUrl: { name: 'TerminalSetting', params: { activeMenu: 'EndpointRuleList' } },
+      successUrl: { name: 'TerminalSetting', params: { activeMenu: 'EndpointRuleList' }},
       fields: [
         [this.$t('Basic'), ['name', 'priority']],
         [this.$t('Endpoint'), ['ip_group', 'endpoint']],

src/views/tickets/components/Comments.vue

@@ -147,7 +147,7 @@ export default {
       this.loading = true
       const url = `/api/v1/tickets/comments/?ticket_id=${this.object.id}`
       this.$axios.get(url).then(res => {
-        this.comments = res.results
+        this.comments = res
       }).catch(err => {
         this.$message.error(err)
       }).finally(() => {

src/views/users/Group/UserGroupDetail/GroupUser.vue

@@ -52,7 +52,7 @@ export default {
               this.$confirm(msg, this.$tc('Info'), {
                 type: 'warning',
                 confirmButtonClass: 'el-button--danger',
-                beforeClose: async (action, instance, done) => {
+                beforeClose: async(action, instance, done) => {
                   if (action !== 'confirm') return done()
                   this.$axios.post(
                     `/api/v1/users/groups/${this.object.id}/add-all-users/`,

src/views/users/Role/RoleCreateUpdate.vue

@@ -18,7 +18,7 @@ export default {
       scopeRole: scope + 'role',
       config: {
         url: `/api/v1/rbac/${scope}-roles/`,
-        objectDetailRoute: { name: 'RoleDetail', query: { scope: scope } },
+        objectDetailRoute: { name: 'RoleDetail', query: { scope: scope }},
         initial: {
           scope: scope
         },

src/views/users/User/UserDetail/UserInfo.vue

@@ -77,7 +77,7 @@ export default {
                 type: 'warning',
                 confirmButtonClass: 'el-button--warning',
                 showCancelButton: true,
-                beforeClose: async (action, instance, done) => {
+                beforeClose: async(action, instance, done) => {
                   if (action !== 'confirm') return done()
                   instance.confirmButtonLoading = true
                   try {
@@ -109,7 +109,7 @@ export default {
                 type: 'warning',
                 confirmButtonClass: 'el-button--warning',
                 showCancelButton: true,
-                beforeClose: async (action, instance, done) => {
+                beforeClose: async(action, instance, done) => {
                   if (action !== 'confirm') return done()
                   instance.confirmButtonLoading = true
                   try {
@@ -141,7 +141,7 @@ export default {
                 type: 'warning',
                 confirmButtonClass: 'el-button--warning',
                 showCancelButton: true,
-                beforeClose: async (action, instance, done) => {
+                beforeClose: async(action, instance, done) => {
                   if (action !== 'confirm') return done()
                   instance.confirmButtonLoading = true
                   try {

src/views/users/User/components/InviteUsersDialog.vue

@@ -86,7 +86,7 @@ export default {
       this.setting.InviteDialogVisible = false
       this.$emit('close', res)
       this.$store.dispatch('users/currentUserJoinNewOrg', res.users)
-      this.$router.push({ name: 'UserList', query: { order: '-date_updated' } })
+      this.$router.push({ name: 'UserList', query: { order: '-date_updated' }})
     }
   }
 }