From a6875614f64443393fc453d9c9472fb5c1304aab Mon Sep 17 00:00:00 2001
From: ssongliu <73214554+ssongliu@users.noreply.github.com>
Date: Wed, 26 Nov 2025 12:39:20 +0800
Subject: [PATCH] style: Optimize container compose page style (#11076)

---
 frontend/src/lang/modules/en.ts               |  2 +-
 frontend/src/lang/modules/es-es.ts            |  2 +-
 frontend/src/lang/modules/ja.ts               |  2 +-
 frontend/src/lang/modules/ko.ts               |  2 +-
 frontend/src/lang/modules/ms.ts               |  2 +-
 frontend/src/lang/modules/pt-br.ts            |  2 +-
 frontend/src/lang/modules/ru.ts               |  2 +-
 frontend/src/lang/modules/tr.ts               |  2 +-
 frontend/src/lang/modules/zh-Hant.ts          |  2 +-
 frontend/src/lang/modules/zh.ts               |  2 +-
 .../src/views/container/compose/index.vue     | 28 +++++++++----------
 11 files changed, 24 insertions(+), 24 deletions(-)

diff --git a/frontend/src/lang/modules/en.ts b/frontend/src/lang/modules/en.ts
index 82a8d550c..c49633d48 100644
--- a/frontend/src/lang/modules/en.ts
+++ b/frontend/src/lang/modules/en.ts
@@ -1127,7 +1127,7 @@ const message = {
         targetHelper: 'Backup accounts are maintained in panel settings.',
         withImageHelper: 'Backup app store images, but this will increase the snapshot file size.',
         ignoreApp: 'Exclude apps',
-        withImage: 'Backup all app images',
+        withImage: 'Backup Application Image',
         retainCopies: 'Retain records',
         retryTimes: 'Retry Attempts',
         timeout: 'Timeout',
diff --git a/frontend/src/lang/modules/es-es.ts b/frontend/src/lang/modules/es-es.ts
index b5331d184..ae4d5b774 100644
--- a/frontend/src/lang/modules/es-es.ts
+++ b/frontend/src/lang/modules/es-es.ts
@@ -1130,7 +1130,7 @@ const message = {
         withImageHelper:
             'Respalda imágenes de la tienda de aplicaciones, pero esto aumentará el tamaño del archivo de la instantánea.',
         ignoreApp: 'Excluir aplicaciones',
-        withImage: 'Respaldar todas las imágenes de aplicaciones',
+        withImage: 'Copia de Seguridad de la Imagen de la Aplicación',
         retainCopies: 'Retener registros',
         retryTimes: 'Intentos de reintento',
         timeout: 'Tiempo de espera',
diff --git a/frontend/src/lang/modules/ja.ts b/frontend/src/lang/modules/ja.ts
index 2f54b07be..9236015b5 100644
--- a/frontend/src/lang/modules/ja.ts
+++ b/frontend/src/lang/modules/ja.ts
@@ -1098,7 +1098,7 @@ const message = {
         withImageHelper:
             'アプリストアのイメージをバックアップしますが、スナップショットファイルのサイズが大きくなります。',
         ignoreApp: 'アプリを除外',
-        withImage: 'すべてのアプリイメージをバックアップ',
+        withImage: 'アプリケーションイメージのバックアップ',
         retainCopies: '記録を保持します',
         retryTimes: 'リトライ回数',
         timeout: 'タイムアウト',
diff --git a/frontend/src/lang/modules/ko.ts b/frontend/src/lang/modules/ko.ts
index dac42eeed..8e91df6a6 100644
--- a/frontend/src/lang/modules/ko.ts
+++ b/frontend/src/lang/modules/ko.ts
@@ -1084,7 +1084,7 @@ const message = {
         targetHelper: '백업 계정은 패널 설정에서 관리됩니다.',
         withImageHelper: '앱 스토어 이미지를 백업하지만 스냅샷 파일 크기가 증가합니다.',
         ignoreApp: '앱 제외',
-        withImage: '모든 앱 이미지 백업',
+        withImage: '애플리케이션 이미지 백업',
         retainCopies: '기록 보관',
         retryTimes: '재시도 횟수',
         timeout: '타임아웃',
diff --git a/frontend/src/lang/modules/ms.ts b/frontend/src/lang/modules/ms.ts
index 7b79f5aca..7a6756ac5 100644
--- a/frontend/src/lang/modules/ms.ts
+++ b/frontend/src/lang/modules/ms.ts
@@ -1119,7 +1119,7 @@ const message = {
         targetHelper: 'Akaun sandaran diselenggara dalam tetapan panel.',
         withImageHelper: 'Sandarkan imej kedai aplikasi, tetapi ini akan meningkatkan saiz fail snapshot.',
         ignoreApp: 'Kecualikan aplikasi',
-        withImage: 'Sandarkan semua imej aplikasi',
+        withImage: 'Sandarkan Imej Aplikasi',
         retainCopies: 'Simpan salinan',
         retryTimes: 'Bilangan Cubaan Semula',
         timeout: 'Masa Tamat',
diff --git a/frontend/src/lang/modules/pt-br.ts b/frontend/src/lang/modules/pt-br.ts
index 9d5859b76..1b450c395 100644
--- a/frontend/src/lang/modules/pt-br.ts
+++ b/frontend/src/lang/modules/pt-br.ts
@@ -1118,7 +1118,7 @@ const message = {
         withImageHelper:
             'Fazer backup das imagens da loja de aplicativos, mas isso aumentará o tamanho do arquivo de snapshot.',
         ignoreApp: 'Excluir aplicativos',
-        withImage: 'Fazer backup de todas as imagens de aplicativos',
+        withImage: 'Backup da Imagem do Aplicativo',
         retainCopies: 'Manter cópias',
         retryTimes: 'Tentativas de Repetição',
         timeout: 'Tempo Limite',
diff --git a/frontend/src/lang/modules/ru.ts b/frontend/src/lang/modules/ru.ts
index ec26041b3..0e42d990a 100644
--- a/frontend/src/lang/modules/ru.ts
+++ b/frontend/src/lang/modules/ru.ts
@@ -1113,7 +1113,7 @@ const message = {
         targetHelper: 'Учетные записи резервного копирования управляются в настройках панели.',
         withImageHelper: 'Резервное копирование образов из магазина приложений увеличит размер файла снимка.',
         ignoreApp: 'Исключить приложения',
-        withImage: 'Резервное копирование всех образов приложений',
+        withImage: 'Резервная Копия Образа Приложения',
         retainCopies: 'Сохранять записи',
         retryTimes: 'Количество повторов',
         timeout: 'Таймаут',
diff --git a/frontend/src/lang/modules/tr.ts b/frontend/src/lang/modules/tr.ts
index b34adcf3b..219dfc44e 100644
--- a/frontend/src/lang/modules/tr.ts
+++ b/frontend/src/lang/modules/tr.ts
@@ -1142,7 +1142,7 @@ const message = {
         targetHelper: 'Yedekleme hesapları panel ayarlarında sürdürülür.',
         withImageHelper: 'Uygulama mağazası imajlarını yedekle, ancak bu anlık görüntü dosya boyutunu artıracaktır.',
         ignoreApp: 'Uygulamaları hariç tut',
-        withImage: 'Tüm uygulama imajlarını yedekle',
+        withImage: 'Uygulama Görüntüsünü Yedekle',
         retainCopies: 'Kayıtları sakla',
         retryTimes: 'Yeniden Deneme Girişimleri',
         timeout: 'Zaman aşımı',
diff --git a/frontend/src/lang/modules/zh-Hant.ts b/frontend/src/lang/modules/zh-Hant.ts
index 095d7e95f..0b33eddd5 100644
--- a/frontend/src/lang/modules/zh-Hant.ts
+++ b/frontend/src/lang/modules/zh-Hant.ts
@@ -1064,7 +1064,7 @@ const message = {
         urlHelper: '請輸入正確的 URL 地址',
         targetHelper: '備份帳號可在面板設定中維護',
         ignoreApp: '排除應用',
-        withImage: '備份所有應用鏡像',
+        withImage: '備份應用映像',
         retainCopies: '保留份數',
         retryTimes: '失敗重試次數',
         timeout: '逾時時間',
diff --git a/frontend/src/lang/modules/zh.ts b/frontend/src/lang/modules/zh.ts
index 1e01d5d0b..1b327b032 100644
--- a/frontend/src/lang/modules/zh.ts
+++ b/frontend/src/lang/modules/zh.ts
@@ -1067,7 +1067,7 @@ const message = {
         targetHelper: '备份账号可在面板设置中维护',
         withImageHelper: '备份应用商店镜像，但是会增大快照文件体积。',
         ignoreApp: '排除应用',
-        withImage: '备份所有应用镜像',
+        withImage: '备份应用镜像',
         retainCopies: '保留份数',
         retryTimes: '失败重试次数',
         timeout: '超时时间',
diff --git a/frontend/src/views/container/compose/index.vue b/frontend/src/views/container/compose/index.vue
index 96ce3bb13..27295f679 100644
--- a/frontend/src/views/container/compose/index.vue
+++ b/frontend/src/views/container/compose/index.vue
@@ -14,6 +14,7 @@
                 </el-button>
             </template>
             <template #rightToolBar>
+                <TableSearch @search="search()" v-model:searchName="searchName" />
                 <TableRefresh @search="search()" />
                 <TableSetting title="container-refresh" @search="search()" />
             </template>
@@ -21,20 +22,12 @@
                 <el-row v-if="data.length > 0" :gutter="20" class="row-box">
                     <el-col :span="7">
                         <el-card>
-                            <el-input
-                                v-model="searchName"
-                                :placeholder="$t('commons.button.search')"
-                                clearable
-                                class="w-4/5"
-                                @clear="search"
-                                @keyup.enter="search"
+                            <el-table
+                                :max-height="loadTableHeight()"
+                                :show-header="false"
+                                @row-click="loadDetail"
+                                :data="data"
                             >
-                                <template #prefix>
-                                    <el-icon><Search /></el-icon>
-                                </template>
-                            </el-input>
-
-                            <el-table class="mt-2" :show-header="false" @row-click="loadDetail" :data="data">
                                 <el-table-column prop="name">
                                     <template #default="{ row }">
                                         <div class="cursor-pointer">
@@ -296,7 +289,6 @@ import { Container } from '@/api/interface/container';
 import { routerToFileWithPath } from '@/utils/router';
 import { MsgSuccess } from '@/utils/message';
 import { computeCPU, computeSize2, computeSizeForDocker } from '@/utils/util';
-import { Search } from '@element-plus/icons-vue';
 
 const data = ref<any[]>([]);
 const loading = ref(false);
@@ -351,6 +343,14 @@ const loadFrom = (row: any) => {
     }
 };
 
+const loadTableHeight = () => {
+    if (currentCompose.value.createdBy === '1Panel') {
+        return `calc(100vh - 120px)`;
+    } else {
+        return `calc(100vh - 240px)`;
+    }
+};
+
 const search = async (withRefreshDetail?: boolean) => {
     if (!isActive.value || !isExist.value) {
         return;