HandOver-liuwu
/
frontend
mirror of https://codeup.aliyun.com/lsxd/marketing/frontend.git
4
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

🦺 新建、编辑子账号只校验账号和手机号

This commit is contained in:
wangsongsole 2023-04-27 16:30:29 +08:00
parent b6b5a96b17
commit 799a288849
1 changed files with 173 additions and 204 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

377
src/pages/system/subAccount/add/adduserinfo/adduserinfo.js
View File

@ -1,13 +1,13 @@
import React from "react";
import "./adduserinfo.less";
import Ipt from "@/components/input/main";
import Form from "@/components/form/main";
import FormItem from "@/components/form-item/main";
import "@/assets/comm.css";
import Tree from "./tree";
import { Select, Button, ImageUpload, Sweetalert, Notify, Card } from "zent";
import Bus from "@/assets/eventBus.js";
import cloneDeep from "lodash/cloneDeep";
import React from 'react';
import './adduserinfo.less';
import Ipt from '@/components/input/main';
import Form from '@/components/form/main';
import FormItem from '@/components/form-item/main';
import '@/assets/comm.css';
import Tree from './tree';
import { Select, Button, ImageUpload, Sweetalert, Notify, Card } from 'zent';
import Bus from '@/assets/eventBus.js';
import cloneDeep from 'lodash/cloneDeep';
import {
handelResponse,
uploadImg,
@ -17,7 +17,7 @@ import {
getRole,
postAddSubAcc,
getDepartmentJob
} from "@/assets/api.js";
} from '@/assets/api.js';
export default class addUserinfo extends React.Component {
constructor(props) {
super(props);
@ -25,23 +25,23 @@ export default class addUserinfo extends React.Component {
this.state = {
model: {
//数据模型不可少
user_name: "",
mobile: "",
password: "",
real_name: "",
company: "",
deparment: "",
post: ""
user_name: '',
mobile: '',
password: '',
real_name: '',
company: '',
deparment: '',
post: ''
},
companyList: [], //公司
departmentList: [], //部门
departmentJob: [], //岗位
roleList: [], //角色
headImg: "",
pwdtype: "text",
defaultFileList: [{ src: "" }],
headImg: '',
pwdtype: 'text',
defaultFileList: [{ src: '' }],
disabled: false,
id: "",
id: '',
ruleId: []
};
}
@ -50,7 +50,7 @@ export default class addUserinfo extends React.Component {
componentWillMount() {
let _self = this;
this.getCompanyFn(); //获取公司
let companys = JSON.parse(sessionStorage.getItem("company"));
let companys = JSON.parse(sessionStorage.getItem('company'));
if (!companys) {
this.getCompanyFn(); //获取公司
}
@ -58,12 +58,12 @@ export default class addUserinfo extends React.Component {
this.getRoleFn(); //获取角色
let formInfo = this.props;
if (formInfo && formInfo.enumer == 1) {
this.setState({ pwdtype: "password" });
this.setState({ pwdtype: 'password' });
let acceptData = cloneDeep(formInfo.rowData);
let data = {
user_name: acceptData.user_name,
mobile: acceptData.mobile,
password: "yxtx2021",
password: 'yxtx2021',
real_name: acceptData.real_name,
company: companys.find((o) => o.key == acceptData.company_id),
deparment: {
@ -124,7 +124,7 @@ export default class addUserinfo extends React.Component {
}
}
changeKind() {
this.setState({ pwdtype: "password" });
this.setState({ pwdtype: 'password' });
}
submit() {
let valiform = this.refs.form1.validator();
@ -132,111 +132,102 @@ export default class addUserinfo extends React.Component {
let iptVal = this.state.model;
let _this = this;
if (valiform) {
if (!roleArr || roleArr.length < 1) {
Notify.clear();
Notify.error("请设置子账号权限");
} else {
//取消二次弹出框
Sweetalert.confirm({
type: "warning",
closeBtn: true,
title: "确认操作",
content:
_this.props.enumer == 0 ? (
<p>
是否新增<b>[{iptVal.user_name}]</b>账号？
</p>
) : (
<p>
是否修改<b>[{iptVal.user_name}]</b>账号信息？
</p>
),
onConfirm: () => {
//提交接口
let data = {
user_name: iptVal.user_name,
password: iptVal.password,
job_id: iptVal.post.key,
real_name: iptVal.real_name,
mobile: iptVal.mobile,
assist_user_id: sessionStorage.getItem("subaid"),
rule: roleArr
};
if (_this.state.headImg) {
data.head = _this.state.headImg;
}
//取消二次弹出框
Sweetalert.confirm({
type: 'warning',
closeBtn: true,
title: '确认操作',
content:
_this.props.enumer == 0 ? (
<p>
是否新增<b>[{iptVal.user_name}]</b>账号？
</p>
) : (
<p>
是否修改<b>[{iptVal.user_name}]</b>账号信息？
</p>
),
onConfirm: () => {
//提交接口
let data = {
user_name: iptVal.user_name,
password: iptVal.password,
job_id: iptVal.post.key,
real_name: iptVal.real_name,
mobile: iptVal.mobile,
assist_user_id: sessionStorage.getItem('subaid'),
rule: roleArr
};
if (_this.state.headImg) {
data.head = _this.state.headImg;
}
if (_this.props.enumer == 0) {
postAddSubAcc(data)
.then((res) => {
handelResponse(
res,
(response, msg) => {
Notify.clear();
Notify.success(msg);
setTimeout(() => {
// window.history.back()
window.location.replace(
"#/home/system/subaccount-list"
);
sessionStorage.setItem(
"pathname2",
"/home/system/subaccount-list"
);
}, 1000);
},
(err) => {
Notify.error(err);
}
);
})
.catch((err) => {});
} else {
//编辑
let id = _this.state.id;
delete data.password;
data.head = _this.state.headImg;
putAddSubAcc(id, data)
.then((res) => {
handelResponse(
res,
(response, msg) => {
Notify.clear();
Notify.success(msg);
setTimeout(() => {
// window.history.back()
window.location.replace(
"#/home/system/subaccount-list"
);
sessionStorage.setItem(
"pathname2",
"/home/system/subaccount-list"
);
}, 1000);
},
(err) => {
Notify.error(err);
}
);
})
.catch((err) => {});
}
},
onCancel: this.onCancel,
className: "questModal",
parentComponent: this
});
}
if (_this.props.enumer == 0) {
postAddSubAcc(data)
.then((res) => {
handelResponse(
res,
(response, msg) => {
Notify.clear();
Notify.success(msg);
setTimeout(() => {
// window.history.back()
window.location.replace('#/home/system/subaccount-list');
sessionStorage.setItem(
'pathname2',
'/home/system/subaccount-list'
);
}, 1000);
},
(err) => {
Notify.error(err);
}
);
})
.catch((err) => {});
} else {
//编辑
let id = _this.state.id;
delete data.password;
data.head = _this.state.headImg;
putAddSubAcc(id, data)
.then((res) => {
handelResponse(
res,
(response, msg) => {
Notify.clear();
Notify.success(msg);
setTimeout(() => {
// window.history.back()
window.location.replace('#/home/system/subaccount-list');
sessionStorage.setItem(
'pathname2',
'/home/system/subaccount-list'
);
}, 1000);
},
(err) => {
Notify.error(err);
}
);
})
.catch((err) => {});
}
},
onCancel: this.onCancel,
className: 'questModal',
parentComponent: this
});
} else {
Notify.clear();
Notify.error("请完善表单数据");
Notify.error('请完善表单数据');
}
}
onUploadError = (type, data) => {
if (type === "overMaxAmount") {
if (type === 'overMaxAmount') {
Notify.clear();
Notify.error(`最多可上传 ${data.maxAmount} 张图片`);
} else if (type === "overMaxSize") {
} else if (type === 'overMaxSize') {
Notify.clear();
Notify.error(`图片大小不能超过 ${data.formattedMaxSize}b`);
}
@ -247,8 +238,8 @@ export default class addUserinfo extends React.Component {
let _self = this;
if (files && files.length > 0) {
let formdata = new FormData();
formdata.append("file", files[0].file);
formdata.append("path", "account_avatar");
formdata.append('file', files[0].file);
formdata.append('path', 'account_avatar');
uploadImg(formdata)
.then((res) => {
handelResponse(
@ -265,15 +256,15 @@ export default class addUserinfo extends React.Component {
})
.catch((err) => {});
} else {
_self.setState({ headImg: "" });
_self.setState({ headImg: '' });
}
}
onCompanyChange(e) {
if (!e) {
let _self = this;
let model2 = this.state.model;
model2.deparment = "";
model2.post = "";
model2.deparment = '';
model2.post = '';
this.setState({
model: model2
});
@ -287,8 +278,8 @@ export default class addUserinfo extends React.Component {
//调部门的数据
if (e) {
let model3 = this.state.model;
model3.deparment = "";
model3.post = "";
model3.deparment = '';
model3.post = '';
_self.setState({ departmentList: [] });
_self.setState({ departmentJob: [] });
_self.setState({ model: model3 });
@ -300,7 +291,7 @@ export default class addUserinfo extends React.Component {
(response, msg) => {
let departmentList = response.map((item) => {
return { key: item.id, text: item.department_name };
_self.setState({ deparment: "" });
_self.setState({ deparment: '' });
});
_self.setState({ departmentList });
},
@ -319,7 +310,7 @@ export default class addUserinfo extends React.Component {
if (!e) {
let _self = this;
let model2 = this.state.model;
model2.post = "";
model2.post = '';
this.setState({
model: model2
});
@ -343,7 +334,7 @@ export default class addUserinfo extends React.Component {
});
_self.setState({ departmentJob });
let model3 = this.state.model;
model3.post = "";
model3.post = '';
_self.setState({ model: model3 });
},
(err) => {
@ -375,7 +366,7 @@ export default class addUserinfo extends React.Component {
let companyList = response.map((item) => {
return { key: item.id, text: item.company_name };
});
sessionStorage.setItem("company", JSON.stringify(companyList));
sessionStorage.setItem('company', JSON.stringify(companyList));
_self.setState({ companyList });
},
(err) => {
@ -411,17 +402,17 @@ export default class addUserinfo extends React.Component {
cancel() {
//取消二次弹出框
Sweetalert.confirm({
type: "warning",
type: 'warning',
closeBtn: true,
title: "确认操作",
title: '确认操作',
content: <p>是否取消本次操作？</p>,
onConfirm: () => {
// window.history.back()
window.location.replace("#/home/system/subaccount-list");
sessionStorage.setItem("pathname2", "/home/system/subaccount-list");
window.location.replace('#/home/system/subaccount-list');
sessionStorage.setItem('pathname2', '/home/system/subaccount-list');
},
onCancel: this.onCancel,
className: "questModal",
className: 'questModal',
parentComponent: this
});
}
@ -435,38 +426,19 @@ export default class addUserinfo extends React.Component {
render() {
//校验规则
const rules = {
account: [{ type: "required", message: "请输入手机号" }],
account: [{ type: 'required', message: '请输入手机号' }],
phone: [
{ type: "required", message: "请输入手机号" },
{ type: 'required', message: '请输入手机号' },
{
type: "regExp",
message: "手机号格式不正确",
reg: "^[1][3,4,5,6,7,8,9][0-9]{9}$"
type: 'regExp',
message: '手机号格式不正确',
reg: '^[1][3,4,5,6,7,8,9][0-9]{9}$'
}
],
pwd: [
{ type: "required", message: "请输入密码" },
{
type: "regExp",
message: "6-16位字符,数字+字母组成(字母区分大小写)",
reg: "^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,16}$"
}
],
name: [
{ type: "required", message: "请输入真实姓名" },
{
type: "regExp",
message: "2-16字汉字/字母组成",
reg: "^([\u4e00-\u9fa5]|[a-zA-Z]){2,16}$"
}
],
company: [{ type: "required", message: "请选择公司" }],
deparment: [{ type: "required", message: "请选择部门" }],
post: [{ type: "required", message: "请选择岗位" }]
]
};
return (
<div>
<Card style={{ width: "100%" }} title={this.props.title}>
<Card style={{ width: '100%' }} title={this.props.title}>
<div id='addaccinfo'>
<Form
model={this.state.model}
@ -482,16 +454,16 @@ export default class addUserinfo extends React.Component {
}}
onClearItem={(e) => {
let model2 = this.state.model;
model2.user_name = "";
model2.user_name = '';
this.setState({ model: model2 });
}}
value={this.state.model.user_name}
placeholder={"请输入手机号"}
labelWidth={"0px"}
placeholder={'请输入手机号'}
labelWidth={'0px'}
maxLength={12}
height={"36px"}
width={"520px"}
alignment={"left"}
height={'36px'}
width={'520px'}
alignment={'left'}
/>
</FormItem>
@ -505,19 +477,19 @@ export default class addUserinfo extends React.Component {
}}
onClearItem={(e) => {
let model2 = this.state.model;
model2.mobile = "";
model2.mobile = '';
this.setState({ model: model2 });
}}
value={this.state.model.mobile}
placeholder={"请输入手机号"}
labelWidth={"0px"}
placeholder={'请输入手机号'}
labelWidth={'0px'}
maxLength={11}
height={"36px"}
width={"520px"}
alignment={"left"}
height={'36px'}
width={'520px'}
alignment={'left'}
/>
</FormItem>
<FormItem labelname='密码' prop='pwd' id='pwd'>
<FormItem labelname='密码' id='pwd' required=''>
<Ipt
onChange={(e) => {
let model2 = this.state.model;
@ -532,20 +504,20 @@ export default class addUserinfo extends React.Component {
disabled={this.state.disabled}
onClearItem={(e) => {
let model2 = this.state.model;
model2.password = "";
model2.password = '';
this.setState({ model: model2 });
}}
value={this.state.model.password}
placeholder={"请输入密码"}
labelWidth={"0px"}
placeholder={'请输入密码'}
labelWidth={'0px'}
maxLength={16}
height={"36px"}
width={"520px"}
alignment={"left"}
height={'36px'}
width={'520px'}
alignment={'left'}
/>
</FormItem>
<FormItem labelname='真实姓名' prop='name'>
<FormItem labelname='真实姓名' required=''>
<Ipt
onChange={(e) => {
let model2 = this.state.model;
@ -554,38 +526,38 @@ export default class addUserinfo extends React.Component {
}}
onClearItem={(e) => {
let model2 = this.state.model;
model2.real_name = "";
model2.real_name = '';
this.setState({ model: model2 });
}}
value={this.state.model.real_name}
placeholder={"请输入真实姓名"}
labelWidth={"0px"}
placeholder={'请输入真实姓名'}
labelWidth={'0px'}
maxLength={16}
height={"36px"}
width={"520px"}
alignment={"left"}
height={'36px'}
width={'520px'}
alignment={'left'}
/>
</FormItem>
<FormItem
id='company'
labelname='岗位'
prop='company'
myClassName='sel1'>
myClassName='sel1'
required=''>
<Select
options={this.state.companyList}
placeholder='请选择公司'
value={this.state.model.company}
onChange={(e) => {
this.onCompanyChange(e);
Bus.emit("change", "company", e);
Bus.emit('change', 'company', e);
}}
/>
</FormItem>
<FormItem
id='deparment'
prop='deparment'
myClassName='sel2'
labelwidth='0px'>
labelwidth='0px'
required=''>
<Select
options={this.state.departmentList}
placeholder='请选择部门'
@ -593,15 +565,11 @@ export default class addUserinfo extends React.Component {
value={this.state.model.deparment}
onChange={(e) => {
this.onDepartmentChange(e);
Bus.emit("change", "deparment", e);
Bus.emit('change', 'deparment', e);
}}
/>
</FormItem>
<FormItem
id='post'
prop='post'
myClassName='sel2 sel3'
labelwidth='0px'>
<FormItem id='post' myClassName='sel2 sel3' labelwidth='0px'>
<Select
options={this.state.departmentJob}
placeholder='请选择岗位'
@ -609,11 +577,12 @@ export default class addUserinfo extends React.Component {
value={this.state.model.post}
onChange={(e) => {
this.onPostChange(e);
Bus.emit("change", "post", e);
Bus.emit('change', 'post', e);
}}
/>
</FormItem>
<FormItem
required=''
labelname='设置权限'
myClassName='rolechoose'
id='station'>
@ -627,7 +596,7 @@ export default class addUserinfo extends React.Component {
<div className='mypic'>
<b>头像</b>
<div className='changepic dflexac'>
{this.state.defaultFileList[0].src == "" ? (
{this.state.defaultFileList[0].src == '' ? (
<ImageUpload
className='zent-image-upload-demo'
maxSize={500 * 1024}