497 lines
18 KiB
Vue
497 lines
18 KiB
Vue
<template>
|
|
<div >
|
|
<el-form ref="form" size="mini" :model="form" :rules="rules" label-width="100px">
|
|
<el-row :gutter="0" style="display: flex;flex-wrap: wrap;">
|
|
|
|
<el-col :span="8">
|
|
<el-form-item label="客户编码" prop="customerCode">
|
|
<el-input v-model="form.customerCode" placeholder="自动生成" disabled />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="寄件人" prop="customerName">
|
|
<el-input v-model="form.customerName" placeholder="请输入客户名称" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="手机号码" prop="phone" label-width="80px">
|
|
<el-input v-model="form.phone" placeholder="请输入电话" />
|
|
</el-form-item>
|
|
</el-col>
|
|
|
|
<!-- <el-col :span="8">
|
|
<el-form-item label="结算类型" prop="settledType">
|
|
<el-select v-model="form.settledType" placeholder="请选择">
|
|
<el-option
|
|
v-for="dict in dict.type.emis_cus_settled_type"
|
|
:key="dict.value"
|
|
:label="dict.label"
|
|
:value="dict.value"
|
|
></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col> -->
|
|
<!-- <el-col :span="8">
|
|
<el-form-item label="称呼" prop="nickName">
|
|
<el-input v-model="form.nickName" placeholder="请输入称呼" />
|
|
</el-form-item>
|
|
</el-col> -->
|
|
|
|
<!-- <el-col :span="8">
|
|
<el-form-item label="英文简称" prop="customerNameEn">
|
|
<el-input v-model="form.customerNameEn" placeholder="请输入英文简称" />
|
|
</el-form-item>
|
|
</el-col> -->
|
|
|
|
<el-col :span="8">
|
|
<el-form-item label="邮箱" prop="email">
|
|
<el-input v-model="form.email" placeholder="请输入email" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<!-- <el-col :span="8">
|
|
<el-form-item label="手机号" prop="mobile">
|
|
<el-input v-model="form.mobile" placeholder="请输入手机号" />
|
|
</el-form-item>
|
|
</el-col> -->
|
|
<!-- <el-col :span="8">
|
|
<el-form-item label="客户类型" prop="customerType">
|
|
<el-input v-model="form.customerType" placeholder="请输入客户类型" />
|
|
</el-form-item>
|
|
</el-col>
|
|
|
|
<el-col :span="8">
|
|
<el-form-item label="用户类型" prop="userType">
|
|
<el-input v-model="form.userType" placeholder="请输入用户类型" />
|
|
</el-form-item>
|
|
</el-col> -->
|
|
<!-- <el-col :span="8">
|
|
<el-form-item label="月结卡号" prop="monthlyPayCode">
|
|
<el-input v-model="form.monthlyPayCode" placeholder="月结卡号" />
|
|
</el-form-item>
|
|
</el-col> -->
|
|
<el-col :span="16">
|
|
<el-form-item label="所属公司" prop="company">
|
|
<el-input v-model="form.company" placeholder="请输入所属公司" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<!-- <el-col :span="8">
|
|
<el-form-item label="真实姓名" prop="realName">
|
|
<el-input v-model="form.realName" placeholder="请输入真实姓名" />
|
|
</el-form-item>
|
|
</el-col> -->
|
|
<!--
|
|
<el-col :span="8">
|
|
<el-form-item label="头像" prop="avatar">
|
|
<el-input v-model="form.avatar" placeholder="请输入头像" />
|
|
</el-form-item>
|
|
</el-col> -->
|
|
<!-- <el-col :span="8">
|
|
<el-form-item label="性别" prop="sex">
|
|
<el-input v-model="form.sex" placeholder="请输入性别" />
|
|
</el-form-item>
|
|
</el-col> -->
|
|
<!-- <el-col :span="8">
|
|
<el-form-item label="邀请人" prop="invitationInfo">
|
|
<el-input v-model="form.invitationInfo" placeholder="请输入邀请人" />
|
|
</el-form-item>
|
|
</el-col> -->
|
|
<!-- <el-col :span="8">
|
|
<el-form-item label="最后登录ip" prop="loginIp">
|
|
<el-input v-model="form.loginIp" placeholder="请输入最后登录ip" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="最后登录日期" prop="loginDate">
|
|
<el-input v-model="form.loginDate" placeholder="请输入最后登录日期" />
|
|
</el-form-item>
|
|
</el-col> -->
|
|
|
|
<!-- <el-col :span="8">
|
|
<el-form-item label="union_id" prop="unionId">
|
|
<el-input v-model="form.unionId" placeholder="请输入union_id" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="wxopenid" prop="openid">
|
|
<el-input v-model="form.openid" placeholder="请输入wxopenid" />
|
|
</el-form-item>
|
|
</el-col> -->
|
|
<!-- -->
|
|
<!-- <el-col :span="8">
|
|
<el-form-item label="登录账号" prop="userName">
|
|
<el-input v-model="form.userName" placeholder="请输入登录账号" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="登录密码" prop="password">
|
|
<el-input v-model="form.password" placeholder="请输入登录密码" />
|
|
</el-form-item>
|
|
</el-col> -->
|
|
|
|
|
|
<el-col :span="8">
|
|
<el-form-item label="所属国家" prop="country">
|
|
<CountryPicker :placeholder="$t('所属国家')" v-model="form.country" ></CountryPicker>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="16">
|
|
<el-form-item label="省市区" prop="areaInfo">
|
|
<div style="display: inline-flex">
|
|
<ProvincePicker v-model="form.province" :countryCode="form.country" ></ProvincePicker>
|
|
<CityPicker v-model="form.city" :parentCode="form.province" ></CityPicker>
|
|
<DistrictPicker v-model="form.county" :parentCode="form.city" ></DistrictPicker>
|
|
<!-- <TownPicker v-model="form.town" :parentCode="form.county" ></TownPicker> -->
|
|
</div>
|
|
</el-form-item>
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="24">
|
|
<el-form-item label="地址" prop="address">
|
|
<el-input v-model="form.address" type="textarea" placeholder="请输入地址" />
|
|
</el-form-item>
|
|
</el-col>
|
|
|
|
<!-- <el-col :span="8">
|
|
<el-form-item label="发件国" prop="sendCountry">
|
|
<el-input v-model="form.sendCountry" placeholder="请输入发件国" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="发件省" prop="sendProvince">
|
|
<el-input v-model="form.sendProvince" placeholder="请输入发件省" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="发件区" prop="sendCity">
|
|
<el-input v-model="form.sendCity" placeholder="请输入发件区" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="发件区" prop="sendCounty">
|
|
<el-input v-model="form.sendCounty" placeholder="请输入发件区" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="发件镇" prop="sendTown">
|
|
<el-input v-model="form.sendTown" placeholder="请输入发件镇" />
|
|
</el-form-item>
|
|
</el-col> -->
|
|
<!-- <el-col :span="8">
|
|
<el-form-item label="邮编" prop="postCode">
|
|
<el-input v-model="form.postCode" placeholder="请输入邮编" />
|
|
</el-form-item>
|
|
</el-col> -->
|
|
|
|
<!-- <el-col :span="8">
|
|
<el-form-item label="真实姓名" prop="realName">
|
|
<el-input v-model="form.realName" placeholder="请输入真实姓名" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="身份证号" prop="idNo">
|
|
<el-input v-model="form.idNo" placeholder="请输入身份证号" />
|
|
</el-form-item>
|
|
</el-col> -->
|
|
<!-- <el-col :span="8">
|
|
<el-form-item label="所属站点" prop="ownerSite">
|
|
<EmisSiteSimplePicker :placeholder="$t('所属站点')" v-model="form.ownerSite" disabled></EmisSiteSimplePicker>
|
|
</el-form-item>
|
|
</el-col> -->
|
|
<el-col :span="8">
|
|
<el-form-item label="所属业务员" prop="opEmpCode" label-width="100px">
|
|
<EmisUserSimplePicker0 :placeholder="$t('所属业务员')" v-model="form.opEmpCode" ></EmisUserSimplePicker0>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="回款联系人" prop="payee" label-width="100px">
|
|
<EmisUserSimplePicker1 :placeholder="$t('回款联系人')" v-model="form.payee" ></EmisUserSimplePicker1>
|
|
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<!-- postCode="OP" -->
|
|
<el-form-item label="销售联系人" prop="salesmen" label-width="100px">
|
|
<EmisUserSimplePicker2 :placeholder="$t('销售联系人')" v-model="form.salesmen" ></EmisUserSimplePicker2>
|
|
</el-form-item>
|
|
</el-col>
|
|
<!-- <el-col :span="8">
|
|
<el-form-item label="启用状态" prop="status">
|
|
<el-input v-model="form.status" placeholder="请输入启用状态" />
|
|
</el-form-item>
|
|
</el-col> -->
|
|
|
|
<!-- <el-col :span="12">
|
|
<el-form-item label="开通OMS" prop="blOpenOms" label-width="100px">
|
|
<el-radio-group v-model="form.blOpenOms">
|
|
<el-radio :label="1">是</el-radio>
|
|
<el-radio :label="0">否</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-col> -->
|
|
|
|
<!-- <el-col :span="12">
|
|
<el-form-item label="是否短信" prop="blSms">
|
|
<el-radio-group v-model="form.blSms">
|
|
<el-radio :label="1">是</el-radio>
|
|
<el-radio :label="0">否</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-col> -->
|
|
<el-col :span="12">
|
|
<el-form-item label="启用状态" prop="status">
|
|
<el-radio-group v-model="form.status">
|
|
<el-radio :label="1">启用</el-radio>
|
|
<el-radio :label="0">停用</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-col>
|
|
<!--
|
|
<el-col :span="8">
|
|
<el-form-item label="排序" prop="orderNum">
|
|
<el-input v-model="form.orderNum" placeholder="请输入排序" />
|
|
</el-form-item>
|
|
</el-col> -->
|
|
<el-col :span="24">
|
|
<el-form-item label="备注" prop="remark">
|
|
<el-input v-model="form.remark" type="textarea" placeholder="请输入备注" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
|
|
</el-form>
|
|
|
|
<div style="text-align: center;margin-bottom: 10px;">
|
|
<el-button type="primary" @click="submitForm">确 定</el-button>
|
|
<el-button @click="cancel">取 消</el-button>
|
|
</div>
|
|
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { listEmisCustomerUser, getEmisCustomerUser, delEmisCustomerUser, addEmisCustomerUser, updateEmisCustomerUser } from "@/api/emis/emisCustomerUser";
|
|
import CountryPicker from '@/views/emis/EmisBaseTools/CountryPicker.vue';
|
|
import EmisSiteSimplePicker from '@/views/emis/EmisBaseTools/EmisSiteSimplePicker.vue';
|
|
import ProvincePicker from '@/views/emis/EmisBaseTools/ProvincePicker.vue';
|
|
import CityPicker from '@/views/emis/EmisBaseTools/CityPicker.vue';
|
|
import DistrictPicker from '@/views/emis/EmisBaseTools/DistrictPicker.vue';
|
|
|
|
|
|
import EmisUserSimplePicker0 from '@/views/emis/EmisBaseTools/EmisUserSimplePicker.vue';
|
|
import EmisUserSimplePicker1 from '@/views/emis/EmisBaseTools/EmisUserSimplePicker.vue';
|
|
import EmisUserSimplePicker2 from '@/views/emis/EmisBaseTools/EmisUserSimplePicker.vue';
|
|
|
|
export default {
|
|
name: "emisCustomerUserForm",
|
|
props:{
|
|
id:{
|
|
type:Number
|
|
},
|
|
customerType:{
|
|
type:[Number,String],
|
|
required: true
|
|
}
|
|
},
|
|
components: {
|
|
CountryPicker,
|
|
EmisSiteSimplePicker,ProvincePicker,CityPicker,DistrictPicker,
|
|
EmisUserSimplePicker0,EmisUserSimplePicker1,EmisUserSimplePicker2
|
|
},
|
|
dicts: ['emis_cus_settled_type'],
|
|
data() {
|
|
return {
|
|
emisCustomerUserOptions: [],
|
|
// 遮罩层
|
|
loading: true,
|
|
// 表单参数
|
|
form: {},
|
|
// 表单校验
|
|
rules: {
|
|
customerName: [
|
|
{ required: true, message: "客户名称不能为空", trigger: ["blur",'change'] }
|
|
],
|
|
phone: [
|
|
{ required: true, message: "电话不能为空", trigger: "blur" }
|
|
],
|
|
customerType: [
|
|
{ required: true, message: "客户类型不能为空", trigger: "blur" }
|
|
],
|
|
// settledType: [
|
|
// { required: true, message: "结算类型不能为空", trigger: "blur" }
|
|
// ],
|
|
// monthlyPayCode: [
|
|
// { required: true, message: "主月结卡号不能为空", trigger: "blur" }
|
|
// ],
|
|
ownerSite: [
|
|
{ required: true, message: "归属站点不能为空", trigger: ["blur",'change'] }
|
|
],
|
|
areaInfo: [
|
|
{ validator: this.validateMuti,message: "省份不能为空", trigger: ["blur",'change'] }
|
|
],
|
|
country: [
|
|
{ required: true, message: "国家不能为空", trigger: ["blur",'change'] }
|
|
],
|
|
// province: [
|
|
// { required: true, message: "省份不能为空", trigger: ["blur",'change'] }
|
|
// ],
|
|
address: [
|
|
{ required: true, message: "地址不能为空", trigger: "blur" }
|
|
],
|
|
status: [
|
|
{ required: true, message: "启用状态不能为空", trigger: ["blur",'change'] }
|
|
],
|
|
payee: [
|
|
{ required: true, message: "回款联系人不能为空", trigger: ["blur",'change'] }
|
|
],
|
|
salesmen: [
|
|
{ required: true, message: "销售联系人不能为空", trigger: ["blur",'change'] }
|
|
],
|
|
blOpenOms: [
|
|
{ required: true, message: "是否开通oms不能为空", trigger: ["blur",'change'] }
|
|
],
|
|
blSms: [
|
|
{ required: true, message: "是否短信不能为空", trigger: ["blur",'change']}
|
|
],
|
|
opEmpCode: [
|
|
{ required: true, message: "专属业务员不能为空", trigger: ["blur",'change'] }
|
|
],
|
|
}
|
|
};
|
|
},
|
|
watch: {
|
|
"id": {
|
|
handler (newValue, oldValue) {
|
|
this.id = newValue;
|
|
this.initData();
|
|
},
|
|
deep: true
|
|
}
|
|
},
|
|
created() {
|
|
this.initData();
|
|
},
|
|
|
|
methods: {
|
|
validateMuti (rule, value, callback) {
|
|
// if (!this.form.country) {
|
|
// callback(new Error("国家不能为空"));
|
|
// }
|
|
if (!this.form.province) {
|
|
callback(new Error("省份不能为空"));
|
|
}
|
|
else {
|
|
callback();
|
|
}
|
|
},
|
|
initData() {
|
|
if(this.id !=null) {
|
|
this.loading = true;
|
|
getEmisCustomerUser(this.id).then(response => {
|
|
this.form = response.data;
|
|
this.loading = false;
|
|
});
|
|
}else{
|
|
this.reset();
|
|
}
|
|
},
|
|
// 取消按钮
|
|
cancel() {
|
|
this.reset();
|
|
this.$emit("on-cancel");
|
|
},
|
|
// 表单重置
|
|
reset() {
|
|
this.form = {
|
|
id: null,
|
|
customerCode: null,
|
|
customerName: null,
|
|
customerNameEn: null,
|
|
phone: null,
|
|
mobile: null,
|
|
customerType: this.customerType,
|
|
settledType: '1',
|
|
userType: null,
|
|
company: null,
|
|
deptId: null,
|
|
avatar: null,
|
|
sex: null,
|
|
invitationInfo: null,
|
|
loginIp: null,
|
|
loginDate: null,
|
|
nickName: null,
|
|
unionId: null,
|
|
openid: null,
|
|
monthlyPayCode: null,
|
|
userName: null,
|
|
password: null,
|
|
ownerSite: null,
|
|
country: null,
|
|
province: null,
|
|
city: null,
|
|
county: null,
|
|
town: null,
|
|
address: null,
|
|
email: null,
|
|
sendCountry: null,
|
|
sendProvince: null,
|
|
sendCity: null,
|
|
sendCounty: null,
|
|
sendTown: null,
|
|
postCode: null,
|
|
status: null,
|
|
realName: null,
|
|
idNo: null,
|
|
payee: null,
|
|
salesmen: null,
|
|
blOpenOms: null,
|
|
blSms: null,
|
|
opEmpCode: null,
|
|
orderNum: null,
|
|
remark: null,
|
|
delFlag: null,
|
|
createBy: null,
|
|
createTime: null,
|
|
updateBy: null,
|
|
updateTime: null,
|
|
createSite: null,
|
|
updateSite: null
|
|
};
|
|
this.resetForm("form");
|
|
},
|
|
/** 提交按钮 */
|
|
submitForm() {
|
|
this.$refs["form"].validate(valid => {
|
|
if (valid) {
|
|
if (this.form.id != null) {
|
|
updateEmisCustomerUser(this.form).then(response => {
|
|
this.$modal.msgSuccess("修改成功");
|
|
this.$emit("on-changed");
|
|
});
|
|
} else {
|
|
addEmisCustomerUser(this.form).then(response => {
|
|
this.$modal.msgSuccess("修改成功");
|
|
this.$emit("on-changed");
|
|
});
|
|
}
|
|
}
|
|
});
|
|
},
|
|
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
// .el-row{
|
|
// display:flex;
|
|
// flex-wrap: wrap;
|
|
// }
|
|
|
|
// .el-col{
|
|
// min-height: 1px;
|
|
// }
|
|
|
|
</style>
|