You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
497 lines
17 KiB
497 lines
17 KiB
"use strict";
|
|
(self["webpackChunk"] = self["webpackChunk"] || []).push([[630],{
|
|
|
|
/***/ 73646:
|
|
/*!**************************************************************************************!*\
|
|
!*** ./src/pages/Classrooms/Lists/Statistics/CourseStatistics/index.tsx + 2 modules ***!
|
|
\**************************************************************************************/
|
|
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
|
|
|
// ESM COMPAT FLAG
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
|
// EXPORTS
|
|
__webpack_require__.d(__webpack_exports__, {
|
|
"default": function() { return /* binding */ CourseStatistics; }
|
|
});
|
|
|
|
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/objectSpread2.js
|
|
var objectSpread2 = __webpack_require__(82242);
|
|
var objectSpread2_default = /*#__PURE__*/__webpack_require__.n(objectSpread2);
|
|
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/slicedToArray.js
|
|
var slicedToArray = __webpack_require__(79800);
|
|
var slicedToArray_default = /*#__PURE__*/__webpack_require__.n(slicedToArray);
|
|
// EXTERNAL MODULE: ./node_modules/_react@17.0.2@react/index.js
|
|
var _react_17_0_2_react = __webpack_require__(59301);
|
|
// EXTERNAL MODULE: ./node_modules/_dayjs@1.11.13@dayjs/dayjs.min.js
|
|
var dayjs_min = __webpack_require__(61186);
|
|
var dayjs_min_default = /*#__PURE__*/__webpack_require__.n(dayjs_min);
|
|
// EXTERNAL MODULE: ./src/.umi-production/exports.ts
|
|
var _umi_production_exports = __webpack_require__(65363);
|
|
// EXTERNAL MODULE: ./node_modules/_antd@5.9.0@antd/es/progress/index.js + 13 modules
|
|
var progress = __webpack_require__(93948);
|
|
// EXTERNAL MODULE: ./node_modules/_antd@5.9.0@antd/es/select/index.js
|
|
var es_select = __webpack_require__(57809);
|
|
// EXTERNAL MODULE: ./node_modules/_antd@5.9.0@antd/es/table/index.js + 85 modules
|
|
var table = __webpack_require__(61998);
|
|
// EXTERNAL MODULE: ./src/components/NoData/index.tsx
|
|
var NoData = __webpack_require__(13261);
|
|
// EXTERNAL MODULE: ./node_modules/_echarts-for-react@2.0.16@echarts-for-react/lib/index.js
|
|
var lib = __webpack_require__(42441);
|
|
;// CONCATENATED MODULE: ./src/pages/Classrooms/Lists/Statistics/CourseStatistics/index.less?modules
|
|
// extracted by mini-css-extract-plugin
|
|
/* harmony default export */ var CourseStatisticsmodules = ({"flex_box_center":"flex_box_center___oN0_S","flex_space_between":"flex_space_between___VocC2","flex_box_vertical_center":"flex_box_vertical_center___B92LK","flex_box_center_end":"flex_box_center_end___g1IcT","flex_box_column":"flex_box_column___mthMO","bg":"bg___jIkIe","containerTitle":"containerTitle___YJIiZ","subTitle":"subTitle___h9V3M","subTag":"subTag___CQs2m","subText":"subText___GPMvm","pieWrap":"pieWrap___SWSQF","pieContainer":"pieContainer___AVuwI","tipWrap":"tipWrap___oKk7w","pieTip":"pieTip___lrUrC"});
|
|
;// CONCATENATED MODULE: ./src/pages/Classrooms/Lists/Statistics/CourseStatistics/data.tsx
|
|
|
|
function generateRandomNumbers(length) {
|
|
var numbers = new Set();
|
|
while (numbers.size < length) {
|
|
var num = Math.floor(Math.random() * (5200 - 2200)) + 2200;
|
|
numbers.add(num);
|
|
}
|
|
return Array.from(numbers);
|
|
}
|
|
var getDateNum = function getDateNum(dayLength) {
|
|
var currentDate = dayjs_min_default()();
|
|
var preDates = Array.from({
|
|
length: dayLength
|
|
}, function (_, i) {
|
|
return currentDate.clone().subtract(i + 1, 'days').format('YYYY-MM-DD');
|
|
}).reverse(); // 反转数组，使得日期从最新到最旧
|
|
return {
|
|
data: preDates,
|
|
value: generateRandomNumbers(dayLength)
|
|
};
|
|
};
|
|
var studentData = [{
|
|
user_name: '学生1',
|
|
student_id: '20240103',
|
|
course_group_name: '一班',
|
|
course_rate: '90%',
|
|
report_rate: '40%',
|
|
shixun_rate: '80%'
|
|
}, {
|
|
user_name: '王小二',
|
|
student_id: '20240105',
|
|
course_group_name: '一班',
|
|
course_rate: '60%',
|
|
report_rate: '90%',
|
|
shixun_rate: '70%'
|
|
}, {
|
|
user_name: '学生2',
|
|
student_id: '20240106',
|
|
course_group_name: '二班',
|
|
course_rate: '80%',
|
|
report_rate: '70%',
|
|
shixun_rate: '80%'
|
|
}];
|
|
// EXTERNAL MODULE: ./src/components/ui-customization/index.tsx + 32 modules
|
|
var ui_customization = __webpack_require__(78764);
|
|
// EXTERNAL MODULE: ./node_modules/_react@17.0.2@react/jsx-runtime.js
|
|
var jsx_runtime = __webpack_require__(37712);
|
|
;// CONCATENATED MODULE: ./src/pages/Classrooms/Lists/Statistics/CourseStatistics/index.tsx
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
dayjs_min_default().locale('zh-cn');
|
|
|
|
|
|
|
|
|
|
var ShixunsListPage = function ShixunsListPage(_ref) {
|
|
var classroomList = _ref.classroomList,
|
|
globalSetting = _ref.globalSetting,
|
|
video = _ref.video,
|
|
loading = _ref.loading,
|
|
dispatch = _ref.dispatch,
|
|
teachers = _ref.teachers;
|
|
var detailCourseGroupsList = classroomList.detailCourseGroupsList;
|
|
var _useState = (0,_react_17_0_2_react.useState)({
|
|
duration: 7,
|
|
limit: 10,
|
|
page: 1,
|
|
keywords: ''
|
|
}),
|
|
_useState2 = slicedToArray_default()(_useState, 2),
|
|
params = _useState2[0],
|
|
setParams = _useState2[1];
|
|
var _useState3 = (0,_react_17_0_2_react.useState)({
|
|
data: [],
|
|
value: []
|
|
}),
|
|
_useState4 = slicedToArray_default()(_useState3, 2),
|
|
dateNum = _useState4[0],
|
|
setDateNum = _useState4[1];
|
|
var _useState5 = (0,_react_17_0_2_react.useState)([]),
|
|
_useState6 = slicedToArray_default()(_useState5, 2),
|
|
studentList = _useState6[0],
|
|
setStudentList = _useState6[1];
|
|
var renderFormatVal = function renderFormatVal(percent, desc) {
|
|
return /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
|
|
children: [/*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
|
|
style: {
|
|
fontWeight: '700',
|
|
fontSize: '20px',
|
|
color: '#2C3A58',
|
|
marginBottom: '6px'
|
|
},
|
|
children: [percent, "%"]
|
|
}), /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
|
|
style: {
|
|
fontWeight: '400',
|
|
fontSize: '12px',
|
|
color: '#434D6C'
|
|
},
|
|
children: desc
|
|
})]
|
|
});
|
|
};
|
|
var overViewOptions = [{
|
|
percent: 35,
|
|
formatVal: renderFormatVal(35, '课程进度'),
|
|
strokeColor: '#77CD9B'
|
|
}, {
|
|
percent: 50,
|
|
formatVal: renderFormatVal(50, '报告提交率'),
|
|
strokeColor: '#5FB6F2'
|
|
}, {
|
|
percent: 75,
|
|
formatVal: renderFormatVal(75, '报告批改率'),
|
|
strokeColor: '#6C96F3'
|
|
}, {
|
|
percent: 60,
|
|
formatVal: renderFormatVal(60, '报告及格率'),
|
|
strokeColor: '#F6D783'
|
|
}, {
|
|
percent: 15,
|
|
formatVal: renderFormatVal(15, '运行环境数'),
|
|
strokeColor: '#FDA672'
|
|
}];
|
|
var options1 = {
|
|
xAxis: {
|
|
name: '日期',
|
|
type: 'category',
|
|
data: dateNum.data,
|
|
axisTick: {
|
|
show: false // 隐藏 Y 轴刻度线
|
|
},
|
|
axisLabel: {
|
|
rotate: 45 // 倾斜45度
|
|
}
|
|
},
|
|
tooltip: {
|
|
trigger: 'item',
|
|
formatter: function formatter(params) {
|
|
return "".concat(params === null || params === void 0 ? void 0 : params.name, "<br/> \u4E0A\u7EBF\u5B66\u751F\u6570\uFF1A").concat(params === null || params === void 0 ? void 0 : params.value, "\u4EBA");
|
|
}
|
|
},
|
|
yAxis: {
|
|
name: '学生数',
|
|
nameLocation: 'end',
|
|
nameGap: 30,
|
|
// 设置名称与轴的间距
|
|
rotate: 10,
|
|
// 可选，设置旋转角度
|
|
type: 'value',
|
|
splitLine: {
|
|
show: true,
|
|
lineStyle: {
|
|
type: 'dotted' // 设置为虚线
|
|
}
|
|
},
|
|
axisLine: {
|
|
show: false // 隐藏 Y 轴坐标线
|
|
},
|
|
axisTick: {
|
|
show: false // 隐藏 Y 轴刻度线
|
|
}
|
|
},
|
|
legend: {
|
|
data: ['当日上线学生数'],
|
|
orient: 'horizontal',
|
|
// 图例方向
|
|
top: '10%',
|
|
right: '10%'
|
|
},
|
|
series: [{
|
|
name: '当日上线学生数',
|
|
data: dateNum.value,
|
|
type: 'line',
|
|
symbolSize: 6,
|
|
// 数据点大小
|
|
lineStyle: {
|
|
color: '#498FEA',
|
|
// 设置折线颜色
|
|
shadowColor: 'rgba(66,93,142,0.5)',
|
|
// 阴影颜色
|
|
shadowBlur: 6,
|
|
// 阴影模糊度
|
|
shadowOffsetX: 0,
|
|
// 阴影偏移X
|
|
shadowOffsetY: 6 // 阴影偏移Y
|
|
},
|
|
itemStyle: {
|
|
color: '#498FEA' // 设置数据点颜色
|
|
}
|
|
}]
|
|
};
|
|
var handleChange = function handleChange(v) {
|
|
var res = getDateNum(v);
|
|
dateNum.data = res.data;
|
|
dateNum.value = res.value;
|
|
setDateNum(dateNum);
|
|
};
|
|
(0,_react_17_0_2_react.useEffect)(function () {
|
|
handleChange(7);
|
|
setStudentList(studentData);
|
|
}, []);
|
|
var columns = [{
|
|
title: '序号',
|
|
dataIndex: 'index',
|
|
key: 'index',
|
|
render: function render(a, b, i) {
|
|
return params.limit * (params.page - 1) + i + 1;
|
|
}
|
|
}, {
|
|
title: '姓名',
|
|
ellipsis: true,
|
|
dataIndex: 'user_name',
|
|
key: 'user_name'
|
|
}, {
|
|
title: '学号',
|
|
ellipsis: true,
|
|
dataIndex: 'student_id',
|
|
key: 'student_id'
|
|
}, {
|
|
title: '分班',
|
|
ellipsis: true,
|
|
dataIndex: 'course_group_name',
|
|
key: 'course_group_name'
|
|
}, {
|
|
title: '课程完成进度',
|
|
ellipsis: true,
|
|
dataIndex: 'course_rate',
|
|
key: 'course_rate'
|
|
}, {
|
|
title: '报告提交进度',
|
|
dataIndex: 'report_rate',
|
|
key: 'report_rate'
|
|
}, {
|
|
title: '实验报告合格率',
|
|
dataIndex: 'shixun_rate',
|
|
key: 'shixun_rate'
|
|
}];
|
|
return /*#__PURE__*/(0,jsx_runtime.jsx)("section", {
|
|
children: /*#__PURE__*/(0,jsx_runtime.jsxs)("aside", {
|
|
className: CourseStatisticsmodules.bg,
|
|
children: [/*#__PURE__*/(0,jsx_runtime.jsx)("div", {
|
|
className: CourseStatisticsmodules.containerTitle,
|
|
children: /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
|
|
className: "font16",
|
|
children: "\u8BFE\u7A0B\u5206\u6790"
|
|
})
|
|
}), /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
|
|
children: [/*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
|
|
className: CourseStatisticsmodules.subTitle,
|
|
children: [/*#__PURE__*/(0,jsx_runtime.jsx)("span", {
|
|
className: CourseStatisticsmodules.subTag
|
|
}), /*#__PURE__*/(0,jsx_runtime.jsx)("span", {
|
|
className: CourseStatisticsmodules.subText,
|
|
children: "\u6570\u636E\u6982\u89C8"
|
|
})]
|
|
}), /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
|
|
className: CourseStatisticsmodules.pieWrap,
|
|
children: overViewOptions.map(function (item, index) {
|
|
return /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
|
|
className: CourseStatisticsmodules.pieContainer,
|
|
style: {
|
|
marginLeft: index % 3 === 1 ? '30px' : '0px',
|
|
marginRight: index % 3 === 1 ? '30px' : '0px'
|
|
},
|
|
children: [/*#__PURE__*/(0,jsx_runtime.jsx)("div", {
|
|
children: /*#__PURE__*/(0,jsx_runtime.jsx)(progress/* default */.Z, {
|
|
type: "circle",
|
|
strokeWidth: 16,
|
|
percent: item.percent,
|
|
format: function format() {
|
|
return item.formatVal;
|
|
},
|
|
strokeColor: item.strokeColor
|
|
})
|
|
}), /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
|
|
className: CourseStatisticsmodules.tipWrap,
|
|
children: [/*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
|
|
className: "mb20",
|
|
style: {
|
|
display: 'flex',
|
|
alignItems: 'center'
|
|
},
|
|
children: [/*#__PURE__*/(0,jsx_runtime.jsx)("span", {
|
|
className: CourseStatisticsmodules.pieTip,
|
|
style: {
|
|
background: item.strokeColor
|
|
}
|
|
}), /*#__PURE__*/(0,jsx_runtime.jsx)("span", {
|
|
style: {
|
|
color: '#70727E',
|
|
fontSize: '12px',
|
|
marginRight: '12px'
|
|
},
|
|
children: "\u5DF2\u5B8C\u6210"
|
|
}), /*#__PURE__*/(0,jsx_runtime.jsxs)("span", {
|
|
style: {
|
|
fontSize: '16px',
|
|
fontWeight: 700,
|
|
color: '#2C3A58'
|
|
},
|
|
children: [item.percent, "%"]
|
|
})]
|
|
}), /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
|
|
style: {
|
|
display: 'flex',
|
|
alignItems: 'center'
|
|
},
|
|
children: [/*#__PURE__*/(0,jsx_runtime.jsx)("span", {
|
|
className: CourseStatisticsmodules.pieTip
|
|
}), /*#__PURE__*/(0,jsx_runtime.jsx)("span", {
|
|
style: {
|
|
color: '#70727E',
|
|
fontSize: '12px',
|
|
marginRight: '12px'
|
|
},
|
|
children: "\u672A\u5B8C\u6210"
|
|
}), /*#__PURE__*/(0,jsx_runtime.jsxs)("span", {
|
|
style: {
|
|
fontSize: '16px',
|
|
fontWeight: 700,
|
|
color: '#2C3A58'
|
|
},
|
|
children: [100 - item.percent, "%"]
|
|
})]
|
|
})]
|
|
})]
|
|
}, index);
|
|
})
|
|
})]
|
|
}), /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
|
|
children: [/*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
|
|
style: {
|
|
display: 'flex',
|
|
alignItems: 'center',
|
|
justifyContent: 'space-between'
|
|
},
|
|
children: [/*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
|
|
className: CourseStatisticsmodules.subTitle,
|
|
children: [/*#__PURE__*/(0,jsx_runtime.jsx)("span", {
|
|
className: CourseStatisticsmodules.subTag
|
|
}), /*#__PURE__*/(0,jsx_runtime.jsx)("span", {
|
|
className: CourseStatisticsmodules.subText,
|
|
children: "\u65E5\u4E0A\u7EBF\u5B66\u751F\u6570"
|
|
})]
|
|
}), /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
|
|
children: /*#__PURE__*/(0,jsx_runtime.jsx)(es_select["default"], {
|
|
onChange: function onChange(v) {
|
|
params.duration = v;
|
|
setParams(objectSpread2_default()({}, params));
|
|
handleChange(v);
|
|
},
|
|
value: params.duration,
|
|
style: {
|
|
width: 100
|
|
},
|
|
options: [{
|
|
label: '近7天',
|
|
value: 7
|
|
}, {
|
|
label: '近15天',
|
|
value: 15
|
|
}]
|
|
})
|
|
})]
|
|
}), /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
|
|
children: /*#__PURE__*/(0,jsx_runtime.jsx)(lib/* default */.Z, {
|
|
option: options1,
|
|
style: {
|
|
height: 350,
|
|
width: 936
|
|
},
|
|
opts: {
|
|
renderer: 'svg'
|
|
} // use svg to render the chart.
|
|
})
|
|
})]
|
|
}), /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
|
|
className: "mt30",
|
|
children: [/*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
|
|
style: {
|
|
display: 'flex',
|
|
alignItems: 'center',
|
|
justifyContent: 'space-between'
|
|
},
|
|
children: [/*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
|
|
className: CourseStatisticsmodules.subTitle,
|
|
children: [/*#__PURE__*/(0,jsx_runtime.jsx)("span", {
|
|
className: CourseStatisticsmodules.subTag
|
|
}), /*#__PURE__*/(0,jsx_runtime.jsx)("span", {
|
|
className: CourseStatisticsmodules.subText,
|
|
children: "\u8BFE\u7A0B\u8FDB\u5EA6\u8BE6\u60C5"
|
|
})]
|
|
}), /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
|
|
children: /*#__PURE__*/(0,jsx_runtime.jsx)(ui_customization/* CustomInput */.t7, {
|
|
style: {
|
|
width: 280,
|
|
marginLeft: 20
|
|
},
|
|
placeholder: "\u8BF7\u8F93\u5165\u59D3\u540D/\u5B66\u53F7\u8FDB\u884C\u641C\u7D22",
|
|
value: params.keywords,
|
|
onChange: function onChange(e) {
|
|
var decodeE = decodeURIComponent(e);
|
|
params.keywords = e;
|
|
setParams(objectSpread2_default()({}, params));
|
|
var temp = studentData.filter(function (item) {
|
|
return item.user_name.includes(decodeE) || item.student_id.includes(e);
|
|
});
|
|
setStudentList(temp);
|
|
}
|
|
})
|
|
})]
|
|
}), /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
|
|
children: [(studentList === null || studentList === void 0 ? void 0 : studentList.length) === 0 && /*#__PURE__*/(0,jsx_runtime.jsx)(NoData/* default */.Z, {}), (studentList === null || studentList === void 0 ? void 0 : studentList.length) > 0 && /*#__PURE__*/(0,jsx_runtime.jsx)("aside", {
|
|
children: /*#__PURE__*/(0,jsx_runtime.jsx)(table/* default */.Z, {
|
|
dataSource: studentList,
|
|
pagination: false,
|
|
columns: columns,
|
|
scroll: {
|
|
x: 'max-content'
|
|
}
|
|
})
|
|
})]
|
|
})]
|
|
})]
|
|
})
|
|
});
|
|
};
|
|
/* harmony default export */ var CourseStatistics = ((0,_umi_production_exports.connect)(function (_ref2) {
|
|
var classroomList = _ref2.classroomList,
|
|
loading = _ref2.loading,
|
|
globalSetting = _ref2.globalSetting,
|
|
teachers = _ref2.teachers,
|
|
video = _ref2.video;
|
|
return {
|
|
classroomList: classroomList,
|
|
globalSetting: globalSetting,
|
|
loading: loading,
|
|
teachers: teachers,
|
|
video: video
|
|
};
|
|
})(ShixunsListPage));
|
|
|
|
/***/ })
|
|
|
|
}]); |