<template>
    <div>
        <div class="divborder newSearchDiv">
            <div class="filter">
                <label>{{ $t(8070) }}：</label>
                <Select v-model="storageid" clearable class="searchSelect">
                    <Option
                        v-for="item in stores"
                        :value="item.id"
                        :key="item.id"
                        >{{ item.name }}</Option
                    >
                </Select>
            </div>
            <div class="filter">
                <label>{{ $t(200054) }}：</label>
                <Select v-model="state" class="searchSelect">
                    <Option value="0">盘盈</Option>
                    <Option value="1">盘亏</Option>
                </Select>
            </div>
            <div class="filter">
                <label>{{ $t(1035) }}：</label>
                <DatePicker
                    type="datetimerange"
                    format="yyyy-MM-dd HH:mm:ss"
                    :clearable="false"
                    v-model="index_time"
                    class="searchInput MaxWidth"
                ></DatePicker>
            </div>
            <div class="searchBtn">
                <Button
                    type="primary"
                    class="twoWord"
                    icon="ios-search"
                    @click="search(1, 10)"
                    >{{ $t("1001") }}</Button
                >
                <Button
                    type="success"
                    class="twoWord"
                    @click="downExcel()"
                    icon="md-add-circle"
                    >导出</Button
                >
            </div>
        </div>
        <div class="divborder newTableDiv">
            <Table
                class="tableClass"
                @on-current-change="handleRowChange"
                highlight-row
                :data="tableData"
                :columns="columns"
            ></Table>
            <div class="pageDiv">
                <div class="pageDirection">
                    <Page
                        :total="total"
                        :current="page"
                        @on-change="changePage"
                        show-elevator
                        show-sizer
                        show-total
                        @on-page-size-change="handlePageSize"
                        :page-size-opts="[10, 20, 30, 40, 100]"
                    ></Page>
                </div>
            </div>
        </div>
        <div class="divborder newTableDiv" v-show="show">
            <Table
                class="tableClass"
                @on-current-change="handleRowChange"
                highlight-row
                :data="tableData1"
                :columns="columns1"
            ></Table>
            <div class="pageDiv">
                <div class="pageDirection">
                    <Page
                        :total="total1"
                        :current="page1"
                        @on-change="changePage1"
                        show-elevator
                        show-sizer
                        show-total
                        @on-page-size-change="handlePageSize1"
                        :page-size-opts="[10, 20, 30, 40, 100]"
                    ></Page>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import axios from "@/libs/api.request";
import moment from "moment";

export default {
    data() {
        return {
            action:
                axios.publicPath +
                "tlm/Upload/Submit?templateName=TechToolList",
            headers: {
                token: localStorage.getItem("token"),
                timestamp: localStorage.getItem("timestamp"),
                nonce: localStorage.getItem("nonce"),
                sign: localStorage.getItem("sign"),
            },
            storageid: 0, // 仓库
            stores:[],
            state: "", // 状态
            total1: 0,
            page1: 1,
            pagesize1: 10,
            columns1: [
                {
                    type: "index2",
                    title: "序号",
                    key: "xuhao",
                    render: (h, params) => {
                        return h(
                            "span",
                            params.index + (this.page - 1) * this.pagesize + 1
                        );
                    },
                    width: "70px",
                },
                {
                    title: "单号",
                    key: "order_number",
                },
                {
                    title: "仓库",
                    key: "businessName",
                },
                {
                    title: "料号",
                    key: "material_pn",
                },

                {
                    title: "名称",
                    key: "material_name",
                },
                {
                    title: "规格",
                    key: "material_spec",
                },
                {
                    title: "数量",
                    key: "quantity",
                },
                {
                    title: "盘点数量",
                    key: "stocktaked_quantity",
                },
            ],
            tableData1: [],
            detailobj: {},
            total: 0,
            page: 1,
            pagesize: 10,
            columns: [
                {
                    type: "index2",
                    title: "序号",
                    key: "xuhao",
                    render: (h, params) => {
                        return h(
                            "span",
                            params.index + (this.page - 1) * this.pagesize + 1
                        );
                    },
                    width: "70px",
                },
                {
                    title: "单号",
                    key: "order_number",
                },
                {
                    title: "仓库",
                    key: "storagename",
                },
                {
                    title: "状态",
                    key: "order_statusName",
                },
            ],
            tableData: [],
            index_time: [],
            show: false,
        };
    },
    created() {
        this.search(1, 10);
        this.getStore();

        this.columns1 = this.$time.initTableTitle(this.columns1);
        this.index_time = [
            moment(new Date().getTime() - 3600 * 1000 * 24 * 7).format(
                "YYYY-MM-DD "
            ) + "00:00:00",
            moment(new Date().getTime()).format("YYYY-MM-DD ") + "23:59:59",
        ];
    },
    methods: {
        search(page, pagesize) {
            let starttime = this.index_time[0];
            let endtime = this.index_time[1];
            let data = {
                state: this.state,
                storageid: this.storageid,
                start: starttime,
                end: endtime,
                page: page,
                pageSize: pagesize,
            };
            // this.page = page;
            this.request("/wms/Check/GetCheckSummary", data, "get").then(
                (res) => {
                    if (res.data.ret == 1) {
                        this.total = res.data.total;
                        this.tableData1 = res.data.data;
                    }
                }
            );
        },
        getStore() {
            let data = {
                getAll: 1,
            };
            this.request("/wms/Allocation/GetWavehouse", data, "get").then(
                (res) => {
                    if (res.data.ret == 1) {
                        this.stores = res.data.data;
                    }
                }
            );
        },
        getDetail(billid, page, pagesize) {
            let data = {
                id: billid,
                page: page,
                pageSize: pagesize,
            };
            this.request("/wms/Check/GetBillDetail", data, "get").then(
                (res) => {
                    if (res.data.ret == 1) {
                        this.total1 = res.data.total;
                        this.tableData1 = res.data.data;
                    }
                }
            );
        },
        downExcel() {
            let data = {
                invantorysn: this.material_pn, // 物料编号
                storageid: this.storageid, // 仓库id
                locationid: this.location, // 储位
                businessid: this.supplier,
            };
            this.request("/wms/Stock/ExportStockDetails", data, "get").then(
                (res) => {
                    if (res.data.ret === 1) {
                        window.location.href =
                            axios.publicPath + "" + res.data.data;
                    } else {
                        this.$Message.error(this.$t(res.data.msg));
                    }
                }
            );
        },
        handleRowChange(currentRow, oldCurrentRow) {
            this.detailobj = currentRow;
            this.getDetail(this.detailobj.id, 1, 10);
            this.show = true;
        },
        handlePageSize(value) {
            this.pagesize = value;
            this.tableData1 = this.search(this.page, this.pagesize);
        },
        changePage(value) {
            this.page = value;
            this.tableData1 = this.search(this.page, this.pagesize);
        },
        handlePageSize1(value) {
            this.pagesize1 = value;
            this.getDetail(this.detailobj.id, 1, this.pagesize1);
        },
        changePage1(value) {
            this.page1 = value;
            this.getDetail(this.detailobj.id, this.page1, 10);

        },
        request(url, data, type) {
            if (type == "get") {
                return this.axios
                    .request({
                        url: url,
                        params: data,
                        method: type,
                    })
                    .then((res) => {
                        return res;
                    })
                    .catch((error) => error);
            } else {
                return this.axios
                    .request({
                        url: url,
                        data,
                        method: type,
                    })
                    .then((res) => {
                        return res;
                    })
                    .catch((error) => error);
            }
        },
    },
};
</script>

<style>
</style>
