Files
XiaoLingHou_web/pages/letter-view/letter-view.vue
2023-12-29 00:08:10 +08:00

77 lines
1.6 KiB
Vue

<template>
<view class="preview">
<u-navbar title="书信预览" autoBack bg-color="transparent" placeholder></u-navbar>
<view class="preview-content">
<view class="preview-content-inner" style="background: url(../../static/mine/preview_bg.png) center/100% 100% no-repeat;">
<view style="white-space: pre-wrap; line-height: 40rpx;">
{{ letterInfo.message||'' }}
</view>
<view class="preview-ft" v-if="loading">
<view class="name">
{{ letterInfo.letterAthor||'' }}
</view>
<view class="time">
{{ letterInfo.currentTime||'' }}
</view>
</view>
<view class="preview-image" v-if="letterInfo.fileList.length > 0">
<image v-for="(item, index) in letterInfo.fileList" :key="index" :src="item.url" style="width: 100%;"></image>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
viewImgSrc: '',
loading: true
}
},
computed: {
letterInfo() {
console.log(this.$store.letterViewInfo);
return this.$store.letterViewInfo
}
},
onLoad(option) {
},
methods: {
}
}
</script>
<style scoped lang="scss">
.preview {
box-sizing: border-box;
height: 100vh;
padding: 30rpx 0 0 0;
display: flex;
flex-direction: column;
.preview-content {
flex: 1;
overflow: auto;
.preview-content-inner {
box-sizing: border-box;
padding: 240rpx 80rpx 140rpx;
overflow-y: auto;
font-family: caisemenghuanjingyu;
}
.preview-ft {
// padding-top: 40rpx;
view {
display: flex;
justify-content: flex-end;
}
}
}
}
</style>