baoying/www/static/layuiAdmin/dist/views/violation/charge_first.html

<title>违章车辆初次登记</title>

<div class="layui-card layadmin-header">
    <div class="layui-breadcrumb" lay-filter="breadcrumb">
        <a lay-href="">主页</a>
        <a><cite>违章车辆管理</cite></a>
        <a><cite>违章车辆初次登记</cite></a>
    </div>
</div>
<div class="layui-fluid">
    <div class="layui-card">
        <!--<div class="layui-card-body" id="getInfo">-->
            <!--<button class="layui-btn" data-type="getCarInfo" id="LAY_layer_iframe_demo">获取数据</button>-->
        <!--</div>-->
        <div class="layui-card-body" style="padding: 15px;">
            <form class="layui-form" action="" lay-filter="component-form-group">


                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label">车牌号码</label>
                        <div class="layui-input-inline">
                            <input type="text" name="license" lay-verify="required" autocomplete="off" class="layui-input" id="LAY_license" style="text-transform:uppercase;">
                        </div>
                    </div>

                    <div class="layui-inline">
                        <label class="layui-form-label">环保检测</label>
                        <div class="layui-input-inline layui-form" lay-filter="detectionSelect">
                            <select name="EP_type" lay-verify="required" lay-search="" lay-filter="detectionChangeType" id="detectionSelect">
                            </select>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">环检应收</label>
                        <div class="layui-input-inline">
                            <input type="text" class="layui-input" name="EP_receivable" id="HJYS" value="200" readonly unselectable="on" style="background-color: #e4e4e4">
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">挂账客户</label>
                        <div class="layui-input-inline layui-form" lay-filter="customerSelect">
                            <select name="customer" lay-search="" id="customerSelect"></select>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">车型判断</label>
                        <div class="layui-input-inline layui-form" lay-filter="carTypeSelect">
                            <select name="car_type" lay-verify="required" lay-search="" lay-filter="carChangeType" id="carTypeSelect"></select>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">安检应收</label>
                        <div class="layui-input-inline">
                            <input type="text" name="Safe_receivable" class="layui-input" id="AJYS" value="150" readonly unselectable="on" style="background-color: #e4e4e4">
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">应收总和</label>
                        <div class="layui-input-inline" >
                            <input type="text" name="receivable" class="layui-input" id="YSZH" value="350" readonly unselectable="on" style="background-color: #e4e4e4">
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">支付宝金额</label>
                        <div class="layui-input-inline" >
                            <input type="text" name="ali_pay" lay-verify="ali_pay" class="layui-input" id="ali_pay" autocomplete="off" placeholder="0" >
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">挂账金额</label>
                        <div class="layui-input-inline" >
                            <input type="text" name="on_account" lay-verify="on_account" class="layui-input" id="on_account" autocomplete="off" placeholder="0" >
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">实收总和</label>
                        <div class="layui-input-inline" >
                            <input type="text" name="cost" class="layui-input" id="SSZH" value="350">
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">手机</label>
                        <div class="layui-input-inline">
                            <input type="tel" name="telephone" autocomplete="off" class="layui-input"><!--lay-verify="phone"-->
                        </div>
                    </div>
                    <!--<div class="layui-inline">-->
                    <!--<label class="layui-form-label">日期</label>-->
                    <!--<div class="layui-input-inline">-->
                    <!--<input type="text" name="date" id="LAY-component-form-group-date" lay-verify="date" autocomplete="off" class="layui-input" style="background-color: #e4e4e4">-->
                    <!--</div>-->
                    <!--</div>-->
                </div>

                <div class="layui-form-item layui-form-text">
                    <label class="layui-form-label">备注</label>
                    <div class="layui-input-block">
                        <textarea name="text" placeholder="请输入内容" class="layui-textarea" style="width: 80%"></textarea>
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <div class="layui-footer">
                            <button class="layui-btn" lay-submit="" lay-filter="component-form-demo1">立即提交</button>
                            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                        </div>
                    </div>
                </div>
            </form>

        </div>
    </div>
</div>

<script>
    layui.use(['admin', 'form', 'laydate'], function(){
        var $ = layui.$
            ,admin = layui.admin
            ,element = layui.element
            ,layer = layui.layer
            ,laydate = layui.laydate
            ,form = layui.form;

        form.render(null, 'component-form-group');

        // laydate.render({
        //     elem: '#LAY-component-form-group-date',
        //     value: new Date(),
        //     format:'yyyy-MM-dd',
        // });
        form.verify({
            on_account:function (value) {
                if (value==="") {
                    $('#on_account').val(0)//为空自动赋值0
                }else {
                    if (isNaN(value)){
                        return "请输入数字！"
                    }
                }
            },
            ali_pay:function (value) {
                if (value==="") {
                    $('#ali_pay').val(0)//为空自动赋值0
                }else {
                    if (isNaN(value)){
                        return "请输入数字！"
                    }
                }
            }
        });
        $('#on_account').focus(function () {
            if($('#customerSelect').val()===""){
                $('#on_account').val(0)//为空自动赋值0
                layer.msg("需要先选择挂账客户！")
            }
        })
        //常用挂账客户
        $.ajax({
            url:"/customer/getCustomer",
            success:function (res) {
                var data = res;
                $.each(data,function (index,item) {
                    if (index===0){
                        $('#customerSelect').append('<option value="">'+item.name+'</option>');
                    }else {
                        $('#customerSelect').append('<option value="'+item.name+'">'+item.name+'</option>');
                    }
                });
                form.render('select', 'customerSelect');
            }
        });
        //环检下拉
        $.ajax({
            url:"/chargingStandard/getSelect",
            type:'POST',
            data:{"project":"环检"},
            success:function (res) {
                var data = res;
                $.each(data,function (index,item) {
                    $('#detectionSelect').append('<option value="'+item.carType+'">'+item.carType+'</option>');
                });
                form.render('select', 'detectionSelect');
            }
        });
        //安检下拉
        $.ajax({
            url:"/chargingStandard/getSelect",
            type:'POST',
            data:{"project":"安检"},
            success:function (res) {
                var data = res;
                $.each(data,function (index,item) {
                    $('#carTypeSelect').append('<option value="'+item.carType+'">'+item.carType+'</option>');
                });
                form.render('select', 'carTypeSelect');
            }
        });
        //根据carType(安检)改变，联动默认价格
        form.on('select(carChangeType)',function (data) {
            $.ajax({
                url:"/chargingStandard/getSelect",
                type:'POST',
                data:{"carType":data.value},
                success:function (res) {
                    $('#AJYS').val(res[0].cost);
                    $('#YSZH').val(parseInt($('#AJYS').val()) + parseInt($('#HJYS').val()));//应收总和
                    $('#SSZH').val($('#YSZH').val());
                }
            })
        });
        //根据EP_type(环检)改变，联动默认价格
        form.on('select(detectionChangeType)',function (data) {
            $.ajax({
                url:"/chargingStandard/getSelect",
                type:'POST',
                data:{"carType":data.value},
                success:function (res) {
                    $('#HJYS').val(res[0].cost);
                    $('#YSZH').val(parseInt($('#AJYS').val()) + parseInt($('#HJYS').val()))//应收总和
                    $('#SSZH').val($('#YSZH').val());
                }
            })
        });



        /* 监听提交 */
        form.on('submit(component-form-demo1)', function(data){
            // layer.alert(JSON.stringify(data.field), {
            //     title: '最终的提交信息'
            // })
            // return false;
            var field = data.field;
            field.license = field.license.toUpperCase()
            admin.req({
                url:"/charge/saveCharge",
                type:'POST',
                data:field,
                done:function (res) {
                    if (res.code===0){
                        layer.msg("提交成功")
                    }else {
                        layer.msg(res.msg)
                    }
                }
            })
        });

        //
        var active = {
            getCarInfo: function(){
                layer.open({
                    type: 2,
                    area: ['700px', '650px'],
                    fixed: false,
                    maxmin: true,
                    content: layui.setter.base + 'views/detection/layer/getCarInfo.html'
                });
            }
        }
        $('#getInfo .layui-btn').on('click', function(){
            var type = $(this).data('type');
            active[type] && active[type].call(this);
        });
    });
</script>