From b9c64510a7133afd675bbb2b6161bbf16e5d2fd5 Mon Sep 17 00:00:00 2001
From: jingrow <support@jingrow.com>
Date: Sat, 22 Nov 2025 00:01:02 +0800
Subject: [PATCH] add Chinese translations for URL input feature

---
 apps/jingrow/frontend/src/locales/zh-CN.json  |  7 ++++
 .../remove_background/remove_background.vue   | 38 ++++++++++++++++++-
 2 files changed, 44 insertions(+), 1 deletion(-)

diff --git a/apps/jingrow/frontend/src/locales/zh-CN.json b/apps/jingrow/frontend/src/locales/zh-CN.json
index abe131c..f36ee17 100644
--- a/apps/jingrow/frontend/src/locales/zh-CN.json
+++ b/apps/jingrow/frontend/src/locales/zh-CN.json
@@ -1136,6 +1136,13 @@
   "Please login first to use this feature": "请先登录以使用此功能",
   "Session expired. Please login again.": "会话已过期，请重新登录",
   "Session expired. Please login again to use this feature.": "会话已过期，请重新登录以使用此功能",
+  "Or paste image URL here": "或在此处粘贴图片URL",
+  "Loading image from URL...": "正在从URL加载图片...",
+  "Please enter an image URL": "请输入图片URL",
+  "Please enter a valid image URL": "请输入有效的图片URL",
+  "Failed to load image from URL": "从URL加载图片失败",
+  "CORS error. The image server does not allow cross-origin access.": "CORS错误，图片服务器不允许跨域访问",
+  "Failed to load image. Please check the URL and try again.": "加载图片失败，请检查URL后重试",
 
   "Tool Marketplace": "工具市场",
   "Browse and install tools from Jingrow Tool Marketplace": "浏览和安装来自 Jingrow 工具市场的工具",
diff --git a/apps/jingrow/frontend/src/views/tools/remove_background/remove_background.vue b/apps/jingrow/frontend/src/views/tools/remove_background/remove_background.vue
index fce3848..2f41d9e 100644
--- a/apps/jingrow/frontend/src/views/tools/remove_background/remove_background.vue
+++ b/apps/jingrow/frontend/src/views/tools/remove_background/remove_background.vue
@@ -66,6 +66,7 @@
                     :placeholder="t('Or paste image URL here')"
                     @keyup.enter="handleUrlSubmit"
                     @paste="handleUrlPaste"
+                    :disabled="processing"
                   />
                   <button
                     type="button"
@@ -73,11 +74,16 @@
                     @click="handleUrlSubmit"
                     :disabled="!imageUrl.trim() || processing"
                   >
-                    <i class="fa fa-arrow-right"></i>
+                    <i v-if="processing" class="fa fa-spinner fa-spin"></i>
+                    <i v-else class="fa fa-arrow-right"></i>
                   </button>
                 </div>
               </div>
             </div>
+            <div v-if="processing" class="upload-processing-overlay">
+              <div class="spinner"></div>
+              <p>{{ t('Loading image from URL...') }}</p>
+            </div>
           </div>
 
           <div v-else class="preview-section">
@@ -903,6 +909,7 @@ const removeHistoryItem = (index: number) => {
   transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
   background: #fafbfc;
   min-height: 0;
+  position: relative;
 
   &:hover {
     border-color: #1fc76f;
@@ -917,6 +924,30 @@ const removeHistoryItem = (index: number) => {
   }
 }
 
+.upload-processing-overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(255, 255, 255, 0.95);
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 16px;
+  border-radius: 12px;
+  backdrop-filter: blur(4px);
+  z-index: 10;
+
+  p {
+    font-size: 14px;
+    color: #64748b;
+    margin: 0;
+    font-weight: 500;
+  }
+}
+
 .upload-content {
   display: flex;
   flex-direction: column;
@@ -994,6 +1025,11 @@ const removeHistoryItem = (index: number) => {
   &::placeholder {
     color: #94a3b8;
   }
+
+  &:disabled {
+    opacity: 0.6;
+    cursor: not-allowed;
+  }
 }
 
 .url-submit-btn {