<!doctype html>
<html>
	<head>
		<meta charset="utf-8">
		<title>pdf文件预览</title>
		<script src="../../js/vue/vue.js"></script>
		<script src="../../js/vue/element-ui/lib/index.js"></script>
		<script src="../../js/myelement.js"></script>
		<script src="../../js/vue/page.js"></script>
		
		<link href="../../js/vue/element-ui/lib/theme-chalk/index.css" rel="stylesheet">
		<link href="../../css/myelement.css" rel="stylesheet">
		<link href="../../css/iconfont.css" rel="stylesheet">
		<link href="../../css/page.css" rel="stylesheet">
		<link href="//at.alicdn.com/t/font_2374495_13ltsxm2eor.css" rel="stylesheet">
	</head>
	
	<body>
		<div id="vbody">
			<div id="page_root">
				<div class="topbar">
					<span>{{title}}</span>
					
					<div style="float: right; margin-right: 24px;">
						<el-button-group style="margin-left: 3px;">
							<el-button @click="download()">导出</el-button>
						</el-button-group>
					</div>
				</div>
				<div class="versionNo" style="position: absolute; top: 40px; bottom: 60px; left: 10px; right: 10px; padding: 20px;">
					<iframe ref="pdf_ref" :src="file_pdf" style="width: 100%; height: 100%;"></iframe>
				</div>
				
				<div class="el-dialog__footer" style="position: absolute; bottom: 10px; width: 100%; text-align: right;">
					<el-button type="default" @click="closeDialog">å…³ é—­</el-button>
				</div>
				
			</div>
			
			<div id="page_loading" style="position: absolute; top:0px; width: 100vw; height: 50vh;">
				<div class="spinner">
				  <div class="cube1"></div>
				  <div class="cube2"></div>
				</div>
			</div>
		</div>	
		
		<script type="text/javascript">
			var initlized = false;
			
			new ListVue({
				el: "#vbody",
				data: {
					title: "附件预览",
					popupParames: {},
					formdata: {},//fileid, filename
					file_pdf: "",
				},
				created() {
					this.popupParames = clone(Root.popupParames);
					this.formdata = clone(this.popupParames.data);
					if (this.formdata.filename) {
						this.title += "-" + this.formdata.filename;
					}
				},
				
				mounted() {
					this.initData();
					this.$nextTick(() => { // 以服务的方式调用的 Loading 需要异步关闭
						hideLoading();//重新设置弹窗宽高
						this.$nextTick(function(){
							let w_ = "100vw";
							let h_ = "100vh";
							Root.setPopupWH(w_, h_);
						})
					});
				},
				methods:{
					closeDialog() {//关闭
						var me = this;
						if (me.popupParames.totab){
							Root.tab.removeItem(Root.tab.selected);
							Root.tab.open(me.popupParames.parentOption, false); 
						}
						else {
							Root.hidePopup();
						}
					},
					
					saveAfter() {//调回调的关闭
						var me = this;
						if(this.popupParames.callback) {
							let obj = {
								row: clone(this.formdata)
							}
							this.popupParames.callback(obj, function() {
								me.closeDialog();
							});
						}
						else {
							me.closeDialog();
						}
					},
					
					onServerInitData(data) {
						var me = this.data;
					},
					
					initData() {
						if (initlized) { return; }
						initlized = true;
						var fileid = this.formdata.fileid;
						
						this.getPDF(fileid);
						
						//this.$refs.pdf_ref.src=file_pdf.url;
					},

					dogetPDF(fileid) {
						var me =this;
						getDownloadFileUrl(fileid, true, function(result_) {
							if (result_.data && result_.data.path) {
								var file_pdf_ = "";
								var path_ = result_.data.path;
								if (path_.substring(0, 5) == "root/") {
									file_pdf_ = window.top.RootSetting.url_file + path_.substring(5);
								}
								
								window.open(file_pdf_);
								me.file_pdf = file_pdf_;
							}
						});
					},
					
					getPDF(fileid) {
						var me =this;
						getDownloadFileUrl(fileid, true, function(result_) {
							if (result_.data && result_.data.path) {
								var file_pdf_ = "";
								var path_ = result_.data.path;
								if (path_.substring(0, 5) == "root/") {
									file_pdf_ = window.top.RootSetting.url_file + path_.substring(5);
								}
								me.file_pdf = file_pdf_;
							}
						});
						
					},
					openpege(){
						window.open(this.file_pdf);
						this.closeDialog();
					},
					
					download() {
						var fileid = this.formdata.fileid;
						handleDownload(fileid);
					},
					
				}
			});
		</script>
		<style>
			html{
				overflow-x: hidden;
			}
		</style>
	</body>
</html>