<template>
    <div>
        <el-form ref="editForm" :model="postData" :rules="rules">
            <el-form-item label="渠道" prop="ChannelId">
                <el-select v-model="postData.ChannelId" placeholder="渠道" clearable filterable>
                    <el-option v-for="item in channels" :key="'channel2' + item.Id" :value="item.Id"
                        :label="item.Name" />
                </el-select>
            </el-form-item>

            <el-form-item label="通邮类型" prop="PostalType">
                <el-select v-model="postData.PostalType">
                    <el-option v-for="item in postalTypes" :key="item.value" :value="item.value" :label="item.name" />
                </el-select>
            </el-form-item>
            <el-form-item label="是否启用">
                <el-switch v-model="postData.Enabled" />
            </el-form-item>
            <el-form-item label="文件">
                <el-upload ref="upload" class="upload-demo" action="http://120.24.149.148/api/File/UpLoadLocalFile"
                    :on-success="uploadSuccess">
                    <el-button size="small" type="primary">点击上传</el-button>
                    <el-link type="primary" style="margin-left:20px" href="http://wms.xingyunyi.cn/Data/Template/PostalAreaTemplate.xlsx" target="_blank">下载模板
                    </el-link>
                </el-upload>
            </el-form-item>
        </el-form>
        <el-button type="success" @click="submitImport" :disabled="!fileUploaded">提交</el-button>
    </div>
</template>

<script>

export default {
    props: {
        channels: { type: Array }
    },
    data() {
        return {
            fileUploaded:false,
            postData: {},
            postalTypes: [
                { name: '通邮', value: 0 },
                { name: '偏远', value: 1 },
                { name: '不通邮', value: 2 }
            ],
            rules: {
                ChannelId: [{ required: true, message: '渠道不能为空', trigger: 'blur' }],
            }
        }
    },
    methods: {
        init(){
            this.postData={};
            this.fileUploaded=false;
            this.$refs['upload'].clearFiles();
        },
        submitImport() {
            this.$refs['editForm'].validate((valid) => {
                if (valid) {
                    this.$emit('onBatchImport', this.postData)
                } else {
                    return false
                }
            })
        },
        uploadSuccess(res) {
            let file = res.Data.file;
            this.postData.File = file;
            this.fileUploaded=true;
        }
    }
}
</script>

<style>

</style>