diff --git a/ui/src/components/theme/input/index.less b/ui/src/components/theme/input/index.less
index 38f2620f83fd4ceb44ef0493e0223e8e99e73b94..771d47bf5fba41c6a6d6c34ec6cbbea5e8449fe7 100644
--- a/ui/src/components/theme/input/index.less
+++ b/ui/src/components/theme/input/index.less
@@ -1,14 +1,16 @@
-@default-border-color: #D0E0ED;
-@primary-border-color: #096DD9;
-@secondary-border-color: #0091FF;
-@disabled-border-color: #E8E8E8;
+@default-border-color: #d0e0ed;
+@primary-border-color: #096dd9;
+@secondary-border-color: #0091ff;
+@disabled-border-color: #e8e8e8;
 
-.el-input.is-disabled .el-input__inner, .el-textarea.is-disabled .el-textarea__inner {
-  background-color: #F6F8FB;
+.el-input.is-disabled .el-input__inner,
+.el-textarea.is-disabled .el-textarea__inner {
+  background-color: #f6f8fb;
   border-color: @disabled-border-color;
 }
 
-.el-input__inner, .el-textarea__inner {
+.el-input__inner,
+.el-textarea__inner {
   border-radius: 2px;
   border-color: @default-border-color;
   color: #333333;
@@ -33,11 +35,11 @@
     .el-input__suffix-inner {
       .el-icon-circle-close::before {
         content: '\e6db';
-        color: #8696B6;
+        color: #8696b6;
       }
 
       .jm-icon-button-search::before {
-        color: #6F8794;
+        color: #6f8794;
       }
 
       .el-icon-view::before {
@@ -56,15 +58,15 @@
     }
   }
 
-  input.el-input__inner[type=password] ~ .el-input__suffix {
+  input.el-input__inner[type='password'] ~ .el-input__suffix {
     .el-icon-view::before {
-      content: '\e803';
+      content: '\e800';
     }
   }
 
-  input.el-input__inner[type=text] ~ .el-input__suffix {
+  input.el-input__inner[type='text'] ~ .el-input__suffix {
     .el-icon-view::before {
-      content: '\e800';
+      content: '\e803';
     }
   }
-}
\ No newline at end of file
+}
diff --git a/ui/src/views/common/webhook-drawer.vue b/ui/src/views/common/webhook-drawer.vue
index babcca43783b2c5f134c2a4a098ddb598e6b14e4..7862051548370c7bfda65c8c630690e523e38af3 100644
--- a/ui/src/views/common/webhook-drawer.vue
+++ b/ui/src/views/common/webhook-drawer.vue
@@ -120,14 +120,14 @@
                     <jm-text-viewer :value="scope.row.name" />
                   </template>
                 </jm-table-column>
-                <jm-table-column label="参数类型" width="200px" prop="type"> </jm-table-column>
+                <jm-table-column label="参数类型" width="200px" prop="type"></jm-table-column>
                 <jm-table-column label="参数值" prop="value">
                   <template #default="scope">
                     <div v-if="scope.row.type === ParamTypeEnum.SECRET">
                       <!-- 密钥类型切换 -->
                       <div class="hide-container" v-if="secretVisible">
                         <span>********************</span>
-                        <i class="hide-secret jm-icon-input-visible" @click="hideSecret"></i>
+                        <i class="hide-secret jm-icon-input-invisible" @click="hideSecret"></i>
                       </div>
                       <div class="display-container" v-else>
                         <template v-if="scope.row.value">
@@ -151,7 +151,7 @@
                             </template>
                           </div>
                         </template>
-                        <i class="display-secret jm-icon-input-invisible" @click="displaySecret"></i>
+                        <i class="display-secret jm-icon-input-visible" @click="displaySecret"></i>
                       </div>
                     </div>
                     <template v-else>
@@ -871,10 +871,6 @@ export default defineComponent({
             position: relative;
             top: -2px;
 
-            .jm-icon-input-visible::before {
-              content: '\e803';
-            }
-
             &:hover {
               background: #eff7ff;
             }
@@ -896,7 +892,7 @@ export default defineComponent({
 
           .display-secret {
             .jm-icon-input-invisible::before {
-              content: '\e800';
+              content: '\e803';
             }
 
             &:hover {