Merge branch 'dev' of gitlab.corp.qunar.com:mfe/yapi into dev

This commit is contained in:
zwjamnsss 2017-07-19 17:18:48 +08:00
commit 494beb11a2
8 changed files with 180 additions and 78 deletions

View File

@ -1,9 +1,86 @@
import React, { Component } from 'react'
import Routes from './routes'
import axios from 'axios';
import { Route, HashRouter, Redirect } from 'react-router-dom'
import { Home, ProjectGroups, Interface, News } from './containers/index'
import User from './containers/User/User.js'
import Header from './components/Header/Header'
const LOADING_STATUS = 0;
const GUEST_STATUS = 1;
const MEMBER_STATUS = 2;
class App extends Component {
constructor(props) {
super(props)
this.state = {
login: LOADING_STATUS
}
}
route = (status) => {
let r;
if (status === LOADING_STATUS) {
return <span>loading...</span>
} else if (status === GUEST_STATUS) {
r = (
<HashRouter>
<div className="router-main">
<Header />
<Route path="/" component={Home} exact />
<Redirect to="/" />
</div>
</HashRouter>
)
} else {
r = (
<HashRouter>
<div className="router-main">
<Header />
<Route path="/" component={ProjectGroups} exact />
<Route path="/ProjectGroups" component={ProjectGroups} />
<Route path="/Interface" component={Interface} />
<Route path="/user" component={User} />
<Route path="/News" component={News} />
</div>
</HashRouter>
)
}
return r
}
componentDidMount() {
console.log('app.js init')
axios.get('/user/status').then((res) => {
if (res.data.errcode === 0 && res.data.data._id > 0) {
this.setState({
login: MEMBER_STATUS
})
} else {
this.setState({
login: GUEST_STATUS
})
}
}, (err) => {
this.setState({
login: GUEST_STATUS
})
console.log(err.message)
})
}
render() {
return <Routes />
console.log(MEMBER_STATUS)
console.log(this.route(this.state.login))
return this.route(this.state.login)
}
}

View File

@ -27,6 +27,7 @@ const loginActions = (data) => {
data: res
}
});
location.reload()
} else {
console.log('登录失败,errcode不为0');
}

View File

@ -4,19 +4,11 @@ import {
} from '../constants/action-types.js';
export function fetchNewsData () {
const data = [{
name: 'John Brown',
date: '2015-11-11 13:00:15',
desc: '创建服务现场'
}, {
name: 'John Brown1',
date: '2015-11-11 13:00:15',
desc: '技术测试异常'
}, {
name: 'John Brown2',
date: '2015-11-11 13:00:15',
desc: '网络异常正在修复'
}]
const data = [
{ key: 1, type: 'John Brown', news: '您好!亲爱的用户:您已成功申请接口:实时空气质量数据查询,请于两个月内进行应用验证,逾期接口将不能正常使用。如果您在使用的过程中遇到任何问题,欢迎前往交流社区反馈意见,谢谢!',time: '2014-12-01' },
{ key: 2, type: 'John Brown', news: 'My name is John Brown, I am 32 years old, living in New York No. 1 Lake Park.',time: '2014-12-01' },
{ key: 3, type: 'John Brown', news: 'My name is John Brown, I am 32 years old, living in New York No. 1 Lake Park.',time: '2014-12-01' }
];
return {
type: FETCH_NEWS_DATA,
@ -25,19 +17,11 @@ export function fetchNewsData () {
}
export function fetchViewedNews () {
const data = [{
name: 'John Brown21',
date: '2015-11-11 13:00:15',
desc: '创建服务现场'
}, {
name: 'John Brown12',
date: '2015-11-11 13:00:15',
desc: '技术测试异常'
}, {
name: 'John Brown22',
date: '2015-11-11 13:00:15',
desc: '网络异常正在修复'
}]
const data = [
{ key: 1, type: 'John Brown1', news: 'My name is John Brown, I am 32 years old, living in New York No. 1 Lake Park.',time: '2014-12-01' },
{ key: 2, type: 'John Brown2', news: 'My name is John Brown, I am 32 years old, living in New York No. 1 Lake Park.',time: '2014-12-01' },
{ key: 3, type: 'John Brown3å', news: 'My name is John Brown, I am 32 years old, living in New York No. 1 Lake Park.',time: '2014-12-01' }
];
return {
type: FETCH_NEWS_DATA,
@ -46,19 +30,11 @@ export function fetchViewedNews () {
}
export function fetchNotVieweNews () {
const data = [{
name: 'John Brown22',
date: '2015-11-11 13:00:15',
desc: '创建服务现场'
}, {
name: 'John Brown12',
date: '2015-11-11 13:00:15',
desc: '技术测试异常'
}, {
name: 'John Brown22',
date: '2015-11-11 13:00:15',
desc: '网络异常正在修复'
}]
const data = [
{ key: 1, type: 'John Brown', news: 'My name is John Brown, I am 32 years old, living in New York No. 1 Lake Park.',time: '2015-11-11 13:00:15' },
{ key: 2, type: 'John Brown', news: 'My name is John Brown, I am 32 years old, living in New York No. 1 Lake Park.',time: '2015-11-11 13:00:15' },
{ key: 3, type: 'John Brown', news: 'My name is John Brown, I am 32 years old, living in New York No. 1 Lake Park.',time: '2015-11-11 13:00:15' }
];
return {
type: FETCH_NEWS_DATA,
@ -68,19 +44,11 @@ export function fetchNotVieweNews () {
export function fetchMoreNews () {
return (dispatch)=>{
const data = [{
name: 'John Brown2212',
date: '2015-11-11 13:00:15',
desc: '创建服务现场'
}, {
name: 'John Brown1132',
date: '2015-11-11 13:00:15',
desc: '技术测试异常'
}, {
name: 'John Brown23212',
date: '2015-11-11 13:00:15',
desc: '网络异常正在修复'
}]
const data = [
{ key: 1, type: 'John Brown', news: 'My name is John Brown, I am 32 years old, living in New York No. 1 Lake Park.',time: '2014-12-01' },
{ key: 2, type: 'John Brown', news: 'My name is John Brown, I am 32 years old, living in New York No. 1 Lake Park.',time: '2014-12-01' },
{ key: 3, type: 'John Brown', news: 'My name is John Brown, I am 32 years old, living in New York No. 1 Lake Park.',time: '2014-12-01' }
];
dispatch({
type: FETCH_MORE_NEWS,

View File

@ -4,7 +4,7 @@ import NewsTimeline from './NewsTimeline/NewsTimeline'
import { connect } from 'react-redux'
import PropTypes from 'prop-types'
import NewsList from './NewsList/NewsList.js'
import { fetchNewsData } from '../../actions/news.js'
import { fetchNotVieweNews } from '../../actions/news.js'
@connect(
@ -14,7 +14,7 @@ import { fetchNewsData } from '../../actions/news.js'
}
},
{
fetchNewsData: fetchNewsData
fetchNotVieweNews: fetchNotVieweNews
}
)
@ -24,10 +24,10 @@ class News extends Component {
}
static propTypes = {
newsData: PropTypes.array,
fetchNewsData: PropTypes.func
fetchNotVieweNews: PropTypes.func
}
componentWillMount(){
this.props.fetchNewsData()
this.props.fetchNotVieweNews()
}
render () {
const data = this.props.newsData

View File

@ -29,6 +29,50 @@
.news-timeline{
margin-left: 30px;
margin-top: 30px;
.removeAllNews{
background-color: #f7f7f7;
padding: 7px;
display: inline-block;
overflow: hidden;
margin-bottom: 5px;
border-radius: 5px;
cursor: pointer;
color: #a09f9f;
&:hover,&:active{
background-color: #333;
color: white;
}
}
.ant-table-wrapper{
width: 822px;
}
.ant-table-row{
max-width: 80%;
}
.newsDesc{
padding-right: 15px;
p{
text-indent: 2em;
color: #333;
font-size: 14px;
line-height: 30px;;
}
span{
font-size: 14px;
margin-top: 15px;
display: inline-block;
color: #999;
cursor: pointer;
i{
margin-right: 5px;
}
&:hover, &.active {
color: #333;
}
}
}
}
.ant-timeline-item-content{

View File

@ -66,9 +66,9 @@ class NewsList extends Component {
render () {
return (
<ul onClick = {this.fetchData.bind(this)} className="news-list">
<li className="active allnews">全部消息</li>
{/*<li className="allnews">全部消息</li>*/}
<li className='active notview'>未读消息</li>
<li className='viewednews'>已读消息</li>
<li className='notview'>未读消息</li>
</ul>
)
}

View File

@ -1,8 +1,13 @@
import React, { Component } from 'react'
import { Timeline } from 'antd'
import { Table, Icon, Popconfirm } from 'antd'
import PropTypes from 'prop-types'
import { connect } from 'react-redux'
import { fetchMoreNews } from '../../../actions/news.js'
const removeConfirm = function(e){
console.log(e);
}
@connect(
state=>{
return state;
@ -11,35 +16,41 @@ import { fetchMoreNews } from '../../../actions/news.js'
fetchMoreNews: fetchMoreNews
}
)
class NewsTimeline extends Component {
static propTypes = {
newsData: PropTypes.array,
fetchMoreNews: PropTypes.func
}
constructor(props) {
super(props);
}
removeOneNews(id){
return ()=>{
console.log(id);
}
}
render () {
const columns = [
{ title: '类型',width:100, dataIndex: 'type', key: 'type' },
{ title: '消息', dataIndex: 'news', key: 'news' },
{ title: '发布时间',width:150, dataIndex: 'time', key: 'time' }
];
const data = this.props.newsData;
return (
<section className="news-timeline">
<Timeline pending={<a onClick = {this.props.fetchMoreNews}>See more</a>}>
{
data.map(function(item,i){
return (
<Timeline.Item color = 'green' key = {i} >
<div>
<span className='timelineDate'>{item.date}</span>
<span className='timelineName'>{item.name}</span>
</div>
<p>{item.desc}</p>
</Timeline.Item>
)
})
}
</Timeline>
<span className='removeAllNews'>
<Popconfirm title="你确定要清空所有消息吗?" onConfirm={removeConfirm} okText="删除" cancelText="取消">
清空消息
</Popconfirm>
</span>
<Table
columns={columns}
expandedRowRender={record => <div className='newsDesc'><p>{record.news}</p><span onClick = {this.removeOneNews(record.key)} ><Icon type="delete" />删除</span></div>}
dataSource={data}
/>
</section>
)
}

View File

@ -1,5 +1,6 @@
import React from 'react'
import { Route, HashRouter } from 'react-router-dom'
import { Home, ProjectGroups, Interface, News } from './containers/index'
import User from './containers/User/User.js'