mirror of
https://github.com/1Panel-dev/1Panel.git
synced 2025-01-19 08:19:15 +08:00
Revert "style:优化概览界面的布局 (#6491)"
This reverts commit 7f06c7e92e565bd5ab5b9703377c0d8f814443e6.
This commit is contained in:
parent
ec4d708569
commit
cb6c58cb5d
@ -1,14 +1,16 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<div>
|
<body>
|
||||||
<el-row type="flex" justify="center">
|
<div>
|
||||||
<h1>{{ loadErrInfo() }}</h1>
|
<el-row type="flex" justify="center">
|
||||||
</el-row>
|
<h1>{{ loadErrInfo() }}</h1>
|
||||||
</div>
|
</el-row>
|
||||||
<hr />
|
</div>
|
||||||
<div>
|
<hr />
|
||||||
<el-row type="flex" justify="center"><span>nginx</span></el-row>
|
<div>
|
||||||
</div>
|
<el-row type="flex" justify="center"><span>nginx</span></el-row>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<el-card class="router_card">
|
<el-card class="router_card">
|
||||||
<div class="flex w-full justify-between items-center md:justify-between md:flex-row">
|
<div class="flex w-full flex-col md:justify-between md:flex-row">
|
||||||
<el-radio-group v-model="activeName" @change="handleChange">
|
<el-radio-group v-model="activeName" @change="handleChange">
|
||||||
<el-radio-button
|
<el-radio-button
|
||||||
class="router_card_button"
|
class="router_card_button"
|
||||||
|
@ -42,37 +42,39 @@
|
|||||||
|
|
||||||
<el-row :gutter="20" style="margin-top: 20px">
|
<el-row :gutter="20" style="margin-top: 20px">
|
||||||
<el-col :xs="24" :sm="24" :md="16" :lg="16" :xl="16">
|
<el-col :xs="24" :sm="24" :md="16" :lg="16" :xl="16">
|
||||||
<CardWithHeader :header="$t('home.overview')">
|
<CardWithHeader :header="$t('home.overview')" height="166px">
|
||||||
<template #body>
|
<template #body>
|
||||||
<div class="h-overview">
|
<div class="h-overview">
|
||||||
<div>
|
<el-row>
|
||||||
<span>{{ $t('menu.website') }}</span>
|
<el-col :span="6">
|
||||||
<div class="count">
|
<span>{{ $t('menu.website') }}</span>
|
||||||
<span @click="goRouter('/websites')">{{ baseInfo?.websiteNumber }}</span>
|
<div class="count">
|
||||||
</div>
|
<span @click="goRouter('/websites')">{{ baseInfo?.websiteNumber }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
</el-col>
|
||||||
<span>{{ $t('menu.database') }} - {{ $t('database.all') }}</span>
|
<el-col :span="6">
|
||||||
<div class="count">
|
<span>{{ $t('menu.database') }} - {{ $t('database.all') }}</span>
|
||||||
<span @click="goRouter('/databases')">{{ baseInfo?.databaseNumber }}</span>
|
<div class="count">
|
||||||
</div>
|
<span @click="goRouter('/databases')">{{ baseInfo?.databaseNumber }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
</el-col>
|
||||||
<span>{{ $t('menu.cronjob') }}</span>
|
<el-col :span="6">
|
||||||
<div class="count">
|
<span>{{ $t('menu.cronjob') }}</span>
|
||||||
<span @click="goRouter('/cronjobs')">
|
<div class="count">
|
||||||
{{ baseInfo?.cronjobNumber }}
|
<span @click="goRouter('/cronjobs')">
|
||||||
</span>
|
{{ baseInfo?.cronjobNumber }}
|
||||||
</div>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
</el-col>
|
||||||
<span>{{ $t('home.appInstalled') }}</span>
|
<el-col :span="6">
|
||||||
<div class="count">
|
<span>{{ $t('home.appInstalled') }}</span>
|
||||||
<span @click="goRouter('/apps/installed')">
|
<div class="count">
|
||||||
{{ baseInfo?.appInstalledNumber }}
|
<span @click="goRouter('/apps/installed')">
|
||||||
</span>
|
{{ baseInfo?.appInstalledNumber }}
|
||||||
</div>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</CardWithHeader>
|
</CardWithHeader>
|
||||||
@ -83,44 +85,42 @@
|
|||||||
</CardWithHeader>
|
</CardWithHeader>
|
||||||
<CardWithHeader :header="$t('menu.monitor')" style="margin-top: 20px; margin-bottom: 20px">
|
<CardWithHeader :header="$t('menu.monitor')" style="margin-top: 20px; margin-bottom: 20px">
|
||||||
<template #header-r>
|
<template #header-r>
|
||||||
<div
|
<el-radio-group
|
||||||
class="float-right flex flex-col items-end flex-wrap sm:items-center gap-2 sm:flex-row sm:gap-4"
|
style="float: right; margin-left: 5px"
|
||||||
|
v-model="chartOption"
|
||||||
|
@change="changeOption"
|
||||||
>
|
>
|
||||||
<el-radio-group v-model="chartOption" @change="changeOption">
|
<el-radio-button value="network">{{ $t('home.network') }}</el-radio-button>
|
||||||
<el-radio-button value="network">{{ $t('home.network') }}</el-radio-button>
|
<el-radio-button value="io">{{ $t('home.io') }}</el-radio-button>
|
||||||
<el-radio-button value="io">{{ $t('home.io') }}</el-radio-button>
|
</el-radio-group>
|
||||||
</el-radio-group>
|
<el-select
|
||||||
<div>
|
v-if="chartOption === 'network'"
|
||||||
<el-select
|
@change="onLoadBaseInfo(false, 'network')"
|
||||||
v-if="chartOption === 'network'"
|
v-model="searchInfo.netOption"
|
||||||
@change="onLoadBaseInfo(false, 'network')"
|
class="p-w-200 float-right"
|
||||||
v-model="searchInfo.netOption"
|
>
|
||||||
class="p-w-200 float-right"
|
<template #prefix>{{ $t('home.networkCard') }}</template>
|
||||||
>
|
<el-option
|
||||||
<template #prefix>{{ $t('home.networkCard') }}</template>
|
v-for="item in netOptions"
|
||||||
<el-option
|
:key="item"
|
||||||
v-for="item in netOptions"
|
:label="item == 'all' ? $t('commons.table.all') : item"
|
||||||
:key="item"
|
:value="item"
|
||||||
:label="item == 'all' ? $t('commons.table.all') : item"
|
/>
|
||||||
:value="item"
|
</el-select>
|
||||||
/>
|
<el-select
|
||||||
</el-select>
|
v-if="chartOption === 'io'"
|
||||||
<el-select
|
v-model="searchInfo.ioOption"
|
||||||
v-if="chartOption === 'io'"
|
@change="onLoadBaseInfo(false, 'io')"
|
||||||
v-model="searchInfo.ioOption"
|
class="p-w-200 float-right"
|
||||||
@change="onLoadBaseInfo(false, 'io')"
|
>
|
||||||
class="p-w-200 float-right"
|
<template #prefix>{{ $t('home.disk') }}</template>
|
||||||
>
|
<el-option
|
||||||
<template #prefix>{{ $t('home.disk') }}</template>
|
v-for="item in ioOptions"
|
||||||
<el-option
|
:key="item"
|
||||||
v-for="item in ioOptions"
|
:label="item == 'all' ? $t('commons.table.all') : item"
|
||||||
:key="item"
|
:value="item"
|
||||||
:label="item == 'all' ? $t('commons.table.all') : item"
|
/>
|
||||||
:value="item"
|
</el-select>
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
<template #body>
|
<template #body>
|
||||||
<div style="position: relative; margin-top: 20px">
|
<div style="position: relative; margin-top: 20px">
|
||||||
@ -685,20 +685,14 @@ onBeforeUnmount(() => {
|
|||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
.h-overview {
|
.h-overview {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: space-around;
|
|
||||||
flex-direction: row;
|
|
||||||
span:first-child {
|
span:first-child {
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
color: var(--el-text-color-regular);
|
color: var(--el-text-color-regular);
|
||||||
}
|
}
|
||||||
@media only screen and (max-width: 1300px) {
|
@media only screen and (max-width: 1300px) {
|
||||||
display: grid;
|
|
||||||
gap: 1rem;
|
|
||||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
||||||
span:first-child {
|
span:first-child {
|
||||||
font-size: 16px;
|
font-size: 12px;
|
||||||
color: var(--el-text-color-regular);
|
color: var(--el-text-color-regular);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user