@extends('layout.home')
@section('csrf-token')
    <meta name="csrf-token" content="{{ csrf_token() }}" />
@endsection
@section('title', '用户组合')
@section('content')
    @if(Session::get('msg'))
        <div class="alert alert-success">
            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>{{ Session::get('msg') }}
        </div>
    @endif

    @if(Session::get('dmsg'))
        <div class="alert alert-danger">
            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>{{ Session::get('dmsg') }}
        </div>
    @endif
    <div class="contentpanel contentContainer" style="flex-direction: column;padding: 20px;overflow-y:auto;">
        <div class="layui-row layui-form mb20">
            <div class="layui-col-md2 mr20">
                <input type="text" id="username" class="layui-input" placeholder="主用户">
            </div>
            <div class="layui-col-md4">
                <div class="layui-col-md2">
                    <button type="button" id="search" class="layui-btn layui-btn-sm layui-btn-normal">搜索</button>
                </div>
            </div>
        </div>
        <div class="layui-row" style="height:800px;">
            <table class="layui-hide" lay-filter="items" id="items"></table>
        </div>
    </div>
    <script type="text/javascript" src="{{ url('/static/layui-main2.8.11/tableSelect.js')}}"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            layui.use(function(){
                var table = layui.table;
                var form = layui.form;
                let siteMembers = {!! json_encode($siteMembers) !!};
                $('#search').click(function () {
                    let where = {
                        username: $('#username').val(),uid: $('#userId').val(),
                    };
                    itemsTable.reload({where:where,page:{curr:1}});
                    return false;
                });
                let itemsTable = table.render({
                    elem: '#items', url: '{{url('/member/userCombination')}}', skin:'nob', size:'lg', height:'800',
                    loading:true, defaultToolbar: [],
                    css: [ // 设置单元格样式
                        // 取消默认的溢出隐藏，并设置适当高度
                        '.layui-table-cell{height: 50px; line-height: 40px;}',
                        '.layui-table-cell .layui-colorpicker{width: 38px; height: 38px;}',
                        '.layui-table-cell select{height: 36px; padding: 0 5px;}'
                    ].join(''),
                    cols: [[
                        {field:'uid', title: 'UID'},
                        {field:'username', title: '用户名称'},
                        @foreach($allSites as $site=>$url)
                        {field:'{{$site}}', title: '站点-{{$site}}',templet:function (d) {
                            let thatUid = 0;
                            if(d['{{$site}}']!=undefined && d['{{$site}}']!=null){
                                thatUid = d['{{$site}}']['uid'];
                            }
                            let str = '<select name="siteUid" lay-filter="siteUid"><option value=""></option>';
                            $.each(siteMembers,function (k,v) {
                                if(k=='{{$site}}'){
                                    $.each(v,function (kk,vv) {
                                        str += '<option '+(thatUid==vv.uid?'selected':'')+' value="'+vv.id+'">'+vv.username+'</option>';
                                    });
                                }
                            });
                            str += '</select> ';
                            return str;
                        }},
                        @endforeach
                    ]],
                    parseData: function (ret) {
                        return {code: ret.error,msg: ret.msg,count: ret.data.count,data: ret.data.items};
                    },
                    done(res, curr, count){
                        form.render();
                        let resData = res.data;
                        if(resData.length>0){
                            $.each(resData,function (k,v) {
                                @foreach($allSites as $site=>$url)
                                $('.layui-table tr[data-index="' + k + '"] td[data-field="{{$site}}"] .layui-table-cell').css('overflow', 'visible')
                                @endforeach
                            });
                        }
                        table.getRowData = function(tableId, elem){
                            var index = $(elem).closest('tr').data('index');
                            return table.cache[tableId][index] || {};
                        };
                        var options = this;
                        form.on('select(siteUid)', function(data){
                            let value=data.value;
                            if(value==''){
                                return false;
                            }
                            let link = '{{url('/member/userBind')}}';
                            let rowData = table.getRowData(options.id, data.elem);
                            let params = {_token: "{{ csrf_token() }}", siteMemberId:value, mainUid:rowData.uid};
                            $.post(link,params,function (ret) {
                                layer.closeAll();
                                if(ret.error!=0){
                                    layer.alert(ret.msg,{title:'',icon:2},function(){
                                        window.location.reload();
                                    });
                                    return false;
                                }
                            },'json');
                        });
                    },
                    page:false,limit:20,limits:[20,50,100,200]
                });


                //监听table
                table.on('tool(items)', function(obj){
                    var data = obj.data;
                    if(obj.event === 'detail'){
                        let link = '{{url('supply/entrepotCreate',['id'=>'_id_'])}}'.replace('_id_',data.id);
                        layer.open({
                            type: 2,
                            title: '编辑仓库',
                            area: ['850px', '700px'],
                            content: link,
                            btn: ['确定', '取消'],
                            yes: function (index, layero) {
                                layero.find('iframe').contents().find("#submit").click();
                            }
                        });
                        return false;
                    }else if(obj.event === 'delete'){
                        let link = '{{url('/supply/entrepotDelete',['id'=>'_id_'])}}'.replace('_id_',data.id);
                        layer.confirm('是否确认删除'+data.name+'？', {title: ''}, function () {
                            layer.closeAll();
                            layer.load(3, {
                                shade: [0.1, '#333333']
                            });
                            $.post(link, {_token: "{{ csrf_token() }}",}, function (ret) {
                                layer.closeAll();
                                if (ret.error != 0) {
                                    layer.msg(ret.msg, {icon: 2});
                                    return false;
                                }
                                layer.msg('删除成功', {icon: 1});
                                itemsTable.reload();
                            }, 'json');
                        });
                        return false;
                    }
                });
            });
        });
    </script>
@endsection