|
|
|
@ -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>
|
|
|
|
|
|
|
|
|
|