<template>
    <div>
        <el-card class="el-card">

            <el-form
                :inline="true"
                :model="codeQuery"
                class="query-form"
                size="mini"
                @submit.native.prevent
            >
                <el-row>
                    <el-form-item class="query-form-item">
                        <el-input v-model="codeQuery.code" placeholder="扫码查询"
                                  clearable="true"
                                  style="width: 500px"
                                  @keyup.enter.native="keyup_submit($event)"></el-input>
                    </el-form-item>
                </el-row>
            </el-form>

            <el-form
                :inline="true"
                :model="filterQuery"
                size="mini"
            >
                <el-row>
                    <el-form-item class="query-form-item">
                        <el-input v-model="filterQuery.id" placeholder="单号"></el-input>
                    </el-form-item>

                    <!-- <el-form-item class="query-form-item">
                      <el-select
                        v-model="filterQuery.exportStatus"
                        placeholder="上传状态"
                      >
                        <el-option label="全部" value=""></el-option>
                        <el-option label="已上传" value="已上传"></el-option>
                        <el-option label="未上传" value="未上传"></el-option>
                      </el-select>
                    </el-form-item> -->

                    <el-form-item class="query-form-item">
                        <el-select
                            v-model="filterQuery.mainAction"
                            placeholder="出入库类型"
                        >
                            <el-option label="全部" value=""></el-option>
                            <el-option label="入库" value="WareHouseIn"></el-option>
                            <el-option label="出库" value="WareHouseOut"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item class="query-form-item">
                        <el-select v-model="filterQuery.action" placeholder="请选择业务类型">
                            <el-option
                                v-for="item in busTypes"
                                :key="item.name"
                                :label="item.name"
                                :value="item.action">
                                <span style="float: left">{{ item.name }}</span>
                            </el-option>
                        </el-select>
                    </el-form-item>

                    <el-form-item class="query-form-item">
            <span style="color: #000; margin-left: 10px; margin-right: 6px"
            >创建日期:</span
            >
                        <el-date-picker
                            :picker-options="pickerOptions"
                            v-model="actDateRange"
                            type="daterange"
                            format="yyyy 年 MM 月 dd 日"
                            value-format="yyyy-MM-dd"
                            range-separator="至"
                            start-placeholder="开始日期"
                            end-placeholder="结束日期"
                        >
                        </el-date-picker>
                    </el-form-item>
                    <el-form-item>
                        <el-button-group>
                            <el-button
                                type="primary"
                                icon="el-icon-refresh"
                                @click="onReset"
                            ></el-button>
                            <el-button type="primary" icon="search" @click="onSubmit"
                            >查询
                            </el-button
                            >

                            <el-button type="primary" icon="search" @click="mergesOrders"
                            >合并单号
                            </el-button
                            >
                        </el-button-group>
                    </el-form-item>
                </el-row>
            </el-form>
            <el-table
                v-loading="loading"
                :data="list"
                style="width: 100%"
                @row-click="getOrderDetail"
                highlight-current-row
                @selection-change="handleSelectionChange"
            >
                <el-table-column type="selection" width="55"></el-table-column>
                <el-table-column label="序号" type="index"></el-table-column>
                <el-table-column label="业务类型" prop="action">
                    <template slot-scope="scope">
                        <span>{{ geActionName(scope.row.action) }}</span>
                    </template>
                </el-table-column>
                <el-table-column
                    label="订单号"
                    prop="orderId"
                    show-overflow-tooltip="true"
                ></el-table-column>
                <!-- <el-table-column
                  label="来源订单号"
                  prop="corpOrderId"
                  :show-overflow-tooltip="true"
                ></el-table-column> -->
                <el-table-column label="来源" prop="fromType"></el-table-column>
                <el-table-column label="往来单位" prop="fromCorp" width="220">
                    <template slot-scope="scope">
                        <p v-if="scope.row.fromCorp == null">
                            <el-button
                                type="primary"
                                size="mini"
                                @click.native.stop="handleUnitClick(scope.row)"
                            >选择往来单位
                            </el-button
                            >
                        </p>
                        <p v-if="scope.row.fromCorp != null">
                            <el-button
                                type="primary"
                                size="mini"
                                @click.native.stop="handleUnitClick(scope.row)"
                            >{{ scope.row.fromCorp }}
                            </el-button
                            >
                        </p>
                    </template>
                </el-table-column>
                <el-table-column
                    label="创建时间"
                    prop="actDate"
                    width="120"
                    show-overflow-tooltip="true"
                >
                    <template slot-scope="scope">
                        <i class="el-icon-time"></i>
                        <span>{{ scope.row.actDate }}</span>
                    </template>
                </el-table-column>

                <!-- <el-table-column label="上传状态" prop="exportStatus"></el-table-column> -->
                <el-table-column label="操作" fixed="right" width="230">
                    <template slot-scope="scope">
                        <el-button
                            type="text"
                            size="small"
                            @click.native.stop="intentDetail(scope.row)"
                        >详情
                        </el-button
                        >

                        <el-button
                            type="text"
                            size="small"
                            @click.native.stop="deleteDialog(scope.row.orderId)"
                        >删除
                        </el-button
                        >
                    </template>
                </el-table-column>
            </el-table>
            <el-pagination
                :page-size="query.limit"
                @current-change="handleCurrentChange"
                layout="prev, pager, next"
                :total="total"
            ></el-pagination>
        </el-card>

        <el-card class="el-card">
            <el-table
                v-loading="loading"
                :row-class-name="tableRowClassName"
                :data="detailList"
                style="width: 100%"
            >
                <el-table-column label="序号" type="index"></el-table-column>

                <el-table-column
                    label="产品通用名"
                    prop="coName"
                    :show-overflow-tooltip="true"
                ></el-table-column>
                <el-table-column
                    label="包装规格"
                    prop="packSpec"
                    :show-overflow-tooltip="true"
                ></el-table-column>
                <el-table-column
                    label="批次号"
                    prop="lotno"
                    :show-overflow-tooltip="true"
                ></el-table-column>
                <el-table-column
                    label="生产日期"
                    prop="produceDate"
                    :show-overflow-tooltip="true"
                ></el-table-column>
                <el-table-column
                    label="失效日期"
                    prop="expireDate"
                    :show-overflow-tooltip="true"
                ></el-table-column>
                <el-table-column label="扫码数量" prop="count"></el-table-column>
                <el-table-column
                    label="医疗器械注册人"
                    prop="productCompany"
                    :show-overflow-tooltip="true"
                ></el-table-column>
                <el-table-column
                    label="批准文号"
                    prop="authCode"
                    :show-overflow-tooltip="true"
                ></el-table-column>
            </el-table>
        </el-card>
        <el-dialog
            title="选择往来单位"
            :visible.sync="dialogTableVisible"
            width="70%"
        >
            <el-form :inline="true" :model="query" class="query-form" size="mini">
                <el-form-item class="query-form-item">
                    <el-input v-model="unitquery.key" placeholder="搜索"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button
                        type="primary"
                        icon="search"
                        @click.native.stop="getUnitList()"
                    >查询
                    </el-button
                    >
                </el-form-item>
            </el-form>

            <el-table
                v-loading="loading"
                :data="unitlist"
                style="width: 100%"
                @row-click="selectUnit"
            >
                <el-table-column label="往来单位ID" prop="unitId"></el-table-column>
                <el-table-column
                    label="往来单位名称"
                    prop="name"
                    show-overflow-tooltip
                ></el-table-column>
                <el-table-column
                    label="往来单位简写"
                    prop="spell"
                    show-overflow-tooltip
                ></el-table-column>
            </el-table>
        </el-dialog>
        <el-dialog
            title="选择erp业务单据"
            :visible.sync="addDialogVisible"
            width="80%"
            v-if="addDialogVisible"
        >
            <selectErpOrder
                v-on:closeManuDialog="closeManuDialog"
                :orderId="orderId"
            ></selectErpOrder>
        </el-dialog>

        <el-dialog
            title="单号详情"
            :visible.sync="codeDetailVisible"
            width="80%"
            v-if="codeDetailVisible"
        >
            <codeDetail
                :idQuery="idQuery"
                v-on:closeDetailDialog="closeDetailDialog"
            ></codeDetail>
        </el-dialog>

        <el-dialog title="校验信息" :visible.sync="errDialogVisible" width="30%">
            <span>{{ errorDetail }}</span>
            <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="errDialogVisible = false"
        >关 闭</el-button
        >
      </span>
        </el-dialog>
    </div>
</template>

<script>
    import {
        filterCode,
        codeList,
        findAllByOrderId,
        updateUnit,
        filterOrder,
        deleteByOrderId,
        updateExportStatus,
        uploadOrder,
        mergeOrder,
        orderDetail,
    } from "../../api/warehouse/order";

    import {unitListBykey} from "../../api/warehouse/unit";
    import draggable from "vuedraggable";
    import {saveAs} from "file-saver";
    import codeDetail from "./code";
    import {getBusType} from "../../api/warehouse/BusRole";

    const formJson = {
        site_id: "",
        site_name: "",
        describe: "",
        ads: [],
    };
    export default {
        props: {
            isSelect: {
                type: Boolean,
                default: false,
            },
        },

        data() {
            return {
                query: {
                    page: 1,
                    limit: 20,
                },
                codeQuery: {code: null},
                checkStatus: {
                    error: "校验异常",
                    null: "未校验",
                    success: "正常",
                },
                //往来单位
                unitquery: {key: "", page: 1, limit: 20},
                unitlist: [],
                list: [],
                detailList: [],
                unitUpdateQuery: {
                    id: null,
                    fromCorpId: null,
                    fromCorp: null,
                    orderId: null,
                },
                busTypes: [],
                actDateRange: [],
                filterQuery: {
                    id: "",
                    mainAction: null,
                    action: null,
                    page: 1,
                    limit: 10,
                    code: "",
                    status: "success",
                    exportStatus: null,
                    contrastStatus: null,
                    startTime: null,
                    endTime: null,
                },
                detailQuery: {
                    orderId: "",
                },
                deleteData: {
                    orderId: "",
                },
                idQuery: {
                    id: "",
                },
                curIndex: null,
                curOrderId: null,
                adListNoDataText: "无数据",
                queryAdIdAsyncLoading: false,
                codeDetailVisible: false,
                total: 0,
                loading: true,
                index: null,
                formName: null,
                orderId: "",
                formMap: {
                    add: "新增",
                    edit: "编辑",
                },
                exportQuery: {
                    orderId: "",
                    exportStatus: "",
                },

                uploadQuery: {
                    orderId: "",
                },

                multipleSelection: [],
                dialogTableVisible: false,
                formLoading: false,
                formVisible: false,
                formData: formJson,
                deleteLoading: false,
                addDialogVisible: false,
                errDialogVisible: false,
                pickerOptions: {
                    shortcuts: [
                        {
                            text: "最近一周",
                            onClick(picker) {
                                const end = new Date();
                                const start = new Date();
                                start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                                picker.$emit("pick", [start, end]);
                            },
                        },
                        {
                            text: "最近一个月",
                            onClick(picker) {
                                const end = new Date();
                                const start = new Date();
                                start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                                picker.$emit("pick", [start, end]);
                            },
                        },
                        {
                            text: "最近三个月",
                            onClick(picker) {
                                const end = new Date();
                                const start = new Date();
                                start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                                picker.$emit("pick", [start, end]);
                            },
                        },
                    ],
                },
            };
        },
        components: {
            draggable,
            codeDetail,
        },
        methods: {
            onReset() {
                this.$router.push({
                    path: "",
                });
                this.filterQuery = {
                    id: "",
                    mainAction: null,
                    action: null,
                    page: 1,
                    limit: 10,
                    code: "",
                    status: "success",
                    exportStatus: null,
                    contrastStatus: null,
                    startTime: null,
                    endTime: null,
                };
                this.actDateRange = [];
                this.getList();
            },
            onSubmit() {
                if (this.actDateRange != null) {
                    this.filterQuery.startTime = this.actDateRange[0];
                    this.filterQuery.endTime = this.actDateRange[1];
                } else {
                    this.filterQuery.startTime = null;
                    this.filterQuery.endTime = null;
                }
                this.getList();
            },
            handleSizeChange(val) {
                this.filterQuery.limit = val;
                this.getList();
            },
            handleCurrentChange(val) {
                this.filterQuery.page = val;
                this.getList();
            },
            handleSelectionChange(val) {
                console.log(val);
                this.multipleSelection = val;
            },
            geActionName(action) {
                for (let i = 0; i < this.busTypes.length; i++) {
                    if (this.busTypes[i].action === action) {
                        return this.busTypes[i].name;
                    }
                }
            },
            handleErrorDetail(poistion) {
                var mOrder = this.list[poistion];
                this.errorDetail = mOrder.remark;
                this.errDialogVisible = true;
            },
            getBusType() {
                let query = {};
                getBusType(query)
                    .then((response) => {
                        this.busTypes = response.data.list || [];
                    })
                    .catch(() => {
                    });
            },
            mergesOrders() {
                var repeatData = this.multipleSelection;
                if (repeatData.length <= 1) {
                    this.$message.warning("选择的订单需大于1");
                    return;
                }
                var orderid = repeatData[0].orderId;
                var unit = repeatData[0].fromCorp;
                var action = repeatData[0].action;
                var orderList = [];
                repeatData.forEach((obj, index) => {
                    if (unit != obj.fromCorp) {
                        this.$message.warning("往来单位不一致！");
                        return;
                    }
                    if (action != obj.action) {
                        this.$message.warning("业务类型不一致！");
                        return;
                    }
                    orderList.push(obj.orderId);
                });
                var tquery = {
                    orderList: orderList,
                };

                this.$confirm(
                    "所选择的订单将会合并到订单号为" + orderid + "的订单下",
                    "提示",
                    {
                        confirmButtonText: "确定",
                        cancelButtonText: "取消",
                        type: "warning",
                    }
                )
                    .then(() => {
                        mergeOrder(tquery).then((response) => {
                            if (response.code == 20000) {
                                this.getList();
                                this.$message({
                                    type: "success",
                                    message: "合并成功",
                                });
                            } else {
                                this.$message.error(response.message);
                            }
                        });
                    })
                    .catch(() => {
                    });
            },
            //获取订单列表
            getList() {
                this.loading = true;
                filterOrder(this.filterQuery)
                    .then((response) => {
                        this.loading = false;
                        this.list = response.data.list || [];
                        this.detailList = [];
                        this.total = response.data.total || 0;
                    })
                    .catch(() => {
                        this.loading = false;
                        this.list = [];
                        this.detailList = [];
                        this.total = 0;
                    });
            },
            //业务明细表
            getOrderDetail(row) {
                this.loading = true;
                this.detailQuery = {
                    orderId: row.orderId,
                };
                this.refresgOrderDetail();
            },
            repeatCheckClick(row) {
                let tQuery = {
                    orderId: row.orderId,
                };
                this.loading = true;
                repeatCheck(tQuery)
                    .then((response) => {
                        this.loading = false;
                        if (response.code == 20000) {
                            this.$message.success(response.data);
                            this.getList();
                            this.detailQuery = {
                                orderId: row.orderId,
                            };
                            this.refresgOrderDetail();
                        } else {
                            this.$message.error(response.message);
                        }
                    })
                    .catch(() => {
                        this.loading = false;
                        this.getList();
                        this.$message.error(response.message);
                    });
            },
            refresgOrderDetail() {
                orderDetail(this.detailQuery)
                    .then((response) => {
                        this.loading = false;
                        this.detailList = response.data || [];
                    })
                    .catch(() => {
                        this.loading = false;
                        this.detailList = [];
                    });
            },
            keyup_submit(event) {
                console.log("全选----");
                filterCode(this.codeQuery).then((response) => {
                    this.loading = false;
                    this.list = response.data.list || [];
                    this.detailList = [];
                    this.total = response.data.total || 0;
                })
                    .catch(() => {
                        this.loading = false;
                    });
                event.target.select();
            },
            handleUnitClick(row) {
                this.curIndex = row.id;
                this.curOrderId = row.orderId;
                this.dialogTableVisible = true;
            },
            getUnitList() {
                this.loading = true;
                unitListBykey(this.unitquery)
                    .then((response) => {
                        this.loading = false;
                        this.unitlist = response.data.list || [];
                    })
                    .catch(() => {
                        this.loading = false;
                    });
            },

            intentDetail(row) {
                // this.$router.push({
                //   path: "../inout/detail",
                //   query: { id: row.id },
                // });

                this.codeDetailVisible = true;
                this.idQuery.id = row.orderId;
            },

            selectUnit(row) {
                console.log(row.id);
                this.unitUpdateQuery.id = this.curIndex;
                this.unitUpdateQuery.fromCorp = row.name;
                this.unitUpdateQuery.fromCorpId = row.unitId;
                this.unitUpdateQuery.orderId = this.curOrderId;
                updateUnit(this.unitUpdateQuery)
                    .then((response) => {
                        this.dialogTableVisible = false;
                        this.getList();
                    })
                    .catch(() => {
                        this.dialogTableVisible = false;
                    });
            },
            deleteOrders(data) {
                this.loading = true;
                this.deleteData.orderId = data;
                deleteByOrderId(this.deleteData)
                    .then((response) => {
                        this.getList();
                        this.refresgOrderDetail();
                        this.$message({
                            type: "success",
                            message: "删除成功！",
                        });
                    })
                    .catch(() => {
                    });
            },
            tableRowClassName({row, rowIndex}) {
                if (row.dtlgoodsqty == row.count) {
                    return "success-row";
                } else {
                    return "warning-row";
                }
            },

            exportDialog(value) {
                var mOrder = value;
                if (mOrder.exportStatus == "已上传") {
                    this.$confirm("该订单已修改, 是否继续?", "提示", {
                        confirmButtonText: "确定",
                        cancelButtonText: "取消",
                        type: "warning",
                    })
                        .then(() => {
                            this.uploadOrderDialog(mOrder);
                        })
                        .catch(() => {
                        });
                } else if (mOrder.contrastStatus == "error") {
                    this.$confirm("该订单校验异常, 是否继续?", "提示", {
                        confirmButtonText: "确定",
                        cancelButtonText: "取消",
                        type: "warning",
                    })
                        .then(() => {
                            this.uploadOrderDialog(mOrder);
                        })
                        .catch(() => {
                        });
                } else if (mOrder.contrastStatus == null) {
                    this.$confirm("该订单未校验, 是否继续?", "提示", {
                        confirmButtonText: "确定",
                        cancelButtonText: "取消",
                        type: "warning",
                    })
                        .then(() => {
                            this.uploadOrderDialog(mOrder);
                        })
                        .catch(() => {
                        });
                } else {
                    this.$confirm("是否确定修改ERP订单?", "提示", {
                        confirmButtonText: "确定",
                        cancelButtonText: "取消",
                        type: "warning",
                    })
                        .then(() => {
                            this.uploadOrderDialog(mOrder);
                        })
                        .catch(() => {
                        });
                }
            },

            exportXml(poistion) {
                this.loading = true;
                var mOrder = this.list[poistion];
                var corpOrderId = mOrder.id;
                var codeArry;
                this.query = {
                    corpOrderId: corpOrderId,
                    page: 1,
                    limit: 20,
                };
                findAllByOrderId(this.query) //查找该单号下的所有条码
                    .then((response) => {
                        this.loading = false;
                        codeArry = response.data.list || [];
                        var document =
                            '<?xml version="1.0" encoding="utf-8"?>\n' +
                            '<Document xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="终端接口XML Schema-2.0.xsd" SN="" Version="3.0" License="123456">\n' +
                            "<Events>\n" +
                            '<Event Name="' +
                            mOrder.action +
                            '" MainAction="' +
                            mOrder.mainAction +
                            '">' +
                            "<ActionMaping>\n" +
                            '<Action Name="' +
                            mOrder.mainAction +
                            '">\n' +
                            "<ActionData>Code</ActionData>\n" +
                            "<ActionData>CorpOrderID</ActionData>\n" +
                            "<ActionData>Actor</ActionData>\n" +
                            "<ActionData>ActDate</ActionData>\n" +
                            "<ActionData>ToCorpID</ActionData>\n" +
                            "</Action>\n" +
                            " </ActionMaping>\n" +
                            "<DataMaping>\n" +
                            '<MetaData Name="Code" Type="string" />\n' +
                            '<MetaData Name="CorpOrderID" Type="string" />\n' +
                            '<MetaData Name="Actor" Type="string" />\n' +
                            '<MetaData Name="ActDate" Type="Date" />\n' +
                            '<MetaData Name="ToCorpID" Type="string" />\n' +
                            "</DataMaping>\n" +
                            "<DataField>\n";
                        for (var value of codeArry) {
                            if (value.fromCorpId == null) {
                                value.fromCorpId = "";
                            }
                            var tempdata =
                                ' <Data Code="' +
                                value.code +
                                '" CorpOrderID="' +
                                value.corpOrderId +
                                '" Actor="' +
                                value.actor +
                                '" ActDate="' +
                                value.actDate +
                                '" ToCorpID="' +
                                value.fromCorpId +
                                '" />\n';

                            document = document + tempdata;
                        }
                        document =
                            document +
                            "</DataField>\n" +
                            "</Event>\n" +
                            "</Events>\n" +
                            "</Document>\n";

                        var blob = new Blob([document], {
                            type: "text/plain;charset=utf-8",
                        });
                        saveAs(blob, mOrder.action + mOrder.corpOrderId + ".xml");

                        this.exportQuery.orderId = corpOrderId;
                        this.exportQuery.exportStatus = "已上传";
                        updateExportStatus(this.exportQuery).then((response) => {
                            this.getList();
                        });
                    })
                    .catch(() => {
                        this.loading = false;
                        this.list = [];
                        this.total = 0;
                    });
            },

            uploadOrderDialog(value) {
                console.log(value.id + "---" + value.orderid);
                this.uploadQuery = {
                    orderId: value.id,
                };
                uploadOrder(this.uploadQuery)
                    .then((response) => {
                        if (response.code == 20000) {
                            this.$message.success(response.data);
                            this.getList();
                        } else {
                            this.$message.error(response.message);
                        }
                    })
                    .catch(() => {
                    });
            },

            deleteDialog(rowId) {
                this.$confirm("此操作将永久删除该订单, 是否继续?", "提示", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning",
                })
                    .then(() => {
                        this.deleteOrders(rowId);
                    })
                    .catch(() => {
                    });
            },
            closeDetailDialog(val) {
                this.codeDetailVisible = false;
            },
            closeManuDialog(val) {
                this.addDialogVisible = false;
                if (val) {
                    this.$message.success("选入成功");
                    this.refresgOrderDetail();
                    this.getList();
                } else {
                    this.$message.error("选入失败");
                }
            },
            cancelDialog() {
                this.addDialogVisible = false;
            },
            importOrder(row) {
                this.orderId = row.id;
                this.addDialogVisible = true;
            },
        },
        filters: {
            statusFilterType(status) {
                const statusMap = {
                    false: "success",
                    true: "danger",
                };
                return statusMap[status];
            },
        },
        mounted() {
            document.body.ondrop = function (event) {
                event.preventDefault();
                event.stopPropagation();
            };
        },

        created() {
            // 将参数拷贝进查询对象
            this.getBusType();
            let query = this.$route.query;
            this.query = Object.assign(this.query, query);
            this.query.limit = parseInt(this.query.limit);
            // 加载表格数据
            this.getList();
            let end = new Date();
            let start = new Date();
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
            this.actDateRange = [start, end];
        },
    };
</script>


<style>
    .el-table .warning-row {
        background: #ffb5b5;
    }

    .el-table .success-row {
        background: #ffffff;
    }
</style>
