change(record): 增加母线温度记录和巡检柜任务的详细时间信息

- 在 RecordBusbarTemp 和 RecordInspectionCabinet 模型中,将记录时间和开始/结束时间的格式从日期改为完整的日期时间
- 在前端界面中,更新了相关表格列和表单控件的显示格式,以显示完整的日期时间信息
- 优化了图片显示对话框的样式,增加了对高分辨率图像的支持
master
zch 2 days ago
parent 4f8c947662
commit 6fa98e508d

@ -119,6 +119,8 @@ public class RecordInspectionCabinetController extends BaseController
return toAjax(recordInspectionCabinetService.deleteRecordInspectionCabinetByObjIds(objIds));
}
/**
* HTTP GET
* @param filePath

@ -77,8 +77,8 @@ public class RecordBusbarTemp extends BaseEntity
private Date updatedTime;
/** 记录时间 */
@JsonFormat(pattern = "yyyy-MM-dd")
@Excel(name = "记录时间", width = 30, dateFormat = "yyyy-MM-dd")
@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
@Excel(name = "记录时间", width = 30, dateFormat = "yyyy-MM-dd HH:mm:ss")
private Date recordTime;
public void setObjId(Long objId)

@ -26,13 +26,13 @@ public class RecordInspectionCabinet extends BaseEntity
private String taskCode;
/** 开始时间 */
@JsonFormat(pattern = "yyyy-MM-dd")
@Excel(name = "开始时间", width = 30, dateFormat = "yyyy-MM-dd")
@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
@Excel(name = "开始时间", width = 30, dateFormat = "yyyy-MM-dd HH:mm:ss")
private Date beginTime;
/** 结束时间 */
@JsonFormat(pattern = "yyyy-MM-dd")
@Excel(name = "结束时间", width = 30, dateFormat = "yyyy-MM-dd")
@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
@Excel(name = "结束时间", width = 30, dateFormat = "yyyy-MM-dd HH:mm:ss")
private Date endTime;
/** 文件路径 */

@ -135,7 +135,7 @@
<el-date-picker
v-model="daterangeRecordTime"
style="width: 240px"
value-format="yyyy-MM-dd"
value-format="yyyy-MM-dd HH:mm:ss"
type="daterange"
range-separator="-"
start-placeholder="开始日期"
@ -234,7 +234,7 @@
</el-table-column>-->
<el-table-column label="记录时间" align="center" prop="recordTime" width="180">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.recordTime, '{y}-{m}-{d}') }}</span>
<span>{{ parseTime(scope.row.recordTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
@ -335,8 +335,8 @@
<el-form-item label="记录时间" prop="recordTime">
<el-date-picker clearable
v-model="form.recordTime"
type="date"
value-format="yyyy-MM-dd"
type="datetime"
value-format="yyyy-MM-dd HH:mm:ss"
placeholder="请选择记录时间">
</el-date-picker>
</el-form-item>
@ -350,7 +350,20 @@
<!-- 图片显示对话框 -->
<el-dialog :title="photoTitle" :visible.sync="photoOpen" width="500px" append-to-body>
<!-- 上面的图像是 2688x1520下面的图像是 1920x1080-->
<el-dialog :title="photoTitle" :visible.sync="photoOpen" width="800px" append-to-body>
<div class="dialog-content">
<div class="image-container">
<img :src="visiblePhoto" alt="显示图片" />
</div>
<div class="image-container">
<img :src="thermalPhoto" alt="显示图片" />
</div>
</div>
</el-dialog>
<!--<el-dialog :title="photoTitle" :visible.sync="photoOpen" width="500px" append-to-body>
<template>
<div class="image-container">
<img :src="visiblePhoto" alt="显示图片" />
@ -359,8 +372,7 @@
<img :src="thermalPhoto" alt="显示图片" />
</div>
</template>
</el-dialog>
</el-dialog>-->
</div>
@ -501,6 +513,7 @@ export default {
this.photoOpen = false;
this.visiblePhoto = null;
this.thermalPhoto = null;
this.photoOpen = null;
},
/** 搜索按钮操作 */
handleQuery() {
@ -559,7 +572,7 @@ export default {
this.visiblePhoto = visibleResponse;*/
this.photoOpen = true;
this.photoTitle = "图片显示";
this.photoTitle = row.filePath + "图片显示";
}else {
this.$modal.msgError("暂无图像名称");
}
@ -606,9 +619,8 @@ export default {
};
</script>
<style scoped>
<!--<style scoped>
/* 定义一个图像容器类,用于设置图像的布局和样式 */
.image-container {
width: 100%; /* 设置容器宽度为100%,以适应父元素 */
@ -623,4 +635,32 @@ export default {
height: 100%; /* 设置图像高度为100%,充满容器 */
object-fit: cover; /* 或者使用 contain这里选择 cover 以保持图像的宽高比并覆盖整个容器 */
}
</style>-->
<!--上面的图像是 2688x1520下面的图像是 1920x1080-->
<style scoped>
/* 定义一个图像容器类,用于设置图像的布局和样式 */
.image-container {
width: 100%; /* 设置容器宽度为100%,以适应父元素 */
max-width: 1080px; /* 设置容器的最大宽度,防止图像在大屏幕上显示过大 */
margin: 0 auto; /* 居中显示容器 */
position: relative; /* 设置相对定位,以便于在容器内进行绝对定位 */
aspect-ratio: 16 / 9; /* 16:9 的比例,适合 1920x1080 的图像 */
margin-bottom: 10px; /* 减少容器之间的间距 */
}
/* 设置图像容器内的图像样式 */
.image-container img {
width: 100%; /* 设置图像宽度为100%,充满容器 */
height: 100%; /* 设置图像高度为100%,充满容器 */
object-fit: contain; /* 使用 contain 以确保图像完整显示 */
}
/* 对话框内容区域的样式 */
.dialog-content {
max-height: 80vh; /* 设置最大高度为视口高度的 80% */
overflow-y: auto; /* 添加垂直滚动条 */
}
</style>

@ -20,8 +20,8 @@
<!-- <el-form-item label="开始时间" prop="beginTime">
<el-date-picker clearable
v-model="queryParams.beginTime"
type="date"
value-format="yyyy-MM-dd"
type="datetime"
value-format="yyyy-MM-dd HH:mm:ss"
placeholder="请选择开始时间">
</el-date-picker>
</el-form-item>-->
@ -156,12 +156,12 @@
<el-table-column label="任务编号" align="center" prop="taskCode" />
<el-table-column label="开始时间" align="center" prop="beginTime" width="180">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.beginTime, '{y}-{m}-{d}') }}</span>
<span>{{ parseTime(scope.row.beginTime, '{y}-{m}-{d} {hh}:{mm}:{ss}') }}</span>
</template>
</el-table-column>
<!-- <el-table-column label="结束时间" align="center" prop="endTime" width="180">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.endTime, '{y}-{m}-{d}') }}</span>
<span>{{ parseTime(scope.row.endTime, '{y}-{m}-{d} {hh}:{mm}:{ss}') }}</span>
</template>
</el-table-column>-->
<el-table-column label="打开文件" align="center">
@ -224,15 +224,15 @@
<el-form-item label="开始时间" prop="beginTime">
<el-date-picker clearable
v-model="form.beginTime"
type="date"
value-format="yyyy-MM-dd"
type="datetime"
value-format="yyyy-MM-dd HH:mm:ss"
placeholder="请选择开始时间">
</el-date-picker>
</el-form-item>
<el-form-item label="结束时间" prop="endTime">
<el-date-picker clearable
v-model="form.endTime"
type="date"
type="datetime"
value-format="yyyy-MM-dd"
placeholder="请选择结束时间">
</el-date-picker>
@ -280,6 +280,7 @@
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
</div>
</template>

Loading…
Cancel
Save