From 5aa165156994b1b8a601063fa0a1107d1893ea57 Mon Sep 17 00:00:00 2001
From: WXL <wl_5969728@163.com>
Date: 星期四, 19 三月 2026 16:48:13 +0800
Subject: [PATCH] 更新

---
 src/views/business/course/components/DonationConfirmStage.vue | 1038 +++++++++++++++++++++++++++++++++++++++++++++++----------
 1 files changed, 857 insertions(+), 181 deletions(-)

diff --git a/src/views/business/course/components/DonationConfirmStage.vue b/src/views/business/course/components/DonationConfirmStage.vue
index d608417..8f69cb6 100644
--- a/src/views/business/course/components/DonationConfirmStage.vue
+++ b/src/views/business/course/components/DonationConfirmStage.vue
@@ -1,217 +1,893 @@
 <template>
-  <base-stage :stage-data="stageData" :case-info="caseInfo">
-    <template #header>
-      <el-alert
-        :title="`鎹愮尞纭 - ${getStatusText()}`"
-        :type="getAlertType()"
-        :description="getAlertDescription()"
-        show-icon
-        :closable="false"
-      />
-    </template>
-
-    <el-row :gutter="20" style="margin-top: 20px;">
-      <el-col :span="8">
-        <el-card>
-          <div slot="header" class="card-header">
-            <span>纭淇℃伅姒傝</span>
-          </div>
-          <div class="confirm-overview">
-            <div class="overview-item">
-              <span class="label">纭鐘舵��:</span>
-              <el-tag :type="getStatusTag(confirmationDetails.status)">
-                {{ getStatusText(confirmationDetails.status) }}
-              </el-tag>
-            </div>
-            <div class="overview-item">
-              <span class="label">纭鏃堕棿:</span>
-              <span>{{ formatTime(confirmationDetails.confirmTime) }}</span>
-            </div>
-            <div class="overview-item">
-              <span class="label">纭鏂瑰紡:</span>
-              <span>{{ confirmationDetails.method }}</span>
-            </div>
-            <div class="overview-item">
-              <span class="label">鍗忚皟鍛�:</span>
-              <span>{{ confirmationDetails.coordinator }}</span>
-            </div>
-          </div>
-        </el-card>
-      </el-col>
-
-      <el-col :span="8">
-        <el-card>
-          <div slot="header" class="card-header">
-            <span>瀹跺睘鍚屾剰鎯呭喌</span>
-          </div>
-          <el-descriptions :column="1" size="small">
-            <el-descriptions-item label="涓昏瀹跺睘">
-              {{ familyConsent.mainRelative }}
-            </el-descriptions-item>
-            <el-descriptions-item label="鍚屾剰鐘舵��">
-              <el-tag :type="familyConsent.consented ? 'success' : 'warning'">
-                {{ familyConsent.consented ? '宸插悓鎰�' : '寰呯‘璁�' }}
-              </el-tag>
-            </el-descriptions-item>
-            <el-descriptions-item label="绛惧瓧鏃堕棿">
-              {{ formatTime(familyConsent.signTime) }}
-            </el-descriptions-item>
-            <el-descriptions-item label="鍏崇郴璇佹槑">
-              {{ familyConsent.relationshipProof }}
-            </el-descriptions-item>
-          </el-descriptions>
-        </el-card>
-      </el-col>
-
-      <el-col :span="8">
-        <el-card>
-          <div slot="header" class="card-header">
-            <span>娉曞緥鏂囦欢</span>
-          </div>
-          <div class="document-list">
-            <div v-for="doc in legalDocuments" :key="doc.name" class="document-item">
-              <div class="doc-info">
-                <i :class="doc.icon" style="color: #409EFF; margin-right: 8px;"></i>
-                <span>{{ doc.name }}</span>
-              </div>
-              <el-tag :type="doc.status === 'completed' ? 'success' : 'warning'" size="small">
-                {{ doc.status === 'completed' ? '宸茬缃�' : '寰呯缃�' }}
-              </el-tag>
-            </div>
-          </div>
-        </el-card>
-      </el-col>
-    </el-row>
-
-    <el-card style="margin-top: 20px;">
-      <div slot="header" class="card-header">
-        <span>鎹愮尞鎰忔効纭涔�</span>
+  <div class="confirmation-detail">
+    <el-card class="detail-card">
+      <!-- 鍩虹淇℃伅 -->
+      <div slot="header" class="clearfix">
+        <span class="detail-title">鎹愮尞纭鍩烘湰淇℃伅</span>
+        <el-button
+          type="success"
+          style="float: right;"
+          @click="handleSave"
+          :loading="saveLoading"
+        >
+          淇濆瓨纭淇℃伅
+        </el-button>
       </div>
-      <div class="consent-content">
-        <p>鏈汉/瀹跺睘纭锛屽湪鍏呭垎浜嗚В鍣ㄥ畼鎹愮尞鐨勭浉鍏充俊鎭悗锛岃嚜鎰垮悓鎰忚繘琛屽櫒瀹樻崘鐚��</p>
-        <el-divider />
-        <el-descriptions :column="2" border>
-          <el-descriptions-item label="鎹愮尞鑰呭鍚�">{{ caseInfo.donorName }}</el-descriptions-item>
-          <el-descriptions-item label="鎹愮尞鑰呰韩浠借瘉鍙�">{{ confirmationDetails.idNumber }}</el-descriptions-item>
-          <el-descriptions-item label="鎹愮尞鍣ㄥ畼绫诲瀷">{{ confirmationDetails.organs }}</el-descriptions-item>
-          <el-descriptions-item label="鎹愮尞鐢ㄩ��">{{ confirmationDetails.purpose }}</el-descriptions-item>
-          <el-descriptions-item label="绛惧瓧浜�">{{ familyConsent.mainRelative }}</el-descriptions-item>
-          <el-descriptions-item label="绛惧瓧鏃ユ湡">{{ formatTime(familyConsent.signTime) }}</el-descriptions-item>
-        </el-descriptions>
-      </div>
+
+      <el-form :model="form" ref="form" label-width="120px">
+        <el-row :gutter="20">
+          <el-col :span="8">
+            <el-form-item label="浣忛櫌鍙�" prop="caseNo">
+              <el-input v-model="form.caseNo" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="鎹愮尞鑰呭鍚�" prop="name">
+              <el-input v-model="form.name" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="鎬у埆" prop="sex">
+              <el-select v-model="form.sex" style="width: 100%">
+                <el-option label="鐢�" value="1" />
+                <el-option label="濂�" value="2" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row :gutter="20">
+          <el-col :span="8">
+            <el-form-item label="骞撮緞" prop="age">
+              <el-input v-model="form.age" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="鐤剧梾璇婃柇" prop="diagnosisname">
+              <el-input v-model="form.diagnosisname" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="鎵�鍦ㄥ尰鐤楁満鏋�" prop="treatmenthospitalname">
+              <el-input v-model="form.treatmenthospitalname" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row :gutter="20">
+          <el-col :span="8">
+            <el-form-item label="鍗忚皟鍛�1" prop="coordinatedusernameo">
+              <el-input v-model="form.coordinatedusernameo" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="鍗忚皟鍛�2" prop="coordinatedusernamet">
+              <el-input v-model="form.coordinatedusernamet" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="涓氬姟浜哄憳" prop="responsibleusername">
+              <el-input v-model="form.responsibleusername" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row :gutter="20">
+          <!-- <el-col :span="8">
+            <el-form-item label="纭鐘舵��" prop="relativeconfirmationsign">
+              <el-select
+                v-model="form.relativeconfirmationsign"
+                style="width: 100%"
+
+              >
+                <el-option label="鏈‘璁�" value="0" />
+                <el-option label="瀹跺睘纭" value="1" />
+                <el-option label="涓嶅悓鎰忔崘鐚�" value="2" />
+              </el-select>
+            </el-form-item>
+          </el-col> -->
+          <el-col :span="8">
+            <el-form-item label="绛惧瓧鏃堕棿" prop="signdate">
+              <el-date-picker
+                v-model="form.signdate"
+                type="datetime"
+                value-format="yyyy-MM-dd"
+                style="width: 100%"
+              />
+            </el-form-item>
+          </el-col>
+          <!-- <el-col :span="8">
+            <el-form-item label="琛�鍨�" prop="bloodtype">
+              <el-input v-model="form.bloodtype"  />
+            </el-form-item>
+          </el-col> -->
+        </el-row>
+
+        <!-- <el-row :gutter="20">
+          <el-col :span="8">
+            <el-form-item label="璇佷欢鍙风爜" prop="idcardno">
+              <el-input v-model="form.idcardno"  />
+            </el-form-item>
+          </el-col>
+        </el-row> -->
+
+        <!-- 浜插睘淇℃伅 -->
+        <!-- 浜插睘淇℃伅 -->
+        <el-divider content-position="left">浜插睘纭淇℃伅</el-divider>
+
+        <el-row :gutter="20">
+          <el-col :span="6">
+            <el-form-item label="浜插睘濮撳悕" prop="relativeconfirmationsignname">
+              <el-input
+                v-model="form.relativeconfirmationsignname"
+                placeholder="璇疯緭鍏ヤ翰灞炲鍚�"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="涓庢崘璧犺�呭叧绯�" prop="signfamilyrelations">
+              <el-select
+                v-model="form.signfamilyrelations"
+                placeholder="璇烽�夋嫨涓庢崘璧犺�呭叧绯�"
+              >
+                <el-option
+                  v-for="dict in dict.type.sys_FamilyRelation || []"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="浜插睘韬唤璇�" prop="relativeidcardno">
+              <el-input
+                v-model="form.relativeidcardno"
+                placeholder="璇疯緭鍏ヤ翰灞炶瘉浠跺彿鐮�"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="浜插睘鐢佃瘽" prop="relativephone">
+              <el-input
+                v-model="form.relativephone"
+                placeholder="璇疯緭鍏ヤ翰灞炶仈绯荤數璇�"
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row>
+          <el-form-item label-width="100px" label="鎹愮尞鍐冲畾">
+            <el-checkbox-group v-model="organdecision">
+              <el-checkbox
+                v-for="item in organselection"
+                :key="item"
+                :label="item"
+                >{{ item }}
+              </el-checkbox>
+            </el-checkbox-group>
+            <el-input
+              v-if="organdecision.includes('鍏朵粬')"
+              v-model="organdecisionOther"
+              placeholder="璇疯緭鍏ュ叾浠栨崘鐚喅瀹氱殑鍏蜂綋鍐呭"
+              style="margin-top: 10px; width: 300px;"
+            ></el-input>
+          </el-form-item>
+        </el-row>
+
+        <el-form-item label="瀹跺睘鎰忚澶囨敞" prop="relativeRemark">
+          <el-input
+            type="textarea"
+            :rows="3"
+            v-model="form.relativeRemark"
+            placeholder="璁板綍瀹跺睘鐨勬剰瑙佸拰娌熼�氭儏鍐�"
+          />
+        </el-form-item>
+      </el-form>
     </el-card>
-  </base-stage>
+
+    <!-- 闄勪欢淇℃伅 - 鎸夌被鍨嬪垎绫� -->
+    <el-card class="attachment-card">
+      <div slot="header" class="clearfix">
+        <span class="detail-title">鐩稿叧闄勪欢涓婁紶</span>
+      </div>
+
+      <!-- 闄勪欢绫诲瀷閫夐」鍗� -->
+      <el-tabs v-model="activeAttachmentType" type="card">
+        <el-tab-pane
+          v-for="type in attachmentTypes"
+          :key="type.value"
+          :label="type.label"
+          :name="type.value"
+        >
+          <div class="attachment-section">
+            <div class="attachment-header">
+              <span class="upload-title">{{ type.label }}</span>
+              <el-tooltip content="鐐瑰嚮涓婁紶璇ョ被鍨嬮檮浠�" placement="top">
+                <el-button
+                  size="mini"
+                  type="primary"
+                  icon="el-icon-plus"
+                  @click="openUploadDialog(type.value)"
+                >
+                  娣诲姞闄勪欢
+                </el-button>
+              </el-tooltip>
+            </div>
+
+            <!-- 褰撳墠绫诲瀷鐨勯檮浠跺垪琛� -->
+            <div class="attachment-list">
+              <el-table
+                :data="getAttachmentsByType(type.value)"
+                size="small"
+                v-loading="attachmentLoading"
+                style="width: 100%;"
+              >
+                <el-table-column label="鏂囦欢鍚�" min-width="200">
+                  <template slot-scope="scope">
+                    <i
+                      class="el-icon-document"
+                      style="color: #409EFF; margin-right: 8px;"
+                    ></i>
+                    <span class="file-name">{{ scope.row.fileName }}</span>
+                  </template>
+                </el-table-column>
+
+                <el-table-column label="鏂囦欢绫诲瀷" width="100" align="center">
+                  <template slot-scope="scope">
+                    <el-tag size="small">{{
+                      getFileType(scope.row.fileName)
+                    }}</el-tag>
+                  </template>
+                </el-table-column>
+
+                <el-table-column label="鏂囦欢澶у皬" width="100" align="center">
+                  <template slot-scope="scope">
+                    <span>{{ formatFileSize(scope.row.fileSize) }}</span>
+                  </template>
+                </el-table-column>
+
+                <el-table-column label="涓婁紶鏃堕棿" width="160" align="center">
+                  <template slot-scope="scope">
+                    <span>{{ formatDateTime(scope.row.uploadTime) }}</span>
+                  </template>
+                </el-table-column>
+
+                <el-table-column label="鎿嶄綔" width="150" align="center">
+                  <template slot-scope="scope">
+                    <el-button
+                      size="mini"
+                      type="primary"
+                      @click="handlePreview(scope.row)"
+                    >
+                      棰勮
+                    </el-button>
+                    <el-button
+                      size="mini"
+                      type="danger"
+                      @click="handleRemoveAttachment(type.value, scope.$index)"
+                    >
+                      鍒犻櫎
+                    </el-button>
+                  </template>
+                </el-table-column>
+              </el-table>
+
+              <!-- 绌虹姸鎬佹彁绀� -->
+              <div
+                v-if="getAttachmentsByType(type.value).length === 0"
+                class="empty-attachment"
+              >
+                <el-empty
+                  :description="`鏆傛棤${type.label}闄勪欢`"
+                  :image-size="80"
+                ></el-empty>
+              </div>
+            </div>
+          </div>
+        </el-tab-pane>
+      </el-tabs>
+    </el-card>
+
+    <!-- 涓婁紶瀵硅瘽妗� -->
+    <el-dialog
+      :title="`涓婁紶${getCurrentTypeLabel}闄勪欢`"
+      :visible.sync="uploadDialogVisible"
+      width="500px"
+      :close-on-click-modal="false"
+    >
+      <el-upload
+        ref="uploadRef"
+        class="upload-demo"
+        drag
+        action="#"
+        multiple
+        :file-list="tempFileList"
+        :before-upload="beforeUpload"
+        :on-change="handleFileChange"
+        :on-remove="handleTempRemove"
+        :auto-upload="false"
+        :http-request="handleHttpRequest"
+      >
+        <i class="el-icon-upload"></i>
+        <div class="el-upload__text">灏嗘枃浠舵嫋鍒版澶勶紝鎴�<em>鐐瑰嚮涓婁紶</em></div>
+        <div class="el-upload__tip" slot="tip">
+          鏀寔涓婁紶pdf銆乯pg銆乸ng銆乨oc銆乨ocx鏍煎紡鏂囦欢锛屽崟涓枃浠朵笉瓒呰繃10MB
+        </div>
+      </el-upload>
+
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="uploadDialogVisible = false">鍙栨秷</el-button>
+        <el-button
+          type="primary"
+          @click="submitUpload"
+          :loading="uploadLoading"
+          :disabled="tempFileList.length === 0"
+        >
+          纭涓婁紶
+        </el-button>
+      </span>
+    </el-dialog>
+
+    <!-- 鏂囦欢棰勮寮圭獥 -->
+    <FilePreviewDialog
+      :visible="previewVisible"
+      :file="currentPreviewFile"
+      @close="previewVisible = false"
+      @download="handleDownload"
+    />
+  </div>
 </template>
 
 <script>
-import BaseStage from './BaseStage.vue';
+import { relativesList, relativesEdit } from "@/api/businessApi";
+import FilePreviewDialog from "@/components/FilePreviewDialog";
 
 export default {
-  name: 'DonationConfirmStage',
-  components: { BaseStage },
+  name: "ConfirmationDetail",
+  components: {
+    FilePreviewDialog
+  },
   props: {
-    stageData: {
-      type: Object,
-      default: () => ({})
-    },
-    caseInfo: {
-      type: Object,
-      default: () => ({})
+    infoid: {
+      type: String,
+      default: true
     }
   },
+  dicts: ["sys_FamilyRelation"],
   data() {
     return {
-      confirmationDetails: {
-        status: 'completed',
-        confirmTime: '2023-12-03 11:00:00',
-        method: '瀹跺睘涔﹂潰鍚屾剰',
-        coordinator: '璧靛崗璋冨憳',
-        idNumber: '110101199001011234',
-        organs: '蹇冭剰銆佽倽鑴忋�佽偩鑴忋�佽鑶�',
-        purpose: '涓村簥绉绘'
+      // 鏄惁缂栬緫妯″紡
+      isEdit: false,
+      // 琛ㄥ崟鏁版嵁
+      form: {
+        id: undefined,
+        infoid: undefined,
+        caseNo: "",
+        name: "",
+        sex: "",
+        age: "",
+        diagnosisname: "",
+        treatmenthospitalname: "",
+        coordinatedusernameo: "",
+        coordinatedusernamet: "",
+        responsibleusername: "",
+        relativeconfirmationsign: "0",
+        signdate: "",
+        relativeconfirmationsignname: "",
+        signfamilyrelations: "",
+        relativeidcardno: "",
+        relativephone: "",
+        relativeRemark: "",
+        assessannex: "" // JSON瀛楃涓插瓨鍌ㄦ墍鏈夐檮浠�
       },
-      familyConsent: {
-        mainRelative: '寮犱笁鐖朵翰',
-        consented: true,
-        signTime: '2023-12-03 10:45:00',
-        relationshipProof: '鎴峰彛鏈叧绯昏瘉鏄�'
-      },
-      legalDocuments: [
-        { name: '鍣ㄥ畼鎹愮尞鍚屾剰涔�', icon: 'el-icon-document', status: 'completed' },
-        { name: '瀹跺睘鍏崇郴璇佹槑', icon: 'el-icon-document', status: 'completed' },
-        { name: '鍖荤枟鍏嶈矗澹版槑', icon: 'el-icon-document', status: 'completed' },
-        { name: '闅愮淇濇姢鍗忚', icon: 'el-icon-document', status: 'completed' }
-      ]
+      organdecision: [],
+      organdecisionOther: "",
+      organselection: [
+        "鑲濊剰",
+        "鍙岃偩",
+        "宸﹁偩",
+        "鍙宠偩",
+        "蹇冭剰",
+        "鑲鸿剰",
+        "鑳拌吅",
+        "灏忚偁",
+        "鍙岀溂缁勭粐",
+        "閬椾綋",
+        "鍏朵粬"
+      ],
+      // 鍔犺浇鐘舵��
+      loading: false,
+      saveLoading: false,
+      // 闄勪欢鐩稿叧鏁版嵁
+      activeAttachmentType: "1",
+      attachmentLoading: false,
+      uploadDialogVisible: false,
+      uploadLoading: false,
+      tempFileList: [],
+      currentUploadType: "",
+      // 棰勮鐩稿叧
+      previewVisible: false,
+      currentPreviewFile: null,
+
+      // 闄勪欢绫诲瀷瀹氫箟
+      attachmentTypes: [
+        { value: "1", label: "浜轰綋鍣ㄥ畼娼滃湪鎹愮尞鑰呯櫥璁拌〃" },
+        { value: "2", label: "浜轰綋鍣ㄥ畼鎹愮尞浜插睘纭鐧昏琛�" },
+        { value: "3", label: "鎹愮尞鑰呭強鐩寸郴浜插睘韬唤璇併�佹埛鍙g翱鐩稿叧璇佹槑" },
+        { value: "4", label: "鍏皯韬晠鍚庝汉浣撳櫒瀹橈紙瑙掕啘锛夐仐浣撴崘鐚憡鐭ヤ功" },
+        { value: "5", label: "鑴戞浜″垽瀹氱煡鎯呭悓鎰忎功" },
+        { value: "6", label: "蹇冩浜″垽瀹氱煡鎯呭悓鎰忎功" }
+      ],
+
+      // 闄勪欢鏁版嵁缁撴瀯 - 鎸夌被鍨嬪垎寮�瀛樺偍
+      attachmentData: {
+        "1": [], // 绫诲瀷1鐨勯檮浠跺垪琛�
+        "2": [],
+        "3": [],
+        "4": [],
+        "5": [],
+        "6": []
+      }
     };
   },
+  computed: {
+    getCurrentTypeLabel() {
+      const type = this.attachmentTypes.find(
+        t => t.value === this.currentUploadType
+      );
+      return type ? type.label : "";
+    }
+  },
+  created() {
+    this.isEdit = this.$route.query.confirm === "true";
+    console.log(this.infoid, "this.infoid");
+
+    if (this.infoid) {
+      console.log(1);
+
+      this.getDetail(this.infoid);
+    }
+  },
   methods: {
-    getStatusText() {
-      const status = this.stageData.status;
-      return status === 'completed' ? '宸插畬鎴�' :
-             status === 'in_progress' ? '杩涜涓�' : '鏈紑濮�';
+    // 鑾峰彇璇︽儏
+    async getDetail(infoid) {
+      this.loading = true;
+      try {
+        const response = await relativesList({ infoid });
+        console.log(2);
+
+        if (response.code === 200) {
+          console.log(3);
+          this.handleDetailData(response);
+        } else {
+          this.$message.error("鑾峰彇璇︽儏澶辫触锛�" + (response.msg || "鏈煡閿欒"));
+        }
+      } catch (error) {
+        console.error("鑾峰彇鎹愮尞纭璇︽儏澶辫触:", error);
+        this.$message.error("鑾峰彇璇︽儏澶辫触");
+      } finally {
+        this.loading = false;
+      }
     },
-    getAlertType() {
-      const status = this.stageData.status;
-      return status === 'completed' ? 'success' :
-             status === 'in_progress' ? 'warning' : 'info';
-    },
-    getAlertDescription() {
-      const status = this.stageData.status;
-      return status === 'completed' ? '鎹愮尞纭娴佺▼宸插畬鎴愶紝鎵�鏈夋硶寰嬫枃浠跺凡绛剧讲' :
-             status === 'in_progress' ? '鎹愮尞纭娴佺▼姝e湪杩涜涓�' : '绛夊緟寮�濮嬫崘鐚‘璁ゆ祦绋�';
-    },
-    getStatusTag(status) {
-      const map = {
-        'completed': 'success',
-        'in_progress': 'warning',
-        'pending': 'info'
+
+    // 澶勭悊璇︽儏鏁版嵁
+    handleDetailData(response) {
+      let detailData = null;
+
+      // 鏍规嵁鎺ュ彛瀹為檯杩斿洖鐨勬暟鎹粨鏋勮繘琛岃皟鏁�
+      if (response.data) {
+        if (Array.isArray(response.data)) {
+          detailData = response.data[0] || {};
+        } else if (response.data.rows && Array.isArray(response.data.rows)) {
+          detailData = response.data.rows[0] || {};
+        } else if (Array.isArray(response.data.list)) {
+          detailData = response.data.list[0] || {};
+        } else {
+          detailData = response.data;
+        }
+      } else {
+        detailData = response;
+      }
+
+      // 鏄犲皠瀛楁鍒拌〃鍗�
+      this.form = {
+        ...this.form,
+        id: detailData.id || this.$route.query.id,
+        infoid: detailData.infoid || this.infoid,
+        caseNo: detailData.caseNo || "",
+        name: detailData.name || "",
+        sex: detailData.sex || "",
+        age: detailData.age || "",
+        diagnosisname: detailData.diagnosisname || "",
+        treatmenthospitalname: detailData.treatmenthospitalname || "",
+        coordinatedusernameo: detailData.coordinatedusernameo || "",
+        coordinatedusernamet: detailData.coordinatedusernamet || "",
+        responsibleusername: detailData.responsibleusername || "",
+        relativeconfirmationsign: detailData.relativeconfirmationsign || "0",
+        signdate: detailData.signdate,
+        relativeconfirmationsignname:
+          detailData.relativeconfirmationsignname || "",
+        signfamilyrelations: detailData.signfamilyrelations || "",
+        relativeidcardno: detailData.relativeidcardno || "",
+        relativephone: detailData.relativephone || "",
+        relativeRemark: detailData.relativeRemark || "",
+        assessannex: detailData.assessannex || ""
       };
-      return map[status] || 'info';
+
+      // 澶勭悊鎹愮尞鍐冲畾鏁版嵁
+      if (detailData.organdecision) {
+        this.organdecision = Array.isArray(detailData.organdecision)
+          ? detailData.organdecision
+          : detailData.organdecision.split(",");
+      }
+      console.log(this.organdecision, "this.organdecision");
+
+      // 澶勭悊闄勪欢鏁版嵁 - 浠巃ssessannex瀛楁瑙f瀽JSON骞舵寜绫诲瀷鍒嗙被
+      this.processAssessannexData();
+    },
+
+    // 澶勭悊assessannex瀛楁鏁版嵁骞舵寜绫诲瀷鍒嗙被
+    processAssessannexData() {
+      if (this.form.assessannex) {
+        try {
+          const annexData =
+            typeof this.form.assessannex === "string"
+              ? JSON.parse(this.form.assessannex)
+              : this.form.assessannex;
+
+          // 娓呯┖鐜版湁鏁版嵁
+          Object.keys(this.attachmentData).forEach(key => {
+            this.attachmentData[key] = [];
+          });
+
+          // 鎸夌被鍨嬪垎绫诲瓨鍌�
+          if (Array.isArray(annexData)) {
+            annexData.forEach(attachment => {
+              const type = attachment.type || "1"; // 榛樿鍒扮涓�绉嶇被鍨�
+              if (this.attachmentData[type]) {
+                this.attachmentData[type].push(attachment);
+              }
+            });
+          }
+        } catch (error) {
+          console.warn("assessannex鏁版嵁瑙f瀽澶辫触:", error);
+        }
+      }
+    },
+
+    // 鏍规嵁绫诲瀷鑾峰彇闄勪欢鍒楄〃
+    getAttachmentsByType(type) {
+      return this.attachmentData[type] || [];
+    },
+
+    // 鎵撳紑涓婁紶瀵硅瘽妗�
+    openUploadDialog(type) {
+      this.currentUploadType = type;
+      this.tempFileList = [];
+      this.uploadDialogVisible = true;
+      this.$nextTick(() => {
+        if (this.$refs.uploadRef) {
+          this.$refs.uploadRef.clearFiles();
+        }
+      });
+    },
+
+    // 涓婁紶鍓嶆牎楠孾7](@ref)
+    beforeUpload(file) {
+      const allowedTypes = [
+        "application/pdf",
+        "image/jpeg",
+        "image/png",
+        "application/msword",
+        "application/vnd.openxmlformats-officedocument.wordprocessingml.document"
+      ];
+
+      const maxSize = 10 * 1024 * 1024; // 10MB
+
+      // 鏍¢獙鏂囦欢绫诲瀷
+      const isTypeOk =
+        allowedTypes.includes(file.type) ||
+        file.name.endsWith(".pdf") ||
+        file.name.endsWith(".jpg") ||
+        file.name.endsWith(".jpeg") ||
+        file.name.endsWith(".png") ||
+        file.name.endsWith(".doc") ||
+        file.name.endsWith(".docx");
+
+      if (!isTypeOk) {
+        this.$message.error(
+          "鏂囦欢鏍煎紡涓嶆敮鎸侊紝璇蜂笂浼爌df銆乯pg銆乸ng銆乨oc鎴杁ocx鏍煎紡鏂囦欢"
+        );
+        return false;
+      }
+
+      // 鏍¢獙鏂囦欢澶у皬
+      if (file.size > maxSize) {
+        this.$message.error("鏂囦欢澶у皬涓嶈兘瓒呰繃10MB");
+        return false;
+      }
+
+      return true;
+    },
+
+    // 鏂囦欢閫夋嫨鍙樺寲
+    handleFileChange(file, fileList) {
+      this.tempFileList = fileList;
+    },
+
+    // 绉婚櫎涓存椂鏂囦欢
+    handleTempRemove(file, fileList) {
+      this.tempFileList = fileList;
+    },
+
+    // 鑷畾涔変笂浼犺姹�
+    handleHttpRequest(options) {
+      return new Promise((resolve, reject) => {
+        this.uploadLoading = true;
+
+        // 妯℃嫙涓婁紶杩囩▼
+        setTimeout(() => {
+          const newAttachment = {
+            id: Date.now(),
+            fileName: options.file.name,
+            fileUrl: URL.createObjectURL(options.file),
+            fileSize: options.file.size,
+            fileType: this.getFileExtension(options.file.name),
+            type: this.currentUploadType, // 璁板綍闄勪欢绫诲瀷
+            uploadTime: new Date().toISOString(),
+            uploader: "褰撳墠鐢ㄦ埛"
+          };
+
+          // 娣诲姞鍒板搴旂被鍨嬬殑闄勪欢鍒楄〃
+          if (this.attachmentData[this.currentUploadType]) {
+            this.attachmentData[this.currentUploadType].push(newAttachment);
+          }
+
+          this.uploadLoading = false;
+          this.updateAssessannexField(); // 鏇存柊瀛樺偍瀛楁
+          resolve({ code: 200, data: newAttachment });
+        }, 1500);
+      });
+    },
+
+    // 鎻愪氦涓婁紶
+    async submitUpload() {
+      if (this.tempFileList.length === 0) {
+        this.$message.warning("璇峰厛閫夋嫨瑕佷笂浼犵殑鏂囦欢");
+        return;
+      }
+
+      try {
+        for (const file of this.tempFileList) {
+          await this.$refs.uploadRef.submit();
+        }
+
+        this.$message.success("鏂囦欢涓婁紶鎴愬姛");
+        this.uploadDialogVisible = false;
+        this.tempFileList = [];
+      } catch (error) {
+        this.$message.error("鏂囦欢涓婁紶澶辫触");
+        console.error("涓婁紶澶辫触:", error);
+      }
+    },
+
+    // 鍒犻櫎闄勪欢
+    handleRemoveAttachment(type, index) {
+      this.$confirm("纭畾瑕佸垹闄よ繖涓檮浠跺悧锛�", "鎻愮ず", {
+        confirmButtonText: "纭畾",
+        cancelButtonText: "鍙栨秷",
+        type: "warning"
+      })
+        .then(() => {
+          if (this.attachmentData[type] && this.attachmentData[type][index]) {
+            this.attachmentData[type].splice(index, 1);
+            this.$message.success("闄勪欢鍒犻櫎鎴愬姛");
+            this.updateAssessannexField(); // 鏇存柊瀛樺偍瀛楁
+          }
+        })
+        .catch(() => {});
+    },
+
+    // 鏇存柊assessannex瀛樺偍瀛楁
+    updateAssessannexField() {
+      // 灏嗘墍鏈夌被鍨嬬殑闄勪欢鍚堝苟涓轰竴涓暟缁�
+      const allAttachments = [];
+      Object.values(this.attachmentData).forEach(attachments => {
+        allAttachments.push(...attachments);
+      });
+
+      // 鏇存柊鍒拌〃鍗曞瓧娈�
+      this.form.assessannex = JSON.stringify(allAttachments);
+    },
+
+    // 鏂囦欢棰勮
+    handlePreview(file) {
+      this.currentPreviewFile = {
+        fileName: file.fileName,
+        fileUrl: file.fileUrl,
+        fileType: this.getFileType(file.fileName)
+      };
+      this.previewVisible = true;
+    },
+
+    // 鏂囦欢涓嬭浇
+    handleDownload(file) {
+      const fileUrl = file.fileUrl;
+      const fileName = file.fileName;
+
+      if (fileUrl) {
+        const link = document.createElement("a");
+        link.href = fileUrl;
+        link.download = fileName;
+        link.style.display = "none";
+        document.body.appendChild(link);
+        link.click();
+        document.body.removeChild(link);
+        this.$message.success("寮�濮嬩笅杞芥枃浠�");
+      } else {
+        this.$message.warning("鏂囦欢璺緞涓嶅瓨鍦紝鏃犳硶涓嬭浇");
+      }
+    },
+
+    // 鑾峰彇鏂囦欢绫诲瀷
+    getFileType(fileName) {
+      if (!fileName) return "other";
+      const extension = this.getFileExtension(fileName);
+      const imageTypes = ["jpg", "jpeg", "png"];
+      const pdfTypes = ["pdf"];
+      const officeTypes = ["doc", "docx"];
+
+      if (imageTypes.includes(extension)) return "image";
+      if (pdfTypes.includes(extension)) return "pdf";
+      if (officeTypes.includes(extension)) return "office";
+      return "other";
+    },
+
+    // 鑾峰彇鏂囦欢鎵╁睍鍚�
+    getFileExtension(filename) {
+      return filename
+        .split(".")
+        .pop()
+        .toLowerCase();
+    },
+
+    // 鏂囦欢澶у皬鏍煎紡鍖�
+    formatFileSize(size) {
+      if (!size) return "0 B";
+      const k = 1024;
+      const sizes = ["B", "KB", "MB", "GB"];
+      const i = Math.floor(Math.log(size) / Math.log(k));
+      return parseFloat((size / Math.pow(k, i)).toFixed(2)) + " " + sizes[i];
+    },
+
+    // 鏃ユ湡鏃堕棿鏍煎紡鍖�
+    formatDateTime(dateTime) {
+      if (!dateTime) return "";
+      try {
+        const date = new Date(dateTime);
+        if (isNaN(date.getTime())) return dateTime;
+
+        const year = date.getFullYear();
+        const month = String(date.getMonth() + 1).padStart(2, "0");
+        const day = String(date.getDate()).padStart(2, "0");
+        const hours = String(date.getHours()).padStart(2, "0");
+        const minutes = String(date.getMinutes()).padStart(2, "0");
+
+        return `${year}-${month}-${day} ${hours}:${minutes}`;
+      } catch (error) {
+        return dateTime;
+      }
+    },
+
+    // 鑾峰彇褰撳墠鏃堕棿
+    getCurrentTime() {
+      const now = new Date();
+      return `${now.getFullYear()}-${(now.getMonth() + 1)
+        .toString()
+        .padStart(2, "0")}-${now
+        .getDate()
+        .toString()
+        .padStart(2, "0")} ${now
+        .getHours()
+        .toString()
+        .padStart(2, "0")}:${now
+        .getMinutes()
+        .toString()
+        .padStart(2, "0")}:${now
+        .getSeconds()
+        .toString()
+        .padStart(2, "0")}`;
+    },
+
+    // 淇濆瓨纭淇℃伅
+    async handleSave() {
+      try {
+        await this.$refs.form.validate();
+        this.saveLoading = true;
+
+        // 纭繚闄勪欢鏁版嵁鏄渶鏂扮殑
+        this.updateAssessannexField();
+
+        const saveData = {
+          ...this.form,
+          organdecision: this.organdecision.join(","),
+          organdecisionOther: this.organdecisionOther
+          // assessannex瀛楁宸插湪updateAssessannexField涓洿鏂�
+        };
+
+        const response = await relativesEdit(saveData);
+
+        if (response.code === 200) {
+          this.$message.success("淇濆瓨鎴愬姛");
+          this.$router.push("/case/affirm");
+        } else {
+          this.$message.error("淇濆瓨澶辫触锛�" + (response.msg || "鏈煡閿欒"));
+        }
+      } catch (error) {
+        if (error !== "cancel") {
+          console.error("淇濆瓨澶辫触:", error);
+          this.$message.error("淇濆瓨澶辫触");
+        }
+      } finally {
+        this.saveLoading = false;
+      }
     }
   }
 };
 </script>
 
 <style scoped>
-.confirm-overview {
-  padding: 10px 0;
+.confirmation-detail {
+  padding: 20px;
 }
 
-.overview-item {
+.detail-card {
+  margin-bottom: 20px;
+}
+
+.attachment-card {
+  margin-bottom: 20px;
+}
+
+.detail-title {
+  font-size: 16px;
+  font-weight: bold;
+  margin-right: 20px;
+}
+
+.attachment-section {
+  padding: 15px;
+}
+
+.attachment-header {
   display: flex;
   justify-content: space-between;
   align-items: center;
   margin-bottom: 15px;
-  padding: 8px 0;
-  border-bottom: 1px solid #f0f0f0;
+  padding-bottom: 10px;
+  border-bottom: 1px solid #ebeef5;
 }
 
-.overview-item .label {
+.upload-title {
+  font-size: 14px;
+  font-weight: 600;
+  color: #303133;
+}
+
+.attachment-list {
+  margin-top: 15px;
+}
+
+.empty-attachment {
+  text-align: center;
+  padding: 40px 0;
+  color: #909399;
+}
+
+.file-name {
+  font-size: 13px;
   color: #606266;
-  font-weight: 500;
-}
-
-.document-list {
-  padding: 10px 0;
-}
-
-.document-item {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 12px;
-  padding: 8px 12px;
-  border: 1px solid #e4e7ed;
-  border-radius: 4px;
-}
-
-.doc-info {
-  display: flex;
-  align-items: center;
-}
-
-.consent-content {
-  padding: 20px;
-  line-height: 1.6;
 }
 </style>

--
Gitblit v1.9.3