@visns-studio/visns-components 4.4.3 → 4.4.5
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/auth/Login.jsx +34 -17
- package/components/crm/auth/Reset.jsx +22 -12
- package/components/crm/auth/Verify.jsx +23 -15
- package/components/crm/auth/styles/Login.module.css +218 -0
- package/components/crm/auth/styles/Reset.module.css +218 -0
- package/components/crm/auth/styles/Verify.module.css +218 -0
- package/components/crm/generic/AuditLog.jsx +15 -10
- package/components/crm/generic/AuditLogs.jsx +7 -6
- package/components/crm/generic/GenericDetail.jsx +102 -44
- package/components/crm/generic/GenericMain.jsx +6 -5
- package/components/crm/generic/GenericSort.jsx +7 -6
- package/components/crm/generic/NotificationList.jsx +6 -6
- package/components/crm/generic/styles/AuditLog.module.css +147 -0
- package/components/crm/generic/styles/AuditLogs.module.css +67 -0
- package/components/crm/generic/styles/GenericDetail.module.css +578 -0
- package/components/crm/generic/styles/GenericIndex.module.css +178 -183
- package/components/crm/generic/styles/GenericMain.module.css +77 -0
- package/components/crm/generic/styles/GenericSort.module.css +67 -0
- package/components/crm/generic/styles/NotificationList.module.css +67 -0
- package/components/crm/styles/AsyncSelect.module.css +6 -10
- package/components/crm/styles/Autocomplete.module.css +3 -3
- package/components/crm/styles/DataGrid.module.css +59 -59
- package/components/crm/styles/Form.module.css +17 -19
- package/components/crm/styles/MultiSelect.module.css +6 -10
- package/components/crm/styles/TableFilter.module.css +1 -0
- package/package.json +1 -1
|
@@ -5,6 +5,7 @@ import { toast } from 'react-toastify';
|
|
|
5
5
|
import { CircleChevronRight } from 'akar-icons';
|
|
6
6
|
import CustomFetch from '../../crm/Fetch';
|
|
7
7
|
import SortableList from '../../cms/sorting/List';
|
|
8
|
+
import styles from './styles/GenericSort.module.css';
|
|
8
9
|
|
|
9
10
|
const ChildSort = ({ item, url }) => {
|
|
10
11
|
const [data, setData] = useState(item.child);
|
|
@@ -120,9 +121,9 @@ const GenericSort = ({ category = false }) => {
|
|
|
120
121
|
|
|
121
122
|
return (
|
|
122
123
|
<>
|
|
123
|
-
<div className=
|
|
124
|
-
<div className=
|
|
125
|
-
<div className=
|
|
124
|
+
<div className={styles.grid}>
|
|
125
|
+
<div className={styles.grid__row}>
|
|
126
|
+
<div className={`${styles.grid__full} ${styles.crmtitle}`}>
|
|
126
127
|
<h1>
|
|
127
128
|
<Link
|
|
128
129
|
to={
|
|
@@ -156,9 +157,9 @@ const GenericSort = ({ category = false }) => {
|
|
|
156
157
|
</div>
|
|
157
158
|
</div>
|
|
158
159
|
</div>
|
|
159
|
-
<div className=
|
|
160
|
-
<div className=
|
|
161
|
-
<div className=
|
|
160
|
+
<div className={styles.grid}>
|
|
161
|
+
<div className={styles.grid__row}>
|
|
162
|
+
<div className={styles.grid__full}>
|
|
162
163
|
{category === false ? (
|
|
163
164
|
<SortableList
|
|
164
165
|
items={sortData}
|
|
@@ -38,16 +38,16 @@ const NotificationList = () => {
|
|
|
38
38
|
|
|
39
39
|
return (
|
|
40
40
|
<div>
|
|
41
|
-
<div className=
|
|
42
|
-
<div className=
|
|
43
|
-
<div className=
|
|
41
|
+
<div className={styles.grid}>
|
|
42
|
+
<div className={styles.grid__row}>
|
|
43
|
+
<div className={`${styles.grid__full} ${styles.crmtitle}`}>
|
|
44
44
|
<h1>Notifications</h1>
|
|
45
45
|
</div>
|
|
46
46
|
</div>
|
|
47
47
|
</div>
|
|
48
|
-
<div className=
|
|
49
|
-
<div className=
|
|
50
|
-
<div className=
|
|
48
|
+
<div className={styles.grid}>
|
|
49
|
+
<div className={styles.grid__row}>
|
|
50
|
+
<div className={styles.grid__full}>
|
|
51
51
|
<Table
|
|
52
52
|
ajaxSetting={ajaxSetting}
|
|
53
53
|
form={form}
|
|
@@ -0,0 +1,147 @@
|
|
|
1
|
+
.grid {
|
|
2
|
+
width: 100%;
|
|
3
|
+
display: flex;
|
|
4
|
+
align-items: flex-start;
|
|
5
|
+
flex-wrap: nowrap;
|
|
6
|
+
height: auto;
|
|
7
|
+
gap: 1rem;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.grid__row {
|
|
11
|
+
width: 100%;
|
|
12
|
+
display: flex;
|
|
13
|
+
align-items: flex-start;
|
|
14
|
+
flex-wrap: nowrap;
|
|
15
|
+
height: auto;
|
|
16
|
+
gap: 1rem;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.grid__subrow {
|
|
20
|
+
width: 100%;
|
|
21
|
+
display: flex;
|
|
22
|
+
flex-wrap: wrap;
|
|
23
|
+
height: auto;
|
|
24
|
+
gap: 0.5rem;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
.grid__full {
|
|
28
|
+
width: 100%;
|
|
29
|
+
background: var(--item-color);
|
|
30
|
+
border-radius: var(--br);
|
|
31
|
+
border: 1px solid rgba(var(--item-color-rgb), 1.15);
|
|
32
|
+
box-sizing: border-box;
|
|
33
|
+
overflow: visible;
|
|
34
|
+
position: relative;
|
|
35
|
+
padding: 2px;
|
|
36
|
+
margin: 8px 0;
|
|
37
|
+
box-shadow: 0 4px 0 rgba(var(--primary-color-rgb), 0.05);
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.crmtitle {
|
|
41
|
+
border: none;
|
|
42
|
+
min-height: auto;
|
|
43
|
+
padding: 5px 20px;
|
|
44
|
+
margin: 0;
|
|
45
|
+
background: var(--primary-color);
|
|
46
|
+
border-radius: var(--br);
|
|
47
|
+
border: 1px solid rgba(var(--item-color-rgb), 1.15);
|
|
48
|
+
position: relative;
|
|
49
|
+
display: flex;
|
|
50
|
+
align-items: center;
|
|
51
|
+
|
|
52
|
+
h1 {
|
|
53
|
+
color: var(--background-color);
|
|
54
|
+
font-weight: 700;
|
|
55
|
+
font-size: 1.15em;
|
|
56
|
+
margin: 0;
|
|
57
|
+
padding: 0.65rem 0;
|
|
58
|
+
display: flex;
|
|
59
|
+
align-items: center;
|
|
60
|
+
gap: 0.25rem;
|
|
61
|
+
|
|
62
|
+
a {
|
|
63
|
+
text-decoration: none;
|
|
64
|
+
color: var(--secondary-color);
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
svg {
|
|
68
|
+
color: rgba(var(--tertiary-color-rgb), 0.5);
|
|
69
|
+
position: relative;
|
|
70
|
+
top: 0;
|
|
71
|
+
margin: 0 0.5rem;
|
|
72
|
+
max-width: 15px;
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
.gridtxt__header {
|
|
78
|
+
width: 100%;
|
|
79
|
+
display: block;
|
|
80
|
+
background: rgba(var(--item-color-rgb), 1.05);
|
|
81
|
+
box-sizing: border-box;
|
|
82
|
+
padding: 10px 20px;
|
|
83
|
+
border-radius: 0;
|
|
84
|
+
margin-bottom: 0;
|
|
85
|
+
font-weight: 700;
|
|
86
|
+
text-align: center;
|
|
87
|
+
color: var(--paragraph-color);
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
.gridtxt__header span {
|
|
91
|
+
font-weight: 700;
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
.gridtxt > ul {
|
|
95
|
+
width: 100%;
|
|
96
|
+
display: flex;
|
|
97
|
+
justify-content: flex-start;
|
|
98
|
+
flex-direction: row;
|
|
99
|
+
flex-wrap: wrap;
|
|
100
|
+
list-style: none;
|
|
101
|
+
box-sizing: border-box;
|
|
102
|
+
padding: 0.85rem;
|
|
103
|
+
margin: 0;
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
.gridtxt > ul li {
|
|
107
|
+
flex: 0 0 calc(50% - 10px);
|
|
108
|
+
padding: 0.85rem;
|
|
109
|
+
box-sizing: border-box;
|
|
110
|
+
border: 1px solid rgba(var(--primary-color-rgb), 0.15);
|
|
111
|
+
color: var(--paragraph-color);
|
|
112
|
+
background: rgba(var(--tertiary-color-rgb), 0.95);
|
|
113
|
+
margin: 5px;
|
|
114
|
+
border-radius: var(--br);
|
|
115
|
+
line-height: 1.45;
|
|
116
|
+
}
|
|
117
|
+
|
|
118
|
+
.gridtxt > ul .fw-grid-item {
|
|
119
|
+
flex: 0 0 calc(100% - 10px);
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
.gridtxt > ul .notecolor {
|
|
123
|
+
border: 1px solid var(--secondary-color);
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
.customer__overview {
|
|
127
|
+
width: 100%;
|
|
128
|
+
display: flex;
|
|
129
|
+
justify-content: flex-start;
|
|
130
|
+
flex-direction: row;
|
|
131
|
+
flex-wrap: wrap;
|
|
132
|
+
list-style: none;
|
|
133
|
+
box-sizing: border-box;
|
|
134
|
+
padding: 1em;
|
|
135
|
+
margin: 0;
|
|
136
|
+
|
|
137
|
+
li {
|
|
138
|
+
width: 49%;
|
|
139
|
+
padding: 1em;
|
|
140
|
+
box-sizing: border-box;
|
|
141
|
+
border: 1px solid rgba(var(--primary-color-rgb), 0.15);
|
|
142
|
+
color: var(--paragraph-color);
|
|
143
|
+
background: rgba(#f4f4f4, 0.65);
|
|
144
|
+
margin: 5px;
|
|
145
|
+
border-radius: 5px;
|
|
146
|
+
}
|
|
147
|
+
}
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
.grid {
|
|
2
|
+
width: 100%;
|
|
3
|
+
display: flex;
|
|
4
|
+
align-items: flex-start;
|
|
5
|
+
flex-wrap: nowrap;
|
|
6
|
+
height: auto;
|
|
7
|
+
gap: 1rem;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.grid__row {
|
|
11
|
+
width: 100%;
|
|
12
|
+
display: flex;
|
|
13
|
+
align-items: flex-start;
|
|
14
|
+
flex-wrap: nowrap;
|
|
15
|
+
height: auto;
|
|
16
|
+
gap: 1rem;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.grid__full {
|
|
20
|
+
width: 100%;
|
|
21
|
+
background: var(--item-color);
|
|
22
|
+
border-radius: var(--br);
|
|
23
|
+
border: 1px solid rgba(var(--item-color-rgb), 1.15);
|
|
24
|
+
box-sizing: border-box;
|
|
25
|
+
overflow: visible;
|
|
26
|
+
position: relative;
|
|
27
|
+
padding: 2px;
|
|
28
|
+
margin: 8px 0;
|
|
29
|
+
box-shadow: 0 4px 0 rgba(var(--primary-color-rgb), 0.05);
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
.crmtitle {
|
|
33
|
+
border: none;
|
|
34
|
+
min-height: auto;
|
|
35
|
+
padding: 5px 20px;
|
|
36
|
+
margin: 0;
|
|
37
|
+
background: var(--primary-color);
|
|
38
|
+
border-radius: var(--br);
|
|
39
|
+
border: 1px solid rgba(var(--item-color-rgb), 1.15);
|
|
40
|
+
position: relative;
|
|
41
|
+
display: flex;
|
|
42
|
+
align-items: center;
|
|
43
|
+
|
|
44
|
+
h1 {
|
|
45
|
+
color: var(--background-color);
|
|
46
|
+
font-weight: 700;
|
|
47
|
+
font-size: 1.15em;
|
|
48
|
+
margin: 0;
|
|
49
|
+
padding: 0.65rem 0;
|
|
50
|
+
display: flex;
|
|
51
|
+
align-items: center;
|
|
52
|
+
gap: 0.25rem;
|
|
53
|
+
|
|
54
|
+
a {
|
|
55
|
+
text-decoration: none;
|
|
56
|
+
color: var(--secondary-color);
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
svg {
|
|
60
|
+
color: rgba(var(--tertiary-color-rgb), 0.5);
|
|
61
|
+
position: relative;
|
|
62
|
+
top: 0;
|
|
63
|
+
margin: 0 0.5rem;
|
|
64
|
+
max-width: 15px;
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
}
|