<template>
    <div>
        <el-card class="el-card">
            <el-form
                :inline="true"
                :model="filterQuery"
                class="query-form"
                size="mini"
            >
                <el-row>
                    <el-form-item class="query-form-item">
                        <el-input
                            v-model="filterQuery.billNo"
                            placeholder="单据号"
                        ></el-input>
                    </el-form-item>
                    <el-form-item class="query-form-item">
                        <el-select v-model="filterQuery.billAction" 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="importErps"
                            >导入比对
                            </el-button
                            >

                            <!-- <el-button type="primary" icon="search" @click="combineErps"
                              >合并下载</el-button
                            > -->
                        </el-button-group>
                    </el-form-item>
                </el-row>
            </el-form>
            <el-table
                v-loading="loading"
                :data="list"
                highlight-current-row="true"
                @selection-change="handleSelectionChange"
                @row-click="getOrderDetail"
                style="width: 100%"
            >
                <el-table-column type="selection" width="55"></el-table-column>
                <el-table-column label="序号" type="index"></el-table-column>
                <el-table-column
                    label="订单ID"
                    prop="billNo"
                    :show-overflow-tooltip="true"
                ></el-table-column>
                <!--                <el-table-column-->
                <!--                    label="客户ID"-->
                <!--                    prop="corpId"-->
                <!--                    :show-overflow-tooltip="true"-->
                <!--                ></el-table-column>-->
                <el-table-column
                    label="客户名称"
                    prop="corpName"
                    :show-overflow-tooltip="true"
                ></el-table-column>
                <el-table-column
                    label="单据日期"
                    show-overflow-tooltip
                    prop="billdate"
                ></el-table-column>
                <el-table-column label="业务单据类型" prop="billType"></el-table-column>

                <!-- <el-table-column label="下载状态" prop="isDownload"></el-table-column> -->
            </el-table>
            <el-pagination
                :current-page="filterQuery.page"
                :page-size="filterQuery.limit"
                @current-change="handleCurrentChange"
                layout="prev, pager, next"
                :total="total"
            ></el-pagination>
        </el-card>

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

                <el-table-column
                    label="产品ID"
                    prop="productId"
                    :show-overflow-tooltip="true"
                ></el-table-column>

                <el-table-column
                    label="产品名称"
                    prop="productName"
                    :show-overflow-tooltip="true"
                ></el-table-column>
                <el-table-column
                    label="批号"
                    prop="batchNo"
                    :show-overflow-tooltip="true"
                ></el-table-column>
                <el-table-column
                    label="单位"
                    prop="spec"
                    :show-overflow-tooltip="true"
                ></el-table-column>
                <el-table-column label="单据数量" prop="reCount"></el-table-column>
                <el-table-column label="实际数量" prop="count">
                </el-table-column>
            </el-table>
        </el-card>
    </div>
</template>

<script>
import {
    combineErpOrder,
    selectErpOrder,
    getCloudErp,
} from "../../api/inout/erpOrder";

import {stockListDetail} from "../../api/warehouse/stockOrder"
import {getBussinessType} from "../../api/basic/bussinessType";
import {getLocalBusType, filterByBus} from "../../api/basic/busLocalType";

export default {
    name: "orderId",
    props: {
        orderId: {
            type: Object,
            required: true,
        },
        orderAction: {
            type: Object,
            required: true,
        }
    },
    data() {
        return {
            filterQuery: {
                billcode: "",
                billFlag: null,
                billAction: null,
                startDate: null,
                endDate: null,
                status: 3,
                page: 1,
                limit: 5,
            },
            value: "",
            total: 0,
            list: [],
            loading: false,
            detailLoading: false,
            detailList: [],
            actDateRange: [],
            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]);
                        },
                    },
                ],
            },
            multipleSelection: [],
            postQuery: {
                orderId: "",
                purchaseinResponses: [],
            },
            idQuery: {
                id: "",
            },
        };
    },

    methods: {
        onReset() {
            this.$router.push({
                path: "",
            });
            this.filterQuery = {
                billNo: "",
                billFlag: null,
                billAction: null,
                startDate: null,
                endDate: null,
                page: 1,
                limit: 5,
                status: 3,
            };
            this.actDateRange = [];
            this.getList();
        },

        onSubmit() {
            if (this.actDateRange != null) {
                this.filterQuery.startDate = this.actDateRange[0];
                this.filterQuery.endDate = this.actDateRange[1];
            } else {
                this.filterQuery.startDate = null;
                this.filterQuery.endDate = null;
            }
            this.getList();
        },
        getList() {
            this.loading = true;
            stockListDetail(this.filterQuery)
                .then((response) => {
                    this.loading = false;
                    if (response.code == 20000) {
                        this.list = response.data.list || [];
                        this.detailList = [];
                        this.total = response.data.total || 0;
                    } else {
                        this.$message.error(response.message);
                    }
                })
                .catch(() => {
                    this.loading = false;
                    this.list = [];
                    this.total = 0;
                });
        },

        //业务明细表
        getOrderDetail(row) {

            this.detailList = row.subErpOrders;
        },

        importErps() {
            var selectData = this.multipleSelection;

            selectData.forEach((obj, index) => {
                this.postQuery.purchaseinResponses.push(obj);
            });

            if (this.postQuery.purchaseinResponses.length < 1) {
                this.$message.warning("选择的订单需大于1");
                return;
            }
            this.postQuery.orderId = this.orderId;
            selectErpOrder(this.postQuery)
                .then((response) => {
                    if (response.code == 20000) {
                        this.loading = false;
                        this.$emit("closeManuDialog", true);
                    } else {
                        this.$message.error(response.message);
                    }
                })
                .catch(() => {
                    this.loading = false;
                    this.$emit("closeManuDialog", false);
                });
        },
        combineErps() {
            var selectData = this.multipleSelection;

            selectData.forEach((obj, index) => {
                this.postQuery.docids.push(obj.docid);
            });

            if (this.postQuery.docids.length < 1) {
                this.$message.warning("选择的订单需大于1");
                return;
            }

            combineErpOrder(this.postQuery)
                .then((response) => {
                    if (response.code == 20000) {
                        this.loading = false;
                        this.$emit("closeManuDialog", true);
                    } else {
                        this.$message.error(response.message);
                    }
                })
                .catch(() => {
                    this.loading = false;
                    this.$emit("closeManuDialog", false);
                });
        },

        handleSizeChange(val) {
            this.filterQuery.limit = val;
            this.getList();
        },
        handleCurrentChange(val) {
            this.filterQuery.page = val;
            this.getList();
        },
        handleSelectionChange(val) {
            this.multipleSelection = val;
        },
        getBusType() {
            let query = {
                enabled: true,
            };
            getLocalBusType(query)
                .then((response) => {
                    this.busTypes = response.data.list || [];
                    // this.filterQuery.billAction = this.busTypes[0].action;
                    // this.getList();
                    this.getCurBillAction();
                })
                .catch(() => {
                });


        },

        getCurBillAction() {
            let tQuery = {
                action: this.orderAction
            }
            filterByBus(tQuery)
                .then((response) => {
                    this.filterQuery.billAction = response.data;
                    this.getList();
                })
                .catch(() => {
                });
        }
    },
    components: {},
    mounted() {
    },
    created() {
        let end = new Date();
        let start = new Date();
        start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
        this.actDateRange = [start, end];

        this.getBusType();
    },
};
</script>

<style scoped>

.el-card {
    margin-right: 20px;
    /*transition: all .5s;*/
}

</style>
