<template>
    <div>
        <div class="divborder newSearchDiv">
            <div class="filter">
                <label>{{ $t(8218) }}：</label>
                <Input v-model="tool_name" class="searchInput" />
            </div>
            <div class="filter">
                <label>{{ $t(8217) }}：</label>
                <Input v-model="tool_number" class="searchInput" />
            </div>
            <div class="filter">
                <label>{{ $t(8219) }}：</label>
                <Input v-model="tool_type" class="searchInput" />
            </div>
            <div class="filter">
                <label>{{ $t(8021) }}：</label>
                <Select v-model="checkState" clearable class="searchSelect">
                    <Option value="1">
                        {{ $t(700114) }}
                    </Option>
                    <Option value="2">
                        {{ $t(950442) }}
                    </Option>
                </Select>
            </div>
            <div v-show="!morecondition">
                <div class="filter">
                    <label>{{ $t(8022) }}：</label>
                    <Select v-model="need_test" clearable class="searchSelect">
                        <Option value="1">{{ $t(1000020) }}</Option>
                        <Option value="2">{{ $t(1000021) }}</Option>
                    </Select>
                </div>
                <div class="filter">
                    <label>{{ $t(8023) }}：</label>
                    <DatePicker
                        type="datetimerange"
                        v-model="test_time"
                        class="searchSelect"
                        @on-change="getTime"
                    ></DatePicker>
                </div>
            </div>
            <div class="searchBtn">
                <Button
                    type="primary"
                    class="twoWord"
                    icon="ios-search"
                    @click="search(1, 10)"
                    >{{ $t("1001") }}</Button
                >
                <Button
                    type="primary"
                    class="twoWord"
                    @click="check()"
                    icon="ios-create-outline"
                    >{{ $t(900249) }}</Button
                >
                <Button
                    type="error"
                    class="twoWord"
                    @click="returnGoods"
                    icon="md-close-circle"
                    >{{ $t(8024) }}</Button
                >
                <Button
                    type="success"
                    class="twoWord"
                    @click="warehousing()"
                    icon="md-add-circle"
                    >{{ $t(300008) }}</Button
                >
            </div>

            <!-- 更多条件 按钮 -->
            <MoreConbtn
                @getCon="morecondition = !morecondition"
                :morecondition="morecondition"
            ></MoreConbtn>
        </div>
        <div class="divborder newTableDiv">
            <Table
                class="tableClass"
                @on-current-change="handleRowChange"
                highlight-row
                :data="tableData1"
                @on-selection-change="handleSelectRow"
                :columns="columns1"
            ></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>

        <!-- 详情 -->
        <Modal
            class="newModalClass"
            v-model="modal1"
            :styles="{ width: '940px' }"
        >
            <p slot="header" v-if="detailobj">
                <span>{{ detailobj.category_name }}</span>
            </p>
            <div class="modal_body" style="padding-right: 40px">
                <Table
                    class="tableClass"
                    :data="modalTable"
                    :columns="defendColumns1"
                    :max-height="200"
                ></Table>
                <div style="margin: 10px; overflow: hidden">
                    <div style="float: right">
                        <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>
                    <Icon type="ios-add-circle-outline" style="font-size:28px" @click="addItem" />
                </div>-->
            </div>
            <div slot="footer">
                <Button
                    type="text"
                    size="large"
                    @click="modal1 = false"
                    v-text="$t('1033')"
                    >取消</Button
                >
                <Button
                    type="primary"
                    size="large"
                    @click="modal1 = false"
                    v-text="$t('1011')"
                    >确定</Button
                >
            </div>
        </Modal>
        <!-- 测试 -->
        <Modal
            class="newModalClass"
            :title="$t(900249)"
            v-model="modal"
            :styles="{ width: '940px' }"
        >
            <div class="modal_body" style="padding-right: 40px">
                <Table
                    class="tableClass"
                    :data="testData"
                    :columns="defendColumns"
                    :max-height="200"
                ></Table>
                <!-- <div>
                    <Icon type="ios-add-circle-outline" style="font-size:28px" @click="addItem" />
                </div>-->
            </div>
            <div slot="footer">
                <Button
                    type="text"
                    size="large"
                    @click="modal = false"
                    v-text="$t('1033')"
                    >取消</Button
                >
                <Button
                    type="primary"
                    size="large"
                    @click="submitList"
                    v-text="$t('1011')"
                    >提交</Button
                >
            </div>
        </Modal>
        <!-- 退货 -->
        <Modal
            class="newModalClass"
            :title="$t(8024)"
            v-model="modal2"
            :styles="{ width: '940px' }"
        >
            <div class="modal_body" style="padding-right: 40px">
                <Table
                    class="tableClass"
                    :data="returnData"
                    :columns="returnColumns"
                    :max-height="200"
                ></Table>
            </div>
            <div slot="footer">
                <Button type="text" @click="modal2 = false" v-text="$t('1033')"
                    >取消</Button
                >
                <Button type="primary" @click="submitList()" v-text="$t('1011')"
                    >确定</Button
                >
            </div>
        </Modal>
        <!-- 入库 -->
        <Modal
            class="newModalClass"
            :title="$t(300008)"
            v-model="modal3"
            :styles="{ width: '940px' }"
        >
            <div class="modal_body" style="padding-right: 40px">
                <Table
                    class="tableClass"
                    :data="enterData"
                    :columns="defendColumns"
                    :max-height="900"
                ></Table>
                <!-- <div>
                    <Icon type="ios-add-circle-outline" style="font-size:28px" @click="addItem" />
                </div>-->
            </div>
            <div slot="footer">
                <Button
                    type="text"
                    size="large"
                    @click="modal3 = false"
                    v-text="$t('1033')"
                    >取消</Button
                >
                <Button
                    type="primary"
                    size="large"
                    @click="submitList()"
                    v-text="$t('1011')"
                    >提交</Button
                >
            </div>
        </Modal>
    </div>
</template>

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

export default {
    data() {
        return {
            morecondition: false,
            action:
                axios.publicPath +
                "ims/Upload/Submit?templateName=TechToolList",
            headers: {
                token: localStorage.getItem("token"),
                timestamp: localStorage.getItem("timestamp"),
                nonce: localStorage.getItem("nonce"),
                sign: localStorage.getItem("sign"),
            },
            tool_name: "", // 产品
            tool_number: "",
            tool_type: "",
            checkState: "",
            need_test: "",
            test_time: [],
            // 模态框变量
            modal1: false,
            modal2: false,
            modal3: false,
            location: [],
            modalTable: [], // 详情表格
            defendColumns1: [
                {
                    title: this.$t(8025),
                    key: "seq",
                    align: "center",
                },
                {
                    title: this.$t(8026),
                    key: "type",
                    align: "center",
                },
                {
                    title: this.$t(8027),
                    key: "tools",
                    align: "center",
                },
                {
                    title: this.$t(8028),
                    key: "standardValues",
                    align: "center",
                },
                {
                    title: this.$t(8029),
                    align: "center",
                    children: [
                        {
                            title: this.$t(200059),
                            key: "max",
                            align: "center",
                            render: (h, params) => {
                                let str = "";
                                if (
                                    params.row.type == "OK/NOK" &&
                                    params.row.max == 0
                                ) {
                                    str = "";
                                } else {
                                    str = params.row.max;
                                }
                                return h("div", str);
                            },
                        },
                        {
                            title: this.$t(200060),
                            key: "mini",
                            align: "center",
                            render: (h, params) => {
                                let str = "";
                                if (
                                    params.row.type == "OK/NOK" &&
                                    params.row.max == 0
                                ) {
                                    str = "";
                                } else {
                                    str = params.row.mini;
                                }
                                return h("div", str);
                            },
                        },
                    ],
                },
                {
                    title: this.$t(8030),
                    key: "actualValue",
                    align: "center",
                    render: (h, params) => {
                        let color = "";
                        if (params.row.result == 1) {
                            color = "#000";
                        } else {
                            color = "red";
                        }
                        return h(
                            "span",
                            {
                                style: {
                                    color: color,
                                },
                            },
                            params.row.actualValue
                        );
                    },
                },
            ],
            columns1: [
                {
                    type: "selection",
                    width: 60,
                    align: "center",
                },
                {
                    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: "category_name",
                    width: 100,
                },
                {
                    title: this.$t(8218),
                    key: "material_name",
                },
                {
                    title: this.$t(900933),
                    key: "part_no",
                },
                {
                    title: this.$t(8217),
                    key: "tool_number",
                },
                {
                    title: this.$t(600011),
                    key: "supplier_name",
                },
                {
                    title: this.$t(8031),
                    key: "state",
                    render: (h, params) => {
                        let bg = "";
                        if (params.row.result == 0) {
                            bg = "";
                        }
                        if (params.row.result == 1) {
                            bg = "green";
                        }
                        if (params.row.result == 2) {
                            bg = "red"; // 不通过
                        }
                        return h("div", [
                            h("span", {
                                style: {
                                    display: "inline-block",
                                    marginRight: "5px",
                                    borderRadius: "50%",
                                    width: "20px",
                                    height: "20px",
                                    backgroundColor: bg,
                                },
                            }),
                            h(
                                "a",
                                {
                                    on: {
                                        click: () => {
                                            let data = {
                                                Page: 1,
                                                PageSize: 10,
                                                ProjectId: 0,
                                                orderNumber:
                                                    params.row.orderNumber,
                                                orderNumbers: [],
                                            };

                                            // this.remove(params.index);
                                            this.request(
                                                "/ims/ToolTest/GetTestDetailData",
                                                data,
                                                "post"
                                            ).then((res) => {
                                                if (res.data.ret == 1) {
                                                    this.total1 =
                                                        res.data.total;
                                                    this.modalTable =
                                                        res.data.data;
                                                    this.modal1 = true;
                                                }
                                                console.log(res.data);
                                            });
                                        },
                                    },
                                },
                                this.$t(7000048)
                            ),
                        ]);
                    },
                },
                {
                    title: this.$t(8032),
                    key: "inspector_name",
                },
                {
                    title: this.$t(8023),
                    key: "inspect_time",
                    render: (h, params) => {
                        let time = "";
                        time =
                            params.row.inspect_time != 0
                                ? moment(
                                      parseInt(params.row.inspect_time * 1000)
                                  ).format("YYYY-MM-DD HH:mm:ss")
                                : "";
                        return h("span", time);
                    },
                },
                {
                    title: this.$t(8033),
                    key: "need_test",
                    render: (h, params) => {
                        let str = "";
                        if (params.row.need_test == 1) {
                            str = this.$t(1000020);
                        }
                        if (params.row.need_test == 2) {
                            str = this.$t(1000021);
                        }
                        return h("span", str);
                    },
                },
            ],
            modal: false,
            selection: [],
            testData: [],
            returnData: [],
            returnColumns: [
                {
                    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: "category_name",
                    width: 100,
                },
                {
                    title: this.$t(100391),
                    key: "material_name",
                },
                {
                    title: this.$t(900933),
                    key: "part_no",
                },
                {
                    title: this.$t(8034),
                    key: "location",
                    align: "center",
                },
                {
                    title: this.$t(8035), // 属性值
                    key: "to",
                    align: "center",
                    render: (h, params) => {
                        let arr = [
                            {
                                value: 1,
                                key: 1,
                            },
                        ];
                        return h(
                            "Select",
                            {
                                props: {
                                    transfer: true,
                                    value: params.row.to,
                                },
                                on: {
                                    "on-change": (event) => {
                                        this.returnData[
                                            params.index
                                        ].to = event;
                                    },
                                },
                            },
                            // 11111
                            params.row.locations.map((item) => {
                                // console.log(item.key)
                                return h("Option", {
                                    props: {
                                        value: item.id,
                                        label: item.name,
                                    },
                                });
                            })
                        );
                    },
                },
                {
                    title: this.$t(8036), // 单位
                    key: "reason",
                    align: "center",
                    render: (h, params) => {
                        return h("Input", {
                            props: {
                                value: params.row.reason,
                                size: "small",
                                min: 0,
                            },
                            on: {
                                input: (val) => {
                                    this.returnData[params.index].reason = val;
                                },
                            },
                        });
                    },
                },
            ],
            location1: [],
            location2: [],
            defendColumns: [
                {
                    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: "category_name",
                    width: 100,
                },
                {
                    title: this.$t(100391),
                    key: "material_name",
                },
                {
                    title: this.$t(900933),
                    key: "part_no",
                },
                {
                    title: this.$t(8034), // 属性名称
                    key: "location",
                    align: "center",
                },
                {
                    title: this.$t(8035), // 属性值
                    key: "to",
                    align: "center",
                    render: (h, params) => {
                        // let locations =[];
                        // let data = {
                        //     storageid: params.row.storageid,
                        //     locationid: 0,
                        // };
                        // this.request(
                        //     "/wms/Location/GetLastLocation",
                        //     data,
                        //     "get"
                        // ).then((res) => {
                        //     locations = res.data.data;
                        // });
                        return h(
                            "Select",
                            {
                                props: {
                                    transfer: true,
                                    value: params.row.to,
                                },
                                on: {
                                    "on-change": (event) => {
                                        // console.log(
                                        //     this.enterData[params.index]
                                        // );
                                        // console.log(this.testData[params.index],event)
                                        if (this.type == 1) {
                                            this.testData[
                                                params.index
                                            ].to = event;
                                        }
                                        if (this.type == 3) {
                                            this.enterData[
                                                params.index
                                            ].to = event;
                                        }
                                    },
                                },
                            },
                            // this.location.map((item) => {
                        params.row.locations.map((item) => {

                                // console.log(item.key)
                                return h("Option", {
                                    props: {
                                        value: item.id,
                                        label: item.name,
                                    },
                                });
                            })
                        );
                    },
                },
            ],
            tableData1: [],
            total: 0,
            page: 1,
            pagesize: 10,
            total1: 0,
            page1: 1,
            pagesize1: 10,
            enterData: [],
            type: 0,
            storeArr: [],
            detailobj: {},
        };
    },
    created() {
        this.search(1, 10);
        // 格式化表格样式
        this.defendColumns = this.$time.initTableTitle(this.defendColumns);
        this.returnColumns = this.$time.initTableTitle(this.returnColumns);
        this.columns1 = this.$time.initTableTitle(this.columns1);
        this.defendColumns1 = this.$time.initTableTitle(this.defendColumns1);
    },
    methods: {
        search(page, pagesize) {
            let start = 0,
                end = 0;

            start = this.test_time[0]
                ? Date.parse(this.test_time[0]) / 1000
                : 0;
            end = this.test_time[1] ? Date.parse(this.test_time[1]) / 1000 : 0;

            let data = {
                Page: page,
                PageSize: pagesize,
                ProjectId: 0,
                state: "",
                states: "2,3,4",
                need_test: "",
                inspect_start: start,
                inspect_end: end,
                need_test: this.need_test,
                result: this.checkState,
                tool_number: this.tool_number.trim(),
                tool_name: this.tool_name.trim(),
                tool_type: this.tool_type.trim(),
            };
            // this.page = page;
            this.request("/ims/ToolTest/GetTestData", data, "post").then(
                (res) => {
                    if (res.data.ret == 1) {
                        this.total = res.data.total;
                        this.tableData1 = res.data.data;
                    }
                }
            );
        },
        getTime(val) {
            // let date = Date.parse(val) / 1000;
            this.test_time = val;
            // console.log(val);
        },
        getDefendList() {
            let data = {
                Page: 0,
                PageSize: 0,
                Id: this.detailobj.tool_id,
                ProjectId: 0,
                ToolType: 1,
            };
            this.request("/ims/ToolTest/GetDetection", data, "post").then(
                (res) => {
                    // console.log(res.data.data);
                    if (res.data.ret == 1) {
                        this.defendList = res.data.data;
                    }
                }
            );
        },
        getLocation(id) {
            let data = {
                storageid: id,
                locationid: 0,
            };
            this.request("/wms/Location/GetLastLocation", data, "get").then(
                (res) => {
                    this.location = res.data.data;
                }
            );
        },
        check() {
            if (this.selection.length == 0) {
                this.$Message.error(this.$t(1043));
                return false;
            }
            this.testData = [];

            let arr = [],
                bool = false;
            // const test = (ele) => {
            //     return ele.need_test == 1 && ele.state == 3;
            // };
            this.selection.forEach((ele) => {
                if (ele.need_test == 1 && ele.state == 3) {
                    this.testData.push(ele);
                } else {
                    bool = true;
                }
            });
            // let a = this.selection.every(test);
            // console.log(a);
            // return;

            if (bool == true) {
                this.$Message.error(this.$t(8118));
                return false;
            }
            this.testData.forEach((ele) => {
                ele.to = 0;
            });
            this.getLocation(this.testData[0].storageid);
            this.type = 1;
            this.modal = true;
        },
        returnGoods() {
            if (this.selection.length == 0) {
                this.$Message.error(this.$t(1043));
                return false;
            }
            let bool = false;
            this.selection.forEach((ele) => {
                if (ele.state == 2 && ele.result == 2) {
                    bool = false;
                } else {
                    bool = true;
                }
            });
            if (bool) {
                this.$Message.error(this.$t(8117));
                return false;
            }
            this.returnData = this.selection;
            this.returnData.forEach((ele) => {
                ele.to = 0;
            });
            this.type = 2;
            this.getLocation(this.returnData[0].storageid);

            this.modal2 = true;
        },
        warehousing() {
            if (this.selection.length == 0) {
                this.$Message.error(this.$t(1043));
                return false;
            }

            const test = (ele) => {
                return ele.state == 2 && ele.result == 1 && ele.need_test == 2;
            };
            let bool = this.selection.every(test);
            // console.log(a);
            // return;
            let same = false;
            for (let i = 0; i < this.selection.length; i++) {
                const ele = this.selection[i];
                if (ele.storageid != this.selection[0].storageid) {
                    same = true;
                }
            }
            if (bool == false) {
                this.$Message.error(this.$t(8119));
                return false;
            }
            // if (same) {
            //     this.$Message.error("");
            //     return false;
            // }
            this.enterData = this.selection;

            this.enterData.forEach((ele) => {
                ele.to = 0;
            });
            // console.log(this.enterData)
            this.type = 3;
            this.getLocation(this.enterData[0].storageid);

            this.modal3 = true;
        },
        submitList() {
            let data = {},
                arr = [],
                obj = {};
            var bool = false;
            // let o = {
            //     orderNumber: "string",
            //     to: 0,
            //     reason: "string"
            // };

            data.data = arr;
            if (this.type == 1) {
                // 测试
                this.testData.forEach((ele) => {
                    arr.push({
                        orderNumber: ele.orderNumber,
                        to: ele.to,
                        reason: "",
                    });
                });
                data.state = 3;
            }
            if (this.type == 2) {
                // 退货
                this.returnData.forEach((ele) => {
                    arr.push({
                        orderNumber: ele.orderNumber,
                        to: ele.to,
                        reason: ele.reason,
                    });
                });
                data.state = 998;
            }
            if (this.type == 3) {
                // 入库
                this.enterData.forEach((ele) => {
                    arr.push({
                        orderNumber: ele.orderNumber,
                        to: ele.to,
                        reason: "",
                    });
                });
                data.state = 997;
            }
            arr.forEach((ele) => {
                if (ele.to == "" || ele.to == undefined || ele.to == 0) {
                    bool = true;
                }
            });
            if (bool) {
                this.$Message.error(this.$t(8120));
                return false;
            }
            //   console.log(data);

            // return false;

            this.request(
                "/ims/ToolTest/HandleTestDetailData",
                data,
                "post"
            ).then((res) => {
                if (res.data.ret == 1) {
                    this.$Message.success(this.$t(900345));
                    this.modal = false;
                    this.modal2 = false;
                    this.modal3 = false;

                    this.search(1, 10);
                } else {
                    this.$Message.error(this.$t(res.data.msg));
                }
            });
        },
        getDeatil(page, pagesize) {
            let data = {
                Page: page,
                PageSize: pagesize,
                ProjectId: 0,
                orderNumber: this.detailobj.orderNumber,
                orderNumbers: [],
            };

            // this.remove(params.index);
            this.request("/ims/ToolTest/GetTestDetailData", data, "post").then(
                (res) => {
                    if (res.data.ret == 1) {
                        this.total1 = res.data.total;
                        this.modalTable = res.data.data;
                        this.modal1 = true;
                    }
                }
            );
        },
        handleSelectRow(val) {
            this.selection = val;
            this.selection.forEach((ele) => {
                let data = {
                    storageid: ele.storageid,
                    locationid: 0,
                };
                this.request("/wms/Location/GetLastLocation", data, "get").then(
                    (res) => {
                        ele.locations = res.data.data;
                    }
                );
            });
        },
        handleRowChange(currentRow, oldCurrentRow) {
            this.detailobj = currentRow;
        },
        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.getDeatil(this.page1, this.pagesize1);
        },
        changePage1(value) {
            this.page1 = value;
            this.getDeatil(this.page1, this.pagesize1);
        },
        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>
