f.weber/homebrewery
0
0
Fork 0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2025-12-24 20:42:43 +00:00
Code Wiki Activity

trying to improve the admin view

Browse Source
This commit is contained in:
Scott
2016-02-19 15:37:58 -05:00
parent 2231dc3684
commit a1b8d4e8ce
6 changed files with 126 additions and 92 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
client/admin/homebrewAdmin/homebrewAdmin.jsx
View File

@@ -2,10 +2,12 @@ var React = require('react');
var _ = require('lodash');
var cx = require('classnames');
var Moment = require('moment')
var Moment = require('moment');
var VIEW_LIMIT = 30;
var COLUMN_HEIGHT = 52;
var HomebrewAdmin = React.createClass({
getDefaultProps: function() {
return {
homebrews : [],
@@ -13,27 +15,29 @@ var HomebrewAdmin = React.createClass({
};
},
getInitialState: function() {
return {
viewStartIndex: 0
};
},
renderBrews : function(){
return _.map(this.props.homebrews, (brew)=>{
return _.times(VIEW_LIMIT, (i)=>{
var brew = this.props.homebrews[i + this.state.viewStartIndex];
if(!brew) return null;
return <tr className={cx('brewRow', {'isEmpty' : brew.text == ""})} key={brew.sharedId}>
<td>{brew.editId}</td>
<td>{brew.shareId}</td>
<td><a href={'/homebrew/edit/' + brew.editId} target='_blank'>{brew.editId}</a></td>
<td><a href={'/homebrew/share/' + brew.shareId} target='_blank'>{brew.shareId}</a></td>
<td>{Moment(brew.createdAt).fromNow()}</td>
<td>{Moment(brew.updatedAt).fromNow()}</td>
<td>{Moment(brew.lastViewed).fromNow()}</td>
<td>{brew.views}</td>
<td className='preview'>
<a target="_blank" href={'/homebrew/share/' + brew.shareId}>view</a>
<div className='content'>
{brew.text.slice(0, 500)}
</div>
</td>
<td><a href={'/homebrew/remove/' + brew.editId +'?admin_key=' + this.props.admin_key}><i className='fa fa-trash' /></a></td>
</tr>
})
});
},
render : function(){
@@ -41,22 +45,23 @@ var HomebrewAdmin = React.createClass({
return(
<div className='homebrewAdmin'>
<h2>Homebrews - {this.props.homebrews.length}</h2>
<table>
<thead>
<tr>
<th>Edit Id</th>
<th>Share Id</th>
<th>Created At</th>
<th>Last Updated</th>
<th>Last Viewed</th>
<th>Number of Views</th>
<th>Preview</th>
</tr>
</thead>
<tbody>
{this.renderBrews()}
</tbody>
</table>
<div className='brewTable'>
<table>
<thead>
<tr>
<th>Edit Id</th>
<th>Share Id</th>
<th>Created At</th>
<th>Last Updated</th>
<th>Last Viewed</th>
<th>Number of Views</th>
</tr>
</thead>
<tbody>
{this.renderBrews()}
</tbody>
</table>
</div>
</div>
);
}

73
client/admin/homebrewAdmin/homebrewAdmin.less
View File

@@ -1,42 +1,45 @@
.homebrewAdmin{
table{
.brewTable{
overflow-y : scroll;
max-height : 800px;
th{
padding : 10px;
font-weight : 800;
}
tr:nth-child(even){
background-color : fade(@green, 10%);
}
tr.isEmpty{
background-color : fade(@red, 30%);
}
td{
min-width : 100px;
padding : 10px;
text-align : center;
&.preview{
position : relative;
&:hover{
.content{
display : block;
max-height : 500px;
table{
th{
padding : 10px;
font-weight : 800;
}
tr:nth-child(even){
background-color : fade(@green, 10%);
}
tr.isEmpty{
background-color : fade(@red, 30%);
}
td{
min-width : 100px;
padding : 10px;
text-align : center;
&.preview{
position : relative;
&:hover{
.content{
display : block;
}
}
.content{
position : absolute;
display : none;
top : 100%;
left : 0px;
z-index : 1000;
max-height : 500px;
width : 300px;
padding : 30px;
background-color : white;
font-family : monospace;
text-align : left;
pointer-events : none;
}
}
.content{
position : absolute;
display : none;
top : 100%;
left : 0px;
z-index : 1000;
max-height : 500px;
width : 300px;
padding : 30px;
background-color : white;
font-family : monospace;
text-align : left;
pointer-events : none;
}
}
}