<template>
    <div>
        <el-form :model="inputQuery" :rules="formRules" ref="dataForm">
            <el-row :gutter="20" class="el-row" type="flex">
                <el-col :span="10" class="el-col">
                    <div class="text item">
                        <div class="itemTag">
                            <span>当前仓库:&nbsp;</span>
                        </div>
                        <el-select v-model="inputQuery.invWarehouseCode" placeholder="当前仓库"
                                   @change="entrustInvChange"
                                   filterable
                                   clearable>
                            <el-option
                                v-for="item in subInvList"
                                :key="item.code"
                                :label="item.name"
                                :value="item.code">
                                <span style="float: left">{{ item.name }}</span>
                                <span style="float: right; color: #8492a6; font-size: 13px">{{ item.warehouseName }}</span>
                            </el-option>

                        </el-select>

                    </div>
                </el-col>
            </el-row>

            <el-row :gutter="20" class="el-row" type="flex">
                <el-col :span="10" class="el-col">
                    <div class="text item">
                        <div class="itemTag">
                            <span>扫码单据类型:&nbsp;</span>
                        </div>
                        <el-select v-model="inputQuery.action" placeholder="请选择" clearable>
                            <el-option
                                v-for="item in busTypes"
                                :key="item.action"
                                :label="item.name"
                                :value="item.localAction">
                                <span style="float: left">{{ item.localName }}</span>
                            </el-option>
                        </el-select>
                    </div>
                </el-col>

                <el-col :span="4" class="el-col">
                    <div class="text item">
                        <el-checkbox v-model="inputQuery.finishRece">是否直接验收完成
                        </el-checkbox>
                    </div>
                </el-col>
            </el-row>

            <el-row :gutter="20" class="el-row" type="flex">
                <el-col :span="10" class="el-col">
                    <div class="text item">
                        <div class="itemTag">
                            <span>接受委托仓库:&nbsp;</span>
                        </div>
                        <el-select v-model="inputQuery.entrustSubInv" placeholder="接受委托仓库"
                                   @change="entrustSubInvChange"
                                   filterable
                                   clearable>
                            <el-option
                                v-for="item in entrustSubInvList"
                                :key="item.code"
                                :label="item.name"
                                :value="item.code">
                                <span style="float: left">{{ item.name }}</span>
                                <span style="float: right; color: #8492a6; font-size: 13px">{{ item.warehouseName }}</span>
                            </el-option>

                        </el-select>

                    </div>
                </el-col>


            </el-row>

            <el-row :gutter="20" class="el-row" type="flex">

                <el-col :span="10" class="el-col">
                    <div class="text item">
                        <div class="itemTag">
                            <span>生成单据类型:&nbsp;</span>
                        </div>
                        <el-select v-model="inputQuery.entrustAction" placeholder="单据类型" @change="entrustActionChange" clearable>
                            <el-option
                                v-for="item in entrustBusArray"
                                :key="item.action"
                                :label="item.name"
                                :value="item.action">
                                <span style="float: left">{{ item.name }}</span>
                            </el-option>
                        </el-select>
                    </div>
                </el-col>
                <el-col :span="10" class="el-col">
                    <div class="text item">
                        <div class="itemTag">
                            <span>接受委托人:&nbsp;</span>
                        </div>
                        <el-select v-model="inputQuery.entrustUser" placeholder="接受委托人" clearable>
                            <el-option
                                v-for="item in entrustUserArray"
                                :key="item.userid"
                                :label="item.employeeName"
                                :value="item.userid">
                                <span style="float: left">{{ item.employeeName }}</span>
                            </el-option>

                        </el-select>

                    </div>
                </el-col>


            </el-row>
        </el-form>
    </div>
</template>

<script>

import {
    getBasicThirdSys,
} from "../../api/basic/basicThirdSys";

import {
    getLocalJoinNoUse
} from "../../api/basic/busLocalType";
import {filterAll, filterNext, warehouseBussinessTypeList, warehouseUserList} from "@/api/basic/invWarehouse";
import {getBasicUnitMaintains} from "@/api/basic/basicUnitMaintain";
import {filterNoUseBusType} from "@/api/basic/EntrustRece";
import {filterSubByInv,filterSub} from "@/api/basic/invSubWarehouse";


export default {
    name: "inputQuery",
    props: {
        inputQuery: {
            type: Object,
            required: true,
        },
    },

    data() {
        return {
            filterQuery: {
                enabled: true,
                isBuType: true,
                isFilterBind: true,
            },
            storageList: [],
            subInvList: [],
            entrustSubInvList: [],
            entrustStorageList: [],
            orderTypeList: [],
            fromSpecialOptions: [],
            thirdSys: [],
            busTypes: [],
            entrustBusArray: [],
            entrustUserArray: [],
            formRules: {
                action: [
                    {required: true, message: "请输入扫码单据类型", trigger: "blur"}
                ],
                entrustInv: [
                    {required: true, message: "请输入委托验收人仓库", trigger: "blur"}
                ],
                entrustUser: [
                    {required: true, message: "请输入委托验收人", trigger: "blur"}
                ],
            },
        }
    },
    methods: {
        getList() {
            getBasicThirdSys(this.filterQuery)
                .then((response) => {
                    this.thirdSys = response.data.list || [];
                })
                .catch(() => {
                    this.loading = false;
                    this.list = [];
                });
            let query = {
                curAction: this.inputQuery.localAction,
            };
            getLocalJoinNoUse(query)
                .then((response) => {
                    this.localTypes = response.data.list || [];
                })
                .catch(() => {
                    this.loading = false;
                    this.localTypes = [];
                });
        },

        findSubInvByInv() {
            this.subInvList = [];
            let query = {
                pcode: this.inputQuery.curInv,
                filter:3
            };
            filterSubByInv(query)
                .then((response) => {
                    this.subInvList = response.data || [];
                    this.getOrderType();
                })
                .catch(() => {
                });
        },


        findEntrustSubInvByInv(code) {
            this.entrustSubInvList = [];
            let query = {
                code: this.inputQuery.invWarehouseCode,
            };
            filterSub(query)
                .then((response) => {
                    this.entrustSubInvList = response.data || [];
                    this.entrustSubInvChange(code);
                })
                .catch(() => {
                });
        },

        getOrderType() {
            let query = {
                locSubInvCode: this.inputQuery.invWarehouseCode
            }
            filterNoUseBusType(query).then((response) => {
                this.busTypes = response.data || [];
            }).catch(() => {

            })
        },


        subInvChange() {
            this.getOrderType();
        },
        entrustInvChange(code) {
            this.inputQuery.curInv= this.subInvList.find(item => item.code == code).parentId
            this.$set(this.inputQuery, "action", "");
            this.$set(this.inputQuery, "entrustSubInv", "");
            this.getOrderType();
            this.findEntrustSubInvByInv();
        },

        entrustSubInvChange(code) {
            this.inputQuery.entrustInv= this.entrustSubInvList.find(item => item.code == code).parentId
            let query = {
                code: this.inputQuery.entrustSubInv,
            }
            //加载用户数据
            warehouseUserList(query).then((res) => {
                this.entrustUserArray = [];
                this.entrustUserArray = res.data.list;
            }).catch((error) => {
                this.$message.error("用户数据加载失败")
            });

            //加载单据类型数据
            warehouseBussinessTypeList(query).then((res) => {
                this.entrustBusArray = res.data.list;

            }).catch((error) => {
                this.$message.error("单据类型数据加载失败")
            });
        },
        entrustActionChange() {
            this.inputQuery.entrustUser = "";
        },

    },
    computed: {
        corpType() {
            return this.inputQuery.corpType;
        }
    },


    created() {
        this.findSubInvByInv();
        if(this.inputQuery.entrustSubInv!=null && this.inputQuery.entrustSubInv!=undefined){
            this.findEntrustSubInvByInv(this.inputQuery.entrustSubInv);
        }


        // if (this.$isNotBlank(this.inputQuery.entrustInv)) {
        //     this.findEntrustSubInvByInv();
        // }

    },
};
</script>

<style scoped>
.itemTag {
    float: left;
    text-align: left;
    margin-top: 10px;
    width: 100px;
}

.text {
    font-size: 13px;
    font-family: "Microsoft YaHei";
}

.el-row {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.el-col {
    border-radius: 4px;
    flex-wrap: wrap;
}
</style>
