Skip to content

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

111222

parent 78db3ca0
Hide whitespace changes
Inline Side-by-side
Showing with 515 additions and 103 deletions
src/common/api.js
View file @ eb4204d4
......@@ -182,6 +182,7 @@ export default {
},
onlineclasses: {
selectcourse: `${dakaapi}member/online_courses`,
courseputaway: `${dakaapi}member/online_courses/status`,
},
courseMateria: {
index: `${dakaapi}member/materials`,
......
src/common/menuconfig.js
View file @ eb4204d4
......@@ -163,8 +163,8 @@ export default {
width: '20px',
height: '20px',
},
activeurl: `${__IMGCDN__}menu/minappactive.png`,
notactiveurl: `${__IMGCDN__}menu/minapp.png`,
activeurl: `${__IMGCDN__}menu/onlineactive.png`,
notactiveurl: `${__IMGCDN__}menu/online.png`,
isFather: true,
subMenues: [
{
......@@ -178,7 +178,7 @@ export default {
isFather: false,
noIcon: true,
path: '/sjd/singleclass',
relativePath: ['/sjd/singleclass'],
relativePath: ['/sjd/singleclass', '/sjd/singleclass/detail/:id'],
},
{
id: '32',
......
src/models/onlineclasses.js
View file @ eb4204d4
......@@ -16,13 +16,17 @@ export default {
courseList: [],
courseListParams: {
page: 1,
perPage: 20,
perPage: 12,
},
courseListTotal: 0,
addCourseObj: {
title: '',
start_time: '',
charge_type: '',
created_at: '',
cover: '',
type: '',
audio: '',
content: [
{ type: 'text', value: '' },
],
......@@ -35,19 +39,26 @@ export default {
},
effects: {
* selectCourseList({ payload }, { call, put, select }) {
const { params } = payload;
const { sid } = yield select(state => state.webapp);
const { type } = payload;
const loadmessage = message.loading('数据加载中...', 0);
const data = yield call(onlineAjax.courseList, {
type,
const { courseListTotal, courseListParams } = yield select(state => state.onlineclasses);
let newTotal = courseListTotal;
const newParams = Object.assign(courseListParams, params, {
type: 1,
school_id: sid,
});
const data = yield call(onlineAjax.courseList, newParams);
setTimeout(loadmessage);
if (data.code == 200) {
if (data.code === 200) {
if (data.data.total != undefined) {
newTotal = data.data.total;
}
yield put({
type: 'updateState',
payload: {
courseList: data.data && data.data.list,
courseListTotal: newTotal,
},
});
} else {
......@@ -61,10 +72,11 @@ export default {
},
* findCourse({ payload }, { call, put, select }) {
const { sid } = yield select(state => state.webapp);
const { id, type } = payload;
const { id } = payload;
const { addCourseObj } = yield select(state => state.onlineclasses);
const data = yield call(onlineAjax.findCourse, {
id,
type,
type: 1,
school_id: sid,
});
if (data.code == 200) {
......@@ -78,9 +90,12 @@ export default {
charge_type: data.data.charge_type,
created_at: data.data.created_at,
type: data.data.type,
content: [
{ type: 'text', value: '' },
],
content: data.data.content ? JSON.parse(data.data.content) : addCourseObj.content,
remark: data.data.remark,
study_count: data.data.study_count,
status: data.data.status,
cover: data.data.cover,
audio: data.data.audio,
},
},
});
......@@ -170,7 +185,6 @@ export default {
} = payload;
addCourseObj.content = JSON.stringify(addCourseObj.content);
const newCourseObj = { ...addCourseObj };
console.log(newCourseObj, 'newCourseObj1111111');
const loadmessage = message.loading('保存中...', 0);
const newParams = Object.assign(newCourseObj, {
title,
......@@ -217,6 +231,51 @@ export default {
});
}
},
* deleteCourse({ payload }, { call, put, select }) {
const { id } = payload;
const data = yield call(onlineAjax.deleteCourse, {
id,
});
if (data.code == 200) {
message.success('删除成功', 0.5);
yield put({
type: 'selectCourseList',
payload: {
},
});
} else {
yield put({
type: 'webapp/errorrequestresolve',
payload: {
data,
},
});
}
},
* changeCourseStatus({ payload }, { call, put, select }) {
const { status } = payload;
const { addCourseObj } = yield select(state => state.onlineclasses);
const data = yield call(onlineAjax.changeCourseStatus, {
status,
id: addCourseObj.id,
});
if (data.code == 200) {
yield put({
type: 'findCourse',
payload: {
id: data.data.id,
},
});
message.success('修改成功', 0.5);
} else {
yield put({
type: 'webapp/errorrequestresolve',
payload: {
data,
},
});
}
},
* goEditCourse({ payload }, { call, put, select }) {
const { id } = payload;
yield put(routerRedux.push(`/sjd/singleclass/detail/${id}`));
......@@ -281,6 +340,14 @@ export default {
addCourseObj: { ...addCourseObj },
},
});
} else if (uploadtype == 'uploadCover') {
addCourseObj.cover = imageUrl;
yield put({
type: 'updateState',
payload: {
addCourseObj: { ...addCourseObj },
},
});
}
setTimeout(uploaderLoading);
},
......@@ -339,6 +406,66 @@ export default {
}
setTimeout(uploaderLoading);
},
* queryvoiceignature({ payload }, { call, put, select }) {
const { userInfo, sid } = yield select(state => state.webapp);
const { files, uploadtype } = payload;
const file = files.files ? files.files[0] : null;
const REGEXP_VIDEO = /^audio\/\w+/;
const params = { type: 2, token: userInfo.token, schoolId: sid };
let signature = {};
if (file && (REGEXP_VIDEO.test(file.type) || file.type === '')) {
const uploaderLoading = message.loading('正在上传音频');
const uploadSignature = yield call(uploader.uploadImageSignature, params);
if (uploadSignature.code == 200) {
signature = uploadSignature.data;
yield put({
type: 'uploadaudio',
payload: {
signature,
files,
uploaderLoading,
uploadtype,
},
});
} else {
setTimeout(uploaderLoading);
yield put({
type: 'webapp/errorrequestresolve',
payload: {
code: uploadSignature,
},
});
}
}
},
* uploadaudio({ payload }, { call, put, select }) {
const {
signature, files, uploaderLoading, uploadtype,
} = payload;
const file = files.files ? files.files[0] : null;
const { addCourseObj } = yield select(state => state.onlineclasses);
const filename = `${signature.dir}${getRandomFilename(file.name)}`;
const params = {
key: filename,
policy: signature.policy,
OSSAccessKeyId: signature.accessid,
signature: signature.signature,
file,
url: signature.host,
};
const audioUrl = filename;
const uploadImg = yield call(uploader.uploadImg, params);
if (uploadtype == 'uploadAudio') {
addCourseObj.audio = audioUrl;
yield put({
type: 'updateState',
payload: {
addCourseObj: { ...addCourseObj },
},
});
}
setTimeout(uploaderLoading);
},
* courseChangeSize({ payload }, { call, put, select }) {
const { textValue, index } = payload;
const { addCourseObj } = yield select(state => state.onlineclasses);
......@@ -365,6 +492,26 @@ export default {
},
});
},
* deleteCover({ payload }, { call, put, select }) {
const { addCourseObj } = yield select(state => state.onlineclasses);
addCourseObj.cover = '';
yield put({
type: 'updateState',
payload: {
addCourseObj: { ...addCourseObj },
},
});
},
* deleteAudio({ payload }, { call, put, select }) {
const { addCourseObj } = yield select(state => state.onlineclasses);
addCourseObj.audio = '';
yield put({
type: 'updateState',
payload: {
addCourseObj: { ...addCourseObj },
},
});
},
* courseMoveContent({ payload }, { call, put, select }) {
const { index, direction } = payload;
const { addCourseObj } = yield select(state => state.onlineclasses);
......@@ -405,20 +552,24 @@ export default {
type: 'updateState',
payload: {
courseList: [],
courseListTotal: 0,
courseListParams: {
page: 1,
perPage: 12,
},
addCourseObj: {
title: '',
start_time: '',
charge_type: '',
created_at: '',
cover: '',
type: '',
audio: '',
content: [
{ type: 'text', value: '' },
],
},
addLoading: false,
courseListParams: {
page: 1,
perPage: 20,
},
},
});
},
......
src/models/webapp.js
View file @ eb4204d4
......@@ -834,7 +834,6 @@ export default {
dispatch({
type: 'onlineclasses/selectCourseList',
payload: {
type: 1,
},
});
dispatch({
......@@ -853,7 +852,6 @@ export default {
type: 'onlineclasses/findCourse',
payload: {
id: courseactive[1],
type: 1,
},
});
dispatch({
......
src/pages/onlineclasses/singleclass/AddCourseModal.js
View file @ eb4204d4
......@@ -14,7 +14,7 @@ import {
Avatar,
DatePicker,
Modal,
InputNumber, Checkbox, Radio,
message, Checkbox, Radio,
} from 'antd';
import moment from 'moment';
import pageStyle from './AddCourseModal.less';
......@@ -48,6 +48,14 @@ class AddCourseModalForm extends React.Component {
const { dispatch, form } = this.props;
e.preventDefault();
this.props.form.validateFields((err, values) => {
if (values.title === '') {
message.error('请先返回上一步输入标题', 0.5);
return;
}
if (values.time === '') {
message.error('请先返回上一步选择时间', 0.5);
return;
}
if (!err) {
const {
title,
......@@ -57,7 +65,6 @@ class AddCourseModalForm extends React.Component {
time,
password,
} = values;
console.log(moment(time[0]).format('YYYY-MM-DD HH:mm'), '1111111111');
dispatch({
type: 'onlineclasses/addCourse',
payload: {
......@@ -72,6 +79,10 @@ class AddCourseModalForm extends React.Component {
}
});
}
close = () => {
const { close } = this.props;
close();
}
render() {
const {
form: { getFieldDecorator, getFieldValue },
......@@ -99,6 +110,7 @@ class AddCourseModalForm extends React.Component {
bodyStyle={{
padding: '40px 20px',
}}
onCancel={this.close}
>
<div className={pageStyle.wrap}>
<div className={pageStyle.tabList}>
......@@ -125,7 +137,7 @@ class AddCourseModalForm extends React.Component {
message: '请输入标题',
},
],
})(<Input placeholder="请输入标题" />)}
})(<Input maxLength={40} placeholder="请输入标题" />)}
</FormItem>
<FormItem {...formItemModalLineLayout} label="开课时间">
{getFieldDecorator('time', {
......
src/pages/onlineclasses/singleclass/CourseDetail.js
View file @ eb4204d4
......@@ -138,6 +138,42 @@ class CourseDetailForm extends React.Component {
}
});
}
uploadCover = (e) => {
const { dispatch } = this.props;
dispatch({
type: 'onlineclasses/queryimagesignature',
payload: {
files: e.target,
uploadtype: 'uploadCover',
},
});
}
deleteCover = () => {
const { dispatch } = this.props;
dispatch({
type: 'onlineclasses/deleteCover',
payload: {
},
});
}
deleteAudio = () => {
const { dispatch } = this.props;
dispatch({
type: 'onlineclasses/deleteAudio',
payload: {
},
});
}
uploadAudio = (e) => {
const { dispatch } = this.props;
dispatch({
type: 'onlineclasses/queryvoiceignature',
payload: {
files: e.target,
uploadtype: 'uploadAudio',
},
});
}
render() {
const {
form: { getFieldDecorator, getFieldValue },
......@@ -164,16 +200,31 @@ class CourseDetailForm extends React.Component {
<div className={pageStyle.container}>
<Form hideRequiredMark className={pageStyle.modalform} labelAlign="left" onSubmit={this.save}>
<FormItem {...formItemModalLineLayout} label="封面" className={pageStyle.imgFormItem}>
<div className={pageStyle.photoWrap}>
<div className={pageStyle.material}>
<img src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg" alt="" />
<div className={pageStyle.tip}>从素材库选择</div>
</div>
<div className={pageStyle.material}>
<img src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg" alt="" />
<div className={pageStyle.tip}>上传图片</div>
</div>
</div>
{
addCourseObj.cover ?
<div className={pageStyle.photoWrap}>
<div className={pageStyle.photoCover}>
<img src={imagify(addCourseObj.cover)} alt="封面" />
<Icon onClick={this.deleteCover} className={pageStyle.coverDelete} type="delete" />
</div>
</div> :
<div className={pageStyle.photoWrap}>
<div className={pageStyle.material}>
<img src={`${__IMGCDN__}/course/check.png`} alt="从素材库选择" />
<div className={pageStyle.tip}>从素材库选择</div>
</div>
<div className={pageStyle.material}>
<img src={`${__IMGCDN__}/course/uploadImg.png`} alt="上传图片" />
<div className={pageStyle.tip}>上传图片</div>
<input
type="file"
className={pageStyle.uploadInput}
accept="image/png, image/jpeg"
onChange={(e) => { this.uploadCover(e); }}
/>
</div>
</div>
}
<span className="ant-form-text">图片建议格式位JPG/PNG，尺寸140*140，图片大小不超过10MB</span>
</FormItem>
<FormItem {...formItemModalLineLayout} label="标题">
......@@ -190,13 +241,13 @@ class CourseDetailForm extends React.Component {
</FormItem>
<FormItem {...formItemModalLineLayout} label="课程简述">
{getFieldDecorator('remark', {
initialValue: '',
initialValue: addCourseObj.remark,
})(<Input style={{ width: 520, marginRight: 30 }} placeholder="请输入课程简述" />)}
<span className="ant-form-text">分享课程给好友时，作为描述信息在标题下方显示</span>
</FormItem>
<FormItem {...formItemModalLineLayout} label="学习人数">
{getFieldDecorator('study_count', {
initialValue: '',
initialValue: addCourseObj.study_count,
rules: [
{
required: false,
......@@ -204,13 +255,13 @@ class CourseDetailForm extends React.Component {
pattern: new RegExp(/^[1-9]\d*$/, 'g'),
},
],
})(<InputNumber style={{ width: 520, marginRight: 30 }} placeholder="请输入学习人数" />)}
})(<InputNumber max={999999} style={{ width: 520, marginRight: 30 }} placeholder="请输入学习人数" />)}
<span className="ant-form-text">设置学习人数基数，让学员更有东西学习喔</span>
</FormItem>
<FormItem {...formItemModalLineLayout} label="课程类型">
<div className={pageStyle.courseType}>免费</div>
<span className={pageStyle.typeEdit}>点击修改</span>
<span className="ant-form-text">有人报名则无法修改课程类型</span>
{/* <span className={pageStyle.typeEdit}>点击修改</span> */}
{/* <span className="ant-form-text">有人报名则无法修改课程类型</span> */}
</FormItem>
<FormItem {...formItemModalLineLayout} label="开课时间">
{getFieldDecorator('start_time', {
......@@ -228,7 +279,22 @@ class CourseDetailForm extends React.Component {
/>)}
</FormItem>
<FormItem {...formItemModalLineLayout} label="语音介绍">
<span className={pageStyle.voice}>添加语音介绍</span>
{
addCourseObj.audio ?
<div className={pageStyle.voice}>
<audio controls src={imagify(addCourseObj.audio)} />
<Icon onClick={this.deleteAudio} className={pageStyle.audioDelete} type="delete" />
</div> :
<div className={pageStyle.voice}>
添加语音介绍
<input
type="file"
className={pageStyle.voiceUpload}
accept="audio/*"
onChange={(e) => { this.uploadAudio(e); }}
/>
</div>
}
</FormItem>
<FormItem {...formItemModalLineLayout} label="课程介绍">
<ThemeEditor
......
src/pages/onlineclasses/singleclass/CourseDetail.less
View file @ eb4204d4
.container {
background-color: #fff;
padding: 20px;
padding:0 20px;
}
.modalform {
margin-top: 20px;
......@@ -13,6 +13,24 @@
.photoWrap {
display: inline-flex;
width: 320px;
.photoCover {
width: 140px;
height: 140px;
position: relative;
&>img {
width: 140px;
height: 140px;
border-radius: 6px;
}
.coverDelete {
font-size: 22px;
color: #fa4f53;
cursor: pointer;
position: absolute;
right: -40px;
top: 0;
}
}
.material {
width: 140px;
height: 140px;
......@@ -24,6 +42,17 @@
flex-direction: column;
margin-right: 11px;
cursor: pointer;
position: relative;
.uploadInput {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
opacity: 0;
cursor: pointer;
z-index: 1;
}
.tip {
font-size:14px;
font-weight:400;
......@@ -64,4 +93,28 @@
}
.voice {
margin: 0;
position: relative;
width: 400px;
height: 40px;
&>audio {
height: 30px;
}
.audioDelete {
position: absolute;
top: 3px;
right: 0;
font-size: 22px;
color: #fa4f53;
cursor: pointer;
}
.voiceUpload {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
opacity: 0;
z-index: 1;
cursor: pointer;
}
}
src/pages/onlineclasses/singleclass/index.js
View file @ eb4204d4
import { connect } from 'dva';
import React from 'react';
import { Icon, Button, Tabs, Select, Form, List, Row, Col, Input, Card, Avatar, message } from 'antd';
import {
Icon,
Button,
Tabs,
Select,
Form,
List,
Row,
Col,
Input,
Card,
Avatar,
message,
Modal,
Pagination,
} from 'antd';
import pageStyle from './index.less';
import AddCourseModal from './AddCourseModal';
import { pageIn, hasBtnPower } from '../../../utils';
import { pageIn, hasBtnPower, imagify } from '../../../utils';
const { TabPane } = Tabs;
const FormItem = Form.Item;
const { Option } = Select;
......@@ -27,6 +42,27 @@ class ClassMgtForm extends React.Component {
type: 'onlineclasses/updateState',
payload: {
courseVisible: true,
addCourseObj: {
title: '',
start_time: '',
charge_type: '',
created_at: '',
cover: '',
type: '',
audio: '',
content: [
{ type: 'text', value: '' },
],
},
},
});
}
addCourseClose = () => {
const { dispatch } = this.props;
dispatch({
type: 'onlineclasses/updateState',
payload: {
courseVisible: false,
},
});
}
......@@ -39,76 +75,122 @@ class ClassMgtForm extends React.Component {
},
});
}
deleteCourse = (item) => {
const { dispatch } = this.props;
console.log(item, 'item');
Modal.confirm({
title: `确定删除“${item.title}”?`,
content: '删除后不可恢复，请谨慎操作！',
okText: '确定',
cancelText: '取消',
icon: <Icon type="close-circle" style={{ color: 'red' }} />,
onOk() {
dispatch({
type: 'onlineclasses/deleteCourse',
payload: {
id: item.id,
},
});
},
okButtonProps: {
type: 'danger',
style: {
color: '#fff',
backgroundColor: '#ff4d4f',
borderColor: '#ff4d4f',
},
},
});
}
onChangeCourseList = (page, perPage) => {
const { dispatch } = this.props;
dispatch({
type: 'onlineclasses/selectCourseList',
payload: {
params: {
page,
perPage,
},
},
});
console.log(page, perPage, '111111111');
}
render() {
const {
form: { getFieldDecorator, getFieldValue },
courseVisible,
courseList,
courseListTotal,
courseListParams,
} = this.props;
console.log(courseList, 'courseList');
const listData = [];
for (let i = 0; i < 23; i++) {
listData.push({
title: `超值体验课，只需要一元速来抢购，机不可失！${i}`,
avatar: 'https://cdn.img.shangjiadao.cn/clock/member/212519/2019-11-18/a2ceab5ca61e5893019d4e39efe65070.png',
description: '2019-11-12 18:21',
});
}
return (
<div className={pageStyle.container}>
<div className={pageStyle.head}>
<Button type="primary" onClick={this.handleCreateCourse}>创建线上课程</Button>
</div>
<div className={pageStyle.courseWrap}>
<div className={pageStyle.courseTip}><span>课程列表</span>(共3个)</div>
<div className={pageStyle.courseList}>
<List
size="large"
grid={{
gutter: 20,
xs: 3,
sm: 3,
md: 4,
lg: 4,
xl: 4,
xxl: 4,
}}
dataSource={courseList}
renderItem={item => (
<List.Item>
<Card bodyStyle={{ padding: 20 }}>
<Card.Meta
style={{ padding: 0 }}
avatar={<img className={pageStyle.itemImg} alt="图片" src={item.cover} />}
title={
<div className={pageStyle.itemTitleWrap}>
<div className={pageStyle.itemTitle}>{item.title}</div>
<div className={pageStyle.deleteIcon}><Icon type="delete" /></div>
</div>
}
description={
<span className={pageStyle.itemTime}>{item.description}</span>
}
/>
<div className={pageStyle.itemBtn} onClick={() => this.goEditCourse(item.id)}>
<Icon style={{ marginRight: 5 }} type="edit" /> 编辑课程
{
courseList && courseList.length > 0 ?
<div className={pageStyle.courseWrap}>
<div className={pageStyle.courseTip}><span>课程列表</span>(共{courseListTotal}个)</div>
<div className={pageStyle.courseList}>
<List
size="large"
grid={{
gutter: 20,
xs: 3,
sm: 3,
md: 4,
lg: 4,
xl: 4,
xxl: 4,
}}
footer={
<div className={pageStyle.tablefooterbox}>
<Pagination
total={Number(courseListTotal)}
onChange={this.onChangeCourseList}
pageSize={courseListParams.perPage}
/>
</div>
</Card>
</List.Item>
)}
/>,
</div>
</div>
<div className={pageStyle.noData}>
<img className={pageStyle.defaultImg} src="https://cdn.img.shangjiadao.cn/clock/member/212519/2019-11-18/a2ceab5ca61e5893019d4e39efe65070.png" alt="图片" />
<h3>创建线上课程</h3>
<h5>两步完成创建</h5>
<p>1.设置课程标题、开课时间；</p>
<p>2.选择课程类型，免费 或者 付费</p>
<Button type="primary" className={pageStyle.createBtn} onClick={this.handleCreateCourse}>立即创建</Button>
</div>
}
dataSource={courseList}
renderItem={item => (
<List.Item>
<Card bodyStyle={{ padding: 20 }}>
<Card.Meta
style={{ padding: 0 }}
avatar={<img className={pageStyle.itemImg} alt="图片" src={imagify(item.cover)} />}
title={
<div className={pageStyle.itemTitleWrap}>
<div className={pageStyle.itemTitle}>{item.title}</div>
<div className={pageStyle.deleteIcon} onClick={() => this.deleteCourse(item)}><Icon type="delete" /></div>
</div>
}
description={
<span className={pageStyle.itemTime}>{item.created_at}</span>
}
/>
<div className={pageStyle.itemBtn} onClick={() => this.goEditCourse(item.id)}>
<Icon style={{ marginRight: 5 }} type="edit" /> 编辑课程
</div>
</Card>
</List.Item>
)}
/>
</div>
</div> :
<div className={pageStyle.noData}>
<img className={pageStyle.defaultImg} src={`${__IMGCDN__}/course/no_data.png`} alt="缺省图" />
<h3>创建线上课程</h3>
<h5>两步完成创建</h5>
<p>1.设置课程标题、开课时间；</p>
<p>2.选择课程类型，免费 或者 付费</p>
<Button type="primary" className={pageStyle.createBtn} onClick={this.handleCreateCourse}>立即创建</Button>
</div>
}
<AddCourseModal
visible={courseVisible}
close={this.addCourseClose}
/>
</div>
);
......@@ -123,10 +205,14 @@ function mapStateToProps(state) {
const {
courseVisible,
courseList,
courseListTotal,
courseListParams,
} = state.onlineclasses;
return {
courseVisible,
courseList,
courseListTotal,
courseListParams,
};
}
export default connect(mapStateToProps)(ClassMgt);
......
src/pages/onlineclasses/singleclass/index.less
View file @ eb4204d4
......@@ -72,18 +72,20 @@
font-weight:400;
color:rgba(128,128,128,1);
margin: 20px auto 0;
cursor: pointer;
}
}
}
.noData {
display: none;
width: 100%;
text-align: center;
padding-bottom: 12%;
.defaultImg {
width: 110px;
height: 110px;
background-color: #E0E0E0;
margin: 85px 0 25px;
border-radius: 50%;
}
&>h3 {
font-size:22px;
......@@ -107,3 +109,7 @@
}
}
}
.tablefooterbox {
display: flex;
justify-content: flex-end;
}
src/pages/onlineclasses/singleclass/singleDetail.js
View file @ eb4204d4
......@@ -10,8 +10,8 @@ import {
Row,
Col,
Input,
Card,
Avatar,
Menu,
Dropdown,
DatePicker,
Modal,
InputNumber, Checkbox, Radio,
......@@ -41,6 +41,15 @@ class singleDetailForm extends React.Component {
}
componentWillUnmount() { // 卸载
}
changeStatus = (key) => {
const { dispatch } = this.props;
dispatch({
type: 'onlineclasses/changeCourseStatus',
payload: {
status: key === 1 ? 2 : 1,
},
});
}
render() {
const {
form: { getFieldDecorator, getFieldValue },
......@@ -56,16 +65,27 @@ class singleDetailForm extends React.Component {
sm: { span: 17 },
},
};
const menu = (
<Menu>
<Menu.Item key="0">
<span onClick={() => this.changeStatus(addCourseObj.status)}>{addCourseObj.status === 1 ? '下架' : '上架'}</span>
</Menu.Item>
</Menu>
);
return (
<div className={pageStyle.container}>
<div className={pageStyle.head}>
<div className={pageStyle.hedaTitle}>
<img src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg" alt="" />
<div className={pageStyle.title}>{addCourseObj.title}</div>
<Icon type="edit" />
<Dropdown className={pageStyle.editStatus} overlay={menu} trigger={['click']}>
<a className="ant-dropdown-link" href="#">
编辑 <Icon type="down" />
</a>
</Dropdown>
</div>
<div className={pageStyle.publish}>
<div className={pageStyle.tip}>已发布</div> 创建于：{addCourseObj.created_at}
<div className={pageStyle.tip}>{addCourseObj.status === 1 ? '已发布' : '未发布'}</div> 创建于：{addCourseObj.created_at}
</div>
</div>
<Tabs className={pageStyle.tabs} defaultActiveKey="1" onChange={this.callback}>
......
src/pages/onlineclasses/singleclass/singleDetail.less
View file @ eb4204d4
......@@ -43,3 +43,14 @@
background-color: #fff;
}
}
.editStatus {
width: 57px;
height: 27px;
line-height: 27px;
color: #575757;
font-size: 14px;
border: 1px solid #959595;
text-align: center;
border-radius: 4px;
margin-left: 10px;
}
src/services/onlineclasses.js
View file @ eb4204d4
......@@ -41,3 +41,11 @@ export function findCourse(params) {
data,
});
}
export function changeCourseStatus(params) {
const data = qs.stringify(params);
return request({
url: `${api.onlineclasses.courseputaway}/${params.id}`,
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