Skip to content

Commit f2bca0e

Browse files
ssuvorov-flsssuvorov-fls
committed
fix pr comments (#655)
1 parent d56b195 commit f2bca0e

29 files changed

+197
-383
lines changed

‎js/components/export/component-sql-export.css

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
.component-sql-export {
2+
margin-left: -1rem;
3+
margin-right: -1rem;
4+
}
5+
6+
.component-sql-export .export-btn {
7+
margin-bottom: 1rem;
8+
}
9+
10+
.component-sql-export .tabs__header {
11+
background: #fff;
12+
}
13+
14+
.component-sql-export .tabs__header-title {
15+
color: #ccc;
16+
background-color: #888;
17+
}
18+
19+
.component-sql-export .tabs__header-title--selected {
20+
color: #fff;
21+
background-color: #337ab7;
22+
}

‎js/components/export/component-sql-export.html

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<div data-bind="tab-pane" class="component-sql-export">
2+
<div class="export-btn">
3+
<span id="copyCopySQLMessage" style="display:none" class="alert alert-success" role="alert"><i
4+
class="fa fa-check-square-o" aria-hidden="true"></i><strong>Copied To Clipboard!</strong>
5+
</span>&nbsp;&nbsp;<button class="btn btn-sm btn-primary" itle="Copy to clipboard" id="btnCopySQLClipboard"
6+
data-bind="click: parent.copySQLToClipboard" data-clipboard-target="#sqlTranslate">
7+
<i class="fa fa-clipboard" aria-hidden="true"></i> Copy To Clipboard</button>
8+
</div>
9+
<div id='sqlTranslate'>
10+
<tabs params="tabs: parent.translateParams" />
11+
</tabs>
12+
</div>
13+
</div>

‎js/components/export/component-sql-export.js

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
define([
2+
'text!./component-sql-export.html',
3+
'components/Component',
4+
'utils/AutoBind',
5+
'utils/CommonUtils',
6+
'./export-sql',
7+
'css!./component-sql-export.css'
8+
], function (
9+
view,
10+
Component,
11+
AutoBind,
12+
commonUtils,
13+
) {
14+
class ComponentSQLExportTab extends AutoBind(Component) {
15+
constructor(params) {
16+
super(params);
17+
this.parent = params.parent;
18+
this.parent.showSql();
19+
}
20+
}
21+
22+
return commonUtils.build('component-sql-export', ComponentSQLExportTab, view);
23+
});

‎js/components/export/export-sql.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
<pre data-bind='text: parent.getGeneratedSql(dialect)'></pre>

‎js/pages/incidence-rates/tabs/export/msaps.js renamed to ‎js/components/export/export-sql.js

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
define([
2-
'text!./msaps.html',
2+
'text!./export-sql.html',
33
'components/Component',
44
'utils/AutoBind',
55
'utils/CommonUtils',
@@ -9,12 +9,13 @@ define([
99
AutoBind,
1010
commonUtils,
1111
) {
12-
class IRexportmsapsTab extends AutoBind(Component) {
12+
class SQLExportTab extends AutoBind(Component) {
1313
constructor(params) {
1414
super(params);
1515
this.parent = params.parent;
16+
this.dialect = params.dialect;
1617
}
1718
}
1819

19-
return commonUtils.build('ir-export-msaps', IRexportmsapsTab, view);
20+
return commonUtils.build('export-sql', SQLExportTab, view);
2021
});

‎js/const.js

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -130,6 +130,46 @@ define([
130130
PROFILE_WIDGET: 'atlas-profile-widget',
131131
};
132132

133+
const dialects = [
134+
{
135+
title: 'Template OHDSI.SQL',
136+
value: 'templateSql',
137+
template: true,
138+
},
139+
{
140+
title: 'MSSQL Server',
141+
value: 'sql server',
142+
},
143+
{
144+
title: 'MS APS',
145+
value: 'pdw',
146+
},
147+
{
148+
title: 'Oracle',
149+
value: 'oracle',
150+
},
151+
{
152+
title: 'PostgreSQL',
153+
value: 'postgresql',
154+
},
155+
{
156+
title: 'Amazon Red Shift',
157+
value: 'redshift',
158+
},
159+
{
160+
title: 'Impala',
161+
value: 'impala',
162+
},
163+
{
164+
title: 'Netezza',
165+
value: 'netezza',
166+
},
167+
{
168+
title: 'BigQuery',
169+
value: 'bigquery',
170+
},
171+
];
172+
133173
return {
134174
minChartHeight,
135175
treemapGradient,
@@ -142,6 +182,7 @@ define([
142182
timeAtRiskCohortDate,
143183
newEntityNames,
144184
pluginTypes,
185+
dialects
145186
};
146187
}
147188
);

‎js/pages/cohort-definitions/cohort-definition-manager.css

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -56,4 +56,23 @@
5656

5757
.cohort-conceptset-button-pane .btn-success.disabled {
5858
color: #f3f3f3;
59+
}
60+
61+
.export-btn {
62+
margin-top: 1rem;
63+
margin-bottom: 1rem;
64+
}
65+
66+
.export-sql .tabs__header {
67+
background: #fff;
68+
}
69+
70+
.export-sql .tabs__header-title {
71+
color: #ccc;
72+
background-color: #888;
73+
}
74+
75+
.export-sql .tabs__header-title--selected {
76+
color: #fff;
77+
background-color: #337ab7;
5978
}

‎js/pages/cohort-definitions/cohort-definition-manager.html

Lines changed: 11 additions & 69 deletions
Original file line numberDiff line numberDiff line change
@@ -297,77 +297,19 @@
297297
</div>
298298
</div>
299299
<div role="tabpanel" data-bind="css: { active: $component.exportTabMode() == 'sql'}" class="tab-pane">
300-
<div class="row">
301-
<div class="col-md-9" style="text-align: left">
302-
<ul class="nav nav-pills">
303-
<li role="presentation" data-bind="css: { active: $component.exportSqlMode() == 'ohdsisql' }, click: function() { $component.exportSqlMode('ohdsisql') };">
304-
<a>Template OHDSI.SQL </a>
305-
</li>
306-
<li role="presentation" data-bind="css: { active: $component.exportSqlMode() == 'mssql' }, click: function() { $component.exportSqlMode('mssql') };">
307-
<a>MSSQL Server</a>
308-
</li>
309-
<li role="presentation" data-bind="css: { active: $component.exportSqlMode() == 'msaps' }, click: function() { $component.exportSqlMode('msaps') };">
310-
<a>MS APS</a>
311-
</li>
312-
<li role="presentation" data-bind="css: { active: $component.exportSqlMode() == 'oracle' }, click: function() { $component.exportSqlMode('oracle') };">
313-
<a>Oracle</a>
314-
</li>
315-
<li role="presentation" data-bind="css: { active: $component.exportSqlMode() == 'postgresql' }, click: function() { $component.exportSqlMode('postgresql') };">
316-
<a>PostgreSQL</a>
317-
</li>
318-
<li role="presentation" data-bind="css: { active: $component.exportSqlMode() == 'redshift' }, click: function() { $component.exportSqlMode('redshift') };">
319-
<a>Amazon Red Shift</a>
320-
</li>
321-
<li role="presentation" data-bind="css: { active: $component.exportSqlMode() == 'impala' }, click: function() { $component.exportSqlMode('impala') };">
322-
<a>Impala</a>
323-
</li>
324-
<li role="presentation" data-bind="css: { active: $component.exportSqlMode() == 'netezza' }, click: function() { $component.exportSqlMode('netezza') };">
325-
<a>Netezza</a>
326-
</li>
327-
<li role="presentation" data-bind="css: { active: $component.exportSqlMode() == 'bigquery' }, click: function() { $component.exportSqlMode('bigquery') };">
328-
<a>BigQuery</a>
329-
</li>
330-
</ul>
331-
</div>
332-
<div class="col-md-3" style="text-align: right">
333-
<span id="copyCopyCohortSQLMessage" style="display:none" class="alert alert-success" role="alert"><i class="fa fa-check-square-o" aria-hidden="true"></i><strong>Copied To Clipboard!</strong></span>&nbsp;&nbsp;<button class="btn btn-sm btn-primary"
334-
title="Copy to clipboard" id="btnCopyCohortSQLClipboard" data-bind="click: copyCohortSQLToClipboard" data-clipboard-target="#cohortSQL"><i class="fa fa-clipboard" aria-hidden="true"></i> Copy To Clipboard</button>
335-
</div>
336-
</div>
337-
<div class="tab-content">
338-
<div role="tabpanel" data-bind="visible: $component.isLoadingSql()">
339-
<div class="loading">Loading</div>
300+
<div class="tab-pane export-sql">
301+
<div class="export-btn">
302+
<span id="copyCopySQLMessage" style="display:none" class="alert alert-success" role="alert"><i
303+
class="fa fa-check-square-o" aria-hidden="true"></i><strong>Copied To Clipboard!</strong>
304+
</span>&nbsp;&nbsp;<button class="btn btn-sm btn-primary" itle="Copy to clipboard" id="btnCopySQLClipboard"
305+
data-bind="click: $component.copySQLToClipboard" data-clipboard-target="#sqlTranslate">
306+
<i class="fa fa-clipboard" aria-hidden="true"></i> Copy To Clipboard</button>
340307
</div>
341-
<div id="cohortSQL">
342-
<div role="tabpanel" data-bind="visible: $component.exportSqlMode() == 'ohdsisql' && !$component.isLoadingSql()">
343-
<pre data-bind="html: $component.templateSql"></pre>
344-
</div>
345-
<div role="tabpanel" data-bind="visible: $component.exportSqlMode() == 'mssql' && !$component.isLoadingSql()">
346-
<pre data-bind="html: $component.generatedSql.mssql"></pre>
347-
</div>
348-
<div role="tabpanel" data-bind="visible: $component.exportSqlMode() == 'msaps' && !$component.isLoadingSql()">
349-
<pre data-bind="text: $component.generatedSql.msaps"></pre>
350-
</div>
351-
<div role="tabpanel" data-bind="visible: $component.exportSqlMode() == 'oracle' && !$component.isLoadingSql()">
352-
<pre data-bind="text: $component.generatedSql.oracle"></pre>
353-
</div>
354-
<div role="tabpanel" data-bind="visible: $component.exportSqlMode() == 'postgresql' && !$component.isLoadingSql()">
355-
<pre data-bind="text: $component.generatedSql.postgresql"></pre>
356-
</div>
357-
<div role="tabpanel" data-bind="visible: $component.exportSqlMode() == 'redshift' && !$component.isLoadingSql()">
358-
<pre data-bind="text: $component.generatedSql.redshift"></pre>
359-
</div>
360-
<div role="tabpanel" data-bind="visible: $component.exportSqlMode() == 'impala' && !$component.isLoadingSql()">
361-
<pre data-bind="text: $component.generatedSql.impala"></pre>
362-
</div>
363-
<div role="tabpanel" data-bind="visible: $component.exportSqlMode() == 'netezza' && !$component.isLoadingSql()">
364-
<pre data-bind="text: $component.generatedSql.netezza"></pre>
365-
</div>
366-
<div role="tabpanel" data-bind="visible: $component.exportSqlMode() == 'bigquery' && !$component.isLoadingSql()">
367-
<pre data-bind="text: $component.generatedSql.bigquery"></pre>
368-
</div>
308+
<div id='sqlTranslate'>
309+
<tabs params="tabs: $component.translateParams" />
310+
</tabs>
369311
</div>
370-
</div>
312+
</div>
371313
</div>
372314
</div>
373315
</div>

‎js/pages/cohort-definitions/cohort-definition-manager.js

Lines changed: 29 additions & 66 deletions
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,8 @@ define(['jquery', 'knockout', 'text!./cohort-definition-manager.html',
4747
'components/modal',
4848
'components/modal-exit-message',
4949
'./components/reporting/cohort-reports/cohort-reports',
50-
'components/security/access/configure-access-modal'
50+
'components/security/access/configure-access-modal',
51+
'components/export/export-sql',
5152
], function (
5253
$,
5354
ko,
@@ -236,16 +237,6 @@ define(['jquery', 'knockout', 'text!./cohort-definition-manager.html',
236237

237238
this.renderCountColumn = datatableUtils.renderCountColumn;
238239

239-
this.generatedSql = {};
240-
this.generatedSql.mssql = ko.observable('');
241-
this.generatedSql.oracle = ko.observable('');
242-
this.generatedSql.postgresql = ko.observable('');
243-
this.generatedSql.redshift = ko.observable('');
244-
this.generatedSql.msaps = ko.observable('');
245-
this.generatedSql.impala = ko.observable('');
246-
this.generatedSql.netezza = ko.observable('');
247-
this.generatedSql.bigquery = ko.observable('');
248-
this.templateSql = ko.observable('');
249240
this.cohortConst = cohortConst;
250241
this.generationTabMode = ko.observable("inclusion");
251242
this.inclusionTabMode = ko.observable("person");
@@ -677,6 +668,16 @@ define(['jquery', 'knockout', 'text!./cohort-definition-manager.html',
677668
reportSourceKey: this.reportSourceKey,
678669

679670
}
671+
this.translateParams = [];
672+
globalConstants.dialects.forEach(d => {
673+
let param = {};
674+
param.title = d.title;
675+
param.dialect = d;
676+
param.translate = ko.observable('');
677+
param.componentName = 'export-sql';
678+
param.componentParams = {'parent': this, 'dialect': d};
679+
this.translateParams.push(param);
680+
});
680681
PermissionService.decorateComponent(this, {
681682
entityTypeGetter: () => entityType.COHORT_DEFINITION,
682683
entityIdGetter: () => this.currentCohortDefinition().id(),
@@ -806,65 +807,27 @@ define(['jquery', 'knockout', 'text!./cohort-definition-manager.html',
806807

807808
showSql () {
808809
this.isLoadingSql(true);
809-
810-
this.templateSql('');
811-
this.generatedSql.mssql('');
812-
this.generatedSql.oracle('');
813-
this.generatedSql.postgresql('');
814-
this.generatedSql.redshift('');
815-
this.generatedSql.msaps('');
816-
this.generatedSql.impala('');
817-
this.generatedSql.netezza('');
818-
this.generatedSql.bigquery('');
819-
810+
820811
var templateSqlPromise = this.service.getSql(ko.toJS(this.currentCohortDefinition().expression, pruneJSON));
821-
812+
822813
templateSqlPromise.then((result) => {
823-
this.templateSql(result.templateSql);
824-
var mssqlTranslatePromise = this.service.translateSql(result.templateSql, 'sql server');
825-
mssqlTranslatePromise.then(({data}) => {
826-
this.generatedSql.mssql(data.targetSQL);
827-
});
828-
829-
var msapsTranslatePromise = this.service.translateSql(result.templateSql, 'pdw');
830-
msapsTranslatePromise.then(({data}) => {
831-
this.generatedSql.msaps(data.targetSQL);
832-
});
833-
834-
var oracleTranslatePromise = this.service.translateSql(result.templateSql, 'oracle');
835-
oracleTranslatePromise.then(({data}) => {
836-
this.generatedSql.oracle(data.targetSQL);
837-
});
838-
839-
var postgresTranslatePromise = this.service.translateSql(result.templateSql, 'postgresql');
840-
postgresTranslatePromise.then(({data}) => {
841-
this.generatedSql.postgresql(data.targetSQL);
842-
});
843-
844-
var redshiftTranslatePromise = this.service.translateSql(result.templateSql, 'redshift');
845-
redshiftTranslatePromise.then(({data}) => {
846-
this.generatedSql.redshift(data.targetSQL);
847-
});
848-
849-
var impalaTranslatePromise = this.service.translateSql(result.templateSql, 'impala');
850-
impalaTranslatePromise.then(({data}) => {
851-
this.generatedSql.impala(data.targetSQL);
852-
});
853-
854-
var netezzaTranslatePromise = this.service.translateSql(result.templateSql, 'netezza');
855-
netezzaTranslatePromise.then(({data})=> {
856-
this.generatedSql.netezza(data.targetSQL);
857-
});
858-
859-
const bigqueryTranslatePromise = this.service.translateSql(result.templateSql, 'bigquery');
860-
bigqueryTranslatePromise.then(({data}) => this.generatedSql.bigquery(data.targetSQL));
861-
862-
$.when(mssqlTranslatePromise, msapsTranslatePromise, oracleTranslatePromise, postgresTranslatePromise, redshiftTranslatePromise, impalaTranslatePromise, netezzaTranslatePromise).then(() => {
863-
this.isLoadingSql(false);
814+
const sql = result.templateSql;
815+
this.translateParams.filter(p => p.dialect.template).forEach(p => p.translate(sql));
816+
817+
const promises = this.translateParams.filter(p => !p.dialect.template).map(p => {
818+
return this.service.translateSql(sql, p.dialect.value).then(({data}) => p.translate(data.targetSQL));
819+
})
820+
821+
Promise.all(promises).then(() => {
822+
this.isLoadingSql(false);
864823
});
865824
});
866825
}
867826

827+
getGeneratedSql(dialect) {
828+
return this.translateParams.find(p => p.dialect === dialect).translate();
829+
}
830+
868831
getSourceKeyInfo (sourceKey) {
869832
return this.cohortDefinitionSourceInfo().filter((d) => {
870833
return d.sourceKey == sourceKey
@@ -1555,8 +1518,8 @@ define(['jquery', 'knockout', 'text!./cohort-definition-manager.html',
15551518
this.copyToClipboard('#btnCopyExpressionJSONClipboard', '#copyCohortExpressionJSONMessage');
15561519
}
15571520

1558-
copyCohortSQLToClipboard () {
1559-
this.copyToClipboard('#btnCopyCohortSQLClipboard', '#copyCopyCohortSQLMessage');
1521+
copySQLToClipboard () {
1522+
this.copyToClipboard('#btnCopySQLClipboard', '#copyCopySQLMessage');
15601523
}
15611524

15621525
getExpressionJson() {

0 commit comments

Comments
 (0)