cxgj/widgets/views/pick-linker.php

<?php

/**
 * @author Any
 * @description KISS
 * @date 2019-2-15
 * @version 1.0.0
 */

?>
<script id="pick_link_html" type="text/html">
<div class="pick-link-panel">
    <div class="pick-link-panel-body">
        <div class="input-row layui-mb-15 layui-row layui-clearfix">
            <label class="layui-col-sm2">选择链接</label>
            <div class="layui-col-sm10">
                <select class="form-control pick-link-list">
                    <?php foreach($links as $index => $item):?>
                    <option value="<?=$index?>"><?=$item["name"]?></option>
                    <?php endforeach;?>
                </select>
            </div>
        </div>

        <div class="input-row layui-mb-15 layui-row layui-clearfix" id="store" style="display: none">
            <label class="layui-col-sm2">选择门店</label>
            <div class="layui-col-sm10">
                <select class="form-control" name="store">
                    <?php foreach($store as $index => $item):?>
                        <option value="<?=$item['id']?>"><?=$item["name"]?></option>
                    <?php endforeach;?>
                </select>
            </div>
        </div>

        <div class="input-row layui-mb-15 layui-row layui-clearfix" id="box" style="display: none">
            <label class="layui-col-sm2">选择包厢</label>
            <div class="layui-col-sm10">
                <select class="form-control" name="box">
                    <?php foreach($box as $index => $item):?>
                        <option value="<?=$item['id']?>" store_id="<?=$item['store_id']?>"><?=$item["name"]?></option>
                    <?php endforeach;?>
                </select>
            </div>
        </div>

        <div class="input-row layui-mb-15 layui-row layui-clearfix" id="notice" style="display: none">
            <label class="layui-col-sm2">选择布告</label>
            <div class="layui-col-sm10">
                <select class="form-control" name="notice">
                    <?php foreach($notice as $index => $item):?>
                        <option value="<?=$item['id']?>"><?=$item["name"]?></option>
                    <?php endforeach;?>
                </select>
            </div>
        </div>

    </div>    
    <div class="pick-link-panel-footer layui-text-center layui-mt-15 layui-mb-15"> 
        <a class="layui-btn layui-btn-sm cancel-btn " href="javascript:;">取消</a>
        <a class="layui-btn layui-btn-sm confirm-btn" href="javascript:;">确定</a>
    </div>    
</div>
</script>
<script>
<?php $this->beginBlock('js_script_wrap') ?> 
$(document).ready(function(){
    //选择链接
    $(".layui-form").on("click","<?=$link_select_btn?>",function(){
        var content = $("#pick_link_html").html();
        var links = '<?= json_encode($links)?>';
        links = JSON.parse(links);
        layer.open({
            type: 1,
            title:'选择链接',
            offset:'50px',
            area: ['560px', '300px'], //宽高
            content: content,
            success:function(layero, index){
                //console.log(layero, index);
                var url = null;
                var params = {};
                var selected_index = 0;
                $('.pick-link-panel').on('change','.pick-link-list',function(){
                    var index = $(this).val();
                    index = index * 1;

                    if(index == 2 || index == 5){
                        $('#store').show();
                        $('#notice').hide();
                        $('#box').hide();
                    }else if(index == 3){
                        $('#box').show();
                        $('#store').hide();
                        $('#notice').hide();
                    }else if(index == 4){
                        $('#box').hide();
                        $('#store').hide();
                        $('#notice').show();
                    }else{
                        $('#box').hide();
                        $('#store').hide();
                        $('#notice').hide();
                    }

                    selected_index = index;
                    var link = links[index];
                    url = link.link;
                    if(link.params.length != 0){
                        var param_html_template = $('.pick-link-panel .input-row-param.layui-hide').html();
                        //remove
                        $(".pick-link-panel .input-row-param").each(function(index){
                            if(index > 0){
                                $(".pick-link-panel .input-row-param").eq(index).remove();
                            }
                        });
                        //add
                        var param_html = '';
                        for(var i in link.params){
                            var html = '<div class="input-row-param layui-mb-15 layui-row">{}</div>'.format(param_html_template.format(link.params[i]['key'],link.params[i]['key'],link.params[i]['desc']));
                            param_html += html;
                        }
                        $('.pick-link-panel .input-row-param.layui-hide').after(param_html);
                    }
                });
                $('.pick-link-panel').on('click','.confirm-btn',function(){
                    url = links[selected_index]['link'];
                    var regPos = /^\d+$/; // 非负整数
                    if(selected_index == 2){
                        params['storeId'] = $("select[name='store'] option:selected").val();
                        if(!regPos.test(params['storeId'])){
                            layer.msg('请选择门店', {
                                offset: '15px'
                                , icon: 2
                                , time: 1000
                            });
                            return false
                        }

                    }else if(selected_index == 3){
                        params['id'] = $("select[name='box'] option:selected").val();
                        params['storeId'] = $("select[name='box'] option:selected").attr('store_id');
                        if(!regPos.test(params['id'])){
                            layer.msg('请选择包厢', {
                                offset: '15px'
                                , icon: 2
                                , time: 1000
                            });
                            return false
                        }

                    }else if(selected_index == 4){
                        params['id'] = $("select[name='notice'] option:selected").val();
                        if(!regPos.test(params['id'])){
                            layer.msg('请选择布告', {
                                offset: '15px'
                                , icon: 2
                                , time: 1000
                            });
                            return false
                        }
                    }else if(selected_index == 5){
                        params['storeId'] = $("select[name='store'] option:selected").val();
                        if(!regPos.test(params['storeId'])){
                            layer.msg('请选择门店', {
                                offset: '15px'
                                , icon: 2
                                , time: 1000
                            });
                            return false
                        }
                        params['is'] = true;
                    }
                    var l = wrx.object_length(params);
                    url = l == 0 ? url : url + '?' + wrx.object_to_url_params(params);
                    $('<?=$link_input_class?>').val(url);
                    layer.close(index);
                })
                $('.pick-link-panel').on('click','.cancel-btn',function(){
                    layer.close(index);
                });
            }
        });
    });
})
    
<?php $this->endBlock(); ?>
</script>
<?php $this->registerJs($this->blocks['js_script_wrap'], \yii\web\View::POS_END); ?>