Skip to content

X
xiaomai-cloud-class-web
Commit b19e7da0 by guomingpang
Options

feat:微信审核

parent a8783b47
Showing with 208 additions and 119 deletions
src/common/less/icon-font.less
@font-face { @font-face {
font-family: 'iconfont'; /* Project id 2223403 */ font-family: 'iconfont'; /* Project id 2223403 */
src: url('//at.alicdn.com/t/font_2223403_oe5p510553.woff2?t=1624259078391') format('woff2'), src: url('//at.alicdn.com/t/font_2223403_7261tsts1dc.woff2?t=1628475376853') format('woff2'),
url('//at.alicdn.com/t/font_2223403_oe5p510553.woff?t=1624259078391') format('woff'), url('//at.alicdn.com/t/font_2223403_7261tsts1dc.woff?t=1628475376853') format('woff'),
url('//at.alicdn.com/t/font_2223403_oe5p510553.ttf?t=1624259078391') format('truetype'); url('//at.alicdn.com/t/font_2223403_7261tsts1dc.ttf?t=1628475376853') format('truetype');
} }
.iconfont { .iconfont {
font-family: 'iconfont' !important; font-family: 'iconfont' !important;
......
src/modules/college-manage/CollegeInfoPage.jsx
import React from 'react'; import React from 'react';
import { withRouter } from "react-router-dom"; import { withRouter } from 'react-router-dom';
import { Form, Input, Button, Modal, message} from 'antd'; import { Form, Input, Button, Modal,Switch, message } from 'antd';
import SelectPrepareFileModal from '@/modules/prepare-lesson/modal/SelectPrepareFileModal'; import SelectPrepareFileModal from '@/modules/prepare-lesson/modal/SelectPrepareFileModal';
import Upload from '@/core/upload'; import Upload from '@/core/upload';
import StoreService from "@/domains/store-domain/storeService"; import StoreService from '@/domains/store-domain/storeService';
import User from "@/common/js/user"; import User from '@/common/js/user';
import Bus from '@/core/tbus'; import Bus from '@/core/tbus';
import ImgClipModal from '@/components/ImgClipModal' import ImgClipModal from '@/components/ImgClipModal';
import "./CollegeInfoPage.less"; import './CollegeInfoPage.less';
let cutFlag = false;
class CollegeInfoPage extends React.Component { class CollegeInfoPage extends React.Component {
formRef = React.createRef(); formRef = React.createRef();
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
storeName:null, storeName: null,
logo:'', logo: '',
showSelectFileModal:false, showSelectFileModal: false,
cutImageBlob: null, cutImageBlob: null,
imageFile: null, // 需要被截取的图片 imageFile: null, // 需要被截取的图片
} auditSwitch:true,
};
} }
componentWillMount() { componentWillMount() {
if (User.getEnterpriseId()) { if (User.getEnterpriseId()) {
this.getStoreDetail() this.getStoreDetail();
} else { } else {
window.RCHistory.replace('/store-info') window.RCHistory.replace('/store-info');
}
} }
getStoreDetail = ()=>{
const params= {
storeId:User.getStoreId()
} }
getStoreDetail = () => {
const params = {
storeId: User.getStoreId(),
};
StoreService.getStoreDetail(params).then((res) => { StoreService.getStoreDetail(params).then((res) => {
const { result = { } } = res; const { result = {} } = res;
const { const { storeName, logo } = result;
storeName,
logo
} = result;
this.formRef.current.setFieldsValue({ this.formRef.current.setFieldsValue({
storeName:storeName storeName: storeName,
}); });
this.setState({ this.setState({
storeName, storeName,
logo logo,
})
}); });
} });
onChangeFiledValue=(filed,value)=>{ };
onChangeFiledValue = (filed, value) => {
console.log(filed, value)
this.setState({ this.setState({
[filed]:value [filed]: value,
}) });
} };
handleSelectCover = (file)=> {
handleSelectCover = (file) => {
this.setState({ this.setState({
visible: true, visible: true,
imageFile:file imageFile: file,
}); });
} };
//获取resourceId //获取resourceId
getSignature = (blob, fileName) => { getSignature = (blob, fileName) => {
Upload.uploadBlobToOSS(blob, 'cover' + (new Date()).valueOf(),null,'signInfo').then((signInfo) => { Upload.uploadBlobToOSS(blob, 'cover' + new Date().valueOf(), null, 'signInfo').then((signInfo) => {
this.setState({ this.setState(
coverClicpPath:signInfo.fileUrl, {
coverId:signInfo.resourceId, coverClicpPath: signInfo.fileUrl,
visible: false coverId: signInfo.resourceId,
},()=>this.updateCover()) visible: false,
},
() => this.updateCover()
);
}); });
}; };
updateCover = () =>{ updateCover = () => {
const {coverClicpPath,coverId} = this.state const { coverClicpPath, coverId } = this.state;
this.setState({ this.setState({
showSelectFileModal: false showSelectFileModal: false,
}) });
this.setState({ this.setState({
logo:coverClicpPath logo: coverClicpPath,
}) });
} };
updateInfo=()=>{ updateInfo = () => {
const { storeName, logo } = this.state; const { storeName, logo } = this.state;
if(!storeName){ if (!storeName) {
message.warning('请输入学院名称'); message.warning('请输入学院名称');
return; return;
} }
const params= { const params = {
storeName, storeName,
logo, logo,
storeId:User.getStoreId() storeId: User.getStoreId(),
} };
StoreService.updateStoreMessage(params).then((res) => { StoreService.updateStoreMessage(params).then((res) => {
User.setStoreName(storeName); User.setStoreName(storeName);
Bus.trigger('storeNameChange',storeName); Bus.trigger('storeNameChange', storeName);
message.success('保存成功'); message.success('保存成功');
Bus.trigger("updateCollegeInfo") Bus.trigger('updateCollegeInfo');
}); });
} };
render() { render() {
const { const { storeName, showSelectFileModal, visible, logo, imageFile,auditSwitch } = this.state;
storeName,
showSelectFileModal,
visible,
hasImgReady,
logo,
cutImageBlob,
imageFile
} = this.state;
return ( return (
<div className="page college-info-page"> <div className='page college-info-page'>
<div className="content-header">学院信息</div> <div className='content-header'>学院信息</div>
<div className="box"> <div className='box'>
<div className="college-info-page-form"> <div className='college-info-page-form'>
<Form ref={this.formRef}> <Form ref={this.formRef}>
<Form.Item <div className='title'>基本信息</div>
label="学院LOGO" <Form.Item label='学院LOGO'>
> <div className='logo-con'>
<div className="logo-con"> <div className='logo-img-con'>
<div className="logo-img-con"> <Choose>
{ logo ? <img src={logo} className="logo-img"/> : <div className="logo-box"><span className="text">Logo</span></div>} <When condition={logo}>
<img src={logo} className='logo-img' alt=''/>
</When>
<Otherwise>
<div className='logo-box'>
<span className='text'>Logo</span>
</div>
</Otherwise>
</Choose>
</div> </div>
<div className="upload-box"> <div className='upload-box'>
<span onClick={() => {this.setState({ showSelectFileModal:true })}} className="upload-btn"> <span
onClick={() => {
this.setState({ showSelectFileModal: true });
}}
className='upload-btn'>
<span>上传</span> <span>上传</span>
</span> </span>
<div className="tip">建议尺寸702*180px。最大2M，支持jpg、jpeg和png。</div> <div className='tip'>建议尺寸702*180px。最大2M，支持jpg、jpeg和png。</div>
</div> </div>
</div> </div>
</Form.Item> </Form.Item>
<Form.Item <Form.Item label='学院名称' name='storeName' rules={[{ required: true }]}>
label="学院名称"
name="storeName"
rules={[{ required: true}]}
>
<Input <Input
value={storeName} value={storeName}
style={{ width: '300px' }} style={{ width: '300px' }}
placeholder="请输入学院名称" placeholder='请输入学院名称'
onChange={(e) => this.onChangeFiledValue("storeName", e.target.value)} onChange={(e) => this.onChangeFiledValue('storeName', e.target.value)}
maxLength={30} maxLength={30}
/> />
</Form.Item> </Form.Item>
<div className='title mt40'>高级设置</div>
<Form.Item label='学员审核' name='storeName' rules={[{ required: true }]}>
<div className='switch-box'>
<Switch checked={auditSwitch } onChange={(e) => this.onChangeFiledValue('auditSwitch', e)}/>
<Choose>
<When condition={auditSwitch}>
<div className='switch-desc'>已开启，成为学院学员需要审核</div>
<div className='switch-prew-link'>功能预览</div>
</When>
<Otherwise>
<div className='switch-desc'>已关闭，成为学院学员不需要审核</div>
</Otherwise>
</Choose>
</div>
</Form.Item>
</Form> </Form>
</div> </div>
{showSelectFileModal && {showSelectFileModal && (
<SelectPrepareFileModal <SelectPrepareFileModal
key="basic" key='basic'
operateType="select" operateType='select'
multiple={false} multiple={false}
accept="image/jpeg,image/png,image/jpg" accept='image/jpeg,image/png,image/jpg'
selectTypeList={['JPG', 'JPEG', 'PNG']} selectTypeList={['JPG', 'JPEG', 'PNG']}
tooltip='支持文件类型：jpg、jpeg、png' tooltip='支持文件类型：jpg、jpeg、png'
isOpen={showSelectFileModal} isOpen={showSelectFileModal}
onClose={() => { onClose={() => {
this.setState({ this.setState({
showSelectFileModal:false showSelectFileModal: false,
}) });
}} }}
onSelect={this.handleSelectCover} onSelect={this.handleSelectCover}
/> />
} )}
{ visible && {visible && (
<ImgClipModal visible={visible} imgUrl={imageFile.ossUrl} aspectRatio='125/32' cropBoxHeight='128' onConfirm={this.getSignature} onClose={()=>{this.setState({ visible: false });}}/> <ImgClipModal
} visible={visible}
<div><Button type="primary" onClick={this.updateInfo} htmlType="submit" className="submit-btn">更新信息</Button></div> imgUrl={imageFile.ossUrl}
aspectRatio='125/32'
cropBoxHeight='128'
onConfirm={this.getSignature}
onClose={() => {
this.setState({ visible: false });
}}
/>
)}
<div>
<Button type='primary' onClick={this.updateInfo} htmlType='submit' className='submit-btn'>
保存设置
</Button>
</div>
</div> </div>
</div> </div>
) );
} }
} }
......
src/modules/college-manage/CollegeInfoPage.less
...@@ -13,7 +13,14 @@ ...@@ -13,7 +13,14 @@
font-size:14px; font-size:14px;
} }
.college-info-page-form{ .college-info-page-form{
margin-left:29px; margin-left:20px;
.title{
font-size: 16px;
color: #333;
font-weight: 500;
margin-left: -20px;
margin-bottom: 20px;
}
.logo-con{ .logo-con{
.logo-img-con{ .logo-img-con{
width: 258px; width: 258px;
...@@ -58,10 +65,24 @@ ...@@ -58,10 +65,24 @@
} }
} }
} }
.switch-box{
display: flex;
align-items: center;
.switch-desc{
color: #999;
font-size: 14px;
margin: 0 8px;
}
.switch-prew-link{
color: #2966FF;
font-size: 14px;
}
}
} }
.submit-btn{ .submit-btn{
margin-left:142px; margin-left:132px;
margin-top: 20px;
} }
} }
\ No newline at end of file
src/modules/college-manage/UserManagePage.less
.user-manage-page { .user-manage-page {
.content-header{
display: flex;
justify-content: space-between;
align-items: center;
.icon-font-weixin{
color: #5DD333;
margin-right:4px ;
}
.content-header-right{
font-size: 14px;
color: #2966FF;
}
}
.box-header { .box-header {
display: flex; display: flex;
width: calc(100% - 80px); width: calc(100% - 80px);
......
src/modules/college-manage/UserManagePage.tsx
...@@ -137,7 +137,10 @@ function UserManagePage() { ...@@ -137,7 +137,10 @@ function UserManagePage() {
return ( return (
<div className=" page user-manage-page"> <div className=" page user-manage-page">
<div className="content-header">学员管理</div> <div className="content-header">
<div>学员管理</div>
<div ><span className='icon iconfont icon-font-weixin'>&#xe8e0;</span><span className='content-header-right'>学员审核列表</span></div>
</div>
<div className="box"> <div className="box">
<div className="box-header"> <div className="box-header">
<div className="header-item"> <div className="header-item">
......
src/modules/course-manage/components/GraphicsEditor.jsx
...@@ -155,6 +155,7 @@ class GraphicsEditor extends React.Component { ...@@ -155,6 +155,7 @@ class GraphicsEditor extends React.Component {
message.warning(`内容过长，不能超过${maxLimit}字`); message.warning(`内容过长，不能超过${maxLimit}字`);
} }
Bus.trigger('editorLimit', textLength, editorType); Bus.trigger('editorLimit', textLength, editorType);
console.log(onChange,html, this.state.textLength)
onChange(html, this.state.textLength); onChange(html, this.state.textLength);
}); });
}; };
......
src/modules/root/CreateCollege.jsx
import React from 'react'; import React from 'react';
import { Input, Button, Modal, message, Form } from 'antd'; import { Input, Button, Switch, message, Form } from 'antd';
import Upload from '@/core/upload'; import Upload from '@/core/upload';
import Service from "@/common/js/service"; import Service from "@/common/js/service";
import BaseService from "@/domains/basic-domain/baseService"; import BaseService from "@/domains/basic-domain/baseService";
...@@ -7,9 +7,6 @@ import User from "@/common/js/user"; ...@@ -7,9 +7,6 @@ import User from "@/common/js/user";
import Breadcrumbs from "@/components/Breadcrumbs"; import Breadcrumbs from "@/components/Breadcrumbs";
import ImgClipModal from '@/components/ImgClipModal' import ImgClipModal from '@/components/ImgClipModal'
import './CreateCollege.less'; import './CreateCollege.less';
let cutFlag = false;
export default class CreateCollege extends React.Component { export default class CreateCollege extends React.Component {
constructor(props) { constructor(props) {
...@@ -20,6 +17,7 @@ export default class CreateCollege extends React.Component { ...@@ -20,6 +17,7 @@ export default class CreateCollege extends React.Component {
name: '', name: '',
enterpriseId: User.getEnterpriseId(), enterpriseId: User.getEnterpriseId(),
imageFile: null, // 需要被截取的图片 imageFile: null, // 需要被截取的图片
auditSwitch:true,
}; };
this.loginInputRef = React.createRef() this.loginInputRef = React.createRef()
} }
...@@ -70,7 +68,7 @@ export default class CreateCollege extends React.Component { ...@@ -70,7 +68,7 @@ export default class CreateCollege extends React.Component {
}; };
updateCover = () =>{ updateCover = () =>{
const {coverClicpPath,coverId} = this.state const {coverClicpPath} = this.state
this.setState({ this.setState({
logo:coverClicpPath logo:coverClicpPath
}) })
...@@ -97,21 +95,19 @@ export default class CreateCollege extends React.Component { ...@@ -97,21 +95,19 @@ export default class CreateCollege extends React.Component {
render() { render() {
const { const {
avatar,
name,
collegeName, collegeName,
logo, logo,
visible, visible,
hasImgReady,
cutImageBlob,
showError, showError,
imageFile imageFile,
auditSwitch
} = this.state; } = this.state;
return ( return (
<div className="college-manage-page"> <div className="college-manage-page">
<div className="college-header"> <div className="college-header">
<div className="box"> <div className="box">
<img className="box-image" src="https://image.xiaomaiketang.com/xm/fe4NCjr7XF.png" /> <img className="box-image" src="https://image.xiaomaiketang.com/xm/fe4NCjr7XF.png" alt=''/>
</div> </div>
</div> </div>
<div className="breadcrumb-wrap"> <div className="breadcrumb-wrap">
...@@ -124,7 +120,7 @@ export default class CreateCollege extends React.Component { ...@@ -124,7 +120,7 @@ export default class CreateCollege extends React.Component {
</div> </div>
<div className="create-box"> <div className="create-box">
<div className="image-box"> <div className="image-box">
<img className="image" src={logo}/> <img className="image" src={logo} alt=''/>
<div className="image-mask"> <div className="image-mask">
<span <span
className="icon iconfont" className="icon iconfont"
...@@ -154,6 +150,20 @@ export default class CreateCollege extends React.Component { ...@@ -154,6 +150,20 @@ export default class CreateCollege extends React.Component {
}} }}
></Input> ></Input>
</Form.Item> </Form.Item>
<Form.Item label='学员审核' name='auditSwitch' rules={[{ required: true }]}>
<div className='switch-box'>
<Switch checked={auditSwitch } onChange={(e) => this.onChangeFiledValue('auditSwitch', e)}/>
<Choose>
<When condition={auditSwitch}>
<div className='switch-desc'>已开启，成为学院学员需要审核</div>
<div className='switch-prew-link'>功能预览</div>
</When>
<Otherwise>
<div className='switch-desc'>已关闭，成为学院学员不需要审核</div>
</Otherwise>
</Choose>
</div>
</Form.Item>
</Form> </Form>
<Button <Button
className="button" className="button"
......
src/modules/root/CreateCollege.less
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
.create-box { .create-box {
padding-top: 108px; padding-top: 108px;
margin: 0 auto; margin: 0 auto;
width: 350px; width: 400px;
.image-box { .image-box {
position: relative; position: relative;
display: block; display: block;
...@@ -45,6 +45,19 @@ ...@@ -45,6 +45,19 @@
} }
} }
} }
.switch-box{
display: flex;
align-items: center;
.switch-desc{
color: #999;
font-size: 14px;
margin: 0 8px;
}
.switch-prew-link{
color: #2966FF;
font-size: 14px;
}
}
.tip { .tip {
display: block; display: block;
color: #999999; color: #999999;
......
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