Skip to content
This repository was archived by the owner on Aug 24, 2019. It is now read-only.

Commit be06b59

Browse files
committed
add app module
1 parent 92f4382 commit be06b59

File tree

13 files changed

+326
-9
lines changed

13 files changed

+326
-9
lines changed
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
@import '../../components/variables.css';
2+
3+
.root {
4+
padding-left: 20px;
5+
padding-right: 20px;
6+
}
7+
8+
.container {
9+
margin: 0 auto;
10+
padding: 0 0 40px;
11+
min-height: 480px;
12+
max-width: var(--max-content-width);
13+
}
Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
2+
import React, { PropTypes, Component } from 'react';
3+
import {Breadcrumb, Table} from 'react-bootstrap';
4+
import cx from 'classnames';
5+
import _ from 'lodash';
6+
import withStyles from 'isomorphic-style-loader/lib/withStyles';
7+
import s from './Deployment.css';
8+
import Link from '../Link';
9+
10+
class Deployment extends Component {
11+
static propTypes = {
12+
appName: PropTypes.string,
13+
deploymentName: PropTypes.string,
14+
};
15+
16+
static defaultProps = {
17+
appName: '',
18+
deploymentName: '',
19+
};
20+
21+
constructor() {
22+
super();
23+
}
24+
25+
26+
render() {
27+
const self = this;
28+
const tipText = '暂无数据';
29+
return (
30+
<div className={s.root} >
31+
<div className={s.container}>
32+
<Breadcrumb>
33+
<Breadcrumb.Item active={true}>
34+
<Link to="/apps">应用列表</Link>
35+
</Breadcrumb.Item>
36+
<Breadcrumb.Item active={true}>
37+
<Link to={`/apps/${this.props.appName}`}>{this.props.appName}</Link>
38+
</Breadcrumb.Item>
39+
<Breadcrumb.Item active={true}>
40+
{this.props.deploymentName}
41+
</Breadcrumb.Item>
42+
</Breadcrumb>
43+
<Table striped bordered condensed hover responsive>
44+
<thead>
45+
<tr>
46+
<th style={{ textAlign:'center' }} >AppVersion</th>
47+
<th style={{ textAlign:'center' }} >PackageInfo</th>
48+
<th style={{ textAlign:'center' }} >Install Metrics</th>
49+
<th style={{ textAlign:'center' }} >操作</th>
50+
</tr>
51+
</thead>
52+
<tbody>
53+
</tbody>
54+
</Table>
55+
</div>
56+
</div>
57+
);
58+
}
59+
}
60+
export default withStyles(s)(Deployment);
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
{
2+
"name": "Deployment",
3+
"version": "0.0.0",
4+
"private": true,
5+
"main": "./Deployment.js"
6+
}

src/components/Product/Product.css

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
@import '../../components/variables.css';
2+
3+
.root {
4+
padding-left: 20px;
5+
padding-right: 20px;
6+
}
7+
8+
.container {
9+
margin: 0 auto;
10+
padding: 0 0 40px;
11+
min-height: 480px;
12+
max-width: var(--max-content-width);
13+
}

src/components/Product/Product.js

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
2+
import React, { PropTypes, Component } from 'react';
3+
import {Breadcrumb, Table} from 'react-bootstrap';
4+
import cx from 'classnames';
5+
import _ from 'lodash';
6+
import withStyles from 'isomorphic-style-loader/lib/withStyles';
7+
import s from './Product.css';
8+
import Link from '../Link';
9+
10+
class Product extends Component {
11+
static propTypes = {
12+
appName: PropTypes.string,
13+
};
14+
15+
static defaultProps = {
16+
appName: '',
17+
};
18+
19+
constructor() {
20+
super();
21+
}
22+
23+
render() {
24+
const self = this;
25+
const tipText = '暂无数据';
26+
return (
27+
<div className={s.root} >
28+
<div className={s.container}>
29+
<Breadcrumb>
30+
<Breadcrumb.Item active={true}>
31+
<Link to="/apps">应用列表</Link>
32+
</Breadcrumb.Item>
33+
<Breadcrumb.Item active={true}>
34+
{this.props.appName}
35+
</Breadcrumb.Item>
36+
</Breadcrumb>
37+
<Table striped bordered condensed hover responsive>
38+
<thead>
39+
<tr>
40+
<th style={{ textAlign:'center' }} >Deployments</th>
41+
<th style={{ textAlign:'center' }} >DeploymentKey</th>
42+
<th style={{ textAlign:'center' }} >Description</th>
43+
<th style={{ textAlign:'center' }} >Update Metadata</th>
44+
<th style={{ textAlign:'center' }} >Install Metrics</th>
45+
<th style={{ textAlign:'center' }} >操作</th>
46+
</tr>
47+
</thead>
48+
<tbody>
49+
</tbody>
50+
</Table>
51+
</div>
52+
</div>
53+
);
54+
}
55+
}
56+
export default withStyles(s)(Product);
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
{
2+
"name": "Product",
3+
"version": "0.0.0",
4+
"private": true,
5+
"main": "./Product.js"
6+
}
Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
2+
import React, { PropTypes, Component } from 'react';
3+
import {Modal, Button, FormGroup, FormControl, HelpBlock, ControlLabel} from 'react-bootstrap';
4+
5+
class PopAddApp extends Component {
6+
static propTypes = {
7+
value: PropTypes.string,
8+
};
9+
10+
static defaultProps = {
11+
value: '',
12+
};
13+
14+
constructor() {
15+
super();
16+
this.close = this.close.bind(this);
17+
this.open = this.open.bind(this);
18+
this.state = {showModal: false};
19+
}
20+
21+
close() {
22+
this.setState({showModal: false});
23+
}
24+
25+
open() {
26+
this.setState({showModal: true});
27+
}
28+
29+
render() {
30+
return (
31+
<Modal show={this.state.showModal} onHide={this.close}>
32+
<Modal.Header closeButton>
33+
<Modal.Title>添加App</Modal.Title>
34+
</Modal.Header>
35+
<Modal.Body>
36+
<FormGroup>
37+
<ControlLabel>App名字</ControlLabel>
38+
<FormControl
39+
value={this.props.value}
40+
type="text"
41+
/>
42+
<HelpBlock>必须以后缀(-ios|-android)命名</HelpBlock>
43+
</FormGroup>
44+
</Modal.Body>
45+
<Modal.Footer>
46+
<Button onClick={this.close}>关闭</Button>
47+
<Button onClick={this.close}>确定</Button>
48+
</Modal.Footer>
49+
</Modal>
50+
)
51+
}
52+
}
53+
export default PopAddApp;
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
{
2+
"name": "PopAddApp",
3+
"version": "0.0.0",
4+
"private": true,
5+
"main": "./PopAddApp.js"
6+
}

src/components/ProductList/ProductList.js

Lines changed: 22 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,21 @@
11

22
import React, { PropTypes, Component } from 'react';
3-
import {Breadcrumb, Table} from 'react-bootstrap';
3+
import {Breadcrumb, Table, Button, Col} from 'react-bootstrap';
44
import cx from 'classnames';
55
import _ from 'lodash';
66
import withStyles from 'isomorphic-style-loader/lib/withStyles';
77
import s from './ProductList.css';
88
import Link from '../Link';
9+
import PopAddApp from './PopAddApp';
910

1011
class ProductList extends Component {
1112
static propTypes = {
1213
isFetching: PropTypes.bool,
1314
rs: PropTypes.array,
1415
};
1516

17+
popAddApp:PopAddApp = null;
18+
1619
static defaultProps = {
1720
isFetching: true,
1821
rs: [],
@@ -22,12 +25,13 @@ class ProductList extends Component {
2225
super();
2326
this.renderRow = this.renderRow.bind(this);
2427
}
25-
2628
renderRow(rowData, index) {
2729
const appName = _.get(rowData, 'name');
2830
return (
2931
<tr key={index}>
30-
<td>{appName}</td>
32+
<td>
33+
<Link to={`/apps/${appName}`}>{appName}</Link>
34+
</td>
3135
<td style={{ textAlign: 'left' }}>
3236
<ul>
3337
{
@@ -70,12 +74,27 @@ class ProductList extends Component {
7074
const tipText = '暂无数据';
7175
return (
7276
<div className={s.root}>
77+
<PopAddApp
78+
ref={(popAddApp) => { this.popAddApp = popAddApp; }}
79+
value={this.props.token}
80+
close={this.props.close}
81+
/>
7382
<div className={s.container}>
7483
<Breadcrumb>
7584
<Breadcrumb.Item active={true}>
7685
应用列表
7786
</Breadcrumb.Item>
7887
</Breadcrumb>
88+
<Col style={{marginBottom:'20px'}}>
89+
<Button
90+
onClick={()=>{
91+
self.popAddApp.open();
92+
}}
93+
bsStyle="primary"
94+
>
95+
添加应用
96+
</Button>
97+
</Col>
7998
<Table striped bordered condensed hover responsive>
8099
<thead>
81100
<tr>

src/containers/DeploymentContainer.js

Lines changed: 13 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,19 @@ import _ from 'lodash';
66
import * as usersActions from '../actions/usersActions';
77
import * as authActions from '../actions/authActions';
88
import * as routesActions from '../actions/routesActions';
9-
import ProductList from '../components/ProductList';
9+
import Deployment from '../components/Deployment';
1010

1111
class DeploymentContainer extends Component {
12+
static propTypes = {
13+
appName: PropTypes.string,
14+
deploymentName: PropTypes.string,
15+
};
16+
17+
static defaultProps = {
18+
appName: '',
19+
deploymentName: '',
20+
};
21+
1222
componentDidMount() {
1323
if (!_.get(this.props, 'auth.isAuth')) {
1424
let path = location.pathname;
@@ -20,9 +30,9 @@ class DeploymentContainer extends Component {
2030
}
2131
}
2232
render() {
23-
const {products, actions } = this.props;
33+
const {appName, deploymentName, actions} = this.props;
2434
return (
25-
<div>111</div>
35+
<Deployment appName={appName} deploymentName={deploymentName} />
2636
);
2737
}
2838
}

0 commit comments

Comments
 (0)