<template>
	<view class="page">
		<web-view :webview-styles="webviewStyles" :src="src"></web-view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				files: [
					'https://huoran.oss-cn-shenzhen.aliyuncs.com/20220530/docx/1531155187057057792.docx',
					'https://huoran.oss-cn-shenzhen.aliyuncs.com/20220530/docx/1531156166884220928.docx',
					'https://huoran.oss-cn-shenzhen.aliyuncs.com/20220601/docx/1531930503312596992.docx', // 人工智能
					'https://huoran.oss-cn-shenzhen.aliyuncs.com/20220601/docx/1531930756791164928.docx', // 大数据
					'https://huoran.oss-cn-shenzhen.aliyuncs.com/20220601/docx/1531929864150999040.docx', // 金融科技
				],
				src: '',
				webviewStyles: {
					progress: {
						color: '#FF3333'
					}
				},
			}
		},
		onShow() {
			const pages = getCurrentPages()
			const { options } = 
			this.src = `http://view.xdocin.com/xdoc?_xdoc=${this.files[pages[pages.length - 1].options.id]}`
			// this.preview()
		},
		methods: {
			preview() {
				uni.showLoading({
					title: '加载中',
					mask: true
				  })
				  //下载文件资源到本地
				  uni.downloadFile({
					url: this.src,
					success: function(res) {
					  console.log('downloadFile ==> ',res)
					  uni.hideLoading();
					  var filePath = res.tempFilePath;
					  uni.showLoading({
						title: '正在打开',
						mask: true
					  })
					  // 新开页面打开文档，支持格式：doc, xls, ppt, pdf, docx, xlsx, pptx。
					  uni.openDocument({
						filePath: filePath,
						fileType: 'docx',// 文件类型，指定文件类型打开文件，有效值 doc, xls, ppt, pdf, docx, xlsx, pptx 
						// showMenu: true, // 允许出现分享功能
						success: res => {
						  uni.hideLoading();
						  console.log('打开文档成功',res);
						},
						fail: openError => {
						  uni.hideLoading();
						  console.log('fail:' + JSON.stringify(openError));
						}
					  });
					},
					fail: function(err) {
					  uni.hideLoading();
					  console.log('fail:' + JSON.stringify(err));
					}
				  });
			}
		}
	}
</script>

<style scoped lang="scss">
.page {
	padding: 60rpx 40rpx;
	background-color: #fff;
}
.title {
	margin-bottom: 30rpx;
	font-size: 38rpx;
	text-align: center;
	color: #333;
}
.content {
	white-space: pre-wrap;
	font-size: 28rpx;
}
</style>
