1Panel-dev/1Panel
1
1
Fork 0
mirror of https://github.com/1Panel-dev/1Panel.git synced 2024-09-20 07:35:58 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

style:更新所有移动端container路径下样式 (#6387)

Browse source 
* style:更新所有移动端container路径下样式

* style:修复el-button的默认margin
This commit is contained in:
see-more 2024-09-06 10:00:53 +08:00 committed by GitHub
parent 666f8c813d
commit f2d3acb650
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
8 changed files with 97 additions and 64 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
frontend/src/views/container/compose/index.vue
View file

@ -25,17 +25,28 @@
</el-alert> </el-alert>
</template> </template>
<template #toolbar> <template #toolbar>
<el-row> <div class="hidden sm:block sm:flex sm:flex-row sm:w-full sm:justify-between">
<el-col :span="16"> <div>
<el-button type="primary" @click="onOpenDialog()"> <el-button type="primary" @click="onOpenDialog()">
{{ $t('container.createCompose') }} {{ $t('container.createCompose') }}
</el-button> </el-button>
</el-col> </div>
<el-col :span="8"> <div class="flex flex-row gap-2">
<TableSetting @search="search()" /> <TableSetting @search="search()" />
<TableSearch @search="search()" v-model:searchName="searchName" /> <TableSearch @search="search()" v-model:searchName="searchName" />
</el-col> </div>
</el-row> </div>
<div class="block flex flex-col gap-2 sm:hidden">
<div class="flex justify-between">
<el-button type="primary" @click="onOpenDialog()">
{{ $t('container.createCompose') }}
</el-button>
<TableSetting @search="search()" />
</div>
<div class="flex justify-end">
<TableSearch @search="search()" v-model:searchName="searchName" />
</div>
</div>
</template> </template>
<template #main> <template #main>
<ComplexTable <ComplexTable

12
frontend/src/views/container/image/index.vue
View file

@ -8,8 +8,8 @@
<LayoutContent :title="$t('container.image')" :class="{ mask: dockerStatus != 'Running' }"> <LayoutContent :title="$t('container.image')" :class="{ mask: dockerStatus != 'Running' }">
<template #toolbar> <template #toolbar>
<el-row> <div class="flex flex-col gap-4 justify-between items-center flex-wrap sm:flex-row">
<el-col :span="16"> <div class="flex gap-4 flex-wrap">
<el-button type="primary" plain @click="onOpenPull"> <el-button type="primary" plain @click="onOpenPull">
{{ $t('container.imagePull') }} {{ $t('container.imagePull') }}
</el-button> </el-button>
@ -25,12 +25,12 @@
<el-button type="primary" plain @click="onOpenPrune()"> <el-button type="primary" plain @click="onOpenPrune()">
{{ $t('container.imagePrune') }} {{ $t('container.imagePrune') }}
</el-button> </el-button>
</el-col> </div>
<el-col :span="8"> <div class="flex ml-2 gap-2">
<TableSetting @search="search()" /> <TableSetting @search="search()" />
<TableSearch @search="search()" v-model:searchName="searchName" /> <TableSearch @search="search()" v-model:searchName="searchName" />
</el-col> </div>
</el-row> </div>
</template> </template>
<template #main> <template #main>
<ComplexTable :pagination-config="paginationConfig" :data="data" @search="search"> <ComplexTable :pagination-config="paginationConfig" :data="data" @search="search">

6
frontend/src/views/container/index.vue
View file

@ -45,3 +45,9 @@ const buttons = [
}, },
]; ];
</script> </script>
<style>
.el-button + .el-button {
margin: 0;
}
</style>

12
frontend/src/views/container/network/index.vue
View file

@ -8,8 +8,8 @@
<LayoutContent :title="$t('container.network')" :class="{ mask: dockerStatus != 'Running' }"> <LayoutContent :title="$t('container.network')" :class="{ mask: dockerStatus != 'Running' }">
<template #toolbar> <template #toolbar>
<el-row> <div class="flex flex-col gap-4 justify-between sm:flex-row">
<el-col :span="16"> <div class="flex gap-4">
<el-button type="primary" @click="onCreate()"> <el-button type="primary" @click="onCreate()">
{{ $t('container.createNetwork') }} {{ $t('container.createNetwork') }}
</el-button> </el-button>
@ -19,12 +19,12 @@
<el-button :disabled="selects.length === 0" @click="batchDelete(null)"> <el-button :disabled="selects.length === 0" @click="batchDelete(null)">
{{ $t('commons.button.delete') }} {{ $t('commons.button.delete') }}
</el-button> </el-button>
</el-col> </div>
<el-col :span="8"> <div class="flex flex-row gap-2">
<TableSetting @search="search()" /> <TableSetting @search="search()" />
<TableSearch @search="search()" v-model:searchName="searchName" /> <TableSearch @search="search()" v-model:searchName="searchName" />
</el-col> </div>
</el-row> </div>
</template> </template>
<template #main> <template #main>
<ComplexTable <ComplexTable

23
frontend/src/views/container/repo/index.vue
View file

@ -8,17 +8,28 @@
<LayoutContent :title="$t('container.repo')" :class="{ mask: dockerStatus != 'Running' }"> <LayoutContent :title="$t('container.repo')" :class="{ mask: dockerStatus != 'Running' }">
<template #toolbar> <template #toolbar>
<el-row> <div class="block flex flex-col gap-2 sm:hidden">
<el-col :span="16"> <div class="flex flex-row justify-between">
<el-button type="primary" @click="onOpenDialog('add')"> <el-button type="primary" @click="onOpenDialog('add')">
{{ $t('container.createRepo') }} {{ $t('container.createRepo') }}
</el-button> </el-button>
</el-col> <TableSetting @search="search()" />
<el-col :span="8"> </div>
<div class="flex flex-row justify-end">
<TableSearch @search="search()" v-model:searchName="searchName" />
</div>
</div>
<div class="hidden sm:block sm:flex sm:justify-between">
<div>
<el-button type="primary" @click="onOpenDialog('add')">
{{ $t('container.createRepo') }}
</el-button>
</div>
<div class="flex flex-row gap-2">
<TableSetting @search="search()" /> <TableSetting @search="search()" />
<TableSearch @search="search()" v-model:searchName="searchName" /> <TableSearch @search="search()" v-model:searchName="searchName" />
</el-col> </div>
</el-row> </div>
</template> </template>
<template #main> <template #main>
<ComplexTable <ComplexTable

61
frontend/src/views/container/setting/index.vue
View file

@ -2,17 +2,18 @@
<div v-loading="loading"> <div v-loading="loading">
<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-col gap-2 sm:flex-row sm:justify-between">
<el-tag style="float: left" effect="dark" type="success">Docker</el-tag> <div class="flex">
<el-tag round class="status-content" v-if="form.status === 'Running'" type="success"> <el-tag style="float: left" effect="dark" type="success">Docker</el-tag>
{{ $t('commons.status.running') }} <el-tag round class="status-content" v-if="form.status === 'Running'" type="success">
</el-tag> {{ $t('commons.status.running') }}
<el-tag round class="status-content" v-if="form.status === 'Stopped'" type="info"> </el-tag>
{{ $t('commons.status.stopped') }} <el-tag round class="status-content" v-if="form.status === 'Stopped'" type="info">
</el-tag> {{ $t('commons.status.stopped') }}
<el-tag class="status-content">{{ $t('app.version') }}: {{ form.version }}</el-tag> </el-tag>
<el-tag class="status-content">{{ $t('app.version') }}: {{ form.version }}</el-tag>
<span v-if="form.status === 'Running'" class="buttons"> </div>
<div class="flex justify-start" v-if="form.status === 'Running'">
<el-button type="primary" @click="onOperator('stop')" link> <el-button type="primary" @click="onOperator('stop')" link>
{{ $t('container.stop') }} {{ $t('container.stop') }}
</el-button> </el-button>
@ -20,9 +21,9 @@
<el-button type="primary" @click="onOperator('restart')" link> <el-button type="primary" @click="onOperator('restart')" link>
{{ $t('container.restart') }} {{ $t('container.restart') }}
</el-button> </el-button>
</span> </div>
<span v-if="form.status === 'Stopped'" class="buttons"> <div clsas="flex justify-start" v-if="form.status === 'Stopped'" class="buttons">
<el-button type="primary" @click="onOperator('start')" link> <el-button type="primary" @click="onOperator('start')" link>
{{ $t('container.start') }} {{ $t('container.start') }}
</el-button> </el-button>
@ -30,7 +31,7 @@
<el-button type="primary" @click="onOperator('restart')" link> <el-button type="primary" @click="onOperator('restart')" link>
{{ $t('container.restart') }} {{ $t('container.restart') }}
</el-button> </el-button>
</span> </div>
</div> </div>
</el-card> </el-card>
</div> </div>
@ -46,13 +47,16 @@
<el-col :xs="24" :sm="24" :md="15" :lg="12" :xl="10"> <el-col :xs="24" :sm="24" :md="15" :lg="12" :xl="10">
<el-form :model="form" label-position="left" :rules="rules" ref="formRef" label-width="120px"> <el-form :model="form" label-position="left" :rules="rules" ref="formRef" label-width="120px">
<el-form-item :label="$t('container.mirrors')" prop="mirrors"> <el-form-item :label="$t('container.mirrors')" prop="mirrors">
<div style="width: 100%" v-if="form.mirrors"> <div
class="flex w-full justify-start flex-col sm:flex-row sm:items-end"
v-if="form.mirrors"
>
<el-input <el-input
type="textarea" type="textarea"
:rows="5" :rows="5"
disabled disabled
v-model="form.mirrors" v-model="form.mirrors"
style="width: calc(100% - 80px)" class="sm:calc(100% - 80px)"
/> />
<el-button @click="onChangeMirrors" icon="Setting"> <el-button @click="onChangeMirrors" icon="Setting">
{{ $t('commons.button.set') }} {{ $t('commons.button.set') }}
@ -65,18 +69,19 @@
</el-button> </el-button>
</template> </template>
</el-input> </el-input>
<span class="input-help">{{ $t('container.mirrorsHelper') }}</span> <div class="flex">
<span class="input-help flx-align-center" style="display: flex"> <span>
{{ $t('container.mirrorsHelper2') }} {{ $t('container.mirrorsHelper') }} {{ $t('container.mirrorsHelper2') }}
<el-link <el-link
style="font-size: 12px; margin-left: 5px" style="font-size: 12px; margin-left: 5px"
icon="Position" icon="Position"
@click="toDoc()" @click="toDoc()"
type="primary" type="primary"
> >
{{ $t('firewall.quickJump') }} {{ $t('firewall.quickJump') }}
</el-link> </el-link>
</span> </span>
</div>
</el-form-item> </el-form-item>
<el-form-item :label="$t('container.registries')" prop="registries"> <el-form-item :label="$t('container.registries')" prop="registries">
<div style="width: 100%" v-if="form.registries"> <div style="width: 100%" v-if="form.registries">

12
frontend/src/views/container/template/index.vue
View file

@ -8,20 +8,20 @@
<LayoutContent :title="$t('container.composeTemplate')" :class="{ mask: dockerStatus != 'Running' }"> <LayoutContent :title="$t('container.composeTemplate')" :class="{ mask: dockerStatus != 'Running' }">
<template #toolbar> <template #toolbar>
<el-row> <div class="flex flex-col gap-2 sm:flex-row sm:justify-between">
<el-col :span="16"> <div class="flex gap-4">
<el-button type="primary" @click="onOpenDialog('create')"> <el-button type="primary" @click="onOpenDialog('create')">
{{ $t('container.createComposeTemplate') }} {{ $t('container.createComposeTemplate') }}
</el-button> </el-button>
<el-button type="primary" plain :disabled="selects.length === 0" @click="onBatchDelete(null)"> <el-button type="primary" plain :disabled="selects.length === 0" @click="onBatchDelete(null)">
{{ $t('commons.button.delete') }} {{ $t('commons.button.delete') }}
</el-button> </el-button>
</el-col> </div>
<el-col :span="8"> <div class="flex gap-4 sm:gap-2">
<TableSetting @search="search()" /> <TableSetting @search="search()" />
<TableSearch @search="search()" v-model:searchName="searchName" /> <TableSearch @search="search()" v-model:searchName="searchName" />
</el-col> </div>
</el-row> </div>
</template> </template>
<template #main> <template #main>
<ComplexTable <ComplexTable

12
frontend/src/views/container/volume/index.vue
View file

@ -8,8 +8,8 @@
<LayoutContent :title="$t('container.volume')" :class="{ mask: dockerStatus != 'Running' }"> <LayoutContent :title="$t('container.volume')" :class="{ mask: dockerStatus != 'Running' }">
<template #toolbar> <template #toolbar>
<el-row> <div class="flex flex-col gap-4 sm:flex-row justify-between">
<el-col :span="16"> <div class="flex flex-wrap gap-4">
<el-button type="primary" @click="onCreate()"> <el-button type="primary" @click="onCreate()">
{{ $t('container.createVolume') }} {{ $t('container.createVolume') }}
</el-button> </el-button>
@ -19,12 +19,12 @@
<el-button :disabled="selects.length === 0" @click="batchDelete(null)"> <el-button :disabled="selects.length === 0" @click="batchDelete(null)">
{{ $t('commons.button.delete') }} {{ $t('commons.button.delete') }}
</el-button> </el-button>
</el-col> </div>
<el-col :span="8"> <div class="flex flex-row flex-wrap gap-2">
<TableSetting @search="search()" /> <TableSetting @search="search()" />
<TableSearch @search="search()" v-model:searchName="searchName" /> <TableSearch @search="search()" v-model:searchName="searchName" />
</el-col> </div>
</el-row> </div>
</template> </template>
<template #main> <template #main>
<ComplexTable <ComplexTable