xingyongchun
2 years ago
21 changed files with 957 additions and 942 deletions
@ -1,182 +1,182 @@ |
|||||
import React, { Component, useState, useEffect } from 'react'; |
// import React, { Component, useState, useEffect } from 'react';
|
||||
import { connect } from 'react-redux'; |
// import { connect } from 'react-redux';
|
||||
import { |
// import {
|
||||
Card, Form, Input, Button, Row, Col, Alert, message, |
// Card, Form, Input, Button, Row, Col, Alert, message,
|
||||
} from 'antd'; |
// } from 'antd';
|
||||
import { resetPwd, RESET_PASSWORD_SUCCESS } from '../actions/reset-pwd'; |
// import { resetPwd, RESET_PASSWORD_SUCCESS } from '../actions/reset-pwd';
|
||||
import { sendPhoneCode, checkPhoneCode, checkPhone } from '../actions/validate-phone'; |
// import { sendPhoneCode, checkPhoneCode, checkPhone } from '../actions/validate-phone';
|
||||
|
|
||||
const FormItem = Form.Item; |
// const FormItem = Form.Item;
|
||||
|
|
||||
function ForgetPwdContainer(props) { |
// function ForgetPwdContainer(props) {
|
||||
const { dispatch, match: { params }, isRequesting } = props; |
// const { dispatch, match: { params }, isRequesting } = props;
|
||||
const [form] = Form.useForm(); |
// const [form] = Form.useForm();
|
||||
const [sleeping, setSleeping] = useState(false); |
// const [sleeping, setSleeping] = useState(false);
|
||||
let [sleepCount, setSleepCount] = useState(60); |
// let [sleepCount, setSleepCount] = useState(60);
|
||||
const [done, setDone] = useState(false); |
// const [done, setDone] = useState(false);
|
||||
let timer; |
// let timer;
|
||||
|
|
||||
const _checkPhone = async (rule, value, callback) => { |
// const _checkPhone = async (rule, value, callback) => {
|
||||
await checkPhone(value, params.domain).then((_) => { |
// await checkPhone(value, params.domain).then((_) => {
|
||||
|
|
||||
}, (err) => { |
// }, (err) => {
|
||||
throw new Error('未发现绑定该手机的账号!'); |
// throw new Error('未发现绑定该手机的账号!');
|
||||
}); |
// });
|
||||
}; |
// };
|
||||
|
|
||||
const fetchVCode = async () => { |
// const fetchVCode = async () => {
|
||||
const phoneObj = await form.validateFields(['phone']); |
// const phoneObj = await form.validateFields(['phone']);
|
||||
await sendPhoneCode(phoneObj.phone).then((_) => { |
// await sendPhoneCode(phoneObj.phone).then((_) => {
|
||||
setSleeping(true); |
// setSleeping(true);
|
||||
timer = setInterval((_) => { |
// timer = setInterval((_) => {
|
||||
if (sleepCount == 0) { |
// if (sleepCount == 0) {
|
||||
setSleeping(false); |
// setSleeping(false);
|
||||
setSleepCount(60); |
// setSleepCount(60);
|
||||
clearInterval(timer); |
// clearInterval(timer);
|
||||
return; |
// return;
|
||||
} |
// }
|
||||
setSleepCount(sleepCount--); |
// setSleepCount(sleepCount--);
|
||||
}, 1000); |
// }, 1000);
|
||||
setSleepCount(sleepCount--); |
// setSleepCount(sleepCount--);
|
||||
}); |
// });
|
||||
}; |
// };
|
||||
|
|
||||
const submit = () => { |
// const submit = () => {
|
||||
form.validateFields().then((values) => { |
// form.validateFields().then((values) => {
|
||||
checkPhoneCode(values.phone, values.code).then((_) => { |
// checkPhoneCode(values.phone, values.code).then((_) => {
|
||||
dispatch(resetPwd(params.domain, values.phone, values.code, values.password)) |
// dispatch(resetPwd(params.domain, values.phone, values.code, values.password))
|
||||
.then((action) => { |
// .then((action) => {
|
||||
if (action.type == RESET_PASSWORD_SUCCESS) { |
// if (action.type == RESET_PASSWORD_SUCCESS) {
|
||||
setDone(true); |
// setDone(true);
|
||||
} else { |
// } else {
|
||||
message.error(action.payload.error); |
// message.error(action.payload.error);
|
||||
} |
// }
|
||||
}); |
// });
|
||||
}, (err) => { |
// }, (err) => {
|
||||
message.error(err.response.body.message); |
// message.error(err.response.body.message);
|
||||
}); |
// });
|
||||
}); |
// });
|
||||
}; |
// };
|
||||
|
|
||||
return ( |
// return (
|
||||
<div> |
// <div>
|
||||
<div style={{ textAlign: 'center', padding: '100px 0 50px 0' }}> |
// <div style={{ textAlign: 'center', padding: '100px 0 50px 0' }}>
|
||||
<img src="/assets/images/anxinyun.png" width="180px" /> |
// <img src="/assets/images/anxinyun.png" width="180px" />
|
||||
</div> |
// </div>
|
||||
<Card style={{ width: 500, padding: 50, margin: '0 auto' }}> |
// <Card style={{ width: 500, padding: 50, margin: '0 auto' }}>
|
||||
<h3 style={{ |
// <h3 style={{
|
||||
color: '#666', paddingBottom: 5, marginBottom: 30, borderBottom: '1px solid #666', |
// color: '#666', paddingBottom: 5, marginBottom: 30, borderBottom: '1px solid #666',
|
||||
}} |
// }}
|
||||
> |
// >
|
||||
找回密码 |
// 找回密码
|
||||
</h3> |
// </h3>
|
||||
{ |
// {
|
||||
done |
// done
|
||||
? ( |
// ? (
|
||||
<Alert |
// <Alert
|
||||
message="完成" |
// message="完成"
|
||||
description={( |
// description={(
|
||||
<div> |
// <div>
|
||||
<p> |
// <p>
|
||||
已成功验证您的手机号: |
// 已成功验证您的手机号:
|
||||
{form.getFieldValue('phone')} |
// {form.getFieldValue('phone')}
|
||||
, 并重置密码 |
// , 并重置密码
|
||||
</p> |
// </p>
|
||||
<div style={{ padding: '30px 0', fontWeight: 'bold' }}> |
// <div style={{ padding: '30px 0', fontWeight: 'bold' }}>
|
||||
<a href={`/${params.domain}/signin`}>返回登录</a> |
// <a href={`/${params.domain}/signin`}>返回登录</a>
|
||||
</div> |
// </div>
|
||||
</div> |
// </div>
|
||||
)} |
// )}
|
||||
type="success" |
// type="success"
|
||||
showIcon |
// showIcon
|
||||
/> |
// />
|
||||
) |
// )
|
||||
: ( |
// : (
|
||||
<div> |
// <div>
|
||||
<Form form={form}> |
// <Form form={form}>
|
||||
<FormItem |
// <FormItem
|
||||
hasFeedback |
// hasFeedback
|
||||
name="phone" |
// name="phone"
|
||||
validateFirst |
// validateFirst
|
||||
rules={[{ |
// rules={[{
|
||||
pattern: /^1[3|4|5|7|8|9]\d{9}$/, message: '手机号码无效', |
// pattern: /^1[3|4|5|7|8|9]\d{9}$/, message: '手机号码无效',
|
||||
}, { |
// }, {
|
||||
required: true, message: '手机号码不能为空', |
// required: true, message: '手机号码不能为空',
|
||||
}, { |
// }, {
|
||||
validator: _checkPhone, |
// validator: _checkPhone,
|
||||
}, { |
// }, {
|
||||
validateTrigger: 'onBlur', |
// validateTrigger: 'onBlur',
|
||||
}]} |
// }]}
|
||||
> |
// >
|
||||
<Input maxLength="11" placeholder="请输入注册时填写的手机号" /> |
// <Input maxLength="11" placeholder="请输入注册时填写的手机号" />
|
||||
</FormItem> |
// </FormItem>
|
||||
<FormItem> |
// <FormItem>
|
||||
<Row> |
// <Row>
|
||||
<Col span={16}> |
// <Col span={16}>
|
||||
<FormItem |
// <FormItem
|
||||
name="code" |
// name="code"
|
||||
noStyle |
// noStyle
|
||||
rules={[{ |
// rules={[{
|
||||
required: true, message: '验证码不能为空', |
// required: true, message: '验证码不能为空',
|
||||
}]} |
// }]}
|
||||
> |
// >
|
||||
<Input type="text" maxLength="8" placeholder="请输入验证码" /> |
// <Input type="text" maxLength="8" placeholder="请输入验证码" />
|
||||
</FormItem> |
// </FormItem>
|
||||
|
|
||||
</Col> |
// </Col>
|
||||
<Col span={8}> |
// <Col span={8}>
|
||||
<Button type="primary" onClick={fetchVCode} loading={sleeping} style={{ float: 'right' }}> |
// <Button type="primary" onClick={fetchVCode} loading={sleeping} style={{ float: 'right' }}>
|
||||
{sleeping ? `${sleepCount}s后重试` : '获取验证码'} |
// {sleeping ? `${sleepCount}s后重试` : '获取验证码'}
|
||||
</Button> |
// </Button>
|
||||
</Col> |
// </Col>
|
||||
</Row> |
// </Row>
|
||||
</FormItem> |
// </FormItem>
|
||||
<FormItem |
// <FormItem
|
||||
hasFeedback |
// hasFeedback
|
||||
name="password" |
// name="password"
|
||||
rules={[{ |
// rules={[{
|
||||
pattern: /^[a-z0-9A-Z_]{6,20}$/, message: '密码由6-20位字母、数字或_组成', |
// pattern: /^[a-z0-9A-Z_]{6,20}$/, message: '密码由6-20位字母、数字或_组成',
|
||||
}, { |
// }, {
|
||||
required: true, message: '密码不能为空', |
// required: true, message: '密码不能为空',
|
||||
}]} |
// }]}
|
||||
> |
// >
|
||||
<Input type="password" placeholder="请输入新密码" /> |
// <Input type="password" placeholder="请输入新密码" />
|
||||
</FormItem> |
// </FormItem>
|
||||
<FormItem |
// <FormItem
|
||||
hasFeedback |
// hasFeedback
|
||||
name="rptpwd" |
// name="rptpwd"
|
||||
rules={[{ |
// rules={[{
|
||||
required: true, message: '密码不能为空', |
// required: true, message: '密码不能为空',
|
||||
}, { |
// }, {
|
||||
validator: async (rule, value) => { |
// validator: async (rule, value) => {
|
||||
if (form.getFieldValue('password') != value) { |
// if (form.getFieldValue('password') != value) {
|
||||
throw new Error('两次输入的密码不一致!'); |
// throw new Error('两次输入的密码不一致!');
|
||||
} |
// }
|
||||
}, |
// },
|
||||
}]} |
// }]}
|
||||
> |
// >
|
||||
<Input type="password" placeholder="请再次输入新密码" /> |
// <Input type="password" placeholder="请再次输入新密码" />
|
||||
</FormItem> |
// </FormItem>
|
||||
<FormItem> |
// <FormItem>
|
||||
<Button type="primary" style={{ width: '100%' }} loading={isRequesting} onClick={submit}>重设密码</Button> |
// <Button type="primary" style={{ width: '100%' }} loading={isRequesting} onClick={submit}>重设密码</Button>
|
||||
</FormItem> |
// </FormItem>
|
||||
</Form> |
// </Form>
|
||||
<div style={{ padding: '30px 0 0 0' }}> |
// <div style={{ padding: '30px 0 0 0' }}>
|
||||
<a href={`/${params.domain}/signin`}>返回登录</a> |
// <a href={`/${params.domain}/signin`}>返回登录</a>
|
||||
</div> |
// </div>
|
||||
</div> |
// </div>
|
||||
) |
// )
|
||||
} |
// }
|
||||
</Card> |
// </Card>
|
||||
</div> |
// </div>
|
||||
); |
// );
|
||||
} |
// }
|
||||
|
|
||||
function mapStateToProps(state) { |
// function mapStateToProps(state) {
|
||||
const { resetPwd } = state; |
// const { resetPwd } = state;
|
||||
return { |
// return {
|
||||
isRequesting: resetPwd.isRequesting, |
// 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