| | |
| | | |
| | | import HeadView from '../view/HeadView'; |
| | | import TableBtnView from '../view/TableBtnView'; |
| | | import CommonSearchForm from '../view/CommonSearchForm'; |
| | | import { Input, Button, DatePicker, Divider, message, Popconfirm, Select, Badge } from 'antd'; |
| | | import moment from 'moment'; |
| | | import Fetch from '../fetch'; |
| | |
| | | return "心理疏导"; |
| | | } |
| | | } |
| | | |
| | | const taskNodeIds = { |
| | | 1: '跟踪帮教', |
| | | 2: '合适成年人', |
| | | 3: '社会调查', |
| | | 4: '心理疏导', |
| | | } |
| | | |
| | | const activityTypeList = [ |
| | | 1, |
| | | 2, |
| | | 3, |
| | | ] |
| | | const activityStatusIds = { |
| | | 0: '未开始', |
| | | 1: '进行中', |
| | | 2: '已结束', |
| | | 99: '结束', |
| | | } |
| | | |
| | | const activityStatusList = [ |
| | | 1, |
| | | 2, |
| | | 3, |
| | | ] |
| | | export default class CareList extends React.Component { |
| | | constructor(props) { |
| | | super(props); |
| | | this.state = { |
| | | data: [], |
| | | formdata: { |
| | | formData: { |
| | | __key: Date.now(), |
| | | page: 1, |
| | | size: 10, |
| | | }, |
| | |
| | | } |
| | | |
| | | componentDidMount() { |
| | | |
| | | document.title = '社会关护管理'; |
| | | this.getData(); |
| | | } |
| | | |
| | | getData = () => { |
| | | const { formdata } = this.state; |
| | | Fetch.socialQuery({ ...formdata }) |
| | | setFormData = data => { |
| | | console.log('form', data); |
| | | this.setState({ |
| | | formData: data, |
| | | }); |
| | | } |
| | | |
| | | searchonClick = data => { |
| | | console.log('form', data); |
| | | this.setState({ |
| | | formData: data, |
| | | }); |
| | | this.setState({ loading: true }) |
| | | Fetch.socialQuery({ ...data }) |
| | | .then(res => { |
| | | console.log(res) |
| | | for (var i = 0; i < res.rows.length; i++) { |
| | | res.rows[i]['index'] = i + 1; |
| | | } |
| | | this.setState({ |
| | | data: res.rows |
| | | data: res.rows, |
| | | loading: false, |
| | | }); |
| | | }); |
| | | } |
| | | |
| | | getData = () => { |
| | | const { formData } = this.state; |
| | | this.setState({ loading: true }) |
| | | Fetch.socialQuery({ ...formData }) |
| | | .then(res => { |
| | | console.log(res) |
| | | for (var i = 0; i < res.rows.length; i++) { |
| | | res.rows[i]['index'] = i + 1; |
| | | } |
| | | this.setState({ |
| | | data: res.rows, |
| | | loading: false, |
| | | }); |
| | | }); |
| | | } |
| | | onInputChange = ({ target: { value, name } }) => { |
| | | this.setState(({ formdata }) => ({ |
| | | formdata: { |
| | | ...formdata, |
| | | this.setState(({ formData }) => ({ |
| | | formData: { |
| | | ...formData, |
| | | [name]: value |
| | | } |
| | | })) |
| | |
| | | } |
| | | |
| | | Seaech = () => { |
| | | const { formdata } = this.state; |
| | | Fetch.getSweeping(formdata) |
| | | const { formData } = this.state; |
| | | Fetch.getSweeping(formData) |
| | | .then(res => { |
| | | for (var i = 0; i < res.length; i++) { |
| | | res[i]['index'] = i + 1; |
| | |
| | | Reset = () => { |
| | | this.setState({ |
| | | resetKey: Date.now(), |
| | | formdata: {} |
| | | formData: {} |
| | | }, this.getData); |
| | | } |
| | | |
| | |
| | | key: 'status', |
| | | render: text => ( |
| | | text == 0 ? |
| | | <Badge style={{ backgroundColor: '#6C757C' }} count={'未开始'} /> :text == 1 ? <Badge count={'F1C40F'} style={{ backgroundColor: '#6C757C' }} /> : <Badge count={'已结束'} style={{ backgroundColor: '#2ECC71' }} /> |
| | | <Badge style={{ backgroundColor: '#6C757C' }} count={'未开始'} /> : text == 1 ? <Badge count={'进行中'} style={{ backgroundColor: '#6C757C' }} /> : text == 2 ? <Badge count={'已结束'} style={{ backgroundColor: '#6C757C' }} /> : <Badge count={'结束'} style={{ backgroundColor: '#2ECC71' }} /> |
| | | ) |
| | | }, { |
| | | title: '创建时间', |
| | |
| | | key: 'createTime', |
| | | render: text => <span>{moment(text).format("YYYY-MM-DD HH:mm")}</span> |
| | | }, { |
| | | title: '开始时间', |
| | | dataIndex: 'startTime', |
| | | key: 'startTime', |
| | | render: text => <span>{moment(text).format("YYYY-MM-DD HH:mm")}</span> |
| | | }, { |
| | | title: '结束时间', |
| | | dataIndex: 'endTime', |
| | | key: 'endTime', |
| | | render: text => <span>{moment(text).format("YYYY-MM-DD HH:mm")}</span> |
| | | }, { |
| | | title: '操作', |
| | | key: 'action', |
| | | render: (text, record) => ( |
| | | <span> |
| | | <a onClick={() => this.showModal(record.id)}>编辑</a> |
| | | <Divider type="vertical" /> |
| | | <Popconfirm |
| | | title="确认删除任务吗?" |
| | | id={record.id} |
| | | onConfirm={e => this.confirm(record.id)} |
| | | okText="确定" |
| | | cancelText="取消" |
| | | > |
| | | <a href="#">删除</a> |
| | | </Popconfirm> |
| | | { |
| | | record.status==1? |
| | | <React.Fragment> |
| | | <Divider type="vertical" /> |
| | | <a onClick={() => this.showModal(record.id)}>结束任务</a> |
| | | </React.Fragment>:'' |
| | | record.status == 1 ? |
| | | <React.Fragment> |
| | | <Divider type="vertical" /> |
| | | <a onClick={() => this.showModal(record.id)}>结束任务</a> |
| | | </React.Fragment> : |
| | | <React.Fragment> |
| | | <a onClick={() => this.showModal(record.id)}>编辑</a> |
| | | <Divider type="vertical" /> |
| | | <Popconfirm |
| | | title="确认删除任务吗?" |
| | | id={record.id} |
| | | onConfirm={e => this.confirm(record.id)} |
| | | okText="确定" |
| | | cancelText="取消" |
| | | > |
| | | <a href="#">删除</a> |
| | | </Popconfirm> |
| | | </React.Fragment> |
| | | } |
| | | </span> |
| | | ), |
| | | }]; |
| | | const { data, loading, resetKey } = this.state; |
| | | const { data, loading, resetKey, formData } = this.state; |
| | | return ( |
| | | <div className="app-page"> |
| | | <HeadView history={this.props.history} /> |
| | |
| | | <Breadcrumb.Item><a href="">后台中心</a></Breadcrumb.Item> |
| | | <Breadcrumb.Item>社会关护</Breadcrumb.Item> |
| | | </Breadcrumb> */} |
| | | <TableBtnView name={''} key={resetKey}> |
| | | <Select |
| | | style={{ width: 200 }} |
| | | placeholder="根据举报性质查询" |
| | | onChange={(value) => this.onInputChange({ target: { name: 'nature', value } })} |
| | | > |
| | | <Option value="1">涉黑涉恶违法犯罪行为</Option> |
| | | <Option value="2">涉黑涉恶违法犯罪保护伞</Option> |
| | | <Option value="3">其他</Option> |
| | | </Select> |
| | | <Input placeholder="根据内容模糊查询" style={{ width: "200px" }} name='content' onChange={this.onInputChange} /> |
| | | <Select |
| | | style={{ width: 200 }} |
| | | placeholder="根据状态查询" |
| | | onChange={(value) => this.onInputChange({ target: { name: 'status', value } })} |
| | | > |
| | | <Option value="2">已回复</Option> |
| | | <Option value="1">待回复</Option> |
| | | </Select> |
| | | |
| | | <DatePicker onChange={(_, value) => this.onInputChange({ target: { name: 'createTime', value } })} placeholder="根据创建时间查询" /> |
| | | <Button type="primary" onClick={this.Seaech}>查询</Button> |
| | | <Button onClick={this.Reset}>重置</Button> |
| | | </TableBtnView> |
| | | <TableView columns={columns} data={data} pageSize='10' size='default' loading={loading} /> |
| | | <div style={{ background: '#fff', margin: 20 }}> |
| | | <CommonSearchForm |
| | | {...this.props} |
| | | formData={formData} |
| | | setFormData={this.setFormData} |
| | | searchonClick={this.searchonClick} |
| | | pathName={this.props.location.pathname} |
| | | data={[ |
| | | { |
| | | type: 'select', name: '任务类型', label: '任务类型', key: 'taskType', list: activityTypeList.map(key => ({ |
| | | id: key, |
| | | name: taskNodeIds[key] |
| | | })), |
| | | }, |
| | | { |
| | | type: 'select', name: '状态', label: '状态', key: 'status', list: activityStatusList.map(key => ({ |
| | | id: key, |
| | | name: activityStatusIds[key] |
| | | })), |
| | | }, |
| | | { |
| | | type: 'rangePicker', |
| | | label: '创建时间', |
| | | name: JSON.stringify(['开始时间', '结束时间']), |
| | | key: JSON.stringify(['startTime', 'endTime']), |
| | | keylistName: 'rangeTimelist', |
| | | }, |
| | | ]} /> |
| | | <TableView columns={columns} data={data} pageSize='10' size='default' loading={loading} /> |
| | | </div> |
| | | </div> |
| | | ); |
| | | } |