sccoreui 5.9.44 → 5.9.45
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/dist/App.scss
CHANGED
|
@@ -44,13 +44,19 @@
|
|
|
44
44
|
--fs-14: 14px;
|
|
45
45
|
--grey-bg: #101828;
|
|
46
46
|
--border-none: border-none;
|
|
47
|
+
--box-shadow-none: none;
|
|
47
48
|
}
|
|
48
49
|
|
|
50
|
+
|
|
51
|
+
|
|
49
52
|
// height and width utility classes
|
|
50
53
|
|
|
51
54
|
.h-40 {
|
|
52
55
|
height: 40px;
|
|
53
56
|
}
|
|
57
|
+
.h-44 {
|
|
58
|
+
height: 44px !important;
|
|
59
|
+
}
|
|
54
60
|
|
|
55
61
|
// @font-face {
|
|
56
62
|
// font-family: "Lato";
|
|
@@ -859,6 +865,34 @@ button[aria-expanded="true"] {
|
|
|
859
865
|
}
|
|
860
866
|
}
|
|
861
867
|
|
|
868
|
+
.sc_icon_hover {
|
|
869
|
+
&:hover {
|
|
870
|
+
svg {
|
|
871
|
+
transform: scale(1.1);
|
|
872
|
+
transition: 0.3s all;
|
|
873
|
+
}
|
|
874
|
+
}
|
|
875
|
+
}
|
|
876
|
+
|
|
877
|
+
|
|
878
|
+
.hide-focus {
|
|
879
|
+
&:not(.p-disabled) {
|
|
880
|
+
&.p-focus {
|
|
881
|
+
box-shadow: var(--box-shadow-none);
|
|
882
|
+
border: 1px solid var(--gray-300);
|
|
883
|
+
}
|
|
884
|
+
}
|
|
885
|
+
&:enabled {
|
|
886
|
+
&:focus {
|
|
887
|
+
box-shadow: var(--box-shadow-none);
|
|
888
|
+
border: 1px solid var(--gray-300);
|
|
889
|
+
|
|
890
|
+
}
|
|
891
|
+
}
|
|
892
|
+
}
|
|
893
|
+
|
|
894
|
+
|
|
895
|
+
|
|
862
896
|
.sc_multiSelect_panel {
|
|
863
897
|
.p-multiselect-items {
|
|
864
898
|
padding: 4px !important;
|
|
@@ -1946,6 +1980,9 @@ button[aria-expanded="true"] {
|
|
|
1946
1980
|
.w-25 {
|
|
1947
1981
|
width: 25%;
|
|
1948
1982
|
}
|
|
1983
|
+
.lh-44 {
|
|
1984
|
+
line-height: 44px;
|
|
1985
|
+
}
|
|
1949
1986
|
|
|
1950
1987
|
/* conditions */
|
|
1951
1988
|
.filter-dropdowns {
|
|
@@ -50,7 +50,7 @@ const Condtions = (props) => {
|
|
|
50
50
|
const dataType = (selectedColumn === null || selectedColumn === void 0 ? void 0 : selectedColumn.type) ? selectedColumn === null || selectedColumn === void 0 ? void 0 : selectedColumn.type : selectedColumn === null || selectedColumn === void 0 ? void 0 : selectedColumn.dataType;
|
|
51
51
|
switch (dataType === null || dataType === void 0 ? void 0 : dataType.toLowerCase()) {
|
|
52
52
|
case "string": {
|
|
53
|
-
return ((0, jsx_runtime_1.jsx)(inputtext_1.InputText, { disabled: !condition, className: "
|
|
53
|
+
return ((0, jsx_runtime_1.jsx)(inputtext_1.InputText, { disabled: !condition, className: "border-noround-left w-12rem mb-2 focus:shadow-none lh-44 h-44", value: value, placeholder: "Enter", onChange: (event) => handleDynamicFieldState(event.target.value) }));
|
|
54
54
|
}
|
|
55
55
|
case "integer": {
|
|
56
56
|
const handleOnchangeEvent = (eventValue) => {
|
|
@@ -100,7 +100,7 @@ const Condtions = (props) => {
|
|
|
100
100
|
// </div>
|
|
101
101
|
);
|
|
102
102
|
}
|
|
103
|
-
return ((0, jsx_runtime_1.jsx)(inputtext_1.InputText, { disabled: !condition, className: "border-noround-left w-12rem mb-2
|
|
103
|
+
return ((0, jsx_runtime_1.jsx)(inputtext_1.InputText, { disabled: !condition, className: "border-noround-left w-12rem mb-2 remove-focus", value: value, type: "number", placeholder: "Enter", onChange: (event) => { var _a; return handleDynamicFieldState((_a = event.target.value) === null || _a === void 0 ? void 0 : _a.replace("-", '')); } }));
|
|
104
104
|
}
|
|
105
105
|
case "single": {
|
|
106
106
|
// let optionValue = selectedColumn?.options.find((each: any) => each[selectedColumn['key']] === value)
|
|
@@ -143,6 +143,6 @@ const Condtions = (props) => {
|
|
|
143
143
|
return ((0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { className: "condtion-dropdown border-noround-left w-12rem mb-2 dropdown-focus-none", options: [], value: value, optionLabel: "name", placeholder: "Select", disabled: true }));
|
|
144
144
|
}
|
|
145
145
|
};
|
|
146
|
-
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex filter-dropdowns align-items-center" }, { children: [index !== 0 ? (0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { className: "condtion-dropdown w-5rem mb-2 mr-2
|
|
146
|
+
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex filter-dropdowns align-items-center" }, { children: [index !== 0 ? (0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { className: "condtion-dropdown w-5rem mb-2 mr-2 remove-focus", options: conditionTypes, optionLabel: "label", placeholder: "Select", value: conditionType, disabled: index !== 1, onChange: (event) => handleConditionType(event.target.value) }) : "", (0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { className: `condtion-dropdown dropdown-focus-none border-noround-right w-12rem mb-2`, options: columnsArray, optionLabel: "name", placeholder: "Select", value: columnName, onChange: (event) => onUpdateColumnName(event.value) }), (0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { className: "condition-type hide-focus border-noround mb-2 remove-focus border-x-none w-12rem", options: conditionsArray.filter((each) => each.datatypes.includes(columnName === null || columnName === void 0 ? void 0 : columnName.dataType)).map((option) => { return Object.assign(Object.assign({}, option), { name: option.name.toLowerCase().split(' ').map((word) => word.charAt(0).toUpperCase() + word.slice(1)).join(' ') }); }), value: condition, disabled: columnName === '', optionLabel: "name", placeholder: "Select", onChange: (event) => onUpdateCondition(event.value), panelClassName: "w-15rem" }), renderDynamicField(columnName), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex ml-1 gap-1 px-2" }, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ text: true, className: "mb-2 focus:shadow-none p-1 sc_icon_hover", onClick: () => onAddCondtion(index), disabled: false }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "plus-circle", size: 20, color: "text-gray-500" }) })), (0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ text: true, disabled: condtionslenght === 1, className: "mb-2 focus:shadow-none p-1 sc_icon_hover", onClick: () => onRemoveCondtion(id) }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "minus-circle", size: 20, color: "text-gray-500" }) }))] }))] })));
|
|
147
147
|
};
|
|
148
148
|
exports.default = Condtions;
|
|
@@ -36,8 +36,8 @@ const TableFilter = () => {
|
|
|
36
36
|
};
|
|
37
37
|
const applyAdvancedFilter = (array) => {
|
|
38
38
|
const allQueries = array.map((query) => {
|
|
39
|
-
const column = {
|
|
40
|
-
const operation =
|
|
39
|
+
const column = { code: query.columnName.code };
|
|
40
|
+
const operation = query.condition;
|
|
41
41
|
let queryToAdd = {
|
|
42
42
|
selectedColumn: column,
|
|
43
43
|
selectedOperation: operation,
|
|
@@ -135,7 +135,7 @@ const TableFilter = () => {
|
|
|
135
135
|
: "bg-white"}` }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ onClick: (e) => onClickFilter(e) }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "filter-lines", size: 20, color: isOverlayOpened ||
|
|
136
136
|
(globalFilters === null || globalFilters === void 0 ? void 0 : globalFilters.filter((each) => each.isActive).length) >= 1
|
|
137
137
|
? "#243DC6"
|
|
138
|
-
: "#667085" }) })), (globalFilters === null || globalFilters === void 0 ? void 0 : globalFilters.filter((each) => each.isActive).length) >= 1 && ((0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "flex gap-2 align-items-center text-primary-400" }, { children: [`${globalFilters === null || globalFilters === void 0 ? void 0 : globalFilters.filter((each) => each.isActive).length} Selected`, (0, jsx_runtime_1.jsx)("span", Object.assign({ onClick: onresetFilter }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "x-close", size: 18, color: "#243DC6" }) }))] })))] })), (0, jsx_runtime_1.jsx)(overlaypanel_1.OverlayPanel, Object.assign({ ref: showFilter, onShow: () => setIsOverlayOpened(true), onHide: filterLogoToggle, className: "table-filter-overlay" }, { children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-4" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "text-lg font-semibold line-height-3 text-gray-900" }, { children: "Filters" })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "text-sm text-gray-600" }, { children: "
|
|
138
|
+
: "#667085" }) })), (globalFilters === null || globalFilters === void 0 ? void 0 : globalFilters.filter((each) => each.isActive).length) >= 1 && ((0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "flex gap-2 align-items-center text-primary-400" }, { children: [`${globalFilters === null || globalFilters === void 0 ? void 0 : globalFilters.filter((each) => each.isActive).length} Selected`, (0, jsx_runtime_1.jsx)("span", Object.assign({ onClick: onresetFilter }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "x-close", size: 18, color: "#243DC6" }) }))] })))] })), (0, jsx_runtime_1.jsx)(overlaypanel_1.OverlayPanel, Object.assign({ ref: showFilter, onShow: () => setIsOverlayOpened(true), onHide: filterLogoToggle, className: "table-filter-overlay" }, { children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-4" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "text-lg font-semibold line-height-3 text-gray-900" }, { children: "Filters" })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "text-sm text-gray-600" }, { children: "Specify your search parameters." }))] })), (0, jsx_runtime_1.jsx)(divider_1.Divider, { className: "w-full p-0 m-0" }), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "p-4 pr-0" }, { children: (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "max-h-14rem\toverflow-auto" }, { children: conditionsArray.map((eachCondition, index) => {
|
|
139
139
|
return ((0, jsx_runtime_1.jsx)("div", { children: renderCondtion(eachCondition, index) }, index));
|
|
140
140
|
}) })) })), (0, jsx_runtime_1.jsx)(divider_1.Divider, { className: "w-full p-0 m-0" }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-4 flex justify-content-between" }, { children: [(0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(button_1.Button, { text: true, className: "focus:shadow-none", label: "Reset Filter", onClick: onresetFilter }) }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center" }, { children: [!displayInput && enableViewCreate && ((0, jsx_runtime_1.jsx)(button_1.Button, { className: "text-base px-2 font-semibold text-primary-400 flex gap-2 p-1 focus:shadow-none mr-3", label: "Create View", onClick: () => setDisplayInput(true), disabled: !allFieldsFilled, text: true, iconPos: "left", icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "plus", color: "text-primary-400 mr-2" }) })), displayInput && ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-input-icon-left p-input-icon-right w-full" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: `p-input-suffix` }, { children: [displayInput && ((0, jsx_runtime_1.jsx)(button_1.Button, { onClick: createViewFromFilters, disabled: !viewName.length, className: "p-0 h-auto", text: true, icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "check" }) })), (0, jsx_runtime_1.jsx)(button_1.Button, { onClick: () => setViewName(""), className: "p-0 h-auto", disabled: !viewName.length, text: true, icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "x-close" }) })] })), (0, jsx_runtime_1.jsx)(inputtext_1.InputText, { placeholder: "Enter", value: viewName, onChange: (e) => setViewName(e.target.value), className: "text-lg font-normal text-gray-500 hover:text-gray-900 w-full px-3 mr-3" })] }))), (0, jsx_runtime_1.jsx)(button_1.Button, { className: "text-base font-semibold text-gray-600 p-1 focus:shadow-none text-white w-4rem", label: "Apply", onClick: onApplyFilter, disabled: !allFieldsFilled })] }))] }))] }) }))] }));
|
|
141
141
|
};
|