baoshi-was/resources/views/maintenance/expressPrinting/setting/printer/index.blade.php

@extends('layouts.app')

@section('title','打印终端')

@section('content')
    <span id="nav2">
        @component('maintenance.menu')@endcomponent
        @component('maintenance.expressPrinting.menu')@endcomponent
        @component('maintenance.expressPrinting.setting.menu')@endcomponent
    </span>
    <div class="container-fluid " id="list">
        <div class="card">
            @can('基础设置-快递打印-打印机-添加')
                @include('maintenance.expressPrinting.setting.printer._create')
            @endcan
            @can('基础设置-快递打印-打印机-编辑')
                @include('maintenance.expressPrinting.setting.printer._edit')
            @endcan
            <div class="card-body">
                <div class="row pull-left m-1">
                    @can('基础设置-快递打印-打印机-添加')
                        <button class="btn btn-outline-info mb-1 mr-3" @click="showCreatedModel"><span
                                class="fa fa-plus"></span>&nbsp;新&nbsp;&nbsp;增
                        </button>
                    @endcan
                </div>
                @include('maintenance.expressPrinting.setting.printer._table')
            </div>
        </div>
    </div>
@endsection

@section('lastScript')
    <script>
        let list = new Vue({
            el: "#list",
            data: {
                printers: {!! $terminalPrinters->toJson() !!}['data'],
                terminals: [
                    @foreach($terminals as $terminal)
                    {id:'{{$terminal->id}}',name:'{{$terminal->name}}'},
                    @endforeach
                ],
                printer: {},
                printerErrors: {},
                terminalFilter:null,
                index: null,
                selectTr: null,
                types: [
                    {name: '0', value: '菜鸟'},
                    {name: '1', value: '拼多多'},
                    {name: '2', value: '顺丰'},
                    {name: '3', value: '京东'},
                ]
            },
            mounted() {
                $("#list").removeClass('d-none');
            },
            computed:{
                filterTerminals(){
                    let terminals = JSON.parse(JSON.stringify(this.terminals));
                    let self = this;
                    if(this.terminalFilter === null){
                        return terminals;
                    }
                    let terminalFilter = terminals.filter(item=>{
                        return item.name.indexOf(self.terminalFilter) >= 0;
                    });
                    if (terminalFilter.length < this.terminals.length && terminalFilter.length>0)
                        this.printer.terminal_id = terminalFilter[0]['id'];
                    return terminalFilter;
                }
            },
            methods: {
                showCreatedModel() {
                    this.printer = {};
                    this.printerErrors = {};
                    $('#create-printer').modal('show');
                },
                showEditModel(printer, index) {
                    this.printer = JSON.parse(JSON.stringify(printer));
                    this.index = index;
                    this.printerErrors = {};
                    $('#edit-printer').modal('show');
                },
                createPrinter() {
                    let url = '{{url('apiLocal/maintenance/expressPrinting/setting/printer')}}';
                    let data = this.printer;
                    window.tempTip.setIndex(1999)
                    window.axios.post(url, data).then(res => {
                        if (res.data['success']) {
                            this.printers.unshift(res.data['data']);
                            this.$forceUpdate();
                            $('#create-printer').modal('hide');
                            window.tempTip.showSuccess('添加成功！');
                            return;
                        } else if (res.data['errors']) {
                            this.printerErrors = res.data['errors'];
                            return;
                        }
                        window.tempTip.show(res.data['message']);
                    }).catch(err => {
                        window.tempTip.show('网络异常！' + err);
                    })

                },
                editPrinter() {
                    let url = '{{url('apiLocal/maintenance/expressPrinting/setting/printer')}}';
                    let data = this.printer;
                    window.tempTip.setIndex(1999)
                    window.axios.put(url, data).then(res => {
                        if (res.data['success']) {
                            this.$set(this.printers, this.index, res.data['data']);
                            window.tempTip.showSuccess('编辑成功！');
                            $('#edit-printer').modal('hide');
                            return;
                        } else if (res.data['errors']) {
                            this.printerErrors = res.data['errors'];
                            return;
                        }
                        window.tempTip.show(res.data['message'])
                    }).catch(err => {
                        window.tempTip.show('网络异常！' + err)
                    });
                },
                destroyPrinter(printer, index) {
                    let url = '{{url('apiLocal/maintenance/expressPrinting/setting/printer')}}' + '/' + printer['id'];
                    if (!confirm('是否删除当前终端')) return;
                    window.axios.delete(url).then(res => {
                        if (res.data['success']) {
                            this.$delete(this.printers, index);
                            window.tempTip.showSuccess('删除成功！');
                            return;
                        } else if (res.data['errors']) {
                            this.printerErrors = res.data['errors'];
                            return;
                        }
                        window.tempTip.show(res.data['message'])
                    }).catch(err => {
                        window.tempTip.show('网络异常！' + err)
                    });
                }
            }
        })
    </script>
@endsection