Skip to content

B
biz.qingxiao.com
Commit 633471c4 authored by wangxuelai's avatar wangxuelai
Browse files
Options

'搜索优化'

parent 3cbe2b0c
Hide whitespace changes
Inline Side-by-side
Showing with 256 additions and 146 deletions
src/components/CourseChart.js
View file @ 633471c4
......@@ -938,8 +938,8 @@ class CourseChart extends React.Component {
</div>
<div className={pageStyle.rightbox}>
{LocalStorage.getItem('role') != 1 &&
<Select className={pageStyle.selectitem} value={scheduleListQueryParams.teacher_id} onChange={this.changeTeacher}>
<Option value="">全部老师</Option>
<Select className={pageStyle.selectitem} allowClear placeholder="全部老师" value={scheduleListQueryParams.teacher_id == '' ? undefined : scheduleListQueryParams.teacher_id} onChange={this.changeTeacher}>
{/* <Option value="">全部老师</Option> */}
{teacherList.map(ele => (
<Option key={ele.id} value={ele.id}>{ele.nickname}</Option>
))
......
src/pages/classdetail/index.js
View file @ 633471c4
......@@ -18,7 +18,7 @@ import {
} from '../../utils/index';
const { TabPane } = Tabs;
const { Option } = Select;
const { TextArea } = Input;
const { TextArea, Search } = Input;
const FormItem = Form.Item;
const { Group } = Radio;
const { RangePicker } = DatePicker;
......@@ -1667,13 +1667,16 @@ class ClassDetailForm extends React.Component {
style={{ width: '214px', marginRight: '21px' }}
placeholder="搜索学员姓名"
suffix={
<Icon type="search" style={{ color: 'rgba(0,0,0,.45)' }} />
<Icon type="search" style={{ color: 'rgba(0,0,0,.45)' }} onClick={this.handleSearchStudent} />
}
value={studentKeyword}
onChange={e => this.handleSearchKeyword(e)}
/>
<Button onClick={this.handleSearchReset} style={{ marginRight: 10 }}>重 置</Button>
<Button type="primary" onClick={this.handleSearchStudent}>搜 索</Button>
<Tooltip title="清空筛选">
<img onClick={this.handleSearchReset} className={pageStyle.resetIcon} src={`${__IMGCDN__}common/reset.png`} alt="" />
</Tooltip>
{/* <Button onClick={this.handleSearchReset} style={{ marginRight: 10 }}>重 置</Button> */}
{/* <Button type="primary" onClick={this.handleSearchStudent}>搜 索</Button> */}
</Col>
</Row>
<div className={pageStyle.studenttablebox}>
......@@ -1708,8 +1711,8 @@ class ClassDetailForm extends React.Component {
<Row type="flex" justify="space-between" className={pageStyle.courseoperate}>
<Col xs={{ span: 24 }} sm={{ span: 24 }} md={{ span: 24 }} lg={{ span: 24 }} xl={{ span: 8 }} style={{ display: 'flex', alignItems: 'center', marginBottom: '12px' }}>
<div className={pageStyle.dianmingtime}>一周点名情况 {scheduleListQueryParams.start_time}～{scheduleListQueryParams.end_time}</div>
<Select value={scheduleListQueryParams.teacher_id} onChange={this.filterTeachersSchedule}>
<Option value="">全部老师</Option>
<Select value={scheduleListQueryParams.teacher_id == '' ? undefined : scheduleListQueryParams.teacher_id} allowClear placeholder="全部老师" onChange={this.filterTeachersSchedule} style={{ width: 150 }}>
{/* <Option value="">全部老师</Option> */}
{classDetail.school_teachers && classDetail.school_teachers.map(ele => <Option key={ele.id} value={ele.id}>{ele.nickname}</Option>)}
</Select>
</Col>
......@@ -1726,6 +1729,7 @@ class ClassDetailForm extends React.Component {
}}
onChange={this.onRangePickerChange}
style={{ width: 280, marginRight: 15 }}
allowClear={false}
value={[moment(scheduleListQueryParams.start_time, 'YYYY-MM-DD'), moment(scheduleListQueryParams.end_time, 'YYYY-MM-DD')]}
/>
{hasBtnPower('sjd/classdetail', 'noPlanCallStudent') && <Button className={pageStyle.resetcourse} type="primary" onClick={this.toQuickCallStudents}>未排课直接点名</Button>}
......
src/pages/classdetail/index.less
View file @ 633471c4
......@@ -25,6 +25,12 @@
.classDetailbox {
padding: 32px 16px 27px 32px;
}
.resetIcon {
width: 14px;
height: 14px;
cursor: pointer;
margin-right: 15px;
}
.detailrow:first-child {
margin-bottom: 26px;
}
......
src/pages/teacherinfo/index.js
View file @ 633471c4
import { connect } from 'dva';
import React from 'react';
import { Icon, Button, Row, Col, message, Tabs, Select, Descriptions, InputNumber, DatePicker, Tooltip, Form, Table, Modal, Input, Pagination, Badge } from 'antd';
import { Icon, Button, Row, Col, message, Tabs, Select, Card, Descriptions, InputNumber, DatePicker, Tooltip, Form, Table, Modal, Input, Pagination, Badge } from 'antd';
import moment from 'moment';
import pageStyle from './index.less';
import { pageIn, imagify, hasBtnPower } from '../../utils/index';
......@@ -17,6 +17,7 @@ class teachersForm extends React.Component {
state = {
// visible: false,
// classInfo: {},
isExpendMore: false,
};
componentDidMount() { // 挂载
pageIn('教师详情管理');
......@@ -282,60 +283,33 @@ class teachersForm extends React.Component {
}
searchParamsChange = (e, type) => {
const { dispatch } = this.props;
switch (type) {
case 'time':
dispatch({
type: 'teachersinfo/teachersDoneRecordSearchChange',
payload: {
params: {
start_time: (e[0] && e[0].format('YYYY-MM-DD')) || '',
end_time: (e[1] && e[1].format('YYYY-MM-DD')) || '',
},
if (type == 'time') {
dispatch({
type: 'teachersinfo/teachersDoneRecordSearchChange',
payload: {
params: {
start_time: (e[0] && e[0].format('YYYY-MM-DD')) || '',
end_time: (e[1] && e[1].format('YYYY-MM-DD')) || '',
},
});
break;
case 'classId':
},
}).then(() => {
dispatch({
type: 'teachersinfo/teachersDoneRecordSearchChange',
payload: {
params: {
class_id: e,
},
},
type: 'teachersinfo/searchTeachersSchedule',
});
break;
case 'status':
dispatch({
type: 'teachersinfo/teachersDoneRecordSearchChange',
payload: {
params: {
status: e,
},
});
} else {
dispatch({
type: 'teachersinfo/teachersDoneRecordSearchChange',
payload: {
params: {
[type]: e,
},
});
break;
case 'courseId':
dispatch({
type: 'teachersinfo/teachersDoneRecordSearchChange',
payload: {
params: {
course_id: e,
},
},
});
break;
case 'class_room_id':
},
}).then(() => {
dispatch({
type: 'teachersinfo/teachersDoneRecordSearchChange',
payload: {
params: {
class_room_id: e,
},
},
type: 'teachersinfo/searchTeachersSchedule',
});
break;
default:
break;
});
}
}
searchTeachersSchedule = () => {
......@@ -356,6 +330,7 @@ class teachersForm extends React.Component {
}
resetTeachersSchedule = () => {
const { dispatch } = this.props;
this.props.form.resetFields();
dispatch({
type: 'teachersinfo/resetTeachersSchedule',
});
......@@ -417,36 +392,66 @@ class teachersForm extends React.Component {
},
});
}
handleSearchCourse = (e) => {
const { dispatch, form } = this.props;
e.preventDefault();
this.props.form.validateFields((err, values) => {
if (!err) {
const {
time,
course_id,
} = values;
let start_time;
let end_time;
if (time) {
start_time = (time[0] && moment(time[0]).format('YYYY-MM-DD')) || '';
end_time = (time[1] && moment(time[1]).format('YYYY-MM-DD')) || '';
delete ['time'];
}
dispatch({
type: 'teachersinfo/selectCourseStatistical',
payload: {
params: {
page: 1,
start_time,
end_time,
course_id,
},
handleSearchCourse = (e, key) => {
const { dispatch, courseStaticParams } = this.props;
if (key == 'time') {
const start_time = (e[0] && moment(e[0]).format('YYYY-MM-DD')) || '';
const end_time = (e[1] && moment(e[1]).format('YYYY-MM-DD')) || '';
dispatch({
type: 'teachersinfo/selectCourseStatistical',
payload: {
params: {
page: 1,
start_time,
end_time,
// course_id,
},
});
}
});
},
});
} else if (key == 'course_id') {
dispatch({
type: 'teachersinfo/selectCourseStatistical',
payload: {
params: {
page: 1,
start_time: courseStaticParams.start_time,
end_time: courseStaticParams.end_time,
course_id: e,
},
},
});
}
}
// handleSearchCourse = (e) => {
// const { dispatch, form } = this.props;
// e.preventDefault();
// this.props.form.validateFields((err, values) => {
// if (!err) {
// const {
// time,
// course_id,
// } = values;
// let start_time;
// let end_time;
// if (time) {
// start_time = (time[0] && moment(time[0]).format('YYYY-MM-DD')) || '';
// end_time = (time[1] && moment(time[1]).format('YYYY-MM-DD')) || '';
// delete ['time'];
// }
// dispatch({
// type: 'teachersinfo/selectCourseStatistical',
// payload: {
// params: {
// page: 1,
// start_time,
// end_time,
// course_id,
// },
// },
// });
// }
// });
// }
courseStaticPagination = (page, perPage) => {
const { dispatch } = this.props;
dispatch({
......@@ -487,6 +492,11 @@ class teachersForm extends React.Component {
},
});
}
expendMore = () => {
this.setState({
isExpendMore: !this.state.isExpendMore,
});
}
render() {
const {
form: { getFieldDecorator, getFieldValue },
......@@ -869,14 +879,39 @@ class teachersForm extends React.Component {
];
const formItemLayout = {
labelCol: {
xs: { span: 4 },
sm: { span: 5 },
xs: { span: 6 },
sm: { span: 4 },
md: { span: 10 },
lg: { span: 6 },
xl: { span: 5 },
},
wrapperCol: {
xs: { span: 18 },
sm: { span: 20 },
md: { span: 14 },
lg: { span: 18 },
xl: { span: 19 },
},
};
const searchFormItemLayout = {
labelCol: {
xs: { span: 9 },
sm: { span: 8 },
md: { span: 8 },
lg: { span: 8 },
xl: { span: 6 },
xxl: { span: 5 },
},
wrapperCol: {
xs: { span: 20 },
sm: { span: 19 },
sm: { span: 16 },
md: { span: 16 },
lg: { span: 16 },
xl: { span: 18 },
xxl: { span: 19 },
},
};
const { isExpendMore } = this.state;
return (
<div className={`${pageStyle.container} container`}>
<Modal
......@@ -991,54 +1026,87 @@ class teachersForm extends React.Component {
<TabPane tab="上课记录" key="2">
<div>
<div className={pageStyle.name}>
<Row
className={pageStyle.searchrow}
gutter={24}
>
<Col xs={{ span: 24 }} sm={{ span: 24 }} md={{ span: 12 }} lg={{ span: 6 }}>
<div className={pageStyle.formitemlabel}>上课时间：<RangePicker style={{ width: '100%', maxWidth: 233 }} onChange={e => this.searchParamsChange(e, 'time')} /></div>
</Col>
<Col xs={{ span: 24 }} sm={{ span: 24 }} md={{ span: 12 }} lg={{ span: 6 }}>
<div className={pageStyle.formitemlabel}>
授课班级：
<Select style={{ width: '100%', maxWidth: 233 }} placeholder="班级列表" value={copyTeachersScheduleListQueryParams.class_id} onChange={e => this.searchParamsChange(e, 'classId')}>
<Option value="">全部班级</Option>
{teacherClassListForSearch.map(ele => <Option key={ele.id} value={ele.id}>{ele.title}</Option>)}
</Select>
</div>
</Col>
<Col xs={{ span: 24 }} sm={{ span: 24 }} md={{ span: 12 }} lg={{ span: 6 }}>
<div className={pageStyle.formitemlabel}>点名状态：
<Select style={{ width: '100%', maxWidth: 233 }} placeholder="全部" value={copyTeachersScheduleListQueryParams.status} onChange={e => this.searchParamsChange(e, 'status')}>
<Option value="">全部状态</Option>
<Option value={1}>已点名</Option>
<Option value={2}>未点名</Option>
</Select>
</div>
</Col>
</Row>
<Row gutter={24} tyle="flex">
<Col xs={{ span: 24 }} sm={{ span: 24 }} md={{ span: 12 }} lg={{ span: 6 }}>
<div className={pageStyle.formitemlabel}>授课课程：
<Select style={{ width: '100%', maxWidth: 233 }} value={copyTeachersScheduleListQueryParams.course_id} placeholder="课程列表" onChange={e => this.searchParamsChange(e, 'courseId')}>
<Option value="">全部课程</Option>
{courseList.map(ele => <Option key={ele.id} value={ele.id}>{ele.title}</Option>)}
</Select>
</div>
</Col>
<Col xs={{ span: 24 }} sm={{ span: 24 }} md={{ span: 12 }} lg={{ span: 6 }}>
<div className={pageStyle.formitemlabel}>
<span style={{ marginRight: 28 }}>教室：</span>
<Select style={{ width: '100%', maxWidth: 233 }} value={copyTeachersScheduleListQueryParams.class_room_id} placeholder="教室列表" onChange={e => this.searchParamsChange(e, 'class_room_id')}>
<Option value="">全部教室</Option>
{classroomList.map(ele => <Option key={ele.id} value={ele.id}>{ele.title}</Option>)}
</Select>
</div>
<Row>
<Col span={18}>
<Row
gutter={{
sm: 12, xs: 12, md: 24, lg: 24,
}}
>
<Col style={{ marginBottom: 12 }} xs={{ span: 12 }} sm={{ span: 12 }} md={{ span: 12 }} lg={{ span: 8 }} xl={{ span: 8 }}>
<Row type="flex" align="middle">
<Col style={{ whiteSpace: 'nowrap' }} xs={{ span: 9 }} sm={{ span: 8 }} md={{ span: 8 }} lg={{ span: 8 }} xl={{ span: 7 }} xxl={{ span: 5 }}>
上课时间：
</Col>
<Col xs={{ span: 20 }} sm={{ span: 16 }} md={{ span: 16 }} lg={{ span: 16 }} xl={{ span: 17 }} xxl={{ span: 19 }}>
<RangePicker allowClear style={{ width: '100%' }} onChange={e => this.searchParamsChange(e, 'time')} />
</Col>
</Row>
</Col>
<Col style={{ marginBottom: 12 }} xs={{ span: 12 }} sm={{ span: 12 }} md={{ span: 12 }} lg={{ span: 8 }} xl={{ span: 8 }}>
<Row type="flex" align="middle">
<Col style={{ whiteSpace: 'nowrap' }} xs={{ span: 9 }} sm={{ span: 8 }} md={{ span: 8 }} lg={{ span: 8 }} xl={{ span: 7 }} xxl={{ span: 5 }}>
授课班级：
</Col>
<Col xs={{ span: 20 }} sm={{ span: 16 }} md={{ span: 16 }} lg={{ span: 16 }} xl={{ span: 17 }} xxl={{ span: 19 }}>
<Select style={{ width: '100%' }} allowClear placeholder="全部班级" value={copyTeachersScheduleListQueryParams.class_id == '' ? undefined : copyTeachersScheduleListQueryParams.class_id} onChange={e => this.searchParamsChange(e, 'class_id')}>
{teacherClassListForSearch.map(ele => <Option key={ele.id} value={ele.id}>{ele.title}</Option>)}
</Select>
</Col>
</Row>
</Col>
<Col style={{ marginBottom: 12 }} xs={{ span: 12 }} sm={{ span: 12 }} md={{ span: 12 }} lg={{ span: 8 }} xl={{ span: 8 }}>
<Row type="flex" align="middle">
<Col style={{ whiteSpace: 'nowrap' }} xs={{ span: 9 }} sm={{ span: 8 }} md={{ span: 8 }} lg={{ span: 8 }} xl={{ span: 7 }} xxl={{ span: 5 }}>
点名状态：
</Col>
<Col xs={{ span: 20 }} sm={{ span: 16 }} md={{ span: 16 }} lg={{ span: 16 }} xl={{ span: 17 }} xxl={{ span: 19 }}>
<Select style={{ width: '100%' }} allowClear placeholder="全部状态" value={copyTeachersScheduleListQueryParams.status == '' ? undefined : copyTeachersScheduleListQueryParams.status} onChange={e => this.searchParamsChange(e, 'status')}>
<Option value={1}>已点名</Option>
<Option value={2}>未点名</Option>
</Select>
</Col>
</Row>
</Col>
</Row>
<Row
gutter={{
sm: 12, xs: 12, md: 24, lg: 24,
}}
style={{ display: isExpendMore ? 'block' : 'none' }}
>
<Col style={{ marginBottom: 12 }} xs={{ span: 12 }} sm={{ span: 12 }} md={{ span: 12 }} lg={{ span: 8 }} xl={{ span: 8 }}>
<Row type="flex" align="middle">
<Col style={{ whiteSpace: 'nowrap' }} xs={{ span: 9 }} sm={{ span: 8 }} md={{ span: 8 }} lg={{ span: 8 }} xl={{ span: 7 }} xxl={{ span: 5 }}>
授课课程：
</Col>
<Col xs={{ span: 20 }} sm={{ span: 16 }} md={{ span: 16 }} lg={{ span: 16 }} xl={{ span: 17 }} xxl={{ span: 19 }}>
<Select style={{ width: '100%' }} allowClear value={copyTeachersScheduleListQueryParams.course_id == '' ? undefined : copyTeachersScheduleListQueryParams.course_id} placeholder="全部课程" onChange={e => this.searchParamsChange(e, 'course_id')}>
{courseList.map(ele => <Option key={ele.id} value={ele.id}>{ele.title}</Option>)}
</Select>
</Col>
</Row>
</Col>
<Col style={{ marginBottom: 12 }} xs={{ span: 12 }} sm={{ span: 12 }} md={{ span: 12 }} lg={{ span: 8 }} xl={{ span: 8 }}>
<Row type="flex" align="middle">
<Col style={{ whiteSpace: 'nowrap' }} xs={{ span: 9 }} sm={{ span: 8 }} md={{ span: 8 }} lg={{ span: 8 }} xl={{ span: 7 }} xxl={{ span: 5 }}>
上课教室：
</Col>
<Col xs={{ span: 20 }} sm={{ span: 16 }} md={{ span: 16 }} lg={{ span: 16 }} xl={{ span: 17 }} xxl={{ span: 19 }}>
<Select style={{ width: '100%' }} allowClear value={copyTeachersScheduleListQueryParams.class_room_id == '' ? undefined : copyTeachersScheduleListQueryParams.class_room_id} placeholder="全部教室" onChange={e => this.searchParamsChange(e, 'class_room_id')}>
{classroomList.map(ele => <Option key={ele.id} value={ele.id}>{ele.title}</Option>)}
</Select>
</Col>
</Row>
</Col>
</Row>
</Col>
<Col xs={{ span: 24 }} sm={{ span: 24 }} md={{ span: 12 }} lg={{ span: 6 }} style={{ display: 'flex', alignItems: 'end' }}>
<div className={pageStyle.mbottom15}>
<Button style={{ marginRight: '15px' }} onClick={this.resetTeachersSchedule}>重置</Button>
<Button type="primary" onClick={this.searchTeachersSchedule}>搜索</Button>
<Col span={6} style={{ paddingLeft: 15, marginBottom: 12 }}>
<div className={pageStyle.rightList}>
<Tooltip title="清空筛选">
<img onClick={this.resetTeachersSchedule} className={pageStyle.resetIcon} src={`${__IMGCDN__}common/reset.png`} alt="" />
</Tooltip>
<span className={pageStyle.expend} onClick={this.expendMore}>{isExpendMore ? '收起' : '展开'}<Icon style={{ marginLeft: 5 }} type={isExpendMore ? 'up' : 'down'} /></span>
</div>
</Col>
</Row>
......@@ -1088,43 +1156,51 @@ class teachersForm extends React.Component {
<TabPane tab="课时统计" key="4">
<div>
<div className={pageStyle.name}>
<Form labelAlign="left" onSubmit={this.handleSearchCourse}>
{/* <Form labelAlign="left" onSubmit={this.handleSearchCourse}> */}
<Form labelAlign="left">
<Row
gutter={{
sm: 2, xs: 12, md: 24, lg: 24,
sm: 24, xs: 12, md: 24, lg: 24,
}}
>
<Col xs={{ span: 24 }} sm={{ span: 24 }} md={{ span: 8 }} lg={{ span: 5 }} xl={{ span: 5 }}>
<Col xs={{ span: 24 }} sm={{ span: 24 }} md={{ span: 8 }} lg={{ span: 8 }} xl={{ span: 8 }} xxl={{ span: 6 }}>
<FormItem {...formItemLayout} label="上课时间">
{getFieldDecorator('time', {
initialValue: [null, null],
})(
<RangePicker
disabledDate={this.disabledDate}
allowClear
onChange={e => this.handleSearchCourse(e, 'time')}
style={{ width: '100%' }}
/>,
)}
</FormItem>
</Col>
<Col xs={{ span: 24 }} sm={{ span: 12 }} md={{ span: 8 }} lg={{ span: 5 }} xl={{ span: 5 }}>
<FormItem {...formItemLayout} label="课程">
{getFieldDecorator('course_id', { initialValue: '' })(
<Select style={{ width: 150 }}>
<Option value="">全部</Option>
<Col xs={{ span: 24 }} sm={{ span: 24 }} md={{ span: 8 }} lg={{ span: 8 }} xl={{ span: 8 }} xxl={{ span: 6 }}>
<FormItem {...formItemLayout} label="上课课程">
{getFieldDecorator('course_id', { initialValue: undefined })(
<Select placeholder="全部" allowClear onChange={e => this.handleSearchCourse(e, 'course_id')}>
{/* <Option value="">全部</Option> */}
{courseList.map(ele => <Option key={ele.id} value={ele.id}>{ele.title}</Option>)}
</Select>,
)}
</FormItem>
</Col>
<Col xs={{ span: 24 }} sm={{ span: 24 }} md={{ span: 8 }} lg={{ span: 5 }} xl={{ span: 5 }}>
<Col xs={{ span: 24 }} sm={{ span: 24 }} md={{ span: 8 }} lg={{ span: 8 }} xl={{ span: 5 }}>
<FormItem>
<Tooltip title="清空筛选">
<img onClick={this.handleSearchResetCourse} className={pageStyle.resetIcon} src={`${__IMGCDN__}common/reset.png`} alt="" />
</Tooltip>
</FormItem>
{/* <FormItem>
<Button onClick={this.handleSearchResetCourse} style={{ marginRight: 20 }} >
重置
</Button>
<Button type="primary" htmlType="submit">
搜索
</Button>
</FormItem>
</FormItem> */}
</Col>
</Row>
</Form>
......
src/pages/teacherinfo/index.less
View file @ 633471c4
......@@ -28,7 +28,31 @@
}
}
}
}
.rightList {
display: flex;
align-items: center;
height: 32px;
.resetIcon {
width: 14px;
height: 14px;
cursor: pointer;
margin-right: 15px;
}
.expend {
font-size:13px;
font-family:PingFangSC-Regular,PingFang SC;
font-weight:400;
color:rgba(102,102,102,1);
display: inline-block;
cursor: pointer;
}
}
.resetIcon {
width: 14px;
height: 14px;
cursor: pointer;
margin-right: 15px;
}
.headerbtn{
margin-right: 15px;
......
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