baoshi-was/resources/views/process/create.blade.php

@extends('layouts.app')
@section('title')录入二次加工单@endsection
@section('content')
    <div id="nav2">
        @component('process.menu')
            @if($process)
            <li class="nav-item">
                <a class="nav-link" href="{{URL::current()}}" :class="{active:isActive('edit',3)}">修改</a>
            </li>
            @endif
        @endcomponent
    </div>
    <div class="container-fluid d-none" id="list">
        <div class="card col-md-8 offset-md-2">
            <div class="card-body">
                <div class="modal fade" id="pasteData" tabindex="-1" role="dialog" aria-labelledby="pasteDataTitle" aria-hidden="true">
                    <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
                        <div class="modal-content">
                            <div class="modal-header">
                                <div class="row modal-title font-weight-bold w-100 text-nowrap ml-1 noselect" id="pasteDataTitle">
                                    <span v-for="(row,i) in rows" draggable="true"
                                          @drop="drop($event,i)" @dragover="dragover($event)" @dragstart="dragstart($event,i)"
                                          :class="row=='货主' || row=='单据' || row=='品名' || row=='数量' || row=='SKU' ? 'text-danger' : ''"
                                          class="col-2 border" style="cursor: move">@{{ row }}</span>
                                </div>
                            </div>
                            <div class="modal-body" style="text-align:center">
                                <button type="button" id="popover" class="btn btn-danger"
                                        data-container="body" data-toggle="popover" data-placement="bottom"
                                        :data-content="popoverContent" data-html="true">
                                    部分数据导入失败
                                </button>
                                <textarea class="w-100" style="height: 400px;" id="pasteDataText" v-model="pasteData" @keydown.tab="forbidTab($event)" @keyup.tab="replaceSpacing()"
                                placeholder="内容可为EXCEL复制,也可手动输入使用“TAB”缩进符区分列，请注意表头顺序,可拖拽表头字段调整顺序，以该顺序为准"
                                ></textarea>
                            </div>
                            <div class="modal-footer">
                                <button class="btn btn-dark" @click="importPasteData()">开始导入</button>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-6  rounded mb-2 border" style="background: #efe3d9;">
                        <div class="form-group row mt-2" v-if="!is_hide">
                            <label class="col-2 text-right mt-2">原料单据</label>
                            <input class="form-control col-6" v-model="process.wms_code">&nbsp;&nbsp;&nbsp;
                            <button class="btn btn-info btn-sm col-2"  type="button" @click="addProcessContent(false)"> 新增库单据</button>
                            <button class="btn btn-sm btn-dark col-1 ml-1"
                                    @click="showPasteDataModal()"><small>外部导入</small></button>
                        </div>
                        <div class="form-group row" v-if="!is_hide">
                            <div class="col-10 offset-1 pl-0 pt-2 border rounded bg-light">
                                <div class="row pt-2 small"><label class="col-3 text-right" >单据号</label>
                                    <b class="col-8" v-if="processContents.length>0 && processContents[0].addBtnShow && !processContents[0].type">@{{ processContents[0].wms_code }}</b></div> <!---->
                                <div class="row pt-2" v-if="processContents.length>0 && processContents[0].addBtnShow && !processContents[0].type">
                                    <span class="col-12 text-center text-muted small">双击选择商品:
                                        <button class="btn btn-sm btn-outline-info ml-1 mt-0" style="transform: scale(0.8)"
                                            @click="addAll(processContents[0])"
                                            >添加所有</button>
                                    </span>
                                    <span class=" col-11 offset-1 input-group" style=" border-radius: 5px; opacity: 1.5; text-align: center;">
                                        <ul onselectstart="return false;" class="list-group tooltipTarget" style="width: 100%; max-height: 130px; overflow-y: scroll;">
                                            <li  v-for="commodity in processContents[0].commodities" :id="commodity.id"  :style="[{'background-color':processContents[0].commodity_id==commodity.id ? '#9fcdff':'' },{'text-decoration':commodityIds.includes(process.wms_code+'_'+commodity.id+'_false')? 'line-through red' : ''}]"
                                                @dblclick="selectedCommodity(commodity,processContents[0].wms_code,false)" class="list-group-item list-group-item-action p-0 m-0">
                                                <div class="form-inline" style="cursor: default; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;">
                                                    <small :title="commodity.name" class="text-left text-primary col-6 tooltipTarget"  style="overflow: hidden;">@{{ commodity.name }}</small>
                                                    <small class="text-left  col-6"><span v-for="barcode in commodity.barcodes">@{{ barcode.code }}&nbsp;&nbsp;&nbsp;</span></small>
                                                </div>
                                            </li>
                                        </ul>
                                    </span>
                                </div>
                                <div class="row pt-2 small"><label class="col-3  text-right">商品名</label>
                                    <input v-if="processContents.length>0 && processContents[0].addBtnShow && !processContents[0].type" class="form-control form-control-sm col-8" @change="update_commodity_name(processContents[0])" v-model="processContents[0].commodity_name">
                                </div>
                                <div class="row pt-2 small"><label class="col-3  text-right">条码</label>
                                    <input v-if="processContents.length>0 && processContents[0].addBtnShow && !processContents[0].type" class="form-control form-control-sm col-8" @change="update_commodity_barcode(processContents[0],$event)" :value="processContents[0].commodity_barcode ? processContents[0].commodity_barcode :
                                    (processContents[0].commodity_barcodes[0] ? processContents[0].commodity_barcodes[0].code :'')">
                                </div>
                                <div class="row pt-2 small"><label class="col-3  text-right">SKU</label>
                                    <input v-if="processContents.length>0 && processContents[0].addBtnShow && !processContents[0].type" class="form-control form-control-sm col-8" @change="update_commodity_sku(processContents[0])" v-model="processContents[0].commodity_sku">
                                </div>
                                <div class="row pt-2 small"><label class="col-3  text-right">单据类型</label>
                                    <select v-if="processContents.length>0 && processContents[0].addBtnShow && !processContents[0].type"
                                            v-model="processContents[0].bill_type"  class="col-8 form-control form-control-sm">
                                        <option value="移库单">移库单</option>
                                        <option value="入库单">入库单</option>
                                        <option value="出库单">出库单</option>
                                    </select></div>
                                <div class="row pt-2 small"><label class="col-3  text-right">数量</label>
                                    <input v-if="processContents.length>0 && processContents[0].addBtnShow && !processContents[0].type" v-model="processContents[0].amount" type="text" class="form-control form-control-sm col-8">
                                </div>
                                <div class="col-8 offset-2 pt-2 pb-2">
                                    <input type="button" v-if="processContents.length>0 && processContents[0].addBtnShow && !processContents[0].type"
                                           @click="confirmStore(processContents[0].wms_code,processContents[0].commodity_id,processContents[0].amount,processContents[0].bill_type,false)"
                                           value="确定新增" class="btn btn-primary btn-sm form-control form-control-sm">
                                </div>
                                <div class="col-8 offset-2 pt-2 pb-2">
                                    <input v-if="processContents.length>0 && processContents[0].addBtnShow && !processContents[0].type" type="button" @click="deleteProcessContent(processContents[0].wms_code,processContents[0].commodity_id,false,0)" value="删除" class="btn btn-danger form-control">
                                </div>
                            </div>
                        </div>
                        <div class="form-group row">
                            <div class="col-10 offset-1 p-1 border rounded bg-light" v-for="processContent in processContents" v-if="!processContent.addBtnShow && !processContent.type">
                                <div class="col-12">
                                    <div class="row small" style="opacity: 0.7"  :style="{'background-color' : (processContent.asnstatus == '部分收货') ? '#fde300' : ((processContent.asnstatus == '订单创建') ? 'red' : 'white')}"
                                         @mouseover="update_delBtn(true,processContent.wms_code,processContent.commodity_id,false)" @mouseleave="update_delBtn(false,processContent.wms_code,processContent.commodity_id,false)">
                                        <span class="font-weight-bold">单据号：</span>
                                        <span class="font-weight-bold">@{{ processContent.wms_code }}</span>
                                        <span class="ml-2 text-muted">单据类型：</span>
                                        <span class=" text-muted">@{{ processContent.bill_type }}</span>
                                        <span class="ml-2 font-weight-bold">商品名：</span>
                                        <span class="font-weight-bold">
                                            <span v-if="processContent.sign_commodity_name_mark">@{{ processContent.sign_commodity_name_mark }}</span>
                                            <span v-else>@{{ processContent.commodity_name }}</span>
                                        </span>
                                        <span class="ml-2 text-muted">SKU：</span>
                                        <span class=" text-muted">
                                            <span v-if="processContent.sign_commodity_sku_mark">@{{ processContent.sign_commodity_sku_mark }}</span>
                                            <span v-else>@{{ processContent.commodity_sku }}</span>
                                        </span>
                                        <span class="ml-2 font-weight-bold"> 数量：</span>
                                        <span class="font-weight-bold">@{{ processContent.amount }}</span>
                                        <span class="ml-2 font-weight-bold text-success" v-if="processContent.former_amount">原有数量：</span>
                                        <span class="font-weight-bold text-success" v-if="processContent.former_amount">@{{ processContent.former_amount }}</span>
                                        <span class="ml-2 text-muted">条码：</span>
                                        <span class="text-muted">
                                            <span v-if="processContent.sign_commodity_barcode_mark">@{{ processContent.sign_commodity_barcode_mark }}</span>
                                            <span v-else>
                                                <small v-if="processContent.commodity_barcode"> @{{ processContent.commodity_barcode }}</small>
                                                <small v-if="processContent.commodity_barcodes && processContent.commodity_barcodes.length>0 && !processContent.commodity_barcode"
                                                                            v-for="barcode in processContent.commodity_barcodes">@{{ barcode.code }}</small>
                                            </span>
                                        </span>
                                        <button v-if="is_delBtn[processContent.wms_code+'_'+processContent.commodity_id+'_'+false]" @click="deleteProcessContent(processContent.wms_code,processContent.commodity_id,false,processContent.amount)" class="btn btn-sm btn-danger" style="position: absolute;right: 0;bottom: 0">删除</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-6 rounded mb-2 border" style="background: #ccd7dc;">
                        <div class="form-group row mt-2">
                            <label class="col-2 text-right mt-2">成品单据</label>
                            <input class="form-control col-6" v-model="process.wms_code_full">&nbsp;&nbsp;&nbsp;
                            <button class="btn btn-info btn-sm col-2"  type="button" @click="addProcessContent(true)"> 新增库单据</button>
                            <button class="btn btn-sm btn-dark col-1 ml-1"
                                    @click="showPasteDataModal(true)"><small>外部导入</small></button>
                        </div>
                        <div class="form-group row">
                            <div class="col-10 offset-1 pl-0 pt-2 border rounded bg-light">
                                <div class="row pt-2 small"><label class="col-3 text-right" >单据号</label>
                                    <b class="col-8" v-if="processContents.length>0 && processContents[0].addBtnShow && processContents[0].type">@{{ processContents[0].wms_code }}</b></div> <!---->
                                <div class="row pt-2" v-if="processContents.length>0 && processContents[0].addBtnShow && processContents[0].type">
                                    <span class="col-12 text-center text-muted small">双击选择商品:
                                        <button class="btn btn-sm btn-outline-info ml-1 mt-0" style="transform: scale(0.8)"
                                                @click="finishedProductAddAll(processContents[0])"
                                        >添加所有</button>
                                    </span>
                                    <span class=" col-11 offset-1 input-group" style=" border-radius: 5px; opacity: 1.5; text-align: center;">
                                        <ul onselectstart="return false;" class="list-group tooltipTarget" style="width: 100%; max-height: 130px; overflow-y: scroll;">
                                            <li  v-for="commodity in processContents[0].commodities" :id="commodity.id" :style="[{'background-color':processContents[0].commodity_id==commodity.id ? '#9fcdff':'' },{'text-decoration':commodityIds.includes(process.wms_code_full+'_'+commodity.id+'_true')? 'line-through red' : ''}]"
                                                 @dblclick="selectedCommodity(commodity,processContents[0].wms_code,true)" class="list-group-item list-group-item-action p-0 m-0">
                                                <div class="form-inline" style="cursor: default; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;">
                                                    <small :title="commodity.name" class="text-left text-info col-6" style="overflow: hidden;">@{{ commodity.name }}</small>
                                                    <small class="text-left  col-6"><a v-for="barcode in commodity.barcodes">@{{ barcode.code }}&nbsp;&nbsp;&nbsp;</a></small>
                                                </div>
                                            </li>
                                        </ul>
                                    </span>
                                </div>
                                <div class="row pt-2 small"><label class="col-3  text-right">商品名</label>
                                    <input v-if="processContents.length>0 && processContents[0].addBtnShow && processContents[0].type" class="form-control form-control-sm col-8" @change="update_commodity_name(processContents[0])" v-model="processContents[0].commodity_name">
                                </div>
                                <div class="row pt-2 small"><label class="col-3  text-right">条码</label>
                                    <input v-if="processContents.length>0 && processContents[0].addBtnShow && processContents[0].type" class="form-control form-control-sm col-8" @change="update_commodity_barcode(processContents[0],$event)" :value="processContents[0].commodity_barcode ? processContents[0].commodity_barcode :
                                        (processContents[0].commodity_barcodes[0] ? processContents[0].commodity_barcodes[0].code :'')">
                                </div>
                                <div class="row pt-2 small"><label class="col-3  text-right">SKU</label>
                                    <input v-if="processContents.length>0 && processContents[0].addBtnShow && processContents[0].type" class="form-control form-control-sm col-8" @change="update_commodity_sku(processContents[0])" v-model="processContents[0].commodity_sku">
                                </div>
                                <div class="row pt-2 small"><label class="col-3  text-right">单据类型</label>
                                    <select v-if="processContents.length>0 && processContents[0].addBtnShow && processContents[0].type"
                                            v-model="processContents[0].bill_type"  class="col-8 form-control form-control-sm">
                                        <option value="移库单">移库单</option>
                                        <option value="入库单">入库单</option>
                                        <option value="出库单">出库单</option>
                                    </select></div>
                                <div class="row pt-2 small"><label class="col-3  text-right">数量</label>
                                    <input v-if="processContents.length>0 && processContents[0].addBtnShow && processContents[0].type" v-model="processContents[0].amount" type="text" class="form-control form-control-sm col-8">
                                </div>
                                <div class="col-8 offset-2 pt-2 pb-2">
                                    <input type="button" v-if="processContents.length>0 && processContents[0].addBtnShow && processContents[0].type"
                                           @click="confirmStore(processContents[0].wms_code,processContents[0].commodity_id,processContents[0].amount,processContents[0].bill_type,true)"
                                           value="确定新增" class="btn btn-primary btn-sm form-control form-control-sm">
                                </div>
                                <div class="col-8 offset-2 pt-2 pb-2">
                                    <input v-if="processContents.length>0 && processContents[0].addBtnShow && processContents[0].type" type="button" @click="deleteProcessContent(processContents[0].wms_code,processContents[0].commodity_id,true,0)" value="删除" class="btn btn-danger form-control">
                                </div>
                            </div>
                        </div>
                        <div class="form-group row">
                            <div class="col-10 offset-1 p-1 border rounded bg-light" v-for="processContent in processContents" v-if="!processContent.addBtnShow && processContent.type">
                                <div class="col-12 border">
                                    <div class="row small" style="opacity: 0.7"  :style="{'background-color' : (processContent.asnstatus == '部分收货') ? '#fde300' : ((processContent.asnstatus == '订单创建') ? 'red' : 'white')}"
                                         @mouseover="update_delBtn(true,processContent.wms_code,processContent.commodity_id,true)" @mouseleave="update_delBtn(false,processContent.wms_code,processContent.commodity_id,true)">
                                        <span class="font-weight-bold">单据号：</span>
                                        <span class="font-weight-bold">@{{ processContent.wms_code }}</span>
                                        <span class="ml-2 text-muted">单据类型：</span>
                                        <span class=" text-muted">@{{ processContent.bill_type }}</span>
                                        <span class="ml-2 font-weight-bold">商品名：</span>
                                        <span class="font-weight-bold">
                                            <span v-if="processContent.sign_commodity_name_mark">@{{ processContent.sign_commodity_name_mark }}</span>
                                            <span v-else>@{{ processContent.commodity_name }}</span>
                                        </span>
                                        <span class="ml-2 text-muted">SKU：</span>
                                        <span class=" text-muted">
                                            <span v-if="processContent.sign_commodity_sku_mark">@{{ processContent.sign_commodity_sku_mark }}</span>
                                            <span v-else>@{{ processContent.commodity_sku }}</span>
                                        </span>
                                        <span class="ml-2 font-weight-bold">数量：</span>
                                        <span class="font-weight-bold">@{{ processContent.amount }}</span>
                                        <span class="ml-2 font-weight-bold text-success" v-if="processContent.former_amount">原有数量：</span>
                                        <span class="font-weight-bold text-success" v-if="processContent.former_amount">@{{ processContent.former_amount }}</span>
                                        <span class="ml-2 text-muted">条码：</span>
                                        <span class="text-muted">
                                            <span v-if="processContent.sign_commodity_barcode_mark">@{{ processContent.sign_commodity_barcode_mark }}</span>
                                            <span v-else>
                                                <small v-if="processContent.commodity_barcode"> @{{ processContent.commodity_barcode }}</small>
                                                <small v-if="processContent.commodity_barcodes && processContent.commodity_barcodes.length>0 && !processContent.commodity_barcode"
                                                   v-for="barcode in processContent.commodity_barcodes">@{{ barcode.code }}</small>
                                            </span>
                                        </span>
                                        <button v-if="is_delBtn[processContent.wms_code+'_'+processContent.commodity_id+'_'+true]" @click="deleteProcessContent(processContent.wms_code,processContent.commodity_id,true,processContent.amount)" class="btn btn-sm btn-danger" style="position: absolute;right: 0;bottom: 0">删除</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="form-group row" v-if="process.id">
                    <label class="col-3 col-form-label text-right" >任务号</label>
                    <input disabled :value="process.code" class="form-control col-8">
                </div>
                <div class="form-group row">
                    <label class="col-3 col-form-label text-right" >货主</label>
                    <input readonly v-if="processContents.length>0" :value="process.owner_name ? process.owner_name : processContents[processContents.length-1].owner_name" class="form-control col-8" :class="error.owner_id && error.owner_id.length>0 ? 'is-invalid' :''">
                    <span v-if="error.owner_id && error.owner_id.length>0" class="invalid-feedback col-8 offset-3 mt-0" role="alert">
                        <strong>@{{ error.owner_id[0] }}</strong>
                    </span>
                </div>
                <div class="form-group row">
                    <label class="col-3 col-form-label text-right" >加工类型</label>
                    <select :disabled="is_hide" v-model="process.process_method_id" class="form-control col-8" :class="error.process_method_id && error.process_method_id.length>0 ? 'is-invalid' :''">
                        <option  v-for="processMethod in processMethods" :value="processMethod.id">@{{ processMethod.name }}</option>
                    </select>
                </div>
                <div class="form-group row">
                    <label class="col-3 col-form-label text-right" >加工数量</label>
                    <input :readonly="is_hide" v-model="process.amount" type="text" :placeholder="'自动计算数量为“' + sum +'”请填写实际数'" class="form-control col-8" :class="error.amount && error.amount.length>0 ? 'is-invalid' :''">
                    <span v-if="error.amount && error.amount.length>0" class="invalid-feedback col-8 offset-3 mt-0" role="alert">
                        <strong>@{{ error.amount[0] }}</strong>
                    </span>
                </div>
                <div class="form-group row">
                    <label class="col-3 col-form-label text-right" >单价</label>
                    <input :readonly="is_hide" v-model="process.unit_price" type="text" class="form-control col-8" :class="error.unit_price && error.unit_price.length>0 ? 'is-invalid' :''">
                    <span v-if="error.unit_price && error.unit_price.length>0" class="invalid-feedback col-8 offset-3 mt-0" role="alert">
                        <strong>@{{ error.unit_price[0] }}</strong>
                    </span>
                </div>
                <div class="form-group row">
                    <label class="col-3 col-form-label text-right" >加工备注(选填)</label>
                    <textarea :readonly="is_hide" v-model="process.remark" type="text" class="form-control col-8"></textarea>
                </div>
                <div class="form-group row">
                    <label class="col-3 col-form-label text-right" >结算备注(选填)</label>
                    <textarea :readonly="is_hide" v-model="process.balance_remark" type="text" class="form-control col-8"></textarea>
                </div>
                {{--<div class="form-group row">
                    <label class="col-3 col-form-label text-right" >引用教程(选填)</label>
                    <span class=" col-8 input-group p-0" style="max-height: 150px; overflow-y: scroll;border-radius:5px;opacity:0.7;text-align: center;">
                        <ul class="list-group" style="width: 100%" onselectstart="return false;">
                            <li v-for="tutorial in tutorials" :data-original-title="tutorial.style ? '双击删除教程' :'双击添加教程'"  :id="tutorial.id" class="tooltipTarget list-group-item list-group-item-action p-0 m-0"
                                @dblclick="selectedTutorial(tutorial)" :class="tutorial.style ? 'active' :''" style="cursor: default;">
                                @{{ tutorial.name }}</li>
                        </ul>
                        <div class="mt-0 form-inline" v-if="processContents.length>0">
                            <button type="button" @click="addTutorial()"  class="btn btn-sm btn-outline-primary">新增教程</button>
                            <button type="button" @click="refreshTutorial()" class="btn btn-sm btn-outline-secondary ml-2">刷新</button>
                        </div>
                    </span>
                </div>--}}
                <div class="form-group row">
                    <div class="col-8 offset-3 p-0">
                        <input type="button" @click="submit()" class="btn btn-success form-control" value="提交">
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('lastScript')
    <script>
        let vueList=new Vue({
            el:'#list',
            data:{
                process:{id:'{{old('id')??($process->id??'')}}',code:'{{old('code')??($process->code??'')}}',
                    wms_code:'',owner_id:'{{old('owner_id')??($process->owner_id??'')}}',
                    amount:'{{old('amount')??($process->amount??'')}}',owner_name:'{{old('owner_name')??($process->owner_name??'')}}',
                    process_method_id:'{{old('process_method_id')??($process->process_method_id??'')}}',
                    unit_price:'{{old('unit_price')??($process->unit_price??'')}}',remark:'{{preg_replace("/\s/",' ',old('remark')??($process->remark??''))}}',
                    balance_remark:'{{preg_replace("/\s/",' ',old('remark')??($process->balance_remark??''))}}',
                    wms_code_full:'',status:'{{$process->status??''}}'},
                error:{wms_code:[],owner_id:[],process_method_id:[],unit_price:[],amount:[]},
                processContents:[
                    @if($process)
                        @foreach($process->processesContents as $processesContent)
                        {id:'{{$processesContent->id}}',wms_code:'{{$processesContent->wms_code}}',commodity_name:'{{$processesContent->commodity?$processesContent->commodity->name:""}}',@if($processesContent->commodity) commodity_barcodes:{!! $processesContent->commodity->barcodes !!},@endif
                            commodity_id:'{{$processesContent->commodity_id}}',commodity_sku:'{{$processesContent->commodity?$processesContent->commodity->sku:""}}',bill_type:'{{$processesContent->bill_type}}',amount:'{{$processesContent->amount}}',
                            addBtnShow:false,type:'{{$processesContent->type}}',
                            sign_commodity_name_mark:'{{$processesContent->sign_commodity_name_mark}}',
                            sign_commodity_sku_mark:'{{$processesContent->sign_commodity_sku_mark}}',
                            sign_commodity_barcode_mark:'{{$processesContent->sign_commodity_barcode_mark}}'},
                        @endforeach
                    @endif
                ],
                processMethods:[
                    @foreach($processMethods as $processMethod)
                    {!! $processMethod !!},
                    @endforeach
                ],
                //tutorials:[],
                selectedTutorials:[],
                msg:false,
                commodityIds:[],
                is_delBtn:[],
                sum:0,
                pasteData:'',
                pasteDataType:false,
                rows:['货主','单据号','品名','SKU','条码','数量'],
                popoverContent:'',
                is_hide:false,
            },
            watch:{
                processContents:{
                    handler(){
                        if (this.processContents.length===1 && this.processContents[(this.processContents.length)-1].owner_id){
                            this.process.owner_id=this.processContents[(this.processContents.length)-1].owner_id;
                            //this.getTutorial(this.processContents[(this.processContents.length)-1].owner_id);
                        }
                    }
                },
            },
            mounted:function(){
                if (this.process.status==='加工中' || this.process.status==='待加工')this.is_hide=true;
                $(".tooltipTarget").tooltip({'trigger':'hover'});
                $("#list").removeClass('d-none');
                let _this=this;
                if (_this.processContents.length > 0){
                    _this.processContents.forEach(function (processContent) {
                        processContent.type=processContent.type==='成品单';
                        if (!processContent.addBtnShow) {
                            _this._addSignCommodity(processContent.wms_code,processContent.commodity_id,processContent.type);
                        }
                    });
                }
            },
            methods:{
                //添加标记商品
                _addSignCommodity(wms_code,commodity_id,is_finished_product){
                    this.commodityIds.push(wms_code+"_"+commodity_id+"_"+is_finished_product);
                },
                //删除标记商品
                _removeSignCommodity(wms_code,commodity_id,is_finished_product){
                    this.commodityIds.splice(this.commodityIds.indexOf(wms_code+"_"+commodity_id+"_"+is_finished_product),1);
                },
                //寻找标记商品
                _seekSignCommodity(wms_code,commodity_id,is_finished_product){
                    return this.commodityIds.includes(wms_code+"_"+commodity_id+"_"+is_finished_product);
                },
                //新增库单据
                addProcessContent(type){
                    let _this=this;
                    let wms_code=_this.process.wms_code;
                    if (type) wms_code=_this.process.wms_code_full;
                    if (!wms_code){
                        tempTip.setDuration(3000);
                        tempTip.show('未输入单据号！');
                        return;
                    }
                    if (_this.processContents.length>0 && _this.processContents[_this.processContents.length-1].addBtnShow) {
                        tempTip.setDuration(4000);
                        tempTip.show('请先确定或删除操作中单据！');
                        return;
                    }
                    if (_this.msg){
                        tempTip.setDuration(999999);
                        tempTip.waitingTip("数据读取中......请稍后！");
                        return;
                    }
                    _this.msg=true;
                    axios.post('{{url("api/thirdPart/flux/process/getProcessContent")}}',{wms_code:wms_code,is_finished_product:type})
                        .then(function (response) {
                            if (_this.msg)_this.msg=false;
                            tempTip.cancelWaitingTip();
                            tempTip.setDuration(3000);
                            if (response.data.error){
                                tempTip.setDuration(3000);
                                tempTip.show(response.data.error);
                                return;
                            }
                            let processContent={};
                            processContent['wms_code']=response.data.wms_code;
                            processContent['owner_name']=response.data.owner_name;
                            processContent['owner_id']=response.data.owner_id;
                            processContent['commodities']=response.data.commodities;
                            processContent['commodity_id']='';
                            processContent['commodity_name']='';
                            processContent['commodity_barcodes']=[];
                            processContent['commodity_sku']='';
                            processContent['bill_type']=response.data.bill_type;
                            processContent['amount']='';
                            processContent['former_amount']='';
                            processContent['lineNo']='';
                            processContent['addBtnShow']=true;
                            processContent['type']=type;
                            processContent['asnstatus'] = response.data.asnstatus;
                            _this.processContents.unshift(processContent);
                        }).catch(function (err) {
                        if (_this.msg)_this.msg=false;
                            tempTip.cancelWaitingTip();
                            tempTip.setDuration(3000);
                            tempTip.show('查询单据号失败！网络错误：'+err);
                        });
                },
                //确定新增
                confirmStore(wms_code,commodity_id,amount,bill_type,type){
                    if (!commodity_id) {
                        tempTip.setDuration(2000);
                        tempTip.show("尚未选择商品！");
                        return;
                    }
                    if (!amount) {
                        tempTip.setDuration(2000);
                        tempTip.show("尚未填写数量！");
                        return;
                    }
                    if (isNaN(amount)) {
                        tempTip.setDuration(2000);
                        tempTip.show("数量必须为数字！");
                        return;
                    }
                    let _this=this;
                    let sign=true;
                    let is_return=false;
                    let processContentTemp={};
                    if (!type)_this.sum+= Number(amount);
                    _this.processContents.some(function (processContent) {
                        if (processContent.wms_code==wms_code && processContent.commodity_id==commodity_id && processContent.type==type) {
                            /*processContent.commodities.every(function (commodity) {
                                if (commodity.id===commodity_id && commodity.amount<amount){
                                    tempTip.setDuration(2000);
                                    tempTip.show("数量不得超出原有数量！");
                                    is_return=true;
                                    return false;
                                }
                                return true;
                            });
                            if (is_return)return true;*/
                            _this._addSignCommodity(wms_code,processContent.commodity_id,type);
                            processContent.addBtnShow=false;
                            processContentTemp=Object.assign({},processContent);
                        }
                        if (processContent.wms_code==wms_code && processContent.commodity_id==commodity_id && processContent.type==!type)sign=false;
                    });
                    if (is_return)return;
                    if (bill_type==='入库单' && !type && sign){
                        _this._addSignCommodity(wms_code,processContentTemp.commodity_id,!type);
                        processContentTemp['type']=true;
                        _this.processContents.unshift(processContentTemp);
                    }
                },
                //删除新增
                deleteProcessContent(wms_code,commodity_id,type,amount){
                    let _this=this;
                    let deleteData=[];
                    _this.processContents.some(function (processContent,i) {
                        if (processContent.wms_code===wms_code && processContent.commodity_id===commodity_id && processContent.type===type) {
                            deleteData.unshift(i);
                            _this._removeSignCommodity(wms_code,processContent.commodity_id,type);
                            if (type) return true;
                        }
                        if (!type && processContent.wms_code===wms_code && processContent.commodity_id===commodity_id && processContent.type===!type){
                            deleteData.unshift(i);
                            _this._removeSignCommodity(wms_code,processContent.commodity_id,!type);
                        }
                    });
                    if (!type) _this.sum -= amount;
                    deleteData.forEach(function (data) {
                        _this.processContents.splice(data,1);
                    });
                    this.$delete(this.is_delBtn,wms_code+'_'+commodity_id+'_'+type);
                },
                {{--//获取教程
                getTutorial(owner_id){
                    let _this=this;
                    axios.post("{{url('process/ownerGetTutorials')}}"+"/"+owner_id)
                        .then(function (response) {
                            _this.tutorials=[];
                            response.data.forEach(function (tutorialOne) {
                                let tutorial={};
                                tutorial['id']=tutorialOne.id;
                                tutorial['name']=tutorialOne.name;
                                tutorial['style']=false;
                                _this.tutorials.push(tutorial);
                            });
                        }).catch(function (err) {
                        tempTip.setDuration(5000);
                        tempTip.show('获取教程失败！网络错误：'+err);
                        });
                },--}}
                //选择商品
                selectedCommodity(commodity,wms_code,type){
                    let _this=this;
                    _this.processContents.every(function (processContent) {
                        if (_this._seekSignCommodity(wms_code,commodity.id,type)){
                            tempTip.setDuration(3000);
                            tempTip.show('该单据已被添加至下边！');
                            return;
                        }else if (processContent.wms_code==wms_code){
                           processContent.commodity_id=commodity.id;
                           processContent.commodity_name=commodity.name;
                           processContent.commodity_barcodes=commodity.barcodes;
                           processContent.commodity_sku=commodity.sku;
                           processContent.amount=commodity.amount;
                           processContent.lineNo=commodity.lineNo;
                           processContent.former_amount = commodity.former_amount;
                           return false;
                       }
                       return  true;
                    });
                },
               /* //选择教程
                selectedTutorial(tutorial){
                    let _this=this;
                    if (tutorial.style){
                        for (let i=0;i<_this.selectedTutorials.length;i++){
                            if (_this.selectedTutorials[i]==tutorial.id) {
                                _this.selectedTutorials.splice(i,1);
                                break;
                            }
                        }
                        _this.tutorials.every(function (tutorialOne) {
                            if (tutorialOne.id==tutorial.id){
                                tutorialOne.style=false;
                                return false;
                            }
                            return  true;
                        });
                    }else {
                        _this.selectedTutorials.push(tutorial.id);
                        _this.tutorials.every(function (tutorialOne) {
                            if (tutorialOne.id==tutorial.id){
                                tutorialOne.style=true;
                                return false;
                            }
                            return  true;
                        });
                    }
                    setTimeout(function(){
                        $(".tooltipTarget").tooltip({'trigger':'hover'});
                    },10);
                },*/
                //异补提交
                submit(){
                    let _this=this;
                    if (_this.processContents.length>0 && _this.processContents[_this.processContents.length-1].addBtnShow) {
                        tempTip.setDuration(3000);
                        tempTip.show('新增单据操作中不能继续新增！');
                        return;
                    }
                    let owner_id=_this.process.owner_id;
                    let process_method_id=_this.process.process_method_id;
                    let unit_price=_this.process.unit_price;
                    let remark=_this.process.remark;
                    let balance_remark=_this.process.balance_remark;
                    let amount=_this.process.amount;
                    if (!owner_id || !process_method_id || !unit_price || !amount) {
                        tempTip.setDuration(3000);
                        tempTip.show('请确认您信息输入的完整性！');
                        return;
                    }
                    let then = function (response) {
                        if (response.data.error && response.data.data=="process"){
                            _this.error=response.data.error;
                            return;
                        }
                        _this.error={wms_code:[],owner_id:[],process_method_id:[],unit_price:[],amount:[]};
                        if (response.data.error){
                            let err="<small class='text-center text-danger'>部分单据内容错误：<br>";
                            for (let key in response.data.error){
                                let obj=response.data.error[key];
                                for (let k in obj) {
                                    err += key+'：'+obj[k][0]+"<br>";
                                }
                            }
                            err += "</small>";
                            tempTip.confirm(err);
                            return;
                        }
                        if(response.data.success==false){
                            tempTip.setDuration(3000);
                            tempTip.show('提交失败：'+response.data.data);
                        }else {
                            tempTip.setDuration(2000);
                            tempTip.showSuccess('提交成功');
                            setTimeout(function () {
                                location.href="{{url('process')}}";
                            },100)
                        }
                    };
                    let error = function (err) {
                        tempTip.setDuration(5000);
                        tempTip.show('提交失败！网络错误：'+err);
                    };
                    let param = {
                        owner_id:owner_id,process_method_id:process_method_id,unit_price:unit_price,
                        remark:remark,balance_remark:balance_remark,amount:amount,processContents:_this.processContents,/*tutorials:_this.selectedTutorials*/
                        is_hide:_this.is_hide
                    };
                    if (this.process.id) {
                        let url = '{{url("process")}}/'+_this.process.id;
                        axios.put(url,param).then(then).catch(error);
                    }
                    else{
                        let url='{{url("process")}}';
                        axios.post(url,param).then(then).catch(error);
                    }
                },
                {{--//去往新增教程
                addTutorial(){
                    window.open("{{url('maintenance/tutorial/create?owner_id=')}}"+this.process.owner_id);
                },
                //刷新教程
                refreshTutorial(){
                    if (this.processContents.length>=1 && this.processContents[(this.processContents.length)-1].owner_id){
                        this.getTutorial(this.processContents[(this.processContents.length)-1].owner_id);
                    }
                },--}}
                //删除按钮的显示
                update_delBtn(is_type,wms_code,commodity_id,type){
                    if (is_type) this.$set(this.is_delBtn,wms_code+'_'+commodity_id+'_'+type,true);
                    else this.$set(this.is_delBtn,wms_code+'_'+commodity_id+'_'+type,false);
                },
                update_commodity_name(processContent){
                    this.$set(processContent,'is_update_commodity_name',true);
                },
                update_commodity_barcode(processContent,e){
                    this.$set(processContent,'commodity_barcode',e.target.value);
                },
                update_commodity_sku(processContent){
                    this.$set(processContent,'is_update_commodity_sku',true);
                },
                //添加动作
                _add(processContent,commodity,type){
                    let content={};
                    content['bill_type'] = processContent.bill_type ;
                    content['commodity_id'] = commodity.id ;
                    content['wms_code'] = processContent.wms_code ;
                    content['amount'] = commodity.amount ;
                    content['former_amount'] = commodity.former_amount;
                    content['commodity_name'] = commodity.name ;
                    content['commodity_barcodes'] = commodity.barcodes ;
                    content['commodity_sku'] = commodity.sku ;
                    content['lineNo'] = commodity.lineNo ;
                    content['owner_id'] = commodity.owner_id ;
                    content['owner_name'] = commodity.owner_name ;
                    content['addBtnShow'] = false ;
                    content['type'] = type ;
                    this.processContents.unshift(content);
                    this._addSignCommodity(processContent.wms_code,commodity.id,content['type']);
                    if (!type) this.sum += Number(commodity.amount);
                    return content;
                },
                //添加所有
                addAll(processContent){
                    let _this=this;
                    processContent.commodities.forEach(function (commodity) {
                        if (!_this._seekSignCommodity(processContent.wms_code,commodity.id,false)){
                            let content = _this._add(processContent,commodity,false);
                            if (processContent.bill_type==='入库单' &&
                                !_this._seekSignCommodity(processContent.wms_code,commodity.id,true)){
                                let contentTemp={};
                                Object.assign(contentTemp,content);
                                contentTemp['type'] = true;
                                _this.processContents.unshift(contentTemp);
                                _this._addSignCommodity(processContent.wms_code,commodity.id,contentTemp['type']);
                            }
                        }
                    });
                    if (_this.processContents[(_this.processContents.length)-1].addBtnShow)
                        _this.$delete(_this.processContents,(_this.processContents.length)-1);
                },
                //成本单添加所有
                finishedProductAddAll(processContent){
                    let _this=this;
                    processContent.commodities.forEach(function (commodity) {
                        if (!_this._seekSignCommodity(processContent.wms_code,commodity.id,true)) {
                            _this._add(processContent, commodity, true);
                            _this._addSignCommodity(processContent.wms_code,commodity.id,true);
                        }
                    });
                    if (_this.processContents[(_this.processContents.length)-1].addBtnShow)
                        _this.$delete(_this.processContents,(_this.processContents.length)-1);
                },
                showPasteDataModal(type = false){
                    this.pasteDataType = type;
                    $("#popover").attr('hidden','hidden');
                    $('#pasteData').modal('show');
                },
                //外部导入
                importPasteData(){
                    let _this=this;
                    if (!this.pasteData){
                        tempTip.setDuration(3000);
                        tempTip.show('文本为空!');
                    }
                    axios.post('{{url('process/importPasteData')}}',{data:this.pasteData,rows:this.rows,type:this.pasteDataType})
                        .then(res=>{
                            if (res.data.success){
                                let sum=0;
                                res.data.data.forEach(function (processContent) {
                                    if (!_this._seekSignCommodity(processContent.wms_code,processContent.commodity_id,processContent.type)){
                                        _this.processContents.push(processContent);
                                        _this._addSignCommodity(processContent.wms_code,processContent.commodity_id,processContent.type);
                                        if (!processContent.type) sum += Number(processContent.amount);
                                        if (processContent.owner_id && !_this.process.owner_id)
                                            _this.process.owner_id = processContent.owner_id;
                                    }
                                });
                                _this.sum += sum;
                                if (res.data.errors){
                                    let content = '';
                                    for (let i in res.data.errors){
                                        content += i+"："+res.data.errors[i]+"</br>";
                                    }
                                    _this.popoverContent = content;
                                    setTimeout(function () {
                                        $("#popover").removeAttr('hidden').popover('show');
                                    },1);
                                    return;
                                }
                                $('#pasteData').modal('hide');
                                tempTip.setDuration(2000);
                                tempTip.showSuccess('导入完毕');
                            }
                        }).catch(err=>{
                            tempTip.setDuration(4000);
                            tempTip.show('网络错误：'+err);
                        });
                },
                dragover(e){
                    e.preventDefault();
                },
                dragstart(e,index){
                    this.dom = e.target.innerHTML;
                    e.dataTransfer.setData("text/html",index);
                },
                drop(e,index){
                    e.preventDefault();
                    if (this.dom != e.target.innerHTML){
                        this.dom.innerHTML = e.target.innerHTML;
                        let temp=JSON.parse(JSON.stringify(this.rows[index]));
                        this.$set(this.rows,index,this.rows[e.dataTransfer.getData('text/html')]);
                        this.$set(this.rows,Number(e.dataTransfer.getData('text/html')),temp);
                    }
                },
                replaceSpacing(){
                    this.pasteData += "\t";
                },
                forbidTab(e){
                    e.preventDefault();
                }
            },
        });
    </script>
@endsection