content.jsx 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529
  1. import React from 'react';
  2. import { Spin, Button, Tabs, Table, message, Modal } from 'antd';
  3. import ajax from 'jquery/src/ajax/xhr.js'
  4. import $ from 'jquery/src/ajax';
  5. import '../content.less';
  6. import './content.less';
  7. import LeftTab from './leftTab.jsx';
  8. const TabPane = Tabs.TabPane;
  9. const MessageModal = React.createClass({
  10. getInitialState() {
  11. return {
  12. newVisible: false,
  13. loading: false,
  14. pagination: {
  15. defaultCurrent: 1,
  16. defaultPageSize: 10,
  17. showQuickJumper: true,
  18. pageSize: 10,
  19. onChange: function (page) {
  20. this.loadReaded(page);
  21. }.bind(this),
  22. showTotal: function (total) {
  23. return '共' + total + '条数据';
  24. }
  25. },
  26. UnreadPagination: {
  27. defaultCurrent: 1,
  28. defaultPageSize: 10,
  29. showQuickJumper: true,
  30. pageSize: 9999,
  31. onChange: function (page) {
  32. this.loadUnread(page);
  33. }.bind(this),
  34. showTotal: function (total) {
  35. return '共' + total + '条数据';
  36. }
  37. },
  38. columns: [
  39. {
  40. title: '编号',
  41. dataIndex: 'key',
  42. key: 'key'
  43. }, {
  44. title: '类型',
  45. dataIndex: 'noticeType',
  46. key: 'noticeType',
  47. render: (text, record) => {
  48. // return <div>{
  49. // text<8?<a href='#' onClick={(e) =>{ e.stopPropagation(),this.setStore(record)}}> {record.noticeTypeName} </a >:
  50. // <span>{record.noticeTypeName}</span>
  51. // }</div>
  52. //return <a href='#' onClick={(e) =>{ e.stopPropagation(),this.setStore(record)}}> {record.noticeTypeName} </a >
  53. return(<span>{record.noticeTypeName}</span>)
  54. }
  55. }, {
  56. title: '时间',
  57. dataIndex: 'createTimeFormattedDate',
  58. key: 'createTimeFormattedDate'
  59. }, {
  60. title: '内容',
  61. dataIndex: 'content',
  62. key: 'content',
  63. },
  64. // {
  65. // title: '公司',
  66. // dataIndex: 'unitName',
  67. // key: 'unitName',
  68. // }, {
  69. // title: '业务员',
  70. // dataIndex: 'principle',
  71. // key: 'principle',
  72. // }
  73. ],
  74. data: []
  75. };
  76. },
  77. //主菜单请求
  78. mainMenu(){
  79. this.setState({
  80. loading:true
  81. });
  82. $.ajax({
  83. method: "get",
  84. dataType: "json",
  85. crossDomain: false,
  86. url: globalConfig.context + "/api/admin/selectNavList",
  87. data: {
  88. },
  89. success:function(data){
  90. if (!data.data) {
  91. if (data.error && data.error.length) {
  92. message.warning(data.error[0].message);
  93. return;
  94. };
  95. };
  96. this.setState({
  97. menu:data.data
  98. });
  99. }.bind(this),
  100. }).always(function(data){
  101. this.setState({
  102. loading:false
  103. })
  104. }.bind(this))
  105. },
  106. finId(text){
  107. var data=this.state.menu||[];
  108. var rid='';
  109. switch(text) {
  110. case 1:
  111. data.map(function(nub, index) {
  112. if(nub.url.indexOf('demand') != -1) {
  113. rid = nub.id;
  114. }
  115. });
  116. break;
  117. case 2:
  118. data.map(function(nub, index) {
  119. if(nub.url.indexOf('demand') != -1) {
  120. rid = nub.id;
  121. }
  122. });
  123. break;
  124. case 3:
  125. data.map(function(nub, index) {
  126. if(nub.url.indexOf('achievement') != -1) {
  127. rid = nub.id;
  128. }
  129. });
  130. break;
  131. case 4:
  132. data.map(function(nub, index) {
  133. if(nub.url.indexOf('achievement') != -1) {
  134. rid = nub.id;
  135. }
  136. });
  137. break;
  138. case 5:
  139. data.map(function(nub, index) {
  140. if(nub.url.indexOf('order') != -1) {
  141. rid = nub.id;
  142. }
  143. });
  144. break;
  145. case 6:
  146. data.map(function(nub, index) {
  147. if(nub.url.indexOf('order') != -1) {
  148. rid = nub.id;
  149. }
  150. });
  151. break;
  152. case 7:
  153. data.map(function(nub, index) {
  154. if(nub.url.indexOf('servicesManage') != -1) {
  155. rid = nub.id;
  156. }
  157. });
  158. break;
  159. default:
  160. rid='';
  161. }
  162. return rid;
  163. },
  164. //跳转详情
  165. setStore(record){
  166. localStorage.setItem('newData',{});
  167. let ids = record.noticeType;
  168. let rid = this.finId(ids) || "";
  169. var urls='',
  170. dataJson={};
  171. switch (ids) {
  172. case 1:
  173. urls = "/admin/demand.html?rid=" + rid +"#techDemandAudit";
  174. dataJson = {
  175. "id":record.uid,
  176. //"id":"3f93588b-332e-4353-bbfd-f1451b4b390c",
  177. "dataCategory":"0"
  178. };
  179. break;
  180. case 2:
  181. urls = "/admin/demand.html?rid=" + rid+ "#techDemandPublish";
  182. dataJson = {
  183. "id":record.uid,
  184. //"id":"40f77e32-29fa-4a85-a6f0-7c4986bdc5e3",
  185. "dataCategory":'1'
  186. };
  187. break ;
  188. case 3:
  189. urls = "/admin/achievement.html?rid=" + rid +"#techAchievementAudit";
  190. dataJson = {
  191. "id":record.uid,
  192. //"id":"f09d5c08-4a8b-48a6-9753-86006f1a53cb",
  193. "ownerType":'1'
  194. };
  195. break ;
  196. case 4:
  197. urls = "/admin/achievement.html?rid=" + rid + "#techAchievementPublish";
  198. dataJson = {
  199. "id":record.uid,
  200. //"id":"953c9ef7-6cf6-4ab7-af89-c01521998fed",
  201. "ownerType":'1'
  202. };
  203. break ;
  204. case 5:
  205. urls = "/admin/order.html?rid=" + rid + "#myService";
  206. dataJson = {
  207. "orderNo":record.orderNo
  208. //"orderNo":"175557414077480960"
  209. };
  210. break ;
  211. case 6:
  212. urls = "/admin/order.html?rid=" + rid + "#mySettlement";
  213. dataJson = {
  214. "orderNo":record.orderNo
  215. //"orderNo":"180714111314051072"
  216. };
  217. break ;
  218. case 7:
  219. urls = "/admin/servicesManage/projectOrder.html?rid=" + rid + "#projectManage";
  220. dataJson = {
  221. //"id":record.id,
  222. "id":"69e2d8ca984240a4b9c90daac69fe5e3",
  223. "buyerType":"1"
  224. };
  225. break ;
  226. default :
  227. urls:'#';
  228. dataJson = {};
  229. };
  230. console.log(rid);
  231. if(rid){
  232. var data = dataJson;
  233. var newData = JSON.stringify(data);
  234. localStorage.setItem('newData',newData);
  235. window.location.href = globalConfig.context +urls;
  236. }
  237. },
  238. loadReaded(pageNo) {
  239. this.state.data = [];
  240. this.setState({
  241. loading: true
  242. });
  243. $.ajax({
  244. method: "get",
  245. dataType: "json",
  246. crossDomain: false,
  247. url: globalConfig.context + "/api/admin/notice/readed",
  248. data: {
  249. pageNo: pageNo || 1,
  250. pageSize: this.state.pagination.pageSize,
  251. }
  252. }).done((data) => {
  253. if (!data.data) {
  254. if (data.error && data.error.length) {
  255. message.warning(data.error[0].message);
  256. return;
  257. };
  258. };
  259. this.state.data = [];
  260. for (let i = 0; i < data.data.list.length; i++) {
  261. let thisdata = data.data.list[i];
  262. this.state.data.push({
  263. key: i + 1,
  264. id: thisdata.id,
  265. rid: thisdata.rid,
  266. uid: thisdata.uid,
  267. aid: thisdata.aid,
  268. noticeType: thisdata.noticeType,
  269. year: thisdata.year,
  270. noticeTypeName: thisdata.noticeTypeName,
  271. content: thisdata.content,
  272. createTime: thisdata.createTime,
  273. createTimeFormattedDate: thisdata.createTimeFormattedDate,
  274. principle: thisdata.principle,
  275. unitName: thisdata.unitName
  276. });
  277. };
  278. this.state.pagination.current = data.data.pageNo;
  279. this.state.pagination.total = data.data.totalCount;
  280. this.setState({
  281. dataSource: this.state.data,
  282. pagination: this.state.pagination
  283. });
  284. }).always(function () {
  285. this.setState({
  286. loading: false
  287. });
  288. }.bind(this));
  289. },
  290. loadUnread(pageNo) {
  291. this.state.data = [];
  292. this.setState({
  293. loading: true
  294. });
  295. $.ajax({
  296. method: "get",
  297. dataType: "json",
  298. crossDomain: false,
  299. url: globalConfig.context + "/api/admin/notice/unread",
  300. data: {
  301. pageNo: pageNo || 1,
  302. pageSize: this.state.UnreadPagination.pageSize,
  303. }
  304. }).done((data) => {
  305. if (!data.data) {
  306. if (data.error && data.error.length) {
  307. message.warning(data.error[0].message);
  308. return;
  309. };
  310. };
  311. this.state.data = [];
  312. for (let i = 0; i < data.data.list.length; i++) {
  313. let thisdata = data.data.list[i];
  314. this.state.data.push({
  315. key: i + 1,
  316. id: thisdata.id,
  317. rid: thisdata.rid,
  318. uid: thisdata.uid,
  319. aid: thisdata.aid,
  320. noticeType: thisdata.noticeType,
  321. year: thisdata.year,
  322. noticeTypeName: thisdata.noticeTypeName,
  323. content: thisdata.content,
  324. createTime: thisdata.createTime,
  325. createTimeFormattedDate: thisdata.createTimeFormattedDate,
  326. principle: thisdata.principle,
  327. unitName: thisdata.unitName
  328. });
  329. };
  330. this.state.UnreadPagination.current = data.data.pageNo;
  331. this.state.UnreadPagination.total = data.data.totalCount;
  332. if(data.data.list.length) {
  333. this.setState({
  334. newVisible: true
  335. });
  336. }
  337. this.setState({
  338. unreadData: this.state.data,
  339. UnreadPagination: this.state.UnreadPagination
  340. });
  341. }).always(function () {
  342. this.setState({
  343. loading: false,
  344. });
  345. }.bind(this));
  346. },
  347. componentWillMount() {
  348. this.loadReaded();
  349. this.loadUnread();
  350. this.mainMenu();
  351. },
  352. handleOk() {
  353. this.setState({
  354. newVisible: false
  355. });
  356. },
  357. render() {
  358. return (
  359. <div className="set-content">
  360. <div className="set-title">
  361. <span>信息中心</span>
  362. </div>
  363. <Spin spinning={this.state.loading} className="spin-box">
  364. <Tabs defaultActiveKey="1">
  365. <Tabs.TabPane tab="新信息" key="1">
  366. <Table
  367. columns={this.state.columns}
  368. dataSource={this.state.unreadData}
  369. pagination={this.state.UnreadPagination}
  370. />
  371. </Tabs.TabPane>
  372. <Tabs.TabPane tab="已读信息" key="2">
  373. <Table
  374. columns={this.state.columns}
  375. dataSource={this.state.dataSource}
  376. pagination={this.state.pagination}
  377. />
  378. </Tabs.TabPane>
  379. </Tabs>
  380. </Spin>
  381. <Modal
  382. style={{ position: "relative" }}
  383. title="消息提醒"
  384. visible={this.state.newVisible}
  385. width={1000}
  386. closable={false}
  387. footer={null}
  388. >
  389. <Table
  390. columns={this.state.columns}
  391. dataSource={this.state.unreadData}
  392. pagination={false}
  393. />
  394. <Button
  395. onClick={this.handleOk}
  396. type={"primary"}
  397. style={{
  398. position: "relative",
  399. left: "50%",
  400. transform: "translateX(-50%)",
  401. bottom: -10
  402. }}
  403. >
  404. 我已阅读以上信息
  405. </Button>
  406. </Modal>
  407. </div>
  408. );
  409. }
  410. });
  411. const Content = React.createClass({
  412. getInitialState() {
  413. return {
  414. loading: false,
  415. component:'<div></div>'
  416. };
  417. },
  418. getKey(key){
  419. switch(key){
  420. case 'normal':
  421. require.ensure([], () => {
  422. this.setState({
  423. component: <MessageModal />,
  424. });
  425. });
  426. break;
  427. case "contacts":
  428. let Module = require('./contacts/index').default;
  429. require.ensure([], () => {
  430. this.setState({
  431. component: <Module />,
  432. });
  433. });
  434. break;
  435. default:
  436. require.ensure([], () => {
  437. let Module = require('../module').default;
  438. this.setState({
  439. component:<Module />
  440. });
  441. });
  442. }
  443. window.location.hash=key;
  444. },
  445. componentWillMount() {
  446. if (window.location.hash) {
  447. this.getKey((window.location.hash).slice(1));
  448. } else {
  449. this.getKey('normal');
  450. };
  451. },
  452. render() {
  453. return (
  454. <div className="manage-content">
  455. <LeftTab handlekey={this.getKey} />
  456. <div className="content-right">
  457. <Spin spinning={this.state.loading} className='spin-box'>
  458. <div className="index-content">
  459. {this.state.component}
  460. </div>
  461. </Spin>
  462. </div>
  463. </div>
  464. )
  465. }
  466. });
  467. export default Content;
  468. // <div className="index-content">
  469. // <div className="index-userdata clearfix">
  470. // <p className="acc-title">{this.state.number}</p>
  471. // <div className="userdata-img">
  472. // <img src={globalConfig.staticHost + "/upload" + this.state.personPortraitUrl} alt="" />
  473. // </div>
  474. // <div className="userdata-content">
  475. // {(() => {
  476. // switch (userData.lvl || this.state.userlvl) {
  477. // case '0':
  478. // return <p className="userdata-lvl">等级:<span>LV1</span> 普通用户</p>;
  479. // case '1':
  480. // return <p className="userdata-lvl">等级:<span>LV2</span> 已认证用户</p>;
  481. // };
  482. // })()}
  483. // <p>完善资料 {this.state.per}% ,<a href="./set.html">继续完善</a>,有助于提高您的资信</p>
  484. // <p className="userdata-relate" style={{ 'display': 'none' }}>
  485. // <Button className="relateqq"><img src={qq} alt="" /> QQ账号登录</Button>
  486. // <Button className="relateweibo"><img src={weibo} alt="" />微博账号登录</Button>
  487. // <Button className="relateweixin"><img src={weixin} alt="" />微信账号登录</Button>
  488. // </p>
  489. // <div className="userdata-follow">已有<a href="">{this.state.follow}</a>人关注你</div>
  490. // </div>
  491. // </div>
  492. // <div className="index-record">
  493. // <p className="acc-title">我的轨迹</p>
  494. // <ul className="record-list clearfix">
  495. // <li>技术成果:<a href="">{this.state.chengguo}</a>项</li>
  496. // <li>技术开发:<a href="">{this.state.kaifa}</a>项</li>
  497. // <li>科技服务:<a href="">{this.state.fuwu}</a>项</li>
  498. // <li>发布需求:<a href="">{this.state.xuqiu}</a>项</li>
  499. // </ul>
  500. // </div>
  501. // <div className="index-activity">
  502. // <Tabs defaultActiveKey="1" onChange={this.tabChange}>
  503. // <TabPane tab="活动" key="1">
  504. // <p className="acc-title">即将举办的活动</p>
  505. // <ul className="activity-list">
  506. // {
  507. // this.state.activityArr.map(function (item, i) {
  508. // return <li key={i}>
  509. // <span className="list-type">[{item.type}]</span>
  510. // <span className="list-title">{item.title}</span>
  511. // <a href={item.link}>报名</a>
  512. // <span className="list-time">{item.time}</span>
  513. // </li>;
  514. // })
  515. // }
  516. // </ul>
  517. // </TabPane>
  518. // <TabPane tab="其他" key="2">Content of Tab Pane 2</TabPane>
  519. // </Tabs>
  520. // </div>
  521. // </div>