@visns-studio/visns-components 2.0.10 → 2.1.0
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/Form.jsx
CHANGED
|
@@ -28,8 +28,8 @@ function GenericDetail({ setting, urlParam, userProfile }) {
|
|
|
28
28
|
const [data, setData] = useState({});
|
|
29
29
|
const [dataReload, setDataReload] = useState(0);
|
|
30
30
|
const [subnav, setSubnav] = useState([]);
|
|
31
|
-
|
|
32
31
|
const [total, setTotal] = useState(0);
|
|
32
|
+
const [windowHeight, setWindowHeight] = useState(window.innerHeight);
|
|
33
33
|
|
|
34
34
|
/** General Functions */
|
|
35
35
|
const handleReload = () => {
|
|
@@ -59,7 +59,7 @@ function GenericDetail({ setting, urlParam, userProfile }) {
|
|
|
59
59
|
return value[id];
|
|
60
60
|
}
|
|
61
61
|
} else {
|
|
62
|
-
return '';
|
|
62
|
+
return data[id] || '';
|
|
63
63
|
}
|
|
64
64
|
};
|
|
65
65
|
|
|
@@ -70,33 +70,48 @@ function GenericDetail({ setting, urlParam, userProfile }) {
|
|
|
70
70
|
};
|
|
71
71
|
|
|
72
72
|
const renderValue = (item, data) => {
|
|
73
|
-
const { type, id, relation, size } = item;
|
|
73
|
+
const { type, id, relation, relationKey, size } = item;
|
|
74
74
|
const value =
|
|
75
75
|
relation && relation.length > 0
|
|
76
76
|
? getValueFromData(data, [...relation], id)
|
|
77
77
|
: getValueFromData(data, [], id);
|
|
78
78
|
|
|
79
|
-
const stringValue = String(value
|
|
79
|
+
const stringValue = String(value ?? ''); // Convert value to a string
|
|
80
|
+
|
|
81
|
+
const formatDateValue = (date) => formatDate(date);
|
|
82
|
+
|
|
83
|
+
const formatNoteValue = () => {
|
|
84
|
+
const noteData = data?.[id]?.[0];
|
|
85
|
+
const name = noteData?.user?.name ?? '';
|
|
86
|
+
const description = noteData?.description ?? '';
|
|
87
|
+
const created_at = noteData?.created_at ?? '';
|
|
88
|
+
const formattedDate = formatDateValue(created_at);
|
|
89
|
+
|
|
90
|
+
return name !== '' && description !== '' && formattedDate !== ''
|
|
91
|
+
? parse(
|
|
92
|
+
`<br /><p>${name} - ${formattedDate}</p><p>${description}</p>`
|
|
93
|
+
)
|
|
94
|
+
: null;
|
|
95
|
+
};
|
|
96
|
+
|
|
97
|
+
const formatTotalValue = () => {
|
|
98
|
+
const total =
|
|
99
|
+
data[relation]?.reduce(
|
|
100
|
+
(acc, r) => acc + (parseFloat(r[relationKey]) || 0),
|
|
101
|
+
0
|
|
102
|
+
) || 0;
|
|
103
|
+
return `${total} / ${value}`;
|
|
104
|
+
};
|
|
80
105
|
|
|
81
106
|
switch (type) {
|
|
82
107
|
case 'date':
|
|
83
|
-
return
|
|
108
|
+
return formatDateValue(value);
|
|
84
109
|
case 'exist':
|
|
85
110
|
return value ? 'Yes' : 'No';
|
|
86
111
|
case 'latest_notes':
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
const created_at = noteData?.created_at ?? '';
|
|
91
|
-
const formattedDate = formatDate(created_at);
|
|
92
|
-
|
|
93
|
-
if (name !== '' && description !== '' && formattedDate !== '') {
|
|
94
|
-
return parse(
|
|
95
|
-
`<br /><p>${name} - ${formattedDate}</p><p>${description}</p>`
|
|
96
|
-
);
|
|
97
|
-
} else {
|
|
98
|
-
return null;
|
|
99
|
-
}
|
|
112
|
+
return formatNoteValue();
|
|
113
|
+
case 'total':
|
|
114
|
+
return formatTotalValue();
|
|
100
115
|
default:
|
|
101
116
|
return size === 'full' && stringValue
|
|
102
117
|
? parse(`<br /><p>${stringValue}</p>`)
|
|
@@ -363,6 +378,7 @@ function GenericDetail({ setting, urlParam, userProfile }) {
|
|
|
363
378
|
return (
|
|
364
379
|
<Table
|
|
365
380
|
{...config}
|
|
381
|
+
gridHeight={windowHeight * 0.65}
|
|
366
382
|
setConfig={setConfig}
|
|
367
383
|
setTotal={setTotal}
|
|
368
384
|
style={
|
|
@@ -382,6 +398,19 @@ function GenericDetail({ setting, urlParam, userProfile }) {
|
|
|
382
398
|
};
|
|
383
399
|
|
|
384
400
|
/** General Hooks */
|
|
401
|
+
useEffect(() => {
|
|
402
|
+
const handleResize = () => {
|
|
403
|
+
setWindowHeight(window.innerHeight);
|
|
404
|
+
};
|
|
405
|
+
|
|
406
|
+
window.addEventListener('resize', handleResize);
|
|
407
|
+
|
|
408
|
+
// Clean up the event listener
|
|
409
|
+
return () => {
|
|
410
|
+
window.removeEventListener('resize', handleResize);
|
|
411
|
+
};
|
|
412
|
+
}, []);
|
|
413
|
+
|
|
385
414
|
useEffect(() => {
|
|
386
415
|
if (tabs && tabs.length > 0) {
|
|
387
416
|
const activeTab = subnav.find((s) => s.show === true);
|
|
@@ -10,6 +10,7 @@ function GenericIndex({ setting, userProfile }) {
|
|
|
10
10
|
const [config, setConfig] = useState({});
|
|
11
11
|
const [subnav, setSubnav] = useState(filters || []);
|
|
12
12
|
const [total, setTotal] = useState(0);
|
|
13
|
+
const [windowHeight, setWindowHeight] = useState(window.innerHeight);
|
|
13
14
|
const pageTitle = page?.title;
|
|
14
15
|
|
|
15
16
|
useEffect(() => {
|
|
@@ -44,6 +45,19 @@ function GenericIndex({ setting, userProfile }) {
|
|
|
44
45
|
}
|
|
45
46
|
}, [subnav, tabs]);
|
|
46
47
|
|
|
48
|
+
useEffect(() => {
|
|
49
|
+
const handleResize = () => {
|
|
50
|
+
setWindowHeight(window.innerHeight);
|
|
51
|
+
};
|
|
52
|
+
|
|
53
|
+
window.addEventListener('resize', handleResize);
|
|
54
|
+
|
|
55
|
+
// Clean up the event listener
|
|
56
|
+
return () => {
|
|
57
|
+
window.removeEventListener('resize', handleResize);
|
|
58
|
+
};
|
|
59
|
+
}, []);
|
|
60
|
+
|
|
47
61
|
return (
|
|
48
62
|
<>
|
|
49
63
|
<div className="grid">
|
|
@@ -78,6 +92,7 @@ function GenericIndex({ setting, userProfile }) {
|
|
|
78
92
|
<div className="grid__subcontent">
|
|
79
93
|
<Table
|
|
80
94
|
{...config}
|
|
95
|
+
gridHeight={windowHeight * 0.65}
|
|
81
96
|
setConfig={setConfig}
|
|
82
97
|
setTotal={setTotal}
|
|
83
98
|
style={
|
|
@@ -91,6 +106,7 @@ function GenericIndex({ setting, userProfile }) {
|
|
|
91
106
|
<div className="grid__full">
|
|
92
107
|
<Table
|
|
93
108
|
{...config}
|
|
109
|
+
gridHeight={windowHeight * 0.65}
|
|
94
110
|
setConfig={setConfig}
|
|
95
111
|
setTotal={setTotal}
|
|
96
112
|
style={
|
package/package.json
CHANGED