Skip to content

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

微官网修改

parent c88e707e
Hide whitespace changes
Inline Side-by-side
Showing with 517 additions and 30 deletions
index.html
View file @ d6595693
......@@ -18,5 +18,5 @@
</head>
<body>
<div id="root"></div>
<script type="text/javascript" src="/dist/main.902e50.js"></script></body>
<script type="text/javascript" src="/dist/main.31c1eb.js"></script></body>
</html>
\ No newline at end of file
src/components/CommonEditor.js 0 → 100644
View file @ d6595693
import { connect } from 'dva';
import React from 'react';
import { Icon, Divider, Tabs, Select, Form, Upload, Row, Col, Input, Radio, Modal, message } from 'antd';
import pageStyle from './CommonEditor.less';
import api from '../common/api';
import { pageIn, hasBtnPower, LocalStorage, imagify, ossVideofy, audioorigin } from '../utils/index';
const upImg = `${__IMGCDN__}subjectUp.png`;
const { TabPane } = Tabs;
const { TextArea } = Input;
class CommonEditor extends React.Component {
constructor(props) {
super(props);
this.state = {
};
}
clearHtml = () => {
if (this.uEditor) {
this.uEditor.execCommand('cleardoc');
}
}
componentWillUnmount() {
if (this.uEditor) {
this.uEditor.destroy();
}
clearTimeout(this.timeout2);
clearTimeout(this.setTimeout3);
}
componentDidMount() { // 挂载
this.renderEditor();
}
renderEditor = () => {
const { sid, commentParams } = this.props;
const that = this;
if (UE && document.getElementById('editor_id')) {
that.uEditor = UE.getEditor('editor_id', {
autoHeightEnabled: false,
zIndex: 10,
allowDivTransToP: false,
// UEDITOR_HOME_URL: '../../js/ueeditor/',
materiaImgUrl: api.courseMateria.index,
materiaImgParams: {
school_id: LocalStorage.getItem('sid') || 0,
type: 1,
// page: 1
// perPage: 12
trans_status: 2,
},
elementPathEnabled: false,
requestUser: LocalStorage.getItem('user') || {},
serverUrl: api.editorUpload,
imageFieldName: 'file',
initialFrameHeight: 150,
removeFormatAttributes: 'class,style,lang,width,height,align,hspace,valign',
toolbars: [
[
'undo', // 撤销
'redo', // 重做
'fontsize', // 字号
'forecolor', // 字体颜色
'bold', // 加粗
'italic', // 斜体
'underline', // 下划线
'simpleupload', // 单图上传
'insertimage', // 多图上传
'emotion', // 表情
'spechars', // 特殊字符
'justifyleft', // 居左对齐
'justifyright', // 居右对齐
'justifycenter', // 居中对齐
'justifyjustify', // 两端对齐
// 'fullscreen', // 全屏
'imagecenter', // 居中
'edittip ', // 编辑提示
],
],
});
that.timeout2 = setTimeout(() => {
if (document.getElementById('editor_id')) {
const { sid, commentParams } = that.props;
if (commentParams.content && commentParams.content.length == 1) {
if (commentParams.content[0].type == 'editor' && commentParams.content[0].value != '') {
that.uEditor.ready(() => {
that.uEditor.setContent(commentParams.content[0].value);
});
}
}
}
that.uEditor.ready(() => {
that.uEditor.setHeight(150);
that.uEditor.addListener('contentChange', () => {
that.props.uEditorChange(this.uEditor.getContent());
});
});
}, 800);
} else {
that.setTimeout3 = setTimeout(() => {
that.renderEditor();
}, 200);
}
}
render() {
const {
commentParams,
editorAdd,
} = this.props;
console.log(commentParams, 'commentParams');
return (
<div className={pageStyle.container}>
<div className={pageStyle.editor}>
{/* eslint-disable-next-line array-callback-return,consistent-return */}
{commentParams.content.map((item, index) => {
// eslint-disable-next-line default-case
switch (item.type) {
case 'editor':
return (
<div key={index} className={pageStyle.editorwrap}>
<textarea id="editor_id" name="content" style={{ width: '630px', height: '150px' }}>
</textarea>
</div>
);
}
},
)}
</div>
<div className={pageStyle.adding} onClick={editorAdd}>
添加图文
</div>
</div>
);
}
}
CommonEditor.propTypes = {
};
export default connect()(CommonEditor);
src/components/CommonEditor.less 0 → 100644
View file @ d6595693
.textWrap {
height: auto;
position: relative;
margin-bottom:10px;
:global {
.ant-input {
padding: 6px 15px 20px;
}
}
.sizeNumber {
position: absolute;
bottom: 8px;
right: 10px;
}
}
.templatesbox {
line-height: initial;
width: 282px;
border:1px solid rgba(0,0,0,0.15);
.templatesheader {
background-color: #D9D9D9;
line-height: 37px;
color: #616161;
font-size: 16px;
text-align: center;
}
.templatesbody {
padding: 9px;
max-height: 550px;
overflow-y: scroll;
.templatesitem {
margin-bottom: 12px;
.imgbox {
width: 100%;
height: 135px;
border-radius: 6px;
overflow: hidden;
position: relative;
img {
height: 135px;
display: block;
width: 100%;
}
&:hover .templateoperate {
display: flex;
}
.templateoperate {
display: none;
position: absolute;
width: 100%;
height: 100%;
background-color: rgba(0,0,0,0.5);
left: 0;
top: 0;
z-index: 1;
// display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
.operateitem {
letter-spacing: 1px;
line-height: 40px;
color: #FFFFFF;
font-size: 14px;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
.operateicon {
margin-right: 4px;
}
&.preview {
.operateicon {
width: 16px;
height: 12px;
}
}
&.use {
.operateicon {
width: 16px;
height: 16px;
}
}
cursor: pointer;
&:hover {
background-color: rgba(0,0,0,0.5);
}
}
}
}
.templatename {
color: #616161;
font-size: 12px;
text-align: center;
margin-top: 4px;
}
}
}
}
.editorwrap {
position: relative;
height: 100px;
}
.uploadflex {
display: flex;
align-items: center;
.uploadimg {
cursor: pointer;
width: 106px;
height: 32px;
line-height: 32px;
text-align: center;
border: 1px solid #D9D9D9;
border-radius: 4px;
color: rgba(0,0,0,0.65);
position: relative;
margin-right: 30px;
.fileuploadinput {
cursor: pointer;
position: absolute;
width: 100%;
height: 100%;
z-index: 1;
opacity: 0;
left: 0;
top: 0;
}
}
}
.toolList {
position: absolute;
right: -30px;
top: 0;
width: 30px;
height: 90px;
display: flex;
flex-direction: column;
background-color: #D3D3D3;
opacity: 0;
border-radius: 2px;
z-index: -1;
div {
width: 30px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
font-size: 14px;
cursor: pointer;
}
div>img {
width: 14px;
height: 14px;
}
.up:hover {
background-color: #1890FF;
}
.down,.nodown {
transform: rotate(180deg);
}
.nodown,.noup {
cursor: not-allowed;
}
.down:hover {
background-color: #1890FF;
}
.delete:hover {
background-color: #FF6060;
}
}
.textWrap:hover,.imgwrap:hover,.videowrap:hover {
.toolList {
opacity: 1;
z-index: 1;
}
}
.editor {
width: 738px;
min-height: 319px;
padding: 0 40px 126px;
background-color: #fafafa;
-webkit-border-radius: 4px;
border-radius: 4px;
border: 1px solid #eee;
}
src/models/common.js
View file @ d6595693
......@@ -16,6 +16,11 @@ export default {
previewQrcode: '',
previewQrcodeShow: false,
downloadTitle: '',
editorParams: {
content: [
{ type: 'editor', value: '' },
],
},
},
subscriptions: {
setup({ dispatch, history }) { // eslint-disable-line
......@@ -68,6 +73,33 @@ export default {
message.error('小程序码生成失败', 1);
}
},
* uEditorChange({ payload }, { call, put, select }) {
const { value } = payload;
const { editorParams } = yield select(state => state.common);
editorParams.content = [{
type: 'editor',
value,
}];
yield put({
type: 'updateState',
payload: {
editorParams: { ...editorParams },
},
});
},
* editorAdd({ payload }, { call, put, select }) {
const { editorParams } = yield select(state => state.common);
editorParams.content.push({
type: 'editor',
value: '',
});
yield put({
type: 'updateState',
payload: {
editorParams: { ...editorParams },
},
});
},
* pageInit({ payload }, { call, put, select }) {
yield put({
type: 'updateState',
......@@ -75,6 +107,11 @@ export default {
previewQrcode: '',
previewQrcodeShow: false,
downloadTitle: '',
editorParams: {
content: [
{ type: 'editor', value: '' },
],
},
},
});
},
......
src/pages/ceshi/index.js 0 → 100644
View file @ d6595693
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 { pageIn, hasBtnPower, btnPermission, translateType, imagify } from '../../utils/index';
import BtnPermission from '../../components/BtnPermission';
import CommonEditor from '../../components/CommonEditor';
import Editor from '../liveclass/components/Editor';
const { Option } = Select;
const { TextArea } = Input;
const { Search } = Input;
const { RangePicker } = DatePicker;
class LiveClass extends React.Component {
constructor(props) {
super(props);
this.state = {
};
this.editorref = React.createRef();
}
componentDidMount() { // 挂载
pageIn('直播课堂');
}
disabledDate = (current) => {
return current && current > moment();
}
componentWillUnmount() { // 卸载
}
uEditorChange = (value) => {
const { dispatch } = this.props;
dispatch({
type: 'common/uEditorChange',
payload: {
value,
},
});
}
editorAdd = () => {
const { dispatch } = this.props;
dispatch({
type: 'common/editorAdd',
payload: {
},
});
}
render() {
const {
editorParams,
} = this.props;
return (
<div>
<div style={{ marginTop: 100 }}>
<CommonEditor
ref={this.editorref.current}
uEditorCallback={this.uEditorCallback}
uEditorChange={this.uEditorChange}
commentParams={editorParams}
editorAdd={this.editorAdd}
/>
</div>
</div>
);
}
}
LiveClass.propTypes = {
};
const LiveClassForm = Form.create()(LiveClass);
function mapStateToProps(state) {
const {
editorParams,
} = state.common;
return {
editorParams,
};
}
export default connect(mapStateToProps)(LiveClassForm);
src/pages/officialweb/index.js
View file @ d6595693
......@@ -88,6 +88,7 @@ class Officialweb extends React.Component {
});
}
render() {
console.log(this.props, 'this.props');
const {
pageInfo,
dragoverindex,
......
src/pages/officialweb/pagecomponent/SchoolInfoEditor.js
View file @ d6595693
......@@ -95,50 +95,70 @@ class SchoolInfoEditorForm extends React.Component {
onSubmit={this.handleSubmit}
hideRequiredMark
>
<Form.Item label="机构名" colon={false} className={PageStyle.FormItemClass} {...formItemLayout}>
<Form.Item label="学校名称" colon={false} className={PageStyle.FormItemClass} {...formItemLayout}>
{getFieldDecorator('title', {
initialValue: schoolInfo.title || '',
rules: [
{ required: true, message: '请输入输入机构名称!' },
{ max: 30, message: '机构名称不能超过30字！' },
{ required: true, message: '请输入输入学校名称!' },
{ max: 30, message: '学校名称不能超过30字！' },
],
})(
<Input onChange={e => this.schoolInfoChange(e, 'title')} className={PageStyle.FormItemInputClass} placeholder="输入机构名称" />)}
<Input onChange={e => this.schoolInfoChange(e, 'title')} className={PageStyle.FormItemInputClass} placeholder="请输入学校名称" />)}
</Form.Item>
<Form.Item label="多少人想学" className={PageStyle.FormItemClass} colon={false} {...formItemLayout}>
{getFieldDecorator('join_count', {
initialValue: schoolInfo.join_count || 0,
rules: [
{ required: true, message: '请输入多少人想学的基础数据!' },
],
})(
<Input className={PageStyle.FormItemInputClass} placeholder="多少人想学" onChange={e => this.schoolInfoChange(e, 'join_count')} />)}
</Form.Item>
<Form.Item label="虚拟学员数量" className={PageStyle.FormItemClass} colon={false} {...formItemLayout}>
{getFieldDecorator('visitor_count', {
initialValue: schoolInfo.visitor_count || 0,
rules: [
{ pattern: /^[1-9]\d*$/, message: '请输入正整数!' },
],
})(
<Input className={PageStyle.FormItemInputClass} placeholder="多少人想学" onChange={e => this.schoolInfoChange(e, 'visitor_count')} />)}
<span style={{ display: 'block' }}>展示在微官网主页效果为：（例）5999位学员</span>
</Form.Item>
<Form.Item label="虚拟访问量" className={PageStyle.FormItemClass} colon={false} {...formItemLayout}>
{getFieldDecorator('recommend_count', {
initialValue: schoolInfo.recommend_count || 0,
{/* <Form.Item label="多少人想学" className={PageStyle.FormItemClass} colon={false} {...formItemLayout}> */}
{/* {getFieldDecorator('join_count', { */}
{/* initialValue: schoolInfo.join_count || 0, */}
{/* rules: [ */}
{/* { required: true, message: '请输入多少人想学的基础数据!' }, */}
{/* ], */}
{/* })( */}
{/* <Input className={PageStyle.FormItemInputClass} placeholder="多少人想学" onChange={e => this.schoolInfoChange(e, 'join_count')} />)} */}
{/* </Form.Item> */}
{/* <Form.Item label="虚拟学员数量" className={PageStyle.FormItemClass} colon={false} {...formItemLayout}> */}
{/* {getFieldDecorator('visitor_count', { */}
{/* initialValue: schoolInfo.visitor_count || 0, */}
{/* rules: [ */}
{/* { pattern: /^[1-9]\d*$/, message: '请输入正整数!' }, */}
{/* ], */}
{/* })( */}
{/* <Input className={PageStyle.FormItemInputClass} placeholder="多少人想学" onChange={e => this.schoolInfoChange(e, 'visitor_count')} />)} */}
{/* <span style={{ display: 'block' }}>展示在微官网主页效果为：（例）5999位学员</span> */}
{/* </Form.Item> */}
{/* <Form.Item label="虚拟访问量" className={PageStyle.FormItemClass} colon={false} {...formItemLayout}> */}
{/* {getFieldDecorator('recommend_count', { */}
{/* initialValue: schoolInfo.recommend_count || 0, */}
{/* rules: [ */}
{/* { pattern: /^[1-9]\d*$/, message: '请输入正整数!' }, */}
{/* ], */}
{/* })( */}
{/* <Input className={PageStyle.FormItemInputClass} placeholder="多少人想学" onChange={e => this.schoolInfoChange(e, 'recommend_count')} />)} */}
{/* <span style={{ display: 'block' }}>展示在微官网主页效果为：（例）888人访问过</span> */}
{/* </Form.Item> */}
<Form.Item label="通知栏" colon={false} className={PageStyle.FormItemClass} {...formItemLayout}>
{getFieldDecorator('title', {
initialValue: schoolInfo.title || '',
rules: [
{ pattern: /^[1-9]\d*$/, message: '请输入正整数!' },
{ max: 100, message: '通知栏字数不能超过100字！' },
],
})(
<Input className={PageStyle.FormItemInputClass} placeholder="多少人想学" onChange={e => this.schoolInfoChange(e, 'recommend_count')} />)}
<span style={{ display: 'block' }}>展示在微官网主页效果为：（例）888人访问过</span>
<Input onChange={e => this.schoolInfoChange(e, 'title')} className={PageStyle.FormItemInputClass} placeholder="请输入通知信息" />)}
<span className="ant-form-text">若通知栏信息为空，则不展示通知栏</span>
</Form.Item>
<Form.Item label="位置" className={PageStyle.FormItemClass} colon={false} {...formItemLayout}>
{schoolInfo.location_address == '' && <div className={PageStyle.locationClass} onClick={this.selectaddress}>输入机构地址</div>}
{schoolInfo.location_address != '' && <div className={PageStyle.locationClass} onClick={this.selectaddress}>{schoolInfo.location_address || ''}</div>}
{/* <Input className={PageStyle.FormItemInputClass} placeholder="输入机构地址" disabled onClick={this.selectaddress} /> */}
</Form.Item>
<Form.Item label="备注地址（选填）" colon={false} className={PageStyle.FormItemClass} {...formItemLayout}>
{getFieldDecorator('title', {
initialValue: schoolInfo.title || '',
rules: [
{ max: 100, message: '通知栏字数不能超过100字！' },
],
})(
<Input onChange={e => this.schoolInfoChange(e, 'title')} className={PageStyle.FormItemInputClass} placeholder="请输入备注地址" />)}
<span className="ant-form-text">对详细地址进行辅助说明：（例）地铁一号线三坝站c出口向北100米</span>
</Form.Item>
<Form.Item label="联系电话" className={PageStyle.FormItemClass} colon={false} {...formItemLayout}>
{getFieldDecorator('tel_phone', {
initialValue: schoolInfo.tel_phone,
......
src/router.js
View file @ d6595693
......@@ -301,6 +301,11 @@ const ClockMember = props => (
{ ClockMember => (<ClockMember {...props} />) }
</Bundle>
);
const CeIndex = props => (
<Bundle load={() => import(/* webpackChunkName:"CeIndex" */'./pages/ceshi/index')}>
{ CeIndex => (<CeIndex {...props} />) }
</Bundle>
);
function RouterConfig({ history }) {
return (
<ConfigProvider locale={zhCN}>
......@@ -361,6 +366,7 @@ function RouterConfig({ history }) {
<Route path="/sjd/editLive/:id" exact component={AddLive} />
<Route path="/sjd/clockList" exact component={ClockList} />
<Route path="/sjd/member/:type/:id" exact component={ClockMember} />
{/* <Route path="/sjd/ceshi" exact component={CeIndex} /> */}
<Route component={Errorpage} />
</Switch>
</SjdIndex>
......
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