diff --git a/public/app/features/dashboard/dashboard_model.ts b/public/app/features/dashboard/dashboard_model.ts index eba4cfa398f..dccd910a85e 100644 --- a/public/app/features/dashboard/dashboard_model.ts +++ b/public/app/features/dashboard/dashboard_model.ts @@ -342,7 +342,6 @@ export class DashboardModel { let minWidth = panel.minSpan || 6; let xPos = 0; let yPos = panel.gridPos.y; - let yOffset = 0; for (let index = 0; index < selectedOptions.length; index++) { let option = selectedOptions[index]; @@ -353,11 +352,10 @@ export class DashboardModel { copy.scopedVars[variable.name] = option; if (panel.repeatDirection === REPEAT_DIR_VERTICAL) { - copy.gridPos.y = yPos; - yPos += copy.gridPos.h; if (index > 0) { - yOffset += copy.gridPos.h; + yPos += copy.gridPos.h; } + copy.gridPos.y = yPos; } else { // set width based on how many are selected // assumed the repeated panels should take up full row width @@ -371,12 +369,12 @@ export class DashboardModel { if (xPos + copy.gridPos.w > GRID_COLUMN_COUNT) { xPos = 0; yPos += copy.gridPos.h; - yOffset += copy.gridPos.h; } } } // Update gridPos for panels below + let yOffset = yPos - panel.gridPos.y; if (yOffset > 0) { let panelBelowIndex = panelIndex + selectedOptions.length; for (let i = panelBelowIndex; i < this.panels.length; i++) { diff --git a/public/app/features/dashboard/specs/repeat.jest.ts b/public/app/features/dashboard/specs/repeat.jest.ts index ec3a1fbb7af..77b658e7780 100644 --- a/public/app/features/dashboard/specs/repeat.jest.ts +++ b/public/app/features/dashboard/specs/repeat.jest.ts @@ -184,18 +184,8 @@ describe('given dashboard with row repeat and panel repeat in horizontal directi beforeEach(() => { dashboardJSON = { panels: [ - { - id: 1, - type: 'row', - repeat: 'region', - gridPos: { x: 0, y: 0, h: 1, w: 24 }, - }, - { - id: 2, - type: 'graph', - repeat: 'app', - gridPos: { x: 0, y: 1, h: 2, w: 6 }, - }, + { id: 1, type: 'row', repeat: 'region', gridPos: { x: 0, y: 0, h: 1, w: 24 } }, + { id: 2, type: 'graph', repeat: 'app', gridPos: { x: 0, y: 1, h: 2, w: 6 } }, ], templating: { list: [ @@ -250,21 +240,21 @@ describe('given dashboard with row repeat and panel repeat in horizontal directi }); it('should be placed in their places', function() { - expect(dashboard.panels[0].gridPos).toMatchObject({ x: 0, y: 0, h: 1, w: 24 }); + expect(dashboard.panels[0].gridPos).toMatchObject({ x: 0, y: 0, h: 1, w: 24 }); // 1st row expect(dashboard.panels[1].gridPos).toMatchObject({ x: 0, y: 1, h: 2, w: 6 }); expect(dashboard.panels[2].gridPos).toMatchObject({ x: 6, y: 1, h: 2, w: 6 }); expect(dashboard.panels[3].gridPos).toMatchObject({ x: 12, y: 1, h: 2, w: 6 }); expect(dashboard.panels[4].gridPos).toMatchObject({ x: 18, y: 1, h: 2, w: 6 }); - expect(dashboard.panels[5].gridPos).toMatchObject({ x: 0, y: 3, h: 2, w: 6 }); + expect(dashboard.panels[5].gridPos).toMatchObject({ x: 0, y: 3, h: 2, w: 6 }); // next row expect(dashboard.panels[6].gridPos).toMatchObject({ x: 6, y: 3, h: 2, w: 6 }); expect(dashboard.panels[7].gridPos).toMatchObject({ x: 0, y: 5, h: 1, w: 24 }); - expect(dashboard.panels[8].gridPos).toMatchObject({ x: 0, y: 6, h: 2, w: 6 }); + expect(dashboard.panels[8].gridPos).toMatchObject({ x: 0, y: 6, h: 2, w: 6 }); // 2nd row expect(dashboard.panels[9].gridPos).toMatchObject({ x: 6, y: 6, h: 2, w: 6 }); expect(dashboard.panels[10].gridPos).toMatchObject({ x: 12, y: 6, h: 2, w: 6 }); - expect(dashboard.panels[11].gridPos).toMatchObject({ x: 18, y: 6, h: 2, w: 6 }); + expect(dashboard.panels[11].gridPos).toMatchObject({ x: 18, y: 6, h: 2, w: 6 }); // next row expect(dashboard.panels[12].gridPos).toMatchObject({ x: 0, y: 8, h: 2, w: 6 }); expect(dashboard.panels[13].gridPos).toMatchObject({ x: 6, y: 8, h: 2, w: 6 }); });