@visns-studio/visns-components 5.2.9 → 5.2.10
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
|
@@ -78,7 +78,7 @@
|
|
|
78
78
|
"react-dom": "^17.0.0 || ^18.0.0"
|
|
79
79
|
},
|
|
80
80
|
"name": "@visns-studio/visns-components",
|
|
81
|
-
"version": "5.2.
|
|
81
|
+
"version": "5.2.10",
|
|
82
82
|
"description": "Various packages to assist in the development of our Custom Applications.",
|
|
83
83
|
"main": "src/index.js",
|
|
84
84
|
"files": [
|
|
@@ -81,6 +81,7 @@ function GenericDetail({
|
|
|
81
81
|
|
|
82
82
|
const formData = new FormData();
|
|
83
83
|
formData.append('file', e.target.files[0]);
|
|
84
|
+
formData.append('template_id', routeParams[urlParam]);
|
|
84
85
|
|
|
85
86
|
// Show a loading toast when the file is being processed
|
|
86
87
|
const loadingToast = toast.loading(
|
|
@@ -98,6 +99,7 @@ function GenericDetail({
|
|
|
98
99
|
|
|
99
100
|
if (response.ok) {
|
|
100
101
|
const result = await response.json();
|
|
102
|
+
|
|
101
103
|
setData((prevState) => ({
|
|
102
104
|
...prevState,
|
|
103
105
|
[id]: result,
|
|
@@ -215,6 +217,10 @@ function GenericDetail({
|
|
|
215
217
|
}
|
|
216
218
|
};
|
|
217
219
|
|
|
220
|
+
useEffect(() => {
|
|
221
|
+
console.info(data);
|
|
222
|
+
}, [data]);
|
|
223
|
+
|
|
218
224
|
/** General Functions */
|
|
219
225
|
const togglePasswordVisibility = () => {
|
|
220
226
|
setPasswordVisible(!passwordVisible);
|
|
@@ -620,10 +626,42 @@ function GenericDetail({
|
|
|
620
626
|
}
|
|
621
627
|
};
|
|
622
628
|
|
|
629
|
+
const handleOcrTitleChange = (e) => {
|
|
630
|
+
const {
|
|
631
|
+
value,
|
|
632
|
+
dataset: { id },
|
|
633
|
+
} = e.target;
|
|
634
|
+
|
|
635
|
+
let selectedTitle = data[id].selectedTitle || [];
|
|
636
|
+
|
|
637
|
+
if (selectedTitle.includes(value)) {
|
|
638
|
+
selectedTitle = selectedTitle.filter((line) => line !== value);
|
|
639
|
+
} else {
|
|
640
|
+
selectedTitle.push(value);
|
|
641
|
+
}
|
|
642
|
+
|
|
643
|
+
setData((prevState) => ({
|
|
644
|
+
...prevState,
|
|
645
|
+
[id]: {
|
|
646
|
+
...prevState[id],
|
|
647
|
+
selectedTitle,
|
|
648
|
+
},
|
|
649
|
+
}));
|
|
650
|
+
};
|
|
651
|
+
|
|
652
|
+
// Helper function to chunk an array into subarrays of given size.
|
|
653
|
+
const chunkArray = (arr, chunkSize) => {
|
|
654
|
+
const result = [];
|
|
655
|
+
for (let i = 0; i < arr.length; i += chunkSize) {
|
|
656
|
+
result.push(arr.slice(i, i + chunkSize));
|
|
657
|
+
}
|
|
658
|
+
return result;
|
|
659
|
+
};
|
|
660
|
+
|
|
623
661
|
const renderOcrTemplate = (id) => {
|
|
624
662
|
const ocrTemplateBuilder = data[id];
|
|
625
|
-
const listOfKeys = data[id]?.
|
|
626
|
-
?
|
|
663
|
+
const listOfKeys = data[id]?.keyValuePairs
|
|
664
|
+
? data[id].keyValuePairs
|
|
627
665
|
: {};
|
|
628
666
|
|
|
629
667
|
return (
|
|
@@ -634,55 +672,90 @@ function GenericDetail({
|
|
|
634
672
|
onChange={handleOcrFileChange}
|
|
635
673
|
/>
|
|
636
674
|
|
|
637
|
-
{ocrTemplateBuilder &&
|
|
638
|
-
|
|
639
|
-
|
|
640
|
-
|
|
641
|
-
|
|
642
|
-
<
|
|
643
|
-
|
|
644
|
-
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
|
|
675
|
+
{ocrTemplateBuilder && ocrTemplateBuilder.keyValuePairs && (
|
|
676
|
+
<table className={styles.schedulingTable}>
|
|
677
|
+
<thead>
|
|
678
|
+
<tr>
|
|
679
|
+
<th></th>
|
|
680
|
+
<th>Key</th>
|
|
681
|
+
<th>Value</th>
|
|
682
|
+
</tr>
|
|
683
|
+
</thead>
|
|
684
|
+
<tbody>
|
|
685
|
+
{Object.entries(listOfKeys).map(
|
|
686
|
+
([key, value], index) => (
|
|
687
|
+
<tr key={`ocr-keys-${index}`}>
|
|
688
|
+
<td>
|
|
689
|
+
<input
|
|
690
|
+
type="checkbox"
|
|
691
|
+
name={key}
|
|
692
|
+
value={key}
|
|
693
|
+
data-id={id}
|
|
694
|
+
checked={
|
|
695
|
+
ocrTemplateBuilder?.selectedKey?.includes(
|
|
696
|
+
key
|
|
697
|
+
) || false
|
|
698
|
+
}
|
|
699
|
+
onChange={
|
|
700
|
+
handleOcrKeyChange
|
|
701
|
+
}
|
|
702
|
+
/>
|
|
703
|
+
</td>
|
|
704
|
+
<td>{key}</td>
|
|
705
|
+
<td>{value}</td>
|
|
706
|
+
</tr>
|
|
707
|
+
)
|
|
708
|
+
)}
|
|
709
|
+
</tbody>
|
|
710
|
+
</table>
|
|
711
|
+
)}
|
|
712
|
+
|
|
713
|
+
{ocrTemplateBuilder && ocrTemplateBuilder.allText && (
|
|
714
|
+
<table className={styles.schedulingTable}>
|
|
715
|
+
<thead>
|
|
716
|
+
<tr>
|
|
717
|
+
<th colSpan="4">
|
|
718
|
+
Text Lines (Select Document Title)
|
|
719
|
+
</th>
|
|
720
|
+
</tr>
|
|
721
|
+
</thead>
|
|
722
|
+
<tbody>
|
|
723
|
+
{chunkArray(ocrTemplateBuilder.allText, 4).map(
|
|
724
|
+
(row, rowIndex) => (
|
|
725
|
+
<tr key={`ocr-text-row-${rowIndex}`}>
|
|
726
|
+
{row.map((line, colIndex) => (
|
|
727
|
+
<td
|
|
728
|
+
key={`ocr-text-${rowIndex}-${colIndex}`}
|
|
729
|
+
>
|
|
653
730
|
<input
|
|
654
731
|
type="checkbox"
|
|
655
|
-
name=
|
|
656
|
-
value={
|
|
732
|
+
name="docTitle"
|
|
733
|
+
value={line}
|
|
657
734
|
data-id={id}
|
|
658
735
|
checked={
|
|
659
|
-
ocrTemplateBuilder?.
|
|
660
|
-
|
|
736
|
+
ocrTemplateBuilder?.selectedTitle?.includes(
|
|
737
|
+
line
|
|
661
738
|
) || false
|
|
662
739
|
}
|
|
663
740
|
onChange={
|
|
664
|
-
|
|
741
|
+
handleOcrTitleChange
|
|
665
742
|
}
|
|
666
|
-
/>
|
|
743
|
+
/>{' '}
|
|
744
|
+
{line}
|
|
667
745
|
</td>
|
|
668
|
-
|
|
669
|
-
|
|
670
|
-
|
|
671
|
-
|
|
672
|
-
|
|
673
|
-
|
|
674
|
-
|
|
675
|
-
)}
|
|
746
|
+
))}
|
|
747
|
+
</tr>
|
|
748
|
+
)
|
|
749
|
+
)}
|
|
750
|
+
</tbody>
|
|
751
|
+
</table>
|
|
752
|
+
)}
|
|
676
753
|
|
|
677
754
|
{ocrTemplateBuilder &&
|
|
678
755
|
ocrTemplateBuilder.selectedKey &&
|
|
679
756
|
ocrTemplateBuilder.selectedKey.length > 0 && (
|
|
680
757
|
<>
|
|
681
|
-
<h2
|
|
682
|
-
style={{
|
|
683
|
-
borderBottom: '1px solid grey',
|
|
684
|
-
}}
|
|
685
|
-
>
|
|
758
|
+
<h2 style={{ borderBottom: '1px solid grey' }}>
|
|
686
759
|
File Name Template
|
|
687
760
|
</h2>
|
|
688
761
|
<strong>Selected Keys</strong>
|
|
@@ -727,7 +800,6 @@ function GenericDetail({
|
|
|
727
800
|
value={data?.content?.watchFolder || ''}
|
|
728
801
|
onChange={(e) => {
|
|
729
802
|
const { name, value } = e.target;
|
|
730
|
-
|
|
731
803
|
setData((prevState) => ({
|
|
732
804
|
...prevState,
|
|
733
805
|
content: {
|
|
@@ -737,7 +809,6 @@ function GenericDetail({
|
|
|
737
809
|
}));
|
|
738
810
|
}}
|
|
739
811
|
/>
|
|
740
|
-
|
|
741
812
|
<br />
|
|
742
813
|
<br />
|
|
743
814
|
<strong>Destination Folder</strong>
|
|
@@ -749,7 +820,6 @@ function GenericDetail({
|
|
|
749
820
|
}
|
|
750
821
|
onChange={(e) => {
|
|
751
822
|
const { name, value } = e.target;
|
|
752
|
-
|
|
753
823
|
setData((prevState) => ({
|
|
754
824
|
...prevState,
|
|
755
825
|
content: {
|