页面上表格金额统计汇总

拼搏现实的明天。 2021-09-27 11:16 298阅读 0赞

![70][]

页面结构：

<div id="div-checkout-id" class="row cl">  
            <label class="form-label col-sm-1"><span class="c-red">退房结算</span></label>  
            <div class="formControls col-sm-3">  
                <a id="checkout\_query\_sel" class="btn btn-primary radius ml-20 mr-20">关联退房结算</a>  
                  
                <input type="hidden" value="$\{entity.checkoutId\}"  id="checkoutId" name="checkoutId">  
                <input type="hidden" value="$\{entity.checkoutInfo?html\}"  id="checkoutInfo" name="checkoutInfo">  
                <input type="hidden" value="$\{entity.colAndPayInfo?html\}"  id="colAndPayInfo" name="colAndPayInfo">  
                <table class="table table-border table-bordered table-bg table-sort" id="table-list-detail-checkout" style="width:600px;">  
                    <thead>   
                        <tr>  
                            <th width="20%">类型</th>  
                            <th width="20%">金额</th>  
                            <th width="40%">备注</th>  
                            <th width="20%">操作</th>  
                        </tr>  
                    </thead>  
                    <tbody>  
                         <tr></tr>  
                    </tbody>  
                </table>  
                <div id="btn-sum"></div>  
            </div>   
        </div>

\});  
      \});

\}  
function addRelationCheckout(href) \{  
  var curTd = $(href).parent();  
  var chargeType = curTd.prev().prev().prev().prev().html();  
  var amt = curTd.prev().html();  
  if (!$('\#table-list-detail-checkout')) \{  
    return;  
  \}

str = '<tr><td>' + '<input type="text" class="input-text" name="checkout\_chargeType" value="' + chargeType + '" />' + '</td><td>'  
      + '<input type="text" class="input-text amt" name="checkout\_amt" value="' + amt + '" />' + '</td><td>'  
      + '<input type="text" class="input-text" name="checkout\_note" value="" />' + '</td><td>'   
      + '<a style="text-decoration:none;" onClick="deleteItem(this)" href="javascript:;" title="删除"><i class="Hui-iconfont">&\#xe631;</i></a>'    
       + '</td></tr>';  
  total=(Number(total)+Number(amt)).toFixed(2);  
  $('\#table-list-detail-checkout > tbody').append(str);  
  $('\#btn-sum').html('&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp'+  
          '<span class="c-red">合计：'+total+'</span>');  
\}  
function reloadCheckoutDetails(href) \{  
  var curTd = $(href).parent();  
  var chargeType = curTd.prev().prev().html();  
  $.getJSON('/checkOutSettlement/findByPidAndChargeType', \{  
        pid : $('\#checkout-detail-hidden-pid').val(),  
        chargeType : chargeType  
      \}, function(res) \{  
        var html = '详情:';  
        $.each(res, function(i, item) \{  
          html += '<br/>'  
              + String  
                  .format(  
                      '<span class="c-blue mr-10 ml-10">时间:</span> \{0\} , <span class="c-blue mr-10 ml-10">金额:</span> \{1\} , <span class="c-blue mr-10 ml-10">备注:</span> \{2\}',  
                      item.createDate, item.amt, item.note);  
        \});  
        curTd.html(html);  
      \});  
\}

function deleteItem(href)\{  
    var amt=$(href).parent().parent().find(".amt").val();  
    console.log(amt);  
    total=(Number(total)-Number(amt)).toFixed(2);  
    $('\#btn-sum').html('&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp'+  
            '<span class="c-red">合计：'+total+'</span>');  
    $(href).parent().parent().remove();  
\}

[70]: /images/20210923/0377aff1bd9d4b4ebeb41899f0424841.png