Skip to content

Commit 5e1559e

Browse files
essentialjs2essentialjs2
authored
Merge pull request #24 from Saranya13/master
config(EJ2-000): v18.4.39 released
2 parents f6737a5 + c191f74 commit 5e1559e

15 files changed

+357
-3
lines changed

‎public/styles/index.css

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -577,10 +577,10 @@ span.e-input-group.e-control-wrapper.e-ddl {
577577
}
578578

579579
.sb-search-input .e-ddl .e-clear-icon {
580-
background: #fff;
581580
margin-left: -5px;
582581
border-radius: 4px;
583582
border: none;
583+
border-bottom: 1px solid #969696;
584584
}
585585

586586
.search-no-record {
@@ -2521,6 +2521,7 @@ body.highcontrast,
25212521
}
25222522

25232523
.sb-npm-btn {
2524+
display: none;
25242525
background: #fff;
25252526
border: 1px solid #3c78ef;
25262527
border-radius: 3px;

‎src/pivot-table/aggregation.vue

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@
5252
</table>
5353
</div>
5454
<div id="action-description">
55-
<p>This sample demonstrates the aggregate types like sum, average, min, max, count, distinct count, and more in the pivot table for quick business analysis. End users can also change the aggregation type of each field bound to the value axis in the field list at runtime.</p>
55+
<p>This sample demonstrates the aggregate types like sum, average, median, min, max, count, distinct count, and more in the pivot table for quick business analysis. End users can also change the aggregation type of each field bound to the value axis in the field list at runtime.</p>
5656
</div>
5757
<div id="description">
5858
<p>
@@ -62,6 +62,7 @@
6262
<p>
6363
<code>Sum</code>,
6464
<code>Average</code>,
65+
<code>Median</code>,
6566
<code>Min</code>,
6667
<code>Max</code>,
6768
<code>Count</code>,
@@ -115,6 +116,7 @@ let data: IDataSet[] = JSON.parse(JSON.stringify(rData));
115116
let qData: { [key: string]: Object }[] = [
116117
{ value: "Sum", text: "Sum" },
117118
{ value: "Avg", text: "Average" },
119+
{ value: "Median", text: "Median" },
118120
{ value: "Max", text: "Max" },
119121
{ value: "Min", text: "Min" },
120122
{ value: "Count", text: "Count" },
@@ -137,6 +139,7 @@ let qData: { [key: string]: Object }[] = [
137139
let cData: { [key: string]: Object }[] = [
138140
{ value: "Sum", text: "Sum" },
139141
{ value: "Avg", text: "Average" },
142+
{ value: "Median", text: "Median" },
140143
{ value: "Max", text: "Max" },
141144
{ value: "Min", text: "Min" },
142145
{ value: "Product", text: "Product" },

‎src/pivot-table/sample.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33
"directory": "pivot-table",
44
"category": "Grids",
55
"ftName": "pivot-table",
6+
"type": "update",
67
"samples": [{
78
"url": "default",
89
"name": "Default Functionalities",
@@ -120,6 +121,7 @@
120121
"name": "Aggregation",
121122
"category": "Formula",
122123
"hideOnDevice": false,
124+
"type": "update",
123125
"description": "This demo for Essential JS2 Pivot Table control shows different types of aggregation for value fields",
124126
"api": {}
125127
},

‎src/spreadsheet/add-button.vue

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<template>
2+
<div>
3+
<ejs-button cssClass="e-flat" v-bind:style="{float: 'right'}" content="Add"></ejs-button>
4+
</div>
5+
</template>
6+
7+
<script>
8+
import Vue from "vue";
9+
import { ButtonPlugin } from '@syncfusion/ej2-vue-buttons';
10+
Vue.use(ButtonPlugin);
11+
12+
export default { }
13+
</script>

‎src/spreadsheet/address-textbox.vue

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<template>
2+
<div>
3+
<ejs-textbox rows="2" :multiline="true"></ejs-textbox>
4+
</div>
5+
</template>
6+
7+
<script>
8+
import Vue from "vue";
9+
import { TextBoxPlugin } from '@syncfusion/ej2-vue-inputs';
10+
Vue.use(TextBoxPlugin);
11+
12+
export default { }
13+
</script>

‎src/spreadsheet/cell-template.vue

Lines changed: 190 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,190 @@
1+
<template>
2+
<div class="control-section">
3+
<div id="spreadsheet-cell-template">
4+
<ejs-spreadsheet ref="spreadsheet" :showRibbon="false" :allowResizing="false" :showFormulaBar="false" :allowOpen="false" :allowSave="false" :scrollSettings="scrollSettings" :created="created" :allowEditing="false" :selectionSettings="selectionSettings">
5+
<e-sheets>
6+
<e-sheet name="Registration Form" :rowCount="40" :colCount="30" :showGridLines="false">
7+
<e-ranges>
8+
<e-range :template="nameTextbox" address="C2"></e-range>
9+
<e-range :template="dobTextbox" address="C3"></e-range>
10+
<e-range :template="genderRadiobutton" address="C4"></e-range>
11+
<e-range :template="dropdownlist" address="C5"></e-range>
12+
<e-range :template="multiselect" address="C6"></e-range>
13+
<e-range :template="mobileTextbox" address="C7"></e-range>
14+
<e-range :template="emailTextbox" address="C8"></e-range>
15+
<e-range :template="addressTextbox" address="C9"></e-range>
16+
<e-range :template="addButton" address="C11"></e-range>
17+
</e-ranges>
18+
<e-rows>
19+
<e-row height=55>
20+
<e-cells>
21+
<e-cell index=1 value="Interview Registration Form"></e-cell>
22+
</e-cells>
23+
</e-row>
24+
<e-row height=55>
25+
<e-cells>
26+
<e-cell index=1 value="Name:"></e-cell>
27+
</e-cells>
28+
</e-row>
29+
<e-row height=45>
30+
<e-cells>
31+
<e-cell index=1 value="Date of Birth:"></e-cell>
32+
</e-cells>
33+
</e-row>
34+
<e-row height=45>
35+
<e-cells>
36+
<e-cell index=1 value="Gender:"></e-cell>
37+
</e-cells>
38+
</e-row>
39+
<e-row height=45>
40+
<e-cells>
41+
<e-cell index=1 value="Year of Experience:"></e-cell>
42+
</e-cells>
43+
</e-row>
44+
<e-row height=45>
45+
<e-cells>
46+
<e-cell index=1 value="Areas of Interest:"></e-cell>
47+
</e-cells>
48+
</e-row>
49+
<e-row height=45>
50+
<e-cells>
51+
<e-cell index=1 value="Mobile Number:"></e-cell>
52+
</e-cells>
53+
</e-row>
54+
<e-row height=45>
55+
<e-cells>
56+
<e-cell index=1 value="Email:"></e-cell>
57+
</e-cells>
58+
</e-row>
59+
<e-row height=82>
60+
<e-cells>
61+
<e-cell index=1 value="Address:"></e-cell>
62+
</e-cells>
63+
</e-row>
64+
</e-rows>
65+
<e-columns>
66+
<e-column index=1 :width="190"></e-column>
67+
<e-column :width="350"></e-column>
68+
</e-columns>
69+
</e-sheet>
70+
</e-sheets>
71+
</ejs-spreadsheet>
72+
</div>
73+
<div id="action-description">
74+
<p>
75+
This sample demonstrates cell template feature with interview registration form scenario using input components.
76+
</p>
77+
</div>
78+
<div id="description">
79+
<p>
80+
In this demo, cell template is applied to `C2:C9` and instantiated with input components like TextBox, DropDownList,
81+
Button, RadioButton, MultiSelect etc.
82+
</p>
83+
<p>
84+
More information about cell template feature can be found in this
85+
<a target="_blank" href="https://ej2.syncfusion.com/vue/documentation/spreadsheet/getting-started">
86+
documentation</a> section.
87+
</p>
88+
</div>
89+
</div>
90+
</template>
91+
<!-- custom code start -->
92+
<style>
93+
#spreadsheet-cell-template {
94+
height: 550px;
95+
}
96+
97+
.e-spreadsheet .e-main-panel .e-main-content {
98+
margin-left: 0 !important;
99+
}
100+
101+
#sb-content .e-spreadsheet .e-tab .e-tab-text {
102+
display: inherit;
103+
}
104+
105+
.ej2-new .sb-header,
106+
.ej2-new .sb-bread-crumb,
107+
.ej2-new #action-description,
108+
.ej2-new #description-section,
109+
.ej2-new #description {
110+
display: none
111+
}
112+
113+
.ej2-new .container-fluid,
114+
.ej2-new .container-fluid .control-section,
115+
#sidebar-section {
116+
padding: 0px;
117+
}
118+
119+
.ej2-new .sample-browser>.content.e-view {
120+
top: 0px;
121+
padding: 0px;
122+
text-align: initial;
123+
height: 100%;
124+
overflow: hidden;
125+
}
126+
127+
.ej2-new .control-section .control-section {
128+
height: 100vh;
129+
}
130+
</style>
131+
<!-- custom code end -->
132+
<script>
133+
import Vue from "vue";
134+
import { SpreadsheetPlugin } from "@syncfusion/ej2-vue-spreadsheet";
135+
import nameTextboxTemplate from "./name-textbox.vue";
136+
import dobTextboxTemplate from "./dob-textbox.vue";
137+
import genderRadioTemplate from "./gender-radiobutton.vue";
138+
import dropdownlistTemplate from "./dropdownlist.vue";
139+
import multiselectTemplate from "./multiselect.vue";
140+
import mobileTextboxTemplate from "./mobile-textbox.vue";
141+
import emailTextboxTemplate from "./email-textbox.vue";
142+
import addressTextboxTemplate from "./address-textbox.vue";
143+
import addButtonTemplate from "./add-button.vue";
144+
Vue.use(SpreadsheetPlugin);
145+
export default Vue.extend({
146+
data: () => {
147+
return {
148+
scrollSettings: { isFinite: true },
149+
selectionSettings: { mode: 'None' },
150+
nameTextbox: function() {
151+
return { template: nameTextboxTemplate }
152+
},
153+
dobTextbox: function() {
154+
return { template: dobTextboxTemplate }
155+
},
156+
genderRadiobutton: function() {
157+
return { template: genderRadioTemplate }
158+
},
159+
dropdownlist: function() {
160+
return { template: dropdownlistTemplate }
161+
},
162+
multiselect: function() {
163+
return { template: multiselectTemplate }
164+
},
165+
mobileTextbox: function() {
166+
return { template: mobileTextboxTemplate }
167+
},
168+
emailTextbox: function() {
169+
return { template: emailTextboxTemplate }
170+
},
171+
addressTextbox: function() {
172+
return { template: addressTextboxTemplate }
173+
},
174+
addButton: function() {
175+
return { template: addButtonTemplate }
176+
}
177+
}
178+
},
179+
methods: {
180+
created: function() {
181+
var spreadsheet = this.$refs.spreadsheet;
182+
// Applies format to specified range
183+
spreadsheet.cellFormat({ fontWeight: 'bold' }, 'B2:B9');
184+
spreadsheet.cellFormat({ fontSize: '12pt', fontWeight: 'bold', textAlign: 'center', verticalAlign: 'middle', textDecoration: 'underline' }, 'B1');
185+
// Merges B1 and C1 cells
186+
spreadsheet.merge('B1:C1');
187+
}
188+
}
189+
});
190+
</script>

‎src/spreadsheet/dob-textbox.vue

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<template>
2+
<div>
3+
<ejs-textbox placeholder="DOB"></ejs-textbox>
4+
</div>
5+
</template>
6+
7+
<script>
8+
import Vue from "vue";
9+
import { TextBoxPlugin } from '@syncfusion/ej2-vue-inputs';
10+
Vue.use(TextBoxPlugin);
11+
12+
export default { }
13+
</script>

‎src/spreadsheet/dropdownlist.vue

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<template>
2+
<div>
3+
<ejs-dropdownlist placeholder="Experience" :dataSource="experience"></ejs-dropdownlist>
4+
</div>
5+
</template>
6+
7+
<script>
8+
import Vue from "vue";
9+
import { DropDownListPlugin } from '@syncfusion/ej2-vue-dropdowns';
10+
Vue.use(DropDownListPlugin);
11+
12+
export default {
13+
data: () => {
14+
return {
15+
experience: ['0 - 1 year', '1 - 3 years', '3 - 5 years', '5 - 10 years']
16+
}
17+
}
18+
}
19+
</script>

‎src/spreadsheet/email-textbox.vue

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<template>
2+
<div>
3+
<ejs-textbox placeholder="Email"></ejs-textbox>
4+
</div>
5+
</template>
6+
7+
<script>
8+
import Vue from "vue";
9+
import { TextBoxPlugin } from '@syncfusion/ej2-vue-inputs';
10+
Vue.use(TextBoxPlugin);
11+
12+
export default { }
13+
</script>

‎src/spreadsheet/gender-radiobutton.vue

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
<template>
2+
<div>
3+
<ejs-radiobutton name="gender" value="male" label="Male"></ejs-radiobutton>
4+
<ejs-radiobutton name="gender" value="female" label="Female" cssClass="margin"></ejs-radiobutton>
5+
</div>
6+
</template>
7+
8+
<style>
9+
.margin {
10+
margin-left: 10px !important;
11+
}
12+
</style>
13+
14+
<script>
15+
import Vue from "vue";
16+
import { RadioButtonPlugin } from '@syncfusion/ej2-vue-buttons';
17+
Vue.use(RadioButtonPlugin);
18+
19+
export default { }
20+
</script>

0 commit comments

Comments
 (0)