Skip to content

B
biz.qingxiao.com
Commit 6cbcb2c2 authored by baixian's avatar baixian
Browse files
Options

作业日历打卡完成

parent f4b452b7
Hide whitespace changes
Inline Side-by-side
Showing with 1664 additions and 324 deletions
src/models/createtheme.js
View file @ 6cbcb2c2
......@@ -37,10 +37,8 @@ export default {
is_encrypt: 0,
end_time: moment(moment().add(7, 'days')),
start_time: moment(moment(), 'YYYY/MM/DD HH:mm'),
homework_set: {
push_status: 2,
push_time: '09:00',
},
push_status: 2,
push_time: '09:00',
text_require_status: 2,
text_require_num: 0,
image_require_status: 2,
......@@ -51,7 +49,8 @@ export default {
audio_require_num: 0,
force_status: 2,
force_num: 0,
content_id: 0,
join_rule_type: 1,
join_secret: '',
},
calendarText: '',
calendarParams: {
......@@ -63,12 +62,8 @@ export default {
is_encrypt: 0,
end_time: moment(moment().add(7, 'days')),
start_time: moment(moment(), 'YYYY/MM/DD HH:mm'),
calendar_set: {
push_status: 2,
push_time: '09:00',
clock_start_time: moment('00:00', 'HH:mm'),
clock_end_time: moment('23:59', 'HH:mm'),
},
push_status: 2,
push_time: '09:00',
text_require_status: 2,
text_require_num: 0,
image_require_status: 2,
......@@ -79,6 +74,10 @@ export default {
audio_require_num: 0,
force_status: 2,
force_num: 0,
join_rule_type: 1,
join_secret: '',
supplement_status: 2,
supplement_num: 0,
},
rest_dates: [],
dateArray: [
......@@ -187,8 +186,8 @@ export default {
perPage: 299,
extra: 'class',
},
classes: [],
chooseClasses: [],
classes: [], // 主题班级ID
chooseClasses: [], // 选中主题班级信息
},
subscriptions: {
setup({ dispatch, history }) { // eslint-disable-line
......@@ -196,37 +195,12 @@ export default {
},
effects: {
* queryInfo({ payload }, { call, put, select }) {
yield put({
type: 'querymemberinfo',
});
yield delay(500);
yield put({
type: 'queryLandingList',
payload: {
params: {},
},
});
yield put({
type: 'queryCourseClassList',
payload: {
params: {},
},
});
},
* querymemberinfo({ payload }, { call, put, select }) { // 释放该页面存储的所有状态
const { sid } = yield select(state => state.webapp);
const nickname = yield call(commonAjax.myNickname, {
school_id: sid,
});
if (nickname.code == 200) {
console.log(nickname.data, 'nickname.data');
yield put({
type: 'updateState',
payload: {
schoolUserInfo: nickname.data,
},
});
}
},
* tabChange({ payload }, { call, put, select }) {
const { tabIndex } = payload;
......@@ -270,21 +244,50 @@ export default {
const { sid } = yield select(state => state.webapp);
const themeData = yield call(themeAjax.findTheme, {
id,
extra: 'land_content,class,subject_teacher',
});
if (themeData.code == 200) {
themeData.data.content = JSON.parse(themeData.data.content);
if (themeData.data.subject_type === 1) {
const { data } = themeData;
if (data.subject_type === 1) {
yield put({
type: 'updateState',
payload: {
jobParams: { ...themeData.data },
jobParams: {
id: data.id,
is_cheat: data.is_cheat,
title: data.title,
content: JSON.parse(data.content),
is_encrypt: data.is_encrypt,
end_time: data.homework_set.end_time,
start_time: data.homework_set.publish_time,
push_status: data.homework_set.push_status,
push_time: data.homework_set.push_time,
text_require_status: data.text_require_status,
text_require_num: data.text_require_num,
image_require_status: data.image_require_status,
image_require_num: data.image_require_num,
video_require_status: data.video_require_status,
video_require_num: data.video_require_num,
audio_require_status: data.audio_require_status,
audio_require_num: data.audio_require_num,
force_status: data.force_status,
force_num: data.force_num,
join_rule_type: data.join_rule_type,
join_secret: data.join_secret,
},
isCopy: isCopy || 0,
themeAdInfo: {
id: (themeData.data.land_content && themeData.data.land_content.id) || 0,
title: (themeData.data.land_content && themeData.data.land_content.title) || '',
},
chooseClasses: data.classes.map(ele => ({ title: ele.title, id: ele.id })),
classes: data.classes.map(ele => (ele.id)),
},
});
} else if (themeData.data.subject_type === 2) {
} else if (data.subject_type === 2) {
const { dateArray } = yield select(state => state.createtheme);
let editDates = [];
if (themeData.data.calendar_set.rest_dates != '') { editDates = themeData.data.calendar_set.rest_dates.split(','); }
if (data.calendar_set.rest_dates != '') { editDates = data.calendar_set.rest_dates.split(','); }
let day = '';
for (let i = 0; i < editDates.length; i++) {
editDates[i] = getDateStamp(editDates[i]);
......@@ -308,8 +311,37 @@ export default {
yield put({
type: 'updateState',
payload: {
calendarParams: { ...themeData.data },
calendarParams: {
supplement_status: data.calendar_set.supplement_num > 0 ? 1 : 2,
supplement_num: data.calendar_set.supplement_num,
id: data.id,
is_cheat: data.is_cheat,
title: data.title,
content: JSON.parse(data.content),
end_time: data.calendar_set.end_time,
start_time: data.calendar_set.publish_time,
push_status: data.calendar_set.push_status,
push_time: data.calendar_set.push_time,
text_require_status: data.text_require_status,
text_require_num: data.text_require_num,
image_require_status: data.image_require_status,
image_require_num: data.image_require_num,
video_require_status: data.video_require_status,
video_require_num: data.video_require_num,
audio_require_status: data.audio_require_status,
audio_require_num: data.audio_require_num,
force_status: data.force_status,
force_num: data.force_num,
join_rule_type: data.join_rule_type,
join_secret: data.join_secret,
},
isCopy: isCopy || 0,
themeAdInfo: {
id: (themeData.data.land_content && themeData.data.land_content.id) || 0,
title: (themeData.data.land_content && themeData.data.land_content.title) || '',
},
chooseClasses: data.classes.map(ele => ({ title: ele.title, id: ele.id })),
classes: data.classes.map(ele => (ele.id)),
},
});
}
......@@ -320,25 +352,12 @@ export default {
const {
themeAddLoading,
jobParams,
editorText,
calendarText,
calendarParams,
rest_dates,
isCopy,
themeAdInfo,
classes,
} = yield select(state => state.createtheme);
if (payload.title.length > 20) {
message.error('标题长度不能超过20个字！', 1);
return;
}
if (themeAddLoading) {
return;
}
yield put({
type: 'updateState',
payload: {
themeAddLoading: true,
},
});
const {
is_cheat,
is_encrypt,
......@@ -358,16 +377,13 @@ export default {
audio_require_num,
force_status,
force_num,
class_id,
start_time,
clock_start_time,
clock_end_time,
supplement_status,
supplement_num,
join_secret,
callBack,
} = payload;
let new_rest_dates = [];
const loadmessage = message.loading('保存中...', 0);
let newParams = {};
if (subject_type === 1) {
newParams = {
......@@ -382,19 +398,35 @@ export default {
...calendarParams,
};
}
delete newParams.sort;
if (newParams.homework_set) {
delete newParams.homework_set;
console.log(jobParams, 'jobParams');
console.log(calendarParams, 'calendarParams');
if (title.length > 20) {
message.error('标题长度不能超过20个字！', 1);
return;
}
if (themeAdInfo.id == 0) {
message.error('请选择营销页！', 1);
return;
}
if (newParams.join_rule_type == 4 && classes.length == 0) {
message.error('请选择班级！', 1);
return;
}
if (newParams.calendar_set) {
delete newParams.calendar_set;
if (themeAddLoading) {
return;
}
yield put({
type: 'updateState',
payload: {
themeAddLoading: true,
},
});
const loadmessage = message.loading('保存中...', 0);
const postFunction = (newParams.id != undefined) && newParams.id !== 0 && (isCopy === 0) ? themeAjax.editTheme : themeAjax.addTheme;
const data = yield call(postFunction, Object.assign(newParams, {
is_cheat,
is_encrypt,
title,
class_id,
subject_type,
school_id: sid,
publish_time,
......@@ -412,13 +444,14 @@ export default {
force_status,
force_num,
start_time,
clock_start_time,
clock_end_time,
supplement_status,
supplement_num,
content: subject_type === 1 ? JSON.stringify(jobParams.content) : JSON.stringify(calendarParams.content),
// eslint-disable-next-line prefer-spread
rest_dates: rest_dates && rest_dates.length > 0 ? new_rest_dates.join(',') : '',
content_id: themeAdInfo.id,
class_ids: classes.join(','),
join_secret,
}));
yield put({
type: 'updateState',
......@@ -439,12 +472,10 @@ export default {
{ type: 'text', value: '' },
],
is_encrypt: 0,
start_time: moment(moment(), 'YYYY/MM/DD HH:mm'),
homework_set: {
push_status: 2,
push_time: '09:00',
},
end_time: moment(moment().add(7, 'days')),
start_time: moment(moment(), 'YYYY/MM/DD HH:mm'),
push_status: 2,
push_time: '09:00',
text_require_status: 2,
text_require_num: 0,
image_require_status: 2,
......@@ -455,6 +486,14 @@ export default {
audio_require_num: 0,
force_status: 2,
force_num: 0,
join_rule_type: 1,
join_secret: '',
},
classes: [], // 主题班级ID
chooseClasses: [], // 选中主题班级信息
themeAdInfo: {
id: 0,
title: '',
},
editorText: '',
calendarText: '',
......@@ -467,12 +506,8 @@ export default {
is_encrypt: 0,
end_time: moment(moment().add(7, 'days')),
start_time: moment(moment(), 'YYYY/MM/DD HH:mm'),
calendar_set: {
push_status: 2,
push_time: '09:00',
clock_start_time: moment('00:00', 'HH:mm'),
clock_end_time: moment('23:59', 'HH:mm'),
},
push_status: 2,
push_time: '09:00',
text_require_status: 2,
text_require_num: 0,
image_require_status: 2,
......@@ -483,6 +518,10 @@ export default {
audio_require_num: 0,
force_status: 2,
force_num: 0,
join_rule_type: 1,
join_secret: '',
supplement_status: 2,
supplement_num: 0,
},
rest_dates: [],
dateArray: [
......@@ -500,35 +539,35 @@ export default {
callBack();
}
if ((newParams.id != undefined) && newParams.id !== 0) {
yield delay(500);
yield put(routerRedux.goBack());
yield put({
type: 'thememgt/getCode',
payload: {
record: {
class_id: data.data.class_id,
id: data.data.id,
title: data.data.title,
subject_type: Number(data.data.subject_type),
},
},
});
// yield delay(500);
// yield put(routerRedux.goBack());
// yield put({
// type: 'thememgt/getCode',
// payload: {
// record: {
// class_id: data.data.class_id,
// id: data.data.id,
// title: data.data.title,
// subject_type: Number(data.data.subject_type),
// },
// },
// });
} else {
yield delay(500);
yield put(routerRedux.push({
pathname: `/sjd/thememgt/${class_id}`,
}));
yield put({
type: 'thememgt/getCode',
payload: {
record: {
class_id: data.data.class_id,
id: data.data.id,
title: data.data.title,
subject_type: Number(data.data.subject_type),
},
},
});
// yield put(routerRedux.push({
// pathname: `/sjd/thememgt/${class_id}`,
// }));
// yield put({
// type: 'thememgt/getCode',
// payload: {
// record: {
// class_id: data.data.class_id,
// id: data.data.id,
// title: data.data.title,
// subject_type: Number(data.data.subject_type),
// },
// },
// });
}
} else {
yield put({
......@@ -593,6 +632,8 @@ export default {
const { index } = payload;
if (index == 1) {
yield put(routerRedux.push('/sjd/newtheme/jobclock'));
} else if (index == 2) {
yield put(routerRedux.push('/sjd/newtheme/calendarclock'));
}
},
* jobMoveContent({ payload }, { call, put, select }) {
......@@ -2301,17 +2342,25 @@ export default {
// 查询班级列表
* queryCourseClassList({ payload }, { call, put, select }) {
const { params } = payload;
const { sid } = yield select(state => state.webapp);
const { clockClassParams, schoolUserInfo } = yield select(state => state.createtheme);
const { sid, schoolUserInfo } = yield select(state => state.webapp);
const { clockClassParams, classes, chooseClasses } = yield select(state => state.createtheme);
const newParams = Object.assign({
school_id: sid,
}, clockClassParams, params);
const classListData = yield call(themeAjax.getCourseClassList, newParams);
if (classListData.code == 200) {
classListData.data.list.forEach((item) => {
const teachers = [];
// classes.forEach((t) => {
// const obj = item.classes.find(e => e.id == t);
// if (obj) {
// chooseClasses.push({
// title: obj.title,
// id: obj.id,
// });
// }
// });
item.classes.forEach((ele) => {
const name = ele.school_teachers.find(e => e.id == schoolUserInfo.schoolTeacher.id);
const name = ele.school_teachers.find(e => e.id == schoolUserInfo.id);
if (name) {
ele.school_teachers.unshift(name);
}
......@@ -2394,10 +2443,8 @@ export default {
is_encrypt: 0,
end_time: moment(moment().add(7, 'days')),
start_time: moment(moment(), 'YYYY/MM/DD HH:mm'),
homework_set: {
push_status: 2,
push_time: '09:00',
},
push_status: 2,
push_time: '09:00',
text_require_status: 2,
text_require_num: 0,
image_require_status: 2,
......@@ -2408,7 +2455,8 @@ export default {
audio_require_num: 0,
force_status: 2,
force_num: 0,
content_id: 0,
join_rule_type: 1,
join_secret: '',
},
calendarText: '',
calendarParams: {
......@@ -2420,12 +2468,8 @@ export default {
is_encrypt: 0,
end_time: moment(moment().add(7, 'days')),
start_time: moment(moment(), 'YYYY/MM/DD HH:mm'),
calendar_set: {
push_status: 2,
push_time: '09:00',
clock_start_time: moment('00:00', 'HH:mm'),
clock_end_time: moment('23:59', 'HH:mm'),
},
push_status: 2,
push_time: '09:00',
text_require_status: 2,
text_require_num: 0,
image_require_status: 2,
......@@ -2436,6 +2480,10 @@ export default {
audio_require_num: 0,
force_status: 2,
force_num: 0,
join_rule_type: 1,
join_secret: '',
supplement_status: 2,
supplement_num: 0,
},
rest_dates: [],
dateArray: [
......
src/models/index.js
View file @ 6cbcb2c2
......@@ -58,6 +58,7 @@ import holidays from './holidays';
import officialtheme from './officialtheme';
import liveclass from './liveclass';
import createmarke from './createmarke';
import newthemelist from './newthemelist';
export default {
loginModel,
indexstaicModel,
......@@ -110,4 +111,5 @@ export default {
officialtheme,
liveclass,
createmarke,
newthemelist,
};
src/models/newthemelist.js 0 → 100644
View file @ 6cbcb2c2
import { routerRedux } from 'dva/router';
import { message } from 'antd';
import { delay } from 'redux-saga';
import moment from 'moment';
import {
LocalStorage,
SessionStorage,
isExpired,
getRandomFilename,
} from '../utils/index';
import errorcode from '../common/errorcode';
import * as uploader from '../services/uploader';
import * as themeAjax from '../services/newthemelist';
export default {
namespace: 'newthemelist',
state: {
clockList: [],
clockListTotal: 0,
clockListParams: {
title: '',
page: 1,
perPage: 10,
subject_type: 1,
},
},
subscriptions: {
setup({ dispatch, history }) { // eslint-disable-line
},
},
effects: {
* queryinfo({ payload }, { call, put, select }) {
yield put({
type: 'queryList',
payload: {
params: {
},
},
});
},
* queryList({ payload }, { call, put, select }) {
const { params } = payload;
const { sid } = yield select(state => state.webapp);
const { clockListParams, clockListTotal } = yield select(state => state.newthemelist);
const loading = message.loading('数据加载中...', 0.5);
const newParams = Object.assign(clockListParams, params, {
school_id: sid,
});
let newTotal = clockListTotal;
const data = yield call(themeAjax.clockList, {
...newParams,
});
setTimeout(loading);
if (data.code == 200) {
if (data.data.total != undefined) {
newTotal = data.data.total;
}
yield put({
type: 'updateState',
payload: {
clockList: data.data && data.data.list,
clockListTotal: newTotal,
clockListParams: { ...newParams },
},
});
} else {
yield put({
type: 'webapp/errorrequestresolve',
payload: {
data,
},
});
}
},
* queryDetail({ payload }, { call, put, select }) {
const { id } = payload;
const data = yield call(themeAjax.liveDetail, {
id,
});
if (data.code == 200) {
yield put({
type: 'updateState',
payload: {
addLiveObj: {
title: data.data.title,
remark: data.data.remark,
secret: data.data.secret,
cover: data.data.cover,
live_start_time: data.data.live_start_time,
need_replay: data.data.need_replay,
pay_switch: data.data.pay_switch,
status: data.data.status,
content: JSON.parse(data.data.content),
id: data.data.id,
live_status: data.data.live_status,
},
},
});
} else {
yield put({
type: 'webapp/errorrequestresolve',
payload: {
data,
},
});
}
},
* goBack({ payload }, { call, put, select }) {
yield put(routerRedux.goBack());
},
* reset({ payload }, { call, put, select }) {
yield put({
type: 'queryList',
payload: {
params: {
title: '',
status: '',
page: 1,
perPage: 10,
},
},
});
},
* createLive({ payload }, { put, select }) {
yield put(routerRedux.push({
pathname: '/sjd/addLive',
}));
},
* goEdit({ payload }, { put, select }) {
const { id } = payload;
yield put(routerRedux.push({
pathname: `/sjd/editLive/${id}`,
}));
},
* pageInit({ payload }, { call, put, select }) {
yield put({
type: 'updateState',
payload: {
clockList: [],
clockListTotal: 0,
clockListParams: {
title: '',
page: 1,
perPage: 10,
subject_type: 1,
},
},
});
},
},
reducers: {
save(state, action) {
return { ...state, ...action.payload };
},
updateState(state, action) {
return { ...state, ...action.payload };
},
},
};
src/models/webapp.js
View file @ 6cbcb2c2
......@@ -601,6 +601,11 @@ export default {
payload: {
},
});
dispatch({
type: 'createtheme/queryInfo',
payload: {
},
});
dispatch({
type: 'createtheme/createThemeModalFind',
payload: {
......@@ -608,8 +613,9 @@ export default {
},
});
dispatch({
type: 'createtheme/queryClassList',
type: 'createtheme/queryLandingList',
payload: {
params: {},
},
});
dispatch({
......@@ -646,6 +652,12 @@ export default {
isCopy: jobClockCopyActive[2],
},
});
dispatch({
type: 'createtheme/queryLandingList',
payload: {
params: {},
},
});
dispatch({
type: 'createtheme/queryClassList',
payload: {
......@@ -671,6 +683,33 @@ export default {
},
});
}
if (pathname === '/sjd/newtheme/calendarclock') {
dispatch({
type: 'createtheme/pageInit',
payload: {
},
});
dispatch({
type: 'createtheme/queryInfo',
payload: {
},
});
dispatch({
type: 'createtheme/queryLandingList',
payload: {
params: {},
},
});
dispatch({
type: 'updateState',
payload: {
breadcrumbList: [{
path: pathname,
name: '新建日历打卡',
}],
},
});
}
const CalendarClockActive = pathToRegexp('/sjd/newtheme/calendarclock/:id').exec(pathname);
if (CalendarClockActive) {
dispatch({
......@@ -678,6 +717,17 @@ export default {
payload: {
},
});
dispatch({
type: 'createtheme/queryInfo',
payload: {
},
});
dispatch({
type: 'createtheme/queryLandingList',
payload: {
params: {},
},
});
dispatch({
type: 'createtheme/createThemeModalFind',
payload: {
......@@ -723,6 +773,17 @@ export default {
payload: {
},
});
dispatch({
type: 'createtheme/queryInfo',
payload: {
},
});
dispatch({
type: 'createtheme/queryLandingList',
payload: {
params: {},
},
});
dispatch({
type: 'createtheme/createThemeModalFind',
payload: {
......@@ -756,7 +817,7 @@ export default {
},
{
path: pathname,
name: '复制作业打卡',
name: '复制日历打卡',
},
],
},
......@@ -1419,6 +1480,20 @@ export default {
},
});
}
if (pathname === '/sjd/clockList') {
dispatch({
type: 'newthemelist/queryinfo',
});
dispatch({
type: 'updateState',
payload: {
breadcrumbList: [{
path: pathname,
name: '打卡管理',
}],
},
});
}
});
},
},
......@@ -1553,7 +1628,7 @@ export default {
yield put({
type: 'callstudents/pageInit',
});
} if (pathToRegexp('/sjd/record').exec(locationPathname)) {
} else if (pathToRegexp('/sjd/record').exec(locationPathname)) {
yield put({
type: 'classrecord/pageInit',
});
......@@ -1664,6 +1739,14 @@ export default {
yield put({
type: 'liveclass/pageInit',
});
} else if (pathToRegexp('/sjd/newtheme/jobclock').exec(locationPathname)) {
yield put({
type: 'createtheme/pageInit',
});
} else if (pathToRegexp('/sjd/newtheme/calendarclock').exec(locationPathname)) {
yield put({
type: 'createtheme/pageInit',
});
}
// yield put({
// type: 'joinschooladd/pageInit',
......
src/pages/index/index.js
View file @ 6cbcb2c2
......@@ -823,6 +823,10 @@ class StaticCenter extends React.Component {
},
});
}
goClockList = () => {
const { dispatch } = this.props;
dispatch(routerRedux.push('/sjd/clockList'));
}
render() {
const that = this;
const {
......@@ -1179,6 +1183,14 @@ class StaticCenter extends React.Component {
</div>
</Col>
}
<Col xs={{ span: 8, offset: 0 }} sm={{ span: 8, offset: 0 }} md={{ span: 8, offset: 0 }} lg={{ span: 4, offset: 1 }} xl={{ span: 4, offset: 1 }} xxl={{ span: 4, offset: 1 }}>
<div className={pageStyle.fasterItem} onClick={this.goClockList}>
<div className={pageStyle.fasterLeft}>
<img className={pageStyle.fasterImg} src={`${__IMGCDN__}index/index_icon11.png?v=1`} alt="" />
</div>
<span>打卡列表</span>
</div>
</Col>
</Row>
</div>
}
......
src/pages/newtheme/calendarclock/index.js
View file @ 6cbcb2c2
......@@ -21,12 +21,14 @@ import pageStyle from './index.less';
import { hasBtnPower, imagify, getWeek, formatMonth } from '../../../utils';
import ThemeEditor from '../ThemeEditor';
import CommentEditorBox from '../../clockmgt/commenteditorbox';
import ChooseClass from '../components/ChooseClass';
import MarketingListModal from '../components/MarketingListModal';
import AddMarkeModal from '../components/AddMarkeModal';
const { TabPane } = Tabs;
const FormItem = Form.Item;
const { Option } = Select;
const { TextArea } = Input;
const { RangePicker } = DatePicker;
const { Panel } = Collapse;
class CalendarClockForm extends React.Component {
constructor(props) {
super(props);
......@@ -48,7 +50,6 @@ class CalendarClockForm extends React.Component {
if (!err) {
const {
is_cheat,
is_encrypt,
title,
content,
subject_type,
......@@ -65,11 +66,9 @@ class CalendarClockForm extends React.Component {
audio_require_num,
force_status,
force_num,
class_id,
clock_start_time,
clock_end_time,
supplement_status,
supplement_num,
join_secret,
} = values;
dispatch({
type: 'createtheme/createThemeModalAdd',
......@@ -77,13 +76,10 @@ class CalendarClockForm extends React.Component {
title,
subject_type,
is_cheat: (is_cheat === true) && (is_cheat != undefined) ? 1 : 0,
is_encrypt: (is_encrypt === true) && (is_encrypt != undefined) ? 1 : 0,
start_time: clockDate[0].format('YYYY-MM-DD HH:mm'),
end_time: clockDate[1].format('YYYY-MM-DD HH:mm'),
push_status,
push_time: push_status == 1 ? push_time.format('HH:mm') : '09:00',
clock_start_time: clock_start_time.format('HH:mm'),
clock_end_time: clock_end_time.format('HH:mm'),
text_require_status: (text_require_status === true) && (text_require_status != undefined) ? 1 : 2,
text_require_num: text_require_num || 0,
image_require_status: (image_require_status === true) && (image_require_status != undefined) ? 1 : 2,
......@@ -97,7 +93,7 @@ class CalendarClockForm extends React.Component {
force_status: (force_status === true) && (force_status != undefined) ? 1 : 2,
force_num: force_num || 0,
content,
class_id,
join_secret,
callBack: () => {
form.resetFields();
this.setState({
......@@ -257,12 +253,156 @@ class CalendarClockForm extends React.Component {
},
});
}
handleClickMarketing = () => {
const { dispatch } = this.props;
dispatch({
type: 'createtheme/updateState',
payload: {
marketingVisible: true,
},
});
}
closeMarketing = () => {
const { dispatch } = this.props;
dispatch({
type: 'createtheme/updateState',
payload: {
marketingVisible: false,
},
});
}
getMarketingId=(item) => {
const { dispatch } = this.props;
dispatch({
type: 'createtheme/updateState',
payload: {
themeAdInfo: {
id: item.id,
title: item.title,
},
marketingVisible: false,
},
});
}
addMarke = () => {
const { dispatch } = this.props;
dispatch({
type: 'createmarke/updateState',
payload: {
addMarkeVisible: true,
},
});
}
handleChangeMarke = ({ page, perPage }) => {
const { dispatch } = this.props;
dispatch({
type: 'createtheme/queryLandingList',
payload: {
params: {
page,
perPage,
},
},
});
}
editMarke = (item) => {
const { dispatch } = this.props;
dispatch({
type: 'createmarke/editMarke',
payload: {
item,
},
});
}
deleteMarke = (item) => {
const { dispatch } = this.props;
Modal.confirm({
title: '确认要删除这个营销页吗？',
okText: '确认',
cancelText: '取消',
okType: 'danger',
centered: true,
okButtonProps: {
type: 'danger',
style: {
color: '#fff',
backgroundColor: '#ff4d4f',
borderColor: '#ff4d4f',
},
},
icon: <Icon type="close-circle" style={{ color: 'red' }} />,
onOk: () => {
dispatch({
type: 'createmarke/deleteMarke',
payload: {
item,
},
});
},
onCancel: () => {
},
});
}
changeCourseClass = (type) => {
const { dispatch } = this.props;
dispatch({
type: 'createtheme/queryCourseClassList',
payload: {
params: {
extra: type,
},
},
});
}
handleChooseClass = ({ classes, chooseClasses }) => {
const { dispatch } = this.props;
dispatch({
type: 'createtheme/updateState',
payload: {
classes: [...classes],
chooseClasses: [...chooseClasses],
},
});
}
saveClasses = (classes) => {
const { dispatch } = this.props;
dispatch({
type: 'createtheme/updateState',
payload: {
classes: [...classes],
clockClassVisible: false,
},
});
}
handleClickRule = (type) => {
const { dispatch, calendarParams } = this.props;
calendarParams.join_rule_type = type;
dispatch({
type: 'createtheme/updateState',
payload: {
calendarParams: { ...calendarParams },
},
});
if (type == 2 || type == 4) {
dispatch({
type: 'createtheme/queryCourseClassList',
payload: {
params: {},
},
});
dispatch({
type: 'createtheme/updateState',
payload: {
clockClassVisible: true,
},
});
}
}
render() {
const { isShow, calendarShow, textLength } = this.state;
const {
form: { getFieldDecorator, getFieldValue },
themeAddLoading,
classList,
calendarParams,
dateArray,
rest_dates,
......@@ -271,6 +411,17 @@ class CalendarClockForm extends React.Component {
selectPlanDays,
isCopy,
progressRate,
marketingVisible,
landingList,
themeAdInfo,
landingParams,
landingTotal,
clockClassVisible,
clockClassList,
clockClassParams,
classes,
chooseClasses,
addMarkeVisible,
} = this.props;
let new_rest_dates = [];
new_rest_dates = [...new Set(new_rest_dates.concat(...rest_dates))];
......@@ -331,21 +482,6 @@ class CalendarClockForm extends React.Component {
<Input maxLength={20} onChange={e => this.titleChange(e)} addonAfter={selectBefore} placeholder="请输入标题" style={{ width: 435 }} />,
)}
</FormItem>
<FormItem {...formItemModalLineLayout} label="选择班级">
{getFieldDecorator('class_id', {
initialValue: calendarParams.class_id,
rules: [
{
required: true,
message: '请选择班级',
},
],
})(
<Select disabled={(calendarParams.class_id && calendarParams.class_id != undefined) && (isCopy === 0)} placeholder="请选择班级" style={{ width: 435 }} showSearch onChange={this.handleStudentChange}>
{classList.map(ele => <Option key={ele.id} value={ele.id}>{ele.title}</Option>)}
</Select>,
)}
</FormItem>
{getFieldDecorator('subject_type', { initialValue: 2 })(<Input type="hidden" />)}
<FormItem {...formItemModalLineLayout} label="打卡时间">
{getFieldDecorator('clockDate', {
......@@ -368,7 +504,7 @@ class CalendarClockForm extends React.Component {
<div className={pageStyle.pushlocation}>
<FormItem {...formItemModalLineLayout} label="定时提醒">
{getFieldDecorator('push_status', {
initialValue: calendarParams.calendar_set.push_status,
initialValue: calendarParams.push_status,
})(
<Radio.Group>
<Radio value={2}>关闭提醒</Radio>
......@@ -379,7 +515,7 @@ class CalendarClockForm extends React.Component {
{getFieldValue('push_status') === 1 ? (
<FormItem style={{ marginBottom: 0 }}>
{getFieldDecorator('push_time', {
initialValue: moment(calendarParams.calendar_set.push_time, 'HH:mm'),
initialValue: moment(calendarParams.push_time, 'HH:mm'),
rules: [
{
required: true,
......@@ -394,38 +530,6 @@ class CalendarClockForm extends React.Component {
</div>
</FormItem>
</div>
<div className={pageStyle.clockflex}>
<div className={pageStyle.clockflexLeft}>打卡时限:</div>
<div className={pageStyle.clockflexRight}>
<FormItem {...formItemModalLineLayout}>
{getFieldDecorator('clock_start_time', {
initialValue: moment(calendarParams.calendar_set.clock_start_time, 'HH:mm'),
rules: [
{
required: true,
message: '请选择打卡时限开始时间',
},
],
})(
<TimePicker style={{ width: 170 }} format="HH:mm" />,
)}
</FormItem>
<span className={pageStyle.toblock}>至</span>
<FormItem {...formItemModalLineLayout}>
{getFieldDecorator('clock_end_time', {
initialValue: moment(calendarParams.calendar_set.clock_end_time, 'HH:mm'),
rules: [
{
required: true,
message: '请选择打卡时限结束时间',
},
],
})(
<TimePicker style={{ width: 170 }} format="HH:mm" />,
)}
</FormItem>
</div>
</div>
<FormItem {...formItemModalLineLayout} label="休息日设置">
<div className={pageStyle.rowFlex}>
<div className={pageStyle.calendarlist}>
......@@ -481,8 +585,121 @@ class CalendarClockForm extends React.Component {
</div>
</FormItem>
<Divider />
<div className={pageStyle.title} >打卡营销页</div>
<FormItem {...formItemModalLineLayout} label="打卡营销页">
<span onClick={this.handleClickMarketing}>{themeAdInfo.title ? themeAdInfo.title : '请选择营销页'}<Icon type="right" /></span>
</FormItem>
<p>可在学生加入打卡前展示, 此功能可收集有意向学生的联系方式 <span>了解详情</span></p>
<div className={pageStyle.title}>更多设置 <span onClick={this.handleClickShow} className={pageStyle.pack}>{isShow ? '收起' : '展开'}</span></div>
<div className={isShow ? pageStyle.panpelBox : pageStyle.panpelhideBox}>
<div className={pageStyle.commonwrap}>
<div className={pageStyle.commonleft}>
参与打卡方式：
</div>
<div className={pageStyle.commonright}>
<FormItem {...formItemModaltypeLayout} label="" style={{ marginBottom: 0 }}>
<div className={pageStyle.radioList}>
<div className={pageStyle.radioItem} onClick={() => this.handleClickRule(1)}>
<div className={pageStyle.radioTop}>
<div className={pageStyle.radioText}>任何人都可参与&nbsp;<span>(无通知)</span></div>
<div className={pageStyle.radioRight}>
{
calendarParams.join_rule_type == 1 ?
<img className={pageStyle.check} src={`${__IMGCDN__}theme/radio_active.png`} alt="" />
:
<img className={pageStyle.check} src={`${__IMGCDN__}theme/radio.png`} alt="" />
}
</div>
</div>
</div>
<div className={pageStyle.radioItem} onClick={() => this.handleClickRule(2)}>
<div className={pageStyle.radioTop}>
<div className={pageStyle.radioText}>任何人都可参与&nbsp;<span>(指定班级学生收到通知)</span></div>
<div className={pageStyle.radioRight}>
{
calendarParams.join_rule_type == 2 ?
<img className={pageStyle.check} src={`${__IMGCDN__}theme/radio_active.png`} alt="" />
:
<img className={pageStyle.check} src={`${__IMGCDN__}theme/radio.png`} alt="" />
}
</div>
</div>
{
calendarParams.join_rule_type == 2 &&
<div className={pageStyle.radioName}>
{chooseClasses.map(ele => ele.title).join(',')}
</div>
}
</div>
<div className={pageStyle.radioItem} onClick={() => this.handleClickRule(3)}>
<div className={pageStyle.radioTop}>
<div className={pageStyle.radioText}>输入密码都可参与</div>
<div className={pageStyle.radioRight}>
{
calendarParams.join_rule_type == 3 ?
<img className={pageStyle.check} src={`${__IMGCDN__}theme/radio_active.png`} alt="" />
:
<img className={pageStyle.check} src={`${__IMGCDN__}theme/radio.png`} alt="" />
}
</div>
</div>
{
calendarParams.join_rule_type == 3 &&
<FormItem {...formItemModaltypeLayout} label="" style={{ marginBottom: 0 }}>
{getFieldDecorator('join_secret', {
initialValue: calendarParams.join_secret,
rules: [
{
required: true,
message: '请设置密码',
},
{
message: '请输入正整数',
pattern: new RegExp(/^[0-9]\d*$/, 'g'),
},
],
})(
<Input style={{ width: 200 }} maxLength={6} placeholder="请设置密码" />,
)}
</FormItem>
}
</div>
<div className={pageStyle.radioItem} onClick={() => this.handleClickRule(4)}>
<div className={pageStyle.radioTop}>
<div className={pageStyle.radioText}>指定班级学生参与</div>
<div className={pageStyle.radioRight}>
{
calendarParams.join_rule_type == 4 ?
<img className={pageStyle.check} src={`${__IMGCDN__}theme/radio_active.png`} alt="" />
:
<img className={pageStyle.check} src={`${__IMGCDN__}theme/radio.png`} alt="" />
}
</div>
</div>
{
calendarParams.join_rule_type == 4 &&
<div className={pageStyle.radioName}>
{chooseClasses.map(ele => ele.title).join(',')}
</div>
}
</div>
</div>
</FormItem>
</div>
</div>
{(Number(calendarParams.join_rule_type) == 2 || Number(calendarParams.join_rule_type) == 4) ?
<ChooseClass
visible={clockClassVisible}
list={clockClassList}
clockClassParams={clockClassParams}
changeCourseClass={this.changeCourseClass}
classes={classes}
chooseClasses={chooseClasses}
choose={this.handleChooseClass}
saveClasses={this.saveClasses}
/>
: null
}
<div className={pageStyle.commonwrap}>
<div className={pageStyle.commonleft}>
打卡要求：
......@@ -580,15 +797,6 @@ class CalendarClockForm extends React.Component {
)}
<span className="ant-form-text1">开启后，学生需先完成打卡，才能看到其他学员打卡内容</span>
</FormItem>
<FormItem {...formItemModaltypeLayout} label="打卡主题加密" style={{ marginBottom: 0 }}>
{getFieldDecorator('is_encrypt', {
initialValue: calendarParams.is_encrypt === 1,
valuePropName: 'checked',
})(
<Switch checkedChildren="开启" unCheckedChildren="关闭" />,
)}
<span className="ant-form-text1">开启后，打卡主题仅班级学员可以查看，非班级学员只能看到作业</span>
</FormItem>
<FormItem {...formItemModaltypeLayout} label="强制阅读模式" style={{ marginBottom: 0 }}>
{getFieldDecorator('force_status', {
initialValue: calendarParams.force_status === 1,
......@@ -610,7 +818,7 @@ class CalendarClockForm extends React.Component {
)}
<FormItem {...formItemModaltypeLayout} label="补打卡设置" style={{ marginBottom: 0 }}>
{getFieldDecorator('supplement_status', {
initialValue: calendarParams.calendar_set.supplement_status === 1,
initialValue: calendarParams.supplement_status === 1,
valuePropName: 'checked',
})(
<Switch checkedChildren="开启" unCheckedChildren="关闭" />,
......@@ -619,7 +827,7 @@ class CalendarClockForm extends React.Component {
</FormItem>
{getFieldValue('supplement_status') === true ? (
<FormItem {...formItemverticalLayout} labelAlign="right" label="学员最多补打卡">
{getFieldDecorator('supplement_num', { initialValue: calendarParams.calendar_set.supplement_num })(
{getFieldDecorator('supplement_num', { initialValue: calendarParams.supplement_num })(
<InputNumber placeholder="请输入" min={0} style={{ width: 100 }} />,
)}
<span className="ant-form-text">次</span>
......@@ -643,6 +851,22 @@ class CalendarClockForm extends React.Component {
moveContent={this.calendarMoveContent}
progressRate={progressRate}
/>
<MarketingListModal
visible={marketingVisible}
list={landingList}
id={themeAdInfo.id}
landingTotal={landingTotal}
landingParams={landingParams}
close={this.closeMarketing}
getID={this.getMarketingId}
createMarke={this.addMarke}
changePagination={this.handleChangeMarke}
editMarke={this.editMarke}
deleteMarke={this.deleteMarke}
/>
<AddMarkeModal
visible={addMarkeVisible}
/>
<FormItem {...submitFormLayout} style={{ marginTop: 32 }}>
<Button type="primary" htmlType="submit" loading={themeAddLoading}>
发布主题
......@@ -670,7 +894,20 @@ function mapStateToProps(state) {
selectPlanDays,
isCopy,
progressRate,
marketingVisible,
landingList,
themeAdInfo,
landingParams,
landingTotal,
clockClassVisible,
clockClassList,
clockClassParams,
classes,
chooseClasses,
} = state.createtheme;
const {
addMarkeVisible,
} = state.createmarke;
return {
themeAddLoading,
classList,
......@@ -683,6 +920,16 @@ function mapStateToProps(state) {
selectPlanDays,
isCopy,
progressRate,
marketingVisible,
landingList,
themeAdInfo,
landingParams,
landingTotal,
clockClassVisible,
clockClassList,
clockClassParams,
classes,
chooseClasses,
};
}
export default connect(mapStateToProps)(CalendarClock);
......
src/pages/newtheme/calendarclock/index.less
View file @ 6cbcb2c2
......@@ -308,3 +308,40 @@
}
}
}
.radioList {
width: 300px;
.radioItem {
border-bottom: 1px solid #e8e8e8;
.radioName {
font-size: 12px;
color: #000;
line-height: 20px;
}
.radioTop {
display: flex;
align-items: center;
cursor: pointer;
.radioText {
display: flex;
align-items: center;
font-size:13px;
font-family:PingFangSC-Regular,PingFang SC;
font-weight:400;
color:rgba(34,34,34,1);
width: 300px;
&>span {
font-size:13px;
font-family:PingFangSC-Regular,PingFang SC;
font-weight:400;
color:#999999;
}
}
.radioRight {
.check {
width: 19px;
height: 19px;
}
}
}
}
}
src/pages/newtheme/components/ChooseClass.js
View file @ 6cbcb2c2
......@@ -8,7 +8,7 @@ import {
Button,
} from 'antd';
import pageStyle from './ChooseClass.less';
import { pageIn, hasBtnPower, imagify, ossVideofy } from '../../../utils/index';
import { pageIn, hasBtnPower, imagify, indexOf } from '../../../utils/index';
const FormItem = Form.Item;
const { TextArea } = Input;
class ChooseClassModal extends React.Component {
......@@ -26,10 +26,6 @@ class ChooseClassModal extends React.Component {
indexOf = (arr, item) => {
return arr.indexOf(item);
}
close = () => {
const { close, form } = this.props;
close();
}
changeCourseClass = (type) => {
const { changeCourseClass } = this.props;
changeCourseClass(type);
......@@ -71,14 +67,13 @@ class ChooseClassModal extends React.Component {
visible={visible}
zIndex={110}
width={600}
maskClosable={false}
keyboard={false}
closable={false}
bodyStyle={{
padding: '10px 20px',
}}
title="选择参与打卡的班级"
onCancel={this.close}
okText="保存"
cancelText="取消"
onOk={this.save}
footer={null}
>
<div>
......
src/pages/newtheme/jobclock/index.js
View file @ 6cbcb2c2
......@@ -54,7 +54,6 @@ class JobClockForm extends React.Component {
is_cheat,
is_encrypt,
title,
content,
subject_type,
clockDate,
push_status,
......@@ -69,39 +68,38 @@ class JobClockForm extends React.Component {
audio_require_num,
force_status,
force_num,
class_id,
join_secret,
} = values;
// dispatch({
// type: 'createtheme/createThemeModalAdd',
// payload: {
// title,
// subject_type,
// is_cheat: (is_cheat === true) && (is_cheat != undefined) ? 1 : 0,
// is_encrypt: (is_encrypt === true) && (is_encrypt != undefined) ? 1 : 0,
// publish_time: clockDate[0].format('YYYY-MM-DD HH:mm'),
// end_time: clockDate[1].format('YYYY-MM-DD HH:mm'),
// push_status,
// push_time: push_status == 1 ? push_time.format('HH:mm') : '09:00',
// text_require_status: (text_require_status === true) && (text_require_status != undefined) ? 1 : 2,
// text_require_num: text_require_num || 0,
// image_require_status: (image_require_status === true) && (image_require_status != undefined) ? 1 : 2,
// image_require_num: image_require_num || 0,
// video_require_status: (video_require_status === true) && (video_require_status != undefined) ? 1 : 2,
// video_require_num: video_require_num || 0,
// audio_require_status: (audio_require_status === true) && (audio_require_status != undefined) ? 1 : 2,
// audio_require_num: audio_require_num || 0,
// force_status: (force_status === true) && (force_status != undefined) ? 1 : 2,
// force_num: force_num || 0,
// content,
// class_id,
// callBack: () => {
// form.resetFields();
// this.setState({
// textLength: 0,
// });
// },
// },
// });
dispatch({
type: 'createtheme/createThemeModalAdd',
payload: {
title,
subject_type,
is_cheat: (is_cheat === true) && (is_cheat != undefined) ? 1 : 0,
is_encrypt: (is_encrypt === true) && (is_encrypt != undefined) ? 1 : 0,
publish_time: clockDate[0].format('YYYY-MM-DD HH:mm'),
end_time: clockDate[1].format('YYYY-MM-DD HH:mm'),
push_status,
push_time: push_status == 1 ? push_time.format('HH:mm') : '09:00',
text_require_status: (text_require_status === true) && (text_require_status != undefined) ? 1 : 2,
text_require_num: text_require_num || 0,
image_require_status: (image_require_status === true) && (image_require_status != undefined) ? 1 : 2,
image_require_num: image_require_num || 0,
video_require_status: (video_require_status === true) && (video_require_status != undefined) ? 1 : 2,
video_require_num: video_require_num || 0,
audio_require_status: (audio_require_status === true) && (audio_require_status != undefined) ? 1 : 2,
audio_require_num: audio_require_num || 0,
force_status: (force_status === true) && (force_status != undefined) ? 1 : 2,
force_num: force_num || 0,
join_secret,
callBack: () => {
form.resetFields();
this.setState({
textLength: 0,
});
},
},
});
}
});
}
......@@ -298,28 +296,6 @@ class JobClockForm extends React.Component {
},
});
}
handleChangeRadio = (e) => {
const { dispatch } = this.props;
if (Number(e.target.value) == 2 || Number(e.target.value) == 4) {
dispatch({
type: 'createtheme/updateState',
payload: {
clockClassVisible: true,
},
});
}
}
closeClassList = () => {
const { dispatch } = this.props;
dispatch({
type: 'createtheme/updateState',
payload: {
clockClassVisible: false,
classes: [],
chooseClasses: [],
},
});
}
changeCourseClass = (type) => {
const { dispatch } = this.props;
dispatch({
......@@ -336,8 +312,8 @@ class JobClockForm extends React.Component {
dispatch({
type: 'createtheme/updateState',
payload: {
classes,
chooseClasses,
classes: [...classes],
chooseClasses: [...chooseClasses],
},
});
}
......@@ -346,10 +322,35 @@ class JobClockForm extends React.Component {
dispatch({
type: 'createtheme/updateState',
payload: {
classes,
classes: [...classes],
clockClassVisible: false,
},
});
}
handleClickRule = (type) => {
const { dispatch, jobParams } = this.props;
jobParams.join_rule_type = type;
dispatch({
type: 'createtheme/updateState',
payload: {
jobParams: { ...jobParams },
},
});
if (type == 2 || type == 4) {
dispatch({
type: 'createtheme/queryCourseClassList',
payload: {
params: {},
},
});
dispatch({
type: 'createtheme/updateState',
payload: {
clockClassVisible: true,
},
});
}
}
render() {
const { isShow, textLength } = this.state;
const {
......@@ -372,6 +373,8 @@ class JobClockForm extends React.Component {
classes,
chooseClasses,
} = this.props;
console.log(classes, 'classes');
console.log(chooseClasses, 'chooseClasses');
const formItemModalLineLayout = {
labelCol: {
xs: { span: 2 },
......@@ -434,21 +437,6 @@ class JobClockForm extends React.Component {
<Input maxLength={20} onChange={e => this.titleChange(e)} addonAfter={selectBefore} placeholder="请输入标题" style={{ width: 435 }} />,
)}
</FormItem>
{/* <FormItem {...formItemModalLineLayout} label="选择班级"> */}
{/* {getFieldDecorator('class_id', { */}
{/* initialValue: jobParams.class_id, */}
{/* rules: [ */}
{/* { */}
{/* required: true, */}
{/* message: '请选择班级', */}
{/* }, */}
{/* ], */}
{/* })( */}
{/* <Select disabled={(jobParams.class_id && jobParams.class_id != undefined) && (isCopy === 0)} placeholder="请选择班级" style={{ width: 435 }} showSearch onChange={this.handleStudentChange}> */}
{/* {classList.map(ele => <Option key={ele.id} value={ele.id}>{ele.title}</Option>)} */}
{/* </Select>, */}
{/* )} */}
{/* </FormItem> */}
{getFieldDecorator('subject_type', { initialValue: 1 })(<Input type="hidden" />)}
<FormItem {...formItemModalLineLayout} label="打卡时间">
{getFieldDecorator('clockDate', {
......@@ -469,9 +457,9 @@ class JobClockForm extends React.Component {
)}
</FormItem>
<div className={pageStyle.pushlocation}>
<FormItem {...formItemModalLineLayout} label="定时提醒">
<FormItem {...formItemModalLineLayout} label="打卡提醒">
{getFieldDecorator('push_status', {
initialValue: jobParams.homework_set.push_status,
initialValue: jobParams.push_status,
},
)(
<Radio.Group>
......@@ -483,7 +471,7 @@ class JobClockForm extends React.Component {
{getFieldValue('push_status') === 1 ? (
<FormItem style={{ marginBottom: 0 }}>
{getFieldDecorator('push_time', {
initialValue: moment(jobParams.homework_set.push_time, 'HH:mm'),
initialValue: moment(jobParams.push_time, 'HH:mm'),
rules: [
{
required: true,
......@@ -512,41 +500,98 @@ class JobClockForm extends React.Component {
</div>
<div className={pageStyle.commonright}>
<FormItem {...formItemModaltypeLayout} label="" style={{ marginBottom: 0 }}>
{getFieldDecorator('join_rule_type', {
initialValue: '',
})(
<Radio.Group onChange={this.handleChangeRadio}>
<Radio style={radioStyle} value="1"><div className={pageStyle.radioText}>任何人都可参与&nbsp;<span>(无通知)</span></div></Radio>
<Radio style={radioStyle} value="2"><div className={pageStyle.radioText}>任何人都可参与&nbsp;<span>(指定班级学生收到通知)</span></div></Radio>
<Radio style={radioStyle} value="4"><div className={pageStyle.radioText}>指定班级学生参与</div></Radio>
<Radio style={radioStyle} value="3"><div className={pageStyle.radioText}>输入密码都可参与&nbsp;<span>(无通知)</span></div>
</Radio>
</Radio.Group>,
)}
{Number(getFieldValue('join_rule_type')) == 3 ?
<div>
<FormItem {...formItemModaltypeLayout} label="" style={{ marginBottom: 0 }}>
{getFieldDecorator('join_secret', {
initialValue: '',
rules: [
{
message: '请输入正整数',
pattern: new RegExp(/^[0-9]\d*$/, 'g'),
},
],
})(
<Input style={{ width: 200 }} maxLength={6} placeholder="请设置密码" />,
)}
</FormItem>
<div className={pageStyle.radioList}>
<div className={pageStyle.radioItem} onClick={() => this.handleClickRule(1)}>
<div className={pageStyle.radioTop}>
<div className={pageStyle.radioText}>任何人都可参与&nbsp;<span>(无通知)</span></div>
<div className={pageStyle.radioRight}>
{
jobParams.join_rule_type == 1 ?
<img className={pageStyle.check} src={`${__IMGCDN__}theme/radio_active.png`} alt="" />
:
<img className={pageStyle.check} src={`${__IMGCDN__}theme/radio.png`} alt="" />
}
</div>
</div>
</div>
<div className={pageStyle.radioItem} onClick={() => this.handleClickRule(2)}>
<div className={pageStyle.radioTop}>
<div className={pageStyle.radioText}>任何人都可参与&nbsp;<span>(指定班级学生收到通知)</span></div>
<div className={pageStyle.radioRight}>
{
jobParams.join_rule_type == 2 ?
<img className={pageStyle.check} src={`${__IMGCDN__}theme/radio_active.png`} alt="" />
:
<img className={pageStyle.check} src={`${__IMGCDN__}theme/radio.png`} alt="" />
}
</div>
</div>
{
jobParams.join_rule_type == 2 &&
<div className={pageStyle.radioName}>
{chooseClasses.map(ele => ele.title).join(',')}
</div>
}
</div>
<div className={pageStyle.radioItem} onClick={() => this.handleClickRule(3)}>
<div className={pageStyle.radioTop}>
<div className={pageStyle.radioText}>输入密码都可参与</div>
<div className={pageStyle.radioRight}>
{
jobParams.join_rule_type == 3 ?
<img className={pageStyle.check} src={`${__IMGCDN__}theme/radio_active.png`} alt="" />
:
<img className={pageStyle.check} src={`${__IMGCDN__}theme/radio.png`} alt="" />
}
</div>
</div>
{
jobParams.join_rule_type == 3 &&
<FormItem {...formItemModaltypeLayout} label="" style={{ marginBottom: 0 }}>
{getFieldDecorator('join_secret', {
initialValue: jobParams.join_secret,
rules: [
{
required: true,
message: '请设置密码',
},
{
message: '请输入正整数',
pattern: new RegExp(/^[0-9]\d*$/, 'g'),
},
],
})(
<Input style={{ width: 200 }} maxLength={6} placeholder="请设置密码" />,
)}
</FormItem>
}
</div>
<div className={pageStyle.radioItem} onClick={() => this.handleClickRule(4)}>
<div className={pageStyle.radioTop}>
<div className={pageStyle.radioText}>指定班级学生参与</div>
<div className={pageStyle.radioRight}>
{
jobParams.join_rule_type == 4 ?
<img className={pageStyle.check} src={`${__IMGCDN__}theme/radio_active.png`} alt="" />
:
<img className={pageStyle.check} src={`${__IMGCDN__}theme/radio.png`} alt="" />
}
</div>
</div>
{
jobParams.join_rule_type == 4 &&
<div className={pageStyle.radioName}>
{chooseClasses.map(ele => ele.title).join(',')}
</div>
}
</div>
: null}
</div>
</FormItem>
</div>
</div>
{(Number(getFieldValue('join_rule_type')) == 2 || Number(getFieldValue('join_rule_type')) == 4) ?
{(Number(jobParams.join_rule_type) == 2 || Number(jobParams.join_rule_type) == 4) ?
<ChooseClass
visible={clockClassVisible}
close={this.closeClassList}
list={clockClassList}
clockClassParams={clockClassParams}
changeCourseClass={this.changeCourseClass}
......@@ -707,7 +752,7 @@ class JobClockForm extends React.Component {
/>
<FormItem {...submitFormLayout} style={{ marginTop: 32 }}>
<Button type="primary" htmlType="submit" loading={themeAddLoading}>
发布主题
发布打卡
</Button>
</FormItem>
</Form>
......
src/pages/newtheme/jobclock/index.less
View file @ 6cbcb2c2
......@@ -84,16 +84,41 @@
}
}
}
.radioText {
display: inline-flex;
font-size:13px;
font-family:PingFangSC-Regular,PingFang SC;
font-weight:400;
color:rgba(34,34,34,1);
&>span {
font-size:13px;
font-family:PingFangSC-Regular,PingFang SC;
font-weight:400;
color:#999999;
.radioList {
width: 300px;
.radioItem {
border-bottom: 1px solid #e8e8e8;
.radioName {
font-size: 12px;
color: #000;
line-height: 20px;
}
.radioTop {
display: flex;
align-items: center;
cursor: pointer;
.radioText {
display: flex;
align-items: center;
font-size:13px;
font-family:PingFangSC-Regular,PingFang SC;
font-weight:400;
color:rgba(34,34,34,1);
width: 300px;
&>span {
font-size:13px;
font-family:PingFangSC-Regular,PingFang SC;
font-weight:400;
color:#999999;
}
}
.radioRight {
.check {
width: 19px;
height: 19px;
}
}
}
}
}
src/pages/newthemelist/index.js 0 → 100644
View file @ 6cbcb2c2
import { connect } from 'dva';
import React from 'react';
import {
Icon,
Button,
Row,
Col,
Input,
Select,
Checkbox,
Table,
Modal,
Form,
Alert,
Badge,
message,
Pagination,
Tooltip, DatePicker,
Divider,
Avatar,
} from 'antd';
import moment from 'moment';
import { routerRedux } from 'dva/router';
import pageStyle from './index.less';
import { pageIn, hasBtnPower, btnPermission, translateType, imagify } from '../../utils/index';
import BtnPermission from '../../components/BtnPermission';
const { Option } = Select;
const { TextArea } = Input;
const { Search } = Input;
const { RangePicker } = DatePicker;
class LiveClass extends React.Component {
constructor(props) {
super(props);
this.state = {
};
}
componentDidMount() { // 挂载
pageIn('打卡管理');
}
disabledDate = (current) => {
return current && current > moment();
}
componentWillUnmount() { // 卸载
}
sizeChange = (page, perPage) => {
const { dispatch } = this.props;
dispatch({
type: 'newthemelist/queryList',
payload: {
params: {
page: 1,
perPage,
},
},
});
}
changePagination = (page, perPage) => {
const { dispatch } = this.props;
dispatch({
type: 'newthemelist/queryList',
payload: {
params: {
page,
perPage,
},
},
});
}
searchParamsChange = (e, type, key) => {
const { dispatch } = this.props;
let getvalue = '';
if (type == 'Input') {
getvalue = e;
} else if (type == 'Select') {
getvalue = e;
}
dispatch({
type: 'newthemelist/queryList',
payload: {
params: {
page: 1,
[key]: getvalue || '',
},
},
});
}
reset = () => {
const { dispatch } = this.props;
// eslint-disable-next-line react/no-string-refs
this.refs.searchBar.input.state.value = '';
dispatch({
type: 'newthemelist/reset',
});
}
goClockMgt = (record) => {
const { dispatch } = this.props;
if (record.status == 1) {
message.warning('该活动还暂未发布噢，请先发布', 0.5);
return;
}
dispatch({
type: 'newthemelist/goclockmgt',
payload: {
subject_id: record.id,
subject_type: record.subject_type,
},
});
}
subjectTypeChange = (subjectType) => {
const { dispatch } = this.props;
dispatch({
type: 'thememgt/subjecttypechange',
payload: {
subjectType,
},
});
}
search = () => {
const { dispatch } = this.props;
dispatch({
type: 'thememgt/search',
});
}
resetsearch = () => {
const { dispatch } = this.props;
dispatch({
type: 'thememgt/resetsearch',
});
}
editTheme = (record) => {
const { dispatch } = this.props;
dispatch({
type: 'createtheme/editGoTheme',
payload: {
record,
},
});
}
copyClockMgt = (record, isCopy) => {
const { dispatch } = this.props;
if (record.subject_type == 3) {
message.warning('功能即将开放，敬请期待', 1);
return;
}
dispatch({
type: 'createtheme/copyGoTheme',
payload: {
record,
isCopy,
},
});
}
deleteTheme = (record) => {
const me = this;
const { dispatch } = me.props;
Modal.confirm({
title: `确定删除“${record.title}”?`,
content: '删除后不可恢复，请谨慎操作！',
okText: '确定',
cancelText: '取消',
icon: <Icon type="close-circle" style={{ color: 'red' }} />,
onOk() {
dispatch({
type: 'thememgt/deleteTheme',
payload: {
record,
id: record.id,
},
});
},
okButtonProps: {
type: 'danger',
style: {
color: '#fff',
backgroundColor: '#ff4d4f',
borderColor: '#ff4d4f',
},
},
});
}
lookClockMgt = (record) => {
const { dispatch } = this.props;
dispatch({
type: 'thememgt/getCode',
payload: {
record,
},
});
}
closeQrcodeShow = () => {
const { dispatch } = this.props;
dispatch({
type: 'thememgt/updateState',
payload: {
previewQrcodeShow: false,
},
});
}
savePublish = (record) => {
const { dispatch } = this.props;
if (record.actual_subjects_count == 0) {
message.warning('请先编辑关卡内容再发布噢~', 0.5);
return;
}
dispatch({
type: 'thememgt/savePublish',
payload: {
record,
},
});
}
judgeTimeStatuc = (endTime, startTime) => {
const endStamp = Date.parse(endTime.replace(/\-/g, '/'));
const startStamp = Date.parse(startTime.replace(/\-/g, '/'));
const nowStamp = (new Date()).getTime();
let status = '';
if (startStamp <= nowStamp) {
status = 'notstart';
}
if (endStamp < nowStamp) {
status = 'end';
}
if (endStamp > nowStamp && startStamp < nowStamp) {
status = 'doing';
}
return status;
}
tabShift = (type) => {
const { dispatch } = this.props;
dispatch({
type: 'newthemelist/queryList',
payload: {
params: {
subject_type: type,
},
},
});
}
render() {
const {
userPermission,
clockListParams,
clockListTotal,
clockList,
} = this.props;
const columns = [
{
title: '打卡名称',
dataIndex: 'title',
key: 'title',
width: 330,
},
{
title: '打卡创建时间',
dataIndex: 'start_time',
key: 'start_time',
},
{
title: '打卡结束时间',
dataIndex: 'end_time',
key: 'end_time',
},
{
title: '打卡人数',
dataIndex: 'clock_student_count',
align: 'center',
key: 'clock_student_count',
render: (text, record, index) => (
<div className={pageStyle.tablecell}>
{text}
</div>
),
},
{
title: '打卡数',
dataIndex: 'clock_record_count',
align: 'center',
key: 'clock_record_count',
render: (text, record, index) => (
<div className={pageStyle.tablecell}>
{record.subject_type == 1 && record.clock_record_count}
{record.subject_type == 2 && record.clock_record_count}
{record.subject_type == 3 && record.clock_record_count}
</div>
),
},
{
title: '进度',
dataIndex: 'clock_count',
align: 'center',
key: 'clock_count',
render: (text, record, index) => (
<div className={pageStyle.tablecell}>
{record.subject_type == 1 && '-'}
{record.subject_type == 2 && this.judgeTimeStatuc(record.end_time, record.start_time) == 'notstart' ? '未开始' : ''}
{record.subject_type == 2 && this.judgeTimeStatuc(record.end_time, record.start_time) == 'end' ? '已结束' : ''}
{record.subject_type == 2 && this.judgeTimeStatuc(record.end_time, record.start_time) == 'doing' ? `${record.today_days}/${record.days}` : ''}
{record.subject_type == 3 && `${record.unlock_subject_count}/${record.subject_count}`}
</div>
),
},
{
title: '未点评',
dataIndex: 'clock_count',
align: 'center',
key: 'no_review',
render: (text, record, index) => (
<div className={pageStyle.tablecell}>
{record.subject_type == 1 && record.no_review}
{record.subject_type == 2 && record.no_review}
{record.subject_type == 3 && record.unreview_clock_record_count}
</div>
),
},
{
title: '操作',
dataIndex: 'c',
key: 'c',
render: (text, record) => {
return (
<div className={pageStyle.tableoperatebox}>
<span className="hreflink" onClick={() => this.editTheme(record)}>{record.subject_type == 3 ? '查看详情' : '编辑'}</span>
<Divider type="vertical" />
{
record.subject_type != 3 &&
<span className="hreflink" onClick={() => this.copyClockMgt(record, 1)}>复制<Divider type="vertical" /></span>
}
{
record.status == 1 && <span className="hreflink" onClick={() => this.savePublish(record)}>发布<Divider type="vertical" /></span>
}
<span className="hreflink" onClick={() => this.lookClockMgt(record)}>扫码查看</span>
<Divider type="vertical" />
<span className="hreflink" onClick={() => this.goClockMgt(record)}>点评</span>
<Divider type="vertical" />
<span className="hreflink" onClick={() => this.deleteTheme(record)}>删除</span>
</div>
);
},
},
];
return (
<div className={pageStyle.container}>
<div className={pageStyle.shiftbox}>
<div className={`${pageStyle.tabitem} ${clockListParams.subject_type == 1 ? pageStyle.active : ''}`} onClick={() => this.tabShift(1)}>作业打卡</div>
<div className={`${pageStyle.tabitem} ${clockListParams.subject_type == 2 ? pageStyle.active : ''}`} onClick={() => this.tabShift(2)}>日历打卡</div>
<div className={`${pageStyle.tabitem} ${clockListParams.subject_type == 3 ? pageStyle.active : ''}`} onClick={() => this.tabShift(3)}>闯关打卡</div>
</div>
<div className={pageStyle.searchbox}>
<Row
gutter={{
sm: 24, xs: 24, md: 24, lg: 24,
}}
type="flex"
justify="space-around"
align="middle"
className={pageStyle.formList}
>
<Col xs={{ span: 8 }} sm={{ span: 8 }} md={{ span: 4 }} lg={{ span: 4 }} xl={{ span: 4 }}>
<Button size="small" style={{ marginRight: 20 }} type="primary" onClick={this.createLive}>新建打卡</Button>
</Col>
<Col xs={{ span: 16 }} sm={{ span: 16 }} md={{ span: 20 }} lg={{ span: 20 }} xl={{ span: 20 }}>
<Row
gutter={{
sm: 24, xs: 24, md: 24, lg: 24,
}}
style={{ width: '100%' }}
type="flex"
justify="end"
align="middle"
>
<Col className={pageStyle.formitem} xs={{ span: 12 }} sm={{ span: 12 }} md={{ span: 12 }} lg={{ span: 8 }} xl={{ span: 8 }}>
{/* eslint-disable-next-line react/no-string-refs */}
<Search allowClear style={{ width: '100%' }} ref="searchBar" placeholder="请输入打卡名称" onSearch={e => this.searchParamsChange(e, 'Input', 'title')} />
</Col>
<Col className={pageStyle.formitem} xs={{ span: 4 }} sm={{ span: 4 }} md={{ span: 2 }} lg={{ span: 2 }} xl={{ span: 2 }}>
<div className={pageStyle.rightList}>
<Tooltip title="清空筛选">
<img onClick={this.reset} className={pageStyle.resetIcon} src={`${__IMGCDN__}common/reset.png`} alt="" />
</Tooltip>
</div>
</Col>
</Row>
</Col>
</Row>
</div>
<div className={pageStyle.tablebox}>
<Table
rowKey="id"
dataSource={clockList}
columns={columns}
scroll={{ x: 'max-content' }}
pagination={false}
bordered
footer={null}
/>
<div className={pageStyle.tablefooterbox}>
<span className={pageStyle.tablefooterstatic}>共{clockListTotal}条数据</span>
<Pagination
showSizeChanger
showQuickJumper
onShowSizeChange={this.sizeChange}
total={Number(clockListTotal)}
onChange={this.changePagination}
current={Number(clockListParams.page) || 1}
pageSize={clockListParams.perPage}
/>
</div>
</div>
</div>
);
}
}
LiveClass.propTypes = {
};
const LiveClassForm = Form.create()(LiveClass);
function mapStateToProps(state) {
const {
clockListParams,
clockListTotal,
clockList,
} = state.newthemelist;
const {
guideStep,
guideShow,
} = state.userguide;
const {
userPermission,
schoolUserInfo,
} = state.webapp;
return {
userPermission,
guideStep,
guideShow,
schoolUserInfo,
clockListParams,
clockListTotal,
clockList,
};
}
export default connect(mapStateToProps)(LiveClassForm);
src/pages/newthemelist/index.less 0 → 100644
View file @ 6cbcb2c2
@import '../../less/variables.less';
.container {
background-color: #fff;
border-radius: 2px;
padding: 20px;
}
.headerbox{
background-color: #fff;
.headerbtn {
color: #2194FF;
font-size: 14px;
cursor: pointer;
}
padding-bottom: 18px;
}
.searchrow {
.formitem {
display: flex;
align-items: center;
.formitemlabel {
color: #000000;
font-size: 14px;
line-height: 1;
min-width: 70px;
white-space: nowrap;
}
}
}
.selectitem {
display: block;
}
.searchbtnbox {
height: 54px;
display: flex;
align-items: flex-end;
}
.resetbtn {
margin-right: 16px;
}
.tablebox {
background: #fff;
:global {
.ant-table-fixed {
border-bottom: 1px solid #E8E8E8 !important;
}
.ant-table tbody tr:nth-child(2n) {
background-color: #FBFBFB;
}
.ant-table-thead > tr > th, .ant-table-tbody > tr > td {
padding: 11px 10px;
}
.ant-table-bordered .ant-table-tbody tr td {
border-bottom: none;
border-right: none!important;
}
.ant-table-bordered .ant-table-thead tr th {
border-bottom: none;
border-right: none!important;
}
.ant-table-bordered .ant-table-thead tr th:last-child {
border-right: 1px solid #e8e8e8!important;
}
.ant-table-bordered .ant-table-tbody tr td:last-child {
border-right: 1px solid #e8e8e8!important;
}
.ant-table-bordered .ant-table-tbody tr:last-child {
border-bottom: 1px solid #e8e8e8!important;
}
}
}
.divideline {
color: #E9E9E9;
padding: 0 8px;
}
.alink {
color: #1890FF;
}
.classNamebox {
max-width: 250px;
word-break: break-all;
color: #1890FF;
cursor: pointer;
}
.tableoperatebox {
min-width: 160px;
line-height: 30px;
}
.endsearchcol {
margin-bottom: 18px;
}
.endclassfooter {
display: flex;
align-items: center;
justify-content: space-between;
}
.classroomitem {
margin-bottom: 5px;
.classroom {
color:rgba(0,0,0,0.85);
}
.aLink {
color: #1890FF;
padding-left: 21px;
}
}
.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;
}
}
.tablefooterbox {
color: rgba(0,0,0,0.6);
font-size: 16px;
line-height: 50px;
display: flex;
background-color: #fff;
align-items: center;
justify-content: space-between;
padding-left: 14px;
padding-right: 14px;
margin-top: 10px;
.tablefooterstatic {
color:rgba(0,0,0,0.65);
font-size: 14px;
}
}
.shiftbox {
display: flex;
align-items: center;
border-bottom: 1px solid #e8e8e8;
.tabitem {
color: #000000;
font-size: 16px;
line-height: 1;
padding: 10px 11px 10px;
border-bottom: 3px solid transparent;
margin: 0 20px;
cursor: pointer;
&:first-child {
margin-left: 0;
}
&.active {
border-color: #1890FF;
color: #1890FF;
font-weight: 700;
}
&:hover {
border-color: #1890FF;
color: #1890FF;
font-weight: 700;
}
}
}
.formList {
margin: 10px 0;
}
src/router.js
View file @ 6cbcb2c2
......@@ -291,6 +291,11 @@ const AddLive = props => (
{ AddLive => (<AddLive {...props} />) }
</Bundle>
);
const ClockList = props => (
<Bundle load={() => import(/* webpackChunkName:"ClockList" */'./pages/newthemelist/index')}>
{ ClockList => (<ClockList {...props} />) }
</Bundle>
);
function RouterConfig({ history }) {
return (
<ConfigProvider locale={zhCN}>
......@@ -324,6 +329,7 @@ function RouterConfig({ history }) {
<Route path="/sjd/newtheme/jobclock" exact component={JobClock} />
<Route path="/sjd/newtheme/jobclock/:id" exact component={JobClock} />
<Route path="/sjd/newtheme/jobclock/:id/:isCopy" exact component={JobClock} />
<Route path="/sjd/newtheme/calendarclock" exact component={CalendarClock} />
<Route path="/sjd/newtheme/calendarclock/:id" exact component={CalendarClock} />
<Route path="/sjd/newtheme/calendarclock/:id/:isCopy" exact component={CalendarClock} />
<Route path="/sjd/datacenter" exact component={DataCenter} />
......@@ -348,6 +354,7 @@ function RouterConfig({ history }) {
<Route path="/sjd/liveClass" exact component={LiveClass} />
<Route path="/sjd/addLive" exact component={AddLive} />
<Route path="/sjd/editLive/:id" exact component={AddLive} />
<Route path="/sjd/clockList" exact component={ClockList} />
<Route component={Errorpage} />
</Switch>
</SjdIndex>
......
src/services/createtheme.js
View file @ 6cbcb2c2
......@@ -4,7 +4,7 @@ import api from '../common/api';
export function findTheme(params) {
const data = qs.stringify(params);
return request({
url: `${api.createtheme.addTheme}/${params.id}`,
url: `${api.createtheme.addTheme}/${params.id}?${data}`,
method: 'GET',
data,
});
......
src/services/newthemelist.js 0 → 100644
View file @ 6cbcb2c2
import qs from 'qs';
import request from '../utils/request';
import api from '../common/api';
export function clockList(params) {
const data = qs.stringify(params);
return request({
url: `${api.thememgt.themeList}?${data}`,
method: 'GET',
});
}
export function addLive(params) {
const data = qs.stringify(params);
return request({
url: `${api.liveClass.lives}`,
method: 'POST',
data,
});
}
export function editLive(params) {
const data = qs.stringify(params);
return request({
url: `${api.liveClass.lives}/${params.id}`,
method: 'PUT',
data,
});
}
export function liveDetail(params) {
const data = qs.stringify(params);
return request({
url: `${api.liveClass.lives}/${params.id}`,
method: 'GET',
data,
});
}
export function deleteLive(parmas) {
const data = qs.stringify(parmas);
return request({
url: `${api.liveClass.lives}/${parmas.id}`,
method: 'DELETE',
data,
});
}
export function changeStatus(params) {
const data = qs.stringify(params);
return request({
url: `${api.liveClass.livesStatus}`,
method: 'POST',
data,
});
}
export function liveUrl(params) {
const data = qs.stringify(params);
return request({
url: `${api.liveClass.livesUrl}?${data}`,
method: 'GET',
});
}
export function closeLive(params) {
const data = qs.stringify(params);
return request({
url: `${api.liveClass.livesEnd}`,
method: 'POST',
data,
});
}
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