|
|
@@ -15,7 +15,7 @@
|
|
|
draggable="false"
|
|
|
>
|
|
|
</button>
|
|
|
- <h1>asdlfjsdfjasdfsdfasdfasf</h1>
|
|
|
+ <h1>{{ desc.name }}</h1>
|
|
|
<button
|
|
|
class="expand-status"
|
|
|
:class="{
|
|
|
@@ -33,9 +33,12 @@
|
|
|
</div>
|
|
|
<div
|
|
|
v-show="isPanoDescExpanded"
|
|
|
- class="content"
|
|
|
+ class="content-wrap"
|
|
|
>
|
|
|
- 了解工卡阿萨。阿拉贡附件,奥维考虑。
|
|
|
+ <div
|
|
|
+ class="content"
|
|
|
+ v-html="desc.txt"
|
|
|
+ />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
@@ -43,6 +46,12 @@
|
|
|
<script>
|
|
|
|
|
|
export default {
|
|
|
+ props: {
|
|
|
+ desc: {
|
|
|
+ type: Object,
|
|
|
+ required: true,
|
|
|
+ },
|
|
|
+ },
|
|
|
data() {
|
|
|
return {
|
|
|
}
|
|
|
@@ -90,6 +99,7 @@ export default {
|
|
|
overflow: hidden;
|
|
|
text-overflow: ellipsis;
|
|
|
white-space: pre;
|
|
|
+ text-align: center;
|
|
|
}
|
|
|
> button.expand-status {
|
|
|
width: 1.75rem;
|
|
|
@@ -101,21 +111,22 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- .content {
|
|
|
+ .content-wrap {
|
|
|
position: absolute;
|
|
|
- top: calc(100% + 0.63rem);
|
|
|
+ top: calc(100% + 0.8rem);
|
|
|
left: 50%;
|
|
|
transform: translateX(-50%);
|
|
|
width: 29.17rem;
|
|
|
- max-height: 30rem;
|
|
|
- overflow: auto;
|
|
|
background-color: rgba(147, 9, 9, 0.9);
|
|
|
padding: 1.67rem;
|
|
|
border-radius: 0.42rem;
|
|
|
- text-indent: 2em;
|
|
|
- color: #fff;
|
|
|
- font-size: 1.5rem;
|
|
|
- line-height: 3rem;
|
|
|
+ .content {
|
|
|
+ max-height: calc(30rem - 2 * 1.67rem);
|
|
|
+ overflow: auto;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 1.5rem;
|
|
|
+ line-height: 3rem;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
</style>
|