<template>
    <div class="flex-container">
        <!-- 查询区域 -->
        <div class="table-page-search-wrapper">
            <!-- 搜索区域 -->
            <a-form layout="inline">
                <a-row :gutter="24">
                    <a-col :md="6" :sm="12">
                        <a-form-item label="时间选择：">
                            <a-range-picker @change="onChange" format="YYYY-MM-DD HH:mm:ss"/>
                        </a-form-item>
                    </a-col>
                    <a-col :md="3" :sm="6">
                        <a-form-item label="客户类型：">
                            <a-select v-model="queryParam.userType" style="width: 120px">
                                <a-select-option value>全部客户</a-select-option>
                                <a-select-option value="1">老用户办理</a-select-option>
                                <a-select-option value="0">新用户办理</a-select-option>
                                <a-select-option value="2">老用户续约</a-select-option>
                                <a-select-option value="3">融合办理</a-select-option>
                                <a-select-option value="4">抽奖业务</a-select-option>
                                <a-select-option value="5">单宽业务</a-select-option>
                                <a-select-option value="6">羊城通业务</a-select-option>
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :md="4" :sm="12">
                        <a-form-item label="订单编号：">
                            <a-input placeholder="订单编号" v-model="queryParam.orderNumber"></a-input>
                        </a-form-item>
                    </a-col>
                    <a-col :md="4" :sm="12">
                        <a-form-item label="客户姓名：">
                            <a-input placeholder="客户姓名" v-model="queryParam.customerName"></a-input>
                        </a-form-item>
                    </a-col>
                    <a-col :md="4" :sm="12">
                        <a-form-item label="办理号码：">
                            <a-input placeholder="办理号码" v-model="queryParam.businessNumber"></a-input>
                        </a-form-item>
                    </a-col>
                    <a-col :md="4" :sm="12">
                        <a-form-item label="联系号码：">
                            <a-input placeholder="联系号码" v-model="queryParam.contactNumber"></a-input>
                        </a-form-item>
                    </a-col>
                    <a-col :md="4" :sm="12">
                        <a-form-item label="合伙人姓名：">
                            <a-input placeholder="合伙人姓名" v-model="queryParam.hehuorenName"></a-input>
                        </a-form-item>
                    </a-col>
                    <a-col :md="4" :sm="12">
                        <a-form-item label="合伙人学校：">
                            <a-input placeholder="合伙人学校" v-model="queryParam.hehuorenSchool"></a-input>
                        </a-form-item>
                    </a-col>
                    <a-col :md="3" :sm="6">
                        <a-form-item label="状态：">
                            <a-select v-model="queryParam.orderStatus">
                                <a-select-option value>请选择</a-select-option>
                                <a-select-option value="待处理">待处理</a-select-option>
                                <a-select-option value="待选号">待选号</a-select-option>
                                <a-select-option value="待识别">待识别</a-select-option>
                                <a-select-option value="待活体">待活体</a-select-option>
                                <a-select-option value="审核中">审核中</a-select-option>
                                <a-select-option value="待审核">待配送</a-select-option>
                                <a-select-option value="待审核">待审核</a-select-option>
                                <a-select-option value="待受理">待受理</a-select-option>
                                <a-select-option value="已发货">已发货</a-select-option>
                                <a-select-option value="已完成">已完成</a-select-option>
                                <a-select-option value="异常单">异常单</a-select-option>
                                <a-select-option value="待派奖">待派奖</a-select-option>
                                <a-select-option value="已派奖">已派奖</a-select-option>
                                <a-select-option value="重新下单">重新下单</a-select-option>
                            </a-select>
                        </a-form-item>
                    </a-col>

                    <a-col :md="6" :sm="12">
                        <a-button @click="search()" type="primary">查询</a-button>
                        <a-button @click="handleSubmit" style="margin-left: 10px">导出</a-button>
                        <a-dropdown>
                            <a-menu slot="overlay" @click="handleMenuClick">
                                <a-menu-item key="1">
                                    <a-icon type="arrow-up"/>
                                    受理单
                                </a-menu-item>
                                <a-menu-item key="2">
                                    <a-icon type="arrow-up"/>
                                    快递
                                </a-menu-item>
                            </a-menu>
                            <a-button style="margin-left: 8px">
                                导入
                                <a-icon type="down"/>
                            </a-button>
                        </a-dropdown>
                    </a-col>
                </a-row>
            </a-form>
        </div>

        <!--列表-->
        <s-table
                :columns="columns"
                :data="rowdata"
                bordered
                ref="table"
                size="small"
                class="flex-filling"
                :locale="emptyText"
        >
            <!--拦截器-->
            <template slot="productLastUpdateTime" slot-scope="text">{{ text | dayjs}}</template>
            <!--拦截器-->
            <template slot="productCreateTime" slot-scope="text">{{ text | dayjs}}</template>
            <template slot="text" slot-scope="text">
                <p style="white-space: pre-line;">{{text}}</p>
            </template>

            <template slot="userType" slot-scope="text">
                <p v-if="text=='1'">老用户办理</p>
                <p v-if="text=='0'">新用户办理</p>
                <p v-if="text=='2'">老用户续约</p>
                <p v-if="text=='3'">融合办理</p>
                <p v-if="text=='4'">抽奖业务</p>
                <p v-if="text=='5'">单宽业务</p>
                <p v-if="text=='6'">羊城通业务</p>
            </template>
            <template slot="studentCardCheckStatus" slot-scope="text">
                <p v-if="text=='0'">未审核</p>
                <p v-if="text=='1'">已审核</p>
            </template>
            <template slot="operation" slot-scope="text, record">
        <span>
          <a @click="showDrawer(record)">查看</a>
          <a-divider type="vertical"/>
          <a @click="abnormal(record.id)">设为异常单</a>

          <a-divider v-if="record.orderStatus === '待审核' " type="vertical"/>
          <a v-show="record.orderStatus === '待审核'" @click="reviewStudentIdCard(record)">审核学生证</a>
        </span>
            </template>
        </s-table>
        <!----抽屉-->

        <a-drawer width="1280" placement="right" :closable="false" @close="onClose" :visible="visible">
            <a-form :form="orderInfo">
                <a-tabs type="card">
                    <a-tab-pane tab="订单基本信息" key="1" activeKey>
                        <a-divider orientation="left">基础信息</a-divider>
                        <a-row>
                            <a-col :span="6">
                                <p>客户名称：{{ orderInfo.customerName }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>卡品：{{ orderInfo.kapin }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>用户学校：{{ orderInfo.userSchool }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>小白卡单号：{{ orderInfo.xbOrderId }}</p>
                            </a-col>
                        </a-row>
                        <a-row>
                            <a-col :span="6">
                                <p>订单完成时间：{{ orderInfo.successTime | dayjs }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>学号：{{ orderInfo.studentNumber }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>班级：{{ orderInfo.classNumber }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>父母名字：{{ orderInfo.parentName }}</p>
                            </a-col>
                        </a-row>
                        <a-row>
                            <a-col :span="6">
                                <p>联系电话：{{ orderInfo.contactNumber }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>身份证号：{{ orderInfo.idCard }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>办理号码：{{ orderInfo.businessNumber }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>创建时间：{{ orderInfo.createTime | dayjs }}</p>
                            </a-col>
                        </a-row>

                        <a-row>
                            <a-col :span="6">
                                <p>地址：{{ orderInfo.address }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>省市县：{{ orderInfo.site }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>资费：{{ orderInfo.expenses }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>办理标识：{{ orderInfo.identifyin }}</p>
                            </a-col>
                        </a-row>
                        <a-row>
                            <a-col :span="12">
                                <p>备注：{{ orderInfo.remarks }}</p>
                            </a-col>
                            <a-col :span="12">
                                <p>错误原因：{{ orderInfo.checkFail }}</p>
                            </a-col>
                        </a-row>
                        <a-row>
                            <a-col :span="6">
                                <p>宽带账号：{{ orderInfo.netNumber }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>宽带密码：{{ orderInfo.netPassword }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>奖品账号：{{ orderInfo.giftAccount }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>奖品密码：{{ orderInfo.giftPassword }}</p>
                            </a-col>
                        </a-row>

                        <a-row>
                            <a-col :span="6">
                                <p>学生证审核状态：{{ orderInfo.studentCardCheckStatus }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>宽带订单id：{{ orderInfo.kdOrderId }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>智能平台订单号：{{ orderInfo.orderId }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>智能平台订单状态：{{ orderInfo.thStatus }}</p>
                            </a-col>
                        </a-row>
                        <a-divider orientation="left">附件</a-divider>
                        <div v-show="!imgShow">无附件</div>
                        <div v-show="imgShow" style="margin-bottom: 50px">
                            <a-carousel arrows dotsClass="slick-dots slick-thumb">
                                <a slot="customPaging" slot-scope="props">
                                    <img :src="getImgUrl(props.i)"/>
                                </a>
                                <div @click="pictureSize" v-for="item in certificatePhoto.length">
                                    <img :style="imgStype" :src="certificatePhoto[item - 1]"/>
                                </div>
                            </a-carousel>
                        </div>
                        <a-divider orientation="left">受理信息</a-divider>
                        <a-row>
                            <a-col :span="6">
                                <p>客户名称 ：{{ orderInfo.customerName }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>联系电话 ：{{ orderInfo.contactNumber }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>现有套餐 ：{{ orderInfo.nowPackage }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>升级套餐 ：{{ orderInfo.businessPackage }}</p>
                            </a-col>
                        </a-row>
                        <a-row>
                            <a-col :span="6">
                                <p>受理人：{{ orderInfo.acceptName }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>受理结果 ：{{ orderInfo.acceptResult }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>受理意见 ：{{ orderInfo.acceptComment }}</p>
                            </a-col>
                            <a-col :span="6">
                                <p>受理时间 ：{{ orderInfo.acceptDate | dayjs }}</p>
                            </a-col>
                        </a-row>
                    </a-tab-pane>

                    <a-tab-pane tab="操作日志" key="3">
                        <a-list :grid="{  column: 4 }" :dataSource="title">
                            <a-list-item slot="renderItem" slot-scope="item, index">
                                <a-card :title="item.title" :bordered="false">
                                    <a-card-grid style="width:100%;" v-for="item in abnormalInfo">
                                        <div
                                                style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;height: 20px"
                                        >
                                            <a-tooltip placement="left">
                                                <template slot="title">{{item[index]}}</template>
                                                {{ item[index] }}
                                            </a-tooltip>
                                        </div>
                                    </a-card-grid>
                                </a-card>
                            </a-list-item>
                        </a-list>
                    </a-tab-pane>
                </a-tabs>
            </a-form>
        </a-drawer>
        <a-modal
                title="批量导入"
                :visible="modifyvisible"
                @ok="createfunctionOk"
                @cancel="createfunctionCancel"
                html-type="submit"
                width="400px"
        >
            <a-row :gutter="24">
                <a-col :md="24" :sm="12">
                    <p style="text-align:center">{{ importTile }}</p>
                </a-col>
            </a-row>
            <import-btn :url="importUrl" :responseFun="doPush">
                <a-tooltip placement="topLeft" title="导入文件" arrowPointAtCenter>
                    <a-row :gutter="24">
                        <a-col :md="24" :sm="12">
                            <p>
                                选择文件：
                                <a-button type="primary">选择文件</a-button>
                            </p>
                        </a-col>
                    </a-row>
                </a-tooltip>
            </import-btn>
            <a-row :gutter="24">
                <a-col :md="24" :sm="12">
                    <p v-show="YRYMmoBan">
                        模板下载：
                        <a-button type="primary" @click="downloadMoBan">一人一码受理单模板</a-button>
                    </p>
                    <p v-show="KDmoBan">
                        模板下载：
                        <a-button type="primary" @click="downloadMoBanKD">快递清单模板</a-button>
                    </p>
                </a-col>
            </a-row>
            <a-row :gutter="24" :v-show="KDmoBan">
                <a-col :md="24" :sm="12">
                    <p>说明：</p>
                    <p>1.批量导入请严格按照模版进行导入;</p>
                </a-col>
            </a-row>
        </a-modal>

        <a-modal
                title="学生证审核"
                :visible="review"
                @ok="reviewOk"
                @cancel="reviewCancel"
                html-type="submit"
                width="1024px"
        >
            <div align="center">
                <img :src="reviewStudentImg"/>
            </div>
            <a-row :gutter="24" style="text-align: right">
                <a-col :md="6" :sm="12">
                    <p>审核状态：</p>
                </a-col>
                <a-col :md="6" :sm="12">
                    <a-radio-group :options="options" v-model="reviewStudent.studentCardCheckStatus"/>
                </a-col>
            </a-row>
            <a-row :gutter="24" style="text-align: right">
                <a-col :md="6" :sm="12">
                    <p>审核不通过原因：</p>
                </a-col>
                <a-col :md="12" :sm="12">
                    <a-input placeholder="审核不通过原因" v-model="reviewStudent.checkFail"></a-input>
                </a-col>
            </a-row>
        </a-modal>
    </div>
</template>

<script>
    import STable from "@/components/table";
    import {
        orderList,
        download,
        abnormal,
        selectOrderHis,
        downloadMoBan,
        downloadMoBanKD,
        reviewStudentIdCard
    } from "../../../api/school-center/orderAPI";
    import {cloneObject, exportFile} from "@/utils/util";
    import moment from "moment";
    import ConstantActivity from "@/constant/ConstantActivity";
    import ImportBtn from "../../../components/sysmanage/ImportBtn";

    const options = [
        {label: "审核通过", value: "1"},
        {label: "审核不通过", value: "0"}
    ];
    export default {
        name: "orderView",
        components: {
            STable,
            ImportBtn
        },
        data() {
            return {
                emptyText: {emptyText: '暂无数据'},
                reviewStudentImg: "",
                reviewStudent: {
                    id: "",
                    checkFail: "",
                    studentCardCheckStatus: ""
                },
                options,
                review: false,
                imgShow: false,
                imgStype: {width: "300px", heigth: "300px"},
                baseUrl:
                    "https://raw.githubusercontent.com/vueComponent/ant-design-vue/master/components/vc-slick/assets/img/react-slick/",
                certificatePhoto: [],
                childrenDrawer: false,
                YRYMmoBan: false,
                KDmoBan: false,
                importUrl: "",
                importTile: "",
                modifyvisible: false,
                title: ConstantActivity.title,
                Formtable: this.$form.createForm(this),
                visible: false,
                abnormalInfo: [],
                pStyle: {
                    fontSize: "16px",
                    color: "rgba(0,0,0,0.85)",
                    lineHeight: "24px",
                    display: "block",
                    marginBottom: "16px"
                },
                pStyle2: {
                    marginBottom: "24px"
                },
                apis: '',
                queryParam: {
                    createTimeStart: "",
                    createTimeEnd: "",
                    userType: "",
                    orderNumber: "",
                    customerName: "",
                    businessNumber: "",
                    contactNumber: "",
                    hehuorenSchool: "",
                    hehuorenName: "",
                    orderStatus: ""
                },
                orderInfo: {},
                columns: [
                    {dataIndex: "customerName", width: 100, title: "客户姓名", fixed: "left"},
                    {dataIndex: "orderNumber", width: 200, title: "订单编号", fixed: "left"},
                    {dataIndex: "orderStatus", width: 100, title: "订单状态"},
                    {
                        dataIndex: "studentCardCheckStatus",
                        width: 100,
                        title: "学生证状态",
                        scopedSlots: {customRender: "studentCardCheckStatus"}
                    },
                    {dataIndex: "businessPackage", width: 120, title: "升级套餐"},
                    {
                        dataIndex: "userType",
                        width: 100,
                        title: "订单类型",
                        scopedSlots: {customRender: "userType"}
                    },
                    {dataIndex: "contactNumber", width: 160, title: "联系号码"},
                    {dataIndex: "businessNumber", width: 160, title: "办理号码"},
                    {dataIndex: "kapin", width: 200, title: "办理套餐"},
                    {dataIndex: "hehuorenSchool", width: 220, title: "合伙人学校"},
                    {dataIndex: "hehuorenName", width: 150, title: "合伙人姓名"},
                    {dataIndex: "hehuorenPhone", width: 150, title: "合伙人手机"},
                    {
                        dataIndex: "operation",
                        width: 180,
                        title: "操作",
                        scopedSlots: {customRender: "operation"},
                        fixed: "right"
                    }
                ],
                rowdata: parameter => {
                    const env = process.env.NODE_ENV; //获取当前环境
                    if (env === 'development') {     //测试环境默认添加前缀
                        this.apis = '/api/';
                    }
                    let params = {
                        pageNo: parameter.pageNo,
                        pageSize: parameter.pageSize
                    };

                    let obj = cloneObject(this.queryParam);
                    //表示
                    return orderList(Object.assign(params, obj)).then(res => {
                        let data = {};
                        if (res.state !== "success") {
                            this.$message.error("查询失败！", 5);
                            this.emptyText.emptyText = '查询失败！'
                            data = {
                                data: [],
                                pageSize: parameter.pageSize,
                                pageNo: 1,
                                totalCount: 0
                            };
                        } else {
                            data = {
                                data: res.data.records,
                                pageSize: parameter.pageSize,
                                pageNo: parameter.pageNo,
                                totalCount: res.data.total
                            };
                        }
                        return data;
                    });
                }
            };
        },
        methods: {
            moment,
            handleMenuClick(e) {
                if (e.key == "1") {
                    this.handleSubmit1();
                }
                if (e.key == "2") {
                    this.handleSubmit2();
                }
            },
            reviewStudentIdCard(res) {
                this.reviewStudentImg = this.apis + res.studenCard;
                /*this.reviewStudentImg =this.baseUrl+'abstract0'+1+'.jpg'*/
                this.reviewStudent.studentCardCheckStatus = res.studentCardCheckStatus;
                this.reviewStudent.checkFail = res.checkFail;
                this.reviewStudent.id = res.id;
                this.review = true;
            },
            reviewOk() {
                if (this.reviewStudent.studentCardCheckStatus == "0") {
                    if (
                        this.reviewStudent.checkFail == "" ||
                        this.reviewStudent.checkFail == undefined
                    ) {
                        this.$notification.error({
                            message: "审核不通过必须填写不通过原因！",
                            description: "",
                            duration: 4
                        });
                    }
                } else {
                    if (
                        this.reviewStudent.checkFail != "" &&
                        this.reviewStudent.checkFail != undefined
                    ) {
                        this.$notification.error({
                            message: "审核通过无须填写不通过原因！",
                            description: "",
                            duration: 4
                        });
                    }
                }
                if (
                    this.reviewStudent.checkFail == "" ||
                    this.reviewStudent.checkFail == undefined
                ) {
                    this.reviewStudent.checkFail == "";
                }
                let obj = cloneObject(this.reviewStudent);
                reviewStudentIdCard(Object.assign(obj)).then(res => {
                    if (res.state == "success") {
                        this.$notification.success({
                            message: "审核成功！",
                            description: "",
                            duration: 4
                        });
                        this.search();
                    } else {
                        this.$notification.error({
                            message: "审核失败！",
                            description: "",
                            duration: 4
                        });
                    }
                });
                this.reviewClear();
            },
            reviewCancel() {
                this.reviewClear();
            },
            reviewClear() {
                this.reviewStudentImg = "";
                this.reviewStudent.id = "";
                this.reviewStudent.studentCardCheckStatus = "";
                this.reviewStudent.checkFail = "";
                this.review = false;
            },
            pictureSize() {
                if (this.imgStype.width == "700px") {
                    this.imgStype = {width: "300px", heigth: "300px"};
                } else {
                    this.imgStype = {width: "700px", heigth: "500px"};
                }
            },
            getImgUrl(i) {
                return this.certificatePhoto[i];
            },
            showChildrenDrawer() {
                this.childrenDrawer = true;
            },
            onChildrenDrawerClose() {
                this.childrenDrawer = false;
            },
            downloadMoBan: function () {
                exportFile(downloadMoBan(), "一人一码受理单.xlsx");
            },
            downloadMoBanKD: function () {
                exportFile(downloadMoBanKD(), "快递清单.xlsx");
            },
            // 执行上传
            doPush(res) {
                console.log(res);
                if (!res || !res.response) {
                    this.$message.error("上传文件出错！", 10);
                    return false;
                }
                const response = res.response;
                if (response.state !== "success") {
                    this.$message.error(response.msg ? response.msg : "上传文件出错！", 10);
                    return false;
                }
                this.$message.success("上传成功！" + response.data, 5);
            },
            createfunctionCancel() {
                this.modifyvisible = false;
                this.clearmodel();
            },
            clearmodel() {
                this.importTile = "";
                this.YRYMmoBan = false;
                this.KDmoBan = false;
                this.importUrl = "";
            },
            createfunctionOk() {
                this.modifyvisible = false;
                this.clearmodel();
            },
            handleSubmit1() {
                this.importTile = "批量导入受理单";
                this.YRYMmoBan = true;
                this.importUrl = "manager/ciop/order/importDate";
                this.modifyvisible = true;
            },
            handleSubmit2() {
                this.importTile = "批量导入快递清单";
                this.KDmoBan = true;
                this.importUrl = "manager/ciop/order/importExpressDelivery";
                this.modifyvisible = true;
            },
            search() {
                this.$refs.table.refresh({search: true});
            },
            onClose() {
                this.certificatePhoto = [];
                this.orderInfo = {
                    acceptResult: "",
                    nowPackage: "",
                    businessPackage: "",
                    acceptName: "",
                    acceptComment: "",
                    acceptDate: "",
                    customerName: "",
                    kapin: "",
                    userSchool: "",
                    xbOrderId: "",
                    successTime: "",
                    orderId: "",
                    studentNumber: "",
                    classNumber: "",
                    parentName: "",
                    contactNumber: "",
                    idCard: "",
                    businessNumber: "",
                    createTime: "",
                    address: "",
                    site: "",
                    remarks: "",
                    checkFail: "",
                    expenses: "",
                    identifying: "",
                    netNumber: "",
                    netPassword: "",
                    giftAccount: "",
                    giftPassword: "",
                    kuaidiOrder: "",
                    company: "",
                    studentCardCheckStatus: "",
                    kdOrderId: "",
                    thStatus: ""
                };
                this.visible = false;
            },
            showDrawer(data) {
                this.certificatePhoto.push(this.apis + data.idCardz);
                this.certificatePhoto.push(this.apis + data.idCardf);
                this.certificatePhoto.push(this.apis + data.idCardzs);
                this.certificatePhoto.push(this.apis + data.studenCard);
                /* this.certificatePhoto.push('http://yrym.winsun-aly.com/gdtel-xyzx-hhr/images/yrym-ruanyan-logo.png')
                          this.certificatePhoto.push('http://yrym.winsun-aly.com/gdtel-xyzx-hhr/images/yrym-ruanyan-logo.png')
                          this.certificatePhoto.push('http://yrym.winsun-aly.com/gdtel-xyzx-hhr/images/yrym-ruanyan-logo.png')
                          this.certificatePhoto.push('http://yrym.winsun-aly.com/gdtel-xyzx-hhr/images/yrym-ruanyan-logo.png')*/
                if (
                    this.certificatePhoto[0] == '/api/null' &&
                    this.certificatePhoto[1] == '/api/null' &&
                    this.certificatePhoto[2] == '/api/null' &&
                    this.certificatePhoto[3] == '/api/null'
                ) {
                    this.imgShow = false;
                } else {
                    this.imgShow = true;
                }
                this.orderInfo = {
                    acceptResult: data.acceptResult,
                    nowPackage: data.nowPackage,
                    businessPackage: data.businessPackage,
                    acceptName: data.acceptName,
                    acceptComment: data.acceptComment,
                    acceptDate: data.acceptDate,
                    customerName: data.customerName,
                    kapin: data.kapin,
                    userSchool: data.userSchool,
                    xbOrderId: data.xbOrderId,
                    successTime: data.successTime,
                    orderId: data.orderId,
                    studentNumber: data.studentNumber,
                    classNumber: data.classNumber,
                    parentName: data.parentName,
                    contactNumber: data.contactNumber,
                    idCard: data.idCard,
                    businessNumber: data.businessNumber,
                    createTime: data.createTime,
                    address: data.address,
                    site: data.site,
                    remarks: data.remarks,
                    checkFail: data.checkFail,
                    expenses: data.expenses,
                    identifying: data.identifying,
                    netNumber: data.netNumber,
                    netPassword: data.netPassword,
                    giftAccount: data.giftAccount,
                    giftPassword: data.giftPassword,
                    kuaidiOrder: data.kuaidiOrder,
                    company: data.company,
                    studentCardCheckStatus: data.studentCardCheckStatus,
                    kdOrderId: data.kdOrderId,
                    thStatus: data.thStatus
                };
                this.selectOrderHis(data.id);
                this.visible = true;
            },
            //时间事件
            onChange(date, dateString) {
                if (dateString.length == 0) {
                    this.queryParam.createTimeStart = "";
                    this.queryParam.createTimeEnd = "";
                } else {
                    this.queryParam.createTimeStart = dateString[0];
                    this.queryParam.createTimeEnd = dateString[1];
                }
            },
            handleSubmit() {
                let downqueryParam = this.queryParam;
                download(downqueryParam).then(res => {
                    if (res.state == "success") {
                        this.search();
                        this.$message.success(res.data, 5);
                    } else {
                        this.$message.error(res.msg, 5);
                    }
                })
                /* if (this.callback == true) {
                   this.$message.warn("正在导出中...", 5);
                 }
                 let downqueryParam = this.queryParam;
                 let nowdate = moment().format("YYYY-MM-DD");
                 this.callback = true;
                 exportFile(
                   download(downqueryParam),
                   "订单清单" + nowdate + ".xls",
                   this.downloadstatu
                 );*/
            },
            /*   downloadstatu(exportId) {
                let nowdate = moment().format("YYYY-MM-DD");
                exportFile(
                        uploadExcel({exportId}),
                  "订单清单" + nowdate + ".xls",
                );
               },*/
            selectOrderHis(orderId) {
                selectOrderHis({orderId}).then(res => {
                    let liu = res.data;
                    for (let i = 0; i < liu.length; i++) {
                        let resdate = [];
                        resdate.push(liu[i]["operator"]);
                        let startTime = moment(new Date(liu[i]["create_date"])).format(
                            this.YYYY_MM_DD_HH_MI_SS
                        );
                        resdate.push(startTime);
                        resdate.push(liu[i]["status"]);
                        this.abnormalInfo.push(resdate);
                    }
                });
            },
            abnormal(orderId) {
                abnormal({orderId}).then(res => {
                    if (res.state == "success") {
                        this.search();
                        this.$message.success(res.data, 5);
                    } else {
                        this.$message.error(res.msg, 5);
                    }
                });
            }
        }
    };
</script>

<style scoped>
    .ant-carousel >>> .slick-dots {
        height: auto;
    }

    .ant-carousel >>> .slick-slide img {
        border: 5px solid #fff;
        display: block;
        margin: auto;
        max-width: 80%;
    }

    .ant-carousel >>> .slick-thumb {
        bottom: -45px;
    }

    .ant-carousel >>> .slick-thumb li {
        width: 60px;
        height: 45px;
    }

    .ant-carousel >>> .slick-thumb li img {
        width: 100%;
        height: 100%;
        filter: grayscale(100%);
    }

    .ant-carousel >>> .slick-thumb li.slick-active img {
        filter: grayscale(0%);
    }
</style>
