@extends("layouts.app")
@section('title','处理工单')
@section("content")
    <div class="container-fluid d-none" id="list">
        <div>
            <div class="">
                <div id="form_div" style="min-width: 1220px;"></div>
                <div class="form-inline mt-1" id="btn">
                    @can('订单管理-订单问题件生成')
                        <button type="button"
                                class="ml-1 btn btn-outline-dark btn-sm form-control-sm  tooltipTarget"
                                @click="createOrderIssue(null,false)" style="background: #dad7e8;">生成问题件
                        </button>
                    @endcan
                    @can('订单管理-订单问题件生成')
                        <button type="button"
                                class="ml-1 btn btn-outline-primary btn-sm form-control-sm  tooltipTarget"
                                @click="exportText()">导出文本
                        </button>
                    @endcan
                    @can('订单管理-工单处理-审核')
                        <button type="button"
                                class="ml-1 btn btn-outline-success btn-sm form-control-sm tooltipTarget"
                                @click="batchReview">批量审核
                        </button>
                    @endcan
                    <button type="button"
                            class="ml-1 btn btn-outline-dark btn-sm form-control-sm tooltipTarget"
                            @click="copyLogisticNumber()" style="background: #dad7e8;">批量复制单号
                    </button>
                    @can('订单管理-工单处理-审核')
                        <button type="button"
                                class="ml-1 btn btn-outline-success btn-sm form-control-sm  tooltipTarget"
                                @click="showEditIssueType">批量修改问题件类型
                        </button>
                    @endcan
                </div>

                <div>
                    <table class="table table-sm table-striped table-hover table-bordered td-min-width-80 " id="table">
                        <tbody class="">
                        <template v-for="(item,i) in workOrders">
                            <tr @click="selectTr===i+1?selectTr=0:selectTr=i+1" :class="selectTr===i+1?'focusing' : ''">
                                <td>
                                    <label><input type="checkbox" :value="item.id"></label>
                                </td>
                                <td class="text-center">
                                    <span v-text="i+1"></span>
                                    <span v-show="item.is_issue_order" class="badge badge-primary">问题件</span>
                                </td>
                                <td class="text-left">
                                    @can('订单管理-订单问题件生成')
                                        <button class="btn btn-sm btn-outline-primary"
                                                v-show="!item.is_issue_order "
                                                @click="createOrderIssue(item,true)">生成问题件
                                        </button>
                                    @endcan
                                    @can('订单管理-工单处理-审核')
                                        <button class="btn btn-sm btn-outline-success"
                                                v-show="item.status !== '已处理'"
                                                @click="review(item,i)">审核
                                        </button>
                                    @endcan
                                    @can('订单管理-工单处理-货主编辑')
                                        <button class="btn btn-sm btn-outline-secondary"
                                                v-if="item['issue_type']['name'] ==='快递丢件'"
                                                @click="showFillModel(item,i)">信息填充
                                        </button>
                                    @endcan
                                    @can('订单管理-工单处理-承运商编辑')
                                        <button class="btn btn-sm btn-outline-secondary"
                                                v-if="['快递丢件','破损'].includes(item['issue_type']['name'])"
                                                @click="showEditLog(item,i,2)">快递处理
                                        </button>
                                    @endcan
                                    @can('订单管理-工单处理-宝时编辑')
                                        <button class="btn btn-sm btn-outline-secondary"
                                                v-if="['快递丢件','破损'].includes(item['issue_type']['name'])"
                                                @click="showEditLog(item,i,1)">宝时处理
                                        </button>
                                    @endcan
                                </td>
                                <td class="text-center">
                                    @can('订单管理-工单处理-宝时编辑')
                                        <select class="form-control form-control-sm"
                                                :value="item['work_order_status']"
                                                :disabled="item['work_order_status'] === '工单完成'"
                                                @change="updateWorkOrderStatus(item,$event)">
                                            <option value="">无</option>
                                            <option v-for="status in workOrderStatus"
                                                    :value="status"
                                                    v-text="status"></option>
                                        </select>
                                    @elsecan('订单管理-工单处理-承运商编辑')
                                        <select class="form-control form-control-sm"
                                                v-if="['拦截','信息更改'].includes(item['issue_type']['name'])"
                                                :value="item['work_order_status']"
                                                @change="logisticUpdateWorkOrderStatus(item,$event)">
                                            <option v-for="status in ['创建','快递已处理','工单完成']"
                                                    :disabled="item['work_order_status'] === '工单完成'"
                                                    :value="status"
                                                    v-text="status"></option>
                                        </select>
                                        <select class="form-control form-control-sm"
                                                v-else-if="'快递丢件' === item['issue_type']['name']"
                                                :value="item['work_order_status']"
                                                @change="logisticUpdateWorkOrderStatus(item,$event)">
                                            <option v-for="status in ['创建','信息已填充','快递已处理','工单完成']"
                                                    :disabled="item['work_order_status'] === '工单完成'"
                                                    :value="status"
                                                    v-text="status"></option>
                                        </select>
                                        <select class="form-control form-control-sm"
                                                v-else-if="'破损' === item['issue_type']['name']"
                                                :value="item['work_order_status']"
                                                @change="logisticUpdateWorkOrderStatus(item,$event)">
                                            <option v-for="status in ['创建','信息已填充','快递已处理','工单完成']"
                                                    :disabled="item['work_order_status'] === '工单完成'"
                                                    :value="status"
                                                    v-text="status"></option>
                                        </select>
                                    @else
                                        <span v-text="item.work_order_status"></span>
                                    @endcan
                                </td>
                                <td class="text-center" v-text="item.status"></td>
                                <td class="text-center" v-text="item.owner ?.name "></td>
                                <td class="text-center" v-text="item.order ?.client_code "></td>
                                <td v-text="item.order ?.['logistic'] ?.name "></td>
                                <td class="text-center">
                                    <div v-if="item.order">
                                        <p v-if="item.order.packages && item.order.packages.length === 1"
                                           v-text="item.order.packages[0].logistic_number">
                                        </p>
                                        <div v-else-if="item.order.packages && item.order.packages.length > 0">
                                            <div v-if="selectOrder === item.order.id">
                                                <p v-for="(data) in item.order.packages"
                                                   v-text="data.logistic_number"></p>
                                            </div>
                                            <div v-else>
                                                <p v-text="item.order.packages[0].logistic_number"></p>
                                            </div>
                                            <button class="btn btn-sm btn-outline-primary"
                                                    v-show="selectOrder === null"
                                                    @click="selectOrder = item.order.id">展开
                                            </button>
                                            <button class="btn btn-sm btn-outline-primary"
                                                    v-show="selectOrder === item.order.id"
                                                    @click="selectOrder = null">收起
                                            </button>
                                        </div>
                                    </div>
                                </td>
                                <td>
                                    {{--  承运商处理日志   --}}
                                    <div v-if="item['logistic_log']" class="alert alert-light">
                                        <div>
                                            <span class="text-muted">承运商处理</span>
                                            <button class="btn btn-sm btn-outline-info float-right"
                                                    v-show="selectLogisticLogId === item['logistic_log']['id']"
                                                    @click="selectLogisticLogId = null">隐藏
                                            </button>
                                            <button class="btn btn-sm btn-outline-info float-right"
                                                    v-show="selectLogisticLogId !== item['logistic_log']['id']"
                                                    @click="selectLogisticLogId = item['logistic_log']['id']">显示
                                            </button>
                                        </div>
                                        <transition name="fade">
                                            <div v-show="selectLogisticLogId === item['logistic_log']['id']">
                                                <div>
                                                    <span class="mr-2">是否赔偿：</span>
                                                    <span class="text-truncate"
                                                          v-text="item['logistic_log']['is_indemnity']"></span>
                                                </div>
                                                <div v-if="item['logistic_log']['is_indemnity'] === '是'">
                                                    <span class="mr-2">赔偿金额：</span>
                                                    <span class="text-truncate"
                                                          v-text="item['logistic_log']['indemnity']"></span>
                                                </div>
                                                <div v-if="item['logistic_log']['is_indemnity'] === '否'">
                                                    <span class="mr-2">不赔偿理由：</span>
                                                    <span v-text="item['logistic_log']['remark']"></span>
                                                </div>
                                            </div>
                                        </transition>
                                    </div>
                                    <div v-if="item['process_log']" class="alert alert-light">
                                        <div>
                                            <span class="text-muted">宝时处理</span>
                                            <button class="btn btn-sm btn-outline-info float-right"
                                                    v-if="selectBaoShiLogId === item['process_log']['id']"
                                                    @click="selectBaoShiLogId = null">隐藏
                                            </button>
                                            <button class="btn btn-sm btn-outline-info float-right"
                                                    v-if="selectBaoShiLogId !== item['process_log']['id']"
                                                    @click="selectBaoShiLogId = item['process_log']['id']">显示
                                            </button>
                                        </div>
                                        <transition name="fade">
                                            <div v-show="selectBaoShiLogId === item['process_log']['id']">
                                                <div>
                                                    <span class="text-muted">是否赔偿: </span>
                                                    <span v-text="item['process_log']['is_indemnity']"
                                                          class="ml-2 text-truncate"></span></div>
                                                <div v-if="item['process_log']['is_indemnity'] === '是'">
                                                    <span class="text-muted">赔偿方：</span>
                                                    <span class="text-truncate"
                                                          v-text="item['process_log']['indemnitor']"></span>
                                                </div>
                                                <div v-if="item['process_log']['is_indemnity'] === '是'">
                                                    <span class="text-muted">赔偿金额：</span>
                                                    <span class="ml-2 text-truncate"
                                                          v-text="item['process_log']['indemnity']"></span>
                                                </div>
                                                <div v-if="item['process_log']['is_indemnity'] === '否'">
                                                    <span class="text-muted">不赔偿理由：</span>
                                                    <span class="ml-2" v-text="item['process_log']['remark']"></span>
                                                </div>
                                            </div>
                                        </transition>
                                    </div>
                                </td>
                                <td>
                                    {{-- 工单详情 --}}
                                    @can('订单管理-工单处理-宝时编辑')
                                        @include('order.workOrder._work_order_details')
                                    @elsecan('订单管理-工单处理-承运商编辑')
                                        <template v-if="item.status === '已处理' && item.is_issue_order">
                                            @include('order.workOrder._work_order_details')
                                        </template>
                                        <template v-else-if="item['issue_type'] && item['issue_type'].name === '破损'">
                                            @include('order.workOrder._work_order_details')
                                        </template>
                                    @elsecan('订单管理-工单处理-货主编辑')
                                        @include('order.workOrder._work_order_details')
                                    @endcan
                                </td>
                                <td class="text-center">
                                    @can('订单管理-工单处理-审核')
                                        <select class="form-control form-control-sm"
                                                :disabled="item.review_at || item.is_issue_order"
                                                :value="item.order_issue_type_id"
                                                @change="changeIssueType(item,$event)">
                                            <option value="0"></option>
                                            <option v-for="type in orderIssueTypes"
                                                :value="type.name"
                                                v-text="type.value">
                                            </option>
                                        </select>
                                    @else
                                        <span v-text="item['issue_type'] ?.name"></span>
                                    @endcan
                                </td>
                                <td class="text-center">
                                    <span v-text="item.remark"></span>
                                </td>
                                <td class="text-center">
                                    <span v-text="item.result_explain"></span>
                                </td>
                                <td class="text-center">
                                    <span v-text="item.issue_order_type"></span>
                                </td>
                                <td class="text-center p-0">
                                    <template v-if="item.issue_logs">
                                        <template v-if="item.issue_logs.length === 1">
                                            <table class="table table-sm m-0">
                                                <tr class="table table-sm">
                                                    <td v-text="item.issue_logs[0].content"></td>
                                                    <td v-text="item.issue_logs[0].username"></td>
                                                    <td>@{{ item.issue_logs[0].created_at | dataTime }}</td>
                                                </tr>
                                            </table>
                                        </template>
                                        <template v-else-if="item.issue_logs.length > 1">
                                            <transition name="fade">
                                                <table class="table table-sm m-0" v-if="selectOrderIssue === item.id">
                                                    <tr v-for="log in item.issue_logs">
                                                        <td v-text="log.content"></td>
                                                        <td v-text="log.username"></td>
                                                        <td>@{{ log.created_at | dataTime }}</td>
                                                    </tr>
                                                </table>
                                            </transition>
                                            <transition name="fade">
                                                <table class="table table-sm m-0" v-if="selectOrderIssue !== item.id">
                                                    <tr>
                                                        <td v-text="item.issue_logs[0].content"></td>
                                                        <td v-text="item.issue_logs[0].username"></td>
                                                        <td>@{{ item.issue_logs[0].created_at | dataTime }}</td>
                                                    </tr>
                                                </table>
                                            </transition>
                                            <button class="btn btn-sm btn-outline-primary"
                                                    v-show="selectOrderIssue !== item.id"
                                                    @click="selectOrderIssue = item.id">展开
                                            </button>
                                            <button class="btn btn-sm btn-outline-primary"
                                                    v-show="selectOrderIssue === item.id"
                                                    @click="selectOrderIssue = null">收起
                                            </button>
                                        </template>
                                    </template>
                                </td>
                                <td class="text-center">
                                    <div v-if="item.order && item.order.packages">
                                        <template v-for="package in item.order.packages">
                                            <template
                                                v-if="package.transfer_status && package.transfer_status.length > 0">
                                                <div v-if="selectOrderPackage === package.id">
                                                    <template v-for="transfer in package.transfer_status">
                                                        <p v-text="transfer['accept_time']+':'+transfer['accept_address']"></p>
                                                    </template>
                                                </div>
                                                <div v-else v-text="package.transfer_status[0]['accept_time']+':'+package.transfer_status[0]['accept_address']">
                                                </div>
                                                <button class="btn btn-sm btn-outline-primary"
                                                        v-if="selectOrderPackage !== package.id"
                                                        @click="selectOrderPackage = package.id">展开
                                                </button>
                                                <button class="btn btn-sm btn-outline-primary" v-else
                                                        @click="selectOrderPackage = null">收起
                                                </button>
                                            </template>
                                        </template>
                                    </div>
                                </td>
                                <td class="text-center" v-text="item.creator ?.name || ''"></td>
                                <td class="text-center" v-text="item.created_at"></td>
                                <td v-text="item.reviewer ?.name || ''"></td>
                                <td v-text="item.review_at"></td>
                                @can('订单管理-工单处理-删除')
                                    <td>
                                        <button class="btn btn-sm btn-outline-danger"
                                                @click="destroy(item,i)">
                                            删除
                                        </button>
                                    </td>

                                @endcan
                            </tr>
                        </template>
                        </tbody>
                    </table>
                    {{ $workOrders->withQueryString()->links() }}
                </div>
            </div>
            @can('订单管理-工单处理-审核')
                @include('order.workOrder._edit_issue_type')
            @endcan
            @include('order.workOrder._fill_loss_work_order')
            @include('order.workOrder._edit_process_log')
        </div>
    </div>
@endsection()

@section("lastScript")
    <script type="text/javascript" src="{{asset('js/queryForm/queryForm.js')}}"></script>
    <script type="text/javascript" src="{{mix('js/queryForm/header.js')}}"></script>
    <style>
        .fade-enter-active, .fade-leave-active {
            transition: opacity .3s;
        }

        .fade-enter, .fade-leave-to {
            opacity: 0;
        }

        .image-div {
        }

        .image-w {
            width: 100%;
        }
    </style>
    <script>
        let list = new Vue({
            el: "#list",
            data: {
                workOrders: {!! $workOrders->toJson() !!}['data'],

                form: null,
                logistics: [
                        @foreach($logistics as $logistic)
                    {
                        name: {{$logistic->id}}, value: '{{$logistic->name}}'
                    },
                    @endforeach
                ],
                orderIssueTypes: [
                        @foreach($orderIssueTypes as $type)
                    {
                        name: '{{$type->id}}', value: "{{$type->name}}"
                    },
                    @endforeach
                ],
                owners: [
                        @foreach($owners as $owner)
                    {
                        name: '{{$owner->id}}', value: '{{$owner->name}}'
                    },
                    @endforeach
                ],
                workOrder: {
                    id: null,
                    index: null,
                    reissue_logistic_number: null, // 补发单号
                    logistic_number: null, // 丢件快递单号
                    refundImages: [], // 退款图
                    dealImages: [], // 交易图
                },
                processLog: {
                    id: null,        // log->id
                    index: '', // 下标
                    work_order_id: null, // work_order_id
                    type: null,  // 类型
                    is_indemnity: null, // 是否赔偿
                    indemnity: null,  // 金额
                    remark: null,
                    indemnitor: null, // 赔偿方
                },
                workOrderStatus: ['创建', '信息已填写', '快递已处理', '工单完成'],
                selectTr: null,
                selectOrderPackage: null,
                selectOrder: null,
                selectLogisticLogId: null,
                selectBaoShiLogId: null,
                selectDetailId: null,
                selectOrderIssue: null,
                selectIssueType: '',
                filePrefix: "{{asset("/storage")}}",
            },
            mounted() {
                let data = [[
                    {name: 'created_at_start', type: 'time', tip: ['工单创建开始日期', '时间']},
                    {name: 'created_at_end', type: 'time', tip: ['工单创建结束日期', '时间']},
                    {
                        name: 'logistic',
                        type: 'select_multiple_select',
                        data: this.logistics,
                        tip: ['输入关键词快速定位下拉列表，回车确定', '选择要显示的承运商'],
                        placeholder: ['承运商', '定位或多选承运商']
                    },
                        @can('订单管理-订单问题件生成')
                    {
                        name: 'owner',
                        type: 'select_multiple_select',
                        data: this.owners,
                        tip: ['输入关键词快速定位下拉列表，回车确定', '选择要显示的货主'],
                        placeholder: ['货主', '定位或多选货主']
                    },
                        @endcan
                    {
                        name: 'logistic_number', type: 'input', placeholder: '快递单号'
                    },
                    {
                        name: 'is_issue_order',
                        type: 'select',
                        placeholder: '问题件',
                        data: [{name: 'true', value: '有'}, {name: 'false', value: '无'}]
                    },
                    {name: 'creator', type: 'input', placeholder: '创建人'},
                ], [{name: 'review_at_start', type: 'time', tip: ['工单审核开始日期', '时间']},
                    {name: 'review_at_end', type: 'time', tip: ['工单审核结束日期', '时间']},
                    {name: 'order_issue_type', type: 'select', placeholder: '问题件类型', data: this.orderIssueTypes},
                    {name: 'client_code', type: 'input', placeholder: '客户订单号'},
                    {name: 'is_review', type: 'checkbox', tip: '是否审核', data: [{name: 'true', value: '已审核'}]},
                ]];
                this.form = new query({
                    el: '#form_div',
                    condition: data,
                });
                this.form.init();
                let column = [
                    {name: 'no', value: '序号', neglect: true},
                    {name: 'operation', value: '操作', neglect: true},
                    {name: 'work_order_status', value: '工单状态', neglect: true},
                    {name: 'status', value: '状态', neglect: true},
                    {name: 'owner', value: '货主', neglect: true},
                    {name: 'client_code', value: '订单号', neglect: true},
                    {name: 'logisticName', value: '承运商', neglect: true},
                    {name: 'logisticNumber', value: '快递单号'},
                    {name: 'processLog', value: '处理日志'},
                    {name: 'workOrderDetails', value: '工单详情'},
                    {name: 'issueType', value: '问题件类型'},
                    {name: 'workOrderInfo', value: '问题描述', neglect: true},
                    {name: 'result_explain', value: '情况说明', neglect: true},
                    {name: 'orderIssueType', value: '问题件类别'},
                    {
                        name: 'orderIssueProcessLogs', type: 'multi', title: "处理结果", rows: [
                            {value: "内容", col: "4"},
                            {value: "操作人", col: "4"},
                            {value: "时间", col: "4"},
                        ], neglect: true
                    },
                    {name: 'Info', value: '物流跟踪信息', neglect: true},
                    {name: 'creator', value: '创建人', neglect: true},
                    {name: 'submit_at', value: '提交时间', neglect: true},
                    {name: 'reviewer', value: '审核人', neglect: true},
                    {name: 'review_at', value: '审核时间', neglect: true},
                    @can('订单管理-工单处理-删除')
                    {name: 'delete_operation', value: '其他操作', neglect: true}
                    @endcan
                ];
                new Header({
                    el: "table",
                    name: "workOrders",
                    column: column,
                    data: this.workOrders,
                    fixedTop: ($('#form_div').height()) + 2,
                }).init();
                $("#list").removeClass("d-none");
            },
            created() {
                this.workOrders.forEach(item => {
                    if (!item.order) return;
                    if (!item.order.packages) return;
                    this.sortOrder(item);
                });
            },
            filters: {
                dataTime: function (value) {
                    if (value !== null) {
                        return moment(value).format('yyyy-MM-DD');
                    }
                    return value
                },
            },
            methods: {
                sortOrder(workOrder) {
                    if (workOrder['order_issue']) {
                        workOrder.result_explain = workOrder['order_issue'].result_explain;
                        if (workOrder['order_issue']['issue_type']) {
                            workOrder.issue_order_type = workOrder['order_issue']['issue_type']['name'];
                        }
                        if (workOrder['order_issue'].logs) {
                            workOrder.issue_logs = this.mapLogs(workOrder['order_issue'].logs);
                        }
                    }
                    if (!workOrder.order.packages) return;
                    workOrder.order.packages.forEach(item => {
                        this.sortTransfer(item)
                    })
                },
                mapLogs(logs) {
                    return logs.map(item => {
                        return {
                            username: item.user ?.name || '',
                            content: item.content,
                            created_at: item.created_at
                        };
                    });
                },
                sortTransfer(item) {
                    if (!("transfer_status" in item)) return;
                    if (item.transfer_status == null || !(item.transfer_status instanceof Array)) return;
                    item.transfer_status.sort(function (item1, item2) {
                        let date1 = new Date(item1['accept_time']);
                        let date2 = new Date(item2['accept_time']);
                        if (date1 - date2 > 0) return -1;
                        if (date1 - date2 < 0) return 1;
                        return 0;
                    });
                },
                review(item, i) {
                    let url = '{{route('workOrder.reviewApi')}}';
                    let data = {id: item.id};
                    window.axios.post(url, data).then(res => {
                        if (res.data.success) {
                            res.data.data.is_issue_order = item.is_issue_order;
                            this.sortOrder(res.data.data);
                            this.$set(this.workOrders, i, res.data.data);
                            window.tempTip.showSuccess("审核完成");
                        } else {
                            window.tempTip.show(res.data.message ? res.data.message : '审核异常');
                        }
                    }).catch(err => {
                        window.tempTip.show(err)
                    })
                },
                createOrderIssue(item, tag) { // 生成问题件
                    let url = '{{route('workOrder.buildOrderIssueApi')}}';
                    let data = {};
                    if (tag) data.ids = [item.id];
                    else data.ids = checkData;
                    if (!confirm('是否生成对应的问题件')) return;
                    window.tempTip.waitingTip('生成中........');
                    window.axios.post(url, data).then(res => {
                        if (res.data.success) {
                            this.replaceWorkOrder(res.data.data);
                            this.$forceUpdate();
                            window.tempTip.cancelWaitingTip();
                            window.tempTip.showSuccess('已生成对应的问题件');
                        } else {
                            window.tempTip.cancelWaitingTip();
                            window.tempTip.show(res.data.message ? res.data.message : '生成问题件异常');
                        }
                    }).catch(err => {
                        window.tempTip.cancelWaitingTip();
                        window.tempTip.show(err)
                    });
                },
                replaceWorkOrder(workOrders) {
                    let data = [];
                    workOrders.forEach(workOrder => {
                        data[workOrder.id] = workOrder;
                    });
                    this.workOrders.forEach((workOrder, i) => {
                        if (data[workOrder.id]) {
                            let item = data[workOrder.id];
                            this.sortOrder(item);
                            this.$set(this.workOrders, i, item);
                        }
                    });
                    this.$forceUpdate();
                },
                getMessageWorkOrder() {
                    let selected = checkData;
                    if (!selected) {
                        window.tempTip.show('未选中任何信息');
                        return null;
                    }
                    return this.workOrders.filter((item) => {
                        if (!item.order || !item.order.packages) return false;
                        return selected.includes(item.id + '');
                    });
                },
                exportText() {
                    let items = this.getMessageWorkOrder();
                    if (items == null) return;
                    let text = '';
                    items.forEach(item => {
                        if (item.order) text += this.getExportText(item);
                    });
                    this.copyText(text);
                },
                getExportText(item) {
                    if (!item.order || !item.order.packages) return '';
                    let message = '';
                    let issue_type = item['issue_type'] ?.name || '';
                    switch (issue_type) {
                        case '拦截':
                            message = this.interceptMessage(item);
                            break;
                        case '信息更改':
                            message = this.modificationMessage(item);
                            break;
                        default:
                            message = this.getMessage(item);
                            break;
                    }
                    return message;
                },
                interceptMessage(item) {
                    let message = '';
                    let order = item.order;
                    let order_packages = item.order ?.packages || [];
                    let logistic_code = item.order ?.['logistic'] ?.code || ''; // 承运商编码
                    let logistic_name = item.order ?.['logistic'] ?.name || ''; // 承运商名称

                    let {consignee_name,consignee_phone,address} = order;
                    let order_adder = `${consignee_name}  ${consignee_phone}  ${address}`;

                    order_packages.forEach(item=>{
                        let logistic_number = item.logistic_number;
                        if (logistic_code.includes('SF') || logistic_code.includes('ZTO')) {
                            message += `${logistic_number}\n`;
                        } else {
                            if (item) message += `${logistic_name}  ${logistic_number}  ${order_adder}\n`;
                        }
                    });

                    message = message.trim('\n') + ' ——拦截\n';
                    return message;
                },
                modificationMessage(item) {
                    let message = '';
                    let {remark,order} = item;
                    let order_packages = item.order ?.packages || [];
                    let logistic_code = item.order ?.['logistic'] ?.code || '';

                    const {consignee_name,consignee_phone,province,city,district,address} = order;
                    let adder = `${consignee_name}  ${consignee_phone}  ${province}  ${city}  ${district}  ${address}`;

                    order_packages.forEach(node => {
                        let logistic_number = node.logistic_number;
                        if (logistic_code.includes('SF')) { // 顺丰订单
                            message += `${logistic_number}   ——改信息:${remark},运费到付或月结\n`;
                        } else {
                            message += `${logistic_number}  ${adder}  ——改地址 ${remark}\n`;
                        }
                    });
                    return message;
                },
                getMessage(item) {
                    let message = '';
                    if (!item.order.packages) return message;
                    let {order,remark} = item.order;
                    console.log(order);
                    let {consignee_name,consignee_phone,province,city,district,address} = order;
                    let adder = `${consignee_name}  ${consignee_phone}  ${province}  ${city}  ${district}  ${address}`;
                    order.packages.forEach(p => {
                        message += `${p.logistic_number}  ${adder}  ——描述 ${remark}\n`;
                    });
                    return message;
                },
                copyText(text) {
                    let ele = document.querySelector('#copy_text');
                    if (ele == null) {
                        ele = document.createElement("textarea");
                        ele.setAttribute('id', 'copy_text')
                        ele.style.opacity = 0;
                        document.querySelector('body').append(ele);
                    }
                    try {
                        $("#copy_text").text(text).select().focus();
                        document.execCommand("Copy");
                        tempTip.showSuccess('复制成功')
                    } catch (e) {
                        tempTip.showSuccess('复制失败：' + e)
                    }
                },
                batchReview() {
                    let url = '{{route('workOrder.batchReviewApi')}}';
                    let data = {ids: checkData};
                    window.tempTip.setIndex('1999');
                    if (!confirm('是否对当前选中订单进行审核')) return;
                    window.tempTip.waitingTip('审核中........');
                    window.axios.post(url, data).then(res => {
                        if (res.data.success) {
                            this.replaceWorkOrder(res.data.data);
                            this.$forceUpdate();
                            window.tempTip.cancelWaitingTip();
                            window.tempTip.showSuccess('审核完成');
                        } else {
                            window.tempTip.cancelWaitingTip();
                            window.tempTip.show(res.data.message ? res.data.message : '审核出现异常');
                        }
                    }).catch(err => {
                        window.tempTip.cancelWaitingTip();
                        window.tempTip.show(err);
                    })
                },
                changeIssueType(item, e) {
                    let url = '{{route('workOrder.updateIssueTypeApi')}}';
                    let data = {
                        id: item.id,
                        type_id: $(e.target).val()
                    };
                    window.tempTip.waitingTip('修改中.........');
                    window.axios.post(url, data).then(res => {
                        if (res.data.success) {
                            window.tempTip.cancelWaitingTip();
                            window.tempTip.showSuccess('修改成功');
                            item.order_issue_type_id = data.type_id;
                        } else {
                            window.tempTip.cancelWaitingTip();
                            window.tempTip.show(res.data.message ? res.data.message : '修改异常');
                        }
                    }).catch(err => {
                        window.tempTip.cancelWaitingTip();
                        window.tempTip.show(err);
                    });
                },
                copyLogisticNumber() {
                    let items = this.getMessageWorkOrder();
                    let logistic_numbers = '';
                    items.forEach(item => {
                        item.order.packages.forEach(node => {
                            logistic_numbers += `${node.logistic_number}\n`;
                        });
                    })
                    this.copyText(logistic_numbers);
                },
                showEditIssueType() {
                    this.selectIssueType = 0;
                    $("#edit-issue-type-type-modal").modal('show');
                },
                editOrderIssueType() {
                    let url = '{{route('workOrder.batchUpdateIssueTypeApi')}}'
                    let data = {ids: checkData, type: this.selectIssueType};
                    window.tempTip.setIndex(1999);
                    window.axios.post(url, data).then(res => {
                        if (res.data.success) {
                            window.tempTip.showSuccess('修改问题件类型成功');
                            this.replaceWorkOrder(res.data.data);
                            $("#edit-issue-type-type-modal").modal('hide');
                            return;
                        }
                        window.tempTip.show(res.data.message ? res.data.message : '修改异常');
                    }).catch(err => {
                        window.tempTip.show(err)
                    })
                },
                destroy(item, i) {
                    let url = '{{url('apiLocal/workOrder/')}}' + '/' + item.id;
                    if (!confirm('是否删除当前工单')) return;
                    window.tempTip.waitingTip('删除.........');
                    window.axios.delete(url).then(res => {
                        if (res.data.success) {
                            this.$delete(this.workOrders, i);
                            window.tempTip.cancelWaitingTip();
                            window.tempTip.showSuccess('删除成功');
                        } else {
                            window.tempTip.cancelWaitingTip();
                            window.tempTip.show(res.data.message ? res.data.message : '');
                        }
                    }).catch(err => {
                        window.tempTip.cancelWaitingTip();
                        window.tempTip.show(err);
                    })
                },
                pushImagesAndShow(e, images) {
                    let map = [];
                    for (let i = 0; i < e.target.files.length; i++) {
                        let image = e.target.files[i];
                        if (this.imageExist(image, images)) {
                            map.push(image.name);
                            continue;
                        }
                        let src = window.URL.createObjectURL(image);
                        images.push({src: src, file: image});
                    }
                    e.target.value = '';
                    if (map.length === 0) return;
                    window.tempTip.setIndex(1999);
                    window.tempTip.show(map.join('\n,') + '图片重复');
                },
                spliceImage(i, images) {
                    if (!confirm('是否取消选择该图片')) return;
                    images.splice(i, 1);
                },
                imageExist(image, images) {
                    let arr = images.filter(item => {
                        return item.file.name === image.name;
                    });
                    return arr.length > 0;
                },
                showFillModel(item, index) {
                    this.clearWorkOrder(item, index);
                    $("#fill-loss-work-order-modal").modal('show');
                },
                clearWorkOrder(item = null ,index =null){
                    this.workOrder.id = item ? item.id : null;
                    this.workOrder.index = index ? index : null;
                    this.workOrder.reissue_logistic_number = null; // 补发单号
                    this.workOrder.logistic_number = null; // 补发单号
                    this.workOrder.dealImages = []; // 交易图
                    this.workOrder.refundImages = []; // 退款图
                },
                updateLossWorkOrder() {
                    let formData = new FormData();
                    formData.append('id', this.workOrder.id);
                    formData.append('reissue_logistic_number', this.workOrder.reissue_logistic_number);
                    formData.append('logistic_number', this.workOrder.logistic_number);
                    formData.append('price', this.workOrder.price);
                    let dealImages = this.getImages(this.workOrder.dealImages);
                    let refundImages = this.getImages(this.workOrder.refundImages);
                    this.setFormDataImagePrefix(formData, 'dealImages', dealImages);
                    this.setFormDataImagePrefix(formData, 'refundImages', refundImages);
                    this.fillLossWorkOrder(formData);
                },
                setFormDataImagePrefix(formData, prefix, images) {
                    images.forEach((item, i) => {
                        formData.append(`${prefix}[]`, item);
                    });
                },
                getImages(images) {
                    return images.map((item) => {
                        return item.file;
                    })
                },
                fillLossWorkOrder(data) {
                    let url = "{{route('workOrder.lossApi')}}";
                    window.tempTip.setIndex(1999);
                    window.axios.post(url, data, {'Content-Type': 'multipart/form-data'}).then(res => {
                        if (res.data.success) {
                            this.sortOrder(res.data.data);
                            this.$set(this.workOrders, this.workOrder.index, res.data.data);
                            window.tempTip.showSuccess('工单信息填充成功');
                            this.clearWorkOrder();
                            $("#fill-loss-work-order-modal").modal('hide');
                        } else {
                            window.tempTip.show(res.data.message);
                        }
                    }).catch(err => {
                        window.tempTip.show(err);
                    });
                },
                showEditLog(item, index, type) {
                    this.processLog.type = type;
                    this.processLog.index = index;
                    this.processLog.work_order_id = item.id;
                    this.processLog.indemnity = null;
                    this.processLog.is_indemnity = null;
                    this.processLog.remark = null;
                    this.processLog.indemnitor = null;
                    $("#work-order-process-log-modal").modal('show');
                },
                storeLogisticProcessLog() {
                    let url = "{{route('workOrderProcessLog.logisticLogApi')}}";
                    let data = {
                        indemnity: this.processLog.indemnity,
                        work_order_id: this.processLog.work_order_id,
                        is_indemnity: this.processLog.is_indemnity,
                        remark: this.processLog.remark,
                    };
                    if (!this.verifiedProcessLog()) return;
                    window.tempTip.setDuration(9999);
                    window.tempTip.setIndex(1999);
                    window.tempTip.waitingTip('操作中请稍后');
                    window.axios.post(url, data).then(res => {
                        window.tempTip.cancelWaitingTip();
                        window.tempTip.setIndex(1999);
                        window.tempTip.setDuration(2000);
                        if (res.data.success) {
                            window.tempTip.showSuccess('创建成功');
                            this.$set(this.workOrders[this.processLog.index], 'logistic_log', res.data.data);
                            $('#work-order-process-log-modal').modal('hide');
                        } else {
                            window.tempTip.show(res.data.message ? res.data.message : '创建异常，刷新页面重试');
                        }
                    }).catch(err => {
                        window.tempTip.setIndex(1999);
                        window.tempTip.setDuration(2000);
                        window.tempTip.show(err);
                    });
                },
                storeProcessLog() {
                    let url = "{{route('workOrderProcessLog.LogApi')}}";
                    let data = {
                        indemnity: this.processLog.indemnity,
                        work_order_id: this.processLog.work_order_id,
                        is_indemnity: this.processLog.is_indemnity,
                        remark: this.processLog.remark,
                        indemnitor: this.processLog.indemnitor,
                    };
                    if (!this.verifiedProcessLog()) return;
                    window.tempTip.setDuration(9999);
                    window.tempTip.setIndex(1999);
                    window.tempTip.waitingTip('操作中请稍后');
                    window.axios.post(url, data).then(res => {
                        window.tempTip.cancelWaitingTip();
                        window.tempTip.setDuration(2000);
                        if (res.data.success) {
                            window.tempTip.showSuccess('创建成功');
                            this.$set(this.workOrders[this.processLog.index], 'process_log', res.data.data);
                            $('#work-order-process-log-modal').modal('hide');
                        } else {
                            window.tempTip.show(res.data.message ? res.data.message : '创建异常，刷新页面重试');
                        }
                    }).catch(err => {
                        window.tempTip.setDuration(2000);
                        window.tempTip.show(err);
                    });
                },
                updateWorkOrderStatus(item, e, i) {
                    let url = "{{route('workOrder.updateStatusApi')}}";
                    let data = {
                        id: item.id,
                        work_order_status: e.target.value
                    }
                    window.tempTip.waitingTip('处理中......');
                    window.tempTip.setDuration('1999');
                    window.axios.post(url, data).then(res => {
                        window.tempTip.cancelWaitingTip();
                        window.tempTip.setDuration('1999');
                        if (res.data.success) {
                            item.work_order_status = data.work_order_status;
                            window.tempTip.showSuccess('修改成功');
                            return;
                        }
                        window.tempTip.show(res.data.message ? res.data.message : '修改失败');
                    }).catch(err => {
                        window.tempTip.show('修饰异常：' + err);
                    });
                },
                verifiedProcessLog() {   // 校验处理信息
                    window.tempTip.setIndex(1999);
                    window.tempTip.setDuration(2000);
                    if (this.processLog.is_indemnity === null) {
                        window.tempTip.show('选择处理方式');
                        return false;
                    }
                    if (parseInt(this.processLog.type) === 1 && this.processLog.indemnitor == null) {
                        window.tempTip.show('指定赔偿方');
                        return false;
                    }
                    if (this.processLog.is_indemnity === '1') {
                        if (!this.processLog.indemnity) {
                            window.tempTip.show('填写赔偿金额');
                            return false;
                        }
                    } else if (this.processLog.is_indemnity === '2') {
                        if (this.processLog.remark === null || this.processLog.remark.trim(' ').length === 0) {
                            window.tempTip.show('填写不赔偿理由');
                            return false;
                        }
                    }
                    return true;
                },
                logisticUpdateWorkOrderStatus(item,e){
                    let url = "{{route('workOrder.logisticUpdateStatusApi')}}";
                    let data = {id: item.id, work_order_status: e.target.value};
                    window.tempTip.waitingTip('处理中......');
                    window.tempTip.setDuration('1999');
                    window.axios.post(url, data).then(res => {
                        window.tempTip.cancelWaitingTip();
                        window.tempTip.setDuration('1999');
                        if (res.data.success) {
                            item.work_order_status = data.work_order_status;
                            window.tempTip.showSuccess('修改成功');
                            return;
                        }
                        window.tempTip.show(res.data.message ? res.data.message : '修改失败');
                    }).catch(err => {
                        window.tempTip.show('修饰异常：' + err);
                    });
                },
                pasteImage(event,imageArray){
                    for (let i = 0; i < event.clipboardData.items.length; i++) {
                        let item = event.clipboardData.items[i];
                        if (item.kind === 'string') continue;
                        if (item.type.indexOf('image') === -1) continue;
                        if (item.kind === 'file'){
                            let blob = item.getAsFile();
                            let src = null;
                            this.blobToBase64(blob).then(res => {
                                src  = res;
                                imageArray.push({src:src,file:blob});
                            });
                        }
                    }
                    event.preventDefault();
                },
                blobToBase64(blob) {
                    return new Promise((resolve, reject) => {
                        const fileReader = new FileReader();
                        fileReader.onload = (e) => {
                            resolve(e.target.result);
                        };
                        fileReader.readAsDataURL(blob);
                        fileReader.onerror = () => {
                            reject(new Error('blobToBase64 error'));
                        };
                    });
                },
            },
        });
    </script>
@endsection