Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Perf: Perf Dashboard #4608

Merged
merged 1 commit into from
Jan 22, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
82 changes: 35 additions & 47 deletions src/views/dashboard/Pam/MissionSummery.vue
Original file line number Diff line number Diff line change
Expand Up @@ -41,57 +41,42 @@ 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',
fontSize: 12
},
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: [
{
Expand Down Expand Up @@ -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)
Expand Down Expand Up @@ -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 {
Expand All @@ -205,7 +193,7 @@ export default {

.chart-container {
width: 100%;
height: 420px;
height: 226px;
}
}
}
Expand Down
111 changes: 74 additions & 37 deletions src/views/dashboard/Pam/RiskSummary.vue
Original file line number Diff line number Diff line change
@@ -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>
Expand Down Expand Up @@ -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
}
},
{
Expand All @@ -52,16 +61,17 @@ export default {
}
},
{
title: this.$t('LongTimeNoChangeSecret'),
title: this.$t('LongTimeNoLogin'),
body: {
count: this.counter.total_long_time_change_password_accounts,
disabled: true
route: { name: `SessionList`, params: { activeMenu: 'OnlineList' }},
count: this.counter.total_long_time_no_login_accounts
}
},

{
title: this.$t('LeakedPassword'),
title: this.$t('LongTimeNoChangeSecret'),
body: {
count: this.counter.total_leaked_password_accounts,
count: this.counter.total_long_time_change_password_accounts,
disabled: true
}
},
Expand All @@ -71,6 +81,18 @@ export default {
count: this.counter.total_repeated_password_accounts,
disabled: true
}
},
{
title: 'Unmanaged'
},
{
title: 'Password expiration'
},
{
title: 'Wrong password'
},
{
title: 'No admin'
}
]
}
Expand Down Expand Up @@ -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;

.metrics-section {
display: flex;
flex-wrap: wrap;
row-gap: 1.25rem;

.metric-item {
width: 25%;
cursor: pointer;
transition: all 0.3s ease-in-out;

.content {
.el-col {
padding-left: 16px;
border-left: 1px solid #EFF0F1;
::v-deep .summary-header {
.title {
color: #646A73;
font-size: 0.9rem;
font-weight: 400;
line-height: 1.4rem;
text-transform: unset;
}

&:first-child {
padding-left: 0;
border-left: none;
h3 span {
font-size: 1.5rem;
}
}
}

.sub {
font-style: normal;
font-weight: 400;
font-size: 12px;
line-height: 20px;
color: #646A73;
}
&:hover {
transform: translateY(-0.2rem);

.num {
font-style: normal;
font-weight: 500;
font-size: 24px;
cursor: pointer;
::v-deep .no-margins {
.num {
color: var(--color-primary);
}
}
}
}
}
}
Expand Down
7 changes: 7 additions & 0 deletions src/views/dashboard/Pam/SummaryChart.vue
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,8 @@
</div>
</div>

<el-divider />

<div class="metrics-section">
<div
v-for="item in summaryItems"
Expand Down Expand Up @@ -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;

Expand Down
Loading
Loading