mirror of
https://github.com/1Panel-dev/1Panel.git
synced 2025-01-19 08:19:15 +08:00
feat: 样式优化 (#3928)
This commit is contained in:
wangdan-fit2cloud
GitHub
parent
e4f9ec32cd
commit
6275e06806
@ -76,15 +76,15 @@
|
||||
<LayoutContent :title="getTitle(key)" :divider="true">
|
||||
<template #main>
|
||||
<div class="app-warn">
|
||||
<div>
|
||||
<div class="flx-center">
|
||||
<span>{{ $t('app.checkInstalledWarn', [data.app]) }}</span>
|
||||
<span @click="goRouter(key)">
|
||||
<span @click="goRouter(key)" class="flx-align-center">
|
||||
<el-icon class="ml-2"><Position /></el-icon>
|
||||
{{ $t('database.goInstall') }}
|
||||
</span>
|
||||
<div>
|
||||
<img src="@/assets/images/no_app.svg" />
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<img src="@/assets/images/no_app.svg" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -1,9 +1,11 @@
|
||||
<template>
|
||||
<el-tag :type="getType(status)" round effect="light">
|
||||
{{ $t('commons.status.' + status) }}
|
||||
<el-icon v-if="loadingIcon(status)" class="is-loading">
|
||||
<Loading />
|
||||
</el-icon>
|
||||
<span class="flx-align-center">
|
||||
{{ $t('commons.status.' + status) }}
|
||||
<el-icon v-if="loadingIcon(status)" class="is-loading">
|
||||
<Loading />
|
||||
</el-icon>
|
||||
</span>
|
||||
</el-tag>
|
||||
</template>
|
||||
|
||||
|
||||
@ -821,7 +821,8 @@ const message = {
|
||||
default_download_path: 'Default Download Link',
|
||||
saveLocal: 'Retain local backups (the same as the number of cloud storage copies)',
|
||||
url: 'URL Address',
|
||||
targetHelper: 'Backup accounts are maintained in panel settings.',
|
||||
target: 'Target',
|
||||
targetHelper: 'Third-party backup accounts are maintained in panel settings.',
|
||||
retainCopies: 'Retain copies',
|
||||
retainCopiesHelper: 'Number of copies to retain for execution records and logs',
|
||||
retainCopiesHelper1: 'Number of copies to retain for backup files',
|
||||
@ -1068,7 +1069,6 @@ const message = {
|
||||
hardLink: 'Hard link',
|
||||
linkPath: 'Link Path',
|
||||
selectFile: 'Select file',
|
||||
downloadSuccess: 'Download succeeded',
|
||||
downloadUrl: 'Download URL',
|
||||
downloadStart: 'Download start!',
|
||||
moveSuccess: 'Move success',
|
||||
@ -1083,6 +1083,7 @@ const message = {
|
||||
infoDetail: 'File Properties',
|
||||
list: 'File List',
|
||||
sub: 'Subdirectory',
|
||||
downloadSuccess: 'Download Success',
|
||||
theme: 'Theme',
|
||||
language: 'Language',
|
||||
eol: 'End Of Line',
|
||||
@ -1401,6 +1402,7 @@ const message = {
|
||||
backupData: 'Backup local backup directory for 1Panel',
|
||||
compress: 'Create snapshot file',
|
||||
upload: 'Upload snapshot file',
|
||||
thirdPartySupport: 'Only third-party accounts are supported',
|
||||
recoverDetail: 'Recover detail',
|
||||
createSnapshot: 'Create snapshot',
|
||||
importSnapshot: 'Sync snapshot',
|
||||
|
||||
@ -781,7 +781,8 @@ const message = {
|
||||
default_download_path: '默認下載地址',
|
||||
saveLocal: '同時保留本地備份（和雲存儲保留份數一致）',
|
||||
url: 'URL 地址',
|
||||
targetHelper: '備份賬號可在面板設置中維護',
|
||||
target: '備份到',
|
||||
targetHelper: '第三方備份賬號在面板設置中維護',
|
||||
retainCopies: '保留份數',
|
||||
retainCopiesHelper: '執行記錄及日誌保留份数',
|
||||
retainCopiesHelper1: '備份文件保留份数',
|
||||
@ -1242,6 +1243,7 @@ const message = {
|
||||
backupData: '備份 1Panel 本地備份目錄',
|
||||
compress: '製作快照文件',
|
||||
upload: '上傳快照文件',
|
||||
thirdPartySupport: '僅支持第三方賬號',
|
||||
recoverDetail: '恢復詳情',
|
||||
createSnapshot: '創建快照',
|
||||
importSnapshot: '同步快照',
|
||||
|
||||
@ -782,7 +782,8 @@ const message = {
|
||||
default_download_path: '默认下载地址',
|
||||
saveLocal: '同时保留本地备份（和云存储保留份数一致）',
|
||||
url: 'URL 地址',
|
||||
targetHelper: '备份账号可在面板设置中维护',
|
||||
target: '备份到',
|
||||
targetHelper: '第三方备份账号在面板设置中维护',
|
||||
retainCopies: '保留份数',
|
||||
retainCopiesHelper: '执行记录及日志保留份数',
|
||||
retainCopiesHelper1: '备份文件保留份数',
|
||||
@ -1243,6 +1244,7 @@ const message = {
|
||||
backupData: '备份 1Panel 本地备份目录',
|
||||
compress: '制作快照文件',
|
||||
upload: '上传快照文件',
|
||||
thirdPartySupport: '仅支持第三方账号',
|
||||
recoverDetail: '恢复详情',
|
||||
createSnapshot: '创建快照',
|
||||
importSnapshot: '同步快照',
|
||||
|
||||
@ -409,4 +409,8 @@ html {
|
||||
|
||||
.p-ml-5 {
|
||||
margin-left: 5px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.p-mb-5 {
|
||||
margin-bottom: 5px !important;
|
||||
}
|
||||
|
||||
@ -42,7 +42,7 @@
|
||||
{{ $t('app.toInstall') }}
|
||||
</el-link>
|
||||
</span>
|
||||
<el-select v-model="form[p.envKey]" v-if="p.type == 'select'" :multiple="p.multiple">
|
||||
<el-select v-model="form[p.envKey]" v-if="p.type == 'select'">
|
||||
<el-option
|
||||
v-for="service in p.values"
|
||||
:key="service.label"
|
||||
|
||||
@ -30,11 +30,7 @@
|
||||
v-model.number="paramModel.params[p.key]"
|
||||
:disabled="!p.edit"
|
||||
></el-input>
|
||||
<el-select
|
||||
v-model="paramModel.params[p.key]"
|
||||
v-else-if="p.type == 'select'"
|
||||
:multiple="p.multiple"
|
||||
>
|
||||
<el-select v-model="paramModel.params[p.key]" v-else-if="p.type == 'select'">
|
||||
<el-option
|
||||
v-for="value in p.values"
|
||||
:key="value.label"
|
||||
@ -205,7 +201,6 @@ const get = async () => {
|
||||
type: d.type,
|
||||
values: d.values,
|
||||
showValue: d.showValue,
|
||||
multiple: d.multiple,
|
||||
});
|
||||
rules.params[d.key] = [Rules.requiredInput];
|
||||
if (d.rule) {
|
||||
|
||||
@ -79,11 +79,14 @@
|
||||
|
||||
<template #main>
|
||||
<el-alert type="info" :closable="false" v-if="mode === 'installed'">
|
||||
<template #default>
|
||||
{{ $t('app.installHelper') }}
|
||||
<el-link class="ml-5" icon="Position" @click="quickJump()" type="primary">
|
||||
{{ $t('firewall.quickJump') }}
|
||||
</el-link>
|
||||
<template #title>
|
||||
<span class="flx-align-center">
|
||||
{{ $t('app.installHelper') }}
|
||||
<el-link class="ml-5" icon="Position" @click="quickJump()" type="primary">
|
||||
{{ $t('firewall.quickJump') }}
|
||||
</el-link>
|
||||
|
||||
</span>
|
||||
</template>
|
||||
</el-alert>
|
||||
<el-alert type="info" :title="$t('app.upgradeHelper')" :closable="false" v-if="mode === 'upgrade'" />
|
||||
|
||||
@ -12,8 +12,8 @@
|
||||
<LayoutContent v-if="!isOnDetail" :title="$t('container.compose')" :class="{ mask: dockerStatus != 'Running' }">
|
||||
<template #prompt>
|
||||
<el-alert type="info" :closable="false">
|
||||
<template #default>
|
||||
<span>
|
||||
<template #title>
|
||||
<span class="flx-align-center">
|
||||
<span>{{ $t('container.composeHelper', [baseDir]) }}</span>
|
||||
<el-button type="primary" link @click="toFolder">
|
||||
<el-icon>
|
||||
|
||||
@ -66,7 +66,7 @@
|
||||
</template>
|
||||
</el-input>
|
||||
<span class="input-help">{{ $t('container.mirrorsHelper') }}</span>
|
||||
<span class="input-help">
|
||||
<span class="input-help flx-align-center" style="display: flex">
|
||||
{{ $t('container.mirrorsHelper2') }}
|
||||
<el-link
|
||||
style="font-size: 12px; margin-left: 5px"
|
||||
|
||||
@ -113,7 +113,7 @@
|
||||
{{ row.lastRecordTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :min-width="80" :label="$t('setting.backupAccount')" prop="defaultDownload">
|
||||
<el-table-column :min-width="80" :label="$t('cronjob.target')" prop="defaultDownload">
|
||||
<template #default="{ row }">
|
||||
<div v-for="(item, index) of row.backupAccounts?.split(',')" :key="index">
|
||||
<div v-if="row.accountExpand || (!row.accountExpand && index < 3)">
|
||||
|
||||
@ -248,7 +248,7 @@
|
||||
</el-form-item>
|
||||
|
||||
<div v-if="isBackup()">
|
||||
<el-form-item :label="$t('setting.backupAccount')" prop="backupAccountList">
|
||||
<el-form-item :label="$t('cronjob.target')" prop="backupAccountList">
|
||||
<el-select
|
||||
multiple
|
||||
class="selectClass"
|
||||
@ -366,7 +366,6 @@ const acceptParams = (params: DialogProps): void => {
|
||||
if (dialogData.value.title === 'create') {
|
||||
changeType();
|
||||
dialogData.value.rowData.dbType = 'mysql';
|
||||
dialogData.value.rowData.defaultDownload = 'LOCAL';
|
||||
}
|
||||
if (dialogData.value.rowData.backupAccounts) {
|
||||
dialogData.value.rowData.backupAccountList = dialogData.value.rowData.backupAccounts.split(',');
|
||||
|
||||
@ -26,8 +26,8 @@
|
||||
type="warning"
|
||||
@close="hideEntrance"
|
||||
>
|
||||
<template #default>
|
||||
<span>
|
||||
<template #title>
|
||||
<span class="flx-align-center">
|
||||
<span>{{ $t('home.entranceHelper') }}</span>
|
||||
<el-link
|
||||
style="font-size: 12px; margin-left: 5px"
|
||||
|
||||
@ -43,8 +43,8 @@
|
||||
<LayoutContent :title="$t('file.file')" v-loading="loading">
|
||||
<template #prompt>
|
||||
<el-alert type="info" :closable="false">
|
||||
<template #default>
|
||||
<span><span v-html="$t('file.fileHeper')"></span></span>
|
||||
<template #title>
|
||||
<span v-html="$t('file.fileHeper')"></span>
|
||||
</template>
|
||||
</el-alert>
|
||||
</template>
|
||||
|
||||
@ -21,7 +21,7 @@
|
||||
<template #prompt>
|
||||
<el-alert type="info" :closable="false">
|
||||
<template #default>
|
||||
<span>
|
||||
<span class="flx-align-center">
|
||||
<span>{{ $t('firewall.dockerHelper', [fireName]) }}</span>
|
||||
<el-link
|
||||
style="font-size: 12px; margin-left: 5px"
|
||||
|
||||
@ -71,7 +71,6 @@ onMounted(() => {
|
||||
|
||||
.svg-icon {
|
||||
font-size: 7px;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
span {
|
||||
line-height: 20px;
|
||||
|
||||
@ -5,9 +5,11 @@
|
||||
<el-form label-width="130px" :v-key="refresh">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="24">
|
||||
<div>
|
||||
<svg-icon class="card-logo" iconName="p-file-folder"></svg-icon>
|
||||
<span class="card-title"> {{ $t('setting.LOCAL') }}</span>
|
||||
<div class="flx-justify-between">
|
||||
<span class="flx-align-center">
|
||||
<svg-icon class="card-logo" iconName="p-file-folder"></svg-icon>
|
||||
<span class="card-title"> {{ $t('setting.LOCAL') }}</span>
|
||||
</span>
|
||||
<div style="float: right">
|
||||
<el-button round @click="onOpenDialog('edit', 'LOCAL', localData)">
|
||||
{{ $t('commons.button.edit') }}
|
||||
@ -32,17 +34,19 @@
|
||||
</div>
|
||||
|
||||
<el-alert type="info" :closable="false" class="common-div">
|
||||
<template #default>
|
||||
<div style="margin-bottom: 3px"><span v-html="$t('setting.backupAlert')"></span></div>
|
||||
<template #title>
|
||||
<span v-html="$t('setting.backupAlert')"></span>
|
||||
</template>
|
||||
</el-alert>
|
||||
|
||||
<el-row :gutter="20" class="common-div">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<div>
|
||||
<svg-icon class="card-logo" iconName="p-aws"></svg-icon>
|
||||
<span class="card-title"> {{ $t('setting.S3') }}</span>
|
||||
<div style="float: right">
|
||||
<div class="flx-justify-between">
|
||||
<span class="flx-align-center">
|
||||
<svg-icon class="card-logo" iconName="p-aws"></svg-icon>
|
||||
<span class="card-title"> {{ $t('setting.S3') }}</span>
|
||||
</span>
|
||||
<div>
|
||||
<el-button
|
||||
round
|
||||
:disabled="s3Data.id === 0"
|
||||
@ -54,8 +58,8 @@
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</div>
|
||||
<el-divider class="divider" />
|
||||
</div>
|
||||
<el-divider class="divider" />
|
||||
<div v-if="s3Data.id !== 0" style="margin-left: 20px">
|
||||
<el-form-item label="Region">
|
||||
{{ s3Data.varsJson['region'] }}
|
||||
@ -95,10 +99,12 @@
|
||||
</el-alert>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<div>
|
||||
<svg-icon class="card-logo" iconName="p-oss"></svg-icon>
|
||||
<span class="card-title"> {{ $t('setting.OSS') }}</span>
|
||||
<div style="float: right">
|
||||
<div class="flx-justify-between">
|
||||
<span class="flx-align-center">
|
||||
<svg-icon class="card-logo" iconName="p-oss"></svg-icon>
|
||||
<span class="card-title"> {{ $t('setting.OSS') }}</span>
|
||||
</span>
|
||||
<div>
|
||||
<el-button
|
||||
round
|
||||
:disabled="ossData.id === 0"
|
||||
@ -151,10 +157,12 @@
|
||||
</el-row>
|
||||
<el-row :gutter="20" class="common-div">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<div>
|
||||
<svg-icon class="card-logo" iconName="p-tengxunyun1"></svg-icon>
|
||||
<span class="card-title"> {{ $t('setting.COS') }}</span>
|
||||
<div style="float: right">
|
||||
<div class="flx-justify-between">
|
||||
<span class="flx-align-center">
|
||||
<svg-icon class="card-logo" iconName="p-tengxunyun1"></svg-icon>
|
||||
<span class="card-title"> {{ $t('setting.COS') }}</span>
|
||||
</span>
|
||||
<div>
|
||||
<el-button
|
||||
round
|
||||
:disabled="cosData.id === 0"
|
||||
@ -166,8 +174,8 @@
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</div>
|
||||
<el-divider class="divider" />
|
||||
</div>
|
||||
<el-divider class="divider" />
|
||||
<div v-if="cosData.id !== 0" style="margin-left: 20px">
|
||||
<el-form-item label="Region">
|
||||
{{ cosData.varsJson['region'] }}
|
||||
@ -204,10 +212,12 @@
|
||||
</el-alert>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<div>
|
||||
<svg-icon class="card-logo" iconName="p-onedrive"></svg-icon>
|
||||
<span class="card-title"> {{ $t('setting.OneDrive') }}</span>
|
||||
<div style="float: right">
|
||||
<div class="flx-justify-between">
|
||||
<span class="flx-align-center">
|
||||
<svg-icon class="card-logo" iconName="p-onedrive"></svg-icon>
|
||||
<span class="card-title"> {{ $t('setting.OneDrive') }}</span>
|
||||
</span>
|
||||
<div>
|
||||
<el-button
|
||||
round
|
||||
plain
|
||||
@ -266,10 +276,12 @@
|
||||
</el-row>
|
||||
<el-row :gutter="20" style="margin-top: 20px">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<div>
|
||||
<svg-icon class="card-logo" iconName="p-qiniuyun"></svg-icon>
|
||||
<span class="card-title"> {{ $t('setting.KODO') }}</span>
|
||||
<div style="float: right">
|
||||
<div class="flx-justify-between">
|
||||
<span class="flx-align-center">
|
||||
<svg-icon class="card-logo" iconName="p-qiniuyun"></svg-icon>
|
||||
<span class="card-title"> {{ $t('setting.KODO') }}</span>
|
||||
</span>
|
||||
<div>
|
||||
<el-button
|
||||
round
|
||||
:disabled="kodoData.id === 0"
|
||||
@ -306,10 +318,12 @@
|
||||
</el-alert>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<div>
|
||||
<svg-icon class="card-logo" iconName="p-minio"></svg-icon>
|
||||
<span class="card-title"> MINIO</span>
|
||||
<div style="float: right">
|
||||
<div class="flx-justify-between">
|
||||
<span class="flx-align-center">
|
||||
<svg-icon class="card-logo" iconName="p-minio"></svg-icon>
|
||||
<span class="card-title"> MINIO</span>
|
||||
</span>
|
||||
<div>
|
||||
<el-button
|
||||
round
|
||||
:disabled="minioData.id === 0"
|
||||
@ -347,10 +361,12 @@
|
||||
</el-row>
|
||||
<el-row :gutter="20" style="margin-top: 20px">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<div>
|
||||
<svg-icon class="card-logo" iconName="p-SFTP"></svg-icon>
|
||||
<span class="card-title"> SFTP</span>
|
||||
<div style="float: right">
|
||||
<div class="flx-justify-between">
|
||||
<span class="flx-align-center">
|
||||
<svg-icon class="card-logo" iconName="p-SFTP"></svg-icon>
|
||||
<span class="card-title"> SFTP</span>
|
||||
</span>
|
||||
<div>
|
||||
<el-button
|
||||
round
|
||||
plain
|
||||
@ -386,10 +402,12 @@
|
||||
</el-alert>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<div>
|
||||
<svg-icon class="card-logo" iconName="p-webdav"></svg-icon>
|
||||
<span class="card-title"> WebDAV</span>
|
||||
<div style="float: right">
|
||||
<div class="flx-justify-between">
|
||||
<span class="flx-align-center">
|
||||
<svg-icon class="card-logo" iconName="p-webdav"></svg-icon>
|
||||
<span class="card-title"> WebDAV</span>
|
||||
</span>
|
||||
<div>
|
||||
<el-button
|
||||
round
|
||||
plain
|
||||
|
||||
@ -133,7 +133,10 @@
|
||||
>
|
||||
<el-row type="flex" justify="center">
|
||||
<el-col :span="22">
|
||||
<el-form-item :label="$t('setting.backupAccount')" prop="fromAccounts">
|
||||
<el-form-item
|
||||
:label="$t('cronjob.target') + ' ( ' + $t('setting.thirdPartySupport') + ' )'"
|
||||
prop="fromAccounts"
|
||||
>
|
||||
<el-select multiple @change="changeAccount" v-model="snapInfo.fromAccounts" clearable>
|
||||
<el-option
|
||||
v-for="item in backupOptions"
|
||||
|
||||
@ -4,8 +4,8 @@
|
||||
<LayoutContent :title="'Node.js'" v-loading="loading">
|
||||
<template #prompt>
|
||||
<el-alert type="info" :closable="false">
|
||||
<template #default>
|
||||
<span><span v-html="$t('runtime.statusHelper')"></span></span>
|
||||
<template #title>
|
||||
<span v-html="$t('runtime.statusHelper')"></span>
|
||||
</template>
|
||||
</el-alert>
|
||||
</template>
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
<LayoutContent :title="'PHP'" v-loading="loading">
|
||||
<template #prompt>
|
||||
<el-alert type="info" :closable="false">
|
||||
<template #default>
|
||||
<template #title>
|
||||
<span>{{ $t('runtime.systemRestartHelper') }}</span>
|
||||
</template>
|
||||
</el-alert>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user