baoshi-was/resources/views/order/index/freeze.blade.php

@extends("layouts.app")
@section('title')订单管理-自动冻结@endsection

@section('content')
    @component('order.index.menu')@endcomponent
    <div class="card d-none" id="container">
        <div class="card-body">
            <div class="container-fluid">

                @include("order.index._freezeModal")

                <div class="pull-left">
                    <button class="btn btn-outline-info mb-1 mr-3" @click="openModal()"><span class="fa fa-plus"></span>&nbsp;新&nbsp;&nbsp;增</button>
                </div>
                <table class="table table-striped table-borderless rounded">
                    <tr>
                        <th>序号</th>
                        <th>承运商</th>
                        <th>省</th>
                        <th>市</th>
                        <th>区/县</th>
                        <th>乡/镇</th>
                        <th>村/街</th>
                        <th></th>
                    </tr>
                    <tr v-for="(freeze,i) in freezes">
                        <td>@{{ i+1 }}</td>
                        <td>@{{ freeze.logistic ? freeze.logistic.name : '' }}</td>
                        <td>@{{ freeze.province ? freeze.province.name : '' }}</td>
                        <td>@{{ freeze.city ? freeze.city.name : '' }}</td>
                        <td>@{{ freeze.district ? freeze.district.name : '' }}</td>
                        <td>@{{ freeze.town ? freeze.town.name : '' }}</td>
                        <td>@{{ freeze.street ? freeze.street.name : '' }}</td>
                        <td>
                            <button class="btn btn-sm btn-outline-danger" @click="deleteFreeze(freeze,i)">删除</button>
                            <button class="btn btn-sm btn-outline-info" @click="openModal(freeze,i)">编辑</button>
                        </td>
                    </tr>
                </table>
                {{$freezes->links()}}
            </div>
        </div>
    </div>
@stop

@section("lastScript")
    <script>
        new Vue({
            el:"#container",
            data:{
                freezes:[
                    @foreach($freezes as $freeze)
                    {!! $freeze !!},
                    @endforeach
                ],
                data:{},
                freeze:{},
                errors : {},
                mapping:{},
                mappingPool:{},
                result : [],
                stop:false,
            },
            mounted(){
                $("#container").removeClass("d-none");
            },
            methods:{
                openModal(model = null,index = null){
                    if (!model)this.freeze = {};
                    else {
                        model.index = index;
                        this.freeze = model;
                    }
                    this._load();
                    $("#modal").modal("show");
                },
                _load(){
                    if (!this.data.logistics){
                        let url = "{{url('maintenance/logistic/get')}}";
                        window.tempTip.postBasicRequest(url,{},res=>{
                            this.$set(this.data,'logistics',res);
                        });
                    }
                    if (!this.data.regions){
                        let url = "{{url('maintenance/region/get')}}";
                        window.tempTip.postBasicRequest(url,{},res=>{
                            this.$set(this.data,'regions',res);
                            let mapping = {};
                            let mappingPool = {};
                            res.forEach((region,i)=>{
                                if (!region["parent_id"])region["parent_id"] = 0;
                                if (mapping[region["parent_id"]]) mapping[region["parent_id"]].push(region);
                                else mapping[region["parent_id"]] = [region];
                                mappingPool[region.id] = i;
                            });
                            this.mapping = mapping;
                            this.mappingPool = mappingPool;
                        });
                    }
                },
                submit(){
                    if (!this.freeze.logistic_id){
                        window.tempTip.setIndex(1099);
                        window.tempTip.setDuration(3000);
                        window.tempTip.show("必须选择承运商");
                        return;
                    }
                    let url = "{{url('order/index/freeze')}}";
                    window.tempTip.postBasicRequest(url,this.freeze,res=>{
                        let msg = "新增冻结选项成功！";
                        if (this.freeze.id){
                            msg = "修改冻结选项成功！";
                            this.freezes[this.freeze.index] = res;
                        } else this.freezes.unshift(res);
                        $("#modal").modal("hide");
                        return msg;
                    },true)
                },
                deleteFreeze(freeze,index){
                    let url = "{{url('order/index/freeze/delFreeze')}}";
                    window.tempTip.confirm("确定要解除该冻结条件吗？",()=>{
                        window.tempTip.postBasicRequest(url,freeze,res=>{
                            this.$delete(this.freezes,index);
                            return "删除成功！";
                        })
                    });
                },
                addRegion(e,type){
                   let val = e.target.value;
                   if (!val)return;
                    window.tempTip.setDuration(3000);
                    window.tempTip.setIndex(1099);
                    let prent = "";
                    let msg = "";
                    let map = {2:"城市",3:"区/县",4:"乡/镇",5:"村/街"};
                    switch (type) {
                        case 3:
                            prent = this.freeze.city_id;
                            msg = map[2];
                            break;
                        case 4:
                            prent = this.freeze.district_id;
                            msg = map[3];
                            break;
                        case 5:
                            prent = this.freeze.town_id;
                            msg = map[4];
                            break;
                    }
                   if (!prent){
                       window.tempTip.show("尚未选择所属"+msg);
                       return;
                   }
                   let params = {
                       parent_id:prent,
                       name:val,
                       type:type,
                   };
                   window.tempTip.postBasicRequest("{{url('maintenance/region/store')}}",params,res=>{
                       let arr = [];
                       if (this.mapping[prent])arr=this.mapping[prent];
                       arr.push(res);
                       this.$set(this.mapping,prent,arr);
                       switch (type) {
                           case 3:
                               this.freeze.district_id = res.id;
                               break;
                           case 4:
                               this.freeze.town_id = res.id;
                               break;
                           case 5:
                               this.freeze.street_id = res.id;
                               break;
                       }
                       return "新增"+map[type]+"成功";
                   })
                },
                search(e){
                    this.stop = false;
                    this.result = [];
                    let val = e.target.value;
                    if (!val)return;
                    this.data.regions.some(region=>{
                        if (this.stop)return true;
                        if (region.name.indexOf(val) !== -1)this.result.push(this._traceParent(region));
                    });
                },
                _traceParent(region){
                    let text = "<b class='text-warning font-weight-bold'>"+region.name+"</b>";
                    let sign = false;
                    let obj = {};
                    let isGo = true;
                    while (isGo){
                        if (sign) text = region.name+"&nbsp;<span class='text-dark'>-></span>&nbsp;"+text;
                        else sign = true;
                        switch (region.type) {
                            case 1:
                                obj.province_id = region.id;
                                break;
                            case 2:
                                obj.city_id = region.id;
                                break;
                            case 3:
                                obj.district_id = region.id;
                                break;
                            case 4:
                                obj.town_id = region.id;
                                break;
                            case 5:
                                obj.street_id = region.id;
                                break;
                        }
                        if (!region.parent_id)isGo = false;
                        region = this.data.regions[this.mappingPool[region.parent_id]];
                    }
                    obj.text = text;
                    return obj;
                },
                selectedSearch(obj){
                    this.freeze = obj;
                    this.stop = true;
                },
            },
        });
    </script>
@stop