"use strict";
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
    return cooked;
};
var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    var desc = Object.getOwnPropertyDescriptor(m, k);
    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
      desc = { enumerable: true, get: function() { return m[k]; } };
    }
    Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
    Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
    o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
    if (mod && mod.__esModule) return mod;
    var result = {};
    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
    __setModuleDefault(result, mod);
    return result;
};
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
    return new (P || (P = Promise))(function (resolve, reject) {
        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
        step((generator = generator.apply(thisArg, _arguments || [])).next());
    });
};
var __generator = (this && this.__generator) || function (thisArg, body) {
    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
    function verb(n) { return function (v) { return step([n, v]); }; }
    function step(op) {
        if (f) throw new TypeError("Generator is already executing.");
        while (_) try {
            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
            if (y = 0, t) op = [op[0] & 2, t.value];
            switch (op[0]) {
                case 0: case 1: t = op; break;
                case 4: _.label++; return { value: op[1], done: false };
                case 5: _.label++; y = op[1]; op = [0]; continue;
                case 7: op = _.ops.pop(); _.trys.pop(); continue;
                default:
                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
                    if (t[2]) _.ops.pop();
                    _.trys.pop(); continue;
            }
            op = body.call(thisArg, _);
        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
    }
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.getActiveDays = void 0;
var jsx_runtime_1 = require("react/jsx-runtime");
var react_1 = require("react");
var styled_components_1 = __importStar(require("styled-components"));
var react_chartjs_2_1 = require("react-chartjs-2");
require("chartjs-plugin-datalabels");
require("chartjs-plugin-doughnutlabel");
var dayjs_1 = __importDefault(require("dayjs"));
var timezone_1 = __importDefault(require("dayjs/plugin/timezone"));
var utc_1 = __importDefault(require("dayjs/plugin/utc"));
var pdf_1 = __importStar(require("../lib/pdf"));
var base64_1 = require("../lib/base64");
var useTrainingLevelScoreChartDatas_1 = __importDefault(require("../hooks/useTrainingLevelScoreChartDatas"));
var GridRow_1 = __importDefault(require("./GridRow"));
dayjs_1.default.extend(utc_1.default);
dayjs_1.default.extend(timezone_1.default);
dayjs_1.default.tz.setDefault("Asia/Seoul");
var makeTrainingObject = function (type, language) { return ({
    taskName: type.name,
    taskType: type.type,
    language: type.type === "Reading" || type.name === "SentenceTracking" ? language : "한국어",
    level: 0,
    reculsiveCount: 0,
    weeklyPerformedDays: 0,
    performedCount: 0,
    needPerformedCount: 0,
    performedRatio: 0,
    totDuration: 0,
    avgDuration: 0,
    avgScore: 0,
    totScore: 0,
    equalTypeCount: 0, // 이 type이 지금 몇 개 나왔는지
}); };
var getActiveDays = function (dayofweek) {
    var weeklyPerformedDays = dayofweek.split(",");
    var daysObj = { 일: 0, 월: 1, 화: 2, 수: 3, 목: 4, 금: 5, 토: 6 };
    var activeDays = Array(7).fill(false);
    for (var k = 0; k < weeklyPerformedDays.length; k++) {
        var d = daysObj[weeklyPerformedDays[k]]; // 수행 날짜를 골라서
        activeDays[d] = true; // 해당 날짜 인덱스에 설정하기
    }
    return activeDays;
};
exports.getActiveDays = getActiveDays;
var makeTrainingList = function (language) {
    var typenameList = [
        { type: "Reading", name: "SentenceMask" },
        { type: "Reading", name: "WordOrdering" },
        { type: "Reading", name: "KeywordFinding" },
        { type: "Reading", name: "CategoryFinding" },
        { type: "Cognitive", name: "VisualSpan" },
        { type: "Cognitive", name: "VisualCounting" },
        { type: "Cognitive", name: "TMT" },
        { type: "Cognitive", name: "Stroop" },
        { type: "Tracking", name: "SaccadeTracking" },
        { type: "Tracking", name: "PursuitTracking" },
        { type: "Tracking", name: "AntiTracking" },
        { type: "Tracking", name: "SentenceTracking" },
        { type: "Exercise", name: "ExerciseHorizontal" },
        { type: "Exercise", name: "ExerciseVertical" },
        { type: "Exercise", name: "ExerciseHJump" },
        { type: "Exercise", name: "ExerciseVJump" },
    ];
    return typenameList.map(function (t) { return makeTrainingObject(t, language); });
};
var makeTrainingTypeObject = function () { return ({
    level: 0,
    reculsiveCount: 0,
    weeklyPerformedDays: 0,
    performedCount: 0,
    needPerformedCount: 0,
    performedRatio: 0,
    totDuration: 0,
    avgDuration: 0,
    avgScore: 0,
    totScore: 0, // 총 획득 점수
}); };
var TrainingReport = (0, react_1.forwardRef)(function (props, ref) {
    var trainingData = props.data, meIndex = props.meIndex, info = props.info, chartData = props.chartData;
    var _a = (0, react_1.useState)(false), isMobileWidth = _a[0], setIsMobileWidth = _a[1];
    var _b = (0, react_1.useState)(), data = _b[0], setData = _b[1];
    var _c = (0, react_1.useState)(), pdf = _c[0], setPdf = _c[1];
    // @ts-ignore
    var _d = (0, useTrainingLevelScoreChartDatas_1.default)({ data: chartData, selOption: 1, startDate: info.start_date, endDate: info.end_date, language: info.language }), dayCD = _d.chartData, dayCO = _d.chartOption, dayDD = _d.dueDate;
    // @ts-ignore
    var _e = (0, useTrainingLevelScoreChartDatas_1.default)({ data: chartData, selOption: 2, startDate: info.start_date, endDate: info.end_date, language: info.language }), weekCD = _e.chartData, weekCO = _e.chartOption, weekDD = _e.dueDate;
    var tier = (0, react_1.useMemo)(function () {
        if (!data) {
            return;
        }
        if (data.firstScore >= 80000) {
            return "다이아몬드";
        }
        else if (data.firstScore >= 40000) {
            return "플래티넘";
        }
        else if (data.firstScore >= 15000) {
            return "골드";
        }
        else if (data.firstScore >= 5000) {
            return "실버";
        }
        else {
            return "브론즈";
        }
    }, [data]);
    var medal = (0, react_1.useMemo)(function () {
        if (!tier) {
            return;
        }
        return base64_1.imgbase64forPDF[tier];
    }, [tier]);
    (0, react_1.useImperativeHandle)(ref, function () { return ({
        isPossibleMakePDF: function () { return pdf_1.preloadDone && Boolean(data); },
        generatePDF: function () {
            return new Promise(function (resolve, reject) {
                if (!data || !tier) {
                    reject("data invalid");
                    return;
                }
                var pdf = new pdf_1.default(data, tier, dayDD, weekDD, data.agencyLogo);
                var response = pdf.start();
                setPdf(pdf);
                resolve(response);
            });
        },
        downloadPDF: function () {
            return new Promise(function (resolve, reject) { return __awaiter(void 0, void 0, void 0, function () {
                var response;
                return __generator(this, function (_a) {
                    if (!pdf) {
                        resolve(false);
                        return [2 /*return*/];
                    }
                    response = pdf.download();
                    resolve(response);
                    return [2 /*return*/];
                });
            }); });
        },
    }); });
    (0, react_1.useEffect)(function () {
        var resize = function () {
            var width = window.innerWidth;
            setIsMobileWidth(function () { return width <= 500; });
        };
        window.addEventListener("resize", resize);
        resize();
        return function () { return window.removeEventListener("resize", resize); };
    }, []);
    (0, react_1.useEffect)(function () {
        if (!trainingData) {
            return;
        }
        // @ts-ignore;
        var resultData = {
            agencyID: trainingData[meIndex].agency_ID,
            agencyName: trainingData[meIndex].agency_name,
            agencyLogo: info.agency_logo,
            testeeIdx: trainingData[meIndex].testee_idx,
            testeeID: trainingData[meIndex].user_ID,
            testeeNickname: trainingData[meIndex].testee_nickname,
            testeeClass: trainingData[meIndex].testee_class || "",
            startdate: info.start_date,
            enddate: info.end_date,
            totScore: trainingData[meIndex].tts_totalscore || 0,
            firstScore: trainingData[meIndex].tts_firstscore || 0,
            firstScoreDate: trainingData[meIndex].tts_firstscore_resetdate,
            firstScoreRank: trainingData[meIndex].firstscoreRank || 0,
            secondScore: trainingData[meIndex].tts_secondscore || 0,
            secondScoreDate: trainingData[meIndex].tts_secondscore_resetdate,
            monthScore: trainingData[meIndex].tts_monthscore || 0,
            monthScoreRank: trainingData[meIndex].monthscoreRank || 0,
            dueScore: 0,
            performedRatio: 0,
            avgScore: 0,
            avgDuration: 0,
            trainingList: makeTrainingList(info.language),
            typeSummary: {
                All: makeTrainingTypeObject(),
                Reading: makeTrainingTypeObject(),
                Cognitive: makeTrainingTypeObject(),
                Tracking: makeTrainingTypeObject(),
                Exercise: makeTrainingTypeObject(),
            },
            sentencemaskAnalysis: trainingData[meIndex].sentencemask_analysis,
        };
        // 그룹의 총 점수 계산
        var groupScoreObject = {
            SentenceMask: { avgTotScore: 0, avgTotDuration: 0, cnt: 0 },
            CategoryFinding: { avgTotScore: 0, avgTotDuration: 0, cnt: 0 },
            KeywordFinding: { avgTotScore: 0, avgTotDuration: 0, cnt: 0 },
            WordOrdering: { avgTotScore: 0, avgTotDuration: 0, cnt: 0 },
            VisualSpan: { avgTotScore: 0, avgTotDuration: 0, cnt: 0 },
            VisualCounting: { avgTotScore: 0, avgTotDuration: 0, cnt: 0 },
            TMT: { avgTotScore: 0, avgTotDuration: 0, cnt: 0 },
            Stroop: { avgTotScore: 0, avgTotDuration: 0, cnt: 0 },
            SaccadeTracking: { avgTotScore: 0, avgTotDuration: 0, cnt: 0 },
            PursuitTracking: { avgTotScore: 0, avgTotDuration: 0, cnt: 0 },
            AntiTracking: { avgTotScore: 0, avgTotDuration: 0, cnt: 0 },
            SentenceTracking: { avgTotScore: 0, avgTotDuration: 0, cnt: 0 },
            ExerciseHorizontal: { avgTotScore: 0, avgTotDuration: 0, cnt: 0 },
            ExerciseVertical: { avgTotScore: 0, avgTotDuration: 0, cnt: 0 },
            ExerciseHJump: { avgTotScore: 0, avgTotDuration: 0, cnt: 0 },
            ExerciseVJump: { avgTotScore: 0, avgTotDuration: 0, cnt: 0 },
        };
        var myPerformedCount = 0; // 수행률 계산, 내가 수행한 횟수
        var myNeedPerformedCount = 0; // 수행률 계산, 수행했어야하는 횟수
        var myTotScore = 0; // 수행 총 점수
        // let myTotAvgScore = 0; // 수행 평균점수들의 합
        var myTotAvgDuration = 0; // 수행 평균시간들의 합
        // 일단 내 점수부터
        var endDate = (0, dayjs_1.default)(info.end_date);
        // console.log("resultData", resultData);
        var myTaskList = trainingData[meIndex].taskList;
        // let myChartCount = 0; // 차트에 필요한 평균을 낼 개수
        var groupChartCount = 0;
        var myResultObj = {};
        var _loop_1 = function (i) {
            if (myTaskList[i].isactive === 0) {
                return "continue";
            }
            if ((myTaskList[i].task_type === "Reading" || myTaskList[i].task_name === "SentenceTracking") && myTaskList[i].language !== info.language) {
                return "continue";
            }
            var task = myTaskList[i];
            // start_date~end_date까지 각 요일별로 체크해서
            // 해당일이 수행해야하는 날이었는지 아닌지 체크
            var activeDays = (0, exports.getActiveDays)(task.dayofweek);
            var ptr = (0, dayjs_1.default)(info.start_date);
            var performedCount = 0; // 해당 과제의 수행횟수
            var taskTotScore = 0; // 해당 과제의 총점
            var taskTotDuration = 0; // 해당 과제의 총 수행시간
            var needPerformedCount = 0; // 해당 과제에서 해야했던 수행횟수
            var totLevel = 0; // 각 결과에 대한 레벨 합계
            var performedDayCount = 0; // 수행한 날짜의 개수
            while (ptr <= endDate) {
                var day = ptr.day();
                if (!activeDays[day]) {
                    ptr = ptr.add(1, "day");
                    continue;
                }
                // 해야했던 날
                var format = ptr.format("YYYY-MM-DD");
                // 트레이닝 결과가 있는지 확인
                if (task.trainingResult[format]) {
                    var taskScore = task.trainingResult[format].reduce(function (prev, curr) { return prev + curr.tr_score; }, 0);
                    var taskLevel = task.trainingResult[format].reduce(function (prev, curr) { return prev + curr.tr_level; }, 0);
                    var taskDuration = task.trainingResult[format].reduce(function (prev, curr) { return prev + curr.tr_duration; }, 0);
                    if (myResultObj.hasOwnProperty(format)) {
                        myResultObj[format].duration += taskDuration;
                    }
                    else {
                        myResultObj[format] = { duration: taskDuration };
                    }
                    performedCount += task.trainingResult[format].length;
                    taskTotScore += taskScore;
                    totLevel += taskLevel;
                    taskTotDuration += taskDuration;
                    performedDayCount++;
                }
                needPerformedCount += task.reculsivecount;
                ptr = ptr.add(1, "day");
            }
            var findIndex = resultData.trainingList.findIndex(function (f) { return f.taskName === task.task_name; });
            if (findIndex === -1) {
                return "continue";
            }
            resultData.trainingList[findIndex].equalTypeCount = 1;
            resultData.trainingList[findIndex].reculsiveCount = task.reculsivecount;
            resultData.trainingList[findIndex].weeklyPerformedDays = activeDays.reduce(function (prev, curr) { return prev + +curr; }, 0);
            resultData.trainingList[findIndex].performedCount = performedCount;
            resultData.trainingList[findIndex].totScore = taskTotScore;
            resultData.trainingList[findIndex].totDuration = taskTotDuration;
            resultData.trainingList[findIndex].needPerformedCount = needPerformedCount;
            resultData.trainingList[findIndex].performedRatio = parseFloat((performedCount / (needPerformedCount || 1)).toFixed(4));
            if (performedCount === 0) {
                // 수행을 한 번도 안함,
                // 차트 평균에서는 뺌, 수행한 것의 평균을 내야하기 때문에
                resultData.trainingList[findIndex].level = task.level;
                resultData.trainingList[findIndex].avgScore = 0;
                resultData.trainingList[findIndex].avgDuration = 0;
            }
            else {
                // 해당 과제의 평균 레벨, 점수, 수행시간
                // 수행한 결과이기 때문에 차트 평균 구할때의 횟수 증가
                resultData.trainingList[findIndex].level = parseFloat((totLevel / performedCount).toFixed(1));
                resultData.trainingList[findIndex].avgScore = parseFloat((taskTotScore / performedCount).toFixed(1));
                resultData.trainingList[findIndex].avgDuration = parseFloat((taskTotDuration / (performedDayCount || 1)).toFixed(1));
                // myChartCount++;
            }
            myPerformedCount += performedCount; // 내 총 수행횟수
            myNeedPerformedCount += needPerformedCount; // 내가 해야했던 총 수행횟수
            myTotScore += taskTotScore;
        };
        for (var i = 0; i < myTaskList.length; i++) {
            _loop_1(i);
        }
        var myPerformedDateList = Object.keys(myResultObj);
        myTotAvgDuration = myPerformedDateList.reduce(function (prev, curr) { return prev + myResultObj[curr].duration; }, 0) / (myPerformedDateList.length || 1);
        var avgDuration = myTotAvgDuration / 60; // 분(minute)으로 바꾸기
        resultData.dueScore = myTotScore;
        resultData.performedRatio = parseFloat(((myPerformedCount / (myNeedPerformedCount || 1)) * 100).toFixed(4));
        resultData.avgScore = parseFloat((myTotScore / (myPerformedCount || 1)).toFixed(1));
        resultData.avgDuration = parseFloat(avgDuration.toFixed(1));
        // 과제 없는건 없애버리기
        resultData.trainingList = resultData.trainingList.filter(function (f) { return f.equalTypeCount !== 0; });
        // 각 타입들의 평균 계산
        var typeCount = { Reading: 0, Cognitive: 0, Tracking: 0, Exercise: 0 };
        for (var i = 0; i < resultData.trainingList.length; i++) {
            var taskType = resultData.trainingList[i].taskType;
            var tl = resultData.trainingList[i];
            resultData.typeSummary[taskType].level += tl.level;
            resultData.typeSummary[taskType].reculsiveCount += tl.reculsiveCount; // 일 수행횟수(recul)
            resultData.typeSummary[taskType].weeklyPerformedDays += tl.weeklyPerformedDays; // 주당 수행일(dayofweek 개수)
            resultData.typeSummary[taskType].performedCount += tl.performedCount; // 수행횟수
            resultData.typeSummary[taskType].needPerformedCount += tl.needPerformedCount; // 수행해야하는 횟수
            resultData.typeSummary[taskType].performedRatio += tl.performedRatio; // 수행률
            resultData.typeSummary[taskType].totDuration += tl.totDuration; // 총 수행시간
            resultData.typeSummary[taskType].avgDuration += tl.avgDuration; // 일 평균 수행 시간
            resultData.typeSummary[taskType].avgScore += tl.avgScore; // 평균점수
            resultData.typeSummary[taskType].totScore += tl.totScore; // 총 획득 점수
            resultData.typeSummary.All.level += tl.level;
            resultData.typeSummary.All.reculsiveCount += tl.reculsiveCount; // 일 수행횟수(recul)
            resultData.typeSummary.All.weeklyPerformedDays += tl.weeklyPerformedDays; // 주당 수행일(dayofweek 개수)
            resultData.typeSummary.All.performedCount += tl.performedCount; // 수행횟수
            resultData.typeSummary.All.needPerformedCount += tl.needPerformedCount; // 수행해야하는 횟수
            resultData.typeSummary.All.performedRatio += tl.performedRatio; // 수행률
            resultData.typeSummary.All.totDuration += tl.totDuration; // 총 수행시간
            resultData.typeSummary.All.avgDuration += tl.avgDuration; // 일 평균 수행 시간
            resultData.typeSummary.All.avgScore += tl.avgScore; // 평균점수
            resultData.typeSummary.All.totScore += tl.totScore; // 총 획득 점수
            typeCount[taskType]++;
        }
        var totTaskCount = 0;
        for (var type in typeCount) {
            if (typeCount[type] === 0) {
                continue;
            }
            totTaskCount += typeCount[type];
            var rt = resultData.typeSummary[type];
            rt.level = +(rt.level / typeCount[type]).toFixed(1);
            rt.reculsiveCount = +(rt.reculsiveCount / typeCount[type]).toFixed(1); // 일 수행횟수(recul)
            rt.weeklyPerformedDays = +(rt.weeklyPerformedDays / typeCount[type]).toFixed(1); // 주당 수행일(dayofweek 개수)
            rt.performedCount = +(rt.performedCount / typeCount[type]).toFixed(1); // 수행횟수
            rt.needPerformedCount = +(rt.needPerformedCount / typeCount[type]).toFixed(1); // 수행해야하는 횟수
            rt.performedRatio = +(rt.performedRatio / typeCount[type]).toFixed(4); // 수행률
            rt.totDuration = +(rt.totDuration / typeCount[type]).toFixed(1); // 총 수행시간
            rt.avgDuration = +(rt.avgDuration / typeCount[type]).toFixed(1); // 일 평균 수행 시간
            rt.avgScore = +(rt.avgScore / typeCount[type]).toFixed(1); // 평균점수
            rt.totScore = +(rt.totScore / typeCount[type]).toFixed(1); // 총 획득 점수
        }
        var all = resultData.typeSummary.All;
        all.level = +(all.level / (totTaskCount || 1)).toFixed(1);
        all.reculsiveCount = +(all.reculsiveCount / (totTaskCount || 1)).toFixed(1); // 일 수행횟수(recul)
        all.weeklyPerformedDays = +(all.weeklyPerformedDays / (totTaskCount || 1)).toFixed(1); // 주당 수행일(dayofweek 개수)
        all.performedCount = +(all.performedCount / (totTaskCount || 1)).toFixed(1); // 수행횟수
        all.needPerformedCount = +(all.needPerformedCount / (totTaskCount || 1)).toFixed(1); // 수행해야하는 횟수
        all.performedRatio = +(all.performedRatio / (totTaskCount || 1)).toFixed(4); // 수행률
        all.totDuration = +(all.totDuration / (totTaskCount || 1)).toFixed(1); // 총 수행시간
        all.avgDuration = +(all.avgDuration / (totTaskCount || 1)).toFixed(1); // 일 평균 수행 시간
        all.avgScore = +(all.avgScore / (totTaskCount || 1)).toFixed(1); // 평균점수
        all.totScore = +(all.totScore / (totTaskCount || 1)).toFixed(1); // 총 획득 점수
        // 그룹 점수 내기
        var groupPerformedCount = 0; // 수행률 계산, 그룹의 수행한 횟수
        var groupNeedPerformedCount = 0; // 수행률 계산, 수행했어야하는 횟수
        var groupTotAvgScore = 0; // 수행 총 평균점수들의 합
        var groupTotAvgDuration = 0; // 수행 총 평균시간들의 합
        var groupTotPerformedCount = 0;
        var _loop_2 = function (i) {
            var taskList = trainingData[i].taskList;
            var groupResultObj = {};
            for (var j = 0; j < taskList.length; j++) {
                if (taskList[j].isactive === 0 || taskList[j].language !== info.language) {
                    continue;
                }
                var task = taskList[j];
                // start_date~end_date까지 각 요일별로 체크해서
                // 해당일이 수행해야하는 날이었는지 아닌지 체크
                var activeDays = (0, exports.getActiveDays)(task.dayofweek);
                var ptr = (0, dayjs_1.default)(info.start_date);
                var performedCount = 0; // 해당 과제의 수행횟수
                var taskTotScore = 0; // 해당 과제의 총점
                var taskTotDuration = 0; // 해당 과제의 총 수행시간
                var needPerformedCount = 0; // 해당 과제에서 해야했던 수행횟수
                while (ptr <= endDate) {
                    var day = ptr.day();
                    if (!activeDays[day]) {
                        ptr = ptr.add(1, "day");
                        continue;
                    }
                    // 해야했던 날
                    var format = ptr.format("YYYY-MM-DD");
                    // 그 날짜에 트레이닝 결과가 있는지 확인
                    if (task.trainingResult.hasOwnProperty(format)) {
                        var taskScore = task.trainingResult[format].reduce(function (prev, curr) { return prev + curr.tr_score; }, 0);
                        var taskDuration = task.trainingResult[format].reduce(function (prev, curr) { return prev + curr.tr_duration; }, 0);
                        var cnt = task.trainingResult[format].length;
                        if (groupResultObj.hasOwnProperty(format)) {
                            groupResultObj[format].duration += taskDuration;
                            groupResultObj[format].cnt += cnt;
                        }
                        else {
                            groupResultObj[format] = { duration: taskDuration, cnt: cnt };
                        }
                        performedCount += task.trainingResult[format].length;
                        taskTotScore += taskScore;
                        taskTotDuration += taskDuration;
                    }
                    groupNeedPerformedCount += task.reculsivecount;
                    ptr = ptr.add(1, "day");
                }
                if (performedCount === 0) {
                    // 수행을 한 번도 안함,
                    // 차트 평균에서는 뺌, 수행한 것의 평균을 내야하기 때문에
                    groupScoreObject[task.task_name].avgTotScore += 0;
                    groupScoreObject[task.task_name].avgTotDuration += 0;
                }
                else {
                    // 해당 과제의 평균 점수, 수행시간
                    // 수행한 결과이기 때문에 차트 평균 구할때의 횟수 증가
                    groupScoreObject[task.task_name].avgTotScore += parseFloat((taskTotScore / performedCount).toFixed(1));
                    groupScoreObject[task.task_name].avgTotDuration += parseFloat((taskTotDuration / performedCount).toFixed(1));
                    groupScoreObject[task.task_name].cnt++;
                }
                groupPerformedCount += performedCount; // 내 총 수행횟수
                groupNeedPerformedCount += needPerformedCount; // 내가 해야했던 총 수행횟수
            }
            if (Object.keys(groupResultObj).length === 0) {
                return "continue";
            }
            var performedDateList = Object.keys(groupResultObj);
            var groupAvgDuration_1 = performedDateList.reduce(function (prev, curr) { return prev + groupResultObj[curr].duration; }, 0) / performedDateList.length;
            var minuteDuration = groupAvgDuration_1 / 60; // 분(minute)으로 바꾸기
            groupTotAvgDuration += minuteDuration;
            groupTotPerformedCount++;
        };
        for (var i = 0; i < trainingData.length; i++) {
            _loop_2(i);
        }
        var groupTrainingTypeAvgScore = {
            SentenceMask: 0,
            CategoryFinding: 0,
            KeywordFinding: 0,
            WordOrdering: 0,
            VisualSpan: 0,
            VisualCounting: 0,
            TMT: 0,
            Stroop: 0,
            SaccadeTracking: 0,
            PursuitTracking: 0,
            AntiTracking: 0,
            SentenceTracking: 0,
            ExerciseHorizontal: 0,
            ExerciseVertical: 0,
            ExerciseHJump: 0,
            ExerciseVJump: 0,
        };
        var typeList = Object.keys(groupScoreObject);
        for (var i = 0; i < typeList.length; i++) {
            // @ts-ignore;
            var key = typeList[i];
            if (groupScoreObject[key].cnt === 0) {
                groupTrainingTypeAvgScore[key] = 0;
            }
            else {
                groupTrainingTypeAvgScore[key] = parseFloat((groupScoreObject[key].avgTotScore / groupScoreObject[key].cnt).toFixed(1));
                groupTotAvgScore += groupTrainingTypeAvgScore[key];
                // groupTotAvgDuration += parseFloat((groupScoreObject[key].avgTotDuration / groupScoreObject[key].cnt).toFixed(1));
                groupChartCount++;
            }
        }
        var groupAvgDuration = groupTotPerformedCount !== 0 ? groupTotAvgDuration / groupTotPerformedCount : 0;
        resultData.groupScoreList = __assign({ performedRatio: parseFloat(((groupPerformedCount / (groupNeedPerformedCount || 1)) * 100).toFixed(1)), avgScore: parseFloat((groupTotAvgScore / (groupChartCount || 1)).toFixed(1)), avgDuration: parseFloat(groupAvgDuration.toFixed(1)) }, groupTrainingTypeAvgScore);
        // // chart title 내용
        if (resultData.performedRatio >= 90) {
            resultData.ratioTitle = "잘하고 있어요";
        }
        else if (resultData.performedRatio >= 80) {
            resultData.ratioTitle = "조금만 더 분발해요";
        }
        else if (resultData.performedRatio >= 70) {
            resultData.ratioTitle = "수행이 미흡해요";
        }
        else {
            resultData.ratioTitle = "수행이 많이 미흡해요";
        }
        if (resultData.avgScore >= 80) {
            resultData.scoreTitle = "쉬워요";
        }
        else if (resultData.avgScore >= 60) {
            resultData.scoreTitle = "적당해요";
        }
        else {
            resultData.scoreTitle = "어려워요";
        }
        if (resultData.avgDuration >= 30) {
            resultData.durationTitle = "수행량이 너무 많아요";
        }
        else if (resultData.avgDuration >= 20) {
            resultData.durationTitle = "수행량이 조금 많아요";
        }
        else if (resultData.avgDuration >= 10) {
            resultData.durationTitle = "수행량이 적절해요";
        }
        else {
            resultData.durationTitle = "수행량이 적어요";
        }
        setData(resultData);
    }, [trainingData, meIndex, info]);
    var trainingTypes = (0, react_1.useMemo)(function () {
        return [
            {
                type: "Reading",
                names: ["Sentence Mask", "Word Ordering", "Keyword Finding", "Category Finding"],
            },
            {
                type: "Cognitive",
                names: ["Visual Span", "Visual Counting", "TMT", "Stroop"],
            },
            {
                type: "Tracking",
                names: ["Saccade Tracking", "Pursuit Tracking", "Anti Tracking", "Sentence Tracking"],
            },
            {
                type: "Exercise",
                names: ["Exercise Horizontal", "Exercise Vertical", "Exercise HJump", "Exercise VJump"],
            },
        ];
    }, []);
    var commonChartOption = (0, react_1.useMemo)(function () {
        return {
            cutoutPercentage: 75,
            responsive: true,
            responsiveAnimationDuration: 1000,
            animation: {
                duration: 1000,
            },
            maintainAspectRatio: false,
            tooltips: {
                enabled: false,
            },
            plugins: {
                datalabels: {
                    display: false,
                    color: "black",
                    font: {
                        size: 14,
                        weight: "bold",
                    },
                },
            },
        };
    }, []);
    var commonResultChartOption = (0, react_1.useMemo)(function () {
        if (!commonChartOption) {
            return;
        }
        return __assign(__assign({}, commonChartOption), { legend: {
                display: true,
                position: "bottom",
                align: "start",
            }, scale: {
                ticks: {
                    beginAtZero: true,
                    max: 100,
                    min: 0,
                    stepSize: 20,
                    backdropColor: "transparent",
                },
            }, plugins: __assign({}, commonChartOption.plugins) });
    }, [commonChartOption]);
    var datasetKeyProvider = (0, react_1.useCallback)(function () {
        return btoa(Math.random() + "").substring(0, 12);
    }, []);
    var ratioChartTitle = (0, react_1.useMemo)(function () {
        if (!data) {
            return;
        }
        return data.ratioTitle;
    }, [data]);
    var ratioChartData = (0, react_1.useMemo)(function () {
        if (!data) {
            return;
        }
        return {
            labels: [],
            type: "doughnut",
            datasets: [
                {
                    data: [data.performedRatio, 100 - data.performedRatio],
                    backgroundColor: ["#009bde", "transparent"],
                    borderWidth: 0,
                    hoverBorderWidth: 0,
                },
                {
                    data: [data.groupScoreList.performedRatio, 100 - data.groupScoreList.performedRatio],
                    backgroundColor: ["#ada9bb", "transparent"],
                    borderWidth: 0,
                    hoverBorderWidth: 0,
                },
            ],
        };
    }, [data]);
    var ratioChartOptions = (0, react_1.useMemo)(function () {
        if (!ratioChartData || !commonChartOption || !data) {
            return;
        }
        return __assign(__assign({}, commonChartOption), { title: {
                display: true,
                text: ratioChartTitle,
                color: "#464555",
                fontSize: 16,
                fontFamily: "'FontAwesome','Helvetica Neue', 'Helvetica', 'Arial', sans-serif", //
            }, plugins: __assign(__assign({}, commonChartOption.plugins), { doughnutlabel: {
                    labels: [
                        {
                            text: "".concat(parseFloat(data.performedRatio.toFixed(1)), "%"),
                            font: {
                                size: "24",
                            },
                            color: ratioChartData.datasets[0].backgroundColor[0],
                        },
                        {
                            text: "\uAE30\uAD00 \uD3C9\uADE0",
                            font: {
                                size: "16",
                            },
                            color: "#464555",
                        },
                        {
                            text: "".concat(data.groupScoreList.performedRatio, "%"),
                            font: {
                                size: "20",
                            },
                            color: ratioChartData.datasets[1].backgroundColor[0],
                        },
                    ],
                } }) });
    }, [data, ratioChartTitle, ratioChartData, commonChartOption]);
    var avgScoreChartTitle = (0, react_1.useMemo)(function () {
        if (!data) {
            return;
        }
        return data.scoreTitle;
    }, [data]);
    var avgScoreChartData = (0, react_1.useMemo)(function () {
        if (!data) {
            return;
        }
        return {
            labels: [],
            type: "doughnut",
            datasets: [
                {
                    data: [data.avgScore, 100 - data.avgScore],
                    backgroundColor: ["#009bde", "transparent"],
                    borderWidth: 0,
                    hoverBorderWidth: 0,
                },
                {
                    data: [data.groupScoreList.avgScore, 100 - data.groupScoreList.avgScore],
                    backgroundColor: ["#ada9bb", "transparent"],
                    borderWidth: 0,
                    hoverBorderWidth: 0,
                },
            ],
        };
    }, [data]);
    var avgScoreChartOptions = (0, react_1.useMemo)(function () {
        if (!avgScoreChartData || !commonChartOption || !data) {
            return;
        }
        return __assign(__assign({}, commonChartOption), { title: {
                display: true,
                text: avgScoreChartTitle,
                color: "#464555",
                fontSize: 16,
                fontFamily: "'FontAwesome','Helvetica Neue', 'Helvetica', 'Arial', sans-serif", //
            }, plugins: __assign(__assign({}, commonChartOption.plugins), { doughnutlabel: {
                    labels: [
                        {
                            text: "".concat(data.avgScore, "\uC810"),
                            font: {
                                size: "24",
                            },
                            color: avgScoreChartData.datasets[0].backgroundColor[0],
                        },
                        {
                            text: "\uAE30\uAD00 \uD3C9\uADE0",
                            font: {
                                size: "16",
                            },
                            color: "#464555",
                        },
                        {
                            text: "".concat(data.groupScoreList.avgScore, "\uC810"),
                            font: {
                                size: "20",
                            },
                            color: avgScoreChartData.datasets[1].backgroundColor[0],
                        },
                    ],
                } }) });
    }, [data, avgScoreChartTitle, avgScoreChartData, commonChartOption]);
    var avgDurationChartTitle = (0, react_1.useMemo)(function () {
        if (!data) {
            return;
        }
        return data.durationTitle;
    }, [data]);
    var avgDurationChartData = (0, react_1.useMemo)(function () {
        if (!data) {
            return;
        }
        var duration = data.avgDuration >= 30 ? 30 : data.avgDuration;
        var groupDuration = data.groupScoreList.avgDuration >= 30 ? 30 : data.groupScoreList.avgDuration;
        return {
            labels: [],
            type: "doughnut",
            datasets: [
                {
                    data: [duration, 30 - duration],
                    backgroundColor: ["#009bde", "transparent"],
                    borderWidth: 0,
                    hoverBorderWidth: 0,
                },
                {
                    data: [groupDuration, 30 - data.groupScoreList.avgDuration],
                    backgroundColor: ["#ada9bb", "transparent"],
                    borderWidth: 0,
                    hoverBorderWidth: 0,
                },
            ],
        };
    }, [data]);
    var avgDurationChartOptions = (0, react_1.useMemo)(function () {
        if (!avgDurationChartData || !commonChartOption || !data) {
            return;
        }
        return __assign(__assign({}, commonChartOption), { title: {
                display: true,
                text: avgDurationChartTitle,
                color: "#464555",
                fontSize: 16,
                fontFamily: "'FontAwesome','Helvetica Neue', 'Helvetica', 'Arial', sans-serif", //
            }, plugins: __assign(__assign({}, commonChartOption.plugins), { doughnutlabel: {
                    labels: [
                        {
                            text: "".concat(data.avgDuration, "\uBD84"),
                            font: {
                                size: "24",
                            },
                            color: avgDurationChartData.datasets[0].backgroundColor[0],
                        },
                        {
                            text: "\uAE30\uAD00 \uD3C9\uADE0",
                            font: {
                                size: "16",
                            },
                            color: "#464555",
                        },
                        {
                            text: "".concat(data.groupScoreList.avgDuration, "\uBD84"),
                            font: {
                                size: "20",
                            },
                            color: avgDurationChartData.datasets[1].backgroundColor[0],
                        },
                    ],
                } }) });
    }, [data, avgDurationChartTitle, avgDurationChartData, commonChartOption]);
    var sentencemaskDomainChartData = (0, react_1.useMemo)(function () {
        if (!data) {
            return;
        }
        var mappingKey = {
            science: 0,
            social: 1,
            literature: 2,
            etc: 3,
        };
        var dataset = [
            { label: "과학기술", cnt: 0, color: "#009bde" },
            { label: "인문사회", cnt: 0, color: "#FA8128" },
            { label: "문학", cnt: 0, color: "#ada9bb" },
            { label: "기타", cnt: 0, color: "#a6a55d" },
        ];
        var labels = dataset.map(function (d) { return d.label; });
        var colors = dataset.map(function (d) { return d.color; });
        var readingCount = data.sentencemaskAnalysis.readingCount;
        if (readingCount <= 0) {
            return {
                labels: labels,
                datasets: [
                    {
                        label: "",
                        data: dataset.map(function (d) { return d.cnt; }),
                        backgroundColor: colors,
                        fill: false,
                    },
                ],
            };
        }
        for (var key in data.sentencemaskAnalysis.domainCount) {
            dataset[mappingKey[key]].cnt = data.sentencemaskAnalysis.domainCount[key];
        }
        var d = dataset.map(function (d) { return +((d.cnt / readingCount) * 100).toFixed(0); });
        return {
            labels: labels,
            datasets: [
                {
                    label: "",
                    data: d,
                    backgroundColor: colors,
                    fill: false,
                },
            ],
        };
    }, [data]);
    var sentencemaskDomainChartOptions = (0, react_1.useMemo)(function () {
        if (!data || !sentencemaskDomainChartData) {
            return;
        }
        return __assign(__assign({}, commonChartOption), { cutoutPercentage: 50, title: {
                display: true,
                text: "읽은 글의 종류",
                fontSize: 16,
                fontFamily: "'FontAwesome','Helvetica Neue', 'Helvetica', 'Arial', sans-serif", //
            }, legend: {
                position: "right",
                labels: {
                    boxWidth: 10,
                    fontSize: 12,
                },
            }, plugins: {
                datalabels: {
                    display: true,
                    // @ts-ignore
                    formatter: function (value) { return (value <= 0 ? "" : "".concat(value, "%")); },
                    color: "black",
                    anchor: "center",
                    align: "center",
                    font: {
                        size: 12,
                        weight: "bold",
                    },
                },
            } });
    }, [data, sentencemaskDomainChartData, commonChartOption]);
    var resultChartTitle = (0, react_1.useMemo)(function () {
        if (!data) {
            return;
        }
        return ["Reading Type", "Cognitive Type", "Tracking Type", "Exercise Type"];
    }, [data]);
    var readingChartData = (0, react_1.useMemo)(function () {
        if (!data) {
            return;
        }
        var sm = data.trainingList.find(function (f) { return f.taskName === "SentenceMask"; });
        var wo = data.trainingList.find(function (f) { return f.taskName === "WordOrdering"; });
        var kf = data.trainingList.find(function (f) { return f.taskName === "KeywordFinding"; });
        var cf = data.trainingList.find(function (f) { return f.taskName === "CategoryFinding"; });
        return {
            titleIndex: 0,
            labels: ["SentenceMask", "WordOrdering", "KeywordFinding", "CategoryFinding"],
            type: "radar",
            datasets: [
                {
                    label: "Me",
                    data: [(sm && sm.avgScore) || 0, (wo && wo.avgScore) || 0, (kf && kf.avgScore) || 0, (cf && cf.avgScore) || 0],
                    borderColor: "#009bde",
                    backgroundColor: "#009bde",
                    fill: false,
                },
                {
                    label: "Group",
                    data: [data.groupScoreList.SentenceMask || 0, data.groupScoreList.WordOrdering || 0, data.groupScoreList.KeywordFinding || 0, data.groupScoreList.CategoryFinding || 0],
                    borderColor: "#ada9bb",
                    backgroundColor: "#ada9bb",
                    fill: false,
                },
            ],
        };
    }, [data]);
    var readingChartOptions = (0, react_1.useMemo)(function () {
        if (!readingChartData || !commonResultChartOption || !resultChartTitle) {
            return;
        }
        return __assign(__assign({}, commonResultChartOption), { title: {
                display: true,
                text: resultChartTitle[readingChartData.titleIndex],
                color: "#464555",
                fontSize: 14,
                fontFamily: "'FontAwesome','Helvetica Neue', 'Helvetica', 'Arial', sans-serif",
            } });
    }, [resultChartTitle, readingChartData, commonResultChartOption]);
    var cognitiveChartData = (0, react_1.useMemo)(function () {
        if (!data) {
            return;
        }
        var vs = data.trainingList.find(function (f) { return f.taskName === "VisualSpan"; });
        var vc = data.trainingList.find(function (f) { return f.taskName === "VisualCounting"; });
        var tmt = data.trainingList.find(function (f) { return f.taskName === "TMT"; });
        var st = data.trainingList.find(function (f) { return f.taskName === "Stroop"; });
        return {
            titleIndex: 1,
            labels: ["VisualSpan", "VisualCounting", "TMT", "Stroop"],
            type: "radar",
            datasets: [
                {
                    label: "Me",
                    data: [(vs && vs.avgScore) || 0, (vc && vc.avgScore) || 0, (tmt && tmt.avgScore) || 0, (st && st.avgScore) || 0],
                    borderColor: "#009bde",
                    backgroundColor: "#009bde",
                    fill: false,
                },
                {
                    label: "Group",
                    data: [data.groupScoreList.VisualSpan || 0, data.groupScoreList.VisualCounting || 0, data.groupScoreList.TMT || 0, data.groupScoreList.Stroop || 0],
                    borderColor: "#ada9bb",
                    backgroundColor: "#ada9bb",
                    fill: false,
                },
            ],
        };
    }, [data]);
    var cognitiveChartOption = (0, react_1.useMemo)(function () {
        if (!cognitiveChartData || !commonResultChartOption || !resultChartTitle) {
            return;
        }
        return __assign(__assign({}, commonResultChartOption), { title: {
                display: true,
                text: resultChartTitle[cognitiveChartData.titleIndex],
                color: "#464555",
                fontSize: 14,
                fontFamily: "'FontAwesome','Helvetica Neue', 'Helvetica', 'Arial', sans-serif",
            } });
    }, [resultChartTitle, cognitiveChartData, commonResultChartOption]);
    var trackingChartData = (0, react_1.useMemo)(function () {
        if (!data) {
            return;
        }
        var st = data.trainingList.find(function (f) { return f.taskName === "SaccadeTracking"; });
        var pt = data.trainingList.find(function (f) { return f.taskName === "PursuitTracking"; });
        var at = data.trainingList.find(function (f) { return f.taskName === "AntiTracking"; });
        var set = data.trainingList.find(function (f) { return f.taskName === "SentenceTracking"; });
        return {
            titleIndex: 2,
            labels: ["SaccadeTracking", "PursuitTracking", "AntiTracking", "SentenceTracking"],
            type: "radar",
            datasets: [
                {
                    label: "Me",
                    data: [(st && st.avgScore) || 0, (pt && pt.avgScore) || 0, (at && at.avgScore) || 0, (set && set.avgScore) || 0],
                    borderColor: "#009bde",
                    backgroundColor: "#009bde",
                    fill: false,
                },
                {
                    label: "Group",
                    data: [data.groupScoreList.SaccadeTracking || 0, data.groupScoreList.PursuitTracking || 0, data.groupScoreList.AntiTracking || 0, data.groupScoreList.SentenceTracking || 0],
                    borderColor: "#ada9bb",
                    backgroundColor: "#ada9bb",
                    fill: false,
                },
            ],
        };
    }, [data]);
    var trackingChartOption = (0, react_1.useMemo)(function () {
        if (!trackingChartData || !commonResultChartOption || !resultChartTitle) {
            return;
        }
        return __assign(__assign({}, commonResultChartOption), { title: {
                display: true,
                text: resultChartTitle[trackingChartData.titleIndex],
                color: "#464555",
                fontSize: 14,
                fontFamily: "'FontAwesome','Helvetica Neue', 'Helvetica', 'Arial', sans-serif",
            } });
    }, [resultChartTitle, trackingChartData, commonResultChartOption]);
    var exerciseChartData = (0, react_1.useMemo)(function () {
        if (!data) {
            return;
        }
        var eh = data.trainingList.find(function (f) { return f.taskName === "ExerciseHorizontal"; });
        var ev = data.trainingList.find(function (f) { return f.taskName === "ExerciseVertical"; });
        var ehj = data.trainingList.find(function (f) { return f.taskName === "ExerciseHJump"; });
        var evj = data.trainingList.find(function (f) { return f.taskName === "ExerciseVJump"; });
        return {
            titleIndex: 3,
            labels: ["ExerciseHorizontal", "ExerciseVertical", "ExerciseHJump", "ExerciseVJump"],
            type: "radar",
            datasets: [
                {
                    label: "Me",
                    data: [(eh && eh.avgScore) || 0, (ev && ev.avgScore) || 0, (ehj && ehj.avgScore) || 0, (evj && evj.avgScore) || 0],
                    borderColor: "#009bde",
                    backgroundColor: "#009bde",
                    fill: false,
                },
                {
                    label: "Group",
                    data: [data.groupScoreList.ExerciseHorizontal || 0, data.groupScoreList.ExerciseVertical || 0, data.groupScoreList.ExerciseHJump || 0, data.groupScoreList.ExerciseVJump || 0],
                    borderColor: "#ada9bb",
                    backgroundColor: "#ada9bb",
                    fill: false,
                },
            ],
        };
    }, [data]);
    var exerciseChartOption = (0, react_1.useMemo)(function () {
        if (!exerciseChartData || !commonResultChartOption || !resultChartTitle) {
            return;
        }
        return __assign(__assign({}, commonResultChartOption), { title: {
                display: true,
                text: resultChartTitle[exerciseChartData.titleIndex],
                color: "#464555",
                fontSize: 14,
                fontFamily: "'FontAwesome','Helvetica Neue', 'Helvetica', 'Arial', sans-serif",
            } });
    }, [resultChartTitle, exerciseChartData, commonResultChartOption]);
    if (!data || !tier || !medal || !dayCD || !weekCD) {
        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
    }
    // console.log("data", data);
    return ((0, jsx_runtime_1.jsxs)(StyledReport, __assign({ id: "trainingReport" }, { children: [(0, jsx_runtime_1.jsxs)(StyledTitleBox, __assign({ id: "reportTitle" }, { children: [(0, jsx_runtime_1.jsxs)(StyledMainTitle, { children: [data.testeeNickname, "(", data.testeeID, ")\uC758 \uB9AC\uB354\uC2A4\uC544\uC774 \uD2B8\uB808\uC774\uB2DD \uC218\uD589\uB9AC\uD3EC\uD2B8"] }), (0, jsx_runtime_1.jsxs)(StyledDueTitle, { children: [data.startdate, " ~ ", data.enddate] })] })), (0, jsx_runtime_1.jsxs)(StyledInfoBox, __assign({ id: "reportInfo" }, { children: [(0, jsx_runtime_1.jsxs)(StyledInfoLeftBox, { children: [(0, jsx_runtime_1.jsxs)(StyledInfoText, { children: ["\uC218\uD589 \uAE30\uAD00 : ", data.agencyName, "(", data.agencyID, ")"] }), (0, jsx_runtime_1.jsxs)(StyledInfoText, { children: ["\uCD1D \uB204\uC801\uC810\uC218 : ", data.totScore.toLocaleString(), "\uC810"] }), (0, jsx_runtime_1.jsxs)(StyledInfoText, { children: ["\uC6D4\uAC04\uC810\uC218 : ", data.monthScore.toLocaleString(), "\uC810(", (0, dayjs_1.default)().format("YY년MM월,"), " ", data.monthScoreRank, "\uC704)"] }), (0, jsx_runtime_1.jsxs)(StyledInfoText, { children: ["\uAE30\uB85D 1 : ", data.firstScore.toLocaleString(), "\uC810(", data.firstScoreDate, " \uC774\uD6C4, ", tier, ", ", data.firstScoreRank, "\uC704)"] }), (0, jsx_runtime_1.jsxs)(StyledInfoText, { children: ["\uAE30\uB85D 2 : ", data.secondScore.toLocaleString(), "\uC810(", data.secondScoreDate, " \uC774\uD6C4)"] }), (0, jsx_runtime_1.jsxs)(StyledInfoText, { children: ["\uAE30\uAC04 \uB0B4 \uCD1D \uD68D\uB4DD \uC810\uC218 : ", data.dueScore.toLocaleString(), "\uC810"] })] }), (0, jsx_runtime_1.jsx)(StyledInfoRightBox, { children: (0, jsx_runtime_1.jsx)("img", { src: medal, alt: "Medal" }) })] })), (0, jsx_runtime_1.jsxs)(StyledChartWrapper, __assign({ id: "reportChart" }, { children: [(0, jsx_runtime_1.jsx)(StyledChartTitle, { children: "\uD2B8\uB808\uC774\uB2DD \uC218\uD589 \uD604\uD669" }), (0, jsx_runtime_1.jsxs)(StyledChartBoxWrapper, { children: [(0, jsx_runtime_1.jsxs)(StyledChartBox, { children: [(0, jsx_runtime_1.jsx)(StyledChartBoxTitle, { children: "\uC218\uD589\uB960" }), (0, jsx_runtime_1.jsx)(StyledChart, { children: (0, jsx_runtime_1.jsx)(react_chartjs_2_1.Doughnut, { id: "RatioChart", data: ratioChartData, options: ratioChartOptions, datasetKeyProvider: datasetKeyProvider }) })] }), (0, jsx_runtime_1.jsxs)(StyledChartBox, { children: [(0, jsx_runtime_1.jsx)(StyledChartBoxTitle, { children: "\uD3C9\uADE0 \uC218\uD589 \uC810\uC218" }), (0, jsx_runtime_1.jsx)(StyledChart, { children: (0, jsx_runtime_1.jsx)(react_chartjs_2_1.Doughnut, { id: "AvgScoreChart", data: avgScoreChartData, options: avgScoreChartOptions, datasetKeyProvider: datasetKeyProvider }) })] }), (0, jsx_runtime_1.jsxs)(StyledChartBox, { children: [(0, jsx_runtime_1.jsx)(StyledChartBoxTitle, { children: "\uC77C \uD3C9\uADE0 \uC218\uD589 \uC2DC\uAC04" }), (0, jsx_runtime_1.jsx)(StyledChart, { children: (0, jsx_runtime_1.jsx)(react_chartjs_2_1.Doughnut, { id: "AvgDurationChart", data: avgDurationChartData, options: avgDurationChartOptions, datasetKeyProvider: datasetKeyProvider }) })] })] })] })), (0, jsx_runtime_1.jsxs)(StyledChartSpan, { children: ["* \uAE30\uAD00 \uD3C9\uADE0 : \uD559\uC0DD\uC774 \uC18D\uD55C \uAE30\uAD00(", data.agencyName, ")\uC758 \uC804\uCCB4 \uD559\uC0DD\uB4E4\uC758 \uD3C9\uADE0 \uC810\uC218"] }), (0, jsx_runtime_1.jsxs)(StyledScoreChartWrapper, __assign({ id: "reportScoreChart" }, { children: [(0, jsx_runtime_1.jsx)(StyledScoreChartTitle, { children: "\uD2B8\uB808\uC774\uB2DD \uB808\uBCA8\uC2A4\uCF54\uC5B4 \uCD94\uC138" }), (0, jsx_runtime_1.jsxs)(StyledScoreChartBoxWrapper, { children: [(0, jsx_runtime_1.jsxs)(StyledScoreChartBoxTitle, { children: ["\uC77C\uBCC4 (", dayDD.startDate, " ~ ", dayDD.endDate, ")"] }), (0, jsx_runtime_1.jsx)(StyledScoreChartBox, { children: (0, jsx_runtime_1.jsx)(react_chartjs_2_1.Line, { id: "levelScoreDayChart", data: dayCD, options: dayCO }) })] }), (0, jsx_runtime_1.jsxs)(StyledScoreChartBoxWrapper, { children: [(0, jsx_runtime_1.jsxs)(StyledScoreChartBoxTitle, { children: ["\uC8FC\uBCC4 (", weekDD.startDate, " ~ ", weekDD.endDate, ")"] }), (0, jsx_runtime_1.jsx)(StyledScoreChartBox, { children: (0, jsx_runtime_1.jsx)(react_chartjs_2_1.Line, { id: "levelScoreWeekChart", data: weekCD, options: weekCO }) })] }), (0, jsx_runtime_1.jsx)(StyledScoreChartCaption, { children: "* \uB808\uBCA8\uACFC \uC218\uD589\uC810\uC218\uAC00 \uBC18\uC601\uB41C \uC810\uC218\uC785\uB2C8\uB2E4. 1\uB808\uBCA8\uB2F9 20\uC810\uC774 \uAC00\uC0B0\uB429\uB2C8\uB2E4. (\uB808\uBCA8\uC2A4\uCF54\uC5B4 = \uC810\uC218 + \uB808\uBCA8 x 20)" })] })), (0, jsx_runtime_1.jsxs)(StyledGridWrapper, __assign({ id: "reportTable" }, { children: [(0, jsx_runtime_1.jsx)(StyledGridTitle, { children: "\uAC1C\uBCC4 \uD2B8\uB808\uC774\uB2DD \uC218\uD589 \uACB0\uACFC" }), (0, jsx_runtime_1.jsxs)(StyledGrid, { children: [(0, jsx_runtime_1.jsxs)(StyledGridRow, __assign({ isMobileWidth: isMobileWidth }, { children: [(0, jsx_runtime_1.jsx)(StyledGridCell, __assign({ header: true, isMobileWidth: isMobileWidth, style: { gridRow: isMobileWidth ? "1/3" : "auto" } }, { children: "\uD560\uB2F9\uB41C \uACFC\uC81C" })), (0, jsx_runtime_1.jsx)(StyledGridCell, __assign({ order: 1, header: true, isMobileWidth: isMobileWidth }, { children: "\uB808\uBCA8" })), (0, jsx_runtime_1.jsx)(StyledGridCell, __assign({ order: 3, header: true, isMobileWidth: isMobileWidth }, { children: "\uC77C \uC218\uD589\uD69F\uC218" })), (0, jsx_runtime_1.jsx)(StyledGridCell, __assign({ order: 4, header: true, isMobileWidth: isMobileWidth, style: { display: isMobileWidth ? "none" : "flex" } }, { children: "\uC8FC\uB2F9 \uC218\uD589\uC77C" })), (0, jsx_runtime_1.jsx)(StyledGridCell, __assign({ order: 6, header: true, isMobileWidth: isMobileWidth }, { children: "\uC218\uD589\uB960" })), (0, jsx_runtime_1.jsx)(StyledGridCell, __assign({ order: 8, header: true, isMobileWidth: isMobileWidth }, { children: "\uD3C9\uADE0 \uC810\uC218" })), (0, jsx_runtime_1.jsx)(StyledGridCell, __assign({ order: 2, header: true, isMobileWidth: isMobileWidth }, { children: "\uC5B8\uC5B4" })), (0, jsx_runtime_1.jsx)(StyledGridCell, __assign({ order: 5, header: true, isMobileWidth: isMobileWidth }, { children: "\uCD1D \uC218\uD589\uD69F\uC218" })), (0, jsx_runtime_1.jsx)(StyledGridCell, __assign({ order: 7, header: true, isMobileWidth: isMobileWidth }, { children: "\uCD1D \uC218\uD589\uC2DC\uAC04" })), (0, jsx_runtime_1.jsx)(StyledGridCell, __assign({ order: 9, header: true, isMobileWidth: isMobileWidth }, { children: "\uCD1D \uD68D\uB4DD\uC810\uC218" }))] })), trainingTypes.map(function (t, i) {
                                var returnComponents = [];
                                returnComponents.push.apply(returnComponents, t.names.map(function (task, j) {
                                    var find = data.trainingList.find(function (f) { return f.taskName === task.split(" ").join(""); });
                                    var hideLanguage = (find === null || find === void 0 ? void 0 : find.taskType) === "Reading" || (find === null || find === void 0 ? void 0 : find.taskName) === "SentenceTracking" ? false : true;
                                    return (0, jsx_runtime_1.jsx)(GridRow_1.default, { find: find, isMobileWidth: isMobileWidth, task: task, hideLanguage: hideLanguage }, "grid_".concat(i, "_").concat(j));
                                }));
                                returnComponents.push((0, jsx_runtime_1.jsx)(GridRow_1.default, { header: true, isMobileWidth: isMobileWidth, find: data.typeSummary[t.type], task: "".concat(t.type, " \uD3C9\uADE0"), hideLanguage: false }, "grid_".concat(i)));
                                return returnComponents;
                            }), (0, jsx_runtime_1.jsx)(GridRow_1.default, { header: true, isMobileWidth: isMobileWidth, find: data.typeSummary.All, task: "\uC804\uCCB4 \uD3C9\uADE0", hideLanguage: true })] })] })), (0, jsx_runtime_1.jsxs)(StyledSentenceMaskAnalysisWrapper, __assign({ id: "smAnalysis" }, { children: [(0, jsx_runtime_1.jsx)(StyledSentenceMaskAnalysisTitle, { children: "\uAE00 \uC77D\uAE30 \uD2B8\uB808\uC774\uB2DD \uBD84\uC11D" }), (0, jsx_runtime_1.jsxs)(StyledSentenceMaskAnalysisBoxWrapper, { children: [(0, jsx_runtime_1.jsxs)(StyledSentenceMaskAnalysisBox, { children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h3", { children: "\uC77D\uC740 \uAE00" }), (0, jsx_runtime_1.jsx)("div", __assign({ className: "boxRow" }, { children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("span", __assign({ className: "me" }, { children: data.sentencemaskAnalysis.readingCount })), "\uD3B8"] }) }))] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h3", { children: "\uAE30\uAD00 \uD3C9\uADE0" }), (0, jsx_runtime_1.jsx)("div", __assign({ className: "boxRow" }, { children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("span", __assign({ className: "group" }, { children: data.sentencemaskAnalysis.agencyAvgReadingCount })), "\uD3B8"] }) }))] })] }), (0, jsx_runtime_1.jsx)(StyledSentenceMaskAnalysisChartBox, { children: (0, jsx_runtime_1.jsx)(react_chartjs_2_1.Doughnut, { id: "SentencemaskDomainChart", data: sentencemaskDomainChartData, options: sentencemaskDomainChartOptions }) }), (0, jsx_runtime_1.jsxs)(StyledSentenceMaskAnalysisBox, { children: [(0, jsx_runtime_1.jsx)("h3", { children: "\uC77D\uC740 \uAE00 \uC815\uBCF4" }), (0, jsx_runtime_1.jsxs)("div", __assign({ className: "boxRow" }, { children: ["\uCD5C\uADFC \uC2DC\uC120\uC77D\uAE30\uC9C4\uB2E8 \uD3C9\uADE0 \uC18D\uB3C4", (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("span", __assign({ className: "reading" }, { children: data.sentencemaskAnalysis.recentReadingSpeed.reading_speed })), "\uC5B4\uC808/\uBD84"] })] })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: "boxRow" }, { children: ["\uD604\uC7AC \uD2B8\uB808\uC774\uB2DD \uD3C9\uADE0 \uC18D\uB3C4", (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("span", __assign({ className: "sm" }, { children: data.sentencemaskAnalysis.recentSMReadingSpeed })), "\uC5B4\uC808/\uBD84"] })] }))] })] }), (0, jsx_runtime_1.jsx)(StyledSentenceMaskAnalysisCaption, { children: "* Sentence Mask\uB97C \uD1B5\uD574 \uC81C\uACF5\uB41C \uC77D\uAE30 \uC790\uB8CC\uC785\uB2C8\uB2E4." })] })), (0, jsx_runtime_1.jsxs)(StyledResultWrapper, __assign({ id: "reportResult" }, { children: [(0, jsx_runtime_1.jsx)(StyledResultTitle, { children: "\uAC1C\uBCC4 \uD2B8\uB808\uC774\uB2DD \uC218\uD589 \uACB0\uACFC" }), (0, jsx_runtime_1.jsxs)(StyledResultRow, { children: [(0, jsx_runtime_1.jsx)(StyledResultChartBox, { children: (0, jsx_runtime_1.jsx)(react_chartjs_2_1.Radar, { id: "ReadingChart", data: readingChartData, options: readingChartOptions, datasetKeyProvider: datasetKeyProvider }) }), (0, jsx_runtime_1.jsxs)(StyledResultTextBox, { children: [(0, jsx_runtime_1.jsx)(StyledResultTextTitle, { children: "Reading Type" }), (0, jsx_runtime_1.jsxs)(StyledResultText, { children: [(0, jsx_runtime_1.jsx)("span", { children: "\u00A0\uC77D\uAE30\uB97C \uAE30\uBC18\uC73C\uB85C \uC18D\uB3C4 \uC81C\uC5B4, \uC548\uC815\uC131 \uD5A5\uC0C1, \uBB38\uC7A5 \uC644\uC131, \uC5B4\uD718\uC758 \uD0D0\uC0C9 \uBC0F \uD310\uB2E8 \uB2A5\uB825\uC744 \uD5A5\uC0C1\uC2DC\uD0A4\uB294 \uD6C8\uB828\uC785\uB2C8\uB2E4." }), (0, jsx_runtime_1.jsxs)("ul", { children: [(0, jsx_runtime_1.jsx)("li", { children: "Word Ordering : \uB4A4\uC11E\uC5EC \uC788\uB294 \uC5B4\uC808\uB4E4\uC744 \uC815\uC0C1\uC801\uC778 \uBB38\uC7A5\uC774 \uB418\uB3C4\uB85D \uC21C\uC11C\uB97C \uB9DE\uCDB0\uC57C \uD569\uB2C8\uB2E4." }), (0, jsx_runtime_1.jsx)("li", { children: "Sentence Mask : \uC77C\uC815\uD55C \uC18D\uB3C4\uB85C, \uC21C\uCC28\uC801\uC73C\uB85C \uBCF4\uC5EC\uC9C0\uB294 \uAE00\uC744 \uC18D\uB3C4\uC5D0 \uB9DE\uCDB0 \uC77D\uC5B4\uC57C \uD569\uB2C8\uB2E4." }), (0, jsx_runtime_1.jsx)("li", { children: "Keyword Finding : \uAE00\uC5D0\uC11C \uD2B9\uC815 \uD0A4\uC6CC\uB4DC\uB97C \uBE60\uB974\uAC8C \uD0D0\uC9C0\uD574\uC57C \uD569\uB2C8\uB2E4." }), (0, jsx_runtime_1.jsx)("li", { children: "Category Finding : \uAE00\uC5D0\uC11C \uD2B9\uC815 \uCE74\uD14C\uACE0\uB9AC(\uBC94\uC8FC)\uC5D0 \uD574\uB2F9\uD558\uB294 \uB2E8\uC5B4\uB4E4\uC744 \uBE60\uB974\uAC8C \uD0D0\uC9C0\uD574\uC57C \uD569\uB2C8\uB2E4." })] })] })] })] }), (0, jsx_runtime_1.jsx)(StyledDashHR, {}), (0, jsx_runtime_1.jsxs)(StyledResultRow, { children: [(0, jsx_runtime_1.jsx)(StyledResultChartBox, { children: (0, jsx_runtime_1.jsx)(react_chartjs_2_1.Radar, { id: "CognitiveChart", data: cognitiveChartData, options: cognitiveChartOption, datasetKeyProvider: datasetKeyProvider }) }), (0, jsx_runtime_1.jsxs)(StyledResultTextBox, { children: [(0, jsx_runtime_1.jsx)(StyledResultTextTitle, { children: "Cognitive Type" }), (0, jsx_runtime_1.jsxs)(StyledResultText, { children: [(0, jsx_runtime_1.jsx)("span", { children: "\u00A0\uD559\uC2B5\uC758 \uAE30\uCD08\uAC00 \uB418\uB294 \uC2DC\uC9C0\uAC01, \uC778\uC9C0\uB2A5\uB825, \uD310\uB2E8\uB825 \uBC0F \uD589\uB3D9 \uC81C\uC5B4 \uB2A5\uB825\uC744 \uD5A5\uC0C1\uC2DC\uD0A4\uB294 \uD6C8\uB828\uC785\uB2C8\uB2E4." }), (0, jsx_runtime_1.jsxs)("ul", { children: [(0, jsx_runtime_1.jsx)("li", { children: "Visual Span : \uC21C\uAC04\uC801\uC73C\uB85C \uC81C\uC2DC\uB418\uB294 \uBB34\uC758\uBBF8\uD55C \uAE00\uC790\uB4E4\uC744 \uD55C \uB208\uC5D0 \uCD5C\uB300\uD55C \uB9CE\uC774 \uAE30\uC5B5\uD574\uC57C \uD569\uB2C8\uB2E4." }), (0, jsx_runtime_1.jsx)("li", { children: "Visual Counting : \uC21C\uAC04\uC801\uC73C\uB85C \uC81C\uC2DC\uB418\uB294 \uC810\uC758 \uAC1C\uC218\uB97C \uD328\uD134\uD654\uD558\uC5EC \uC138\uC57C \uD569\uB2C8\uB2E4." }), (0, jsx_runtime_1.jsx)("li", { children: "Trail Making Test(TMT) : \uC5B4\uC9C0\uB7FD\uAC8C \uBC30\uCE58\uB41C \uC22B\uC790\uC640 \uBB38\uC790\uB4E4\uC744 \uC21C\uC11C\uB300\uB85C \uBE60\uB974\uAC8C \uC5F0\uACB0\uD574\uC57C \uD569\uB2C8\uB2E4." }), (0, jsx_runtime_1.jsx)("li", { children: "Stroop Test : \uC81C\uC2DC\uB418\uB294 \uBB38\uC7A5\uC758 \uB0B4\uC6A9\uACFC \uC0C9\uAE54\uC744 \uBE44\uAD50\uD558\uC5EC \uBE60\uB974\uAC8C \uD310\uB2E8\uD574\uC57C \uD569\uB2C8\uB2E4." })] })] })] })] }), (0, jsx_runtime_1.jsx)(StyledDashHR, {}), (0, jsx_runtime_1.jsxs)(StyledResultRow, { children: [(0, jsx_runtime_1.jsx)(StyledResultChartBox, { children: (0, jsx_runtime_1.jsx)(react_chartjs_2_1.Radar, { id: "TrackingChart", data: trackingChartData, options: trackingChartOption, datasetKeyProvider: datasetKeyProvider }) }), (0, jsx_runtime_1.jsxs)(StyledResultTextBox, { children: [(0, jsx_runtime_1.jsx)(StyledResultTextTitle, { children: "Tracking Type" }), (0, jsx_runtime_1.jsxs)(StyledResultText, { children: [(0, jsx_runtime_1.jsx)("span", { children: "\u00A0\uC77D\uAE30\uC640 \uC2DC\uC9C0\uAC01\uC758 \uAE30\uBCF8\uC774 \uB418\uB294 \uC548\uAD6C\uC6B4\uB3D9\uC758 \uC81C\uC5B4\uC640 \uD1B5\uC81C, \uC9C0\uAC01 \uC9D1\uC911\uB825\uC744 \uD5A5\uC0C1\uC2DC\uD0B5\uB2C8\uB2E4. \uC2DC\uC120\uCD94\uC801\uC7A5\uCE58\uB97C \uD65C\uC6A9\uD558\uBA70, \uAC8C\uC784 \uD615\uC2DD\uC73C\uB85C \uC9C4\uD589\uD569\uB2C8\uB2E4." }), (0, jsx_runtime_1.jsxs)("ul", { children: [(0, jsx_runtime_1.jsx)("li", { children: "Saccade Tracking : \uC0C1\uD558\uC88C\uC6B0\uC5D0 \uB098\uD0C0\uB098\uB294 \uC810\uC744 \uBE60\uB974\uACE0 \uC815\uD655\uD558\uAC8C \uC6C0\uC9C1\uC5EC \uC2DC\uC120\uC744 \uACE0\uC815\uC2DC\uCF1C\uC57C \uD569\uB2C8\uB2E4." }), (0, jsx_runtime_1.jsx)("li", { children: "Pursuit Tracking : \uC9C1\uC120 \uB610\uB294 \uC6D0\uC6B4\uB3D9 \uD558\uB294 \uC810\uC744 \uBD80\uB4DC\uB7FD\uACE0 \uC548\uC815\uC801\uC73C\uB85C \uCD94\uC801\uD558\uBA70 \uBCF4\uC544\uC57C \uD569\uB2C8\uB2E4." }), (0, jsx_runtime_1.jsx)("li", { children: "Anti Saccade Tracking : \uB098\uD0C0\uB09C \uC790\uADF9\uBB3C\uC744 \uBE60\uB974\uAC8C \uD310\uB2E8\uD558\uC5EC \uC2DC\uC120\uC744 \uBCF4\uB0B4\uAC70\uB098 \uBA48\uCD94\uC5B4\uC57C \uD569\uB2C8\uB2E4." }), (0, jsx_runtime_1.jsx)("li", { children: "Sentence Tracking : \uAE00\uC744 \uC21C\uC11C\uB300\uB85C \uBE60\uC9D0\uC5C6\uC774 \uC77D\uC5B4\uC57C\uB9CC \uC2DC\uC120\uC5D0 \uB530\uB77C \uB2E4\uC74C \uBD80\uBD84\uC774 \uBCF4\uC5EC\uC9D1\uB2C8\uB2E4." })] })] })] })] }), (0, jsx_runtime_1.jsx)(StyledDashHR, {}), (0, jsx_runtime_1.jsxs)(StyledResultRow, { children: [(0, jsx_runtime_1.jsx)(StyledResultChartBox, { children: (0, jsx_runtime_1.jsx)(react_chartjs_2_1.Radar, { id: "ExerciseChart", data: exerciseChartData, options: exerciseChartOption, datasetKeyProvider: datasetKeyProvider }) }), (0, jsx_runtime_1.jsxs)(StyledResultTextBox, { children: [(0, jsx_runtime_1.jsx)(StyledResultTextTitle, { children: "Exercise Type" }), (0, jsx_runtime_1.jsxs)(StyledResultText, { children: [(0, jsx_runtime_1.jsx)("span", { children: "\u00A0\uC77D\uAE30 \uACFC\uC815\uC758 \uD575\uC2EC \uC2DC\uC120\uC774\uB3D9\uC778 \uB3C4\uC57D\uC548\uAD6C\uC6B4\uB3D9(saccade)\uC744 \uBE60\uB974\uACE0 \uC815\uD655\uD558\uAC8C \uD6C8\uB828\uD569\uB2C8\uB2E4. \uC2DC\uC120\uCD94\uC801\uC7A5\uCE58\uB97C \uD65C\uC6A9\uD569\uB2C8\uB2E4." }), (0, jsx_runtime_1.jsxs)("ul", { children: [(0, jsx_runtime_1.jsx)("li", { children: "Horizontal Sweep : \uC218\uD3C9\uBC29\uD5A5\uC73C\uB85C \uCD5C\uB300 \uD3ED\uC758 \uC2DC\uC120\uC774\uB3D9\uC744 \uD6C8\uB828\uD569\uB2C8\uB2E4." }), (0, jsx_runtime_1.jsx)("li", { children: "Vertical Sweep : \uC218\uC9C1\uBC29\uD5A5\uC73C\uB85C \uCD5C\uB300 \uD3ED\uC758 \uC2DC\uC120\uC774\uB3D9\uC744 \uD6C8\uB828\uD569\uB2C8\uB2E4." }), (0, jsx_runtime_1.jsx)("li", { children: "Horizontal Jump : \uC77D\uAE30\uC5D0 \uD544\uC694\uD55C \uB108\uBE44\uC758 \uC218\uD3C9\uBC29\uD5A5 \uC2DC\uC120\uC774\uB3D9\uC744 \uD6C8\uB828\uD569\uB2C8\uB2E4." }), (0, jsx_runtime_1.jsx)("li", { children: "Vertical Jump : \uC77D\uAE30\uC5D0 \uD544\uC694\uD55C \uB108\uBE44\uC758 \uC218\uC9C1\uBC29\uD5A5 \uC2DC\uC120\uC774\uB3D9\uC744 \uD6C8\uB828\uD569\uB2C8\uB2E4." })] })] })] })] })] }))] })));
});
exports.default = TrainingReport;
var StyledWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  margin-bottom: 2em;\n"], ["\n  margin-bottom: 2em;\n"])));
var StyledHeaderTitle = styled_components_1.default.h2(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  font-size: 1.6em;\n\n  @media screen and (min-width: 800px) {\n    font-size: 1.8em;\n  }\n"], ["\n  font-size: 1.6em;\n\n  @media screen and (min-width: 800px) {\n    font-size: 1.8em;\n  }\n"])));
var StyledReport = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  width: 100%;\n  max-width: 1024px;\n  margin: 0;\n  padding: 1em;\n  font-size: 62.5%; // 16px -> 10px\n  position: relative;\n  color: #464555;\n  transition: 0.2s;\n  user-select: none;\n\n  &,\n  & * {\n    box-sizing: border-box;\n  }\n"], ["\n  width: 100%;\n  max-width: 1024px;\n  margin: 0;\n  padding: 1em;\n  font-size: 62.5%; // 16px -> 10px\n  position: relative;\n  color: #464555;\n  transition: 0.2s;\n  user-select: none;\n\n  &,\n  & * {\n    box-sizing: border-box;\n  }\n"])));
var StyledTitleBox = (0, styled_components_1.default)(StyledWrapper)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  height: 100px;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n"], ["\n  height: 100px;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n"])));
var StyledMainTitle = styled_components_1.default.h2(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  margin: 0;\n  display: flex;\n  flex-wrap: nowrap;\n  text-align: center;\n  font-size: 1.6em;\n\n  @media screen and (min-width: 500px) {\n    font-size: 2em;\n  }\n\n  @media screen and (min-width: 800px) {\n    font-size: 2.5em;\n  }\n"], ["\n  margin: 0;\n  display: flex;\n  flex-wrap: nowrap;\n  text-align: center;\n  font-size: 1.6em;\n\n  @media screen and (min-width: 500px) {\n    font-size: 2em;\n  }\n\n  @media screen and (min-width: 800px) {\n    font-size: 2.5em;\n  }\n"])));
var StyledDueTitle = styled_components_1.default.h3(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  margin: 5px 0;\n  font-size: 1.4em;\n\n  @media screen and (min-width: 500px) {\n    font-size: 1.6em;\n  }\n\n  @media screen and (min-width: 800px) {\n    font-size: 1.8em;\n  }\n"], ["\n  margin: 5px 0;\n  font-size: 1.4em;\n\n  @media screen and (min-width: 500px) {\n    font-size: 1.6em;\n  }\n\n  @media screen and (min-width: 800px) {\n    font-size: 1.8em;\n  }\n"])));
var StyledInfoBox = (0, styled_components_1.default)(StyledWrapper)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  height: 120px;\n  display: flex;\n  align-items: center;\n"], ["\n  height: 120px;\n  display: flex;\n  align-items: center;\n"])));
var StyledInfoLeftBox = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  flex: 1;\n  height: 100%;\n  font-size: 1.4em;\n"], ["\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  flex: 1;\n  height: 100%;\n  font-size: 1.4em;\n"])));
var StyledInfoText = styled_components_1.default.span(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  height: ", "%;\n  display: flex;\n  align-items: center;\n"], ["\n  height: ", "%;\n  display: flex;\n  align-items: center;\n"])), 100 / 6);
var StyledInfoRightBox = styled_components_1.default.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  width: 80px;\n  height: 100%;\n\n  display: flex;\n  justify-content: center;\n  align-items: center;\n\n  img {\n    height: 100%;\n  }\n"], ["\n  width: 80px;\n  height: 100%;\n\n  display: flex;\n  justify-content: center;\n  align-items: center;\n\n  img {\n    height: 100%;\n  }\n"])));
var StyledChartWrapper = styled_components_1.default.div(templateObject_11 || (templateObject_11 = __makeTemplateObject([""], [""])));
var StyledChartTitle = (0, styled_components_1.default)(StyledHeaderTitle)(templateObject_12 || (templateObject_12 = __makeTemplateObject([""], [""])));
var StyledChartBoxWrapper = (0, styled_components_1.default)(StyledWrapper)(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  display: flex;\n  flex-flow: row wrap;\n  justify-content: center;\n  align-items: center;\n  gap: 1em;\n"], ["\n  display: flex;\n  flex-flow: row wrap;\n  justify-content: center;\n  align-items: center;\n  gap: 1em;\n"])));
var StyledChartBox = styled_components_1.default.div(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  width: 300px;\n  height: 300px;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  border: 1px solid #aaa9bc;\n"], ["\n  width: 300px;\n  height: 300px;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  border: 1px solid #aaa9bc;\n"])));
var StyledChartBoxTitle = styled_components_1.default.h3(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n  width: 100%;\n  height: 30px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: 1.6em;\n  margin: 0;\n"], ["\n  width: 100%;\n  height: 30px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: 1.6em;\n  margin: 0;\n"])));
var StyledChart = styled_components_1.default.div(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n  width: calc(100% - 1em);\n  height: calc(100% - 30px - 1.5em);\n  margin: 0.5em;\n  margin-bottom: 1em;\n"], ["\n  width: calc(100% - 1em);\n  height: calc(100% - 30px - 1.5em);\n  margin: 0.5em;\n  margin-bottom: 1em;\n"])));
var StyledChartSpan = styled_components_1.default.span(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n  font-size: 1.2em;\n"], ["\n  font-size: 1.2em;\n"])));
var StyledScoreChartWrapper = (0, styled_components_1.default)(StyledWrapper)(templateObject_18 || (templateObject_18 = __makeTemplateObject([""], [""])));
var StyledScoreChartTitle = (0, styled_components_1.default)(StyledHeaderTitle)(templateObject_19 || (templateObject_19 = __makeTemplateObject([""], [""])));
var StyledScoreChartBoxWrapper = styled_components_1.default.div(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n  width: 100%;\n  height: 280px;\n  margin-bottom: 10px;\n"], ["\n  width: 100%;\n  height: 280px;\n  margin-bottom: 10px;\n"])));
var StyledScoreChartBoxTitle = styled_components_1.default.h3(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n  font-size: 1.4em;\n  height: 30px;\n  display: flex;\n  align-items: center;\n  margin: 0;\n"], ["\n  font-size: 1.4em;\n  height: 30px;\n  display: flex;\n  align-items: center;\n  margin: 0;\n"])));
var StyledScoreChartBox = styled_components_1.default.div(templateObject_22 || (templateObject_22 = __makeTemplateObject(["\n  height: 250px;\n"], ["\n  height: 250px;\n"])));
var StyledScoreChartCaption = styled_components_1.default.span(templateObject_23 || (templateObject_23 = __makeTemplateObject(["\n  font-size: 1.2em;\n"], ["\n  font-size: 1.2em;\n"])));
var StyledGridWrapper = (0, styled_components_1.default)(StyledWrapper)(templateObject_24 || (templateObject_24 = __makeTemplateObject([""], [""])));
var StyledGridTitle = (0, styled_components_1.default)(StyledHeaderTitle)(templateObject_25 || (templateObject_25 = __makeTemplateObject([""], [""])));
var StyledGrid = styled_components_1.default.div(templateObject_26 || (templateObject_26 = __makeTemplateObject(["\n  display: grid;\n  grid-template-rows: repeat(17, 1fr);\n  grid-template-columns: 1fr;\n  border-top: 1px solid #ada9bb;\n  border-left: 1px solid #ada9bb;\n  border-collapse: collapse;\n"], ["\n  display: grid;\n  grid-template-rows: repeat(17, 1fr);\n  grid-template-columns: 1fr;\n  border-top: 1px solid #ada9bb;\n  border-left: 1px solid #ada9bb;\n  border-collapse: collapse;\n"])));
var StyledGridRow = styled_components_1.default.div(templateObject_27 || (templateObject_27 = __makeTemplateObject(["\n  width: 100%;\n  min-height: 3em;\n  display: grid;\n  justify-content: center;\n  align-items: center;\n  border-collapse: collapse;\n\n  grid-template-rows: 1fr 1fr;\n  grid-template-columns: 1.3fr repeat(4, 1fr);\n\n  @media screen and (min-width: 501px) {\n    min-height: 4em;\n    grid-template-rows: 1fr;\n    grid-template-columns: 1fr repeat(9, 0.5fr);\n  }\n"], ["\n  width: 100%;\n  min-height: 3em;\n  display: grid;\n  justify-content: center;\n  align-items: center;\n  border-collapse: collapse;\n\n  grid-template-rows: 1fr 1fr;\n  grid-template-columns: 1.3fr repeat(4, 1fr);\n\n  @media screen and (min-width: 501px) {\n    min-height: 4em;\n    grid-template-rows: 1fr;\n    grid-template-columns: 1fr repeat(9, 0.5fr);\n  }\n"])));
var StyledGridCell = styled_components_1.default.div(templateObject_32 || (templateObject_32 = __makeTemplateObject(["\n  height: 100%;\n  padding: 0.5em 0;\n  border-right: 1px solid #ada9bb;\n  border-bottom: 1px solid #ada9bb;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n\n  ", "\n  ", "\n"], ["\n  height: 100%;\n  padding: 0.5em 0;\n  border-right: 1px solid #ada9bb;\n  border-bottom: 1px solid #ada9bb;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n\n  ", "\n  ", "\n"])), function (props) {
    return props.header
        ? (0, styled_components_1.css)(templateObject_28 || (templateObject_28 = __makeTemplateObject(["\n          font-size: 1.2em;\n          font-weight: 700;\n          background: #eeedff;\n          @media screen and (min-width: 1024px) {\n            font-size: 1.4em;\n          }\n        "], ["\n          font-size: 1.2em;\n          font-weight: 700;\n          background: #eeedff;\n          @media screen and (min-width: 1024px) {\n            font-size: 1.4em;\n          }\n        "]))) : (0, styled_components_1.css)(templateObject_29 || (templateObject_29 = __makeTemplateObject(["\n          font-size: 1.1em;\n          @media screen and (min-width: 1024px) {\n            font-size: 1.2em;\n          }\n        "], ["\n          font-size: 1.1em;\n          @media screen and (min-width: 1024px) {\n            font-size: 1.2em;\n          }\n        "])));
}, function (props) {
    return !props.isMobileWidth && props.order
        ? (0, styled_components_1.css)(templateObject_30 || (templateObject_30 = __makeTemplateObject(["\n          order: ", ";\n        "], ["\n          order: ", ";\n        "])), props.order) : (0, styled_components_1.css)(templateObject_31 || (templateObject_31 = __makeTemplateObject([""], [""])));
});
var StyledSentenceMaskAnalysisWrapper = (0, styled_components_1.default)(StyledWrapper)(templateObject_33 || (templateObject_33 = __makeTemplateObject([""], [""])));
var StyledSentenceMaskAnalysisTitle = (0, styled_components_1.default)(StyledHeaderTitle)(templateObject_34 || (templateObject_34 = __makeTemplateObject([""], [""])));
var StyledSentenceMaskAnalysisBoxWrapper = styled_components_1.default.div(templateObject_35 || (templateObject_35 = __makeTemplateObject(["\n  display: flex;\n  gap: 1em;\n  margin-bottom: 10px;\n  justify-content: space-evenly;\n  flex-wrap: wrap;\n  min-height: 250px;\n  > div {\n    border: 1px solid #ada9bb;\n  }\n"], ["\n  display: flex;\n  gap: 1em;\n  margin-bottom: 10px;\n  justify-content: space-evenly;\n  flex-wrap: wrap;\n  min-height: 250px;\n  > div {\n    border: 1px solid #ada9bb;\n  }\n"])));
var StyledSentenceMaskAnalysisBox = styled_components_1.default.div(templateObject_36 || (templateObject_36 = __makeTemplateObject(["\n  min-width: 180px;\n  min-height: 250px;\n  padding: 10px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-direction: column;\n  font-size: 1.4em;\n  > div {\n    width: 100%;\n    flex: 1;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    flex-direction: column;\n  }\n  h3 {\n    width: 100%;\n    font-weight: 600;\n    margin: 0;\n    flex: 1;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n  .boxRow {\n    width: 100%;\n    flex: 2;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n  .me,\n  .group,\n  .reading,\n  .sm {\n    font-weight: 700;\n  }\n\n  .me {\n    font-size: 2em;\n  }\n  .group {\n    font-size: 1.6em;\n  }\n  .reading {\n    font-size: 1.6em;\n  }\n  .sm {\n    font-size: 1.4em;\n  }\n"], ["\n  min-width: 180px;\n  min-height: 250px;\n  padding: 10px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-direction: column;\n  font-size: 1.4em;\n  > div {\n    width: 100%;\n    flex: 1;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    flex-direction: column;\n  }\n  h3 {\n    width: 100%;\n    font-weight: 600;\n    margin: 0;\n    flex: 1;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n  .boxRow {\n    width: 100%;\n    flex: 2;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n  .me,\n  .group,\n  .reading,\n  .sm {\n    font-weight: 700;\n  }\n\n  .me {\n    font-size: 2em;\n  }\n  .group {\n    font-size: 1.6em;\n  }\n  .reading {\n    font-size: 1.6em;\n  }\n  .sm {\n    font-size: 1.4em;\n  }\n"])));
var StyledSentenceMaskAnalysisChartBox = styled_components_1.default.div(templateObject_37 || (templateObject_37 = __makeTemplateObject(["\n  padding: 10px;\n  height: 250px;\n"], ["\n  padding: 10px;\n  height: 250px;\n"])));
var StyledSentenceMaskAnalysisCaption = styled_components_1.default.span(templateObject_38 || (templateObject_38 = __makeTemplateObject(["\n  font-size: 1.2em;\n"], ["\n  font-size: 1.2em;\n"])));
var StyledResultWrapper = (0, styled_components_1.default)(StyledWrapper)(templateObject_39 || (templateObject_39 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  gap: 1em;\n"], ["\n  display: flex;\n  flex-direction: column;\n  gap: 1em;\n"])));
var StyledResultTitle = (0, styled_components_1.default)(StyledHeaderTitle)(templateObject_40 || (templateObject_40 = __makeTemplateObject([""], [""])));
var StyledResultRow = styled_components_1.default.div(templateObject_41 || (templateObject_41 = __makeTemplateObject(["\n  width: 100%;\n  display: flex;\n  flex-wrap: wrap;\n  justify-content: center;\n  align-items: center;\n  gap: 2em;\n  margin-top: 1em;\n"], ["\n  width: 100%;\n  display: flex;\n  flex-wrap: wrap;\n  justify-content: center;\n  align-items: center;\n  gap: 2em;\n  margin-top: 1em;\n"])));
var StyledResultChartBox = styled_components_1.default.div(templateObject_42 || (templateObject_42 = __makeTemplateObject(["\n  display: flex;\n\n  padding: 5px;\n  min-width: 300px;\n  height: 300px;\n  border: 2px solid #f0f0f0;\n  flex: 1;\n"], ["\n  display: flex;\n\n  padding: 5px;\n  min-width: 300px;\n  height: 300px;\n  border: 2px solid #f0f0f0;\n  flex: 1;\n"])));
var StyledResultTextBox = styled_components_1.default.div(templateObject_43 || (templateObject_43 = __makeTemplateObject(["\n  flex: 1;\n  min-width: 300px;\n  padding: 0 0.5em;\n"], ["\n  flex: 1;\n  min-width: 300px;\n  padding: 0 0.5em;\n"])));
var StyledResultTextTitle = styled_components_1.default.div(templateObject_44 || (templateObject_44 = __makeTemplateObject(["\n  height: 30px;\n  display: flex;\n  align-items: center;\n  font-size: 1.4em;\n  font-weight: 700;\n  margin-bottom: 0.5em;\n\n  @media screen and (min-width: 700px) {\n    font-size: 1.6em;\n  }\n\n  @media screen and (min-width: 1024px) {\n    font-size: 1.8em;\n  }\n"], ["\n  height: 30px;\n  display: flex;\n  align-items: center;\n  font-size: 1.4em;\n  font-weight: 700;\n  margin-bottom: 0.5em;\n\n  @media screen and (min-width: 700px) {\n    font-size: 1.6em;\n  }\n\n  @media screen and (min-width: 1024px) {\n    font-size: 1.8em;\n  }\n"])));
var StyledResultText = styled_components_1.default.div(templateObject_45 || (templateObject_45 = __makeTemplateObject(["\n  font-size: 1.3em;\n  line-height: 1.5em;\n\n  ul {\n    padding-left: 2em;\n  }\n\n  @media screen and (min-width: 700px) {\n    font-size: 1.5em;\n  }\n\n  @media screen and (min-width: 1024px) {\n    font-size: 1.7em;\n  }\n"], ["\n  font-size: 1.3em;\n  line-height: 1.5em;\n\n  ul {\n    padding-left: 2em;\n  }\n\n  @media screen and (min-width: 700px) {\n    font-size: 1.5em;\n  }\n\n  @media screen and (min-width: 1024px) {\n    font-size: 1.7em;\n  }\n"])));
var StyledDashHR = styled_components_1.default.hr(templateObject_46 || (templateObject_46 = __makeTemplateObject(["\n  margin: 1em 0;\n  border: 0;\n\n  border-top: 1px solid #aaa9bc;\n"], ["\n  margin: 1em 0;\n  border: 0;\n\n  border-top: 1px solid #aaa9bc;\n"])));
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27, templateObject_28, templateObject_29, templateObject_30, templateObject_31, templateObject_32, templateObject_33, templateObject_34, templateObject_35, templateObject_36, templateObject_37, templateObject_38, templateObject_39, templateObject_40, templateObject_41, templateObject_42, templateObject_43, templateObject_44, templateObject_45, templateObject_46;
