mirror of
https://github.com/ascribe/onion.git
synced 2024-12-22 17:33:14 +01:00
add real href to edition list
This commit is contained in:
parent
6da18e9a85
commit
4fd5cdcdb5
@ -31,4 +31,15 @@ export class TransitionModel {
|
|||||||
this.valueKey = valueKey;
|
this.valueKey = valueKey;
|
||||||
this.callback = callback;
|
this.callback = callback;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
toReactRouterLinkProps(queryValue) {
|
||||||
|
let props = {
|
||||||
|
to: this.to,
|
||||||
|
params: {}
|
||||||
|
};
|
||||||
|
|
||||||
|
props.params[this.queryKey] = queryValue;
|
||||||
|
|
||||||
|
return props;
|
||||||
|
}
|
||||||
}
|
}
|
@ -4,6 +4,8 @@ import Router from 'react-router';
|
|||||||
import { ColumnModel } from './models/table_models';
|
import { ColumnModel } from './models/table_models';
|
||||||
import TableColumnMixin from '../../mixins/table_column_mixin';
|
import TableColumnMixin from '../../mixins/table_column_mixin';
|
||||||
|
|
||||||
|
let Link = Router.Link;
|
||||||
|
|
||||||
let TableItemWrapper = React.createClass({
|
let TableItemWrapper = React.createClass({
|
||||||
mixins: [TableColumnMixin, Router.Navigation],
|
mixins: [TableColumnMixin, Router.Navigation],
|
||||||
propTypes: {
|
propTypes: {
|
||||||
@ -12,23 +14,6 @@ let TableItemWrapper = React.createClass({
|
|||||||
columnWidth: React.PropTypes.number.isRequired
|
columnWidth: React.PropTypes.number.isRequired
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
|
||||||
* If a transition is defined in columnContent, then we can use
|
|
||||||
* Router.Navigation.transitionTo to redirect the user
|
|
||||||
* programmatically
|
|
||||||
*/
|
|
||||||
transition(column) {
|
|
||||||
if(column.transition) {
|
|
||||||
let params = {};
|
|
||||||
params[column.transition.queryKey] = this.props.columnContent[column.transition.valueKey];
|
|
||||||
this.transitionTo(column.transition.to, params);
|
|
||||||
|
|
||||||
if(column.transition.callback) {
|
|
||||||
column.transition.callback();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
@ -39,17 +24,35 @@ let TableItemWrapper = React.createClass({
|
|||||||
|
|
||||||
let columnClass = this.calcColumnClasses(this.props.columnList, i, this.props.columnWidth);
|
let columnClass = this.calcColumnClasses(this.props.columnList, i, this.props.columnWidth);
|
||||||
|
|
||||||
let transition = this.transition.bind(this, column);
|
//
|
||||||
|
|
||||||
|
|
||||||
return (
|
if(!column.transition) {
|
||||||
<div
|
return (
|
||||||
className={columnClass + ' ascribe-table-item-column'}
|
<div
|
||||||
key={i}
|
className={columnClass + ' ascribe-table-item-column'}
|
||||||
onClick={transition}>
|
key={i}>
|
||||||
<TypeElement {...typeElementProps} />
|
<TypeElement {...typeElementProps} />
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
} else {
|
||||||
|
|
||||||
|
let linkProps = column.transition.toReactRouterLinkProps(this.props.columnContent[column.transition.valueKey]);
|
||||||
|
/**
|
||||||
|
* If a transition is defined in columnContent, then we can use
|
||||||
|
* Router.Navigation.transitionTo to redirect the user
|
||||||
|
* programmatically
|
||||||
|
*/
|
||||||
|
return (
|
||||||
|
<Link
|
||||||
|
className={columnClass + ' ascribe-table-item-column'}
|
||||||
|
key={i}
|
||||||
|
onClick={column.transition.callback}
|
||||||
|
{...linkProps}>
|
||||||
|
<TypeElement {...typeElementProps} />
|
||||||
|
</Link>
|
||||||
|
);
|
||||||
|
}
|
||||||
})}
|
})}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
@ -73,10 +73,6 @@
|
|||||||
font-family: 'Source Sans Pro';
|
font-family: 'Source Sans Pro';
|
||||||
font-size: .8em;
|
font-size: .8em;
|
||||||
height:3em;
|
height:3em;
|
||||||
|
|
||||||
&:not(:first-child) {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.ascribe-table-item-column > * {
|
.ascribe-table-item-column > * {
|
||||||
|
Loading…
Reference in New Issue
Block a user