21 changed files with 957 additions and 942 deletions
@ -1,182 +1,182 @@ |
|||
import React, { Component, useState, useEffect } from 'react'; |
|||
import { connect } from 'react-redux'; |
|||
import { |
|||
Card, Form, Input, Button, Row, Col, Alert, message, |
|||
} from 'antd'; |
|||
import { resetPwd, RESET_PASSWORD_SUCCESS } from '../actions/reset-pwd'; |
|||
import { sendPhoneCode, checkPhoneCode, checkPhone } from '../actions/validate-phone'; |
|||
// import React, { Component, useState, useEffect } from 'react';
|
|||
// import { connect } from 'react-redux';
|
|||
// import {
|
|||
// Card, Form, Input, Button, Row, Col, Alert, message,
|
|||
// } from 'antd';
|
|||
// import { resetPwd, RESET_PASSWORD_SUCCESS } from '../actions/reset-pwd';
|
|||
// import { sendPhoneCode, checkPhoneCode, checkPhone } from '../actions/validate-phone';
|
|||
|
|||
const FormItem = Form.Item; |
|||
// const FormItem = Form.Item;
|
|||
|
|||
function ForgetPwdContainer(props) { |
|||
const { dispatch, match: { params }, isRequesting } = props; |
|||
const [form] = Form.useForm(); |
|||
const [sleeping, setSleeping] = useState(false); |
|||
let [sleepCount, setSleepCount] = useState(60); |
|||
const [done, setDone] = useState(false); |
|||
let timer; |
|||
// function ForgetPwdContainer(props) {
|
|||
// const { dispatch, match: { params }, isRequesting } = props;
|
|||
// const [form] = Form.useForm();
|
|||
// const [sleeping, setSleeping] = useState(false);
|
|||
// let [sleepCount, setSleepCount] = useState(60);
|
|||
// const [done, setDone] = useState(false);
|
|||
// let timer;
|
|||
|
|||
const _checkPhone = async (rule, value, callback) => { |
|||
await checkPhone(value, params.domain).then((_) => { |
|||
// const _checkPhone = async (rule, value, callback) => {
|
|||
// await checkPhone(value, params.domain).then((_) => {
|
|||
|
|||
}, (err) => { |
|||
throw new Error('未发现绑定该手机的账号!'); |
|||
}); |
|||
}; |
|||
// }, (err) => {
|
|||
// throw new Error('未发现绑定该手机的账号!');
|
|||
// });
|
|||
// };
|
|||
|
|||
const fetchVCode = async () => { |
|||
const phoneObj = await form.validateFields(['phone']); |
|||
await sendPhoneCode(phoneObj.phone).then((_) => { |
|||
setSleeping(true); |
|||
timer = setInterval((_) => { |
|||
if (sleepCount == 0) { |
|||
setSleeping(false); |
|||
setSleepCount(60); |
|||
clearInterval(timer); |
|||
return; |
|||
} |
|||
setSleepCount(sleepCount--); |
|||
}, 1000); |
|||
setSleepCount(sleepCount--); |
|||
}); |
|||
}; |
|||
// const fetchVCode = async () => {
|
|||
// const phoneObj = await form.validateFields(['phone']);
|
|||
// await sendPhoneCode(phoneObj.phone).then((_) => {
|
|||
// setSleeping(true);
|
|||
// timer = setInterval((_) => {
|
|||
// if (sleepCount == 0) {
|
|||
// setSleeping(false);
|
|||
// setSleepCount(60);
|
|||
// clearInterval(timer);
|
|||
// return;
|
|||
// }
|
|||
// setSleepCount(sleepCount--);
|
|||
// }, 1000);
|
|||
// setSleepCount(sleepCount--);
|
|||
// });
|
|||
// };
|
|||
|
|||
const submit = () => { |
|||
form.validateFields().then((values) => { |
|||
checkPhoneCode(values.phone, values.code).then((_) => { |
|||
dispatch(resetPwd(params.domain, values.phone, values.code, values.password)) |
|||
.then((action) => { |
|||
if (action.type == RESET_PASSWORD_SUCCESS) { |
|||
setDone(true); |
|||
} else { |
|||
message.error(action.payload.error); |
|||
} |
|||
}); |
|||
}, (err) => { |
|||
message.error(err.response.body.message); |
|||
}); |
|||
}); |
|||
}; |
|||
// const submit = () => {
|
|||
// form.validateFields().then((values) => {
|
|||
// checkPhoneCode(values.phone, values.code).then((_) => {
|
|||
// dispatch(resetPwd(params.domain, values.phone, values.code, values.password))
|
|||
// .then((action) => {
|
|||
// if (action.type == RESET_PASSWORD_SUCCESS) {
|
|||
// setDone(true);
|
|||
// } else {
|
|||
// message.error(action.payload.error);
|
|||
// }
|
|||
// });
|
|||
// }, (err) => {
|
|||
// message.error(err.response.body.message);
|
|||
// });
|
|||
// });
|
|||
// };
|
|||
|
|||
return ( |
|||
<div> |
|||
<div style={{ textAlign: 'center', padding: '100px 0 50px 0' }}> |
|||
<img src="/assets/images/anxinyun.png" width="180px" /> |
|||
</div> |
|||
<Card style={{ width: 500, padding: 50, margin: '0 auto' }}> |
|||
<h3 style={{ |
|||
color: '#666', paddingBottom: 5, marginBottom: 30, borderBottom: '1px solid #666', |
|||
}} |
|||
> |
|||
找回密码 |
|||
</h3> |
|||
{ |
|||
done |
|||
? ( |
|||
<Alert |
|||
message="完成" |
|||
description={( |
|||
<div> |
|||
<p> |
|||
已成功验证您的手机号： |
|||
{form.getFieldValue('phone')} |
|||
, 并重置密码 |
|||
</p> |
|||
<div style={{ padding: '30px 0', fontWeight: 'bold' }}> |
|||
<a href={`/${params.domain}/signin`}>返回登录</a> |
|||
</div> |
|||
</div> |
|||
)} |
|||
type="success" |
|||
showIcon |
|||
/> |
|||
) |
|||
: ( |
|||
<div> |
|||
<Form form={form}> |
|||
<FormItem |
|||
hasFeedback |
|||
name="phone" |
|||
validateFirst |
|||
rules={[{ |
|||
pattern: /^1[3|4|5|7|8|9]\d{9}$/, message: '手机号码无效', |
|||
}, { |
|||
required: true, message: '手机号码不能为空', |
|||
}, { |
|||
validator: _checkPhone, |
|||
}, { |
|||
validateTrigger: 'onBlur', |
|||
}]} |
|||
> |
|||
<Input maxLength="11" placeholder="请输入注册时填写的手机号" /> |
|||
</FormItem> |
|||
<FormItem> |
|||
<Row> |
|||
<Col span={16}> |
|||
<FormItem |
|||
name="code" |
|||
noStyle |
|||
rules={[{ |
|||
required: true, message: '验证码不能为空', |
|||
}]} |
|||
> |
|||
<Input type="text" maxLength="8" placeholder="请输入验证码" /> |
|||
</FormItem> |
|||
// return (
|
|||
// <div>
|
|||
// <div style={{ textAlign: 'center', padding: '100px 0 50px 0' }}>
|
|||
// <img src="/assets/images/anxinyun.png" width="180px" />
|
|||
// </div>
|
|||
// <Card style={{ width: 500, padding: 50, margin: '0 auto' }}>
|
|||
// <h3 style={{
|
|||
// color: '#666', paddingBottom: 5, marginBottom: 30, borderBottom: '1px solid #666',
|
|||
// }}
|
|||
// >
|
|||
// 找回密码
|
|||
// </h3>
|
|||
// {
|
|||
// done
|
|||
// ? (
|
|||
// <Alert
|
|||
// message="完成"
|
|||
// description={(
|
|||
// <div>
|
|||
// <p>
|
|||
// 已成功验证您的手机号：
|
|||
// {form.getFieldValue('phone')}
|
|||
// , 并重置密码
|
|||
// </p>
|
|||
// <div style={{ padding: '30px 0', fontWeight: 'bold' }}>
|
|||
// <a href={`/${params.domain}/signin`}>返回登录</a>
|
|||
// </div>
|
|||
// </div>
|
|||
// )}
|
|||
// type="success"
|
|||
// showIcon
|
|||
// />
|
|||
// )
|
|||
// : (
|
|||
// <div>
|
|||
// <Form form={form}>
|
|||
// <FormItem
|
|||
// hasFeedback
|
|||
// name="phone"
|
|||
// validateFirst
|
|||
// rules={[{
|
|||
// pattern: /^1[3|4|5|7|8|9]\d{9}$/, message: '手机号码无效',
|
|||
// }, {
|
|||
// required: true, message: '手机号码不能为空',
|
|||
// }, {
|
|||
// validator: _checkPhone,
|
|||
// }, {
|
|||
// validateTrigger: 'onBlur',
|
|||
// }]}
|
|||
// >
|
|||
// <Input maxLength="11" placeholder="请输入注册时填写的手机号" />
|
|||
// </FormItem>
|
|||
// <FormItem>
|
|||
// <Row>
|
|||
// <Col span={16}>
|
|||
// <FormItem
|
|||
// name="code"
|
|||
// noStyle
|
|||
// rules={[{
|
|||
// required: true, message: '验证码不能为空',
|
|||
// }]}
|
|||
// >
|
|||
// <Input type="text" maxLength="8" placeholder="请输入验证码" />
|
|||
// </FormItem>
|
|||
|
|||
</Col> |
|||
<Col span={8}> |
|||
<Button type="primary" onClick={fetchVCode} loading={sleeping} style={{ float: 'right' }}> |
|||
{sleeping ? `${sleepCount}s后重试` : '获取验证码'} |
|||
</Button> |
|||
</Col> |
|||
</Row> |
|||
</FormItem> |
|||
<FormItem |
|||
hasFeedback |
|||
name="password" |
|||
rules={[{ |
|||
pattern: /^[a-z0-9A-Z_]{6,20}$/, message: '密码由6-20位字母、数字或_组成', |
|||
}, { |
|||
required: true, message: '密码不能为空', |
|||
}]} |
|||
> |
|||
<Input type="password" placeholder="请输入新密码" /> |
|||
</FormItem> |
|||
<FormItem |
|||
hasFeedback |
|||
name="rptpwd" |
|||
rules={[{ |
|||
required: true, message: '密码不能为空', |
|||
}, { |
|||
validator: async (rule, value) => { |
|||
if (form.getFieldValue('password') != value) { |
|||
throw new Error('两次输入的密码不一致!'); |
|||
} |
|||
}, |
|||
}]} |
|||
> |
|||
<Input type="password" placeholder="请再次输入新密码" /> |
|||
</FormItem> |
|||
<FormItem> |
|||
<Button type="primary" style={{ width: '100%' }} loading={isRequesting} onClick={submit}>重设密码</Button> |
|||
</FormItem> |
|||
</Form> |
|||
<div style={{ padding: '30px 0 0 0' }}> |
|||
<a href={`/${params.domain}/signin`}>返回登录</a> |
|||
</div> |
|||
</div> |
|||
) |
|||
} |
|||
</Card> |
|||
</div> |
|||
); |
|||
} |
|||
// </Col>
|
|||
// <Col span={8}>
|
|||
// <Button type="primary" onClick={fetchVCode} loading={sleeping} style={{ float: 'right' }}>
|
|||
// {sleeping ? `${sleepCount}s后重试` : '获取验证码'}
|
|||
// </Button>
|
|||
// </Col>
|
|||
// </Row>
|
|||
// </FormItem>
|
|||
// <FormItem
|
|||
// hasFeedback
|
|||
// name="password"
|
|||
// rules={[{
|
|||
// pattern: /^[a-z0-9A-Z_]{6,20}$/, message: '密码由6-20位字母、数字或_组成',
|
|||
// }, {
|
|||
// required: true, message: '密码不能为空',
|
|||
// }]}
|
|||
// >
|
|||
// <Input type="password" placeholder="请输入新密码" />
|
|||
// </FormItem>
|
|||
// <FormItem
|
|||
// hasFeedback
|
|||
// name="rptpwd"
|
|||
// rules={[{
|
|||
// required: true, message: '密码不能为空',
|
|||
// }, {
|
|||
// validator: async (rule, value) => {
|
|||
// if (form.getFieldValue('password') != value) {
|
|||
// throw new Error('两次输入的密码不一致!');
|
|||
// }
|
|||
// },
|
|||
// }]}
|
|||
// >
|
|||
// <Input type="password" placeholder="请再次输入新密码" />
|
|||
// </FormItem>
|
|||
// <FormItem>
|
|||
// <Button type="primary" style={{ width: '100%' }} loading={isRequesting} onClick={submit}>重设密码</Button>
|
|||
// </FormItem>
|
|||
// </Form>
|
|||
// <div style={{ padding: '30px 0 0 0' }}>
|
|||
// <a href={`/${params.domain}/signin`}>返回登录</a>
|
|||
// </div>
|
|||
// </div>
|
|||
// )
|
|||
// }
|
|||
// </Card>
|
|||
// </div>
|
|||
// );
|
|||
// }
|
|||
|
|||
function mapStateToProps(state) { |
|||
const { resetPwd } = state; |
|||
return { |
|||
isRequesting: resetPwd.isRequesting, |
|||
}; |
|||
} |
|||
// function mapStateToProps(state) {
|
|||
// const { resetPwd } = state;
|
|||
// return {
|
|||
// isRequesting: resetPwd.isRequesting,
|
|||
// };
|
|||
// }
|
|||
|
|||
export default connect(mapStateToProps)(ForgetPwdContainer); |
|||
// export default connect(mapStateToProps)(ForgetPwdContainer);
|
|||
|
|||
@ -0,0 +1,92 @@ |
|||
import PropTypes from 'prop-types' |
|||
import React, { useEffect, useState } from "react"; |
|||
import { connect } from 'react-redux' |
|||
import { Table, message } from 'antd' |
|||
// import { getPartyMember } from '../../homePage/actions/profile'
|
|||
import { editLaborParty } from '../actions/party' |
|||
import EditParty from '../components/edit-party'; |
|||
|
|||
var request = false |
|||
export const Default = (props) => { |
|||
|
|||
const { dispatch } = props; |
|||
|
|||
const [partyLabor, setPartyLabor] = useState(); |
|||
const [showEdit, setShowEdit] = useState(false); |
|||
const [editData, setEditData] = useState(); |
|||
|
|||
useEffect(() => { |
|||
// dispatch(getPartyMember()).then(res => {
|
|||
// if (res.success) {
|
|||
// setPartyLabor(res.payload.data);
|
|||
// }
|
|||
// })
|
|||
}, [request]) |
|||
|
|||
const onEditParty = (record) => { |
|||
setShowEdit(true); |
|||
setEditData(record) |
|||
} |
|||
|
|||
const tableColumns = [ |
|||
{ |
|||
key: 'num', |
|||
dataIndex: 'num', |
|||
title: '序号', |
|||
render: () => { |
|||
return <span>1</span> |
|||
} |
|||
}, |
|||
{ |
|||
key: 'partyNumber', |
|||
dataIndex: 'partyNumber', |
|||
title: '党员人数', |
|||
}, |
|||
{ |
|||
key: 'laborUnion', |
|||
dataIndex: 'laborUnion', |
|||
title: '工会人数', |
|||
}, |
|||
{ |
|||
key: 'ation', |
|||
title: '操作', |
|||
render: (text, record) => { |
|||
return <a onClick={() => onEditParty(record)}>编辑</a> |
|||
} |
|||
} |
|||
] |
|||
|
|||
const handleOk = (values) => { |
|||
if (values) { |
|||
const { labor, party } = values |
|||
const result = { partyNumber: party, laborUnion: labor } |
|||
dispatch(editLaborParty(result)).then(res => { |
|||
if (res.success) { |
|||
message.success("编辑成功"); |
|||
request = !request; |
|||
handleCancel(); |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
const handleCancel = () => { |
|||
setShowEdit(false); |
|||
} |
|||
|
|||
return ( |
|||
<div> |
|||
<p style={{ marginBottom: 16, fontSize: 16 }}>党员、工会人数维护</p> |
|||
<Table columns={tableColumns} dataSource={partyLabor ? [partyLabor] : []} /> |
|||
<EditParty editData={editData} visible={showEdit} handleOk={handleOk} handleCancel={handleCancel} /> |
|||
</div> |
|||
) |
|||
} |
|||
|
|||
Default.propTypes = { |
|||
second: PropTypes.third |
|||
} |
|||
|
|||
const mapStateToProps = (state) => ({}) |
|||
|
|||
|
|||
export default connect(mapStateToProps)(Default) |
|||
Loading…
Reference in new issue