UNPKG

com.phloxui

Version:

PhloxUI Ng2+ Framework

1,295 lines 142 kB
/** * @fileoverview added by tsickle * @suppress {checkTypes} checked by tsc */ import * as tslib_1 from "tslib"; import { Component, ElementRef, Input, EventEmitter, ViewChild } from '@angular/core'; import { AbstractDataEditorView } from './AbstractDataEditorView'; import { RecordViewModel, ShortcutModel } from '../model/models'; import { TypeResolveService } from '../../service/TypeResolveService.service'; import { DialogService } from '../../service/DialogService.service'; import { ParrotsEditorSettingFactory } from '../../service/ParrotsEditorSettingFactory.service'; import { FormView } from '../../component/editor/FormView.component'; import { DataUtils } from '../../share/utils/DataUtils'; import { ArrayUtils } from '../../share/utils/ArrayUtils'; import { JsonSchemaUtils } from '../../share/utils/JsonSchemaUtils'; import { Option } from '../../decorator/Option.decorator'; import { I18N } from '../../decorator/I18N.decorator'; import { PhloxTable } from "../table/PhloxTable.component"; import { StringDataView } from '../../component/dataview/StringDataView.component'; import { CheckBox } from '../../component/dataview/input/CheckBox.component'; import { EllipsisButton } from '../../component/EllipsisButton.component'; import { KeyboardShortcutService } from '../../service/KeyboardShortcutService.service'; import { MaterialIconLoader } from '../../theme/material/component/MaterialIconLoader.component'; var /** @type {?} */ TYPE_NAME = "phx-record-view"; var /** @type {?} */ FORM_VIEW = FormView.TYPE_NAME; var RecordView = /** @class */ (function (_super) { tslib_1.__extends(RecordView, _super); function RecordView(typeResolveServ, dialogService, editorSettingFactory, elementRef, kbService) { var _this = _super.call(this, editorSettingFactory, elementRef, kbService) || this; _this.DEFAULT_CHECKBOX_WIDTH = "40pt"; _this.DEFAULT_MORE_MENU_WIDTH = "40pt"; _this.tableData = []; _this.model = new RecordViewModel(null, "DEFAULT", []); _this.typeResolveServ = typeResolveServ; _this.editable = false; _this.dialogService = dialogService; _this.selectedAll = false; _this.tableOption = {}; _this.i18NResource = { header: { title: "RECORD_VIEW_TITLE", } }; return _this; } /** * @return {?} */ RecordView.prototype.ngOnInit = /** * @return {?} */ function () { var _this = this; _super.prototype.ngOnInit.call(this); this.applyI18N(this.i18NResource); if (this.editor != null && (typeof this.editor !== 'undefined')) { this.editor.addViewComponent(this); this.menuFactory = this.editor.getMenuModelFactory(); this.reloadTable(); if (this.showEvent !== null && (typeof this.showEvent !== 'undefined')) { this.showEvent.subscribe(function (event) { _this.reloadTable(); }); } var /** @type {?} */ createdEvent = this.editor.getDataCreateEvent(); if (createdEvent !== null && (typeof createdEvent !== 'undefined')) { createdEvent.subscribe(function (event) { var /** @type {?} */ data = null; if (event.detail !== null && typeof event.detail !== 'undefined') { if (event.detail.data !== null && typeof event.detail.data !== 'undefined') { data = event.detail.data; } } if (data !== null) { // do sthing } }); } var /** @type {?} */ updateEvent = this.editor.getDataUpdateEvent(); if (updateEvent !== null && (typeof updateEvent !== 'undefined')) { updateEvent.subscribe(function (event) { var /** @type {?} */ data = null; if (event.detail !== null && typeof event.detail !== 'undefined') { if (event.detail.data !== null && typeof event.detail.data !== 'undefined') { data = event.detail.data; } } if (data !== null) { _this.bodyTable.rerender(true); } }); } var /** @type {?} */ deleteEvent = this.editor.getDataDeleteEvent(); if (deleteEvent !== null && (typeof deleteEvent !== 'undefined')) { deleteEvent.subscribe(function (event) { var /** @type {?} */ data = null; if (event.detail !== null && typeof event.detail !== 'undefined') { if (event.detail.data !== null && typeof event.detail.data !== 'undefined') { data = event.detail.data; } } if (data !== null && typeof data !== 'undefined') { var /** @type {?} */ objIdField = _this.editor.getObjectIdField(); try { for (var data_1 = tslib_1.__values(data), data_1_1 = data_1.next(); !data_1_1.done; data_1_1 = data_1.next()) { var d = data_1_1.value; var /** @type {?} */ objId = DataUtils.getDataValue(objIdField, d); _this.removeDataByObjectId(objId); } } catch (e_1_1) { e_1 = { error: e_1_1 }; } finally { try { if (data_1_1 && !data_1_1.done && (_a = data_1.return)) _a.call(data_1); } finally { if (e_1) throw e_1.error; } } } _this.bodyTable.rerender(true); var e_1, _a; }); } var /** @type {?} */ revertEvent = this.editor.getDataRevertEvent(); if (revertEvent !== null && (typeof revertEvent !== 'undefined')) { revertEvent.subscribe(function (event) { var /** @type {?} */ data = null; if (event.detail !== null && typeof event.detail !== 'undefined') { if (event.detail.data !== null && typeof event.detail.data !== 'undefined') { data = event.detail.data; } } if (data !== null) { try { for (var data_2 = tslib_1.__values(data), data_2_1 = data_2.next(); !data_2_1.done; data_2_1 = data_2.next()) { var d = data_2_1.value; _this.replaceRecordRowData(d); } } catch (e_2_1) { e_2 = { error: e_2_1 }; } finally { try { if (data_2_1 && !data_2_1.done && (_a = data_2.return)) _a.call(data_2); } finally { if (e_2) throw e_2.error; } } } _this.bodyTable.rerender(true); var e_2, _a; }); } var /** @type {?} */ dataReloadEvent = this.editor.getDataReloadEvent(); if (dataReloadEvent !== null && (typeof dataReloadEvent !== 'undefined')) { dataReloadEvent.subscribe(function (event) { _this.reloadTable(); }); } } }; /** * @return {?} */ RecordView.prototype.ngOnDestroy = /** * @return {?} */ function () { _super.prototype.ngOnDestroy.call(this); if (this.editor !== null && (typeof this.editor !== 'undefined')) { this.editor.removeViewComponent(this); } }; /** * @param {?} model * @return {?} */ RecordView.prototype.generateTBHeaderObject = /** * @param {?} model * @return {?} */ function (model) { var /** @type {?} */ result = { "model": { "header": { "editable": true }, "body": {}, "columns": [] } }; if (model !== null && typeof model !== 'undefined') { var /** @type {?} */ hasFlexibleWidth = false; for (var /** @type {?} */ i = 0; i < model.columns.length; i++) { var /** @type {?} */ col = model.columns[i]; var /** @type {?} */ colWidth = col.width; // if colWidth is null or undefined set flag hasFlexibleWidth if (colWidth === null || typeof colWidth === 'undefined') { hasFlexibleWidth = true; } // in the end if FlexibleWidth was not found, set at least colWidth in to null if (i === model.columns.length - 1 && !hasFlexibleWidth) { colWidth = null; } var /** @type {?} */ hCol = { "name": col.label, "width": colWidth, "header": { "type": StringDataView.TYPE_NAME, "class": "center" } }; result.model.columns.push(hCol); } } // size > 0 add first and end col if (result.model.columns.length > 0) { var /** @type {?} */ chkBoxChanged = new EventEmitter(); chkBoxChanged.subscribe(function (event) { console.log("changeed"); }); var /** @type {?} */ chkBxCol = { "name": "", "width": this.DEFAULT_CHECKBOX_WIDTH, "header": { "type": CheckBox.TYPE_NAME, "class": "center", "options": { "valueChange": chkBoxChanged } }, "editable": true }; ArrayUtils.insert(result.model.columns, chkBxCol, 0); var /** @type {?} */ moreCol = { "name": "", "width": this.DEFAULT_MORE_MENU_WIDTH, "header": { "type": StringDataView.TYPE_NAME, "class": "center" } }; result.model.columns.push(moreCol); } return result; }; /** * @param {?} model * @return {?} */ RecordView.prototype.generateTBBodyObject = /** * @param {?} model * @return {?} */ function (model) { var _this = this; var /** @type {?} */ result = { "model": { "header": {}, "body": { "row": { "editable": true, } }, "columns": [] } }; if (model !== null && typeof model !== 'undefined') { var /** @type {?} */ hasFlexibleWidth = false; var _loop_1 = function (i) { var /** @type {?} */ col = model.columns[i]; var /** @type {?} */ colWidth = col.width; // if colWidth is null or undefined set flag hasFlexibleWidth if (colWidth === null || typeof colWidth === 'undefined') { hasFlexibleWidth = true; } // in the end if FlexibleWidth was not found, set at least colWidth in to null if (i === model.columns.length - 1 && !hasFlexibleWidth) { colWidth = null; } var /** @type {?} */ hCol = { "name": col.label, "width": colWidth, "editable": col.editable, "body": { "class": "center", "type": col.view, "options": col.options, "editorType": col.editor, "editorOptions": col.editorOptions } }; // overide options field if (hCol.body.options !== null && typeof hCol.body.options !== 'undefined') { hCol.body.options["field"] = "data." + col.value; } else { hCol.body.options = { "field": "data." + col.value }; } // overide editorOptions field if (hCol.body.editorOptions !== null && typeof hCol.body.editorOptions !== 'undefined') { hCol.body.editorOptions["field"] = "data." + col.value; } else { hCol.body.editorOptions = { "field": "data." + col.value }; } // overide/inject editor blur event var /** @type {?} */ editorBlurEmiter = new EventEmitter(); if (hCol.body.editorOptions["blur"] !== null && typeof hCol.body.editorOptions["blur"] !== 'undefined') { var /** @type {?} */ tempEmitter_1 = hCol.body.editorOptions["blur"]; editorBlurEmiter.subscribe(function (event) { var /** @type {?} */ itemCompo = event.detail.data.item; var /** @type {?} */ compoVal = undefined; if (typeof itemCompo.getData === 'function') { compoVal = itemCompo.getData(); } if (_this.isDataChange(compoVal)) { _this.makeHistory(); } _this.currentFocusValue = undefined; // pass event if (typeof tempEmitter_1["emit"] === 'function') { tempEmitter_1.emit(event); } }); hCol.body.editorOptions["blur"] = editorBlurEmiter; } else { editorBlurEmiter.subscribe(function (event) { var /** @type {?} */ itemCompo = event.detail.data.item; var /** @type {?} */ compoVal = undefined; if (typeof itemCompo.getData === 'function') { compoVal = itemCompo.getData(); } if (_this.isDataChange(compoVal)) { _this.makeHistory(); } _this.currentFocusValue = undefined; }); hCol.body.editorOptions["blur"] = editorBlurEmiter; } // focus save values var /** @type {?} */ editorFocusEmiter = new EventEmitter(); if (hCol.body.editorOptions["focus"] !== null && typeof hCol.body.editorOptions["focus"] !== 'undefined') { var /** @type {?} */ tempEmitter_2 = hCol.body.editorOptions["focus"]; editorFocusEmiter.subscribe(function (event) { //set defaultValue var /** @type {?} */ itemCompo = event.detail.data.item; var /** @type {?} */ compoVal = undefined; if (typeof itemCompo.getData === 'function') { compoVal = itemCompo.getData(); } // new val from json // new val from json _this.currentFocusValue = JSON.parse(JSON.stringify(compoVal)); // pass event if (typeof tempEmitter_2["emit"] === 'function') { tempEmitter_2.emit(event); } }); hCol.body.editorOptions["focus"] = editorFocusEmiter; } else { editorFocusEmiter.subscribe(function (event) { //set defaultValue var /** @type {?} */ itemCompo = event.detail.data.item; var /** @type {?} */ compoVal = undefined; if (typeof itemCompo.getData === 'function') { compoVal = itemCompo.getData(); } // new val from json // new val from json _this.currentFocusValue = JSON.parse(JSON.stringify(compoVal)); }); hCol.body.editorOptions["focus"] = editorFocusEmiter; } result.model.columns.push(hCol); }; for (var /** @type {?} */ i = 0; i < model.columns.length; i++) { _loop_1(i); } } // size > 0 add first and end col if (result.model.columns.length > 0) { var /** @type {?} */ chkBxCol = { "name": "", "width": this.DEFAULT_CHECKBOX_WIDTH, "body": { "type": CheckBox.TYPE_NAME, "class": "center", "options": { "field": "selected" } } }; ArrayUtils.insert(result.model.columns, chkBxCol, 0); var /** @type {?} */ moreCol = { "name": "", "width": this.DEFAULT_MORE_MENU_WIDTH, "body": { "type": EllipsisButton.TYPE_NAME, "class": "center", "options": { "menuFactory": this.menuFactory } } }; result.model.columns.push(moreCol); } return result; }; /** * @param {?} value * @return {?} */ RecordView.prototype.isDataChange = /** * @param {?} value * @return {?} */ function (value) { if (this.currentFocusValue === undefined && value === undefined) { return false; } else if (this.currentFocusValue === null && value === null) { return false; } else if (this.currentFocusValue === undefined && value === null) { return true; } else if (this.currentFocusValue === null && value === undefined) { return true; } if (typeof this.currentFocusValue === "object" && typeof value === 'object') { return JSON.stringify(this.currentFocusValue) !== JSON.stringify(value); } return this.currentFocusValue !== value; }; /** * @return {?} */ RecordView.prototype.getOriginalData = /** * @return {?} */ function () { if (this.editor != null) { return this.editor.getData(); } return []; }; /** * @param {?} dataObj * @return {?} */ RecordView.prototype.replaceRecordRowData = /** * @param {?} dataObj * @return {?} */ function (dataObj) { var /** @type {?} */ comparator = this.editor.getDataComparator(); var /** @type {?} */ index = -1; for (var /** @type {?} */ i = 0; i < this.tableData.length; i++) { var /** @type {?} */ row = this.tableData[i]; var /** @type {?} */ data = row.data; if (comparator !== null) { if (comparator.equals(dataObj, data)) { index = i; break; } } } if (index > -1) { var /** @type {?} */ cloneObj = JSON.parse(JSON.stringify(dataObj)); var /** @type {?} */ recRow = new RecordRow(false, cloneObj); this.tableData[index] = recRow; // clone object } }; /** * @param {?} key * @param {?} dataObj * @return {?} */ RecordView.prototype.getTableValue = /** * @param {?} key * @param {?} dataObj * @return {?} */ function (key, dataObj) { if (key == null || dataObj == null) { return null; } var /** @type {?} */ result = null; if (key.indexOf(".") > 0) { var /** @type {?} */ splitKeys = key.split("."); if (splitKeys.length > 0) { var /** @type {?} */ firstKey = splitKeys[0]; var /** @type {?} */ firstValue = dataObj[firstKey]; if (firstValue != null && typeof firstValue !== 'undefined') { if (typeof firstValue === 'object') { if (splitKeys.length > 1) { var /** @type {?} */ secondKey = key.substring(key.indexOf(".") + 1, key.length); return this.getTableValue(secondKey, firstValue); // recursive beware looping } } } } } else { result = dataObj[key]; } if (result != null && typeof result !== 'undefined') { return result; } return null; }; /** * @param {?} key * @param {?} dataObj * @param {?} value * @return {?} */ RecordView.prototype.editDataObjectValue = /** * @param {?} key * @param {?} dataObj * @param {?} value * @return {?} */ function (key, dataObj, value) { DataUtils.setDataValue(key, dataObj, value); }; /** * @param {?} view * @return {?} */ RecordView.prototype.getViewComponent = /** * @param {?} view * @return {?} */ function (view) { if (view == null) { return null; } if (this.typeResolveServ != null) { return this.typeResolveServ.resolveType(view); } return null; }; /** * @param {?} rowIdx * @param {?} colIdx * @param {?} data * @return {?} */ RecordView.prototype.getDirty = /** * @param {?} rowIdx * @param {?} colIdx * @param {?} data * @return {?} */ function (rowIdx, colIdx, data) { // compare with original data if (data == null) { return false; } var /** @type {?} */ column = null; if (colIdx < this.model.columns.length) { column = this.model.columns[colIdx]; } var /** @type {?} */ editorData = this.getOriginalData(); var /** @type {?} */ originalData = null; if (originalData < editorData.length) { originalData = editorData[rowIdx]; } if (column != null && originalData != null) { var /** @type {?} */ colOriData = this.getTableValue(column.value, originalData); var /** @type {?} */ colTBData = this.getTableValue(column.value, data); return (colOriData !== colTBData); } return false; }; /** * @param {?} colIdx * @return {?} */ RecordView.prototype.getColumnEditable = /** * @param {?} colIdx * @return {?} */ function (colIdx) { var /** @type {?} */ column = null; if (colIdx < this.model.columns.length) { column = this.model.columns[colIdx]; } if (column != null) { return column.editable; } return false; }; /** * @return {?} */ RecordView.prototype.closeAllEditor = /** * @return {?} */ function () { if (this.bodyTable !== null && typeof this.bodyTable !== 'undefined') { var /** @type {?} */ rowControllers = this.bodyTable.getRowControllers(); try { for (var rowControllers_1 = tslib_1.__values(rowControllers), rowControllers_1_1 = rowControllers_1.next(); !rowControllers_1_1.done; rowControllers_1_1 = rowControllers_1.next()) { var row = rowControllers_1_1.value; row.setEditing(false); } } catch (e_3_1) { e_3 = { error: e_3_1 }; } finally { try { if (rowControllers_1_1 && !rowControllers_1_1.done && (_a = rowControllers_1.return)) _a.call(rowControllers_1); } finally { if (e_3) throw e_3.error; } } } var e_3, _a; }; /** * @return {?} */ RecordView.prototype.getDirtyCreateData = /** * @return {?} */ function () { var /** @type {?} */ createObject = []; var /** @type {?} */ editorData = this.getOriginalData(); var /** @type {?} */ idx = 0; try { for (var editorData_1 = tslib_1.__values(editorData), editorData_1_1 = editorData_1.next(); !editorData_1_1.done; editorData_1_1 = editorData_1.next()) { var originalData = editorData_1_1.value; if (idx < this.tableData.length) { var /** @type {?} */ tbData = this.tableData[idx].data; // edit oridata var /** @type {?} */ colIdx = 0; try { for (var _a = tslib_1.__values(this.model.columns), _b = _a.next(); !_b.done; _b = _a.next()) { var col = _b.value; if (this.getDirty(idx, colIdx, tbData)) { createObject.push(tbData); break; } colIdx += 1; } } catch (e_4_1) { e_4 = { error: e_4_1 }; } finally { try { if (_b && !_b.done && (_c = _a.return)) _c.call(_a); } finally { if (e_4) throw e_4.error; } } } idx += 1; } } catch (e_5_1) { e_5 = { error: e_5_1 }; } finally { try { if (editorData_1_1 && !editorData_1_1.done && (_d = editorData_1.return)) _d.call(editorData_1); } finally { if (e_5) throw e_5.error; } } return createObject; var e_5, _d, e_4, _c; }; /** * @return {?} */ RecordView.prototype.reverseAllCellChanged = /** * @return {?} */ function () { this.tableData = []; var /** @type {?} */ editorData = this.getOriginalData(); var /** @type {?} */ rowIdx = 0; try { for (var editorData_2 = tslib_1.__values(editorData), editorData_2_1 = editorData_2.next(); !editorData_2_1.done; editorData_2_1 = editorData_2.next()) { var row = editorData_2_1.value; if (row == null || typeof row === 'undefined') { continue; } var /** @type {?} */ cloneObj = JSON.parse(JSON.stringify(row)); var /** @type {?} */ recRow = new RecordRow(false, cloneObj); this.tableData.push(recRow); // clone object var /** @type {?} */ colIdx = 0; try { for (var _a = tslib_1.__values(this.model.columns), _b = _a.next(); !_b.done; _b = _a.next()) { var col = _b.value; var /** @type {?} */ key = rowIdx + ':' + colIdx; colIdx += 1; } } catch (e_6_1) { e_6 = { error: e_6_1 }; } finally { try { if (_b && !_b.done && (_c = _a.return)) _c.call(_a); } finally { if (e_6) throw e_6.error; } } rowIdx += 1; } } catch (e_7_1) { e_7 = { error: e_7_1 }; } finally { try { if (editorData_2_1 && !editorData_2_1.done && (_d = editorData_2.return)) _d.call(editorData_2); } finally { if (e_7) throw e_7.error; } } var e_7, _d, e_6, _c; }; /** * @param {?} rowIdx * @param {?} colIdx * @return {?} */ RecordView.prototype.reverseCellChanged = /** * @param {?} rowIdx * @param {?} colIdx * @return {?} */ function (rowIdx, colIdx) { var /** @type {?} */ editorData = this.getOriginalData(); var /** @type {?} */ originalRowData = null; if (rowIdx < editorData.length) { originalRowData = editorData[rowIdx]; } var /** @type {?} */ columnData = null; if (colIdx < this.model.columns.length) { columnData = this.model.columns[colIdx]; } var /** @type {?} */ originalCellData = this.getTableValue(columnData.value, originalRowData); var /** @type {?} */ tbData = null; if (rowIdx < this.tableData.length) { tbData = this.tableData[rowIdx].data; } this.editDataObjectValue(columnData.value, tbData, originalCellData); }; /** * @param {?} id * @return {?} */ RecordView.prototype.removeDataByObjectId = /** * @param {?} id * @return {?} */ function (id) { if (id !== null && typeof id !== 'undefined') { var /** @type {?} */ objIdField = this.editor.getObjectIdField(); var /** @type {?} */ index = -1; var /** @type {?} */ count = 0; try { for (var _a = tslib_1.__values(this.tableData), _b = _a.next(); !_b.done; _b = _a.next()) { var tbData = _b.value; var /** @type {?} */ tbDataID = DataUtils.getDataValue(objIdField, tbData.data); if (id === tbDataID) { index = count; break; } count += 1; } } catch (e_8_1) { e_8 = { error: e_8_1 }; } finally { try { if (_b && !_b.done && (_c = _a.return)) _c.call(_a); } finally { if (e_8) throw e_8.error; } } if (index > -1) { this.tableData.splice(index, 1); return true; } } return false; var e_8, _c; }; /** * @param {?} selected * @return {?} */ RecordView.prototype.setAllCheckBox = /** * @param {?} selected * @return {?} */ function (selected) { this.selectedAll = selected; for (var /** @type {?} */ i = 0; i < this.tableData.length; i++) { var /** @type {?} */ row = this.tableData[i]; row.selected = selected; } }; /** * @return {?} */ RecordView.prototype.getAllTableData = /** * @return {?} */ function () { var /** @type {?} */ result = []; for (var /** @type {?} */ i = 0; i < this.tableData.length; i++) { var /** @type {?} */ item = this.tableData[i].data; result.push(item); } return result; }; /** * @return {?} */ RecordView.prototype.getTableSelectedData = /** * @return {?} */ function () { var /** @type {?} */ result = []; for (var /** @type {?} */ i = 0; i < this.tableData.length; i++) { var /** @type {?} */ item = this.tableData[i].data; var /** @type {?} */ selected = this.tableData[i].selected; if (selected) { result.push(item); } } return result; }; /** * @return {?} */ RecordView.prototype.onViewSettingLoaded = /** * @return {?} */ function () { this.reloadTable(); }; /** * @param {?} toggleEvent * @return {?} */ RecordView.prototype.onToggleChanged = /** * @param {?} toggleEvent * @return {?} */ function (toggleEvent) { if (toggleEvent.detail !== null && typeof toggleEvent.detail !== 'undefined') { if (toggleEvent.detail.data !== null && typeof toggleEvent.detail.data !== 'undefined') { this.editable = toggleEvent.detail.data.newValue; } } if (!this.editable) { this.closeAllEditor(); } }; /** * @param {?} $event * @return {?} */ RecordView.prototype.onSaveButtonClicked = /** * @param {?} $event * @return {?} */ function ($event) { var _this = this; if (this.dialogService != null) { var /** @type {?} */ dialogPromise = this.dialogService.showConfirmDialog('Confirm Saving', 'Do you want to Save all data ?', true); dialogPromise.then(function (result) { if (result == 1) { // save var /** @type {?} */ objs = _this.getAllTableData(); _this.editor.updateData(objs); } }); } }; /** * @param {?} $event * @return {?} */ RecordView.prototype.onUndoButtonClicked = /** * @param {?} $event * @return {?} */ function ($event) { var _this = this; if (!this.canUndo()) { return; } // delay to wait for lostFocus fire if (this.delayTimer !== null && typeof this.delayTimer !== 'undefined') { clearTimeout(this.delayTimer); this.delayTimer = null; } this.delayTimer = setTimeout(function () { _this.undo(); }, 1); }; /** * @param {?} $event * @return {?} */ RecordView.prototype.onRedoButtonClicked = /** * @param {?} $event * @return {?} */ function ($event) { var _this = this; if (!this.canRedo()) { return; } // delay to wait for lostFocus fire if (this.delayTimer !== null && typeof this.delayTimer !== 'undefined') { clearTimeout(this.delayTimer); this.delayTimer = null; } this.delayTimer = setTimeout(function () { _this.redo(); }, 1); }; /** * @param {?} $event * @return {?} */ RecordView.prototype.onCellDBLClicked = /** * @param {?} $event * @return {?} */ function ($event) { if (!this.editable) { return; } if ($event !== null && typeof $event !== 'undefined') { var /** @type {?} */ target = ($event.detail !== null && typeof $event.detail !== 'undefined') ? $event.detail.target : null; var /** @type {?} */ evData = ($event.detail !== null && typeof $event.detail !== 'undefined') ? $event.detail.data : null; if (evData !== null) { var /** @type {?} */ row = evData.rowIndex; var /** @type {?} */ col = evData.columnIndex; if (target !== null && typeof target !== 'undefined') { if (target.isCellEditing(col)) { var /** @type {?} */ nativeElement = this.bodyTable.getRowControllers()[row].getCellComponentInstanceAt(col).getElementRef().nativeElement; // blur all input before switch back $(nativeElement).find(":input").each(function (index, el) { $(el).blur(); }); target.setCellEditing(col, false); } else { target.setCellEditing(col, true); } } } } }; /** * @return {?} */ RecordView.prototype.getEditorDirtyData = /** * @return {?} */ function () { var _this = this; return new Promise(function (resolve, reject) { var /** @type {?} */ dirtyArray = _this.getDirtyCreateData(); resolve(dirtyArray); }); }; /** * @return {?} */ RecordView.prototype.getSelectedData = /** * @return {?} */ function () { var _this = this; return new Promise(function (resolve, reject) { var /** @type {?} */ selectedArray = _this.getTableSelectedData(); resolve(selectedArray); }); }; /** * @return {?} */ RecordView.prototype.hasDataDirty = /** * @return {?} */ function () { var /** @type {?} */ rowIdx = 0; try { for (var _a = tslib_1.__values(this.tableData), _b = _a.next(); !_b.done; _b = _a.next()) { var row = _b.value; var /** @type {?} */ colIdx = 0; try { for (var _c = tslib_1.__values(this.model.columns), _d = _c.next(); !_d.done; _d = _c.next()) { var col = _d.value; if (this.getDirty(rowIdx, colIdx, row.data)) { return true; } colIdx += 1; } } catch (e_9_1) { e_9 = { error: e_9_1 }; } finally { try { if (_d && !_d.done && (_e = _c.return)) _e.call(_c); } finally { if (e_9) throw e_9.error; } } rowIdx += 1; } } catch (e_10_1) { e_10 = { error: e_10_1 }; } finally { try { if (_b && !_b.done && (_f = _a.return)) _f.call(_a); } finally { if (e_10) throw e_10.error; } } return false; var e_10, _f, e_9, _e; }; /** * @return {?} */ RecordView.prototype.reloadTable = /** * @return {?} */ function () { // start and hide when data was loaded this.iconLoader.start(); var /** @type {?} */ setting = this.getViewSetting(); if (setting !== null && typeof setting !== 'undefined') { if (setting != null && ((typeof setting) !== 'undefined')) { this.model.fromJson(setting.value); } } if (this.editor.getDataSchema() != null) { var /** @type {?} */ dataSche = this.editor.getDataSchema(); var /** @type {?} */ jsonSchema = dataSche.jsonSchema; if (this.model.columns !== null && typeof this.model.columns !== 'undefined') { try { for (var _a = tslib_1.__values(this.model.columns), _b = _a.next(); !_b.done; _b = _a.next()) { var col = _b.value; // replace i18N if (col.value === null || col.value === "") { continue; } if (jsonSchema !== null && typeof jsonSchema !== 'undefined') { var /** @type {?} */ i18NKey = col.value + ".title"; var /** @type {?} */ val = JsonSchemaUtils.getPropertiesValue(i18NKey, jsonSchema); if (val !== null) { col.label = val; } } } } catch (e_11_1) { e_11 = { error: e_11_1 }; } finally { try { if (_b && !_b.done && (_c = _a.return)) _c.call(_a); } finally { if (e_11) throw e_11.error; } } } } if (this.editor.getData() != null) { var /** @type {?} */ editorData = this.getOriginalData(); this.tableData = []; var /** @type {?} */ rowIdx = 0; try { for (var editorData_3 = tslib_1.__values(editorData), editorData_3_1 = editorData_3.next(); !editorData_3_1.done; editorData_3_1 = editorData_3.next()) { var row = editorData_3_1.value; if (row === null || typeof row === 'undefined') { continue; } var /** @type {?} */ cloneObj = JSON.parse(JSON.stringify(row)); var /** @type {?} */ recRow = new RecordRow(false, cloneObj); this.tableData.push(recRow); // clone object var /** @type {?} */ colIdx = 0; try { for (var _d = tslib_1.__values(this.model.columns), _e = _d.next(); !_e.done; _e = _d.next()) { var col = _e.value; var /** @type {?} */ key = rowIdx + ':' + colIdx; colIdx += 1; } } catch (e_12_1) { e_12 = { error: e_12_1 }; } finally { try { if (_e && !_e.done && (_f = _d.return)) _f.call(_d); } finally { if (e_12) throw e_12.error; } } rowIdx += 1; } } catch (e_13_1) { e_13 = { error: e_13_1 }; } finally { try { if (editorData_3_1 && !editorData_3_1.done && (_g = editorData_3.return)) _g.call(editorData_3); } finally { if (e_13) throw e_13.error; } } } // table var /** @type {?} */ headerObj = this.generateTBHeaderObject(this.model); var /** @type {?} */ bodyObj = this.generateTBBodyObject(this.model); this.tableOption = { "headerTable": headerObj, "bodyTable": bodyObj }; this.setOptions(this.tableOption); this.bodyTable.setData(this.tableData); this.bodyTable.rerender(true); // end when data more than 0 //! fix bug if no data this will not stop if (this.tableData.length > 0) { this.iconLoader.stop(); } this.clearHistories(); this.makeFirstHistory(); var e_11, _c, e_13, _g, e_12, _f; }; /** * @return {?} */ RecordView.prototype.showTabBySelectedData = /** * @return {?} */ function () { var /** @type {?} */ formView = /** @type {?} */ (this.editor.getViewComponentFromType(FORM_VIEW)); if (formView !== null && typeof formView !== 'undefined') { // if create tab set to las var /** @type {?} */ data = this.getTableSelectedData(); formView.showTabByData(data); } }; /** * @return {?} */ RecordView.prototype.getCurrentHistoryState = /** * @return {?} */ function () { return this.tableData; }; /** * @param {?} history * @param {?} state * @return {?} */ RecordView.prototype.loadHistoryState = /** * @param {?} history * @param {?} state * @return {?} */ function (history, state) { var _this = this; if (history === null || typeof history === 'undefined') { return Promise.reject(new Error('The "history" cannot be "null" or "undefined".')); } return new Promise(function (resolve, reject) { try { _this.tableData = state; _this.bodyTable.setData(_this.tableData); _this.bodyTable.rerender(true); resolve(); } catch (/** @type {?} */ e) { reject(e); } }); }; /** * @param {?} $event * @return {?} */ RecordView.prototype.onCheckAllClicked = /** * @param {?} $event * @return {?} */ function ($event) { this.setAllCheckBox(!this.selectedAll); }; /** * @return {?} */ RecordView.prototype.selfSaveData = /** * @return {?} */ function () { }; /** * @return {?} */ RecordView.prototype.selfResetData = /** * @return {?} */ function () { }; /** * @return {?} */ RecordView.prototype.doPreload = /** * @return {?} */ function () { return new Promise(function (resolve, reject) { resolve(null); }); }; /** * @return {?} */ RecordView.prototype.doLoaded = /** * @return {?} */ function () { }; /** * @return {?} */ RecordView.prototype.isSelfDataDirty = /** * @return {?} */ function () { return false; }; /** * @return {?} */ RecordView.prototype.isEditable = /** * @return {?} */ function () { return this.editable; }; /** * @return {?} */ RecordView.prototype.getHeaderTitle = /** * @return {?} */ function () { if ((this.model !== null && this.model !== undefined) && (this.model.label !== null && this.model.label !== undefined)) { return this.model.label; } return this.headerTitle; }; /** * @return {?} */ RecordView.prototype.getRecordViewModel = /** * @return {?} */ function () { return this.model; }; /** * @return {?} */ RecordView.prototype.getDefaultShortcutNameHandlers = /** * @return {?} */ function () { var _this = this; var /** @type {?} */ defVal = []; defVal.push(new ShortcutModel("undo", function () { _this.onUndoButtonClicked(null); console.log("undo"); }, null, ".redo-container > .left-hint-shortcut")); defVal.push(new ShortcutModel("redo", function () { _this.onRedoButtonClicked(null); console.log("redo"); }, null, ".redo-container > .right-hint-shortcut")); return defVal; }; /** * @return {?} */ RecordView.prototype.getDefaultShortcutKeyHandlers = /** * @return {?} */ function () { var /** @type {?} */ defVal = []; defVal.push(new ShortcutModel("shift+a", function () { console.log("shift+a"); }, "ShftA", this.headerTable)); defVal.push(new ShortcutModel("alt+a", function () { console.log("alt+a"); }, null, this.headerTable)); // defVal.push(new ShortcutModel("ctrl+z", ()=>{ console.log("ctrl+z overide");})); return defVal; }; /** * @return {?} */ RecordView.prototype.reloadView = /** * @return {?} */ function () { this.reloadTable(); }; RecordView.TYPE_NAME = TYPE_NAME; RecordView.decorators = [ { type: Component, args: [{ moduleId: module.id, selector: TYPE_NAME, template: "<div class=\"phx-record-view\" [class.hide]=\"!isActive()\">\n\t\t<div class=\"header-wrapper\">\n\t\t\t\t<div class=\"header\">\n\t\t\t\t\t<div class=\"left\">\n\t\t\t\t\t\t<div class=\"wrapper\">\n\t\t\t\t\t\t\t<div class=\"switch-container\">\n\t\t\t\t\t\t\t\t<phx-switch (phxChange)=\"onToggleChanged($event)\" [data]=\"isEditable()\"></phx-switch>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"title-container\">\n\t\t\t\t\t\t\t\t<div class=\"title\">{{getHeaderTitle()}}</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class=\"right\">\n\t\t\t\t\t\t<div class=\"wrapper\">\n\t\t\t\t\t\t\t<div class=\"sorting-container\">\n\t\t\t\t\t\t\t\t\t<div class=\"wrapper\">\n\t\t\t\t\t\t\t\t\t\t<div class=\"icon\">J</div> <div class=\"icon\">v</div> <div class=\"title\">TOP</div>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"save-container\" (click)=\"onSaveButtonClicked($event)\">\n\t\t\t\t\t\t\t\t\t<div class=\"wrapper\">\n\t\t\t\t\t\t\t\t\t\t<div class=\"icon\">F</div> <div class=\"title\">SAVE</div>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"redo-container\">\n\t\t\t\t\t\t\t\t\t<div class=\"left\" (click)=\"onUndoButtonClicked($event)\">\n\t\t\t\t\t\t\t\t\t\t<div class=\"wrapper\">\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"icon\" [class.disable]=\"!canUndo()\">H</div>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<div class=\"left-hint-shortcut\"></div>\n\t\t\t\t\t\t\t\t\t<div class=\"right\" (click)=\"onRedoButtonClicked($event)\">\n\t\t\t\t\t\t\t\t\t\t<div class=\"wrapper\">\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"icon\" [class.disable]=\"!canRedo()\">I</div>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<div class=\"right-hint-shortcut\"></div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"create-container\">\n\t\t\t\t\t\t\t\t<div class=\"wrapper\">\n\t\t\t\t\t\t\t\t\t<div class=\"icon\">a</div> <div class=\"title\">CREATE</div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t</div>\n\t\t<div class=\"body-wrapper\">\n\t\t\t<div class=\"body\">\n\t\t\t\t<div class=\"load-container\" [hidden]=\"getRecordViewModel().columns.length > 0\">\n\t\t\t\t\t<div class=\"table-wrapper fluid\">\n\t\