1Panel-dev/1Panel
1
1
Fork 0
mirror of https://github.com/1Panel-dev/1Panel.git synced 2025-12-18 05:19:19 +08:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: 样式修改

Browse source
This commit is contained in:
zhengkunwang223 2023-02-01 22:19:00 +08:00 • committed by zhengkunwang223
parent eb046090a5
commit e5163fee62
8 changed files with 76 additions and 70 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
frontend/src/components/app-layout/menu/index.vue
View file

@ -21,7 +21,7 @@
>
<SubItem :menuList="routerMenus"></SubItem>
<el-menu-item>
<el-icon>
<el-icon @click="logout">
<SvgIcon :iconName="'p-logout'" :className="'svg-icon'"></SvgIcon>
</el-icon>
<template #title>

51
frontend/src/components/app-status/index.vue
View file

@ -1,14 +1,13 @@
<template>
<div>
<div class="a-content" v-if="data.isExist">
<el-card class="a-card">
<el-row :gutter="20">
<el-col :xs="10" :sm="10" :md="10" :lg="10" :xl="6">
<el-tag effect="dark" type="success">{{ data.app }}</el-tag>
<Status class="status-content" :key="refresh" :status="data.status"></Status>
<el-tag class="status-content">{{ $t('app.version') }}:{{ data.version }}</el-tag>
</el-col>
<el-col :xs="8" :sm="8" :md="8" :lg="6" :xl="4">
<div class="a-card" v-if="data.isExist">
<el-card>
<div>
<el-tag effect="dark" type="success">{{ data.app }}</el-tag>
<Status class="status-content" :key="refresh" :status="data.status"></Status>
<el-tag class="status-content">{{ $t('app.version') }}:{{ data.version }}</el-tag>
<span class="buttons">
<el-button type="primary" v-if="data.status != 'Running'" link @click="onOperate('up')">
{{ $t('app.up') }}
</el-button>
@ -28,16 +27,19 @@
>
{{ $t('commons.button.set') }}
</el-button>
</el-col>
</el-row>
</span>
</div>
</el-card>
</div>
<div v-else>
<el-alert :closable="false" :title="$t('app.checkInstalledWarn', [data.app])" type="info">
<div class="app-warn">
<div>
<span>{{ $t('app.checkInstalledWarn', [data.app]) }}</span>
</div>
<el-link icon="Position" @click="goRouter('/apps')" type="primary">
{{ $t('database.goInstall') }}
</el-link>
</el-alert>
</div>
</div>
</div>
</template>
@ -122,12 +124,15 @@ onMounted(() => {
<style lang="scss" scoped>
.a-card {
font-size: 14px;
height: 60px;
}
font-size: 12px;
.a-content {
height: 50px;
.el-card {
--el-card-padding: 12px;
.buttons {
margin-left: 100px;
}
}
}
body {
@ -137,4 +142,14 @@ body {
.status-content {
margin-left: 50px;
}
.app-warn {
text-align: center;
margin-top: 200px;
span {
font-weight: 500;
font-size: 16px;
color: #bbbfc4;
}
}
</style>

2
frontend/src/layout/index.scss
View file

@ -14,7 +14,7 @@
}
.el-main {
box-sizing: border-box;
padding: 20px 33px;
// padding: 20px 33px;
overflow-x: hidden;
background-color: #f4f4f4;

13
frontend/src/layout/index.vue
View file

@ -6,17 +6,10 @@
</Menu>
</el-aside>
<el-container>
<el-header>
<Header>
<slot name="header"></slot>
</Header>
</el-header>
<el-main>
<!-- <Content> -->
<div>
<View></View>
</div>
<!-- </Content> -->
</el-main>
<el-footer>
<Footer>
@ -28,15 +21,9 @@
</template>
<script setup lang="ts">
// import { computed } from 'vue';
import Menu from './layout-menu.vue';
import Header from './layout-header.vue';
import Footer from './layout-footer.vue';
import View from './layout-view.vue';
// import Content from './layout-content.vue';
// import { GlobalStore } from '@/store';
// const globalStore = GlobalStore();
// const themeConfig = computed(() => globalStore.themeConfig);
</script>
<style scoped lang="scss">

10
frontend/src/layout/layout-content.vue
View file

@ -1,8 +1,5 @@
<template>
<div class="main-box">
<div class="content-container__header" v-if="slots.header">
<slot name="header"></slot>
</div>
<div class="content-container__app" v-if="slots.app">
<slot name="app"></slot>
</div>
@ -90,8 +87,15 @@ const showBack = computed(() => {
<style lang="scss">
@use '@/styles/mixins.scss' as *;
.content-container__app {
margin-top: 20px;
}
.content-container__search {
margin-top: 20px;
.el-card {
--el-card-padding: 12px;
}
}
.content-container__title {

3
frontend/src/layout/layout-header.vue
View file

@ -1,3 +0,0 @@
<template>
<slot></slot>
</template>

64
frontend/src/views/app-store/detail/index.vue
View file

@ -3,9 +3,11 @@
<template #main>
<div class="brief">
<el-row :gutter="20">
<el-col :span="3">
<el-avatar shape="square" :size="180" :src="'data:image/png;base64,' + app.icon" />
</el-col>
<div>
<el-col :span="3">
<el-avatar shape="square" :size="180" :src="'data:image/png;base64,' + app.icon" />
</el-col>
</div>
<el-col :span="18">
<div class="detail">
<div class="name">
@ -51,32 +53,34 @@
</el-col>
</el-row>
<div class="divider"></div>
<el-row>
<el-col :span="12">
<div class="descriptions">
<el-descriptions direction="vertical">
<el-descriptions-item :label="$t('app.appWebsite')">
<el-link @click="toLink(app.website)">
<el-icon><OfficeBuilding /></el-icon>
<span>{{ $t('app.appOfficeWebsite') }}</span>
</el-link>
</el-descriptions-item>
<el-descriptions-item :label="$t('app.doc')">
<el-link @click="toLink(app.document)">
<el-icon><Document /></el-icon>
<span>{{ $t('app.document') }}</span>
</el-link>
</el-descriptions-item>
<el-descriptions-item label="Github">
<el-link @click="toLink(app.github)">
<el-icon><Link /></el-icon>
<span>{{ $t('app.github') }}</span>
</el-link>
</el-descriptions-item>
</el-descriptions>
</div>
</el-col>
</el-row>
<div>
<el-row>
<el-col :span="12">
<div class="descriptions">
<el-descriptions direction="vertical">
<el-descriptions-item>
<el-link @click="toLink(app.website)">
<el-icon><OfficeBuilding /></el-icon>
<span>{{ $t('app.appOfficeWebsite') }}</span>
</el-link>
</el-descriptions-item>
<el-descriptions-item>
<el-link @click="toLink(app.document)">
<el-icon><Document /></el-icon>
<span>{{ $t('app.document') }}</span>
</el-link>
</el-descriptions-item>
<el-descriptions-item>
<el-link @click="toLink(app.github)">
<el-icon><Link /></el-icon>
<span>{{ $t('app.github') }}</span>
</el-link>
</el-descriptions-item>
</el-descriptions>
</div>
</el-col>
</el-row>
</div>
</div>
<div v-loading="loadingDetail" style="margin-left: -32px">
<v-md-preview :text="appDetail.readme"></v-md-preview>
@ -142,7 +146,7 @@ onMounted(() => {
<style lang="scss">
.brief {
height: 30vh;
// height: 30vh;
.name {
span {

1
frontend/src/views/website/website/index.vue
View file

@ -8,7 +8,6 @@
},
]"
/>
<br />
<LayoutContent :title="$t('website.website')" v-loading="loading">
<template #app>
<AppStatus