Browse Source

Merge branch 'master' of github.com:thingsboard/thingsboard

pull/2434/head
Igor Kulikov 7 years ago
parent
commit
01108b89a1
  1. 6
      ui/src/app/components/react/json-form-ace-editor.jsx
  2. 25
      ui/src/app/components/react/json-form-schema-form.jsx
  3. 3
      ui/src/app/components/react/json-form.scss
  4. 4
      ui/src/app/widget/lib/entities-table-widget.js
  5. 2
      ui/src/app/widget/lib/entities-table-widget.tpl.html

6
ui/src/app/components/react/json-form-ace-editor.jsx

@ -83,9 +83,9 @@ class ThingsboardAceEditor extends React.Component {
fixAceEditor(editor); fixAceEditor(editor);
} }
onToggleFull() { onToggleFull(groupId) {
this.setState({ isFull: !this.state.isFull }); this.setState({ isFull: !this.state.isFull });
this.props.onToggleFullscreen(); this.props.onToggleFullscreen(groupId);
this.updateAceEditorSize = true; this.updateAceEditorSize = true;
} }
@ -140,7 +140,7 @@ class ThingsboardAceEditor extends React.Component {
<div className="title-panel"> <div className="title-panel">
<label>{this.props.mode}</label> <label>{this.props.mode}</label>
<FlatButton style={ styles.tidyButtonStyle } className="tidy-button" label={'Tidy'} onTouchTap={this.onTidy}/> <FlatButton style={ styles.tidyButtonStyle } className="tidy-button" label={'Tidy'} onTouchTap={this.onTidy}/>
<FlatButton style={ styles.tidyButtonStyle } className="tidy-button" label={this.state.isFull ? 'Exit fullscreen' : 'Fullscreen'} onTouchTap={this.onToggleFull}/> <FlatButton style={ styles.tidyButtonStyle } className="tidy-button" label={this.state.isFull ? 'Exit fullscreen' : 'Fullscreen'} onTouchTap={() => this.onToggleFull(this.props.groupId)}/>
</div> </div>
<AceEditor mode={this.props.mode} <AceEditor mode={this.props.mode}
height={this.state.isFull ? "100%" : "150px"} height={this.state.isFull ? "100%" : "150px"}

25
ui/src/app/components/react/json-form-schema-form.jsx

@ -40,6 +40,9 @@ class ThingsboardSchemaForm extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = {
groupId: null,
};
this.mapper = { this.mapper = {
'number': ThingsboardNumber, 'number': ThingsboardNumber,
@ -71,7 +74,6 @@ class ThingsboardSchemaForm extends React.Component {
} }
onChange(key, val) { onChange(key, val) {
//console.log('SchemaForm.onChange', key, val);
this.props.onModelChange(key, val); this.props.onModelChange(key, val);
if (this.hasConditions) { if (this.hasConditions) {
this.forceUpdate(); this.forceUpdate();
@ -86,12 +88,15 @@ class ThingsboardSchemaForm extends React.Component {
this.props.onIconClick(event); this.props.onIconClick(event);
} }
onToggleFullscreen() { onToggleFullscreen(groupId) {
this.setState({
groupId: groupId
});
this.props.onToggleFullscreen(); this.props.onToggleFullscreen();
} }
builder(form, model, index, onChange, onColorClick, onIconClick, onToggleFullscreen, mapper) { builder(form, groupId, model, index, onChange, onColorClick, onIconClick, onToggleFullscreen, mapper) {
var type = form.type; var type = form.type;
let Field = this.mapper[type]; let Field = this.mapper[type];
if(!Field) { if(!Field) {
@ -104,21 +109,21 @@ class ThingsboardSchemaForm extends React.Component {
return null; return null;
} }
} }
return <Field model={model} form={form} key={index} onChange={onChange} onColorClick={onColorClick} onIconClick={onIconClick} onToggleFullscreen={onToggleFullscreen} mapper={mapper} builder={this.builder}/> return <Field model={model} groupId={groupId} form={form} key={index} onChange={onChange} onColorClick={onColorClick} onIconClick={onIconClick} onToggleFullscreen={onToggleFullscreen} mapper={mapper} builder={this.builder}/>
} }
createSchema(theForm) { createSchema(theForm, groupId) {
let merged = utils.merge(this.props.schema, theForm, this.props.ignore, this.props.option); let merged = utils.merge(this.props.schema, theForm, this.props.ignore, this.props.option);
let mapper = this.mapper; let mapper = this.mapper;
if(this.props.mapper) { if(this.props.mapper) {
mapper = _.merge(this.mapper, this.props.mapper); mapper = _.merge(this.mapper, this.props.mapper);
} }
let forms = merged.map(function(form, index) { let forms = merged.map(function(form, index) {
return this.builder(form, this.props.model, index, this.onChange, this.onColorClick, this.onIconClick, this.onToggleFullscreen, mapper); return this.builder(form, groupId, this.props.model, index, this.onChange, this.onColorClick, this.onIconClick, this.onToggleFullscreen, mapper);
}.bind(this)); }.bind(this));
let formClass = 'SchemaForm'; let formClass = 'SchemaForm';
if (this.props.isFullscreen) { if (this.props.isFullscreen && groupId === this.state.groupId) {
formClass += ' SchemaFormFullscreen'; formClass += ' SchemaFormFullscreen';
} }
@ -131,7 +136,7 @@ class ThingsboardSchemaForm extends React.Component {
if(this.props.groupInfoes&&this.props.groupInfoes.length>0){ if(this.props.groupInfoes&&this.props.groupInfoes.length>0){
let content=[]; let content=[];
for(let info of this.props.groupInfoes){ for(let info of this.props.groupInfoes){
let forms = this.createSchema(this.props.form[info.formIndex]); let forms = this.createSchema(this.props.form[info.formIndex], info.formIndex);
let item = <ThingsboardSchemaGroup key={content.length} forms={forms} info={info}></ThingsboardSchemaGroup>; let item = <ThingsboardSchemaGroup key={content.length} forms={forms} info={info}></ThingsboardSchemaGroup>;
content.push(item); content.push(item);
} }
@ -165,4 +170,4 @@ class ThingsboardSchemaGroup extends React.Component{
<div style={{padding: '20px'}} className={this.state.showGroup?"":"invisible"}>{this.props.forms}</div> <div style={{padding: '20px'}} className={this.state.showGroup?"":"invisible"}>{this.props.forms}</div>
</section>); </section>);
} }
} }

3
ui/src/app/components/react/json-form.scss

@ -24,12 +24,15 @@ $input-label-float-scale: .75 !default;
.tb-fullscreen { .tb-fullscreen {
[name="ReactSchemaForm"] { [name="ReactSchemaForm"] {
.SchemaForm { .SchemaForm {
display: none;
&.SchemaFormFullscreen { &.SchemaFormFullscreen {
position: absolute; position: absolute;
top: 0; top: 0;
right: 0; right: 0;
bottom: 0; bottom: 0;
left: 0; left: 0;
display: block;
> div:not(.fullscreen-form-field) { > div:not(.fullscreen-form-field) {
display: none !important; display: none !important;

4
ui/src/app/widget/lib/entities-table-widget.js

@ -196,9 +196,9 @@ function EntitiesTableWidgetController($element, $scope, $filter, $mdMedia, $mdP
if (vm.settings.defaultSortOrder && vm.settings.defaultSortOrder.length) { if (vm.settings.defaultSortOrder && vm.settings.defaultSortOrder.length) {
vm.defaultSortOrder = vm.settings.defaultSortOrder; vm.defaultSortOrder = vm.settings.defaultSortOrder;
if (vm.settings.defaultSortOrder.charAt(0) === "-") { if (vm.settings.defaultSortOrder.charAt(0) === "-") {
vm.defaultSortOrder = "-'" + vm.settings.defaultSortOrder.substring(1) + "'"; vm.defaultSortOrder = '-"' + utils.customTranslation(vm.settings.defaultSortOrder.substring(1), vm.settings.defaultSortOrder.substring(1)) + '"';
} else { } else {
vm.defaultSortOrder = "'" + vm.settings.defaultSortOrder + "'"; vm.defaultSortOrder = '"' + utils.customTranslation(vm.settings.defaultSortOrder, vm.settings.defaultSortOrder) + '"';
} }
} }

2
ui/src/app/widget/lib/entities-table-widget.tpl.html

@ -41,7 +41,7 @@
<table md-table> <table md-table>
<thead fix-head md-head md-order="vm.query.order" md-on-reorder="vm.onReorder"> <thead fix-head md-head md-order="vm.query.order" md-on-reorder="vm.onReorder">
<tr md-row> <tr md-row>
<th ng-if="column.display" md-column md-order-by="'{{ column.label }}'" ng-repeat="column in vm.columns"><span>{{ column.title }}</span></th> <th ng-if="column.display" md-column md-order-by='"{{column.label}}"' ng-repeat="column in vm.columns"><span>{{ column.title }}</span></th>
<th md-column class="tb-action-cell" layout="row" layout-align="end center"></th> <th md-column class="tb-action-cell" layout="row" layout-align="end center"></th>
</tr> </tr>
</thead> </thead>

Loading…
Cancel
Save