Commit 4382338b authored by baixian's avatar baixian

数据中心开发完成

parent c312205f
......@@ -12,11 +12,11 @@
<![endif]-->
<script charset="utf-8" src="https://map.qq.com/api/js?v=2.exp&key=XSZBZ-5LHCV-5I2P7-UQHPW-6456F-JBB3B"></script>
<script src="https://cdn.img.shangjiadao.cn/qingxiao/biz/js/console-polyfill.js?20191012222" charset="utf-8"></script><script src="https://cdn.img.shangjiadao.cn/qingxiao/biz/js/es6-shim.min.js?20191012222" charset="utf-8"></script><script src="https://cdn.img.shangjiadao.cn/qingxiao/biz/js/es5-shim.js?20191012222" charset="utf-8"></script><script src="https://cdn.img.shangjiadao.cn/qingxiao/biz/js/es5-sham.min.js?20191012222" charset="utf-8"></script><script src="https://cdn.img.shangjiadao.cn/qingxiao/biz/js/json3.min.js?20191012222" charset="utf-8"></script><script src="https://cdn.img.shangjiadao.cn/qingxiao/biz/js/html5shiv.min.js?20191012222" charset="utf-8"></script><script src="https://cdn.img.shangjiadao.cn/qingxiao/biz/js/polyfill.js?20191012222" charset="utf-8"></script><script src="https://cdn.img.shangjiadao.cn/qingxiao/biz/lib/vendor.dll.js?20191012222" charset="utf-8"></script>
<script src="js/console-polyfill.js?20191012222" charset="utf-8"></script><script src="js/es6-shim.min.js?20191012222" charset="utf-8"></script><script src="js/es5-shim.js?20191012222" charset="utf-8"></script><script src="js/es5-sham.min.js?20191012222" charset="utf-8"></script><script src="js/json3.min.js?20191012222" charset="utf-8"></script><script src="js/html5shiv.min.js?20191012222" charset="utf-8"></script><script src="js/polyfill.js?20191012222" charset="utf-8"></script><script src="lib/vendor.dll.js?20191012222" charset="utf-8"></script>
</head>
</head>
<body>
<div id="root"></div>
<script src="https://cdn.img.shangjiadao.cn/qingxiao/biz/dist/main.js?1572591383487" charset="utf-8"></script>
<script src="dist/main.js?1573194144046" charset="utf-8"></script>
</body>
</html>
\ No newline at end of file
......@@ -52,6 +52,25 @@ export default {
end_date: moment().format('YYYY-MM-DD'),
},
teacherListTotal: 0,
classList: [],
classListParams: {
school_id: 0,
page: 1,
perPage: 5,
start_date: moment().format('YYYY-MM-DD'),
end_date: moment().format('YYYY-MM-DD'),
},
classListTotal: 0,
detailVisible: false,
detailList: [],
detailListParams: {
school_id: 0,
page: 1,
perPage: 10,
status: 0,
share_student_id: '',
},
detailListTotal: 0,
},
subscriptions: {
setup({ dispatch, history }) { // eslint-disable-line
......@@ -92,7 +111,6 @@ export default {
const newQueryParams = Object.assign(customerListParams, params, {
school_id: sid,
});
console.log(newQueryParams, 'newQueryParams');
const data = yield call(analyzeAjax.findCustomer, newQueryParams);
if (data.code === 200) {
if (data.data.total != undefined) {
......@@ -115,6 +133,52 @@ export default {
});
}
},
* selectDetailModal({ payload }, { call, put, select }) {
const { params, type } = payload;
const { sid } = yield select(state => state.webapp);
const {
classListParams, studentListParams, teacherListParams, detailListParams, detailListTotal,
} = yield select(state => state.analyzecenter);
let newTotal = detailListTotal;
let typePrams = {};
switch (type) {
case 2:
typePrams = { ...studentListParams };
break;
case 3:
typePrams = { ...teacherListParams };
break;
case 4:
typePrams = { ...classListParams };
break;
default:
typePrams = { };
}
const newQueryParams = Object.assign(typePrams, detailListParams, params, {
school_id: sid,
});
const data = yield call(analyzeAjax.findCustomer, newQueryParams);
if (data.code === 200) {
if (data.data.total != undefined) {
newTotal = data.data.total;
}
yield put({
type: 'updateState',
payload: {
detailList: data.data && data.data.list,
detailListParams: { ...newQueryParams },
detailListTotal: newTotal,
},
});
} else {
yield put({
type: 'webapp/errorrequestresolve',
payload: {
data,
},
});
}
},
* selectStudent({ payload }, { call, put, select }) {
const { params } = payload;
const { sid } = yield select(state => state.webapp);
......@@ -175,6 +239,36 @@ export default {
});
}
},
* selectClass({ payload }, { call, put, select }) {
const { params } = payload;
const { sid } = yield select(state => state.webapp);
const { classListParams, classListTotal } = yield select(state => state.analyzecenter);
let newTotal = classListTotal;
const newQueryParams = Object.assign(classListParams, params, {
school_id: sid,
});
const data = yield call(analyzeAjax.findClassContribution, newQueryParams);
if (data.code === 200) {
if (data.data.total != undefined) {
newTotal = data.data.total;
}
yield put({
type: 'updateState',
payload: {
classList: data.data && data.data.list,
classListParams: { ...newQueryParams },
classListTotal: newTotal,
},
});
} else {
yield put({
type: 'webapp/errorrequestresolve',
payload: {
data,
},
});
}
},
* changeCustomerPage({ payload }, { call, put, select }) {
const { params } = payload;
const { customerListParams } = yield select(state => state.analyzecenter);
......@@ -200,34 +294,53 @@ export default {
today: moment(moment().unix() * 1000),
checkedDay: 0,
customerList: [],
customerListParams: {
school_id: 0,
page: 1,
perPage: 5,
start_date: moment().format('YYYY-MM-DD'),
end_date: moment().format('YYYY-MM-DD'),
status: 0,
},
customerListTotal: 0,
studentList: [],
studentListParams: {
school_id: 0,
page: 1,
perPage: 5,
start_date: moment().format('YYYY-MM-DD'),
end_date: moment().format('YYYY-MM-DD'),
},
studentListTotal: 0,
teacherList: [],
teacherListParams: {
school_id: 0,
page: 1,
perPage: 5,
start_date: moment().format('YYYY-MM-DD'),
end_date: moment().format('YYYY-MM-DD'),
},
teacherListTotal: 0,
classList: [],
classListParams: {
school_id: 0,
page: 1,
perPage: 5,
start_date: moment().format('YYYY-MM-DD'),
end_date: moment().format('YYYY-MM-DD'),
},
classListTotal: 0,
detailVisible: false,
detailList: [],
detailListParams: {
school_id: 0,
page: 1,
perPage: 10,
status: 0,
share_student_id: '',
},
detailListTotal: 0,
},
customerListParams: {
school_id: 0,
page: 1,
perPage: 5,
start_date: moment().format('YYYY-MM-DD'),
end_date: moment().format('YYYY-MM-DD'),
status: 0,
},
customerListTotal: 0,
studentList: [],
studentListParams: {
school_id: 0,
page: 1,
perPage: 5,
start_date: moment().format('YYYY-MM-DD'),
end_date: moment().format('YYYY-MM-DD'),
},
studentListTotal: 0,
teacherList: [],
teacherListParams: {
school_id: 0,
page: 1,
perPage: 5,
start_date: moment().format('YYYY-MM-DD'),
end_date: moment().format('YYYY-MM-DD'),
},
teacherListTotal: 0,
});
},
},
......
......@@ -749,6 +749,11 @@ export default {
});
}
if (pathname === '/sjd/datacenter') {
dispatch({
type: 'analyzecenter/pageInit',
payload: {
},
});
dispatch({
type: 'analyzecenter/selectDashboard',
payload: {
......@@ -783,6 +788,15 @@ export default {
},
},
});
dispatch({
type: 'analyzecenter/selectClass',
payload: {
params: {
start_date: moment().format('YYYY-MM-DD'),
end_date: moment().format('YYYY-MM-DD'),
},
},
});
dispatch({
type: 'updateState',
payload: {
......
import { connect } from 'dva';
import React from 'react';
import PropTypes from 'prop-types';
import { message, Row, Col, Input, Select, Modal, Form, InputNumber, Button, Pagination, Table, Avatar } from 'antd';
import { imagify, pageIn } from '../../utils/index';
import pageStyle from './detailModal.less';
const { Option } = Select;
const { TextArea } = Input;
const FormItem = Form.Item;
class detailModalForm extends React.Component {
componentWillMount() {
}
componentDidUpdate() {
}
componentWillUpdate() {
}
componentDidMount() { // 挂载
pageIn('数据中心');
}
componentWillUnmount() { // 卸载
}
close = () => {
const {
close,
} = this.props;
close();
}
changeDetailPage = (page, perPage) => {
const { changeDetailPage } = this.props;
changeDetailPage(
{ page, perPage },
);
}
render() {
const {
visible,
detailListParams,
detailListTotal,
detailList,
} = this.props;
const columns = [
{
title: '头像',
dataIndex: 'avatar',
key: 'avatar',
render: (text) => {
return (
<div className={pageStyle.avatarBox}>
<Avatar src={imagify(text)} />
</div>);
},
},
{
title: '姓名',
dataIndex: 'nickname',
key: 'nickname',
},
{
title: '电话号码',
dataIndex: 'mobile',
key: 'mobile',
},
{
title: '留下线索时间',
dataIndex: 'created_at',
key: 'created_at',
render: (text) => {
return (
<div>{text}</div>
);
},
},
{
title: '贡献学员',
dataIndex: 'share_student',
key: 'share_student',
render: (text, record) => {
return (
<div>{record.share_student.nickname}</div>
);
},
},
];
return (
<Modal
visible={visible}
title="明细"
onCancel={this.close}
maskClosable={false}
zIndex={110}
footer={<div><Button type="primary" onClick={this.close}>关闭</Button></div>}
width={586}
bodyStyle={{ padding: 0 }}
>
<div className={pageStyle.detailBox}>
<Table
size="small"
rowKey="id"
dataSource={detailList}
columns={columns}
pagination={false}
footer={() => (
detailList.length > 0 &&
<div className="tablefooterbox">
<span className="tablefooterstatic">{detailListTotal}条数据</span>
<Pagination
size="small"
pageSize={detailListParams.perPage}
total={Number(detailListTotal)}
onChange={this.changeDetailPage}
/>
</div>
)}
/>
</div>
</Modal>
);
}
}
const detailModal = Form.create()(detailModalForm);
export default detailModal;
.detailBox {
:global {
.ant-table-placeholder {
border-top: none;
}
.ant-table-small {
border: none;
}
.ant-table-thead > tr > th {
border-bottom: none;
font-size: 14px;
font-weight: 600;
}
.ant-table-tbody > tr > td {
border-bottom: none;
}
}
}
......@@ -23,6 +23,7 @@ import {
import moment from 'moment';
import pageStyle from './index.less';
import { pageIn, hasBtnPower, imagify } from '../../utils/index';
import DetailModal from './detailModal';
const { RangePicker } = DatePicker;
const { Option } = Select;
const { TextArea } = Input;
......@@ -32,7 +33,39 @@ class DataCenterForm extends React.Component {
}
componentWillUnmount() { // 卸载
}
handleLookDetail = () => {
handleLookDetail = (record, type) => {
const { dispatch } = this.props;
dispatch({
type: 'analyzecenter/updateState',
payload: {
detailVisible: true,
},
});
dispatch({
type: 'analyzecenter/selectDetailModal',
payload: {
type,
params: {
share_student_id: String(record.student_ids),
},
},
});
}
handleDetailClose = () => {
const { dispatch } = this.props;
dispatch({
type: 'analyzecenter/updateState',
payload: {
detailVisible: false,
detailListParams: {
school_id: 0,
page: 1,
perPage: 10,
status: 0,
share_student_id: '',
},
},
});
}
disabledDate=(current) => {
return current > moment();
......@@ -81,6 +114,15 @@ class DataCenterForm extends React.Component {
},
},
});
dispatch({
type: 'analyzecenter/selectClass',
payload: {
params: {
start_date: dateStrings[0],
end_date: dateStrings[1],
},
},
});
}
handleClickDay = (day) => {
const { dispatch } = this.props;
......@@ -127,6 +169,15 @@ class DataCenterForm extends React.Component {
},
},
});
dispatch({
type: 'analyzecenter/selectClass',
payload: {
params: {
start_date: moment().subtract(6, 'days').format('YYYY-MM-DD'),
end_date: moment().format('YYYY-MM-DD'),
},
},
});
} else {
dispatch({
type: 'analyzecenter/updateState',
......@@ -170,6 +221,15 @@ class DataCenterForm extends React.Component {
},
},
});
dispatch({
type: 'analyzecenter/selectClass',
payload: {
params: {
start_date: moment().subtract(29, 'days').format('YYYY-MM-DD'),
end_date: moment().format('YYYY-MM-DD'),
},
},
});
}
}
changeCustomerPage = (page, perPage) => {
......@@ -208,6 +268,30 @@ class DataCenterForm extends React.Component {
},
});
}
changeClassPage = (page, perPage) => {
const { dispatch } = this.props;
dispatch({
type: 'analyzecenter/selectClass',
payload: {
params: {
page,
perPage,
},
},
});
}
changeDetailPage = (values) => {
const { dispatch } = this.props;
dispatch({
type: 'analyzecenter/selectDetailModal',
payload: {
params: {
page: values.page,
perPage: values.perPage,
},
},
});
}
render() {
const {
dashboardObj,
......@@ -223,9 +307,14 @@ class DataCenterForm extends React.Component {
teacherList,
teacherListParams,
teacherListTotal,
classList,
classListParams,
classListTotal,
detailVisible,
detailListParams,
detailListTotal,
detailList,
} = this.props;
const dataSource = [
];
const studentClueColumns = [
{
title: '头像',
......@@ -233,7 +322,7 @@ class DataCenterForm extends React.Component {
render: (text, record, index) => {
return (
<div className={pageStyle.avatarBox}>
{/* <span>{index + 1}</span> */}
<span className={pageStyle.sortNum}>{(customerListParams.perPage * (customerListParams.page - 1)) + index + 1}</span>
<Avatar src={imagify(text)} />
</div>);
},
......@@ -261,11 +350,9 @@ class DataCenterForm extends React.Component {
title: '头像',
dataIndex: 'avatar',
render: (text, record, index) => {
console.log(studentListParams.page, 'page');
console.log(index, 'index');
return (
<div className={pageStyle.avatarBox}>
{Number(studentListParams.page) === 1 ? index + 1 : (studentListParams.perPage + index + 1) }
<span className={pageStyle.sortNum}>{(studentListParams.perPage * (studentListParams.page - 1)) + index + 1}</span>
<Avatar src={imagify(text)} />
</div>);
},
......@@ -285,7 +372,7 @@ class DataCenterForm extends React.Component {
return (
<div className={pageStyle.threadBox}>
{ text }
{ record.student_ids > 0 && <span className={pageStyle.detail} onClick={this.handleLookDetail}>明细</span> }
{ record.website_consult_customers_count > 0 && <span className={pageStyle.detail} onClick={() => this.handleLookDetail(record, 2)}>明细</span> }
</div>);
},
},
......@@ -294,9 +381,10 @@ class DataCenterForm extends React.Component {
{
title: '昵称',
dataIndex: 'nickname',
render: (text, record) => {
render: (text, record, index) => {
return (
<div>
<div className={pageStyle.avatarBox}>
<span className={pageStyle.sortNum}>{(teacherListParams.perPage * (teacherListParams.page - 1)) + index + 1}</span>
{ text }
</div>);
},
......@@ -315,30 +403,49 @@ class DataCenterForm extends React.Component {
return (
<div className={pageStyle.threadBox}>
{ text }
{ record.student_ids > 0 && <span className={pageStyle.detail} onClick={this.handleLookDetail}>明细</span> }
{ record.website_consult_customers_count > 0 && <span className={pageStyle.detail} onClick={() => this.handleLookDetail(record, 3)}>明细</span> }
</div>);
},
},
];
const classUpColumns = [
{
title: '称',
dataIndex: 'key',
render: (text) => {
title: '班级名称',
dataIndex: 'title',
render: (text, record, index) => {
return (
<div className={pageStyle.avatarBox}>
<span> { text }</span>
<Avatar size={44} icon="user" />
<span className={pageStyle.sortNum}>{(classListParams.perPage * (classListParams.page - 1)) + index + 1}</span>
{text}
</div>);
},
},
{
title: '任课老师',
dataIndex: 'name',
render: (text, record) => {
return (
<div>
<span>
{
record.teachers.length > 0 ? record.teachers.map((item, index) => {
return <span>{item.school_teacher.nickname},</span>;
}) : '-'
}
</span>
</div>);
},
},
{
dataIndex: 'num',
dataIndex: 'website_consult_customers_count',
title: '潜在学员线索贡献',
render: (text, record) => {
return (
<div className={pageStyle.threadBox}>
{ text }
{ record.website_consult_customers_count > 0 && <span className={pageStyle.detail} onClick={() => this.handleLookDetail(record, 4)}>明细</span> }
</div>);
},
},
];
return (
......@@ -446,7 +553,7 @@ class DataCenterForm extends React.Component {
<div className={pageStyle.footer}>
<Row gutter={30}>
<Col xs={{ span: 24 }} sm={{ span: 12 }} lg={{ span: 12 }} md={{ span: 12 }}>
<div className={pageStyle.commonTable}>
<div className={pageStyle.commonTableAvatar}>
<div className={pageStyle.commonTitle}><span className={pageStyle.line}></span>潜在学员线索</div>
<Table
size="small"
......@@ -470,7 +577,7 @@ class DataCenterForm extends React.Component {
</div>
</Col>
<Col xs={{ span: 24 }} sm={{ span: 12 }} lg={{ span: 12 }} md={{ span: 12 }}>
<div className={pageStyle.commonTable}>
<div className={pageStyle.commonTableAvatar}>
<div className={pageStyle.commonTitle}><span className={pageStyle.line}></span>学员贡献排行</div>
<Table
size="small"
......@@ -524,11 +631,37 @@ class DataCenterForm extends React.Component {
<Col xs={{ span: 24 }} sm={{ span: 12 }} lg={{ span: 12 }} md={{ span: 12 }}>
<div className={pageStyle.commonTable}>
<div className={pageStyle.commonTitle}><span className={pageStyle.line}></span>班级贡献排行</div>
<Table size="small" dataSource={dataSource} columns={classUpColumns} />
<Table
size="small"
rowKey="id"
dataSource={classList}
columns={classUpColumns}
pagination={false}
footer={() => (
classList.length > 0 &&
<div className="tablefooterbox">
<span className="tablefooterstatic">{classListTotal}条数据</span>
<Pagination
size="small"
pageSize={classListParams.perPage}
total={Number(classListTotal)}
onChange={this.changeClassPage}
/>
</div>
)}
/>
</div>
</Col>
</Row>
</div>
<DetailModal
visible={detailVisible}
close={this.handleDetailClose}
detailListParams={detailListParams}
detailListTotal={detailListTotal}
detailList={detailList}
changeDetailPage={this.changeDetailPage}
/>
</div>
);
}
......@@ -553,6 +686,13 @@ function mapStateToProps(state) {
teacherList,
teacherListParams,
teacherListTotal,
classList,
classListParams,
classListTotal,
detailVisible,
detailListParams,
detailListTotal,
detailList,
} = state.analyzecenter;
return {
dashboardObj,
......@@ -568,6 +708,13 @@ function mapStateToProps(state) {
teacherList,
teacherListParams,
teacherListTotal,
classList,
classListParams,
classListTotal,
detailVisible,
detailListParams,
detailListTotal,
detailList,
};
}
export default connect(mapStateToProps)(DataCenter);
......
.container {
padding-bottom: 50px;
}
.head {
padding: 20px 28px;
background-color: #fff;
......@@ -58,40 +60,45 @@
}
.footer {
margin-top: 25px;
.commonTableAvatar {
background-color: #fff;
min-height: 383px;
}
.commonTable {
background-color: #fff;
.commonTitle {
font-size:16px;
font-family:PingFangSC-Medium,PingFang SC;
font-weight:600;
line-height: 24px;
padding: 15px 0 15px 10px;
color:rgba(0,0,0,0.85);
border-bottom: 1px solid #E8E8E8;
.line {
width: 3px;
height: 19px;
background-color: #1890FF;
display: inline-block;
vertical-align: -10%;
margin-right: 6px;
}
min-height: 358px;
}
.commonTitle {
font-size:16px;
font-family:PingFangSC-Medium,PingFang SC;
font-weight:600;
line-height: 24px;
padding: 15px 0 15px 10px;
color:rgba(0,0,0,0.85);
border-bottom: 1px solid #E8E8E8;
.line {
width: 3px;
height: 19px;
background-color: #1890FF;
display: inline-block;
vertical-align: -10%;
margin-right: 6px;
}
:global {
.ant-table-placeholder {
border-top: none;
}
.ant-table-small {
border: none;
}
.ant-table-thead > tr > th {
border-bottom: none;
font-size: 14px;
font-weight: 600;
}
.ant-table-tbody > tr > td {
border-bottom: none;
}
}
:global {
.ant-table-placeholder {
border-top: none;
}
.ant-table-small {
border: none;
}
.ant-table-thead > tr > th {
border-bottom: none;
font-size: 14px;
font-weight: 600;
}
.ant-table-tbody > tr > td {
border-bottom: none;
}
}
}
......@@ -100,6 +107,11 @@
display: inline-block;
margin-right: 10px;
}
.sortNum {
font-size:18px;
font-weight:600;
color:rgba(0,0,0,0.65);
}
}
.threadBox {
.detail {
......@@ -108,5 +120,6 @@
color:rgba(24,144,255,1);
display: inline-block;
margin-left: 10px;
cursor: pointer;
}
}
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