xyzshop/admin/templates/default/provider.price.set.php

<?php defined('InShopNC') or exit('Access Invalid!'); ?>
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjs/3.16.0/math.min.js"></script>
<script>
    math.config({
        number: 'BigNumber',
        precision: 20
    });
</script>
<style>
    .disInput {
        background: #ccc;
        cursor: not-allowed;
    }

    .spec_table {
        width: 420px;
        border-right: 1px solid #CBE9F3;
    }

    .spec_table .batch {
        vertical-align: middle;
        display: inline-block;
        *display: inline
            /*IE7*/
        ;
        margin-left: 4px;
        position: relative;
        z-index: 1;
        *zoom: 1
            /*IE7*/
        ;
    }

    .spec_table .batch i {
        cursor: pointer;
    }

    .spec_table .batch-input {
        background-color: #FFF;
        white-space: nowrap;
        padding: 4px 9px;
        border: solid 1px #BCE8F1;
        position: absolute;
        z-index: 1;
        top: -70px;
        left: -75px;
        box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.25);
    }

    .spec_table .batch-input h6 {
        font-size: 12px;
        color: #555;
    }

    .spec_table .batch-input .text {
        vertical-align: middle;
        clear: both;
        padding: 0 4px;
        margin-right: 4px;
    }

    .spec_table .batch-input .arrow {
        background: url(<?php echo SHOP_SITE_URL; ?>/templates/default/images/seller/ncsc_bg_img.png) no-repeat -240px -20px;
        display: block;
        width: 10px;
        height: 5px;
        margin-left: -5px;
        bottom: -5px;
        left: 50%;
        position: absolute;
        z-index: 2;
    }

    .spec_table .batch-input a.close {
        font-size: 11px;
        line-height: 12px;
        color: #BCE8F1;
        text-decoration: none;
        background-color: #FFF;
        text-align: center;
        display: block;
        width: 12px;
        height: 12px;
        border-radius: 7px;
        border: solid 1px #BCE8F1;
        top: -7px;
        right: -7px;
        position: absolute;
        z-index: 2;
    }

    .spec_table .text.price {
        width: 40px;
    }
</style>
<div class="page">
    <div class="fixed-bar">
        <div class="item-title">
            <h3>通道管理</h3>
            <ul class="tab-base">
                <li><a href="index.php?act=provider&op=index"><span><?php echo $lang['nc_manage'] ?></span></a></li>
                <li><a href="index.php?act=provider&op=provider_amount"><span>调款记录</span></a></li>
                <li><a href="JavaScript:void(0);" class="current"><span>价格设置</span></a></li>
            </ul>
        </div>
    </div>
    <div class="fixed-empty"></div>
    <form id="price_form" enctype="multipart/form-data" method="post">
        <input type="hidden" name="form_submit" value="ok" />
        <input type="hidden" name="provider_id" value="<?php echo $_GET['provider_id'] ?>" />
        <table class="table tb-type2">
            <tbody>
                <tr class="noborder">
                    <td colspan="2">
                        <label>通道名称:</label>
                        <label><?php echo $output['provider_name']; ?></label>
                    </td>
                </tr>
                <tr class="noborder">
                    <td class="vatop rowform">
                        <label>通道质量:</label>
                        <label data-quality="<?php echo $output['quality']; ?>"><?php echo $output['quality_text']; ?></label>
                    </td>
                </tr>

                <tr class="noborder">
                    <td colspan="2" class="required"><label class="validation" for="mchid">编辑后延迟生效日期:</label></td>
                </tr>
                <tr class="noborder">
                    <td class="vatop rowform">
                        <select id="selectEffectType">
                            <option value="0">立即生效</option>
                            <option value="1">延迟生效</option>
                        </select>
                    </td>
                    <td class="vatop rowform">
                        <input class="txt date" style="display:none;" type="text" id="startTime" name="effect_time" placeholder="" value="<?php echo date("Y-m-d H:i:s", $output['effect_time']); ?>" autocomplete="off" style="width:120px" />
                    </td>
                    <td class="vatop tips" style="color: red"></td>
                </tr>
                <tr>
                    <td colspan="2" class="required"><label class="validation" for="password">价格:</label></td>
                </tr>
                <tr class="noborder" style="border-bottom: 1px solid #CBE9F3;">
                    <?php foreach ($output['amounts'] as $card_type => $datas) { ?>
                        <td>
                            <table class="spec_table tb-type2 setTable">
                                <tr class="w500">
                                    <th class="w150 align-center">卡类型</th>
                                    <th class="w150 align-center">面额</th>
                                    <th class="w150 align-center">
                                        价格
                                        <div class="batch" style="display: none;"><i class="icon-edit" title="批量操作"></i>
                                            <div class="batch-input" style="display:none;">
                                                <h6>批量设置费率（百分比）：</h6>
                                                <a href="javascript:void(0)" class="close">X</a>
                                                <input name="" type="text" class="text price" />%
                                                <a href="javascript:void(0)" class="ncsc-btn-mini" data-type="price">设置</a><span class="arrow"></span>
                                            </div>
                                        </div>
                                    </th>
                                    <th class="w150 align-center">
                                        费率(%)
                                        <div class="batch" style="display: inline-block"><i class="icon-edit" title="批量操作"></i>
                                            <div class="batch-input" style="display:none;">
                                                <h6>批量设置费率（百分比）：</h6>
                                                <a href="javascript:void(0)" class="close">X</a>
                                                <input name="" type="text" class="text price" />%
                                                <a href="javascript:void(0)" class="ncsc-btn-mini-price" data-type="price">设置</a><span class="arrow"></span>
                                            </div>
                                        </div>
                                    </th>
                                </tr>

                                <tbody class="tbody">
                                    <?php foreach ($datas as $spec => $val) { ?>
                                        <tr class="w500">
                                            <td class="w150 align-center">
                                                <?php echo $output['all_specs'][$card_type]['goods_name']; ?>
                                                <input type="hidden" name="card_types[]" value="<?php echo $card_type; ?>">
                                            </td>
                                            <td class="w150 align-center">
                                                <?php echo $spec; ?>
                                                <input type="hidden" class="num" name="specs[]" value="<?php echo $spec; ?>">
                                            </td>
                                            <td class="w150 align-center tdVal">
                                                <input type="text" name="<?php echo "price-{$card_type}-{$spec}" ?>" class="txt price changePrice <?php if ($val['opened'] == 0) echo 'disInput' ?>" <?php if ($val['opened'] == 0) echo 'disabled' ?> data-opened="<?php echo $val['opened']; ?>" value="<?php echo $val['price']; ?>">
                                            </td>
                                            <td class="w150 align-center">
                                                <input type="text" style="width:100px;" data-type="rate" min="0" max="200" <?php if ($val['opened'] == 0) echo 'disabled' ?>>
                                            </td>
                                        </tr>
                                    <?php } ?>
                                </tbody>
                            </table>
                        </td>
                    <?php } ?>
                </tr>
            </tbody>
            <tfoot>
                <tr class="tfoot">
                    <td colspan="15"><a href="JavaScript:void(0);" class="btn" id="submitBtn"><span><?php echo $lang['nc_submit']; ?></span></a></td>
                </tr>
            </tfoot>
        </table>
    </form>
</div>
<script type="text/javascript" src="<?php echo RESOURCE_SITE_URL; ?>/laydate/laydate.js"></script>
<script type="text/javascript" src="<?php echo RESOURCE_SITE_URL; ?>/js/dialog/dialog.js" id="dialog_js" charset="utf-8"></script>
<script type="text/javascript" src="<?php echo RESOURCE_SITE_URL; ?>/js/jquery-ui/jquery.ui.js"></script>
<script type="text/javascript" src="<?php echo RESOURCE_SITE_URL; ?>/js/ajaxfileupload/ajaxfileupload.js"></script>
<script type="text/javascript" src="<?php echo RESOURCE_SITE_URL; ?>/js/jquery.Jcrop/jquery.Jcrop.js"></script>
<link href="<?php echo RESOURCE_SITE_URL; ?>/js/jquery.Jcrop/jquery.Jcrop.min.css" rel="stylesheet" type="text/css" id="cssfile2" />
<script type="text/javascript">
    $(function() {

        let maxDecimal = (number) => {
            return String(number).replace(/^(.*\..{4}).*$/, "$1")
        }

        var effect_time = <?php echo json_encode($output['effect_time']) ?> * 1000;
        var curDate = new Date().getTime();
        if (effect_time > curDate) {
            $('#selectEffectType').val('1');
            $('#startTime').show();
            var date = new Date(effect_time);
            var year = date.getFullYear();
            var month = date.getMonth() + 1;
            var day = date.getDate();
            var hour = date.getHours() < 10 ? '0' + date.getHours() : date.getHours();
            var min = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes();
            var sed = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds();
            if (month < 10) {
                month = '0' + month;
            }
            if (day < 10) {
                day = '0' + day;
            }
            var nowTime = year + '-' + month + '-' + day + ' ' + hour + ':' + min + ':' + sed;
            laydate.render({
                elem: '#startTime',
                type: 'datetime',
                value: nowTime,
                min: new Date().getTime()
            });
        }

        // laydate.render({
        //     elem: '#startTime',
        //     type: 'datetime'
        // });

        const tdVals = $('.tdVal');
        for (let i = 0; i < tdVals.length; i++) {
            let rateInput = tdVals.eq(i).next().find('input');
            let price = tdVals.eq(i).find('.price').val();
            let amountPrice = tdVals.eq(i).find('.price').attr('name').split('-')[2];
            if (tdVals.eq(i).find('input').attr('data-opened') == 1) {
                rateInput.val(maxDecimal(math.format(math.multiply(math.divide(math.bignumber(price), math.bignumber(amountPrice)), math.bignumber(100)))));
            } else {
                rateInput.val('--');
            }
        }




        $('.txt.price').on('input', function() {
            var val = $(this).val();
            console.log('val', val);
            $(this).val(maxDecimal(val));
        })

        $('#selectEffectType').on('change', function() {
            const val = $(this).val();
            if (val == 0) {
                $(this).attr('name', 'effect_time')
                $('#startTime').attr('name', '');
                $('#startTime').hide()
            } else {
                var date = new Date();
                var year = date.getFullYear();
                var month = date.getMonth() + 1;
                var day = date.getDate();
                if (month < 10) {
                    month = '0' + month;
                }
                if (day < 10) {
                    day = '0' + day;
                }

                var nowTime = year + '-' + month + '-' + day + ' ' + '00' + ':' + '00' + ':' + '00';

                $(this).attr('name', '')
                $('#startTime').attr('name', 'effect_time');
                $('#startTime').show()
                laydate.render({
                    elem: '#startTime',
                    type: 'datetime',
                    value: nowTime,
                    min: nowTime
                });
            }
        })


        //按钮先执行验证再提交表单
        $("#submitBtn").click(function() {
            if ($('#startTime').is(':visible')) {
                const curTime = new Date().getTime();
                const selectTime = new Date($('#startTime').val()).getTime();
                if (selectTime < curTime) {
                    alert('延迟生效时间小于当前时间,请重新选择');
                    return;
                }
            }
            $("#price_form").submit();
        });
        // $('#price_form').validate({
        //     errorPlacement: function(error, element) {
        //         error.appendTo(element.parent().parent().prev().find('td:first'));
        //     },
        //     rules: {
        //         effect_time: {
        //             required: true,
        //         },
        //     },
        //     messages: {
        //         effect_time: {
        //             required: '延迟生效秒数不能为空',
        //         },
        //     }
        // });
        // 批量设置价格、库存、预警值
        $('.batch > .icon-edit').click(function() {
            $('.batch > .batch-input').hide();
            $(this).next().show();
        });
        $('.batch-input > .close').click(function() {
            $(this).parent().hide();
        });
        $('.batch-input > .ncsc-btn-mini').click(function() {
            var _value = $(this).prev().val();
            var _type = $(this).attr('data-type');
            _type = '.' + _type;
            // console.log('_type', _type)
            var trs = $(this).parents('.setTable').children('.tbody').children()
            var trsArr = []
            trs.each(function() {
                let res = $(this).find('td').eq(1).text().replace(/[\  \r\n]+/g, "");
                // console.log('res', res)
                trsArr.push(res)
            })
            // console.log('trsArr', trsArr)
            var _valArr = []
            if (_value && _value > 0 && _value <= 200) {
                for (var i = 0; i < trsArr.length; i++) {
                    _valArr[i] = maxDecimal(math.eval(trsArr[i] * _value / 100));
                }
                // console.log('_valArr', _valArr, trsArr)
                let vals = $(this).parents('.setTable').children('.tbody').find(_type)
                // console.log('vals', vals)
                for (let j = 0; j < vals.length; j++) {
                    // console.log('vals[j]', j, vals[j], _valArr[j])
                    if ($(vals[j]).attr('data-opened') == 1) {
                        vals[j].value = _valArr[j]
                    }
                }
                // console.log('_valArr', _valArr)
            } else if (_value && _value == 0 && _value <= 200) {
                for (let i = 0; i < trsArr.length; i++) {
                    _valArr[i] = 0
                }
                // console.log('_valArr', _valArr, trsArr)
                let vals = $(this).parents('.setTable').children('.tbody').find(_type)
                console.log('vals', vals)
                for (let j = 0; j < vals.length; j++) {
                    // console.log('vals[j]', j, vals[j], _valArr[j])
                    if ($(vals[j]).attr('data-opened') == 1) {
                        vals[j].value = _valArr[j]
                    }
                }
                // console.log('_valArr', _valArr)
            }
            $(this).parents('.setTable').children('.tbody').find('input[data-type="rate"]').val(maxDecimal(_value));

            $(this).parent().hide();
            $(this).prev().val('');
        });

        $('input[data-type="rate"]').on('input', function() {
            var val = $(this).val();
            var changeInputName = $(this).parent('td').prev().find('input').attr('name');
            var amountPrice = changeInputName.split('-')[2];
            // $(this).parent('td').siblings('.tdVal').find('input').val(maxDecimal(math.eval(amountPrice * val / 100)))

            if (val) {
                $(this).parent('td').siblings('.tdVal').find('input').val(maxDecimal(math.format(
                    math.divide(math.multiply(math.bignumber(amountPrice), math.bignumber(val)), math.bignumber(100))
                )))
            } else {
                $(this).parent('td').siblings('.tdVal').find('input').val('')
            }


        })

        $('.changePrice').on('input', function() {
            const val = $(this).val();
            const amountPrice = $(this).attr('name').split('-')[2];
            const rateInput = $(this).parent().next().find('input');
            // rateInput.val(maxDecimal(math.eval(val / amountPrice * 100)));
            if (val) {
                rateInput.val(maxDecimal(math.format(math.multiply(math.divide(math.bignumber(val), math.bignumber(amountPrice)), math.bignumber(100)))));
            } else {
                rateInput.val('')
            }

        })

        $('.ncsc-btn-mini-price').on('click', function() {
            const val = $(this).prev().val();
            $(this).parents('tbody').eq(0).find('.ncsc-btn-mini').prev().val(val);
            $(this).parents('tbody').eq(0).find('.ncsc-btn-mini').trigger('click');
        })


    });
</script>