yee 7 years ago
parent
commit
39d4d84a18
2 changed files with 112 additions and 69 deletions
  1. 9 0
      js/component/manageCenter/set/content.less
  2. 103 69
      js/component/manageCenter/set/member.jsx

+ 9 - 0
js/component/manageCenter/set/content.less

@@ -14,6 +14,15 @@
     .member-table {
         margin-top: 20px;
     }
+    .set-search {
+        >input {
+            width: 120px;
+        }
+        >* {
+            margin-right: 10px;
+            margin-top: 10px;
+        }
+    }
 }
 
 .ant-modal-body {

+ 103 - 69
js/component/manageCenter/set/member.jsx

@@ -1,54 +1,58 @@
 import React from 'react';
-import { Table, Button, Spin, message, Icon } from 'antd';
-import { getProvince } from '../../NewDicProvinceList';
-import ajax from 'jquery/src/ajax/xhr.js'
+import { Table, Button, Spin, message, Icon, Select, Input } from 'antd';
+import { provinceSelect, provinceList, getProvince } from '../../NewDicProvinceList.js';
+import { companySearch } from '../../tools';
+import ajax from 'jquery/src/ajax/xhr.js';
 import $ from 'jquery/src/ajax';
 import TheModal from './modal.jsx';
 
 const Member = React.createClass({
     loadData(pageNo) {
-        this.state.data = [];
         this.setState({
             loading: true
         });
-        return $.ajax({
+        $.ajax({
             type: 'get',
             cache: false,
             url: globalConfig.context + "/api/admin/supervise/adminList",
             dataType: "json",
             data: {
                 pageNo: pageNo || 1,
-                pageSize: this.state.pagination.pageSize
+                pageSize: this.state.pagination.pageSize,
+                province: this.state.searchProvince,
+                mobile: this.state.searchMobile,
+                name: this.state.searchName
             },
             success: function (data) {
+                let theArr = [];
                 if (!data.data) {
                     if (data.error && data.error.length) {
                         message.warning(data.error[0].message);
                     };
-                    return;
-                };
-                for (let i = 0; i < data.data.list.length; i++) {
-                    let thisdata = data.data.list[i];
-                    this.state.onlyProvince = thisdata.province;
-                    this.state.data.push({
-                        key: i,
-                        id: thisdata.id,
-                        mobile: thisdata.mobile,
-                        name: thisdata.name,
-                        email: thisdata.email,
-                        createTime: thisdata.createTime,
-                        number: thisdata.number,
-                        province: thisdata.province,
-                        position: thisdata.position,
-                        superior: thisdata.superior,
-                        superiorId: thisdata.superiorId,
-                        createTimeFormattedDate: thisdata.createTimeFormattedDate
-                    });
+                } else {
+                    for (let i = 0; i < data.data.list.length; i++) {
+                        let thisdata = data.data.list[i];
+                        this.state.onlyProvince = thisdata.province;
+                        theArr.push({
+                            key: i,
+                            id: thisdata.id,
+                            mobile: thisdata.mobile,
+                            name: thisdata.name,
+                            email: thisdata.email,
+                            createTime: thisdata.createTime,
+                            number: thisdata.number,
+                            province: thisdata.province,
+                            position: thisdata.position,
+                            superior: thisdata.superior,
+                            superiorId: thisdata.superiorId,
+                            createTimeFormattedDate: thisdata.createTimeFormattedDate
+                        });
+                    };
+                    this.state.pagination.current = data.data.pageNo;
+                    this.state.pagination.total = data.data.totalCount;
                 };
-                this.state.pagination.current = data.data.pageNo;
-                this.state.pagination.total = data.data.totalCount;
                 this.setState({
-                    data: this.state.data,
+                    data: theArr,
                     pagination: this.state.pagination
                 });
             }.bind(this),
@@ -61,6 +65,7 @@ const Member = React.createClass({
     getInitialState() {
         return {
             data: [],
+            provinceList:[],
             dataSource: [],
             selectedRowKeys: [],
             selectedRows: [],
@@ -78,10 +83,51 @@ const Member = React.createClass({
                 showTotal: function (total) {
                     return '共' + total + '条数据';
                 }
-            }
+            },
+            columns: [
+                {
+                    title: '编号',
+                    dataIndex: 'number',
+                    key: 'number'
+                }, {
+                    title: '登录账号',
+                    dataIndex: 'mobile',
+                    key: 'mobile'
+                }, {
+                    title: '名字',
+                    dataIndex: 'name',
+                    key: 'name'
+                }, {
+                    title: '职位',
+                    dataIndex: 'position',
+                    key: 'position'
+                }, {
+                    title: '上级管理员',
+                    dataIndex: 'superior',
+                    key: 'superior'
+                }, {
+                    title: '省份',
+                    dataIndex: 'province',
+                    key: 'province',
+                    render: text => {
+                        return text ? text.split(',').map((item) => {
+                            return getProvince(item) + ' '
+                        }) : []
+                    }
+                }, {
+                    title: '邮箱',
+                    dataIndex: 'email',
+                    key: 'email'
+                }, {
+                    title: '创建时间',
+                    dataIndex: 'createTimeFormattedDate',
+                    key: 'createTimeFormattedDate'
+                }
+            ]
         }
     },
-    componentDidMount() {
+    componentWillMount() {
+        this.state.provinceList = provinceSelect();
         this.loadData();
     },
     addNew() {
@@ -97,6 +143,12 @@ const Member = React.createClass({
             modalShow: true
         })
     },
+    reset() {
+        this.state.searchMobile = undefined;
+        this.state.searchName = undefined;
+        this.state.searchProvince = undefined;
+        this.loadData();
+    },
     handleReturn(show, render) {
         this.state.modalShow = show;
         if (render) {
@@ -104,44 +156,6 @@ const Member = React.createClass({
         }
     },
     render() {
-        const columns = [{
-            title: '编号',
-            dataIndex: 'number',
-            key: 'number'
-        }, {
-            title: '登录账号',
-            dataIndex: 'mobile',
-            key: 'mobile'
-        }, {
-            title: '名字',
-            dataIndex: 'name',
-            key: 'name'
-        }, {
-            title: '职位',
-            dataIndex: 'position',
-            key: 'position'
-        }, {
-            title: '上级管理员',
-            dataIndex: 'superior',
-            key: 'superior'
-        }, {
-            title: '省份',
-            dataIndex: 'province',
-            key: 'province',
-            render: text => {
-                return text ? text.split(',').map((item) => {
-                    return getProvince(item) + ' '
-                }) : []
-            }
-        }, {
-            title: '邮箱',
-            dataIndex: 'email',
-            key: 'email'
-        }, {
-            title: '创建时间',
-            dataIndex: 'createTimeFormattedDate',
-            key: 'createTimeFormattedDate'
-        }];
         return (
             <Spin spinning={this.state.loading}>
                 <div className="set-content">
@@ -150,9 +164,29 @@ const Member = React.createClass({
                         <Button style={{ background: "#ea0862", border: "none", color: "#fff" }}
                             onClick={this.addNew}>添加<Icon type="plus" /></Button>
                     </div>
+                    <div className="set-search">
+                        <Input placeholder="登录号"
+                            value={this.state.searchMobile}
+                            onChange={(e) => { this.setState({ searchMobile: e.target.value }); }} />
+                        <Input placeholder="管理员名字"
+                            value={this.state.searchName}
+                            onChange={(e) => { this.setState({ searchName: e.target.value }); }} />
+                        <Select style={{ width: 120 }}
+                            placeholder="选择一个省份"
+                            showSearch
+                            filterOption={companySearch}
+                            value={this.state.searchProvince}
+                            onChange={(e) => { this.setState({ searchProvince: e }) }} >
+                            {this.state.provinceList.map((item) => {
+                                return <Select.Option key={String(item.value)}>{item.label}</Select.Option>
+                            })}
+                        </Select>
+                        <Button type="primary" onClick={() => { this.loadData() }}>搜索</Button>
+                        <Button onClick={this.reset}>重置</Button>
+                    </div>
                     <TheModal data={this.state.modalData} onlyProvince={this.state.onlyProvince} show={this.state.modalShow} handleReturn={this.handleReturn} />
                     <Table className='member-table'
-                        columns={columns}
+                        columns={this.state.columns}
                         onRowClick={this.edit}
                         dataSource={this.state.data}
                         pagination={this.state.pagination} />