🎨 修改细节问题

src/components/dynamicf/Sign.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="sign">
-    <vue-esign ref="esign" :disabled="disabled" />
-    <div v-if="showHistory" class="history">
+    <vue-esign v-show="showSign" ref="esign" :disabled="disabled" />
+    <div v-show="!showSign" class="history">
       <img :src="modelValue" alt="历史签名" />
     </div>
     <div v-if="!disabled" class="footer">
@@ -15,7 +15,7 @@
       </div>
       <div v-else-if="state === 'success'" class="tip success">
         <CheckOutlined />
-        <span>签名上传成功</span>
+        <span>已签名，若有问题可以点击“重签”重新签名</span>
       </div>
       <div>
         <a-button size="small" shape="round" @click="clear">重签</a-button>
@@ -48,21 +48,19 @@ const props = defineProps({
     type: Object as PropType<UploadCoInterface>,
     default: null,
   },
-  showHistory: {
-    type: Boolean,
-    default: false
-  }
 });
 
 const emit = defineEmits(['update:modelValue']);
 const esign = ref();
 const state = ref<'default'|'error'|'success'>('default');
+const showSign = ref(true);
 
 const formItemContext = Form.useInjectFormItemContext();
 
 onMounted(() => {
   if (props.modelValue) {
     state.value = 'success';
+    showSign.value = false;
   }
 })
 
@@ -71,17 +69,18 @@ const clear = () => {
     Modal.confirm({
       title: '确认清除签名？',
       okText: '清除',
-      cancelText: '取消',
       onOk: () => {
         emit('update:modelValue', '');
         formItemContext.onFieldChange();
         esign.value.reset();
         state.value = 'default';
+        showSign.value = true;
       }
     })
   } else {
     state.value = 'default';
     esign.value.reset();
+    showSign.value = true;
   }
 }
 const confirm = () => {
@@ -111,6 +110,7 @@ const confirm = () => {
         message.success('签名上传成功');
         state.value = 'success';
         formItemContext.onFieldChange();
+        showSign.value = false;
         emit('update:modelValue', res);
       }).catch((err) => {
         state.value = 'error';
@@ -122,6 +122,7 @@ const confirm = () => {
     } else {
       // 不上传，直接返回base64字符串
       formItemContext.onFieldChange();
+      showSign.value = false;
       emit('update:modelValue', res);
     }
   });
@@ -148,6 +149,16 @@ function base64ToBlob(base64: string, mimeType = 'image/png') {
   border-radius: 10px;
   overflow: hidden;
 
+  .history {
+    position: relative;
+    margin-bottom: 10px;
+
+    img {
+      max-width: 100%;
+      height: 100%;
+      object-fit: contain;
+    }
+  }
   .tip {
     font-size: 12px;
     color: #999;