1
0
mirror of https://github.com/1Panel-dev/1Panel.git synced 2025-01-19 16:29:17 +08:00

feat: 修改应用列表样式

This commit is contained in:
zhengkunwang223 2023-02-08 16:35:21 +08:00 committed by zhengkunwang223
parent 4d77345ce0
commit 20cf2a53da
3 changed files with 26 additions and 20 deletions

View File

@ -887,6 +887,7 @@ export default {
doc: '文档',
document: '文档说明',
updatePrompt: '当前应用均为最新版本',
installPrompt: '尚未安装任何应用',
},
website: {
website: '网站',

View File

@ -228,6 +228,7 @@
// search条圆角
.search-button {
float: right;
.el-input__wrapper {
border-radius: 50px;
}

View File

@ -3,29 +3,31 @@
<template #toolbar>
<el-row :gutter="5">
<el-col :span="20">
<el-button
class="tag-button"
:class="activeTag === 'all' ? '' : 'no-active'"
@click="changeTag('all')"
:type="activeTag === 'all' ? 'primary' : ''"
:plain="activeTag !== 'all'"
>
{{ $t('app.all') }}
</el-button>
<div v-for="item in tags" :key="item.key" style="display: inline">
<div v-if="data != null">
<el-button
class="tag-button"
:class="activeTag === item.key ? '' : 'no-active'"
@click="changeTag(item.key)"
:type="activeTag === item.key ? 'primary' : ''"
:plain="activeTag !== item.key"
:class="activeTag === 'all' ? '' : 'no-active'"
@click="changeTag('all')"
:type="activeTag === 'all' ? 'primary' : ''"
:plain="activeTag !== 'all'"
>
{{ item.name }}
{{ $t('app.all') }}
</el-button>
<div v-for="item in tags" :key="item.key" style="display: inline">
<el-button
class="tag-button"
:class="activeTag === item.key ? '' : 'no-active'"
@click="changeTag(item.key)"
:type="activeTag === item.key ? 'primary' : ''"
:plain="activeTag !== item.key"
>
{{ item.name }}
</el-button>
</div>
</div>
</el-col>
<el-col :span="4">
<div style="float: right" class="search-button">
<div class="search-button">
<el-input
class="table-button"
v-model="searchReq.name"
@ -41,13 +43,15 @@
</el-row>
</template>
<template #rightButton>
<el-button @click="sync" type="primary" link v-if="mode === 'installed'">{{ $t('app.sync') }}</el-button>
<el-button @click="sync" type="primary" link v-if="mode === 'installed' && data != null">
{{ $t('app.sync') }}
</el-button>
</template>
<template #main>
<div class="update-prompt" v-if="mode === 'update' && data == null">
<div class="update-prompt" v-if="data == null">
<el-empty
:description="$t('app.updatePrompt')"
:description="mode === 'update' ? $t('app.updatePrompt') : $t('app.installPrompt')"
image="/src/assets/images/no_update_app.svg"
:image-size="200"
></el-empty>
@ -172,7 +176,7 @@ import Status from '@/components/status/index.vue';
import { getAge } from '@/utils/util';
import { useRouter } from 'vue-router';
let data = ref<any>([]);
let data = ref<any>();
let loading = ref(false);
let timer: NodeJS.Timer | null = null;
const paginationConfig = reactive({