@visns-studio/visns-components 5.5.2 → 5.5.4
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/README.md +153 -7
- package/package.json +6 -5
- package/src/components/crm/DataGrid.jsx +357 -15
- package/src/components/crm/Form.jsx +124 -61
- package/src/components/crm/MultiSelect.jsx +19 -2
- package/src/components/crm/styles/DataGrid.module.scss +468 -13
- package/src/components/styles/global.css +138 -0
|
@@ -882,7 +882,9 @@ function Form({
|
|
|
882
882
|
closeModal();
|
|
883
883
|
if (type === 'saveAnother') {
|
|
884
884
|
const { saveAnother } =
|
|
885
|
-
formSettings?.update ||
|
|
885
|
+
formSettings?.update ||
|
|
886
|
+
formSettings?.create ||
|
|
887
|
+
{};
|
|
886
888
|
|
|
887
889
|
if (
|
|
888
890
|
saveAnother?.url &&
|
|
@@ -919,6 +921,16 @@ function Form({
|
|
|
919
921
|
fetchData();
|
|
920
922
|
modalOpen('create', 0);
|
|
921
923
|
}
|
|
924
|
+
} else if (type === 'saveExit') {
|
|
925
|
+
const { saveExit } =
|
|
926
|
+
formSettings?.update ||
|
|
927
|
+
formSettings?.create ||
|
|
928
|
+
{};
|
|
929
|
+
|
|
930
|
+
if (saveExit?.redirectUrl) {
|
|
931
|
+
console.info('aa');
|
|
932
|
+
navigate(saveExit.redirectUrl);
|
|
933
|
+
}
|
|
922
934
|
}
|
|
923
935
|
} else {
|
|
924
936
|
toast.success(
|
|
@@ -1505,11 +1517,25 @@ function Form({
|
|
|
1505
1517
|
</button>
|
|
1506
1518
|
) : null}
|
|
1507
1519
|
|
|
1508
|
-
<button
|
|
1520
|
+
<button
|
|
1521
|
+
className={styles.saveBtn}
|
|
1522
|
+
onClick={handleSubmit}
|
|
1523
|
+
data-type="save"
|
|
1524
|
+
>
|
|
1509
1525
|
{formSettings?.save?.button?.label
|
|
1510
1526
|
? formSettings.save.button.label
|
|
1511
1527
|
: 'Save'}
|
|
1512
1528
|
</button>
|
|
1529
|
+
|
|
1530
|
+
{formSettings.hasOwnProperty('saveExit') && (
|
|
1531
|
+
<button
|
|
1532
|
+
className={styles.btn}
|
|
1533
|
+
onClick={handleSubmit}
|
|
1534
|
+
data-type="saveExit"
|
|
1535
|
+
>
|
|
1536
|
+
{formSettings.saveExit?.label || 'Save & Exit'}
|
|
1537
|
+
</button>
|
|
1538
|
+
)}
|
|
1513
1539
|
</div>
|
|
1514
1540
|
</div>
|
|
1515
1541
|
);
|
|
@@ -1621,65 +1647,102 @@ function Form({
|
|
|
1621
1647
|
}}
|
|
1622
1648
|
/>
|
|
1623
1649
|
</div>
|
|
1624
|
-
{
|
|
1625
|
-
|
|
1626
|
-
|
|
1627
|
-
|
|
1628
|
-
|
|
1629
|
-
|
|
1630
|
-
|
|
1631
|
-
|
|
1632
|
-
|
|
1633
|
-
|
|
1634
|
-
|
|
1635
|
-
|
|
1636
|
-
|
|
1637
|
-
|
|
1638
|
-
|
|
1639
|
-
|
|
1640
|
-
|
|
1641
|
-
|
|
1642
|
-
|
|
1643
|
-
|
|
1644
|
-
|
|
1645
|
-
|
|
1646
|
-
|
|
1647
|
-
|
|
1648
|
-
|
|
1649
|
-
|
|
1650
|
-
|
|
1651
|
-
|
|
1652
|
-
|
|
1653
|
-
|
|
1654
|
-
|
|
1655
|
-
|
|
1656
|
-
|
|
1657
|
-
|
|
1658
|
-
|
|
1659
|
-
|
|
1660
|
-
|
|
1661
|
-
|
|
1662
|
-
|
|
1663
|
-
|
|
1664
|
-
|
|
1665
|
-
|
|
1666
|
-
.
|
|
1667
|
-
|
|
1668
|
-
|
|
1669
|
-
|
|
1670
|
-
|
|
1671
|
-
|
|
1672
|
-
|
|
1673
|
-
|
|
1674
|
-
|
|
1675
|
-
|
|
1676
|
-
|
|
1677
|
-
|
|
1678
|
-
|
|
1679
|
-
|
|
1680
|
-
|
|
1681
|
-
|
|
1682
|
-
|
|
1650
|
+
{(() => {
|
|
1651
|
+
if (formType === 'create') {
|
|
1652
|
+
return (
|
|
1653
|
+
<div
|
|
1654
|
+
className={`${styles.formItem} ${styles.fwItem} ${styles.buttonContainer}`}
|
|
1655
|
+
>
|
|
1656
|
+
<button
|
|
1657
|
+
className={styles.btn}
|
|
1658
|
+
onClick={handleSubmit}
|
|
1659
|
+
data-type="save"
|
|
1660
|
+
>
|
|
1661
|
+
Save & Close
|
|
1662
|
+
</button>
|
|
1663
|
+
{formSettings.create?.hasOwnProperty(
|
|
1664
|
+
'saveAnother'
|
|
1665
|
+
) && (
|
|
1666
|
+
<button
|
|
1667
|
+
className={styles.btn}
|
|
1668
|
+
onClick={handleSubmit}
|
|
1669
|
+
data-type="saveAnother"
|
|
1670
|
+
>
|
|
1671
|
+
Save & Create Another
|
|
1672
|
+
</button>
|
|
1673
|
+
)}
|
|
1674
|
+
{formSettings.create?.hasOwnProperty(
|
|
1675
|
+
'saveExit'
|
|
1676
|
+
) && (
|
|
1677
|
+
<button
|
|
1678
|
+
className={styles.btn}
|
|
1679
|
+
onClick={handleSubmit}
|
|
1680
|
+
data-type="saveExit"
|
|
1681
|
+
>
|
|
1682
|
+
{formSettings.create
|
|
1683
|
+
.saveExit?.label ||
|
|
1684
|
+
'Save & Exit'}
|
|
1685
|
+
</button>
|
|
1686
|
+
)}
|
|
1687
|
+
</div>
|
|
1688
|
+
);
|
|
1689
|
+
} else if (formType === 'update') {
|
|
1690
|
+
return (
|
|
1691
|
+
<div
|
|
1692
|
+
className={`${styles.formItem} ${styles.fwItem} ${styles.buttonContainer}`}
|
|
1693
|
+
>
|
|
1694
|
+
<button
|
|
1695
|
+
className={styles.btn}
|
|
1696
|
+
onClick={handleSubmit}
|
|
1697
|
+
data-type="save"
|
|
1698
|
+
>
|
|
1699
|
+
Save & Close
|
|
1700
|
+
</button>
|
|
1701
|
+
{formSettings.update?.hasOwnProperty(
|
|
1702
|
+
'saveAnother'
|
|
1703
|
+
) && (
|
|
1704
|
+
<button
|
|
1705
|
+
className={styles.btn}
|
|
1706
|
+
onClick={handleSubmit}
|
|
1707
|
+
data-type="saveAnother"
|
|
1708
|
+
>
|
|
1709
|
+
{formSettings.update
|
|
1710
|
+
.saveAnother
|
|
1711
|
+
?.label ||
|
|
1712
|
+
'Save & Create Another'}
|
|
1713
|
+
</button>
|
|
1714
|
+
)}
|
|
1715
|
+
{formSettings.update?.hasOwnProperty(
|
|
1716
|
+
'saveExit'
|
|
1717
|
+
) && (
|
|
1718
|
+
<button
|
|
1719
|
+
className={styles.btn}
|
|
1720
|
+
onClick={handleSubmit}
|
|
1721
|
+
data-type="saveExit"
|
|
1722
|
+
>
|
|
1723
|
+
{formSettings.update
|
|
1724
|
+
.saveExit?.label ||
|
|
1725
|
+
'Save & Exit'}
|
|
1726
|
+
</button>
|
|
1727
|
+
)}
|
|
1728
|
+
</div>
|
|
1729
|
+
);
|
|
1730
|
+
} else {
|
|
1731
|
+
return (
|
|
1732
|
+
<div
|
|
1733
|
+
className={`${styles.formItem} ${styles.fwItem} ${styles.lastItem}`}
|
|
1734
|
+
>
|
|
1735
|
+
<button
|
|
1736
|
+
className={styles.btn}
|
|
1737
|
+
onClick={handleSubmit}
|
|
1738
|
+
data-type="save"
|
|
1739
|
+
>
|
|
1740
|
+
Save
|
|
1741
|
+
</button>
|
|
1742
|
+
</div>
|
|
1743
|
+
);
|
|
1744
|
+
}
|
|
1745
|
+
})()}
|
|
1683
1746
|
</form>
|
|
1684
1747
|
</div>
|
|
1685
1748
|
</div>
|
|
@@ -101,7 +101,7 @@ function MultiSelect({
|
|
|
101
101
|
|
|
102
102
|
return (
|
|
103
103
|
<SelectComponent
|
|
104
|
-
closeMenuOnSelect={!multi}
|
|
104
|
+
closeMenuOnSelect={!multi || settings.limit === 1}
|
|
105
105
|
isClearable
|
|
106
106
|
isSearchable
|
|
107
107
|
isMulti={multi}
|
|
@@ -109,7 +109,19 @@ function MultiSelect({
|
|
|
109
109
|
components={{ SelectList }}
|
|
110
110
|
options={selectOptions}
|
|
111
111
|
onChange={(inputValue, action) => {
|
|
112
|
-
|
|
112
|
+
// Special handling for limit=1: keep only the most recent selection
|
|
113
|
+
if (
|
|
114
|
+
settings.limit === 1 &&
|
|
115
|
+
multi &&
|
|
116
|
+
Array.isArray(inputValue) &&
|
|
117
|
+
inputValue.length > 1
|
|
118
|
+
) {
|
|
119
|
+
const latestSelection = inputValue[inputValue.length - 1];
|
|
120
|
+
const newValue = latestSelection ? [latestSelection] : [];
|
|
121
|
+
onChange(newValue, action, settings.id);
|
|
122
|
+
} else {
|
|
123
|
+
onChange(inputValue, action, settings.id);
|
|
124
|
+
}
|
|
113
125
|
}}
|
|
114
126
|
className={
|
|
115
127
|
className
|
|
@@ -130,6 +142,11 @@ function MultiSelect({
|
|
|
130
142
|
value={selectValue}
|
|
131
143
|
onCreateOption={handleCreate}
|
|
132
144
|
placeholder={placeholder ? placeholder : 'Select...'}
|
|
145
|
+
isOptionDisabled={
|
|
146
|
+
settings.limit && multi && settings.limit > 1
|
|
147
|
+
? () => selectValue.length >= settings.limit
|
|
148
|
+
: undefined
|
|
149
|
+
}
|
|
133
150
|
/>
|
|
134
151
|
);
|
|
135
152
|
}
|