gaoyixia/application/user/view/message/form.html

<div class="think-box-shadow">
    <form class="layui-form layui-card" action="{:request()->url()}" data-auto="true" method="post" autocomplete="off">
        <div class="layui-card-body">

            <div class="layui-form-item">
                <label class="layui-form-label label-required">推送类型</label>
                <div class="layui-input-inline">
                    <select name="type" lay-filter ="type">
                        {foreach [2=>'搜索标签',3=>'模块详情',4=>'智能标签'] as $ck=>$cv}
                        {if isset($vo.type)}
                        <option  {if $vo.type == $ck } selected {/if} value="{$ck}">{$cv}</option>
                        {else}
                        <option  {if $ck == 2 } selected {/if} value="{$ck}">{$cv}</option>
                        {/if}
                        {/foreach}
                    </select>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label ">标签</label>
                <div class="layui-input-block">
                    <input name="label" value='{$vo.label|default=""}' placeholder="请输入标签 不填默认全部发送" class="layui-input">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label label-required">标题</label>
                <div class="layui-input-block">
                    <input name="title" required value='{$vo.title|default=""}' placeholder="请输入推送标题" class="layui-input">
                </div>
            </div>

            <div class="label_div layui-form-item" {if !isset($vo.type) ||  $vo.type !== 4}style="display:none" {/if}>
                <label class="layui-form-label label-required">智能标签</label>
                <div class="layui-input-block">
                    <div id="demo1"></div>
                </div>
            </div>

            <div class="module_div" {if !isset($vo.type) ||  $vo.type == 2}style="display:none" {/if}>
                <div class="layui-form-item">
                    <label class="layui-form-label label-required">模块</label>
                    <div class="layui-input-inline">
                        <select name="module" lay-filter ="module">
                            {foreach $module_arr as $ck=>$cv}
                                <option  data-sel_module="{$ck}" {if isset($vo.module) && $vo.module == $ck } selected {/if} value="{$ck}">{$cv}</option>
                            {/foreach}
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label label-required">详情</label>
                    <div class="layui-input-inline">
                        <select name="first_id" id="first_id" lay-filter ="first_id" lay-search="">

                        </select>
                    </div>

                    <div class="layui-input-inline second_div">
                        <select name="second_id" id="second_id"  lay-filter ="second_id" lay-search="">

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

            <div class="layui-form-item">
                <label class="layui-form-label label-required">推送内容</label>
                <div class="layui-input-block">
                    <textarea name="content" required rows="10" cols="98">{$vo.content|default=''}</textarea>
                </div>
            </div>

            {notempty name='vo.id'}<input type='hidden' value='{$vo.id}' name='id'>{/notempty}
            <div class="layui-form-item text-center">
                <button class="layui-btn" type='submit'>保 存</button>
                <button class="layui-btn layui-btn-danger" type='button'   data-close>取消编辑</button>
            </div>
        </div>
    </form>

<!--    <script src="__ROOT__/static/xm-select.js"></script>-->
    <script>
        var user_label  = {:json_encode($user_label)};
        console.log(user_label);
        var demo1 = xmSelect.render({
            el: '#demo1',
            language: 'zn',
            filterable: true,
            data: user_label
        })
    </script>
    <script>
        form.on('select(type)', function(data){
            if(data.value == 3) {
                $(".module_div").show();
            }else{
                $(".module_div").hide();
            }

            if(data.value == 4) {
                $(".label_div").show();
                $(".module_div").show();
            }else{
                $(".label_div").hide();
            }
            window.form.render();
        })

        var sel_first = {:isset($vo['first_id']) ? $vo['first_id']:0};
        var sel_second  = {:isset($vo['second_id']) ? $vo['second_id']:0};
        var module_list  = {:json_encode($module_list)};
        // 分类选择监听
        var arr = ['video','article','datum','supplier','recruit','mall'];
        first(1);
        form.on('select(module)', function(data){
            first(2)
        })
        // 详情关联监听
        form.on('select(first_id)', function(data){
            second(2);
        })

        function first(source) {
            sel_module = $("select[name='module']").find("option:selected").data('sel_module');
            if(arr.indexOf(sel_module) != -1) {
                $(".second_div").show();
            }else{
                $(".second_div").hide();
            }
            var cl_html = '<option value="0">请选择</option>';
            if(sel_module == '') {
                $("select[name='first_id']").html(cl_html);
                $("select[name='second_id']").html(cl_html);
                window.form.render();
                return true;
            }else{
                $.each(module_list,function (ck,cv) {
                    if(cv.module == sel_module) {
                        if(source == 1 && sel_first == cv.id) {
                            cl_html +='<option selected value="'+cv.id+'">'+cv.title+'</option>';
                        }else{
                            cl_html +='<option value="'+cv.id+'">'+cv.title+'</option>';
                        }
                    }
                })
                $("select[name='first_id']").html(cl_html);
                $("select[name='second_id']").html('');
            }
            second(source);
            window.form.render();
        }
        function second(source) {
            var cl_html = '<option value="0">请选择</option>';
            sel_module = $("select[name='module']").find("option:selected").data('sel_module');
            first_id = $("select[name='first_id']").find("option:selected").val();
            $.each(module_list,function (ck,cv) {
                if(sel_module == cv.module && first_id == cv.id && arr.indexOf(sel_module) != -1) {
                    $.each(cv.children,function (sk,sv) {
                        if(source == 1 && sel_second == sv.id) {
                            cl_html +='<option selected value="'+sv.id+'">'+sv.title+'</option>';
                        }else{
                            cl_html +='<option value="'+sv.id+'">'+sv.title+'</option>';
                        }
                    })
                    $("select[name='second_id']").html(cl_html);
                    $(".second_div").show();
                    form.render();
                }
            })
        }


    </script>
</div>