From 631c8f37b449b09d19345b76400a39abdb7800f6 Mon Sep 17 00:00:00 2001
From: WXL <wl_5969728@163.com>
Date: 星期四, 15 一月 2026 15:48:42 +0800
Subject: [PATCH] api封装档案、上报、转运接入
---
src/views/business/transfer/transportDetail.vue | 605 +++++++++++++++++++++++++++---------------------------
1 files changed, 299 insertions(+), 306 deletions(-)
diff --git a/src/views/business/transfer/transportDetail.vue b/src/views/business/transfer/transportDetail.vue
index 1f66b4b..db548c7 100644
--- a/src/views/business/transfer/transportDetail.vue
+++ b/src/views/business/transfer/transportDetail.vue
@@ -1,193 +1,193 @@
<template>
- <div class="transport-detail">
- <el-tabs v-model="activeTab">
- <!-- 鍩虹淇℃伅 -->
- <el-tab-pane label="鍩虹淇℃伅" name="basic">
- <el-descriptions :column="2" border>
- <el-descriptions-item label="杞繍鍗曞彿">{{
- transportData.id
- }}</el-descriptions-item>
- <el-descriptions-item label="妗堜緥缂栧彿">{{
- transportData.caseNo
- }}</el-descriptions-item>
- <el-descriptions-item label="鎹愮尞鑰呭鍚�">{{
- transportData.donorName
- }}</el-descriptions-item>
- <el-descriptions-item label="鎬у埆">{{
- transportData.gender
- }}</el-descriptions-item>
- <el-descriptions-item label="骞撮緞"
- >{{ transportData.age }}宀�</el-descriptions-item
- >
- <el-descriptions-item label="鐤剧梾璇婃柇">{{
- transportData.diagnosis
- }}</el-descriptions-item>
- <el-descriptions-item label="鍑哄彂鍖婚櫌">{{
- transportData.hospitalName
- }}</el-descriptions-item>
- <el-descriptions-item label="鐩殑鍖婚櫌">{{
- transportData.destinationHospital
- }}</el-descriptions-item>
- <el-descriptions-item label="璁″垝杞繍鏃堕棿">{{
- transportData.transportTime
- }}</el-descriptions-item>
- <el-descriptions-item label="璐熻矗鍗忚皟鍛�">{{
- transportData.coordinator
- }}</el-descriptions-item>
- <el-descriptions-item label="杞繍鐘舵��">
- <el-tag :type="transportData.status | statusFilter">
- {{ transportData.statusText }}
- </el-tag>
- </el-descriptions-item>
- <el-descriptions-item label="鍒涘缓鏃堕棿">{{
- transportData.createTime
- }}</el-descriptions-item>
- <el-descriptions-item
- label="瀹屾垚鏃堕棿"
- v-if="transportData.completedTime"
- >
- {{ transportData.completedTime }}
- </el-descriptions-item>
- </el-descriptions>
- </el-tab-pane>
+ <div class="transport-detail-container">
+ <!-- 鍩虹淇℃伅妯″潡 -->
+ <el-card class="detail-section">
+ <div slot="header" class="section-header">
+ <i
+ class="el-icon-document"
+ style="color: #409EFF; margin-right: 8px;"
+ ></i>
+ <span class="section-title">鍩虹淇℃伅</span>
+ </div>
+ <el-descriptions :column="2" border>
+ <el-descriptions-item label="杞繍鍗曞彿">{{
+ transportData.reportId || transportData.id
+ }}</el-descriptions-item>
+ <el-descriptions-item label="妗堜緥缂栧彿">{{
+ transportData.caseNo
+ }}</el-descriptions-item>
+ <el-descriptions-item label="鎮ｈ�呭鍚�">{{
+ transportData.patName
+ }}</el-descriptions-item>
+ <el-descriptions-item label="鎬у埆">
+ <dict-tag
+ :options="dict.type.sys_user_sex"
+ :value="parseInt(transportData.sex)"
+ />
+ </el-descriptions-item>
+ <el-descriptions-item label="骞撮緞"
+ >{{ transportData.age }}宀�</el-descriptions-item
+ >
+ <el-descriptions-item label="鐤剧梾璇婃柇">{{
+ transportData.diagnosisname
+ }}</el-descriptions-item>
+ <el-descriptions-item label="娌荤枟鍖婚櫌">{{
+ transportData.treatmentHospitalName
+ }}</el-descriptions-item>
+ <el-descriptions-item label="娌荤枟绉戝">{{
+ transportData.treatmentDeptName
+ }}</el-descriptions-item>
+ <el-descriptions-item label="鍑哄彂鍦扮偣">{{
+ transportData.transportStartPlace
+ }}</el-descriptions-item>
+ <el-descriptions-item label="璁″垝杞繍鏃堕棿">{{
+ transportData.transportStartTime
+ }}</el-descriptions-item>
+ <el-descriptions-item label="璐熻矗鍗忚皟鍛�">{{
+ transportData.contactPerson
+ }}</el-descriptions-item>
+ <el-descriptions-item label="杞繍鐘舵��">
+ <el-tag :type="getStatusTagType(transportData.transitStatus)">
+ {{ getStatusText(transportData.transitStatus) }}
+ </el-tag>
+ </el-descriptions-item>
+ <el-descriptions-item label="鍒涘缓鏃堕棿">{{
+ transportData.createTime
+ }}</el-descriptions-item>
+ <el-descriptions-item label="鏇存柊鏃堕棿">{{
+ transportData.updateTime
+ }}</el-descriptions-item>
+ </el-descriptions>
+ </el-card>
- <!-- 杞繍璇︽儏 -->
- <el-tab-pane label="杞繍璇︽儏" name="transport">
- <el-descriptions :column="1" border>
- <el-descriptions-item label="鍑哄彂鍦扮偣">{{
- transportData.departureLocation
- }}</el-descriptions-item>
- <el-descriptions-item label="鐩殑鍦�">{{
- transportData.destinationHospital
- }}</el-descriptions-item>
- <el-descriptions-item
- label="褰撳墠浣嶇疆"
- v-if="transportData.currentLocation"
- >
- {{ transportData.currentLocation }}
- </el-descriptions-item>
- <el-descriptions-item
- label="棰勮鍒拌揪鏃堕棿"
- v-if="transportData.estimatedTime"
- >
- {{ transportData.estimatedTime }}
- </el-descriptions-item>
- <el-descriptions-item label="杞繍璺濈" v-if="transportData.distance">
- {{ transportData.distance }}
- </el-descriptions-item>
- <el-descriptions-item label="杞繍鏃堕暱" v-if="transportData.duration">
- {{ transportData.duration }}
- </el-descriptions-item>
- </el-descriptions>
- </el-tab-pane>
+ <!-- 杞繍璇︽儏妯″潡 -->
+ <el-card class="detail-section">
+ <div slot="header" class="section-header">
+ <i
+ class="el-icon-location-information"
+ style="color: #67C23A; margin-right: 8px;"
+ ></i>
+ <span class="section-title">杞繍璇︽儏</span>
+ </div>
+ <el-descriptions :column="2" border>
+ <el-descriptions-item label="鍑哄彂鍦扮偣">{{
+ transportData.transportStartPlace
+ }}</el-descriptions-item>
+ <el-descriptions-item label="鐩殑鍖婚櫌">{{
+ transportData.treatmentHospitalName
+ }}</el-descriptions-item>
+ <el-descriptions-item label="娌荤枟绉戝">{{
+ transportData.treatmentDeptName
+ }}</el-descriptions-item>
+ <el-descriptions-item label="鍑哄彂鏃堕棿">{{
+ transportData.transportStartTime
+ }}</el-descriptions-item>
+ <el-descriptions-item label="杞繍鐘舵��">
+ <el-tag :type="getStatusTagType(transportData.transitStatus)">
+ {{ getStatusText(transportData.transitStatus) }}
+ </el-tag>
+ </el-descriptions-item>
+ </el-descriptions>
+ </el-card>
- <!-- 鍥㈤槦鎴愬憳 -->
- <el-tab-pane label="鍥㈤槦鎴愬憳" name="team">
- <el-descriptions :column="2" border>
- <el-descriptions-item label="鍗忚皟鍛�">{{
- transportData.coordinator
- }}</el-descriptions-item>
- <el-descriptions-item label="鍗忚皟鍛樼數璇�">
- {{ getContactPhone("鍗忚皟鍛樼數璇�") }}
- </el-descriptions-item>
- <el-descriptions-item
- label="鎬ヨ瘖绉戝尰鐢�"
- v-if="transportData.emergencyDoctor"
- >
- {{ transportData.emergencyDoctor }}
- </el-descriptions-item>
- <el-descriptions-item label="鎬ヨ瘖鍖荤敓鐢佃瘽">
- {{ getContactPhone("鎬ヨ瘖鍖荤敓鐢佃瘽") }}
- </el-descriptions-item>
- <el-descriptions-item label="鎶ゅ＋" v-if="transportData.nurse">
- {{ transportData.nurse }}
- </el-descriptions-item>
- <el-descriptions-item label="鎶ゅ＋鐢佃瘽">
- {{ getContactPhone("鎶ゅ＋鐢佃瘽") }}
- </el-descriptions-item>
- <el-descriptions-item label="鍙告満" v-if="transportData.driver">
- {{ transportData.driver }}
- </el-descriptions-item>
- <el-descriptions-item label="鍙告満鐢佃瘽">
- {{ getContactPhone("鍙告満鐢佃瘽") }}
- </el-descriptions-item>
- <el-descriptions-item
- label="ICU璇勪及鍖荤敓"
- v-if="transportData.icuDoctor"
- >
- {{ transportData.icuDoctor }}
- </el-descriptions-item>
- <el-descriptions-item label="ICU鍖荤敓鐢佃瘽">
- {{ getContactPhone("ICU鍖荤敓鐢佃瘽") }}
- </el-descriptions-item>
- </el-descriptions>
- </el-tab-pane>
- <el-tab-pane label="闄勪欢淇℃伅" name="attachments">
- <el-card class="attachment-card">
- <div slot="header" class="clearfix">
- <span>闄勪欢鍒楄〃</span>
- <!-- <el-button
- style="float: right; padding: 3px 0"
- type="text"
- @click="handleUpload"
+ <!-- 鍖绘姢浜哄憳淇℃伅妯″潡 -->
+ <el-card class="detail-section">
+ <div slot="header" class="section-header">
+ <i class="el-icon-user" style="color: #E6A23C; margin-right: 8px;"></i>
+ <span class="section-title">鍖绘姢浜哄憳淇℃伅</span>
+ </div>
+ <el-descriptions :column="2" border>
+ <el-descriptions-item label="鍗忚皟鍛�">{{
+ transportData.contactPerson
+ }}</el-descriptions-item>
+ <el-descriptions-item label="鍗忚皟鍛樼數璇�">{{
+ transportData.contactPhone || "鏈～鍐�"
+ }}</el-descriptions-item>
+ <el-descriptions-item label="鎬ヨ瘖绉戝尰鐢�">{{
+ transportData.doctor
+ }}</el-descriptions-item>
+ <el-descriptions-item label="鎬ヨ瘖鍖荤敓鐢佃瘽">{{
+ transportData.doctorPhone
+ }}</el-descriptions-item>
+ <el-descriptions-item label="鎶ゅ＋">{{
+ transportData.nurse
+ }}</el-descriptions-item>
+ <el-descriptions-item label="鎶ゅ＋鐢佃瘽">{{
+ transportData.nursePhone
+ }}</el-descriptions-item>
+ <el-descriptions-item label="椹鹃┒鍛�">{{
+ transportData.driver
+ }}</el-descriptions-item>
+ <el-descriptions-item label="椹鹃┒鍛樼數璇�">{{
+ transportData.driverPhone
+ }}</el-descriptions-item>
+ <el-descriptions-item label="ICU璇勪及鍖荤敓">{{
+ transportData.icuDoctor
+ }}</el-descriptions-item>
+ <el-descriptions-item label="ICU鍖荤敓鐢佃瘽">{{
+ transportData.icuDoctorPhone
+ }}</el-descriptions-item>
+ </el-descriptions>
+ </el-card>
+
+ <!-- 闄勪欢淇℃伅妯″潡 -->
+ <el-card
+ class="detail-section"
+ v-if="
+ transportData.annexfilesList && transportData.annexfilesList.length > 0
+ "
+ >
+ <div slot="header" class="section-header">
+ <i
+ class="el-icon-folder"
+ style="color: #F56C6C; margin-right: 8px;"
+ ></i>
+ <span class="section-title">闄勪欢淇℃伅</span>
+ </div>
+ <el-table :data="attachmentList" style="width: 100%">
+ <el-table-column label="鏂囦欢鍚�" width="300">
+ <template slot-scope="scope">
+ <i class="el-icon-document" style="margin-right: 8px;"></i>
+ <span>{{ scope.row.fileName }}</span>
+ </template>
+ </el-table-column>
+ <el-table-column label="鏂囦欢绫诲瀷" width="120">
+ <template slot-scope="scope">
+ <el-tag size="small">{{ scope.row.type }}</el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column label="鏂囦欢鍦板潃" min-width="200" show-overflow-tooltip>
+ <template slot-scope="scope">
+ <span>{{ scope.row.path }}</span>
+ </template>
+ </el-table-column>
+ <el-table-column label="鎿嶄綔" width="200">
+ <template slot-scope="scope">
+ <el-button size="mini" @click="handlePreview(scope.row)"
+ >棰勮</el-button
>
- 涓婁紶闄勪欢
- </el-button> -->
- </div>
+ <el-button
+ size="mini"
+ type="success"
+ @click="handleDownload(scope.row)"
+ >涓嬭浇</el-button
+ >
+ </template>
+ </el-table-column>
+ </el-table>
+ </el-card>
- <el-table :data="attachmentList" style="width: 100%">
- <el-table-column label="鏂囦欢鍚�" width="300">
- <template slot-scope="scope">
- <i class="el-icon-document" style="margin-right: 8px;"></i>
- <span>{{ scope.row.fileName }}</span>
- </template>
- </el-table-column>
- <el-table-column label="鏂囦欢绫诲瀷" width="120">
- <template slot-scope="scope">
- <el-tag size="small">{{ scope.row.fileType }}</el-tag>
- </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="180">
- <template slot-scope="scope">
- <span>{{ scope.row.uploadTime }}</span>
- </template>
- </el-table-column>
- <el-table-column label="鎿嶄綔">
- <template slot-scope="scope">
- <el-button size="mini" @click="handlePreview(scope.row)"
- >棰勮</el-button
- >
- <el-button
- size="mini"
- type="success"
- @click="handleDownload(scope.row)"
- >涓嬭浇</el-button
- >
- <el-button
- size="mini"
- type="danger"
- @click="handleDelete(scope.row)"
- >鍒犻櫎</el-button
- >
- </template>
- </el-table-column>
- </el-table>
- </el-card>
- </el-tab-pane>
- <!-- 澶囨敞淇℃伅 -->
- <el-tab-pane label="澶囨敞淇℃伅" name="remarks" v-if="transportData.remarks">
- <el-card>
- <div class="remarks-content">
- {{ transportData.remarks }}
- </div>
- </el-card>
- </el-tab-pane>
- </el-tabs>
+ <!-- 澶囨敞淇℃伅妯″潡 -->
+ <el-card class="detail-section" v-if="transportData.remark">
+ <div slot="header" class="section-header">
+ <i class="el-icon-edit" style="color: #909399; margin-right: 8px;"></i>
+ <span class="section-title">澶囨敞淇℃伅</span>
+ </div>
+ <div class="remarks-content">
+ {{ transportData.remark }}
+ </div>
+ </el-card>
+
<!-- PDF棰勮寮圭獥 -->
<el-dialog
:title="previewTitle"
@@ -200,7 +200,6 @@
@close="handlePdfDialogClose"
>
<div class="pdf-preview-container" v-loading="pdfLoading">
- <!-- PDF鎺у埗宸ュ叿鏍� -->
<div class="pdf-toolbar">
<el-button-group>
<el-button
@@ -247,7 +246,6 @@
</el-button>
</div>
- <!-- PDF娓叉煋鍖哄煙 -->
<div class="pdf-viewport">
<pdf
ref="pdf"
@@ -268,9 +266,9 @@
</div>
</el-dialog>
- <!-- 鍥剧墖棰勮寮圭獥锛堜娇鐢‥lement UI鑷甫棰勮锛� -->
+ <!-- 鍥剧墖棰勮寮圭獥 -->
<el-dialog
- :append-to-body="true"
+ :append-to-body="true"
:title="previewTitle"
:visible.sync="imagePreviewVisible"
width="60%"
@@ -303,6 +301,7 @@
</div>
</div>
</el-dialog>
+
<div class="detail-footer">
<el-button @click="handleClose">鍏抽棴</el-button>
</div>
@@ -311,60 +310,27 @@
<script>
import pdf from "vue-pdf";
+import UploadAttachment from "@/components/UploadAttachment";
export default {
name: "TransportDetail",
components: {
pdf
},
+ components: {
+ UploadAttachment
+ },
+ dicts: ["sys_user_sex"],
props: {
transportData: {
type: Object,
default: () => ({})
}
},
- filters: {
- statusFilter(status) {
- const statusMap = {
- pending: "warning",
- transporting: "primary",
- completed: "success",
- cancelled: "danger"
- };
- return statusMap[status];
- }
- },
data() {
return {
- activeTab: "basic",
// 闄勪欢鐩稿叧鏁版嵁
- attachmentList: [
- {
- id: 1,
- fileName: "杞繍浜ゆ帴鍗�.jpg",
- fileType: "docx",
- fileSize: 102400,
- uploadTime: "2024-12-19 10:30:00",
- fileUrl: "https://img95.699pic.com/photo/40142/8262.jpg_wh860.jpg"
- },
- {
- id: 2,
- fileName: "鍖荤枟璁板綍.pdf",
- fileType: "pdf",
- fileSize: 2048000,
- uploadTime: "2024-12-19 11:20:00",
- fileUrl:
- "http://192.168.100.10:8080/profile/upload/2025/12/19/(鍚撮緳8.7)姣忔棩宸ヤ綔鎬荤粨1766131266142.pdf"
- },
- {
- id: 3,
- fileName: "鎮ｈ�呯収鐗�.jpg",
- fileType: "jpg",
- fileSize: 512000,
- uploadTime: "2024-12-19 14:15:00",
- fileUrl: "https://img95.699pic.com/photo/40019/3490.jpg_wh860.jpg"
- }
- ],
+ attachmentList: [],
// PDF棰勮鐩稿叧鏁版嵁
pdfPreviewVisible: false,
pdfLoading: false,
@@ -373,34 +339,80 @@
pageCount: 0,
scale: 100,
pageRotate: 0,
-
// 鍥剧墖棰勮鐩稿叧
imagePreviewVisible: false,
-
// 涓嶆敮鎸侀瑙堢浉鍏�
unsupportedPreviewVisible: false,
-
// 閫氱敤棰勮鏁版嵁
previewTitle: "",
previewUrl: "",
currentFile: null
};
},
+ watch: {
+ transportData: {
+ handler(newVal) {
+ this.transformAttachmentData(newVal.annexfilesList);
+ },
+ immediate: true,
+ deep: true
+ }
+ },
methods: {
- // 鑾峰彇鑱旂郴鏂瑰紡
- getContactPhone(role) {
- if (this.transportData.contacts) {
- const contact = this.transportData.contacts.find(
- item => item.role === role
- );
- return contact ? contact.phone : "鏈～鍐�";
+ /** 杞崲闄勪欢鏁版嵁 */
+ transformAttachmentData(annexfilesList) {
+ if (!annexfilesList || !Array.isArray(annexfilesList)) {
+ this.attachmentList = [];
+ return;
}
- return "鏈～鍐�";
+
+ this.attachmentList = annexfilesList;
+ // this.attachmentList = annexfilesList.map((fileUrl, index) => {
+ // const fileName = this.getFileNameFromUrl(fileUrl);
+ // return {
+ // id: index + 1,
+ // fileName: fileName,
+ // fileType: this.getFileType(fileName),
+ // fileUrl: fileUrl
+ // };
+ // });
},
+
+ /** 浠嶶RL涓彁鍙栨枃浠跺悕 */
+ getFileNameFromUrl(url) {
+ if (!url) return "鏈煡鏂囦欢";
+ return url.split("/").pop() || "鏈煡鏂囦欢";
+ },
+
+ /** 鑾峰彇鐘舵�佹爣绛剧被鍨� */
+ getStatusTagType(transitStatus) {
+ const statusMap = {
+ 1: "warning", // 寰呰浆杩�
+ 2: "primary", // 杞繍涓�
+ 3: "success", // 杞繍瀹屾垚
+ 4: "danger", // 杞繍鍙栨秷
+ 5: "info" // 鏆傚瓨
+ };
+ return statusMap[transitStatus] || "info";
+ },
+
+ /** 鑾峰彇鐘舵�佹枃鏈� */
+ getStatusText(transitStatus) {
+ const statusMap = {
+ 1: "寰呰浆杩�",
+ 2: "杞繍涓�",
+ 3: "杞繍瀹屾垚",
+ 4: "杞繍鍙栨秷",
+ 5: "鏆傚瓨"
+ };
+ return statusMap[transitStatus] || "鏈煡鐘舵��";
+ },
+
// 鍏抽棴寮规
handleClose() {
this.$emit("close");
},
+
// 鑾峰彇鏂囦欢绫诲瀷
getFileType(fileName) {
const extension = fileName
@@ -419,8 +431,9 @@
handlePreview(file) {
this.currentFile = file;
this.previewTitle = `棰勮 - ${file.fileName}`;
- this.previewUrl = file.fileUrl;
+ this.previewUrl = file.path;
const fileType = this.getFileType(file.fileName);
+ console.log(this.previewUrl, "this.previewUrl");
switch (fileType) {
case "pdf":
@@ -435,24 +448,23 @@
}
},
- // PDF棰勮鏂规硶 [1,2](@ref)
+ // PDF棰勮鏂规硶
previewPdf(file) {
this.pdfPreviewVisible = true;
this.pdfLoading = true;
this.currentPage = 1;
this.scale = 100;
this.pageRotate = 0;
- // 璁剧疆PDF婧� [4](@ref)
- this.pdfUrl = file.fileUrl;
+ this.pdfUrl = file.path;
},
- // PDF鍔犺浇瀹屾垚鍥炶皟 [1,2](@ref)
+ // PDF鍔犺浇瀹屾垚鍥炶皟
loadPdfHandler() {
this.pdfLoading = false;
this.currentPage = 1;
},
- // PDF鍔犺浇閿欒澶勭悊 [4](@ref)
+ // PDF鍔犺浇閿欒澶勭悊
pdfErrorHandler(error) {
console.error("PDF鍔犺浇澶辫触:", error);
this.pdfLoading = false;
@@ -460,14 +472,13 @@
this.pdfPreviewVisible = false;
},
- // 缈婚〉鍔熻兘 [2](@ref)
+ // 缈婚〉鍔熻兘
changePage(newPage) {
if (newPage < 1 || newPage > this.pageCount) return;
-
this.currentPage = newPage;
},
- // 缂╂斁鍔熻兘 [2,3](@ref)
+ // 缂╂斁鍔熻兘
zoomIn() {
if (this.scale >= 200) {
this.$message.info("宸叉斁澶у埌鏈�澶ф瘮渚�");
@@ -508,13 +519,12 @@
// 鏂囦欢涓嬭浇
handleDownload(file) {
const link = document.createElement("a");
- link.href = file.fileUrl;
+ link.href = file.path;
link.download = file.fileName;
link.style.display = "none";
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
-
this.$message.success("寮�濮嬩笅杞芥枃浠�");
},
@@ -523,40 +533,8 @@
this.handleDownload(file);
},
- // 鏂囦欢鍒犻櫎
- handleDelete(file) {
- this.$confirm("纭畾瑕佸垹闄よ繖涓檮浠跺悧锛�", "鎻愮ず", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning"
- }).then(() => {
- this.attachmentList = this.attachmentList.filter(
- item => item.id !== file.id
- );
- this.$message.success("鍒犻櫎鎴愬姛");
- });
- },
- // 涓婁紶闄勪欢
- handleUpload() {
- this.$message.info("涓婁紶鍔熻兘寰呭疄鐜�");
- },
-
- // 鍘熸湁鏂规硶淇濇寔涓嶅彉
- getContactPhone(role) {
- if (this.transportData.contacts) {
- const contact = this.transportData.contacts.find(
- item => item.role === role
- );
- return contact ? contact.phone : "鏈～鍐�";
- }
- return "鏈～鍐�";
- },
-
- handleClose() {
- this.$emit("close");
- },
-
formatFileSize(bytes) {
+ if (!bytes) return "鏈煡澶у皬";
if (bytes === 0) return "0 B";
const k = 1024;
const sizes = ["B", "KB", "MB", "GB"];
@@ -568,11 +546,35 @@
</script>
<style scoped>
-.transport-detail {
- padding: 0 20px;
+.transport-detail-container {
+ max-height: 70vh;
+ overflow-y: auto;
+ padding: 0 10px;
}
-/* PDF棰勮瀵硅瘽妗嗘牱寮� */
+.detail-section {
+ margin-bottom: 16px;
+}
+
+.section-header {
+ display: flex;
+ align-items: center;
+}
+
+.section-title {
+ font-size: 16px;
+ font-weight: bold;
+ color: #303133;
+}
+
+.remarks-content {
+ padding: 15px;
+ line-height: 1.6;
+ color: #606266;
+ white-space: pre-line;
+}
+
+/* PDF棰勮鐩稿叧鏍峰紡 */
.pdf-preview-dialog {
margin-top: 5vh !important;
}
@@ -596,7 +598,6 @@
height: 100%;
}
-/* PDF宸ュ叿鏍忔牱寮� */
.pdf-toolbar {
padding: 15px 20px;
background: #f5f7fa;
@@ -612,7 +613,6 @@
margin: 0 15px;
}
-/* PDF瑙嗗浘鍖哄煙鏍峰紡 */
.pdf-viewport {
flex: 1;
overflow: auto;
@@ -623,7 +623,6 @@
align-items: flex-start;
}
-/* 鍥剧墖棰勮鏍峰紡 */
.image-preview-container {
text-align: center;
padding: 20px;
@@ -635,8 +634,19 @@
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
+.detail-footer {
+ text-align: center;
+ margin-top: 20px;
+ padding-top: 20px;
+ border-top: 1px solid #ebeef5;
+}
+
/* 鍝嶅簲寮忚璁� */
@media (max-width: 768px) {
+ .transport-detail-container {
+ padding: 0 5px;
+ }
+
.pdf-toolbar {
flex-direction: column;
gap: 10px;
@@ -645,23 +655,6 @@
.zoom-controls {
margin: 10px 0;
}
-
- .pdf-preview-dialog {
- width: 95% !important;
- }
-}
-
-.detail-footer {
- text-align: center;
- margin-top: 20px;
- padding-top: 20px;
- border-top: 1px solid #ebeef5;
-}
-
-.remarks-content {
- padding: 15px;
- line-height: 1.6;
- color: #606266;
}
::v-deep .el-descriptions__label {
--
Gitblit v1.9.3