Skip to content

Commit 6449ade

Browse files
SyncfusionBuildSyncfusionBuild
authored
Merge pull request #579 from Syncfusion-Content/hotfix/hotfix-v28.2.3
DOCINFRA-2341_merged_using_automation
2 parents c9bec57 + 3610279 commit 6449ade

File tree

28 files changed

+1635
-1
lines changed

28 files changed

+1635
-1
lines changed

‎ej2-vue/code-snippet/grid/databind/databinding-timezone/app-composition.vue‎

Lines changed: 104 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,104 @@
1+
<template>
2+
<div id="app">
3+
<div style="display: flex; align-items: center; margin-bottom: 10px">
4+
<label style="margin-right: 10px">Select Timezone:</label>
5+
<ejs-dropdownlist
6+
id="timezone"
7+
width="150px"
8+
:dataSource="timeZones"
9+
:fields="field"
10+
v-model="selectedTimezone"
11+
:change="onTimezoneChange"
12+
></ejs-dropdownlist>
13+
</div>
14+
<div style="margin-bottom: 10px">
15+
<ejs-checkbox
16+
label="Prevent Timezone Conversion"
17+
ref="timezoneCheckboxRef"
18+
:change="onCheckboxChange"
19+
></ejs-checkbox>
20+
</div>
21+
<ejs-grid ref="grid" :dataSource="data" :height="315" :load="load">
22+
<e-columns>
23+
<e-column field="OrderID" headerText="Order ID" textAlign="Right" width="120"></e-column>
24+
<e-column field="CustomerID" headerText="Customer ID" width="140"></e-column>
25+
<e-column field="Freight" headerText="Freight" textAlign="Right" format="C" width="120"></e-column>
26+
<e-column field="OrderDate" headerText="Order Date" textAlign="Right" width="140"></e-column>
27+
</e-columns>
28+
</ejs-grid>
29+
</div>
30+
</template>
31+
<script setup>
32+
import { ref } from "vue";
33+
import { GridComponent as EjsGrid, ColumnDirective as EColumn, ColumnsDirective as EColumns } from "@syncfusion/ej2-vue-grids";
34+
import { CheckBoxComponent as EjsCheckbox } from "@syncfusion/ej2-vue-buttons";
35+
import { DropDownListComponent as EjsDropdownlist } from "@syncfusion/ej2-vue-dropdowns";
36+
import { DataManager, WebApiAdaptor, DataUtil } from "@syncfusion/ej2-data";
37+
38+
const SERVICE_URI = "https://services.syncfusion.com/vue/production/";
39+
const data = new DataManager({
40+
url: SERVICE_URI + 'api/Orders',
41+
adaptor: new WebApiAdaptor(),
42+
crossDomain: true
43+
})
44+
const selectedTimezone =ref(-12);
45+
const grid=ref(null);
46+
const timezoneCheckboxRef=ref(null);
47+
const field ={ text: "text", value: "value" };
48+
const timeZones= [
49+
{ value: -12, text: "-12:00 UTC" },
50+
{ value: -11, text: "-11:00 UTC" },
51+
{ value: -10, text: "-10:00 UTC" },
52+
{ value: -9, text: "-09:00 UTC" },
53+
{ value: -8, text: "-08:00 UTC" },
54+
{ value: -7, text: "-07:00 UTC" },
55+
{ value: -6, text: "-06:00 UTC" },
56+
{ value: -5, text: "-05:00 UTC" },
57+
{ value: -4, text: "-04:00 UTC" },
58+
{ value: -3, text: "-03:00 UTC" },
59+
{ value: -2, text: "-02:00 UTC" },
60+
{ value: -1, text: "-01:00 UTC" },
61+
{ value: 0, text: "+00:00 UTC" },
62+
{ value: 1, text: "+01:00 UTC" },
63+
{ value: 2, text: "+02:00 UTC" },
64+
{ value: 3, text: "+03:00 UTC" },
65+
{ value: 4, text: "+04:00 UTC" },
66+
{ value: 5, text: "+05:00 UTC" },
67+
{ value: 5.5, text: "+05:30 UTC" },
68+
{ value: 6, text: "+06:00 UTC" },
69+
{ value: 7, text: "+07:00 UTC" },
70+
{ value: 8, text: "+08:00 UTC" },
71+
{ value: 9, text: "+09:00 UTC" },
72+
{ value: 10, text: "+10:00 UTC" },
73+
{ value: 11, text: "+11:00 UTC" },
74+
{ value: 12, text: "+12:00 UTC" },
75+
{ value: 13, text: "+13:00 UTC" },
76+
{ value: 14, text: "+14:00 UTC" },
77+
];
78+
79+
const onTimezoneChange = function(args) {
80+
selectedTimezone.value = Number(args.value);
81+
grid.value.ej2Instances.freezeRefresh();
82+
};
83+
84+
const onCheckboxChange = function(args) {
85+
grid.value.ej2Instances.freezeRefresh();
86+
};
87+
88+
const load = function(args) {
89+
DataUtil.serverTimezoneOffset = timezoneCheckboxRef.value.ej2Instances.checked
90+
? 0
91+
: selectedTimezone.value;
92+
}
93+
</script>
94+
<style>
95+
@import "../node_modules/@syncfusion/ej2-base/styles/tailwind.css";
96+
@import "../node_modules/@syncfusion/ej2-buttons/styles/tailwind.css";
97+
@import "../node_modules/@syncfusion/ej2-calendars/styles/tailwind.css";
98+
@import "../node_modules/@syncfusion/ej2-dropdowns/styles/tailwind.css";
99+
@import "../node_modules/@syncfusion/ej2-inputs/styles/tailwind.css";
100+
@import "../node_modules/@syncfusion/ej2-navigations/styles/tailwind.css";
101+
@import "../node_modules/@syncfusion/ej2-popups/styles/tailwind.css";
102+
@import "../node_modules/@syncfusion/ej2-splitbuttons/styles/tailwind.css";
103+
@import "../node_modules/@syncfusion/ej2-vue-grids/styles/tailwind.css";
104+
</style>

‎ej2-vue/code-snippet/grid/databind/databinding-timezone/app.vue‎

Lines changed: 115 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,115 @@
1+
<template>
2+
<div id="app">
3+
<div style="display: flex; align-items: center; margin-bottom: 10px">
4+
<label style="margin-right: 10px">Select Timezone:</label>
5+
<ejs-dropdownlist
6+
id="timezone"
7+
width="150px"
8+
:dataSource="timeZones"
9+
:fields="field"
10+
v-model="selectedTimezone"
11+
:change="onTimezoneChange"
12+
></ejs-dropdownlist>
13+
</div>
14+
<div style="margin-bottom: 10px">
15+
<ejs-checkbox
16+
label="Prevent Timezone Conversion"
17+
ref="timezoneCheckboxRef"
18+
:change="onCheckboxChange"
19+
></ejs-checkbox>
20+
</div>
21+
<ejs-grid ref="grid" :dataSource="data" :height="315" :load="load">
22+
<e-columns>
23+
<e-column field="OrderID" headerText="Order ID" textAlign="Right" width="120"></e-column>
24+
<e-column field="CustomerID" headerText="Customer ID" width="140"></e-column>
25+
<e-column field="Freight" headerText="Freight" textAlign="Right" format="C" width="120"></e-column>
26+
<e-column field="OrderDate" headerText="Order Date" textAlign="Right" width="140"></e-column>
27+
</e-columns>
28+
</ejs-grid>
29+
</div>
30+
</template>
31+
<script>
32+
import { GridComponent, ColumnsDirective, ColumnDirective} from "@syncfusion/ej2-vue-grids";
33+
import { CheckBoxComponent } from "@syncfusion/ej2-vue-buttons";
34+
import { DropDownListComponent } from "@syncfusion/ej2-vue-dropdowns";
35+
import { DataManager, WebApiAdaptor, DataUtil } from "@syncfusion/ej2-data";
36+
export default {
37+
name: "App",
38+
components: {
39+
"ejs-grid":GridComponent,
40+
"e-columns":ColumnsDirective,
41+
"e-column":ColumnDirective,
42+
"ejs-checkbox": CheckBoxComponent,
43+
"ejs-dropdownlist":DropDownListComponent
44+
},
45+
46+
data() {
47+
let SERVICE_URI = "https://services.syncfusion.com/vue/production/";
48+
return {
49+
data: new DataManager({
50+
url: SERVICE_URI + 'api/Orders',
51+
adaptor: new WebApiAdaptor()
52+
}),
53+
selectedTimezone: -12,
54+
field: { text: "text", value: "value" },
55+
timeZones: [
56+
{ value: -12, text: "-12:00 UTC" },
57+
{ value: -11, text: "-11:00 UTC" },
58+
{ value: -10, text: "-10:00 UTC" },
59+
{ value: -9, text: "-09:00 UTC" },
60+
{ value: -8, text: "-08:00 UTC" },
61+
{ value: -7, text: "-07:00 UTC" },
62+
{ value: -6, text: "-06:00 UTC" },
63+
{ value: -5, text: "-05:00 UTC" },
64+
{ value: -4, text: "-04:00 UTC" },
65+
{ value: -3, text: "-03:00 UTC" },
66+
{ value: -2, text: "-02:00 UTC" },
67+
{ value: -1, text: "-01:00 UTC" },
68+
{ value: 0, text: "+00:00 UTC" },
69+
{ value: 1, text: "+01:00 UTC" },
70+
{ value: 2, text: "+02:00 UTC" },
71+
{ value: 3, text: "+03:00 UTC" },
72+
{ value: 4, text: "+04:00 UTC" },
73+
{ value: 5, text: "+05:00 UTC" },
74+
{ value: 5.5, text: "+05:30 UTC" },
75+
{ value: 6, text: "+06:00 UTC" },
76+
{ value: 7, text: "+07:00 UTC" },
77+
{ value: 8, text: "+08:00 UTC" },
78+
{ value: 9, text: "+09:00 UTC" },
79+
{ value: 10, text: "+10:00 UTC" },
80+
{ value: 11, text: "+11:00 UTC" },
81+
{ value: 12, text: "+12:00 UTC" },
82+
{ value: 13, text: "+13:00 UTC" },
83+
{ value: 14, text: "+14:00 UTC" },
84+
],
85+
};
86+
},
87+
methods: {
88+
onTimezoneChange(args) {
89+
this.selectedTimezone = Number(args.value);
90+
this.$refs.grid.ej2Instances.freezeRefresh();
91+
},
92+
onCheckboxChange(args) {
93+
this.$refs.grid.ej2Instances.freezeRefresh();
94+
},
95+
load(args) {
96+
DataUtil.serverTimezoneOffset = this.$refs.timezoneCheckboxRef.ej2Instances.checked
97+
? 0
98+
: this.selectedTimezone;
99+
},
100+
},
101+
}
102+
</script>
103+
104+
<style>
105+
@import "../node_modules/@syncfusion/ej2-base/styles/tailwind.css";
106+
@import "../node_modules/@syncfusion/ej2-buttons/styles/tailwind.css";
107+
@import "../node_modules/@syncfusion/ej2-calendars/styles/tailwind.css";
108+
@import "../node_modules/@syncfusion/ej2-dropdowns/styles/tailwind.css";
109+
@import "../node_modules/@syncfusion/ej2-inputs/styles/tailwind.css";
110+
@import "../node_modules/@syncfusion/ej2-navigations/styles/tailwind.css";
111+
@import "../node_modules/@syncfusion/ej2-popups/styles/tailwind.css";
112+
@import "../node_modules/@syncfusion/ej2-splitbuttons/styles/tailwind.css";
113+
@import "../node_modules/@syncfusion/ej2-vue-grids/styles/tailwind.css";
114+
@import "../node_modules/@syncfusion/ej2-vue-grids/styles/tailwind.css";
115+
</style>

‎ej2-vue/code-snippet/grid/databind/databinding-timezone/index.html‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
2+
<!DOCTYPE html>
3+
<html lang="en">
4+
5+
<head>
6+
<script src="https://cdn.syncfusion.com/ej2/syncfusion-helper.js"></script>
7+
<title>EJ2 Vue Sample</title>
8+
<meta charset="utf-8" />
9+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
10+
<meta name="description" content="Typescript UI Controls" />
11+
<meta name="author" content="Syncfusion" />
12+
<script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.38/system.js"></script>
13+
<link href="https://cdn.syncfusion.com/ej2/28.2.3/tailwind.css" rel="stylesheet" />
14+
<link href="index.css" rel="stylesheet" />
15+
<script src="systemjs.config.js"></script>
16+
</head>
17+
18+
<body>
19+
<div id='app'>Loading....</div>
20+
</body>
21+
22+
</html>
23+

‎ej2-vue/code-snippet/grid/databind/databinding-timezone/index.js‎

Lines changed: 100 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,100 @@
1+
2+
import Vue from "vue";
3+
import { GridPlugin } from "@syncfusion/ej2-vue-grids";
4+
import { DropDownListPlugin } from "@syncfusion/ej2-vue-dropdowns";
5+
import { CheckBoxPlugin } from "@syncfusion/ej2-vue-buttons";
6+
import { DataManager, WebApiAdaptor, DataUtil } from "@syncfusion/ej2-data";
7+
8+
Vue.use(GridPlugin);
9+
Vue.use(DropDownListPlugin);
10+
Vue.use(CheckBoxPlugin);
11+
let SERVICE_URI = "https://services.syncfusion.com/vue/production/";
12+
13+
new Vue(
14+
{
15+
el: '#app',
16+
template: `
17+
<div id="app">
18+
<div style="display: flex; align-items: center; margin-bottom: 10px">
19+
<label style="margin-right: 10px">Select Timezone:</label>
20+
<ejs-dropdownlist
21+
id="timezone"
22+
width="150px"
23+
:dataSource="timeZones"
24+
:fields="field"
25+
v-model="selectedTimezone"
26+
:change="onTimezoneChange"
27+
></ejs-dropdownlist>
28+
</div>
29+
<div style="margin-bottom: 10px">
30+
<ejs-checkbox
31+
label="Prevent Timezone Conversion"
32+
ref="timezoneCheckboxRef"
33+
:change="onCheckboxChange"
34+
></ejs-checkbox>
35+
</div>
36+
<ejs-grid ref="grid" :dataSource="data" :height="315" :load="load">
37+
<e-columns>
38+
<e-column field="OrderID" headerText="Order ID" textAlign="Right" width="120"></e-column>
39+
<e-column field="CustomerID" headerText="Customer ID" width="140"></e-column>
40+
<e-column field="Freight" headerText="Freight" textAlign="Right" format="C" width="120"></e-column>
41+
<e-column field="OrderDate" headerText="Order Date" textAlign="Right" width="140"></e-column>
42+
</e-columns>
43+
</ejs-grid>
44+
</div> `,
45+
data() {
46+
return {
47+
data: new DataManager({
48+
url: SERVICE_URI + 'api/Orders',
49+
adaptor: new WebApiAdaptor()
50+
}),
51+
selectedTimezone: -12,
52+
field: { text: "text", value: "value" },
53+
timeZones: [
54+
{ value: -12, text: "-12:00 UTC" },
55+
{ value: -11, text: "-11:00 UTC" },
56+
{ value: -10, text: "-10:00 UTC" },
57+
{ value: -9, text: "-09:00 UTC" },
58+
{ value: -8, text: "-08:00 UTC" },
59+
{ value: -7, text: "-07:00 UTC" },
60+
{ value: -6, text: "-06:00 UTC" },
61+
{ value: -5, text: "-05:00 UTC" },
62+
{ value: -4, text: "-04:00 UTC" },
63+
{ value: -3, text: "-03:00 UTC" },
64+
{ value: -2, text: "-02:00 UTC" },
65+
{ value: -1, text: "-01:00 UTC" },
66+
{ value: 0, text: "+00:00 UTC" },
67+
{ value: 1, text: "+01:00 UTC" },
68+
{ value: 2, text: "+02:00 UTC" },
69+
{ value: 3, text: "+03:00 UTC" },
70+
{ value: 4, text: "+04:00 UTC" },
71+
{ value: 5, text: "+05:00 UTC" },
72+
{ value: 5.5, text: "+05:30 UTC" },
73+
{ value: 6, text: "+06:00 UTC" },
74+
{ value: 7, text: "+07:00 UTC" },
75+
{ value: 8, text: "+08:00 UTC" },
76+
{ value: 9, text: "+09:00 UTC" },
77+
{ value: 10, text: "+10:00 UTC" },
78+
{ value: 11, text: "+11:00 UTC" },
79+
{ value: 12, text: "+12:00 UTC" },
80+
{ value: 13, text: "+13:00 UTC" },
81+
{ value: 14, text: "+14:00 UTC" },
82+
],
83+
};
84+
},
85+
methods: {
86+
onTimezoneChange(args) {
87+
this.selectedTimezone = Number(args.value);
88+
this.$refs.grid.ej2Instances.freezeRefresh();
89+
},
90+
onCheckboxChange(args) {
91+
this.$refs.grid.ej2Instances.freezeRefresh();
92+
},
93+
load(args) {
94+
DataUtil.serverTimezoneOffset = this.$refs.timezoneCheckboxRef.ej2Instances.checked
95+
? 0
96+
: this.selectedTimezone;
97+
},
98+
}
99+
}
100+
);

‎ej2-vue/code-snippet/grid/databind/databinding-timezone/systemjs.config.js‎

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
System.config({
2+
transpiler: "typescript",
3+
typescriptOptions: {
4+
compilerOptions: {
5+
target: "umd",
6+
module: "commonjs",
7+
moduleResolution: "node",
8+
emitDecoratorMetadata: true,
9+
experimentalDecorators: true
10+
}
11+
},
12+
paths: {
13+
"syncfusion:": "https://cdn.syncfusion.com/ej2/28.2.3/"
14+
},
15+
map: {
16+
typescript: "https://unpkg.com/typescript@2.2.2/lib/typescript.js",
17+
vue: "https://unpkg.com/vue@2.6.14/dist/vue.min.js",
18+
"@syncfusion/ej2-base": "syncfusion:ej2-base/dist/ej2-base.umd.min.js",
19+
"@syncfusion/ej2-buttons": "syncfusion:ej2-buttons/dist/ej2-buttons.umd.min.js",
20+
"@syncfusion/ej2-data": "syncfusion:ej2-data/dist/ej2-data.umd.min.js",
21+
"@syncfusion/ej2-popups": "syncfusion:ej2-popups/dist/ej2-popups.umd.min.js",
22+
"@syncfusion/ej2-navigations": "syncfusion:ej2-navigations/dist/ej2-navigations.umd.min.js",
23+
"@syncfusion/ej2-dropdowns":"syncfusion:ej2-dropdowns/dist/ej2-dropdowns.umd.min.js",
24+
"@syncfusion/ej2-notifications":"syncfusion:ej2-notifications/dist/ej2-notifications.umd.min.js",
25+
"@syncfusion/ej2-lists": "syncfusion:ej2-lists/dist/ej2-lists.umd.min.js",
26+
"@syncfusion/ej2-inputs": "syncfusion:ej2-inputs/dist/ej2-inputs.umd.min.js",
27+
"@syncfusion/ej2-grids": "syncfusion:ej2-grids/dist/ej2-grids.umd.min.js",
28+
"@syncfusion/ej2-excel-export": "syncfusion:ej2-excel-export/dist/ej2-excel-export.umd.min.js",
29+
"@syncfusion/ej2-pdf-export": "syncfusion:ej2-pdf-export/dist/ej2-pdf-export.umd.min.js",
30+
"@syncfusion/ej2-file-utils": "syncfusion:ej2-file-utils/dist/ej2-file-utils.umd.min.js",
31+
"@syncfusion/ej2-compression": "syncfusion:ej2-compression/dist/ej2-compression.umd.min.js", 
32+
"@syncfusion/ej2-calendars": "syncfusion:ej2-calendars/dist/ej2-calendars.umd.min.js",
33+
"@syncfusion/ej2-splitbuttons": "syncfusion:ej2-splitbuttons/dist/ej2-splitbuttons.umd.min.js",
34+
"@syncfusion/ej2-notifications": "syncfusion:ej2-notifications/dist/ej2-notifications.umd.min.js",
35+
36+
"@syncfusion/ej2-vue-base": "syncfusion:ej2-vue-base/dist/ej2-vue-base.umd.min.js",
37+
"@syncfusion/ej2-vue-grids": "syncfusion:ej2-vue-grids/dist/ej2-vue-grids.umd.min.js",
38+
"@syncfusion/ej2-vue-buttons": "syncfusion:ej2-vue-buttons/dist/ej2-vue-buttons.umd.min.js",
39+
"@syncfusion/ej2-vue-dropdowns": "syncfusion:ej2-vue-dropdowns/dist/ej2-vue-dropdowns.umd.min.js",
40+
41+
}
42+
});
43+
44+
System.import('index.js');

0 commit comments

Comments
 (0)