<template>
    <div>
        <el-dialog :title="openStatus == 'add'?'新 增':'导出Excel'" :visible.sync="open" width="25%"
            :close-on-click-modal="false" :show-close="false" append-to-body center>
            <el-form class="form-header" :model="formData" size="small" ref="addForm" label-width="auto"
                label-position="left" style="margin-bottom:10px" :rules="rules" @submit.native.prevent>
                <div v-if="openStatus == 'add'">
                    <el-form-item label="货站名称" prop="goodsStation">
                        <el-input type="text" v-model="formData.goodsStation" maxlength="25" placeholder="请输入货站名称">
                        </el-input>
                    </el-form-item>
                    <el-form-item label="品名" prop="goodsList">
                        <el-input type="textarea" v-model="formData.goodsList" rows="4" maxlength="125"
                            placeholder="请输入品名，多个用“;”隔开">
                        </el-input>
                    </el-form-item>
                </div>
                <div v-else>
                    <el-form-item label="货站名称" prop="goodsStation">
                        <el-select class="selectWidth100" v-model.lazy="formData.goodsStation" filterable
                            :loading="goodsStationLoading" placeholder="不限">
                            <el-option v-for="(item, index) in goodsStationList" :label="item" :value="item"
                                :key="item">
                            </el-option>
                        </el-select>
                    </el-form-item>
                </div>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button v-if='openStatus == "add"' type="primary" :loading="loading" @click="submit">确 定</el-button>
                <el-button v-else type="primary" :loading="downloading" @click="download">导出Excel</el-button>
                <el-button @click="close">取 消</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
import { batchAddGoods, findStationName } from "@/api/goodsStation"
import { downLoadXlsx } from "@/utils/zipdownload";

export default {
    name: '',
    props: {
        open: {
            type: Boolean,
            default: false
        },
        openStatus: {
            type: String,
            default: 'add'
        }
    },
    data() {
        return {
            formData: {
                goodsStation: null,
                goodsList: ''
            },
            goodsStationList: [],
            rules: {
                goodsStation: [
                    {
                        required: true,
                        message: "货站名称不能为空",
                        trigger: "change",
                    },
                ],
                goodsList: [
                    {
                        required: true,
                        message: "品名不能为空",
                        trigger: "blur",
                    },
                ],
            },
            goodsStationLoading: false,
            downloading: false,
            loading: false,
        }
    },
    watch: {
        open(val) {
            if (val && this.openStatus == 'downloadExcel') {
                this.getgoods()
            }
        }
    },
    methods: {
        //查询货站
        getgoods() {
            this.goodsStationLoading = true
            findStationName().then(res => {
                this.goodsStationLoading = false
                if (res.code === 200) {
                    this.goodsStationList = res.data.list
                } else {
                    this.msgWarning(res.msg)
                }
            }).catch(err => {
                this.goodsStationLoading = false
                console.log(err)
            })
        },
        //提交
        submit() {
            let obj = {}
            obj.goodsStation = this.formData.goodsStation
            this.formData.goodsList = this.formData.goodsList.replace(/；/g, ";")
            if (this.formData.goodsList != null && this.formData.goodsList != '') {
                obj.goodsList = this.formData.goodsList.split(';')
            }
            this.$refs['addForm'].validate(val => {
                if (val) {
                    this.loading = true
                    batchAddGoods(obj).then(res => {
                        this.loading = false
                        if (res.code === 200) {
                            this.msgSuccess('添加成功')
                            this.close()
                        } else {
                            this.msgWarning(res.msg)
                        }
                    }).catch(err => {
                        this.loading = false
                        console.log(err)
                    })
                }
            })
        },
        //导出Excel
        download() {
            this.$refs['addForm'].validate(val => {
                if (val) {
                    this.downloading = true
                    let data = { goodsStation: this.formData.goodsStation }
                    downLoadXlsx("/goods/exportGoods", data, "货站表")
                        .then(() => {
                            this.downloading = false
                            this.close()
                        })
                        .catch(() => {
                            this.downloading = false
                        });
                }
            })

        },
        //取消
        close() {
            this.formData = {
                goodsStation: null,
                goodsList: null
            }
            this.$refs["addForm"].clearValidate();
            this.$emit('close')
        }

    }
}

</script>

<style lang="scss" scoped>

</style>