@visns-studio/visns-components 5.13.14 → 5.13.15

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.
Files changed (2) hide show
  1. package/package.json +1 -1
  2. package/src/components/generic/GenericEditableTable.jsx +108 -69
package/package.json CHANGED
@@ -88,7 +88,7 @@
88
88
  "react-dom": "^17.0.0 || ^18.0.0"
89
89
  },
90
90
  "name": "@visns-studio/visns-components",
91
- "version": "5.13.14",
91
+ "version": "5.13.15",
92
92
  "description": "Various packages to assist in the development of our Custom Applications.",
93
93
  "main": "src/index.js",
94
94
  "files": [
package/src/components/generic/GenericEditableTable.jsx CHANGED
@@ -1249,85 +1249,77 @@ const GenericEditableTable = ({
1249
1249
  if (!hasMarginRow) return null;
1250
1250
 
1251
1251
  const totalProjectCost = calculateTotalProjectCost(localData);
1252
+ const gst = totalProjectCost * 0.1;
1253
+ const totalWithGst = totalProjectCost + gst;
1252
1254
  const marginAmount = calculateMarginAmount(
1253
1255
  totalProjectCost,
1254
1256
  marginPercentage
1255
1257
  );
1256
- const totalWithMargin = totalProjectCost + marginAmount;
1258
+ const totalLkdProjectCost = totalProjectCost + marginAmount;
1259
+ const totalLkdGst = totalLkdProjectCost * 0.1;
1260
+ const totalLkdWithGst = totalLkdProjectCost + totalLkdGst;
1257
1261
 
1258
1262
  return (
1259
1263
  <>
1260
- {/* Margin row category header */}
1261
- <tr className={styles.categoryRow}>
1264
+ {/* Total Project Cost */}
1265
+ <tr style={{ backgroundColor: '#e9ecef', fontWeight: 'bold' }}>
1266
+ <td colSpan={6} style={{ padding: '8px' }}>
1267
+ Total Project Cost
1268
+ </td>
1262
1269
  <td
1263
- colSpan={columns.length + 2}
1264
- style={{
1265
- backgroundColor: '#e9ecef',
1266
- fontWeight: 'bold',
1267
- padding: '8px 12px',
1268
- }}
1270
+ colSpan={4}
1271
+ style={{ padding: '8px', textAlign: 'right' }}
1269
1272
  >
1270
- {rows.marginRow}
1273
+ {totalProjectCost.toLocaleString('en-AU', {
1274
+ style: 'currency',
1275
+ currency: 'AUD',
1276
+ })}
1271
1277
  </td>
1278
+ <td></td>
1272
1279
  </tr>
1273
1280
 
1274
- {/* Margin row column headers - only show Description, Margin %, and Total */}
1275
- <tr>
1276
- {/* Description column - larger width */}
1277
- <th
1278
- style={{
1279
- color: 'white',
1280
- fontWeight: 'bold',
1281
- padding: '8px',
1282
- textAlign: 'left',
1283
- width: '60%',
1284
- }}
1285
- colSpan={6}
1286
- >
1287
- Description
1288
- </th>
1289
- {/* Margin % column - smaller width */}
1290
- <th
1291
- style={{
1292
- color: 'white',
1293
- fontWeight: 'bold',
1294
- padding: '8px',
1295
- textAlign: 'left',
1296
- width: '20%',
1297
- }}
1298
- colSpan={2}
1299
- >
1300
- Margin %
1301
- </th>
1302
- {/* Total column */}
1303
- <th
1304
- style={{
1305
- color: 'white',
1306
- fontWeight: 'bold',
1307
- padding: '8px',
1308
- textAlign: 'right',
1309
- width: '20%',
1310
- }}
1311
- colSpan={2}
1281
+ {/* GST */}
1282
+ <tr style={{ backgroundColor: '#e9ecef' }}>
1283
+ <td colSpan={6} style={{ padding: '8px' }}>
1284
+ GST
1285
+ </td>
1286
+ <td
1287
+ colSpan={4}
1288
+ style={{ padding: '8px', textAlign: 'right' }}
1312
1289
  >
1313
- Total
1314
- </th>
1315
- <th></th>
1290
+ {gst.toLocaleString('en-AU', {
1291
+ style: 'currency',
1292
+ currency: 'AUD',
1293
+ })}
1294
+ </td>
1295
+ <td></td>
1316
1296
  </tr>
1317
1297
 
1318
- {/* Margin row content */}
1319
- <tr style={{ backgroundColor: '#f8f9fa' }}>
1320
- {/* Description */}
1298
+ {/* Total Project Cost (Including GST) */}
1299
+ <tr style={{ backgroundColor: '#e9ecef', fontWeight: 'bold' }}>
1300
+ <td colSpan={6} style={{ padding: '8px' }}>
1301
+ Total Project Cost (Including GST)
1302
+ </td>
1321
1303
  <td
1322
- style={{ fontWeight: 'bold', padding: '8px' }}
1323
- colSpan={6}
1304
+ colSpan={4}
1305
+ style={{ padding: '8px', textAlign: 'right' }}
1324
1306
  >
1325
- {rows.marginRow}
1307
+ {totalWithGst.toLocaleString('en-AU', {
1308
+ style: 'currency',
1309
+ currency: 'AUD',
1310
+ })}
1311
+ </td>
1312
+ <td></td>
1313
+ </tr>
1314
+
1315
+ {/* LKD Margin */}
1316
+ <tr style={{ backgroundColor: '#f8f9fa' }}>
1317
+ <td colSpan={6} style={{ padding: '8px' }}>
1318
+ LKD Margin (in %)
1326
1319
  </td>
1327
- {/* Margin % input */}
1328
1320
  <td
1329
- style={{ textAlign: 'center', padding: '8px' }}
1330
1321
  colSpan={2}
1322
+ style={{ padding: '8px', textAlign: 'center' }}
1331
1323
  >
1332
1324
  <input
1333
1325
  type="number"
@@ -1337,25 +1329,72 @@ const GenericEditableTable = ({
1337
1329
  parseFloat(e.target.value) || 0
1338
1330
  )
1339
1331
  }
1340
- placeholder="% margin"
1332
+ placeholder="0"
1341
1333
  style={{
1342
- width: '80px',
1343
- padding: '6px',
1334
+ padding: '4px',
1344
1335
  border: '1px solid #ccc',
1345
1336
  borderRadius: '3px',
1337
+ textAlign: 'center',
1338
+ marginRight: '4px',
1346
1339
  }}
1347
1340
  />
1348
1341
  </td>
1349
- {/* Total (subtotal of all categories + margin) */}
1350
1342
  <td
1351
- style={{
1352
- textAlign: 'right',
1353
- fontWeight: 'bold',
1354
- padding: '8px',
1355
- }}
1356
1343
  colSpan={2}
1344
+ style={{ padding: '8px', textAlign: 'right' }}
1345
+ >
1346
+ {marginAmount.toLocaleString('en-AU', {
1347
+ style: 'currency',
1348
+ currency: 'AUD',
1349
+ })}
1350
+ </td>
1351
+ <td></td>
1352
+ </tr>
1353
+
1354
+ {/* Total LKD Project Cost */}
1355
+ <tr style={{ backgroundColor: '#e9ecef', fontWeight: 'bold' }}>
1356
+ <td colSpan={6} style={{ padding: '8px' }}>
1357
+ Total LKD Project Cost
1358
+ </td>
1359
+ <td
1360
+ colSpan={4}
1361
+ style={{ padding: '8px', textAlign: 'right' }}
1362
+ >
1363
+ {totalLkdProjectCost.toLocaleString('en-AU', {
1364
+ style: 'currency',
1365
+ currency: 'AUD',
1366
+ })}
1367
+ </td>
1368
+ <td></td>
1369
+ </tr>
1370
+
1371
+ {/* Total GST */}
1372
+ <tr style={{ backgroundColor: '#e9ecef' }}>
1373
+ <td colSpan={6} style={{ padding: '8px' }}>
1374
+ Total GST
1375
+ </td>
1376
+ <td
1377
+ colSpan={4}
1378
+ style={{ padding: '8px', textAlign: 'right' }}
1379
+ >
1380
+ {totalLkdGst.toLocaleString('en-AU', {
1381
+ style: 'currency',
1382
+ currency: 'AUD',
1383
+ })}
1384
+ </td>
1385
+ <td></td>
1386
+ </tr>
1387
+
1388
+ {/* Total LKD Project Cost (Including GST) */}
1389
+ <tr style={{ backgroundColor: '#e9ecef', fontWeight: 'bold' }}>
1390
+ <td colSpan={6} style={{ padding: '8px' }}>
1391
+ Total LKD Project Cost (Including GST)
1392
+ </td>
1393
+ <td
1394
+ colSpan={4}
1395
+ style={{ padding: '8px', textAlign: 'right' }}
1357
1396
  >
1358
- {totalWithMargin.toLocaleString('en-AU', {
1397
+ {totalLkdWithGst.toLocaleString('en-AU', {
1359
1398
  style: 'currency',
1360
1399
  currency: 'AUD',
1361
1400
  })}