mario-education 2.4.60-admin → 2.4.62-admin
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/MarioFramework.Education/ClientApp/src/containers/Dashboard/components/LearningStrategiesTable.d.ts +3 -1
- package/dist/index.css +1 -0
- package/dist/index.js +31 -120
- package/dist/index.js.map +1 -1
- package/dist/index.modern.js +31 -120
- package/dist/index.modern.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
+
import { DashboardFilter } from "../configs/types";
|
|
2
3
|
interface PropsType {
|
|
3
4
|
isOpen: boolean;
|
|
4
5
|
onClosed: () => void;
|
|
@@ -6,6 +7,7 @@ interface PropsType {
|
|
|
6
7
|
data: any;
|
|
7
8
|
getData: () => void;
|
|
8
9
|
changeFilter: (updatedFilter: any) => void;
|
|
10
|
+
filterDashboard: DashboardFilter;
|
|
9
11
|
}
|
|
10
|
-
declare const LearningStrategiesTable: ({ isOpen, onClosed, filter, data, getData, changeFilter }: PropsType) => JSX.Element;
|
|
12
|
+
declare const LearningStrategiesTable: ({ isOpen, onClosed, filter, data, getData, changeFilter, filterDashboard }: PropsType) => JSX.Element;
|
|
11
13
|
export default LearningStrategiesTable;
|
package/dist/index.css
CHANGED
package/dist/index.js
CHANGED
|
@@ -26774,23 +26774,27 @@ var ColumnChartAndPercent = function ColumnChartAndPercent(_ref) {
|
|
|
26774
26774
|
})), !isPDF && React__default.createElement("div", {
|
|
26775
26775
|
className: "w-100 d-flex gap-2 flex-wrap " + styles$1["listItem"]
|
|
26776
26776
|
}, data.map(function (month, index) {
|
|
26777
|
-
|
|
26778
|
-
|
|
26779
|
-
|
|
26780
|
-
|
|
26781
|
-
|
|
26782
|
-
|
|
26783
|
-
|
|
26784
|
-
|
|
26785
|
-
|
|
26786
|
-
|
|
26787
|
-
|
|
26788
|
-
|
|
26789
|
-
|
|
26790
|
-
|
|
26791
|
-
|
|
26792
|
-
|
|
26793
|
-
|
|
26777
|
+
if (!!avg && avg[index] > 0) {
|
|
26778
|
+
return React__default.createElement("div", {
|
|
26779
|
+
className: "" + styles$1["item-legend"],
|
|
26780
|
+
key: index
|
|
26781
|
+
}, React__default.createElement("div", {
|
|
26782
|
+
className: "" + styles$1["item"]
|
|
26783
|
+
}, React__default.createElement("div", {
|
|
26784
|
+
className: "" + styles$1["mark-custom"],
|
|
26785
|
+
style: {
|
|
26786
|
+
backgroundColor: COLOR_CHART_AND_PERCENTS[index]
|
|
26787
|
+
}
|
|
26788
|
+
}), React__default.createElement("label", {
|
|
26789
|
+
className: "" + styles$1["label-legend-custom"]
|
|
26790
|
+
}, month)), React__default.createElement("div", {
|
|
26791
|
+
className: "" + styles$1["percent"]
|
|
26792
|
+
}, React__default.createElement("label", {
|
|
26793
|
+
className: "m-0"
|
|
26794
|
+
}, avg[index] ? avg[index].toFixed(2) + "%" : "0.00%")));
|
|
26795
|
+
}
|
|
26796
|
+
|
|
26797
|
+
return null;
|
|
26794
26798
|
})));
|
|
26795
26799
|
};
|
|
26796
26800
|
|
|
@@ -27125,9 +27129,7 @@ var useDashboard = function useDashboard() {
|
|
|
27125
27129
|
currentPage: 1,
|
|
27126
27130
|
pageSize: 10,
|
|
27127
27131
|
sortBy: "Strategies",
|
|
27128
|
-
sortOrder: "ASC"
|
|
27129
|
-
startDate: DEFAULT_START_DATE,
|
|
27130
|
-
endDate: DEFAULT_END_DATE
|
|
27132
|
+
sortOrder: "ASC"
|
|
27131
27133
|
}),
|
|
27132
27134
|
filterLearningStrategiesTable = _useState4[0],
|
|
27133
27135
|
setFilterLearningStrategiesTable = _useState4[1];
|
|
@@ -27136,7 +27138,7 @@ var useDashboard = function useDashboard() {
|
|
|
27136
27138
|
setFilterLearningStrategiesTable(_extends({}, filterLearningStrategiesTable, updatedFilter));
|
|
27137
27139
|
};
|
|
27138
27140
|
|
|
27139
|
-
var getLearningStrategiesTableData = function
|
|
27141
|
+
var getLearningStrategiesTableData = React.useCallback(function () {
|
|
27140
27142
|
try {
|
|
27141
27143
|
var _temp3 = function _temp3() {
|
|
27142
27144
|
dispatch(marioCore.setLoading(false));
|
|
@@ -27145,7 +27147,7 @@ var useDashboard = function useDashboard() {
|
|
|
27145
27147
|
dispatch(marioCore.setLoading(true));
|
|
27146
27148
|
|
|
27147
27149
|
var _temp4 = _catch(function () {
|
|
27148
|
-
return Promise.resolve(getLearningStrategiesTableApi(filterLearningStrategiesTable)).then(function (res) {
|
|
27150
|
+
return Promise.resolve(getLearningStrategiesTableApi(_extends({}, filter, filterLearningStrategiesTable))).then(function (res) {
|
|
27149
27151
|
!!res.data && setLearningStrategiesData(res.data);
|
|
27150
27152
|
});
|
|
27151
27153
|
}, function (err) {
|
|
@@ -27161,7 +27163,7 @@ var useDashboard = function useDashboard() {
|
|
|
27161
27163
|
} catch (e) {
|
|
27162
27164
|
return Promise.reject(e);
|
|
27163
27165
|
}
|
|
27164
|
-
};
|
|
27166
|
+
}, [filter, filterLearningStrategiesTable]);
|
|
27165
27167
|
|
|
27166
27168
|
var _useState5 = React.useState(INITIAl_STUDENT_DASHBOARD),
|
|
27167
27169
|
listTotalTime = _useState5[0],
|
|
@@ -29417,8 +29419,6 @@ var DashboardToPDF = function DashboardToPDF(props) {
|
|
|
29417
29419
|
}, "Export"));
|
|
29418
29420
|
};
|
|
29419
29421
|
|
|
29420
|
-
var ICON_CALENDAR = "/images/calendar.svg";
|
|
29421
|
-
|
|
29422
29422
|
var LearningStrategiesTable = function LearningStrategiesTable(_ref) {
|
|
29423
29423
|
var _data$items;
|
|
29424
29424
|
|
|
@@ -29427,60 +29427,11 @@ var LearningStrategiesTable = function LearningStrategiesTable(_ref) {
|
|
|
29427
29427
|
filter = _ref.filter,
|
|
29428
29428
|
data = _ref.data,
|
|
29429
29429
|
getData = _ref.getData,
|
|
29430
|
-
changeFilter = _ref.changeFilter
|
|
29431
|
-
|
|
29432
|
-
var refEndDate = React.useRef(null);
|
|
29433
|
-
|
|
29434
|
-
var _useState = React.useState(false),
|
|
29435
|
-
isOpenCollapseStartDate = _useState[0],
|
|
29436
|
-
setIsOpenCollapseStartDate = _useState[1];
|
|
29437
|
-
|
|
29438
|
-
var _useState2 = React.useState(false),
|
|
29439
|
-
isOpenCollapseEndDate = _useState2[0],
|
|
29440
|
-
setIsOpenCollapseEndDate = _useState2[1];
|
|
29441
|
-
|
|
29442
|
-
var handleToggleCollapseStartDate = function handleToggleCollapseStartDate() {
|
|
29443
|
-
setIsOpenCollapseStartDate(!isOpenCollapseStartDate);
|
|
29444
|
-
};
|
|
29445
|
-
|
|
29446
|
-
var handleToggleCollapseEndDate = function handleToggleCollapseEndDate() {
|
|
29447
|
-
setIsOpenCollapseEndDate(!isOpenCollapseEndDate);
|
|
29448
|
-
};
|
|
29449
|
-
|
|
29450
|
-
var handleClickOutSideStartDate = function handleClickOutSideStartDate(event) {
|
|
29451
|
-
var _refStartDate$current;
|
|
29452
|
-
|
|
29453
|
-
if (refStartDate.current && !(refStartDate !== null && refStartDate !== void 0 && (_refStartDate$current = refStartDate.current) !== null && _refStartDate$current !== void 0 && _refStartDate$current.contains(event.target))) setIsOpenCollapseStartDate(false);
|
|
29454
|
-
};
|
|
29455
|
-
|
|
29456
|
-
var handleClickOutSideEndDate = function handleClickOutSideEndDate(event) {
|
|
29457
|
-
var _refEndDate$current;
|
|
29458
|
-
|
|
29459
|
-
if (refEndDate.current && !(refEndDate !== null && refEndDate !== void 0 && (_refEndDate$current = refEndDate.current) !== null && _refEndDate$current !== void 0 && _refEndDate$current.contains(event.target))) setIsOpenCollapseEndDate(false);
|
|
29460
|
-
};
|
|
29461
|
-
|
|
29462
|
-
React.useEffect(function () {
|
|
29463
|
-
document.addEventListener("click", handleClickOutSideStartDate, true);
|
|
29464
|
-
document.addEventListener("click", handleClickOutSideEndDate, true);
|
|
29465
|
-
}, []);
|
|
29466
|
-
|
|
29467
|
-
var handleChangeStartDate = function handleChangeStartDate(date) {
|
|
29468
|
-
!!changeFilter && changeFilter({
|
|
29469
|
-
startDate: moment(date).startOf("day").valueOf()
|
|
29470
|
-
});
|
|
29471
|
-
setIsOpenCollapseStartDate(false);
|
|
29472
|
-
};
|
|
29473
|
-
|
|
29474
|
-
var handleChangeEndDate = function handleChangeEndDate(date) {
|
|
29475
|
-
!!changeFilter && changeFilter({
|
|
29476
|
-
endDate: moment(date).endOf("day").valueOf()
|
|
29477
|
-
});
|
|
29478
|
-
setIsOpenCollapseEndDate(false);
|
|
29479
|
-
};
|
|
29480
|
-
|
|
29430
|
+
changeFilter = _ref.changeFilter,
|
|
29431
|
+
filterDashboard = _ref.filterDashboard;
|
|
29481
29432
|
React.useEffect(function () {
|
|
29482
29433
|
getData === null || getData === void 0 ? void 0 : getData();
|
|
29483
|
-
}, [filter]);
|
|
29434
|
+
}, [filter, filterDashboard]);
|
|
29484
29435
|
return React__default.createElement(reactstrap.Modal, {
|
|
29485
29436
|
isOpen: isOpen,
|
|
29486
29437
|
toggle: onClosed,
|
|
@@ -29488,45 +29439,6 @@ var LearningStrategiesTable = function LearningStrategiesTable(_ref) {
|
|
|
29488
29439
|
}, React__default.createElement(reactstrap.ModalHeader, null, "Learning Strategies"), React__default.createElement(reactstrap.ModalBody, null, React__default.createElement("div", {
|
|
29489
29440
|
className: "" + styles["filter-box-learning"]
|
|
29490
29441
|
}, React__default.createElement("div", {
|
|
29491
|
-
className: "" + styles["block-filter-component"],
|
|
29492
|
-
ref: refStartDate
|
|
29493
|
-
}, React__default.createElement("button", {
|
|
29494
|
-
onClick: handleToggleCollapseStartDate,
|
|
29495
|
-
className: styles["btn-filter"] + " d-flex align-items-center cursor-pointer"
|
|
29496
|
-
}, React__default.createElement("img", {
|
|
29497
|
-
src: "" + ICON_CALENDAR
|
|
29498
|
-
}), React__default.createElement("p", {
|
|
29499
|
-
className: styles["color-filter"] + " my-0 mx-2"
|
|
29500
|
-
}, "Start Date", !!(filter !== null && filter !== void 0 && filter.startDate) && ": " + moment(filter === null || filter === void 0 ? void 0 : filter.startDate).format("DD/MM/YYYY"))), isOpenCollapseStartDate && React__default.createElement("div", {
|
|
29501
|
-
className: "" + styles["date-picker"]
|
|
29502
|
-
}, React__default.createElement(DatePicker, {
|
|
29503
|
-
selected: moment(filter === null || filter === void 0 ? void 0 : filter.startDate).toDate(),
|
|
29504
|
-
onChange: function onChange(date) {
|
|
29505
|
-
return handleChangeStartDate(date);
|
|
29506
|
-
},
|
|
29507
|
-
inline: true,
|
|
29508
|
-
maxDate: moment(filter === null || filter === void 0 ? void 0 : filter.endDate).toDate()
|
|
29509
|
-
}))), React__default.createElement("div", {
|
|
29510
|
-
className: "" + styles["block-filter-component"],
|
|
29511
|
-
ref: refEndDate
|
|
29512
|
-
}, React__default.createElement("button", {
|
|
29513
|
-
onClick: handleToggleCollapseEndDate,
|
|
29514
|
-
className: styles["btn-filter"] + " d-flex align-items-center cursor-pointer"
|
|
29515
|
-
}, React__default.createElement("img", {
|
|
29516
|
-
src: "" + ICON_CALENDAR
|
|
29517
|
-
}), React__default.createElement("p", {
|
|
29518
|
-
className: styles["color-filter"] + " my-0 mx-2"
|
|
29519
|
-
}, "End Date", !!(filter !== null && filter !== void 0 && filter.endDate) && ": " + moment(filter === null || filter === void 0 ? void 0 : filter.endDate).format("DD/MM/YYYY"))), isOpenCollapseEndDate && React__default.createElement("div", {
|
|
29520
|
-
className: "" + styles["date-picker"]
|
|
29521
|
-
}, React__default.createElement(DatePicker, {
|
|
29522
|
-
selected: moment(filter === null || filter === void 0 ? void 0 : filter.endDate).toDate(),
|
|
29523
|
-
onChange: function onChange(date) {
|
|
29524
|
-
return handleChangeEndDate(date);
|
|
29525
|
-
},
|
|
29526
|
-
inline: true,
|
|
29527
|
-
maxDate: moment(filter === null || filter === void 0 ? void 0 : filter.startDate).add(3, "months").toDate(),
|
|
29528
|
-
minDate: moment(filter === null || filter === void 0 ? void 0 : filter.startDate).toDate()
|
|
29529
|
-
}))), React__default.createElement("div", {
|
|
29530
29442
|
className: "" + styles["search-box-learning"]
|
|
29531
29443
|
}, React__default.createElement(marioCore.SearchBox, {
|
|
29532
29444
|
initValue: filter.searchString,
|
|
@@ -29555,16 +29467,14 @@ var LearningStrategiesTable = function LearningStrategiesTable(_ref) {
|
|
|
29555
29467
|
position: "sticky",
|
|
29556
29468
|
backgroundColor: "#fff"
|
|
29557
29469
|
}
|
|
29558
|
-
}, React__default.createElement("th", null, "Strategies"), React__default.createElement("th", null, "Number Of Used")
|
|
29470
|
+
}, React__default.createElement("th", null, "Strategies"), React__default.createElement("th", null, "Number Of Used"))), React__default.createElement("tbody", null, data === null || data === void 0 ? void 0 : (_data$items = data.items) === null || _data$items === void 0 ? void 0 : _data$items.map(function (item, index) {
|
|
29559
29471
|
return React__default.createElement("tr", {
|
|
29560
29472
|
key: index
|
|
29561
29473
|
}, React__default.createElement("td", {
|
|
29562
29474
|
className: "align-middle"
|
|
29563
29475
|
}, item === null || item === void 0 ? void 0 : item.strategiesName), React__default.createElement("td", {
|
|
29564
29476
|
className: "align-middle"
|
|
29565
|
-
}, item === null || item === void 0 ? void 0 : item.numberOfUsed)
|
|
29566
|
-
className: "align-middle"
|
|
29567
|
-
}, item === null || item === void 0 ? void 0 : item.sessionType));
|
|
29477
|
+
}, item === null || item === void 0 ? void 0 : item.numberOfUsed));
|
|
29568
29478
|
})))), React__default.createElement(marioCore.CustomPagination, {
|
|
29569
29479
|
filters: filter,
|
|
29570
29480
|
totalRecordCount: data === null || data === void 0 ? void 0 : data.totalItems,
|
|
@@ -29777,6 +29687,7 @@ var Dashboard = function Dashboard() {
|
|
|
29777
29687
|
isOpen: openLearningStrategiesTable,
|
|
29778
29688
|
onClosed: handleOpenCloseLearningStrategiesTable,
|
|
29779
29689
|
filter: filterLearningStrategiesTable,
|
|
29690
|
+
filterDashboard: filter,
|
|
29780
29691
|
data: learningStrategiesData,
|
|
29781
29692
|
getData: getLearningStrategiesTableData,
|
|
29782
29693
|
changeFilter: changeFiltersLearningStrategiesTable
|