fix:修改合并弹窗中放大图片样式,修改病害确认中查看图片样式
This commit is contained in:
parent
fa6b90408c
commit
04a62cbd68
@ -2,7 +2,7 @@
|
|||||||
* @Author: SunTao 328867980@qq.com
|
* @Author: SunTao 328867980@qq.com
|
||||||
* @Date: 2024-10-22 15:30:25
|
* @Date: 2024-10-22 15:30:25
|
||||||
* @LastEditors: SunTao 328867980@qq.com
|
* @LastEditors: SunTao 328867980@qq.com
|
||||||
* @LastEditTime: 2024-12-27 17:11:58
|
* @LastEditTime: 2025-01-06 15:21:22
|
||||||
* @FilePath: \znxjxt-ui\src\views\big-screen\components\img-dialog.vue
|
* @FilePath: \znxjxt-ui\src\views\big-screen\components\img-dialog.vue
|
||||||
* @Description: 大屏查看图片弹窗
|
* @Description: 大屏查看图片弹窗
|
||||||
-->
|
-->
|
||||||
@ -346,9 +346,12 @@ export default {
|
|||||||
*/
|
*/
|
||||||
initBodySize() {
|
initBodySize() {
|
||||||
this.initWidth = this.$refs.imageView.clientWidth; // 拿到父元素宽
|
this.initWidth = this.$refs.imageView.clientWidth; // 拿到父元素宽
|
||||||
this.initHeight = this.initWidth * ((1080 * 0.31) / (1920 - 1080 * 0.02)); // 根据宽计算高实现自适应
|
this.initHeight =
|
||||||
this.elWidth = this.initWidth * (100 / (1920 / 1.2));
|
this.initWidth *
|
||||||
this.elHeight = this.initHeight * (100 / (1080 / 2.15));
|
((window.screen.height * 0.31) /
|
||||||
|
(window.screen.width - window.screen.height * 0.02)); // 根据宽计算高实现自适应
|
||||||
|
this.elWidth = this.initWidth * (100 / (window.screen.width / 1.2));
|
||||||
|
this.elHeight = this.initHeight * (100 / (window.screen.height / 2.15));
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -370,8 +373,10 @@ export default {
|
|||||||
this.scale = 1;
|
this.scale = 1;
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
this.elWidth = this.initWidth * (100 / (1920 / 1.2)) * this.zoom;
|
this.elWidth =
|
||||||
this.elHeight = this.initHeight * (100 / (1080 / 2)) * this.zoom;
|
this.initWidth * (100 / (window.screen.width / 1.2)) * this.zoom;
|
||||||
|
this.elHeight =
|
||||||
|
this.initHeight * (100 / (window.screen.height / 2)) * this.zoom;
|
||||||
// 调整滚动容器的尺寸
|
// 调整滚动容器的尺寸
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
const container = this.$refs.imageContainer;
|
const container = this.$refs.imageContainer;
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
* @Author: SunTao 328867980@qq.com
|
* @Author: SunTao 328867980@qq.com
|
||||||
* @Date: 2024-11-04 10:54:59
|
* @Date: 2024-11-04 10:54:59
|
||||||
* @LastEditors: SunTao 328867980@qq.com
|
* @LastEditors: SunTao 328867980@qq.com
|
||||||
* @LastEditTime: 2024-11-04 17:25:42
|
* @LastEditTime: 2025-01-06 13:18:09
|
||||||
* @FilePath: \znxjxt-ui\src\views\xj\inspection\disease-management\components\merge-dialog.vue
|
* @FilePath: \znxjxt-ui\src\views\xj\inspection\disease-management\components\merge-dialog.vue
|
||||||
* @Description: 病害管理-合并病害弹窗
|
* @Description: 病害管理-合并病害弹窗
|
||||||
-->
|
-->
|
||||||
@ -206,7 +206,7 @@
|
|||||||
<el-dialog
|
<el-dialog
|
||||||
title="查看图片"
|
title="查看图片"
|
||||||
:visible.sync="showImageDialog"
|
:visible.sync="showImageDialog"
|
||||||
width="75rem"
|
width="85rem"
|
||||||
append-to-body
|
append-to-body
|
||||||
destroy-on-close
|
destroy-on-close
|
||||||
@close="imgCancel"
|
@close="imgCancel"
|
||||||
@ -224,6 +224,21 @@
|
|||||||
class="rect-overlay"
|
class="rect-overlay"
|
||||||
:style="getRectStyle(rect)"
|
:style="getRectStyle(rect)"
|
||||||
></div>
|
></div>
|
||||||
|
<div class="rect-image">
|
||||||
|
采集时间:
|
||||||
|
{{
|
||||||
|
new Date(currentImageItem.createdTime).toLocaleString()
|
||||||
|
}}
|
||||||
|
起始桩号: {{ currentImageItem.stakeStart || "暂无数据" }} 终止桩号:
|
||||||
|
{{ currentImageItem.stakeEnd || "暂无数据" }}
|
||||||
|
病害类型:
|
||||||
|
{{ currentImageItem.defectTypeName || "暂无数据" }}
|
||||||
|
病害面积:{{ currentImageItem.targetArea }}平方米 病害长度:{{
|
||||||
|
currentImageItem.targetLen * 1 <= 0
|
||||||
|
? "暂无数据"
|
||||||
|
: `${currentImageItem.targetLen}米`
|
||||||
|
}}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
</div>
|
</div>
|
||||||
@ -538,6 +553,7 @@ export default {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
height: 80%;
|
height: 80%;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
@ -554,4 +570,14 @@ export default {
|
|||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
border: 2px solid red;
|
border: 2px solid red;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 图片信息
|
||||||
|
.rect-image {
|
||||||
|
width: 90%;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
color: #ffffff;
|
||||||
|
background-color: rgba(0, 0, 0, 0.5);
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
Loading…
x
Reference in New Issue
Block a user