各表单布局调整

WXL

4 天以前 c4599aa279fd2f90b741608392e056fbae2282d5

 src/views/business/course/components/OrganProcurementStage.vue

@@ -1,5 +1,6 @@
<template>
  <div class="organ-procurement-detail">
    <!-- <case-basic-info :case-id="caseId" :show-attachment="true":column="3" /> -->

    <!-- 基本信息 -->
    <el-card class="detail-card">
@@ -7,198 +8,32 @@
        <span class="detail-title">器官获取基本信息</span>
      </div>

      <el-form :model="form" ref="form" :rules="rules" label-width="120px">
        <!-- 手术相关信息 -->
        <el-divider content-position="left">手术信息</el-divider>
      <el-descriptions title="手术信息" :column="descriptionColumn" border size="small">
        <el-descriptions-item label="手术医生">{{ form.operationdoctor || '-' }}</el-descriptions-item>
        <el-descriptions-item label="手术开始时间">{{ form.operationbegtime || '-' }}</el-descriptions-item>
        <el-descriptions-item label="手术结束时间">{{ form.operationendtime || '-' }}</el-descriptions-item>
        <el-descriptions-item label="腹主动脉插管时间">{{ form.abdominalaortacannulatime || '-' }}</el-descriptions-item>
        <el-descriptions-item label="腹主动脉灌注时间">{{ form.abdominalaortaperfusiontime || '-' }}</el-descriptions-item>
        <el-descriptions-item label="门静脉插管时间">{{ form.portalveincannulatime || '-' }}</el-descriptions-item>
        <el-descriptions-item label="门静脉灌注时间">{{ form.portalveinperfusiontime || '-' }}</el-descriptions-item>
      </el-descriptions>

        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="手术医生" prop="operationdoctor">
              <el-input v-model="form.operationdoctor" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="手术开始时间" prop="operationbegtime">
              <el-date-picker
                v-model="form.operationbegtime"
                type="datetime"
                value-format="yyyy-MM-dd HH:mm:ss"
                style="width: 100%"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="手术结束时间" prop="operationendtime">
              <el-date-picker
                v-model="form.operationendtime"
                type="datetime"
                value-format="yyyy-MM-dd HH:mm:ss"
                style="width: 100%"
              />
            </el-form-item>
          </el-col>
        </el-row>
      <el-descriptions title="协调员信息" :column="descriptionColumn" border size="small">
        <el-descriptions-item label="进手术室时间">{{ form.coordinatorInOperating || '-' }}</el-descriptions-item>
        <el-descriptions-item label="出手术室时间">{{ form.coordinatorOutOperating || '-' }}</el-descriptions-item>
        <el-descriptions-item label="是否默哀缅怀">{{ form.isspendremember === 1 ? '是' : form.isspendremember === 0 ? '否' : '-' }}</el-descriptions-item>
        <el-descriptions-item label="恢复遗体仪容">{{ form.isrestoreremains === 1 ? '是' : form.isrestoreremains === 0 ? '否' : '-' }}</el-descriptions-item>
      </el-descriptions>

        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item
              label="腹主动脉插管时间"
              prop="abdominalaortacannulatime"
            >
              <el-date-picker
                v-model="form.abdominalaortacannulatime"
                type="datetime"
                value-format="yyyy-MM-dd HH:mm:ss"
                style="width: 100%"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item
              label="腹主动脉灌注时间"
              prop="abdominalaortaperfusiontime"
            >
              <el-date-picker
                v-model="form.abdominalaortaperfusiontime"
                type="datetime"
                value-format="yyyy-MM-dd HH:mm:ss"
                style="width: 100%"
              />
            </el-form-item>
          </el-col>
        </el-row>
      <el-descriptions title="负责人信息" :column="descriptionColumn" border size="small">
        <el-descriptions-item label="负责人姓名">{{ form.responsibleusername || '-' }}</el-descriptions-item>
        <el-descriptions-item label="协调员一">{{ form.coordinatedusernameo || '-' }}</el-descriptions-item>
        <el-descriptions-item label="协调员二">{{ form.coordinatedusernamet || '-' }}</el-descriptions-item>
      </el-descriptions>

        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="门静脉插管时间" prop="portalveincannulatime">
              <el-date-picker
                v-model="form.portalveincannulatime"
                type="datetime"
                value-format="yyyy-MM-dd HH:mm:ss"
                style="width: 100%"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="门静脉灌注时间" prop="portalveinperfusiontime">
              <el-date-picker
                v-model="form.portalveinperfusiontime"
                type="datetime"
                value-format="yyyy-MM-dd HH:mm:ss"
                style="width: 100%"
              />
            </el-form-item>
          </el-col>
        </el-row>

        <!-- 协调员信息 -->
        <el-divider content-position="left">协调员信息</el-divider>

        <el-row :gutter="20">
          <!-- <el-col :span="8">
            <el-form-item label="协调员姓名" prop="coordinatorName">
              <el-input v-model="form.coordinatorName" />
            </el-form-item>
          </el-col> -->
          <el-col :span="8">
            <el-form-item label="进手术室时间" prop="coordinatorInOperating">
              <el-date-picker
                v-model="form.coordinatorInOperating"
                type="datetime"
                value-format="yyyy-MM-dd HH:mm:ss"
                style="width: 100%"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="出手术室时间" prop="coordinatorOutOperating">
              <el-date-picker
                v-model="form.coordinatorOutOperating"
                type="datetime"
                value-format="yyyy-MM-dd HH:mm:ss"
                style="width: 100%"
              />
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <!-- <el-col :span="8">
            <el-form-item label="协调员签字" prop="coordinatorSign">
              <el-input v-model="form.coordinatorSign" />
            </el-form-item>
          </el-col> -->
          <!-- <el-col :span="8">
            <el-form-item label="获取时间" prop="coordinatorSignTime">
              <el-date-picker
                v-model="form.coordinatorSignTime"
                type="datetime"
                value-format="yyyy-MM-dd HH:mm:ss"
                style="width: 100%"
              />
            </el-form-item>
          </el-col> -->
          <el-col :span="8">
            <el-form-item label="是否默哀缅怀" prop="isspendremember">
              <el-select v-model="form.isspendremember" style="width: 100%">
                <el-option label="是" :value="1" />
                <el-option label="否" :value="0" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="恢复遗体仪容" prop="isrestoreremains">
              <el-select v-model="form.isrestoreremains" style="width: 100%">
                <el-option label="是" :value="1" />
                <el-option label="否" :value="0" />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>

        <!-- 负责人信息 -->
        <el-divider content-position="left">负责人信息</el-divider>

        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="负责人姓名" prop="responsibleusername">
              <el-input v-model="form.responsibleusername" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="协调员一" prop="coordinatedusernameo">
              <el-input v-model="form.coordinatedusernameo" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="协调员二" prop="coordinatedusernamet">
              <el-input v-model="form.coordinatedusernamet" />
            </el-form-item>
          </el-col>
        </el-row>

        <!-- 获取机构信息 -->
        <el-divider content-position="left">获取机构信息</el-divider>

        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="获取机构名称" prop="gainhospitalname">
              <el-input
                v-model="form.gainhospitalname"
                placeholder="请输入获取机构名称"
              />
            </el-form-item>
          </el-col>
          <!-- <el-col :span="8">
            <el-form-item label="捐献编号" prop="gainhospitalno">
              <el-input
                v-model="form.gainhospitalno"
                placeholder="请输入捐献编号"
              />
            </el-form-item>
          </el-col> -->
        </el-row>
      </el-form>
      <el-descriptions title="获取机构信息" :column="descriptionColumn" border size="small">
        <el-descriptions-item label="获取机构名称">{{ form.gainhospitalname || '-' }}</el-descriptions-item>
      </el-descriptions>
    </el-card>

    <!-- 器官获取记录部分 -->
@@ -213,209 +48,29 @@
        </div>
      </div>

      <el-form
        ref="procurementForm"
        :rules="procurementRules"
        :model="procurementData"
        label-position="right"
      >
        <el-row>
          <el-col>
            <el-form-item label-width="100px" label="捐献器官">
              <el-checkbox-group
                v-model="selectedOrgans"
                @change="handleOrganSelectionChange"
              >
                <el-checkbox
                  v-for="dict in dict.type.sys_Organ || []"
                  :key="dict.value"
                  :label="dict.value"
                >
                  {{ dict.label }}
                </el-checkbox>
              </el-checkbox-group>
            </el-form-item>
          </el-col>
        </el-row>
      <el-descriptions title="捐献器官" :column="1" border size="small" style="margin-bottom: 16px;">
        <el-descriptions-item label="捐献器官">
          <template v-if="selectedOrgans && selectedOrgans.length">
            <span v-for="(v, i) in selectedOrgans" :key="v">
              {{ getOrganLabel(v) }}<span v-if="i < selectedOrgans.length - 1">、</span>
            </span>
          </template>
          <template v-else>-</template>
        </el-descriptions-item>
      </el-descriptions>

        <el-row>
          <el-col>
            <el-form-item>
              <el-table
                :data="displayOrgans"
                v-loading="loading"
                border
                style="width: 100%"
                :row-class-name="getOrganRowClassName"
              >
                <el-table-column
                  label="器官名称"
                  align="center"
                  width="120"
                  prop="organname"
                >
                  <template slot-scope="scope">
                    <el-input
                      v-model="scope.row.organname"
                      placeholder="器官名称"
                      :disabled="true"
                    />
                  </template>
                </el-table-column>
      <el-table :data="displayOrgans" v-loading="loading" border style="width: 100%">
        <el-table-column label="器官名称" align="center" prop="organname" />
        <el-table-column label="获取开始时间" align="center" prop="organStartTime" />
        <el-table-column label="器官离体时间" align="center" prop="organgettime" />
        <el-table-column label="获取医院" align="center" prop="gainhospitalname" show-overflow-tooltip />
        <el-table-column label="获取医师" align="center" prop="organgetdoct" />
        <el-table-column label="说明" align="center" prop="notgetreason" min-width="200" show-overflow-tooltip />
      </el-table>

                <el-table-column
                  label="获取开始时间"
                  align="center"
                  width="260"
                  prop="organStartTime"
                >
                  <template slot-scope="scope">
                    <el-date-picker
                      clearable
                      size="small"
                      style="width: 100%"
                      v-model="scope.row.organStartTime"
                      type="datetime"
                      value-format="yyyy-MM-dd HH:mm:ss"
                      placeholder="选择获取开始时间"
                    />
                  </template>
                </el-table-column>

                <el-table-column
                  label="器官离体时间"
                  align="center"
                  width="260"
                  prop="organgettime"
                >
                  <template slot-scope="scope">
                    <el-date-picker
                      clearable
                      size="small"
                      style="width: 100%"
                      v-model="scope.row.organgettime"
                      type="datetime"
                      value-format="yyyy-MM-dd HH:mm:ss"
                      placeholder="选择器官离体时间"
                    />
                  </template>
                </el-table-column>

                <el-table-column
                  label="获取医院"
                  align="center"
                  width="300"
                  prop="gainhospitalname"
                >
                  <!-- <template slot-scope="scope">
                    <el-select
                      v-model="scope.row.gainhospitalname"
                      placeholder="请选择获取医院"
                      style="width: 100%"
                    >
                      <el-option
                        v-for="dict in dict.type.Geta_hospital"
                        :key="dict.value"
                        :label="dict.label"
                        :value="dict.value"
                      ></el-option>

                    </el-select>
                  </template> -->
                  <template slot-scope="scope">
                    <el-autocomplete
                      v-model="scope.row.gainhospitalname"
                      :fetch-suggestions="queryHospitalSearch"
                      placeholder="请选择或输入获取医院"
                      style="width: 100%"
                      clearable
                    ></el-autocomplete>
                  </template>
                </el-table-column>

                <el-table-column
                  label="获取医师"
                  align="center"
                  width="150"
                  prop="organgetdoct"
                >
                  <template slot-scope="scope">
                    <el-input
                      v-model="scope.row.organgetdoct"
                      placeholder="获取医师"
                    />
                  </template>
                </el-table-column>

                <!-- <el-table-column
                  label="获取状态"
                  align="center"
                  width="120"
                  prop="organstate"
                >
                  <template slot-scope="scope">
                    <el-select
                      v-model="scope.row.organstate"
                      placeholder="请选择获取状态"
                      style="width: 100%"
                    >
                      <el-option
                        v-for="dict in dict.type.Obtain_status"
                        :key="dict.value"
                        :label="dict.label"
                        :value="dict.value"
                      />
                    </el-select>
                  </template>
                </el-table-column> -->

                <el-table-column
                  label="说明"
                  align="center"
                  prop="notgetreason"
                  min-width="200"
                >
                  <template slot-scope="scope">
                    <el-input
                      type="textarea"
                      clearable
                      v-model="scope.row.notgetreason"
                      placeholder="请输入未获取说明"
                    />
                  </template>
                </el-table-column>

                <el-table-column
                  label="操作"
                  align="center"
                  width="120"
                  class-name="small-padding fixed-width"
                >
                  <template slot-scope="scope">
                    <el-button
                      size="mini"
                      type="text"
                      icon="el-icon-edit"
                      @click="handleEditProcurement(scope.row)"
                    >
                      编辑
                    </el-button>
                  </template>
                </el-table-column>
              </el-table>
            </el-form-item>
          </el-col>
        </el-row>

        <div
          v-if="!procurementData.serviceDonationwitnessorgans"
          class="empty-procurement"
        >
          <el-empty description="暂无获取记录" :image-size="80">
            <span>请先选择要获取的器官</span>
          </el-empty>
        </div>
      </el-form>
      <div v-if="!displayOrgans.length" class="empty-procurement">
        <el-empty description="暂无获取记录" :image-size="80" />
      </div>
    </el-card>

    <!-- 附件管理部分 - 分类Tab展示 -->
@@ -424,253 +79,96 @@
        <span class="detail-title">相关附件</span>
      </div>

      <!-- 上传区域（无分类选择，由Tab控制） -->
      <div class="upload-wrapper">
        <UploadAttachment
          ref="uploadAttachment"
          :file-list="attachmentFileList"
          :limit="attachmentLimit"
          :accept="attachmentAccept"
          :multiple="true"
          @change="handleAttachmentChange"
          @upload-success="handleUploadSuccess"
          @upload-error="handleUploadError"
          @remove="handleAttachmentRemove"
        />
        <div style="font-size:12px; color:#909399; margin-top:4px;">
          当前上传分类：<el-tag size="small" type="info">{{
            activeTab === "未分类" ? "未分类" : activeTab
          }}</el-tag>
          （切换 Tab 可改变上传分类）
        </div>
      </div>

      <!-- 附件列表 - 分类Tab展示，支持修改分类 -->
      <div class="attachment-list" v-if="attachments && attachments.length > 0">
        <el-tabs v-model="activeTab" type="border-card">
          <el-tab-pane
            v-for="category in categories"
            :key="category"
            :label="category + '(' + getCategoryCount(category) + ')'"
            :name="category"
      <!-- 附件列表 - 分类Tab展示 -->
      <el-tabs v-model="activeTab" type="border-card">
        <el-tab-pane
          v-for="category in categories"
          :key="category"
          :label="category + '(' + getCategoryCount(category) + ')'"
          :name="category"
        >
          <el-table
            :data="getCategoryFiles(category)"
            style="width: 100%"
            size="small"
            border
          >
            <el-table
              :data="getCategoryFiles(category)"
              style="width: 100%"
              size="small"
              border
            >
              <el-table-column label="文件名" min-width="180">
                <template #default="scope">
                  <i
                    class="el-icon-document"
                    style="margin-right: 8px; color: #409EFF;"
                  ></i>
                  <span class="file-name">{{ scope.row.fileName }}</span>
                </template>
              </el-table-column>
              <!-- 可编辑分类下拉 -->
              <el-table-column label="分类" width="150">
                <template #default="scope">
                  <el-select
                    v-model="scope.row.fileType"
                    size="small"
                    @change="updateAttachmentCategory(scope.row, $event)"
                    placeholder="选择分类"
                  >
                    <el-option label="原表拍照" value="原表拍照" />
                    <el-option label="伦理审查材料" value="伦理审查材料" />
                    <el-option label="死亡判定材料" value="死亡判定材料" />
                    <el-option label="默哀仪式照片" value="默哀仪式照片" />
                    <el-option label="捐献见证视频" value="捐献见证视频" />
                    <el-option label="未分类" value="" />
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column label="文件类型" width="100">
                <template #default="scope">
                  <el-tag size="small">{{
                    getFileTypeText(scope.row.fileName)
                  }}</el-tag>
                </template>
              </el-table-column>
              <el-table-column label="上传时间" width="160">
                <template #default="scope">
                  <span>{{ formatDateTime(scope.row.uploadTime) }}</span>
                </template>
              </el-table-column>
              <el-table-column label="文件大小" width="100">
                <template #default="scope">
                  <span>{{ formatFileSize(scope.row.fileSize) }}</span>
                </template>
              </el-table-column>
              <el-table-column label="操作" width="180" fixed="right">
                <template #default="scope">
                  <el-button
                    size="mini"
                    type="primary"
                    @click="handlePreview(scope.row)"
                    >预览</el-button
                  >
                  <el-button
                    size="mini"
                    type="danger"
                    @click="handleRemoveAttachmentByFile(scope.row)"
                    >删除</el-button
                  >
                </template>
              </el-table-column>
            </el-table>
          </el-tab-pane>
        </el-tabs>
      </div>

      <!-- 无附件时显示 -->
      <div v-else style="text-align:center; padding:20px; color:#909399;">
        暂无附件，请上传
      </div>
            <el-table-column label="文件名" min-width="180">
              <template #default="scope">
                <i
                  class="el-icon-document"
                  style="margin-right: 8px; color: #409EFF;"
                ></i>
                <span class="file-name">{{ scope.row.fileName }}</span>
              </template>
            </el-table-column>
            <el-table-column label="分类" width="150">
              <template #default="scope">
                <span>{{ scope.row.fileType || '未分类' }}</span>
              </template>
            </el-table-column>
            <el-table-column label="文件类型" width="100">
              <template #default="scope">
                <el-tag size="small">{{
                  getFileTypeText(scope.row.fileName)
                }}</el-tag>
              </template>
            </el-table-column>
            <el-table-column label="上传时间" width="160">
              <template #default="scope">
                <span>{{ formatDateTime(scope.row.uploadTime) }}</span>
              </template>
            </el-table-column>
            <el-table-column label="文件大小" width="100">
              <template #default="scope">
                <span>{{ formatFileSize(scope.row.fileSize) }}</span>
              </template>
            </el-table-column>
            <el-table-column label="操作" width="100" fixed="right">
              <template #default="scope">
                <el-button
                  size="mini"
                  type="primary"
                  @click="handlePreview(scope.row)"
                  >预览</el-button
                >
              </template>
            </el-table-column>
          </el-table>
          <div
            v-if="getCategoryFiles(category).length === 0"
            style="text-align:center; padding:20px; color:#909399;"
          >
            暂无附件
          </div>
        </el-tab-pane>
      </el-tabs>
    </el-card>
    <div style="text-align: center; margin: 30px 0;">
      <el-button type="primary" @click="handleSave" :loading="saveLoading">
        保存
      </el-button>
      <el-button
        type="success"
        @click="handleProcure"
        :loading="confirmLoading"
      >
        确认获取
      </el-button>
    </div>
    <!-- 编辑获取记录对话框 -->
    <el-dialog
      title="编辑器官获取记录"
      :visible.sync="editDialogVisible"
      width="600px"
    >
      <el-form :model="currentRecord" label-width="120px">
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="器官名称">
              <el-input v-model="currentRecord.organname" readonly />
            </el-form-item>
          </el-col>
          <!-- <el-col :span="12">
            <el-form-item label="获取状态">
              <el-select v-model="currentRecord.organstate" style="width: 100%">
                <el-option
                  v-for="dict in dict.type.Obtain_status"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
          </el-col> -->
        </el-row>

        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="获取医师">
              <el-input
                v-model="currentRecord.organgetdoct"
                placeholder="请输入获取医师"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="助手">
              <el-input
                v-model="currentRecord.assistant"
                placeholder="请输入助手姓名"
              />
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="获取护士">
              <el-input
                v-model="currentRecord.procurementNurse"
                placeholder="请输入获取护士"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="手术室护士">
              <el-input
                v-model="currentRecord.operatingRoomNurse"
                placeholder="请输入手术室护士"
              />
            </el-form-item>
          </el-col>
        </el-row>

        <el-form-item label="麻醉医生">
          <el-input
            v-model="currentRecord.anesthesiologist"
            placeholder="请输入麻醉医生"
          />
        </el-form-item>

        <el-form-item label="未获取说明">
          <el-input
            type="textarea"
            :rows="3"
            v-model="currentRecord.notgetreason"
            placeholder="请输入未获取的原因说明"
          />
        </el-form-item>
      </el-form>

      <div slot="footer">
        <el-button @click="editDialogVisible = false">取消</el-button>
        <el-button type="primary" @click="handleEditConfirm">确认</el-button>
      </div>
    </el-dialog>

    <!-- 文件预览弹窗 -->
    <el-dialog
      :title="filePreviewTitle"
      :visible.sync="filePreviewVisible"
      width="800px"
      @close="filePreviewVisible = false"
    >
      <div v-if="currentPreviewFile">
        <div v-if="currentPreviewFile.fileType === 'image'">
          <img
            :src="currentPreviewFile.fileUrl"
            style="max-width: 100%; max-height: 500px;"
          />
        </div>
        <div v-else-if="currentPreviewFile.fileType === 'pdf'">
          <iframe
            :src="currentPreviewFile.fileUrl"
            width="100%"
            height="500px"
          ></iframe>
        </div>
        <div v-else>
          <p>不支持预览此文件类型，请下载查看</p>
        </div>
      </div>
    </el-dialog>
    <FilePreviewDialog
      :visible="previewVisible"
      :file="currentPreviewFile"
      @close="previewVisible = false"
      @download="handleDownload"
    />
  </div>
</template>

<script>
import { witnessList, witnessadd, witnessedit } from "@/api/businessApi";
import UploadAttachment from "@/components/UploadAttachment";
import FilePreviewDialog from "@/components/FilePreviewDialog";
import CaseBasicInfo from "@/components/CaseBasicInfo";
import { getToken } from "@/utils/auth";
import dayjs from "dayjs";
import readonlyDescriptionsMixin from "./readonlyDescriptionsMixin";

export default {
  name: "OrganProcurementDetail",
  components: {
    UploadAttachment,
    FilePreviewDialog,
    CaseBasicInfo
  },
  mixins: [readonlyDescriptionsMixin],
  dicts: [
    "sys_BloodType",
    "Geta_hospital",
@@ -784,19 +282,22 @@
      },
      // 附件数据
      attachments: [],
      attachmentFileList: [],
      // 附件相关配置
      attachmentLimit: 10,
      attachmentAccept:
        ".pdf,.jpg,.jpeg,.png,.doc,.docx,.xls,.xlsx,.ppt,.pptx,.txt",
      // 上传相关
      uploadAction: process.env.VUE_APP_BASE_API + "/common/upload",
      headers: {
        Authorization: "Bearer " + getToken()
      },
      uploadDialogVisible: false,
      uploadLoading: false,
      tempFileList: [],
      currentUploadCategory: "",
      // 编辑对话框
      editDialogVisible: false,
      currentRecord: {},
      currentEditIndex: -1,
      // 文件预览相关
      filePreviewVisible: false,
      currentPreviewFile: null,
      filePreviewTitle: ""
      previewVisible: false,
      currentPreviewFile: null
    };
  },
  computed: {
@@ -854,22 +355,6 @@
      return this.dict.type.sys_Organ || [];
    }
  },
  watch: {
    // 监听附件数据变化
    attachments: {
      handler(newAttachments) {
        this.attachmentFileList = newAttachments.map(item => ({
          uid: item.id || Math.random(),
          name: item.fileName,
          fileSize: item.fileSize,
          url: item.path || item.fileUrl,
          uploadTime: item.uploadTime,
          status: "success"
        }));
      },
      deep: true
    }
  },
  created() {
    this.caseId = this.infoid;

@@ -884,7 +369,7 @@

    // 初始化数据
    initData() {
      const  infoid  = this.infoid;
      const infoid = this.infoid;

      if (!infoid) {
        this.$message.error("缺少必要的路由参数 infoid");
@@ -939,19 +424,8 @@
              fileType: item.fileType || "" // 默认空字符串表示未分类
            }));
            this.form.attachments = this.attachments;
            // 同步 attachmentFileList
            this.attachmentFileList = this.attachments.map(item => ({
              uid: item.id || Math.random(),
              name: item.fileName,
              url: item.path || item.fileUrl,
              fileSize: item.fileSize,
              uploadTime: item.uploadTime,
              status: "success",
              raw: item
            }));
          } else {
            this.attachments = [];
            this.attachmentFileList = [];
          }

          // 处理捐献器官字段
@@ -1387,133 +861,163 @@
      this.handleConfirmProcurement();
    },

    // 附件相关方法
    /** 附件变化处理 */
    handleAttachmentChange(fileList) {
      this.attachmentFileList = fileList;
    // ===== 附件相关方法 =====
    // 打开上传对话框
    openUploadDialog(category) {
      this.currentUploadCategory = category;
      this.tempFileList = [];
      this.uploadDialogVisible = true;
      this.$nextTick(() => {
        if (this.$refs.uploadRef) {
          this.$refs.uploadRef.clearFiles();
        }
      });
    },

    /** 附件移除处理 */
   handleAttachmentRemove(file) {
  // 直接调用新的删除方法
  if (file.raw) {
    this.handleRemoveAttachmentByFile(file.raw);
  } else if (file.url) {
    const target = this.attachments.find(
      item => item.path === file.url || item.fileUrl === file.url
    );
    if (target) {
      this.handleRemoveAttachmentByFile(target);
    }
  }
},

    /** 上传成功处理 */
    handleUploadSuccess({ file, fileList, response }) {
  if (response.code === 200) {
    // 根据当前激活的 Tab 决定分类（未分类 Tab 对应空字符串）
    const category = this.activeTab === '未分类' ? '' : this.activeTab;
    const attachmentObj = {
      fileName: file.name,
      path: response.fileUrl || file.url,
      fileUrl: response.fileUrl || file.url,
      fileType: category,                    // 关键：记录分类
      fileSize: file.size,
      uploadTime: dayjs().format('YYYY-MM-DD HH:mm:ss')
    };

    if (!Array.isArray(this.attachments)) {
      this.attachments = [];
    }
    this.attachments.push(attachmentObj);
    this.attachmentFileList = fileList;
    this.$message.success('文件上传成功');
  }
},
// 获取某分类的文件数量
getCategoryCount(category) {
  return this.attachments.filter(item => {
    const type = item.fileType || '';
    if (category === '未分类') {
      return !this.presetCategories.includes(type);
    }
    return type === category;
  }).length;
},

// 获取某分类的文件列表
getCategoryFiles(category) {
  return this.attachments.filter(item => {
    const type = item.fileType || '';
    if (category === '未分类') {
      return !this.presetCategories.includes(type);
    }
    return type === category;
  });
},

// 更新附件分类（下拉修改时触发）
updateAttachmentCategory(row, newVal) {
  const target = this.attachments.find(item => item === row);
  if (target) {
    target.fileType = newVal; // 可能为空字符串
    // 同步更新 attachmentFileList
    const fileItem = this.attachmentFileList.find(
      f => f.raw === row || f.url === row.fileUrl
    );
    if (fileItem) {
      fileItem.raw.fileType = newVal;
      fileItem.fileType = newVal || '未分类';
    }
    // 如果当前激活的tab没有文件了，自动切换到第一个有文件的tab
    const currentTabHasFiles = this.getCategoryFiles(this.activeTab).length > 0;
    if (!currentTabHasFiles) {
      const firstCategory = this.categories[0];
      if (firstCategory) this.activeTab = firstCategory;
    }
  }
},

// 按文件对象删除（用于表格中的删除按钮）
handleRemoveAttachmentByFile(file) {
  const index = this.attachments.findIndex(item => item === file);
  if (index > -1) {
    this.attachments.splice(index, 1);
    // 同步删除 attachmentFileList
    const fileIndex = this.attachmentFileList.findIndex(
      f => f.raw === file || f.url === file.fileUrl
    );
    if (fileIndex > -1) {
      this.attachmentFileList.splice(fileIndex, 1);
    }
    this.$message.success('附件删除成功');
  }
},
    /** 上传错误处理 */
    handleUploadError({ file, fileList, error }) {
      console.error("附件上传失败:", error);
      this.$message.error("文件上传失败，请重试");
    // 上传前校验
    beforeUpload(file) {
      const allowedTypes = [
        "application/pdf",
        "image/jpeg",
        "image/png",
        "application/msword",
        "application/vnd.openxmlformats-officedocument.wordprocessingml.document"
      ];
      const maxSize = 10 * 1024 * 1024;
      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(
          "文件格式不支持，请上传pdf、jpg、png、doc或docx格式文件"
        );
        return false;
      }
      if (file.size > maxSize) {
        this.$message.error("文件大小不能超过10MB");
        return false;
      }
      return true;
    },

    /** 手动删除附件 */
    handleRemoveAttachment(index) {
      this.attachments.splice(index, 1);
      this.attachmentFileList.splice(index, 1);
      this.$message.success("附件删除成功");
    // 文件选择变化
    handleFileChange(file, fileList) {
      this.tempFileList = fileList;
    },

    /** 文件预览 */
    // 临时移除
    handleTempRemove(file, fileList) {
      this.tempFileList = fileList;
    },

    // 上传成功处理
    handleUploadSuccess(response, file, fileList) {
      if (response.code !== 200) {
        this.$message.error(response.msg || "上传失败");
        return;
      }
      // 未分类对应空字符串，与展示/保存逻辑一致
      const category =
        this.currentUploadCategory === "未分类"
          ? ""
          : this.currentUploadCategory;
      const attachmentObj = {
        fileName: file.name,
        path: response.fileUrl || response.url || response.data || file.url,
        fileUrl: response.fileUrl || response.url || response.data || file.url,
        fileType: category,
        fileSize: file.size,
        uploadTime: dayjs().format("YYYY-MM-DD HH:mm:ss")
      };
      if (!Array.isArray(this.attachments)) {
        this.attachments = [];
      }
      this.attachments.push(attachmentObj);
      this.$message.success("文件上传成功");
      this.uploadLoading = false;
      this.uploadDialogVisible = false;
      this.tempFileList = [];
    },

    // 提交上传
    submitUpload() {
      if (this.tempFileList.length === 0) {
        this.$message.warning("请先选择要上传的文件");
        return;
      }
      this.uploadLoading = true;
      this.$refs.uploadRef.submit();
    },

    // 获取某分类的文件数量
    getCategoryCount(category) {
      return this.attachments.filter(item => {
        const type = item.fileType || "";
        if (category === "未分类") {
          return !this.presetCategories.includes(type);
        }
        return type === category;
      }).length;
    },

    // 获取某分类的文件列表
    getCategoryFiles(category) {
      return this.attachments.filter(item => {
        const type = item.fileType || "";
        if (category === "未分类") {
          return !this.presetCategories.includes(type);
        }
        return type === category;
      });
    },

    // 更新附件分类（下拉修改时触发）
    updateAttachmentCategory(row, newVal) {
      const target = this.attachments.find(item => item === row);
      if (target) {
        target.fileType = newVal;
        const currentTabHasFiles =
          this.getCategoryFiles(this.activeTab).length > 0;
        if (!currentTabHasFiles) {
          const firstCategory = this.categories[0];
          if (firstCategory) this.activeTab = firstCategory;
        }
      }
    },

    // 按文件对象删除（用于表格中的删除按钮）
    handleRemoveAttachmentByFile(file) {
      this.$confirm("确定要删除这个附件吗？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          const index = this.attachments.findIndex(item => item === file);
          if (index > -1) {
            this.attachments.splice(index, 1);
            this.$message.success("附件删除成功");
          }
        })
        .catch(() => {});
    },

    // 文件预览
    handlePreview(file) {
      this.currentPreviewFile = {
        fileName: file.fileName,
        fileUrl: file.path || file.fileUrl,
        fileType: this.getFileType(file.fileName)
      };
      this.filePreviewTitle = file.fileName;
      this.filePreviewVisible = true;
      this.previewVisible = true;
    },

    /** 文件下载 */
    // 文件下载
    handleDownload(file) {
      const fileUrl = file.path || file.fileUrl;
      const fileName = file.fileName;