@visns-studio/visns-components 4.4.8 → 4.4.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/components/crm/Field.jsx +23 -25
- package/components/crm/auth/Login.jsx +13 -3
- package/components/crm/auth/Reset.jsx +7 -1
- package/components/crm/auth/Verify.jsx +7 -1
- package/components/crm/auth/styles/Login.module.css +0 -2
- package/components/crm/auth/styles/Reset.module.css +0 -2
- package/components/crm/auth/styles/Verify.module.css +0 -2
- package/components/crm/generic/GenericAuth.jsx +11 -5
- package/components/crm/generic/GenericDynamic.jsx +21 -16
- package/components/crm/styles/Form.module.css +1 -3
- package/package.json +1 -1
package/components/crm/Field.jsx
CHANGED
|
@@ -1152,9 +1152,9 @@ function Field({
|
|
|
1152
1152
|
<thead>
|
|
1153
1153
|
<tr>
|
|
1154
1154
|
<th></th>
|
|
1155
|
-
{tableRadioColumns.map((column
|
|
1155
|
+
{tableRadioColumns.map((column) => (
|
|
1156
1156
|
<th
|
|
1157
|
-
key={`${settings.id}-${
|
|
1157
|
+
key={`${settings.id}-${column.id}`}
|
|
1158
1158
|
style={{
|
|
1159
1159
|
width: '250px',
|
|
1160
1160
|
whiteSpace: 'nowrap',
|
|
@@ -1166,9 +1166,9 @@ function Field({
|
|
|
1166
1166
|
</tr>
|
|
1167
1167
|
</thead>
|
|
1168
1168
|
<tbody>
|
|
1169
|
-
{tableRadioRows.map((row
|
|
1169
|
+
{tableRadioRows.map((row) => (
|
|
1170
1170
|
<tr
|
|
1171
|
-
key={`table-radio-row-${settings.id}-${
|
|
1171
|
+
key={`table-radio-row-${settings.id}-${row.id}`}
|
|
1172
1172
|
>
|
|
1173
1173
|
<td
|
|
1174
1174
|
style={{
|
|
@@ -1177,27 +1177,25 @@ function Field({
|
|
|
1177
1177
|
>
|
|
1178
1178
|
{row.label}
|
|
1179
1179
|
</td>
|
|
1180
|
-
{tableRadioColumns.map(
|
|
1181
|
-
|
|
1182
|
-
|
|
1183
|
-
|
|
1184
|
-
|
|
1185
|
-
|
|
1186
|
-
|
|
1187
|
-
|
|
1188
|
-
|
|
1189
|
-
|
|
1190
|
-
|
|
1191
|
-
|
|
1192
|
-
|
|
1193
|
-
|
|
1194
|
-
|
|
1195
|
-
|
|
1196
|
-
|
|
1197
|
-
|
|
1198
|
-
|
|
1199
|
-
)
|
|
1200
|
-
)}
|
|
1180
|
+
{tableRadioColumns.map((column) => (
|
|
1181
|
+
<td
|
|
1182
|
+
key={`table-radio-cell-${settings.id}-${row.id}-${column.id}`}
|
|
1183
|
+
>
|
|
1184
|
+
{console.info(column, row)}
|
|
1185
|
+
<input
|
|
1186
|
+
type="checkbox"
|
|
1187
|
+
name={row.id}
|
|
1188
|
+
data-row-id={row.id}
|
|
1189
|
+
data-column-id={column.id}
|
|
1190
|
+
data-id={settings.id}
|
|
1191
|
+
onChange={onChangeTableRadio}
|
|
1192
|
+
checked={
|
|
1193
|
+
row.value?.[column.id] ===
|
|
1194
|
+
true
|
|
1195
|
+
}
|
|
1196
|
+
/>
|
|
1197
|
+
</td>
|
|
1198
|
+
))}
|
|
1201
1199
|
</tr>
|
|
1202
1200
|
))}
|
|
1203
1201
|
</tbody>
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import '../../styles/global.css';
|
|
2
2
|
|
|
3
|
-
import React, { useState } from 'react';
|
|
3
|
+
import React, { useEffect, useState } from 'react';
|
|
4
4
|
import { Link, useLocation } from 'react-router-dom';
|
|
5
5
|
import Reveal from 'react-reveal/Reveal';
|
|
6
6
|
import { toast } from 'react-toastify';
|
|
@@ -10,7 +10,7 @@ import CustomFetch from '../Fetch';
|
|
|
10
10
|
|
|
11
11
|
import styles from './styles/Login.module.css';
|
|
12
12
|
|
|
13
|
-
const Login = ({ logo, providers, setSystemAuth, setUserProfile }) => {
|
|
13
|
+
const Login = ({ loginBg, logo, providers, setSystemAuth, setUserProfile }) => {
|
|
14
14
|
const location = useLocation();
|
|
15
15
|
|
|
16
16
|
const [auth, setAuth] = useState({
|
|
@@ -135,10 +135,20 @@ const Login = ({ logo, providers, setSystemAuth, setUserProfile }) => {
|
|
|
135
135
|
}
|
|
136
136
|
};
|
|
137
137
|
|
|
138
|
+
useEffect(() => {
|
|
139
|
+
console.info(loginBg, 'test111');
|
|
140
|
+
}, [loginBg]);
|
|
141
|
+
|
|
138
142
|
return (
|
|
139
143
|
<div className={styles.lcontainer}>
|
|
140
144
|
<div className={styles.lwrap}>
|
|
141
|
-
<aside
|
|
145
|
+
<aside
|
|
146
|
+
className={styles.aside}
|
|
147
|
+
style={{
|
|
148
|
+
backgroundImage: `url(${loginBg})`,
|
|
149
|
+
backgroundSize: 'cover',
|
|
150
|
+
}}
|
|
151
|
+
></aside>
|
|
142
152
|
<div className={styles.logincontainer}>
|
|
143
153
|
<form onSubmit={handleSubmit}>
|
|
144
154
|
<Reveal effect="fadeInUp">
|
|
@@ -44,7 +44,13 @@ const Reset = ({ logo }) => {
|
|
|
44
44
|
return (
|
|
45
45
|
<div className={styles.lcontainer}>
|
|
46
46
|
<div className={styles.lwrap}>
|
|
47
|
-
<aside
|
|
47
|
+
<aside
|
|
48
|
+
className={styles.aside}
|
|
49
|
+
style={{
|
|
50
|
+
backgroundImage: `url(${loginBg})`,
|
|
51
|
+
backgroundSize: 'cover',
|
|
52
|
+
}}
|
|
53
|
+
></aside>
|
|
48
54
|
<div className={styles.logincontainer}>
|
|
49
55
|
<form onSubmit={handleSubmit}>
|
|
50
56
|
<Reveal effect="fadeInUp">
|
|
@@ -96,7 +96,13 @@ const Verify = ({ logo }) => {
|
|
|
96
96
|
return (
|
|
97
97
|
<div className={styles.lcontainer}>
|
|
98
98
|
<div className={styles.lwrap}>
|
|
99
|
-
<aside
|
|
99
|
+
<aside
|
|
100
|
+
className={styles.aside}
|
|
101
|
+
style={{
|
|
102
|
+
backgroundImage: `url(${loginBg})`,
|
|
103
|
+
backgroundSize: 'cover',
|
|
104
|
+
}}
|
|
105
|
+
></aside>
|
|
100
106
|
<div className={styles.logincontainer}>
|
|
101
107
|
<form onSubmit={handleSubmit}>
|
|
102
108
|
<Reveal effect="fadeInUp">
|
|
@@ -34,6 +34,7 @@ const ProtectedRoute = ({ user, loading, redirectPath = '/login' }) => {
|
|
|
34
34
|
|
|
35
35
|
const GenericAuth = ({
|
|
36
36
|
layout = 'full',
|
|
37
|
+
loginBg,
|
|
37
38
|
logo,
|
|
38
39
|
headerLogo,
|
|
39
40
|
providers,
|
|
@@ -70,6 +71,7 @@ const GenericAuth = ({
|
|
|
70
71
|
|
|
71
72
|
useEffect(() => {
|
|
72
73
|
updateAuthStatus();
|
|
74
|
+
console.info(loginBg, 'test222');
|
|
73
75
|
}, [isAuthenticated]);
|
|
74
76
|
|
|
75
77
|
return (
|
|
@@ -79,6 +81,7 @@ const GenericAuth = ({
|
|
|
79
81
|
path="login"
|
|
80
82
|
element={
|
|
81
83
|
<LoginComponent
|
|
84
|
+
loginBg={loginBg}
|
|
82
85
|
logo={logo}
|
|
83
86
|
providers={providers}
|
|
84
87
|
setIsAuthenticated={setIsAuthenticated}
|
|
@@ -90,6 +93,7 @@ const GenericAuth = ({
|
|
|
90
93
|
path="reset"
|
|
91
94
|
element={
|
|
92
95
|
<ResetComponent
|
|
96
|
+
loginBg={loginBg}
|
|
93
97
|
logo={logo}
|
|
94
98
|
setIsAuthenticated={setIsAuthenticated}
|
|
95
99
|
/>
|
|
@@ -99,6 +103,7 @@ const GenericAuth = ({
|
|
|
99
103
|
path="verify/:code"
|
|
100
104
|
element={
|
|
101
105
|
<VerifyComponent
|
|
106
|
+
loginBg={loginBg}
|
|
102
107
|
logo={logo}
|
|
103
108
|
setIsAuthenticated={setIsAuthenticated}
|
|
104
109
|
/>
|
|
@@ -140,8 +145,9 @@ const GenericAuth = ({
|
|
|
140
145
|
};
|
|
141
146
|
|
|
142
147
|
const LoginComponent = React.memo(
|
|
143
|
-
({ logo, providers, setIsAuthenticated, setUserProfile }) => (
|
|
148
|
+
({ loginBg, logo, providers, setIsAuthenticated, setUserProfile }) => (
|
|
144
149
|
<Login
|
|
150
|
+
loginBg={loginBg}
|
|
145
151
|
logo={logo}
|
|
146
152
|
providers={providers}
|
|
147
153
|
setSystemAuth={setIsAuthenticated}
|
|
@@ -150,12 +156,12 @@ const LoginComponent = React.memo(
|
|
|
150
156
|
)
|
|
151
157
|
);
|
|
152
158
|
|
|
153
|
-
const ResetComponent = React.memo(({ logo, setIsAuthenticated }) => (
|
|
154
|
-
<Reset logo={logo} setSystemAuth={setIsAuthenticated} />
|
|
159
|
+
const ResetComponent = React.memo(({ loginBg, logo, setIsAuthenticated }) => (
|
|
160
|
+
<Reset loginBg={loginBg} logo={logo} setSystemAuth={setIsAuthenticated} />
|
|
155
161
|
));
|
|
156
162
|
|
|
157
|
-
const VerifyComponent = React.memo(({ logo, setIsAuthenticated }) => (
|
|
158
|
-
<Verify logo={logo} setSystemAuth={setIsAuthenticated} />
|
|
163
|
+
const VerifyComponent = React.memo(({ loginBg, logo, setIsAuthenticated }) => (
|
|
164
|
+
<Verify loginBg={loginBg} logo={logo} setSystemAuth={setIsAuthenticated} />
|
|
159
165
|
));
|
|
160
166
|
|
|
161
167
|
export default GenericAuth;
|
|
@@ -213,16 +213,11 @@ const GenericDynamic = ({
|
|
|
213
213
|
|
|
214
214
|
const handleChangeTableRadio = (e) => {
|
|
215
215
|
const {
|
|
216
|
-
|
|
217
|
-
dataset: { id },
|
|
216
|
+
dataset: { id, rowId, columnId },
|
|
218
217
|
} = e.target;
|
|
219
218
|
|
|
220
|
-
// console.info('Checkbox changed:', { name, id });
|
|
221
|
-
|
|
222
219
|
setActiveForm((prevActiveForm) => {
|
|
223
|
-
//
|
|
224
|
-
|
|
225
|
-
// Find the form that matches the given id
|
|
220
|
+
// Find the form element that matches the given id
|
|
226
221
|
const formKey = Object.keys(prevActiveForm).find(
|
|
227
222
|
(key) => prevActiveForm[key].id === id
|
|
228
223
|
);
|
|
@@ -234,15 +229,21 @@ const GenericDynamic = ({
|
|
|
234
229
|
return prevActiveForm;
|
|
235
230
|
}
|
|
236
231
|
|
|
237
|
-
// console.info('Found formKey:', formKey);
|
|
238
|
-
|
|
239
232
|
// Create a new rows array with toggled value properties
|
|
240
|
-
const updatedRows = prevActiveForm[formKey].rows.map((row) =>
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
233
|
+
const updatedRows = prevActiveForm[formKey].rows.map((row) => {
|
|
234
|
+
if (row.id === rowId) {
|
|
235
|
+
// Ensure the value is an object to handle multiple columns
|
|
236
|
+
const updatedValue = {
|
|
237
|
+
...row.value,
|
|
238
|
+
[columnId]: !row.value?.[columnId], // Toggle the specific column value
|
|
239
|
+
};
|
|
240
|
+
return {
|
|
241
|
+
...row,
|
|
242
|
+
value: updatedValue,
|
|
243
|
+
};
|
|
244
|
+
}
|
|
245
|
+
return row;
|
|
246
|
+
});
|
|
246
247
|
|
|
247
248
|
// Return the updated activeForm state
|
|
248
249
|
return {
|
|
@@ -255,6 +256,10 @@ const GenericDynamic = ({
|
|
|
255
256
|
});
|
|
256
257
|
};
|
|
257
258
|
|
|
259
|
+
useEffect(() => {
|
|
260
|
+
console.info(activeForm);
|
|
261
|
+
}, [activeForm]);
|
|
262
|
+
|
|
258
263
|
const handleChangeAddTableTextRow = (id) => {
|
|
259
264
|
setActiveForm((prevActiveForm) => {
|
|
260
265
|
// Find the key of the form that matches the id
|
|
@@ -577,7 +582,7 @@ const GenericDynamic = ({
|
|
|
577
582
|
if (templateStatus) {
|
|
578
583
|
if (multiple) {
|
|
579
584
|
if (activeForm.hasOwnProperty('id') === false) {
|
|
580
|
-
handleAddNewForm(false);
|
|
585
|
+
// handleAddNewForm(false);
|
|
581
586
|
}
|
|
582
587
|
} else {
|
|
583
588
|
if (Object.keys(activeForm).length === 0) {
|
|
@@ -181,12 +181,10 @@ select::-ms-expand {
|
|
|
181
181
|
}
|
|
182
182
|
|
|
183
183
|
.aside {
|
|
184
|
-
background: url(../images/loginbg.jpg) no-repeat var(--background-color);
|
|
185
|
-
background-size: cover;
|
|
186
184
|
opacity: 1;
|
|
187
185
|
position: fixed;
|
|
188
186
|
overflow: hidden;
|
|
189
|
-
height:
|
|
187
|
+
height: 101%;
|
|
190
188
|
width: var(--sidebar-width);
|
|
191
189
|
}
|
|
192
190
|
|
package/package.json
CHANGED