@extends('layouts.app')

@section('title','系统配置')

@section('content')
    <nav id="nav2">
        @component('maintenance.menu')@endcomponent
    </nav>

    <div class="container-fluid d-none" id="configuration">
        <div class="card">
            @can('系统配置-编辑')
                @include('maintenance.configuration._create')
                @include('maintenance.configuration._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="store"><span class="fa fa-plus"></span>&nbsp;新&nbsp;&nbsp;增</button>
                    @endcan
                </div>
                @include('maintenance.configuration._table')
            </div>
        </div>
    </div>
@endsection

@section('lastScript')
    <script>
        let vue = new Vue({
            el:"#configuration",
            data:{
                configurations:{!! $configurations->toJson() !!}['data'],
                addConfiguration:{},
                editConfiguration:{},
                index:'',
                selectTr:'',
                configurationErrors:{},
            },
            mounted(){
                $('#configuration').removeClass('d-none');
            },
            methods:{
                destroy(id,index){
                    if (!confirm('是否删除当前项目耗材')) return;
                    axios.delete('{{url('apiLocal/configuration')}}/'+id).then(res=>{
                        if(res.data.success){
                            tempTip.setIndex(100);
                            tempTip.setDuration(3000);
                            tempTip.showSuccess('删除成功');
                            this.$delete(this.configurations,index);
                            return ;
                        }
                        tempTip.setDuration(3000);
                        tempTip.show(res.data.message);
                    }).catch(err=>{
                        tempTip.setDuration(3000);
                        tempTip.show('删除当前项目耗材失败:'+err);
                    });
                },
                edit(configuration,i){
                    this.editConfiguration = JSON.parse(JSON.stringify(configuration));
                    this.index = i;
                    this.configurationErrors ={};
                    $('#edit-configuration').modal('show');
                },
                update(){
                    let url = '{{url('apiLocal/configuration/update')}}';
                    let params = this.editConfiguration;
                    if(!this.validateConfiguration(params))return;
                    window.axios.post(url,params).then(res=>{
                        if(res.data.success){
                            this.$set(this.configurations,this.index,res.data.data);
                            this.index = null;
                            this.editConfiguration = {};
                            $("#edit-configuration").modal('hide');
                            window.tempTip.showSuccess('修改成功');
                            return ;
                        }
                        if(res.data.errors){
                            this.configurationErrors = res.data.errors;
                            return;
                        }
                        window.tempTip.show(res.data.message ?? '修改失败');
                    }).catch(err=>{
                        window.tempTip.show('修改失败'+err);
                    });
                },
                store(){
                    this.addConfiguration = {};
                    this.configurationErrors ={};
                    $('#add-configuration').modal('show');
                },
                create(params){
                    let url = '{{url('apiLocal/configuration/store')}}';
                    if(!this.validateConfiguration(params))return;
                    window.tempTip.setIndex(1099);
                    window.tempTip.setDuration(3000);
                    window.axios.post(url,params).then(res=>{
                        if(res.data.success){
                            this.configurations.unshift(res.data.data);
                            this.$forceUpdate();
                            $("#add-configuration").modal('hide');
                            window.tempTip.showSuccess('添加成功');
                            return ;
                        }
                        if(res.data.errors){
                            this.configurationErrors = res.data.errors;
                            return ;
                        }
                        window.tempTip.show(res.data.message ?? '修改失败');
                    }).catch(err=>{
                        window.tempTip.show('修改失败'+err);
                    });
                },
                validateConfiguration(configuration){
                    let bool = true;
                    if(!configuration.hasOwnProperty('name') || configuration.name.trim() === ''){
                        this.$set(this.configurationErrors,'name',['名称为必填项'])
                        bool = false;
                    }
                    if(!configuration.hasOwnProperty('value') || configuration.value.trim() === ''){
                        this.$set(this.configurationErrors,'value',['值为必填项'])
                        bool = false;
                    }
                    if(!configuration.hasOwnProperty('description') || configuration.description.trim() === ''){
                        this.$set(this.configurationErrors,'description',['描述为必填项'])
                        bool = false;
                    }
                    if(!bool)this.$forceUpdate();
                    return bool;
                }
            }
        });
    </script>
@endsection