251 lines
9.0 KiB
HTML
251 lines
9.0 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<base href="/twoduty/">
|
||
<meta charset="utf-8">
|
||
<meta name="renderer" content="webkit">
|
||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
|
||
<link rel="stylesheet" href="assets/fonts/font-awesome/css/font-awesome.css"/>
|
||
<link rel="stylesheet" href="assets/layuiadmin/layui/css/layui.css" media="all">
|
||
<link rel="stylesheet" href="assets/layuiadmin/style/admin.css" media="all">
|
||
<link rel="stylesheet" type="text/css" href="assets/js/vendor/viewer/viewer.min.css">
|
||
<link rel="stylesheet" type="text/css" href="assets/js/vendor/swiper/swiper-bundle.css">
|
||
<style>
|
||
.swiper-container {
|
||
width: 90%;
|
||
height: 400px;
|
||
margin-bottom: 15px;
|
||
margin-top: 15px;
|
||
}
|
||
.swiper-slide{
|
||
width: 90%;
|
||
height: 400px;
|
||
}
|
||
.swiper-slide img{
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="main" id="main">
|
||
|
||
|
||
</div>
|
||
<script id="data" type="text/html">
|
||
<div class="title">
|
||
<h3>{{ d.dutyIndexLibName }}</h3>
|
||
<p>
|
||
<span>上报时间:{{ d.gmtCreate }}</span>
|
||
<span>上报人:{{ d.creatorName }}</span>
|
||
</p>
|
||
</div>
|
||
<div class="table-box">
|
||
<style >
|
||
*{margin:0;padding:0;}
|
||
.main{width: 1000px;margin: 0 auto;padding-top: 50px;background: #fff;padding: 0 100px;box-sizing: border-box;overflow: hidden}
|
||
.title{text-align: center;padding: 10px 0;border-bottom: 1px solid #ddd;margin-top:60px;margin-bottom: 30px;}
|
||
.title h3{font-size: 32px;margin-bottom: 10px;color: #1f5781;font-weight: bolder;}
|
||
.title p{font-size: 15px;color: #333;}
|
||
.title p span{margin-right: 50px}
|
||
.tableTitle{text-align: center;font-size: 40px;line-height: 38px}
|
||
.table-box{margin: 10px 0;}
|
||
.table-box table{table-layout: fixed;width: 100%;border-collapse: collapse;}
|
||
.table-box table td{height: 40px;font-size: 16px;border: 1px solid #161615;text-align: center;}
|
||
.button-box{position: fixed;top:20px;right: 40px;}
|
||
.button-box button{border: none;outline:none;width: 60px;height: 40px;background: #004acd;cursor: pointer;color: #fff}
|
||
.title{
|
||
text-align: center;
|
||
}
|
||
.details{
|
||
text-align: left;
|
||
/*text-indent: 30px;*/
|
||
padding: 0 10px;
|
||
}
|
||
</style>
|
||
<table style="height: 500px">
|
||
{{# if(d.imagesList.length > 0) { }}
|
||
<div class="swiper-container">
|
||
<div class="swiper-wrapper" id="indexGeneralImagesFileBox">
|
||
{{# layui.each(d.imagesList, function(index, item){ }}
|
||
<div class="swiper-slide"><img src="route/file/download/false/{{item.fileId}}" align="加载失败"></div>
|
||
{{# }); }}
|
||
</div>
|
||
<!-- 如果需要分页器 -->
|
||
<div class="swiper-pagination"></div>
|
||
<!-- 如果需要导航按钮 -->
|
||
<!--<div class="swiper-button-prev"></div>-->
|
||
<!--<div class="swiper-button-next"></div>-->
|
||
<!-- 如果需要滚动条 -->
|
||
<div class="swiper-scrollbar"></div>
|
||
</div>
|
||
{{# } }}
|
||
<tr>
|
||
<td class="tableTitle">时间</td>
|
||
<td class="details" style="height: 60px">{{ d.actionTime }}</td>
|
||
<td class="tableTitle">街道办事处</td>
|
||
<td class="details" style="height: 60px">{{ d.streetOrgName }}</td>
|
||
<td class="tableTitle">社区名称</td>
|
||
<td class="details" style="height: 60px">{{ d.communityName }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tableTitle">工作要求</td>
|
||
<td class="details" colspan="5" style="height: 100px">{{ d.workRequire }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tableTitle">措施</td>
|
||
<td class="details" colspan="5" style="height: 100px">{{ d.workMeasures }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tableTitle">完成情况</td>
|
||
<td class="details" colspan="5" style="height: 100px">{{ d.completeInfo }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tableTitle">备注</td>
|
||
<td class="details" colspan="5" style="height: 100px">{{ d.remarks }}</td>
|
||
</tr>
|
||
</table>
|
||
|
||
</div>
|
||
</script>
|
||
<div class="button-box">
|
||
<button class="print" style="display:none;">打印</button>
|
||
<button class="close">返回</button>
|
||
</div>
|
||
|
||
<script src="assets/js/vendor/wangEditor/wangEditor.min.js"></script>
|
||
<script src="assets/js/vendor/ckplayer/ckplayer/ckplayer.js"></script>
|
||
<script src="assets/js/vendor/viewer/viewer.min.js"></script>
|
||
<script src="assets/layuiadmin/layui/layui.js"></script>
|
||
<script src="assets/js/jquery-1.7.2.js"></script>
|
||
<script src="assets/js/jquery.jqprint-0.3.js"></script>
|
||
<script src="assets/js/vendor/swiper/swiper-bundle.js"></script>
|
||
<script>
|
||
layui.config({
|
||
base: 'assets/layuiadmin/' //静态资源所在路径
|
||
}).extend({
|
||
index: 'lib/index' //主入口模块
|
||
}).use(['index', 'form', 'laydate', 'laytpl'], function(){
|
||
var $ = layui.$;
|
||
var form = layui.form;
|
||
var laytpl = layui.laytpl;
|
||
var laydate = layui.laydate;
|
||
var reportId = top.restAjax.params(window.location.href).reportId;
|
||
|
||
var wangEditor = window.wangEditor;
|
||
var wangEditorObj = {};
|
||
var viewerObj = {};
|
||
|
||
function closeBox() {
|
||
parent.layer.close(parent.layer.getFrameIndex(window.name));
|
||
}
|
||
|
||
function refreshDownloadTemplet(fileName, file) {
|
||
var dataRander = {};
|
||
dataRander[fileName] = file;
|
||
|
||
laytpl(document.getElementById(fileName +'FileDownload').innerHTML).render(dataRander, function(html) {
|
||
document.getElementById(fileName +'FileBox').innerHTML = html;
|
||
});
|
||
}
|
||
|
||
function initImages(formdata){
|
||
top.restAjax.get(top.restAjax.path('api/file/list', []), {
|
||
ids: formdata.photo
|
||
}, null, function(code, data) {
|
||
formdata['imagesList'] = data;
|
||
dataTemplet(formdata)
|
||
}, function(code, data) {
|
||
top.dialog.msg(data.msg);
|
||
});
|
||
}
|
||
|
||
|
||
function dataTemplet(data){
|
||
var getTpl = document.getElementById('data').innerHTML
|
||
,view = document.getElementById('main');
|
||
laytpl(getTpl).render(data, function(html){
|
||
view.innerHTML = html;
|
||
});
|
||
|
||
var viewer = new Viewer(document.getElementById('indexGeneralImagesFileBox'), {navbar: false});
|
||
initSwiper();
|
||
}
|
||
|
||
function initSwiper(){
|
||
var swiper = new Swiper('.swiper-container', {
|
||
loop: true, // 循环模式选项
|
||
autoplay:true,
|
||
slidesPerView: 1,
|
||
spaceBetween: 30,
|
||
keyboard: {
|
||
enabled: true,
|
||
},
|
||
pagination: {
|
||
el: '.swiper-pagination',
|
||
clickable: true,
|
||
},
|
||
// navigation: {
|
||
// nextEl: '.swiper-button-next',
|
||
// prevEl: '.swiper-button-prev',
|
||
// },
|
||
autoplay: {
|
||
delay: 2000,//1秒切换一次
|
||
stopOnLastSlide: false,
|
||
disableOnInteraction: false,
|
||
},
|
||
});
|
||
}
|
||
|
||
|
||
|
||
|
||
|
||
|
||
// 初始化内容
|
||
function initData() {
|
||
var loadLayerIndex;
|
||
top.restAjax.get(top.restAjax.path('api/basiccheckpersonaction/get/{reportId}', [reportId]), {}, null, function(code, data) {
|
||
initImages(data)
|
||
initPrintButton(data.indexAuditStatus)
|
||
}, function(code, data) {
|
||
top.dialog.msg(data.msg);
|
||
}, function() {
|
||
loadLayerIndex = top.dialog.msg(top.dataMessage.loading, {icon: 16, time: 0, shade: 0.3});
|
||
}, function() {
|
||
top.dialog.close(loadLayerIndex);
|
||
});
|
||
}
|
||
initData();
|
||
|
||
function initPrintButton(s){
|
||
if(s == '1' || s == '2'){
|
||
$(".print").show();
|
||
}
|
||
|
||
|
||
|
||
}
|
||
|
||
|
||
$('.close').on('click', function() {
|
||
closeBox();
|
||
});
|
||
$('.print').on('click', function() {
|
||
$("#main").jqprint({
|
||
debug: false, //是否显示iframe查看效果
|
||
importCSS: true,
|
||
printContainer: true,
|
||
operaSupport: false
|
||
});
|
||
});
|
||
|
||
|
||
// 校验
|
||
form.verify({
|
||
});
|
||
});
|
||
</script>
|
||
</body>
|
||
</html> |