Commit b836f449 authored by baixian's avatar baixian

数据统计首页提交

parent 8a0020c3
# Default ignored files
/workspace.xml
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<module type="WEB_MODULE" version="4">
<component name="NewModuleRootManager">
<content url="file://$MODULE_DIR$">
<excludeFolder url="file://$MODULE_DIR$/.tmp" />
<excludeFolder url="file://$MODULE_DIR$/temp" />
<excludeFolder url="file://$MODULE_DIR$/tmp" />
</content>
<orderEntry type="inheritedJdk" />
<orderEntry type="sourceFolder" forTests="false" />
</component>
</module>
\ No newline at end of file
<component name="ProjectCodeStyleConfiguration">
<code_scheme name="Project" version="173">
<JSCodeStyleSettings version="0">
<option name="FORCE_SEMICOLON_STYLE" value="true" />
<option name="USE_DOUBLE_QUOTES" value="false" />
<option name="FORCE_QUOTE_STYlE" value="true" />
<option name="VAR_DECLARATION_WRAP" value="2" />
<option name="OBJECT_LITERAL_WRAP" value="2" />
<option name="SPACES_WITHIN_OBJECT_LITERAL_BRACES" value="true" />
<option name="SPACES_WITHIN_IMPORTS" value="true" />
</JSCodeStyleSettings>
<codeStyleSettings language="JavaScript">
<option name="ALIGN_MULTILINE_PARAMETERS" value="false" />
<option name="ALIGN_MULTILINE_FOR" value="false" />
<option name="METHOD_CALL_CHAIN_WRAP" value="2" />
<option name="IF_BRACE_FORCE" value="1" />
<option name="DOWHILE_BRACE_FORCE" value="1" />
<option name="WHILE_BRACE_FORCE" value="1" />
<option name="FOR_BRACE_FORCE" value="1" />
<indentOptions>
<option name="INDENT_SIZE" value="2" />
<option name="CONTINUATION_INDENT_SIZE" value="2" />
</indentOptions>
</codeStyleSettings>
</code_scheme>
</component>
\ No newline at end of file
<component name="ProjectCodeStyleConfiguration">
<state>
<option name="USE_PER_PROJECT_SETTINGS" value="true" />
</state>
</component>
\ No newline at end of file
<component name="InspectionProjectProfileManager">
<profile version="1.0">
<option name="myName" value="Project Default" />
<inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
</profile>
</component>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="JavaScriptSettings">
<option name="languageLevel" value="JSX" />
</component>
</project>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectModuleManager">
<modules>
<module fileurl="file://$PROJECT_DIR$/.idea/biz.qingxiao.com.iml" filepath="$PROJECT_DIR$/.idea/biz.qingxiao.com.iml" />
</modules>
</component>
</project>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="VcsDirectoryMappings">
<mapping directory="$PROJECT_DIR$" vcs="Git" />
</component>
</project>
\ No newline at end of file
......@@ -9,6 +9,7 @@ import {
SessionStorage,
isExpired,
getRandomFilename,
formatDay,
} from '../utils/index';
import * as teachersAjax from '../services/teachers';
import * as indexstaticajax from '../services/indexstaic';
......@@ -387,8 +388,6 @@ export default {
init: true,
start_date: moment().startOf('week').unix() * 1000,
end_date: moment().endOf('week').unix() * 1000,
start_time: (moment().startOf('week')).format('YYYY-MM-DD'),
end_time: (moment().endOf('week')).format('YYYY-MM-DD'),
},
});
yield put({
......@@ -416,8 +415,8 @@ export default {
const clockCharts = yield call(indexstaticajax.clockCharts, {
schoolId: sid,
days,
start_time,
end_time,
start_time: formatDay(start_date / 1000),
end_time: formatDay(end_date / 1000),
});
setTimeout(loadmessage);
if (clockCharts.code == 200) {
......
import React from 'react';
import $ from 'jquery';
import { connect } from 'dva';
import { message, Row, Col, Modal, Icon, DatePicker } from 'antd';
import { message, Row, Col, Modal, Icon, DatePicker, Spin } from 'antd';
import {
G2,
Chart,
......@@ -29,13 +29,11 @@ import AddCourseTime from '../classdetail/AddCourseTime';
const { RangePicker } = DatePicker;
const echarts = require('echarts');
// eslint-disable-next-line react/no-multi-comp
class StaticCenter extends React.Component {
componentDidMount() { // 挂载
pageIn('轻校-概况');
}
componentDidUpdate() {
const { clockCharts, clockChartsSuccess } = this.props;
}
componentWillUnmount() { // 卸载
}
......@@ -46,8 +44,8 @@ class StaticCenter extends React.Component {
payload: {
sid,
init: false,
start_time,
end_time,
start_date: start_time,
end_date: end_time,
},
});
}
......@@ -60,6 +58,9 @@ class StaticCenter extends React.Component {
createUnlockTheme = () => {
message.warning('功能即将开放,敬请期待');
}
disabledDate=(current) => {
return current > moment();
}
goPlanCourse = () => {
const { dispatch, classDetail, classId } = this.props;
dispatch({
......@@ -185,14 +186,16 @@ class StaticCenter extends React.Component {
});
}
onRangePickerChange =(dates, dateStrings) => {
this.dayshift(dateStrings[0], dateStrings[1]);
console.log(new Date(dateStrings[0].replace(/-/g, '/')).getTime(), 'start');
this.dayshift(new Date(dateStrings[0].replace(/-/g, '/')).getTime(), new Date(dateStrings[1].replace(/-/g, '/')).getTime());
}
onSlideChange =(obj) => {
const {
startValue, endValue,
startValue, endValue, startText, endText,
} = obj;
this.ds.setState('start', startValue);
this.ds.setState('end', endValue);
console.log(obj);
this.ds.setState('start', new Date(startText.replace(/-/g, '/')).getTime());
this.ds.setState('end', new Date(endText.replace(/-/g, '/')).getTime());
}
render() {
const that = this;
......@@ -223,9 +226,11 @@ class StaticCenter extends React.Component {
const studentCount = dataArray.student_count;
const chartArea = [];
for (let i = 0; i < month.length && i < clockCount.length && i < peopleCount.length && i < studentCount.length; i++) {
// chartArea.push({ month: month[i], student_count: studentCount[i], name: '新增学员' }, { month: month[i], clock_count: clockCount[i], name: '打卡数' }, { month: month[i], people_count: peopleCount[i], name: '学员总数' });
chartArea.push({ month: month[i], count: Math.floor(Math.random() * 100), name: '新增学员' }, { month: month[i], count: Math.floor(Math.random() * 200), name: '打卡数' }, { month: month[i], count: Math.floor(Math.random() * 300), name: '学员总数' });
// chartArea.push({ month: month[i], count: Math.floor(Math.random() * 100), name: '新增学员(人)' }, { month: month[i], count: Math.floor(Math.random() * 200), name: '打卡数(人)' }, { month: month[i], count: Math.floor(Math.random() * 300), name: '打卡总数' });
chartArea.push({ month: month[i], count: studentCount[i], name: '新增学员(人)' }, { month: month[i], count: peopleCount[i], name: '打卡数(人)' }, { month: month[i], count: clockCount[i], name: '打卡总数' });
}
const yesterday = chartArea && chartArea.length > 0 ? chartArea[0].month : (moment().startOf('week')).format('YYYY-MM-DD');
const today = chartArea && chartArea.length > 0 ? chartArea[chartArea.length - 1].month : (moment().endOf('week')).format('YYYY-MM-DD');
const data = chartArea;
this.ds = new DataSet({
state: {
......@@ -312,13 +317,7 @@ class StaticCenter extends React.Component {
</div>
<div className={pageStyle.chartbox}>
<div
className={`${pageStyle.cardtitle} clearfix`}
style={{
padding: ' 4px 0 18px 20px',
position: 'absolute',
width: '100%',
marginTop: '-8px',
}}
className={`${pageStyle.cardtitlereset} clearfix `}
>
<span style={{ paddingLeft: '0', fontWeight: '600' }}>打卡数据变化趋势</span>
<div className={pageStyle.staticcolorbox}>
......@@ -328,18 +327,21 @@ class StaticCenter extends React.Component {
' 按周查看': [moment().startOf('week'), moment().endOf('week')],
' 按月查看 ': [moment().startOf('month'), moment().endOf('month')],
}}
// defaultValue={[moment(yesterday), moment(today)]}
defaultValue={[moment(yesterday), moment(today)]}
disabledDate={this.disabledDate}
onChange={this.onRangePickerChange}
allowClear={false}
className={pageStyle.rangePicker}
/>
</div>
</div>
</div>
<div className={pageStyle.chartcontent}>
{clockChartsSuccess && chartArea.length > 0 &&
<div style={{ width: '100%' }}>
<div style={{ width: '100%', height: '450px' }}>
<Chart
height={window.innerHeight - 50}
data={dv}
height="400"
scale={cols}
padding="auto"
forceFit
......@@ -410,7 +412,8 @@ class StaticCenter extends React.Component {
start={this.ds.state.start}
end={this.ds.state.end}
xAxis="month"
yAxis="clock_count"
yAxis="count"
padding={[40, 0, 40, 10]}
scales={{
month: {
type: 'time',
......@@ -466,7 +469,7 @@ class StaticCenter extends React.Component {
</div>
</div>
<div>
<div className={pageStyle.todoitem}>
<div className={pageStyle.todoitem} style={{ maxHeight: '470px' }}>
<div className={pageStyle.cardtitle}>
<span>待办事项</span>
</div>
......
......@@ -161,6 +161,37 @@
float: left;
}
}
.chartbox{
.cardrest{
span {
color: red;
}
}
}
.chartbox {
.cardtitlereset {
display: flex;
align-items: center;
padding: 4px 0 18px 20px;
position: relative;
width: 100%;
margin-top: -8px;
span {
font-size:16px;
font-family:PingFangSC;
font-weight:500;
color:rgba(0,0,0,0.85);
}
}
}
@media (min-width: 1680px) {
.chartbox {
.cardtitlereset {
position: absolute;
}
}
}
.staticcolorbox {
display: flex;
// position: absolute;
......@@ -292,3 +323,6 @@
background: #fff;
margin-bottom: 20px;
}
.rangePicker {
width: 350px;
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment