提交 977376e3 authored 作者: 龙菲's avatar 龙菲

优化博物馆和文物详情文字高度;优化神秘贵州展厅加载速度

上级 00b51b8d
...@@ -7,24 +7,15 @@ ...@@ -7,24 +7,15 @@
--> -->
<template> <template>
<span <span class="image-item" :style="{
class="image-item"
:style="{
width: width, width: width,
height: height, height: height,
}" }">
>
<span class="warp" @click="showImage"> <span class="warp" @click="showImage">
<span class="el-icon-view" style="margin-right:10px"></span> <span class="el-icon-view" style="margin-right:10px"></span>
查看大图 查看大图
</span> </span>
<el-image <el-image ref="Image" class="image" :src="imgSrc" :preview-src-list="previewSrc" fit="contain"></el-image>
ref="Image"
class="image"
:src="imgSrc"
:preview-src-list="previewSrc"
fit="contain"
></el-image>
</span> </span>
</template> </template>
...@@ -41,6 +32,10 @@ export default { ...@@ -41,6 +32,10 @@ export default {
typeof: String, typeof: String,
default: '100px', default: '100px',
}, },
highImgSrc: {
typeof: String,
default: '',
}
}, },
data() { data() {
return { return {
...@@ -48,7 +43,7 @@ export default { ...@@ -48,7 +43,7 @@ export default {
baseurl: '', baseurl: '',
}; };
}, },
mounted() {}, mounted() { },
watch: {}, watch: {},
computed: { computed: {
imgSrc() { imgSrc() {
...@@ -59,10 +54,11 @@ export default { ...@@ -59,10 +54,11 @@ export default {
} }
}, },
previewSrc() { previewSrc() {
let src = this.highImgSrc || this.src
if (typeof this.src == 'string') { if (typeof this.src == 'string') {
return [this.src]; return [src];
} else { } else {
return this.src; return src;
} }
}, },
}, },
...@@ -83,13 +79,16 @@ export default { ...@@ -83,13 +79,16 @@ export default {
position: relative; position: relative;
display: inline-block; display: inline-block;
cursor: pointer; cursor: pointer;
& + .image-item {
&+.image-item {
margin-left: 10px; margin-left: 10px;
} }
.image { .image {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.warp { .warp {
position: absolute; position: absolute;
width: 100%; width: 100%;
...@@ -99,6 +98,7 @@ export default { ...@@ -99,6 +98,7 @@ export default {
align-items: center; align-items: center;
color: #fff; color: #fff;
} }
&:hover { &:hover {
.warp { .warp {
z-index: 1; z-index: 1;
......
...@@ -232,7 +232,7 @@ $node-w: 700px; ...@@ -232,7 +232,7 @@ $node-w: 700px;
.inner-left { .inner-left {
// padding-left: 120px; // padding-left: 120px;
width: 50%; width: 50%;
height: calc(100vh - 100px); min-height: calc(100vh - 100px);
position: relative; position: relative;
.info-container-left { .info-container-left {
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论