Skip to content

Commit 7b2e1c9

Browse files
authored
Merge pull request #3807 from syncfusion-content/ES-935084-DBL
934883: Test and resolve issues in UG all sections - ASP core MVC Dashboard Layout control.
2 parents b342946 + 28c1db8 commit 7b2e1c9

File tree

51 files changed

+502
-210
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

51 files changed

+502
-210
lines changed
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
public class adaptiveSpacingModel
2+
{
3+
public double[]? cellSpacing { get; set; }
4+
}

ej2-asp-core-mvc/code-snippet/dashboard-layout/adaptive-layout/tagHelper

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,12 @@
1+
2+
@{
3+
....
4+
adaptiveSpacingModel modelValue = new adaptiveSpacingModel();
5+
modelValue.cellSpacing = new double[] { 20, 20 };
6+
}
17
<div>
28
<!-- Dashboardlayout element declaration -->
3-
<ejs-dashboardlayout id="dashboard_layout" columns="5" mediaQuery="max-width: 700px" cellSpacing="@Model.cellSpacing">
9+
<ejs-dashboardlayout id="dashboard_layout" columns="5" mediaQuery="max-width: 700px" cellSpacing="@modelValue.cellSpacing">
410
<e-dashboardlayout-panels>
511
<e-dashboardlayout-panel sizeX="1" sizeY="1" row="0" col="0" content="<div>0</div>">
612
</e-dashboardlayout-panel>
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
public class panelCellSpacingModel
2+
{
3+
public double[]? cellSpacing { get; set; }
4+
}

ej2-asp-core-mvc/code-snippet/dashboard-layout/add-panel/tagHelper

Lines changed: 13 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,10 @@
1+
@{
2+
...
3+
var data = new string[] { "Panel0", "Panel1", "Panel2", "Panel3", "Panel4", "Panel5", "Panel6" };
4+
panelCellSpacingModel modelValue = new panelCellSpacingModel();
5+
modelValue.cellSpacing = new double[] { 10, 10 };
6+
}
7+
18
<div id="api_property">
29
<div style="display:inline-block">
310
<div style="padding:5px;padding-right: 40px;">
@@ -21,7 +28,7 @@
2128
</div>
2229
<div style="padding:5px; width: 240px;">
2330
<!-- Dropdownlist element declaration -->
24-
<ejs-dropdownlist id="dropdown" placeholder="Select a id value" dataSource="@ViewBag.data" width="150px" index="0"></ejs-dropdownlist>
31+
<ejs-dropdownlist id="dropdown" placeholder="Select a id value" dataSource="data" width="150px" index="0"></ejs-dropdownlist>
2532
</div>
2633
<div style="padding:5px;">
2734
<div style="width:100%">
@@ -33,7 +40,7 @@
3340
</div>
3441
<div style="padding-top: 15px;" id="control_dash">
3542
<!-- Dashboardlayout element declaration -->
36-
<ejs-dashboardlayout id="dashboard_layout" columns="5" cellSpacing="@Model.cellSpacing">
43+
<ejs-dashboardlayout id="dashboard_layout" columns="5" cellSpacing="@modelValue.cellSpacing">
3744
<e-dashboardlayout-panels>
3845
<e-dashboardlayout-panel id="Panel0" sizeX="1" sizeY="1" row="0" col="0" content="<div class='content'>0</div>">
3946
</e-dashboardlayout-panel>
@@ -102,12 +109,12 @@
102109

103110
#control_dash {
104111
display: block;
105-
width:60%;
106-
float:left;
107-
}
112+
width: 60%;
113+
float: left;
114+
}
108115

109116
#api_property {
110117
display: inline-block;
111-
margin:30px;
118+
margin: 30px;
112119
}
113120
</style>
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
public class cellSpacingModel
2+
{
3+
public double[] cellSpacing { get; set; }
4+
}

ej2-asp-core-mvc/code-snippet/dashboard-layout/cell-spacing/tagHelper

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,13 @@
1+
@{
2+
...
3+
cellSpacingModel modelValue = new cellSpacingModel();
4+
modelValue.cellSpacing = new double[] { 20, 20 };
5+
}
6+
7+
18
<div>
29
<!-- Dashboardlayout element declaration -->
3-
<ejs-dashboardlayout id="dashboard_layout" columns="5" cellSpacing="@Model.cellSpacing">
10+
<ejs-dashboardlayout id="dashboard_layout" columns="5" cellSpacing="@modelValue.cellSpacing">
411
<e-dashboardlayout-panels>
512
<e-dashboardlayout-panel sizeX="1" sizeY="1" row="0" col="0" content="<div>0</div>">
613
</e-dashboardlayout-panel>
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
public class panelCellSpacingModel
2+
{
3+
public double[]? cellSpacing { get; set; }
4+
}

ej2-asp-core-mvc/code-snippet/dashboard-layout/content-panel/tagHelper

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,13 @@
1+
@{
2+
...
3+
panelCellSpacingModel modelValue = new panelCellSpacingModel();
4+
modelValue.cellSpacing = new double[] { 10, 10 };
5+
}
6+
7+
18
<div>
29
<!-- Dashboardlayout element declaration -->
3-
<ejs-dashboardlayout id="dashboard_default" columns="6" cellSpacing="@Model.cellSpacing">
10+
<ejs-dashboardlayout id="dashboard_default" columns="6" cellSpacing="@modelValue.cellSpacing">
411
<e-dashboardlayout-panels>
512
<e-dashboardlayout-panel id="Panel0" sizeX="1" sizeY="1" row="0" col="0" header="<div>Panel 0</div>" content="<div class='content'>Panel Content</div>">
613
</e-dashboardlayout-panel>
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
public class ddCellSpacingModel
2+
{
3+
public double[]? cellSpacing { get; set; }
4+
}

ej2-asp-core-mvc/code-snippet/dashboard-layout/disable-dragging/tagHelper

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,11 @@
1-
@model WebApplication.Controllers.HomeController.spacingModel
1+
@{
2+
...
3+
ddCellSpacingModel modelValue = new ddCellSpacingModel();
4+
modelValue.cellSpacing = new double[] { 10, 10 };
5+
}
26

37
<div>
4-
<ejs-dashboardlayout id="dashboard_layout" columns="5" cellSpacing="@Model.cellSpacing" allowDragging="false">
8+
<ejs-dashboardlayout id="dashboard_layout" columns="5" cellSpacing="@modelValue.cellSpacing" allowDragging="false">
59
<e-dashboardlayout-panels>
610
<e-dashboardlayout-panel sizeX="1" sizeY="1" row="0" col="0" content="<div>0</div>">
711
</e-dashboardlayout-panel>
@@ -29,4 +33,4 @@
2933
text-align: center;
3034
line-height: 90px;
3135
}
32-
</style>
36+
</style>
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
public class ddCellSpacingModel
2+
{
3+
public double[]? cellSpacing { get; set; }
4+
}

ej2-asp-core-mvc/code-snippet/dashboard-layout/drag-and-drop/tagHelper

Lines changed: 19 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,13 @@
1+
@{
2+
...
3+
ddCellSpacingModel modelValue = new ddCellSpacingModel();
4+
modelValue.cellSpacing = new double[] { 10, 10 };
5+
}
6+
7+
18
<div>
29
<!-- Dashboardlayout element declaration -->
3-
<ejs-dashboardlayout id="dashboard_layout" columns="5" cellSpacing="@Model.cellSpacing" drag="onDrag" dragStart="onDragStart" dragStop="onDragStop">
10+
<ejs-dashboardlayout id="dashboard_layout" columns="5" cellSpacing="@modelValue.cellSpacing" drag="onDrag" dragStart="onDragStart" dragStop="onDragStop">
411
<e-dashboardlayout-panels>
512
<e-dashboardlayout-panel sizeX="1" sizeY="1" row="0" col="0" content="<div>0</div>">
613
</e-dashboardlayout-panel>
@@ -21,23 +28,23 @@
2128
</div>
2229
<!-- end of dashboardlayout element -->
2330
<script>
24-
function onDrag(args) {
25-
console.log("Dragging");
26-
}
27-
function onDragStart(args) {
28-
console.log("Drag Start");
29-
}
30-
function onDragStop(args) {
31-
console.log("Drag Stop");
32-
}
31+
function onDrag(args) {
32+
console.log("Dragging");
33+
}
34+
function onDragStart(args) {
35+
console.log("Drag Start");
36+
}
37+
function onDragStop(args) {
38+
console.log("Drag Stop");
39+
}
3340
</script>
3441
<style>
35-
/* DashboardLayout element styles */
42+
/* DashboardLayout element styles */
3643
#dashboard_layout .e-panel .e-panel-container {
3744
vertical-align: middle;
3845
font-weight: 600;
3946
font-size: 20px;
4047
text-align: center;
4148
line-height: 90px;
4249
}
43-
</style>
50+
</style>
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
public class componentSpacingModel
2+
{
3+
public double[]? cellSpacing { get; set; }
4+
}
5+
public class ChartData
6+
{
7+
public string? month;
8+
public double sales;
9+
}
10+
public class LineData
11+
{
12+
public double x;
13+
public double y;
14+
}
15+
16+
public class PieData
17+
{
18+
public string x;
19+
public double y;
20+
public string? text;
21+
}

ej2-asp-core-mvc/code-snippet/dashboard-layout/dragging-handler/tagHelper

Lines changed: 46 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,48 @@
1+
@{
2+
...
3+
componentSpacingModel modelValue = new componentSpacingModel();
4+
modelValue.cellSpacing = new double[] { 10, 10 };
5+
6+
List<ChartData> chartData = new List<ChartData>
7+
{
8+
new ChartData { month = "Jan", sales = 35, },
9+
new ChartData { month = "Feb", sales = 28, },
10+
new ChartData { month = "Mar", sales = 34, },
11+
new ChartData { month = "Apr", sales = 32, },
12+
new ChartData { month = "May", sales = 40, },
13+
new ChartData { month = "Jun", sales = 32, },
14+
new ChartData { month = "Jul", sales = 35, },
15+
new ChartData { month = "Aug", sales = 55, },
16+
new ChartData { month = "Sep", sales = 38, },
17+
new ChartData { month = "Oct", sales = 30, },
18+
new ChartData { month = "Nov", sales = 25, },
19+
new ChartData { month = "Dec", sales = 32, }
20+
};
21+
22+
List<LineData> lineData = new List<LineData>
23+
{
24+
new LineData { x = 2013, y = 28, },
25+
new LineData { x = 2014, y = 25, },
26+
new LineData { x = 2015, y = 26, },
27+
new LineData { x = 2016, y = 27, },
28+
new LineData { x = 2017, y = 32, },
29+
new LineData { x = 2018, y = 35, }
30+
};
31+
32+
List<PieData> pieData1 = new List<PieData>
33+
{
34+
new PieData { x = "Chrome", y = 37, text = "37%", },
35+
new PieData { x = "UC Browser", y = 17, text = "17%", },
36+
new PieData { x = "iPhone", y = 19, text = "19%", },
37+
new PieData { x = "Others", y = 4, text = "4%", },
38+
new PieData { x = "Opera", y = 11, text = "11%", },
39+
new PieData { x = "Android", y = 12, text = "12%", }
40+
};
41+
}
42+
143
<div>
244
<!-- Dashboardlayout element declaration -->
3-
<ejs-dashboardlayout id="dashboard_default" columns="6" draggableHandle=".e-panel-header" cellSpacing="@Model.cellSpacing">
45+
<ejs-dashboardlayout id="dashboard_default" columns="6" draggableHandle=".e-panel-header" cellSpacing="@modelValue.cellSpacing">
446
<e-dashboardlayout-panels>
547
<e-dashboardlayout-panel id="Panel1" sizeX="3" sizeY="2" row="0" col="3" header="<div class='header'>Last year sales comparison</div><span class='handler e-icons burg-icon'></span>" content="#column">
648
</e-dashboardlayout-panel>
@@ -17,7 +59,7 @@
1759
<ejs-chart id="columnChart" height="162px">
1860
<e-chart-primaryxaxis valueType="Category"></e-chart-primaryxaxis>
1961
<e-series-collection>
20-
<e-series dataSource="ViewBag.chartSource" xName='month' yName='sales' type="@Syncfusion.EJ2.Charts.ChartSeriesType.Column">
62+
<e-series dataSource="chartData" xName='month' yName='sales' type="@Syncfusion.EJ2.Charts.ChartSeriesType.Column">
2163
</e-series>
2264
</e-series-collection>
2365
</ejs-chart>
@@ -29,7 +71,7 @@
2971
<ejs-chart id="lineChart" height="162px">
3072
<e-chart-primaryxaxis valueType="Category"></e-chart-primaryxaxis>
3173
<e-series-collection>
32-
<e-series dataSource="ViewBag.lineSource" xName='x' yName='y' type="@Syncfusion.EJ2.Charts.ChartSeriesType.Line">
74+
<e-series dataSource="lineData" xName='x' yName='y' type="@Syncfusion.EJ2.Charts.ChartSeriesType.Line">
3375
</e-series>
3476
</e-series-collection>
3577
</ejs-chart>
@@ -43,7 +85,7 @@
4385
<e-accumulationchart-legendsettings visible="false">
4486
</e-accumulationchart-legendsettings>
4587
<e-accumulation-series-collection>
46-
<e-accumulation-series dataSource="ViewBag.pieSource1" xName="x" yName="y" radius="70%" name="Browser">
88+
<e-accumulation-series dataSource="pieData1" xName="x" yName="y" radius="70%" name="Browser">
4789
<e-accumulationseries-datalabel name="text" visible="true" position="Inside">
4890
</e-accumulationseries-datalabel>
4991
</e-accumulation-series>
Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
public class floatingSpacingModel
2+
{
3+
public double[]? cellSpacing { get; set; }
4+
}
5+

ej2-asp-core-mvc/code-snippet/dashboard-layout/floating-panels/tagHelper

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,18 @@
1+
2+
@{
3+
....
4+
floatingSpacingModel modelValue = new floatingSpacingModel();
5+
modelValue.cellSpacing = new double[] { 10, 10 };
6+
}
7+
18
<div>
29
<!-- Button element declaration -->
310
<ejs-button id="toggle" cssClass="e-flat e-primary e-outline" content="Enable Floating" isToggle="true"></ejs-button>
4-
<!-- end of button element -->
11+
<!-- end of button element -->
512
</div>
613
<div style="padding-top: 15px;">
714
<!-- DashboardLayout element declaration -->
8-
<ejs-dashboardlayout id="dashboard_default" columns="6" allowFloating="false" cellSpacing="@Model.cellSpacing">
15+
<ejs-dashboardlayout id="dashboard_default" columns="6" allowFloating="false" cellSpacing="@modelValue.cellSpacing">
916
<e-dashboardlayout-panels>
1017
<e-dashboardlayout-panel sizeX="2" sizeY="2" row="1" col="0" content="<div class='content'>0</div>">
1118
</e-dashboardlayout-panel>
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
public class cellSpacingModel
2+
{
3+
public double[] cellSpacing { get; set; }
4+
}

ej2-asp-core-mvc/code-snippet/dashboard-layout/graphical-representation/tagHelper

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,13 @@
1+
@{
2+
...
3+
cellSpacingModel modelValue = new cellSpacingModel();
4+
modelValue.cellSpacing = new double[] { 10, 10 };
5+
}
6+
7+
18
<div>
29
<!-- DashboardLayout element declaration -->
3-
<ejs-dashboardlayout id="dashboard_layout" columns="5" showGridLines="true" cellSpacing="@Model.cellSpacing">
10+
<ejs-dashboardlayout id="dashboard_layout" columns="5" showGridLines="true" cellSpacing="@modelValue.cellSpacing">
411
<e-dashboardlayout-panels>
512
<e-dashboardlayout-panel sizeX="3" sizeY="2" row="0" col="1" content="<div>1</div>">
613
</e-dashboardlayout-panel>
Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
public class cellSpacingModel
2+
{
3+
public double[] cellSpacing { get; set; }
4+
public double aspectRatio { get; set; }
5+
}

ej2-asp-core-mvc/code-snippet/dashboard-layout/modifying-cell-size/tagHelper

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,14 @@
1+
@{
2+
...
3+
cellSpacingModel modelValue = new cellSpacingModel();
4+
modelValue.cellSpacing = new double[] { 10, 10 };
5+
modelValue.aspectRatio = 100 / 50;
6+
}
7+
8+
19
<div>
210
<!-- DashboardLayout element declaration -->
3-
<ejs-dashboardlayout id="dashboard_layout" columns="5" cellAspectRatio="@Model.aspectRatio" cellSpacing="@Model.cellSpacing">
11+
<ejs-dashboardlayout id="dashboard_layout" columns="5" cellAspectRatio="@modelValue.aspectRatio" cellSpacing="@modelValue.cellSpacing">
412
<e-dashboardlayout-panels>
513
<e-dashboardlayout-panel sizeX="1" sizeY="1" row="0" col="0" content="<div class='content'>0</div>">
614
</e-dashboardlayout-panel>
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
public class ddCellSpacingModel
2+
{
3+
public double[]? cellSpacing { get; set; }
4+
}

0 commit comments

Comments
 (0)