@extends('layouts.app')
@section('title')盘点-任务@endsection


@section('content')
    @component('inventory.stockInventory.menu')@endcomponent
    <div id="list" class="container-fluid" style="min-width: 1500px">
        <div id="form_div"></div>
        <span class="dropdown">
        <button class="btn btn-outline-dark btn-sm form-control-sm dropdown-toggle tooltipTarget" :class="[checkData.length>0?'btn-dark text-light':'']"
                data-toggle="dropdown" title="导出所有页将会以搜索条件得到的过滤结果，将其全部记录（每一页）导出">
            导出Excel
        </button>
        <div class="dropdown-menu">
            <a class="dropdown-item" @click="inventoryExport(false)" href="javascript:">导出勾选内容</a>
            <a class="dropdown-item" @click="inventoryExport(true)" href="javascript:">导出所有页</a>
        </div>
    </span>
        @can('库存管理-盘点')
            <span v-if="formData.date_start&&formData.date_end" class="btn btn-sm  btn-outline-secondary tooltipTarget" @click="createInventoryMission" title="选择单一指定货主生成盘点任务">生成动盘任务</span>
            <span v-else class="btn btn-sm btn-outline-secondary  tooltipTarget" @click="createInventoryMission" title="选择单一指定货主生成盘点任务">生成全盘任务</span>
        @endcan
        <table class="table table-sm table-striped table-bordered table-hover text-nowrap card-body mt-2">
            <tr>
                <th>
                    <label for="all">
                        <input id="all" type="checkbox" @click="checkAll($event)">全选
                    </label>
                </th>
                <th>操作</th>
                <th>序号</th>
                <th>盘点单号</th>
                <th>创建时间</th>
                <th>货主</th>
                <th>任务类型</th>
                <th>起始时间</th>
                <th>结束时间</th>
                <th>记录数</th>
                <th>已盘点数</th>
                <th>剩余数</th>
                <th>复盘差异</th>
                <th>复盘归位</th>
                <th>操作</th>
            </tr>
            <tr v-for="(inventory,i) in inventories" @click="selectedColor(inventory.id)" :style="{'font-weight': inventory.id==selectedStyle?'bold':''}">
                <td>
                    <input class="checkItem" type="checkbox" :value="inventory.id" v-model="checkData">
                </td>
                <td>
                    <span class="btn  btn-sm btn-outline-info" @click="enterStockInventory(inventory.id)">进入</span>
                </td>
                <td >@{{ i+1 }}</td>
                <td >@{{ inventory.id }}</td>
                <td >@{{ inventory.created_at }}</td>
                <td ><span v-if="inventory.owner">@{{ inventory.owner.name }}</span></td>
                <td >@{{ inventory.type }}</td>
                <td >@{{ inventory.start_at }}</td>
                <td class="text-muted">@{{ inventory.end_at }}</td>
                <td >@{{ inventory.total }}</td>
                <td >@{{ inventory.processed }}</td>
                <td >@{{ inventory.surplus }}</td>
                <td>@{{ inventory.difference }}</td>
                <td>@{{ inventory.returned }}</td>
                <td>
                    <span class="btn  btn-sm btn-outline-danger" @click="deleteStockInventoryMission(inventory.id)">删除</span>
                </td>
            </tr>
        </table>
        <div class="text-info h5 btn btn">{{$inventories->count()}}/@{{ sum }}</div>
        <div>{{$inventories->appends($paginateParams)->links()}}</div>
    </div>

@endsection

@section('lastScript')
    <script type="text/javascript" src="{{asset('js/queryForm/export200818a.js')}}"></script>
    <script type="text/javascript" src="{{asset('js/queryForm/queryForm200805b.js')}}"></script>
    <script>
        new Vue({
            el: "#list",
            data: {
                inventories:{!! $inventories->toJson()!!}['data'],
                owners: [
                        @foreach($owners as $owner)
                    {
                        name: '{{$owner->id}}', value: '{{$owner->name}}'
                    },
                    @endforeach
                ],
                checkData: [],
                selectedStyle:'',
                sum:{!! $inventories->total() !!},
                formData:{},
            },
            mounted: function () {
                $(".tooltipTarget").tooltip({'trigger': 'hover'});
                $("#list").removeClass('d-none');
                let data=[
                    [
                        {name:'owner_id',type:'select_multiple_select',tip:['输入关键词快速定位下拉列表，回车确定','选择要显示的客户'],
                            placeholder:['货主','定位或多选货主'],data:this.owners},
                        {name:'date_start',type:'dateTime',tip:'选择创建日期的开始时间',},
                        {name:'date_end',type:'dateTime',tip:'选择创建日期的结束时间',},
                    ],
                ];
                this.form = new query({
                    el:'#form_div',
                    condition:data,
                });
                this.form.init();
                let obj=this.form.getSearchData();
                this.formData=obj;
            },
            methods:{
                selectedColor(id){
                    if (id==this.selectedStyle){
                        this.selectedStyle='';
                        return;
                    }
                    this.selectedStyle=id;
                },
                checkAll(e){
                    if (e.target.checked){
                        this.inventories.forEach((el,i)=>{
                            if (this.checkData.indexOf(el.id) == '-1'){
                                this.checkData.push(el.id);
                            }
                        });
                    }else {
                        this.checkData = [];
                    }
                },
                inventoryExport(checkAllSign){
                    let url = '{{url('inventory/stockInventoryExport')}}';
                    let token='{{ csrf_token() }}';
                    excelExport(checkAllSign,this.checkData,url,this.sum,token);
                },
                //生成盘点任务
                createInventoryMission(){
                    let _this=this;
                    if (_this.formData.owner_id.length<=0){
                        tempTip.setDuration(1000);
                        tempTip.show('生成盘点任务失败'+'   '+'请先选择货主！');
                        return;
                    }
                    let url='{{url('inventory/stockInventory/createStockInventoryMission')}}';
                    axios.post(url,{formData:_this.formData}).then(function (response) {
                            if(!response.data.success){
                                tempTip.setDuration(1000);
                                tempTip.show('生成盘点任务失败'+'   '+response.data.data);
                                return;
                            }else{
                                let inventory=response.data.data;
                                _this.inventories.push(inventory);
                                tempTip.setDuration(2000);
                                tempTip.showSuccess('生成盘点任务成功!');
                            }
                        })
                        .catch(function (err) {
                            tempTip.setDuration(3000);
                            tempTip.show('生成盘点任务失败!'+'网络错误：' + err);
                        });
                },
                //进入盘点中页面  或者复盘页面
                enterStockInventory(id){
                        location.href='{{url('inventory/stockInventory/enterStockInventory')}}/'+id;
                },
                //删除盘点任务
                deleteStockInventoryMission(id){
                    if(!confirm('确定要删除盘点单号为：“'+id+'”的运单吗？')){return};
                    let url = '{{url('inventory/deleteStockInventoryMission')}}/'+id;
                    axios.delete(url).then(
                        function (response) {
                            if(!response.data.success){
                                tempTip.setDuration(3000);
                                tempTip.show('盘点单号:'+id+'删除失败!');
                            }else {
                                tempTip.setDuration(3000);
                                tempTip.showSuccess('盘点单号:'+id+'删除成功!');
                                setInterval(function () {
                                    window.location.reload();
                                },1000)
                            }
                        }
                    ).catch(function (err) {
                        tempTip.setDuration(3000);
                        tempTip.show('删除失败,网络链接错误！'+err);
                    });
                },
            }
        });
    </script>
@endsection