Skip to content

Commit 8a5a0d1

Browse files
932529: Need to change the UI design in super market use case sample
1 parent df758ae commit 8a5a0d1

File tree

1 file changed

+41
-41
lines changed
  • Inventory Management and Invoice Generating/Inventory Application/src

1 file changed

+41
-41
lines changed

Inventory Management and Invoice Generating/Inventory Application/src/App.tsx

Lines changed: 41 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -96,13 +96,13 @@ import { isNullOrUndefined } from '@syncfusion/ej2-base';
9696

9797
//Search grid - instance ref property.
9898
let productSearchGridInstance = useRef<GridComponent>(null);
99-
const searchGridToolbarOptions = ["Search"];
99+
const searchGridToolbarOptions: any = ["Search"];
100100
const animationSettings: AnimationSettingsModel = { effect: "None" };
101-
const selectionSettings = { mode: "Row", type: "Multiple", checkboxOnly: true };
102-
const searchGridSelectionSettings = { mode: "Row", type: "Multiple" };
103-
const toolbarOptions = ["Delete"];
104-
const wrapSettings = { text: "Header", value: "Header" };
105-
const editSettings = {
101+
const selectionSettings: any = { mode: "Row", type: "Multiple", checkboxOnly: true };
102+
const searchGridSelectionSettings: any = { mode: "Row", type: "Multiple" };
103+
const toolbarOptions: any = ["Delete"];
104+
const wrapSettings: any = { text: "Header", value: "Header" };
105+
const editSettings: any = {
106106
allowEditing: true,
107107
allowAdding: true,
108108
allowDeleting: true,
@@ -121,7 +121,7 @@ import { isNullOrUndefined } from '@syncfusion/ej2-base';
121121
const [currentDateTime, setCurrentDateTime] = useState(new Date());
122122
let balanceAmount = "";
123123
let cashPaidAmount = "";
124-
const commands = [
124+
const commands: any = [
125125
{
126126
type: "Cancel",
127127
buttonOption: {
@@ -224,7 +224,7 @@ import { isNullOrUndefined } from '@syncfusion/ej2-base';
224224
};
225225

226226
useEffect(() => {
227-
const generatedBillNo = generateBillNo();
227+
const generatedBillNo: any = generateBillNo();
228228
// Set Bill No to the input field
229229
const billNoInput = document.getElementById("billNoInput");
230230
if (billNoInput) {
@@ -249,7 +249,7 @@ import { isNullOrUndefined } from '@syncfusion/ej2-base';
249249
//function to handle customer id input element changes - change event.
250250
const handleCustomerIDChange = (event): void => {
251251
const enteredID: number = parseInt(event.value);
252-
const foundCustomer = customerDatabase.find(
252+
const foundCustomer: any = customerDatabase.find(
253253
(customer) => (customer as any).id === enteredID
254254
);
255255
if (foundCustomer) {
@@ -286,7 +286,7 @@ import { isNullOrUndefined } from '@syncfusion/ej2-base';
286286

287287
// Grid component's Events and Functions
288288
//Grid action complete event.
289-
const actionComplete = (args): void => {
289+
const actionComplete = (args: any): void => {
290290
if (args.action === "add" && args.requestType === "save") {
291291
const lastRowIndex = gridInstance.current.getRows().length - 1; // Get the index of the last row
292292
productSearchGridInstance.current.clearSelection();
@@ -329,14 +329,14 @@ import { isNullOrUndefined } from '@syncfusion/ej2-base';
329329
};
330330

331331
//Grid created event.
332-
const createdGrid = (args?): void => {
332+
const createdGrid = (args?: any): void => {
333333
gridInstance.current.getContent().querySelector(".e-addedrow .e-rowcell .e-checkbox-wrapper").classList.add('e-checkbox-disabled');
334334
}
335335

336336
//Function to Calculate total savings of the bill amount
337-
function computeSavings(dataSource): number {
337+
function computeSavings(dataSource: any): number {
338338
let savings = 0;
339-
dataSource.forEach((item) => {
339+
dataSource.forEach((item: any) => {
340340
const MRP = item.MRP;
341341
const Price = item.Price;
342342
const Qty = parseFloat(item.Quantity) || 0;
@@ -346,9 +346,9 @@ import { isNullOrUndefined } from '@syncfusion/ej2-base';
346346
return savings;
347347
}
348348

349-
function totalNetAmount(dataSource): void {
349+
function totalNetAmount(dataSource: any): void {
350350
let totalAmount = 0;
351-
dataSource.forEach((item) => {
351+
dataSource.forEach((item: any) => {
352352
if (item.Qty !== 0) {
353353
totalAmount += item.Total;
354354
}
@@ -357,14 +357,14 @@ import { isNullOrUndefined } from '@syncfusion/ej2-base';
357357
}
358358

359359
//Function to Update savings card element with proper savings amount.
360-
function updateSavingsDisplay(dataSource): void {
360+
function updateSavingsDisplay(dataSource: any): void {
361361
const computedSavings = computeSavings(dataSource);
362362
(document.querySelector("#yourSavings") as HTMLElement).innerHTML =
363363
"$" + computedSavings.toFixed(2);
364364
}
365365

366366
//Grid action begin event
367-
const actionBegin = (args): void => {
367+
const actionBegin = (args: any): void => {
368368
if (args.requestType === 'save') {
369369
args.index = (gridInstance.current.pageSettings.currentPage * gridInstance.current.pageSettings.pageSize) - 1;
370370
productSearchGridInstance.current.clearSelection();
@@ -373,7 +373,7 @@ import { isNullOrUndefined } from '@syncfusion/ej2-base';
373373
};
374374

375375
//Grid before print event.
376-
const beforePrint = (args): void => {
376+
const beforePrint = (args: any): void => {
377377
// Cancel default Grid print action
378378
args.cancel = true;
379379

@@ -390,16 +390,16 @@ import { isNullOrUndefined } from '@syncfusion/ej2-base';
390390
? true
391391
: false;
392392
function printTable(
393-
gridInstance,
394-
shopName,
395-
billNo,
396-
customerName,
397-
phoneNumber,
398-
address,
399-
formattedDateTime,
400-
totalAmount,
401-
savings,
402-
isDoorDelivery,
393+
gridInstance: any,
394+
shopName: any,
395+
billNo: any,
396+
customerName: any,
397+
phoneNumber: any,
398+
address: any,
399+
formattedDateTime: any,
400+
totalAmount: any,
401+
savings: any,
402+
isDoorDelivery: any,
403403
) {
404404
let data = gridInstance.dataSource;
405405
let columnConfig = gridInstance.columns;
@@ -474,7 +474,7 @@ import { isNullOrUndefined } from '@syncfusion/ej2-base';
474474

475475
// Header row
476476
let headerRow = "<thead><tr>";
477-
columnConfig.forEach((column) => {
477+
columnConfig.forEach((column: any) => {
478478
if (
479479
column.headerText !== "" &&
480480
column.headerText !== "Product ID" &&
@@ -513,9 +513,9 @@ import { isNullOrUndefined } from '@syncfusion/ej2-base';
513513

514514
// Data rows
515515
printWindow.document.write("<tbody>");
516-
data.forEach((item) => {
516+
data.forEach((item: any) => {
517517
let row = "<tr>";
518-
columnConfig.forEach((column) => {
518+
columnConfig.forEach((column: any) => {
519519
if (
520520
column.headerText !== "" &&
521521
column.headerText !== "Product ID" &&
@@ -662,7 +662,7 @@ import { isNullOrUndefined } from '@syncfusion/ej2-base';
662662
};
663663

664664
//Grid command column delete button - Click event.
665-
const commandClick = (args): void => {
665+
const commandClick = (args: any): void => {
666666
const rowIndex = parseInt(
667667
args.target.closest("tr").getAttribute("data-rowindex"),
668668
10
@@ -694,7 +694,7 @@ import { isNullOrUndefined } from '@syncfusion/ej2-base';
694694
);
695695
if (product) {
696696
const isProductExists = (gridInstance.current.dataSource as any).some(
697-
(item) => (item as any).ProductID === (product as any).ProductID
697+
(item: any) => (item as any).ProductID === (product as any).ProductID
698698
);
699699
if (isProductExists) {
700700
alert("Product has already been added.");
@@ -704,7 +704,7 @@ import { isNullOrUndefined } from '@syncfusion/ej2-base';
704704
(gridInstance.current.dataSource as any).length === 0
705705
? 0
706706
: (gridInstance.current.dataSource as any).length - 1;
707-
let editedRowIndex = (gridInstance as any).current.editModule.editModule.editRowIndex;
707+
let editedRowIndex: any = (gridInstance as any).current.editModule.editModule.editRowIndex;
708708
if(!isNullOrUndefined(editedRowIndex)) {
709709
updateRecord(product, editedRowIndex);
710710
} else {
@@ -719,7 +719,7 @@ import { isNullOrUndefined } from '@syncfusion/ej2-base';
719719
}
720720
};
721721

722-
const updateRecord = (product, editedRowIndex) =>{
722+
const updateRecord = (product: any, editedRowIndex: any) =>{
723723
(document.getElementById(gridInstance.current.element.id + 'ProductID') as any).value = product.ProductID;
724724
(document.getElementById(gridInstance.current.element.id + 'ProductName') as any).value = product.ProductName;
725725
(document.getElementById(gridInstance.current.element.id + 'Price') as any).value = product.Price;
@@ -755,11 +755,11 @@ import { isNullOrUndefined } from '@syncfusion/ej2-base';
755755
}
756756
};
757757

758-
const readProductIDFn = (args) => {
758+
const readProductIDFn = (args: any) => {
759759
return args.value;
760760
};
761761

762-
const writeProductIDFn = (args) => {
762+
const writeProductIDFn = (args: any) => {
763763
autocompleteIns = new AutoComplete({
764764
dataSource: productData.map(product => ({ ProductID: (product as any).ProductID, ProductName: (product as any).ProductName })), // Provide your data source
765765
fields: { value: 'ProductID' },
@@ -818,7 +818,7 @@ import { isNullOrUndefined } from '@syncfusion/ej2-base';
818818
return args.value;
819819
};
820820

821-
const writeProductNameFn = (args) => {
821+
const writeProductNameFn = (args: any) => {
822822
productNameTextBoxIns = new TextBox({
823823
value: args.rowData[args.column.field],
824824
placeholder: "Enter product name",
@@ -888,7 +888,7 @@ import { isNullOrUndefined } from '@syncfusion/ej2-base';
888888
return "";
889889
};
890890

891-
const writeQuantityFn = (args) => {
891+
const writeQuantityFn = (args: any) => {
892892
quantityTextBoxIns = new TextBox({
893893
value: args.rowData[args.column.field],
894894
placeholder: "Enter quantity",
@@ -1014,11 +1014,11 @@ import { isNullOrUndefined } from '@syncfusion/ej2-base';
10141014
}
10151015

10161016
//Primary Grid component - Declaration to prevent re-rener on unwanted state changes.
1017-
const MemorizedGridComponent = React.useMemo(
1017+
const MemorizedGridComponent: any = React.useMemo(
10181018
() => (
10191019
<GridComponent
10201020
ref={gridInstance}
1021-
emptyRecordTemplate={() => null}
1021+
emptyRecordTemplate={(): any => null}
10221022
gridLines="Both"
10231023
height="435px"
10241024
width='100%'

0 commit comments

Comments
 (0)