[CORD-1653] Adding a debug tab in model details
Change-Id: I6c3be4227309cbeb2dd7ab6252c1312dfd00fb18
diff --git a/src/app/views/crud/crud.html b/src/app/views/crud/crud.html
index b650520..adeaaa4 100644
--- a/src/app/views/crud/crud.html
+++ b/src/app/views/crud/crud.html
@@ -48,6 +48,11 @@
<xos-form ng-model="vm.model" config="vm.formCfg"></xos-form>
</div>
</uib-tab>
+ <uib-tab ng-if="vm.debugTab" heading="Debug">
+ <div class="panel-body">
+ <xos-debug-model ng-model="vm.model"></xos-debug-model>
+ </div>
+ </uib-tab>
<uib-tab ng-if="vm.getRelatedItemId(r, vm.model)" ng-repeat="r in vm.related.manytoone" heading="{{r.model}} {{vm.getHumanReadableOnField(r)}}">
<div class="panel-body">
<xos-form ng-model="vm.relatedModels.manytoone[r.model][r.on_field].model" config="vm.relatedModels.manytoone[r.model][r.on_field].formConfig"></xos-form>
diff --git a/src/app/views/crud/crud.ts b/src/app/views/crud/crud.ts
index 9599823..325790f 100644
--- a/src/app/views/crud/crud.ts
+++ b/src/app/views/crud/crud.ts
@@ -25,6 +25,8 @@
import {IXosModelDiscovererService} from '../../datasources/helpers/model-discoverer.service';
import './crud.scss';
import {IXosCrudRelationService} from './crud.relations.service';
+import {IXosDebugService, IXosDebugStatus} from '../../core/debug/debug.service';
+import {IXosKeyboardShortcutService} from '../../core/services/keyboard-shortcut';
export interface IXosModelRelation {
model: string;
@@ -43,7 +45,9 @@
'ModelRest',
'StoreHelpers',
'XosModelDiscoverer',
- 'XosCrudRelation'
+ 'XosCrudRelation',
+ 'XosDebug',
+ 'XosKeyboardShortcut'
];
// bindings
@@ -64,6 +68,7 @@
manytoone: {},
onetomany: {}
};
+ public debugTab: boolean;
constructor(
private $scope: angular.IScope,
@@ -75,7 +80,9 @@
private ModelRest: IXosResourceService,
private StoreHelpers: IStoreHelpersService,
private XosModelDiscovererService: IXosModelDiscovererService,
- private XosCrudRelation: IXosCrudRelationService
+ private XosCrudRelation: IXosCrudRelationService,
+ private XosDebug: IXosDebugService,
+ private XosKeyboardShortcut: IXosKeyboardShortcutService
) {
this.$log.info('[XosCrud] Setup', $state.current.data);
@@ -88,10 +95,15 @@
// TODO get the proper URL from model discoverer
this.baseUrl = '#/' + this.model.clientUrl.replace(':id?', '');
-
this.tableCfg = this.model.tableCfg;
this.formCfg = this.model.formCfg;
+ this.debugTab = this.XosDebug.status.modelsTab;
+ this.$scope.$on('xos.debug.status', (e, status: IXosDebugStatus) => {
+ this.debugTab = status.modelsTab;
+ this.$scope.$apply();
+ });
+
this.store.query(this.data.model)
.subscribe(
(event) => {
@@ -122,9 +134,76 @@
const resource = this.ModelRest.getResource(endpoint);
this.model = new resource({});
}
+
+ this.XosKeyboardShortcut.registerKeyBinding({
+ key: 'A',
+ cb: () => this.XosDebug.toggleDebug('modelsTab'),
+ description: 'Toggle Debug tab in model details view'
+ }, 'view');
+
+ this.XosKeyboardShortcut.registerKeyBinding({
+ key: 'delete',
+ cb: () => {
+ this.$state.go(this.$state.current.name, {id: null});
+ },
+ description: 'Go back to the list view'
+ }, 'view');
+ }
+ // list page
+ else {
+ this.tableCfg.selectedRow = -1;
+
+ this.XosKeyboardShortcut.registerKeyBinding({
+ key: 'Tab',
+ cb: () => this.iterateItems(),
+ description: 'Iterate trough items in the list'
+ }, 'view');
+
+ this.XosKeyboardShortcut.registerKeyBinding({
+ key: 'Enter',
+ cb: () => {
+ if (this.tableCfg.selectedRow < 0) {
+ return;
+ }
+ this.$state.go(this.$state.current.name, {id: this.tableCfg.filteredData[this.tableCfg.selectedRow].id});
+ },
+ description: 'View details of selected item'
+ }, 'view');
+
+ this.XosKeyboardShortcut.registerKeyBinding({
+ key: 'Delete',
+ cb: () => {
+ if (this.tableCfg.selectedRow < 0) {
+ return;
+ }
+ const deleteFn = _.find(this.tableCfg.actions, {label: 'delete'});
+ deleteFn.cb(this.tableCfg.filteredData[this.tableCfg.selectedRow]);
+ },
+ description: 'View details of selected item'
+ }, 'view');
+
+ // FIXME XosKeyboardShortcut modifiers does not look to work
+ // this.XosKeyboardShortcut.registerKeyBinding({
+ // key: 'Tab',
+ // modifiers: ['alt'],
+ // cb: () => {
+ // this.tableCfg.selectedRow = -1;
+ // },
+ // description: 'Clear selected item'
+ // }, 'view');
}
}
+ public iterateItems() {
+ const rowCount = this.tableCfg.filteredData.length > this.tableCfg.pagination.pageSize ? this.tableCfg.pagination.pageSize : this.tableCfg.filteredData.length;
+ if ((this.tableCfg.selectedRow + 1) < rowCount) {
+ this.tableCfg.selectedRow++;
+ }
+ else {
+ this.tableCfg.selectedRow = 0;
+ }
+ this.$scope.$apply();
+ }
public getRelatedItemId(relation: IXosModelRelation, item: any): boolean {
return this.XosCrudRelation.existsRelatedItem(relation, item);