<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple-mobile-web-app-status-bar-style" content="black" /> <meta name="format-detection" content="telephone=no" /> <meta name="mobile-web-app-capable" content="yes" /> <meta name="msapplication-tap-highlight" content="no" /> <meta name="fragment" content="!" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0, viewport-fit=cover" /> <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" /> <meta http-equiv="Pragma" content="no-cache" /> <meta http-equiv="Expires" content="0" /> <meta http-equiv="Cache" content="no-cache" /> <meta name="description" content="" /> <link rel="icon" href="../../favicon.ico" /> <title>查看协议</title> <style> body { padding: 0; margin: 0; height: 100vh; overflow: hidden; } .downloadUrl { position: fixed; bottom: 15px; width: 90%; background: #01c1b5; border-radius: 30px; left: 5%; text-align: center; padding: 15px 0; color: #fff; font-size: 16px; } </style> </head> <body> <style> .m-toast { position: fixed; top: 50%; left: 50%; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; box-sizing: content-box; width: 88px; max-width: 70%; min-height: 88px; padding: 16px; color: #fff; font-size: 14px; line-height: 20px; white-space: pre-wrap; text-align: center; word-wrap: break-word; background-color: rgba(50, 50, 51, 0.88); border-radius: 4px; -webkit-transform: translate3d(-50%, -50%, 0); transform: translate3d(-50%, -50%, 0); z-index: 2002; } .m-loading { position: relative; color: #fff; font-size: 0; vertical-align: middle; padding: 4px; } .m-loading__spinner { position: relative; display: inline-block; width: 30px; max-width: 100%; height: 30px; max-height: 100%; vertical-align: middle; -webkit-animation: m-rotate 0.8s linear infinite; animation: m-rotate 0.8s linear infinite; } .m-loading__spinner--circular { -webkit-animation-duration: 2s; animation-duration: 2s; } .m-loading__circular { display: block; width: 100%; height: 100%; } .m-loading__circular circle { -webkit-animation: m-circular 1.5s ease-in-out infinite; animation: m-circular 1.5s ease-in-out infinite; stroke: currentColor; stroke-width: 3; stroke-linecap: round; } .m-loading__text { display: inline-block; margin-left: 8px; color: #969799; font-size: 14px; vertical-align: middle; } .m-loading--vertical { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; -webkit-box-align: center; -webkit-align-items: center; align-items: center; } .m-loading--vertical .m-loading__text { margin: 8px 0 0; } @-webkit-keyframes m-circular { 0% { stroke-dasharray: 1, 200; stroke-dashoffset: 0; } 50% { stroke-dasharray: 90, 150; stroke-dashoffset: -40; } 100% { stroke-dasharray: 90, 150; stroke-dashoffset: -120; } } @keyframes m-circular { 0% { stroke-dasharray: 1, 200; stroke-dashoffset: 0; } 50% { stroke-dasharray: 90, 150; stroke-dashoffset: -40; } 100% { stroke-dasharray: 90, 150; stroke-dashoffset: -120; } } .m-toast__text { margin-top: 8px; } </style> <div id="m_loading" class="m-toast m-toast--middle m-toast--loading" style="z-index: 2001" > <div class="m-loading m-loading--circular m-toast__loading"> <span class="m-loading__spinner m-loading__spinner--circular" ><svg viewBox="25 25 50 50" class="m-loading__circular"> <circle cx="50" cy="50" r="20" fill="none"></circle></svg ></span> </div> <div class="m-toast__text">加载中...</div> </div> <div id="app"> <iframe src="" id="iframe" style="border: 0" width="100%" height="800" ></iframe> <!-- <div class="downloadUrl" onclick="funDownLoadUrl()">下载协议</div> --> <!-- <van-button color="#01C1B5" round @click="onDownLoad">下载协议</van-button> --> </div> <script type="text/javascript" src="../js/utils.js"></script> <script type="text/javascript"> var downloadUrl = getQueryVariable('downLoadUrl') var iframe = document.querySelector('#iframe') iframe.src = './web/viewer.html?file=' + decodeURIComponent(downloadUrl) function funDownLoadUrl() { window.location.href = decodeURIComponent(downloadUrl) } if (iframe.attachEvent) { iframe.attachEvent('onload', function () { // alert("Local iframe is now loaded."); document.querySelector('#m_loading').style.display = 'none' }) } else { iframe.onload = function () { // alert("Local iframe is now loaded."); document.querySelector('#m_loading').style.display = 'none' } } setTimeout(function () { document.querySelector('#m_loading').style.display = 'none' }, 5000) </script> </body> </html>