<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>支架账户-支架账户</title>
  <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">
  <meta name="decorator" content="base" />
  <link rel="stylesheet" type="text/css" href="${ctxPlugin}/static/css/reset.css" />
  <link rel="stylesheet" href="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/style/formSelects-v4.css" media="all">
  <link rel="stylesheet" type="text/css" href="${ctxPlugin}/lib/font/iconfont.css" />
</head>
<body>

<div class="layui-fluid">
  <div class="layui-form layui-card">
    <div class="layui-tab layui-tab-brief">
      <ul class="layui-tab-title">
        <sfTags:pagePermission authFlag="ZHGL_ZJZH_ZJZH_T" html='<a href="${ctx}/supportAccount/toSupportAccountDetail"><li class="layui-this">支架账户</li></a>'/>
        <button class="layui-btn f-r mt-10 mr-15 pl-10 pr-10 " type="reset"  onclick="reset()" >
          <i class="layui-icon fs-12">&#xe9aa;</i>
          重置
        </button>
        <button class="layui-btn f-r mt-10 mr-15 pl-10 pr-10" id="searchBtn" lay-submit lay-filter="LAY-user-back-search"><i class="layui-icon fs-12">&#xe615;</i>查询</button>
      </ul>
    </div>
    <div class="layui-card-body layuiadmin-card-header-auto" id="searchForm">
      <div class="layui-form-item">
        <c:if test="${user.userType eq '1' || user.userType eq '4'}">
          <div class="layui-col-lg3 layui-col-sm3" style="width: 27.5%">
            <label class="layui-form-label">代理商名称：</label>
            <div class="layui-input-block" >
              <select name="traderId" lay-search>
                <option value="">请选择</option>
                <c:forEach items="${traderList}" var="trader">
                  <option value="${trader.columns.id}">${trader.columns.name}</option>
                </c:forEach>
              </select>
            </div>
          </div>
        </c:if>

        <div class="layui-col-lg2 layui-col-sm3">
          <label class="layui-form-label">业务类型：</label>
          <div class="layui-input-block">
            <select name="adjustType">
              <option value="">请选择</option>
              <option value="1">现金下单</option>
              <option value="2">结算扣款</option>
              <option value="3">打款</option>
            </select>
          </div>
        </div>

        <div class="layui-col-lg4 layui-col-sm6">
          <label class="layui-form-label">申请时间：</label>
          <div class="layui-input-block">
            <div class="layui-col-xs5">
              <input type="text" name="createTimeSta" class="layui-input pointer" readonly
                     id="createTimeMin"
                     placeholder="开始日期">
            </div>
            <div class="layui-col-xs2 text-c lh-30">
              —
            </div>
            <div class="layui-col-xs5">
              <input type="text" name="createTimeEnd" class="layui-input pointer" readonly
                     id="createTimeMax"
                     placeholder="结束日期">
            </div>
          </div>
        </div>
      </div>
    </div>

  </div>
  <div class="layui-card">
    <div class="layui-card-body">
      <c:if test="${user.userType eq '6' && arrearsAmount>0}">
        <div>待支付金额：${arrearsAmount}</div>
      </c:if>
      <table class="layui-hide" lay-skin="row" id="test" lay-filter="test"></table>
    </div>
  </div>
</div>
<script type="text/html" id="optTpl">
  <a class="layui-table-opt-link" lay-event="viewDetail">查看</a>
</script>
<!-- toolbar -->
<script type="text/html" id="toolbarDemo">
  <div class="layui-btn-container">
    <sfTags:pagePermission authFlag="ZHGL_ZJZH_ZJZH_DC_B" html='<button class="layui-btn layui-btn-sm" id="exportBtn"><i class="layui-icon layui-icon-export"></i>导出</button>'/>
  </div>
</script>
<script src="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/layui/layui.js"></script>
<script src="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/lib/formSelects-v4.js"></script>
<script>
  var entrycount=0;
  layui.config({
    base: '${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/' //静态资源所在路径
  }).extend({
    index: 'lib/index' //主入口模块
  }).use(['index', 'tableExt', 'jquery', 'layer','laypage','laydate','form', 'upload', 'laytpl'], function(){
    //layui.use(['table','layer','laypage','laydate','form'], function(){
    $ = layui.$;
    tableExt = layui.tableExt;
    layer = layui.layer;
    laypage = layui.laypage;
    laydate = layui.laydate;
    form = layui.form;
    laytpl = layui.laytpl;
    table = tableExt.getLayTable();

    //开始日期
    var endStartTime = laydate.render({
      elem: '#createTimeMin'
      /* ,type: 'datetime'*/
      ,done: function(value, date){
        //更新结束日期的最小日期
        endEndTime.config.min = lay.extend({}, date, {
          month: date.month - 1
        });
        //自动弹出结束日期的选择器
        endEndTime.config.elem[0].focus();
      }
    });
    //结束日期
    var endEndTime = laydate.render({
      elem: '#createTimeMax'
      /* ,type: 'datetime'*/
      ,done: function(value, date){
        //更新开始日期的最大日期
        /* endStartTime.config.max = lay.extend({}, date, {
             month: date.month - 1
         });*/
      }
    });

    tableExt.render({
      elem: '#test'
      , title:'账户明细'
      , height: 'full-180'
      , toolbar: '#toolbarDemo'
      , defaultToolbar: false
      , limits : [ 20, 50, 100 ]
      , limit:20
      , page : true //开启分页
      , url: '${ctx}/supportAccount/supportAccountListData'
      , cols: [[
        {type: 'numbers',fixed:'left',title:'序号'}
        , {field: 'id', title: '操作', fixed:'left', minWidth: 80, sort: false, align: 'center', templet: '#optTpl'}
        , {field: 'number', title: '记录编号',minWidth: 150, align: 'center',exportable:true}
        , {field: 'type', title: '业务类型',minWidth: 150, align: 'center',exportable:true
          , templet: function (d) {
              if (d.type === '1') {
                return '现金下单';
              }else if (d.type === '2') {
                return '结算扣除';
              }else if(d.type ==='3'){
                return "打款";
              }
              return '';
            },
            expFormat: function (d) {
              if (d.type === '1') {
                return '现金下单';
              }else if (d.type === '2') {
                return '结算扣除';
              }else if(d.type ==='3'){
                return "打款";
              }
              return '';
            }
        }
        , {field: 'relate_order_number', title: '关联单号',minWidth: 150, sort: false, align: 'center',exportable:true}
        , {field: 'amount', title: '发生金额(元)',minWidth: 120, sort: false, align: 'center',exportable:true}
        , {field: 'traderName', title: '付款单位',minWidth: 150, sort: false, align: 'center',exportable:true}
        , {field: 'take_amount_unit', title: '收款单位',minWidth: 150, sort: false, align: 'center',exportable:true}
        , {field: 'take_amount_account', title: '收款账户',minWidth: 150, sort: false, align: 'center',exportable:true}
        , {field: 'rate', title: '费率(%)',minWidth: 200, sort: false, align: 'center',exportable:true}
        , {field: 'createTime', title: '发生时间',minWidth: 180, sort: false, align: 'center',exportable:true}
      ]]
      ,exportOpt:{                           //导出选项配置
        ele:'#exportBtn',                   //导出的Dom元素
        headerTitle: '支架账户',             //excel表格的标题
        pageData:false,                     //true:导出的数据为页面数据，false:最大导出maxAmount条数据
        maxAmount: 5000,                    //当pageData为false生效
        fileName: '支架账户',
        where: function (){                 //当pageData为false时生效，过滤的条件
          return _serializeJson($("#searchForm"));
        }
      },done: function(res, curr, count){
        //得到数据总量

        entrycount = count;
      }
    });

    //监听搜索
    form.on('submit(LAY-user-back-search)', function(data){
      var field = data.field;
      //执行重载
      tableExt.reload('test', {
        where: field,
        page:{
          curr:1
        }
      });
    });

    table.on('tool(test)', function (obj) {
      var data = obj.data; //获得当前行数据
      var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
      var tr = obj.tr; //获得当前行 tr 的 DOM 对象（如果有的话）

      if (layEvent === 'viewDetail') {
        layer.open({
          title:'查看',
          type: 2,
          area: ["80%", "70%"],
          content: '${ctx}/supportAccount/supportAccountDetailPage?id='+data.id
        })
      }
    })
  })

  function downloadAttach(attach){
    attach=decodeURI(attach);
    attach = attach.replace(/\+/g,"%2B"); //
    window.location.href = '${commonStaticImgPath}' + attach;
  }

  function searchOrder() {
    //执行重载
    table.reload('test', {
      where: function (){
        return _serializeJson($("#searchForm"));
      }
    });
  }

  function isBlank(val) {
    if (val == null || val == '' || val == undefined) {
      return true;
    }
    return false;
  }

  function reset(){
    layui.form.render();
    $("#searchForm").find("select").val("");
    $("#searchForm").find("input").val("");
  }
</script>
</body>
</html>


