✨ Feature(custom): add image watermark opacity setting

ISSUES CLOSED: #348

src/renderer/components/ImageProcessSetting.vue

@@ -306,6 +306,24 @@
               >
             </div>
 
+            <div
+              v-if="waterMarkForm.watermarkType === 'image'"
+              class="form-group"
+            >
+              <label>{{ $t('pages.imageProcess.watermark.imageOpacity') }}</label>
+              <input
+                v-model.number="waterMarkForm.watermarkImageOpacity"
+                type="range"
+                min="0"
+                max="255"
+                step="1"
+                class="form-range"
+              >
+              <div class="range-value">
+                {{ waterMarkForm.watermarkImageOpacity || 0 }}
+              </div>
+            </div>
+
             <!-- Watermark Position -->
             <div class="form-group">
               <label>{{ $t('pages.imageProcess.watermark.position') }}</label>
@@ -583,7 +601,8 @@ const waterMarkForm = reactive<IBuildInWaterMarkOptions>({
   watermarkScaleRatio: 0.15,
   watermarkColor: '#CCCCCC73',
   watermarkImagePath: '',
-  watermarkPosition: 'southeast'
+  watermarkPosition: 'southeast',
+  watermarkImageOpacity: 255
 })
 
 const compressForm = reactive<IBuildInCompressOptions>({

src/renderer/i18n/locales/en.json

@@ -104,7 +104,8 @@
           "bottomLeft": "Bottom Left",
           "bottomRight": "Bottom Right",
           "center": "Center"
-        }
+        },
+        "imageOpacity": "Watermark Opacity"
       },
       "transform": {
         "title": "Transform Settings",

src/renderer/i18n/locales/zh-CN.json

@@ -104,7 +104,8 @@
           "bottomLeft": "左下",
           "bottomRight": "右下",
           "center": "中"
-        }
+        },
+        "imageOpacity": "水印透明度"
       },
       "transform": {
         "title": "变换设置",

src/renderer/i18n/locales/zh-TW.json

@@ -104,7 +104,8 @@
           "bottomLeft": "左下",
           "bottomRight": "右下",
           "center": "中"
-        }
+        },
+        "imageOpacity": "水印透明度"
       },
       "transform": {
         "title": "變換設置",