| | |
| | | <template> |
| | | <base-stage :stage-data="stageData" :case-info="caseInfo"> |
| | | <template #header> |
| | | <el-alert |
| | | :title="`器官分配 - ${getStatusText()}`" |
| | | :type="getAlertType()" |
| | | :description="getAlertDescription()" |
| | | show-icon |
| | | :closable="false" |
| | | /> |
| | | </template> |
| | | |
| | | <el-row :gutter="20" style="margin-top: 20px;"> |
| | | <el-col :span="8"> |
| | | <el-card> |
| | | <div slot="header" class="card-header"> |
| | | <span>分配概况</span> |
| | | </div> |
| | | <div class="allocation-stats"> |
| | | <div class="stat-item"> |
| | | <span class="label">待分配器官:</span> |
| | | <span class="value">{{ allocationStats.totalOrgans }} 个</span> |
| | | </div> |
| | | <div class="stat-item"> |
| | | <span class="label">已分配器官:</span> |
| | | <span class="value">{{ allocationStats.allocatedOrgans }} 个</span> |
| | | </div> |
| | | <div class="stat-item"> |
| | | <span class="label">分配系统:</span> |
| | | <span class="value">{{ allocationStats.system }}</span> |
| | | </div> |
| | | <div class="stat-item"> |
| | | <span class="label">匹配成功率:</span> |
| | | <el-progress |
| | | :percentage="allocationStats.matchRate" |
| | | :status="allocationStats.matchRate > 80 ? 'success' : 'warning'" |
| | | /> |
| | | </div> |
| | | </div> |
| | | </el-card> |
| | | </el-col> |
| | | |
| | | <el-col :span="8"> |
| | | <el-card> |
| | | <div slot="header" class="card-header"> |
| | | <span>分配时间窗口</span> |
| | | </div> |
| | | <div class="time-window"> |
| | | <div class="time-item"> |
| | | <span class="label">分配开始:</span> |
| | | <span>{{ formatTime(allocationDetails.startTime) }}</span> |
| | | </div> |
| | | <div class="time-item"> |
| | | <span class="label">预计完成:</span> |
| | | <span>{{ formatTime(allocationDetails.estimatedEndTime) }}</span> |
| | | </div> |
| | | <div class="time-item"> |
| | | <span class="label">器官耐受时间:</span> |
| | | <span>{{ allocationDetails.toleranceTime }}</span> |
| | | </div> |
| | | <div class="time-item"> |
| | | <span class="label">剩余时间:</span> |
| | | <el-tag :type="getTimeRemainingType()"> |
| | | {{ allocationDetails.timeRemaining }} |
| | | </el-tag> |
| | | </div> |
| | | </div> |
| | | </el-card> |
| | | </el-col> |
| | | |
| | | <el-col :span="8"> |
| | | <el-card> |
| | | <div slot="header" class="card-header"> |
| | | <span>分配优先级</span> |
| | | </div> |
| | | <el-steps direction="vertical" :active="prioritySteps.active"> |
| | | <el-step |
| | | v-for="step in prioritySteps.steps" |
| | | :key="step.title" |
| | | :title="step.title" |
| | | :description="step.description" |
| | | :status="step.status" |
| | | /> |
| | | </el-steps> |
| | | </el-card> |
| | | </el-col> |
| | | </el-row> |
| | | |
| | | <el-card style="margin-top: 20px;"> |
| | | <div slot="header" class="card-header"> |
| | | <span>器官分配详情</span> |
| | | <el-button type="primary" size="small" @click="handleStartAllocation"> |
| | | 启动自动分配 |
| | | </el-button> |
| | | <div class="organ-allocation-detail"> |
| | | <!-- 基本信息部分 --> |
| | | <el-card class="detail-card"> |
| | | <div slot="header" class="clearfix"> |
| | | <span class="detail-title">器官分配基本信息</span> |
| | | </div> |
| | | <el-table :data="organAllocationData" border> |
| | | <el-table-column label="器官名称" prop="organName" width="120" align="center" /> |
| | | <el-table-column label="器官状态" width="100" align="center"> |
| | | <template slot-scope="scope"> |
| | | <el-tag :type="getOrganStatusTag(scope.row.status)" size="small"> |
| | | {{ scope.row.status }} |
| | | </el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="匹配受体" prop="recipient" width="150" /> |
| | | <el-table-column label="血型匹配" width="100" align="center"> |
| | | <template slot-scope="scope"> |
| | | <el-tag :type="scope.row.bloodMatch ? 'success' : 'warning'"> |
| | | {{ scope.row.bloodMatch ? '匹配' : '待匹配' }} |
| | | </el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="组织配型" width="100" align="center"> |
| | | <template slot-scope="scope"> |
| | | <el-tag :type="scope.row.tissueMatch ? 'success' : 'warning'"> |
| | | {{ scope.row.tissueMatch ? '合格' : '待检测' }} |
| | | </el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="移植医院" prop="hospital" min-width="200" /> |
| | | <el-table-column label="分配时间" width="160" align="center"> |
| | | <template slot-scope="scope"> |
| | | {{ scope.row.allocationTime || '待分配' }} |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="操作" width="120" align="center"> |
| | | <template slot-scope="scope"> |
| | | <el-button type="text" size="small" @click="handleViewMatch(scope.row)"> |
| | | 查看匹配 |
| | | </el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </el-card> |
| | | |
| | | <el-card style="margin-top: 20px;"> |
| | | <div slot="header" class="card-header"> |
| | | <span>分配算法结果</span> |
| | | </div> |
| | | <div class="algorithm-results"> |
| | | <el-form :model="form" ref="form" :rules="rules" label-width="120px"> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="12"> |
| | | <div class="result-item"> |
| | | <h4>匹配评分排名</h4> |
| | | <el-table :data="matchRanking" border size="small"> |
| | | <el-table-column label="排名" width="60" align="center"> |
| | | <el-form-item label="分配状态" prop="allocationStatus"> |
| | | <el-select |
| | | v-model="form.allocationStatus" |
| | | placeholder="请选择分配状态" |
| | | > |
| | | <el-option |
| | | v-for="dict in dict.type.organ_allocation_status || []" |
| | | :key="dict.value" |
| | | :label="dict.label" |
| | | :value="dict.value" |
| | | ></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="分配时间" prop="allocationTime"> |
| | | <el-date-picker |
| | | v-model="form.allocationTime" |
| | | type="datetime" |
| | | value-format="yyyy-MM-dd HH:mm:ss" |
| | | style="width: 100%" |
| | | :disabled="form.allocationStatus == '1'" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | |
| | | <el-row :gutter="20"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="负责人" prop="registrationName"> |
| | | <el-input v-model="form.registrationName" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | </el-card> |
| | | |
| | | <!-- 器官分配记录部分 --> |
| | | <el-card class="allocation-card"> |
| | | <div slot="header" class="clearfix"> |
| | | <span class="detail-title">器官分配记录</span> |
| | | <div style="float: right;"> |
| | | <dict-tag |
| | | :options="dict.type.organ_allocation_status" |
| | | :value="form.allocationStatus" |
| | | /> |
| | | </div> |
| | | </div> |
| | | |
| | | <el-form |
| | | ref="allocationForm" |
| | | :rules="allocationRules" |
| | | :model="allocationData" |
| | | 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" |
| | | :disabled="form.allocationStatus == '1'" |
| | | > |
| | | {{ dict.label }} |
| | | </el-checkbox> |
| | | </el-checkbox-group> |
| | | <el-input |
| | | v-if="showOtherInput" |
| | | v-model="otherOrganInput" |
| | | placeholder="请输入其他器官名称" |
| | | style="margin-top: 10px; width: 300px;" |
| | | :disabled="form.allocationStatus == '1'" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | |
| | | <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="序号" |
| | | type="index" |
| | | width="60" |
| | | align="center" |
| | | fixed |
| | | ></el-table-column> |
| | | |
| | | <el-table-column |
| | | label="分配状态" |
| | | align="center" |
| | | width="100" |
| | | prop="allocationstatus" |
| | | fixed |
| | | > |
| | | <template slot-scope="scope"> |
| | | {{ scope.$index + 1 }} |
| | | <el-tag |
| | | :type=" |
| | | getAllocationStatusTagType(scope.row.allocationstatus) |
| | | " |
| | | size="small" |
| | | > |
| | | {{ getAllocationStatusText(scope.row.allocationstatus) }} |
| | | </el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="受体编号" prop="recipientNo" width="100" /> |
| | | <el-table-column label="匹配分数" prop="matchScore" width="100"> |
| | | |
| | | <el-table-column |
| | | label="器官名称" |
| | | align="center" |
| | | width="120" |
| | | prop="organname" |
| | | > |
| | | <template slot-scope="scope"> |
| | | <el-rate |
| | | v-model="scope.row.matchScore" |
| | | disabled |
| | | show-score |
| | | text-color="#ff9900" |
| | | score-template="{value} 分" |
| | | <el-input |
| | | v-model="scope.row.organname" |
| | | placeholder="器官名称" |
| | | :disabled="true" |
| | | /> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="推荐器官" prop="recommendedOrgan" /> |
| | | |
| | | <!-- <el-table-column |
| | | label="分配系统编号" |
| | | align="center" |
| | | width="150" |
| | | prop="caseno" |
| | | > |
| | | <template slot-scope="scope"> |
| | | <el-input |
| | | v-model="scope.row.caseno" |
| | | placeholder="分配系统编号" |
| | | :disabled=" |
| | | form.allocationStatus == '1' || |
| | | scope.row.allocationstatus == '3' |
| | | " |
| | | /> |
| | | </template> |
| | | </el-table-column> --> |
| | | |
| | | <el-table-column |
| | | label="分配开始时间" |
| | | align="center" |
| | | width="180" |
| | | prop="applicanttime" |
| | | > |
| | | <template slot-scope="scope"> |
| | | <el-date-picker |
| | | clearable |
| | | size="small" |
| | | style="width: 100%" |
| | | v-model="scope.row.applicanttime" |
| | | type="datetime" |
| | | value-format="yyyy-MM-dd HH:mm:ss" |
| | | placeholder="选择开始接收时间" |
| | | :disabled=" |
| | | form.allocationStatus == '1' || |
| | | scope.row.allocationstatus == '3' |
| | | " |
| | | /> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | label="分配接收时间" |
| | | align="center" |
| | | width="180" |
| | | 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="选择分配接收时间" |
| | | :disabled=" |
| | | form.allocationStatus == '1' || |
| | | scope.row.allocationstatus == '3' |
| | | " |
| | | /> |
| | | </template> |
| | | </el-table-column> |
| | | |
| | | <el-table-column |
| | | label="受体姓氏" |
| | | align="center" |
| | | width="120" |
| | | prop="name" |
| | | > |
| | | <template slot-scope="scope"> |
| | | <el-input |
| | | v-model="scope.row.name" |
| | | placeholder="受体姓氏" |
| | | :disabled=" |
| | | form.allocationStatus == '1' || |
| | | scope.row.allocationstatus == '3' |
| | | " |
| | | /> |
| | | </template> |
| | | </el-table-column> |
| | | |
| | | <el-table-column |
| | | label="移植医院" |
| | | align="center" |
| | | width="200" |
| | | prop="transplanthospitalname" |
| | | > |
| | | <template slot-scope="scope"> |
| | | <el-autocomplete |
| | | v-model="scope.row.transplanthospitalname" |
| | | :fetch-suggestions="queryHospitalSearch" |
| | | placeholder="请选择或输入移植医院" |
| | | style="width: 100%" |
| | | clearable |
| | | ></el-autocomplete> |
| | | </template> |
| | | <!-- <template slot-scope="scope"> |
| | | <el-select |
| | | v-model="scope.row.transplanthospitalname" |
| | | 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> --> |
| | | </el-table-column> |
| | | |
| | | <!-- 修改template中的说明列 --> |
| | | <el-table-column |
| | | label="说明" |
| | | align="center" |
| | | prop="reallocationreason" |
| | | min-width="200" |
| | | > |
| | | <template slot-scope="scope"> |
| | | <div v-if="scope.row.allocationstatus != '3'"> |
| | | <el-input |
| | | type="textarea" |
| | | clearable |
| | | v-model="scope.row.reallocationreason" |
| | | placeholder="请输入说明" |
| | | :disabled=" |
| | | form.allocationStatus == '1' || |
| | | scope.row.allocationstatus == '3' |
| | | " |
| | | /> |
| | | </div> |
| | | <div v-else> |
| | | <!-- 重分配记录:显示详细查看按钮 --> |
| | | <el-button |
| | | v-if="scope.row.reallocationreason" |
| | | type="text" |
| | | size="small" |
| | | @click="handleViewRedistributionDetail(scope.row)" |
| | | style="color: #e6a23c;" |
| | | > |
| | | <i class="el-icon-document"></i> |
| | | 查看重分配详情 |
| | | </el-button> |
| | | <span v-else class="no-data">-</span> |
| | | |
| | | <!-- 保留原有的工具提示(可移除或保留) --> |
| | | <el-tooltip |
| | | v-if="scope.row.redistributionInfo" |
| | | :content=" |
| | | formatRedistributionTooltip( |
| | | scope.row.redistributionInfo |
| | | ) |
| | | " |
| | | placement="top" |
| | | > |
| | | <el-button |
| | | type="text" |
| | | size="small" |
| | | style="margin-left: 5px;" |
| | | > |
| | | <i class="el-icon-info"></i> |
| | | </el-button> |
| | | </el-tooltip> |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | | |
| | | <el-table-column |
| | | label="操作" |
| | | align="center" |
| | | width="120" |
| | | class-name="small-padding fixed-width" |
| | | v-if="form.allocationStatus !== '1'" |
| | | fixed="right" |
| | | > |
| | | <template slot-scope="scope"> |
| | | <el-button |
| | | size="mini" |
| | | type="text" |
| | | icon="el-icon-copy-document" |
| | | @click="handleRedistribution(scope.row)" |
| | | :disabled="scope.row.allocationstatus == '3'" |
| | | style="color: #e6a23c;" |
| | | > |
| | | {{ |
| | | scope.row.allocationstatus == "3" |
| | | ? "已重分配" |
| | | : "重分配" |
| | | }} |
| | | </el-button> |
| | | <el-button |
| | | v-if="scope.row.allocationstatus != '3'" |
| | | size="mini" |
| | | type="text" |
| | | icon="el-icon-delete" |
| | | @click="handleInvalidate(scope.row)" |
| | | :disabled=" |
| | | scope.row.allocationstatus == '3' || |
| | | scope.row.allocationstatus == '2' |
| | | " |
| | | style="color: #f56c6c;" |
| | | > |
| | | {{ |
| | | scope.row.allocationstatus == "2" ? "已作废" : "作废" |
| | | }} |
| | | </el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </div> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <div class="result-item"> |
| | | <h4>分配因素权重</h4> |
| | | <div class="weight-distribution"> |
| | | <div v-for="factor in allocationFactors" :key="factor.name" class="factor-item"> |
| | | <span class="factor-name">{{ factor.name }}</span> |
| | | <el-progress |
| | | :percentage="factor.weight" |
| | | :show-text="false" |
| | | :color="factor.color" |
| | | /> |
| | | <span class="factor-percent">{{ factor.weight }}%</span> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </div> |
| | | |
| | | <!-- 分配统计信息 --> |
| | | <!-- <div |
| | | class="allocation-stats" |
| | | v-if=" |
| | | allocationData.serviceDonateorganList && |
| | | allocationData.serviceDonateorganList.length > 0 |
| | | " |
| | | > |
| | | <el-row :gutter="20"> |
| | | <el-col :span="6"> |
| | | <div class="stat-item"> |
| | | <span class="stat-label">已分配器官:</span> |
| | | <span class="stat-value" |
| | | >{{ allocationData.serviceDonateorganList.length }} 个</span |
| | | > |
| | | </div> |
| | | </el-col> |
| | | <el-col :span="6"> |
| | | <div class="stat-item"> |
| | | <span class="stat-label">待审核:</span> |
| | | <span class="stat-value">{{ pendingReviewCount }} 个</span> |
| | | </div> |
| | | </el-col> |
| | | <el-col :span="6"> |
| | | <div class="stat-item"> |
| | | <span class="stat-label">涉及医院:</span> |
| | | <span class="stat-value">{{ uniqueHospitals }} 家</span> |
| | | </div> |
| | | </el-col> |
| | | <el-col :span="6"> |
| | | <div class="stat-item"> |
| | | <span class="stat-label">重分配:</span> |
| | | <span class="stat-value">{{ redistributedCount }} 个</span> |
| | | </div> |
| | | </el-col> |
| | | </el-row> |
| | | </div> --> |
| | | |
| | | <div |
| | | v-if=" |
| | | !allocationData.serviceDonateorganList || |
| | | allocationData.serviceDonateorganList.length == 0 |
| | | " |
| | | class="empty-allocation" |
| | | > |
| | | <el-empty description="暂无分配记录" :image-size="80"> |
| | | <span>请先选择要分配的器官</span> |
| | | </el-empty> |
| | | </div> |
| | | </el-form> |
| | | </el-card> |
| | | |
| | | <template #footer> |
| | | <div class="action-buttons" style="margin-top: 20px; text-align: center;"> |
| | | <el-button type="primary" @click="handleAutoAllocation"> |
| | | 智能分配 |
| | | </el-button> |
| | | <el-button type="success" @click="handleConfirmAllocation"> |
| | | 确认分配结果 |
| | | </el-button> |
| | | <el-button type="warning" @click="handleManualAdjust"> |
| | | 手动调整 |
| | | <!-- 附件管理部分优化 --> |
| | | <el-card class="attachment-card"> |
| | | <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" |
| | | :multiple="true" |
| | | @change="handleAttachmentChange" |
| | | @upload-success="handleUploadSuccess" |
| | | @upload-error="handleUploadError" |
| | | @remove="handleAttachmentRemove" |
| | | /> |
| | | |
| | | <!-- 附件列表展示 --> |
| | | <div class="attachment-list" v-if="attachments && attachments.length > 0"> |
| | | <div class="list-title">已上传附件 ({{ attachments.length }})</div> |
| | | <el-table :data="attachments" style="width: 100%" size="small"> |
| | | <el-table-column label="文件名" min-width="150"> |
| | | <template slot-scope="scope"> |
| | | <i |
| | | class="el-icon-document" |
| | | :style="{ color: getFileIconColor(scope.row.fileName) }" |
| | | ></i> |
| | | <span class="file-name">{{ scope.row.fileName }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="文件类型" width="100"> |
| | | <template slot-scope="scope"> |
| | | <el-tag :type="getFileTagType(scope.row.fileName)" size="small"> |
| | | {{ getFileTypeText(scope.row.fileName) }} |
| | | </el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="上传时间" width="160"> |
| | | <template slot-scope="scope"> |
| | | <span>{{ formatDateTime(scope.row.uploadTime) }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="文件大小" width="100"> |
| | | <template slot-scope="scope"> |
| | | <span>{{ formatFileSize(scope.row.fileSize) }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="操作" width="280" fixed="right"> |
| | | <template slot-scope="scope"> |
| | | <el-button |
| | | size="mini" |
| | | type="primary" |
| | | @click="handlePreview(scope.row)" |
| | | :disabled="!isPreviewable(scope.row.fileName)" |
| | | > |
| | | 预览 |
| | | </el-button> |
| | | <el-button |
| | | size="mini" |
| | | type="success" |
| | | @click="handleDownloadAttachment(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> |
| | | <div style="text-align: center; margin: 30px 0;"> |
| | | <el-button type="primary" @click="handleSave" :loading="saveLoading"> |
| | | 保存 |
| | | </el-button> |
| | | <el-button |
| | | type="success" |
| | | @click="handleConfirmAllocation" |
| | | :disabled="form.allocationStatus == '1'" |
| | | :loading="confirmLoading" |
| | | > |
| | | 确认分配 |
| | | </el-button> |
| | | </div> |
| | | <!-- 重分配对话框 --> |
| | | <el-dialog |
| | | title="器官重分配" |
| | | :visible.sync="redistributionDialogVisible" |
| | | width="500px" |
| | | @close="handleRedistributionDialogClose" |
| | | > |
| | | <el-form |
| | | :model="redistributionForm" |
| | | :rules="redistributionRules" |
| | | ref="redistributionFormRef" |
| | | label-width="100px" |
| | | > |
| | | <el-form-item label="原器官信息"> |
| | | <el-input v-model="redistributionForm.organname" readonly /> |
| | | </el-form-item> |
| | | <el-form-item label="重分配原因" prop="reason" required> |
| | | <el-input |
| | | type="textarea" |
| | | :rows="4" |
| | | v-model="redistributionForm.reason" |
| | | placeholder="请输入重分配原因" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="重分配时间" prop="redistributionTime" required> |
| | | <el-date-picker |
| | | v-model="redistributionForm.redistributionTime" |
| | | type="datetime" |
| | | placeholder="请选择重分配时间" |
| | | value-format="yyyy-MM-dd HH:mm:ss" |
| | | style="width: 100%" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="重分配附件"> |
| | | <UploadAttachment |
| | | ref="redistributionAttachmentUpload" |
| | | :file-list="redistributionAttachmentList" |
| | | :limit="5" |
| | | :accept="attachmentAccept" |
| | | :multiple="true" |
| | | @change="handleRedistributionChange" |
| | | @upload-success="handleRedistributionUploadSuccess" |
| | | @upload-error="handleRedistributionUploadError" |
| | | @remove="handleRedistributionAttachmentRemove" |
| | | /> |
| | | <div style="margin-top: 5px; font-size: 12px; color: #999;"> |
| | | 支持上传重分配相关文件 (最多5个) |
| | | </div> |
| | | </el-form-item> |
| | | </el-form> |
| | | <div slot="footer"> |
| | | <el-button @click="redistributionDialogVisible = false">取消</el-button> |
| | | <el-button |
| | | type="primary" |
| | | @click="handleRedistributionConfirm" |
| | | :loading="redistributionLoading" |
| | | > |
| | | 确认重分配 |
| | | </el-button> |
| | | </div> |
| | | </template> |
| | | </base-stage> |
| | | </el-dialog> |
| | | <!-- 在template中添加重分配详情弹窗 --> |
| | | <el-dialog |
| | | title="重分配详情" |
| | | :visible.sync="redistributionDetailDialogVisible" |
| | | width="600px" |
| | | > |
| | | <div v-loading="redistributionDetailLoading"> |
| | | <div v-if="currentRedistributionDetail" style="padding: 20px;"> |
| | | <!-- 基本信息 --> |
| | | <el-descriptions title="重分配信息" :column="2" border> |
| | | <el-descriptions-item label="器官名称"> |
| | | {{ currentRedistributionDetail.organname || "-" }} |
| | | </el-descriptions-item> |
| | | <el-descriptions-item label="操作人"> |
| | | {{ currentRedistributionDetail.operator || "-" }} |
| | | </el-descriptions-item> |
| | | <el-descriptions-item label="操作时间"> |
| | | {{ |
| | | currentRedistributionDetail.operatorTime |
| | | ? formatDateTime(currentRedistributionDetail.operatorTime) |
| | | : "-" |
| | | }} |
| | | </el-descriptions-item> |
| | | <el-descriptions-item label="重分配时间"> |
| | | {{ |
| | | currentRedistributionDetail.redistributionTime |
| | | ? formatDateTime( |
| | | currentRedistributionDetail.redistributionTime |
| | | ) |
| | | : "-" |
| | | }} |
| | | </el-descriptions-item> |
| | | </el-descriptions> |
| | | |
| | | <!-- 重分配原因 --> |
| | | <div style="margin-top: 20px;"> |
| | | <div class="section-title">重分配原因</div> |
| | | <div |
| | | class="section-content" |
| | | style="padding: 10px; background: #f5f7fa; border-radius: 4px;" |
| | | > |
| | | {{ currentRedistributionDetail.reason || "无" }} |
| | | </div> |
| | | </div> |
| | | |
| | | <!-- 重分配附件 --> |
| | | <div |
| | | style="margin-top: 20px;" |
| | | v-if=" |
| | | currentRedistributionDetail.attachments && |
| | | currentRedistributionDetail.attachments.length > 0 |
| | | " |
| | | > |
| | | <div class="section-title"> |
| | | 重分配附件 ({{ currentRedistributionDetail.attachments.length }}) |
| | | </div> |
| | | <div class="redistribution-attachments"> |
| | | <el-table |
| | | :data="currentRedistributionDetail.attachments" |
| | | size="small" |
| | | style="width: 100%" |
| | | > |
| | | <el-table-column label="文件名" min-width="150"> |
| | | <template slot-scope="scope"> |
| | | <i |
| | | class="el-icon-document" |
| | | :style="{ color: getFileIconColor(scope.row.fileName) }" |
| | | ></i> |
| | | <span class="file-name">{{ scope.row.fileName }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="文件类型" width="100"> |
| | | <template slot-scope="scope"> |
| | | <el-tag |
| | | :type="getFileTagType(scope.row.fileName)" |
| | | size="small" |
| | | > |
| | | {{ getFileTypeText(scope.row.fileName) }} |
| | | </el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="上传时间" width="150"> |
| | | <template slot-scope="scope"> |
| | | <span>{{ |
| | | scope.row.uploadTime |
| | | ? formatDateTime(scope.row.uploadTime) |
| | | : "-" |
| | | }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="操作" width="150" fixed="right"> |
| | | <template slot-scope="scope"> |
| | | <el-button |
| | | size="mini" |
| | | type="primary" |
| | | @click="handleRedistributionAttachmentPreview(scope.row)" |
| | | :disabled="!isPreviewable(scope.row.fileName)" |
| | | > |
| | | 预览 |
| | | </el-button> |
| | | <el-button |
| | | size="mini" |
| | | type="success" |
| | | @click="handleRedistributionAttachmentDownload(scope.row)" |
| | | > |
| | | 下载 |
| | | </el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </div> |
| | | </div> |
| | | |
| | | <div |
| | | v-else |
| | | style="margin-top: 20px; text-align: center; color: #909399;" |
| | | > |
| | | 无重分配附件 |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div slot="footer"> |
| | | <el-button @click="redistributionDetailDialogVisible = false" |
| | | >关闭</el-button |
| | | > |
| | | </div> |
| | | </el-dialog> |
| | | <!-- 附件预览对话框 --> |
| | | <FilePreviewDialog |
| | | :visible="filePreviewVisible" |
| | | :file="currentPreviewFile" |
| | | @close="filePreviewVisible = false" |
| | | @download="handleDownloadAttachment" |
| | | /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import BaseStage from './BaseStage.vue'; |
| | | import { |
| | | allocationList, |
| | | allocationadd, |
| | | allocationedit, |
| | | donateorganBaseinfoInfo |
| | | } from "@/api/businessApi"; |
| | | import UploadAttachment from "@/components/UploadAttachment"; |
| | | import FilePreviewDialog from "@/components/FilePreviewDialog"; |
| | | import OrgSelecter from "@/views/project/components/orgselect"; |
| | | import CaseBasicInfo from "@/components/CaseBasicInfo"; |
| | | import dayjs from "dayjs"; |
| | | |
| | | export default { |
| | | name: 'OrganAllocationStage', |
| | | components: { BaseStage }, |
| | | name: "OrganAllocationDetail", |
| | | components: { |
| | | UploadAttachment, |
| | | OrgSelecter, |
| | | FilePreviewDialog, |
| | | CaseBasicInfo |
| | | }, |
| | | dicts: [ |
| | | "sys_BloodType", |
| | | "sys_DonationCategory", |
| | | "sys_RecordState", |
| | | "sys_Organ", |
| | | "Geta_hospital", |
| | | |
| | | "organ_allocation_status" |
| | | ], |
| | | props: { |
| | | stageData: { |
| | | type: Object, |
| | | default: () => ({}) |
| | | }, |
| | | caseInfo: { |
| | | type: Object, |
| | | default: () => ({}) |
| | | infoid: { |
| | | type: String, |
| | | default: true |
| | | } |
| | | }, |
| | | data() { |
| | | return { |
| | | allocationStats: { |
| | | totalOrgans: 3, |
| | | allocatedOrgans: 0, |
| | | system: '中国人体器官分配与共享计算机系统', |
| | | matchRate: 0 |
| | | caseId: null, |
| | | // 重分配详情相关 |
| | | redistributionDetailDialogVisible: false, |
| | | redistributionDetailLoading: false, |
| | | currentRedistributionDetail: null, |
| | | // 表单数据 |
| | | form: { |
| | | id: undefined, |
| | | infoid: undefined, |
| | | donationcategory: "", |
| | | caseNo: "", |
| | | donorno: "", |
| | | treatmenthospitalname: "", |
| | | treatmenthospitalno: "", |
| | | sex: "", |
| | | name: "", |
| | | age: "", |
| | | bloodtype: "", |
| | | idcardno: "", |
| | | diagnosisname: "", |
| | | allocationStatus: "0", // 0:未分配;1:已分配;2作废 |
| | | allocationTime: "", |
| | | registrationCode: "", |
| | | registrationName: "", |
| | | registrationTime: "", |
| | | attachments: [] // 添加附件字段 |
| | | }, |
| | | allocationDetails: { |
| | | startTime: '2025-12-04 10:00:00', |
| | | estimatedEndTime: '2025-12-04 12:00:00', |
| | | toleranceTime: '肝脏:12小时,肾脏:24小时,心脏:8小时,肺脏:12小时', |
| | | timeRemaining: '2小时' |
| | | }, |
| | | prioritySteps: { |
| | | active: 3, |
| | | steps: [ |
| | | { |
| | | title: '病情危重优先', |
| | | description: '根据患者病情危重程度分配[1](@ref)', |
| | | status: 'finish' |
| | | }, |
| | | { |
| | | title: '组织配型优先', |
| | | description: '组织配型匹配度高的患者优先', |
| | | status: 'finish' |
| | | }, |
| | | { |
| | | title: '血型相同优先', |
| | | description: '血型匹配的患者优先考虑', |
| | | status: 'finish' |
| | | }, |
| | | { |
| | | title: '儿童匹配优先', |
| | | description: '儿童患者享有优先分配权', |
| | | status: 'wait' |
| | | } |
| | | // 附件预览相关 |
| | | attachmentPreviewVisible: false, |
| | | currentAttachmentList: [], |
| | | attachmentPreviewTitle: "", |
| | | dataList: [], |
| | | // 表单验证规则 |
| | | rules: { |
| | | name: [ |
| | | { required: true, message: "捐献者姓名不能为空", trigger: "blur" } |
| | | ], |
| | | diagnosisname: [ |
| | | { required: true, message: "疾病诊断不能为空", trigger: "blur" } |
| | | ] |
| | | }, |
| | | organAllocationData: [ |
| | | { |
| | | organName: '肝脏', |
| | | status: '待分配', |
| | | recipient: '', |
| | | bloodMatch: false, |
| | | tissueMatch: false, |
| | | hospital: '', |
| | | allocationTime: '' |
| | | }, |
| | | { |
| | | organName: '肾脏', |
| | | status: '待分配', |
| | | recipient: '', |
| | | bloodMatch: false, |
| | | tissueMatch: false, |
| | | hospital: '', |
| | | allocationTime: '' |
| | | }, |
| | | { |
| | | organName: '心脏', |
| | | status: '待分配', |
| | | recipient: '', |
| | | bloodMatch: false, |
| | | tissueMatch: false, |
| | | hospital: '', |
| | | allocationTime: '' |
| | | } |
| | | ], |
| | | matchRanking: [ |
| | | { |
| | | recipientNo: 'R202512001', |
| | | matchScore: 4.8, |
| | | recommendedOrgan: '肝脏' |
| | | }, |
| | | { |
| | | recipientNo: 'R202512002', |
| | | matchScore: 4.5, |
| | | recommendedOrgan: '肾脏' |
| | | }, |
| | | { |
| | | recipientNo: 'R202512003', |
| | | matchScore: 4.3, |
| | | recommendedOrgan: '心脏' |
| | | } |
| | | ], |
| | | allocationFactors: [ |
| | | { name: '病情危重程度', weight: 35, color: '#f56c6c' }, |
| | | { name: '组织配型匹配', weight: 25, color: '#e6a23c' }, |
| | | { name: '等待时间', weight: 15, color: '#5cb87a' }, |
| | | { name: '地理因素', weight: 10, color: '#6f7ad3' }, |
| | | { name: '年龄因素', weight: 15, color: '#8e44ad' } |
| | | ] |
| | | // 分配记录验证规则 |
| | | allocationRules: {}, |
| | | // 重分配验证规则 |
| | | redistributionRules: { |
| | | reason: [ |
| | | { required: true, message: "重分配原因不能为空", trigger: "blur" } |
| | | ], |
| | | redistributionTime: [ |
| | | { required: true, message: "重分配时间不能为空", trigger: "blur" } |
| | | ] |
| | | }, |
| | | // 保存加载状态 |
| | | saveLoading: false, |
| | | confirmLoading: false, |
| | | redistributionLoading: false, |
| | | // 加载状态 |
| | | loading: false, |
| | | // 选中的器官(存储字典value) |
| | | selectedOrgans: [], |
| | | // 其他器官输入 |
| | | otherOrganInput: "", |
| | | // 医院列表 |
| | | hospitalList: [], |
| | | // 分配记录数据 |
| | | allocationData: { |
| | | serviceDonateorganList: [] |
| | | }, |
| | | // 附件数据 |
| | | attachments: [], |
| | | attachmentFileList: [], |
| | | // 附件相关配置 |
| | | attachmentLimit: 10, |
| | | attachmentAccept: |
| | | ".pdf,.jpg,.jpeg,.png,.doc,.docx,.xls,.xlsx,.ppt,.pptx,.txt", |
| | | // 重分配对话框 |
| | | redistributionDialogVisible: false, |
| | | redistributionForm: { |
| | | organname: "", |
| | | reason: "", |
| | | redistributionTime: "" |
| | | }, |
| | | redistributionAttachmentList: [], |
| | | redistributionFormRef: null, |
| | | currentRedistributeRecord: null, |
| | | // 文件预览相关 |
| | | filePreviewVisible: false, |
| | | currentPreviewFile: null, |
| | | filePreviewTitle: "" |
| | | }; |
| | | }, |
| | | methods: { |
| | | getStatusText() { |
| | | const status = this.stageData.status; |
| | | return status === 'completed' ? '已完成' : |
| | | status === 'in_progress' ? '进行中' : '未开始'; |
| | | computed: { |
| | | // 当前用户信息 |
| | | currentUser() { |
| | | return JSON.parse(sessionStorage.getItem("user") || "{}"); |
| | | }, |
| | | getAlertType() { |
| | | const status = this.stageData.status; |
| | | return status === 'completed' ? 'success' : |
| | | status === 'in_progress' ? 'warning' : 'info'; |
| | | displayOrgans() { |
| | | return (this.allocationData.serviceDonateorganList || []).filter( |
| | | item => item.delFlag !== 1 |
| | | ); |
| | | }, |
| | | getAlertDescription() { |
| | | const status = this.stageData.status; |
| | | if (status === 'completed') { |
| | | return '器官分配已完成,所有器官均已成功匹配受体'; |
| | | } else if (status === 'in_progress') { |
| | | return '器官分配进行中,系统正在自动匹配最佳受体'; |
| | | } |
| | | return '等待开始器官分配流程'; |
| | | // 不完整的记录数量 |
| | | incompleteRecords() { |
| | | if (!this.allocationData.serviceDonateorganList) return 0; |
| | | return this.allocationData.serviceDonateorganList.filter( |
| | | record => |
| | | !record.applicanttime || |
| | | !record.organgettime || |
| | | !record.name || |
| | | !record.transplanthospitalname |
| | | ).length; |
| | | }, |
| | | getOrganStatusTag(status) { |
| | | const map = { |
| | | '已分配': 'success', |
| | | '分配中': 'warning', |
| | | '待分配': 'info' |
| | | // 待审核记录数量 |
| | | pendingReviewCount() { |
| | | if (!this.allocationData.serviceDonateorganList) return 0; |
| | | return this.allocationData.serviceDonateorganList.filter( |
| | | record => record.allocationstatus == "0" |
| | | ).length; |
| | | }, |
| | | // 重分配记录数量 |
| | | redistributedCount() { |
| | | if (!this.allocationData.serviceDonateorganList) return 0; |
| | | return this.allocationData.serviceDonateorganList.filter( |
| | | record => record.allocationstatus == "3" |
| | | ).length; |
| | | }, |
| | | uniqueHospitals() { |
| | | if (!this.allocationData.serviceDonateorganList) return 0; |
| | | const hospitals = this.allocationData.serviceDonateorganList |
| | | .map(record => record.transplanthospitalname) |
| | | .filter(Boolean); |
| | | return new Set(hospitals).size; |
| | | }, |
| | | // 获取器官字典 |
| | | organDict() { |
| | | return this.dict.type.sys_Organ || []; |
| | | }, |
| | | // 判断是否需要显示其他输入框 |
| | | showOtherInput() { |
| | | return this.selectedOrgans.includes("C01"); // 假设"其他"的字典值是C01 |
| | | }, |
| | | // 分配状态字典映射 |
| | | allocationStatusDict() { |
| | | return { |
| | | "0": { label: "提交分配", type: "info" }, |
| | | "1": { label: "审核通过", type: "success" }, |
| | | "2": { label: "已作废", type: "danger" }, |
| | | "3": { label: "重分配", type: "warning" } |
| | | }; |
| | | return map[status] || 'info'; |
| | | } |
| | | }, |
| | | 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 |
| | | }, |
| | | getTimeRemainingType() { |
| | | return this.allocationDetails.timeRemaining.includes('小时') ? 'success' : 'danger'; |
| | | // 监听其他器官输入变化 |
| | | otherOrganInput(newValue) { |
| | | if (newValue && this.selectedOrgans.includes("C01")) { |
| | | // 更新器官字典中的"其他"标签显示 |
| | | const otherRecord = this.allocationData.serviceDonateorganList.find( |
| | | item => item.organname && item.organname.includes("其他") |
| | | ); |
| | | if (otherRecord) { |
| | | otherRecord.organname = `其他(${newValue})`; |
| | | } |
| | | } |
| | | } |
| | | }, |
| | | created() { |
| | | this.caseId = this.infoid; |
| | | this.initData(); |
| | | }, |
| | | methods: { |
| | | // 获取分配状态标签类型 |
| | | getAllocationStatusTagType(status) { |
| | | const statusMap = this.allocationStatusDict; |
| | | return statusMap[status] ? statusMap[status].type : "info"; |
| | | }, |
| | | handleStartAllocation() { |
| | | this.$confirm('确认启动自动器官分配吗?', '提示', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }).then(() => { |
| | | this.$message.success('已启动自动分配算法'); |
| | | // 模拟分配过程 |
| | | this.allocationStats.allocatedOrgans = 3; |
| | | this.allocationStats.matchRate = 95; |
| | | this.organAllocationData.forEach(organ => { |
| | | organ.status = '已分配'; |
| | | organ.allocationTime = new Date().toISOString().replace('T', ' ').substring(0, 19); |
| | | }); |
| | | |
| | | // 获取分配状态文本 |
| | | getAllocationStatusText(status) { |
| | | const statusMap = this.allocationStatusDict; |
| | | return statusMap[status] ? statusMap[status].label : "未知状态"; |
| | | }, |
| | | queryHospitalSearch(queryString, cb) { |
| | | const hospitals = this.dict.type.Geta_hospital || []; |
| | | const results = queryString |
| | | ? hospitals.filter(item => |
| | | item.label.toLowerCase().includes(queryString.toLowerCase()) |
| | | ) |
| | | : hospitals; |
| | | |
| | | // el-autocomplete 需要 value 字段 |
| | | cb(results.map(item => ({ value: item.label }))); |
| | | }, |
| | | // 查看重分配详情 |
| | | handleViewRedistributionDetail(row) { |
| | | this.redistributionDetailLoading = true; |
| | | this.redistributionDetailDialogVisible = true; |
| | | |
| | | try { |
| | | if (row.redistributionInfo) { |
| | | // 解析重分配信息 |
| | | const redistributionInfo = JSON.parse(row.redistributionInfo); |
| | | this.currentRedistributionDetail = { |
| | | organname: row.organname || "-", |
| | | ...redistributionInfo |
| | | }; |
| | | } else { |
| | | this.currentRedistributionDetail = { |
| | | organname: row.organname || "-", |
| | | reason: "无重分配原因", |
| | | attachments: [] |
| | | }; |
| | | } |
| | | } catch (error) { |
| | | console.error("解析重分配信息失败:", error); |
| | | this.$message.error("重分配信息解析失败"); |
| | | this.currentRedistributionDetail = { |
| | | organname: row.organname || "-", |
| | | reason: "重分配信息格式错误", |
| | | attachments: [] |
| | | }; |
| | | } finally { |
| | | this.redistributionDetailLoading = false; |
| | | } |
| | | }, |
| | | |
| | | // 预览重分配附件 |
| | | handleRedistributionAttachmentPreview(file) { |
| | | this.currentPreviewFile = { |
| | | fileName: file.fileName, |
| | | fileUrl: file.path || file.fileUrl, |
| | | fileType: this.getFileType(file.fileName) |
| | | }; |
| | | this.filePreviewVisible = true; |
| | | }, |
| | | |
| | | // 下载重分配附件 |
| | | handleRedistributionAttachmentDownload(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("文件路径不存在,无法下载"); |
| | | } |
| | | }, |
| | | |
| | | // 增强格式化工具提示方法 |
| | | formatRedistributionTooltip(redistributionInfo) { |
| | | if (!redistributionInfo) return ""; |
| | | try { |
| | | const info = JSON.parse(redistributionInfo); |
| | | let tooltip = `重分配原因: ${info.reason}\n重分配时间: ${info.redistributionTime}`; |
| | | |
| | | // 添加附件信息 |
| | | if (info.attachments && info.attachments.length > 0) { |
| | | tooltip += `\n\n附件(${info.attachments.length}个):`; |
| | | info.attachments.forEach((att, index) => { |
| | | tooltip += `\n${index + 1}. ${att.fileName}`; |
| | | }); |
| | | } |
| | | |
| | | return tooltip; |
| | | } catch (error) { |
| | | return redistributionInfo; |
| | | } |
| | | }, |
| | | // 根据字典value获取label |
| | | getOrganLabel(organValue) { |
| | | const dictItem = this.organDict.find(item => item.value == organValue); |
| | | return dictItem ? dictItem.label : organValue; |
| | | }, |
| | | |
| | | // 初始化数据 |
| | | initData() { |
| | | const infoid = this.infoid; |
| | | |
| | | if (!infoid) { |
| | | this.$message.error("缺少必要的路由参数 infoid"); |
| | | this.$router.back(); |
| | | return; |
| | | } |
| | | |
| | | this.form.infoid = infoid; |
| | | this.form.registrationName = |
| | | this.currentUser.nickName || this.currentUser.username || "当前用户"; |
| | | this.form.registrationTime = new Date() |
| | | .toISOString() |
| | | .replace("T", " ") |
| | | .substring(0, 19); |
| | | |
| | | if (infoid) { |
| | | this.getDetail(infoid); |
| | | } else { |
| | | this.generateDonorNo(); |
| | | } |
| | | |
| | | this.getHospitalData(); |
| | | }, |
| | | |
| | | // 生成捐献者编号 |
| | | generateDonorNo() { |
| | | const timestamp = Date.now().toString(); |
| | | this.form.donorno = "D" + timestamp.slice(-8); |
| | | this.form.caseNo = "CASE" + timestamp.slice(-6); |
| | | }, |
| | | |
| | | // 解析 filePatch 字段 |
| | | parseFilePatch(filePatch) { |
| | | if (!filePatch) { |
| | | this.form.attachments = []; |
| | | return; |
| | | } |
| | | |
| | | try { |
| | | this.form.attachments = JSON.parse(filePatch); |
| | | } catch (error) { |
| | | console.error("解析 filePatch 字段失败:", error); |
| | | this.form.attachments = []; |
| | | } |
| | | }, |
| | | |
| | | // 获取详情 |
| | | async getDetail(infoid, id) { |
| | | this.loading = true; |
| | | try { |
| | | const response = await allocationList({ infoid }); |
| | | if (response.code == 200 && response.data && response.data.length > 0) { |
| | | const data = response.data[0]; |
| | | |
| | | // 填充表单数据 |
| | | Object.assign(this.form, data); |
| | | // 转换附件为集合 |
| | | this.parseFilePatch(this.form.fileName); |
| | | |
| | | // 初始化附件 |
| | | if (this.form.attachments) { |
| | | this.attachments = Array.isArray(this.form.attachments) |
| | | ? [...this.form.attachments] |
| | | : []; |
| | | } |
| | | |
| | | // 处理分配记录 |
| | | if (data.serviceDonateorganList) { |
| | | this.allocationData.serviceDonateorganList = Array.isArray( |
| | | data.serviceDonateorganList |
| | | ) |
| | | ? data.serviceDonateorganList.map(item => { |
| | | // 确保每条记录都有分配状态字段,默认值为0 |
| | | const allocationstatus = item.allocationstatus || "0"; |
| | | let redistributionInfo = null; |
| | | |
| | | // 解析重分配信息 |
| | | if (allocationstatus == "3" && item.reallocationreason) { |
| | | try { |
| | | redistributionInfo = JSON.parse(item.reallocationreason); |
| | | console.log(redistributionInfo); |
| | | } catch (error) { |
| | | console.warn("解析重分配信息失败:", error); |
| | | redistributionInfo = item.reallocationreason; |
| | | } |
| | | } |
| | | |
| | | return { |
| | | ...item, |
| | | allocationstatus, |
| | | redistributionInfo: redistributionInfo |
| | | ? JSON.stringify(redistributionInfo) |
| | | : null |
| | | }; |
| | | }) |
| | | : []; |
| | | |
| | | // 更新选中的器官 |
| | | this.selectedOrgans = this.allocationData.serviceDonateorganList |
| | | .map(item => { |
| | | // 从后端数据中获取器官的value |
| | | if (item.organno) { |
| | | return item.organno; |
| | | } |
| | | |
| | | // 如果后端只有器官名称,尝试从字典中匹配 |
| | | if (item.organname) { |
| | | const dictItem = this.organDict.find( |
| | | org => |
| | | org.label == item.organname || |
| | | (item.organname && item.organname.includes(org.label)) |
| | | ); |
| | | return dictItem ? dictItem.value : null; |
| | | } |
| | | |
| | | return null; |
| | | }) |
| | | .filter(Boolean); |
| | | |
| | | // 处理"其他"器官 |
| | | const otherRecord = this.allocationData.serviceDonateorganList.find( |
| | | item => item.organname && item.organname.includes("其他(") |
| | | ); |
| | | if (otherRecord) { |
| | | const match = otherRecord.organname.match(/其他\((.*?)\)/); |
| | | if (match) { |
| | | this.otherOrganInput = match[1]; |
| | | } |
| | | } |
| | | } |
| | | |
| | | this.$message.success("数据加载成功"); |
| | | } else { |
| | | this.$message.warning("未找到对应的器官分配数据"); |
| | | } |
| | | } catch (error) { |
| | | console.error("获取器官分配详情失败:", error); |
| | | this.$message.error("获取详情失败"); |
| | | } finally { |
| | | this.loading = false; |
| | | } |
| | | }, |
| | | |
| | | // 获取医院数据 |
| | | async getHospitalData() { |
| | | try { |
| | | // TODO: 替换为实际的医院列表接口 |
| | | // 暂时使用模拟数据 |
| | | this.hospitalList = [ |
| | | { hospitalNo: "H001", hospitalName: "北京协和医院" }, |
| | | { hospitalNo: "H002", hospitalName: "上海华山医院" }, |
| | | { hospitalNo: "H003", hospitalName: "广州中山医院" }, |
| | | { hospitalNo: "H004", hospitalName: "武汉同济医院" }, |
| | | { hospitalNo: "H005", hospitalName: "成都华西医院" } |
| | | ]; |
| | | } catch (error) { |
| | | console.error("获取医院数据失败:", error); |
| | | this.$message.error("获取医院数据失败"); |
| | | } |
| | | }, |
| | | |
| | | // 器官选择状态变化 |
| | | async handleOrganSelectionChange(selectedValues) { |
| | | // 1. 处理互斥逻辑(修改 this.selectedOrgans) |
| | | this.handleExclusiveSelections(selectedValues); |
| | | |
| | | const finalSelected = this.selectedOrgans; |
| | | const records = this.allocationData.serviceDonateorganList || []; |
| | | |
| | | // 2. 构建目标器官编号列表(直接使用选中的值,不展开) |
| | | const targetOrganNos = finalSelected; // 这里不展开,就是选中的器官编号 |
| | | |
| | | // 3. 新增或恢复记录 |
| | | targetOrganNos.forEach(no => { |
| | | const existing = records.find(r => r.organno === no); |
| | | if (existing) { |
| | | if (existing.delFlag === 1) { |
| | | existing.delFlag = 0; // 恢复显示 |
| | | } |
| | | } else { |
| | | this.createOrganRecord(no); |
| | | } |
| | | }); |
| | | |
| | | // 4. 找出需要取消的记录(不在目标集合中) |
| | | const toRemove = records.filter(r => !targetOrganNos.includes(r.organno)); |
| | | const toRemoveSaved = toRemove.filter(r => r.id); // 已保存,需确认 |
| | | const toRemoveUnsaved = toRemove.filter(r => !r.id); // 未保存,直接移除 |
| | | |
| | | // 4.1 直接移除未保存的记录 |
| | | toRemoveUnsaved.forEach(r => { |
| | | const idx = records.indexOf(r); |
| | | if (idx !== -1) records.splice(idx, 1); |
| | | }); |
| | | |
| | | // 4.2 处理已保存的记录:弹窗确认 |
| | | if (toRemoveSaved.length > 0) { |
| | | const organNames = toRemoveSaved.map(r => r.organname).join("、"); |
| | | try { |
| | | await this.$confirm( |
| | | `您确定要取消以下已保存的器官分配记录吗?\n${organNames}\n取消后,这些记录将从列表中移除(数据仍保留,可恢复)。`, |
| | | "提示", |
| | | { |
| | | confirmButtonText: "确定移除", |
| | | cancelButtonText: "取消", |
| | | type: "warning" |
| | | } |
| | | ); |
| | | // 用户确认:标记 delFlag=1,并从选中列表中移除 |
| | | toRemoveSaved.forEach(r => { |
| | | r.delFlag = 1; |
| | | // 从 selectedOrgans 中移除对应的器官编号 |
| | | const idx = this.selectedOrgans.indexOf(r.organno); |
| | | if (idx !== -1) this.selectedOrgans.splice(idx, 1); |
| | | }); |
| | | } catch (error) { |
| | | // 用户取消:恢复选中状态(将取消的器官重新加入 selectedOrgans) |
| | | const parentToRestore = new Set(); |
| | | toRemoveSaved.forEach(r => { |
| | | // 直接恢复器官编号(因为不展开,所以就是 r.organno) |
| | | if (!this.selectedOrgans.includes(r.organno)) { |
| | | this.selectedOrgans.push(r.organno); |
| | | } |
| | | }); |
| | | this.$message.info("已取消删除操作"); |
| | | return; // 退出方法,避免继续执行 |
| | | } |
| | | } |
| | | |
| | | // 5. 注意:对于已标记删除的记录,我们不从 selectedOrgans 中移除(已在确认时移除) |
| | | // 但还要考虑:某些记录可能因为互斥逻辑被移除,已包含在 finalSelected 中处理,无额外操作 |
| | | // 更新表单字段(如果需要保存选中的器官列表,可以在这里设置 this.form.donateorgan,但本项目未用) |
| | | // 如果需要,可以添加 this.form.donateorgan = this.selectedOrgans.join(','); |
| | | }, |
| | | |
| | | // 处理互斥选择(参考捐献决定页面) |
| | | handleExclusiveSelections(selectedValues) { |
| | | // 如果选择了"双肾"(假设字典值为C64),自动取消单独的"左肾"(C64L)和"右肾"(C64R)选择 |
| | | if (selectedValues.includes("C64")) { |
| | | this.selectedOrgans = selectedValues.filter( |
| | | item => item !== "C64L" && item !== "C64R" |
| | | ); |
| | | } |
| | | // 如果选择了"左肾"或"右肾",取消"双肾"选择 |
| | | else if ( |
| | | selectedValues.includes("C64L") || |
| | | selectedValues.includes("C64R") |
| | | ) { |
| | | this.selectedOrgans = selectedValues.filter(item => item !== "C64"); |
| | | } |
| | | |
| | | // 如果选择了"全肺"(假设字典值为C34),自动取消单独的"左肺"(C34L)和"右肺"(C34R)选择 |
| | | if (selectedValues.includes("C34")) { |
| | | this.selectedOrgans = selectedValues.filter( |
| | | item => item !== "C34L" && item !== "C34R" |
| | | ); |
| | | } |
| | | // 如果选择了"左肺"或"右肺",取消"全肺"选择 |
| | | else if ( |
| | | selectedValues.includes("C34L") || |
| | | selectedValues.includes("C34R") |
| | | ) { |
| | | this.selectedOrgans = selectedValues.filter(item => item !== "C34"); |
| | | } |
| | | }, |
| | | |
| | | // 创建器官记录 |
| | | createOrganRecord(organValue) { |
| | | let organName = this.getOrganLabel(organValue); |
| | | |
| | | // 如果是"其他"器官且有输入值 |
| | | if (organValue == "C01" && this.otherOrganInput) { |
| | | organName = `其他(${this.otherOrganInput})`; |
| | | } |
| | | |
| | | this.allocationData.serviceDonateorganList.push({ |
| | | id: null, |
| | | organname: organName, |
| | | organno: organValue, |
| | | caseno: "", |
| | | applicanttime: "", |
| | | organgettime: "", |
| | | name: "", |
| | | transplanthospitalno: "", |
| | | transplantHospitalName: "", |
| | | reallocationreason: "", |
| | | allocationstatus: "0", // 默认提交分配状态 |
| | | redistributionInfo: null, |
| | | organState: 1, |
| | | delFlag: 0 // 新增 |
| | | }); |
| | | }, |
| | | handleAutoAllocation() { |
| | | this.$message.info('执行智能分配算法'); |
| | | |
| | | // 医院选择变化 |
| | | handleHospitalChange(row, hospitalNo) { |
| | | const hospital = this.hospitalList.find( |
| | | item => item.hospitalNo == hospitalNo |
| | | ); |
| | | if (hospital) { |
| | | row.transplantHospitalName = hospital.hospitalName; |
| | | } |
| | | }, |
| | | handleConfirmAllocation() { |
| | | this.$confirm('确认最终分配结果吗?', '提示', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | type: 'success' |
| | | }).then(() => { |
| | | this.$message.success('器官分配结果已确认'); |
| | | |
| | | // 重分配操作 |
| | | handleRedistribution(row) { |
| | | this.currentRedistributeRecord = row; |
| | | this.redistributionForm.organname = row.organname; |
| | | this.redistributionForm.reason = ""; |
| | | this.redistributionForm.redistributionTime = new Date() |
| | | .toISOString() |
| | | .replace("T", " ") |
| | | .substring(0, 19); |
| | | this.redistributionAttachmentList = []; |
| | | this.redistributionDialogVisible = true; |
| | | }, |
| | | // 作废操作 |
| | | handleInvalidate(row) { |
| | | this.$confirm(`确定要将 "${row.organname}" 的分配记录作废吗?`, "提示", { |
| | | confirmButtonText: "确定", |
| | | cancelButtonText: "取消", |
| | | type: "warning" |
| | | }) |
| | | .then(() => { |
| | | // 找到当前记录的索引 |
| | | const index = this.allocationData.serviceDonateorganList.findIndex( |
| | | item => item === row |
| | | ); |
| | | |
| | | if (index !== -1) { |
| | | // 更新记录状态为作废 |
| | | this.allocationData.serviceDonateorganList[index].allocationstatus = |
| | | "2"; |
| | | |
| | | // 更新选中的器官列表(如果该器官不再有其他有效记录) |
| | | const organNo = row.organno; |
| | | const hasOtherValidRecord = this.allocationData.serviceDonateorganList.some( |
| | | item => item.organno === organNo && item.allocationstatus !== "2" |
| | | ); |
| | | |
| | | if (!hasOtherValidRecord) { |
| | | this.selectedOrgans = this.selectedOrgans.filter( |
| | | item => item !== organNo |
| | | ); |
| | | } |
| | | |
| | | this.$message.success("记录已作废"); |
| | | } |
| | | }) |
| | | .catch(() => {}); |
| | | }, |
| | | // 重分配对话框关闭 |
| | | handleRedistributionDialogClose() { |
| | | this.redistributionForm = { |
| | | organname: "", |
| | | reason: "", |
| | | redistributionTime: "" |
| | | }; |
| | | this.redistributionAttachmentList = []; |
| | | this.currentRedistributeRecord = null; |
| | | }, |
| | | |
| | | // 重分配附件上传成功 |
| | | handleRedistributionUploadSuccess({ file, fileList, response }) { |
| | | if (response.code == 200) { |
| | | const attachmentObj = { |
| | | fileName: file.name, |
| | | path: response.fileUrl || file.url, |
| | | fileUrl: response.fileUrl || file.url, |
| | | fileType: this.getFileExtension(file.name), |
| | | fileSize: file.size, |
| | | uploadTime: dayjs().format("YYYY-MM-DD HH:mm:ss") |
| | | }; |
| | | console.log(11); |
| | | |
| | | this.redistributionAttachmentList = fileList; |
| | | this.$message.success("重分配附件上传成功"); |
| | | } |
| | | }, |
| | | |
| | | // 重分配附件上传错误 |
| | | handleRedistributionUploadError({ file, fileList, error }) { |
| | | console.error("重分配附件上传失败:", error); |
| | | this.$message.error("重分配附件上传失败,请重试"); |
| | | }, |
| | | |
| | | // 重分配附件移除 |
| | | handleRedistributionAttachmentRemove(file) { |
| | | if (file.url) { |
| | | const index = this.redistributionAttachmentList.findIndex( |
| | | item => item.path == file.url || item.fileUrl == file.url |
| | | ); |
| | | if (index > -1) { |
| | | this.redistributionAttachmentList.splice(index, 1); |
| | | } |
| | | } |
| | | }, |
| | | |
| | | // 确认重分配 |
| | | async handleRedistributionConfirm() { |
| | | this.$refs.redistributionFormRef.validate(async valid => { |
| | | if (!valid) { |
| | | this.$message.warning("请完善重分配信息"); |
| | | return; |
| | | } |
| | | console.log(1, this.redistributionAttachmentList); |
| | | |
| | | this.redistributionLoading = true; |
| | | |
| | | try { |
| | | // 构建重分配信息对象 |
| | | const redistributionInfo = { |
| | | reason: this.redistributionForm.reason, |
| | | redistributionTime: this.redistributionForm.redistributionTime, |
| | | attachments: this.redistributionAttachmentList.map(att => ({ |
| | | // fileName: att.fileName, |
| | | // path: att.path || att.fileUrl, |
| | | // fileUrl: att.path || att.fileUrl, |
| | | // fileType: this.getFileExtension(att.name), |
| | | // fileSize: att.fileSize, |
| | | // uploadTime: att.uploadTime |
| | | fileName: att.name, |
| | | path: att.url, |
| | | fileUrl: att.url, |
| | | fileType: this.getFileExtension(att.name), |
| | | fileSize: att.size, |
| | | uploadTime: dayjs().format("YYYY-MM-DD HH:mm:ss") |
| | | })), |
| | | |
| | | operator: this.currentUser.username || this.currentUser.nickName, |
| | | operatorTime: new Date() |
| | | .toISOString() |
| | | .replace("T", " ") |
| | | .substring(0, 19) |
| | | }; |
| | | console.log(2, this.redistributionAttachmentList); |
| | | |
| | | // 找到当前记录的索引 |
| | | const currentIndex = this.allocationData.serviceDonateorganList.findIndex( |
| | | item => item == this.currentRedistributeRecord |
| | | ); |
| | | |
| | | if (currentIndex !== -1) { |
| | | // 1. 更新原记录的状态为3(重分配)并保存重分配信息 |
| | | const originalRecord = { ...this.currentRedistributeRecord }; |
| | | originalRecord.allocationstatus = "3"; |
| | | originalRecord.reallocationreason = JSON.stringify( |
| | | redistributionInfo |
| | | ); |
| | | originalRecord.redistributionInfo = JSON.stringify( |
| | | redistributionInfo |
| | | ); |
| | | |
| | | // 2. 创建新的记录 |
| | | const newRecord = { |
| | | ...this.currentRedistributeRecord, |
| | | id: null, // 新记录ID为空 |
| | | allocationstatus: "0", // 新记录状态为提交分配 |
| | | reallocationreason: "", // 清空重分配原因 |
| | | redistributionInfo: null, |
| | | // 重置相关字段,但保留器官信息 |
| | | caseno: "", |
| | | applicanttime: "", |
| | | organgettime: "", |
| | | name: "", |
| | | transplanthospitalno: "", |
| | | transplantHospitalName: "" |
| | | }; |
| | | |
| | | // 3. 在数组中插入新记录(在旧记录之后) |
| | | this.allocationData.serviceDonateorganList.splice( |
| | | currentIndex + 1, |
| | | 0, |
| | | newRecord |
| | | ); |
| | | // 4. 更新原记录 |
| | | this.allocationData.serviceDonateorganList[ |
| | | currentIndex |
| | | ] = originalRecord; |
| | | |
| | | // 5. 更新选中的器官列表 |
| | | this.selectedOrgans.push(this.currentRedistributeRecord.organno); |
| | | |
| | | this.$message.success("重分配操作成功完成"); |
| | | this.redistributionDialogVisible = false; |
| | | } else { |
| | | this.$message.error("未找到对应的记录"); |
| | | } |
| | | } catch (error) { |
| | | console.error("重分配操作失败:", error); |
| | | this.$message.error("重分配操作失败"); |
| | | } finally { |
| | | this.redistributionLoading = false; |
| | | } |
| | | }); |
| | | }, |
| | | handleManualAdjust() { |
| | | this.$message.info('进入手动调整模式'); |
| | | |
| | | // 器官行样式 |
| | | getOrganRowClassName({ row }) { |
| | | if (row.allocationstatus == "3") { |
| | | return "redistributed-row"; // 重分配记录样式 |
| | | } else if (row.allocationstatus == "2") { |
| | | return "invalidated-row"; // 作废记录样式 |
| | | } else if ( |
| | | !row.applicanttime || |
| | | !row.organgettime || |
| | | !row.name || |
| | | !row.transplanthospitalname |
| | | ) { |
| | | return "warning-row"; // 信息不完整样式 |
| | | } else if (row.allocationstatus == "0") { |
| | | return "pending-row"; // 待审核样式 |
| | | } |
| | | return ""; |
| | | }, |
| | | handleViewMatch(row) { |
| | | this.$message.info(`查看${row.organName}的匹配详情`); |
| | | |
| | | // 构建 filePatch 字段 |
| | | buildFilePatch() { |
| | | if (!this.attachments || this.attachments.length == 0) { |
| | | return ""; |
| | | } |
| | | return JSON.stringify(this.attachments); |
| | | }, |
| | | |
| | | // 保存基本信息 |
| | | async handleSave() { |
| | | this.$refs.form.validate(async valid => { |
| | | if (!valid) { |
| | | this.$message.warning("请完善表单信息"); |
| | | return; |
| | | } |
| | | |
| | | this.saveLoading = true; |
| | | try { |
| | | const saveData = { |
| | | ...this.form, |
| | | serviceDonateorganList: |
| | | this.allocationData.serviceDonateorganList || [] |
| | | }; |
| | | |
| | | // 确保每条记录都有分配状态 |
| | | saveData.serviceDonateorganList.forEach(item => { |
| | | item.baseid = this.form.id; |
| | | item.infoid = this.form.infoid; |
| | | // 确保有分配状态字段 |
| | | if (!item.allocationstatus) { |
| | | item.allocationstatus = "0"; |
| | | } |
| | | // 如果是重分配记录,确保有重分配信息 |
| | | if (item.allocationstatus == "3" && !item.reallocationreason) { |
| | | item.reallocationreason = item.redistributionInfo || ""; |
| | | } |
| | | }); |
| | | |
| | | if (saveData.allocationStatus == 1 || !saveData.allocationStatus) { |
| | | saveData.allocationStatus = 2; |
| | | } |
| | | saveData.fileName = this.buildFilePatch(); |
| | | |
| | | const apiMethod = this.form.id ? allocationedit : allocationadd; |
| | | const response = await apiMethod(saveData); |
| | | |
| | | if (response.code == 200) { |
| | | this.$message.success("保存成功"); |
| | | if (!this.form.id && response.data) { |
| | | this.form.id = response.data; |
| | | } |
| | | } else { |
| | | this.$message.error("保存失败:" + (response.msg || "未知错误")); |
| | | } |
| | | } catch (error) { |
| | | console.error("保存失败:", error); |
| | | this.$message.error("保存失败"); |
| | | } finally { |
| | | this.saveLoading = false; |
| | | } |
| | | }); |
| | | }, |
| | | |
| | | // 确认完成分配 |
| | | async handleConfirmAllocation() { |
| | | if (this.incompleteRecords > 0) { |
| | | this.$message.warning("请先完善所有分配记录的信息"); |
| | | return; |
| | | } |
| | | |
| | | this.$confirm("确认完成器官分配吗?完成后将无法修改分配信息。", "提示", { |
| | | confirmButtonText: "确定", |
| | | cancelButtonText: "取消", |
| | | type: "warning" |
| | | }) |
| | | .then(async () => { |
| | | this.confirmLoading = true; |
| | | this.form.allocationStatus = "3"; |
| | | this.form.allocationTime = new Date() |
| | | .toISOString() |
| | | .replace("T", " ") |
| | | .substring(0, 19); |
| | | |
| | | try { |
| | | const saveData = { |
| | | ...this.form, |
| | | attachments: this.attachments, |
| | | serviceDonateorganList: |
| | | this.allocationData.serviceDonateorganList || [] |
| | | }; |
| | | |
| | | const response = await allocationedit(saveData); |
| | | |
| | | if (response.code == 200) { |
| | | this.$message.success("器官分配已完成"); |
| | | } else { |
| | | this.$message.error( |
| | | "确认分配失败:" + (response.msg || "未知错误") |
| | | ); |
| | | this.form.allocationStatus = "0"; |
| | | this.form.allocationTime = ""; |
| | | } |
| | | } catch (error) { |
| | | console.error("确认分配失败:", error); |
| | | this.$message.error("确认分配失败"); |
| | | this.form.allocationStatus = "0"; |
| | | this.form.allocationTime = ""; |
| | | } finally { |
| | | this.confirmLoading = false; |
| | | } |
| | | }) |
| | | .catch(() => {}); |
| | | }, |
| | | |
| | | // 附件相关方法 |
| | | /** 附件变化处理 */ |
| | | handleAttachmentChange(fileList) { |
| | | this.attachmentFileList = fileList; |
| | | }, |
| | | handleRedistributionChange(fileList) { |
| | | this.redistributionAttachmentList = fileList; |
| | | }, |
| | | |
| | | /** 附件移除处理 */ |
| | | handleAttachmentRemove(file) { |
| | | if (file.url) { |
| | | const index = this.attachments.findIndex( |
| | | item => item.path == file.url || item.fileUrl == file.url |
| | | ); |
| | | if (index > -1) { |
| | | this.attachments.splice(index, 1); |
| | | this.$message.success("附件删除成功"); |
| | | } |
| | | } |
| | | }, |
| | | |
| | | /** 上传成功处理 */ |
| | | handleUploadSuccess({ file, fileList, response }) { |
| | | if (response.code == 200) { |
| | | const attachmentObj = { |
| | | fileName: file.name, |
| | | path: response.fileUrl || file.url, |
| | | fileUrl: response.fileUrl || file.url, |
| | | fileType: this.getFileExtension(file.name), |
| | | 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("文件上传成功"); |
| | | } |
| | | }, |
| | | |
| | | /** 上传错误处理 */ |
| | | handleUploadError({ file, fileList, error }) { |
| | | console.error("附件上传失败:", error); |
| | | this.$message.error("文件上传失败,请重试"); |
| | | }, |
| | | |
| | | /** 手动删除附件 */ |
| | | handleRemoveAttachment(index) { |
| | | this.attachments.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.filePreviewVisible = true; |
| | | }, |
| | | |
| | | handleDownloadAttachment(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", "ppt", "pptx"]; |
| | | if (imageTypes.includes(extension)) return "image"; |
| | | if (pdfTypes.includes(extension)) return "pdf"; |
| | | if (officeTypes.includes(extension)) return "office"; |
| | | return "other"; |
| | | }, |
| | | |
| | | /** 获取文件图标颜色 */ |
| | | getFileIconColor(fileName) { |
| | | const type = this.getFileType(fileName); |
| | | const colorMap = { |
| | | image: "#67C23A", |
| | | pdf: "#F56C6C", |
| | | office: "#409EFF", |
| | | other: "#909399" |
| | | }; |
| | | return colorMap[type] || "#909399"; |
| | | }, |
| | | |
| | | /** 获取文件标签类型 */ |
| | | getFileTagType(fileName) { |
| | | const type = this.getFileType(fileName); |
| | | const typeMap = { |
| | | image: "success", |
| | | pdf: "danger", |
| | | office: "primary", |
| | | other: "info" |
| | | }; |
| | | return typeMap[type] || "info"; |
| | | }, |
| | | |
| | | /** 获取文件类型文本 */ |
| | | getFileTypeText(fileName) { |
| | | const type = this.getFileType(fileName); |
| | | const textMap = { |
| | | image: "图片", |
| | | pdf: "PDF", |
| | | office: "文档", |
| | | other: "其他" |
| | | }; |
| | | return textMap[type] || "未知"; |
| | | }, |
| | | |
| | | /** 检查是否可预览 */ |
| | | isPreviewable(fileName) { |
| | | const type = this.getFileType(fileName); |
| | | return ["image", "pdf"].includes(type); |
| | | }, |
| | | |
| | | /** 获取文件扩展名 */ |
| | | getFileExtension(filename) { |
| | | console.log(filename, "filename"); |
| | | |
| | | return filename |
| | | .split(".") |
| | | .pop() |
| | | .toLowerCase(); |
| | | }, |
| | | |
| | | /** 格式化文件大小 */ |
| | | formatFileSize(bytes) { |
| | | if (!bytes || bytes == 0) return "0 B"; |
| | | const k = 1024; |
| | | const sizes = ["B", "KB", "MB", "GB"]; |
| | | const i = Math.floor(Math.log(bytes) / Math.log(k)); |
| | | return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + " " + sizes[i]; |
| | | }, |
| | | |
| | | /** 日期时间格式化 */ |
| | | formatDateTime(dateTime) { |
| | | if (!dateTime) return ""; |
| | | try { |
| | | const date = new Date(dateTime); |
| | | if (isNaN(date.getTime())) return dateTime; |
| | | const year = date.getFullYear(); |
| | | const month = String(date.getMonth() + 1).padStart(2, "0"); |
| | | const day = String(date.getDate()).padStart(2, "0"); |
| | | const hours = String(date.getHours()).padStart(2, "0"); |
| | | const minutes = String(date.getMinutes()).padStart(2, "0"); |
| | | return `${year}-${month}-${day} ${hours}:${minutes}`; |
| | | } catch (error) { |
| | | return dateTime; |
| | | } |
| | | } |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .allocation-stats, .time-window { |
| | | padding: 10px 0; |
| | | .organ-allocation-detail { |
| | | padding: 20px; |
| | | background-color: #f5f7fa; |
| | | } |
| | | |
| | | .stat-item, .time-item { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | margin-bottom: 15px; |
| | | padding: 8px 0; |
| | | border-bottom: 1px solid #f0f0f0; |
| | | } |
| | | |
| | | .stat-item .label, .time-item .label { |
| | | color: #606266; |
| | | font-weight: 500; |
| | | min-width: 100px; |
| | | } |
| | | |
| | | .stat-item .value { |
| | | font-weight: 600; |
| | | color: #409EFF; |
| | | } |
| | | |
| | | .algorithm-results { |
| | | padding: 15px 0; |
| | | } |
| | | |
| | | .result-item { |
| | | .detail-card { |
| | | margin-bottom: 20px; |
| | | border-radius: 8px; |
| | | box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); |
| | | } |
| | | |
| | | .result-item h4 { |
| | | margin-bottom: 15px; |
| | | .allocation-card { |
| | | margin-bottom: 20px; |
| | | border-radius: 8px; |
| | | box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); |
| | | } |
| | | |
| | | .attachment-card { |
| | | margin-bottom: 20px; |
| | | border-radius: 8px; |
| | | box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); |
| | | padding: 20px; |
| | | background: #fafafa; |
| | | } |
| | | |
| | | .attachment-header { |
| | | display: flex; |
| | | align-items: center; |
| | | gap: 8px; |
| | | margin-bottom: 16px; |
| | | padding-bottom: 8px; |
| | | border-bottom: 1px solid #ebeef5; |
| | | } |
| | | |
| | | .attachment-title { |
| | | font-weight: 600; |
| | | color: #303133; |
| | | } |
| | | |
| | | .weight-distribution { |
| | | padding: 10px 0; |
| | | .attachment-tip { |
| | | font-size: 12px; |
| | | color: #909399; |
| | | margin-left: auto; |
| | | } |
| | | |
| | | .factor-item { |
| | | display: flex; |
| | | align-items: center; |
| | | .attachment-list { |
| | | margin-top: 16px; |
| | | } |
| | | |
| | | .list-title { |
| | | font-weight: bold; |
| | | margin-bottom: 12px; |
| | | } |
| | | |
| | | .factor-name { |
| | | width: 120px; |
| | | color: #606266; |
| | | color: #303133; |
| | | font-size: 14px; |
| | | } |
| | | |
| | | .factor-item .el-progress { |
| | | flex: 1; |
| | | margin: 0 15px; |
| | | .file-name { |
| | | font-size: 13px; |
| | | margin-left: 8px; |
| | | } |
| | | |
| | | .factor-percent { |
| | | width: 40px; |
| | | text-align: right; |
| | | .detail-title { |
| | | font-size: 18px; |
| | | font-weight: 600; |
| | | color: #303133; |
| | | } |
| | | |
| | | /* 统计信息样式 */ |
| | | .allocation-stats { |
| | | margin-top: 20px; |
| | | padding: 15px; |
| | | background: linear-gradient(135deg, #9eb7e5 0%, #53519c 100%); |
| | | border-radius: 8px; |
| | | color: white; |
| | | font-size: 18px; |
| | | } |
| | | |
| | | .stat-item { |
| | | display: flex; |
| | | flex-direction: column; |
| | | align-items: center; |
| | | padding: 10px; |
| | | } |
| | | |
| | | .stat-label { |
| | | opacity: 0.9; |
| | | margin-bottom: 5px; |
| | | } |
| | | |
| | | .stat-value { |
| | | font-size: 20px; |
| | | font-weight: bold; |
| | | } |
| | | |
| | | /* 在style部分添加 */ |
| | | .section-title { |
| | | font-weight: 600; |
| | | color: #303133; |
| | | margin-bottom: 8px; |
| | | font-size: 14px; |
| | | } |
| | | |
| | | .section-content { |
| | | background: #f5f7fa; |
| | | padding: 12px; |
| | | border-radius: 4px; |
| | | border-left: 3px solid #e6a23c; |
| | | line-height: 1.6; |
| | | } |
| | | |
| | | .redistribution-attachments { |
| | | margin-top: 10px; |
| | | border: 1px solid #ebeef5; |
| | | border-radius: 4px; |
| | | overflow: hidden; |
| | | } |
| | | |
| | | /* 重分配详情表格样式 */ |
| | | :deep(.redistribution-attachments .el-table) { |
| | | border: none; |
| | | } |
| | | |
| | | :deep(.redistribution-attachments .el-table th) { |
| | | background-color: #f5f7fa; |
| | | color: #606266; |
| | | font-weight: 600; |
| | | } |
| | | |
| | | /* 响应式调整 */ |
| | | @media (max-width: 768px) { |
| | | .redistribution-attachments { |
| | | overflow-x: auto; |
| | | } |
| | | } |
| | | |
| | | /* 空状态样式 */ |
| | | .empty-allocation { |
| | | text-align: center; |
| | | padding: 40px 0; |
| | | color: #909399; |
| | | } |
| | | |
| | | /* 无数据样式 */ |
| | | .no-data { |
| | | color: #909399; |
| | | font-style: italic; |
| | | } |
| | | |
| | | /* ===== 表格行样式 ===== */ |
| | | |
| | | /* 重分配行样式 */ |
| | | :deep(.redistributed-row) { |
| | | background-color: #fdf6ec; |
| | | opacity: 0.8; |
| | | } |
| | | |
| | | :deep(.redistributed-row:hover) { |
| | | background-color: #faecd8; |
| | | opacity: 0.9; |
| | | } |
| | | |
| | | /* 信息不完整警告行样式 */ |
| | | :deep(.warning-row) { |
| | | background-color: #fff7e6; |
| | | } |
| | | |
| | | :deep(.warning-row:hover) { |
| | | background-color: #ffecc2; |
| | | } |
| | | |
| | | /* 待审核行样式 */ |
| | | :deep(.pending-row) { |
| | | background-color: #f0f9ff; |
| | | } |
| | | |
| | | :deep(.pending-row:hover) { |
| | | background-color: #e0f2ff; |
| | | } |
| | | |
| | | /* ===== 新增:作废行样式 ===== */ |
| | | :deep(.invalidated-row) { |
| | | background-color: #fef0f0; |
| | | position: relative; |
| | | } |
| | | |
| | | :deep(.invalidated-row td) { |
| | | opacity: 0.6; |
| | | text-decoration: line-through; |
| | | color: #c0c4cc !important; |
| | | } |
| | | |
| | | :deep(.invalidated-row:hover td) { |
| | | background-color: #fde2e2 !important; |
| | | opacity: 0.75; |
| | | } |
| | | |
| | | /* 作废行内的输入框和选择器样式 */ |
| | | :deep(.invalidated-row .el-input__inner), |
| | | :deep(.invalidated-row .el-textarea__inner), |
| | | :deep(.invalidated-row .el-date-editor .el-input__inner) { |
| | | background-color: #fef0f0 !important; |
| | | border-color: #fbc4c4 !important; |
| | | color: #c0c4cc !important; |
| | | cursor: not-allowed !important; |
| | | } |
| | | |
| | | /* 作废行内的标签样式 */ |
| | | :deep(.invalidated-row .el-tag) { |
| | | opacity: 0.5; |
| | | } |
| | | |
| | | /* 作废行内的按钮样式 */ |
| | | :deep(.invalidated-row .el-button--text) { |
| | | color: #c0c4cc !important; |
| | | cursor: not-allowed !important; |
| | | } |
| | | |
| | | /* ===== 操作按钮样式 ===== */ |
| | | |
| | | /* 操作按钮容器 */ |
| | | .operation-buttons { |
| | | display: flex; |
| | | gap: 4px; |
| | | justify-content: center; |
| | | align-items: center; |
| | | } |
| | | |
| | | /* 操作按钮通用样式 */ |
| | | :deep(.el-table .el-button--text) { |
| | | padding: 4px 6px; |
| | | font-size: 12px; |
| | | } |
| | | |
| | | /* 重分配按钮样式 */ |
| | | :deep(.el-button--text.redistribute-btn) { |
| | | color: #e6a23c; |
| | | } |
| | | |
| | | :deep(.el-button--text.redistribute-btn:hover:not(:disabled)) { |
| | | color: #cf9236; |
| | | } |
| | | |
| | | /* 作废按钮样式 */ |
| | | :deep(.el-button--text.invalidate-btn) { |
| | | color: #f56c6c; |
| | | } |
| | | |
| | | :deep(.el-button--text.invalidate-btn:hover:not(:disabled)) { |
| | | color: #d9534f; |
| | | } |
| | | |
| | | /* 禁用状态的按钮样式 */ |
| | | :deep(.el-button--text.is-disabled) { |
| | | color: #c0c4cc !important; |
| | | cursor: not-allowed !important; |
| | | opacity: 0.5; |
| | | } |
| | | |
| | | /* 重分配信息提示框样式 */ |
| | | :deep(.el-tooltip__popper) { |
| | | max-width: 300px; |
| | | white-space: pre-line; |
| | | line-height: 1.6; |
| | | } |
| | | |
| | | /* 禁用状态的输入框样式 */ |
| | | :deep(.el-input.is-disabled .el-input__inner) { |
| | | background-color: #f5f7fa; |
| | | border-color: #e4e7ed; |
| | | color: #c0c4cc; |
| | | cursor: not-allowed; |
| | | } |
| | | |
| | | :deep(.el-textarea.is-disabled .el-textarea__inner) { |
| | | background-color: #f5f7fa; |
| | | border-color: #e4e7ed; |
| | | color: #c0c4cc; |
| | | cursor: not-allowed; |
| | | } |
| | | |
| | | /* 响应式设计 */ |
| | | @media (max-width: 768px) { |
| | | .organ-allocation-detail { |
| | | padding: 10px; |
| | | } |
| | | |
| | | .allocation-stats .el-col { |
| | | margin-bottom: 10px; |
| | | } |
| | | |
| | | /* 移动端操作按钮样式调整 */ |
| | | :deep(.el-table .el-button--text) { |
| | | padding: 2px 4px; |
| | | font-size: 11px; |
| | | } |
| | | } |
| | | </style> |