Selaa lähdekoodia

fix(photography): 修复相机预览界面的自动对焦按钮样式问题

- 将自动对焦按钮从普通div替换为el-button组件
- 为对焦按钮添加previewKey条件渲染控制
- 移除冗余的CSS样式定义以避免样式冲突
- 更新按钮文本从"自动对焦"改为"点击对焦"
panqiuyao 5 päivää sitten
vanhempi
commit
53b868e32f
1 muutettua tiedostoa jossa 3 lisäystä ja 12 poistoa
  1. 3 12
      frontend/src/views/Photography/check.vue

+ 3 - 12
frontend/src/views/Photography/check.vue

@@ -23,9 +23,9 @@
             <div class="camera-preview  flex col center ">
               <div class="camera-preview-img" v-if="step === 1">
                 <img v-if="previewKey" class="camera-img" :src="previewSrc" />
-                <div class="auto-focus-btn" @click="handleAutoFocus">
-                  <span>自动对焦</span>
-                </div>
+                <el-button class="auto-focus-btn" @click="handleAutoFocus"  v-if="previewKey">
+                  <span>点击对焦</span>
+                </el-button>
                 <div class="example-image flex-col" v-if="!isSetting && previewKey > 1">
                   <img :src="exampleImage">
                 </div>
@@ -537,15 +537,6 @@ onBeforeUnmount(() => {
             top: 10px;
             right: 10px;
             z-index: 10;
-            background: rgba(64, 158, 255, 0.9);
-            color: #fff;
-            padding: 8px 16px;
-            border-radius: 4px;
-            cursor: pointer;
-            font-size: 14px;
-            &:hover {
-              background: rgba(64, 158, 255, 1);
-            }
           }
 
           .camera-img {