@visns-studio/visns-components 5.13.2 → 5.13.3
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/package.json
CHANGED
|
@@ -87,7 +87,7 @@
|
|
|
87
87
|
"react-dom": "^17.0.0 || ^18.0.0"
|
|
88
88
|
},
|
|
89
89
|
"name": "@visns-studio/visns-components",
|
|
90
|
-
"version": "5.13.
|
|
90
|
+
"version": "5.13.3",
|
|
91
91
|
"description": "Various packages to assist in the development of our Custom Applications.",
|
|
92
92
|
"main": "src/index.js",
|
|
93
93
|
"files": [
|
|
@@ -362,53 +362,44 @@ const GenericEditableTable = ({
|
|
|
362
362
|
const sortBySortOrder = (dataArray) =>
|
|
363
363
|
[...dataArray].sort((a, b) => a.sort_order - b.sort_order);
|
|
364
364
|
|
|
365
|
-
// Return background color from row_colour field or colours column
|
|
365
|
+
// Return background color from row_colour field or colours column, or status color
|
|
366
366
|
const getRowBackground = (entry) => {
|
|
367
367
|
// Check if there's a colour picked from the colours column
|
|
368
368
|
const coloursValue = entry.colours || entry.row_colour;
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
// Helper function to get background color for dropdown and total cells
|
|
373
|
-
const getCellBackground = (entry, column) => {
|
|
374
|
-
// For dropdown columns, get color from selected option
|
|
375
|
-
if (column.type === 'dropdown' && column.options) {
|
|
376
|
-
const selectedValue = entry[column.id];
|
|
377
|
-
if (!selectedValue) return undefined;
|
|
378
|
-
|
|
379
|
-
const selectedOption = column.options.find(
|
|
380
|
-
(option) => option.id === selectedValue
|
|
381
|
-
);
|
|
382
|
-
|
|
383
|
-
return selectedOption?.colour || undefined;
|
|
369
|
+
if (coloursValue) {
|
|
370
|
+
return `${coloursValue}40`; // Add 40% opacity
|
|
384
371
|
}
|
|
372
|
+
|
|
373
|
+
// Check for status color if no manual color is set
|
|
374
|
+
const statusColor = getStatusColor(entry);
|
|
375
|
+
return statusColor ? `${statusColor}40` : undefined; // Add 40% opacity
|
|
376
|
+
};
|
|
385
377
|
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
);
|
|
378
|
+
// Helper function to get status color for an entry
|
|
379
|
+
const getStatusColor = (entry) => {
|
|
380
|
+
// Find the status column (typically named 'status' and has dropdown type with options)
|
|
381
|
+
const statusColumn = columns.find(
|
|
382
|
+
(col) =>
|
|
383
|
+
col.type === 'dropdown' &&
|
|
384
|
+
col.options &&
|
|
385
|
+
col.options.some((option) => option.colour) &&
|
|
386
|
+
(col.id === 'status' || col.id.toLowerCase().includes('status'))
|
|
387
|
+
);
|
|
397
388
|
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
}
|
|
389
|
+
if (statusColumn) {
|
|
390
|
+
const statusValue = entry[statusColumn.id];
|
|
391
|
+
if (statusValue) {
|
|
392
|
+
const statusOption = statusColumn.options.find(
|
|
393
|
+
(option) => option.id === statusValue
|
|
394
|
+
);
|
|
395
|
+
return statusOption?.colour || undefined;
|
|
406
396
|
}
|
|
407
397
|
}
|
|
408
|
-
|
|
398
|
+
|
|
409
399
|
return undefined;
|
|
410
400
|
};
|
|
411
401
|
|
|
402
|
+
|
|
412
403
|
// Calculate total project cost (sum of all entries excluding margin row)
|
|
413
404
|
const calculateTotalProjectCost = (dataEntries) => {
|
|
414
405
|
const totalColIndex = columns.findIndex((c) => c.type === 'total');
|
|
@@ -1485,36 +1476,24 @@ const GenericEditableTable = ({
|
|
|
1485
1476
|
}}
|
|
1486
1477
|
>
|
|
1487
1478
|
{renderRowCheckbox(entry)}
|
|
1488
|
-
{columns.map((column) =>
|
|
1489
|
-
|
|
1490
|
-
|
|
1479
|
+
{columns.map((column) => (
|
|
1480
|
+
<td
|
|
1481
|
+
key={column.id}
|
|
1482
|
+
style={{
|
|
1483
|
+
textAlign:
|
|
1484
|
+
column.type ===
|
|
1485
|
+
'currency'
|
|
1486
|
+
? 'right'
|
|
1487
|
+
: 'left',
|
|
1488
|
+
}}
|
|
1489
|
+
>
|
|
1490
|
+
{renderScheduledTableField(
|
|
1491
1491
|
entry,
|
|
1492
|
-
column
|
|
1493
|
-
|
|
1494
|
-
|
|
1495
|
-
|
|
1496
|
-
|
|
1497
|
-
style={{
|
|
1498
|
-
textAlign:
|
|
1499
|
-
column.type ===
|
|
1500
|
-
'currency'
|
|
1501
|
-
? 'right'
|
|
1502
|
-
: 'left',
|
|
1503
|
-
backgroundColor:
|
|
1504
|
-
cellBgColor,
|
|
1505
|
-
color: cellBgColor
|
|
1506
|
-
? '#000'
|
|
1507
|
-
: 'inherit',
|
|
1508
|
-
}}
|
|
1509
|
-
>
|
|
1510
|
-
{renderScheduledTableField(
|
|
1511
|
-
entry,
|
|
1512
|
-
column,
|
|
1513
|
-
entry.keyCounter
|
|
1514
|
-
)}
|
|
1515
|
-
</td>
|
|
1516
|
-
);
|
|
1517
|
-
})}
|
|
1492
|
+
column,
|
|
1493
|
+
entry.keyCounter
|
|
1494
|
+
)}
|
|
1495
|
+
</td>
|
|
1496
|
+
))}
|
|
1518
1497
|
<td>
|
|
1519
1498
|
<div
|
|
1520
1499
|
className={styles.tdactions}
|
|
@@ -1677,37 +1656,26 @@ const GenericEditableTable = ({
|
|
|
1677
1656
|
}}
|
|
1678
1657
|
>
|
|
1679
1658
|
{renderRowCheckbox(entry)}
|
|
1680
|
-
{columns.map((column) =>
|
|
1681
|
-
|
|
1682
|
-
|
|
1683
|
-
|
|
1684
|
-
|
|
1685
|
-
|
|
1686
|
-
|
|
1687
|
-
|
|
1688
|
-
|
|
1689
|
-
|
|
1690
|
-
|
|
1691
|
-
|
|
1692
|
-
|
|
1693
|
-
|
|
1694
|
-
|
|
1695
|
-
|
|
1696
|
-
|
|
1697
|
-
|
|
1698
|
-
|
|
1699
|
-
|
|
1700
|
-
: 'inherit',
|
|
1701
|
-
}}
|
|
1702
|
-
>
|
|
1703
|
-
{renderScheduledTableField(
|
|
1704
|
-
entry,
|
|
1705
|
-
column,
|
|
1706
|
-
idx
|
|
1707
|
-
)}
|
|
1708
|
-
</td>
|
|
1709
|
-
);
|
|
1710
|
-
})}
|
|
1659
|
+
{columns.map((column) => (
|
|
1660
|
+
<td
|
|
1661
|
+
key={column.id}
|
|
1662
|
+
style={{
|
|
1663
|
+
width:
|
|
1664
|
+
column.width || 'auto',
|
|
1665
|
+
textAlign:
|
|
1666
|
+
column.type ===
|
|
1667
|
+
'currency'
|
|
1668
|
+
? 'right'
|
|
1669
|
+
: 'left',
|
|
1670
|
+
}}
|
|
1671
|
+
>
|
|
1672
|
+
{renderScheduledTableField(
|
|
1673
|
+
entry,
|
|
1674
|
+
column,
|
|
1675
|
+
idx
|
|
1676
|
+
)}
|
|
1677
|
+
</td>
|
|
1678
|
+
))}
|
|
1711
1679
|
<td>
|
|
1712
1680
|
<div className={styles.tdactions}>
|
|
1713
1681
|
{idx > 0 && (
|