bootstrapTable 应用小例（收索）
<script src="/plugins/My97DatePicker/WdatePicker.js"></script>
<!-- Content Header (Page header) -->
<section class="content-header">
<h1>
<small>财务管理>导入编辑</small>
<a class="pull-right" href="/finance/virtualAccounts/detail" style="cursor:pointer;">返回主表</a>
</h1>
</section>
<!-- Main content -->
<section class="content">
<!-- Your Page Content Here -->
<div class="row">
<div class="col-xs-12">
<div class="box">
<div class="form-inline " >
<div class="box-header">
<input type="text" hidden value="${(virtual_id)!}" name="virtual_id"/>
<input type="text" hidden value="${(account)!}" name="account"/>
<#if permissions?seq_contains('mergeEditor')> <div class="form-group ">
<button class="btn btn-primary mergeEditor ">
<i class="fa "></i> 合并编辑
</button>
</div> </#if> <#if permissions?seq_contains('delVirtual_accountExcel')> <div class="form-group ">
<button class="btn btn-primary btn-del ">
<i class="fa "></i> 删除
</button>
</div> </#if>
<!--搜索-->
<div id="toolbar" class="my-container">
<div> <input id="s_trade_type" type="text" class="form-control" placeholder="输入账务类型">
<input id="s_opposing_account" type="text" class="form-control" placeholder="输入对方账户">
<input id="s_opposing_name" type="text" class="form-control" placeholder="输入对方名称">
<input id="s_product_name" type="text" class="form-control" placeholder="输入商品名称"> <button id="btnSearch" type="button" class="btn btn-primary">搜索</button>
</div> </div> <!--搜索--> <#if permissions?seq_contains('find_virtual_accountExcel')>
<div class="form-group pull-right">
<div class="form-group ">
<input type="text" name="trade_type_alias" class="form-control" placeholder="输入账务类型....">
<input type="text" name="opposing_account_alias" class="form-control" placeholder="输入对方账户....">
<input type="text" name="opposing_name_alias" class="form-control" placeholder="输入对方名称....">
</div> <div class="form-group">
<a class="btn btn-primary btn-sm btn-search">
<i class="fa fa-search"></i> 查询
</a>
</div>
</div>
</#if> <table id="virtualExceldatatable"></table>
</div>
</div>
</div>
</div>
</div>
</section>
<div id="Excel_insertorupdate_dialog" hidden >
<form class="form">
<div class="form-horizontal"><!-- style="max-height: 500px;overflow-y: scroll;"--> <input type="hidden" id="virtual_import_id" name="virtual_import_id"/> <div class="form-group ">
<label class="col-sm-3 control-label text-right">票据号：</label> <div class="col-sm-7">
<input type="text" class="form-control" placeholder="票据号" name="bill_code">
</div>
</div> <div class="form-group">
<label class="col-sm-3 control-label text-right">分类：</label>
<div class="col-sm-3">
<select name="type1_id" class="form-control" onchange="getSubClassify(this)">
<option value="">分类1</option>
<!--<#list accountClassify as class>-->
<!--<option value="${(class.id)!}" >${(class.classify_name)!}</option>-->
<!--</#list>-->
</select>
</div>
<div class="col-sm-4">
<select name="type2_id" class="form-control">
<option value="">分类2</option>
</select>
</div>
</div> <div class="form-group">
<label class="col-sm-3 control-label text-right">摘要：</label> <div class="col-sm-7">
<input type="text" class="form-control" placeholder="摘要" name="abstract">
</div>
</div> <div class="form-group">
<label class="col-sm-3 control-label text-right">日期：</label> <div class="col-sm-7">
<input type="text" name="trade_date" class="form-control" placeholder="日期"
onClick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss'})" data-rule="日期:required;">
</div>
</div> <div class="form-group">
<label class="col-sm-3 control-label text-right">类型：</label> <div class="col-sm-7">
<input type="radio" value="0" name="trade_type">收入
<input type="radio" value="1" name="trade_type">支出
<input type="radio" value="2" name="trade_type">转账
</div>
</div> <div class="form-group" >
<label class="col-sm-3 control-label text-right">发生账户：</label> <div class="col-sm-7">
<input type="text" disabled class="form-control" value="${(account)!}" name="account_id">
</div>
</div> <div class="form-group" >
<label class="col-sm-3 control-label text-right">对方名称：</label> <div class="col-sm-7">
<input type="text" disabled class="form-control" placeholder="对方名称" name="opposing_name">
</div>
</div> <div class="form-group" >
<label class="col-sm-3 control-label text-right">对方账户：</label> <div class="col-sm-7">
<input type="text" disabled class="form-control" placeholder="对方账户" name="opposing_account">
</div>
</div> <div class="form-group" >
<label class="col-sm-3 control-label text-right">金额（元）：</label> <div class="col-sm-7">
<input type="text" class="form-control" placeholder="金额" name="trade_amount">
</div>
</div> </div>
</form>
</div> <script type="text/javascript"> $('.mergeEditor').click(function () { var rows = $("#virtualExceldatatable").bootstrapTable('getSelections');
if (rows.length<2) {
bootbox.alert('请选择要合并的数据');
return;
}
var recode = '';
var recodeThan='';
var flag=true;
let money=0;
let out_amount_sum=0;
let in_amount_sum=0;
let ids='';
let trade_type='';
for(let i=0;i<rows.length;i++){
if(i==0)
recode= rows[i].trade_type+rows[i].opposing_account+rows[i].opposing_name;
if(i>0){
recodeThan=rows[i].trade_type+rows[i].opposing_account+rows[i].opposing_name;
if(recode!=recodeThan){
flag=false;
break;
}
}
if (i > 0) {
ids += ',';
}
ids += rows[i].id;
//注意：**********
in_amount_sum+=rows[i].in_amount==undefined||rows[i].in_amount==''?0:rows[i].in_amount;
out_amount_sum+=rows[i].out_amount==undefined||rows[i].out_amount==''?0:rows[i].out_amount;
}
console.log("rows[0].in_amount:"+rows[0].in_amount);
console.log("in_amount_sum:"+in_amount_sum);
console.log("rows[0].out_amount:"+rows[0].out_amount);
console.log("out_amount_sum:"+out_amount_sum);
console.log("ids:"+ids);
if(rows[0].in_amount!=undefined||rows[0].in_amount!=null){
money=in_amount_sum;
trade_type='0';
}
if(rows[0].out_amount!=undefined||rows[0].out_amount!=null){
money=out_amount_sum;
trade_type='1';
} if(!flag){
bootbox.alert("你所选择的数据不一致不可做合并操作")
flag=true;
return;
} editVirtualData();
privateGetBaseArgs(1);
$('select[name="type2_id"]').empty().append('<option value="">分类2</option>').val('');
var $dialog=$('#Excel_insertorupdate_dialog');
console.log('rows[0].in_date:'+rows[0].in_date)
$('input[name="trade_date"]').val(rows[0].in_date);
$('input[name="trade_type"][value="' + trade_type + '"]').attr('checked', true);
$('input[name="opposing_name"]').val(rows[0].opposing_name);
$('input[name="opposing_account"]').val(rows[0].opposing_account);
$('input[name="trade_amount"]').val(money);
$('input[name="virtual_import_id"]').val(ids);
console.log($dialog.html())
}); function privateGetBaseArgs(type,type1, outAccountVal) {
send({}, "/finance/CashAccount/getBaseArgs", function (res) {
if (res.code == 1) {
let accountClassify = res.accountClassify;
let $type1 = $('select[name="type1_id"]');
$type1.empty().append(' <option value="">分类1</option>');
for (let i = 0; i < accountClassify.length; i++) {
if(type1!=undefined&&type1==accountClassify[i].id){
let selected = 'selected="selected"';
$type1.append('<option '+selected+' value="' + accountClassify[i].id + '" >' + accountClassify[i].classify_name + '</option> ');
}else
$type1.append('<option value="' + accountClassify[i].id + '" >' + accountClassify[i].classify_name + '</option> ');
}
if (type == 1) {
$('select[name="type1_id"]').val(''); } subClassify = res.accountSubClassify; }
if (res.code == 0) {
bootbox.alert(res.msg);
}
}) }
function editVirtualData(){
insertorupdate_bootbox = bootbox.dialog({
message: $('#Excel_insertorupdate_dialog').html(),
title: '编辑',
buttons: {
cancel : {
label : '取消',
className : 'btn btn-default'
},
OK : {
label : '确定',
className : 'btn btn-primary',
callback : function() { if($.trim(insertorupdate_bootbox.find('input[name="bill_code"]').val())==''||insertorupdate_bootbox.find('input[name="bill_code"]').val()==undefined){
bootbox.alert('票据号不能为空');
return false;
}
if ($.trim(insertorupdate_bootbox.find('select[name="type1_id"]').val())==''){
bootbox.alert('分类1不能为空');
return false;
} if ($.trim(insertorupdate_bootbox.find('select[name="type2_id"]').val())==''){
bootbox.alert('分类2不能为空');
return false;
} if($.trim(insertorupdate_bootbox.find('input[name="abstract"]').val())==''||$.trim(insertorupdate_bootbox.find('input[name="abstract"]').val())==undefined){
bootbox.alert('摘要不能为空');
return false;
} if($.trim(insertorupdate_bootbox.find('input[name="trade_date"]').val())==''||$.trim(insertorupdate_bootbox.find('input[name="trade_date"]').val())==undefined){
bootbox.alert('日期不能为空');
return false;
} let trade_amount=$.trim(insertorupdate_bootbox.find('input[name="trade_amount"]').val());
if(trade_amount==''||trade_amount==undefined){
bootbox.alert('金额不能为空');
return false;
}
let trade_amountRegx = /^[0-9]+(.[0-9]{1,2})?$/; if (!trade_amountRegx.test(trade_amount)) {
bootbox.alert('转款金额必须是数字(或包含两位小数)')
return false;
} let obj={};
obj.ids=insertorupdate_bootbox.find('input[name="virtual_import_id"]').val();
obj.virtual_id=$('input[name="virtual_id"]').val();
obj.bill_code=insertorupdate_bootbox.find('input[name="bill_code"]').val();
obj.type1_id=insertorupdate_bootbox.find('select[name="type1_id"]').val();
obj.type2_id=insertorupdate_bootbox.find('select[name="type2_id"]').val();
obj.abstract=insertorupdate_bootbox.find('input[name="abstract"]').val();
obj.trade_date=insertorupdate_bootbox.find('input[name="trade_date"]').val();
obj.trade_type=insertorupdate_bootbox.find('input[name="trade_type"]:checked').val();
obj.account_id=insertorupdate_bootbox.find('input[name="account_id"]').val();
obj.opposing_account=insertorupdate_bootbox.find('input[name="opposing_account"]').val();
obj.opposing_name=insertorupdate_bootbox.find('input[name="opposing_name"]').val();
obj.trade_amount=insertorupdate_bootbox.find('input[name="trade_amount"]').val();
console.log(JSON.stringify(obj));
send(obj,"/finance/virtualAccounts/insertVirtualAccountDetail",function (res) {
if(res.code==1){ bootbox.alert(res.msg,function () {
$("#virtualExceldatatable").bootstrapTable('refresh');
//$('#Excel_insertorupdate_dialog').resetForm(); });
}
if(res.code==2){
bootbox.alert(res.msg);
} })
}
} }
}); } function getSubClassify(obj){
var valClass=$(obj).val();
if(valClass==''){
return
}
console.log("分类1的id："+valClass);
send({virtual_id:valClass},"/finance/virtualAccounts/getSubClassify",function (res) {
if(res.code==1){
$('select[name="type2_id"]').empty().append('<option value="">分类2</option>');
var subClassify=res.result;
var subClass=null;
for(let j=0;j<subClassify.length;j++){
subClass=subClassify[j];
$('select[name="type2_id"]').append('<option value="'+subClass.id+'">'+subClass.classify_name+'</option>') }
}
if(res.code==0){
bootbox.alert(res.msg);
}
}) } $('.btn-del').click(function(){ bootbox.confirm('确定要删除数据吗？', function(flag){
if (flag) {
var rows = $("#virtualExceldatatable").bootstrapTable('getSelections');
let ids = '';
$(rows).each(function(i){
if (i > 0) {
ids += ',';
}
ids += this.id;
});
if (ids == '') {
bootbox.alert('请选择要删除的数据');
return;
}
send({"ids":ids},'/finance/virtualAccounts/delExcelData',function (res) {
if(res.code==1){
searchs();
}
bootbox.alert(res.msg);
})
}
});
}) $('.btn-search').click(function () {
$("#virtualExceldatatable").bootstrapTable('destroy');
searchs();
})
searchs(); $('#btnSearch').click(function () {
searchs();
})
function searchs() {
console.log("virtual_id:" + $('input[name="virtual_id"]').val())
$("#virtualExceldatatable")
.bootstrapTable('destroy')
.bootstrapTable({
url: '/finance/virtualAccounts/findExcelDetail',
method: "post",
contentType: "application/x-www-form-urlencoded",
toolbar: '#toolbar',
//search : true,
sortable: true,
/* showColumns : true, */
showRefresh: false,
showExport: false,
showColumns: false,
showToggle: false,
buttonsAlign: "right",
toolbarAlign: "left",
striped: true,
pagination: true,
uniqueId: "id",
pageNumber: 1,
pageSize: 10,
pageList: [10, 15, 20],
sidePagination: "server",
queryParams: function (param) {
var params = {
curpage: param.offset / param.limit + 1,
pageSize: param.limit,
// sort : param.sort,
// order : param.order,
virtual_id: $('input[name="virtual_id"]').val(),
trade_type:$.trim($('input[name="trade_type_alias"]').val()),
opposing_account:$.trim($('input[name="opposing_account_alias"]').val()),
opposing_name:$.trim($('input[name="opposing_name_alias"]').val()),
s_trade_type:$('#s_trade_type').val(),
s_opposing_account:$('#s_opposing_account').val(),
s_opposing_name:$('#s_opposing_name').val(),
s_product_name:$('#s_product_name').val(), };
return params;
},//参数
queryParamsType: 'limit',
//clickToSelect : true,
columns: [{
checkbox: true
}, {
title: '序号',
align: 'center',
formatter: function (value, row, index) {
return index + 1;
}
}, {
field: 'in_date',
title: '入账时间',
align: 'center',
sortable: false
}, {
field: 'alipay_trade_no',
title: '支付宝交易号',
align: 'center',
sortable: false
}, {
field: 'trade_type',
title: '账务类型',
align: 'center',
sortable: false
}, {
field: 'in_amount',
title: '收入（+元）',
align: 'center',
sortable: false
}, {
field: 'out_amount',
title: '支出（-元）',
align: 'center',
sortable: false
}, {
field: 'balance',
title: '账户余额（元）',
align: 'center',
sortable: false
}, {
field: 'opposing_account',
title: '对方账户',
align: 'center',
sortable: false
}, {
field: 'opposing_name',
title: '对方名称',
align: 'center',
sortable: false
}, {
field: 'product_name',
title: '商品名称',
align: 'center',
sortable: false
}, {
field: 'remarks',
title: '备注',
align: 'center',
sortable: false
}, {
field: '',
title: '操作',
align: 'center',
formatter: function (value, row, index) {
var edit = "";
<#if permissions ? seq_contains('editVirtualAccountExcel') >
edit = '<button class="btn btn-primary btn-sm btn-edit">'
+ '<i class="fa fa-edit"></i> 编辑'
+ '</button>\r'
</#if>
return edit; },
events: {
'click .btn-edit': function (e, value, row, index) {
// window.location.herf = '/finance/virtualAccounts/importExcelDetail?virtual_id=' + row.id;
editVirtualData();
privateGetBaseArgs(1);
$('select[name="type2_id"]').empty().append('<option value="">分类2</option>').val('');
let trade_type='';
let money=0;
if(row.in_amount!=undefined||row.in_amount!=null){
money=row.in_amount;
trade_type='0';
}
if(row.out_amount!=undefined||row.out_amount!=null){
money=row.out_amount;
trade_type='1';
} $('input[name="trade_date"]').val(row.in_date);
$('input[name="trade_type"][value="' + trade_type + '"]').attr('checked', true);
$('input[name="opposing_name"]').val(row.opposing_name);
$('input[name="opposing_account"]').val(row.opposing_account);
$('input[name="trade_amount"]').val(money);
$('input[name="virtual_import_id"]').val(row.id);
} }
}],
responseHandler: function (res) {
if (res == '302') {
location.herf ="/login";
return
}
res.rows = res.result.records;
res.total = res.result.total;
return res;
}
});
}
</script>
@RequestMapping("/findExcelDetail")
public Map<String, Object> queryimportExcel(HttpServletRequest request, String s_trade_type, String s_opposing_account, String s_opposing_name, String s_product_name) {
Map<String, Object> result = new HashMap<>();
try {
Map<String, String> reqmap = ConvertVal.mapv2str(request.getParameterMap());
int curpage = MapUtils.getIntValue(reqmap, "curpage", 1);
int pageSize = MapUtils.getIntValue(reqmap, "pageSize", 10);
reqmap.put("trade_type",s_trade_type);
reqmap.put("opposing_account",s_opposing_account);
reqmap.put("opposing_name",s_opposing_name);
reqmap.put("product_name",s_product_name);
logger.info("search virtualAccountExcel params:" + reqmap);
Page<Map<String, Object>> page = getPage(curpage, pageSize);
Page<Map<String, Object>> pageData = virtualAccountsService.queryimportExcel(page, reqmap);
logger.info("search virtualAccountExcel rusult:" + pageData.getRecords());
result.put("result", pageData);
result.put("msg", "");
} catch (Exception e) {
e.printStackTrace();
logger.error("search virtualAccountExcel exception:" + e.getMessage());
result.put("msg", "查询失败");
} finally {
return result;
}
<select id="findByVirtualId" parameterType="map" resultType="map">
SELECT
id,virtual_id, date_format(in_date,'%Y-%m-%d %H:%m:%s')
in_date,alipay_trade_no,trade_type,in_amount,out_amount,balance,opposing_account,
opposing_name,product_name,remarks,creator,create_time,modifier,modify_time,del_flag
FROM
virtual_import_detail
<where>
del_flag='0'
<if test="virtual_id !='' and virtual_id !=null">
AND virtual_id=#{virtual_id} </if>
<if test="trade_type !='' and trade_type !=null">
AND trade_type LIKE concat('%',#{trade_type},'%')
</if>
<if test="opposing_account !='' and opposing_account !=null">
AND opposing_account LIKE concat('%',#{opposing_account},'%')
</if>
<if test="opposing_name !='' and opposing_name !=null">
AND opposing_name LIKE concat('%',#{opposing_name},'%')
</if>
<if test="product_name !='' and product_name !=null">
AND product_name LIKE concat('%',#{product_name},'%')
</if>
</where>
ORDER BY create_time DESC </select>
bootstrapTable 应用小例（收索）的更多相关文章
- linux 命令小例
xargs示例: ls |xargs -i mv {} /opt find示例: find -mtime +n -name “*.avi” -type f -exec rm {} \; find - ...
- Ubuntu13.04 Eclipse下编译安装Hadoop插件及使用小例
Ubuntu13.04 Eclipse下编译安装Hadoop插件及使用小例 一.在Eclipse下编译安装Hadoop插件 Hadoop的Eclipse插件现在已经没有二进制版直接提供,只能自己编译. ...
- 20170712 SQL Server 日志文件收索
-- 1 日志文件增长过快,未进行任务计划截断备份 造成文件过大199G 左右,而可用空间不足8% -- 2 日志备份之前,需要一次完整备份 再进行截断备份 出现可用空间99% 此时可以选择收索数据库 ...
- 使用libcurl下载文件小例
libcurl是一个很强大的开源网络处理库,支持包括HTTP.HTTPS.FTP……一系列网络协议.用它来进行HTTP的get\post 或者下载文件更是小菜一碟,chrome内核都用到了它,本文主要 ...
- 剑指offer-第四章解决面试题思路（二叉收索树和双向链表）
题目:输入一个二叉收索树,将二叉搜索树转换成排序的双向链表.要求不能创建节点,只能将链表中的指针进行改变. 将复杂的问题简单化:思路:二叉收索树,本身是一个排序结构,中序遍历二叉收索树就可以得到一组排 ...
- webpack -- 多页面简单小例
有时单页面并不能满足我们的业务需求,就需要去构建多页面应用,以下为简单小例: entry:{ index:'./src/module/index/index.js', student:'./src/m ...
- [libpng]CMake+VS2015下编译libpng，及使用小例
编译前的工作 在编译libpng前,需要把zlib编译好,并加载到编译环境里. CMake + VS2015 下编译zlib,及使用小例 下载与解压 libpng的官网是 http://www.lib ...
- linux之C编程实战小例
人生匆匆一趟,打不打酱油?怎么打?怎么打"质量好点的酱油"?由你决定.打酱油是一种态度,更是一种生活! 哈哈,事不关己不开口,专心一意打酱油! 请记住下面些许话: 不要一味的说别人 ...
- HTML5基础小结（二）——标签小例
watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvbGl1amlhaGFuNjI5NjI5/font/5a6L5L2T/fontsize/400/fill/I0 ...
随机推荐
- B1002 写出这个数
读入一个正整数 n,计算其各位数字之和,用汉语拼音写出和的每一位数字. 输入格式: 每个测试输入包含 1 个测试用例,即给出自然数 n 的值.这里保证 n 小于 1. 输出格式: 在一行内输出 n 的 ...
- 【贪心】bzoj1592: [Usaco2008 Feb]Making the Grade 路面修整
贪心的经典套路:替换思想:有点抽象 Description FJ打算好好修一下农场中某条凹凸不平的土路.按奶牛们的要求,修好后的路面高度应当单调上升或单调下降,也 就是说,高度上升与高度下降的路段不能 ...
- leetcode-13-basic-binaryTree
101. Symmetric Tree 解题思路: 递归的方法如下.分几种情况考虑,如果左子树和右子树都是空,那么返回true:如果不同时为空,返回false:如果都不为空,则 判断其值是否相等,不相 ...
- 在SCIKIT中做PCA 逆变换 -- 新旧特征转换
PCA(Principal Component Analysis)是一种常用的数据分析方法.PCA通过线性变换将原始数据变换为一组各维度线性无关的表示,可用于提取数据的主要特征分量,常用于高维数据的降 ...
- Educational Codeforces Round 41 E. Tufurama (961E)
[题解] 第一眼看题飞快地想到一种做法,然后假掉了. 这道题其实是主席树的模板题来着.但是也有别的水法. 我们可以发现每个位置的查询区间是[1,min(a[i],i-1)],所以我们可以把查询区间按照 ...
- HDU 5536 Chip Factory Trie
题意: 给出\(n(3 \leq n \leq 1000)\)个数字,求\(max(s_i+s_j) \bigoplus s_k\),而且\(i,j,k\)互不相等. 分析: 把每个数字看成一个\(0 ...
- 关于.net 项目 nuget包还原项目失败的记录
在.net项目中,一般通过vs打开项目,会自动进行nuget包还原,可能因为其他一些因素,包还原失败,同时在之前包依赖是可以正常使用,现在却提示包 AutoMapper 6.2.2 与 netcore ...
- luogu3381 【模板】最小费用最大流
每次选代价最小的流增广 #include <iostream> #include <cstring> #include <cstdio> #include < ...
- Java类编译、加载、和执行
https://www.cnblogs.com/fefjay/p/6305499.html
- 查找最小的k个元素 【微软面试100题 第五题】
题目要求: 输入n个整数,输出其中最小的k个. 例如:输入1,2,3,4,5,6,7,8这8个数字,则最小的4个数字为1,2,3,4. 参考资料:剑指offer第30题. 题目分析: 解法一: 用快排 ...