-
-
Save shripadk/d91e634e2143a510f19e to your computer and use it in GitHub Desktop.
[Rubix] - Menu item - I can't load menu item dynamically.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { State, Navigation } from 'react-router'; | |
import docCookies from './cookies'; | |
import classNames from 'classnames'; | |
import Helpers from 'util/Helpers'; | |
import MenuServicos from '../routes/components/MenuServicos'; | |
import { Link } from 'react-router'; | |
import { SidebarBtn } from 'global/jsx/sidebar_component'; | |
class Brand extends React.Component { | |
render() { | |
return ( | |
<NavHeader {...this.props}> | |
<NavBrand tabIndex='-1'> | |
<img src='/imgs/logo.png' alt='Pixma' width='80' height='39' /> | |
</NavBrand> | |
</NavHeader> | |
); | |
} | |
} | |
var DirectNavItem = React.createClass({ | |
mixins: [State, Navigation], | |
render() { | |
var active = false; | |
var currentLocation = this.context.router.state.location.pathname; | |
if(!active && this.props.path) { | |
active = this.isActive(this.props.path) && (currentLocation == this.props.path); | |
} | |
var classes = classNames({ | |
'pressed': active | |
}); | |
return ( | |
<NavItem className={classes} {...this.props}> | |
<Link to={this.props.path}> | |
<Icon bundle={this.props.bundle || 'fontello'} glyph={this.props.glyph} /> | |
</Link> | |
</NavItem> | |
); | |
} | |
}); | |
var Skins = React.createClass({ | |
switchSkin(skin, e) { | |
e.preventDefault(); | |
e.stopPropagation(); | |
for(var i=0; i < Skins.skins.length; i++) { | |
$('html').removeClass(Skins.skins[i]); | |
} | |
$('html').addClass(skin); | |
vex.close(this.props.id); | |
}, | |
render() { | |
return ( | |
<Grid style={{margin: '-2em'}}> | |
<Row> | |
<Col xs={12} className='text-center bg-darkgrayishblue75' style={{marginBottom: 25}}> | |
<div className='fg-white' style={{fontSize: 24, lineHeight: 1, padding: '25px 10px'}}> | |
Choose a theme: | |
</div> | |
</Col> | |
</Row> | |
<Row> | |
<Col xs={4} className='text-center'> | |
<a href='#' style={{border: 'none'}} onClick={this.switchSkin.bind(this, 'default')}> | |
<Icon glyph='icon-fontello-stop icon-4x' style={{color: '#E76049'}} /> | |
</a> | |
</Col> | |
<Col xs={4} className='text-center'> | |
<a href='#' style={{border: 'none'}} onClick={this.switchSkin.bind(this, 'green')}> | |
<Icon glyph='icon-fontello-stop icon-4x' className='fg-darkgreen45' /> | |
</a> | |
</Col> | |
<Col xs={4} className='text-center'> | |
<a href='#' style={{border: 'none'}} onClick={this.switchSkin.bind(this, 'blue')}> | |
<Icon glyph='icon-fontello-stop icon-4x' className='fg-blue' /> | |
</a> | |
</Col> | |
</Row> | |
<Row> | |
<Col xs={4} className='text-center'> | |
<a href='#' style={{border: 'none'}} onClick={this.switchSkin.bind(this, 'purple')}> | |
<Icon glyph='icon-fontello-stop icon-4x' className='fg-purple' /> | |
</a> | |
</Col> | |
<Col xs={4} className='text-center'> | |
<a href='#' style={{border: 'none'}} onClick={this.switchSkin.bind(this, 'brown')}> | |
<Icon glyph='icon-fontello-stop icon-4x' className='fg-brown' /> | |
</a> | |
</Col> | |
<Col xs={4} className='text-center'> | |
<a href='#' style={{border: 'none'}} onClick={this.switchSkin.bind(this, 'cyan')}> | |
<Icon glyph='icon-fontello-stop icon-4x' className='fg-darkcyan' /> | |
</a> | |
</Col> | |
</Row> | |
</Grid> | |
); | |
} | |
}); | |
Skins.skins = ['default', 'green', 'blue', 'purple', 'brown', 'cyan']; | |
var HeaderNavigation = React.createClass({ | |
handleSkinSwitch(e) { | |
e.preventDefault(); | |
e.stopPropagation(); | |
var vexContent; | |
vex.dialog.open({ | |
afterOpen: ($vexContent) => { | |
vexContent = $vexContent; | |
return React.render(<Skins id={$vexContent.data().vex.id} />, $vexContent.get(0)); | |
}, | |
afterClose: () => { | |
React.unmountComponentAtNode(vexContent.get(0)); | |
} | |
}); | |
}, | |
getInitialState: function(){ | |
console.log('header - getInitialState '); | |
return { | |
ose:null, | |
oseList:null, | |
returnStatus:[], | |
qtdServicos: 0 | |
}; | |
}, | |
//retorno de sucesso do Helpers | |
success: function (result) { | |
//console.log('++++++ OSE carregada !!! ++++' , result.dataObject) | |
//console.log('++++++ servicos ose oseList !!! ++++' , result.dataObject.oseList) | |
if(this.isMounted()){ | |
this.setState({ | |
ose: result.dataObject, | |
oseList: result.dataObject.oseList, | |
resultStatus: result.resultStatus | |
}); | |
//console.log('++++++ servicos ose oseList !!! ++++' , this.state.ose.oseList.length); | |
} | |
}, | |
limparTela: function(){ | |
}, | |
//retorno de erro do Helpers | |
error: function (xhr, textStatus, errorThrown) { | |
vex.dialog.alert(xhr.returnStatus.description); | |
// só pra teste, apagar depois e deixar o alerta | |
Helpers.ShowMessageError(xhr.returnStatus.message); | |
}, | |
componentDidMount: function() { | |
Helpers.Get('/Cliente//951009/OSE/Situacao/201', this.success, this.error); | |
}, | |
render: function() { | |
//console.log('this.state.ose' , this.state.ose); | |
if(this.state.ose === null || this.state.oseList === null || this.state.oseList[0].length === 0 ){ | |
//console.log('this.state.ose.oseList.length === 0' , this.state.ose ); | |
return <div /> | |
} | |
return ( | |
<NavContent className='pull-right' {...this.props}> | |
<Nav className='hidden-xs'> | |
<NavItem className='hidden-sm'> | |
<a href='#' onClick={this.handleSkinSwitch}> | |
<Icon glyph='icon-fontello-circle' className='fg-theme' style={{lineHeight: 1, fontSize: 24 }} /> | |
</a> | |
</NavItem> | |
<NavItem dropdown toggleOnHover className='collapse-left'> | |
<DropdownButton nav> | |
<Icon bundle='fontello' glyph='basket-alt' /> | |
<Badge className='fg-black bg-red notification-badge'>0</Badge> | |
</DropdownButton> | |
<MenuServicos servicosCarrinho={this.state.ose.oseList[0].OSEItens}/> | |
</NavItem> | |
</Nav> | |
<Nav> | |
<NavItem className='logout' href='#' > | |
<Icon bundle='fontello' glyph='off-1' /> | |
</NavItem> | |
</Nav> | |
</NavContent> | |
); | |
} | |
}); | |
export default class Header extends React.Component { | |
render() { | |
return ( | |
<Grid id='navbar' {...this.props}> | |
<Row> | |
<Col xs={12}> | |
<NavBar fixedTop id='rubix-nav-header'> | |
<Container fluid> | |
<Row> | |
<Col xs={3} visible='xs'> | |
<SidebarBtn /> | |
</Col> | |
<Col xs={6} sm={4}> | |
<Brand /> | |
</Col> | |
<Col xs={3} sm={8}> | |
<HeaderNavigation pressed={this.props.pressed} /> | |
</Col> | |
</Row> | |
</Container> | |
</NavBar> | |
</Col> | |
</Row> | |
</Grid> | |
); | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html class='default' dir='{dir}'> | |
<head> | |
<meta charset='UTF-8'> | |
<meta http-equiv='X-UA-Compatible' content='IE=Edge,chrome=1' /> | |
<title>Pixma: administração web </title> | |
<meta name='author' content='Quasares tecnologia, quasares@quasares.com.br'> | |
<meta name='description' content='Pixma administração'> | |
<meta name='keywords' content='Pintura, parece, muro, metro, metro quadrado, apartamento, casa'> | |
<meta name='robots' content='index, follow'> | |
<meta name='viewport' content='width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no'> | |
<link rel='apple-touch-icon' sizes='57x57' href='/favicons/apple-touch-icon-57x57.png'> | |
<link rel='apple-touch-icon' sizes='114x114' href='/favicons/apple-touch-icon-114x114.png'> | |
<link rel='apple-touch-icon' sizes='72x72' href='/favicons/apple-touch-icon-72x72.png'> | |
<link rel='apple-touch-icon' sizes='144x144' href='/favicons/apple-touch-icon-144x144.png'> | |
<link rel='apple-touch-icon' sizes='60x60' href='/favicons/apple-touch-icon-60x60.png'> | |
<link rel='apple-touch-icon' sizes='120x120' href='/favicons/apple-touch-icon-120x120.png'> | |
<link rel='apple-touch-icon' sizes='76x76' href='/favicons/apple-touch-icon-76x76.png'> | |
<link rel='apple-touch-icon' sizes='152x152' href='/favicons/apple-touch-icon-152x152.png'> | |
<meta name='apple-mobile-web-app-title' content='Pixma'> | |
<link rel='icon' type='image/png' href='/favicons/favicon-196x196.png' sizes='196x196'> | |
<link rel='icon' type='image/png' href='/favicons/favicon-160x160.png' sizes='160x160'> | |
<link rel='icon' type='image/png' href='/favicons/favicon-96x96.png' sizes='96x96'> | |
<link rel='icon' type='image/png' href='/favicons/favicon-16x16.png' sizes='16x16'> | |
<link rel='icon' type='image/png' href='/favicons/favicon-32x32.png' sizes='32x32'> | |
<meta name='msapplication-TileColor' content='#E76049'> | |
<meta name='msapplication-TileImage' content='/mstile-144x144.png'> | |
<meta name='application-name' content='Pixma'> | |
<link media='screen' rel='stylesheet' type='text/css' href='/css/vendor/pace/pace.css' /> | |
<link media='screen' rel='stylesheet' type='text/css' href='/css/vendor/perfect-scrollbar/perfect-scrollbar.css'> | |
<link media='screen' rel='stylesheet' type='text/css' href='/css/vendor/morris/morris.css'> | |
<link media='screen' rel='stylesheet' type='text/css' href='/bower_components/codemirror/lib/codemirror.css'> | |
<link media='screen' rel='stylesheet' type='text/css' href='/bower_components/codemirror/theme/ambiance.css'> | |
<style> | |
.modal-backdrop.in { | |
opacity: 0.5; | |
position: fixed; | |
top: 0; left: 0; | |
right: 0; bottom: 0; | |
} | |
</style> | |
{stylesheets} <link media='screen' rel='stylesheet' type='text/css' href='/css/fonts/{app}/fonts.css'> | |
</head> | |
<body class='fade-out' data-version='{version}'> | |
<div id='pace-loader' class='pace-big'></div> | |
<div id='app-preloader'></div> | |
<div id='app-container'>{container}</div> | |
<div id='blueimp-gallery' class='blueimp-gallery blueimp-gallery-controls'> | |
<div class='slides'></div> | |
<h3 class='title'></h3> | |
<p class="description"></p> | |
<a class='prev'>‹</a> | |
<a class='next'>›</a> | |
<a class='close'>×</a> | |
<a class='play-pause'></a> | |
<ol class='indicator'></ol> | |
</div> | |
<script type='text/javascript' src='/js/common/pace/pace.js'></script> | |
<script type='text/javascript' src='/js/common/uuid/uuid.js'></script> | |
<!--incluido após versão 3.2--> | |
<script type='text/javascript' src='/bower_components/react/react.js'></script> | |
<script type='text/javascript' src='/bower_components/react/react-dom.js'></script> | |
<script type='text/javascript' src='/bower_components/modernizr/modernizr.js'></script> | |
<script type='text/javascript' src='/bower_components/codemirror/lib/codemirror.js'></script> | |
<script type='text/javascript' src='/bower_components/codemirror/mode/javascript/javascript.js'></script> | |
<script type='text/javascript' src='/bower_components/jquery/dist/jquery.js'></script> | |
<script type='text/javascript' src='/bower_components/jquery-ui/jquery-ui.min.js'></script> | |
<script type='text/javascript' src='/bower_components/moment/moment.js'></script> | |
<script type='text/javascript' src='/bower_components/eventemitter2/lib/eventemitter2.js'></script> | |
<script type='text/javascript' src='/bower_components/vex/js/vex.combined.min.js'></script> | |
<script type='text/javascript' src='/bower_components/chartjs/Chart.js'></script> | |
<script type='text/javascript' src='/bower_components/trumbowyg/dist/trumbowyg.js'></script> | |
<script type='text/javascript' src='/bower_components/blueimp-gallery/js/blueimp-gallery.js'></script> | |
<script type='text/javascript' src='/js/vendor/p-scrollbar/min/perfect-scrollbar.min.js'></script> | |
<script type='text/javascript' src='/bower_components/react/react-with-addons.js'></script> | |
<script type='text/javascript' src='/js/vendor/datatables/datatables.js'></script> | |
<script type='text/javascript' src='/js/common/react-l20n/react-l20n.js'></script> | |
<script type='text/javascript' src='/js/common/rubix-bootstrap/rubix-bootstrap.js'></script> | |
<!--<script type="text/javascript" src="//maps.google.com/maps/api/js?sensor=true"></script> | |
<script type='text/javascript' src='/js/vendor/gmaps/gmaps.js'></script> | |
--> | |
<script type='text/javascript' src='/js/vendor/bootstrap/bootstrap.js'></script> | |
<script type='text/javascript' src='/js/vendor/bootstrap-slider/bootstrap-slider.js'></script> | |
<script type='text/javascript' src='/js/vendor/bootstrap-datetimepicker/bootstrap-datetimepicker.js'></script> | |
<!--<script type='text/javascript' src='/js/vendor/bootstrap-datetimepicker/bootstrap-datetimepicker.pt-BR.js'></script>--> | |
<script type='text/javascript' src='/js/vendor/ion.tabs/ion.tabs.min.js'></script> | |
<script type='text/javascript' src='/js/vendor/ion.rangeSlider/ion.rangeSlider.min.js'></script> | |
<script type='text/javascript' src='/js/vendor/d3/d3.js'></script> | |
<script type='text/javascript' src='/js/vendor/jquery.knob/jquery.knob.js'></script> | |
<script type='text/javascript' src='/js/vendor/leaflet/leaflet.js'></script> | |
<script type='text/javascript' src='/js/vendor/sparklines/sparklines.js'></script> | |
<script type='text/javascript' src='/js/vendor/switchery/switchery.js'></script> | |
<script type='text/javascript' src='/js/vendor/raphael/raphael.js'></script> | |
<script type='text/javascript' src='/js/vendor/messenger/messenger.min.js'></script> | |
<script type='text/javascript' src='/js/vendor/select2/select2.js'></script> | |
<script type='text/javascript' src='/js/vendor/xeditable/xeditable.js'></script> | |
<script type='text/javascript' src='/js/vendor/typeahead/typeahead.js'></script> | |
<script type='text/javascript' src='/js/vendor/jquery-steps/jquery-steps.js'></script> | |
<script type='text/javascript' src='/js/vendor/jquery-validate/jquery-validate.js'></script> | |
<script type='text/javascript' src='/js/vendor/jquery-maskedinput/jquery.maskedinput.min.js'></script> | |
<script type='text/javascript' src='/js/vendor/tablesaw/tablesaw.js'></script> | |
<script type='text/javascript' src='/js/vendor/fullcalendar/fullcalendar.js'></script> | |
<script type='text/javascript' src='/js/vendor/nestable/nestable.js'></script> | |
<script type='text/javascript' src='/js/vendor/dropzone/dropzone.js'></script> | |
<script type='text/javascript' src='/js/vendor/jcrop/color.js'></script> | |
<script type='text/javascript' src='/js/vendor/jcrop/jcrop.js'></script> | |
<script type='text/javascript' src='/js/vendor/prism/prism.js'></script> | |
<script type='text/javascript' src='/js/vendor/morris/morris.js'></script> | |
<script type='text/javascript' src='/js/vendor/timeline/timeline.js'></script> | |
<script type='text/javascript' src='/js/vendor/holder/holder.js'></script> | |
<script type='text/javascript' src='/bower_components/c3/c3.js'></script> | |
<script type='text/javascript' src='/js/common/rubix/rubix.js'></script> | |
<script type='text/javascript' src='/js/common/globals.js'></script> | |
<script type='text/javascript' src='{appscript}'></script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment