样式

src/views/SentryEmergencyCenter.vue

@@ -238,12 +238,74 @@
                     </div>
                 </div>
                 <div class="right transferBg">
-                    <h3>事件日志</h3>
-					<h4 style="margin-top: 4%;"></h4>
-					<div v-for="(e,idx) in emergencyEventDetails.deptList ? emergencyEventDetails.deptList : [] " :key="idx" class="planItem" style="display: flex;border: 1px solid #50A09E;width: 98%;height: 57px !important;">
-						<img src="@/assets/images/planIcon.png" style="width: 10%;position: relative;top: -38%;left: -5%;height: 50px;">
-						<div style="position: relative;bottom: 7%;">{{ e.mapDeptName || '' }}</div>
-					</div>
+									<h3>事件日志</h3>
+									<div class="block le_ri">
+										<el-scrollbar style="height: 480px;" class="spsb_time">
+											<el-timeline>
+												<el-timeline-item
+														v-for="(activity, index) in activities"
+														:key="index"
+														placement="top">
+													<span class="timeline-span">{{activity.createTime}}</span>
+													<el-card>
+														<h4>{{activity.logContent}}</h4>
+														<p>{{activity.createName}} 提交于 {{activity.createTime}}</p>
+														<!--<el-image v-if="activity.attachList.length>0" v-for="item in activity.attachList" :src="item.attachPath" style="width: 150px;"></el-image>-->
+														<!-- 图片、视频、文件 组件 -->
+														<template v-if="activity.attachList.length>0" v-for="item in activity.attachList">
+															<el-image v-if="item.attachPath.endsWith('.jpg') || item.attachPath.endsWith('.png')" style="width: 270px; height: 180px; margin-right: 9px;" :src="item.attachPath"></el-image>
+															<video controls v-else-if="item.attachPath.endsWith('.mp4')" style="width: 270px; height: 180px; margin-right: 9px;" :src="item.attachPath"></video>
+															<a v-else-if="item.attachPath.endsWith('.pdf')" :href="item.attachPath" style="width: 800px; height: 20px; display: block; color: #fff!important;">📄 {{ item.fileName }}</a>
+															<a v-else-if="item.attachPath.endsWith('.doc')" :href="item.attachPath" style="width: 800px; height: 20px; display: block; color: #fff!important;">📝 {{ item.fileName }}</a>
+															<a v-else-if="item.attachPath.endsWith('.docx')" :href="item.attachPath" style="width: 800px; height: 20px; display: block; color: #fff!important;">📝 {{ item.fileName }}</a>
+															<a v-else-if="item.attachPath.endsWith('.xls')" :href="item.attachPath" style="width: 800px; height: 20px; display: block; color: #fff!important;">📊 {{ item.fileName }}</a>
+															<a v-else-if="item.attachPath.endsWith('.xlsx')" :href="item.attachPath" style="width: 800px; height: 20px; display: block; color: #fff!important;">📊 {{ item.fileName }}</a>
+															<a v-else-if="item.attachPath.endsWith('.ppt')" :href="item.attachPath" style="width: 800px; height: 20px; display: block; color: #fff!important;">📑 {{ item.fileName }}</a>
+															<a v-else-if="item.attachPath.endsWith('.pptx')" :href="item.attachPath" style="width: 800px; height: 20px; display: block; color: #fff!important;">📑 {{ item.fileName }}</a>
+															<a v-else-if="item.attachPath.endsWith('.zip')" :href="item.attachPath" style="width: 800px; height: 20px; display: block; color: #fff!important;">📦 {{ item.fileName }}</a>
+															<a v-else-if="item.attachPath.endsWith('.rar')" :href="item.attachPath" style="width: 800px; height: 20px; display: block; color: #fff!important;">📦 {{ item.fileName }}</a>
+															<a v-else-if="item.attachPath.endsWith('.txt')" :href="item.attachPath" style="width: 800px; height: 20px; display: block; color: #fff!important;">📃 {{ item.fileName }}</a>
+															<a v-else :href="item.attachPath" style="width: 800px; height: 20px; display: block; color: #fff!important;">{{ item.fileName }}</a>
+
+															<!--https://chat.deepseek.com/a/chat/s/8d9fb914-9500-442e-bc30-6d6cad5ba7e0-->
+															<!--pdf: '📄',-->
+															<!--doc: '📝',-->
+															<!--docx: '📝',-->
+															<!--xls: '📊',-->
+															<!--xlsx: '📊',-->
+															<!--ppt: '📑',-->
+															<!--pptx: '📑',-->
+															<!--zip: '📦',-->
+															<!--rar: '📦',-->
+															<!--txt: '📃'-->
+														</template>
+													</el-card>
+												</el-timeline-item>
+											</el-timeline>
+										</el-scrollbar>
+										<div class="spsb_xx">
+											<div class="spsb_xx_btn">
+												<el-tree class="tree-border tree_scroll" style="height: 23vh; overflow-y:scroll" :data="deptOptionsLiandong"
+																 v-if="eventDetails.eventStatus=='event_confirmation'||eventDetails.eventStatus=='event_signature'"
+																 show-checkbox ref="LiandongDept" node-key="id" :check-strictly="true"
+																 :accordion="true" empty-text="加载中，请稍候" :props="defaultProps"></el-tree>
+												<div  class="spsb_rad" v-if="eventDetails.eventStatus=='event_completion'">
+													<el-radio-group v-model="reviewStatus" v-for="(item,idx) in reviewStatusList">
+														<el-radio :label="item.value" :name="item.value">{{ item.name }}</el-radio>
+													</el-radio-group>
+												</div>
+												<textarea class="spsb_text" v-model="reviewDescription" placeholder="请在此处填写督办信息"> </textarea>
+												<el-button type="primary"  v-if="eventDetails.eventStatus=='event_confirmation'" @click="eventSignature(eventDetails)">签收</el-button>
+												<el-button type="primary"  v-if="eventDetails.eventStatus=='event_signature'" @click="configDept(eventDetails)">联动</el-button>
+												<el-button type="primary"  v-if="eventDetails.eventStatus=='event_signature'" @click="eventCompletion(eventDetails)">办结</el-button>
+												<el-button type="primary"  v-if="eventDetails.eventStatus=='event_completion'" @click="eventReview(eventDetails)">审核</el-button>
+												<el-button type="primary"  v-if="eventDetails.eventStatus=='event_archiving'" @click="eventArchiving(eventDetails)">归档</el-button>
+												<button class="spsb_fs_btn" @click="addEventLogDescription(eventDetails)">督办</button>
+												<eventLogUpload ref="eventLogUpload" @openEventDetails = "openEventDetails"></eventLogUpload>
+												<el-button size="small" icon="el-icon-upload" style="padding-right: 70px" @click="showEventLogUpload(eventDetails)">上传附件</el-button>
+											</div>
+										</div>
+									</div>
                 </div>
             </div>
         </el-dialog>
@@ -394,16 +456,18 @@
 	import Cookies from 'js-cookie'
 	import { getToken } from '@/utils/auth'
 	import supermap from '@/components/supermap-2.5d' //超图
+	import eventLogUpload from '@/views/eventLogUpload.vue' // 日志上传文件
 	import {getUserProfile} from "@/api/system/user";
 	import {treeselectAll} from '@/api/system/dept.js'
-    import {
-        getEventList,
+	import {
+		getEventLog, // 事件日志
+		getEventList,
 		getPlanList,
-        getDescriptionByContingency,
+		getDescriptionByContingency,
 		eventReport,
 		updateEventContingencyDetail,
 		getEmergencyStatisticsByYear
-    } from "@/api/event.js"
+	} from "@/api/event.js"
 	import {
 		listDeviceAll,
 		selectByDeviceId,
@@ -421,7 +485,8 @@
 	export default {
 		name:'MyChart',
 		components: {
-      		Button,
+			eventLogUpload,
+			Button,
 			supermap,
 			ImageUpload
 		},
@@ -459,6 +524,10 @@
 		},
 		data() {
 			return {
+				reviewDescription:'', // 督办信息描述
+				eventDetails:{},                // 事件详情信息
+				activities:[],                  // 事件日志信息
+
         visible: false,
         deptOptionsLiandong: [],
 				deptId:null,
@@ -561,6 +630,41 @@
 			}
 		},
 		methods: {
+			// 事件日志 开始
+			openEventDetails(params){ // 上传文件和督办 保存成功后也回调这个
+				this.eventId = params.eventId; // 详情 弹窗 事件ID
+				// this.isEventDetails = true;
+				// this.eventDetails = params;
+				getEventLog(params.eventId).then(req => {
+					this.activities = req.data;
+					// 处理文件顺序 图片 → 视频 → 文件 → 未知文件
+
+					// 定义排序顺序
+					const order = ['jpg', 'png', 'mp4', 'pdf', 'doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'zip', 'rar', 'txt'];
+
+					for(let activity of this.activities){
+						// 对attachList进行排序
+						activity.attachList.sort((a, b) => {
+							// 获取文件扩展名（转换为小写以保持一致性）
+							const extA = a.attachPath.split('.').pop().toLowerCase(); // fileName
+							const extB = b.attachPath.split('.').pop().toLowerCase(); // fileName
+
+							// 获取扩展名在排序顺序中的索引
+							const indexA = order.indexOf(extA);
+							const indexB = order.indexOf(extB);
+
+							// 如果扩展名不在排序规则中，放到最后
+							if (indexA === -1 && indexB === -1) return 0;
+							if (indexA === -1) return 1;
+							if (indexB === -1) return -1;
+
+							return indexA - indexB;
+						});
+					}
+				})
+			},
+			// 事件日志 结束
+
       setPositioning(longitude, latitude) {
         this.positioning.longitude = longitude
         this.positioning.latitude = latitude
@@ -688,6 +792,7 @@
 			},
             getEventDetail(eventId,latitude,longitude){
 				this.eventId = eventId
+							this.openEventDetails({eventId: this.eventId})
                 getDescriptionByContingency(eventId).then(res => {
                     if(res.code == 200){
 						this.emergencyEventDetails = res.data
@@ -837,7 +942,6 @@
                 })
             },
 			getPlanList(){
-        debugger
 				getPlanList(this.planParams).then(res => {
 					this.planList = res.rows
 					this.planListSearch = res.rows