mirror of
https://github.com/jumpserver/lina.git
synced 2025-04-27 11:10:51 +00:00
Merge branch 'pam' of github.com:jumpserver/lina into pam
This commit is contained in:
ibuler
commit
caf34a96e6
@ -50,9 +50,7 @@ export default {
|
||||
},
|
||||
columnsMeta: {
|
||||
name: {
|
||||
formatter: (row) => {
|
||||
return vm.$hasPerm('users.view_user') ? DetailFormatter : ''
|
||||
},
|
||||
formatter: vm.$hasPerm('users.view_user') ? DetailFormatter : '',
|
||||
formatterArgs: {
|
||||
route: 'UserDetail'
|
||||
}
|
||||
|
||||
@ -41,23 +41,10 @@ export default {
|
||||
computed: {
|
||||
chartOption() {
|
||||
return {
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
formatter: '{b}: {c} ({d}%)',
|
||||
backgroundColor: 'rgba(255, 255, 255, 0.9)',
|
||||
borderColor: '#eee',
|
||||
borderWidth: 1,
|
||||
padding: [10, 15],
|
||||
textStyle: {
|
||||
color: '#666'
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
type: 'scroll',
|
||||
orient: 'horizontal',
|
||||
top: 0,
|
||||
left: 0,
|
||||
right: 0,
|
||||
orient: 'vertical',
|
||||
top: '13%',
|
||||
right: '15%',
|
||||
itemGap: 20,
|
||||
textStyle: {
|
||||
color: '#666',
|
||||
@ -65,33 +52,31 @@ export default {
|
||||
},
|
||||
icon: 'circle',
|
||||
itemWidth: 8,
|
||||
itemHeight: 8
|
||||
itemHeight: 8,
|
||||
formatter: (name) => {
|
||||
const data = [
|
||||
{ name: '账号收集任务', value: this.counter.total_count_gathered_account_automation },
|
||||
{ name: '账号推送任务', value: this.counter.total_count_push_account_automation },
|
||||
{ name: '账号备份任务', value: this.counter.total_count_backup_account_automation },
|
||||
{ name: '风险账号', value: this.counter.total_count_risk_account },
|
||||
{ name: '集成应用', value: this.counter.total_count_integration_application }
|
||||
]
|
||||
const item = data.find(item => item.name === name)
|
||||
|
||||
return name.padEnd(10, '\u2003') + (item.value || 0)
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '任务分布',
|
||||
type: 'pie',
|
||||
radius: ['45%', '65%'],
|
||||
center: ['50%', '55%'],
|
||||
avoidLabelOverlap: false,
|
||||
itemStyle: {
|
||||
borderRadius: 10,
|
||||
borderColor: '#fff',
|
||||
borderWidth: 8
|
||||
},
|
||||
radius: ['50%', '70'],
|
||||
center: ['25%', '50%'],
|
||||
label: {
|
||||
show: true,
|
||||
position: 'outside',
|
||||
formatter: '{b}\n{c}',
|
||||
color: '#666',
|
||||
fontSize: 12,
|
||||
lineHeight: 18
|
||||
show: false
|
||||
},
|
||||
labelLine: {
|
||||
show: true,
|
||||
length: 15,
|
||||
length2: 10,
|
||||
smooth: true
|
||||
show: false
|
||||
},
|
||||
data: [
|
||||
{
|
||||
@ -152,17 +137,15 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
async getResourcesCount() {
|
||||
return this.$axios.get('/api/v1/accounts/pam-dashboard/',
|
||||
{
|
||||
params: {
|
||||
total_count_gathered_account_automation: 1,
|
||||
total_count_push_account_automation: 1,
|
||||
total_count_backup_account_automation: 1,
|
||||
total_count_risk_account: 1,
|
||||
total_count_integration_application: 1
|
||||
}
|
||||
return this.$axios.get('/api/v1/accounts/pam-dashboard/', {
|
||||
params: {
|
||||
total_count_gathered_account_automation: 1,
|
||||
total_count_push_account_automation: 1,
|
||||
total_count_backup_account_automation: 1,
|
||||
total_count_risk_account: 1,
|
||||
total_count_integration_application: 1
|
||||
}
|
||||
)
|
||||
})
|
||||
},
|
||||
initChart() {
|
||||
this.chart = echarts.init(this.$refs.chartRef)
|
||||
@ -192,7 +175,12 @@ export default {
|
||||
box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
|
||||
|
||||
.header {
|
||||
padding: 16px 20px 0;
|
||||
padding: 1.25rem;
|
||||
|
||||
.content {
|
||||
justify-content: flex-start;
|
||||
padding: unset;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
@ -205,7 +193,7 @@ export default {
|
||||
|
||||
.chart-container {
|
||||
width: 100%;
|
||||
height: 420px;
|
||||
height: 226px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,14 +1,23 @@
|
||||
<template>
|
||||
<div class="box">
|
||||
<div style="margin-bottom: 12px;">
|
||||
<div class="card">
|
||||
<div class="title-section">
|
||||
<Title :config="config" />
|
||||
</div>
|
||||
<div class="content">
|
||||
<el-row justify="space-between" type="flex">
|
||||
<el-col v-for="item of summaryItems" :key="item.title" :md="8" :sm="12" :xs="12">
|
||||
|
||||
<div class="metrics-section">
|
||||
<template v-for="item of summaryItems">
|
||||
<SummaryCard
|
||||
:key="item.title"
|
||||
:body="item.body"
|
||||
:title="item.title"
|
||||
class="metric-item"
|
||||
/>
|
||||
</template>
|
||||
<!-- <el-row :gutter="20">
|
||||
<el-col v-for="item of summaryItems" :key="item.title" :md="6" :sm="12" :xs="12">
|
||||
<SummaryCard :body="item.body" :title="item.title" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-row> -->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -38,10 +47,10 @@ export default {
|
||||
summaryItems() {
|
||||
return [
|
||||
{
|
||||
title: this.$t('LongTimeNoLogin'),
|
||||
title: this.$t('LeakedPassword'),
|
||||
body: {
|
||||
route: { name: `SessionList`, params: { activeMenu: 'OnlineList' }},
|
||||
count: this.counter.total_long_time_no_login_accounts
|
||||
count: this.counter.total_leaked_password_accounts,
|
||||
disabled: true
|
||||
}
|
||||
},
|
||||
{
|
||||
@ -51,6 +60,14 @@ export default {
|
||||
disabled: true
|
||||
}
|
||||
},
|
||||
{
|
||||
title: this.$t('LongTimeNoLogin'),
|
||||
body: {
|
||||
route: { name: `SessionList`, params: { activeMenu: 'OnlineList' }},
|
||||
count: this.counter.total_long_time_no_login_accounts
|
||||
}
|
||||
},
|
||||
|
||||
{
|
||||
title: this.$t('LongTimeNoChangeSecret'),
|
||||
body: {
|
||||
@ -58,19 +75,24 @@ export default {
|
||||
disabled: true
|
||||
}
|
||||
},
|
||||
{
|
||||
title: this.$t('LeakedPassword'),
|
||||
body: {
|
||||
count: this.counter.total_leaked_password_accounts,
|
||||
disabled: true
|
||||
}
|
||||
},
|
||||
{
|
||||
title: this.$t('RepeatedPassword'),
|
||||
body: {
|
||||
count: this.counter.total_repeated_password_accounts,
|
||||
disabled: true
|
||||
}
|
||||
},
|
||||
{
|
||||
title: 'Unmanaged'
|
||||
},
|
||||
{
|
||||
title: 'Password expiration'
|
||||
},
|
||||
{
|
||||
title: 'Wrong password'
|
||||
},
|
||||
{
|
||||
title: 'No admin'
|
||||
}
|
||||
]
|
||||
}
|
||||
@ -100,34 +122,49 @@ export default {
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.box {
|
||||
padding: 20px;
|
||||
background: #FFFFFF;
|
||||
.card {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1.25rem;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 1.25rem;
|
||||
background-color: #FFF;
|
||||
overflow: hidden;
|
||||
|
||||
.content {
|
||||
.el-col {
|
||||
padding-left: 16px;
|
||||
border-left: 1px solid #EFF0F1;
|
||||
.metrics-section {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
row-gap: 1.25rem;
|
||||
|
||||
&:first-child {
|
||||
padding-left: 0;
|
||||
border-left: none;
|
||||
}
|
||||
}
|
||||
|
||||
.sub {
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
color: #646A73;
|
||||
}
|
||||
|
||||
.num {
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-size: 24px;
|
||||
.metric-item {
|
||||
width: 25%;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s ease-in-out;
|
||||
|
||||
::v-deep .summary-header {
|
||||
.title {
|
||||
color: #646A73;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 400;
|
||||
line-height: 1.4rem;
|
||||
text-transform: unset;
|
||||
}
|
||||
|
||||
h3 span {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
transform: translateY(-0.2rem);
|
||||
|
||||
::v-deep .no-margins {
|
||||
.num {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -16,6 +16,8 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<el-divider />
|
||||
|
||||
<div class="metrics-section">
|
||||
<div
|
||||
v-for="item in summaryItems"
|
||||
@ -76,12 +78,17 @@ export default {
|
||||
<style lang="scss" scoped>
|
||||
$text-color: #646A73;
|
||||
|
||||
.el-divider--horizontal {
|
||||
margin: unset !important;
|
||||
}
|
||||
|
||||
.card {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1.25rem;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 1.25rem;
|
||||
background-color: #FFF;
|
||||
overflow: hidden;
|
||||
|
||||
|
||||
@ -2,34 +2,28 @@
|
||||
<Page>
|
||||
<div v-if="this.$hasPerm('rbac.view_console')">
|
||||
<Announcement />
|
||||
<div class="dashboard-container">
|
||||
<el-row :gutter="20" class="top-summary">
|
||||
<el-col :lg="16" :xs="24" class="left-column">
|
||||
<div class="mission-wrapper">
|
||||
<DataSummary class="summary-card" />
|
||||
</div>
|
||||
<div class="account-wrapper">
|
||||
<AccountSummary class="summary-card" />
|
||||
</div>
|
||||
<div class="risk-wrapper">
|
||||
<RiskSummary class="summary-card" />
|
||||
</div>
|
||||
|
||||
<div class="summary-container">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="16">
|
||||
<DataSummary class="data-summery" />
|
||||
</el-col>
|
||||
<el-col :lg="8" :xs="24" class="right-column">
|
||||
<MissionSummery class="summary-card" />
|
||||
<el-col :span="8">
|
||||
<AccountSecretSummary class="account-secret-summary" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="20" class="middle-section">
|
||||
<el-col :span="24">
|
||||
<AccountSecretSummary class="secret-summary" />
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="16">
|
||||
<RiskSummary class="risk-summary" />
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<MissionSummery class="mission-summery" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="20" class="bottom-section">
|
||||
<el-col :span="24" class="asset-proportion-wrapper">
|
||||
<AssetProportionSummary :url="url" class="summary-card" />
|
||||
</el-col>
|
||||
<el-row>
|
||||
<AssetProportionSummary :url="url" class="asset-proportion-summary" />
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
@ -43,7 +37,6 @@ import { Announcement } from '@/components'
|
||||
import Page403 from '@/views/403'
|
||||
import DataSummary from './DataSummary'
|
||||
import RiskSummary from './RiskSummary.vue'
|
||||
import AccountSummary from './AccountSummary.vue'
|
||||
import AssetProportionSummary from './AssetProportionSummary'
|
||||
import MissionSummery from './MissionSummery.vue'
|
||||
import AccountSecretSummary from '../ChangeSecret/AccountSummary.vue'
|
||||
@ -57,7 +50,6 @@ export default {
|
||||
RiskSummary,
|
||||
Announcement,
|
||||
MissionSummery,
|
||||
AccountSummary,
|
||||
AccountSecretSummary,
|
||||
AssetProportionSummary
|
||||
},
|
||||
@ -70,80 +62,31 @@ export default {
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.dashboard-container {
|
||||
.top-summary,
|
||||
.middle-section,
|
||||
.bottom-section {
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
.el-row {
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
|
||||
.top-summary {
|
||||
.left-column {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1.25rem;
|
||||
}
|
||||
.summary-container {
|
||||
|
||||
.right-column {
|
||||
max-height: 540px;
|
||||
height: 540px;
|
||||
|
||||
::v-deep .el-row,
|
||||
::v-deep .el-col {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bottom-section {
|
||||
.data-summary-wrapper {
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
.summary-card {
|
||||
background: #fff;
|
||||
padding: 1.25rem;
|
||||
height: 100%;
|
||||
box-shadow: 0 1px 4px rgba(0, 21, 41, .08);
|
||||
transition: all .3s;
|
||||
.account-secret-summary,
|
||||
.asset-proportion-summary,
|
||||
.risk-summary,
|
||||
.mission-summery {
|
||||
border-radius: 0.5rem;
|
||||
}
|
||||
|
||||
::v-deep .card-content {
|
||||
padding-bottom: unset;
|
||||
border-bottom: unset;
|
||||
}
|
||||
.account-secret-summary,
|
||||
.asset-proportion-summary {
|
||||
margin-top: unset;
|
||||
}
|
||||
|
||||
::v-deep .ring {
|
||||
display: none;
|
||||
.account-secret-summary {
|
||||
margin-top: unset;
|
||||
|
||||
::v-deep .echarts {
|
||||
height: 205px;
|
||||
}
|
||||
}
|
||||
|
||||
.mission-summary {
|
||||
background: #fff;
|
||||
padding: 1.25rem;
|
||||
box-shadow: 0 1px 4px rgba(0, 21, 41, .08);
|
||||
}
|
||||
|
||||
.secret-summary {
|
||||
background: #fff;
|
||||
padding: 1.25rem;
|
||||
margin-bottom: 1.25rem;
|
||||
box-shadow: 0 1px 4px rgba(0, 21, 41, .08);
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1200px) {
|
||||
.right-column {
|
||||
margin-top: 1.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
padding: 0.625rem;
|
||||
|
||||
.el-col {
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user