You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
spms-vue/src/views/userManage/customerInfo.vue

305 lines
11 KiB
Vue

<template>
<div style="overflow: auto; height: 100%; margin: 0 auto">
<el-card class="el-card">
<el-form :model="inputQuery" :rules="rules" ref="inputQuery">
<el-row :gutter="20">
<el-col :span="3">
<div class="register-text">
<span>用户账号:&nbsp;</span>
</div>
</el-col>
<el-col :span="10">
<el-form-item prop="customerName">
<el-input
size="small"
placeholder="请输入用户账号"
v-model="inputQuery.customerName"
@input="change()"
></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="3">
<div class="register-text">
<span>邮箱:&nbsp;</span>
</div>
</el-col>
<el-col :span="10">
<el-form-item prop="email">
<el-input
size="small"
placeholder="请输入邮箱"
v-model="inputQuery.email"
@input="change()"
></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="3">
<div class="register-text">
<span>企业名称:&nbsp;</span>
</div>
</el-col>
<el-col :span="10">
<el-form-item prop="companyName">
<el-input
size="small"
placeholder="请输入企业名称"
v-model="inputQuery.companyName"
@input="change()"
></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="3">
<div class="register-text">
<span>统一社会信用号:&nbsp;</span>
</div>
</el-col>
<el-col :span="10">
<el-form-item prop="creditNum">
<el-input
size="small"
placeholder="请输入统一社会信用号"
v-model="inputQuery.creditNum"
@input="change()"
></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="3">
<div class="register-text">
<span>企业类型:&nbsp;</span>
</div>
</el-col>
<el-col :span="10">
<el-form-item prop="bussinessStatus">
<el-select
size="small"
style="width: 100%"
v-model="inputQuery.bussinessStatus"
placeholder="企业类型"
>
<el-option label="医院" value="1"></el-option>
<el-option label="经营企业" value="2"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="3">
<div class="register-text">
<span>所属地区:&nbsp;</span>
</div>
</el-col>
<el-col :span="10">
<el-form-item prop="area">
<el-input
size="small"
placeholder="请输入详细地址"
v-model="inputQuery.area"
@input="change()"
></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="3">
<div class="register-text">
<span>详细地址:&nbsp;</span>
</div>
</el-col>
<el-col :span="10">
<el-form-item prop="detailAddr">
<el-input
size="small"
placeholder="请输入详细地址"
v-model="inputQuery.detailAddr"
@input="change()"
></el-input>
</el-form-item>
</el-col>
</el-row>
<div style="width: 100%">
<el-form-item>
<el-button
type="primary"
size="small"
icon="search"
style="margin-top: 20px; width: 200px"
@click="onSubmit('inputQuery')"
>保存
</el-button
>
</el-form-item>
</div>
</el-form>
</el-card>
</div>
</template>
<script>
import {getCheckcode, register} from "../../api/auth/register";
import store from "../../store/index";
import {
getCustomers,
updateCustomers,
deleteCustomers,
customersInfo,
modifyCustomers,
} from "../../api/auth/customer";
import {
provinceAndCityData,
regionData,
provinceAndCityDataPlus,
regionDataPlus,
CodeToText,
TextToCode,
} from "element-china-area-data";
export default {
data() {
let validatePass2 = (rule, value, callback) => {
if (value === "") {
callback(new Error("请再次输入密码"));
} else if (value !== this.inputQuery.password) {
callback(new Error("两次输入密码不一致!"));
} else {
callback();
}
};
return {
inputQuery: {
customerName: null,
password: "",
realName: "",
tel: "",
mobile: "",
userId: "",
confirmPassword: "",
checkCode: "",
email: "",
companyName: "",
creditNum: "",
area: "",
detailAddr: "",
bussinessStatus: "",
},
isTimer: false,
btnTitle: "获取验证码",
options: regionDataPlus,
selectedOptions: [],
rules: {
nickName: [
{required: true, message: "请输入用户账号", trigger: "blur"},
],
password: [{required: true, message: "请输入密码", trigger: "blur"}],
realName: [
{required: true, message: "请输入真实姓名", trigger: "blur"},
],
tel: [{required: true, message: "请输入联系电话", trigger: "blur"}],
mobile: [{required: true, message: "请输入手机号", trigger: "blur"}],
confirmPassword: [
{required: true, message: "请确认密码", trigger: "blur"},
{validator: validatePass2, trigger: "blur"},
],
checkCode: [
{required: true, message: "请输入手机验证码", trigger: "blur"},
],
email: [{required: true, message: "请输入邮箱", trigger: "blur"}],
companyName: [
{required: true, message: "请输入企业名称", trigger: "blur"},
],
creditNum: [
{required: true, message: "请输入统一社会信用号", trigger: "blur"},
],
area: [{required: true, message: "请选择所属地区", trigger: "blur"}],
detailAddr: [
{required: true, message: "请输入详细地址", trigger: "blur"},
],
bussinessStatus: [
{required: true, message: "请选择企业类型", trigger: "blur"},
],
},
};
},
created() {
this.getData();
},
methods: {
onSubmit(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
this.loading = true;
modifyCustomers(this.inputQuery).then((response) => {
if (response.code === 20000) {
this.loading = false;
this.$message.success("修改成功");
} else {
this.$message.error(response.message);
}
});
} else {
console.log("error submit!!");
return false;
}
});
},
getData() {
this.loading = true;
let tquery = {
customerId: store.getters.customerId,
};
customersInfo(tquery).then((response) => {
this.loading = false;
this.inputQuery = response.data;
});
},
handleChange(value) {
this.inputQuery.area =
CodeToText[value[0]] + CodeToText[value[1]] + CodeToText[value[2]];
console.log(value + "\n" + this.inputQuery.area);
},
},
};
</script>
<style>
.register-text {
width: 100%;
font-size: 13px;
font-family: "Microsoft YaHei";
float: left;
text-align: left;
margin-top: 10px;
}
.el-card {
margin-right: 20px;
margin-top: 15px;
/*transition: all .5s;*/
}
.el-row {
display: flex;
flex-wrap: wrap;
}
.el-col {
border-radius: 4px;
flex-wrap: wrap;
}
</style>