|
|
@@ -0,0 +1,112 @@ |
|
|
|
<template> |
|
|
|
<div> |
|
|
|
<el-form ref="form" :rules="rules" :model="form"> |
|
|
|
<el-form-item class="width" prop="name"> |
|
|
|
<el-input v-model="form.name" maxlength="10" :placeholder="characters==1?'姓名':'Name'"></el-input> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item class="width" prop="phone"> |
|
|
|
<el-input v-model="form.phone" :placeholder=" characters==1?'手机':'Phone'"></el-input> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item class="width" prop="Pmail"> |
|
|
|
<el-input v-model="form.email" placeholder="Email"></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
|
<span slot="footer" class="dialog-footer"> |
|
|
|
<el-button @click="close">{{characters==1?'取 消':'Cancel'}}</el-button> |
|
|
|
<el-button type="primary" @click="submit() ">{{characters==1?'提 交':'Submit'}}</el-button> |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
<script> |
|
|
|
import { mapState } from 'vuex' |
|
|
|
export default { |
|
|
|
data() { |
|
|
|
return { |
|
|
|
form: { |
|
|
|
name: "", |
|
|
|
phone: "", |
|
|
|
email: "" |
|
|
|
}, |
|
|
|
rules: { |
|
|
|
name: [ |
|
|
|
{ |
|
|
|
required: true, |
|
|
|
min: 1, |
|
|
|
max: 10, |
|
|
|
message: "此项必填,内容最大10个字符!", |
|
|
|
trigger: "blur" |
|
|
|
} |
|
|
|
], |
|
|
|
phone: [ |
|
|
|
{ |
|
|
|
required: true, |
|
|
|
trigger: "change", |
|
|
|
message: "请先输手机号" |
|
|
|
}, |
|
|
|
{ |
|
|
|
validator(rule, value, callback, source, options) { |
|
|
|
var errors = []; |
|
|
|
// var mobile = /^1[0|1|2|3|4|5|6|7|8|9]\d{9}$/, |
|
|
|
let phone = /^1[35789]\d{9}$/; |
|
|
|
if (value && !phone.test(value)) { |
|
|
|
callback("抱歉,请输入正确的手机号"); |
|
|
|
} |
|
|
|
callback(errors); |
|
|
|
} |
|
|
|
} |
|
|
|
], |
|
|
|
email: [ |
|
|
|
{ |
|
|
|
required: true, |
|
|
|
trigger: "change", |
|
|
|
message: "请先输邮箱" |
|
|
|
} |
|
|
|
] |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
...mapState({ |
|
|
|
characters: state => state.publicObj.characters |
|
|
|
}) |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
close() { |
|
|
|
this.$emit('close') |
|
|
|
}, |
|
|
|
submit() { |
|
|
|
this.$refs.form.validate(valid => { |
|
|
|
console.log(valid); |
|
|
|
if (valid) { |
|
|
|
let params = { |
|
|
|
mallName: this.form.email, //邮箱 |
|
|
|
applicant: this.form.name, //姓名 |
|
|
|
phone: this.form.phone //电话 |
|
|
|
}; |
|
|
|
this.$axios({ |
|
|
|
method: "post", |
|
|
|
url: "/api/callback/wxMallApply/add", |
|
|
|
headers: { |
|
|
|
"Content-Type": "application/json;charset=UTF-8" |
|
|
|
}, |
|
|
|
data: params |
|
|
|
}) |
|
|
|
.then(res => { |
|
|
|
this.form.email = ""; |
|
|
|
this.form.name = ""; |
|
|
|
this.form.phone = ""; |
|
|
|
this.$message.success( |
|
|
|
this.characters == 1 ? "提交成功" : "submit successfully" |
|
|
|
); |
|
|
|
this.dialogVisible = false; |
|
|
|
this.$emit('close') |
|
|
|
}) |
|
|
|
.catch(err => { |
|
|
|
this.$message.error(err.message); |
|
|
|
}); |
|
|
|
} |
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
</script> |