<template>
    <div>
        <el-button @click="showDialog=true"
                   type="danger">发送邮件
        </el-button>
         <el-dialog
                 :visible.sync="showDialog" width="500px">
             <el-form :model="formData" :rules="rules" ref="form" label-width="52px" label-position="right" size="small">
                 <el-form-item prop="desc" label="标题">
                     <el-input v-model="formData.title"></el-input>
                 </el-form-item>
                 <el-form-item prop="value" label="内容">
                     <el-input type="textarea" v-model="formData.content"></el-input>
                 </el-form-item>
             </el-form>
             <span slot="footer">
                     <el-button type="primary" size="mini" @click="save" :loading="saving">保存</el-button>
             </span>
         </el-dialog>
    </div>
</template>
<script>

    export default {
        data() {
            return {
                formData: {
                    receiveUserId: this.$route.query.id,
                    title: '',
                    content: '',
                },
                rules: {
                    title: [{ required: true, message: '请输入标题', trigger: 'blur' }],
                    content: [{ required: true, message: '请输入值', trigger: 'blur' }]
                },
                showDialog: false,
                saving: false
            }
        },
        mounted() {

        },
        methods: {
            save() {
                this.$refs.form.validate(valid => {
                    if (valid) {
                        let data = {...this.formData};
                        this.saving = true;
                        this.$http
                            .post('/rider/save', data, {body: 'json'})
                            .then(res => {
                                this.saving = false;
                                this.$message.success('成功');
                                this.showDialog = false;
                                this.getData();
                            })
                            .catch(e => {
                                console.log(e);
                                this.saving = false;
                                this.showDialog = false;
                                this.$message.error(e.error);
                            });
                    } else {
                        return false;
                    }
                });
            }
        }
    }
</script>
<style lang="less" scoped>
</style>
