mario-education 2.4.150-level → 2.4.151-level

package/dist/MarioFramework.Education/ClientApp/src/containers/Dashboard/components/GenerateChartData.d.ts

@@ -1,4 +1,4 @@
-import { FC } from "react";
+import React from "react";
 import { IGenerateChart } from "../configs/types";
-declare const GenerateChartData: FC<IGenerateChart>;
-export default GenerateChartData;
+declare const _default: React.NamedExoticComponent<IGenerateChart>;
+export default _default;

package/dist/index.css

@@ -1173,6 +1173,60 @@ h6._3zOGW {
 
 ._3Eas5 {
   max-height: 430px;
+}
+
+._1tKnn{
+  display: none;
+}
+
+@media (max-width: 374px) {
+  ._CHu-i {
+    font-size: 18px;
+  }
+  ._CHu-i + img {
+    width: 36px;
+    height: 36px;
+  }
+}
+
+@media (max-width: 576px) {
+  ._10Pgm{
+    padding: 0 10px;
+  }
+
+  ._1tKnn{
+    display: block;
+    background: #ffffff;
+    border: 1px solid #ebeff2;
+    box-shadow: 6px 0px 18px rgba(0, 0, 0, 0.06);
+    border-radius: 8px;
+  }
+
+  ._1Zuq3{
+    gap: 6px;
+  }
+
+  ._2Hdbu {
+    gap: 8px;
+  }
+
+  ._3dK0P {
+    max-width: 150px;
+  }
+
+  ._348ls {
+    align-items: baseline;
+  }
+}
+
+@media (min-width: 577px) and (max-width: 992px){
+  ._1i0El {
+    gap: 8px;
+  }
+  
+  ._2Hdbu {
+    gap: 8px;
+  }
 }
 ._3U9cF {
   padding: 16px;
@@ -2020,6 +2074,35 @@ h6._3zOGW {
   ._4SQcs{
     gap: 8px;
   }
+
+  ._5wSJP{
+    padding-right: 6px;
+    width: 100%;
+    max-width: 130px;
+    align-items: start;
+  }
+
+  ._5wSJP label {
+    display: flex;
+    align-items: center;
+  }
+
+  ._n_lnI{
+    padding-right: 6px;
+    width: 100%;
+    max-width: 130px;
+  }
+
+  ._n_lnI > ._27ojF{
+    justify-content: start;
+    align-items: baseline;
+  }
+
+  ._n_lnI label {
+    display: flex;
+    align-items: center;
+  }
+  
 }
 
 @media (min-width: 577px) and (max-width: 768px) {
@@ -2045,6 +2128,31 @@ h6._3zOGW {
     gap: 20px;
   }
 } 
+
+@media (min-width: 577px) and (max-width: 1023px) {
+  ._5wSJP{
+    padding-right: 0;
+    width: 100%;
+    max-width: 180px;
+  }
+  ._5wSJP label {
+    display: flex;
+    align-items: center;
+  }
+  ._n_lnI{
+    padding-right: 0;
+    width: 100%;
+    max-width: 130px;
+  }
+  ._n_lnI > ._27ojF{
+    justify-content: start;
+  }
+  ._n_lnI label {
+    display: flex;
+    align-items: center;
+  }
+}
+
 @media (min-width: 2100px) {
   ._2MTrM{
     gap: 50px;

package/dist/index.js

@@ -22504,7 +22504,7 @@ var TYPECHART;
   TYPECHART[TYPECHART["DONUT"] = 4] = "DONUT";
 })(TYPECHART || (TYPECHART = {}));
 
-var styles$1 = {"dashboard-card":"_1Jgr2","quantity-table":"_3Thdy","size-icon":"_1WLBo","block-dashboard":"_10Pgm","size-arrow":"_3jPb_","color-down":"_1c43y","color-up":"_F1afY","box-filter":"_1kqUQ","title-card":"_10hbz","value-card":"_2rmw_","deviant-card":"_1tdQu","filter-card":"_2BvFN","box-skill-item":"_2TBTW","numerical-order":"_3XXJp","backoround-top-skill":"_LCuWQ","color-filter":"_3x9D7","btn-filter":"_2In63","block-collapse":"_1Vhg_","form-date-picker":"_6yLxd","bock-filter-left":"_h74SO","bock-filter-right":"_3e2pi","form-filter-right":"_ntUB6","form-filter-left":"_1DlZ4","bock-filter-wrap":"_1tYDM","title-card-box":"_3hSow","box-item":"_1yuC9","image-no-data":"_2PMoX","image-grade":"_3ZX0b","chart-data":"_2asi-","apexcharts-datalabels":"_muT01","apexcharts-pie-label":"_35BzZ","image-custom":"_3pkbc","image-special-need":"_16MpB","title-dashboard":"_CHu-i","box-chart":"_3Y-Dd","block-filter-right":"_1YJnk","shadow-lg":"_2eMbe","chart-header-wrapper":"_6ZvFg","devide-component":"_24CNV","header-chart":"_2vtSi","header-left":"_IpsVf","icon-chart":"_gzxWe","header-right":"_37IcR","header-title":"_2G6Wz","button-export":"_3xpNv","button-content":"_3H5Ly","button-icon":"_J_n-D","icon-config":"_3AALV","cursor-pointer":"_11Xjn","btn-show-chart":"_2htKu","rotate-180":"_q1nUO","header-chart-generate":"_s8xMf","block-header-chart":"_tHUJ_","name-chart":"_3xKHX","title-chart":"_pFFg9","description-chart":"_3hqV3","title-chart-generate":"_3rdqX","expand-icon":"_nwv00","custom-tooltip":"_29aQo","custom-tooltip-month":"_2SJIY","tooltip-data-cursor":"_2lZv_","tooltip-data-box":"_8NzTd","tooltip-data":"_1EP1I","name":"_1J69a","data":"_3-8OW","checkbox-chart":"_1qXAT","column-chart-percent":"_3NgrB","chart-background":"_32fu3","custom-marker":"_DmMzw","mark-custom":"_1eUXn","item-legend":"_3hrrC","label-legend-custom":"_Q-iiW","mark-legend":"_cD4ey","percent":"_2HWhv","listItem":"_2Hdbu","item":"_3RJ2T","item-checkbox":"_3dK0P","box-checkbox":"_1bHgZ","check-box":"_QwDVv","item-detail":"_1QgWc","question":"_348ls","avr-question":"_1VfnR","volatility":"_3eW34","arr":"_1bljF","month-text":"_30y0h","arrow":"_1HtM3","arrow-up":"_3qqQU","percent-text":"_2Fgfn","arrow-down":"_1yXO7","point-custom":"_2JNm-","student-by-age":"_38ikt","total-student":"_1TnWs","pie-chart":"_3BTJi","options-gender":"_1Ws0m","legend":"_2HnO_","text-lengend":"_2BFJw","student-by-grade":"_2az-l","bubble-chart-custom":"_2j8fp","x-axis-custom-wrap":"_1BN5z","axis-content":"_1rYav","legend-wrap":"_3-zAs","label-chart":"_24PRg","list-percent":"_1PPhv","percent-item":"_1rjWR","chart-custom":"_f-Ti4","title-grade":"_1hZ_V","title-modal":"_3L9WC","header-desc-modal":"_1TFtP","form-checkbox":"_37aqf","checkbox-content":"_1iabV","btn-export":"_1eQAg","image-logo":"_1eqkj","chart-to-canvas":"_2IQ8b","chart-pdf":"_sQ21k","box-top-5-most":"_3Eas5"};
+var styles$1 = {"dashboard-card":"_1Jgr2","quantity-table":"_3Thdy","size-icon":"_1WLBo","block-dashboard":"_10Pgm","size-arrow":"_3jPb_","color-down":"_1c43y","color-up":"_F1afY","box-filter":"_1kqUQ","title-card":"_10hbz","value-card":"_2rmw_","deviant-card":"_1tdQu","filter-card":"_2BvFN","box-skill-item":"_2TBTW","numerical-order":"_3XXJp","backoround-top-skill":"_LCuWQ","color-filter":"_3x9D7","btn-filter":"_2In63","block-collapse":"_1Vhg_","form-date-picker":"_6yLxd","bock-filter-left":"_h74SO","bock-filter-right":"_3e2pi","form-filter-right":"_ntUB6","form-filter-left":"_1DlZ4","bock-filter-wrap":"_1tYDM","title-card-box":"_3hSow","box-item":"_1yuC9","image-no-data":"_2PMoX","image-grade":"_3ZX0b","chart-data":"_2asi-","apexcharts-datalabels":"_muT01","apexcharts-pie-label":"_35BzZ","image-custom":"_3pkbc","image-special-need":"_16MpB","title-dashboard":"_CHu-i","box-chart":"_3Y-Dd","block-filter-right":"_1YJnk","shadow-lg":"_2eMbe","chart-header-wrapper":"_6ZvFg","devide-component":"_24CNV","header-chart":"_2vtSi","header-left":"_IpsVf","icon-chart":"_gzxWe","header-right":"_37IcR","header-title":"_2G6Wz","button-export":"_3xpNv","button-content":"_3H5Ly","button-icon":"_J_n-D","icon-config":"_3AALV","cursor-pointer":"_11Xjn","btn-show-chart":"_2htKu","rotate-180":"_q1nUO","header-chart-generate":"_s8xMf","block-header-chart":"_tHUJ_","name-chart":"_3xKHX","title-chart":"_pFFg9","description-chart":"_3hqV3","title-chart-generate":"_3rdqX","expand-icon":"_nwv00","custom-tooltip":"_29aQo","custom-tooltip-month":"_2SJIY","tooltip-data-cursor":"_2lZv_","tooltip-data-box":"_8NzTd","tooltip-data":"_1EP1I","name":"_1J69a","data":"_3-8OW","checkbox-chart":"_1qXAT","column-chart-percent":"_3NgrB","chart-background":"_32fu3","custom-marker":"_DmMzw","mark-custom":"_1eUXn","item-legend":"_3hrrC","label-legend-custom":"_Q-iiW","mark-legend":"_cD4ey","percent":"_2HWhv","listItem":"_2Hdbu","item":"_3RJ2T","item-checkbox":"_3dK0P","box-checkbox":"_1bHgZ","check-box":"_QwDVv","item-detail":"_1QgWc","question":"_348ls","avr-question":"_1VfnR","volatility":"_3eW34","arr":"_1bljF","month-text":"_30y0h","arrow":"_1HtM3","arrow-up":"_3qqQU","percent-text":"_2Fgfn","arrow-down":"_1yXO7","point-custom":"_2JNm-","student-by-age":"_38ikt","total-student":"_1TnWs","pie-chart":"_3BTJi","options-gender":"_1Ws0m","legend":"_2HnO_","text-lengend":"_2BFJw","student-by-grade":"_2az-l","bubble-chart-custom":"_2j8fp","x-axis-custom-wrap":"_1BN5z","axis-content":"_1rYav","legend-wrap":"_3-zAs","label-chart":"_24PRg","list-percent":"_1PPhv","percent-item":"_1rjWR","chart-custom":"_f-Ti4","title-grade":"_1hZ_V","title-modal":"_3L9WC","header-desc-modal":"_1TFtP","form-checkbox":"_37aqf","checkbox-content":"_1iabV","btn-export":"_1eQAg","image-logo":"_1eqkj","chart-to-canvas":"_2IQ8b","chart-pdf":"_sQ21k","box-top-5-most":"_3Eas5","filter-mobile-block":"_1tKnn","filter-wrapper-mobile":"_1Zuq3","total-card-wrapper":"_1i0El"};
 
 var CheckboxCustom = function CheckboxCustom(_ref) {
   var _ref$background = _ref.background,
@@ -30533,7 +30533,7 @@ var TotalCard = function TotalCard(_ref) {
       title = _ref.title,
       value = _ref.value;
   return React__default.createElement("div", {
-    className: styles$1["title-card-box"] + " " + styles$1["box-item"] + " p-4 mb-2 shadow-md"
+    className: styles$1["title-card-box"] + " " + styles$1["box-item"] + " p-4 mb-2 mb-sm-0 mb-lg-2 shadow-md"
   }, React__default.createElement("div", {
     className: "d-flex align-items-center justify-content-center"
   }, React__default.createElement("img", {
@@ -30781,6 +30781,12 @@ var GenerateChartData = function GenerateChartData(_ref) {
   })));
 };
 
+var chartPropsAreEqual = function chartPropsAreEqual(prevMovie, nextMovie) {
+  return prevMovie === nextMovie;
+};
+
+var GenerateChartData$1 = React__default.memo(GenerateChartData, chartPropsAreEqual);
+
 var Loading = function Loading() {
   return React__default.createElement("div", {
     className: "d-flex align-items-center justify-content-center"
@@ -31496,7 +31502,7 @@ var DashboardToPDF = function DashboardToPDF(props) {
       display: "block",
       width: "45%"
     }
-  }, React__default.createElement(GenerateChartData, {
+  }, React__default.createElement(GenerateChartData$1, {
     colors: ["#0F9655"],
     typeChart: TYPECHART.AREA,
     activeColumn: [true],
@@ -31511,7 +31517,7 @@ var DashboardToPDF = function DashboardToPDF(props) {
       display: "block",
       width: "45%"
     }
-  }, React__default.createElement(GenerateChartData, {
+  }, React__default.createElement(GenerateChartData$1, {
     colors: ["#C44140"],
     typeChart: TYPECHART.LINE,
     activeColumn: [true],
@@ -31526,7 +31532,7 @@ var DashboardToPDF = function DashboardToPDF(props) {
       display: "block",
       width: "45%"
     }
-  }, React__default.createElement(GenerateChartData, {
+  }, React__default.createElement(GenerateChartData$1, {
     colors: ["#169490", "#316CD9", "#FFB04F"],
     typeChart: TYPECHART.LINE,
     activeColumn: activeColumnPreparedness,
@@ -31541,7 +31547,7 @@ var DashboardToPDF = function DashboardToPDF(props) {
       display: "block",
       width: "45%"
     }
-  }, React__default.createElement(GenerateChartData, {
+  }, React__default.createElement(GenerateChartData$1, {
     typeChart: TYPECHART.AREA,
     activeColumn: activeColumnSuccessIndicators,
     series: successIndicatorsData,
@@ -31556,7 +31562,7 @@ var DashboardToPDF = function DashboardToPDF(props) {
       display: "block",
       width: "45%"
     }
-  }, React__default.createElement(GenerateChartData, {
+  }, React__default.createElement(GenerateChartData$1, {
     colors: ["#73C8E5", "#F9F871", "#D7B0DE", "#E56362", "#5A7F05", "#D3D3D3"],
     name: "Learning Process",
     typeChart: TYPECHART.AREA,
@@ -31936,6 +31942,10 @@ var Dashboard = function Dashboard() {
       isExpandChart = _useState2[0],
       setIsExpandChart = _useState2[1];
 
+  var _useState3 = React.useState(false),
+      isShowFilterMobile = _useState3[0],
+      setIsShowFilterMobile = _useState3[1];
+
   var toggle = function toggle() {
     setSelectedToPrint([]);
     setModal(!modal);
@@ -32018,9 +32028,53 @@ var Dashboard = function Dashboard() {
   })), React__default.createElement("p", {
     className: styles$1["button-content"] + " mb-0"
   }, t("export_to_pdf")))), React__default.createElement("div", {
-    className: "d-flex justify-content-between flex-wrap my-2"
+    className: styles$1['filter-mobile-block'] + " p-3 my-4"
   }, React__default.createElement("div", {
-    className: "d-flex"
+    onClick: function onClick() {
+      return setIsShowFilterMobile(!isShowFilterMobile);
+    },
+    className: "d-flex justify-content-between cursor-pointer"
+  }, React__default.createElement("span", {
+    className: "font-weight-bold"
+  }, "Filter"), isShowFilterMobile ? React__default.createElement(fi.FiChevronUp, {
+    size: "1.5rem"
+  }) : React__default.createElement(fi.FiChevronDown, {
+    size: "1.5rem"
+  })), isShowFilterMobile ? React__default.createElement("div", {
+    className: "d-flex flex-column " + styles$1["filter-wrapper-mobile"]
+  }, React__default.createElement("div", {
+    className: "d-flex flex-column mt-3 " + styles$1["filter-wrapper-mobile"]
+  }, LIST_FILTERS_LEFT.map(function (e) {
+    return React__default.createElement(SelectFilter, {
+      name: e.name,
+      icon: e.icon,
+      handleChangeFilters: e.handleChangeFilters,
+      filter: filter,
+      option: e.option,
+      onChangeFilters: onChangeFilters
+    });
+  })), React__default.createElement("div", {
+    className: "d-flex flex-column " + styles$1["filter-wrapper-mobile"]
+  }, LIST_FILTERS_RIGHT.map(function (e) {
+    return React__default.createElement(SelectFilter, {
+      name: e.name,
+      icon: e.icon,
+      handleChangeFilters: e.handleChangeFilters,
+      filter: filter,
+      studentId: e.studentId || 0,
+      studentDefault: e.studentDefault,
+      onChangeFilters: onChangeFilters,
+      teacherUserId: teacherUserId,
+      changeCurrentTeacherUserId: changeCurrentTeacherUserId,
+      btnStyle: e.name === FILTER_NAME.StudentName ? {
+        minWidth: 220,
+        justifyContent: "center"
+      } : {}
+    });
+  }))) : null), React__default.createElement("div", {
+    className: "d-none d-sm-flex justify-content-between flex-wrap my-2"
+  }, React__default.createElement("div", {
+    className: "d-flex flex-wrap"
   }, LIST_FILTERS_LEFT.map(function (e) {
     return React__default.createElement(SelectFilter, {
       name: e.name,
@@ -32049,7 +32103,7 @@ var Dashboard = function Dashboard() {
       } : {}
     });
   }))), React__default.createElement("div", {
-    className: "d-flex align-items-center justify-content-between flex-wrap mb-3"
+    className: styles$1["total-card-wrapper"] + " d-flex align-items-center justify-content-center justify-content-lg-between flex-wrap mb-3"
   }, totalCardData.map(function (item) {
     return React__default.createElement(TotalCard, {
       icon: item.icon,
@@ -32073,8 +32127,8 @@ var Dashboard = function Dashboard() {
   }, React__default.createElement(reactstrap.Row, {
     className: "d-flex"
   }, React__default.createElement(reactstrap.Col, {
-    md: !isExpandChart ? 6 : 12
-  }, React__default.createElement(GenerateChartData, {
+    md: !isExpandChart && chartIsOpened[0] ? 6 : 12
+  }, React__default.createElement(GenerateChartData$1, {
     isShowExpandIcon: true,
     colors: ["#0F9655"],
     name: t(averageStudentSafetyName),
@@ -32089,7 +32143,7 @@ var Dashboard = function Dashboard() {
   })), React__default.createElement(reactstrap.Col, {
     md: !isExpandChart ? 6 : 12,
     className: ""
-  }, React__default.createElement(GenerateChartData, {
+  }, React__default.createElement(GenerateChartData$1, {
     isShowExpandIcon: true,
     colors: ["#C44140"],
     name: t(averageStudentStressName),
@@ -32105,7 +32159,7 @@ var Dashboard = function Dashboard() {
     className: "d-flex"
   }, React__default.createElement(reactstrap.Col, {
     md: 7
-  }, React__default.createElement(GenerateChartData, {
+  }, React__default.createElement(GenerateChartData$1, {
     colors: ["#169490", "#316CD9", "#FFB04F"],
     name: t(preparednessChartName),
     typeChart: TYPECHART.AREA,
@@ -32118,7 +32172,7 @@ var Dashboard = function Dashboard() {
     timeOfDay: filter.optionDate
   })), React__default.createElement(reactstrap.Col, {
     md: 5
-  }, React__default.createElement(GenerateChartData, {
+  }, React__default.createElement(GenerateChartData$1, {
     colors: ["#D9EEE4", "#FAF0F0"],
     name: t(overallReadinessToLearn),
     typeChart: TYPECHART.DONUT,
@@ -32128,7 +32182,7 @@ var Dashboard = function Dashboard() {
     series: dataOverallReadyToLearn.resultQuestion,
     timeOfDay: filter.optionDate,
     dayOfWeek: []
-  }))), React__default.createElement(GenerateChartData, {
+  }))), React__default.createElement(GenerateChartData$1, {
     name: t(successIndicatorsName),
     typeChart: TYPECHART.AREA,
     onActiveColumn: handleActiveColumnOneToOne,
@@ -32160,7 +32214,7 @@ var Dashboard = function Dashboard() {
     index: 1
   }), React__default.createElement(reactstrap.Collapse, {
     isOpen: chartIsOpened[1]
-  }, React__default.createElement(GenerateChartData, {
+  }, React__default.createElement(GenerateChartData$1, {
     colors: ["#73C8E5", "#F9F871", "#D7B0DE", "#E56362", "#5A7F05", "#D3D3D3"],
     name: t(learningProcessName),
     typeChart: TYPECHART.AREA,
@@ -34928,7 +34982,8 @@ var SurveyDashboard = function SurveyDashboard() {
   })), React__default.createElement(reactstrap.Col, {
     md: 5
   }, React__default.createElement(reactstrap.Row, null, React__default.createElement(reactstrap.Col, {
-    md: 7,
+    md: 9,
+    lg: 7,
     style: {
       margin: "0 auto"
     }