feat(patient-h5): 接入签署令牌与签名上传

patient-h5/src/views/signer/SignerView.vue

@@ -3,7 +3,7 @@ import { ref } from 'vue'
 import { useRouter } from 'vue-router'
 
 import SignatureCanvas from '@/components/SignatureCanvas.vue'
-import { signingState } from '@/composables/useSignFlow'
+import { signingState, submitRealSignature } from '@/composables/useSignFlow'
 import { relationOptions, type SignerRelation } from '@/types/signing'
 
 interface SignatureCanvasExpose {
@@ -15,9 +15,20 @@ const router = useRouter()
 const signerName = ref('')
 const relation = ref<SignerRelation | ''>('')
 const errorMessage = ref('')
+const signatureDataUrl = ref('')
+const submitting = ref(false)
 const signatureCanvas = ref<SignatureCanvasExpose | null>(null)
 
-function submitSigning() {
+function dataUrlToBlob(dataUrl: string) {
+  const [header, encoded] = dataUrl.split(',')
+  const mimeType = header?.match(/data:(.*?);base64/)?.[1] ?? 'image/png'
+  const binary = atob(encoded ?? '')
+  const bytes = Uint8Array.from(binary, (character) => character.charCodeAt(0))
+
+  return new Blob([bytes], { type: mimeType })
+}
+
+async function submitSigning() {
   const trimmedName = signerName.value.trim()
   if (!trimmedName) {
     errorMessage.value = '请输入实际签署人姓名。'
@@ -32,8 +43,39 @@ function submitSigning() {
     return
   }
 
+  const selectedRelation = relation.value
+
+  if (!selectedRelation) {
+    return
+  }
+
+  if (signingState.mode === 'real') {
+    if (!signatureDataUrl.value) {
+      errorMessage.value = '未读取到签名图片，请重新签名。'
+      return
+    }
+
+    submitting.value = true
+    errorMessage.value = ''
+
+    try {
+      await submitRealSignature({
+        file: dataUrlToBlob(signatureDataUrl.value),
+        signerName: trimmedName,
+        relation: selectedRelation,
+        consentAccepted: signingState.consentAccepted,
+      })
+      await router.push('/result')
+    } catch (error) {
+      errorMessage.value = error instanceof Error ? error.message : '签署提交失败，请稍后重试。'
+    } finally {
+      submitting.value = false
+    }
+    return
+  }
+
   signingState.signerName = trimmedName
-  signingState.relation = relation.value
+  signingState.relation = selectedRelation
   signingState.signatureCaptured = true
   signingState.submittedAt = new Date().toLocaleString('zh-CN')
   void router.push('/result')
@@ -69,10 +111,17 @@ function submitSigning() {
       </select>
     </section>
 
-    <SignatureCanvas ref="signatureCanvas" />
+    <SignatureCanvas ref="signatureCanvas" @update:data-url="signatureDataUrl = $event" />
 
     <p v-if="errorMessage" class="form-error">{{ errorMessage }}</p>
-    <button class="mobile-primary-button" type="button" @click="submitSigning">确认提交签署</button>
+    <button
+      class="mobile-primary-button"
+      type="button"
+      :disabled="submitting"
+      @click="submitSigning"
+    >
+      {{ submitting ? '提交中…' : '确认提交签署' }}
+    </button>
     <button class="mobile-text-button" type="button" @click="router.back()">返回修改</button>
   </main>
 </template>