perf: update loader

This commit is contained in:
ibuler 2024-10-15 13:58:56 +08:00
parent d775ffa501
commit d90aba37cf
9 changed files with 112 additions and 36 deletions

View File

@ -2,37 +2,70 @@
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
<meta http-equiv="Expires" content="0"> <meta content="0" http-equiv="Expires">
<meta http-equiv="Pragma" content="no-cache"> <meta content="no-cache" http-equiv="Pragma">
<meta http-equiv="Cache-control" content="no-cache"> <meta content="no-cache" http-equiv="Cache-control">
<meta http-equiv="Cache" content="no-cache"> <meta content="no-cache" http-equiv="Cache">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<title><%= webpackConfig.name %></title> <title><%= webpackConfig.name %></title>
<link rel="stylesheet" href="<%= BASE_URL %>theme/element-ui.css"> <link href="<%= BASE_URL %>theme/element-ui.css" rel="stylesheet">
<style>
#loading {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
background-color: white;
z-index: 9999;
}
.spinner {
width: 50px;
height: 50px;
border: 5px solid rgba(0, 0, 0, 0.1);
border-radius: 50%;
border-top-color: #3498db;
animation: spin 1s infinite linear;
}
@keyframes spin {
to {
transform: rotate(360deg);
}
}
</style>
</head> </head>
<body> <body>
<noscript> <noscript>
<strong>We're sorry but <%= webpackConfig.name %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong> <strong>We're sorry but <%= webpackConfig.name %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript> </noscript>
<script> <script>
window.onload = function() { window.onload = function () {
if (location.pathname === '/') { if (location.pathname === '/') {
location.pathname = '/ui/' location.pathname = '/ui/'
} }
const pathname = window.location.pathname const pathname = window.location.pathname
if (pathname.startsWith('/core')) { if (pathname.startsWith('/core')) {
return return
} }
if(pathname.indexOf('/ui') === -1) { if (pathname.indexOf('/ui') === -1) {
window.location.href = window.location.origin + '/ui/#' + pathname window.location.href = window.location.origin + '/ui/#' + pathname
} }
if (pathname.startsWith('/ui/#/chat')) { if (pathname.startsWith('/ui/#/chat')) {
window.location.href = window.location.origin + pathname window.location.href = window.location.origin + pathname
} }
} }
</script> </script>
<div id="app"></div> <div id="app">
</div>
<div id="loading">
<div class="spinner"></div>
</div>
<!-- built files will be auto injected --> <!-- built files will be auto injected -->
</body> </body>
</html> </html>

View File

@ -92,6 +92,15 @@ new Vue({
i18n, i18n,
router, router,
store, store,
mounted() {
// 移除加载页面
const loadingElement = document.getElementById('loading')
if (loadingElement) {
setTimeout(() => {
loadingElement.style.display = 'none'
}, 500)
}
},
render: h => h(App) render: h => h(App)
}) })

View File

@ -21,8 +21,7 @@ export default [
component: () => import('@/views/accounts/AccountDiscover/index.vue'), component: () => import('@/views/accounts/AccountDiscover/index.vue'),
name: 'AccountDiscoverList', name: 'AccountDiscoverList',
meta: { meta: {
menuTitle: i18n.t('GatherAccounts'), title: i18n.t('DiscoverAccounts'),
title: i18n.t('AccountDiscoverTaskList'),
// activeMenu: '/console/accounts/automations', // activeMenu: '/console/accounts/automations',
permissions: ['accounts.view_gatheredaccount'] permissions: ['accounts.view_gatheredaccount']
} }

View File

@ -0,0 +1,13 @@
<script>
export default {
name: 'AccountChangeDashboard'
}
</script>
<template>
<h1>账号改密汇总</h1>
</template>
<style scoped>
</style>

View File

@ -24,7 +24,8 @@ export default {
interval: 24, interval: 24,
accounts: [], accounts: [],
secret_type: 'password', secret_type: 'password',
secret_strategy: 'specific' secret_strategy: 'specific',
ssh_key_change_strategy: 'set_jms'
}, },
url: '/api/v1/accounts/change-secret-automations/', url: '/api/v1/accounts/change-secret-automations/',
encryptedFields: ['secret'], encryptedFields: ['secret'],
@ -41,7 +42,8 @@ export default {
], ],
[this.$t('Automations'), ['params']], [this.$t('Automations'), ['params']],
[this.$t('Periodic'), ['is_periodic', 'interval', 'crontab']], [this.$t('Periodic'), ['is_periodic', 'interval', 'crontab']],
[this.$t('Other'), ['is_active', 'recipients', 'comment']] [this.$t('Notification'), ['recipients']],
[this.$t('Other'), ['is_active', 'comment']]
], ],
fieldsMeta: { fieldsMeta: {
...getChangeSecretFields(), ...getChangeSecretFields(),

View File

@ -1,5 +1,5 @@
import i18n from '@/i18n/i18n' import i18n from '@/i18n/i18n'
import { PasswordRule, TagInput, UpdateToken } from '@/components/Form/FormFields' import { PasswordRule, Select2, TagInput, UpdateToken } from '@/components/Form/FormFields'
import { crontab, interval, is_periodic } from '../../accounts/const' import { crontab, interval, is_periodic } from '../../accounts/const'
export const getChangeSecretFields = () => { export const getChangeSecretFields = () => {
@ -49,8 +49,22 @@ export const getChangeSecretFields = () => {
label: i18n.t('PasswordRule'), label: i18n.t('PasswordRule'),
hidden: ({ secret_strategy, secret_type }) => (secret_strategy === 'specific' || secret_type !== 'password') hidden: ({ secret_strategy, secret_type }) => (secret_strategy === 'specific' || secret_type !== 'password')
}, },
recipients: { pre_notify: {
label: i18n.t('Recipient'), label: i18n.t('Pre Recipient'),
component: Select2,
el: {
value: [],
ajax: {
url: '/api/v1/users/users/?fields_size=mini',
transformOption: (item) => {
return { label: item.name + '(' + item.username + ')', value: item.id }
}
}
}
},
post_notify: {
label: i18n.t('Post Recipient'),
component: Select2,
el: { el: {
value: [], value: [],
ajax: { ajax: {

View File

@ -16,10 +16,9 @@ export default {
activeMenu: 'AccountChangeSecretList', activeMenu: 'AccountChangeSecretList',
submenu: [ submenu: [
{ {
title: this.$t('AccountChangeSecret'), title: this.$t('Overview'),
name: 'AccountChangeSecretList', name: 'AccountChangeDashboard',
hidden: () => !this.$hasPerm('accounts.view_changesecretautomation'), component: () => import('@/views/accounts/AccountChangeSecret/AccountChangeDashboard.vue')
component: () => import('@/views/accounts/AccountChangeSecret/AccountChangeSecretList.vue')
}, },
{ {
title: this.$t('ExecutionList'), title: this.$t('ExecutionList'),
@ -28,6 +27,12 @@ export default {
component: () => import( component: () => import(
'@/views/accounts/AccountChangeSecret/AccountChangeSecretDetail/AccountChangeSecretExecution/AccountChangeSecretExecutionList.vue' '@/views/accounts/AccountChangeSecret/AccountChangeSecretDetail/AccountChangeSecretExecution/AccountChangeSecretExecutionList.vue'
) )
},
{
title: this.$t('AccountChangeSecret'),
name: 'AccountChangeSecretList',
hidden: () => !this.$hasPerm('accounts.view_changesecretautomation'),
component: () => import('@/views/accounts/AccountChangeSecret/AccountChangeSecretList.vue')
} }
] ]
} }

View File

@ -15,8 +15,9 @@ export default {
return { return {
fields: [ fields: [
[this.$t('Basic'), ['name', 'nodes', 'assets']], [this.$t('Basic'), ['name', 'nodes', 'assets']],
[this.$t('发现配置'), ['is_sync_account', 'recipients']],
[this.$t('Periodic'), ['is_periodic', 'crontab', 'interval']], [this.$t('Periodic'), ['is_periodic', 'crontab', 'interval']],
[this.$t('Other'), ['is_sync_account', 'is_active', 'recipients', 'comment']] [this.$t('Other'), ['is_active', 'comment']]
], ],
url: '/api/v1/accounts/gather-account-automations/', url: '/api/v1/accounts/gather-account-automations/',
hasDetailInMsg: false, hasDetailInMsg: false,

View File

@ -38,9 +38,9 @@ export default {
}, },
{ {
id: 'gather_account', id: 'gather_account',
display_name: this.$t('GatherAccounts'), display_name: this.$t('DiscoverAccounts'),
name: 'AccountDiscoverList', name: 'AccountDiscoverList',
comment: this.$t('GatherAccountsHelpText'), comment: this.$t('DiscoverAccountsHelpText'),
icon: 'gather-account', icon: 'gather-account',
edition: 'enterprise', edition: 'enterprise',
tags: ['ansible'] tags: ['ansible']