From f004df42af0b3c19da133ab644d620fd6d313bb7 Mon Sep 17 00:00:00 2001
From: ssongliu <73214554+ssongliu@users.noreply.github.com>
Date: Sat, 7 Oct 2023 15:52:47 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BC=98=E5=8C=96=20compose=20=E5=88=A0?=
 =?UTF-8?q?=E9=99=A4=E6=8F=90=E7=A4=BA=E4=BF=A1=E6=81=AF=20(#2437)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/lang/modules/en.ts               |  2 +-
 frontend/src/lang/modules/tw.ts               |  2 +-
 frontend/src/lang/modules/zh.ts               |  2 +-
 .../views/container/compose/delete/index.vue  | 29 +++++++++++++++----
 4 files changed, 27 insertions(+), 8 deletions(-)

diff --git a/frontend/src/lang/modules/en.ts b/frontend/src/lang/modules/en.ts
index e6691392c..7a8e7f63a 100644
--- a/frontend/src/lang/modules/en.ts
+++ b/frontend/src/lang/modules/en.ts
@@ -661,7 +661,7 @@ const message = {
             'The composition created through 1Panel editor or template will be saved in the {0}/docker/compose directory.',
         deleteFile: 'Delete file',
         deleteComposeHelper:
-            'Delete all files in the directory where the compose file is located, including persistent files in that directory. Please be cautious when performing this operation.',
+            'Delete all files in the {0} directory, including persistent files in this directory. Please proceed with caution!',
         deleteCompose: '" Delete this composition.',
         apps: 'Apps',
         local: 'Local',
diff --git a/frontend/src/lang/modules/tw.ts b/frontend/src/lang/modules/tw.ts
index 936fe371b..5526c240f 100644
--- a/frontend/src/lang/modules/tw.ts
+++ b/frontend/src/lang/modules/tw.ts
@@ -641,7 +641,7 @@ const message = {
         composePathHelper: '配置文件保存路徑: {0}',
         composeHelper: '通過 1Panel 編輯或者模版創建的編排，將保存在 {0}/docker/compose 路徑下',
         deleteFile: '刪除文件',
-        deleteComposeHelper: '刪除編排文件所在目錄下所有文件，包括該文件下的持久化文件等，請謹慎操作！',
+        deleteComposeHelper: '刪除 {0} 目录下所有文件，包括該文件下的持久化文件等，請謹慎操作！',
         deleteCompose: '" 刪除此編排',
         apps: '應用商店',
         local: '本地',
diff --git a/frontend/src/lang/modules/zh.ts b/frontend/src/lang/modules/zh.ts
index a27ef57fd..c615505c6 100644
--- a/frontend/src/lang/modules/zh.ts
+++ b/frontend/src/lang/modules/zh.ts
@@ -641,7 +641,7 @@ const message = {
         composePathHelper: '配置文件保存路径: {0}',
         composeHelper: '通过 1Panel 编辑或者模版创建的编排，将保存在 {0}/docker/compose 路径下',
         deleteFile: '删除文件',
-        deleteComposeHelper: '删除编排文件所在目录下所有文件，包括该文件下的持久化文件等，请谨慎操作！',
+        deleteComposeHelper: '删除 {0} 目录下所有文件，包括该文件下的持久化文件等，请谨慎操作！',
         deleteCompose: '" 删除此编排',
         apps: '应用商店',
         local: '本地',
diff --git a/frontend/src/views/container/compose/delete/index.vue b/frontend/src/views/container/compose/delete/index.vue
index c30bd3268..480d33a13 100644
--- a/frontend/src/views/container/compose/delete/index.vue
+++ b/frontend/src/views/container/compose/delete/index.vue
@@ -9,14 +9,14 @@
             <el-form-item>
                 <el-checkbox v-model="deleteFile" :label="$t('container.deleteFile')" />
                 <span class="input-help">
-                    {{ $t('container.deleteComposeHelper') }}
+                    {{ $t('container.deleteComposeHelper', [loadComposeDir()]) }}
                 </span>
             </el-form-item>
             <el-form-item>
-                <div>
-                    <span style="font-size: 12px">{{ $t('database.delete') }}</span>
-                    <span style="font-size: 12px; color: red; font-weight: 500">{{ composeName }}</span>
-                    <span style="font-size: 12px">{{ $t('container.deleteCompose') }}</span>
+                <div class="font">
+                    <span>{{ $t('database.delete') }}</span>
+                    <span class="warning">{{ composeName }}</span>
+                    <span>{{ $t('container.deleteCompose') }}</span>
                 </div>
                 <el-input v-model="deleteInfo" :placeholder="composeName"></el-input>
             </el-form-item>
@@ -64,6 +64,15 @@ const acceptParams = async (prop: DialogProps) => {
     dialogVisible.value = true;
 };
 
+const loadComposeDir = () => {
+    const parts = composePath.value.split('/');
+    if (parts.length <= 2) {
+        return '/';
+    }
+    const parentDirectory = parts.slice(0, -1).join('/');
+    return parentDirectory;
+};
+
 const submit = async () => {
     loading.value = true;
     let params = {
@@ -88,3 +97,13 @@ defineExpose({
     acceptParams,
 });
 </script>
+
+<style lang="scss" scoped>
+.font {
+    font-size: 12px;
+    .warning {
+        color: red;
+        font-weight: 500;
+    }
+}
+</style>