index.html 6.6 KB
{extend name="public:base" /}
{block name="body"}
<style type="text/css">
    .layui-table-page{
        text-align: right;
    }
</style>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-body">
                    <form class="layui-form">
                        <div class="layui-input-inline" style="width:150px;">
                            <select name="search_type" id="search_type"   >
                                <option value="1" selected="selected" {if $search_type eq 1 } selected {/if}>缴费单号</option>
                                <option value="2" {if $search_type eq 2 } selected {/if}>账单号</option>
                                <option value="3" {if $search_type eq 3 } selected {/if}>电表识别号</option>
                                <option value="4" {if $search_type eq 4 } selected {/if}>站名</option>
                            </select>
                        </div>

                        <div class="layui-input-inline">
                            <input type="text" name="search_text"
                                   style="width:150px;" placeholder="搜索内容" autocomplete="off" id="search_text" class="layui-input" value="{$search_text}">
                        </div>
                        <div class="layui-input-inline" style="width:150px;">
                            <select name="payment_status" id="payment_status">
                                <option value=""   selected="selected" {if $payment_status === '' } selected {/if}>缴费状态</option>
                                <option value="0"  {if $payment_status === 0 || $payment_status === '0'} selected {/if}>未缴费</option>
                                <option value="1"  {if $payment_status == 1 } selected {/if}>已缴费</option>
                                <option value="4"  {if $payment_status == 4 } selected {/if}>已审核</option>

                            </select>
                        </div>
                        <div class="layui-input-inline layui-show-xs-block" style="width:100px;">
                            <select name="area_id" id="area_id">
                                <option value="0"> 区域</option>
                                {volist name="regions" id="region"}
                                {if $region.level == 0}
                                <option disabled='disabled'  class='layui-disabled' >{$region.region_name}</option>
                                {else /}
                                <option value="{$region.id}" {if $area_id eq $region.id } selected {/if} >&nbsp;&nbsp;&nbsp;&nbsp;{$region.region_name}</option>
                                {/if}
                                {/volist}
                            </select>
                        </div>

                        <div class="layui-input-inline" style="width:100px;">
                            <select name="cp_date" id="cp_date">
                                <option value="1">创建日期</option>
                            </select>
                        </div>
                        <div class="layui-input-inline">
                            <input type="text" name="date_start" id="date_start" placeholder="开始日期" autocomplete="off" class="layui-input"  style="width:100px;" value="{$date_start}">
                        </div>
                        <div class="layui-input-inline">
                            <input type="text" name="date_end" style="width:100px;" id="date_end" placeholder="结束日期" autocomplete="off" class="layui-input" value="{$date_end}">
                        </div>

                        <div class="layui-input-inline">
                            <button class="layui-btn" lay-submit="" lay-filter="search">
                                <i class="layui-icon">&#xe615;</i></button>
                        </div>
                    </form>
                </div>

                <div class="layui-card-body ">
                    <table class="layui-table" lay-filter="payment" lay-data="{
                        url:'/payment',
                        page:true,
                        id:'idTest',
                        where:{search_type:document.getElementById('search_type').value,
                        search_text:document.getElementById('search_text').value,
                        area_id:document.getElementById('area_id').value,
                        date_start:document.getElementById('date_start').value,
                        date_end:document.getElementById('date_end').value,
                        payment_status:document.getElementById('payment_status').value}
                      }">
                        <thead>
                            <tr>
                                <th lay-data="{templet: '#payment_id',sort: true} ">缴费单号</th>
                                <th lay-data="{field:'station_name',sort: true} ">站名</th>
                                <th lay-data="{field:'em_numb',sort: true} ">表号</th>
                                <th lay-data="{field:'payment_type',sort: true}">缴费类型</th>
                                <th lay-data="{field:'amount',sort: true}">应付金额</th>
                                <th lay-data="{templet: '#state'}">状态</th>
                                <th lay-data="{field: 'create_time',sort: true}">创建日期</th>
                                <th lay-data="{fixed: 'right',  align:'center', toolbar: '#barDemo'}">操作</th>
                            </tr>
                        </thead>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script type="text/html" id="state">
    <span class="{{ d.style }}">{{d.state}}</span>
</script>
<script type="text/html" id="payment_id">
    <a class="layui-link"  title="查看详情" href="/payment/{{d.payment_id}}">{{d.payment_id}}</a>
</script>
<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-sm"  title="查看详情" href="/payment/{{d.payment_id}}">详情</a>
</script>
<script>
    layui.use(['laydate','form','table'], function(){
        var laydate = layui.laydate,
            table = layui.table;
        laydate.render({
            elem:'#date_end',
            trigger:'click',
        })

        laydate.render({
            elem:'#date_start',
            trigger:'click',
        })


        $('.demoTable .layui-btn').on('click', function(){
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
    });

</script>
{/block}