Commit 74a2ec65 authored by baixian's avatar baixian

闯关

parent 9245ea48
......@@ -165,6 +165,8 @@ export default {
unlockSubjectRelease: `${dakaapi}member/unlock_subject/release`,
deleteTheme: `${dakaapi}member/subjects`,
delete_unlock_subject: `${dakaapi}member/unlock_subject`,
find_unlock_subject: `${dakaapi}member/unlock_subject/detail`,
pattern_list: `${dakaapi}member/unlock_subject/index`,
},
};
......@@ -11,7 +11,7 @@ export default {
activeurl: `${__IMGCDN__}menu/indexactive.png`,
notactiveurl: `${__IMGCDN__}menu/index.png`,
path: '/sjd/indexstaic',
relativePath: ['/sjd/indexstaic'],
relativePath: ['/sjd/indexstaic', '/sjd/newtheme/jobclock', '/sjd/newtheme/calendarclock', '/sjd/newtheme/emigratedclock'],
},
{
id: '5',
......@@ -37,7 +37,7 @@ export default {
activeurl: `${__IMGCDN__}menu/classactive.png`,
notactiveurl: `${__IMGCDN__}menu/class.png`,
path: '/sjd/classmgt',
relativePath: ['/sjd/classmgt', '/sjd/classdetail/:classid', '/sjd/newtheme/jobclock/:id', '/sjd/newtheme/calendarclock/:id', '/sjd/newtheme/jobclock/:id/:isCopy', '/sjd/newtheme/calendarclock/:id/:isCopy', '/sjd/thememgt/:classid'],
relativePath: ['/sjd/classmgt', '/sjd/classdetail/:classid', '/sjd/newtheme/jobclock/:id', '/sjd/newtheme/calendarclock/:id', '/sjd/newtheme/jobclock/:id/:isCopy', '/sjd/newtheme/calendarclock/:id/:isCopy', '/sjd/thememgt/:classid', '/sjd/newtheme/emigratedclock/:id'],
},
{
id: '4',
......
This diff is collapsed.
......@@ -650,6 +650,77 @@ export default {
},
});
}
const EditemigRatedActive = pathToRegexp('/sjd/newtheme/editemigrated/:id').exec(pathname);
if (EditemigRatedActive) {
dispatch({
type: 'createtheme/pageInit',
payload: {
},
});
dispatch({
type: 'createtheme/queryPatternList',
payload: {
id: EditemigRatedActive[1],
},
});
dispatch({
type: 'webapp/updateState',
payload: {
breadcrumbList: [
{
path: 'sjd/classmgt',
name: '班级管理',
},
{
path: pathname,
name: '主题管理',
},
{
path: pathname,
name: '闯关打卡',
},
],
},
});
}
const EditemigPassActive = pathToRegexp('/sjd/newtheme/emigratedclock/:id').exec(pathname);
if (EditemigPassActive) {
dispatch({
type: 'createtheme/pageInit',
payload: {
},
});
dispatch({
type: 'createtheme/queryClassList',
payload: {
},
});
dispatch({
type: 'createtheme/createThemeModalfindEmigrated',
payload: {
store_id: EditemigPassActive[1],
},
});
dispatch({
type: 'webapp/updateState',
payload: {
breadcrumbList: [
{
path: 'sjd/classmgt',
name: '班级管理',
},
{
path: pathname,
name: '主题管理',
},
{
path: pathname,
name: '编辑闯关打卡',
},
],
},
});
}
const clockmgtactive = pathToRegexp('/sjd/clockmgt/:themetype/:classid/:themeid').exec(pathname);
if (clockmgtactive) {
dispatch({
......@@ -715,6 +786,104 @@ export default {
},
});
}
if (pathname === '/sjd/newtheme/jobclock') {
dispatch({
type: 'createtheme/queryClassList',
payload: {
},
});
dispatch({
type: 'webapp/updateState',
payload: {
breadcrumbList: [
{
path: 'sjd/indexstaic',
name: '首页',
},
{
path: pathname,
name: '新建作业打卡',
}],
},
});
}
if (pathname === '/sjd/newtheme/emigratedclock') {
dispatch({
type: 'createtheme/queryClassList',
payload: {
},
});
dispatch({
type: 'webapp/updateState',
payload: {
breadcrumbList: [
{
path: 'sjd/indexstaic',
name: '首页',
},
{
path: pathname,
name: '新建闯关打卡',
}],
},
});
}
const EditemigNewActive = pathToRegexp('/sjd/newtheme/emigratedcount/:showId').exec(pathname);
if (EditemigNewActive) {
dispatch({
type: 'createtheme/pageInit',
payload: {
},
});
dispatch({
type: 'createtheme/createThemeModalfindEmigrated',
payload: {
store_id: EditemigNewActive[1],
},
});
dispatch({
type: 'webapp/updateState',
payload: {
breadcrumbList: [
{
path: 'sjd/indexstaic',
name: '首页',
},
{
path: pathname,
name: '新建闯关打卡',
},
],
},
});
}
if (pathname === '/sjd/newtheme/calendarclock') {
dispatch({
type: 'createtheme/queryClassList',
payload: {
},
});
dispatch({
type: 'createtheme/calculatecalendar',
payload: {
currentTimestamp: moment().month(moment().month()).startOf('month').valueOf(),
judgetodaycurrentTimestamp: moment().valueOf(),
},
});
dispatch({
type: 'webapp/updateState',
payload: {
breadcrumbList: [
{
path: 'sjd/indexstaic',
name: '首页',
}, {
path: pathname,
name: '新建日历打卡',
}],
},
});
}
});
},
},
......
......@@ -75,7 +75,13 @@ class StaticCenter extends React.Component {
});
}
createUnlockTheme = () => {
message.warning('功能即将开放,敬请期待');
const { dispatch } = this.props;
dispatch({
type: 'createtheme/goTheme',
payload: {
index: 3,
},
});
}
disabledDate=(current) => {
return current > moment();
......
......@@ -107,7 +107,7 @@ class ContentSettingForm extends React.Component {
},
});
}
changeEmigrateText = (e) => {
changeEmigrateText = (e, index) => {
const { dispatch } = this.props;
const textValue = e.target.value;
if (textValue.length >= 500) {
......@@ -118,6 +118,7 @@ class ContentSettingForm extends React.Component {
type: 'createtheme/changeEmigrateText',
payload: {
textValue,
index,
},
});
}
......@@ -140,12 +141,12 @@ class ContentSettingForm extends React.Component {
title: e.target.value,
});
}
changeTab = (key) => {
changeTab = (index) => {
const { dispatch, isSort } = this.props;
dispatch({
type: 'createtheme/getSort',
payload: {
key,
key: index + 1,
},
});
}
......@@ -161,6 +162,24 @@ class ContentSettingForm extends React.Component {
},
});
}
emigrateAddText = () => {
const { dispatch } = this.props;
dispatch({
type: 'createtheme/emigrateAddText',
payload: {
},
});
}
emigrateMoveContent = (index, direction) => {
const { dispatch } = this.props;
dispatch({
type: 'createtheme/emigrateMoveContent',
payload: {
index,
direction,
},
});
}
render() {
const { isShow, title, current } = this.state;
const {
......@@ -177,8 +196,7 @@ class ContentSettingForm extends React.Component {
releaseLoading,
isRelease,
} = this.props;
console.log(unlockSubjectList, 'emigratedObj');
console.log(sortNumber, 'sortNumber');
console.log(emigratedObj, 'emigratedObj');
const formItemModalLineLayout = {
labelCol: {
xs: { span: 3 },
......@@ -223,16 +241,26 @@ class ContentSettingForm extends React.Component {
<Form labelAlign="left" onSubmit={this.handleSubmit}>
<div className={pageStyle.title}>关卡设置</div>
<div className={pageStyle.customs}>
<Tabs ActiveKey={`${sortNumber}`} onChange={this.changeTab} style={{ height: 220 }}>
{
{/* <Tabs ActiveKey={`${sortNumber}`} onChange={this.changeTab} style={{ height: 220 }}> */}
{/* { */}
{/* unlockSubjectList.map((item, index) => */}
{/* ( */}
{/* <TabPane tab={item} key={item}> */}
{/* </TabPane> */}
{/* ), */}
{/* ) */}
{/* } */}
{/* </Tabs> */}
{
unlockSubjectList.map((item, index) =>
(
<TabPane tab={item} key={item}>
</TabPane>
<div onClick={() => this.changeTab(index)} className={sortNumber === item ? pageStyle.numitemActive : pageStyle.numitem}>
{item}
</div>
),
)
}
</Tabs>
<div className={pageStyle.add}>添加</div>
</div>
<FormItem {...formItemModalLineLayout}>
{getFieldDecorator('title', {
......@@ -253,7 +281,8 @@ class ContentSettingForm extends React.Component {
editorUploadAudio={this.emigrateUploadAudio}
editorChange={this.changeEmigrateText}
deleteThemeImg={this.deleteEmigrate}
editorText={emigrateText}
editorAddText={this.emigrateAddText}
moveContent={this.emigrateMoveContent}
/>
<Divider />
<div className={pageStyle.title}>更多设置 <span onClick={this.handleClickShow} className={pageStyle.pack}>{isShow ? '收起' : '展开'}</span></div>
......
.container {
background-color: #fff;
padding: 0 20px;
padding: 20px;
position: relative;
margin-top: 40px;
}
.title {
font-size:16px;
......@@ -90,8 +89,46 @@
margin-left: 140px;
}
.customs {
display: flex;
align-items: center;
white-space: nowrap;
overflow-x: scroll;
max-width: 600px;
.numitem {
width: 40px;
height: 40px;
border-radius: 50%;
border: 1px solid #D9D9D9;
color: #595959;
font-size: 16px;
text-align: center;
line-height: 40px;
cursor: pointer;
margin-right: 5px;
display: inline-block;
}
.numitemActive {
width: 40px;
height: 40px;
border-radius: 50%;
border: 1px solid #1890FF;
background-color: #1890FF;
color: #fff;
font-size: 16px;
text-align: center;
line-height: 40px;
cursor: pointer;
margin-right: 5px;
display: inline-block;
}
.add {
width: 74px;
height: 32px;
text-align: center;
line-height: 32px;
border: 1px solid #D9D9D9;
display: inline-block;
border-radius: 4px;
cursor: pointer;
}
:global {
.ant-tabs {
height: 60px !important;
......
import { connect } from 'dva';
import React from 'react';
import moment from 'moment';
import {
Form,
Icon,
......@@ -18,12 +19,10 @@ import {
} from 'antd';
import pageStyle from './Unclock.less';
import { hasBtnPower, imagify } from '../../../utils';
import ThemeEditor from '../ThemeEditor';
const { TabPane } = Tabs;
const FormItem = Form.Item;
const { Option } = Select;
const { TextArea } = Input;
const { RangePicker } = DatePicker;
class UnClockForm extends React.Component {
constructor(props) {
super(props);
......@@ -89,7 +88,9 @@ class UnClockForm extends React.Component {
form: { getFieldDecorator, getFieldValue },
unClockLoading,
classList,
emigratedObj,
} = this.props;
console.log(emigratedObj, 'emigratedObj');
const formItemModalLineLayout = {
labelCol: {
xs: { span: 3 },
......@@ -127,7 +128,7 @@ class UnClockForm extends React.Component {
},
};
const selectBefore = (
<div>{title.length || 0}/20</div>
<div>{emigratedObj.title ? emigratedObj.title.length : title.length || 0}/20</div>
);
return (
<div className={pageStyle.container}>
......@@ -135,6 +136,7 @@ class UnClockForm extends React.Component {
<Form labelAlign="left" onSubmit={this.handleSubmit}>
<FormItem {...formItemModalLineLayout} label="闯关标题">
{getFieldDecorator('title', {
initialValue: emigratedObj.title,
rules: [
{
required: true,
......@@ -147,6 +149,7 @@ class UnClockForm extends React.Component {
</FormItem>
<FormItem {...formItemModalLineLayout} label="选择班级">
{getFieldDecorator('class_id', {
initialValue: emigratedObj.class_id,
rules: [
{
required: true,
......@@ -162,7 +165,7 @@ class UnClockForm extends React.Component {
<FormItem {...formItemModalLineLayout} label="关卡时长设置">
<span className="ant-form-text">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
{getFieldDecorator('subject_count', {
initialValue: 1,
initialValue: emigratedObj.subject_count,
rules: [
{
required: true,
......@@ -177,7 +180,7 @@ class UnClockForm extends React.Component {
<FormItem {...formItemModalLineLayout} label="每天闯关次数">
<span className="ant-form-text">每天可闯</span>
{getFieldDecorator('unlock_limit', {
initialValue: 1,
initialValue: emigratedObj.unlock_limit,
rules: [
{
required: true,
......@@ -190,7 +193,7 @@ class UnClockForm extends React.Component {
<span className="ant-form-text">关卡</span>
</FormItem>
<FormItem {...formItemModalLineLayout} label="参与规则">
{getFieldDecorator('join_rule_type', { initialValue: 1 },
{getFieldDecorator('join_rule_type', { initialValue: emigratedObj.join_rule_type },
)(
<Radio.Group>
<Radio value={1}>任何人加入</Radio>
......@@ -218,7 +221,7 @@ class UnClockForm extends React.Component {
</FormItem>
<div className={pageStyle.pushlocation}>
<FormItem {...formItemModalLineLayout} label="定时提醒">
{getFieldDecorator('push_status', { initialValue: 2 },
{getFieldDecorator('push_status', { initialValue: emigratedObj.push_status },
)(
<Radio.Group>
<Radio value={2}>关闭提醒</Radio>
......@@ -229,6 +232,7 @@ class UnClockForm extends React.Component {
{getFieldValue('push_status') === 1 ? (
<FormItem style={{ marginBottom: 0 }}>
{getFieldDecorator('push_time', {
initialValue: moment(emigratedObj.push_time, 'HH:mm'),
rules: [
{
required: true,
......@@ -246,7 +250,7 @@ class UnClockForm extends React.Component {
<Divider />
<FormItem style={{ marginTop: 32 }}>
<Button type="primary" htmlType="submit" loading={unClockLoading}>
下一步
{emigratedObj.unlock_mode_id ? '保存' : '下一步'}
</Button>
</FormItem>
</Form>
......@@ -262,10 +266,12 @@ function mapStateToProps(state) {
const {
unClockLoading,
classList,
emigratedObj,
} = state.createtheme;
return {
unClockLoading,
classList,
emigratedObj,
};
}
export default connect(mapStateToProps)(UnClock);
......
.container {
background-color: #fff;
padding: 0 20px;
padding: 20px;
position: relative;
margin-top: 40px;
}
.title {
font-size:16px;
......
......@@ -5,68 +5,75 @@ import {
Tabs,
Steps,
Divider,
Row, Col,
DatePicker,
Icon,
Button,
Table,
Select, Radio, InputNumber, Input, message,
} from 'antd';
import pageStyle from './index.less';
import { hasBtnPower, imagify } from '../../../utils';
import ThemeEditor from '../ThemeEditor';
import Unclock from './Unclock';
import ContentSetting from './ContentSetting';
const { TabPane } = Tabs;
import LoginStyles from '../../login/index.less';
const FormItem = Form.Item;
const { Option } = Select;
const { TextArea } = Input;
const { RangePicker } = DatePicker;
const { Step } = Steps;
const steps = [
{
id: 1,
title: '新建打卡',
},
{
id: 2,
title: '创建打卡内容',
},
];
class EmigratedClockForm extends React.Component {
componentDidUpdate() {
}
componentWillUnmount() { // 卸载
}
// eslint-disable-next-line consistent-return
getStepContent = (id) => {
// eslint-disable-next-line default-case
switch (id) {
case 0:
return <Unclock />;
case 1:
return <ContentSetting />;
}
editCourse = (record) => {
console.log(record);
}
next() {
const { dispatch, stepNumber } = this.props;
editClock = () => {
const { dispatch } = this.props;
dispatch({
type: 'createtheme/changeStepNumber',
type: 'createtheme/editPass',
payload: {
value: stepNumber + 1,
},
});
}
render() {
const columns = [
{
title: '关卡',
dataIndex: 'sort',
},
{
title: '课程名称',
dataIndex: 'title',
},
{
title: '操作',
render: (text, record) => (
<div className={pageStyle.tablecell}>
<a href="javascript:;" onClick={() => this.editCourse(record)}>编辑</a>
</div>
),
},
];
const {
stepNumber,
patternList,
} = this.props;
return (
<div className={pageStyle.container}>
<div className={pageStyle.stepsContent}>
<Steps current={stepNumber}>
{steps.map(item => (
<Step key={item.title} title={item.title} />
))}
</Steps>
</div>
{this.getStepContent(stepNumber)}
<Row style={{ marginBottom: 24 }}>
<Col span={12}>
<Button type="primary" onClick={this.editClock}>修改打卡设置</Button>
</Col>
</Row>
<Table style={{ marginBottom: 24 }} pagination={false} footer={null} dataSource={patternList} columns={columns} />
<Row>
<Col span={12}>
<Button ghost type="primary"><Icon type="plus" />添加关卡</Button>
</Col>
</Row>
<Row>
<Col span={24} style={{ textAlign: 'right' }}>
<Button type="primary">发布主题</Button>
</Col>
</Row>
</div>
);
}
......@@ -77,18 +84,10 @@ const EmigratedClock = Form.create()(EmigratedClockForm);
function mapStateToProps(state) {
const {
themeAddLoading,
classList,
jobParams,
editorText,
stepNumber,
patternList,
} = state.createtheme;
return {
themeAddLoading,
classList,
jobParams,
editorText,
stepNumber,
patternList,
};
}
export default connect(mapStateToProps)(EmigratedClock);
......
.container {
background-color: #fff;
padding: 0 20px;
padding:20px;
position: relative;
}
.title {
font-size:16px;
font-family:PingFangSC;
font-weight:600;
color:rgba(0,0,0,0.85);
line-height:24px;
position: relative;
padding-bottom: 30px;
.pack {
font-size:14px;
font-family:PingFangSC;
font-weight:400;
color:rgba(24,144,255,1);
line-height:20px;
display: inline-block;
margin-left: 36px;
cursor: pointer;
}
}
.title:after {
position: absolute;
content: '';
display: block;
width: 3px;
height: 19px;
background-color: #1890FF;
left: -10px;
top: 4px;
border-radius:2px;
}
.commonwrap {
display: flex;
align-items: flex-start;
:global {
.ant-form-item-label > label::after {
content: '';
}
}
.commonleft {
width: 105px;
font-size:14px;
font-family:PingFangSC;
font-weight:400;
color:rgba(0,0,0,0.85);
line-height:40px;
}
.commonright {
width: 80%;
:global {
.ant-form-text1 {
font-size:12px;
font-family:PingFangSC;
font-weight:400;
color:rgba(0,0,0,0.55);
line-height:22px;
display: inline-block;
margin-left: 10px;
}
.ant-form-item .ant-switch {
margin-left: -12px;
}
}
}
}
.panpelBox {
display: block;
transition: all .3s;
}
.panpelhideBox {
display: none;
}
.pushlocation {
:global {
.ant-form-item {
.ant-form-item-children {
display: flex;
align-items: center;
}
}
}
}
.stepsContent {
width: 400px;
margin-left: 140px;
}
......@@ -18,10 +18,10 @@ class NewThemeForm extends React.Component {
}
tabChange=(key) => {
const { dispatch, tabIndex } = this.props;
if (Number(key) === 3) {
message.warning('功能即将开放,敬请期待', 1);
return;
}
// if (Number(key) === 3) {
// message.warning('功能即将开放,敬请期待', 1);
// return;
// }
dispatch({
type: 'createtheme/tabChange',
payload: {
......
......@@ -137,10 +137,6 @@ class ThemeMgt extends React.Component {
}
editTheme = (record) => {
const { dispatch } = this.props;
if (record.subject_type == 3) {
message.warning('功能即将开放,敬请期待', 1);
return;
}
dispatch({
type: 'createtheme/editGoTheme',
payload: {
......
......@@ -181,10 +181,25 @@ const JobClock = props => (
</Bundle>
);
const CalendarClock = props => (
<Bundle load={() => import(/* webpackChunkName:"JobClock" */'./pages/newtheme/calendarclock/index')}>
<Bundle load={() => import(/* webpackChunkName:"CalendarClock" */'./pages/newtheme/calendarclock/index')}>
{ CalendarClock => (<CalendarClock {...props} />) }
</Bundle>
);
const EditEmigratedClock = props => (
<Bundle load={() => import(/* webpackChunkName:"EmigratedClock" */'./pages/newtheme/emigratedclock/index')}>
{ EditEmigratedClock => (<EditEmigratedClock {...props} />) }
</Bundle>
);
const EmigratedSetting = props => (
<Bundle load={() => import(/* webpackChunkName:"EmigratedSetting" */'./pages/newtheme/emigratedclock/Unclock')}>
{ EmigratedSetting => (<EmigratedSetting {...props} />) }
</Bundle>
);
const EmigratedContent = props => (
<Bundle load={() => import(/* webpackChunkName:"EmigratedContent" */'./pages/newtheme/emigratedclock/ContentSetting')}>
{ EmigratedContent => (<EmigratedContent {...props} />) }
</Bundle>
);
function RouterConfig({ history }) {
return (
<LocaleProvider locale={zhCN}>
......@@ -214,10 +229,17 @@ function RouterConfig({ history }) {
<Route path="/sjd/studentclass/:id" exact component={StudentClass} />
<Route path="/sjd/institutions" exact component={Institutions} />
<Route path="/sjd/schooledit" exact component={SchoolEdit} />
<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/newtheme/emigratedclock" exact component={EmigratedSetting} />
<Route path="/sjd/newtheme/emigratedcount" exact component={EmigratedContent} />
<Route path="/sjd/newtheme/editemigrated/:id" exact component={EditEmigratedClock} />
<Route path="/sjd/newtheme/emigratedclock/:id" exact component={EmigratedSetting} />
<Route path="/sjd/newtheme/emigratedcount/:showId" exact component={EmigratedContent} />
</SjdIndex>
)}
/>
......
......@@ -61,3 +61,19 @@ export function saveRelease(params) {
data,
});
}
export function find_unlock_subject(params) {
const data = qs.stringify(params);
return request({
url: `${api.createtheme.find_unlock_subject}/${params.id}`,
method: 'GET',
data,
});
}
export function find_pattern_list(params) {
const data = qs.stringify(params);
return request({
url: `${api.createtheme.pattern_list}?${data}`,
method: 'GET',
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