github
/
1Panel
mirror of https://github.com/1Panel-dev/1Panel
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

style:移动端文件页面样式和防火墙页面样式 (#6386) 

* style:移动端端文件页面样式

* style:修改防火墙页面样式

* style:手机端ssl界面和数据库界面调整
pull/6393/head
see-more 3 months ago committed by GitHub
parent
e87fb7b50e
commit
666f8c813d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
7 changed files with 319 additions and 139 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 1
      frontend/src/lang/modules/en.ts
  2. 1
      frontend/src/lang/modules/tw.ts
  3. 1
      frontend/src/lang/modules/zh.ts
  4. 10
      frontend/src/views/database/mysql/index.vue
  5. 334
      frontend/src/views/host/file-management/index.vue
  6. 73
      frontend/src/views/host/firewall/status/index.vue
  7. 38
      frontend/src/views/website/ssl/index.vue

1
frontend/src/lang/modules/en.ts
Unescape View File

@ -1176,6 +1176,7 @@ const message = {
info: 'Attribute', info: 'Attribute',
linkFile: 'Soft link', linkFile: 'Soft link',
terminal: 'Terminal', terminal: 'Terminal',
batchoperation: 'batch operation',
shareList: 'Share list', shareList: 'Share list',
zip: 'Compressed', zip: 'Compressed',
group: 'Group', group: 'Group',

1
frontend/src/lang/modules/tw.ts
Unescape View File

@ -1114,6 +1114,7 @@ const message = {
info: '屬性', info: '屬性',
linkFile: '軟連接文件', linkFile: '軟連接文件',
terminal: '終端', terminal: '終端',
batchoperation: '批量操作',
shareList: '分享列表', shareList: '分享列表',
zip: '壓縮', zip: '壓縮',
group: '用戶組', group: '用戶組',

1
frontend/src/lang/modules/zh.ts
Unescape View File

@ -1118,6 +1118,7 @@ const message = {
info: '属性', info: '属性',
linkFile: '软连接文件', linkFile: '软连接文件',
terminal: '终端', terminal: '终端',
batchoperation: '批量操作',
shareList: '分享列表', shareList: '分享列表',
zip: '压缩', zip: '压缩',
group: '用户组', group: '用户组',

10
frontend/src/views/database/mysql/index.vue
Unescape View File

@ -62,7 +62,7 @@
<template #toolbar> <template #toolbar>
<div class="flex flex-wrap gap-4 sm:justify-between"> <div class="flex flex-wrap gap-4 sm:justify-between">
<div class="flex gap-2 flex-wrap items-center justify-start"> <div class="flex gap-2 flex-wrap items-center justify-start [&>*]:ml-3">
<el-button <el-button
v-if="currentDB && (currentDB.from !== 'local' || mysqlStatus === 'Running')" v-if="currentDB && (currentDB.from !== 'local' || mysqlStatus === 'Running')"
type="primary" type="primary"
@ -81,11 +81,9 @@
> >
{{ $t('database.loadFromRemote') }} {{ $t('database.loadFromRemote') }}
</el-button> </el-button>
<div> <el-button @click="goRemoteDB" type="primary" plain>
<el-button @click="goRemoteDB" type="primary" plain> {{ $t('database.remoteDB') }}
{{ $t('database.remoteDB') }} </el-button>
</el-button>
</div>
<div> <div>
<el-dropdown> <el-dropdown>
<el-button type="primary" plain> <el-button type="primary" plain>

334
frontend/src/views/host/file-management/index.vue
Unescape View File

@ -58,72 +58,220 @@
</el-alert> </el-alert>
</template> </template>
<template #toolbar> <template #toolbar>
<div class="btn-container"> <div class="hidden sm:block">
<div class="left-section"> <div class="btn-container">
<el-dropdown @command="handleCreate"> <div class="left-section">
<el-button type="primary"> <el-dropdown @command="handleCreate">
{{ $t('commons.button.create') }} <el-button type="primary">
<el-icon><arrow-down /></el-icon> {{ $t('commons.button.create') }}
</el-button> <el-icon><arrow-down /></el-icon>
<template #dropdown> </el-button>
<el-dropdown-menu> <template #dropdown>
<el-dropdown-item command="dir"> <el-dropdown-menu>
<svg-icon iconName="p-file-folder"></svg-icon> <el-dropdown-item command="dir">
{{ $t('file.dir') }} <svg-icon iconName="p-file-folder"></svg-icon>
</el-dropdown-item> {{ $t('file.dir') }}
<el-dropdown-item command="file"> </el-dropdown-item>
<svg-icon iconName="p-file-normal"></svg-icon> <el-dropdown-item command="file">
{{ $t('file.file') }} <svg-icon iconName="p-file-normal"></svg-icon>
</el-dropdown-item> {{ $t('file.file') }}
</el-dropdown-menu> </el-dropdown-item>
</template> </el-dropdown-menu>
</el-dropdown> </template>
<el-button-group> </el-dropdown>
<el-button plain @click="openUpload">{{ $t('file.upload') }}</el-button> <el-button-group>
<el-button plain @click="openWget">{{ $t('file.remoteFile') }}</el-button> <el-button plain @click="openUpload">{{ $t('file.upload') }}</el-button>
<el-button plain @click="openMove('copy')" :disabled="selects.length === 0"> <el-button plain @click="openWget">{{ $t('file.remoteFile') }}</el-button>
{{ $t('file.copy') }} <el-button plain @click="openMove('copy')" :disabled="selects.length === 0">
</el-button> {{ $t('file.copy') }}
<el-button plain @click="openMove('cut')" :disabled="selects.length === 0"> </el-button>
{{ $t('file.move') }} <el-button plain @click="openMove('cut')" :disabled="selects.length === 0">
</el-button> {{ $t('file.move') }}
<el-button plain @click="openCompress(selects)" :disabled="selects.length === 0"> </el-button>
{{ $t('file.compress') }} <el-button plain @click="openCompress(selects)" :disabled="selects.length === 0">
{{ $t('file.compress') }}
</el-button>
<el-button plain @click="openBatchRole(selects)" :disabled="selects.length === 0">
{{ $t('file.role') }}
</el-button>
<el-button plain @click="batchDelFiles" :disabled="selects.length === 0">
{{ $t('commons.button.delete') }}
</el-button>
</el-button-group>
<el-button class="btn" @click="toTerminal">
{{ $t('menu.terminal') }}
</el-button> </el-button>
<el-button plain @click="openBatchRole(selects)" :disabled="selects.length === 0">
{{ $t('file.role') }} <el-button-group class="copy-button" v-if="moveOpen">
<el-tooltip
class="box-item"
effect="dark"
:content="$t('file.paste')"
placement="bottom"
>
<el-button plain @click="openPaste">
{{ $t('file.paste') }}({{ fileMove.count }})
</el-button>
</el-tooltip>
<el-tooltip
class="box-item"
effect="dark"
:content="$t('file.cancel')"
placement="bottom"
>
<el-button plain class="close" @click="closeMove">
<el-icon class="close-icon"><Close /></el-icon>
</el-button>
</el-tooltip>
</el-button-group>
</div>
<div class="right-section">
<el-popover placement="bottom" :width="200" trigger="hover" @before-enter="getFavoriates">
<template #reference>
<el-button @click="openFavorite">
{{ $t('file.favorite') }}
</el-button>
</template>
<div class="favorite-item">
<el-table :data="favorites">
<el-table-column prop="name">
<template #default="{ row }">
<el-tooltip
class="box-item"
effect="dark"
:content="row.path"
placement="top"
>
<span
class="table-link text-ellipsis"
@click="toFavorite(row)"
type="primary"
>
<svg-icon
v-if="row.isDir"
className="table-icon"
iconName="p-file-folder"
></svg-icon>
<svg-icon
v-else
className="table-icon"
iconName="p-file-normal"
></svg-icon>
{{ row.name }}
</span>
</el-tooltip>
</template>
</el-table-column>
</el-table>
</div>
</el-popover>
<el-button class="btn" @click="openRecycleBin">
{{ $t('file.recycleBin') }}
</el-button> </el-button>
<el-button plain @click="batchDelFiles" :disabled="selects.length === 0"> <div class="search-button">
{{ $t('commons.button.delete') }} <el-input
v-model="req.search"
clearable
@clear="search()"
@keydown.enter="search()"
:placeholder="$t('file.search')"
>
<template #prepend>
<el-checkbox v-model="req.containSub">
{{ $t('file.sub') }}
</el-checkbox>
</template>
<template #append>
<el-button icon="Search" @click="search" round />
</template>
</el-input>
</div>
</div>
</div>
</div>
<div class="block flex flex-wrap gap-4 sm:hidden">
<el-dropdown @command="handleCreate">
<el-button type="primary">
{{ $t('commons.button.create') }}
<el-icon><arrow-down /></el-icon>
</el-button>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item command="dir">
<svg-icon iconName="p-file-folder"></svg-icon>
{{ $t('file.dir') }}
</el-dropdown-item>
<el-dropdown-item command="file">
<svg-icon iconName="p-file-normal"></svg-icon>
{{ $t('file.file') }}
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
<el-dropdown @command="handleFilePatch">
<el-button type="primary">
{{ $t('file.batchoperation') }}
<el-icon><arrow-down /></el-icon>
</el-button>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item command="openUpload">
{{ $t('file.upload') }}
</el-dropdown-item>
<el-dropdown-item command="openWget">
{{ $t('file.remoteFile') }}
</el-dropdown-item>
<el-dropdown-item command="openMove:copy" :disabled="selects.length === 0">
{{ $t('file.copy') }}
</el-dropdown-item>
<el-dropdown-item command="openMove:cut" :disabled="selects.length === 0">
{{ $t('file.move') }}
</el-dropdown-item>
<el-dropdown-item command="openCompress" :disabled="selects.length === 0">
{{ $t('file.compress') }}
</el-dropdown-item>
<el-dropdown-item command="openBatchRole" :disabled="selects.length === 0">
{{ $t('file.role') }}
</el-dropdown-item>
<el-dropdown-item command="batchDelFiles" :disabled="selects.length === 0">
{{ $t('commons.button.delete') }}
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
<el-button-group v-if="moveOpen">
<el-tooltip class="box-item" effect="dark" :content="$t('file.paste')" placement="bottom">
<el-button plain @click="openPaste">{{ $t('file.paste') }}({{ fileMove.count }})</el-button>
</el-tooltip>
<el-tooltip class="box-item" effect="dark" :content="$t('file.cancel')" placement="bottom">
<el-button plain class="close" @click="closeMove">
<el-icon class="close-icon"><Close /></el-icon>
</el-button> </el-button>
</el-button-group> </el-tooltip>
</el-button-group>
<el-button class="btn" @click="toTerminal"> <div class="flex flex-row gap-4">
<el-button @click="toTerminal">
{{ $t('menu.terminal') }} {{ $t('menu.terminal') }}
</el-button> </el-button>
<el-button-group class="copy-button" v-if="moveOpen"> <div>
<el-tooltip class="box-item" effect="dark" :content="$t('file.paste')" placement="bottom"> <el-popover placement="bottom" trigger="hover" @before-enter="getFavoriates">
<el-button plain @click="openPaste"> <template #reference>
{{ $t('file.paste') }}({{ fileMove.count }}) <el-button @click="openFavorite">
</el-button> {{ $t('file.favorite') }}
</el-tooltip> </el-button>
<el-tooltip class="box-item" effect="dark" :content="$t('file.cancel')" placement="bottom"> </template>
<el-button plain class="close" @click="closeMove">
<el-icon class="close-icon"><Close /></el-icon>
</el-button>
</el-tooltip>
</el-button-group>
</div>
<div class="right-section">
<el-popover placement="bottom" :width="200" trigger="hover" @before-enter="getFavoriates">
<template #reference>
<el-button @click="openFavorite">
{{ $t('file.favorite') }}
</el-button>
</template>
<div class="favorite-item">
<el-table :data="favorites"> <el-table :data="favorites">
<el-table-column prop="name"> <el-table-column prop="name">
<template #default="{ row }"> <template #default="{ row }">
@ -154,31 +302,29 @@
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </el-popover>
</el-popover> </div>
<el-button class="btn" @click="openRecycleBin"> <el-button @click="openRecycleBin">
{{ $t('file.recycleBin') }} {{ $t('file.recycleBin') }}
</el-button> </el-button>
<div class="search-button">
<el-input
v-model="req.search"
clearable
@clear="search()"
@keydown.enter="search()"
:placeholder="$t('file.search')"
>
<template #prepend>
<el-checkbox v-model="req.containSub">
{{ $t('file.sub') }}
</el-checkbox>
</template>
<template #append>
<el-button icon="Search" @click="search" round />
</template>
</el-input>
</div>
</div> </div>
<el-input
v-model="req.search"
clearable
@clear="search()"
@keydown.enter="search()"
:placeholder="$t('file.search')"
>
<template #prepend>
<el-checkbox v-model="req.containSub">
{{ $t('file.sub') }}
</el-checkbox>
</template>
<template #append>
<el-button icon="Search" @click="search" round />
</template>
</el-input>
</div> </div>
</template> </template>
<template #main> <template #main>
@ -443,6 +589,34 @@ const mobile = computed(() => {
return globalStore.isMobile(); return globalStore.isMobile();
}); });
const handleFilePatch = (command: string) => {
switch (command) {
case 'openUpload':
openUpload();
break;
case 'openWget':
openWget();
break;
case 'openMove:copy':
openMove('copy');
break;
case 'openMove:cut':
openMove('cut');
break;
case 'openCompress':
openCompress(selects.value);
break;
case 'openBatchRole':
openBatchRole(selects.value);
break;
case 'batchDelFiles':
openDetail(selects.value);
break;
default:
break;
}
};
const search = async () => { const search = async () => {
loading.value = true; loading.value = true;
if (req.search != '') { if (req.search != '') {

73
frontend/src/views/host/firewall/status/index.vue
Unescape View File

@ -2,42 +2,45 @@
<div> <div>
<div class="app-status" style="margin-top: 20px"> <div class="app-status" style="margin-top: 20px">
<el-card> <el-card>
<div> <div class="flex flex-row flex-wrap gap-2 sm:justify-between items-center">
<el-tag effect="dark" type="success">{{ baseInfo.name }}</el-tag> <div class="flex flex-row flex-wrap">
<el-tag round class="status-content" v-if="baseInfo.status === 'running'" type="success"> <el-tag effect="dark" type="success">{{ baseInfo.name }}</el-tag>
{{ $t('commons.status.running') }} <el-tag round class="status-content" v-if="baseInfo.status === 'running'" type="success">
</el-tag> {{ $t('commons.status.running') }}
<el-tag round class="status-content" v-if="baseInfo.status === 'not running'" type="info"> </el-tag>
{{ $t('commons.status.stopped') }} <el-tag round class="status-content" v-if="baseInfo.status === 'not running'" type="info">
</el-tag> {{ $t('commons.status.stopped') }}
<el-tag class="status-content">{{ $t('app.version') }}: {{ baseInfo.version }}</el-tag> </el-tag>
<el-tag class="status-content">{{ $t('app.version') }}: {{ baseInfo.version }}</el-tag>
<span v-if="baseInfo.status === 'running'" class="buttons"> </div>
<el-button type="primary" @click="onOperate('stop')" link> <div class="flex flex-wrap items-center">
{{ $t('commons.button.stop') }} <div v-if="baseInfo.status === 'running'">
</el-button> <el-button type="primary" @click="onOperate('stop')" link>
</span> {{ $t('commons.button.stop') }}
<span v-if="baseInfo.status === 'not running'" class="buttons"> </el-button>
<el-button type="primary" @click="onOperate('start')" link> </div>
{{ $t('commons.button.start') }} <div v-if="baseInfo.status === 'not running'">
</el-button> <el-button type="primary" @click="onOperate('start')" link>
</span> {{ $t('commons.button.start') }}
<el-divider direction="vertical" /> </el-button>
<el-button type="primary" @click="onOperate('restart')" link> </div>
{{ $t('container.restart') }}
</el-button>
<span v-if="onPing !== 'None'">
<el-divider direction="vertical" /> <el-divider direction="vertical" />
<el-button type="primary" link>{{ $t('firewall.noPing') }}</el-button> <el-button type="primary" @click="onOperate('restart')" link>
<el-switch {{ $t('container.restart') }}
size="small" </el-button>
class="ml-2" <div v-if="onPing !== 'None'">
inactive-value="Disable" <el-divider direction="vertical" />
active-value="Enable" <el-button type="primary" link>{{ $t('firewall.noPing') }}</el-button>
@change="onPingOperate" <el-switch
v-model="onPing" size="small"
/> class="ml-2"
</span> inactive-value="Disable"
active-value="Enable"
@change="onPingOperate"
v-model="onPing"
/>
</div>
</div>
</div> </div>
</el-card> </el-card>
</div> </div>

38
frontend/src/views/website/ssl/index.vue
Unescape View File

@ -3,24 +3,26 @@
<RouterButton :buttons="routerButton" /> <RouterButton :buttons="routerButton" />
<LayoutContent :title="$t('website.ssl')"> <LayoutContent :title="$t('website.ssl')">
<template #toolbar> <template #toolbar>
<el-button type="primary" @click="openSSL()"> <div class="flex flex-wrap gap-3 [&>*]:ml-3">
{{ $t('ssl.create') }} <el-button type="primary" @click="openSSL()">
</el-button> {{ $t('ssl.create') }}
<el-button type="primary" @click="openUpload()"> </el-button>
{{ $t('ssl.upload') }} <el-button type="primary" @click="openUpload()">
</el-button> {{ $t('ssl.upload') }}
<el-button type="primary" plain @click="openCA()"> </el-button>
{{ $t('ssl.selfSigned') }} <el-button type="primary" plain @click="openCA()">
</el-button> {{ $t('ssl.selfSigned') }}
<el-button type="primary" plain @click="openAcmeAccount()"> </el-button>
{{ $t('website.acmeAccountManage') }} <el-button type="primary" plain @click="openAcmeAccount()">
</el-button> {{ $t('website.acmeAccountManage') }}
<el-button type="primary" plain @click="openDnsAccount()"> </el-button>
{{ $t('website.dnsAccountManage') }} <el-button type="primary" plain @click="openDnsAccount()">
</el-button> {{ $t('website.dnsAccountManage') }}
<el-button plain @click="deleteSSL(null)" :disabled="selects.length === 0"> </el-button>
{{ $t('commons.button.delete') }} <el-button plain @click="deleteSSL(null)" :disabled="selects.length === 0">
</el-button> {{ $t('commons.button.delete') }}
</el-button>
</div>
</template> </template>
<template #main> <template #main>
<br /> <br />

Write Preview
Loading…
Cancel
Save