青岛维护

WXL

10 小时以前 0c03027d7f238bf5beb98e85463f53f0bd92bbaa

 src/views/business/appear/index.vue

@@ -8,33 +8,33 @@
        :inline="true"
        class="demo-form-inline"
      >
        <el-form-item label="捐献编号" prop="donorNo">
        <el-form-item label="案例编号" prop="caseNo">
          <el-input
            v-model="queryParams.donorNo"
            placeholder="请输入捐献编号"
            v-model="queryParams.caseNo"
            placeholder="请输入案例编号"
            clearable
            style="width: 200px"
          />
        </el-form-item>
        <el-form-item label="捐献者姓名" prop="donorName">
        <el-form-item label="捐献者姓名" prop="name">
          <el-input
            v-model="queryParams.donorName"
            v-model="queryParams.name"
            placeholder="请输入捐献者姓名"
            clearable
            style="width: 200px"
          />
        </el-form-item>
        <el-form-item label="案例状态" prop="status">
        <el-form-item label="案例状态" prop="reportStatus">
          <el-select
            v-model="queryParams.status"
            v-model="queryParams.reportStatus"
            placeholder="请选择状态"
            clearable
            style="width: 200px"
          >
            <el-option label="全部" value="" />
            <el-option label="待审批" value="0" />
            <el-option label="已通过" value="1" />
            <el-option label="已终止" value="2" />
            <el-option label="已阅读" value="2" />
            <el-option label="已同意" value="3" />
            <el-option label="已驳回" value="4" />
          </el-select>
        </el-form-item>
        <el-form-item>
@@ -48,11 +48,11 @@

    <!-- 操作按钮区域 -->
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
      <!-- <el-col :span="1.5">
        <el-button type="primary" plain icon="el-icon-plus" @click="handleAdd"
          >新增案例</el-button
        >
      </el-col>
      </el-col> -->

      <el-col :span="1.5">
        <el-button
@@ -67,65 +67,93 @@
    </el-row>

    <!-- 数据表格 -->
    <!-- 数据表格 -->
    <el-table
      v-loading="loading"
      :data="caseList"
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="55" align="center" />
      <!-- <el-table-column label="序号" type="index" width="60" align="center"/>
      <el-table-column label="捐献编号" align="center" prop="donorNo" width="140"/> -->
      <el-table-column
        label="案例编号"
        align="center"
        prop="caseNo"
        width="150"
        fixed
      />
      <el-table-column
        label="上报时间"
        align="center"
        prop="reportTime"
        prop="reporttime"
        width="160"
      />

      <el-table-column
        label="捐献者姓名"
        align="center"
        prop="donorName"
        prop="name"
        width="100"
      />
      <el-table-column label="性别" align="center" prop="gender" width="80">
        <template slot-scope="scope">
          <dict-tag :options="genderOptions" :value="scope.row.gender" />
      <el-table-column label="性别" align="center" prop="sex" width="80">
        <template #default="scope">
          <dict-tag :options="dict.type.sys_user_sex" :value="scope.row.sex" />
        </template>
      </el-table-column>
      <el-table-column label="年龄" align="center" prop="age" width="80" />
      <el-table-column label="血型" align="center" prop="bloodType" width="80">
        <template slot-scope="scope">
          <dict-tag :options="bloodTypeOptions" :value="scope.row.bloodType" />
        <template #default="scope">
          <dict-tag
            :options="dict.type.sys_BloodType"
            :value="scope.row.bloodType"
          />
        </template>
      </el-table-column>
      <el-table-column
        label="GCS评分"
        align="center"
        prop="gcsScore"
        width="80"
        show-overflow-tooltip
      />
      <el-table-column
        label="疾病诊断"
        align="center"
        prop="diagnosis"
        prop="diagnosisname"
        min-width="200"
        show-overflow-tooltip
      />
      <el-table-column
        label="上报医院"
        label="治疗医院"
        align="center"
        prop="hospitalName"
        prop="treatmenthospitalname"
        width="150"
      />
      <el-table-column label="状态" align="center" prop="status" width="100">
        <template slot-scope="scope">
          <el-tag :type="scope.row.status | statusFilter">
            {{ scope.row.status | statusTextFilter }}
      <el-table-column
        label="状态"
        align="center"
        prop="reportStatus"
        width="100"
      >
        <template #default="scope">
          <el-tag :type="scope.row.reportStatus | statusFilter">
            {{ scope.row.reportStatus | statusTextFilter }}
          </el-tag>
        </template>
      </el-table-column>
      <el-table-column label="转运状态" align="center" width="100">
        <template #default="scope">
          <el-tag :type="getTransportStatusTag(scope.row)">
            {{ getTransportStatusText(scope.row) }}
          </el-tag>
        </template>
      </el-table-column>
      <el-table-column
        label="操作"
        align="center"
        fixed="right"
        class-name="small-padding fixed-width"
        width="200"
        width="350"
      >
        <template slot-scope="scope">
        <template #default="scope">
          <el-button
            size="mini"
            type="text"
@@ -133,15 +161,37 @@
            @click="handleDetail(scope.row)"
            >详情</el-button
          >

          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleEdit(scope.row)"
            v-if="
              scope.row.reportStatus !== '3' &&
                scope.row.reportStatus !== '4' &&
                scope.row.delFlag === 0
            "
            >编辑</el-button
          >
          <el-button
            size="mini"
            type="text"
            icon="el-icon-check"
            @click="handleApprove(scope.row)"
            v-if="scope.row.status === '0'"
            v-if="scope.row.reportStatus === '2' && scope.row.delFlag === 0"
            >审批</el-button
          >
          <el-button
            size="mini"
            type="text"
            icon="el-icon-truck"
            :type="shouldShowTransportButton(scope.row) ? 'primary' : 'text'"
            @click="handleTransport(scope.row)"
            v-if="shouldShowTransportButton(scope.row)"
            :disabled="!canGoToTransport(scope.row)"
          >
            {{ getTransportButtonText(scope.row) }}
          </el-button>
        </template>
      </el-table-column>
    </el-table>
@@ -167,7 +217,6 @@
    </el-dialog>

    <!-- 审批弹框 -->
    <!-- 审批弹框优化 -->
    <el-dialog
      title="案例审批"
      :visible.sync="approveOpen"
@@ -197,15 +246,15 @@
          >
            <el-form-item label="审批结果" prop="approveResult">
              <el-radio-group v-model="approveForm.approveResult">
                <el-radio label="1">通过</el-radio>
                <el-radio label="2">终止</el-radio>
                <el-radio label="3">同意</el-radio>
                <el-radio label="4">驳回</el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="审批意见" prop="approveOpinion">
              <el-input
                type="textarea"
                v-model="approveForm.approveOpinion"
                placeholder="请输入详细的审批意见，包括通过或终止的理由"
                placeholder="请输入详细的审批意见，包括通过或驳回的理由"
                :rows="6"
                maxlength="500"
                show-word-limit
@@ -220,20 +269,709 @@
        <el-button type="primary" @click="submitApprove">确定</el-button>
      </div>
    </el-dialog>

    <!-- 新增/编辑案例弹框 -->
    <el-dialog
      :title="`${isEditing ? '编辑' : '新增'}案例`"
      :visible.sync="editOpen"
      width="68%"
      append-to-body
      :close-on-click-modal="false"
      @close="handleEditClose"
    >
      <el-form
        ref="editForm"
        :model="editForm"
        :rules="editRules"
        label-width="120px"
      >
        <!-- 基本信息 -->
        <el-card class="form-section" shadow="never">
          <div slot="header" class="section-header">
            <i
              class="el-icon-user"
              style="color: #409EFF; margin-right: 8px;"
            ></i>
            <span>基本信息</span>
          </div>

          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="案例编号" prop="caseNo">
                <el-input
                  v-model="editForm.caseNo"
                  placeholder="请输入案例编号"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="捐献者姓名" prop="name">
                <el-input
                  v-model="editForm.name"
                  placeholder="请输入捐献者姓名"
                />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="性别" prop="sex">
                <el-select
                  v-model="editForm.sex"
                  placeholder="请选择性别"
                  style="width: 100%"
                >
                  <el-option label="男" value="0" />
                  <el-option label="女" value="1" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="年龄" prop="age">
                <el-input-number
                  v-model="editForm.age"
                  :min="0"
                  :max="120"
                  placeholder="请输入年龄"
                  style="width: 100%"
                />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="年龄单位" prop="ageunit">
                <el-select
                  v-model="editForm.ageunit"
                  placeholder="请选择年龄单位"
                  style="width: 100%"
                >
                  <el-option label="岁" value="year" />
                  <el-option label="月" value="month" />
                  <el-option label="天" value="day" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="血型" prop="bloodType">
                <el-select
                  v-model="editForm.bloodType"
                  placeholder="请选择血型"
                  style="width: 100%"
                >
                  <el-option label="A型" value="A" />
                  <el-option label="B型" value="B" />
                  <el-option label="O型" value="O" />
                  <el-option label="AB型" value="AB" />
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="Rh阴性" prop="rhYin">
                <el-radio-group v-model="editForm.rhYin">
                  <el-radio label="0">否</el-radio>
                  <el-radio label="1">是</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="出生日期" prop="birthday">
                <el-date-picker
                  v-model="editForm.birthday"
                  type="date"
                  placeholder="选择出生日期"
                  value-format="yyyy-MM-dd"
                  style="width: 100%"
                />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="证件类型" prop="idcardtype">
                <el-select
                  v-model="editForm.idcardtype"
                  placeholder="请选择证件类型"
                  style="width: 100%"
                >
                  <el-option label="身份证" value="1" />
                  <el-option label="护照" value="2" />
                  <el-option label="军官证" value="3" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="证件号码" prop="idcardno">
                <el-input
                  v-model="editForm.idcardno"
                  placeholder="请输入证件号码"
                />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="民族" prop="nation">
                <el-input v-model="editForm.nation" placeholder="请输入民族" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="国籍" prop="nationality">
                <el-input
                  v-model="editForm.nationality"
                  placeholder="请输入国籍"
                />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="籍贯" prop="nativeplace">
                <el-input
                  v-model="editForm.nativeplace"
                  placeholder="请输入籍贯"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="学历" prop="education">
                <el-input
                  v-model="editForm.education"
                  placeholder="请输入学历"
                />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="职业" prop="occupation">
                <el-input
                  v-model="editForm.occupation"
                  placeholder="请输入职业"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="联系电话" prop="phone">
                <el-input
                  v-model="editForm.phone"
                  placeholder="请输入联系电话"
                />
              </el-form-item>
            </el-col>
          </el-row>
        </el-card>

        <!-- 地址信息 -->
        <el-card class="form-section" shadow="never">
          <div slot="header" class="section-header">
            <i
              class="el-icon-location-information"
              style="color: #67C23A; margin-right: 8px;"
            ></i>
            <span>地址信息</span>
          </div>

          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="户籍地址省">
                <el-input
                  v-model="editForm.registerprovincename"
                  placeholder="请输入户籍地址省"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="户籍地址市">
                <el-input
                  v-model="editForm.registercityname"
                  placeholder="请输入户籍地址市"
                />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="户籍街道">
                <el-input
                  v-model="editForm.registertownname"
                  placeholder="请输入户籍街道"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="户籍社区">
                <el-input
                  v-model="editForm.registercommunityname"
                  placeholder="请输入户籍社区"
                />
              </el-form-item>
            </el-col>
          </el-row>

          <el-form-item label="户籍详细地址" prop="registeraddress">
            <el-input
              v-model="editForm.registeraddress"
              type="textarea"
              :rows="2"
              placeholder="请输入详细的户籍地址"
            />
          </el-form-item>

          <el-divider>现住地址</el-divider>

          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="现住地址省">
                <el-input
                  v-model="editForm.residenceprovincename"
                  placeholder="请输入现住地址省"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="现住地址市/区">
                <el-input
                  v-model="editForm.residencecountyname"
                  placeholder="请输入现住地址市/区"
                />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="现住地址街道">
                <el-input
                  v-model="editForm.residencetownname"
                  placeholder="请输入现住地址街道"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="现住地址社区">
                <el-input
                  v-model="editForm.residencecommunityname"
                  placeholder="请输入现住地址社区"
                />
              </el-form-item>
            </el-col>
          </el-row>

          <el-form-item label="现住详细地址" prop="residenceaddress">
            <el-input
              v-model="editForm.residenceaddress"
              type="textarea"
              :rows="2"
              placeholder="请输入详细的现住地址"
            />
          </el-form-item>
        </el-card>

        <!-- 医疗信息 -->
        <el-card class="form-section" shadow="never">
          <div slot="header" class="section-header">
            <i
              class="el-icon-first-aid-kit"
              style="color: #E6A23C; margin-right: 8px;"
            ></i>
            <span>医疗信息</span>
          </div>

          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="疾病诊断" prop="diagnosisname">
                <el-input
                  v-model="editForm.diagnosisname"
                  placeholder="请输入疾病诊断名称"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="GCS评分" prop="gcsScore">
                <el-input
                  v-model="editForm.gcsScore"
                  placeholder="请输入GCS评分"
                />
              </el-form-item>
            </el-col>
          </el-row>

          <el-form-item label="病情概况" prop="illnessoverview">
            <el-input
              v-model="editForm.illnessoverview"
              type="textarea"
              :rows="3"
              placeholder="请输入病情概况"
              maxlength="500"
              show-word-limit
            />
          </el-form-item>

          <el-form-item label="病人状况" prop="patientstate">
            <el-input
              v-model="editForm.patientstate"
              type="textarea"
              :rows="2"
              placeholder="请输入病人状况"
              maxlength="200"
              show-word-limit
            />
          </el-form-item>

          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="传染病情况" prop="infectious">
                <el-input
                  v-model="editForm.infectious"
                  placeholder="请输入传染病情况"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="传染病其他说明">
                <el-input
                  v-model="editForm.infectiousOther"
                  placeholder="请输入传染病其他说明"
                />
              </el-form-item>
            </el-col>
          </el-row>

          <el-form-item label="是否需要转运" prop="isTransport">
            <el-radio-group v-model="editForm.isTransport">
              <el-radio label="1">不需要</el-radio>
              <el-radio label="2">需要</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-card>

        <!-- 医院信息 -->
        <el-card class="form-section" shadow="never">
          <div slot="header" class="section-header">
            <i
              class="el-icon-office-building"
              style="color: #909399; margin-right: 8px;"
            ></i>
            <span>医院信息</span>
          </div>

          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="治疗医院" prop="treatmenthospitalname">
                <el-input
                  v-model="editForm.treatmenthospitalname"
                  placeholder="请输入治疗医院名称"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="治疗科室" prop="treatmentdeptname">
                <el-input
                  v-model="editForm.treatmentdeptname"
                  placeholder="请输入治疗科室名称"
                />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="住院号" prop="inpatientno">
                <el-input
                  v-model="editForm.inpatientno"
                  placeholder="请输入住院号"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="部门名称" prop="deptName">
                <el-input
                  v-model="editForm.deptName"
                  placeholder="请输入部门名称"
                />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="部门编号" prop="deptNo">
                <el-input
                  v-model="editForm.deptNo"
                  placeholder="请输入部门编号"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="上报医院" prop="toHospital">
                <el-input
                  v-model="editForm.toHospital"
                  placeholder="请输入上报的医院"
                />
              </el-form-item>
            </el-col>
          </el-row>
        </el-card>

        <!-- 上报信息 -->
        <el-card class="form-section" shadow="never">
          <div slot="header" class="section-header">
            <i
              class="el-icon-s-data"
              style="color: #F56C6C; margin-right: 8px;"
            ></i>
            <span>上报信息</span>
          </div>

          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="报告者姓名" prop="infoName">
                <el-input
                  v-model="editForm.infoName"
                  placeholder="请输入报告者姓名"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="报告者编号" prop="infoNo">
                <el-input
                  v-model="editForm.infoNo"
                  placeholder="请输入报告者编号"
                />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="报告者电话" prop="reporterphone">
                <el-input
                  v-model="editForm.reporterphone"
                  placeholder="请输入报告者联系电话"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="协调员姓名" prop="coordinatorName">
                <el-input
                  v-model="editForm.coordinatorName"
                  placeholder="请输入协调员姓名"
                />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="协调员编号" prop="coordinatorNo">
                <el-input
                  v-model="editForm.coordinatorNo"
                  placeholder="请输入协调员编号"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="是否终止案例" prop="terminationCase">
                <el-radio-group v-model="editForm.terminationCase">
                  <el-radio label="0">进行中</el-radio>
                  <el-radio label="1">已终止</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
          </el-row>

          <el-form-item label="上报状态" prop="reportStatus">
            <el-select
              v-model="editForm.reportStatus"
              placeholder="请选择上报状态"
              style="width: 100%"
              :disabled="isEditing"
            >
              <el-option label="已上报" value="1" />
              <el-option label="已阅读" value="2" />
              <el-option label="已同意" value="3" />
              <el-option label="已驳回" value="4" />
            </el-select>
          </el-form-item>
        </el-card>

        <!-- 附件信息 -->
        <el-card class="form-section" shadow="never">
          <div slot="header" class="section-header">
            <i
              class="el-icon-folder"
              style="color: #409EFF; margin-right: 8px;"
            ></i>
            <span>附件信息</span>
          </div>

          <div class="attachment-section">
            <div class="attachment-header">
              <i class="el-icon-paperclip"></i>
              <span class="attachment-title">附件上传</span>
              <span class="attachment-tip"
                >支持上传病历、检验报告等文件 (最多{{
                  attachmentLimit
                }}个)</span
              >
            </div>

            <!-- 使用 UploadAttachment 组件 -->
            <UploadAttachment
              ref="uploadAttachment"
              :file-list="attachmentFileList"
              :limit="attachmentLimit"
              :accept="attachmentAccept"
              @change="handleAttachmentChange"
              @upload-success="handleUploadSuccess"
              @upload-error="handleUploadError"
              @remove="handleAttachmentRemove"
            />
          </div>

          <!-- 附件列表 -->
          <div
            class="attachment-list"
            v-if="editForm.annexfilesList && editForm.annexfilesList.length > 0"
          >
            <div class="list-title">
              已上传附件 ({{ editForm.annexfilesList.length }})
            </div>
            <el-table
              :data="editForm.annexfilesList"
              style="width: 100%"
              size="small"
              border
            >
              <el-table-column label="文件名" min-width="200">
                <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="100">
                <template #default="scope">
                  <el-tag size="small">{{
                    getFileType(scope.row.fileName)
                  }}</el-tag>
                </template>
              </el-table-column>
              <el-table-column label="创建时间" width="160">
                <template #default="scope">
                  <span>{{ formatDateTime(scope.row.createTime) }}</span>
                </template>
              </el-table-column>
              <el-table-column
                label="备注"
                min-width="150"
                show-overflow-tooltip
              >
                <template #default="scope">
                  <span>{{ scope.row.remart || "无" }}</span>
                </template>
              </el-table-column>
              <el-table-column label="操作" width="200" fixed="right">
                <template #default="scope">
                  <el-button
                    size="mini"
                    type="primary"
                    @click="handlePreview(scope.row)"
                  >
                    预览
                  </el-button>
                  <el-button
                    size="mini"
                    type="danger"
                    @click="handleRemoveAttachment(scope.$index)"
                  >
                    删除
                  </el-button>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </el-card>

        <!-- 备注信息 -->
        <el-card class="form-section" shadow="never">
          <div slot="header" class="section-header">
            <i
              class="el-icon-edit"
              style="color: #67C23A; margin-right: 8px;"
            ></i>
            <span>备注信息</span>
          </div>
          <el-form-item prop="remark">
            <el-input
              v-model="editForm.remark"
              type="textarea"
              :rows="4"
              placeholder="请输入备注信息"
              maxlength="500"
              show-word-limit
            />
          </el-form-item>
        </el-card>
      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button @click="handleEditClose">取消</el-button>
        <el-button type="primary" :loading="saveLoading" @click="handleSave"
          >保存</el-button
        >
      </div>
    </el-dialog>

    <!-- 文件预览弹窗 -->
    <FilePreviewDialog
      :visible="previewVisible"
      :file="currentPreviewFile"
      @close="previewVisible = false"
      @download="handleDownload"
    />
  </div>
</template>

<script>
import CaseDetail from "./caseDetail";
import CaseDetailPreview from "./CaseDetailPreview";
import UploadAttachment from "@/components/UploadAttachment";
import FilePreviewDialog from "@/components/FilePreviewDialog";
import {
  donateList,
  donateInfo,
  donateDel,
  donateEdit,
  donateAdd
} from "@/api/businessApi/index";
import dayjs from "dayjs";

export default {
  name: "CaseList",
  components: { CaseDetail, CaseDetailPreview },

  components: {
    CaseDetail,
    UploadAttachment,
    FilePreviewDialog
  },
  dicts: ["sys_user_sex", "sys_BloodType"],
  data() {
    return {
      // 遮罩层
      loading: false,
      saveLoading: false,
      // 选中数组
      ids: [],
      // 非单个禁用
@@ -248,34 +986,26 @@
      detailOpen: false,
      // 审批弹框是否显示
      approveOpen: false,
      // 编辑弹框是否显示
      editOpen: false,
      // 编辑状态
      isEditing: false,
      // 详情弹框标题
      detailTitle: "",
      // 当前操作的案例
      currentCase: {},
      // 性别选项
      genderOptions: [
        { value: "0", label: "男" },
        { value: "1", label: "女" }
      ],
      // 血型选项
      bloodTypeOptions: [
        { value: "A", label: "A型" },
        { value: "B", label: "B型" },
        { value: "O", label: "O型" },
        { value: "AB", label: "AB型" }
      ],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        donorNo: undefined,
        donorName: undefined,
        status: undefined
        caseNo: undefined,
        name: undefined,
        reportStatus: undefined
      },
      // 审批表单
      approveForm: {
        caseId: null,
        approveResult: "1",
        id: null,
        approveResult: "3",
        approveOpinion: ""
      },
      // 审批表单验证
@@ -286,25 +1016,56 @@
        approveOpinion: [
          { required: true, message: "请输入审批意见", trigger: "blur" }
        ]
      }
      },
      // 编辑表单
      editForm: this.getDefaultFormData(),
      // 表单验证规则
      editRules: {
        caseNo: [
          { required: true, message: "请输入案例编号", trigger: "blur" }
        ],
        name: [
          { required: true, message: "请输入捐献者姓名", trigger: "blur" }
        ],
        sex: [{ required: true, message: "请选择性别", trigger: "change" }],
        age: [{ required: true, message: "请输入年龄", trigger: "blur" }],
        diagnosisname: [
          { required: true, message: "请输入疾病诊断", trigger: "blur" }
        ],
        treatmenthospitalname: [
          { required: true, message: "请输入治疗医院", trigger: "blur" }
        ],
        reportStatus: [
          { required: true, message: "请选择上报状态", trigger: "change" }
        ]
      },
      // 附件相关配置
      attachmentLimit: 10,
      attachmentAccept: ".pdf,.jpg,.jpeg,.png,.doc,.docx,.xls,.xlsx",
      attachmentFileList: [],
      // 预览相关
      previewVisible: false,
      currentPreviewFile: null
    };
  },
  filters: {
    statusFilter(status) {
    statusFilter(reportStatus) {
      const statusMap = {
        "0": "warning", // 待审批
        "1": "success", // 已通过
        "2": "danger" // 已终止
        "1": "info", // 已上报
        "2": "warning", // 已阅读（待审批）
        "3": "success", // 已同意
        "4": "danger" // 已驳回
      };
      return statusMap[status];
      return statusMap[reportStatus] || "info";
    },
    statusTextFilter(status) {
    statusTextFilter(reportStatus) {
      const statusMap = {
        "0": "待审批",
        "1": "已通过",
        "2": "已终止"
        "1": "已上报",
        "2": "已阅读",
        "3": "已同意",
        "4": "已驳回"
      };
      return statusMap[status];
      return statusMap[reportStatus] || "未知状态";
    }
  },
  created() {
@@ -312,193 +1073,707 @@
  },
  methods: {
    /** 查询案例列表 */
    getList() {
    async getList() {
      this.loading = true;
      // 模拟API调用延迟
      setTimeout(() => {
        // 测试数据
        this.caseList = [
          {
            id: 1,
            donorNo: "DON20241219001",
            donorName: "张三",
            gender: "2",
            age: 38,
            bloodType: "A",
            diagnosis:
              "脑外伤导致脑死亡，经抢救无效宣布脑死亡。家属同意器官捐献。",
            hospitalName: "青岛大学附属医院",
            status: "0",
            reportTime: "2024-12-19 09:30:00",
            reporterName: "李医生",
            idCardNo: "370203198510123456",
            nation: "汉族",
            phone: "13800138000",
            address: "山东省青岛市市南区香港中路100号",
            inpatientNo: "ZY20241219001",
            departmentName: "神经外科",
            doctorName: "王主任",
            infectiousDisease: "无",
            medicalRecord:
              "患者因交通事故导致严重脑外伤，经抢救无效宣布脑死亡。",
            hospitalLevel: "三级甲等",
            contactPerson: "张护士",
            contactPhone: "13900139000",
            hospitalAddress: "山东省青岛市市南区江苏路1号"
          },
          {
            id: 2,
            donorNo: "DON20241218001",
            donorName: "李四",
            gender: "1",
            age: 45,
            bloodType: "O",
            diagnosis: "急性心肌梗死，心脏功能衰竭",
            hospitalName: "青岛市立医院",
            status: "1",
            reportTime: "2024-12-18 14:20:00",
            approveTime: "2024-12-18 16:30:00",
            reporterName: "刘医生",
            approverName: "审核专员A",
            approveOpinion: "资料齐全，符合捐献条件，同意通过。"
          },
          {
            id: 3,
            donorNo: "DON20241217001",
            donorName: "王五",
            gender: "2",
            age: 52,
            bloodType: "B",
            diagnosis: "颅内出血，脑干功能丧失",
            hospitalName: "青岛眼科医院",
            status: "2",
            reportTime: "2024-12-17 10:15:00",
            approveTime: "2024-12-17 14:20:00",
            reporterName: "陈医生",
            approverName: "审核专员B",
            approveOpinion: "家属同意书不完整，需补充材料后重新提交。"
          },
          {
            id: 4,
            donorNo: "DON20241216001",
            donorName: "赵六",
            gender: "1",
            age: 28,
            bloodType: "AB",
            diagnosis: "重型颅脑损伤，多器官功能衰竭",
            hospitalName: "青岛儿童医院",
            status: "0",
            reportTime: "2024-12-16 16:45:00",
            reporterName: "孙医生"
          }
        ];
        this.total = this.caseList.length;
      try {
        const response = await donateList(this.queryParams);
        this.caseList = response.rows || response.data || [];
        this.total = response.total || this.caseList.length;
      } catch (error) {
        console.error("获取案例列表失败:", error);
        this.$modal.msgError("获取案例列表失败");
        this.caseList = [];
        this.total = 0;
      } finally {
        this.loading = false;
      }, 500);
      }
    },
    // 转运------------------
    /** 判断是否需要显示转运按钮 */
    shouldShowTransportButton(row) {
      // 只有已同意的案例才能进行转运操作
      // return row.reportStatus == "3" && row.delFlag == 0;
      return row.reportStatus != "4";
    },

    /** 判断是否可以跳转到转运单 */
    canGoToTransport(row) {
      // 需要转运（isTransport === "2"）且没有转运信息（serviceTransport不存在或为空数组）
      return row.isTransport == "2" && row.serviceTransport;
    },

    /** 获取转运按钮文本 */
    getTransportButtonText(row) {
      if (row.isTransport == "2") {
        if (
          row.serviceTransport &&
          Array.isArray(row.serviceTransport) &&
          row.serviceTransport.length > 0
        ) {
          return "查看转运单";
        } else {
          return "前往转运单";
        }
      }
      return "转运";
    },

    /** 获取转运状态标签样式 */
    getTransportStatusTag(row) {
      if (row.isTransport === "1") {
        return "info"; // 不需要转运
      }
      if (
        row.serviceTransport &&
        Array.isArray(row.serviceTransport) &&
        row.serviceTransport.length > 0
      ) {
        // 根据转运单状态显示不同颜色
        const transport = row.serviceTransport[0];
        if (transport.transitStatus) {
          switch (transport.transitStatus.toString()) {
            case "1":
              return "warning"; // 待转运
            case "2":
              return "primary"; // 转运中
            case "3":
              return "success"; // 转运完成
            case "4":
              return "danger"; // 转运取消
            case "5":
              return "info"; // 暂存
            default:
              return "info";
          }
        }
        return "primary"; // 有转运信息但无状态
      }
      return "danger"; // 需要转运但无转运信息
    },

    /** 获取转运状态文本 */
    getTransportStatusText(row) {
      if (row.isTransport === "1") {
        return "无需转运";
      }
      if (
        row.serviceTransport &&
        Array.isArray(row.serviceTransport) &&
        row.serviceTransport.length > 0
      ) {
        const transport = row.serviceTransport[0];
        if (transport.transitStatus) {
          switch (transport.transitStatus.toString()) {
            case "1":
              return "待转运";
            case "2":
              return "转运中";
            case "3":
              return "转运完成";
            case "4":
              return "转运取消";
            case "5":
              return "暂存";
            default:
              return "有转运单";
          }
        }
        return "有转运单";
      }
      return "需转运";
    },

    /** 处理转运操作 */
    async handleTransport(row) {
      try {
        // 先获取最新的案例信息
        const caseData = row;

        if (caseData.isTransport == "2") {
          if (
            caseData.serviceTransport &&
            Array.isArray(caseData.serviceTransport) &&
            caseData.serviceTransport.length > 0
          ) {
            // 已有转运单，跳转到转运单详情页
            const transport = caseData.serviceTransport[0];
            this.goToTransportDetail(transport.id, row.caseNo);
          } else {
            // 没有转运单，跳转到创建转运单页面
            this.goToCreateTransport(row);
          }
        } else {
          this.$message.warning("该案例不需要转运");
        }
      } catch (error) {
        console.error("获取案例信息失败:", error);
        this.$message.error("获取案例信息失败");
      }
    },

    /** 跳转到创建转运单页面 */
    goToCreateTransport(caseData) {
      // 这里可以跳转到创建转运单的页面
      // 方式1：在新页面打开
      this.$router.push({
        path: "/report/transfer",
        query: {
          autoCreate: "true",
          caseId: caseData.id,
          caseNo: caseData.caseNo,
          patName: caseData.name,
          age: caseData.age,
          sex: caseData.sex,
          diagnosisname: caseData.diagnosisname,
          treatmentHospitalName: caseData.treatmenthospitalname
        }
      });

      // 方式2：在当前页面打开弹框（推荐）
      // this.openTransportDialog(caseData);
    },

    /** 打开转运单弹框 */
    openTransportDialog(caseData) {
      this.$modal.confirm({
        title: "创建转运单",
        message: `您将创建案例【${caseData.caseNo} - ${caseData.name}】的转运单，是否继续？`,
        confirmButtonText: "前往创建",
        cancelButtonText: "取消",
        type: "warning",
        beforeClose: (action, instance, done) => {
          if (action === "confirm") {
            // 跳转到转运单创建页面
            this.$router.push({
              path: "/report/transfer",
              query: {
                caseId: caseData.id,
                caseNo: caseData.caseNo,
                patName: caseData.name,
                age: caseData.age,
                sex: caseData.sex,
                diagnosisname: caseData.diagnosisname,
                treatmentHospitalName: caseData.treatmenthospitalname
              }
            });
            done();
          } else {
            done();
          }
        }
      });
    },

    /** 跳转到转运单详情页 */
    goToTransportDetail(transportId, caseNo) {
      this.$router.push({
        path: "/report/transfer",
        query: {
          id: transportId,
          caseNo: caseNo
        }
      });
    },
    // ---------------------------------end
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.id);
      this.single = selection.length !== 1;
      this.multiple = !selection.length;
    },

    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },

    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
      this.queryParams = {
        pageNum: 1,
        pageSize: 10,
        caseNo: undefined,
        name: undefined,
        reportStatus: undefined
      };
      this.getList();
    },

    /** 详情按钮操作 */
    handleDetail(row) {
      this.currentCase = row;
      this.detailTitle = `案例详情 - ${row.donorNo}`;
      this.detailOpen = true;
    async handleDetail(row) {
      try {
        this.currentCase = row;

        // 如果状态是"已上报"(1)，则更新为"已阅读"(2)
        if (this.currentCase.reportStatus === "1") {
          try {
            const updateData = {
              ...this.currentCase,
              reportStatus: "2",
              updateTime: dayjs().format("YYYY-MM-DD HH:mm:ss"),
              updateBy: this.$store.state.user?.name || "当前用户"
            };

            await donateEdit(updateData);
            this.currentCase.reportStatus = "2";
            this.currentCase.updateTime = updateData.updateTime;
            row.reportStatus = "2";
            this.$modal.msgSuccess("状态已更新为已阅读");
          } catch (updateError) {
            console.error("状态更新失败:", updateError);
          }
        }

        this.detailTitle = `案例详情 - ${this.currentCase.caseNo ||
          row.caseNo}`;
        this.detailOpen = true;
        console.log(this.currentCase, "this.currentCase");
      } catch (error) {
        console.error("获取案例详情失败:", error);
        this.currentCase = row;
        this.detailTitle = `案例详情 - ${row.caseNo}`;
        this.detailOpen = true;
      }
    },
    // 在父组件中更新审批方法
    handleApprove(row) {
      this.currentCase = row;
      this.approveForm.caseId = row.id;
      this.approveForm.approveResult = "1";
      this.approveForm.approveOpinion = "";
      this.approveOpen = true;

    /** 编辑按钮操作 */
    async handleEdit(row) {
      try {
        const response = await donateInfo(row.id);
        if (response.code === 200 || response.data) {
          this.isEditing = true;
          const data = response.data || response;

          // 处理附件
          if (data.annexfilesList) {
            this.attachmentFileList = this.parseAttachmentToFileList(
              data.annexfilesList
            );
          } else {
            this.attachmentFileList = [];
          }

          this.currentCase = data;
          this.editForm = { ...data };
          this.editOpen = true;
          this.$nextTick(() => {
            this.$refs.editForm && this.$refs.editForm.clearValidate();
          });
        } else {
          this.$message.error(response.msg || "获取记录失败");
        }
      } catch (error) {
        console.error("获取记录失败:", error);
        this.$modal.msgError("获取记录失败");
      }
    },

    /** 新增按钮操作 */
    handleAdd() {
      this.isEditing = false;
      this.editForm = this.getDefaultFormData();
      this.attachmentFileList = [];
      this.editOpen = true;
      this.$nextTick(() => {
        this.$refs.editForm && this.$refs.editForm.clearValidate();
      });
    },

    /** 审批按钮操作 */
    async handleApprove(row) {
      try {
        const response = await donateInfo(row.id);
        this.currentCase = response.data || response || row;

        this.approveForm.id = row.id;
        this.approveForm.approveResult = "3";
        this.approveForm.approveOpinion = "";

        this.$nextTick(() => {
          if (this.$refs.approveForm) {
            this.$refs.approveForm.clearValidate();
          }
        });

        this.approveOpen = true;
      } catch (error) {
        console.error("获取案例详情失败:", error);
        this.currentCase = row;
        this.approveForm.id = row.id;
        this.approveForm.approveResult = "3";
        this.approveForm.approveOpinion = "";
        this.approveOpen = true;
        this.$modal.msgError("获取详情失败，但已打开审批窗口");
      }
    },

    /** 提交审批 */
    submitApprove() {
      this.$refs["approveForm"].validate(valid => {
    async submitApprove() {
      try {
        const valid = await this.$refs.approveForm.validate();
        if (valid) {
          // 模拟审批提交
          const approveData = {
            ...this.currentCase,
            reportStatus: this.approveForm.approveResult,
            remark: this.approveForm.approveOpinion,
            approvername: this.$store.state.user?.name || "当前用户",
            approvetime: dayjs().format("YYYY-MM-DD HH:mm:ss"),
            updateTime: dayjs().format("YYYY-MM-DD HH:mm:ss"),
            updateBy: this.$store.state.user?.name || "当前用户"
          };

          await donateEdit(approveData);
          this.$modal.msgSuccess("审批成功");
          this.approveOpen = false;
          // 更新案例状态
          const caseItem = this.caseList.find(
            item => item.id === this.approveForm.caseId
          );
          if (caseItem) {
            caseItem.status = this.approveForm.approveResult;
            caseItem.approveTime = new Date().toLocaleString();
            caseItem.approverName = "当前用户";
            caseItem.approveOpinion = this.approveForm.approveOpinion;
          }
          this.getList();
        }
      });
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.$router.push("/case/add");
      } catch (error) {
        console.error("审批失败:", error);
        if (error !== "cancel") {
          this.$modal.msgError("审批失败");
        }
      }
    },

    /** 删除按钮操作 */
    handleDelete(row) {
    async handleDelete(row) {
      const ids = row.id || this.ids;
      this.$modal
        .confirm('是否确认删除住院号为"' + ids + '"的数据项？')
        .then(() => {
          // 模拟删除操作
          this.caseList = this.caseList.filter(item => !ids.includes(item.id));
          this.total = this.caseList.length;
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
      try {
        await this.$modal.confirm(
          '是否确认删除案例编号为"' + ids + '"的数据项？'
        );
        await donateDel(ids);
        this.$modal.msgSuccess("删除成功");
        this.getList();
      } catch (error) {
        if (error !== "cancel") {
          console.error("删除失败:", error);
          this.$modal.msgError("删除失败");
        }
      }
    },

    /** 获取默认表单数据 */
    getDefaultFormData() {
      return {
        id: undefined,
        caseNo: undefined,
        name: undefined,
        sex: undefined,
        age: undefined,
        ageunit: "year",
        bloodType: undefined,
        rhYin: "0",
        birthday: undefined,
        idcardtype: "1",
        idcardno: undefined,
        nation: undefined,
        nationality: undefined,
        nativeplace: undefined,
        education: undefined,
        occupation: undefined,
        phone: undefined,
        // 户籍地址
        registerprovincename: undefined,
        registercityname: undefined,
        registertownname: undefined,
        registercommunityname: undefined,
        registeraddress: undefined,
        // 现住地址
        residenceprovincename: undefined,
        residencecountyname: undefined,
        residencetownname: undefined,
        residencecommunityname: undefined,
        residenceaddress: undefined,
        // 医疗信息
        diagnosisname: undefined,
        illnessoverview: undefined,
        patientstate: undefined,
        gcsScore: undefined,
        infectious: undefined,
        infectiousOther: undefined,
        isTransport: "1",
        // 医院信息
        treatmenthospitalname: undefined,
        treatmentdeptname: undefined,
        inpatientno: undefined,
        deptName: undefined,
        deptNo: undefined,
        toHospital: undefined,
        // 上报信息
        infoName: undefined,
        infoNo: undefined,
        reporterphone: undefined,
        coordinatorName: undefined,
        coordinatorNo: undefined,
        terminationCase: "0",
        reportStatus: "1", // 默认已上报
        // 附件
        annexfilesList: [],
        // 其他
        remark: undefined,
        createBy: undefined,
        createTime: undefined,
        updateBy: undefined,
        updateTime: undefined,
        delFlag: 0
      };
    },

    /** 附件转换 */
    parseAttachmentToFileList(attachments) {
      if (!attachments || !Array.isArray(attachments)) return [];
      return attachments.map((item, index) => ({
        uid: item.id || `attachment-${index}-${Date.now()}`,
        name: item.fileName,
        url: item.path || item.fileUrl,
        status: "success",
        raw: item
      }));
    },

    /** 附件变化处理 */
    handleAttachmentChange(fileList) {
      this.attachmentFileList = fileList;
    },

    /** 附件上传成功处理 */
    handleUploadSuccess({ file, fileList, response }) {
      if (response && response.code === 200) {
        if (!this.editForm.annexfilesList) {
          this.editForm.annexfilesList = [];
        }
        const attachmentObj = {
          fileName: file.name,
          path: response.data || file.url,
          fileUrl: response.data || file.url,
          type: this.getFileExtension(file.name),
          createTime: dayjs().format("YYYY-MM-DD HH:mm:ss"),
          remart: file.raw?.remart || "",
          caseNo: this.editForm.caseNo
        };

        this.editForm.annexfilesList.push(attachmentObj);
        this.$message.success("文件上传成功");
      }
    },

    /** 附件上传错误处理 */
    handleUploadError({ file, fileList, error }) {
      console.error("附件上传失败:", error);
      this.$message.error("文件上传失败，请重试");
    },

    /** 附件移除处理 */
    handleAttachmentRemove(file) {
      if (file.url && this.editForm.annexfilesList) {
        const index = this.editForm.annexfilesList.findIndex(
          item => item.path === file.url || item.fileUrl === file.url
        );
        if (index > -1) {
          this.editForm.annexfilesList.splice(index, 1);
        }
      }
    },

    /** 手动删除附件 */
    handleRemoveAttachment(index) {
      this.editForm.annexfilesList.splice(index, 1);
      this.attachmentFileList.splice(index, 1);
      this.$message.success("附件删除成功");
    },

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

    /** 文件下载 */
    handleDownload(file) {
      const fileUrl = file.path || 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 = fileName
        .split(".")
        .pop()
        .toLowerCase();
      const imageTypes = ["jpg", "jpeg", "png", "gif", "bmp", "webp"];
      const pdfTypes = ["pdf"];
      const officeTypes = ["doc", "docx", "xls", "xlsx"];

      if (imageTypes.includes(extension)) return "image";
      if (pdfTypes.includes(extension)) return "pdf";
      if (officeTypes.includes(extension)) return "office";
      return "other";
    },

    /** 获取文件扩展名 */
    getFileExtension(filename) {
      if (!filename) return "";
      return filename
        .split(".")
        .pop()
        .toLowerCase();
    },

    /** 日期时间格式化 */
    formatDateTime(dateTime) {
      if (!dateTime) return "";
      return dayjs(dateTime).format("YYYY-MM-DD HH:mm:ss");
    },

    /** 关闭编辑对话框 */
    handleEditClose() {
      this.editOpen = false;
      this.currentCase = {};
      this.editForm = this.getDefaultFormData();
      this.attachmentFileList = [];
      this.$nextTick(() => {
        this.$refs.editForm && this.$refs.editForm.clearValidate();
      });
    },

    /** 保存表单 */
    async handleSave() {
      try {
        const valid = await this.$refs.editForm.validate();
        if (!valid) return;

        const pendingFiles = this.attachmentFileList.filter(
          item => item.status !== "success"
        );
        if (pendingFiles.length > 0) {
          this.$message.warning(
            "还有文件未上传完成，请先上传所有文件或移除未上传的文件"
          );
          return;
        }

        this.saveLoading = true;

        const requestData = { ...this.editForm };
        let response;

        if (this.isEditing) {
          response = await donateEdit(requestData);
        } else {
          // 新增时设置创建信息
          requestData.createTime = dayjs().format("YYYY-MM-DD HH:mm:ss");
          requestData.createBy = this.$store.state.user?.name || "当前用户";
          response = await donateAdd(requestData);
        }

        if (response.code === 200) {
          this.$message.success(this.isEditing ? "修改成功" : "新增成功");
          this.handleEditClose();
          this.getList();
        } else {
          this.$message.error(response.msg || "操作失败");
        }
      } catch (error) {
        console.error("保存失败:", error);
        this.$message.error("操作失败，请稍后重试");
      } finally {
        this.saveLoading = false;
      }
    }
  }
};
</script>

<style scoped>
.app-container {
  padding: 20px;
}

.filter-card {
  margin-bottom: 20px;
}

.mb8 {
  margin-bottom: 8px;
}
/* 详情页面样式优化 */
.case-detail-container {
  max-height: 70vh;
  overflow-y: auto;
  padding: 0 10px;
}

.detail-section {
/* 表单区域样式 */
.form-section {
  margin-bottom: 16px;
}

.section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.section-title {
  font-size: 16px;
  font-weight: bold;
  color: #303133;
}

.dialog-footer {
  text-align: right;
  padding: 20px 0 0;
}

/* 附件样式 */
.attachment-section {
  margin-bottom: 16px;
}

.attachment-header {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
  padding: 8px 0;
  border-bottom: 1px solid #ebeef5;
}

.attachment-title {
  font-weight: bold;
  margin: 0 8px;
}

.attachment-tip {
  font-size: 12px;
  color: #909399;
}

.attachment-list {
  margin-top: 16px;
}

.list-title {
  font-weight: bold;
  margin-bottom: 12px;
  color: #303133;
}

.file-name {
  font-size: 13px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 审批弹框样式 */
.approve-dialog >>> .el-dialog__body {
  padding: 0;