APP文件新增
This commit is contained in:
44
JeecgUniapp-master/src/hybrid/html/iframe_index.html
Normal file
44
JeecgUniapp-master/src/hybrid/html/iframe_index.html
Normal file
@@ -0,0 +1,44 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>JEECG BOOT</title>
|
||||
<style type="text/css">
|
||||
|
||||
#iframe {
|
||||
width: 100%;
|
||||
z-index: 99;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<iframe id="iframe" frameborder="0" ></iframe>
|
||||
|
||||
<!-- uni 的 SDK -->
|
||||
<script type="text/javascript" src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
let mId;
|
||||
document.addEventListener('UniAppJSBridgeReady', () => {
|
||||
let {src,mid,height} = plus.webview.currentWebview();
|
||||
let iframe = document.getElementById("iframe");
|
||||
iframe.height = height;
|
||||
document.getElementById("iframe").src=src;
|
||||
mId=mid;
|
||||
});
|
||||
|
||||
window.addEventListener('message', function(event) {
|
||||
|
||||
let { messageId, type, data } = event.data
|
||||
if ( mId !== messageId) {
|
||||
return
|
||||
}
|
||||
let dataString=JSON.stringify(data);
|
||||
|
||||
location.href = `callback?data=${escape(dataString)}&type=${escape(type)}`;
|
||||
}, false)
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
56
JeecgUniapp-master/src/hybrid/html/index.html
Normal file
56
JeecgUniapp-master/src/hybrid/html/index.html
Normal file
@@ -0,0 +1,56 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-cn">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title class="title">[文件管理器]</title>
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
|
||||
<style type="text/css">
|
||||
.content {background: transparent;}
|
||||
.fixed {position: fixed;bottom: 0;left: 0;right: 0;width: 100%;}
|
||||
.content .mask {top: 0;background: rgba(0,0,0,.4);z-index: 90;}
|
||||
.content .file-content {z-index: 91;height: 60px;background: #fff;text-align: center;}
|
||||
.btn {position: relative;}
|
||||
.btn .file {position: absolute;z-index: 93;left: 0;right: 0;top: 0;bottom: 0;height: 60px;width: 100%;opacity: 0;}
|
||||
.btn-bg {margin-top: 10px;background: #0066CC;color: #fff;width: 80%;height: 40px;border: 0;border-radius: 5px;}
|
||||
.tis {top: 0;z-index: 95;display: none;justify-content: center;align-items: center;}
|
||||
.tis .tis-content {background: #fff;width: 60%;border-radius: 10px;padding: 20px 0;}
|
||||
.tis .tis-content img {width: 50px;height: 50px;}
|
||||
.tis-progress {margin: 10px 0;color: #999;}
|
||||
.cancel-btn {margin-top: 30px;height: 30px;line-height: 1;padding: 0 2em;background: #e3e3e3;color: #898989;border: 0;border-radius: 5px;}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div class="content">
|
||||
|
||||
<div class="fixed mask"></div>
|
||||
|
||||
<div align="center" class="fixed tis">
|
||||
<div class="tis-content">
|
||||
<div>
|
||||
<img src="https://static.jeecg.com/upload/test/login4_1595818039175.png" >
|
||||
</div>
|
||||
<div class="tis-progress">
|
||||
努力上传中..
|
||||
</div>
|
||||
<div class="cancel">
|
||||
<button type="button" class="cancel-btn">取消上传</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="fixed file-content">
|
||||
<div class="btn">
|
||||
<button type="button" class="btn-bg">打开文件管理器</button>
|
||||
<input class="file" type="file" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"></script>
|
||||
<script src="js/h5-uploader.js" type="text/javascript" charset="utf-8"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
90
JeecgUniapp-master/src/hybrid/html/js/h5-uploader.js
Normal file
90
JeecgUniapp-master/src/hybrid/html/js/h5-uploader.js
Normal file
@@ -0,0 +1,90 @@
|
||||
let mask = document.querySelector(".mask");
|
||||
let fileDom = document.querySelector(".file");
|
||||
let tis = document.querySelector(".tis");
|
||||
let progress = document.querySelector(".tis-progress");
|
||||
let cancel = document.querySelector(".cancel-btn");
|
||||
|
||||
|
||||
let createUpload = (file, url, key='file', header = {},data = {}) => {
|
||||
console.log(`
|
||||
上传地址:${url}\n
|
||||
请求头:${JSON.stringify(header)}\n
|
||||
参数:${JSON.stringify(data)}
|
||||
`);
|
||||
if (!url) {return;}
|
||||
tis.style.display = 'flex';
|
||||
|
||||
let formData = new FormData();
|
||||
formData.append(key, file);
|
||||
|
||||
for (let keys in data) {
|
||||
formData.append(keys, data[keys]);
|
||||
}
|
||||
|
||||
let xhr = new XMLHttpRequest();
|
||||
xhr.open("POST", url, true);
|
||||
|
||||
for (let keys in header) {
|
||||
xhr.setRequestHeader(keys, header[keys]);
|
||||
}
|
||||
console.log('xhr:---》url'+url);
|
||||
xhr.upload.addEventListener("progress", function(event) {
|
||||
if(event.lengthComputable){
|
||||
let percent = Math.ceil(event.loaded * 100 / event.total) + "%";
|
||||
progress.innerText = `努力上传中..${percent}`;
|
||||
}
|
||||
}, false);
|
||||
|
||||
xhr.ontimeout = function(){
|
||||
// xhr请求超时事件处理
|
||||
progress.innerText = '请求超时';
|
||||
setTimeout(()=>{
|
||||
tis.style.display = 'none';
|
||||
plus.webview.currentWebview().close();
|
||||
},1000);
|
||||
};
|
||||
|
||||
xhr.onreadystatechange = (ev) => {
|
||||
|
||||
if(xhr.readyState == 4) {
|
||||
console.log('status:'+xhr.status);
|
||||
if (xhr.status == 200) {
|
||||
progress.innerText = '上传成功';
|
||||
console.log('返回数据:'+xhr.responseText);
|
||||
location.href = `callback?fileSize=${escape(file.size)}&fileName=${escape(file.name)}&id=${escape(xhr.responseText)}`;
|
||||
}
|
||||
else {
|
||||
progress.innerText = '大小超出10MB限制, 请压缩或降低质量';
|
||||
}
|
||||
|
||||
setTimeout(()=>{
|
||||
tis.style.display = 'none';
|
||||
plus.webview.currentWebview().close();
|
||||
},1000);
|
||||
|
||||
}
|
||||
};
|
||||
xhr.send(formData);
|
||||
|
||||
cancel.addEventListener("click", ()=>{
|
||||
xhr.abort();
|
||||
plus.webview.currentWebview().close();
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
mask.addEventListener("click", () => {
|
||||
plus.webview.currentWebview().close();
|
||||
});
|
||||
|
||||
document.addEventListener('UniAppJSBridgeReady', () => {
|
||||
let {url,key,header,formData} = plus.webview.currentWebview();
|
||||
fileDom.addEventListener('change', (event) => {
|
||||
let file = fileDom.files[0];
|
||||
if(file.size > (1024*1024 * 10)) {
|
||||
plus.nativeUI.toast('单个文件请勿超过10M,请重新上传');
|
||||
return;
|
||||
}
|
||||
createUpload(file, url, key,header,formData);
|
||||
}, false);
|
||||
});
|
||||
Reference in New Issue
Block a user