baoshi-was/resources/views/store/handInStorage/inventoryInfo.blade.php

@extends('layouts.app')
@section('title')手持入库-库存查询@endsection

@section('content')
    <div class="d-none" id="container">
        <div class="card offset-md-3 col-md-6">
            <div class="card-header text-center bg-transparent" id="header_title">
                <span class="font-weight-bold h3">库存查询</span>
            </div>
            <div >
                <div class="offset-1 mt-2">
                    <span class="font-weight-bold h5">库位/货主/条码:</span><br>
                    <p class="small font-weight-light">可输入商品条码,库位,货主编号(如:YOUWU)_查询</p>
                    <div class="form-group row mt-2">
                        <label for="location"></label>
                        <input type="text" class="form-control col-8" id="location" autocomplete="off"
                               :class="errors.location ? 'is-invalid' : ''" v-model="info.location">
                        <span class="ml-2">
                             <button type="button" id="select" class="btn btn-info font-weight-bold" @click="getInventoryInfos()">查询</button>
                        </span>
                        <span class="invalid-feedback" role="alert" v-if="errors.location">
                            <strong>@{{ errors.location[0] }}</strong>
                        </span>
                    </div>
                </div>
                <div style="overflow: auto;overflow-x: hidden" id="cardTable">
                    <table class="table-sm table-striped table-bordered table-hover mb-3" style="background: rgb(255, 255, 255);" v-if="invs.length>0">
                    <tr v-for="(invLot,i) in invs" @click="selectTrOne(i)" :class="selectTr===i+1?'focusing' : ''">
                        <td style="filter:grayscale(30%);">
                            <div>
                                <div style="transform:scale(1)" class="pl-0">
                                        <span v-if="invLot.customerid">
                                            <span class="text-black">货主:</span>
                                            <span class="text-black font-weight-bold">@{{ invLot.customerid }}</span>
                                        </span>
                                    <span v-if="invLot.sku">
                                            <span class="text-black">SKU:</span>
                                            <span class="text-black font-weight-bold">@{{ invLot.sku }}</span>
                                    </span>
                                    <span v-if="invLot.alternate_sku1">
                                            <span class="text-black">条码:</span>
                                            <span class="text-danger">@{{ invLot.alternate_sku1 }}</span></span>
                                    <span v-if="invLot.locationid">
                                            <span>库位:</span>
                                            <span class="font-weight-bold">@{{ invLot.locationid }} </span>
                                        </span>
                                    <span v-if="invLot.qty">
                                            <span class="text-lowercase">数量:</span>
                                            <span class="text-lowercase font-weight-bold">@{{ invLot.qty }} </span><span>&nbsp;&nbsp;</span>
                                        </span>
                                    <span v-if="invLot.lotatt01">
                                            <span class="text-black">生产日期:</span><span class="text-black font-weight-bold">@{{ invLot.lotatt01 }}</span>
                                            <span>&nbsp;&nbsp;</span>
                                        </span>
                                    <span v-if="invLot.lotatt02">
                                            <span class="text-black">失效日期:</span><span class="text-black font-weight-bold">@{{ invLot.lotatt02 }}</span>
                                            <span>&nbsp;&nbsp;</span>
                                        </span>
                                    <span v-if="invLot.lotatt03">
                                            <span class="text-black">入库日期:</span><span class="text-black font-weight-bold">@{{ invLot.lotatt03 }}</span>
                                            <span>&nbsp;&nbsp;</span>
                                        </span>
                                    <span v-if="invLot.lotatt04">
                                            <span class="text-black">批号:</span><span class="text-black font-weight-bold">@{{ invLot.lotatt04 }}</span>
                                            <span>&nbsp;&nbsp;</span>
                                        </span>
                                    <span v-if="invLot.lotatt05">
                                            <span class="text-black">属性仓:</span><span class="text-black font-weight-bold">@{{ invLot.lotatt05 }}</span>
                                            <span>&nbsp;&nbsp;</span>
                                        </span>
                                    <span v-if="invLot.lotatt08">
                                            <span class="text-black">质量状态:</span><span class="text-black font-weight-bold">@{{ invLot.lotatt08 }}</span>
                                            <span>&nbsp;&nbsp;</span>
                                        </span>
                                </div>
                            </div>
                        </td>
                    </tr>
                    </table>
                </div>
            </div>
        </div>
    </div>
@stop

@section('lastScript')
    <script type="text/javascript">
        new Vue({
            el:"#container",
            data:{
                height:0,//屏幕高度
                info:{},
                errors:{},
                invs:[],
                selectTr:'',
                isAndroid:false,
            },
            mounted(){
                if (navigator.userAgent.indexOf("Android")!==-1)this.isAndroid = true;
                this.pageInit();
                $("#container").removeClass("d-none");
                this.height=window.screen.availHeight;
                document.getElementById('cardTable').style.height=this.height*0.50+'px';
                $('#location').trigger("click").focus();
            },
            methods:{
                //页面初始化
                pageInit(){
                    if (!this.isAndroid)return;
                    let element = document.getElementById("navbarSupportedContent").parentElement;
                    element.className = "row";
                    element.children[0].className += " col-5";
                    element.innerHTML = element.children[0].outerHTML;
                    let e1 = document.getElementById("menu");
                    let e2 = document.getElementById("demand-div");
                    if (e1)e1.remove();
                    if (e2)e2.remove();
                    document.getElementById('app').firstElementChild.style.display = 'none';
                },
                selectTrOne(i){
                    if (this.selectTr===i+1){
                        this.selectTr=0
                    }else {
                        this.selectTr=i+1;
                    }
                },
                getInventoryInfos(){
                    let error = {};
                    if (!this.info.location)error.location = ["库位/货主/条码必填"];
                    if (JSON.stringify(error)!=='{}'){this.errors = error;return;}
                    let url = '{{url('store/handInStorage/getInventoryInfos')}}';
                    window.axios.post(url,{location:this.info.location})
                        .then(res=>{
                            if (res.data.success){
                                this.invs=res.data.data;
                                this.$forceUpdate()
                                return;
                            }
                            window.tempTip.setDuration(2000);
                            window.tempTip.show(res.data.data);
                            window.tempTip.showErrorAudio();
                        }).catch(err=>{
                        window.tempTip.setDuration(2000);
                        window.tempTip.show("网络错误："+err);
                        window.tempTip.showErrorAudio();
                    })
                },
            },
        });
    </script>
@stop