<template>
	<div style="height: 75vh;overflow-y: auto;overflow-x: hidden;">
		<pdf :src="src">{{fileName}}</pdf>
	    <div @click="fileDownload(fileUrl,fileName)">下载</div>
	</div>
</template>

<script>
	import pdf from 'vue-pdf'
	export default {
	    components: {pdf},
		props:{
			fileurl:{
				type:String,
				default:""
			},
			fileName:{
				type:String,
				default:""
			}
		},
	    data(){
	        return{
	            src: '',
	        }
	    },
		created() {
			console.log(this.fileName)
			console.log(this.fileUrl)
		},
	    methods: {
	        //预览pdf
	        // previewPDF(this.fileUrl){
	        //     this.src = pdf.createLoadingTask(url)
	        // },
	        // //下载PDF
	        // downloadPDF(url,fileName){
	        //     this.axios({
	        //         method: 'get',
	        //         responseType: 'arraybuffer',
	        //         url: url
	        //     }).then(function(res){
	        //     		//调用下载方法，把后端传过来的流传给fileDownload方法
	        //             this.fileDownload(res.data, fileName);
	        //         }.bind(this)
	        //     )
	        //     .catch(
	        //         function(error) {
	        //             this.$Message.error("网络请求出错")
	        //             //调试阶段可以看看报的什么错
	        //             //console.log("error",error)
	        //         }.bind(this)
	        //     );
	        // },
	        fileDownload:function (data, fileName) {
	            let blob = new Blob([data], {
					//type类型后端返回来的数据中会有，根据自己实际进行修改
	                type: "application/vnd.ms-excel"
	            });
	            let filename = fileName || "报表.xls";
	            if (typeof window.navigator.msSaveBlob !== "undefined") {
	                window.navigator.msSaveBlob(blob, filename);
	            } else {
	                var blobURL = window.URL.createObjectURL(blob);
	                // 创建隐藏<a>标签进行下载
	                var tempLink = document.createElement("a");
	                tempLink.style.display = "none";
	                tempLink.href = blobURL;
	                tempLink.setAttribute("download", filename);
	                if (typeof tempLink.download === "undefined") {
	                    tempLink.setAttribute("target", "_blank");
	                }
	                document.body.appendChild(tempLink);
	                tempLink.click();
	                document.body.removeChild(tempLink);
	                window.URL.revokeObjectURL(blobURL);
	            }
	        }
	    }
	}
</script>