summaryrefslogtreecommitdiffstats
path: root/src/app/byoq/CustomDsl.jsx
diff options
context:
space:
mode:
authorwr148d <wr148d@att.com>2021-01-15 15:32:00 -0500
committerwr148d <wr148d@att.com>2021-02-11 09:47:17 -0500
commit5ee7367a101143715c2869d72ea4a6fbf55f5af6 (patch)
tree84bf43601c0cce4fb37b5b3b494e113c96d5591e /src/app/byoq/CustomDsl.jsx
parentddc05d4ea0254b427fea6ec80e2b03950eeca4ce (diff)
Updated Sparky to add ECOMP functionality Browse, Specialized Search, BYOQ, and the Builder FE Updates
Issue-ID: AAI-3250 Change-Id: I576e37f77f7e9b40d72e4a5e7de645e9f62bc7d2 Signed-off-by: wr148d <wr148d@att.com>
Diffstat (limited to 'src/app/byoq/CustomDsl.jsx')
-rw-r--r--src/app/byoq/CustomDsl.jsx4710
1 files changed, 4710 insertions, 0 deletions
diff --git a/src/app/byoq/CustomDsl.jsx b/src/app/byoq/CustomDsl.jsx
new file mode 100644
index 0000000..61650ba
--- /dev/null
+++ b/src/app/byoq/CustomDsl.jsx
@@ -0,0 +1,4710 @@
+/*
+ * ============LICENSE_START=======================================================
+ * org.onap.aai
+ * ================================================================================
+ * Copyright © 2017-2021 AT&T Intellectual Property. All rights reserved.
+ * ================================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ============LICENSE_END=========================================================
+ */
+import React, {Component} from 'react';
+import PanelGroup from 'react-bootstrap/lib/PanelGroup';
+import Panel from 'react-bootstrap/lib/Panel';
+import Modal from 'react-bootstrap/lib/Modal';
+import Grid from 'react-bootstrap/lib/Grid';
+import Button from 'react-bootstrap/lib/Button';
+import ModelGallery from 'app/model/modelSearch/components/ModelGallery.jsx';
+import Autosuggest from 'react-autosuggest';
+import DatePicker from 'react-datepicker';
+import moment from "moment";
+import DslHints from 'app/assets/configuration/dsl_hints.json';
+import DslDetailedHelp from 'app/assets/configuration/dsl_detailedHelp.json';
+import {ExportExcel} from 'utils/ExportExcel.js';
+import commonApi from 'utils/CommonAPIService.js';
+import {GlobalExtConstants} from 'utils/GlobalExtConstants.js';
+import {GeneralCommonFunctions} from 'utils/GeneralCommonFunctions.js';
+import Spinner from 'utils/SpinnerContainer.jsx';
+import OutputToggle from 'generic-components/OutputToggle.jsx';
+import Pagination from 'react-js-pagination';
+import Col from 'react-bootstrap/lib/Col';
+import Row from 'react-bootstrap/lib/Row';
+import OverlayTrigger from 'react-bootstrap/lib/OverlayTrigger';
+import Tooltip from 'react-bootstrap/lib/Tooltip';
+import OutputVisualization, {Visualization} from 'generic-components/OutputVisualization.jsx';
+import ModelCard from 'app/model/modelSearch/components/ModelCard.jsx';
+import CustomDSLSaveLoad from 'app/byoq/CustomDSLSaveLoad.jsx';
+import FormGroup from 'react-bootstrap/lib/FormGroup';
+import FormControl from 'react-bootstrap/lib/FormControl';
+import ControlLabel from 'react-bootstrap/lib/ControlLabel';
+import InfoToggle from 'generic-components/InfoToggle.jsx';
+import Alert from 'react-bootstrap/lib/Alert';
+import Tabs from 'react-bootstrap/lib/Tabs';
+import Tab from 'react-bootstrap/lib/Tab';
+import BootstrapTable from 'react-bootstrap-table-next';
+import filterFactory, {textFilter,customFilter} from 'react-bootstrap-table2-filter';
+import FilterTypes from 'generic-components/filter/components/FilterTypes.jsx';
+import DownloadRangeModel from 'generic-components/DownloadRangeModel.jsx';
+import SelectFilter from 'generic-components/filter/components/SelectFilter.jsx';
+import Toggle from 'react-toggle';
+import "react-toggle/style.css";
+import BootstrapSwitchButton from 'bootstrap-switch-button-react';
+
+let PAGINATION_CONSTANT = GlobalExtConstants.PAGINATION_CONSTANT;
+let EDGERULES = GlobalExtConstants.EDGERULES;
+let OXM = GlobalExtConstants.OXM;
+let INVLIST = GlobalExtConstants.INVLIST;
+let generateExcels = ExportExcel.generateExcels;
+let DOWNLOAD_ALL = GlobalExtConstants.DOWNLOAD_ALL;
+let DOWNLOAD_TOOLTIP = GlobalExtConstants.DOWNLOAD_TOOLTIP;
+let filterTypeList = GlobalExtConstants.FILTER_TYPES;
+let TABULAR_FILTER_TYPE = GlobalExtConstants.TABULAR_FILTER_TYPE;
+let ENVIRONMENT = GlobalExtConstants.ENVIRONMENT;
+let EMAIL_EXT = GlobalExtConstants.EMAIL_EXT;
+let APERTURE_SERVICE = JSON.parse(sessionStorage.getItem(ENVIRONMENT + 'APERTURE_SERVICE'));
+let buildAttrList = ExportExcel.buildAttrList;
+
+let dslHints = null;
+let nodeTypes = [];
+let properties = null;
+let traverseRulesDsl = [];
+let inputValue = '';
+let testData = null;
+
+var settings = {
+ 'NODESERVER': INVLIST.NODESERVER,
+ 'PROXY': INVLIST.PROXY,
+ 'PREFIX': INVLIST.PREFIX,
+ 'VERSION': INVLIST.VERSION,
+ 'USESTUBS': INVLIST.useStubs,
+ 'APERTURE': INVLIST.APERTURE,
+ 'TABULAR': INVLIST.TABULAR,
+ 'TABULARVERSION': INVLIST.TABULARVERSION
+};
+class AttributeFilter extends Component {
+
+ constructor(props) {
+ super(props);
+ this.filter = this.filter.bind(this);
+ this.getValue = this.getValue.bind(this);
+ this.props = props;
+ this.state = {
+ filterText: '',
+ isPageChange: this.props.isPageChange,
+ columnValue : ''
+ };
+ }
+ getValue = () => {
+ return this.input.value;
+ }
+ setPlaceHolder = () => {
+ let filterText = '';
+ filterText = 'Enter ' + this.props.column.text;
+ return filterText;
+ }
+ filter = () => {
+ let txt=this.props.column.text;
+ let obj = {};
+ obj[txt] = this.getValue();
+ var columnFilter = this.props.columnFilter;
+ for(var i=0;i<columnFilter.length;i++){
+ if(columnFilter[i][txt] != undefined){
+ columnFilter[i][txt] = this.getValue();
+ this.props.handleOnFilter(columnFilter,this.getValue());
+ this.props.onFilter(this.getValue());
+ }
+ }
+ }
+ render() {
+ return (
+ <div>
+
+ <input
+ key="input"
+ ref={ node => this.input = node }
+ type="text"
+ placeholder={this.setPlaceHolder()}
+ onChange={this.filter}
+ />
+
+ </div>
+ )
+ }
+ }
+
+class CustomDsl extends Component {
+ nodeResults = '';
+ typeOfCall = true;
+ downloadTooltip = DOWNLOAD_TOOLTIP;
+ downloadAllTooltip = 'Downloads First ' + DOWNLOAD_ALL + ' Results';
+ downloadRangeTooltip= 'Download Results By Custom Range Selection';
+ downloadBulkTooltip= 'Download Results Of All Loaded Queries';
+ historyStackString = '';
+ dslObject={};
+ dslObjectList=[];
+ nodeTypeArray=[];
+ nodeTypeArrayList=[];
+ edgesArray=[];
+ relationsArray=[];
+ tempDslQuery='';
+ tempDslQueryList=[];
+ templateError=[];
+ templateErrorList={};
+ baseState='';
+ propertiesDsl = [];
+ tableFilterAliasColumns={};
+ constructor(props) {
+ console.log('CustomDsl:Constuctor props>>>>',props);
+ super(props);
+ APERTURE_SERVICE=JSON.parse(sessionStorage.getItem(ENVIRONMENT + 'APERTURE_SERVICE'));
+ console.log('APERTURE_SERVICE: ' + APERTURE_SERVICE);
+ TABULAR_FILTER_TYPE=(APERTURE_SERVICE && JSON.parse(sessionStorage.getItem(ENVIRONMENT + 'ENABLE_ANALYSIS')))?'CONTAINS':'=';
+ this.saveLoadComponent = React.createRef();
+ this.saveLoadComponentDsl = React.createRef();
+ this.state = {
+ nodeTypes: [],
+ hintHtml: {},
+ header: null,
+ multipleNodes: '',
+ isLoading: false,
+ nodes: [],
+ simpleQueries: [],
+ traversalQueries: [],
+ unionQueries: [],
+ negationQueries: [],
+ topologyQueries: [],
+ limitQueries: [],
+ advancedQueries: [],
+ showModal: false,
+ query: '',
+ value: '',
+ valuePreviousState: '',
+ suggestions: [],
+ edgeRules: [],
+ previousNodeTypeDsl: '',
+ selected: [],
+ nodeTypeDsl: '',
+ model: null,
+ showPagination: false,
+ showResults: false,
+ activePage: 1,
+ aggregateActivePage: 1,
+ totalResults: 0,
+ errorResults: false,
+ errorMessage: '',
+ noResults: true,
+ validInput: false,
+ isInitialLoad: true,
+ prevQuery : '',
+ showHistoryModal:false,
+ startDate: moment(),
+ res: null,
+ visualAddition: false,
+ nodeDisplay: '',
+ showNodeModal: false,
+ focusedNode: {},
+ historyType: 'dsl',
+ focusedNodeUri: 0,
+ viewName: localStorage.getItem(GlobalExtConstants.ENVIRONMENT + '_' + sessionStorage.getItem(GlobalExtConstants.ENVIRONMENT + 'userId') + '_viewPreference') || 'CardLayout',
+ focusedNodeType: '',
+ historyParams: '' ,
+ showModelOptions:false,
+ enableCalendar: true,
+ resetColumnFilters: true,
+ isPageNumberChange: false,
+ loadedQueries: [],
+ queryDescription: '',
+ queryName: '',
+ category:'',
+ saveSuccessfulMsg: false,
+ saveErrorMsg: false,
+ enableSaveBusyFeedback: false,
+ isAggregate: false,
+ isAggregatePreviousState: false,
+ isAggregateChecked: false,
+ isCommunitySharedPreviousState: false,
+ isCommunitySharedChecked: false,
+ associatedNodesEnabled: false,
+ associatedNodesEnabledPreviuosState: false,
+ aggregatePaths: [],
+ aggregatePathAttrs: [],
+ aggregateParentGroup: [],
+ aggregateObjects: [],
+ tabularAggregateColumns: [],
+ tabularAggregateData: [],
+ aggregateAttrList: [],
+ aggregateNodes: [],
+ allAggregateNodes: [],
+ allres: null,
+ allAggregatePaths: [],
+ allAggregatePathAttrs: [],
+ allAggregateObjects: [],
+ allAggregateParentGroup: [],
+ allTabularAggregateColumns: [],
+ allTabularAggregateData: [],
+ allAggregateAttrList: [],
+ reRender: false,
+ columnFilter: [],
+ filterTemplateEntries: [],
+ filterTemplateHeader: [],
+ filterTemplateError: false,
+ filterTemplateEntriesList:[],
+ filterTemplateHeaderList:[],
+ filterTemplateErrorList:[],
+ nodeTypeOfDslTemplateList:[],
+ valueList:[],
+ templateQueryList:[],
+ editModel: {},
+ showEditModal: false,
+ templateQuery: '',
+ isDSLFlow: props.viewName === 'BYOQ',
+ isSavedQueryFlow: props.viewName === 'Saved Queries',
+ filterTypeDisplay: {'default':'Filter Type'},
+ filterTypeDisplayList: [],
+ disableFilter: true,
+ totalPages: 0,
+ pageRange: 1,
+ showDownloadResultsModal: false,
+ errorDownloadResults:false,
+ downloadErrorMsg: '',
+ enableModelBusyFeedback:false,
+ downloadCount:DOWNLOAD_ALL,
+ addAndTemplateState:false,
+ nodeTypeOfDslTemplate:[],
+ filterDisplay:'Select Property',
+ queryId:'',
+ queryNameList: [],
+ queryDescriptionList: [],
+ categoryList: [],
+ isPublicCheckedList: [],
+ isCommunitySharedList: [],
+ queryIdList: [],
+ isAggregateCheckedList:[],
+ associatedNodesEnabledList: [],
+ associatedNodesEnabledPreviuosStateList: [],
+ enableTreeLoadBusyFeedback: false,
+ treeLoadErrMsg: null,
+ isDataSteward: sessionStorage.getItem(ENVIRONMENT + 'roles') && sessionStorage.getItem(ENVIRONMENT + 'roles').indexOf('data_steward_ui_view') > -1,
+ isPublicChecked: sessionStorage.getItem(ENVIRONMENT + 'roles') && sessionStorage.getItem(ENVIRONMENT + 'roles').indexOf('data_steward_ui_view') > -1,
+ defaultViewName: localStorage.getItem(GlobalExtConstants.ENVIRONMENT + '_' + sessionStorage.getItem(GlobalExtConstants.ENVIRONMENT + 'userId') + '_viewPreference') || 'CardLayout',
+ isTypeahead: true,
+ enableRealTime: JSON.parse(sessionStorage.getItem(ENVIRONMENT + 'ENABLE_ANALYSIS')),
+ downloadTemplateStatus:false,
+ failedDownloadedTemplate:[],
+ failedDownloadedTemplateMsg:'',
+ failedEmailTemplateMsg:'',
+ isMergedTabsChecked:false,
+ isGenerateEmailChecked: false,
+ emailTriggerMsg:'',
+ dslConfigArray: [],
+ staticTemplateFilters: [],
+ staticTemplateFiltersList: [],
+ tableAggregateAliasColumns:{}
+ }
+ }
+ componentWillMount = () => {
+ console.log('CustomDsl:componentWillMount',JSON.stringify(this.props));
+ if(!this.props.location.historyStackString){
+ this.props.location.historyStackString = this.props.location.pathname + ',,Origin||';
+ }else{
+ this.historyStackString = this.props.location.historyStackString;
+ }
+ dslHints = Object.values(DslHints);
+ this.setState( {hintHtml: dslHints});
+ this.processHelp( DslDetailedHelp );
+ console.log('how many nodes? ' + this.state.nodes.length);
+ this.processEdgeRules(EDGERULES);
+ nodeTypes = this.buildNodeList();
+ this.setState({
+ nodeTypes: nodeTypes},
+ function () {
+ console.log('nodeTypes: ' + this.state.nodeTypes.length) ;
+ this.baseState=this.state;
+ this.buildDynamicByoq('','','init');
+ }
+ );
+
+ }
+ buildDynamicByoq=(queryParam, makeCall, loadType)=> {
+ let query = '';
+ let shouldRun = makeCall;
+ if(queryParam){
+ query = queryParam;
+ }else if(this.props.match.params.type === 'built' || this.props.match.params.type === 'built-aggregate'){
+ query = atob(this.props.match.params.propId).replace('<pre>','').replace('</pre>','');
+ shouldRun = true;
+ }else{
+ shouldRun = true;
+ let nodeType = (this.props.match.params.type) ? this.props.match.params.type : '';
+ let propIds = (this.props.match.params.propId) ? this.props.match.params.propId.split(';') : '';
+ let propertyValue = '';
+ for(var i in propIds){
+ let propValue = propIds[i].split(':');
+ console.log(propValue[0] + '....' + propValue[1]);
+ let atobPropValue = atob(propValue[1]).replace('<pre>','').replace('</pre>','');
+ if(propertyValue == ''){
+ propertyValue ='(\'' + propValue[0] +'\',\''+ atobPropValue + '\')';
+ }else{
+ propertyValue = propertyValue + '(\'' + propValue[0] +'\',\''+ atobPropValue + '\')';
+ }
+ }
+ console.log('propertyValue>>>>>',propertyValue);
+ let relArray = (this.props.match.params.relArray) ? this.props.match.params.relArray.split('&') : '';
+ let relativeStr = '';
+ let str = '';
+ if(relArray.length>0){
+ for(var n in relArray){
+ relativeStr = relativeStr + relArray[n] + '*'
+ }
+ str = relativeStr.replace(/\*/g, '*,').slice(0, -1);
+ }
+ let relativeAttachStr = (str === '') ? '' : '>[' + str + ']';
+ //encPropValue = (nodeType === '') ? '': atob(propValue[1]);
+ query = (nodeType === '') ? '' : nodeType + '*' + propertyValue + relativeAttachStr;
+ if(loadType ==='init'){
+ console.log('this.baseState>>>>>',this.baseState)
+ this.baseState.value=query;
+ }
+ }
+ console.log('query>>>',query);
+ console.log('this.props.match.params.type>>>',this.props.match.params.type);
+ if(query != ''){
+ this.nodeResults = '';
+ this.typeOfCall = true;
+ let isInitialLoad = this.state.isInitialLoad;
+ this.setState( {value: query,validInput: true,isInitialLoad: false},() => { if(shouldRun){this.formQueryString(false, isInitialLoad,false)}});
+ }
+}
+ getNodeTypes = () =>{
+ var result = JSON.parse(OXM);
+ var arrayOfTypes = result['xml-bindings']['java-types'][0]['java-type'];
+ var nodeTypeArray = [];
+ for(var j = 0; j < arrayOfTypes.length; j++){
+ if(arrayOfTypes[j]['xml-root-element'] && arrayOfTypes[j]['xml-root-element'][0]
+ && arrayOfTypes[j]['xml-root-element'][0]['$'] && arrayOfTypes[j]['xml-root-element'][0]['$']['name']){
+ nodeTypeArray.push((arrayOfTypes[j]['xml-root-element'][0]['$']['name']).toLowerCase());
+ }
+ }
+ return nodeTypeArray;
+ }
+
+ getNodeTypeFromURI = (uri) => {
+ var nodeTypeArray = this.getNodeTypes();
+ var tokenizedUri = uri.split("/");
+ var nodeType = "";
+ var found = false;
+ for (var i = tokenizedUri.length - 1; i >= 0 && !found; i--){
+ if(nodeTypeArray.indexOf(tokenizedUri[i]) > -1){
+ nodeType = tokenizedUri[i];
+ found = true;
+ }
+ }
+ return nodeType;
+ }
+
+ getAttributesFromNodeType = (nt) => {
+ var result = JSON.parse(OXM);
+ var arrayOfTypes = result['xml-bindings']['java-types'][0]['java-type'];
+ var foundIndex = -1;
+ var attributesArray = [];
+ var nodeType = nt.replace(/-/g,'');
+ for (var i = 0; i < arrayOfTypes.length && foundIndex === -1; i++) {
+ if(arrayOfTypes[i]['$'] && arrayOfTypes[i]['$']['name'] && arrayOfTypes[i]['$']['name'].toLowerCase() === nodeType){
+ foundIndex = i;
+ }
+ }
+ for (var j = 0; j < arrayOfTypes[foundIndex]['java-attributes'][0]['xml-element'].length; j++) {
+ let property = arrayOfTypes[foundIndex]['java-attributes'][0]['xml-element'][j]['$']['name'];
+ let type = arrayOfTypes[foundIndex]['java-attributes'][0]['xml-element'][j]['$']['type'];
+ if (type === 'java.lang.String' || type === 'java.lang.Boolean') {
+ attributesArray.push(property);
+ }
+ }
+ return attributesArray;
+ }
+
+ getAttributesFromPath = (path,tableAggregateAliasColumns) => {
+ var nodeParseArray = path.split('>');
+ console.log(nodeParseArray);
+ var attributeArray = [];
+ var aggregatePaths = this.state.aggregatePathAttrs;
+ if(!this.typeOfCall){
+ aggregatePaths = this.state.allAggregatePathAttrs;
+ }
+ for(var i = 0; i < nodeParseArray.length; i++){
+ var nodeKey = nodeParseArray[i].trim();
+ let tableColumnsBuilt = ExportExcel.buildAttrList(nodeKey,[],'required');
+ for(var j = 0; j < aggregatePaths[nodeKey].length; j++){
+ let desc=tableColumnsBuilt.map((a) =>
+ {
+ if(a.value.toLowerCase()==aggregatePaths[nodeKey][j].toLowerCase())
+ return a.description;
+ else
+ return '';
+ }).filter(function (el) {
+ return el != '';
+ });
+ if(desc.length===0){
+ desc.push('');
+ }
+ if(Object.keys(tableAggregateAliasColumns).length !== 0 && tableAggregateAliasColumns[nodeKey] && tableAggregateAliasColumns[nodeKey][0][aggregatePaths[nodeKey][j]]){
+ attributeArray.push(nodeKey + '|' + tableAggregateAliasColumns[nodeKey][0][aggregatePaths[nodeKey][j]] +'|'+ desc[0]);
+ }else{
+ attributeArray.push(nodeKey + '|' + aggregatePaths[nodeKey][j] + '|' + desc[0]);
+ }
+ }
+ }
+ return attributeArray;
+ }
+
+ buildNodeList = () => {
+ var result = JSON.parse(OXM);
+ var arrayOfTypes = result['xml-bindings']['java-types'][0]['java-type'];
+ let nodeList = [];
+
+ for (var i = 0; i < arrayOfTypes.length; i++) {
+ var hasProperties = false;
+ if (arrayOfTypes[i]['java-attributes']) {
+ let elementLength = 0;
+ if (arrayOfTypes[i]['java-attributes'][0]['xml-element']) {
+ elementLength = arrayOfTypes[i]['java-attributes'][0]['xml-element'].length;
+ }
+ for (var j = 0; j < elementLength; j++) {
+ let property = JSON.stringify(arrayOfTypes[i]['java-attributes'][0]['xml-element'][j]['xml-properties']);
+ if (property) { //add to the list
+ hasProperties = true;
+ }
+ }
+ if (hasProperties) {
+ let node = arrayOfTypes[i]['xml-root-element'][0]['$']['name'];
+ nodeList.push(node);
+ }
+ }
+ }
+ nodeList.sort();
+ return nodeList;
+ }
+
+ processHelp(data) {
+ //console.log('Data' + JSON.stringify(data));
+ this.setState( {simpleQueries: data.simple } );
+ console.log('Value' + JSON.stringify(this.state.simpleQueries));
+ this.setState( {traversalQueries: data.traversal} );
+ this.setState( {unionQueries: data.union} );
+ this.setState( {negationQueries: data.negation} );
+ this.setState( {topologyQueries: data.topology} );
+ this.setState( {limitQueries: data.limit} );
+ this.setState( {advancedQueries: data.advanced} );
+ }
+
+ processEdgeRules = (data) => {
+ var ruleArr = [];
+ this.setState({
+ edgeRules: data.rules
+ });
+ ruleArr = data.rules;
+ // console.log("Rule"+JSON.stringify(ruleArr));
+ // new = data.Rules;
+ }
+
+ hint = () => { // open modal
+ console.log('hint >> showModal');
+ this.setState({
+ showModal:true
+ });
+ this.hints = this.state.html;
+ }
+
+ onAddItem = (event) => {
+ event.preventDefault();
+ GeneralCommonFunctions.scrollTo("outputBlock");
+ this.nodeResults = '';
+ this.typeOfCall = true;
+ this.setState({ viewName: this.state.defaultViewName, aggregateActivePage: 1, activePage: 1, nodes: [], aggregateNodes: [],errorResults:false},function () { this.formQueryString(false,false,false); }.bind(this));
+ };
+
+ formQueryString = (bypassCall, isInitialLoad, aggregateForGraph) =>{
+ console.log('formQueryString>>>>>>this.state.value :',this.state.value);
+ var DSLQuery = this.state.value;
+ DSLQuery.trim();
+ console.log('DSLQuery.trim().length: ' + DSLQuery.trim().length);
+ let resp = '';
+ if (DSLQuery.trim() !== '' || (this.props.match.params.type && DSLQuery.trim() !== '')){
+ console.log('validInput.DSLQuery: ' + DSLQuery);
+ this.setState({
+ validInput: true,isInitialLoad: isInitialLoad
+ });
+ const payload = {dsl: DSLQuery};
+ let format = 'simple';
+ if((this.state.isAggregateChecked || (isInitialLoad && this.props.match.params.type === 'built-aggregate')) && !aggregateForGraph){
+ format = 'aggregate';
+ this.setState({isAggregateChecked: true});
+ }
+ let queryStr = '';
+ if(this.typeOfCall){
+ if(format === 'aggregate' || aggregateForGraph){
+ this.setState({isAggregate: true});
+ queryStr = 'dsl?format=' + format + '&resultIndex=' + this.state.aggregateActivePage + '&resultSize=' + PAGINATION_CONSTANT.RESULTS_PER_PAGE;
+ }else{
+ this.setState({isAggregate: false});
+ queryStr = 'dsl?format=' + format + '&resultIndex='
+ + this.state.activePage + '&resultSize=' + PAGINATION_CONSTANT.RESULTS_PER_PAGE;
+ }
+ }else{
+ let pagerange=this.state.pageRange.toString();
+ pagerange=pagerange.split('-');
+ if(pagerange.length > 1){
+ queryStr = 'dsl?format=' + format + '&resultIndex='+ parseInt(pagerange[0]) +'&resultSize=' + PAGINATION_CONSTANT.RESULTS_PER_PAGE + '&resultRangeEnd=' + parseInt(pagerange[1]);
+ }else{
+ queryStr = 'dsl?format=' + format + '&resultIndex='+ 1 +'&resultSize=' + parseInt(pagerange);
+ }
+
+ }
+ const path = queryStr;
+ this.state.header = DSLQuery;
+ console.log('DSLQuery: ' + DSLQuery);
+ console.log('payload: ' + JSON.stringify(payload));
+ console.log('path: ' + path);
+ if(aggregateForGraph){
+ this.setState({isLoading: true, prevQuery:DSLQuery});
+ } else if(this.typeOfCall){
+ if(this.state.prevQuery !== DSLQuery){
+ this.setState({isLoading: true,
+ totalResults: 0,
+ prevQuery:DSLQuery
+ });
+ }else{
+ this.setState({isLoading: true, nodes: [], aggregateNodes: [], prevQuery:DSLQuery});
+ }
+ }
+ if(!bypassCall){
+ resp = this.getNodes(settings, path, payload, aggregateForGraph);
+ }
+ }else { // write a msg
+ console.log('validInput: ' + false);
+ this.setState({
+ validInput: false,
+ isInitialLoad: isInitialLoad
+ });
+ GeneralCommonFunctions.scrollTo('dslInputError');
+ }
+ console.log('Response: ' + resp);
+ }
+
+ onSuggestionSelected = (event, { suggestion }) => {
+ event.preventDefault();
+
+ let item = suggestion;
+ console.log('onSuggestionSelected.item: ' + item);
+ console.log('onSuggestionSelected.inputValue: ' + inputValue);
+
+ this.setState({
+ selected: [...this.state.selected, item],
+ value: inputValue + item
+ },
+ function () {
+ console.log('onSuggestionSelected.selected: ' + this.state.selected);
+ console.log('onSuggestionSelected.value: ' + this.state.value);
+ });
+ //if (!item.includes('(')) {
+ if (item.indexOf('(') === -1) { // not found
+ this.setState({previousNodeTypeDsl: item},
+ function () {
+ this.setState({
+ nodeTypeDsl: item
+ });
+ console.log('onSuggestionSelected.previousNodeTypeDsl: ' + this.state.previousNodeTypeDsl);
+ console.log('onSuggestionSelected.nodeTypeDsl: ' + this.state.nodeTypeDsl);
+ }
+ );
+ }
+ }
+
+ storeInputReference = autosuggest => {
+ if (autosuggest !== null) {
+ this.input = autosuggest.input;
+ }
+ };
+
+ clear = () => {
+ this.setState({
+ value: '',
+ previousNodeTypeDsl: '',
+ header: ''
+ });
+ }
+
+ openSaveModal = () =>{
+ this.setState({
+ showSaveModal: true,
+ saveSuccessfulMsg: false,
+ treeLoadErrMsg: false,
+ isPublicChecked:this.state.isDataSteward,
+ isCommunitySharedChecked: false,
+ isEditModal:false,
+ enableTreeLoadBusyFeedback: true,
+ dslConfigurableFiltersArray: []
+ });
+ this.getTreeFromDSL(this.state.value).then(tree => {
+ this.setState({enableTreeLoadBusyFeedback: false, dslConfigArray: this.getConfigArrayFromDSLTree(tree, [], [])});
+ });
+ };
+
+ handleTypeaheadChange = (event) =>{
+ this.setState({isTypeahead: event.target.checked});
+ }
+
+ closeSaveModal = () =>{
+ //Set previous loaded state
+ if(this.state.isEditModal){
+ this.setState({
+ value: this.state.valuePreviousState,
+ isAggregateChecked: this.state.isAggregateCheckedPreviousState,
+ isCommunitySharedChecked: this.state.isCommunitySharedCheckedPreviousState,
+ associatedNodesEnabled: this.state.associatedNodesEnabledPreviousState,
+ enableTreeLoadBusyFeedback: false
+ });
+ }
+
+ this.setState({
+ showSaveModal: false,
+ queryDescription: '',
+ queryName: '',
+ category:'',
+ enableSaveBusyFeedback: false,
+ showQueryExistsWarning: false,
+ saveFailureMsg: false,
+ isEditModal:false
+ });
+ };
+
+ submitSave = (bypassDupeCheck) =>{
+ let existQueryName=false;
+ let queryId='';
+ Object.keys(this.state.loadedQueries).map((key) =>{
+ if(this.state.loadedQueries[key].name === this.state.queryName){
+ existQueryName=true;
+ if(this.state.showQueryExistsWarning){
+ queryId=key;
+ }
+ }
+ });
+ if(!bypassDupeCheck && existQueryName){
+ this.setState({showQueryExistsWarning:true});
+ }else{
+ var aggregateString = "false";
+ if(this.state.isAggregateChecked){
+ aggregateString = "true";
+ }
+ var queryParam=(this.state.queryId==='')?queryId:this.state.queryId;
+ var body = {
+ "cols": [
+ {
+ "name": "query_name",
+ "value": this.state.queryName
+ },
+ {
+ "name": "creator",
+ "value": sessionStorage.getItem(ENVIRONMENT + 'userId')
+ },
+ {
+ "name": "description",
+ "value": this.state.queryDescription
+ },
+ {
+ "name": "is_aggregate",
+ "value": aggregateString
+ },
+ {
+ "name": "community_shared",
+ "value": "" + this.state.isCommunitySharedChecked
+ },
+ {
+ "name": "is_public",
+ "value": "" + this.state.isPublicChecked
+ },
+ {
+ "name": "template_details",
+ "value": JSON.stringify(this.state.staticTemplateFilters)
+ },
+ {
+ "name": "dsl",
+ "value": btoa('<pre>' + this.state.value + '</pre>')
+ }
+ ]
+ }
+ if(this.state.category && this.state.category !=''){
+ let catObj={"name": "category","value": this.state.category}
+ body['cols'].push(catObj);
+ }
+ let localVersion='';
+ if(this.state.showQueryExistsWarning){
+ if(bypassDupeCheck && this.state.loadedQueries[queryParam] && this.state.loadedQueries[queryParam].version ){
+ localVersion = this.state.loadedQueries[queryParam].version;;
+ body.version = localVersion;
+
+ }
+ }else{
+ if(bypassDupeCheck && this.state.loadedQueries[this.state.queryId] && this.state.loadedQueries[this.state.queryId].version ){
+ localVersion = this.state.loadedQueries[this.state.queryId].version;;
+ body.version = localVersion;
+ }
+ }
+
+ this.setState({showQueryExistsWarning:false, enableSaveBusyFeedback:true});
+ settings['ISTABULAR'] = true;
+ let localQuery='queries';
+ let localHeader=null;
+ if(queryParam !==''){
+ localQuery += '/'+encodeURIComponent(queryParam);
+ localHeader= [{
+ "name":"If-Match",
+ "value": localVersion
+ }];
+ }
+ commonApi(settings, localQuery, 'PUT', body, 'BYOQSaveInfo', GlobalExtConstants.OVERRIDE_DOMAIN,null,localHeader)
+ .then(res => {
+ console.log('res:' + res.data);
+ if(res.status === 201){
+ if(res.data.status && (res.data.status !== 200 && res.data.status !== 201)){
+ this.triggerSaveError(res.data);
+ }else{
+ if(this.state.isEditModal && this.state.isDSLFlow){
+ this.setState({
+ value: this.state.valuePreviousState,
+ isAggregateChecked: this.state.isAggregateCheckedPreviousState,
+ isCommunitySharedChecked: this.state.isCommunitySharedCheckedPreviousState,
+ associatedNodesEnabled: this.state.associatedNodesEnabledPreviousState,
+ });
+ }
+
+ let jumpToId = "saveSuccess";
+ if (this.state.isSavedQueryFlow && this.state.isEditModal){
+ jumpToId = "saveSuccessEdit";
+ }
+ else if(this.state.isSavedQueryFlow && !this.state.isEditModal){
+ jumpToId = "saveSuccessTemplate";
+ }
+
+ this.setState({
+ saveSuccessfulMsg: "The following query was successfully saved: " + this.state.queryName,
+ showSaveModal: false,
+ enableSaveBusyFeedback:false,
+ });
+
+ GeneralCommonFunctions.scrollTo(jumpToId);
+ if(this.state.isSavedQueryFlow){
+ this.saveLoadComponent.current.getQueries();
+ }else {
+ this.saveLoadComponentDsl.current.getQueries();
+ }
+ }
+ }else{
+ this.triggerSaveError(res.data);
+ }
+ }, error=>{
+ this.triggerSaveError(error.response.data);
+ }).catch(error => {
+ this.triggerSaveError(error);
+ });
+ }
+ };
+
+ triggerSaveError = (error) => {
+ console.error('[CustomDsl.jsx] error : ', JSON.stringify(error));
+ let errMsg = '';
+ if(error.status && error.message){
+ errMsg += "Error Occurred: " + error.status + ' - ' +error.message;
+ }else{
+ errMsg += "Error Occurred: " + JSON.stringify(error);
+ }
+ console.log(errMsg);
+ this.setState({saveFailureMsg: errMsg + " - Failed to save query : " + this.state.queryName, enableSaveBusyFeedback:false});
+ GeneralCommonFunctions.scrollTo("saveFailure");
+ }
+
+ handleQueryDescriptionChange = (e) => {
+ this.setState({queryDescription: e.target.value});
+ };
+ handleQueryNameChange = (e) => {
+ this.setState({queryName: e.target.value});
+ };
+ handleQueryChange = (e) => {
+ this.setState({value: e.target.value});
+ };
+ handleCategoryChange = (e) =>{
+ this.setState({category: e.target.value});
+ };
+
+ setQueriesState = (savedQueries) =>{
+ this.setState({
+ loadedQueries: savedQueries
+ });
+ };
+
+ getNodes(settings, path, payload, graphCall) {
+ this.setState({isLoading: true});
+ settings['ISTABULAR'] = false;
+ if(this.state.enableRealTime && APERTURE_SERVICE){
+ settings['ISAPERTURE'] = this.state.enableRealTime;
+ }else{
+ Object.keys(settings).forEach((key)=>{
+ if(key==='ISAPERTURE'){
+ delete settings[key];
+ }
+ })
+ }
+ console.dir('CustomDSL:settings:' + JSON.stringify(settings));
+ console.log('CustomDSL:path:' + path);
+ console.dir('CustomDSL:payload:' + JSON.stringify(payload));
+ commonApi(settings, path, 'PUT', payload, 'BYOQDefault', null, null, [{
+ "name":"X-DslApiVersion",
+ "value": "V2"
+ }])
+ .then(res => {
+ console.log('CustomDSL: Response',Object.keys(res.data));
+ if(!graphCall && this.typeOfCall){
+ this.setState({aggregatePaths: [],
+ aggregateParentGroup: [],
+ aggregateObjects: []});
+ }
+ if(this.state.isAggregate){
+ if(graphCall){
+ if(res.data.results.length > 0 && this.state.visualAddition){
+ Visualization.chart('currentStateAggregate', [], [], res.data, this);
+ this.setState({isLoading: false, nodes: res.data.results, res: res});
+ }
+ }else{
+ this.processAggregateData(res);
+ }
+ }else{
+ this.processData(res);
+ if(this.state.nodes.length > 0 && this.state.visualAddition){
+ Visualization.chart('currentState', [], [], this.state.res.data, this);
+ }
+ }
+ }, error=>{
+ if(this.typeOfCall){
+ this.triggerError(error);
+ }else{
+ let errMsg = this.renderErrorMsg(error);
+ this.setState({ isLoading: false,errorDownloadResults:true,downloadErrorMsg:errMsg,enableModelBusyFeedback:false});
+ }
+ }).catch(error => {
+ if(this.typeOfCall){
+ this.triggerError(error);
+ }else{
+ let errMsg = this.renderErrorMsg(error);
+ this.setState({ isLoading: false,errorDownloadResults:true,downloadErrorMsg:errMsg,enableModelBusyFeedback:false});
+ }
+ });
+ //this.input.focus();
+ }
+
+ triggerError = (error) => {
+ console.error('[CustomDsl.jsx] triggerError error : ', JSON.stringify(error));
+ //this.processData('');
+ this.setState({isLoading: false,
+ totalResults: 0,
+ showPagination: false,
+ showResults: false,
+ isInitialLoad: false,
+ noResults: true,
+ errorResults: true
+ });
+ this.downloadAllTooltip = 'Downloads First ' + DOWNLOAD_ALL + ' Results';
+ let errMsg = this.renderErrorMsg(error);
+ this.setState({errorMessage:errMsg});
+ console.log(error.config);
+ this.input.focus();
+ }
+ renderErrorMsg = (error) =>{
+ let errMsg='';
+ if (error.response) {
+ // The request was made and the server responded with a status code
+ // that falls out of the range of 2xx
+ console.log('[CustomDsl.jsx] error :', error.response);
+ if(error.response.status){
+ errMsg += " Code: " + error.response.status;
+ }
+ if(error.response.data){
+ errMsg += " - " + JSON.stringify(error.response.data);
+ }
+ } else if (error.request) {
+ // The request was made but no response was received
+ // `error.request` is an instance of XMLHttpRequest in the browser and an instance of
+ // http.ClientRequest in node.js
+ console.log(error.request);
+ errMsg += " - Request was made but no response received";
+ } else {
+ // Something happened in setting up the request that triggered an Error
+ console.log('Error', error.message);
+ errMsg += " - Unknown error occurred " + error.message;
+ }
+ return errMsg;
+ }
+ formAliasFilterPropertes = () =>{
+ let tableAggregateAliasColumns={};
+ this.tableFilterAliasColumns={};
+ let dslQuery = this.state.value;
+ var limitPattern = /limit[\s]\d+|limit\d+/ig
+ var limitkey = dslQuery.match(limitPattern);
+ if(limitkey){
+ dslQuery = dslQuery.replace(limitkey[limitkey.length-1],'').trim();
+ }
+ dslQuery = this.alterDslQueryByRemoveSpaces(dslQuery);
+ //New adding
+ this.dslObject={};
+ this.nodeTypeArray=[];
+ //create placeholders for NodeTypes with Propand Propvalues
+ this.tempDslQuery=this.formTempDslQuery(dslQuery);
+ //Preparing Json Object to render into Placeholder
+ this.contructDslNodes(dslQuery,'node',false,false,false,false);
+ ;
+ let aliasRegex=/\'(\s)as(\s)\'|\'as\'/ig;
+ Object.keys(this.dslObject).map((nodekey)=>{
+ let nodeprops=this.dslObject[nodekey][0]['props'];
+ if(nodeprops){
+ let nodeTypeProp = nodeprops[0].slice(1,-1).split(',');
+ let objAlias = {};
+ let filterObjAlias={};
+ for(var s=0;s<nodeTypeProp.length;s++){
+ let nodeTypePropes=nodeTypeProp[s].match(aliasRegex);
+ let alias='';
+ let nprop='';
+ if(nodeTypePropes){
+ let nodeTypeSplit=nodeTypeProp[s].split(aliasRegex);
+ nprop=nodeTypeSplit[0].replace(/\'/g,'');
+ alias=nodeTypeSplit[nodeTypeSplit.length-1].replace(/\'/g,'');
+ objAlias[nprop]=alias;
+ filterObjAlias[alias]=nprop;
+ }
+ }
+ let nodeNo=parseInt(nodekey.substr(nodekey.length-2,nodekey.length-1).replace(/\-/g,''));
+ let keyact=isNaN(nodeNo);
+ let actKey=nodekey.split('-');
+ if(!keyact){
+ actKey.splice(actKey.length-1,1);
+ nodekey=actKey.join('-')+nodeNo;
+ }
+ if(!tableAggregateAliasColumns[nodekey]){
+ tableAggregateAliasColumns[nodekey]=[];
+ tableAggregateAliasColumns[nodekey].push(objAlias);
+
+ }
+ if(!this.tableFilterAliasColumns[nodekey]){
+ this.tableFilterAliasColumns[nodekey]=[];
+ this.tableFilterAliasColumns[nodekey].push(filterObjAlias);
+ }
+ }
+ });
+ return tableAggregateAliasColumns;
+ }
+ processAggregateData = (resp) =>{
+ console.log('CustomDSL:processAggregateData Response data: ' + JSON.stringify(resp.data));
+ var downloadCount = DOWNLOAD_ALL;
+ var uniqueNodePaths = [];
+ var uniqueNodeAttributes = [];
+ var groupingByStart = [];
+ var aggregateObjectArray = [];
+ if (resp.data && resp.data.results) {
+ for(var i = 0; i < resp.data.results.length; i++){
+ var fullPath = "";
+ var nodePath = "";
+ var nodeTypesForPath = [];
+ var startNodeKey = "";
+ var aggregateObject = {};
+ //Make sure everything is in an array, so pushing single element into the array
+ if(!Array.isArray(resp.data.results[i])){
+ var tempObj = Object.assign({}, resp.data.results[i]);
+ resp.data.results[i] = [];
+ resp.data.results[i].push(tempObj);
+ }
+ for(var j = 0; j < resp.data.results[i].length; j++){
+ var objectIndex = 0;
+ for(var key in resp.data.results[i][j]){
+ var nodeType = this.getNodeTypeFromURI(key);
+ if (objectIndex === 0){
+ startNodeKey = key;
+ }
+ objectIndex++;
+ var nodeTypeLabel = '';
+ if(nodeTypesForPath[nodeType] >= 1){
+ nodeTypeLabel = nodeType + nodeTypesForPath[nodeType];
+ nodeTypesForPath[nodeType] = nodeTypesForPath[nodeType]++;
+ }else if (nodeTypesForPath[nodeType] === 0){
+ nodeTypeLabel = nodeType + 1;
+ nodeTypesForPath[nodeType] = 1;
+ }else{
+ nodeTypeLabel = nodeType;
+ nodeTypesForPath[nodeType] = 0;
+ }
+ if(!uniqueNodeAttributes[nodeTypeLabel]){
+ uniqueNodeAttributes[nodeTypeLabel] = [];
+ }
+ for(var propKey in resp.data.results[i][j][key].properties){
+ if(uniqueNodeAttributes[nodeTypeLabel].indexOf(propKey) === -1){
+ uniqueNodeAttributes[nodeTypeLabel].push(propKey);
+ }
+ Object.defineProperty(resp.data.results[i][j][key].properties, nodeTypeLabel + '|' + propKey, Object.getOwnPropertyDescriptor(resp.data.results[i][j][key].properties, propKey));
+ delete resp.data.results[i][j][key].properties[propKey];
+ }
+ fullPath += key + ' > ';
+ nodePath += nodeTypeLabel + ' > ';
+ }
+ aggregateObject = Object.assign({}, aggregateObject, resp.data.results[i][j][startNodeKey].properties);
+ }
+ nodePath = nodePath.substring(0, nodePath.length - 3);
+ if(!aggregateObjectArray[nodePath]){
+ aggregateObjectArray[nodePath] = [];
+ }
+ aggregateObjectArray[nodePath].push(aggregateObject);
+ resp.data.results[i].fullPath = fullPath.substring(0, fullPath.length - 3);
+ resp.data.results[i].nodePath = nodePath;
+ if(!groupingByStart[startNodeKey]){
+ groupingByStart[startNodeKey] = [];
+ groupingByStart[startNodeKey].push(resp.data.results[i]);
+ }else{
+ groupingByStart[startNodeKey].push(resp.data.results[i]);
+ }
+ if(uniqueNodePaths.indexOf(resp.data.results[i].nodePath) === -1){
+ uniqueNodePaths.push(resp.data.results[i].nodePath);
+ }
+ console.log('Grouping by Start: ' + JSON.stringify(groupingByStart));
+ console.log('Unique Paths: ' + JSON.stringify(uniqueNodePaths));
+ }
+ if(this.typeOfCall){
+ let totalResults = (resp.headers) ? parseInt(resp.headers['total-results']) : 0;
+ console.log('totalResults>>>>>>>>>>>>>>>>>>>>>',totalResults);
+ if(totalResults > DOWNLOAD_ALL){
+ this.downloadAllTooltip = DOWNLOAD_ALL + ' results out of '+ totalResults +' results will be downloaded, Please filter results further to obtain full report';
+ }else{
+ this.downloadAllTooltip = (totalResults === 1) ?'Downloads ' + totalResults + ' Results' : 'Downloads all ' + totalResults + ' Results' ;
+ downloadCount= totalResults;
+ }
+ this.setState({
+ aggregateNodes: resp.data.results,
+ res: resp,
+ aggregatePaths: uniqueNodePaths,
+ aggregatePathAttrs: uniqueNodeAttributes,
+ aggregateObjects: aggregateObjectArray,
+ aggregateParentGroup: groupingByStart,
+ isLoading: false,
+ totalResults: totalResults,
+ showResults: totalResults > 0 ? true : false,
+ showPagination: totalResults > 0 ? true : false,
+ isInitialLoad: false,
+ noResults: totalResults > 0 ? false : true,
+ errorResults: false,
+ downloadCount: downloadCount,
+ },function(){this.formatAggregateIntoTabular();});
+ this.multipleNodes = this.state.aggregateNodes.length > 1;
+ //this.setState({ viewName: "CardLayout" }); commented not to defaulting to CardView
+ }else{
+ console.log('else condition>>>>');
+ if(resp.data && resp.data.results) {
+ this.nodeResults = resp.data.results;
+ let totalResults = 0;
+ let totalPages = 0;
+ totalResults = parseInt(resp.headers['total-results']);
+ totalPages = parseInt(resp.headers['total-pages']);
+ this.setState({
+ allAggregateNodes: resp.data.results,
+ allres: resp,
+ allAggregatePathAttrs: uniqueNodeAttributes,
+ allAggregatePaths: uniqueNodePaths,
+ allAggregateObjects: aggregateObjectArray,
+ allAggregateParentGroup: groupingByStart,
+ totalPages:totalPages,
+ totalResults:totalResults,
+ errorDownloadResults:false,
+ downloadErrorMsg:''
+ },function(){this.formatAggregateIntoTabular();});
+ }else{
+ this.downloadAllTooltip = 'Downloads First ' + DOWNLOAD_ALL + ' Results';
+ }
+ this.setState({isLoading: false});
+ }
+ }
+ GeneralCommonFunctions.scrollTo("outputBlock");
+ }
+
+ formatAggregateIntoTabular = () =>{
+ let tableColumnsList = [];
+ let tableDataList = [];
+ let columnFilter = [];
+ var aggregatePaths = [];
+ var aggregateObjects = [];
+ let tableAggregateAliasColumns=this.formAliasFilterPropertes();
+
+ if(this.typeOfCall){
+ aggregatePaths = this.state.aggregatePaths;
+ aggregateObjects = this.state.aggregateObjects;
+ }else{
+ aggregatePaths = this.state.allAggregatePaths;
+ aggregateObjects = this.state.allAggregateObjects;
+ }
+ for(var p = 0; p < aggregatePaths.length; p++){
+ var types = [aggregatePaths[p]];
+ var type = types[0];
+ var attributeList = this.getAttributesFromPath(type,tableAggregateAliasColumns);
+ var downloadAllCalled = false;
+ tableColumnsList[type] = [];
+ tableColumnsList[type].push({dataField: 'id', text: 'id', hidden: true });
+ tableDataList[type] = aggregateObjects[type];
+ for(var attrIndex = 0; attrIndex < attributeList.length; attrIndex++){
+ let col=attributeList[attrIndex].split('|').splice(0,2).join('|');
+ let desc=attributeList[attrIndex].split('|')[2];
+ if(!columnFilter[attrIndex] || (columnFilter[attrIndex] && columnFilter[attrIndex][attributeList[attrIndex]] === undefined)){
+ let obj = {};
+ obj[col] = '';
+ obj['description']=desc
+ columnFilter.push(obj);
+ }
+ if(!this.typeOfCall){
+ tableColumnsList[type].push({name: col,
+ dataField: col,
+ text: col,
+ hidden: false,
+ headerAttrs: {title:desc},
+ filter: textFilter({getFilter: (f) => { this.setState({filterEnable: true})}})
+ });
+ }else{
+ tableColumnsList[type].push({name: col,
+ dataField: col,
+ text: col,
+ hidden: false,
+ headerAttrs: { title:desc},
+ filter : customFilter(),
+ filterRenderer : (onFilter, column) => <AttributeFilter handleOnFilter= {this.handleOnFilter} onFilter={ onFilter } column={ column } isPageChange={this.state.isPageNumberChange} nodeType={type} columnFilter={columnFilter}/>
+ });
+ }
+ }
+ if(this.typeOfCall){
+ this.setState({tabularAggregateColumns: tableColumnsList, tabularAggregateData: tableDataList, aggregateAttrList: attributeList,tableAggregateAliasColumns:tableAggregateAliasColumns});
+ }else{
+ this.setState({allTabularAggregateColumns: tableColumnsList, allTabularAggregateData: tableDataList, allAggregateAttrList: attributeList,tableAggregateAliasColumns:tableAggregateAliasColumns}, function(){if(!downloadAllCalled){downloadAllCalled = true;this.downloadAllAggregate();}});
+ }
+ }
+ }
+
+ downloadAggregate = () =>{
+ this.typeOfCall = true;
+ ExportExcel.generateExcelFromTabularViewMultiTabs( this.state.tabularAggregateData, this.state.tabularAggregateColumns, 'AggregateObjects.xlsx');
+ }
+
+ downloadAllAggregate = (pageRange,rangeState) =>{
+ console.log('downloadAllAggregate>>>>>>>>>>>*',pageRange);
+ if(pageRange){
+ this.typeOfCall=false;
+ let rangeModelState=(rangeState)? rangeState: false;
+ this.setState(
+ { pageRange: pageRange,isLoading: true,showDownloadResultsModal:rangeModelState,enableModelBusyFeedback:true},
+ function () { this.formQueryString(false,false,false); }.bind(this)
+ );
+ }else{
+ this.setState(
+ {errorDownloadResults: false, showDownloadResultsModal: false, downloadErrorMsg:'', isLoading: false, enableModelBusyFeedback:false},
+ function (){
+ ExportExcel.generateExcelFromTabularViewMultiTabs( this.state.allTabularAggregateData, this.state.allTabularAggregateColumns, 'AggregateObjects.xlsx');
+ this.typeOfCall = true;
+ }.bind(this)
+ );
+ }
+ }
+ openDownloadRange = () =>{
+ this.setState({
+ showDownloadResultsModal: true,
+ errorDownloadResults: false,
+ downloadErrorMsg:''});
+ }
+ closeDownloadResults = () =>{
+ this.setState({
+ showDownloadResultsModal: false,
+ enableModelBusyFeedback: false
+ });
+ }
+ processData = (resp) => {
+ console.log('Response data: ' + JSON.stringify(resp.data));
+ this.tableFilterAliasColumns=this.formAliasFilterPropertes();
+ if(this.typeOfCall){
+ if (resp.data && resp.data.results) {
+ //this.nodes = data.results;setDefaultViewName
+ this.setState({
+ nodes: resp.data.results,
+ res: resp
+ });
+ this.multipleNodes = this.state.nodes.length > 1;
+ //this.setState({ viewName: "CardLayout" });
+ }
+ let totalResults = 0;
+ let downloadCount = DOWNLOAD_ALL;
+ if(resp.headers) {
+ totalResults = parseInt(resp.headers['total-results']);
+ if(totalResults > DOWNLOAD_ALL){
+ this.downloadAllTooltip = DOWNLOAD_ALL + ' results out of '+ totalResults +' results will be downloaded, Please filter results further to obtain full report';
+ }else{
+ this.downloadAllTooltip = (totalResults === 1) ?'Downloads ' + totalResults + ' Results' : 'Downloads all ' + totalResults + ' Results' ;
+ downloadCount= totalResults;
+ }
+ this.setState({isLoading: false,
+ totalResults: totalResults,
+ totalPages: parseInt(resp.headers['total-pages']),
+ showPagination: resp.headers['total-results'] > 0 ? true : false,
+ showResults: resp.headers['total-results'] > 0 ? true : false,
+ isInitialLoad: false,
+ noResults: resp.headers['total-results'] && resp.headers['total-results'] > 0 ? false : true,
+ errorResults: !resp.headers['total-results'],
+ downloadCount: downloadCount
+ });
+ }
+ }else{
+ if(resp.data && resp.data.results) {
+ this.nodeResults = resp.data.results;
+ let totalResults = 0;
+ let totalPages = 0;
+ if(resp.headers) {
+ totalResults = parseInt(resp.headers['total-results']);
+ totalPages = parseInt(resp.headers['total-pages']);
+ }
+ this.setState({totalPages:totalPages,errorDownloadResults:false,downloadErrorMsg:''},() => {this.getAllExcels()});
+ }else{
+ this.nodeResults = '';
+ this.setState({ isLoading: false,errorDownloadResults:true,downloadErrorMsg:error+'',enableModelBusyFeedback:false});
+ }
+ }
+ GeneralCommonFunctions.scrollTo("outputBlock");
+ }
+
+ close = () => {
+ this.setState({
+ showModal: false
+ });
+ }
+
+ onClick = (event) => {
+ console.log('onClick');
+ }
+
+ onTextAreaChange = (event) => {
+ this.setState({value: event.target.value});
+ }
+
+ onChange = (event, { newValue }) => {
+ console.log('onChange.newValue: ' + newValue);
+ let term = null;
+ this.setState({
+ value: newValue},
+ function () {
+ console.log('onChange.selected: ' + this.state.selected);
+ console.log('onChange.state value set: ' + this.state.value);
+ if (this.state.value.slice(-1) === '(' || this.state.value.slice(-1) === '>') {
+ //this.onSuggestionsFetchRequested(term);
+ term = this.getValue(this.state.value); // this returns term, array of props or rules
+ if (term) {
+ console.log('onChange.term: ' + term.toString());
+ }
+ console.log('onChange.setting suggestions');
+ this.setState({
+ suggestions: term
+ });
+ }else if(this.state.value === ''){
+ inputValue='';
+ }
+ }
+ );
+ // if term exists && term length > 0 - try to load suggestions
+ //if(term && term.length > 0){
+ //properties = term.map(property => {
+ //return <div key={property}>{property}<br/></div>;
+ //});
+ //}
+ }
+
+ getValue = (term) => {
+ inputValue = '';
+ let isStartNode = (term.split('>')).length <= 1;
+ console.log('getValue.term is: ' + term);
+
+ let toArray = term.split(' ');
+ //console.log('Value' + JSON.stringify(toArray[toArray.length - 1]));
+ if (toArray && toArray.length > 1) {
+ //this.model = term;
+ console.log('getValue.toArray: ' + toArray.length);
+ this.setState({
+ model: term
+ });
+ term = toArray[toArray.length - 1];
+
+ }
+ for (var i = 0; i < toArray.length - 1; i++) {
+ inputValue = inputValue + ' ' + toArray[i];
+ }
+ console.log('getValue.inputValue toArray: ' + inputValue);
+ //console.log(term.slice(-1));
+ if (term.slice(-1) === '(') {
+ console.log('getValue.detected ( property search');
+ var nodeVal = term.slice(0, -1);
+ nodeVal = nodeVal.trim();
+ console.log('getValue.property.nodeVal: ' + nodeVal);
+ var val = [];
+ val = this.state.nodeTypes.filter(v => v.toLowerCase().indexOf(nodeVal.toLowerCase()) > -1);
+ console.log('getValue.val.length: ' + val.length);
+ if (val.length === 0) {
+ nodeVal = this.state.previousNodeTypeDsl;
+ inputValue = inputValue + term.slice(0, -1);
+ }else {
+ inputValue = inputValue + ' ' + nodeVal;
+ }
+ console.log('getValue.inputValue property: ' + inputValue);
+ if (nodeVal) {
+ this.propertiesDsl=this.populateColumnOptions(nodeVal, isStartNode);
+ this.setState({nodeTypeDsl: nodeVal,previousNodeTypeDsl:nodeVal});
+ }
+ term = this.propertiesDsl;
+ } else if (term.slice(-1) === '>') {
+ console.log('getValue.detected > edgerule search');
+ var nodeVal = this.state.previousNodeTypeDsl;
+ nodeVal = nodeVal.trim();
+ console.log('getValue.edgerule.nodeVal: ' + nodeVal);
+ var val = [];
+
+ inputValue = term;
+
+ this.populateEdgeRules(nodeVal);
+ term = traverseRulesDsl;
+ }
+ else {
+ //console.log('getValue.nodeTypes: ' + this.state.nodeTypes);
+ term = (term === '' ? this.state.nodeTypes : this.state.nodeTypes.filter(v => v.toLowerCase().indexOf(term.toLowerCase()) > -1)).slice(0, 10);
+ }
+ //console.log('getValue.term: ' + term);
+ return term;
+ }
+
+ camelToDash = (str) => {
+ console.log('camelToDash.str: ' + str);
+ return (str.replace(/\W+/g, '-')
+ .replace(/([a-z\d])([A-Z])/g, '$1-$2')).toLowerCase();
+ }
+
+
+ populateColumnOptions = (nodeType, isStartNode) =>{
+ console.log('populateColumnOptions>>>>>nodeType',nodeType);
+ let propertiesDsl = [];
+ var result = JSON.parse(OXM);
+ var arrayOfTypes = result['xml-bindings']['java-types'][0]['java-type'];
+ //console.dir(arrayOfTypes);
+ var foundIndex = -1;
+ var searchParam = nodeType;
+ //if(['PSERVER', 'COMPLEX', 'CLOUDREGION', 'NETWORKPROFILE', 'VIRTUALDATACENTER'].indexOf(this.nodeType.toUpperCase()) === -1){
+ //searchParam = this.nodeType.substring(0, this.nodeType.length - 1);
+ //}
+ //console.log('nodeType:' + nodeType);
+ if (nodeType.substr(nodeType.length - 3) === 'ies') {
+ searchParam = nodeType.substring(0, nodeType.length - 3) + 'y';
+ }
+
+ if (nodeType.toUpperCase() === 'LINESOFBUSINESS') {
+ searchParam = 'lineOfBusiness';
+ }
+ //console.log('searchParam:' + searchParam);
+ for (var i = 0; i < arrayOfTypes.length && foundIndex === -1; i++) {
+ if (arrayOfTypes[i]['xml-root-element'][0]['$']['name'] === this.camelToDash(searchParam)) {
+ foundIndex = i;
+ }
+ }
+ for (var j = 0; j < arrayOfTypes[foundIndex]['java-attributes'][0]['xml-element'].length; j++) {
+ let property = arrayOfTypes[foundIndex]['java-attributes'][0]['xml-element'][j]['$']['name'];
+ //console.log('array' + JSON.stringify(property));
+ let type = arrayOfTypes[foundIndex]['java-attributes'][0]['xml-element'][j]['$']['type'];
+ //console.log('type: ' + type);
+ if (type === 'java.lang.String' || type === 'java.lang.Boolean' || type ==='java.lang.Integer' || type ==='java.lang.Long') {
+ let value = '';
+ if(isStartNode !== undefined){
+ value = '(\'' + property + '\',\'Value\')';
+ }else{
+ value= property;
+ }
+ propertiesDsl.push(value);
+ }
+ }
+ //console.log('propertiesDsl: ' + propertiesDsl);
+ let sortedPropertiesDsl = propertiesDsl.sort(function (filter1, filter2) {
+ if (filter1 < filter2) {
+ return -1;
+ } else if (filter1 > filter2) {
+ return 1;
+ } else {
+ return 0;
+ }
+ });
+ //console.log('sortedPropertiesDsl: ' + sortedPropertiesDsl);
+ if(isStartNode !== undefined){
+ propertiesDsl = sortedPropertiesDsl;
+ //console.log('FilterList' + JSON.stringify(propertiesDsl));
+ }
+ return propertiesDsl;
+
+ }
+ componentWillReceiveProps(nextProps) {
+ console.log('nextProps......', nextProps);
+ //console.log('this.props.....', this.props);
+
+ var relArray = false;
+ if(this.props.match.params.relArray){
+ if(nextProps.match.params.relArray){
+ if(nextProps.match.params.relArray !== this.props.match.params.relArray){
+ relArray = true;
+ }
+ }
+ }else{
+ relArray = false;
+ }
+ console.log('relArray>>>>',relArray);
+ this.setState({
+ isDSLFlow: this.props.viewName === 'BYOQ',
+ isSavedQueryFlow: this.props.viewName === 'Saved Queries',
+ showNodeModal:false
+ },()=>{if (nextProps.match.params.type && nextProps.match.params.propId &&
+ (nextProps.match.params.type !== this.props.match.params.type ||
+ nextProps.match.params.propId !== this.props.match.params.propId || relArray)) {
+ this.props = nextProps;
+ this.buildDynamicByoq();
+ }});
+ }
+ populateEdgeRules = (nodeType) => {
+ traverseRulesDsl = [];
+ console.log('populateEdgeRules.nodeType: ' + nodeType);
+ for (var i = 0; i < this.state.edgeRules.length; i++) {
+ var ruleObj = this.state.edgeRules[i];
+ if (ruleObj.from === nodeType) {
+ console.log('from: ' + ruleObj.to);
+ traverseRulesDsl.push(ruleObj.to);
+ }
+ if (ruleObj.to === nodeType) {
+ console.log('to: ' + ruleObj.from);
+ traverseRulesDsl.push(ruleObj.from);
+ }
+ }
+ let traverseRulesDslSorted = traverseRulesDsl.sort(function (filter1, filter2) {
+ if (filter1 < filter2) {
+ return -1;
+ } else if (filter1 > filter2) {
+ return 1;
+ } else {
+ return 0;
+ }
+ });
+ console.log('EdgeRulesList' + JSON.stringify(traverseRulesDslSorted));
+ traverseRulesDsl = traverseRulesDslSorted;
+ }
+
+ // Autosuggest will call this function every time you need to update suggestions.
+ // You already implemented this logic above, so just use it.
+ onSuggestionsFetchRequested = ({ value }) => {
+ this.setState({
+ suggestions: this.getSuggestions(value)
+ });
+ };
+ getAllExcels = (pageRange,rangeState) =>{
+ console.log('getAllExcels>>>>>>>>>>>*',pageRange);
+ if(pageRange){
+ this.typeOfCall=false;
+ let rangeModelState=(rangeState)? rangeState: false;
+ this.setState(
+ { pageRange: pageRange,isLoading: true,showDownloadResultsModal:rangeModelState,enableModelBusyFeedback:true},
+ function () { this.formQueryString(false,false,false); }.bind(this)
+ );
+ }else{
+
+ this.setState(
+ {errorDownloadResults: false, showDownloadResultsModal: false, downloadErrorMsg:'', isLoading: false, enableModelBusyFeedback:false},
+ function () { generateExcels(this.nodeResults,this.state.prevQuery);this.nodeResults='';this.typeOfCall = true;}.bind(this)
+ );
+ }
+ }
+
+ getTreeFromDSL = (dslQuery) =>{
+ var treeObject = [];
+ var payload = {dsl: dslQuery};
+ settings['ISAPERTURE'] = true;
+ return commonApi(settings, 'dsl/convert-query-to-tree', 'PUT', payload, 'ConvertQueryToTree')
+ .then(res => {
+ console.log('res:' + res.data, 'load');
+ if(res.status === 200 || res.status === 404){
+ if(res.data.status && (res.data.status !== 200 && res.data.status !== 201 && res.data.status !== 404)){
+ this.triggerTreeError(res.data, 'treeLoad');
+ return {};
+ }else{
+ treeObject = res.data;
+ this.setState({
+ treeLoadErrMsg: null
+ });
+ console.log("TREE OBJECT: " + JSON.stringify(treeObject));
+ //set the init state
+ var initNode = GeneralCommonFunctions.extractNodeDetails(treeObject.children[0], true, this.triggerTreeError, APERTURE_SERVICE);
+ if(!this.state.treeLoadErrMsg || this.state.treeLoadErrMsg === ''){
+ console.log(JSON.stringify(initNode));
+ return initNode;
+ }else{
+ this.triggerTreeError(null, 'treeLoad');
+ return {};
+ }
+ }
+ }else{
+ this.triggerTreeError(res.data, 'treeLoad');
+ return {};
+ }
+ }, error=>{
+ if(error.response.status === 404){
+ this.setState({enableTreeLoadBusyFeedback:false});
+ return {};
+ }else{
+ this.triggerTreeError(error.response.data, 'treeLoad');
+ return {};
+ }
+ }).catch(error => {
+ this.triggerTreeError(error, 'treeLoad');
+ return {};
+ })
+ }
+ triggerTreeError = (error, type) => {
+ console.error('[CustomDsl.jsx] error : ', JSON.stringify(error));
+ let errMsg = '';
+ if(error && error.status && error.message){
+ errMsg += "Error Occurred: " + error.status + ' - ' +error.message;
+ }else{
+ errMsg += "Error Occurred: " + JSON.stringify(error);
+ }
+ console.log(errMsg);
+ if(type === 'treeLoad' || type === 'invalidQuery'){
+ var errorMessage = errMsg;
+ this.setState({treeLoadErrMsg: errorMessage, enableTreeLoadBusyFeedback: false});
+ }else{
+ console.log('[CustomDsl.jsx] :: triggerError invoked with invalid type : ' + type);
+ }
+ }
+ getConfigArrayFromDSLTree = (node, configArray, keyArray) =>{
+
+ var tempKey = node.name;
+ var nodeKey;
+ if(keyArray[tempKey]){
+ nodeKey = tempKey + '-' + keyArray[tempKey];
+ keyArray[tempKey] = keyArray[tempKey]++;
+ }else{
+ nodeKey = tempKey;
+ keyArray[tempKey] = 1;
+ }
+ if(node.details && node.details.attrDetails){
+ for (var attr in node.details.attrDetails){
+ if(node.details.attrDetails[attr].filterType && node.details.attrDetails[attr].filterType.length > 0
+ && node.details.attrDetails[attr].filterType[0] !== ""){
+ if(!configArray[nodeKey]){
+ configArray[nodeKey] = {};
+ configArray[nodeKey].filters = [];
+ }
+ configArray[nodeKey].filters.push(attr);
+ }
+ }
+ }
+ if(node.children && node.children.length > 0){
+ for(var i = 0; i < node.children.length; i++){
+ configArray = this.getConfigArrayFromDSLTree(node.children[i], configArray, keyArray);
+ }
+ }
+ return configArray;
+ }
+ handlePageChange = (pageNumber) => {
+ console.log('[CustomDsl.jsx] HandelPageChange active page is', pageNumber);
+ this.typeOfCall = true;
+ if(this.state.isAggregateChecked){
+ this.setState(
+ { aggregateActivePage: pageNumber, isLoading: true, nodes: [], aggregateNodes: [],resetColumnFilters: false, isPageNumberChange: true},
+ function () { this.formQueryString(false,false,false); }.bind(this)
+ );
+ }else{
+ this.setState(
+ { activePage: pageNumber, isLoading: true, nodes: [], aggregateNodes: [],resetColumnFilters: false, isPageNumberChange: true},
+ function () { this.formQueryString(false,false,false); }.bind(this)
+ );
+ }
+ }
+ // Autosuggest will call this function every time you need to clear suggestions.
+ onSuggestionsClearRequested = () => {
+ this.setState({
+ suggestions: []
+ });
+ };
+
+// https://developer.mozilla.org/en/docs/Web/JavaScript/Guide/Regular_Expressions#Using_Special_Characters
+ escapeRegexCharacters(str) {
+ return str.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+ }
+
+ getSuggestions = (value) => {
+ console.log('getSuggestions.value: ' + value);
+ const escapedValue = this.escapeRegexCharacters(value.trim());
+ const regex = new RegExp('^' + escapedValue, 'i');
+ return nodeTypes.filter(nodeType => regex.test(nodeType));
+ }
+
+
+// When suggestion is clicked, Autosuggest needs to populate the input
+// based on the clicked suggestion. Teach Autosuggest how to calculate the
+// input value for every given suggestion.
+ getSuggestionValue = suggestion => suggestion;
+
+// Use your imagination to render suggestions.
+ renderSuggestion = suggestion => (
+ <div>
+ {suggestion}
+ </div>
+ );
+
+ onSuggestionsUpdateRequested =( { value }) => {
+ console.log('onSuggestionsUpdateRequested.value: ' + value);
+ this.setState({
+ suggestions: getSuggestions(value)
+ });
+ }
+
+ shouldRenderSuggestions = () => {
+ return true;
+ }
+ openHistory = (nodeDisplay, nodeUri, nodeType) => { // open modal from Card
+ console.log('history >> showModal',nodeDisplay);
+ let historyNodeUri = (nodeUri)?nodeUri.replace('/aperture/','/'):nodeUri;
+ let paramToPassThrough = '';
+ if(nodeType){
+ this.setState({
+ nodeDisplay: nodeDisplay,
+ showHistoryModal: true,
+ showModelOptions:true,
+ enableCalendar:true,
+ historyType:(this.state.historyType === 'dsl') ? 'nodeState' : this.state.historyType,
+ focusedNodeUri: historyNodeUri,
+ focusedNodeType: nodeType
+ });
+ }else{
+ this.setState({
+ showHistoryModal:true,
+ showModelOptions:false,
+ enableCalendar:true,
+ historyType : 'dsl',
+ focusedNodeUri: this.state.value,
+ focusedNodeType: nodeType
+ });
+ }
+ }
+ closeHistory = () => {
+ this.setState({
+ showHistoryModal: false,
+ enableCalendar:true,
+ historyType :'nodeState'
+ });
+ }
+ submitHistory = () => {
+ console.log("submitting history");
+ let paramToPassThrough = '';
+ if(this.state.focusedNodeType){
+ paramToPassThrough = '/history/' + this.state.historyType +'/' + this.state.focusedNodeType + '/' + btoa(this.state.focusedNodeUri);
+ }else{
+ paramToPassThrough = '/historyQuery/' + this.state.historyType + '/' + btoa(this.state.value);
+ }
+ let epochStartTime = (this.state.startDate).unix();
+ this.props.history.push(paramToPassThrough + '/' + epochStartTime * 1000);
+ }
+ handleDateChange = (newDate) =>{
+ this.setState({ startDate: moment(+newDate) });
+ console.log('[CustomDsl.jsx] handleDateChange date is ', this.state.startDate);
+ console.log('[CustomDsl.jsx] handleDateChange date is in millis ', +this.state.startDate);
+ }
+
+ setViewName(event) {
+ console.log(event.currentTarget.value);
+ if(this.state.isAggregate && event.currentTarget.value === 'VisualLayout'){
+ this.formQueryString(false, false, true);
+ }
+ this.setState({
+ viewName: event.currentTarget.value
+ });
+ }
+
+ setDefaultViewName=(event)=>{
+ let ENVIRONMENT = GlobalExtConstants.ENVIRONMENT;
+ let layout = event.target.value;
+
+ if(sessionStorage.getItem(ENVIRONMENT + 'userId')) {
+ if (event.target.checked) {
+ localStorage.setItem(ENVIRONMENT + '_' + sessionStorage.getItem(ENVIRONMENT + 'userId') + '_viewPreference', layout);
+ } else {
+ localStorage.removeItem(ENVIRONMENT + '_' + sessionStorage.getItem(ENVIRONMENT + 'userId') + '_viewPreference');
+ }
+ }
+
+ this.setState({
+ defaultViewName: event.target.value
+ });
+ this.baseState.viewName=event.target.value;
+ this.baseState.defaultViewName=event.target.value;
+ }
+ openNodeModal(nodeDisplay, nodeUri, nodeType){ // open modal
+ console.log('customdsl >> showModal');
+ nodeDisplay = "Node Details of " + nodeUri;
+ let node = null;
+ let found = false;
+ for(var j = 0; j < this.state.nodes.length && !found; j++){
+ if(this.state.nodes[j].url === nodeUri){
+ node = this.state.nodes[j];
+ found = true;
+ }
+ }
+ if(nodeDisplay && found){
+ this.setState({
+ nodeDisplay: nodeDisplay,
+ focusedNode: node,
+ showNodeModal:true
+ });
+ }else{
+ this.setState({
+ showNodeModal:true
+ });
+ }
+ }
+
+ closeNodeModal = () => {
+ this.setState({
+ showNodeModal: false
+ });
+ }
+
+ componentDidUpdate(prevProps, prevState, snapshot) {
+ if((this.state.isAggregate || this.state.aggregateNodes.length > 0 || this.state.nodes.length > 0) && !this.state.visualAddition){
+ //Visualization.chart('currentState', [], [], this.state.res.data, this);
+ this.setState({
+ visualAddition: true
+ });
+ }
+ }
+ setHistoryType(event) {
+ console.log(event.target.value);
+ let enableCalendar = false;
+ if(event.target.value === 'nodeLifeCycle'){
+ enableCalendar = false;
+ }else{
+ enableCalendar = true;
+ }
+ this.setState({
+ historyType: event.target.value,
+ enableCalendar: enableCalendar
+ });
+ console.log(this.state.enableCalendar);
+ }
+ loadBulkCallback=(loadQueryList)=>{
+ console.log('Start:Load bulk Callback>>>>>>');
+ let filterEntriesList=[];
+ let filterTemplateHeaderList=[];
+ let filterTemplateErrorList=[];
+ let nodeTypeOfDslTemplateList=[];
+ let templateQueryList=[];
+ let valueList=[];
+ this.dslObjectList=[];
+ this.nodeTypeArrayList=[];
+ this.tempDslQueryList=[];
+ this.templateErrorList={};
+ let isAggregateCheckedList=[];
+ let associatedNodesEnabledList=[];
+ let queryNameList=[];
+ let queryDescriptionList=[];
+ let categoryList=[];
+ let isPublicCheckedList=[];
+ let queryIdList=[];
+ let filterTypeDisplayList=[];
+ let isCommunitySharedList = [];
+ let staticTemplateFiltersList=[];
+ for(var idx=0;idx<loadQueryList.length;idx++){
+ let splitString = loadQueryList[idx].split('||');
+ let name = splitString[0];
+ let description = splitString[1];
+ let category=(splitString[2] !== 'undefined')? splitString[2]:'';
+ let dsl = splitString[3];
+ let isAggregate = splitString[4];
+ let type = splitString[5];
+ let queryId = splitString[6];
+ let isCommunityShared = splitString[7];
+ let templateDetails = splitString[8];
+ if(name !== '' && description !== '' && this.state.isSavedQueryFlow){
+ var staticTemplateFilters = templateDetails;
+ if(staticTemplateFilters.length > 0){
+ staticTemplateFilters = JSON.parse(staticTemplateFilters);
+ }else{
+ staticTemplateFilters = [];
+ }
+ staticTemplateFiltersList.push(staticTemplateFilters);
+ queryNameList.push(name);
+ queryIdList.push(queryId);
+ queryDescriptionList.push(description);
+ isPublicCheckedList.push(type === 'public');
+ categoryList.push(category);
+ isCommunitySharedList.push(isCommunityShared);
+ }
+ associatedNodesEnabledList.push(false);
+ if(isAggregate === "true"){
+ isAggregateCheckedList.push(true);
+ }else{
+ isAggregateCheckedList.push(false);
+ }
+ filterTypeDisplayList.push({'default':'Filter Type'});
+ this.setState({
+ queryNameList:queryNameList,
+ queryDescriptionList:queryDescriptionList,
+ categoryList:categoryList,
+ isPublicCheckedList: isPublicCheckedList,
+ queryIdList: queryIdList,
+ filterTemplateEntries:[],
+ filterTemplateError: false,
+ isTypeahead: false,
+ isAggregateCheckedList: isAggregateCheckedList,
+ associatedNodesEnabledList: associatedNodesEnabledList,
+ filterTypeDisplayList: filterTypeDisplayList,
+ downloadTemplateStatus:false,
+ failedDownloadedTemplate:[],
+ failedDownloadedTemplateMsg:'',
+ failedEmailTemplateMsg:'',
+ emailTriggerMsg:'',
+ isMergedTabsChecked: false,
+ staticTemplateFiltersList: staticTemplateFiltersList
+ });
+
+ if(this.state.isSavedQueryFlow){
+
+ dsl=atob(dsl).replace('<pre>','').replace('</pre>','');
+ this.dslObject={};
+ this.nodeTypeArray=[];
+
+ var limitPattern = /limit[\s]\d+|limit\d+/ig;
+ var limitkey = dsl.match(limitPattern);
+ if(limitkey){
+ dsl = dsl.replace(limitkey[limitkey.length-1],'').trim();
+ }
+ dsl = this.alterDslQueryByRemoveSpaces(dsl);
+ //create placeholders for NodeTypes with Propand Propvalues
+ this.tempDslQuery=this.formTempDslQuery(dsl);
+ this.tempDslQueryList.push(this.tempDslQuery);
+ //Preparinga Json Object to render into Placeholder
+ this.contructDslNodes(dsl,'node',false,false,false,false);
+ //Query to replace placeholders with JSON Object values depends on Flow either SavedQuery or TableFilters
+ let query=this.formTemplateQuery('savedQuery',idx,true);
+ query=query.replace(/\'(as)\'/g,'\' as \'').replace(/\(\'\s(as)\s\'\)/g,'(\'as\')');
+ if(limitkey){
+ query+=' '+limitkey[limitkey.length-1];
+ }
+ let filterEntries=[];
+ let filterTemplateHeader={};
+ var errorOccurred=false;
+ Object.keys(this.dslObject).map((key)=>{
+ filterEntries.push(this.dslObject[key]['filterEntries'][0]);
+ filterTemplateHeader[key]= {}
+ filterTemplateHeader[key]=this.dslObject[key]['filterTemplateHeader'][key];
+ if(!errorOccurred){
+ errorOccurred=this.dslObject[key]['errorOccurred'];
+ }
+ });
+ filterEntriesList.push(filterEntries);
+ filterTemplateHeaderList.push(filterTemplateHeader);
+ filterTemplateErrorList.push(errorOccurred);
+ nodeTypeOfDslTemplateList.push(this.nodeTypeArray);
+ templateQueryList.push(query);
+ valueList.push(dsl);
+ this.dslObjectList.push(this.dslObject);
+
+ }
+ }
+ this.setState({ valueList: valueList,
+ templateQueryList: templateQueryList,
+ filterTemplateEntriesList: filterEntriesList,
+ filterTemplateHeaderList:filterTemplateHeaderList,
+ filterTemplateErrorList: filterTemplateErrorList,
+ nodeTypeOfDslTemplateList:nodeTypeOfDslTemplateList,
+ isAggregateCheckedList: isAggregateCheckedList,
+ associatedNodesEnabledList: associatedNodesEnabledList,
+ isInitialLoad:false
+ },()=>{GeneralCommonFunctions.scrollTo('templateList');});
+ }
+ loadCallback = (name, description, category, dslQuery, isAggregate, type, queryId, isCommunityShared, id, templateDetails, makeCall) =>{
+ let filterEntriesList=[];
+ let filterTemplateHeaderList=[];
+ let filterTemplateErrorList=[];
+ let nodeTypeOfDslTemplateList=[];
+ let templateQueryList=[];
+ let valueList=[];
+ this.dslObjectList=[];
+ this.nodeTypeArrayList=[];
+ this.tempDslQueryList=[];
+ this.templateErrorList={};
+ let isAggregateCheckedList=[];
+ let associatedNodesEnabledList=[];
+ let queryNameList=[];
+ let queryDescriptionList=[];
+ let categoryList=[];
+ let isPublicCheckedList=[];
+ let queryIdList=[];
+ let filterTypeDisplayList=[];
+ let isCommunitySharedList=[];
+ let staticTemplateFiltersList=[];
+ let idx=parseInt(id);
+ if(isNaN(idx)){
+ idx=0;
+ }
+ if(name !== '' && description !== '' && this.state.isSavedQueryFlow){
+ queryNameList.push(name);
+ queryIdList.push(queryId);
+ queryDescriptionList.push(description);
+ isPublicCheckedList.push(type === 'public');
+ var staticTemplateFilters = templateDetails;
+ if(staticTemplateFilters.length > 0){
+ staticTemplateFilters = JSON.parse(staticTemplateFilters);
+ }else{
+ staticTemplateFilters = [];
+ }
+ staticTemplateFiltersList.push(staticTemplateFilters);
+ categoryList.push(category);
+ isCommunitySharedList.push(isCommunityShared);
+ this.setState({
+ queryNameList:queryNameList,
+ queryDescriptionList:queryDescriptionList,
+ categoryList:categoryList,
+ isPublicCheckedList: isPublicCheckedList,
+ isCommunitySharedChecked: isCommunityShared === "true",
+ queryIdList: queryIdList,
+ isCommunitySharedList:isCommunitySharedList,
+ staticTemplateFiltersList: staticTemplateFiltersList,
+ downloadTemplateStatus:false,
+ failedDownloadedTemplate:[],
+ failedDownloadedTemplateMsg:'',
+ failedEmailTemplateMsg:'',
+ emailTriggerMsg:'',
+ isMergedTabsChecked: false,
+ isGenerateEmailChecked: false
+ });
+ }
+ //reset any filter template forms
+ this.setState({ filterTemplateEntries: [], filterTemplateError: false, isTypeahead: false});
+ associatedNodesEnabledList.push(false);
+ let associatedNodesEnable=false;
+ let isAggregateChecked=false;
+ if(isAggregate === "true"){
+ isAggregateCheckedList.push(true);
+ isAggregateChecked=true;
+ }else{
+ isAggregateCheckedList.push(false);
+ }
+ this.setState({ isAggregateCheckedList: isAggregateCheckedList, associatedNodesEnabledList: associatedNodesEnabledList,isAggregateChecked:isAggregateChecked,associatedNodesEnabled:associatedNodesEnable});
+ if(this.state.isSavedQueryFlow && !makeCall){
+ this.loadTemplateForm(atob(dslQuery).replace('<pre>','').replace('</pre>',''),idx);
+ }else{
+ this.setState({viewName: this.state.defaultViewName,
+ activePage: 1,
+ aggregateActivePage: 1});
+ this.buildDynamicByoq(atob(dslQuery).replace('<pre>','').replace('</pre>',''), makeCall);
+ }
+ if(this.state.isDSLFlow){
+ GeneralCommonFunctions.scrollTo("jumbotron");
+ }else if(this.state.isSavedQueryFlow){
+ GeneralCommonFunctions.scrollTo("templateList");
+ }
+ }
+
+ editCallback = (name, description, category, dsl, isAggregateStr, type, queryId, isCommunityShared, templateDetails) =>{
+ //Save stated of loaded queries
+ this.state.valuePreviousState = this.state.value;
+ this.state.isAggregateCheckedPreviousState = this.state.isAggregateChecked;
+ this.state.isCommunitySharedCheckedPreviousState = this.state.isCommunitySharedChecked;
+ this.state.associatedNodesEnabledPreviousState = this.state.associatedNodesEnabled;
+
+ let isAggregateChecked = false;
+ let isCommunitySharedChecked = false;
+ let associatedNodesEnabled = false;
+
+ if(isAggregateStr === 'true'){
+ isAggregateChecked = true;
+ associatedNodesEnabled = true;
+ }
+
+ if(isCommunityShared === 'true'){
+ isCommunitySharedChecked = true;
+ }
+
+ var staticTemplateFilters = templateDetails;
+ if(staticTemplateFilters.length > 0){
+ staticTemplateFilters = JSON.parse(staticTemplateFilters);
+ }else{
+ staticTemplateFilters = [];
+ }
+ this.getTreeFromDSL(dsl).then(tree => {
+ this.setState({
+ enableTreeLoadBusyFeedback: false,
+ dslConfigArray: this.getConfigArrayFromDSLTree(tree, [], []),
+ showSaveModal: true,
+ saveSuccessfulMsg: false,
+ isPublicChecked: type === 'public',
+ isEditModal:true,
+ queryName:name,
+ queryDescription:description,
+ category:category,
+ isAggregateChecked: isAggregateChecked,
+ isCommunitySharedChecked: isCommunitySharedChecked,
+ associatedNodesEnabled: associatedNodesEnabled,
+ value: dsl,
+ queryId: queryId,
+ staticTemplateFilters: staticTemplateFilters
+ });
+ });
+ }
+
+ saveTemplate = (idx) => {
+ var saveModal = () => {
+ this.setState(
+ {
+ showSaveModal: true,
+ saveSuccessfulMsg: false,
+ isPublicChecked: this.state.isPublicChecked,
+ isEditModal:false,
+ queryName:'',
+ queryDescription:'',
+ category:'',
+ queryId:'',
+ isPublicChecked: this.state.isPublicCheckedList[idx],
+ isAggregateChecked: this.state.isAggregateCheckedList[idx],
+ enableTreeLoadBusyFeedback: true
+ });
+ this.getTreeFromDSL(this.state.value).then(tree => {
+ this.setState({enableTreeLoadBusyFeedback: false, dslConfigArray: this.getConfigArrayFromDSLTree(tree, [], [])});
+ });
+ }
+ this.populateTemplate(false, saveModal, idx);
+ }
+
+ runTemplate = (idx) =>{
+ this.populateTemplate(true, null, idx);
+ }
+ submitEditAndRunDSL = () =>{
+ this.setState({ showEditModal: false, value: this.state.editModel,aggregateActivePage:1,activePage:1 }, () => this.formQueryString(false,false,false));
+ }
+ showEditDSLModal = (idx) => {
+ console.log("enabling DSL edit modal");
+ var openModal = () => {
+ this.setState({ editModel: this.state.value, enableTreeLoadBusyFeedback: true, showEditModal: true });
+ }
+ this.populateTemplate(false, openModal, idx);
+ }
+ closeEditDSLModal = () => {
+ console.log("closing DSL edit modal");
+ this.setState({ showEditModal: false, enableTreeLoadBusyFeedback: false });
+ }
+ bindEdits = (e) => {
+ this.setState({ editModel: e.target.value });
+ }
+ populateTemplate = (shouldRun, callback, indx) =>{
+ console.log('CustomDSL:populateTemplate this.state>>>>>>>>>>>>>>>>>>>*',this.state);
+ let query=this.formFinalTemplateQuery(indx);
+ console.log('CustomDSL:query>>>>>>>>>*',query);
+ console.log('CustomDSL:query>>>>>>>>>BTOA*',btoa(query));
+ this.setState({ value: query,aggregateActivePage:1,activePage:1}, () => {if(shouldRun){this.formQueryString(false,false,false)}else{callback()}});
+ }
+ formFinalTemplateQuery = (indx)=>{
+ console.log('formFinalTemplateQuery>> forming finalQuery before Run scenarios>>>>');
+ var query = this.state.templateQueryList[indx];
+ for(var i = 0; i < this.state.filterTemplateEntriesList[indx].length; i++){
+ let filterTemplateEntries=this.state.filterTemplateEntriesList[indx][i];
+ Object.keys(filterTemplateEntries).map((key)=>{
+ Object.keys(filterTemplateEntries[key]).map((entry)=>{
+ let templateEntry=filterTemplateEntries[key][entry];
+ if(templateEntry.name !== ''){
+ let templateFilterQuery = "'" + templateEntry.name + "','" + templateEntry.value + "'";
+ console.log('Before templateFilterQuery>>>>>',templateFilterQuery);
+ let valueArray=templateEntry.value.split('^');
+ let typeArray=templateEntry.type.split('^');
+ templateFilterQuery = "'" + templateEntry.name + "'";
+ let templatekeyValues='';
+ for(var x=0;x<valueArray.length;x++){
+ if(valueArray[x] !==''){
+ if(templatekeyValues === ''){
+ templatekeyValues = (this.state.enableRealTime)?typeArray[x] +"('" + valueArray[x] + "')":"'"+valueArray[x]+"'";
+ }else{
+ templatekeyValues = (this.state.enableRealTime)?templatekeyValues+","+typeArray[x] +"('" + valueArray[x] + "')":templatekeyValues+",'"+ valueArray[x] + "'";
+ }
+ }
+ }
+ templateFilterQuery=templateFilterQuery+","+templatekeyValues;
+ console.log('templateFilterQuery>>>>>',templateFilterQuery);
+ query = query.replace('$' + (templateEntry.templateKey + 1),templateFilterQuery);
+ query = query.replace(/\"/g,'\'');
+ }
+ })
+ });
+ }
+ return query;
+ }
+ stripFirstCharacter=(str)=>{
+ return str.substr(1);
+ }
+ stripLastCharacter=(str)=>{
+ return str.substr(0, str.length - 1);
+ }
+ stripFirstTwoCharacter(str){
+ return str.substr(2);
+ }
+ updateTemplateFilterValues=(key,templateKey,value,id,idx)=>{
+ if(value!==''){
+ var filterTemplateEntriesList = this.state.filterTemplateEntriesList;
+ var filterTemplateHeaderList=this.state.filterTemplateHeaderList;
+ var filterMap = filterTemplateEntriesList[idx];
+ var filterTemplateHeader=filterTemplateHeaderList[idx];
+ let idArray=id.split('_');
+ let ind=parseInt(idArray[idArray.length-1]);
+ let finalSelectedProp='';
+ let existing=false;
+ console.log(ind+'<<<updateTemplateFilterValues>>>>'+key+'<><>',value);
+ console.log(templateKey+'filterMap>>>>>>>>>>>>>>>>',filterMap);
+ Object.keys(filterMap).forEach((index) =>{
+ if(filterMap[index][key]){
+ Object.keys(filterMap[index][key]).forEach((i)=>{
+ if(filterMap[index][key][i].templateKey === templateKey){
+ console.log(key+'<<filterMap[index][key][templateKey]>>>'+filterMap[index][key][i]);
+ let filterValue=filterMap[index][key][i].value.split('^');
+ filterValue[ind]=value;
+ filterMap[index][key][i].value=filterValue.join('^');
+ console.log('Updated Filtered Template Entries map' + JSON.stringify(filterMap));
+ if(filterMap[index][key][i].name !== '' ){
+ filterTemplateHeader[key]['propName'] = filterMap[index][key][i].name;
+ existing =true;
+ }else{
+ console.log('set listname >>>>***',filterTemplateHeader[key]['propName']);
+ finalSelectedProp=filterTemplateHeader[key]['propName'];
+ let status=false;
+ if(filterTemplateHeader[key]['propName'] !== this.state.filterDisplay){
+ filterMap[index][key][i].name= filterTemplateHeader[key]['propName'];
+ status=true;
+ }else{
+ filterMap[index][key][i].name= 'ERROR';
+ if(!(this.templateErrorList[idx] && this.templateErrorList[idx].length>0)){
+ this.templateErrorList[idx]=[];
+ }
+ this.templateErrorList[idx].push(key);
+ }
+ let selectedProp=[];
+ console.log('filterTemplateHeader[key][selectedProp]>>>>',filterTemplateHeader[key]['selectedProp']);
+ if(filterTemplateHeader[key]['selectedProp'] && status){
+ selectedProp=filterTemplateHeader[key]['selectedProp'];
+ let indSelect= selectedProp.indexOf(filterTemplateHeader[key]['propName']);
+ if(indSelect !== -1){
+ selectedProp=selectedProp.splice(indSelect,1);
+ filterTemplateHeader[key]['selectedProp']=selectedProp;
+ }
+ }
+ }
+ filterTemplateHeader[key]['enableAnd'] = true;
+ this.updateSavedQueryTemplate('add',key,templateKey,filterMap,filterTemplateHeader,idx);
+ }
+ });
+ }
+ });
+ }
+ // this.setState({filterTemplateError: true});
+}
+updateSavedQueryTemplate=(action,key,templatekey,templateMaps,templateHeader,idx)=>{
+ console.log(action+'updateSavedQueryTemplate>>>>>>>>>>>>>*');
+ let templateEntriesList = this.state.filterTemplateEntriesList;
+ let filterTemplateHeaderList=this.state.filterTemplateHeaderList;
+ let templateEntries = templateEntriesList[idx];
+ let filterTemplateHeader= filterTemplateHeaderList[idx];
+ let finalSelectedProp='';
+ idx=parseInt(idx);
+ if(templateMaps){
+ templateEntries=templateMaps;
+ }
+ if(templateHeader){
+ filterTemplateHeader=templateHeader
+ }
+ let templateQuery = this.state.templateQueryList[idx];
+ if(templateQuery.charAt(templateQuery.length-1) !== ']'){
+ templateQuery=templateQuery+',';
+ }
+ let keyact=isNaN(parseInt(key.substr(key.length-2,key.length-1)));
+ console.log('keyact>>>>****',keyact);
+ console.log('TemplateQuery>>>&&*',templateQuery);
+ let nodeInd=0;
+ let tempkey =key;
+ if(!keyact){
+ let actKey=key.split('-');
+ nodeInd=parseInt(actKey[actKey.length-1]);
+ actKey.splice(actKey.length-1,1);
+ tempkey=actKey.join('-');
+ }
+ let dslObject=this.dslObjectList[idx];
+ if(action === 'add'){
+ Object.keys(dslObject).map((nodekey)=>{
+ if(nodekey === key){
+ let tempEntries=[];
+ Object.keys(templateEntries).map((index) =>{if(templateEntries[index][key] && nodekey === key){ tempEntries= templateEntries[index][key]}});
+ console.log('tempEntries>>>>',tempEntries);
+ dslObject[nodekey]['templateEntries']=tempEntries;
+ dslObject[nodekey]['filterTemplateHeader']=filterTemplateHeader[nodekey];
+ }
+ })
+ }else{
+ let findEntry=true;
+ Object.keys(templateEntries).map((index) =>{
+ console.log('templateEntries[index][key]??????',templateEntries[index][key]);
+ if(templateEntries[index][key]){
+ Object.keys(templateEntries[index][key]).map((i)=>{
+ console.log(i+'templateEntries[index][key][i].templateKey>>>',templateEntries[index][key][i]);
+ if(findEntry && templateEntries[index][key][i].templateKey === templatekey){
+ findEntry=false;
+ let name = templateEntries[index][key][i].name;
+ finalSelectedProp=name;
+ templateEntries[index][key].splice(i,1);
+ filterTemplateHeader[key]['enableAnd'] = true;
+ filterTemplateHeader[key]['propName'] = this.state.filterDisplay;
+ let selectedProp=[];
+ console.log('filterTemplateHeader[key][selectedProp]???????',filterTemplateHeader[key]['selectedProp']);
+ if(filterTemplateHeader[key]['selectedProp']){
+ selectedProp=filterTemplateHeader[key]['selectedProp'];
+ let ind= selectedProp.indexOf(name);
+ if(ind !== -1){
+ selectedProp=selectedProp.splice(ind,1);
+ filterTemplateHeader[key]['selectedProp']=selectedProp;
+ }
+ }
+ if(name=='ERROR'){
+ if(this.templateErrorList[idx] && this.templateErrorList[idx].length>0){
+ this.templateErrorList[idx].pop();
+ }
+ }
+ console.log('selectedProp>>>>',filterTemplateHeader[key]['selectedProp']);
+ }
+ });
+ }
+ });
+ Object.keys(dslObject).map((nodekey)=>{
+ if(nodekey === key && !findEntry){
+ let tempEntries=[];
+ Object.keys(templateEntries).map((index) =>{if(templateEntries[index][key] && nodekey === key){ tempEntries= templateEntries[index][key]}});
+ console.log('Delete tempEntries>>>>',tempEntries);
+ dslObject[nodekey]['templateEntries']=tempEntries;
+ dslObject[nodekey]['filterTemplateHeader']=filterTemplateHeader[nodekey];
+ }
+ })
+ }
+ console.log(action+' .......Update Saved ***************this.dslObject',dslObject);
+ Object.keys(dslObject).map((nodekey)=>{
+ //console.log(nodekey+'this.dslObject[nodekey][0]>>>>>',dslObject[nodekey][0]);
+ //console.log('key>>>>',key);
+ if(nodekey === key && dslObject[nodekey][0]){
+ Object.keys(templateEntries).map((index) =>{
+ console.log('templateEntries[index][key]>>>>',templateEntries[index][key]);
+ if(templateEntries[index][key]){
+ let props='{';
+ Object.keys(templateEntries[index][key]).map((i)=>{
+ console.log(i+'templateEntries[index][key]>>>>',templateEntries[index][key][i]);
+ let prop='';
+ let newProps=(parseInt(i)!==0)?',\''+templateEntries[index][key][i]['name']+'\'':'\''+templateEntries[index][key][i]['name']+'\'';
+ props+=newProps;
+ if(templateEntries[index][key][i].templateKey === templatekey){
+ let name=templateEntries[index][key][i]['name']
+ let value=templateEntries[index][key][i]['value'].split('^');
+ let type=templateEntries[index][key][i]['type'].split('^');
+ prop='(\''+name+'\',';
+ for(var x=0;x<value.length;x++){
+ if(this.state.enableRealTime){
+ prop+=type[x]+'(\''+value[x]+'\')';
+ if(x===value.length-1){
+ prop+=')';
+ }else{
+ prop+=',';
+ }
+ }else{
+ prop+='\''+value[x]+'\'';
+ if(x===value.length-1){
+ prop+=')';
+ }else{
+ prop+=',';
+ }
+ }
+ }
+ let values=dslObject[nodekey][0]['values'];
+ //console.log('values>>>>>',values);
+ if(values && values.length>0){
+ let findState=false;
+ let errorPropMsg=null;
+ for(var n=0;n<values.length;n++){
+ if(values[n].indexOf('!(\''+name+'\'') !==-1){
+ values[n]='!'+prop;
+ findState=true;
+ }else if(values[n].indexOf('(\''+name+'\'') !==-1){
+ values[n]=prop;
+ findState=true;
+ }
+ if(values[n].indexOf('(\'ERROR\',') !==-1){
+ errorPropMsg=n;
+ }
+ }
+ if(errorPropMsg){
+ values.splice(errorPropMsg,1);
+ }
+ if(!findState){
+ values.push(prop);
+ }
+ dslObject[nodekey][0]['values']=values;
+ }else{
+ dslObject[nodekey][0]['values']=[];
+ dslObject[nodekey][0]['values'].push(prop);
+ }
+ //console.log(prop+'this.dslObject[nodekey][0][values]>>>>',dslObject[nodekey][0]['values']);
+ }
+ });
+ props+='}';
+ if(action!=='add' && dslObject[nodekey][0]['values']){
+ dslObject[nodekey][0]['values'].splice(idx,1);
+ }
+ }
+ });
+ }
+ });
+ //console.log('After Setting ***************this.dslObject',dslObject);
+ this.dslObjectList[idx]=dslObject;
+ let queryList=this.state.templateQueryList;
+ let dslquery=queryList[idx];
+ var limitPattern = /limit[\s]\d+|limit\d+/ig
+ var limitkey = dslquery.match(limitPattern);
+ //this.tempDslQuery=this.formTempDslQuery(dsl);
+ let query=this.formTemplateQuery('savedQuery',idx);
+ query=query.replace(/\'(as)\'/g,'\' as \'').replace(/\(\'\s(as)\s\'\)/g,'(\'as\')');
+ if(limitkey){
+ query+=' '+limitkey[limitkey.length-1];
+ }
+ console.log('query>>>>>>>>>>>>>',query);
+ queryList[idx]=query;
+ templateEntriesList[idx]=templateEntries;
+ filterTemplateHeaderList[idx]=filterTemplateHeader;
+ this.setState({filterTemplateEntriesList:templateEntriesList,filterTemplateHeaderList:filterTemplateHeaderList,templateQueryList:queryList});
+
+ }
+ capturingGroups=(dsl)=>{
+ var capturedGroups=[];
+ let findGroup=true;
+ var block = dsl;
+ do{
+ var startIndex = block.indexOf('['),/* index of first bracket */
+ currPos = startIndex,
+ openBrackets = 0,
+ stillSearching = true,
+ waitForChar = false;
+ if(currPos === -1){
+ findGroup=false;
+ }
+ while (stillSearching && currPos <= block.length) {
+ var currChar = block.charAt(currPos);
+ switch (currChar) {
+ case '[':
+ openBrackets++;
+ break;
+ case ']':
+ openBrackets--;
+ break;
+ }
+ currPos++
+ if (openBrackets === 0) { stillSearching = false; }
+ }
+ console.log('capturingGroups>>>>>>>>>>>>',block.substring(startIndex , currPos));
+ if(block.substring(startIndex , currPos) !==''){
+ capturedGroups.push(block.substring(startIndex , currPos));
+ block=block.replace(block.substring(startIndex , currPos),'#$')
+ }
+ }while(findGroup);
+ return capturedGroups;
+ }
+ formTempDslQuery=(dsl) =>{
+ let tempQuery='';
+ tempQuery=dsl.replace(/\!\((?:[^>)(]|\((?:[^)(]+)\))*\)/g,'').replace(/\((?:[^>)(]|\((?:[^)(]+)\))*\)/g,'').replace(/\{(.*?)\}/g,'').replace(/\*/g,'').trim('')+',';
+ tempQuery = tempQuery.replace(/\s+/g, '');
+ tempQuery=tempQuery.replace(/[a-zA-Z0-9*\-]/g,'#').replace(/\!\!/g,'!').replace(/\!\>/g,'>');
+ tempQuery=tempQuery.replace(/\#(.*?)(?=\>|\!|\(|\)|\,|\])/g,'#').trim('');
+ tempQuery=this.stripLastCharacter(tempQuery);
+ return tempQuery;
+ }
+ loadTemplateForm=(dsl,idx) =>{
+ console.log('loadTemplateForm>>>idx>>>>',idx);
+ this.dslObject={};
+ this.nodeTypeArray=[];
+ var limitPattern = /limit[\s]\d+|limit\d+/ig;
+ var limitkey = dsl.match(limitPattern);
+ if(limitkey){
+ dsl = dsl.replace(limitkey[limitkey.length-1],'').trim();
+ }
+ dsl = this.alterDslQueryByRemoveSpaces(dsl);
+ //create placeholders for NodeTypes with Propand Propvalues
+ this.tempDslQuery=this.formTempDslQuery(dsl);
+ this.tempDslQueryList.push(this.tempDslQuery);
+ //Preparinga Json Object to render into Placeholder
+ this.contructDslNodes(dsl,'node',false,false,false,false);
+ console.log('dsl>>>>>>>>>>>>>',dsl);
+ //Query to replace placeholders with JSON Object values depends on Flow either SavedQuery or TableFilters
+ let query=this.formTemplateQuery('savedQuery',idx,true);
+ query=query.replace(/\'(as)\'/g,'\' as \'').replace(/\(\'\s(as)\s\'\)/g,'(\'as\')');
+ if(limitkey){
+ query+=' '+limitkey[limitkey.length-1];
+ }
+ let filterEntries=[];
+ let filterTemplateHeader={};
+ var errorOccurred=false;
+ console.log('before setting DSLOBJECT>>',this.dslObject);
+ Object.keys(this.dslObject).map((key)=>{
+ filterEntries.push(this.dslObject[key]['filterEntries'][0]);
+ filterTemplateHeader[key]= {}
+ filterTemplateHeader[key]=this.dslObject[key]['filterTemplateHeader'][key];
+ if(!errorOccurred){
+ errorOccurred=this.dslObject[key]['errorOccurred'];
+ }
+ });
+ let filterEntriesList=[];
+ let filterTemplateHeaderList=[];
+ let filterTemplateErrorList=[];
+ let nodeTypeOfDslTemplateList=[];
+ let templateQueryList=[];
+ let valueList=[];
+ if(idx === 0){
+ this.setState({ valueList: [],
+ templateQueryList: [],
+ filterTemplateEntriesList: [],
+ filterTemplateHeaderList:[],
+ filterTemplateErrorList: [],
+ nodeTypeOfDslTemplateList:[]
+ });
+ }
+ filterEntriesList.push(filterEntries);
+ filterTemplateHeaderList.push(filterTemplateHeader);
+ filterTemplateErrorList.push(errorOccurred);
+ nodeTypeOfDslTemplateList.push(this.nodeTypeArray);
+ templateQueryList.push(query);
+ valueList.push(dsl);
+ this.dslObjectList.push(this.dslObject);
+ this.setState({ valueList: valueList,
+ templateQueryList: templateQueryList,
+ filterTemplateEntriesList: filterEntriesList,
+ filterTemplateHeaderList:filterTemplateHeaderList,
+ filterTemplateErrorList: filterTemplateErrorList,
+ nodeTypeOfDslTemplateList:nodeTypeOfDslTemplateList,
+ isInitialLoad:false
+ },()=>{GeneralCommonFunctions.scrollTo('templateList');});
+
+ }
+ formTemplateQuery=(flow,idx,state)=>{
+ let query='';
+ let count = 0;
+ let tempDslQueryArr=(idx !== undefined && !state)?this.tempDslQueryList[idx].split('#'):this.tempDslQuery.split('#');
+ let newCustomQuery=(idx !== undefined && !state)?this.dslObjectList[idx]:this.dslObject;
+ Object.keys(newCustomQuery).map((key)=>{
+ query='';
+ let newDslObject=newCustomQuery[key][0];
+ let filterValues='';
+ if(newDslObject){
+ //console.log('this>>>>>>>>>>>>>>>>>>>>>>',this);
+ if(flow==='savedQuery'){
+ //reformed the DSL Object with Filter Entries and Template Entries
+ this.formTemplateFilterValues(newDslObject['values'],newDslObject['nodeName'],key,idx);
+ let entries=[];
+ if(newCustomQuery[key]['templateEntries']){
+ entries=newCustomQuery[key]['templateEntries'];
+ }else{
+ entries='';
+ }
+ filterValues=(newDslObject['values']) ? this.replaceFilterValues(newDslObject['values'],entries) :'';
+ }else{
+ filterValues=(newDslObject['values'])? this.formFilterValues(newDslObject['values']):'';
+ }
+ query+=newDslObject['nodeName'];
+ if(newDslObject['props']){
+ query+=newDslObject['props'];
+ }
+ if(newDslObject['values']){
+ query+=filterValues;
+ }
+ tempDslQueryArr[count]=tempDslQueryArr[count]+query;
+ count++;
+ }
+ });
+ query=tempDslQueryArr.join('');
+ return query;
+ }
+ contructDslNodes=(dsl,type,groupStart,groupEnd,edgeStart,edgeEnd)=>{
+ console.log(type+'contructDslNodes>>>>>>>>>>>>>>',dsl);
+ dsl=dsl.replace(/\s*\,\s*/g, ',')
+ var declareEdgePattern=/\(\>(?:[^)(]+|\((?:[^)(]+|\([^)(]*\))*\))*\)|\!\(\>(?:[^)(]+|\((?:[^)(]+|\([^)(]*\))*\))*\)/g;
+ let localEdges=dsl.match(declareEdgePattern);
+ let edgesDsl=dsl;
+ if(localEdges){
+ this.edgesArray=localEdges.concat(this.edgesArray);
+ edgesDsl=dsl.replace(declareEdgePattern,'>@$');
+ edgesDsl=edgesDsl.replace(/\!\>\@\$/g,'>!@$');
+ }
+ //capturing relations group b/w [] Parent only
+ let relations=this.capturingGroups(edgesDsl);
+ if(relations){
+ this.relationsArray=relations.concat(this.relationsArray);
+ for(var z in relations){
+ edgesDsl=edgesDsl.replace(relations[z],'#$');
+ }
+ }
+ //console.log('edgesDsl to padd getDslNodes>>>>>',edgesDsl);
+ this.getDslNodes(edgesDsl,type,groupStart,groupEnd,edgeStart,edgeEnd);
+}
+
+ getDslNodes=(dsl,type,groupStart,groupEnd,edgeStart,edgeEnd)=>{
+ console.log('getDslNodes>>>>',dsl);
+ let dslArray=[];
+ let localDslNodes='';
+ let relations=false;
+ let edges=false;
+ let traversal=false;
+ dslArray = dsl.split('>');
+ if(type === 'relationalNode'){
+ traversal=(dsl.indexOf('#$') === -1 && dslArray.length>1 && dsl.indexOf('@$') === -1);
+ }
+ for(var i=0;i<dslArray.length;i++){
+ if(dslArray[i] !== ''){
+ if(dslArray[i] === '#$'){//RelationalNode
+ //relations to be enables
+ localDslNodes=this.relationsArray[0];
+ console.log(dslArray[i]+'<<<dslArray[i] localDslNodes>>>>>>>****>>>>',localDslNodes);
+ localDslNodes=this.stripLastCharacter(this.stripFirstCharacter(localDslNodes));
+ type='relationalNode';
+ this.relationsArray=this.relationsArray.slice(1,this.relationsArray.length);
+ this.getDslRelationalNodes(localDslNodes,type);
+ }else if(dslArray[i].trim() === '@$' || dslArray[i].trim() === '!@$'){//EdgeNode
+ //edges should be enable
+ localDslNodes=this.edgesArray[0];
+ type='edgeNode'
+ localDslNodes=this.stripLastCharacter(localDslNodes);
+ if(localDslNodes.startsWith('!')){
+ localDslNodes=localDslNodes.substr(3);
+ type='negEdgeNode';
+ }else{
+ localDslNodes=localDslNodes.substr(2);
+ type='edgeNode';
+ }
+ this.edgesArray=this.edgesArray.slice(1,this.edgesArray.length);
+ this.getDslEdgeNodes(localDslNodes,type);
+ }
+ //node,traversal,relationalEdges
+ let x=i+1;
+ if(dslArray[x] && dslArray[x] === '#$'){
+ relations=true;
+ }
+ if(dslArray[x] && dslArray[x] === '@$'){
+ edges=true;
+ }
+ let tStart=(parseInt(i) === 0 && traversal)?true:false;
+ let tEnd=(parseInt(i) === dslArray.length-1 && traversal)?true:false;
+ if(i === dslArray.length-1){
+ if(type==='edgeNode' || type === 'negEdgeNode'){
+ edgeEnd=true;
+ edgeStart=(dslArray.length===1)?true:false;
+ groupStart=false;
+ groupEnd=false;
+ }else if(type==='relationalNode'){
+ edgeEnd=false;
+ edgeStart=false;
+ }else{
+ groupStart=false;
+ groupEnd=false;
+ edgeEnd=false;
+ edgeStart=false;
+ }
+ }
+ if(!(dslArray[i] === '#$' || dslArray[i].trim() === '@$' || dslArray[i].trim() === '!@$')){
+ dslArray[i]=dslArray[i].replace(/\,$/g,'').replace(/\]$/g,'').replace(/\>$/g,'').trim();
+ this.formDslObject(dslArray[i],type,groupStart,groupEnd,relations,traversal,tStart,tEnd,edges,edgeStart,edgeEnd);
+ }
+ }
+ }
+ console.log('<<formDslObject>>>>>',JSON.stringify(this.dslObject));
+}
+getDslEdgeNodes=(edgesDsl,type)=>{
+ //space for future changes
+ this.contructDslNodes(edgesDsl,type,false,false,true,false);
+}
+getDslRelationalNodes=(relationDsl,type)=>{
+ console.log('getDslRelationalNodes>>>>>>>>>>>>',relationDsl)
+ //var dslRelationNodes=relationDsl.substring(relationDsl.indexOf('['),relationDsl.lastIndexOf(']')+1);
+ let dslRelationNodes=this.capturingGroups(relationDsl);
+ let dslRelations= relationDsl;
+ if(dslRelationNodes){
+ for(var z in dslRelationNodes){
+ dslRelations=dslRelations.replace(dslRelationNodes[z],'#$');
+ }
+ this.relationsArray=dslRelationNodes.concat(this.relationsArray);
+ }
+ let relationsList=dslRelations.replace(/\((?:[^)(]+|\((?:[^)(]+)\))*\)/g,'').replace(/\{(.*?)\}/g,'').trim('').replace(/\>\#\$/g,'').replace(/\>\@\$/g,'').replace(/\>\!\@\$/g,'').replace(/\!/g,'').split(',');
+ dslRelations=','+dslRelations+'&&';
+ let groupStart=false;
+ let groupEnd=false;
+ //relationsList: have all Relations like node [node1>#$,node2,node3>node4]: possible to contain EdgeNodes,Traversal condition and inner relationNodes
+ for(var k in relationsList){
+ console.log(k+'relationsList>>>>**',relationsList);
+ if(parseInt(k)===0){
+ groupStart=true;
+ groupEnd=false;
+ }else if(parseInt(k) === relationsList.length-1){
+ groupStart=false;
+ groupEnd=true;
+ }else{
+ groupStart=false;
+ groupEnd=false;
+ }
+ if(relationsList.length === 1){
+ groupStart=true;
+ groupEnd=true;
+ }
+ var relationPattern='';
+
+ console.log('dslRelations>>>>>>>>>>>>',dslRelations);
+ let pattern=relationsList[k]+"(.*?)>\\#\\$(?=\\,|\\&&)|"+relationsList[k]+"(.*?)>\\@\\$(?=\\,|\\&&)|"+relationsList[k]+"(.*?)>\\!\\@\\$(?=\\,|\\&&)";
+ console.log('pattern>>>>>',pattern);
+ let relationP1 = new RegExp(pattern, 'g');
+ let findDslRelation=dslRelations.match(relationP1);
+ console.log('findDslRelation>>>>>>',findDslRelation);
+ if(findDslRelation){//dslRelations.indexOf(relationsList[k]+'>#') !==-1 || dslRelations.indexOf(relationsList[k]+'>@$') !==-1){
+ relationPattern="(?:[^-]"+relationsList[k].split('>')[0]+"(.*?)(?=\,[a-z]|&&))|"+"(?:[^-]"+relationsList[k].split('>')[0]+"(?=\,[a-z]|&&))";
+ }else if(dslRelations.indexOf(relationsList[k]+',#') !== -1){
+ relationPattern="(?:[^-]"+relationsList[k]+"(.*?)(?=\,#))|"+"(?:[^-]"+relationsList[k]+"(?=\,#))";
+ }else if(relationsList[k] !== '#$'){
+ relationPattern="(?:[^-|^>]"+relationsList[k]+"(.*?)(?=\,[a-z]|>|&&))|"+"(?:[^-|^>]"+relationsList[k]+"(?=\,[a-z]|>|&&))";
+ }
+ if(relationsList[k] !== '#$'){
+ console.log(k+'for relationPattern>>>',relationPattern);
+ console.log(k+'for dslRelations>>>>',dslRelations);
+ let relationPatternExp = new RegExp(relationPattern, 'g');
+ let dslRelationArray=dslRelations.match(relationPatternExp);
+ console.log(k+'for dslRelationArray>>>>',dslRelationArray);
+ if(dslRelationArray){
+ for(var j in dslRelationArray){
+ console.log('dslRelationArray[j]>>>',dslRelationArray[j]);
+ let dslRelationNode=null;
+ dslRelationArray[j]= dslRelationArray[j].substr(1);
+ dslRelations=dslRelations.replace(dslRelationArray[j],'@');
+ console.log('groupStart>>>>>>>>>>',groupStart);
+ this.contructDslNodes(dslRelationArray[j],type,groupStart,groupEnd);
+ }
+ }else{
+ var relationPatternArray=relationsList[k].split('>');
+ relationPattern='';
+ for(var x=0;x<relationPatternArray.length;x++){
+ if(x === 0){
+ relationPattern=relationPatternArray[x]+'(.*?)';
+ }else{
+ relationPattern=relationPattern+'>'+relationPatternArray[x]+'(.*?)';
+ if(x===relationPatternArray.length-1){
+ relationPattern=relationPattern+'(?=\,[a-z]|&&)';
+ }
+ }
+ }
+ console.log('relationPattern>>>>>>',relationPattern);
+ relationPatternExp = new RegExp(relationPattern, 'g');
+ dslRelationArray=dslRelations.match(relationPatternExp);
+ if(dslRelationArray){
+ dslRelations=dslRelations.replace(dslRelationArray[0],'@');
+ console.log('dslRelationArray!!!!!!!!!!!!!>>>>>',dslRelationArray);
+ this.contructDslNodes(dslRelationArray[0],type,groupStart,groupEnd);
+ }
+ }
+ }else{
+ let localDslNodes=this.relationsArray[0];
+ relationsList[k]=this.stripLastCharacter(this.stripFirstCharacter(localDslNodes));
+ this.relationsArray=this.relationsArray.slice(1,this.relationsArray.length);
+ console.log('relationsList[k]>***>>>',relationsList[k]);
+ //dslRelations=dslRelations.replace(dslRelationArray[j],'@');
+ this.contructDslNodes(relationsList[k],type,groupStart,groupEnd);
+
+ }
+ }
+}
+formDslObject=(dslArray,type,groupStart,groupEnd,relationState,traversal,tStart,tEnd,edges,eStart,eEnd,id)=>{
+ let nodeType=dslArray.replace(/\((?:[^)(]+|\((?:[^)(]+)\))*\)/g,'').replace(/\{(.*?)\}/g,'').replace(/\!/g,'').trim('');
+ let props=dslArray.match(/\{(.*?)\}/g);
+ let propValues=dslArray.match(/\((?:[^)(]+|\((?:[^)(]+)\))*\)|\!\((?:[^)(]+|\((?:[^)(]+)\))*\)/g);
+ var entries=[]
+ var entry = {};
+ entry.type = type;
+ entry.relationsStart = groupStart;
+ entry.relationsEnd= groupEnd;
+ entry.relations=relationState;
+ entry.nodeName = nodeType;
+ entry.props=props;
+ entry.traversal=traversal;
+ entry.traversalStart=tStart;
+ entry.traversalEnd=tEnd;
+ entry.edgeEnable=(edges)?edges:false;
+ entry.edgeStart=(eStart)?eStart:false;
+ entry.edgeEnd=(eEnd)?eEnd:false;
+ entry.values=propValues;
+ entries.push(entry);
+ let entityId=nodeType.replace(/\*/g,'');
+ if(!this.nodeTypeArray.includes(entityId)){
+ this.nodeTypeArray.push(entityId);
+ this.dslObject[entityId] = entries;
+ }else{
+ let newNodeType='';
+ let repeatMode=true;
+ for(var n=1;n<=this.nodeTypeArray.length;n++){
+ if(!this.nodeTypeArray.includes(entityId+'-'+n) && repeatMode){
+ newNodeType=entityId+'-'+n;
+ repeatMode=false;
+ }
+ }
+ this.nodeTypeArray.push(newNodeType);
+ this.dslObject[newNodeType] = entries;
+ }
+ console.log('nodeTypeArray>>>>',this.nodeTypeArray);
+ console.log('this.dslObject>>>>',this.dslObject);
+}
+formFilterValues=(propValues)=>{
+ let templateQuery='';
+ let negQuery='';
+ for(var k = 0; k < propValues.length; k++){
+ if(propValues[k].indexOf('!') !== -1){
+ negQuery += propValues[k];
+ }else{
+ templateQuery += propValues[k];
+ }
+ }
+ if(negQuery!==''){
+ templateQuery+=negQuery;
+ }
+ console.log('templateQuery>>>>>>>>>>>>',templateQuery);
+ return templateQuery;
+}
+replaceFilterValues=(propValues,entries)=>{
+ console.log(propValues+'<<<propValues>>>>>',entries);
+ let templateQuery='';
+ let negQuery='';
+ let count=1;
+ for(var k = 0; k < propValues.length; k++){
+ let templatekey=(entries)?entries[k].templateKey+1:count;
+ if(propValues[k].indexOf('!') !== -1){
+ negQuery += "!($" + templatekey + ")";
+ }else{
+ templateQuery += "($" + templatekey + ")";
+ }
+ count++;
+ }
+ if(negQuery!==''){
+ templateQuery+=negQuery;
+ }
+ console.log('templateQuery>>>>>>>>>>>>',templateQuery);
+ return templateQuery;
+}
+formTemplateFilterValues=(propvalues,nodeName,nodeId,idx)=>{
+ let filterTemplateHeader = {};
+ let filterEntries=[];
+ var spaceRemoverPattern=/\,\s/g;
+ var errorOccurred = false;
+ var filterTypeDisplayArray = this.state.filterTypeDisplayList;
+ let filterTypeDisplay= {'default':'Filter Type'};
+ if(!filterTypeDisplayArray[idx] || filterTypeDisplayArray[idx] === undefined){
+ filterTypeDisplayArray.push(filterTypeDisplay);
+ }
+ var entries = [];
+ var filterTypeEntries =[];
+ var selectedProp=[];
+ if(propvalues){
+ for(var i = 0; i < propvalues.length; i++){
+ console.log('propvalues['+i+']>>>>',propvalues[i]);
+ var entry = {};
+ let propVal = '';
+ if(propvalues[i].indexOf('!') !==-1){
+ propVal=this.stripLastCharacter(this.stripFirstTwoCharacter(propvalues[i].trim()));
+ }else{
+ propVal=this.stripLastCharacter(this.stripFirstCharacter(propvalues[i].trim()));
+ }
+ propVal = propVal.replace(spaceRemoverPattern,',');
+ //console.log('propVal>>>>>>>>>>>',propVal);
+ var matchesList = propVal.split(/',|\),/g)
+ //console.log('matchesList>>>>',matchesList);
+ let type='';
+ let value='';
+ let errorFound=true;
+ let entryState=true;
+ for(var n=0;n<matchesList.length;n++){
+ let scenario=true;
+ let found=true;
+ if(n==0){
+ entry.name = this.stripFirstCharacter(matchesList[n].trim());
+ selectedProp.push(this.stripFirstCharacter(matchesList[n].trim()));
+ }else{
+ let obj={};
+ var lastChar=matchesList[n].charAt(matchesList[n].length-1);
+ for(var x in filterTypeList){
+ if(found){
+ let pattern= new RegExp('^'+filterTypeList[x]+'\\((.*?)', 'g');
+ var filterExist=matchesList[n].match(pattern);
+ //console.log(matchesList[n]+'filterExist>>>>>',filterExist);
+ if(filterExist){
+ var nodevalue='';
+ if(lastChar===')'){
+ nodevalue=matchesList[n].replace(filterTypeList[x],'').replace(/\(\'/,'').replace(/\'\)/,'');
+ }else{
+ nodevalue=this.stripLastCharacter(matchesList[n].replace(filterTypeList[x],'').replace(/\(\'/,''));
+ }
+ //console.log('before srtip>>>',nodevalue);
+ type=(type==='')?filterTypeList[x]:type+'^'+filterTypeList[x];
+ value=(value==='')?nodevalue:value+'^'+nodevalue;
+ scenario=false;
+ found=false;
+ errorFound=false;
+ entryState=false;
+ obj[entry.templateKey+1] = filterTypeList[x];
+ filterTypeEntries.push(obj);
+ console.log('filterTypeDisplayArray....>*',filterTypeEntries);
+ }
+ }
+ console.log(found+'found>>>>>>>>>>>>',value);
+ }
+ if(scenario){
+ console.log('inside else');
+ type=(type==='')?'EQ':type+'^'+'EQ';
+ let val=this.stripFirstCharacter(matchesList[n].trim());
+ if(lastChar == '\''){
+ val=this.stripLastCharacter(val);
+ }
+ value=(value==='')?val:value+'^'+val;
+ entryState=false;
+ found=false;
+ errorFound=false;
+ }
+ }
+ }
+ if(!entryState){
+ entry.type =type;
+ entry.value = value;
+ entry.templateKey = i;
+ entries.push(entry);
+ }
+ if(errorFound && !errorOccurred){
+ errorOccurred=true;
+ }
+ }
+ }
+ console.log('Initial Filtered Template Entries ' + JSON.stringify(entries));
+ //nodeTypeOfDsl.push(nodeTypes[z]);
+ let obj = {};
+ obj[nodeId] = entries;
+ filterTemplateHeader[nodeId]= {};
+ filterTemplateHeader[nodeId]['enableAnd'] = true;
+ filterTemplateHeader[nodeId]['propName'] = this.state.filterDisplay;
+ filterTemplateHeader[nodeId]['selectedProp']=selectedProp;
+ filterEntries.push(obj)
+ filterTypeDisplayArray[idx][nodeId] = filterTypeEntries;
+ let dslObject=this.dslObjectList[idx];
+ if(dslObject){
+ dslObject[nodeId]['filterTemplateHeader']= filterTemplateHeader;
+ dslObject[nodeId]['filterEntries']=filterEntries;
+ dslObject[nodeId]['errorOccurred']=errorOccurred;
+ this.dslObjectList[idx]=dslObject;
+ }else{
+ this.dslObject[nodeId]['filterTemplateHeader']= filterTemplateHeader;
+ this.dslObject[nodeId]['filterEntries']=filterEntries
+ this.dslObject[nodeId]['errorOccurred']=errorOccurred;
+ }
+ }
+
+ onAssociatedNodesCheckbox(e) {
+ var cbValue = false;
+ if (e.target.checked) {
+ cbValue = true;
+ }else {
+ cbValue = false;
+ }
+ this.setState({ associatedNodesEnabled: cbValue });
+ }
+ onAggregateCheckbox(e) {
+ var cbValue = false;
+ if (e.target.checked) {
+ cbValue = true;
+ this.setState({associatedNodesEnabled: false});
+ }else {
+ cbValue = false;
+ }
+ this.setState({ isAggregateChecked: cbValue });
+ }
+ onPublicCheckbox(e) {
+ var cbValue = false;
+ if (e.target.checked) {
+ cbValue = true;
+ this.setState({ isPublicChecked: cbValue, isCommunitySharedChecked: false });
+ }else {
+ cbValue = false;
+ this.setState({ isPublicChecked: cbValue });
+ }
+ }
+ onMergedTabsCheckbox(e){
+ var cbValue = false;
+ if (e.target.checked) {
+ cbValue = true;
+ this.setState({ isMergedTabsChecked: cbValue});
+ }else {
+ cbValue = false;
+ this.setState({ isMergedTabsChecked: cbValue });
+ }
+ }
+ onGenerateEmailButton(){
+ let path='email-bulk-dsl-to-excel';
+ this.generatebulkDslToExcel(path,true);
+ }
+ onCommunitySharedCheckbox(e) {
+ var cbValue = false;
+ if (e.target.checked) {
+ cbValue = true;
+ }else {
+ cbValue = false;
+ }
+ this.setState({ isCommunitySharedChecked: cbValue });
+ }
+ onDslConfigCheckbox(e, key) {
+ var cbValue = false;
+ var staticTemplateFilters = this.state.staticTemplateFilters;
+ if (e.target.checked) {
+ cbValue = true;
+ staticTemplateFilters = staticTemplateFilters.filter(e => e !== key);
+ }else {
+ cbValue = false;
+ staticTemplateFilters.push(key);
+ }
+ this.setState({ staticTemplateFilters: staticTemplateFilters });
+ }
+ handleOnFilter = (columnFilter,value) =>{
+ console.log('handleOnFilter to Re-render', this.state.columnFilter);
+ var applyState = true;
+ if(value === ''){
+ for(var i= 0; i < columnFilter.length; i++){
+ var x = columnFilter[i];
+ console.log('handleOnfilter ColumnFilterList.....',Object.keys(x));
+ Object.keys(x).forEach(function(key){
+ if(x[key] !==''){
+ applyState=false;
+ }
+ });
+ }
+ }else{
+ applyState = false;
+ }
+
+ this.setState({columnFilter : columnFilter,reRender:true,disableFilter: applyState});
+ }
+
+ alterDslQueryByRemoveSpaces = (dslQuery) =>{
+ var p2='';
+ if((dslQuery.indexOf('(>') !==-1) || (dslQuery.indexOf('!(>') !==-1)){
+ p2=/\((?:[^>)(]|\((?:[^)(]+)\))*\)/g;
+ }
+ else{
+ p2 = /\((?:[^)(]+|\((?:[^)(]+)\))*\)/g;
+ }
+ var prop = dslQuery.match(p2);
+ var spacepattern = /\s(?!(^)]*\()/g;
+ var newDslQuery='';
+ if(prop && prop.length > 0){
+ var x = dslQuery.replace(p2,'{*$}');
+ var matchStr = x.replace(spacepattern,'');
+ var propArray=matchStr.split('{*$}');
+ for(var i in prop){
+ newDslQuery=newDslQuery+propArray[i]+prop[i];
+ }
+ newDslQuery = newDslQuery + propArray[propArray.length-1];
+ }else{
+ newDslQuery = dslQuery.replace(spacepattern,'');
+ }
+ newDslQuery = newDslQuery.trim();
+ console.log('New DSl Query after alterDslQueryByRemoveSpaces>>>>>>',newDslQuery);
+ return newDslQuery;
+ }
+
+ isTableFilterForAggregation = (columnFilterList,columnsList) => {
+ console.log('isTableFilterForAggregation:aggregateTableFilterColumns>>>>>>',this.state.aggregateTableFilterColumns);
+ //console.log('isTableFilterForAggregation:columnFilterList>>>>>>>>',columnFilterList);
+ var nodeTypeArray = [];
+ var columnsList = {};
+ var filterMessage = {};
+ var j = 0;
+ for(var i= 0; i < columnFilterList.length; i++){
+ var x = columnFilterList[i];
+ console.log('isTableFilterForAggregation:Aggregate columnFilterList.....',Object.keys(x));
+ var propValue = '';
+ Object.keys(x).forEach((key)=>{
+ var grabNode = key.split("|");
+ let indx=false;
+ let index='';
+ if(nodeTypeArray.indexOf(grabNode[0]) === -1){
+ nodeTypeArray.push(grabNode[0]);
+ j = j + 1;
+ indx=true;
+ index=j-1;
+ }else{
+ index=nodeTypeArray.indexOf(grabNode[0]);
+ }
+
+ if(!columnsList[nodeTypeArray[index]]){
+ columnsList[nodeTypeArray[index]] = [];
+ }
+ if(!filterMessage[nodeTypeArray[index]]){
+ filterMessage[nodeTypeArray[index]]=[];
+ }
+ let col='';
+ if(this.tableFilterAliasColumns[grabNode[0]][0] && this.tableFilterAliasColumns[grabNode[0]][0][grabNode[1]]){
+ col=this.tableFilterAliasColumns[grabNode[0]][0][grabNode[1]];
+ }else{
+ col=grabNode[1];
+ }
+ if(columnsList[nodeTypeArray[index]].indexOf(col) === -1){
+ columnsList[nodeTypeArray[index]].push(col);
+ if(x[key] != ''){
+ let filterMsg = '';
+ if(this.state.enableRealTime){
+ filterMsg='(\''+col +'\'' + ',' + TABULAR_FILTER_TYPE+'(\'' + x[key]+ '\'))';
+ }else{
+ filterMsg='(\''+col +'\'' + ',' + '\'' + x[key] + '\')';
+ }
+ filterMessage[nodeTypeArray[j-1]].push(filterMsg);
+ }
+ }
+ propValue=x[key];
+ });
+ }
+ console.log('isTableFilterForAggregation:nodeTypeArray><><><>',nodeTypeArray);
+ console.log('isTableFilterForAggregation:columnsList<><><>',columnsList);
+ console.log('isTableFilterForAggregation:filterMessage>>>>>>>>',filterMessage);
+ let dslQuery = this.state.value;
+ var limitPattern = /limit[\s]\d+|limit\d+/ig
+ var limitkey = dslQuery.match(limitPattern);
+ if(limitkey){
+ dslQuery = dslQuery.replace(limitkey[limitkey.length-1],'').trim();
+ }
+ dslQuery = this.alterDslQueryByRemoveSpaces(dslQuery);
+ //New adding
+ this.dslObject={};
+ this.nodeTypeArray=[];
+ //create placeholders for NodeTypes with Propand Propvalues
+ this.tempDslQuery=this.formTempDslQuery(dslQuery);
+ //Preparing Json Object to render into Placeholder
+ this.contructDslNodes(dslQuery,'node',false,false,false,false);
+ console.log('dslQuerydsl>>>>>>>>>>>>>',dslQuery);
+ //adding
+ Object.keys(this.dslObject).map((nodekey)=>{
+ let nodeNo=parseInt(nodekey.substr(nodekey.length-2,nodekey.length-1).replace(/\-/g,''));
+ console.log('nodeNo>>>>>>>>>>>>>>',nodeNo);
+ let keyact=isNaN(nodeNo);
+ let nodeType=nodekey;
+ let actKey=nodekey.split('-');
+ console.log(nodeType+'>>>>nodeType<<<<nodeType>>>>',actKey);
+ if(!keyact){
+ actKey.splice(actKey.length-1,1);
+ nodeType=actKey.join('-')+nodeNo;
+ }
+ if(!nodeTypeArray.includes(nodeType) && nodeTypeArray.includes(actKey.join('-'))){
+ nodeType=actKey.join('-');
+ }
+ console.log('nodeType>>>>>>>>>>',nodeType);
+ var columns = columnsList[nodeType];
+ var filterMsg= filterMessage[nodeType];
+ console.log('CustomDsl js filterMsg:',filterMsg);
+ if(nodeType && this.dslObject[nodekey][0]){
+ if(filterMsg && filterMsg.length>0){
+ for(var i=0;i<filterMsg.length;i++){
+ let values=this.dslObject[nodekey][0]['values'];
+ let nonExist=true
+ let columnCompare=filterMsg[i].split(',')[0];
+ if(values && values.length>0){
+ for(var n=0;n<values.length;n++){
+ console.log('values[n].indexOf(columnCompare)>>>>',values[n].indexOf(columnCompare));
+ if(values[n].indexOf(columnCompare) !==-1 && values[n].indexOf('!'+columnCompare) ===-1){
+ values[n]=filterMsg[i];
+ nonExist=false;
+ }
+ }
+ if(nonExist){
+ this.dslObject[nodekey][0]['values'].push(filterMsg[i]);
+ }else{
+ this.dslObject[nodekey][0]['values']=values;
+ }
+ }else{
+ this.dslObject[nodekey][0]['values']=[];
+ this.dslObject[nodekey][0]['values'].push(filterMsg[i]);
+ }
+ }
+ }
+ }
+ });
+ this.dslObjectList =[];
+ this.dslObjectList.push(this.dslObject);
+ //Query to replace placeholders with JSON Object values depends on Flow either SavedQuery or TableFilters
+ let newDslQuery=this.formTemplateQuery('tableFilter');
+ newDslQuery=newDslQuery.replace(/\'(as)\'/g,'\' as \'').replace(/\(\'\s(as)\s\'\)/g,'(\'as\')');
+ if(limitkey){
+ newDslQuery+=' '+limitkey[limitkey.length-1];
+ }
+ console.log('query>>>>>>>>>>>>>>>>>>>>>****',newDslQuery);
+ this.setState({value : newDslQuery, viewName: "CellLayout", aggregateActivePage:1}, function () { this.formQueryString(false,false,false); }.bind(this));
+ //End
+ }
+
+ isTableFilterApply = (columnFilterList,nodeTypeList,columnsList,aliasColumnList) => {
+ console.log('CustomDSL js ....columnFilterList:',columnFilterList);
+ console.log('CustomDSL js .... nodeTypeList:',nodeTypeList);
+ var nodeTypeListArray = [];
+ if(!Array.isArray(nodeTypeList)){
+ nodeTypeListArray.push(nodeTypeList);
+ nodeTypeList = nodeTypeListArray;
+ }
+ console.log('CustomDSL js .... nodeTypeList After set:',nodeTypeList);
+ var dslQuery = this.state.value;
+ var limitPattern = /limit[\s]\d+|limit\d+/ig
+ var limitkey = dslQuery.match(limitPattern);
+ if(limitkey){
+ dslQuery = dslQuery.replace(limitkey[limitkey.length-1],'').trim();
+ }
+ dslQuery = this.alterDslQueryByRemoveSpaces(dslQuery);
+ //New adding
+ this.dslObject={};
+ this.nodeTypeArray=[];
+ //create placeholders for NodeTypes with Propand Propvalues
+ this.tempDslQuery=this.formTempDslQuery(dslQuery);
+ //Preparinga Json Object to render into Placeholder
+ this.contructDslNodes(dslQuery,'node',false,false,false,false);
+ console.log('dslQuerydsl>>>>>>>>>>>>>',dslQuery);
+ //adding
+ Object.keys(this.dslObject).map((nodekey)=>{
+ var nodeType=this.dslObject[nodekey][0]['nodeName'].replace(/\*/g,'');
+ console.log('nodeType>>>>>>>>>>',nodeType);
+ var columnFilter = (columnFilterList[nodeType])?columnFilterList[nodeType][0]:[];
+ var aliasColumnFilters = (aliasColumnList[nodeType])?aliasColumnList[nodeType][0]:[];
+ console.log('CustomDsl js columnFilter:',columnFilter);
+ var columns = columnsList[nodeType];
+ console.log('CustomDsl js Columns:',columns);
+ if(columns && columnFilter.length>0){
+ for(var i=0;i<columns.length;i++){
+ console.log(columnFilter[i]+'<<<<<<columnFilter[i]columns[i].value>>>>',columns[i]);
+ var colAliasFilter='';
+ for(var z=0;z<aliasColumnFilters.length;z++){
+ if(aliasColumnFilters[z][columns[i].value]){
+ colAliasFilter=aliasColumnFilters[z][columns[i].value];
+ }
+ }
+ var colFilterValue = columnFilter[i][columns[i].value];
+ if(colFilterValue != ""){
+ let filterMsg = '';
+ let col=(colAliasFilter)?colAliasFilter:columns[i].value;
+ if(this.state.enableRealTime){
+ filterMsg='(\''+col +'\'' + ',' + TABULAR_FILTER_TYPE+'(\'' + colFilterValue + '\'))';
+ }else{
+ filterMsg='(\''+col +'\'' + ',' +'\'' + colFilterValue + '\')';
+ }
+ let values=this.dslObject[nodekey][0]['values'];
+ let nonExist=true;
+ if(values && values.length>0){
+ for(var n=0;n<values.length;n++){
+ if(values[n].indexOf('(\''+col+'\'') !==-1 && values[n].indexOf('!(\''+col+'\'') ===-1){
+ values[n]=filterMsg;
+ nonExist=false;
+ }
+ }
+ if(nonExist){
+ this.dslObject[nodekey][0]['values'].push(filterMsg);
+ }else{
+ this.dslObject[nodekey][0]['values']=values;
+ }
+ }else{
+ this.dslObject[nodekey][0]['values']=[];
+ this.dslObject[nodekey][0]['values'].push(filterMsg);
+ }
+ }
+ }
+ }
+ });
+ //Query to replace placeholders with JSON Object values depends on Flow either SavedQuery or TableFilters
+ this.dslObjectList =[];
+ this.dslObjectList.push(this.dslObject);
+ let newDslQuery=this.formTemplateQuery('tableFilter');
+ newDslQuery=newDslQuery.replace(/\'(as)\'/g,'\' as \'').replace(/\(\'\s(as)\s\'\)/g,'(\'as\')');
+ if(limitkey){
+ newDslQuery+=' '+limitkey[limitkey.length-1];
+ }
+ console.log('query>>>>>>>>>>>>>>>>>>>>>****',newDslQuery);
+ this.setState({value : newDslQuery, viewName: "CellLayout", activePage:1}, function () { this.formQueryString(false,false,false); }.bind(this));
+ //End
+ }
+
+ onTargetMenuOfFilterTypes = (listName,id) => {
+ console.log('onTargetMenuOfFilterTypes>>>>',listName);
+ let idArray=id.split('#');
+ let key=idArray[0];
+ let templateKey=parseInt(idArray[1]);
+ let filterTypeIndex = parseInt(idArray[2]);
+ let idx= parseInt(idArray[3]);
+ var filterTypeDisplayList = this.state.filterTypeDisplayList;
+ var filterTypeDisplayArray = filterTypeDisplayList[idx];
+ Object.keys(filterTypeDisplayArray).map((entry) => {
+ if(entry === key){
+ console.log('filterTypeDisplayArray.entry....',filterTypeDisplayArray[entry]);
+ if(filterTypeDisplayArray[entry][templateKey]){
+ filterTypeDisplayArray[key][templateKey] = listName;
+ }else{
+ let obj={};
+ obj[templateKey+1]=listName;
+ filterTypeDisplayArray[key].push(obj);
+ }
+ }
+ });
+ let filterTemplateEntriesList = this.state.filterTemplateEntriesList;
+ var filterTemplateEntriesArray = filterTemplateEntriesList[idx];
+ Object.keys(filterTemplateEntriesArray).map((entry)=>{
+ if(filterTemplateEntriesArray[entry][key]){
+ Object.keys(filterTemplateEntriesArray[entry][key]).map((ind) =>{
+ if(filterTemplateEntriesArray[entry][key][ind].templateKey === templateKey){
+ let type=filterTemplateEntriesArray[entry][key][ind].type.split('^');
+ if(type[filterTypeIndex]){
+ type[filterTypeIndex]=listName
+ }else{
+ type.push(listName);
+ }
+ filterTemplateEntriesArray[entry][key][ind].type=type.join('^');
+ }
+ })
+ }
+ });
+ console.log('onTargetMenuOfFilterTypes filterTemplateEntriesArray>>>',filterTemplateEntriesArray);
+ filterTemplateEntriesList[idx]=filterTemplateEntriesArray;
+ filterTypeDisplayList[idx]=filterTypeDisplayArray;
+ this.setState({filterTypeDisplayList:filterTypeDisplayList,filterTemplateEntriesList:filterTemplateEntriesList});
+ }
+ filterTags = (type,templateKey,key,idx) =>{
+ console.log(key+'<<<filterTags>>>>>*',type);
+ let filterType = (type === '')? this.state.filterTypeDisplayList[idx]['default']:type;
+ let filterTag = '';
+ if(APERTURE_SERVICE && this.state.enableRealTime){
+ console.log(filterType+'before passing Filter>*',this.state);
+ let filterTypesArray=filterType.split('^');
+ let filters = Object.keys(filterTypesArray).map((index)=>{
+ return <div style={{margin:'0px 0px 0px 5px'}}>
+ <label>
+ <FilterTypes param={this.state}
+ selectedFilter={filterTypesArray[index]}
+ id={key+'#'+templateKey+'#'+index+'#'+idx}
+ onMenuSelect={this.onTargetMenuOfFilterTypes} />
+ </label>
+ </div>
+ });
+ filterTag=<td width='20%'>{filters}</td>;
+ }
+ return filterTag;
+ }
+ populateFilteredColumnOptions = (nodekey,indx) =>{
+ let keyact=isNaN(parseInt(nodekey.substr(nodekey.length-2,nodekey.length-1)));
+ let actColumns ='';
+ if(keyact){
+ actColumns =this.populateColumnOptions(nodekey);//this.populateColumnOptions(key);
+ }else{
+ let actKey=nodekey.split('-');
+ actKey.splice(actKey.length-1,1);
+ actColumns =this.populateColumnOptions(actKey.join('-'));
+ }
+ let filterTemplateEntries=this.state.filterTemplateEntriesList[indx];
+ let filterTemplateHeader=this.state.filterTemplateHeaderList[indx];
+ let selectedColumns=[];
+ Object.keys(filterTemplateEntries).map((index) => {
+ let filterTemplateEntry = filterTemplateEntries[index];
+ Object.keys(filterTemplateEntry).map((key) =>{
+ let filterTemplateEntryKey=filterTemplateEntry[key];
+ if(nodekey === key){
+ Object.keys(filterTemplateEntryKey).sort().map((entryKey, entry) => {
+ if(filterTemplateEntryKey[entryKey].name !==''){
+ let index=actColumns.indexOf(filterTemplateEntryKey[entryKey].name);
+ actColumns.splice(index,1);
+ selectedColumns.push(filterTemplateEntryKey[entryKey].name);
+ }
+ });
+ filterTemplateHeader[key]['selectedProp']=selectedColumns;
+ }
+ });
+ });
+ return actColumns;
+ };
+ /**AND OR functionality */
+ addAndTemplate = (key,idx) =>{
+ console.log('addAndTemplate:key',key);
+ let templateEntriesList = this.state.filterTemplateEntriesList;
+ let filterTemplateHeaderList= this.state.filterTemplateHeaderList;
+ let templateEntries = this.state.filterTemplateEntriesList[idx];
+ let filterTemplateHeader= this.state.filterTemplateHeaderList[idx];
+ Object.keys(templateEntries).map((index) =>{
+ Object.keys(templateEntries[index]).map((entryKey)=>{
+ if(entryKey === key){
+ let length=templateEntries[index][entryKey].length;
+ let tempKey = (length===0)?length:templateEntries[index][entryKey][length-1].templateKey+1;
+ let obj ={}
+ obj['name']='';
+ obj['value']='';
+ obj['type']=(this.state.enableRealTime)?'EQ':'';
+ obj['templateKey']=tempKey;
+ obj['addition']=true;
+ templateEntries[index][entryKey].push(obj);
+ //templateEntries[index][entryKey]['enableAnd']=false;
+ filterTemplateHeader[key]['enableAnd'] = false;
+ filterTemplateHeader[key]['propName'] = this.state.filterDisplay;
+ }
+ });
+ });
+ templateEntriesList[idx]=templateEntries;
+ filterTemplateHeaderList[idx]=filterTemplateHeader;
+ this.setState({filterTemplateHeaderList:filterTemplateHeaderList,filterTemplateEntriesList:templateEntriesList});
+ }
+ addOrTemplate = (key,name,templateKey,idx) =>{
+ console.log('addOrTemplate: key',key);
+ let templateEntriesList = this.state.filterTemplateEntriesList;
+ let templateEntries = templateEntriesList[idx];
+ Object.keys(templateEntries).map((index) =>{
+ Object.keys(templateEntries[index]).map((entryKey)=>{
+ let templateEntry=templateEntries[index][entryKey];
+ if(entryKey === key){
+ Object.keys(templateEntry).map((entry)=>{
+ if(templateEntry[entry].templateKey === templateKey){
+ let value = templateEntry[entry].value;
+ let type = templateEntry[entry].type;
+ templateEntry[entry].value=value+'^';
+ let fType=(this.state.enableRealTime)?'EQ':'';
+ templateEntry[entry].type=type+'^'+fType;
+ templateEntry[entry].name = name;
+ }
+ })
+ }
+ });
+ });
+ console.log('addOrTemplate templateEntries>>>>',templateEntries);
+ templateEntriesList[idx]=templateEntries;
+ this.setState({filterTemplateEntriesList:templateEntriesList});
+ }
+ deleteOrTemplate = (key,templatekey,id,idx) =>{
+ console.log('deleteOrTemplate');
+ let templateEntriesList = this.state.filterTemplateEntriesList;
+ let templateEntries = templateEntriesList[idx];
+ let delIndx=parseInt(id.split('-')[1]);
+ Object.keys(templateEntries).map((index) =>{
+ if(templateEntries[index][key]){
+ Object.keys(templateEntries[index][key]).map((i)=>{
+ if(templateEntries[index][key][i].templateKey===templatekey){
+ let valueArray = templateEntries[index][key][i].value.split('^');
+ let typeArray = templateEntries[index][key][i].type.split('^');
+ valueArray.splice(delIndx,1);
+ typeArray.splice(delIndx,1)
+ console.log('valueArray>>>>>>',valueArray);
+ templateEntries[index][key][i].value=valueArray.join('^');
+ templateEntries[index][key][i].type=typeArray.join('^');
+ }
+ })
+ }
+ });
+ console.log('deleteOrTemplate templateEntries>>>>',templateEntries);
+ templateEntriesList[idx]=templateEntries;
+ this.setState({filterTemplateEntriesList:templateEntriesList});
+ }
+ updatePropertyFilter = (listName,idkey) =>{
+ console.log('updatePropertyFilter:',listName)
+ let keys=idkey.split('#');
+ let key=keys[0];
+ let idx=parseInt(keys[2]);
+ let templateKey=parseInt(keys[1]);
+ let filterTemplateHeaderList = this.state.filterTemplateHeaderList;
+ let filterTemplateHeader= filterTemplateHeaderList[idx];
+ var filterTemplateEntriesList = this.state.filterTemplateEntriesList;
+ var filterMap = filterTemplateEntriesList[idx];
+ filterTemplateHeader[key]['propName']=listName;
+ //this.setState({filterTemplateHeader:filterTemplateHeader});
+ let status=false;
+ Object.keys(filterMap).forEach((index) =>{
+ if(filterMap[index][key]){
+ Object.keys(filterMap[index][key]).forEach((i)=>{
+ if(filterMap[index][key][i].templateKey === templateKey){
+ if(filterMap[index][key][i].name === 'ERROR'){
+ filterMap[index][key][i].name= listName;
+ let selectedProp=[];
+ console.log('filterTemplateHeader[key][selectedProp]>>>>',filterTemplateHeader[key]['selectedProp']);
+ if(filterTemplateHeader[key]['selectedProp']){
+ selectedProp=filterTemplateHeader[key]['selectedProp'];
+ let indSelect= selectedProp.indexOf(listName);
+ if(indSelect !== -1){
+ selectedProp=selectedProp.splice(indSelect,1);
+ filterTemplateHeader[key]['selectedProp']=selectedProp;
+ }
+ }
+ filterTemplateHeader[key]['enableAnd'] = true;
+ console.log('ERRROOR CONDITION HANDLING!!!!');
+ this.templateErrorList[idx].pop();
+ this.updateSavedQueryTemplate('add',key,templateKey,filterMap,filterTemplateHeader,idx);
+ }else{
+ console.log('Regular Scenario>>>>>');
+ filterTemplateHeaderList[idx]=filterTemplateHeader;
+ this.setState({filterTemplateHeaderList:filterTemplateHeaderList});
+ }
+ }
+ })
+ }
+ });
+ };
+ /** */
+ prepareDownloadRangeModel = () =>{
+ let downloadExcelsFunc= this.getAllExcels;
+ if(this.state.isAggregate){
+ downloadExcelsFunc=this.downloadAllAggregate;
+ }
+ let downloadRangeModel = (this.state.showDownloadResultsModal)? <DownloadRangeModel
+ showDownloadResultsModal={this.state.showDownloadResultsModal}
+ totalPages={this.state.totalPages}
+ totalResults={this.state.totalResults}
+ triggerDownload={downloadExcelsFunc}
+ errorDownloadResults={this.state.errorDownloadResults}
+ downloadErrorMsg={this.state.downloadErrorMsg}
+ triggerClose={this.closeDownloadResults}
+ enableModelBusyFeedback={this.state.enableModelBusyFeedback}
+ /> : '';
+ return downloadRangeModel;
+ }
+ toggleRealTimeAnalysisCallback=(checked)=>{
+ console.log('toggleRealTimeAnalysisCallback>>>>',checked);
+ sessionStorage.setItem(ENVIRONMENT + 'ENABLE_ANALYSIS', !checked);
+ TABULAR_FILTER_TYPE=(APERTURE_SERVICE && !checked)?'CONTAINS':'=';
+ this.baseState.enableRealTime=!checked;
+ this.baseState.header='';
+ this.baseState.templateQuery='';
+ this.baseState.filterTemplateEntries=[];
+ this.baseState.filterTemplateHeader=[];
+ this.baseState.filterTemplateError=false;
+ this.baseState.nodeTypeOfDslTemplate=[];
+ this.baseState.filterTemplateEntriesList=[];
+ this.baseState.filterTemplateHeaderList=[];
+ this.baseState.filterTemplateErrorList=[];
+ this.baseState.nodeTypeOfDslTemplateList=[];
+ this.baseState.templateQueryList=[];
+ this.baseState.valueList=[];
+ this.dslObject={};
+ this.nodeTypeArray=[];
+ this.dslObjectList=[];
+ this.nodeTypeArrayList=[];
+ this.edgesArray=[];
+ this.relationsArray=[];
+ this.tempDslQuery='';
+ this.tempDslQueryList=[];
+ this.templateError=[];
+ this.templateErrorList={};
+ this.setState({...this.baseState},()=>{this.buildDynamicByoq();});
+ }
+ templateheaderSaveQuery = (id)=>{
+ console.log('templateheaderSaveQuery>>>>>>>>>>>>>',id);
+ let templateSavedQuery = '';
+ let entityKeyAddition = 1;
+ let templateheaderSaveQuery = '';
+ let filterTemplateHeaderList = this.state.filterTemplateHeaderList;
+ //templateheaderSaveQuery=Object.keys(this.state.filterTemplateEntriesList).map((id)=>{
+ //let tempheaderSavedQuery=''
+ if(this.state.filterTemplateEntriesList[id].length > 0 && !this.state.filterTemplateErrorList[id]){
+ let filterTemplateEntries=this.state.filterTemplateEntriesList[id];
+ let staticTemplateFilters = this.state.staticTemplateFiltersList[id];
+ templateheaderSaveQuery= <div>
+ {Object.keys(filterTemplateEntries).map((index) => {
+ let filterTemplateEntry = filterTemplateEntries[index];
+ return Object.keys(filterTemplateEntry).map((key) =>{
+ let filterTemplateEntryKey=filterTemplateEntry[key];
+ let columns =this.populateFilteredColumnOptions(key,id);//this.populateColumnOptions(key);
+ return <table className='table table-hover table-striped savedQueryTemplate' style={{margin:'0px',padding:'2px'}} id={'table_'+key}>
+ <thead>
+ <tr>
+ <th colSpan='2'>{key.toUpperCase()}</th>
+ {this.state.enableRealTime && <th width='20%'></th>}
+ <th width={(this.state.enableRealTime)?'30%':'25%'}></th>
+ <th width={(this.state.enableRealTime)?'20%':'25%'}>
+ <button id={key+'_addAND'} className='btn btn-secondary' disabled ={!filterTemplateHeaderList[id][key]['enableAnd']} type='button' onClick={e => {this.addAndTemplate(key,id)}}>Add Filter</button>
+ </th>
+ </tr>
+ </thead>
+ <tbody>
+ {Object.keys(filterTemplateEntryKey).sort().map((entryKey, entry) => {
+ entityKeyAddition = parseInt(entryKey) + 2;
+ let valueArray = filterTemplateEntryKey[entryKey].value.split('^');
+ console.log("Comparing Static Array: " + JSON.stringify(staticTemplateFilters) + " with " + key + "|" + filterTemplateHeaderList[id][key]['propName']);
+ if(staticTemplateFilters.indexOf(key + "|" + filterTemplateEntryKey[entryKey].name) === -1 ){
+ return(
+ <tr>
+ <td width={(this.state.enableRealTime)?'10%':'25%'}>
+ <label>{'$' + (filterTemplateEntryKey[entryKey].templateKey + 1)}</label>
+ </td>
+ <td width={(this.state.enableRealTime)?'20%':'25%'}>
+ {filterTemplateEntryKey[entryKey].name !== '' && filterTemplateEntryKey[entryKey].name !== 'ERROR' && <label>{filterTemplateEntryKey[entryKey].name}</label>}
+ {filterTemplateEntryKey[entryKey].name === '' && <SelectFilter param={this.state}
+ filterList={columns}
+ id={key+'#'+filterTemplateEntryKey[entryKey].templateKey+'#'+id}
+ selectedFilter={filterTemplateHeaderList[id][key]['propName']}
+ onMenuSelect={this.updatePropertyFilter}/>}
+ {filterTemplateEntryKey[entryKey].name === 'ERROR' && <div className='inputBoxError'><SelectFilter param={this.state}
+ filterList={columns}
+ id={key+'#'+filterTemplateEntryKey[entryKey].templateKey+'#'+id}
+ selectedFilter={this.state.filterDisplay}
+ onMenuSelect={this.updatePropertyFilter}/></div>}
+ </td>
+ {this.filterTags(filterTemplateEntryKey[entryKey].type,filterTemplateEntryKey[entryKey].templateKey,key,id)}
+ <td width={(this.state.enableRealTime)?'30%':'25%'}>
+ {Object.keys(valueArray).map((indx) =>{
+ return(
+ <div style={{margin:'5px'}}>
+ {valueArray[indx] === '' && <input id={key+'_'+indx} onBlur={e => this.updateTemplateFilterValues(key,filterTemplateEntryKey[entryKey].templateKey,e.target.value,e.target.id,id)}/>}
+ {valueArray[indx] !== '' && <input id={key+'_'+valueArray[indx]+'_'+indx} value={valueArray[indx]} onChange={e => this.updateTemplateFilterValues(key,filterTemplateEntryKey[entryKey].templateKey,e.target.value,e.target.id,id)}/>}
+ {indx == 0 && <button className={(filterTemplateEntryKey[entryKey].name !== '')?'btn btn-primary':'btn btn-secondary'} style={{padding:'2px',margin:'0px 0px 7px 5px'}} disabled={filterTemplateEntryKey[entryKey].name === ''} type='button' onClick={e => {this.addOrTemplate(key,filterTemplateEntryKey[entryKey].name,filterTemplateEntryKey[entryKey].templateKey,id)}}>+</button>}
+ {indx>0 && <button style={{padding:'2px',margin:'0px 0px 7px 5px'}} id={'delete-'+indx} className='btn btn-danger' type='button' onClick={e => {this.deleteOrTemplate(key,filterTemplateEntryKey[entryKey].templateKey,e.target.id,id)}}>x</button> }
+ </div>
+ )
+ })}
+ </td>
+ <td width={(this.state.enableRealTime)?'20%':'25%'}>
+ {filterTemplateEntryKey[entryKey].addition &&<button id='deleteAnd' className='btn btn-secondary' type='button' onClick={e => {this.updateSavedQueryTemplate('delete',key,filterTemplateEntryKey[entryKey].templateKey,'','',id)}}>Delete</button>}
+ </td>
+ </tr>);
+ }else {
+ return;
+ }
+ })}
+ </tbody>
+ </table>
+ })
+ })}
+ </div>
+ }
+ return templateheaderSaveQuery;
+ };
+ downloadBulkDslToExcel = () =>{
+ console.log('downloadBulkDslToExcel>>>>>>>>>>>');
+ let path='bulk-dsl-to-excel';
+ this.generatebulkDslToExcel(path,false)
+ }
+ generatebulkDslToExcel = (path,state) =>{
+ this.setState({isLoading: true});
+ Object.keys(settings).forEach((key)=>{
+ if(key==='ISAPERTURE' || key==='ISTABULAR'){
+ delete settings[key];
+ }
+ })
+ let mergedTabs=this.state.isMergedTabsChecked;
+ var payload = {'headers':{
+ 'X-DslApiVersion':'V2',
+ 'use-aperture': this.state.enableRealTime,
+ 'schema-version': INVLIST.VERSION,
+ 'merge-tabs':mergedTabs,
+ 'accept': 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
+ },'dsls': []};
+
+ Object.keys(this.state.queryNameList).map((index)=>{
+ if(!this.state.filterTemplateErrorList[index]){
+ let query=this.formFinalTemplateQuery(index);
+ let obj={
+ "query-id": parseInt(index)+1,
+ "query-name": this.state.queryNameList[index],
+ "query-description": this.state.queryDescriptionList[index],
+ "is-aggregate": this.state.isAggregateCheckedList[index],
+ "dsl": query
+ };
+ payload['dsls'].push(obj);
+ }
+ });
+ var email='';
+ if(state){
+ let userid = sessionStorage.getItem(ENVIRONMENT + 'userId');
+ if(userid ==='testuid'){// For testing Purpose
+ email='AAI-UI-DEV@list.att.com';
+ }else{
+ email=userid+EMAIL_EXT;
+ }
+ payload['headers']['email'] = email;
+ }
+ console.dir('CustomDSL:payload:' + JSON.stringify(payload));
+ commonApi(settings, path, 'POST', payload, '',GlobalExtConstants.OVERRIDE_DOMAIN, null, [{
+ "name":"X-DslApiVersion",
+ "value": "V2"},
+ {
+ "name":"use-aperture",
+ "value": this.state.enableRealTime
+ },
+ {
+ "name":"schema-version",
+ "value":INVLIST.VERSION},
+ {
+ "name":"accept",
+ "value":"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
+ },{
+ "name":"encode-response",
+ "value":true}
+ ])
+ .then(res => {
+ let success =true;
+ let failures=[];
+ if(!state){
+ if(res['headers']['failures']){
+ failures=res['headers']['failures'].split(',');
+ for (var i = 0; i < failures.length; i++) {
+ var a = failures[i].split('|');
+ a.splice(1, 1);
+ failures[i] = a.join();
+ }
+ success=false;
+ }else{
+ let filename='';
+ if(res['headers']['content-disposition']){
+ filename=res['headers']['content-disposition'].split('=')[1];
+ }else if(res['headers']['Content-Disposition']){
+ filename=res['headers']['content-disposition'].split('=')[1];
+ }
+ const blob = new Blob([this.s2ab(atob(res.data))],
+ { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;base64,'});
+ const url = window.URL.createObjectURL(blob);
+ const anchor = document.createElement('a');
+ document.body.appendChild(anchor);
+ anchor.href = url;
+ anchor.download = filename;
+ anchor.click();
+ window.URL.revokeObjectURL(url);
+ }
+ this.setState({
+ isLoading: false,
+ downloadTemplateStatus:success,
+ failedDownloadedTemplate:failures,
+ failedDownloadedTemplateMsg:'',
+ failedEmailTemplateMsg:'',
+ emailTriggerMsg:''
+ },()=>{GeneralCommonFunctions.scrollTo("downloadTemplateStatusAlert");});
+ }else{
+ let emailTriggerMsg='';
+ let failedEmailTriggerMsg='';
+ success=false;
+ failures=[];
+ if(res.status === 202){
+ emailTriggerMsg='The job has been successfully triggered. The results will be emailed to '+ email +' when finished.'
+ }else{
+ failedEmailTriggerMsg='Failed to Generate an Email for selected template queries';
+ }
+ this.setState({
+ isLoading: false,
+ downloadTemplateStatus:success,
+ failedDownloadedTemplate:failures,
+ failedDownloadedTemplateMsg:'',
+ failedEmailTemplateMsg:failedEmailTriggerMsg,
+ emailTriggerMsg:emailTriggerMsg
+ },()=>{GeneralCommonFunctions.scrollTo("downloadTemplateStatusAlert");});
+ }
+ }).catch(error => {
+ console.log('Bulk download xls Catch the Error>>>>>',error.response);
+ let ErrorMessage=(state)?'Failed to Generate an Email for selected template queries':'Failed to Download selected template queries';
+ if (error.response && error.response.data) {
+ if(error.response.data.status){
+ ErrorMessage += " Code: " + error.response.data.status;
+ }
+ if(error.response.data.msg){
+ ErrorMessage += " - " + JSON.stringify(error.response.data.msg);
+ }
+ }
+ if(state){
+ this.setState({
+ isLoading: false,
+ downloadTemplateStatus:false,
+ failedDownloadedTemplate:[],
+ failedDownloadedTemplateMsg:'',
+ failedEmailTemplateMsg:ErrorMessage
+ },()=>{GeneralCommonFunctions.scrollTo("downloadTemplateStatusAlert");});
+ }else{
+ this.setState({
+ isLoading: false,
+ downloadTemplateStatus:false,
+ failedDownloadedTemplate:[],
+ failedDownloadedTemplateMsg:ErrorMessage,
+ failedEmailTemplateMsg:'',
+ emailTriggerMsg:''
+ },()=>{GeneralCommonFunctions.scrollTo("downloadTemplateStatusAlert");});
+ }
+
+ });
+ }
+ s2ab=(s)=> {
+ var buf = new ArrayBuffer(s.length);
+ var view = new Uint8Array(buf);
+ for (var i=0; i!=s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
+ return buf;
+ }
+ templateList = () =>{
+ var filterTypeHeader='';
+ if(APERTURE_SERVICE){
+ filterTypeHeader = (this.state.enableRealTime)?<th scope='col' width='20%'>Filter Type</th>:'';
+ }
+ var listOfTemplate=[];
+ Object.keys(this.state.filterTemplateEntriesList).map((idx)=>{
+ let templateList =<div id={"template_"+idx} className="col-lg-10 templateview">
+ {this.state.filterTemplateEntriesList[idx].length > 0 && !this.state.filterTemplateErrorList[idx] &&
+ <div className='card d3-model-card model-card-content'>
+ <Alert id='saveSuccess' bsStyle='success' className={this.state.saveSuccessfulMsg && !this.state.isEditModal ? 'show' : 'hidden'} onDismiss={() => this.setState({saveSuccessfulMsg: false})}>
+ <h3>Query Saved Successfully</h3>
+ <p>
+ {this.state.saveSuccessfulMsg}
+ </p>
+ </Alert>
+ <div className='card-header'>
+ <div>
+ <h3><strong>{parseInt(idx)+1}.{this.state.queryNameList[idx]}</strong> - {this.state.queryDescriptionList[idx]}</h3>
+ </div>
+ </div>
+ <div>
+ <div className='card-header'>
+ <h5>{this.state.templateQueryList[idx]}</h5>
+ </div>
+ <table className="table table-hover table-striped" style={{margin:'0px',padding:'2px'}}>
+ <thead>
+ <tr>
+ <th scope="col" width={(this.state.enableRealTime)?'10%':'25%'}>Filter Key</th>
+ <th scope="col" width={(this.state.enableRealTime)?'20':'25%'}>Filter Name</th>
+ {filterTypeHeader}
+ <th scope="col" width={(this.state.enableRealTime)?'30%':'25%'}>Filter Value</th>
+ <th scope="col" width={(this.state.enableRealTime)?'20%':'25%'}> Action</th>
+ </tr>
+ </thead>
+ </table>
+ </div>
+ <div className='card-content model-card-content' style={{margin:'0px'}}>
+ {this.templateheaderSaveQuery(idx)}
+ </div>
+ <div className='card-footer'>
+ <button id='runSavedQuery' className='btn btn-primary btn-space' type='button' onClick={e => {this.runTemplate(idx)}}>Run Query</button>
+ <button id='manualEditQuery' className='btn btn-secondary btn-space' type='button' onClick={e =>{this.showEditDSLModal(idx)}} disabled={this.templateError.length>0}>Manual Edit & Run</button>
+ <button id='saveQuery' className='btn btn-outline-secondary btn-space' type='button' onClick={e =>{this.saveTemplate(idx)}} disabled={this.templateError.length>0}>Save</button>
+ <div className={'checkbox ' + (GlobalExtConstants.INVLIST.IS_ONAP ? 'hidden' : '' )}>
+ <label>
+ <input type="checkbox" id='aggregateObjects' checked={this.state.isAggregateCheckedList[idx]} onChange={this.onAggregateCheckbox.bind(this)} />
+ Aggregate Objects
+ </label>
+ </div>
+ </div>
+ </div>
+ }
+ {this.state.queryNameList[idx] && this.state.filterTemplateEntriesList[idx].length === 0 && !this.state.filterTemplateErrorList[idx] &&
+ <div className='addPaddingTop alert alert-warning' role="alert">
+ No filters present to populate for this saved query, please run as is or edit the query manually and run.
+ </div>
+ }
+ {this.state.filterTemplateErrorList[idx] &&
+ <div className='addPaddingTop alert alert-danger' role="alert">
+ An error occurred in parsing the template, please try a different template or contact the data steward to resolve this issue.
+ </div>
+ }
+ </div>;
+ listOfTemplate.push(templateList);
+ });
+ console.log('listOfTemplate>>>>>#####>>>>>>>',listOfTemplate);
+ return listOfTemplate;
+ }
+
+
+ render(){
+ let downloadRangeModel = this.prepareDownloadRangeModel();
+ let templateList= this.templateList();
+ var toggelRealtimeAnalysis = '';
+ var emailCheckbox = <div className={(this.dslObjectList.length>0)?'show':'hidden'}>
+ <div className="checkbox">
+ <OverlayTrigger placement='top' overlay={<Tooltip id='tooltip-top'>{'Report will be generated and emailed to '+sessionStorage.getItem(ENVIRONMENT + 'userId')+'@att.com when finished'}</Tooltip>}>
+ <span className="d-inline-block" style={{display: 'inline-block'}}>
+ <Button bsSize='small' disabled={(this.dslObjectList.length===0)} onClick={() => {this.onGenerateEmailButton()}}>
+ Generate & Email <i className='icon-documents-folder'></i>
+ </Button>
+ </span>
+ </OverlayTrigger>
+ </div>
+ </div>
+ var mergedTabs = <div className={(this.dslObjectList.length>0)?'show':'hidden'}>
+ <div className="checkbox">
+ <label>
+ <input type="checkbox" checked={this.state.isMergedTabsChecked} onChange={this.onMergedTabsCheckbox.bind(this)} />
+ Merge Tabs
+ </label>
+ </div>
+ </div>
+ var downloadAllTemplateQueries = <div className={(this.dslObjectList.length>0)?'show':'hidden'}>
+ <OverlayTrigger placement='top' overlay={<Tooltip id='tooltip-top'>{this.downloadBulkTooltip}</Tooltip>}>
+ <span className="d-inline-block" style={{display: 'inline-block'}}>
+ <Button bsSize='small' disabled={(this.dslObjectList.length===0)} onClick={() => {this.downloadBulkDslToExcel()}}>
+ Download Loaded Queries <i className='icon-documents-downloadablefile'></i>
+ </Button>
+ </span>
+ </OverlayTrigger>
+ </div>
+ let downloadTemplateStatusAlert= <div className={(this.dslObjectList.length>0)?'show':'hidden'}>
+ <Alert id="saveSuccess" bsStyle="success" className={(this.state.downloadTemplateStatus && this.state.failedDownloadedTemplate.length===0)?'show':'hide'} onDismiss={() => this.setState({
+ downloadTemplateStatus:false,
+ failedDownloadedTemplate:[],
+ failedDownloadedTemplateMsg:'',
+ failedEmailTemplateMsg:'',
+ emailTriggerMsg:''})}>
+ <h3>Download Loaded Templates are Successfully</h3>
+ <p>
+ The selected templates downloaded successfull.
+ </p>
+ </Alert>
+ {this.state.failedDownloadedTemplate.length>0 && <Alert id="saveFailure" bsStyle="danger" onDismiss={() => this.setState({
+ downloadTemplateStatus:false,
+ failedDownloadedTemplate:[],
+ failedDownloadedTemplateMsg:'',
+ failedEmailTemplateMsg:'',
+ emailTriggerMsg:''})}>
+ <h3>Download Loaded Templates are Failed</h3>
+ <p>
+ {this.state.failedDownloadedTemplate.toString()} templates are failed to download.Please refer the downloaded spreadsheet for more details.
+ </p>
+ </Alert>}
+ {this.state.failedDownloadedTemplateMsg !=='' && <Alert id="saveFailure" bsStyle="danger" onDismiss={() => this.setState({
+ downloadTemplateStatus:false,
+ failedDownloadedTemplate:[],
+ failedDownloadedTemplateMsg:'',
+ failedEmailTemplateMsg:'',
+ emailTriggerMsg:''})}>
+ <h3>Download Loaded Templates are Failed</h3>
+ <p>
+ {this.state.failedDownloadedTemplateMsg}
+ </p>
+ </Alert>}
+ {this.state.emailTriggerMsg !=='' && <Alert id="saveSuccess" bsStyle="success" onDismiss={() => this.setState({failedEmailTemplateMsg:'',emailTriggerMsg:''})}>
+ <h3>Generate & Email Triggered</h3>
+ <p>
+ {this.state.emailTriggerMsg}
+ </p>
+ </Alert>}
+ {this.state.failedEmailTemplateMsg !=='' && <Alert id="saveFailure" bsStyle="danger" onDismiss={() => this.setState({failedEmailTemplateMsg:'',emailTriggerMsg:''})}>
+ <h3>Generate & Email Templates is Failed</h3>
+ <p>
+ {this.state.failedEmailTemplateMsg}
+ </p>
+ </Alert>}
+ </div>
+ if(APERTURE_SERVICE){
+ toggelRealtimeAnalysis = <div className='toggleSwitch'><BootstrapSwitchButton
+ checked={!this.state.enableRealTime}
+ onlabel='Real Time'
+ onstyle='danger'
+ offlabel='Analysis'
+ offstyle='success'
+ style='w-100 mx-3'
+ onChange={(checked) => {
+ this.toggleRealTimeAnalysisCallback(checked);
+ }}
+ /></div>
+ }
+ const inputProps = {
+ placeholder: 'Please enter a query',
+ value: this.state.value,
+ onChange: this.onChange,
+ onSelect: this.onSelect,
+ onClick: this.onClick
+ };
+
+ let nodes = [];
+ if ( this.state.isAggregate && this.state.aggregateNodes.length > 0 ) {
+
+ console.log('nodes exist', JSON.stringify(this.state.aggregateNodes[0]));
+ if(this.state.isAggregate && this.state.viewName === 'CardLayout'){
+ var nodeDetails = this.state.aggregateNodes.map(entry => {
+ return <Col lg={4} md={4} sm={6} xs={12}>
+ <div className='card aggregate-card'>
+ <div className='card-header'>
+ <h4 className='card-title'>{entry.nodePath}</h4>
+ </div>
+ <div className='card-content aggregate-card-content'>
+ <span>
+ {entry && typeof entry.map === 'function' && entry.map(subEntry =>
+ { let nodesPropList={};
+ return Object.keys(subEntry).map((node) => {
+ console.log("subentry : " + JSON.stringify(node + ' ' + JSON.stringify(subEntry[node])));
+ let description='';
+ let nodeType=subEntry[node]['node-type'];
+ if(!nodesPropList[nodeType]){
+ var requiredParams = buildAttrList(nodeType,[],'mandatory');
+ nodesPropList[nodeType]=requiredParams;
+ }
+ return (<span>
+ {this.state.associatedNodesEnabled && (<Alert bsStyle="info"><strong>{node}</strong></Alert>)}
+ {Object.keys(subEntry[node].properties).map((key)=>{
+ let propKey=key.split('|')[1];
+ let found=true;
+ for(var a in nodesPropList[nodeType]){
+ if(propKey===nodesPropList[nodeType][a].value){
+ found=false;
+ return (<p className="aggregate-attribute"><strong title={nodesPropList[nodeType][a].description}>{key}</strong> : {"" + subEntry[node].properties[key]}</p>);
+ }
+ }
+ if(found){
+ return (<p className="aggregate-attribute"><strong>{key}</strong> : {"" + subEntry[node].properties[key]}</p>);
+ }
+ })
+ }
+ </span>)
+ })
+ })
+ }
+
+ {this.state.associatedNodesEnabled && (<Alert bsStyle="info"><strong>{entry.fullPath}</strong></Alert>)}
+ </span>
+ </div>
+ </div>
+ </Col>;
+ });
+ nodes =
+ <div className='model-container'>
+ {nodeDetails}
+ </div>;
+ }else if(this.state.isAggregate && this.state.viewName === 'CellLayout'){
+ if(this.state.aggregateAttrList.length > 0 && this.state.aggregatePaths){
+ var types = this.state.aggregatePaths;
+ var type = types[0];
+ let tabs=types.map((nodeType,index) => {
+ if(this.state.tabularAggregateData[nodeType] && this.state.tabularAggregateColumns[nodeType]){
+ return(
+ <Tab eventKey={nodeType} title={nodeType}>
+ <BootstrapTable
+ id={nodeType}
+ keyField='id'
+ data={this.state.tabularAggregateData[nodeType]}
+ columns={this.state.tabularAggregateColumns[nodeType]}
+ bordered={ true }
+ headerClasses='table-header-view'
+ columnFilter={ true }
+ filter={ filterFactory() }
+ bootstrap4 striped hover condensed
+ />
+ </Tab>
+ )
+ }
+ });
+
+ nodes =
+ <div>
+ <button type='button' className={(this.state.disableFilter)? 'btn btn-outline-secondary' : 'btn btn-primary'} disabled={this.state.disableFilter} onClick={() => {this.isTableFilterForAggregation(this.state.columnFilter,this.state.tabularAggregateColumns[type])}} style={{float: 'right', margin: '2px'}}>Apply Filters (All)</button>
+ <Tabs defaultActiveKey={type} id="multipleTabularView">
+ {tabs}
+ </Tabs>
+ </div>;
+ }
+ }else if(this.state.isAggregate && this.state.viewName === 'VisualLayout'){
+ nodes = <span></span>;
+ }
+ }else if (this.state.nodes.length > 0){
+ const modelGalleryElement = <ModelGallery
+ nodes={this.state.nodes}
+ viewName={this.state.viewName}
+ historyStackString={this.props.location.historyStackString}
+ openHistoryModal={this.openHistory}
+ isPageNumberChange={this.state.isPageNumberChange}
+ resetColumnInd={this.state.resetColumnFilters}
+ isTableFilterApply={this.isTableFilterApply}
+ dslQuery={this.state.value}
+ enableRealTime={this.state.enableRealTime}
+ tableFilterAliasColumns={this.tableFilterAliasColumns}/>;
+ nodes =
+ <div className='model-container'>
+ {modelGalleryElement}
+ </div>;
+ }
+ return(
+ <div>
+ {toggelRealtimeAnalysis}
+ <div className='addPadding customDsl'>
+ <div className='static-modal'>
+ <Modal show={this.state.showHistoryModal} onHide={this.closeHistory}>
+ <Modal.Header>
+ <Modal.Title>Retrieve {(this.state.focusedNodeType) ? this.state.focusedNodeType: ' BYOQ Query '} History</Modal.Title>
+ </Modal.Header>
+ <Modal.Body>
+ <form className={this.state.showModelOptions ? 'show' : 'hidden'} id='historyForm' name='historyForm'>
+ <div className="radio">
+ <label>
+ <input type="radio" value="nodeState"
+ checked={this.state.historyType === 'nodeState'}
+ onChange={(e) => this.setHistoryType(e)} />
+ View state at
+ </label>
+ </div>
+ <div className="radio">
+ <label>
+ <input type="radio" value="nodeLifeCycleSince"
+ checked={this.state.historyType === 'nodeLifeCycleSince'}
+ onChange={(e) => this.setHistoryType(e)} />
+ View updates since
+ </label>
+ </div>
+ <div className="radio">
+ <label>
+ <input type="radio" value="nodeLifeCycle"
+ checked={this.state.historyType === 'nodeLifeCycle'}
+ onChange={(e) => this.setHistoryType(e)} />
+ View all updates
+ </label>
+ </div>
+ </form>
+ <div className={this.state.enableCalendar ? 'show' : 'hidden'}>
+ <DatePicker
+ inline
+ selected={this.state.startDate}
+ onChange={(newDate) => this.handleDateChange(newDate)}
+ showTimeSelect
+ timeFormat="HH:mm"
+ timeIntervals={15}
+ dateFormat="MMMM D, YYYY h:mm a"
+ timeCaption="time"
+ />
+ </div>
+ </Modal.Body>
+ <Modal.Footer>
+ <Button onClick={this.closeHistory}>Close</Button>
+ <Button onClick={this.submitHistory}>Submit</Button>
+ </Modal.Footer>
+ </Modal>
+ </div>
+ <div className='static-modal'>
+ <Modal show={this.state.showEditModal} onHide={this.closeEditDSLModal}>
+ <Modal.Header>
+ <Modal.Title>Edit DSL Query</Modal.Title>
+ </Modal.Header>
+ <Modal.Body>
+ <form id='dslQueryEditable' name='dslQueryEditable'>
+ <FormGroup controlId="dslQuery">
+ <ControlLabel>DSL Query</ControlLabel>
+ <FormControl className="template-textarea" onChange={this.bindEdits.bind(this)} value={this.state.editModel} componentClass="textarea" placeholder="Enter DSL Query" />
+ </FormGroup>
+ </form>
+ </Modal.Body>
+ <Modal.Footer>
+ <Button onClick={this.closeEditDSLModal}>Close</Button>
+ <Button onClick={this.submitEditAndRunDSL}>Submit</Button>
+ </Modal.Footer>
+ </Modal>
+ </div>
+ <div className='static-modal'>
+ <Modal show={this.state.showNodeModal} onHide={this.closeNodeModal} dialogClassName="modal-override">
+ <Modal.Header>
+ <Modal.Title>Retrieve {this.state.nodeDisplay}</Modal.Title>
+ </Modal.Header>
+ <Modal.Body>
+ <Grid fluid={true}>
+ <Row className='show-grid'>
+ <Col lg={12} md={12} sm={12} xs={12}>
+ <ModelCard
+ key={this.state.focusedNode.id}
+ nodeId={this.state.focusedNode.id}
+ nodeType={this.state.focusedNode['node-type']}
+ nodeProps={this.state.focusedNode.properties}
+ nodeRelatives={this.state.focusedNode['related-to']}
+ nodeUrl={this.state.focusedNode.url}
+ historyStackString={this.props.location.historyStackString}
+ openHistoryModal={this.openHistory}
+ enableRealTime={this.state.enableRealTime}/>
+ </Col>
+ </Row>
+ </Grid>
+ </Modal.Body>
+ <Modal.Footer>
+ <Button onClick={this.closeNodeModal}>Close</Button>
+ </Modal.Footer>
+ </Modal>
+ </div>
+ <div className='static-modal'>
+ <Modal show={this.state.showSaveModal} onHide={this.closeSaveModal} dialogClassName="modal-override">
+ <Spinner loading={this.state.enableSaveBusyFeedback}>
+ <Modal.Header>
+ <Modal.Title>{this.state.isEditModal ? 'Edit' : 'Save'} DSL Query</Modal.Title>
+ </Modal.Header>
+ <Modal.Body>
+ <Alert id="saveFailure" bsStyle="danger" className={this.state.saveFailureMsg ? 'show' : 'hidden'} onDismiss={() => this.setState({saveFailureMsg: false})}>
+ <h3>Query Save Failed</h3>
+ <p>
+ {this.state.saveFailureMsg}
+ </p>
+ </Alert>
+ <form className={!this.state.showQueryExistsWarning ? 'show' : 'hidden'} id='saveDslQueryForm' name='saveDslQueryForm'>
+ <FormGroup controlId="queryName">
+ <ControlLabel>Query Name</ControlLabel>
+ {!this.state.isEditModal && (<input id='dslNameHelp' type='name' className='form-control' id='queryName' aria-describedby='dslNameHelp' placeholder='Enter query name' value={this.state.queryName} onChange={this.handleQueryNameChange}/>)}
+ {!this.state.isEditModal && (<small id='queryNameHelp' className='form-text text-muted'>Select a name for your saved query, do not reuse names.</small>)}
+ {this.state.isEditModal && (<p>{this.state.queryName}</p>)}
+ </FormGroup>
+ <FormGroup controlId="queryDescription">
+ <ControlLabel>Query Description</ControlLabel>
+ <FormControl componentClass="textarea" id="queryDescription" aria-describedby="queryDescriptionHelp" placeholder="Enter query description" value={this.state.queryDescription} onChange={this.handleQueryDescriptionChange} />
+ <small id="queryDescriptionHelp" className="form-text text-muted">Be as descriptive as possible to describe the purpose of the saved query (this will be searchable)</small>
+ </FormGroup>
+ <FormGroup controlId="category">
+ <ControlLabel>Category</ControlLabel>
+ <input id='category' type="name" className="form-control" aria-describedby="category of SavedQuery" placeholder="Enter category" value={this.state.category} onChange={this.handleCategoryChange}/>
+ </FormGroup>
+ <FormGroup controlId="privacy_indicator">
+ {this.state.isDataSteward && (<div className="checkbox">
+ <label>
+ <input type="checkbox" checked={this.state.isPublicChecked} onChange={this.onPublicCheckbox.bind(this)} />
+ Public
+ </label>
+ </div>)}
+ <div className={"checkbox " + ((!this.state.isPublicChecked || !this.state.isDataSteward) ? 'show' : 'hidden')}>
+ <label>
+ <input type="checkbox" checked={this.state.isCommunitySharedChecked} onChange={this.onCommunitySharedCheckbox.bind(this)} />
+ Share with Community
+ </label>
+ </div>
+ {!this.state.isDataSteward && (<ControlLabel>Personal Query</ControlLabel>)}
+ </FormGroup>
+ <FormGroup controlId='aggregate'>
+ {this.state.isAggregateChecked && !(this.state.isEditModal || this.state.isSavedQueryFlow) && (<ControlLabel>Aggregate Query</ControlLabel>)}
+ {!this.state.isAggregateChecked && !(this.state.isEditModal || this.state.isSavedQueryFlow) && (<ControlLabel>Standard Query</ControlLabel>)}
+ {(this.state.isEditModal || this.state.isSavedQueryFlow) && (<div className='checkbox'>
+ <label>
+ <input type='checkbox' checked={this.state.isAggregateChecked} onChange={this.onAggregateCheckbox.bind(this)}/>
+ Aggregate Query
+ </label>
+ </div>)}
+ </FormGroup>
+ <FormGroup controlId='queryDSL'>
+ <ControlLabel>DSL Query</ControlLabel>
+ {!this.state.isEditModal && !this.state.isSavedQueryFlow ? <p>{this.state.value}</p> : <FormControl componentClass='textarea' id='queryDSL' aria-describedby='queryDSLHelp' placeholder='Enter dsl query' value={this.state.value} onChange={this.handleQueryChange} />}
+ </FormGroup>
+ <FormGroup controlId='templateDetails'>
+ <Spinner loading={this.state.enableTreeLoadBusyFeedback}>
+ <div className={!this.state.treeLoadErrMsg ? 'show' : 'hidden'}>
+ <ControlLabel>Configuration Template Details - check for configurable, uncheck for static</ControlLabel>
+ {Object.keys(this.state.dslConfigArray).map(key => {
+ return (this.state.dslConfigArray[key].filters).map(filter =>{
+ return (<div className='checkbox'>
+ <label>
+ <input type='checkbox' checked={this.state.staticTemplateFilters.indexOf(key + '|' + filter) === -1} onChange={(e) => {this.onDslConfigCheckbox(e, key + '|' + filter)}} />
+ {key} - {filter}
+ </label>
+ </div>)
+ })
+ })
+ }
+ </div>
+ <Alert bsStyle="danger" className={this.state.treeLoadErrMsg ? 'show' : 'hidden'}>
+ <h3>Error Loading Configurable Filters</h3>
+ <p>
+ {this.state.treeLoadErrMsg}
+ </p>
+ </Alert>
+ </Spinner>
+ </FormGroup>
+ </form>
+ <Alert bsStyle="warning" className={this.state.showQueryExistsWarning ? 'show' : 'hidden'} onDismiss={() => this.setState({showQueryExistsWarning: false})}>
+ <h3>Query Name Already Exists</h3>
+ <p>
+ There is already a query with the name {this.state.queryName}, do you wish to overwrite the existing query?
+ </p>
+ </Alert>
+ </Modal.Body>
+ <Modal.Footer className={!this.state.showQueryExistsWarning ? 'show' : 'hidden'}>
+ <Button onClick={this.closeSaveModal}>Close</Button>
+ <Button disabled={this.state.queryName.trim() === '' || this.state.queryDescription.trim() === ''} onClick={() => {this.submitSave()}}>Save</Button>
+ </Modal.Footer>
+ <Modal.Footer className={this.state.showQueryExistsWarning ? 'show' : 'hidden'}>
+ <Button onClick={() => this.setState({showQueryExistsWarning : false})}>No</Button>
+ <Button onClick={() => {this.submitSave(true)}}>Yes</Button>
+ </Modal.Footer>
+ </Spinner>
+ </Modal>
+ </div>
+ <div id="jumbotron" className='row'>
+ <div className={'row container-fluid my-4 ' + (this.state.isDSLFlow ? 'show' : 'hidden')}>
+ <div className='col-lg-12'>
+ <header className='jumbotron'>
+ <h1 className='display-2'><strong>B</strong>uild <strong>Y</strong>our <strong>O</strong>wn <strong>Q</strong>uery</h1>
+ <p className='lead'>
+ On this page you have the ability to craft your own query to retrieve objects from the database.
+ There are help menus in the accordions and a modal triggered from the light bulb icon to help with syntax.
+ There are is also a typeahead feature that will help you build your query as you type, providing valid nodes and attributes to use.
+ </p>
+ </header>
+ </div>
+ </div>
+ <div className={'row container-fluid my-4 ' + (this.state.isSavedQueryFlow ? 'show' : 'hidden')}>
+ <div className='col-lg-12'>
+ <header className='jumbotron'>
+ <h1 className='display-2'>Saved Queries</h1>
+ <p className='lead'>
+ On this page you have the ability to load and run previously saved queries.
+ You can run them as they are saved or choose to load them to replace the filters
+ in the template.
+ </p>
+ </header>
+ </div>
+ </div>
+ </div>
+ <div className='row'>
+ <div className={'addPadding col-md-12 ' + (this.state.isSavedQueryFlow ? 'show' : 'hidden')}>
+ <div className='row'>
+ <div className='col-lg-10'>
+ <Alert id="saveSuccessEdit" bsStyle="success" className={this.state.saveSuccessfulMsg && this.state.isEditModal ? 'show' : 'hidden'} onDismiss={() => this.setState({saveSuccessfulMsg: false})}>
+ <h3>Query Saved Successfully</h3>
+ <p>
+ {this.state.saveSuccessfulMsg}
+ </p>
+ </Alert>
+ </div>
+ </div>
+ <CustomDSLSaveLoad loadCallback={this.loadCallback} loadBulkCallback={this.loadBulkCallback} setQueriesState={this.setQueriesState} ref={this.saveLoadComponent} isDataSteward={this.state.isDataSteward} isSavedQueryFlow={this.state.isSavedQueryFlow} editCallback={this.editCallback}/>
+ <div className={'col-xs-1 ' + (GlobalExtConstants.INVLIST.IS_ONAP ? 'hidden' : '' )} >
+ <a href={INVLIST.USERGUIDE_URL} target="_blank">
+ <i className="dsl-hint icon-documents-manual"></i>
+ </a>
+ <pre>User<br />Guide</pre>
+ </div>
+ <div className='col-lg-11'><InfoToggle/></div>
+ </div>
+ <div className='row'>
+ <div className='col-md-12' id='templateList'>
+ {templateList}
+ </div>
+ <div className='col-md-10' id='downloadTemplateStatusAlert'>
+ <div className='col-md-6'>
+ {downloadTemplateStatusAlert}
+ </div>
+ <div className='col-md-6'>
+ <div style={{float:'right'}}>
+ {emailCheckbox}
+ </div>
+ <div style={{float:'right',margin: '10px'}}>
+ {downloadAllTemplateQueries}
+ </div>
+ <div style={{float:'right',margin: '10px'}}>
+ {mergedTabs}
+ </div>
+ </div>
+ </div>
+ </div>
+ <div className={'addPadding col-md-9 ' + (this.state.isDSLFlow ? 'show' : 'hidden')}>
+ <form onSubmit={this.onAddItem} id='byoqFormForQuery' name='byoqFormForQuery'>
+ <div className='row'>
+ <div className='col-lg-9 form-group'>
+ <Alert id="saveSuccess" bsStyle="success" className={this.state.saveSuccessfulMsg ? 'show' : 'hidden'} onDismiss={() => this.setState({saveSuccessfulMsg: false})}>
+ <h3>Query Saved Successfully</h3>
+ <p>
+ {this.state.saveSuccessfulMsg}
+ </p>
+ </Alert>
+ <div id="byoqInput"><label htmlFor='newQuery'>Build Your Own Query</label></div>
+ <div className={this.state.isTypeahead ? 'show' : 'hidden'}>
+ <Autosuggest
+ suggestions={this.state.suggestions}
+ onSuggestionsFetchRequested={this.onSuggestionsFetchRequested}
+ onSuggestionsClearRequested={this.onSuggestionsClearRequested}
+ getSuggestionValue={this.getSuggestionValue}
+ renderSuggestion={this.renderSuggestion}
+ inputProps={inputProps}
+ shouldRenderSuggestions={this.shouldRenderSuggestions}
+ onSuggestionSelected={this.onSuggestionSelected}
+ ref={this.storeInputReference}
+ />
+ </div>
+ <div className={this.state.isTypeahead ? 'hidden' : 'show'}>
+ <FormControl componentClass="textarea"
+ rows="4"
+ onChange={this.onTextAreaChange}
+ style={{width: '655px'}}
+ value={this.state.value}
+ />
+ </div>
+ </div>
+ <div className={'col-xs-1 ' + (GlobalExtConstants.INVLIST.IS_ONAP ? 'hidden' : '' )}>
+ <a href={INVLIST.USERGUIDE_URL} target="_blank">
+ <i className="dsl-hint icon-documents-manual"></i>
+ </a>
+ <pre>User<br />Guide</pre>
+ </div>
+ <InfoToggle/>
+ <div className='col-xs-1'>
+ <i className='dsl-hint fa fa-question-circle-o' onClick={this.hint} ></i>
+ </div>
+ <div className='static-modal'>
+ <Modal show={this.state.showModal} onHide={this.close}>
+ <Modal.Header>
+ <Modal.Title>DSL Syntax</Modal.Title>
+ </Modal.Header>
+ <Modal.Body>
+ {
+ this.state.hintHtml.map(hints => {
+ return <div key={hints.notation}>
+ <label>{hints.notation}</label> =>
+ <pre style={{color: 'blue'}}> {hints.description}</pre>
+ </div>;
+ })
+ }
+ </Modal.Body>
+ <Modal.Footer>
+ <Button onClick={this.close}>Close</Button>
+ </Modal.Footer>
+ </Modal>
+ </div>
+ </div>
+ <div className='row'>
+ <div className='col-sm-10'>
+ <button id='runByoqQuery' className='btn btn-primary' type='submit'>Run</button>
+ { !INVLIST.IS_ONAP &&(<button id='saveByoqQuery' className='btn btn-outline-secondary' type='button' disabled={this.state.value.trim() === ''} onClick={this.openSaveModal}>Save</button>)}
+ { INVLIST.isHistoryEnabled && (<button id='historyByoqQuery' className='btn btn-outline-secondary' type='button' disabled={this.state.value.trim() === ''} onClick={this.openHistory}>History</button>)}
+ <button id='clearByoqQuery' className='btn btn-outline-secondary' type='button' onClick={this.clear}>Clear</button>
+ <Toggle
+ id="typeAheadToggle"
+ defaultChecked={this.state.isTypeahead}
+ checked={this.state.isTypeahead}
+ className='toggle-theme'
+ onChange={this.handleTypeaheadChange} />
+ <span className='addPaddingLeft'>Typeahead</span>
+ </div>
+ </div>
+ </form>
+ <div className={this.state.isInitialLoad ? 'hidden' : 'show'} id='dslInputError'>
+ <Row className={this.state.validInput ? 'hidden' : 'show show-grid'}>
+ <Col md={12}>
+ <span className='label badge-pill label-danger'><strong>Error </strong>: Please enter a valid query input</span>
+ </Col>
+ </Row>
+ </div>
+ <div className={'checkbox ' + (GlobalExtConstants.INVLIST.IS_ONAP ? 'hidden' : '' )}>
+ <label>
+ <input type="checkbox" id='aggregateObjectsChkbox' checked={this.state.isAggregateChecked} onChange={this.onAggregateCheckbox.bind(this)} />
+ Aggregate Objects
+ </label>
+ {this.state.isAggregateChecked && (<label>
+ <input id='includeAssociatedNodes' type="checkbox" checked={this.state.associatedNodesEnabled} onChange={this.onAssociatedNodesCheckbox.bind(this)} />
+ Include Associated Nodes
+ </label>)}
+ </div>
+ <CustomDSLSaveLoad loadCallback={this.loadCallback} loadBulkCallback={this.loadBulkCallback} setQueriesState={this.setQueriesState} ref={this.saveLoadComponentDsl} isDataSteward={this.state.isDataSteward} editCallback={this.editCallback}/>
+ </div>
+ <div className={'col-lg-2 col-md-12 ' + (this.state.isDSLFlow ? 'show' : 'hidden')}>
+ <PanelGroup accordion id='rb-accordion'>
+ <Panel eventKey='1'>
+ <Panel.Heading>
+ <Panel.Title toggle>+ Simple Queries</Panel.Title>
+ </Panel.Heading>
+ <Panel.Body collapsible>
+ <div className='cardwrap'>
+ <div className='cardWrapHeaderTxt'>
+ <label>{this.state.simpleQueries.abstract}</label>
+ </div>
+ <div>
+ {this.state.simpleQueries.notation.map(entry => {
+ return (
+ <div key={entry.notation}>
+ <b><label>{entry.notation}</label></b> =>
+ <span style={{color: 'blue'}}> {entry.description}</span>
+ </div>
+ );
+ })}
+ </div>
+ </div>
+ </Panel.Body>
+ </Panel>
+ <Panel eventKey='2'>
+ <Panel.Heading>
+ <Panel.Title toggle>+ Traversal Queries</Panel.Title>
+ </Panel.Heading>
+ <Panel.Body collapsible>
+ <div className='cardwrap'>
+ <div className='cardWrapHeaderTxt'>
+ <label>{this.state.traversalQueries.abstract}</label>
+ </div>
+ <div>
+ {this.state.traversalQueries.notation.map(entry => {
+ return (
+ <div key={entry.notation}>
+ <b><label>{entry.notation}</label></b> =>
+ <span style={{color: 'blue'}}> {entry.description}</span>
+ </div>
+ );
+ })}
+ </div>
+ </div>
+ </Panel.Body>
+ </Panel>
+ <Panel eventKey='3'>
+ <Panel.Heading>
+ <Panel.Title toggle>+ Union Queries</Panel.Title>
+ </Panel.Heading>
+ <Panel.Body collapsible>
+ <div className='cardwrap'>
+ <div className='cardWrapHeaderTxt'>
+ <label>{this.state.unionQueries.abstract}</label>
+ </div>
+ <div>
+ {this.state.unionQueries.notation.map(entry => {
+ return (
+ <div key={entry.notation}>
+ <b><label>{entry.notation}</label></b> =>
+ <span style={{color: 'blue'}}> {entry.description}</span>
+ </div>
+ );
+ })}
+ </div>
+ </div>
+ </Panel.Body>
+ </Panel>
+ <Panel eventKey='4'>
+ <Panel.Heading>
+ <Panel.Title toggle>+ Limit Queries</Panel.Title>
+ </Panel.Heading>
+ <Panel.Body collapsible>
+ <div className='cardwrap'>
+ <div className='cardWrapHeaderTxt'>
+ <label>{this.state.limitQueries.abstract}</label>
+ </div>
+ <div>
+ {this.state.limitQueries.notation.map(entry => {
+ return (
+ <div key={entry.notation}>
+ <b><label>{entry.notation}</label></b> =>
+ <span style={{color: 'blue'}}> {entry.description}</span>
+ </div>
+ );
+ })}
+ </div>
+ </div>
+ </Panel.Body>
+ </Panel>
+ <Panel eventKey='5'>
+ <Panel.Heading>
+ <Panel.Title toggle>+ Negation Queries</Panel.Title>
+ </Panel.Heading>
+ <Panel.Body collapsible>
+ <div className='cardwrap'>
+ <div className='cardWrapHeaderTxt'>
+ <label>{this.state.negationQueries.abstract}</label>
+ </div>
+ <div>
+ {this.state.negationQueries.notation.map(entry => {
+ return (
+ <div key={entry.notation}>
+ <b><label>{entry.notation}</label></b> =>
+ <span style={{color: 'blue'}}> {entry.description}</span>
+ </div>
+ );
+ })}
+ </div>
+ </div>
+ </Panel.Body>
+ </Panel>
+ <Panel eventKey='6'>
+ <Panel.Heading>
+ <Panel.Title toggle>+ Topology Queries</Panel.Title>
+ </Panel.Heading>
+ <Panel.Body collapsible>
+ <div className='cardwrap'>
+ <div className='cardWrapHeaderTxt'>
+ <label>{this.state.topologyQueries.abstract}</label>
+ </div>
+ <div>
+ {this.state.topologyQueries.notation.map(entry => {
+ return (
+ <div key={entry.notation}>
+ <b><label>{entry.notation}</label></b> =>
+ <span style={{color: 'blue'}}> {entry.description}</span>
+ </div>
+ );
+ })}
+ </div>
+ </div>
+ </Panel.Body>
+ </Panel>
+ <Panel eventKey='7' className={(this.state.enableRealTime) ? 'show' : 'hidden'}>
+ <Panel.Heading>
+ <Panel.Title toggle>+ Advanced Queries</Panel.Title>
+ </Panel.Heading>
+ <Panel.Body collapsible>
+ <div className='cardwrap'>
+ <div className='cardWrapHeaderTxt'>
+ <label>{this.state.advancedQueries.abstract}</label>
+ </div>
+ <div>
+ {this.state.advancedQueries.notation.map(entry => {
+ return (
+ <div key={entry.notation}>
+ <b><label>{entry.notation}</label></b> =>
+ <span style={{color: 'blue'}}> {entry.description}</span>
+ </div>
+ );
+ })}
+ </div>
+ </div>
+ </Panel.Body>
+ </Panel>
+ </PanelGroup>
+ </div>
+ </div>
+ <div className='row'>
+ <div className='multipleNodes' id="outputBlock">
+ <Spinner loading={this.state.isLoading && this.state.isInitialLoad}>
+ </Spinner>
+ <div className={this.state.isInitialLoad ? 'hidden' : 'show'}>
+ <Spinner loading={this.state.isLoading} fullscreen={true}>
+ <div className={this.state.validInput ? 'show' : 'hidden'}>
+ <Col md={12}>
+ <h2 className='pre-wrap-text'>{this.state.header}</h2>
+ <br/>
+ <h5>Total Results: <strong>{this.state.totalResults}</strong></h5>
+ </Col>
+ {this.state.showResults && <div className="addPaddingTop" >
+ <OutputToggle scope={this} visualDisabled={this.state.totalResults > PAGINATION_CONSTANT}/>
+ </div> }
+ {!this.state.isAggregate && (<div id="standardOutput" className="col-md-12">
+ <Row className={this.state.showResults ? 'show' : 'hidden'}>
+ <Col md={8} className={this.state.showPagination ? 'show' : 'hidden'}>
+ <Pagination
+ activePage={this.state.activePage}
+ itemsCountPerPage={PAGINATION_CONSTANT.RESULTS_PER_PAGE}
+ totalItemsCount={this.state.totalResults}
+ pageRangeDisplayed={PAGINATION_CONSTANT.PAGE_RANGE_DISPLAY}
+ onChange={this.handlePageChange} />
+ </Col>
+ <Col md={2} className='text-right'>
+ <OverlayTrigger placement='top' overlay={<Tooltip id='tooltip-top'>{this.downloadAllTooltip}</Tooltip>}>
+ <span className="d-inline-block" style={{display: 'inline-block'}}>
+ <Button bsSize='small' onClick={() => {this.getAllExcels(this.state.downloadCount)}}>
+ Download XLSX <i className='icon-documents-downloadablefile'></i>
+ </Button>
+ </span>
+ </OverlayTrigger>
+ </Col>
+ <Col md={2} className='text-right'>
+ <OverlayTrigger placement='top' overlay={<Tooltip id='tooltip-top'>{this.downloadRangeTooltip}</Tooltip>}>
+ <span className="d-inline-block" style={{display: 'inline-block'}}>
+ <Button bsSize='small' onClick={this.openDownloadRange}>
+ Download XLSX (Range) <i className='icon-documents-downloadablefile'></i>
+ </Button>
+ </span>
+ </OverlayTrigger>
+ </Col>
+ </Row>
+ <hr/>
+ <div className={'addPaddingTop alert alert-danger ' +(this.state.errorResults ? 'show' : 'hidden')} role="alert">
+ An error occurred, please try again later. If this issue persists, please contact the system administrator. {this.state.errorMessage}
+ </div>
+ <Row className={this.state.noResults ? 'show' : 'hidden'}>
+ <Col md={12}>
+ <h2>No Results Found</h2>
+ </Col>
+ </Row>
+ <div className={this.state.errorResults || this.state.noResults ? 'hidden' : 'show'}>
+ <div className='nodes container-fluid'>
+ <div className='row-dsl'>
+ {nodes}
+ </div>
+ </div>
+ </div>
+ <Row className={this.state.showPagination ? 'show' : 'hidden'}>
+ <Col md={6}>
+ <Pagination
+ activePage={this.state.activePage}
+ itemsCountPerPage={PAGINATION_CONSTANT.RESULTS_PER_PAGE}
+ totalItemsCount={this.state.totalResults}
+ pageRangeDisplayed={PAGINATION_CONSTANT.PAGE_RANGE_DISPLAY}
+ onChange={this.handlePageChange} />
+ </Col>
+ </Row>
+ </div>)}
+ {this.state.isAggregate && (<div id="aggregateOutput">
+ <Row className={ this.state.errorResults || this.state.noResults ? 'hidden' : 'show'}>
+ <Col md={8} className={this.state.showPagination ? 'show' : 'hidden'}>
+ <Pagination
+ activePage={this.state.aggregateActivePage}
+ itemsCountPerPage={PAGINATION_CONSTANT.RESULTS_PER_PAGE}
+ totalItemsCount={this.state.totalResults}
+ pageRangeDisplayed={PAGINATION_CONSTANT.PAGE_RANGE_DISPLAY}
+ onChange={this.handlePageChange} />
+ </Col>
+ <Col md={2} className='text-right'>
+ <OverlayTrigger placement='top' overlay={<Tooltip id='tooltip-top'>{this.downloadAllTooltip}</Tooltip>}>
+ <span className="d-inline-block" style={{display: 'inline-block'}}>
+ <Button bsSize='small' onClick={() => {this.downloadAllAggregate(this.state.downloadCount)}}>
+ Download XLSX <i className='icon-documents-downloadablefile'></i>
+ </Button>
+ </span>
+ </OverlayTrigger>
+ </Col>
+ <Col md={2} className='pull-right text-right'>
+ <OverlayTrigger placement='top' overlay={<Tooltip id='tooltip-top'>Download All Aggregate Objects By Custom Range Selection</Tooltip>}>
+ <span className="d-inline-block" style={{display: 'inline-block'}}>
+ <Button bsSize='small' onClick={this.openDownloadRange}>
+ Download XLSX (Range) <i className='icon-documents-downloadablefile'></i>
+ </Button>
+ </span>
+ </OverlayTrigger>
+ </Col>
+ </Row>
+ <hr/>
+ <div className={'addPaddingTop alert alert-danger ' + (this.state.errorResults ? 'show' : 'hidden')} role="alert">
+ An error occurred, please try again later. If this issue persists, please contact the system administrator. {this.state.errorMessage}
+ </div>
+ <Row className={this.state.noResults ? 'show' : 'hidden'}>
+ <Col md={12}>
+ <h2>No Results Found</h2>
+ </Col>
+ </Row>
+ <div className={this.state.errorResults || this.state.noResults ? 'hidden' : 'show'}>
+ <div className='nodes container-fluid'>
+ <div className='row-dsl'>
+ {nodes}
+ <div className={this.state.viewName === "VisualLayout" ? 'show' : 'hidden'}>
+ <OutputVisualization identifier="currentStateAggregate" width={ window.outerWidth * 0.8 } height="1200" overflow="scroll"/>
+ </div>
+ </div>
+ </div>
+ </div>
+ <Row className={this.state.showPagination ? 'show' : 'hidden'}>
+ <Col md={6}>
+ <Pagination
+ activePage={this.state.aggregateActivePage}
+ itemsCountPerPage={PAGINATION_CONSTANT.RESULTS_PER_PAGE}
+ totalItemsCount={this.state.totalResults}
+ pageRangeDisplayed={PAGINATION_CONSTANT.PAGE_RANGE_DISPLAY}
+ onChange={this.handlePageChange} />
+ </Col>
+ </Row>
+ </div>)}
+ </div>
+ <Spinner loading={this.state.enableModelBusyFeedback}>
+ {downloadRangeModel}
+ </Spinner>
+ </Spinner>
+ </div>
+ <div className='row'>
+ <div className='col-sm-10'></div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ );
+ }
+}
+
+export default CustomDsl;