<template>
    <div>
        <el-dialog title="修改推广" :visible.sync="dialog" center width="600px" top="50px">
            <div>
                <el-form ref="form" :model="form" :rules="formRules" label-width="120px">
                    <el-form-item label="渠道ID">{{exData.channel_id}}</el-form-item>
                    <el-form-item label="推广来源">{{exData.source.sources_name}}</el-form-item>
                    <el-form-item label="推广形式">{{exData.type.type_name}}</el-form-item>
                    <el-form-item label="负责人">{{exData.admin.admin_name}}</el-form-item>
                    <el-form-item label="目标URL" prop="promotion_url" :rules="formRules.required">
                        <el-input v-model="form.promotion_url" placeholder=" 推广时所指向您网站的URL"></el-input>
                    </el-form-item>
                    <el-form-item label="推广名称" prop="promotion_name" :rules="formRules.required">
                        <el-input v-model="form.promotion_name" placeholder="推广的名称，如：春季福利"></el-input>
                    </el-form-item>
                    <el-form-item label="推广备注" prop="remark" :rules="formRules.required">
                        <el-input type="textarea" :rows="6" v-model="form.remark"></el-input>
                    </el-form-item>
                </el-form>
            </div>
            <div slot="footer" class="dialog-footer text-center">
                <el-button @click="dialog = false">取 消</el-button>
                <el-button type="primary" @click="handleSubmit">确 定</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
export default {
    props: {
        value: {
            type: Boolean,
            default: true,
        },
        exData: {
            type: Object,
            default: {},
        },
    },
    data() {
        return {
            form: {
                promotion_url: undefined,
                promotion_name: undefined,
                remark: undefined,
            },
            dialog: !!this.value,
        }
    },
    methods: {
        async handleSubmit() {
            this.$refs.form.validate(async valid => {
                if (valid) {
                    const data = await this.$fetch('/editUserPromote', {...this.form})
                    if (data.code == 200) {
                        this.$message.success('成功')
                        this.dialog = false
                        this.$emit('success')
                    }
                }
            })
        },
    },
    mounted() {
        if (this.exData.id) {
            this.form.id = this.exData.id
            for (const key in this.form) {
                this.form[key] = this.exData[key]
            }
        } else {
            this.form.project_id = this.exData.projectList[0].id
        }
    },
    watch: {
        dialog(val) {
            if (!val) this.$emit('input', val)
        },
    },
}
</script>
<style lang="scss">

</style>
