import React from 'react'; import { Row, Col, Icon, Modal, Button, Spin, Select, Input, message, Badge, Table, Tabs } from 'antd'; import { provinceArr } from '../dataDic.js'; import { companySearch } from '../tools.js'; import './topTab.less'; import ajax from 'jquery/src/ajax/xhr.js' import $ from 'jquery/src/ajax'; import logo from '../../../image/acc-logo.png'; const MessageModal = React.createClass({ getInitialState() { return { visible: false, loading: false, pagination: { defaultCurrent: 1, defaultPageSize: 10, showQuickJumper: true, pageSize: 10, onChange: function (page) { this.loadReaded(page); }.bind(this), showTotal: function (total) { return '共' + total + '条数据'; } }, UnreadPagination: { defaultCurrent: 1, defaultPageSize: 10, showQuickJumper: true, pageSize: 10, onChange: function (page) { this.loadUnread(page); }.bind(this), showTotal: function (total) { return '共' + total + '条数据'; } }, columns: [ { title: '编号', dataIndex: 'key', key: 'key' }, { title: '类型', dataIndex: 'noticeType', key: 'noticeType', render: (text, record) => { switch (text) { case 1: return <a href={globalConfig.context + "/admin/servicesManage/patent.html?rid=" + record.rid + "&uid=" + record.uid + "#comprehensive"}> {record.noticeTypeName} </a>; case 3: return <a href={globalConfig.context + "/admin/servicesManage/copyright.html?rid=" + record.rid + "&uid=" + record.uid + "#copyright"}> {record.noticeTypeName} </a>; case 2: return <a href={globalConfig.context + "/admin/servicesManage/highTech.html?rid=" + record.rid + "&uid=" + record.uid + "&year=" + record.year + "#highTechApply"}> {record.noticeTypeName} </a>; case 4: return <a href={globalConfig.context + "/admin/servicesManage/technology.html?rid=" + record.rid + "&uid=" + record.uid + "#applyManage"}> {record.noticeTypeName} </a>; case 5: return <a href={globalConfig.context + "/admin/userManage.html?id=" + record.uid + "&type=0" + (window.showUserList ? "#userList" : "#customerList")}> {record.noticeTypeName} </a>; case 6: return <a href={globalConfig.context + "/admin/userManage.html?id=" + record.uid + "&type=1" + (window.showOrgList ? "#orgList" : "#customerList")}> {record.noticeTypeName} </a >; } } }, { title: '时间', dataIndex: 'createTimeFormattedDate', key: 'createTimeFormattedDate' }, { title: '内容', dataIndex: 'content', key: 'content', }, { title: '公司', dataIndex: 'unitName', key: 'unitName', }, { title: '业务员', dataIndex: 'principle', key: 'principle', } ], data: [] }; }, loadReaded(pageNo) { this.state.data = []; this.setState({ loading: true }); $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/notice/readed", data: { pageNo: pageNo || 1, pageSize: this.state.pagination.pageSize, } }).done((data) => { if (!data.data) { if (data.error && data.error.length) { message.warning(data.error[0].message); return; }; }; this.state.data = []; for (let i = 0; i < data.data.list.length; i++) { let thisdata = data.data.list[i]; this.state.data.push({ key: i + 1, id: thisdata.id, rid: thisdata.rid, uid: thisdata.uid, aid: thisdata.aid, noticeType: thisdata.noticeType, year: thisdata.year, noticeTypeName: thisdata.noticeTypeName, content: thisdata.content, createTime: thisdata.createTime, createTimeFormattedDate: thisdata.createTimeFormattedDate, principle: thisdata.principle, unitName: thisdata.unitName }); }; this.state.pagination.current = data.data.pageNo; this.state.pagination.total = data.data.totalCount; this.setState({ dataSource: this.state.data, pagination: this.state.pagination }); }).always(function () { this.setState({ loading: false }); }.bind(this)); }, loadUnread(pageNo) { this.state.data = []; this.setState({ loading: true }); $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/notice/unread", data: { pageNo: pageNo || 1, pageSize: this.state.UnreadPagination.pageSize, } }).done((data) => { if (!data.data) { if (data.error && data.error.length) { message.warning(data.error[0].message); return; }; }; this.state.data = []; for (let i = 0; i < data.data.list.length; i++) { let thisdata = data.data.list[i]; this.state.data.push({ key: i + 1, id: thisdata.id, rid: thisdata.rid, uid: thisdata.uid, aid: thisdata.aid, noticeType: thisdata.noticeType, year: thisdata.year, noticeTypeName: thisdata.noticeTypeName, content: thisdata.content, createTime: thisdata.createTime, createTimeFormattedDate: thisdata.createTimeFormattedDate, principle: thisdata.principle, unitName: thisdata.unitName }); }; this.state.UnreadPagination.current = data.data.pageNo; this.state.UnreadPagination.total = data.data.totalCount; this.setState({ unreadData: this.state.data, UnreadPagination: this.state.UnreadPagination }); }).always(function () { this.setState({ loading: false }); }.bind(this)); }, componentWillReceiveProps(nextProps) { if (!this.state.visible && nextProps.showDesc) { this.loadReaded(); this.loadUnread(); }; this.state.visible = nextProps.showDesc }, handleOk() { this.setState({ visible: false, }); this.props.closeDesc(false, true); }, handleCancel(e) { this.setState({ visible: false, }); this.props.closeDesc(false, true); }, render() { return ( <div className="topTab-modal"> <Spin spinning={this.state.loading} className='spin-box'> <Modal title="信息中心" visible={this.state.visible} onOk={this.handleOk} onCancel={this.handleCancel} width='800px' footer='' > <Tabs defaultActiveKey="1"> <Tabs.TabPane tab="新信息" key="1"> <Table columns={this.state.columns} dataSource={this.state.unreadData} pagination={this.state.UnreadPagination} /> </Tabs.TabPane> <Tabs.TabPane tab="已读信息" key="2"> <Table columns={this.state.columns} dataSource={this.state.dataSource} pagination={this.state.pagination} /> </Tabs.TabPane> </Tabs> </Modal> </Spin> </div> ); } }); const UserModal = React.createClass({ getInitialState() { return { visible: false, loading: false, provinceOption: [] }; }, componentWillMount() { let _me = this; provinceArr.map(function (item) { _me.state.provinceOption.push( <Select.Option value={item} key={item}>{item}</Select.Option> ) }); }, loadData() { this.setState({ loading: true }); $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/adminInfo", success: function (data) { if (!data.data) { if (data.error[0] && data.error[0]) { message.warning(data.error[0].message); }; return; }; this.setState({ id: data.data.id, mobile: data.data.mobile, name: data.data.name, position: data.data.position, email: data.data.email, createTime: data.data.createTime, number: data.data.number, province: data.data.province, createTimeFormattedDate: data.data.createTimeFormattedDate }); }.bind(this), }).always(function (data) { this.setState({ loading: false }); }.bind(this)); }, componentWillReceiveProps(nextProps) { if (!this.state.visible && nextProps.showDesc) { this.loadData(); }; this.state.visible = nextProps.showDesc }, handleOk() { this.setState({ loading: true }); $.ajax({ method: "post", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/updateAdminInfo", data: { id: this.state.id, mobile: this.state.mobile, name: this.state.name, email: this.state.email, province: this.state.province, password: this.state.password, pwd: this.state.pwd } }).always(function (data) { if (data.error && data.error.length) { message.warning(data.error[0].message); this.setState({ loading: false }); } else { message.success('保存成功!'); this.props.closeDesc(false, true); }; }.bind(this)); }, handleCancel(e) { this.setState({ visible: false, }); this.props.closeDesc(false); }, render() { return ( <div className="topTab-modal"> <Spin spinning={this.state.loading} className='spin-box'> <Modal title="用户设置" visible={this.state.visible} onOk={this.handleOk} onCancel={this.handleCancel} width='380px' > <ul className="modal-content"> <li> <span className='modal-text'>名字</span> <Input value={this.state.name} onChange={(e) => { this.state.name = e.target.value; this.setState({ name: this.state.name }); }} /> </li> <li> <span className='modal-text'>职位</span> <span>{this.state.position}</span> </li> <li> <span className='modal-text'>登录账号</span> <Input value={this.state.mobile} onChange={(e) => { this.state.mobile = e.target.value; this.setState({ mobile: this.state.mobile }); }} /> </li> <li> <span className='modal-text'>省份</span> <span>{this.state.province}</span> </li> <li> <span className='modal-text'>邮箱</span> <Input value={this.state.email} onChange={(e) => { this.state.email = e.target.value; this.setState({ email: this.state.email }); }} /> </li> <li> <span className='modal-text'>密码</span> <Input value={this.state.password} onChange={(e) => { this.state.password = e.target.value; this.setState({ password: this.state.password }); }} /> </li> <li> <span className='modal-text'>原密码</span> <Input value={this.state.pwd} onChange={(e) => { this.state.pwd = e.target.value; this.setState({ pwd: this.state.pwd }); }} /> </li> </ul> </Modal> </Spin> </div> ); } }); const TopTab = React.createClass({ getInitialState() { return { username: '请登录!', }; }, logOut() { let theActive = this.props.active; $.ajax({ method: "get", dataType: "json", url: globalConfig.context + "/login", }).done(function (data) { window.location.href = globalConfig.context + "/admin/login.html" }); }, componentWillMount() { this.loadData(); }, loadData() { this.setState({ loading: true }); $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/notice/unreadCount", success: function (data) { if (!data.data) { if (data.error[0] && data.error[0]) { message.warning(data.error[0].message); return; }; }; this.setState({ badge: data.data, }); }.bind(this), }).always(function (data) { this.setState({ loading: false }); }.bind(this)); }, closeUserModal(e, s) { this.state.userModalShow = e; if (s) { this.loadData(); }; }, closeMessageModal(e, s) { this.state.messageModalShow = e; if (s) { this.loadData(); }; }, render() { return ( <div className="account-top" > <div className="acc-top-user"> <span className="acc-top-user-name">欢迎您 , {adminData.name || adminData.mobile ? <a onClick={() => { if (window.showPermissionList && window.showRoleList) { return }; this.setState({ userModalShow: true }); }}> {adminData.name || adminData.mobile} </a> : <a onClick={this.logOut}>{this.state.username}</a>} <a onClick={this.logOut}>[ 退出 ]</a></span> <span className="acc-top-user-toindex"><a href={globalConfig.avatarHost + "/html/index.html"}>返回首页</a></span> <a onClick={() => { this.setState({ messageModalShow: true }); }} className="user-badge"> <Icon type="mail" /> {(() => { if (!window.showSystem && this.state.badge) { return <Badge status="processing" /> } })()} </a> </div> <div className="acc-index"> <div className="acc-index-imgbox"> <img src={logo} alt="" /> </div> <span><a href={globalConfig.context + "/admin/index.html"}>管理中心首页</a></span> </div> <div className="acc-top-tab"> <Row> <Col style={{ display: window.showUserManage ? 'block' : 'none' }} className={this.props.active === 'userManage' ? 'active' : ''} span={3}><a href={globalConfig.context + "/admin/userManage.html"}>用户管理</a></Col> <Col style={{ display: window.showServices ? 'block' : 'none' }} className={this.props.active === 'services' ? 'active' : ''} span={3}><a href={globalConfig.context + "/admin/servicesManage/contract.html"}>科技服务管理</a></Col> <Col style={{ display: window.showAchievement ? 'block' : 'none' }} className={this.props.active === 'achievement' ? 'active' : ''} span={3}><a href="">科技成果管理</a></Col> <Col style={{ display: window.showDemand ? 'block' : 'none' }} className={this.props.active === 'demand' ? 'active' : ''} span={3}><a href="">科技需求管理</a></Col> <Col style={{ display: window.showIdea ? 'block' : 'none' }} className={this.props.active === 'idea' ? 'active' : ''} span={3}><a href="">科技思想管理</a></Col> <Col style={{ display: window.showSystem ? 'block' : 'none' }} className={this.props.active === 'system' ? 'active' : ''} span={3}><a href={globalConfig.context + "/admin/set.html"}>系统设置</a></Col> </Row> </div> <UserModal showDesc={this.state.userModalShow} closeDesc={this.closeUserModal} /> <MessageModal showDesc={this.state.messageModalShow} closeDesc={this.closeMessageModal} /> </div > ) } }); export default TopTab;