fixed: Restores remote application styles

perf: Help text automatic line wrapping

package.json

@@ -66,7 +66,7 @@
     "normalize.css": "7.0.0",
     "npm": "^7.8.0",
     "nprogress": "0.2.0",
-    "path-to-regexp": "2.4.0",
+    "path-to-regexp": "3.3.0",
     "v-sanitize": "^0.0.13",
     "vue": "2.6.10",
     "vue-codemirror": "4.0.6",
@@ -117,7 +117,7 @@
     "sass-loader": "^7.1.0",
     "script-ext-html-webpack-plugin": "2.1.3",
     "script-loader": "0.7.2",
-    "serve-static": "^1.13.2",
+    "serve-static": "^1.16.0",
     "strip-ansi": "^7.1.0",
     "svg-sprite-loader": "4.1.3",
     "svgo": "1.2.2",

src/api/settings.js

@@ -15,6 +15,7 @@ export function testEmailSetting(data) {
     data: data
   })
 }
+
 export function importLicense(formData) {
   return request({
     url: '/api/v1/xpack/license/import',
@@ -25,6 +26,7 @@ export function importLicense(formData) {
     data: formData
   })
 }
+
 export function testLdapSetting(data, refresh = true) {
   let url = '/api/v1/settings/ldap/testing/config/'
   if (refresh) {
@@ -96,9 +98,17 @@ export function getPublicSettings(isOpen) {
     method: 'get'
   })
 }
+
 export function getLogo() {
   return request({
     url: '/api/v1/xpack/interface/setting/',
     method: 'get'
   })
 }
+
+export function getPreference() {
+  return request({
+    url: '/api/v1/users/preference/?category=luna',
+    method: 'get'
+  })
+}

src/components/Apps/AssetTreeTable/index.vue

@@ -32,6 +32,10 @@ export default {
       type: String,
       default: '/api/v1/assets/assets/'
     },
+    typeUrl: {
+      type: String,
+      default: '/api/v1/assets/nodes/category/tree/'
+    },
     nodeUrl: {
       type: String,
       default: '/api/v1/assets/nodes/'
@@ -105,9 +109,9 @@ export default {
               showAssets: false,
               showSearch: false,
               customTreeHeaderName: this.$t('TypeTree'),
-              url: '/api/v1/assets/nodes/category/tree/',
+              url: this.typeUrl,
               nodeUrl: this.treeSetting?.nodeUrl || this.nodeUrl,
-              treeUrl: `/api/v1/assets/nodes/category/tree/?assets=${showAssets ? '1' : '0'}&count_resource=${this.treeSetting.countResource || 'asset'}`,
+              treeUrl: `${this.typeUrl}?assets=${showAssets ? '1' : '0'}&count_resource=${this.treeSetting.countResource || 'asset'}`,
               callback: {
                 onSelected: (event, treeNode) => this.getAssetsUrl(treeNode)
               }

src/components/Cards/DetailCard/ItemValue.vue

@@ -78,7 +78,7 @@ export default {
         formatterData = data
       }
       return (
-        <span>{formatterData}</span>
+        <span style={{ whiteSpace: 'pre-wrap', lineHeight: '1.2' }}>{formatterData}</span>
       )
     }
     if (this.value instanceof Array) {

src/components/Dialog/index.vue

@@ -123,6 +123,7 @@ export default {
 
     &__body {
       padding: 20px 30px;
+      font-size: 13px;
 
       &:has(.el-table) {
         background: #f3f3f4;

src/components/Form/AutoDataForm/index.vue

@@ -7,7 +7,7 @@
     v-bind="$attrs"
     v-on="$listeners"
   >
-    <span
+    <div
       v-for="(group, i) in groups"
       :key="'group-'+group.name"
       :slot="'id:'+group.name"
@@ -18,7 +18,7 @@
         :index="i"
         :line="i !== 0 && !groupHidden(groups[i - 1], i - 1)"
       />
-    </span>
+    </div>
   </DataForm>
 </template>
 

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

@@ -17,7 +17,7 @@
         placement="right"
         popper-class="help-tips"
       >
-        <div slot="content" v-sanitize="data.helpTip" /> <!-- Noncompliant -->
+        <div slot="content" v-sanitize="data.helpTip" class="help-tip-content" /> <!-- Noncompliant -->
         <i class="fa fa-question-circle-o help-tip-icon" />
       </el-tooltip>
     </template>
@@ -322,4 +322,9 @@ export default {
     cursor: pointer;
   }
 }
+
+.help-tip-content {
+  white-space: pre-wrap;
+  word-wrap: break-word;
+}
 </style>

src/components/Form/FormFields/InputWithUnit.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-input v-bind="$attrs" v-on="$listeners">
+  <el-input v-model="iValue" v-bind="$attrs" v-on="$listeners">
     <template slot="append">{{ iUnit }}</template>
   </el-input>
 </template>
@@ -15,6 +15,7 @@ export default {
   },
   data() {
     return {
+      defaultValue: 24,
       displayMapper: {
         'second': this.$t('Second'), // 'sec' is the default value of 'unit
         'min': this.$t('Minute'), // 'min' is the default value of 'unit
@@ -29,6 +30,9 @@ export default {
   computed: {
     iUnit() {
       return this.displayMapper[this.unit] || this.unit
+    },
+    iValue() {
+      return this.$attrs.value ? this.$attrs.value : this.defaultValue
     }
   }
 }

src/components/Form/FormFields/PasswordRule.vue

@@ -48,7 +48,8 @@ export default {
             type: 'input-number',
             el: {
               min: 8,
-              max: 30
+              max: 36,
+              size: 'mini'
             }
           },
           {

src/components/Form/FormFields/UserPassword.vue

@@ -42,7 +42,7 @@ export default {
         patterns.push([/\d/, i18n.t('NUMBER_REQUIRED')])
       }
       if (passwordRule['SECURITY_PASSWORD_SPECIAL_CHAR']) {
-        const pattern = new RegExp("[`~!@#$^&*()=|{}':;',\\[\\].<>/?~！@#￥……&*（）——|{}【】‘；：”“'。，、？]")
+        const pattern = new RegExp("[`~!@#$^&*()=|{}':;',\\[\\].<>/?~！@#￥……&*（）——|{}【】‘；：”“'。，、？_+-]")
         patterns.push([pattern, i18n.t('SPECIAL_CHAR_REQUIRED')])
       }
       for (const [pattern, msg] of patterns) {

src/components/Table/TableFormatters/LabelsFormatter.vue

@@ -131,6 +131,16 @@ export default {
     }
   },
   computed: {},
+  watch: {
+    cellValue: {
+      handler(newValue) {
+        if (newValue) {
+          this.initial = this.formatterArgs.getLabels(this.cellValue)
+          this.iLabels = [...this.initial]
+        }
+      }
+    }
+  },
   mounted() {
     this.initial = this.formatterArgs.getLabels(this.cellValue)
     this.iLabels = [...this.initial]

src/layout/components/NavHeader/index.vue

@@ -176,7 +176,7 @@ export default {
 
         // 未找到与之对应的
         & ::v-deep .el-submenu__title {
-          font-family: "open sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
+          font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
           padding: 0 8px;
           line-height: $headerHeight;
           height: $headerHeight;

src/styles/index.scss

@@ -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;
 }
@@ -593,3 +593,9 @@ li.rmenu i.fa {
     height: 6px; /* 设置水平滚动条的高度 */
   }
 }
+
+.black-theme-popover {
+  width: 300px;
+  max-height: 700px;
+  overflow-y: scroll;
+}

src/styles/menu.scss

@@ -23,6 +23,10 @@ $single-menu-height: 38px;
   }
 }
 
+.el-menu--vertical {
+  background-color: #fff;
+}
+
 .el-menu {
   border-right: none !important;
   background-color: inherit !important;
@@ -139,6 +143,10 @@ $single-menu-height: 38px;
       .nest-menu .level2-menu {
         line-height: $single-menu-height;
       }
+
+      .el-tooltip {
+        width: 55px !important;
+      }
     }
   }
 }

src/utils/common.js

@@ -310,4 +310,26 @@ export function toSentenceCase(string) {
   }).join(' ')
   return s[0].toUpperCase() + s.slice(1)
 }
+
 export { BASE_URL }
+
+export function openNewWindow(url) {
+  let count
+  let top = 50
+  count = parseInt(window.sessionStorage.getItem('newWindowCount'), 10)
+  if (isNaN(count)) {
+    count = 0
+  }
+  let left = 100 + count * 100
+  top = 50 + count * 50
+  if (left + screen.width / 3 > screen.width) {
+    // 支持两排足以
+    top = screen.height / 3
+    count = 1
+    left = 100
+  }
+  let params = 'toolbar=yes,scrollbars=yes,resizable=yes'
+  params = params + `,top=${top},left=${left},width=${screen.width / 3},height=${screen.height / 3}`
+  window.sessionStorage.setItem('newWindowCount', `${count + 1}`)
+  window.open(url, '_blank', params)
+}

src/views/accounts/AccountChangeSecret/AccountChangeSecretCreateUpdate.vue

@@ -19,7 +19,7 @@ export default {
       initial: {
         is_periodic: false,
         password_rules: {
-          length: 16
+          length: 36
         },
         interval: 24,
         accounts: [],

src/views/accounts/AccountPush/AccountPushCreateUpdate.vue

@@ -21,7 +21,7 @@ export default {
       initial: {
         is_periodic: false,
         password_rules: {
-          length: 30
+          length: 36
         },
         interval: 24,
         secret_type: 'password',

src/views/acl/CommandAcl/index.vue

@@ -2,7 +2,6 @@
   <TabPage
     :active-menu.sync="config.activeMenu"
     :submenu="config.submenu"
-    @tab-click="handleTabClick"
   />
 </template>
 
@@ -35,18 +34,6 @@ export default {
         ]
       }
     }
-  },
-  methods: {
-    handleTabClick(tab) {
-      const query = _.cloneDeep(this.$route.query)
-      const newQuery = {
-        ...query,
-        tab: tab.name
-      }
-      this.$nextTick(() => {
-        this.$router.replace({ query: newQuery })
-      })
-    }
   }
 }
 </script>

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

@@ -27,7 +27,7 @@ export default {
       let tlsFields = ['use_ssl', 'ca_cert']
       const platformFieldsMap = {
         redis: ['client_cert', 'client_key'],
-        postgresql: ['client_cert', 'client_key', 'allow_invalid_cert'],
+        postgresql: ['client_cert', 'client_key', 'pg_ssl_mode'],
         mysql: ['client_cert', 'client_key', 'allow_invalid_cert'],
         mongodb: ['client_key', 'allow_invalid_cert']
       }
@@ -52,7 +52,14 @@ export default {
         },
         use_ssl: {
           label: this.$t('UseSSL'),
-          component: 'el-switch'
+          component: 'el-switch',
+          on: {
+            change: ([event], updateForm) => {
+              updateForm({
+                pg_ssl_mode: event ? 'require' : 'prefer'
+              })
+            }
+          }
         },
         allow_invalid_cert: {
           label: this.$t('AllowInvalidCert'),

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

@@ -48,7 +48,8 @@ export default {
       },
       tableConfig: {
         url: tableUrl,
-        category: 'all'
+        category: 'all',
+        extraQuery: { 'order': '-date_updated' }
       },
       headerActions: {
         handleImportClick: ({ selectedRows }) => {

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

@@ -61,7 +61,7 @@ export default {
                       row['auto_config'].ansible_enabled &&
                       row['auto_config'].ping_enabled,
                     callback: ({ row }) => {
-                      if (row.platform.name === 'Gateway') {
+                      if (row.platform.name.startsWith('Gateway')) {
                         this.GatewayVisible = true
                         const port = row.protocols.find(item => item.name === 'ssh').port
                         if (!port) {

src/views/assets/Asset/AssetList/components/BaseList.vue

@@ -191,7 +191,7 @@ export default {
                     row?.auto_config?.ansible_enabled &&
                     row?.auto_config?.ping_enabled,
                   callback: ({ row }) => {
-                    if (row.platform.name === 'Gateway') {
+                    if (row.platform.name.startsWith('Gateway')) {
                       this.GatewayVisible = true
                       const port = row.protocols.find(item => item.name === 'ssh').port
                       if (!port) {

src/views/assets/Cloud/Account/AccountDetail/AccountDetail.vue

@@ -109,7 +109,7 @@ export default {
           }
         },
         {
-          title: this.$t('Timer'),
+          title: this.$t('TimerExecution'),
           attrs: {
             model: this.object.task,
             type: 'primary',

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

@@ -73,7 +73,13 @@ export default {
           btn.loading = true
         }
       })
-      form.value.interval = parseInt(form.value.interval, 10)
+
+      if (form.value.interval && typeof form.value.interval === 'number') {
+        form.value.interval = parseInt(form.value.interval, 10)
+      } else {
+        form.value.interval = 24
+      }
+
       this.$refs.form.$refs.form.dataForm.submitForm('form', false)
     },
     handleSubmitSuccess(res) {

src/views/assets/Domain/DomainCreateUpdate.vue

@@ -30,7 +30,7 @@ export default {
               domain_enabled: true
             },
             canSelect: (row) => {
-              return row.platform?.name !== 'Gateway'
+              return !row.platform?.name.startsWith('Gateway')
             }
           }
         },

src/views/assets/Domain/DomainDetail/AssetList.vue

@@ -25,7 +25,7 @@ export default {
     return {
       tableConfig: {
         category: 'all',
-        url: `/api/v1/assets/assets/?domain=${this.$route.params.id}&exclude_platform=Gateway`,
+        url: `/api/v1/assets/assets/?domain=${this.$route.params.id}&is_gateway=0`,
         tableConfig: {
           columnsMeta: {
             actions: {

src/views/assets/Domain/DomainDetail/GatewayList.vue

@@ -39,7 +39,7 @@ export default {
   data() {
     return {
       tableConfig: {
-        url: `/api/v1/assets/gateways/?domain=${this.$route.params.id}&platform=Gateway`,
+        url: `/api/v1/assets/gateways/?domain=${this.$route.params.id}`,
         columnsExclude: [
           'info', 'spec_info', 'auto_config'
         ],
@@ -174,7 +174,7 @@ export default {
             name: 'GatewayAdd',
             title: this.$t('Add'),
             callback: function() {
-              this.AddGatewaySetting.AddGatewayDialogVisible = true
+              this.AddGatewaySetting.addGatewayDialogVisible = true
             }.bind(this)
           }
         ]
@@ -183,7 +183,7 @@ export default {
       cell: '',
       visible: false,
       AddGatewaySetting: {
-        AddGatewayDialogVisible: false
+        addGatewayDialogVisible: false
       }
     }
   },

src/views/assets/Domain/components/AddAssetDialog.vue

@@ -68,7 +68,7 @@ export default {
                 domain_enabled: true
               },
               canSelect: (row) => {
-                return row.platform?.name !== 'Gateway' && this.object.assets.map(item => item.id).indexOf(row.id) === -1
+                return !row.platform?.name.startsWith('Gateway') && this.object.assets.map(item => item.id).indexOf(row.id) === -1
               }
             }
           }

src/views/assets/Domain/components/AddGatewayDialog.vue

@@ -1,11 +1,11 @@
 <template>
   <Dialog
-    v-if="setting.AddGatewayDialogVisible"
+    v-if="setting.addGatewayDialogVisible"
     :destroy-on-close="true"
     :show-cancel="false"
     :show-confirm="false"
     :title="$tc('AddGatewayInDomain')"
-    :visible.sync="setting.AddGatewayDialogVisible"
+    :visible.sync="setting.addGatewayDialogVisible"
     after
     custom-class="asset-select-dialog"
     top="15vh"
@@ -31,7 +31,7 @@ export default {
     setting: {
       type: Object,
       default: () => {
-        return { AddGatewayDialogVisible: false }
+        return { addGatewayDialogVisible: false }
       }
     },
     object: {
@@ -64,7 +64,7 @@ export default {
               multiple: true,
               clearable: true,
               ajax: {
-                url: '/api/v1/assets/assets/?domain_enabled=true&platform=Gateway'
+                url: '/api/v1/assets/assets/?domain_enabled=true&is_gateway=1'
               },
               disabledValues: this.object.gateways.map(item => item.id)
             }
@@ -83,7 +83,7 @@ export default {
   },
   methods: {
     onSubmitSuccess(res) {
-      this.setting.AddGatewayDialogVisible = false
+      this.setting.addGatewayDialogVisible = false
       this.$emit('close', res)
     }
   }

src/views/assets/Platform/PlatformList.vue

@@ -162,7 +162,7 @@ export default {
   },
   activated() {
     setTimeout(() => {
-      this.tab.activeMenu = window.localStorage.getItem('lastTab')
+      this.tab.activeMenu = window.localStorage.getItem('lastTab') || 'host'
       this.$refs.genericListTable.reloadTable()
     }, 300)
   },

src/views/dashboard/components/ProgressChart.vue

@@ -128,7 +128,8 @@ export default {
               tip += current.label + '：' + current.total + '<br/>'
             }
             return tip
-          }
+          },
+          appendToBody: true
         },
         grid: {
           top: '60%',

src/views/ops/Adhoc/QuickJob.vue

@@ -35,6 +35,7 @@
 </template>
 
 <script>
+import $ from '@/utils/jquery-vendor.js'
 import AssetTreeTable from '@/components/Apps/AssetTreeTable'
 import QuickJobTerm from '@/views/ops/Adhoc/components/QuickJobTerm.vue'
 import CodeEditor from '@/components/Form/FormFields/CodeEditor'
@@ -286,6 +287,14 @@ export default {
         view: {
           dblClickExpand: false,
           showLine: true
+        },
+        callback: {
+          onCheck: function(_event, treeId, treeNode) {
+            const treeObj = $.fn.zTree.getZTreeObj(treeId)
+            if (treeNode.checked) {
+              treeObj.expandNode(treeNode, true, false, true)
+            }
+          }
         }
       },
       iShowTree: true

src/views/ops/Adhoc/components/QuickJobTerm.vue

@@ -75,6 +75,7 @@ export default {
         fontFamily: 'monaco, Consolas, "Lucida Console", monospace',
         lineHeight: 1.2,
         fontSize: 13,
+        scrollback: 9999999,
         rightClickSelectsWord: true,
         theme: {
           background: '#fff',

src/views/ops/Job/JobUpdateCreate.vue

@@ -98,6 +98,7 @@ export default {
           el: {
             baseUrl: '/api/v1/perms/users/self/assets/',
             baseNodeUrl: '/api/v1/perms/users/self/nodes/',
+            typeUrl: '/api/v1/perms/users/self/nodes/children-with-assets/category/tree',
             value: []
           }
         },

src/views/ops/Template/Adhoc.vue

@@ -17,7 +17,7 @@ export default {
         url: '/api/v1/ops/adhocs/',
         columnsShow: {
           min: ['name', 'actions'],
-          default: ['name', 'module', 'args', 'comment', 'scope', 'date_created', 'actions']
+          default: ['name', 'module', 'args', 'comment', 'scope', 'date_created', 'actions', 'created_by']
         },
         columnsMeta: {
           name: {
@@ -38,7 +38,8 @@ export default {
               canDelete: ({ row }) => {
                 return this.$hasPerm('ops.delete_adhoc') && row.creator === currentUserID
               },
-              hasClone: false
+              hasClone: true,
+              cloneRoute: 'AdhocCreate'
             }
           }
         }

src/views/ops/Template/Playbook.vue

@@ -24,7 +24,7 @@ export default {
         url: '/api/v1/ops/playbooks/',
         columnsShow: {
           min: ['name', 'actions'],
-          default: ['name', 'comment', 'scope', 'date_created', 'actions']
+          default: ['name', 'comment', 'scope', 'date_created', 'actions', 'created_by']
         },
         columnsMeta: {
           name: {
@@ -45,7 +45,8 @@ export default {
               canDelete: ({ row }) => {
                 return this.$hasPerm('ops.delete_playbook') && row.creator === currentUserID
               },
-              hasClone: true
+              hasClone: true,
+              cloneRoute: 'PlaybookCreate'
             }
           }
         }

src/views/perms/AssetPermission/AssetPermissionList.vue

@@ -37,7 +37,12 @@ export default {
         notShowBuiltinTree: true,
         url: '/api/v1/perms/asset-permissions/',
         nodeUrl: '/api/v1/perms/asset-permissions/',
-        treeUrl: '/api/v1/assets/nodes/children/tree/?assets=1'
+        treeUrl: '/api/v1/assets/nodes/children/tree/?assets=1',
+        edit: {
+          drag: {
+            isMove: false
+          }
+        }
       },
       tableConfig: {
         url: '/api/v1/perms/asset-permissions/',

src/views/sessions/FTPLogList.vue

@@ -5,6 +5,7 @@
 <script>
 import GenericListPage from '@/layout/components/GenericListPage'
 import { download } from '@/utils/common'
+import store from '@/store'
 
 export default {
   components: {
@@ -36,7 +37,24 @@ export default {
                     return row.has_file
                   },
                   tip: ({ row }) => {
-                    return row.has_file ? this.$t('Download') : this.$t('DownloadFTPFileTip')
+                    const ftpFileMaxStore = store.getters.publicSettings['FTP_FILE_MAX_STORE']
+
+                    const downloadTip = this.$t('Download')
+                    const fileNotStoredTip = this.$t('FTPFileNotStored')
+                    const storageNotEnabledTip = this.$t('FTPStorageNotEnabled')
+                    const unknownStorageStateTip = this.$t('FTPUnknownStorageState')
+
+                    if (row.has_file) {
+                      return downloadTip
+                    }
+
+                    if (ftpFileMaxStore === 0) {
+                      return storageNotEnabledTip
+                    } else if (ftpFileMaxStore > 0) {
+                      return fileNotStoredTip
+                    } else {
+                      return unknownStorageStateTip
+                    }
                   },
                   callback: function({ row }) {
                     // 跳转下载页面

src/views/sessions/SessionList/BaseList.vue

@@ -5,7 +5,7 @@
 <script type="text/jsx">
 import ListTable from '@/components/Table/ListTable'
 import { timeOffset } from '@/utils/time'
-import { ActionsFormatter, DetailFormatter } from '@/components/Table/TableFormatters'
+import { ActionsFormatter, ChoicesFormatter, DetailFormatter } from '@/components/Table/TableFormatters'
 
 export default {
   name: 'BaseList',
@@ -119,7 +119,11 @@ export default {
             }
           },
           is_locked: {
-            label: this.$t('IsLocked')
+            label: this.$t('IsLocked'),
+            formatter: ChoicesFormatter,
+            formatterArgs: {
+              showFalse: true
+            }
           },
           actions: {
             prop: 'actions',

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

@@ -26,11 +26,14 @@
             </span>
           </template>
         </el-table-column>
-        <el-table-column :label="$tc('Receivers')" show-overflow-tooltip>
-          <template v-slot="scope">
-            <span v-if="!scope.row.children">
-              {{ scope.row.receivers.map(item => item.name).join(', ') }}
-            </span>
+        <el-table-column :label="$tc('Receivers')">
+          <template slot-scope="scope">
+            <el-popover trigger="hover" placement="top" popper-class="black-theme-popover">
+              <p v-for="item in scope.row.receivers" :key="item.name">{{ item.name }}</p>
+              <span v-if="!scope.row.children" slot="reference" class="name-wrapper">
+                {{ scope.row.receivers.map(item => item.name).join(', ') }}
+              </span>
+            </el-popover>
           </template>
         </el-table-column>
         <el-table-column :label="$tc('Actions')" width="200">
@@ -186,4 +189,25 @@ export default {
   margin-bottom: 0;
   width: 50%;
 }
+
+::v-deep .el-table .cell {
+  display: flex;
+
+  .name-wrapper {
+    display: inline-block;
+    max-height: 55px;
+    max-width: 200px;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    vertical-align: middle;
+    cursor: pointer;
+  }
+}
+
+::v-deep .black-theme-popover .el-popover__inner {
+  background-color: #000 !important;
+  color: #fff !important;
+  border-color: #000 !important;
+}
 </style>

src/views/settings/Terminal/Endpoint/EndpointCreateUpdate.vue

@@ -33,7 +33,7 @@ export default {
             'redis_port', 'sqlserver_port', 'oracle_port_range'
           ]
         ],
-        [this.$t('Other'), ['comment']]
+        [this.$t('Other'), ['is_active', 'comment']]
       ],
       fieldsMeta: {
         host: {
@@ -41,13 +41,17 @@ export default {
         },
         oracle_port_range: {
           disabled: true
+        },
+        is_active: {
+          disabled: this.$route.params.id === '00000000-0000-0000-0000-000000000001'
         }
       },
       hasDetailInMsg: false
     }
   },
   computed: {},
-  created() {},
+  created() {
+  },
   methods: {}
 }
 </script>

src/views/settings/Terminal/Endpoint/EndpointList.vue

@@ -25,7 +25,7 @@ export default {
             'name', 'host', 'actions',
             'http_port', 'https_port', 'ssh_port', 'rdp_port',
             'mysql_port', 'mariadb_port', 'postgresql_port',
-            'redis_port', 'sqlserver_port', 'oracle_port_range'
+            'redis_port', 'sqlserver_port', 'oracle_port_range', 'is_active'
           ]
         },
         columnsMeta: {

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

@@ -19,6 +19,7 @@ import AssetPermissionAsset from '@/views/perms/AssetPermission/AssetPermissionD
 import AssetPermissionDetail from '@/views/perms/AssetPermission/AssetPermissionDetail/index.vue'
 import AssetPermissionAccount from '@/views/perms/AssetPermission/AssetPermissionDetail/AssetPermissionAccount.vue'
 import UserAssetPermissionRules from './UserAssetPermissionRules'
+import store from '@/store'
 
 export default {
   components: {
@@ -63,7 +64,7 @@ export default {
           {
             title: this.$t('UserAclLists'),
             name: 'UserLoginAcl',
-            hidden: () => !vm.$hasPerm('acls.view_loginacl')
+            hidden: () => !vm.$hasPerm('acls.view_loginacl') || !store.getters.publicSettings.XPACK_LICENSE_IS_VALID
           },
           {
             title: this.$t('UserSession'),

src/views/workbench/myassets/index.vue

@@ -15,6 +15,8 @@
 import GrantedAssets from '@/components/Apps/GrantedAssets/index.vue'
 import Page from '@/layout/components/Page/index.vue'
 import { EditableInputFormatter } from '@/components/Table/TableFormatters'
+import { getPreference } from '@/api/settings'
+import { openNewWindow } from '@/utils/common'
 
 export default {
   components: {
@@ -25,6 +27,7 @@ export default {
     return {
       treeUrl: `/api/v1/perms/users/self/nodes/children/tree/`,
       tableUrl: `/api/v1/perms/users/self/assets/`,
+      preference: {},
       actions: {
         width: '88px',
         align: 'center',
@@ -41,8 +44,13 @@ export default {
               can: ({ row }) => row.is_active,
               callback: ({ row }) => {
                 const oid = this.$store.getters.currentOrg ? this.$store.getters.currentOrg.id : ''
-                const url = `/luna/?login_to=${row.id}${oid ? `&oid=${oid}` : ''}`
-                window.open(url, '_blank')
+                const url = `/luna/connect?login_to=${row.id}`
+                if (this.preference?.basic?.connect_default_open_method === 'new') {
+                  openNewWindow(url)
+                } else {
+                  const url = `/luna/?login_to=${row.id}${oid ? `&oid=${oid}` : ''}`
+                  window.open(url, '_blank')
+                }
               }
             },
             {
@@ -81,6 +89,9 @@ export default {
   },
   mounted() {
     this.refreshAllFavorites()
+    this.preference = getPreference().then((resp) => {
+      this.preference = resp
+    })
   },
   methods: {
     refreshAllFavorites() {

src/views/workbench/myhome/components/Session.vue

@@ -4,6 +4,8 @@
 
 <script>
 import HomeCard from './HomeCard.vue'
+import { getPreference } from '@/api/settings'
+import { openNewWindow } from '@/utils/common'
 
 export default {
   name: 'Announcement',
@@ -13,6 +15,7 @@ export default {
   data() {
     const vm = this
     return {
+      preference: {},
       cardConfig: {
         title: this.$t('RecentSession')
       },
@@ -71,7 +74,11 @@ export default {
                   type: 'primary',
                   can: ({ row }) => row.is_active,
                   callback: ({ row }) => {
-                    window.open(`/luna/?login_to=${row.asset_id}&login_account=${row.account_id}`, '_blank')
+                    if (this.preference?.basic?.connect_default_open_method === 'new') {
+                      openNewWindow(`/luna/connect?login_to=${row.asset_id}&login_account=${row.account_id}`)
+                    } else {
+                      window.open(`/luna/?login_to=${row.asset_id}&login_account=${row.account_id}`, '_blank')
+                    }
                   }
                 }
               ]
@@ -82,6 +89,11 @@ export default {
         paginationSize: 10
       }
     }
+  },
+  mounted() {
+    getPreference().then(resp => {
+      this.preference = resp
+    })
   }
 }
 </script>

yarn.lock

@@ -9227,7 +9227,7 @@ npm-normalize-package-bin@^1.0.0, npm-normalize-package-bin@^1.0.1:
   resolved "https://registry.npmjs.org/npm-normalize-package-bin/-/npm-normalize-package-bin-1.0.1.tgz"
   integrity sha512-EPfafl6JL5/rU+ot6P3gRSCpPDW5VmIzX959Ob1+ySFUuuYHWHekXpwdUZcKP5C+DS4GEtdJluwBjnsNDl+fSA==
 
-npm-package-arg@^8.0.0, npm-package-arg@^8.0.1, npm-package-arg@^8.1.0, npm-package-arg@^8.1.2, npm-package-arg@^8.1.4, npm-package-arg@^8.1.5:
+npm-package-arg@^8.0.0, npm-package-arg@^8.0.1, npm-package-arg@^8.1.0, npm-package-arg@^8.1.1, npm-package-arg@^8.1.2, npm-package-arg@^8.1.5:
   version "8.1.5"
   resolved "https://registry.npmjs.org/npm-package-arg/-/npm-package-arg-8.1.5.tgz"
   integrity sha512-LhgZrg0n0VgvzVdSm1oiZworPbTxYHUJCgtsJW8mGvlDpxTM1vSJc3m5QZeUkhAHIzbz3VCHd/R4osi1L1Tg/Q==
@@ -9733,7 +9733,7 @@ p-try@^2.0.0:
   resolved "https://registry.npmmirror.com/p-try/-/p-try-2.2.0.tgz"
   integrity sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==
 
-pacote@^11.1.11, pacote@^11.2.6, pacote@^11.3.1, pacote@^11.3.4, pacote@^11.3.5:
+pacote@^11.1.11, pacote@^11.2.6, pacote@^11.3.0, pacote@^11.3.1, pacote@^11.3.5:
   version "11.3.5"
   resolved "https://registry.npmjs.org/pacote/-/pacote-11.3.5.tgz"
   integrity sha512-fT375Yczn4zi+6Hkk2TBe1x1sP8FgFsEIZ2/iWaXY2r/NkhDJfxbcn5paz1+RTFCyNf+dPnaoBDJoAxXSU8Bkg==
@@ -9931,10 +9931,10 @@ path-to-regexp@0.1.7:
   resolved "https://registry.npmmirror.com/path-to-regexp/-/path-to-regexp-0.1.7.tgz"
   integrity sha512-5DFkuoqlv1uYQKxy8omFBeJPQcdoE07Kv2sferDCrAq1ohOU+MSDswDIbnx3YAM60qIOnYa53wBhXW0EbMonrQ==
 
-path-to-regexp@2.4.0:
-  version "2.4.0"
-  resolved "https://registry.npmmirror.com/path-to-regexp/-/path-to-regexp-2.4.0.tgz"
-  integrity sha512-G6zHoVqC6GGTQkZwF4lkuEyMbVOjoBKAEybQUypI1WTkqinCOrq2x6U2+phkJ1XsEMTy4LjtwPI7HW+NVrRR2w==
+path-to-regexp@3.3.0:
+  version "3.3.0"
+  resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-3.3.0.tgz#f7f31d32e8518c2660862b644414b6d5c63a611b"
+  integrity sha512-qyCH421YQPS2WFDxDjftfc1ZR5WKQzVzqsp4n9M2kQhVOo/ByahFoUNJfl58kOcEGfQ//7weFTDhm+ss8Ecxgw==
 
 path-type@^1.0.0:
   version "1.1.0"
@@ -11538,7 +11538,7 @@ serve-index@^1.9.1:
     mime-types "~2.1.17"
     parseurl "~1.3.2"
 
-serve-static@1.15.0, serve-static@^1.13.2:
+serve-static@1.15.0:
   version "1.15.0"
   resolved "https://registry.npmmirror.com/serve-static/-/serve-static-1.15.0.tgz"
   integrity sha512-XGuRDNjXUijsUL0vl6nSD7cwURuzEgglbOaFuZM9g3kwDXOWVTck0jLzjPzGD+TazWbboZYu52/9/XPdUgne9g==
@@ -11548,6 +11548,16 @@ serve-static@1.15.0, serve-static@^1.13.2:
     parseurl "~1.3.3"
     send "0.18.0"
 
+serve-static@^1.16.0:
+  version "1.16.0"
+  resolved "https://registry.yarnpkg.com/serve-static/-/serve-static-1.16.0.tgz#2bf4ed49f8af311b519c46f272bf6ac3baf38a92"
+  integrity sha512-pDLK8zwl2eKaYrs8mrPZBJua4hMplRWJ1tIFksVC3FtBEBnl8dxgeHtsaMS8DhS9i4fLObaon6ABoc4/hQGdPA==
+  dependencies:
+    encodeurl "~1.0.2"
+    escape-html "~1.0.3"
+    parseurl "~1.3.3"
+    send "0.18.0"
+
 set-blocking@^2.0.0, set-blocking@~2.0.0:
   version "2.0.0"
   resolved "https://registry.npmmirror.com/set-blocking/-/set-blocking-2.0.0.tgz"