@visns-studio/visns-components 3.5.8 → 3.5.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/crm/DataGrid.jsx +142 -36
- package/package.json +1 -1
|
@@ -177,6 +177,7 @@ const DataGrid = forwardRef(
|
|
|
177
177
|
},
|
|
178
178
|
[ajaxSetting, dataReload, dSearch]
|
|
179
179
|
);
|
|
180
|
+
const [dropdownData, setDropdownData] = useState({});
|
|
180
181
|
const [filterDataSource, setFilterDataSource] = useState([]);
|
|
181
182
|
const [filterValue, setFilterValue] = useState([]);
|
|
182
183
|
const [gridColumns, setGridColumns] = useState([]);
|
|
@@ -578,46 +579,53 @@ const DataGrid = forwardRef(
|
|
|
578
579
|
} else {
|
|
579
580
|
const column = rowProps.columns[columnIndex];
|
|
580
581
|
|
|
581
|
-
if (column.
|
|
582
|
-
if (column.
|
|
583
|
-
|
|
584
|
-
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
582
|
+
if (column.type !== 'dropdown') {
|
|
583
|
+
if (column.id !== '__checkbox-column') {
|
|
584
|
+
if (column.link && column.link.url) {
|
|
585
|
+
const fileRelationArray = column.id.split('.');
|
|
586
|
+
const linkUrl = column.link.url;
|
|
587
|
+
const linkKey =
|
|
588
|
+
rowProps.columns[columnIndex].link.key;
|
|
589
|
+
const rowData = rowProps.data[linkKey];
|
|
590
|
+
|
|
591
|
+
if (column.link.hasOwnProperty('folder')) {
|
|
592
|
+
const linkFolder =
|
|
593
|
+
rowProps.columns[columnIndex].link.folder;
|
|
594
|
+
|
|
595
|
+
if (rowProps.data[fileRelationArray[0]]) {
|
|
596
|
+
if (linkFolder !== '') {
|
|
597
|
+
window.open(
|
|
598
|
+
`${linkUrl}${rowData}/${linkFolder}`
|
|
599
|
+
);
|
|
600
|
+
} else {
|
|
601
|
+
window.open(`${linkUrl}${rowData}`);
|
|
602
|
+
}
|
|
599
603
|
}
|
|
604
|
+
} else {
|
|
605
|
+
navigate(`${linkUrl}${rowData}`);
|
|
600
606
|
}
|
|
607
|
+
} else if (column.link && column.link.popup) {
|
|
608
|
+
const linkPopup = column.link.popup;
|
|
609
|
+
const linkKey =
|
|
610
|
+
rowProps.columns[columnIndex].link.key;
|
|
611
|
+
const rowData = rowProps.data[linkKey];
|
|
612
|
+
|
|
613
|
+
window.open(
|
|
614
|
+
`${linkPopup}/${rowData}`,
|
|
615
|
+
'',
|
|
616
|
+
'width=1440,height=1024,menubar=1,resizable=1,status=1,titlebar=1,toolbar=1'
|
|
617
|
+
);
|
|
601
618
|
} else {
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
const linkPopup = column.link.popup;
|
|
606
|
-
const linkKey = rowProps.columns[columnIndex].link.key;
|
|
607
|
-
const rowData = rowProps.data[linkKey];
|
|
608
|
-
|
|
609
|
-
window.open(
|
|
610
|
-
`${linkPopup}/${rowData}`,
|
|
611
|
-
'',
|
|
612
|
-
'width=1440,height=1024,menubar=1,resizable=1,status=1,titlebar=1,toolbar=1'
|
|
613
|
-
);
|
|
614
|
-
} else {
|
|
615
|
-
const updateSetting = settings.find(
|
|
616
|
-
(setting) => setting.id === 'update'
|
|
617
|
-
);
|
|
619
|
+
const updateSetting = settings.find(
|
|
620
|
+
(setting) => setting.id === 'update'
|
|
621
|
+
);
|
|
618
622
|
|
|
619
|
-
|
|
620
|
-
|
|
623
|
+
if (updateSetting) {
|
|
624
|
+
modalOpen(
|
|
625
|
+
'update',
|
|
626
|
+
rowProps.data[form.primaryKey]
|
|
627
|
+
);
|
|
628
|
+
}
|
|
621
629
|
}
|
|
622
630
|
}
|
|
623
631
|
}
|
|
@@ -1015,6 +1023,56 @@ const DataGrid = forwardRef(
|
|
|
1015
1023
|
[]
|
|
1016
1024
|
);
|
|
1017
1025
|
|
|
1026
|
+
const getDropdownData = async (id, url, fields) => {
|
|
1027
|
+
try {
|
|
1028
|
+
// Check if the data for the given id already exists
|
|
1029
|
+
if (!dropdownData[id]) {
|
|
1030
|
+
const res = await CustomFetch(url, 'POST', {
|
|
1031
|
+
fields: fields,
|
|
1032
|
+
});
|
|
1033
|
+
|
|
1034
|
+
setDropdownData((prevState) => ({
|
|
1035
|
+
...prevState,
|
|
1036
|
+
[id]: res.data.data,
|
|
1037
|
+
}));
|
|
1038
|
+
}
|
|
1039
|
+
} catch (err) {
|
|
1040
|
+
console.error(err);
|
|
1041
|
+
}
|
|
1042
|
+
};
|
|
1043
|
+
|
|
1044
|
+
const handleDropdownUpdate = async (id, url, method, value) => {
|
|
1045
|
+
try {
|
|
1046
|
+
const res = await CustomFetch(url, method, {
|
|
1047
|
+
[id]: value,
|
|
1048
|
+
});
|
|
1049
|
+
|
|
1050
|
+
if (res.data.error === '') {
|
|
1051
|
+
const min = 0;
|
|
1052
|
+
const max = 999999999;
|
|
1053
|
+
const randomNumber = Math.floor(
|
|
1054
|
+
Math.random() * (max - min + 1) + min
|
|
1055
|
+
);
|
|
1056
|
+
|
|
1057
|
+
setDataReload(randomNumber);
|
|
1058
|
+
} else {
|
|
1059
|
+
toast.error(res.data.error);
|
|
1060
|
+
}
|
|
1061
|
+
} catch (err) {
|
|
1062
|
+
console.error(err);
|
|
1063
|
+
}
|
|
1064
|
+
};
|
|
1065
|
+
|
|
1066
|
+
useEffect(() => {
|
|
1067
|
+
columns.forEach((column) => {
|
|
1068
|
+
switch (column.type) {
|
|
1069
|
+
case 'dropdown':
|
|
1070
|
+
getDropdownData(column.id, column.url, column.fields);
|
|
1071
|
+
break;
|
|
1072
|
+
}
|
|
1073
|
+
});
|
|
1074
|
+
}, [columns]);
|
|
1075
|
+
|
|
1018
1076
|
useEffect(() => {
|
|
1019
1077
|
const renderColumn = (column) => {
|
|
1020
1078
|
let childValue;
|
|
@@ -1063,6 +1121,7 @@ const DataGrid = forwardRef(
|
|
|
1063
1121
|
|
|
1064
1122
|
return columnStyle;
|
|
1065
1123
|
},
|
|
1124
|
+
type: column.type,
|
|
1066
1125
|
};
|
|
1067
1126
|
|
|
1068
1127
|
switch (column.type) {
|
|
@@ -1414,6 +1473,53 @@ const DataGrid = forwardRef(
|
|
|
1414
1473
|
}
|
|
1415
1474
|
},
|
|
1416
1475
|
};
|
|
1476
|
+
case 'dropdown':
|
|
1477
|
+
return {
|
|
1478
|
+
...commonProps,
|
|
1479
|
+
name: column.id,
|
|
1480
|
+
render: ({ data }) => {
|
|
1481
|
+
return (
|
|
1482
|
+
<select
|
|
1483
|
+
name={column.id}
|
|
1484
|
+
value={data[column.id]?.id || ''}
|
|
1485
|
+
style={{ padding: '7px' }}
|
|
1486
|
+
onChange={(e) => {
|
|
1487
|
+
e.preventDefault();
|
|
1488
|
+
|
|
1489
|
+
if (
|
|
1490
|
+
(column.update?.key,
|
|
1491
|
+
column.update?.url,
|
|
1492
|
+
column.update?.method)
|
|
1493
|
+
) {
|
|
1494
|
+
handleDropdownUpdate(
|
|
1495
|
+
column.update.key,
|
|
1496
|
+
`${column.update.url}/${data.id}`,
|
|
1497
|
+
column.update.method,
|
|
1498
|
+
e.target.value
|
|
1499
|
+
);
|
|
1500
|
+
}
|
|
1501
|
+
}}
|
|
1502
|
+
>
|
|
1503
|
+
<option value="">
|
|
1504
|
+
Select an Option
|
|
1505
|
+
</option>
|
|
1506
|
+
{dropdownData[column.id] &&
|
|
1507
|
+
dropdownData[column.id].length > 0
|
|
1508
|
+
? dropdownData[column.id].map(
|
|
1509
|
+
(option, index) => (
|
|
1510
|
+
<option
|
|
1511
|
+
value={option.id}
|
|
1512
|
+
key={index}
|
|
1513
|
+
>
|
|
1514
|
+
{option.label}
|
|
1515
|
+
</option>
|
|
1516
|
+
)
|
|
1517
|
+
)
|
|
1518
|
+
: null}
|
|
1519
|
+
</select>
|
|
1520
|
+
);
|
|
1521
|
+
},
|
|
1522
|
+
};
|
|
1417
1523
|
case 'file':
|
|
1418
1524
|
return {
|
|
1419
1525
|
...commonProps,
|
package/package.json
CHANGED