<template>
	<view>
		<view class="preview_icon">点击图片预览</view>
		<image 
			class="image"
			:src="promise.url" 
			mode="widthFix"
			@click="preview"
		>
		</image>
	</view>
</template>

<script>
	
	import { mapState } from "vuex"
	
	export default {
		name:"promise_info",
		computed:{
			...mapState(["promise"])
		},
		methods:{
			preview(){
				let arr=[]
				arr.push(this.promise.url)
				uni.previewImage({
					urls:arr
				})
			}
		}
	}
</script>

<style lang="scss">
	page{
		width: calc(100% - 40rpx);
		min-height: 100%;
		background: $uni-bg-color-normal;
		padding: 20rpx;
	}
	.image{
		width: 100%;
	}
	.time{
		display: block;
		margin: 10px 0;
		font-size: 28rpx;
		color: #4D4D4D;
	}
	.preview_icon{
		display: flex;
		align-items: center;
		font-size: 24rpx;
		justify-content: center;
		margin-bottom: 10px;
		
		&:before{
			content: "";
			display: block;
			width: 40rpx;
			height: 40rpx;
			background-image: url("../../static/preview.png");
			background-size: 100% 100%;
		}
	}
</style>
