<link rel="stylesheet" href="/plugins/addons/product_date/template/js/layui/css/layui.css" media="all">
<style>
    .layui-form-item{
        display: flex;
        align-items: stretch;
    }
    .layui-form-label{
        flex: 0 0 auto;
    }
    .layui-input-block{
        flex: 1 1 auto;
        margin-left: 0!important;
    }
</style>
<section class="admin-main">
    <div class="container-fluid">
        <div class="page-container">
            <div class="card">
                <div class="card-body">
                    <!-- class="col-lg-1 col-md-12 col-sm-12" -->
                    <div class="card-title row">
                        <div class="pl-4 pr-4">{$Title}</div>
                        <div class="col-lg-8 col-md-12 col-sm-12">
                            {foreach $PluginsAdminMenu as $v}
                                {if $v['custom']}
                                    <span  class="ml-2"><a  class="h5" href="{$v.url}" target="_blank">{$v.name}</a></span>
                                {else/}
                                    <span  class="ml-2"> <a  class="h5" href="{$v.url}">{$v.name}</a></span>
                                {/if}
                            {/foreach}
                        </div>
                    </div>

                    <div class="tab-content mt-4">

                        <div class="table-body auto-login-content" style="margin-top: 10px;">

                            <form class="layui-form layui-form-pane" action="">
                                <div class="layui-form-item">
                                    <label class="layui-form-label">商品分组</label>
                                    <div class="layui-input-block" id="list1">
                                   </div>
                                </div>
                                <div class="layui-form-item">
                                    <label class="layui-form-label">商品</label>
                                    <div class="layui-input-block" id="productList">
                                   </div>
                                </div>
                                <div class="layui-form-item">
                                    <label class="layui-form-label">延长天数</label>
                                    <div class="layui-input-block">
                                        <input type="number" name="days" required  lay-verify="required" placeholder="请输入延长天数" autocomplete="off" class="layui-input">
                                    </div>
                                    <div class="layui-form-mid layui-word-aux">天数</div>
                                </div>

                                <div class="layui-form-item">
                                    <div class="layui-input-block">
                                        <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>

                                    </div>
                                </div>
                            </form>
                        </div>
                        <div class="table-body">文档说明：<a href="https://html5code.org/type/zjmf.html" target="_blank">https://html5code.org/type/zjmf.html</a> </div>
                        <div class="table-body" id="renewMsg" style="color: #ff0000;"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<script src="/plugins/addons/product_date/template/js/layui/layui.js"></script>
<script src="/plugins/addons/product_date/template/js/xm-select/dist/xm-select.js"></script>
<script>
    let queryToJson=function (hash){
        let str=hash?window.location.hash:window.location.search
        if( !str ) return { };
        if(str) str=str.substr(1);
        if( !str ) return { };
        let arr = str.split('&');
        let data={ };
        $.each( arr, function (k,v) {

            if(v.indexOf("=")>-1){
                let d=v.indexOf("=");
                data[ decodeURIComponent(v.substr(0,d)) ]=decodeURIComponent(v.substr(d+1));

            }

        } );
        return data;
    }
    let jsonToQuery=function (json){
        return  Object.keys(json).map(function (key) {
            return json[key]? (key + "=" + encodeURIComponent(json[key])):"";
        }).join("&");
    }
    let GzhxLoading=function(str){



        return layer.msg(str, {
            time: 0,
            icon:16

            ,shade: 0.3,zIndex: layer.zIndex

            ,success:function (layero) {

                layer.setTop(layero);

            }

        });

    }
    let ajax=function (option){
        let index=GzhxLoading(option.load||"加载中……")
        $.ajax({
                dataType: "json",
                type: option.type||"post",

                headers: {
                    "X-Requested-With": "XMLHttpRequest",

                },
                url: option.url||"",
                data:option.data,
                async:true,
                success: function (t) {

                    layer.close(index);

                    if( t.status==1 ){
                        if(option.success)  option.success(t.info);
                    }else{
                        if(option.error){
                            option.error(t.info);
                        }else{
                            layer.msg(t.info);
                        }
                    }
                },

                error: function (request, status, errorThrown) {
                    layer.close(index);
                    if(option.error){
                        option.error("网络错误，请重试");
                    }else{
                        layer.msg("网络错误，请重试");
                    }
                }
            }
        );
    }
    layui.use(['layer','form'],function(){
        let productSelect=xmSelect.render({
            el: '#productList',

            filterable: true,
            empty:'请先选择商品分组',
            data: [],

            tips:'请选择商品',
            prop:{
                name:"name_data",
                value:"id"
            }
        });
        let demo1 = xmSelect.render({
            el: '#list1',
            radio: true,
            filterable: true,
            clickClose:true,
            data: [],
            tips:'请选择分组',
            prop:{
                name:"name",
                value:"id"
            },
            on:function (data){
                if(data.arr.length>0){
                    productSelect.update({
                        data:data.arr[0].products
                    })
                }
            }
        })
        let _get=function (callback){
            ajax({
                data:{
                    action:'get',
                    p:''
                },
                success:function (res){
                    demo1.update({
                        data:res
                    });
                    if(callback){
                        callback();

                    }
                }
            })
        }
        _get();
        layui.form.on('submit(formDemo)', function(data){
            let productList=productSelect.getValue("value");
            let gid=demo1.getValue("value");
            if(productList.length<1){
                layer.msg("请选择商品");
                return false;
            }
            data.field.product=productList;
            ajax({
                data:{
                    action:'set',
                    data:data.field
                },
                success:function (res){
                    layer.alert("加时成功");
                    _get(function () {
                        demo1.setValue([]);
                        productSelect.setValue([])
                    })
                }
            })
            layer.msg(JSON.stringify(productList));
            return false;
        });
    })
</script>
