点击的按钮
'<button type="button" class=" gdTypeBtn gdTypeBtnActive"
onclick="popupShow(\'' + _data.planUuid +'\')">报告</button>'
方法
// 这里是弹框的js
var mask = mui.createMask(function() {
return false;
}); //callback为用户点击蒙版时自动执行的回调;
// mask.close();
// 查看詳情彈出彈框
function popupShow(id) {
console.log(id);
var html ='';
mui.ajax({
url: BaseUrl +"/app/search/workOrder/getWorkOrderReportByUuid",
type: "post",
// timeout: 5000, //超时时间设置为3秒;
contentType: "application/json",
data: {
"params": {
"UUID":id
}
},
success:function(result){
// console.log(JSON.stringify(result));
var nameList='';
var suppliesList='';
var detailData='';
result.data.constructors.forEach(function(v,i){
nameList +=v+' ';
})
result.data.supplies.forEach(function(v,i){
suppliesList +=v+',';
})
result.data.detailData.forEach(function(v,i){
detailData +=` <div class="popItem">
<p class="title">${v.segment}</p>
<p>${v.infos}</p>
</div>`
})
html += `<div id="popupWrap">
<div class="closeBtn" onclick="closeFun()">
<div class="inner">
<img src="images/closePopup.png">
</div>
</div>
<div class="popupContent">
<div class="popTop">
${detailData}
</div>
<div class="popBottpm">
<p>施工人数:${nameList},共${result.data.constructors.length}人</p>
<p>总材料消耗:${suppliesList}</p>
</div>
</div>
<div class="popupBtn">
<div class="copyFun" onclick="copyPage()">一键复制</div>
<div class="screenFun" onclick="screenPage()">截屏</div>
</div>
</div>
`
$('body').append(html)
// alert(JSON.stringify(data))
mask.show(); //显示遮罩
$('#popupWrap').css({
display: 'block'
})
},
error:function(error){
console.log(error);
}
// complete: function(XMLHttpRequest, textStatus) {
// if (textStatus == 'timeout' || textStatus == 'error') {
// weui.topTips('网络异常');
// }
// }
})
}
//截屏
function screenPage() {
screenCapture(function() {
mui.toast("图片已保存到相册!");
$('.mui-backdrop').css({
display: 'none'
})
$('#popupWrap').css({
display: 'none'
})
})
}
//复制文字
function copyPage() {
tips = "已成功复制到剪贴板";
var text = document.getElementById("popupWrap").innerText;
const input = document.createElement('input')
document.body.appendChild(input)
input.setAttribute('value', text)
input.select()
if (document.execCommand('copy')) {
document.execCommand('copy')
}
document.body.removeChild(input);
mui.toast(tips)
}
// 點擊關閉按鈕
function closeFun() {
$('.mui-backdrop').css({
display: 'none'
})
$('#popupWrap').css({
display: 'none'
})
}
截屏的方法
//手机截图
function screenCapture(successCB, errorCB, fileName, imgID, overwrite, format, quality, clip) {
errorCB = errorCB || function () { };
fileName = fileName || Date.parse(new Date());
imgID = imgID || String(Date.parse(new Date()));
overwrite = overwrite || true;
format = format || 'png';
quality = quality || 50;
clip = clip || {
top: '0px',
left: '0px',
width: '100%',
height: '100%'
};
var self = plus.webview.currentWebview();
var bitmap = new plus.nativeObj.Bitmap(imgID);
//绘制截图
self.draw(bitmap, function () {
// 保存Bitmap图片
bitmap.save('_doc/' + fileName + '.' + format, {
overwrite: overwrite,
format: format,
quality: quality,
clip: clip
}, function (i) {
//保存到系统相册
plus.gallery.save(i.target, function (d) {
//销毁Bitmap图片
bitmap.clear();
successCB({
success: 'success',
details: d
});
}, function (e) {
//销毁Bitmap图片
bitmap.clear();
errorCB({
error: '图片保存至相册失败',
details: e
});
});
}, function (e) {
bitmap.clear();
errorCB({
error: '图片保存失败',
details: e
});
});
}, function (e) {
errorCB({
error: '截屏绘制失败',
details: e
});
})
}