@extends('layouts.father')
@section('title', '供应商管理')
@section('body')
    <div class="x-nav">
      <span class="layui-breadcrumb">
        <a onclick="goindex()">首页</a>
        <a href="#">采购管理</a>
        <a>
          <cite>供应商型号</cite></a>
      </span>
        <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right"
           href="/admin/supplierXh" title="刷新"><i class="layui-icon" style="line-height:30px">&#xe669;</i></a>
    </div>
    <div class="x-body">
        <xblock>
            <div class="layui-row">

                <form action="" class="layui-form layui-col-md12 x-so" style="margin: 0;float: left;width: 1000px;">
                    {{csrf_field()}}
                    <button class="layui-btn audit " data-type="审核" >批量审核</button>
                    <button class="layui-btn audit" data-type="弃审" >批量弃审</button>
                    <button class="layui-btn copy">复制链接</button>
                    <button class="layui-btn amend">批量修改默认供应商</button>
                    <input type="text" name="number" @if(isset($req['number'])) value="{{$req['number']}}" @endif  placeholder="货号" autocomplete="off" class="layui-input">
                    <input type="text" name="supplier_xh" @if(isset($req['supplier_xh'])) value="{{$req['supplier_xh']}}" @endif  placeholder="供应商型号" autocomplete="off" class="layui-input">
                    <button class="layui-btn"  lay-filter="sreach"><i class="layui-icon">&#xe615;</i></button>
                </form>
                <a class="layui-btn layui-btn-sm" href="/admin/supplierXh?text=default" style="margin: 0">默认供应商为空</a>
                <a class="indexAbottonHref layui-btn layui-btn-sm" style="text-decoration: none" title="新建供应商型号" onclick="x_admin_show('新建供应商型号','/admin/supplier_xhAdd','900','750')" href="javascript:;">新建供应商型号</a>
                <button class="layui-btn x-right importBom"><i class="layui-icon"></i>导入</button>
                <button class="layui-btn x-right " id="remove">批量删除</button>
                <input type="file" id="batchUpload" name="files"
                       style="display:none"
                >
                {{--<div class="layui-btn x-right importNorm"><i class="layui-icon"></i>导入</div>--}}
            </div>
        </xblock>
        <table class="layui-table">
            <thead>
            <tr>
                <th>
                    <input type="checkbox" name="selectAll" id="">
                </th>
                <th>货号</th>
                <th>供应商名称</th>
                <th>供应商型号</th>
                <th>默认供应商</th>
                <th>状态</th>
                <th>操作</th>
            </thead>
            <tbody id="x-img">
            @foreach($supplier_xh as $b)
                <tr>
                    <input type="hidden" name="id" value="{{$b->id}}">
                    <td>
                        <input type="checkbox" name="select" id="">
                    </td>
                    <td class="number">{{$b->number}}</td>
                    <td>{{$b->name}}</td>
                    <td>{{$b->supplier_xh}}</td>
                    <td>{{$b->default}}</td>
                    <td>{{$b->status}}</td>
                    <td class="td-manage">
                        <a title="详情" onclick="x_admin_show('详情页','/admin/supplier_xhAdd?id={{$b->id}}','900','750')" href="javascript:;" class="layui-btn layui-btn-normal layui-btn-xs">
                            <i class="layui-icon layui-icon-edit">&#xe642;详情</i></a>
                        {{--<a title="删除" onclick="normsType_del({{$b->id}})" href="javascript:;" class="layui-btn layui-btn-danger layui-btn-xs">
                            <i class="layui-icon">&#xe640;删除</i>
                        </a>--}}
                        <a class="layui-btn layui-btn-warm layui-btn-xs" onclick="x_admin_show('日志详情','/admin/historyInfo/{{$b->id}}')">查看日志</a>

                    </td>
                </tr>
            @endforeach
            </tbody>
        </table>
        <div class="page">
            <div>
                {{$supplier_xh->appends($req)->links()}}
            </div>
        </div>
    </div>
    <script src="/js/clipboard.js"></script>
    <script>
        if($(document.body).outerWidth() < 500){

            let url = `
             <div class="x-nav">
      <span class="layui-breadcrumb">
        <a onclick="goindex()">首页</a>
        <a href="#">采购管理</a>
        <a>
          <cite>供应商型号手机端</cite></a>
      </span>
        <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right"
           href="/admin/supplierXh" title="刷新"><i class="layui-icon" style="line-height:30px">&#xe669;</i></a>
    </div>
    <div class="x-body">
        <xblock style="display:flex">
            <div class="layui-row">

                <form action="" class="layui-form layui-col-md12 x-so" style="margin: 0;float: left;">
                    {{csrf_field()}}
            <button class="layui-btn audit" data-type="审核" >批量审核</button>
            <button class="layui-btn audit" data-type="弃审" >批量弃审</button>
            <button class="layui-btn copy">复制链接</button>
            <input type="text" name="number" @if(isset($req['number'])) value="{{$req['number']}}" @endif  placeholder="货号" autocomplete="off" class="layui-input">
                    <input type="text" name="supplier_xh" @if(isset($req['supplier_xh'])) value="{{$req['supplier_xh']}}" @endif  placeholder="供应商型号" autocomplete="off" class="layui-input">
                    <button class="layui-btn"  lay-filter="sreach"><i class="layui-icon">&#xe615;</i></button>
           </form>
        </xblock>
        <div>
        <table class="layui-table" style="margin-top:80px">
            <thead>
            <tr>
                <th>
                    <input type="checkbox" name="selectAll" id="">
                </th>
                <th>货号/供应商型号</th>
                <th>供应商名称/状态</th>
                <th>零购价/采购价</th>
            </thead>
            <tbody id="x-imgs" style="text-align:center">
            @foreach($supplier_xh as $b)
            <tr>
                <input type="hidden" name="id" value="{{$b->id}}">
                    <td style="padding:0;width:30px !important">
                        <input type="checkbox" name="select" id="">
                    </td>
                    <td>
                        <div>{{$b->number}}</div>
                        <div>{{$b->supplier_xh}}</div>
                    </td>
                    <td>
                    <div>{{$b->name}}</div>
                    <div>{{$b->status}}</div>
                    </td>
                    <td>
                    <div>{{$b->sale_price}}</div>
                    <div>{{$b->price}}</div>
                    </td>
            </td>
        </tr>
@endforeach
            </tbody>
        </table>
        <div class="page">
            <div>
                {{$supplier_xh->appends($req)->links()}}
            </div>
        </div>
    </div>`
            $(document.body).html(url)
        }
        layui.use(['laydate', 'element', 'laypage', 'layer','upload'], function () {
            $ = layui.jquery;//jquery
            laydate = layui.laydate;//日期插件
            upload = layui.upload;
            //以上模块根据需要引入

            //执行一个laydate实例
            laydate.render({
                elem: '#start' //指定元素
            });

            //执行一个laydate实例
            laydate.render({
                elem: '#end' //指定元素
            });
            /** 上传规格 */
            upload.render({
                elem: '.importBom' //绑定元素
                ,size: 2000
                ,accept: "file"
                , data: {
                    '_token': $("input[name=_token]").val()
                }
                , url: '/admin/importXh' //上传接口
                , before: function (obj) { //obj参数包含的信息，跟 choose回调完全一致，可参见上文。
                    loadIndex = layer.load(); //上传loading
                }
                , done: function (res, index, upload) {
                    //上传完毕回调
                    layer.close(loadIndex); //关闭加载loading
                    if(res.status == 1) {
                        layer.msg(res.msg, {icon: 6, time: 1000}, function () {

                            location.reload();
                        });
                    } else {
                        layer.alert(res.msg,{icon: 5});
                    }
                }
                , error: function (error, upload) {
                    //请求异常回调
                    console.log(error);
                    layer.close(loadIndex); //关闭加载loading
                }
            });

        });

     $(".audit").click(function(e){
        const type = $(this).data('type');
        let idArr = [...$('input[name=select]:checked').parents('tr').find('input[type=hidden]')].map(item =>{
            return $(item).val()
       })
       const idStr = idArr.join(',')
       $.get(`/admin/doAllSupplier_xh?id=${idStr}&type=${type}`,function (res) {
         if(res.status === 1){
           layer.msg(type+res.msg)
           window.location.reload()
         }
       })
       e.preventDefault();
     })

        $(".amend").click(function (e) {
          let trArr = [];
          [...$('#x-img').find('input[type=checkbox]:checked')].map(item =>{
            trArr.push($(item).parents('tr')[0])
          })
          let numberArr = trArr.map(item => $(item).find('.number').html())
          let ids = trArr.map(item => $(item).find('input[name=id]').val())
          let obj = {}
          for(let i = 0 ; i < numberArr.length ; i++){
            obj[numberArr[i]] = numberArr[i]
          }
          if(Object.getOwnPropertyNames(obj).length > 1){
            // 说明有不同的货号
            layer.alert('请勿勾选不同的货号');
            e.preventDefault();
            return
          }
          $.get(`/admin/getDefaultSupplier?number=${Object.getOwnPropertyNames(obj)[0]}` , function(res){
            let url = ""
            res.data.forEach(item => {
              url += `<option>${item.name}</option>`
            })
            layer.open({
              title:"批量修改默认供应商",
              type:0,
              area:['400px' , '400px'],
              content:`<div>
                        <form class="layui-form-item layui-form">
                            <div class="layui-form">
                                <div class="layui-form-item">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">状态:</label>
                                            <div class="layui-input-inline">
                                                <select name="status" style="display: block" id="gys">
                                                    ${url}
                                                </select>
                                            </div>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>`,
              yes:function(index,layero){
                let value = document.getElementById('gys').value; // select元素的获取值
                $.get(`/admin/doSuppDefault?id=${ids.join(',')}&supplier=${value}`,function(res){
                    layer.msg(res.msg, {icon: 6, time: 1000}, function () {

                        location.reload();
                    });
                })
                layer.close(index)
              }
            })
          })

          e.preventDefault();
        })


        // 复制链接
        $(".copy").click(function (e) {
            e = e || window.event;
            var clipboard = new ClipboardJS(".copy", {
                text: function () {
                    return window.location.href;
                }
            });
            clipboard.on("success", function (e) {
                layer.alert("站点链接已复制成功，请粘贴!" ,{icon:1})
            });

            clipboard.on("error", function (e) {
                layer.alert("此浏览器不支持复制功能，请更换最新版！",{icon:2})
            });
            e.preventDefault(); // 取消默认事件 防止页面重新刷新
        })

        $("input[name=selectAll]").on('click' , function () {
            $("input[name=select]").prop('checked' , $(this).prop('checked'))
        })
        let flags = true
        $("input[name=select]").on('click' , function () {
            let len = $('input[name=select]').length
            for(let i = 0 ; i < len ;i++){
                if($('input[name=select]')[i].checked !== true){
                    flags = false
                    break;
                }else{
                    flags = true
                }
            }
            $("input[name=selectAll]").prop('checked' , flags)
        })
        $("#remove").on('click' , function () {
            let data = []
            for(let i of $("input[name=select]")){
                if(i.checked === true){
                    data.push($(i).parent().parent().find('input[type=hidden]').val())
                }
            }
            let datas = data.join(",")
            $.get(`/admin/delAllSupplier?id=${datas}` , function (res) {
                layer.msg(res.msg)
                window.location.reload()
            })
        })

        /*母件-删除*/
        function normsType_del(id) {
            layer.confirm('确认要删除吗？', function (index) {
                //发异步删除数据
                $.get("/admin/bomDel/" + id, function (res) {

                    // 发异步，把数据提交给php
                    if (res.status == 1) {
                        //发异步把用户状态进行更改
                        layer.msg(res.msg, {icon: 6, time: 1000}, function () {

                            location.reload();
                        });
                    } else {

                        layer.alert(res.msg, {icon: 5});
                    }
                });
            });

        }


    </script>
    <style>
        input[type=checkbox]{
            width: 20px;
            height: 20px;
            border-radius: 2px;
            transition: .1s linear;
            line-height: 16px;
            border: 1px solid #d2d2d2;
            font-size: 12px;
            border-radius: 2px;
            background-color: #fff;
        }
        @media screen and (max-width: 500px) {

            xblock form{
                display: flex;
                flex-wrap: nowrap;
                justify-content: space-evenly;
            }
            xblock form > *{
                flex: 1;

            }
            .layui-btn{
                padding: 0px;
                font-size: 14px;
            }
            .layui-input{
                width: 50px!important;
                margin:0!important;
            }

            .layui-table td{
                padding: 0;
            }

        }
    </style>
@endsection