From 033be21e108c7e80cfb0bd9e8258a339066bd8a5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jan=20Henrik=20=C3=98verland?= Date: Tue, 28 Jan 2020 16:45:55 +0100 Subject: [PATCH] fix: layout for pivot tables (#577) * fix: rename constant value * fix: update analytics dep --- packages/app/i18n/en.pot | 20 ++++--- packages/app/package.json | 2 +- .../Layout/DefaultLayout/DefaultAxis.js | 5 +- packages/app/src/components/Layout/Layout.js | 3 + .../PivotTableLayout/PivotTableLayout.js | 57 +++++++++++++++++++ .../styles/PivotTableLayout.style.js | 14 +++++ packages/plugin/package.json | 2 +- yarn.lock | 8 +-- 8 files changed, 97 insertions(+), 14 deletions(-) create mode 100644 packages/app/src/components/Layout/PivotTableLayout/PivotTableLayout.js create mode 100644 packages/app/src/components/Layout/PivotTableLayout/styles/PivotTableLayout.style.js diff --git a/packages/app/i18n/en.pot b/packages/app/i18n/en.pot index cd8c0f6840..8eb2d31c8f 100644 --- a/packages/app/i18n/en.pot +++ b/packages/app/i18n/en.pot @@ -5,8 +5,8 @@ msgstr "" "Content-Type: text/plain; charset=utf-8\n" "Content-Transfer-Encoding: 8bit\n" "Plural-Forms: nplurals=2; plural=(n != 1)\n" -"POT-Creation-Date: 2020-01-20T08:17:07.464Z\n" -"PO-Revision-Date: 2020-01-20T08:17:07.464Z\n" +"POT-Creation-Date: 2020-01-28T14:43:38.800Z\n" +"PO-Revision-Date: 2020-01-28T14:43:38.800Z\n" msgid "Rename successful" msgstr "" @@ -104,6 +104,12 @@ msgstr "" msgid "{{dimensionName}} is locked to {{axisName}} for {{visTypeName}}" msgstr "" +msgid "Columns" +msgstr "" + +msgid "Rows" +msgstr "" + msgid "None selected" msgstr "" @@ -394,15 +400,15 @@ msgstr "" msgid "Skip rounding" msgstr "" -msgid "Custom sort order" -msgstr "" - msgid "Low to high" msgstr "" msgid "High to low" msgstr "" +msgid "Custom sort order" +msgstr "" + msgid "Add a subtitle" msgstr "" @@ -440,8 +446,8 @@ msgid "No data available" msgstr "" msgid "" -"The selected dimensions didn’t return any data. There may be no data, or\n" -" you may not have access to it." +"The selected dimensions didn’t return any data. There may be no data, or " +"you may not have access to it." msgstr "" msgid "Series is empty" diff --git a/packages/app/package.json b/packages/app/package.json index de108a0130..48d3c2fbce 100644 --- a/packages/app/package.json +++ b/packages/app/package.json @@ -12,7 +12,7 @@ "redux-mock-store": "^1.5.3" }, "dependencies": { - "@dhis2/analytics": "^2.8.5", + "@dhis2/analytics": "^2.8.6", "@dhis2/d2-ui-core": "^6.5.0", "@dhis2/d2-ui-file-menu": "^6.5.0", "@dhis2/d2-ui-interpretations": "^6.5.0", diff --git a/packages/app/src/components/Layout/DefaultLayout/DefaultAxis.js b/packages/app/src/components/Layout/DefaultLayout/DefaultAxis.js index 8634039d37..22dc09b040 100644 --- a/packages/app/src/components/Layout/DefaultLayout/DefaultAxis.js +++ b/packages/app/src/components/Layout/DefaultLayout/DefaultAxis.js @@ -66,7 +66,9 @@ class Axis extends React.Component { onDragOver={this.onDragOver} onDrop={this.onDrop} > -
{getAxisName(axisId)}
+
+ {this.props.label || getAxisName(axisId)} +
{provided => (
{ diff --git a/packages/app/src/components/Layout/PivotTableLayout/PivotTableLayout.js b/packages/app/src/components/Layout/PivotTableLayout/PivotTableLayout.js new file mode 100644 index 0000000000..05eb3aad97 --- /dev/null +++ b/packages/app/src/components/Layout/PivotTableLayout/PivotTableLayout.js @@ -0,0 +1,57 @@ +import React from 'react' +import i18n from '@dhis2/d2-i18n' +import { + AXIS_ID_COLUMNS, + AXIS_ID_ROWS, + AXIS_ID_FILTERS, +} from '@dhis2/analytics' + +import DefaultAxis from '../DefaultLayout/DefaultAxis' +import defaultAxisStyles from '../DefaultLayout/styles/DefaultAxis.style' +import defaultLayoutStyles from '../DefaultLayout/styles/DefaultLayout.style' +import pivotTableLayoutStyles from './styles/PivotTableLayout.style' + +const Layout = () => ( +
+
+ + +
+
+ +
+
+) + +Layout.displayName = 'Layout' + +export default Layout diff --git a/packages/app/src/components/Layout/PivotTableLayout/styles/PivotTableLayout.style.js b/packages/app/src/components/Layout/PivotTableLayout/styles/PivotTableLayout.style.js new file mode 100644 index 0000000000..db0acd7ae1 --- /dev/null +++ b/packages/app/src/components/Layout/PivotTableLayout/styles/PivotTableLayout.style.js @@ -0,0 +1,14 @@ +// Axis +export const FILTER_AXIS_WIDTH = '50%' + +// Axis (generated) +export const DIMENSION_AXIS_WIDTH = `${100 - parseInt(FILTER_AXIS_WIDTH, 10)}%` + +export default { + axisGroupLeft: { + flexBasis: DIMENSION_AXIS_WIDTH, + }, + axisGroupRight: { + flexBasis: FILTER_AXIS_WIDTH, + }, +} diff --git a/packages/plugin/package.json b/packages/plugin/package.json index cc230e11fc..6429722bbc 100644 --- a/packages/plugin/package.json +++ b/packages/plugin/package.json @@ -6,7 +6,7 @@ "module": "./build/es/lib.js", "license": "BSD-3-Clause", "dependencies": { - "@dhis2/analytics": "^2.8.5", + "@dhis2/analytics": "^2.8.6", "@material-ui/core": "^3.1.2", "d2-analysis": "33.2.11", "lodash-es": "^4.17.11", diff --git a/yarn.lock b/yarn.lock index 95b474d618..cc4fad754a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1442,10 +1442,10 @@ react-beautiful-dnd "^10.1.1" styled-jsx "^3.2.1" -"@dhis2/analytics@^2.8.5": - version "2.8.5" - resolved "https://registry.yarnpkg.com/@dhis2/analytics/-/analytics-2.8.5.tgz#8c0ae9a5c3b63d49901f895630a080fd5e5358bf" - integrity sha512-+M8WSHvt7Jscuc5cS/HPsLQRRTKayf3GSQDuVIGToaYt7paskJBSK9gA8ldu6pcRkdYho7JPg7C852JEbM8Y4g== +"@dhis2/analytics@^2.8.6": + version "2.8.6" + resolved "https://registry.yarnpkg.com/@dhis2/analytics/-/analytics-2.8.6.tgz#15102d5155ba933e494b8b1409e81058899e1863" + integrity sha512-YY3f+RuCuSblyriwjF5w98P5zSse31QwHG9B8/oGIKkAxS5yZL7N4XWE1woNTz9V71x2yFl9pCOYTM0QfVp9CA== dependencies: "@dhis2/d2-i18n" "^1.0.4" "@dhis2/d2-ui-org-unit-dialog" "^6.3.2"