优化

src/components/KeyInfoForm/index.vue

@@ -102,7 +102,27 @@
                     @afterRead="afterRead"
                     :capture="['camera']"
                     :fileList="keyInfoForm.faceImg"
+                    v-if="
+                        !keyInfoForm.faceImg[0]?.name.includes('bast64') ||
+                        keyInfoForm.faceImg.length === 0
+                    "
                 />
+
+                <!-- 如果由后台的身份证识别的base64图片，则用原生image展示 -->
+                <view
+                    class="face-img-container"
+                    v-if="keyInfoForm.faceImg[0]?.name.includes('bast64')"
+                >
+                    <image
+                        mode="aspectFit"
+                        style="width: 80px; height: 80px"
+                        :src="keyInfoForm.faceImg[0]?.url"
+                    />
+
+                    <view class="right-delete">
+                        <up-icon name="close" size="10" color="#fff" @click="deletePic"></up-icon>
+                    </view>
+                </view>
             </up-form-item>
         </up-form>
 
@@ -548,4 +568,23 @@ watch(
     flex-direction: column;
     gap: 4px;
 }
+
+.face-img-container {
+    position: relative;
+}
+
+.right-delete {
+    position: absolute;
+    top: 0;
+    right: 0;
+    background-color: rgb(55, 55, 55);
+    height: 14px;
+    width: 14px;
+    display: flex;
+    flex-direction: row;
+    border-bottom-left-radius: 100px;
+    align-items: center;
+    justify-content: flex-end;
+    z-index: 3;
+}
 </style>

src/pages/machine-setting/index.vue

@@ -32,18 +32,17 @@
                     <text> {{ item.deviceCode }} </text>
                 </view>
 
-                <view class="common-info common-info-1">
-                    <view>
+                <view style="display: flex; align-items: center; justify-content: space-between">
+                    <view class="common-info">
                         <text class="label-text">名称</text>
-                        <text> {{ item.deviceName }} </text>
-                    </view>
-                    <view>
-                        <u-tag
-                            size="small"
-                            :text="item.proId ? '已绑定' : '未绑定'"
-                            :type="item.proId ? 'success' : 'error'"
-                        />
+                        <text class="value-text"> {{ item.deviceName }} </text>
                     </view>
+
+                    <u-tag
+                        size="small"
+                        :text="item.proId ? '已绑定' : '未绑定'"
+                        :type="item.proId ? 'success' : 'error'"
+                    />
                 </view>
 
                 <template v-if="item.proId">