body form class=layui-form layui-row layui-col-space16 div class=layui-col-md3 div class=layui-form-item style=margin-bottom 0; label class=layui-form-label开始时间label div clas
<body>
<form class="layui-form layui-row layui-col-space16">
<div class="layui-col-md3">
<div class="layui-form-item" style="margin-bottom: 0;">
<label class="layui-form-label">开始时间:</label>
<div class="layui-input-block">
<input type="text" name="startDate" id="startDate" placeholder="开始时间" class="layui-input demo-search-startDate">
</div>
</div>
</div>
<div class="layui-col-md3">
<div class="layui-form-item" style="margin-bottom: 0;">
<label class="layui-form-label">结束时间：</label>
<div class="layui-input-block">
<input type="text" name="endDate" id="endDate" placeholder="结束时间" class="layui-input demo-search-endDate">
</div>
</div>
</div>
<div class="layui-col-md3">
<div class="layui-form-item" style="margin-bottom: 0;">
<label class="layui-form-label">邮件号：</label>
<div class="layui-input-block">
<input type="text" name="mailNumber" id="mailNumber" placeholder="邮件号" class="layui-input">
</div>
</div>
</div>
<div class="layui-btn-container layui-col-xs12">
<button id="btnSearch" class="layui-btn" layui-submit lay-filter="demo-search" onclick="sendConfirm()">查询</button>
<button type="reset" class="layui-btn layui-btn-primary">清空</button>
<button id="btnDownload" class="layui-btn layui-btn-normal" onclick="downloadExcel()">下载</button>
</div>
</form>
<div id="tableContainer">
<table class="layui-hide" id="projectList"></table>
</div>
<script type="text/html" id="complain_toolbar">
<div class="layui-btn-container">
<button class="layui-btn layui-btn-danger layui-btn-sm" lay-event="delBatchAll"><i class="layui-icon"></i>批量删除</button>
<button class="layui-btn layui-btn-sm" lay-event="add"><i class="layui-icon"></i>添加</button>
</div>
</script>
<script type="text/html" id="barDemo">
<a class="layui-btn layui-btn-xs" lay-event="detail">查看</a>
<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script>
<pre><code>layui.use(function(){
var table = layui.table;
var form = layui.form;
var layer = layui.layer;
var laydate = layui.laydate;
var dropdown = layui.dropdown;
// 创建表格实例
table.render({
elem: '#projectList',
url: '../yd/ydquery.json', // 此处为静态模拟数据，实际使用时需换成真实接口
defaultToolbar: ['filter', 'exports', 'print', {
title: '提示',
layEvent: 'LAYTABLE_TIPS',
icon: 'layui-icon-tips'
}],
response: {
statusCode: 200 // 重新规定成功的状态码为 200，table 组件默认为 0
},
// 将原始数据解析成 table 组件所规定的数据格式
parseData: function(res){
return {
"code": res.result, //解析接口状态
"msg": res.msg, //解析提示文本
"count": res.count, //解析数据长度
"data": res.data //解析数据列表
};
},
cols: [getOptions()],
id: 'testReload',
page: true,
height: 400
});
function getOptions(){
return [
{checkbox: true, fixed: true}, // 单选框
{field:'id', title:'ID',align:'center', width:50, fixed:true, sort:true, totalRowText:'合计', fixed: true,templet: function(d){
// 为每一行数据生成自增的 ID 值
return currentId++;
}}
,{field:'institution', title:'机构号', align:'center',fixed: true}
,{field:'mailNumber', title:'邮件号',align:'center',fixed: true}
,{field:'describe', title:'邮件描述',align:'center',fixed: true}
,{field:'images', title:'图片', align:'center', fixed: true,templet:'#imageTpl'}
,{field:'username', title:'员工姓名',align:'center',fixed: true}
,{field:'state', title:'状态（后台编辑）', align:'center',edit: 'text',fixed: true}
,{field:'date', title:'上传时间', align:'center',fixed: true}
,{fixed: 'right', title:'操作', toolbar: '#barDemo', align:'center',fixed: true}
,{field: 'operate',title: '操作',toolbar: '#operateTpl',fixed: 'right',unresize: true}
];
};
// 日期
laydate.render({
elem: '.demo-search-startDate',
});
laydate.render({
elem: '.demo-search-endDate',
});
function sendConfirm() {
disableBtn("#btnSearch");
var url = "../yd/ydquery";
var data = {
startDate: $("#startDate").val(),
endDate: $("#endDate").val(),
mailNumber: $("#mailNumber").val()
};
if (checkinput(data) && clickflag == false) {
clickflag = true;
$.post(url, data, null, "json").done(function(re) {
if (re.result == "success") {
table.reload('projectList', {
res:re
});
} else {
$("#startDate").val("");
$("#endDate").val("");
$("#mailNumber").val("");
popAlert("提示", re.msg);
}
}).fail(function(e) {
popAlert("提示", "网络错误,请重试");
}).always(function() {
enableBtn("#btnSearch");
clickflag = false;
});
}
};
function downloadExcel() {
var url = "../yd/download";
var data = {
startDate: $("#startDate").val(),
endDate: $("#endDate").val(),
mailNumber: $("#mailNumber").val()
};
if (checkinput(data) && clickflag == false) {
clickflag = true;
$.post(url, data, null, "json").done(function(re) {
if (re.result == "success") {
window.location.href = re.url;
} else {
popAlert("提示", re.msg);
}
}).fail(function(e) {
popAlert("提示", "网络错误,请重试");
}).always(function() {
clickflag = false;
});
}
};
function enableBtn() {
$("#btn").html("确定");
$("#btn").removeAttr("disabled");
$("#username").focus();
};
function disableBtn() {
$("#btn").html("正在处理...");
$("#btn").attr("disabled", "disabled");
};
function checkinput(data) {
for (var keyname in data) {
var value = data[keyname];
if ((keyname == "mailNumber" && value == "")&&(keyname == "startDate" && value == "")) {
popAlert("提示","请输入邮件号或开始时间");
$("#startDate").focus();
$("#mailNumber").focus();
enableBtn("#btnConfirm");
return false;
}
}
return true;
};
});
</script>
</code></pre>
</body
原文地址: https://www.cveoy.top/t/topic/iRHO 著作权归作者所有。请勿转载和采集!