<template>
    <div>
        <div class="divborder newSearchDiv">
            <div class="filter">
                <label>{{ $t("1132") }}：</label>
                <Cascader
                    :data="datalevel"
                    :value="leveldata"
                    trigger="click"
                    @on-change="levelchange"
                    change-on-select
                    class="searchSelect"
                ></Cascader>
            </div>
            <div class="searchBtn">
                <Button
                    type="primary"
                    class="twoWord"
                    icon="ios-search"
                    @click="search(1, 10)"
                    >{{ $t("1001") }}</Button
                >
            </div>
            <div class="buttonall"></div>
        </div>
        <div class="divborder newTableDiv">
            <Table
                class="tableClass"
                @on-current-change="handleRowChange"
                highlight-row
                :data="tableData1"
                @on-selection-change="handleSelectRow"
                :columns="tableColumns1"
            ></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"
                highlight-row
                :data="tableData2"
                :columns="tableColumns2"
            ></Table>
        </div>
    </div>
</template>
<script>
export default {
    data() {
        return {
            company: "",
            companys: [],
            lineid: "",
            lines: [],
            stationid: "",
            stations: [],
            total: 0,
            page: 1,
            pagesize: 10,
            tableData1: [],
            tableColumns1: [
                {
                    type: "index2",
                    title: this.$t("1008"),
                    key: "xuhao",
                    render: (h, params) => {
                        return h(
                            "span",
                            params.index + (this.page - 1) * this.pagesize + 1
                        );
                    },
                    width: "70px",
                },
                {
                    title: this.$t(200003),
                    key: "section_name",
                },
                {
                    title: this.$t(1041),
                    key: "machine_name",
                },
                {
                    title: this.$t(1040),
                    key: "machine_code",
                },
                {
                    title: this.$t(600042),
                    key: "cutter_number",
                },
                {
                    title: this.$t(8097),
                    key: "process_count",
                },
                {
                    title: this.$t(8098),
                    key: "install_time",
                },
                {
                    title: this.$t(8099),
                    key: "install_user",
                },
            ],
            tableData2: [],
            tableColumns2: [
                {
                    type: "index2",
                    title: this.$t("1008"),
                    key: "xuhao",
                    render: (h, params) => {
                        return h(
                            "span",
                            params.index + (this.page - 1) * this.pagesize + 1
                        );
                    },
                    width: "70px",
                },
                {
                    title: this.$t(600648),
                    key: "categroy",
                },
                {
                    title: this.$t(100391),
                    key: "material_name",
                },
                {
                    title: this.$t(600011),
                    key: "supplier",
                },
                {
                    title: this.$t(600647),
                    key: "quantity",
                },
            ],
            show: false,
            datalevel: [], // 产线层级数据
            leveldata: [],
        };
    },
    created() {
        this.initlevel();
        this.search(1, 10);
        // 格式化表格样式
        this.tableColumns1 = this.$time.initTableTitle(this.tableColumns1);
        this.tableColumns2 = this.$time.initTableTitle(this.tableColumns2);
    },
    methods: {
        initlevel() {
            this.axios
                .request({
                    url: "config/ProjectLevelSection/GetSectionTree",
                    method: "get",
                })
                .then((res) => {
                    const arr = [];
                    if (res.data.ret === 1) {
                        this.datalevel = res.data.data;
                    } else {
                        this.$Message.error(this.$t(res.data.msg));
                    }
                });
        },
        levelchange(val) {
            if (val.length > 0) {
                this.stationid = val[val.length - 1];
            }
        },
        // getFirst() {
        //     this.request(
        //         "/config/UserLevel/getCurrentUserProjectLevel",
        //         "",
        //         "get"
        //     ).then((res) => {
        //         // console.log(res.data);

        //         if (res.data.ret == 1) {
        //             let id = res.data.data[1].id;
        //             this.getcompany(id);
        //         }
        //     });
        // },
        // getcompany(id) {
        //     let data = {
        //         id: id,
        //     };
        //     this.request("/config/UserLevel/getLevelById", data, "get").then(
        //         (res) => {
        //             // console.log(res.data);
        //             if (res.data.ret == 1) {
        //                 this.companys = res.data.data;
        //             }
        //         }
        //     );
        // },
        // getLine(value) {
        //     this.company = value;
        //     let data = {
        //         id: this.company,
        //     };
        //     this.request(
        //         "/config/UserLevel/getLevelChildrenById",
        //         data,
        //         "get"
        //     ).then((res) => {
        //         // console.log(res.data);
        //         if (res.data.ret == 1) {
        //             this.lines = res.data.data;
        //         }
        //     });
        // },
        // getStation(value) {
        //     this.lineid = value;

        //     let data = {
        //         id: value,
        //     };
        //     this.request(
        //         "/config/UserLevel/getLevelChildrenById",
        //         data,
        //         "get"
        //     ).then((res) => {
        //         if (res.data.ret == 1) {
        //             this.stations = res.data.data;
        //         }
        //     });
        // },
        search(page, pagesize) {
            var data = {
                page: page,
                pagesize: pagesize,
                section_id: this.stationid,
            };
            this.request("/ims/ToolInstall/GetPagedList", data, "post").then(
                (res) => {
                    if (res.data.ret == 1) {
                        this.total = res.data.total;
                        this.mockTableData1(res.data.data);
                        this.initlevel();
                        this.show = false;
                    } else {
                        this.tableData1 = [];
                        this.$Message.error(this.$t(res.data.msg));
                        // this.search(1, 10);
                    }
                }
            );
        },
        mockTableData1(tablelist) {
            let data = [];
            if (tablelist.length > 0) {
                tablelist.forEach((item) => {
                    if (item) {
                        data.push({
                            machine_name: item.machine_name,
                            machine_id: item.machine_id,
                            install_time: item.install_time,
                            install_user: item.install_user,
                            cutter_number: item.cutter_number,
                            serial_number: item.serial_number,
                            machine_code: item.machine_code,
                            section_name: item.section_name,
                            id: item.id,
                            process_count: item.process_count,
                        });
                    }
                });
            }

            this.tableData1 = data;
        },
        getInstallDetail() {
            let data = {
                page: this.page,
                pagesize: 1000000,
                machine_code: this.detailobj.machine_code,
                cutter_number: this.detailobj.cutter_number,
            };

            this.request(
                "/ims/ToolInstall/GetInstallDetail",
                data,
                "post"
            ).then((res) => {
                if (res.data.ret == 1) {
                    this.renderDetail(res.data.data);
                }
            });
        },
        renderDetail(tablelist) {
            let data = [];
            if (tablelist.length > 0) {
                tablelist.forEach((item) => {
                    if (item) {
                        data.push({
                            categroy: item.categroy,
                            cutter_number: item.cutter_number,
                            machine_code: item.machine_code,
                            material_name: item.material_name,
                            supplier: item.supplier,
                            quantity: item.quantity,
                            material_id: item.machine_id,
                            id: item.id,
                        });
                    }
                });
            }

            this.tableData2 = data;
        },
        handleSelectRow(data) {
            this.selection = data;
        },
        handleRowChange(currentRow, oldCurrentRow) {
            this.detailobj = currentRow;
            this.show = true;
            this.getInstallDetail();
            // console.log(this.detailobj);
        },
        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);
        },
        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 lang="less" scoped>
</style>
