Skip to content

X
xiaomai-website-ssr-template
Commit 9f069005 by liguokang
Options

feat: ⚡

parent 94616e90
Showing with 6 additions and 7065 deletions
data-source/join-us/request-apis.ts deleted 100644 → 0
/*
* @Description:
* @Author: zangsuyun
* @Date: 2020-08-04 15:12:42
* @LastEditors: zangsuyun
* @LastEditTime: 2020-08-04 15:16:03
* @Copyright: © 2020 杭州杰竞科技有限公司 版权所有
*/
import axios from 'axios';
export const getJobs = () => {
return axios.get("https://image.xiaomaiketang.com/xm/jobs.json")
}
data-source/news/news-apis.ts deleted 100644 → 0
/*
* @Author: hongxutao
* @Date: 2021-03-08 09:59:58
* @LastEditors: zhujiapeng
* @LastEditTime: 2021-06-04 16:26:24
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
import fetch from '@/common/js/fetch';
class NewsAPI {
// 获取新闻动态列表
FetchPublishedNews(params: any) {
return fetch.post({
url: 'workbench/anon/website/fetchPublishedNews',
data: params,
})
}
}
export default new NewsAPI()
\ No newline at end of file
pages/HonoraryCertificate.less deleted 100644 → 0
.honorary-certificate {
.honorary-certificate-title {
width: 100%;
height: 266px;
background-image: url("https://image.xiaomaiketang.com/xm/wCnhdDPwXh.png");
background-repeat: no-repeat;
background-position: 50% 50%;
position: relative;
background-position: top;
background-size: cover;
margin-bottom: 80px;
p {
font-size: 38px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(255, 255, 255, 1);
position: absolute;
left: 50%;
top: 100px;
margin-left: -76px;
}
}
.center {
width: 1200px;
margin: 0 auto;
text-align: center;
}
.content {
.honorary-area {
width: 100%;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
.honorary-list {
width: 580px;
text-align: center;
margin-bottom: 66px;
img {
width: 580px;
height: 435px;
}
p {
font-size: 20px;
color: #333;
}
}
}
}
}
pages/WheatSystem.less deleted 100644 → 0
.wheat-system {
.banner {
background: url(https://image.xiaomaiketang.com/xm/NfZexe2Azs.png) no-repeat;
width: 100vw;
height: 38.5vw;
background-size: auto 100%;
overflow: hidden;
text-align: center;
.text {
font-size: 0.8rem;
font-family: "PingFangSC-Semibold";
color: white;
font-weight: 600;
text-align: center;
margin-top: 1.5rem;
p {
margin: 0;
}
.subTitle {
font-size: 0.475rem;
font-family: "PingFangSC-Regular";
font-weight: 400;
opacity: 0.8;
}
.button {
margin-top: 0.6rem;
font-family: "PingFangSC-Regular";
display: inline-block;
width: 2.76rem;
height: 0.8rem;
background: white;
color: #fe913b;
font-size: 0.4rem;
border-radius: 0.4rem;
line-height: 0.8rem;
font-weight: 400;
transition: 0.2s;
cursor: pointer;
&:hover {
box-shadow: 0px 8px 16px 0px rgba(202, 99, 5, 0.41);
}
}
}
}
.tab {
ul {
padding: 0;
}
.tab-margin {
padding-top: 1.6rem;
}
.title {
font-size: 0.68rem;
text-align: center;
font-family: "PingFangSC-Medium";
font-weight: 500;
color: rgba(51, 51, 51, 1);
line-height: 68px;
margin-bottom: 1rem;
}
.tab-1 {
background: none;
ul {
display: flex;
justify-content: space-between;
padding: 0 2rem;
box-sizing: border-box;
width: 100%;
li {
flex: 1;
font-size: 0;
border-radius: 4px;
padding: 0 0.2rem;
& > div {
transition: 0.3s;
}
&:hover {
& > div {
box-shadow: 0px 4px 24px 0px rgba(0, 0, 0, 0.06);
border-radius: 4px;
}
}
img {
width: 100%;
}
div {
padding: 0.25rem 0;
p {
text-align: center;
font-size: 0.34rem;
color: rgba(51, 51, 51, 1);
}
}
}
}
}
.tab-2 {
background: none;
ul {
display: flex;
justify-content: space-between;
box-sizing: border-box;
width: 100%;
& > li {
flex: 1;
// height: 4.6rem;
height: 5rem;
text-align: center;
color: white;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
position: relative;
overflow: hidden;
img {
transition: 0.3s;
}
&:hover {
img {
transform: scale(1.1, 1.1);
}
}
img {
width: 100%;
position: absolute;
}
p {
position: absolute;
}
& > p:nth-of-type(1) {
font-size: 0.6rem;
font-family: PingFangSC-Semibold;
font-weight: 600;
// color: rgba(255, 255, 255, 1);
top: 1.8rem;
margin-bottom: 0.1rem;
}
& > p:nth-of-type(2) {
font-size: 0.36rem;
top: 2.8rem;
}
}
}
}
.tab-3 {
background: none;
ul {
display: flex;
& > li {
flex: 1;
height: 5.3rem;
display: flex;
justify-content: center;
// align-items: center;
padding-top: 1.54rem;
box-sizing: border-box;
color: white;
font-size: 0.25rem;
position: relative;
overflow: hidden;
&:hover {
.tab3-background {
opacity: 1;
}
}
.tab3-background {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background: linear-gradient(
90deg,
rgba(255, 170, 27, 1) 0%,
rgba(255, 134, 52, 1) 100%
);
opacity: 0;
transition: 0.3s;
}
& > div.tab3-fontsie {
text-align: center;
z-index: 1;
font-family: PingFangSC-Semibold;
p {
font-size: 0.8rem;
line-height: 0.8rem;
font-weight: 800;
margin-bottom: 0.3rem;
}
}
}
li:nth-of-type(1) {
background: url("https://image.xiaomaiketang.com/xm/KEprBeyRaD.png")
no-repeat;
background-size: cover;
}
li:nth-of-type(2) {
background: url("https://image.xiaomaiketang.com/xm/6me7EQYrxJ.png")
no-repeat;
background-size: cover;
}
li:nth-of-type(3) {
background: url("https://image.xiaomaiketang.com/xm/WiWFXaa5Nw.png")
no-repeat;
background-size: cover;
}
li:nth-of-type(4) {
background: url("https://image.xiaomaiketang.com/xm/m234bbrCmt.png")
no-repeat;
background-size: cover;
}
li:nth-of-type(5) {
background: url("https://image.xiaomaiketang.com/xm/Aa7xcPtGp4.png")
no-repeat;
background-size: cover;
}
}
}
.tab-4 {
background: rgba(249, 249, 249, 1);
ul {
display: flex;
flex-wrap: wrap;
padding: 1.05rem 1.8rem;
background: url(https://image.xiaomaiketang.com/xm/wJHiPm76rH.png)
no-repeat;
background-size: auto 100%;
li {
width: 25%;
height: 3.86rem;
padding: 0.65rem 1rem;
// padding: 1rem 0.31rem;
box-sizing: border-box;
// background: rgba(249, 249, 249, 1);
background: #fff;
&:hover {
padding: 0 0.31rem;
box-sizing: border-box;
display: flex;
background: rgba(249, 249, 249, 1);
// justify-content: center;
align-items: center;
.show-way {
display: none;
}
.introduce {
display: block;
width: 100%;
}
}
.show-way {
text-align: center;
img {
width: 1.9rem;
height: 1.9rem;
margin-bottom: 0.1rem;
}
span {
color: rgba(51, 51, 51, 1);
font-size: 0.34rem;
}
}
.introduce {
display: none;
h4 {
text-align: center;
color: rgba(51, 51, 51, 1);
font-size: 0.36rem;
font-weight: 300;
margin-bottom: 0.3rem;
}
& > p,
& > div {
font-size: 0.2rem;
color: #333;
}
}
}
}
}
.tab-5 {
padding-bottom: 1.6rem;
ul {
display: flex;
padding: 0 1.94rem;
li {
flex: 1;
text-align: center;
img {
width: 1.9rem;
height: 1.9rem;
margin-bottom: 0.29rem;
}
p {
font-size: 0.32rem;
color: #666;
line-height: 0.5rem;
&.supplement {
color: rgba(153, 153, 153, 1);
font-size: 0.22rem;
}
}
}
}
}
.tab-6 {
.step-pic {
width: 100vw;
height: 8.62rem;
background: url(https://image.xiaomaiketang.com/xm/25MKzZyWKa.png)
no-repeat;
background-size: auto 100%;
color: white;
overflow: hidden;
padding: 0 2.75rem;
box-sizing: border-box;
text-align: center;
h4 {
font-size: 0.7rem;
text-align: center;
margin-top: 1.2rem;
margin-bottom: 0.8rem;
color: #fff;
}
ul {
display: flex;
.step {
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
img {
width: 2rem;
height: 2rem;
margin-bottom: 0.36rem;
}
span {
font-size: 0.36rem;
}
}
.direct {
width: 1.9rem;
height: 2rem;
display: flex;
justify-content: center;
align-items: center;
img {
width: 0.62rem;
}
}
}
.button {
margin-top: 0.8rem;
font-family: "PingFangSC-Regular";
display: inline-block;
text-align: center;
width: 4rem;
height: 0.9rem;
background: #ff8534;
color: #fff;
font-size: 0.4rem;
border-radius: 0.45rem;
line-height: 0.9rem;
font-weight: 400;
cursor: pointer;
&:hover {
background: rgba(252, 156, 107, 1);
}
}
}
.footer {
background: url("https://image.xiaomaiketang.com/xm/wfPsYMZMWA.png")
no-repeat;
background-size: auto 100%;
width: 100vw;
height: 4.3rem;
display: flex;
padding: 1.2rem 1rem 1.2rem 3.6rem;
box-sizing: border-box;
.contact {
color: white;
box-sizing: border-box;
font-size: 0.3rem;
display: flex;
// padding: 1rem 0;
flex-direction: column;
justify-content: space-around;
p {
line-height: 0.7rem;
}
}
.QR-code {
display: flex;
flex: 1;
// padding: 1rem 0;
flex-direction: column;
justify-content: center;
align-items: center;
img {
width: 1.48rem;
height: 1.48rem;
margin-bottom: 0.12rem;
}
p {
width: 1.48rem;
font-size: 0.3rem;
color: #fff;
text-align: center;
}
}
}
}
}
}
pages/api/hello.js deleted 100644 → 0
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
export default (req, res) => {
res.status(200).json({ name: 'John Doe' })
}
pages/cloud-class.jsx deleted 100644 → 0
/*
* @Description:
* @Author: zangsuyun
* @Date: 2020-07-23 15:38:38
* @LastEditors: zhujiapeng
* @LastEditTime: 2021-06-07 14:13:47
* @Copyright: © 2020 杭州杰竞科技有限公司 版权所有
*/
import React from "react";
import { Button } from "antd";
// import FreeTrial from "@/components/FreeTrial";
import Header from '../components/Header';
import Footer from '../components/Footer';
import SiderBar from '../components/SiderBar';
import "./cloudClass.less";
class cloudClass extends React.Component {
constructor(props) {
super(props);
this.state = {
isShow: false,
};
}
componentWillMount(){
// if (
// navigator.userAgent.match(
// /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i
// )
// ) {
// //pc端访问 跳转至pc页面
// window.location.href = "../wap.html";
// }
}
componentDidMount() {
this.firstMove();
this.secondMove();
// window.WEBTRACING('WebG_product_cloudClass_showEvent_openPage', 'WebG_产品_云课堂_曝光事件_打开页面', {page: 'cloudClass'})
}
renderModal = (flag) => {
this.setState({
isShow: flag,
});
};
firstMove() {
var oImgContainer = document.getElementById("img-container1");
var oImgUl = oImgContainer.getElementsByTagName("ul")[0];
var aImgLi = oImgUl.children;
var oTextContainer = document.getElementById("text-container1");
var oTextUl = oTextContainer.getElementsByTagName("ul")[0];
var aTextLi = oTextUl.children;
var timer = null;
var bgshadow = oTextContainer.children[0];
// // 设置ul的宽度
// oImgUl.offsetWidth = (aImgLi.length + 1) * aImgLi[0].offsetWidth;
// 定位imgUrl的初始位置
var iNow = 0;
// console.log(aTextLi[1].offsetHeight);
oImgUl.style.left = -aImgLi[0].offsetWidth * iNow + "px";
bgshadow.style.top = 26 + "px";
timer = setInterval(() => {
iNow++;
if (iNow == 3) {
iNow = 0;
}
oImgUl.style.left = -aImgLi[0].offsetWidth * iNow + "px";
bgshadow.style.top = aTextLi[1].offsetHeight * iNow + 26 + "px";
for (var i = 0; i < aImgLi.length; i++) {
aImgLi[i].className = "fl";
}
aImgLi[iNow].className = "fl on";
}, 3000);
for (let i = 0; i < aTextLi.length; i++) {
// 当hover时，背景变色,清除定时器
aTextLi[i].onmouseover = function () {
clearInterval(timer);
bgshadow.style.top = bgshadow.offsetHeight * i + 26 + "px";
for (let j = 0; j < aImgLi.length; j++) {
aImgLi[j].className = "fl";
}
aImgLi[i].className = "fl on";
oImgUl.style.left = -aImgLi[0].offsetWidth * i + "px";
};
}
// 当鼠标移出的时候开启定时器让ul自动向前运动
oTextContainer.onmouseleave = function () {
clearInterval(timer);
timer = setInterval(() => {
iNow++;
if (iNow == 3) {
iNow = 0;
}
oImgUl.style.left = -aImgLi[0].offsetWidth * iNow + "px";
bgshadow.style.top = bgshadow.offsetHeight * iNow + 26 + "px";
for (var i = 0; i < aImgLi.length; i++) {
aImgLi[i].className = "fl";
}
aImgLi[iNow].className = "fl on";
}, 3000);
};
}
secondMove() {
var oImgContainer = document.getElementById("img-container2");
var oImgUl = oImgContainer.getElementsByTagName("ul")[0];
var aImgLi = oImgUl.children;
var oTextContainer = document.getElementById("text-container2");
var oTextUl = oTextContainer.getElementsByTagName("ul")[0];
var aTextLi = oTextUl.children;
var timer = null;
var bgshadow = oTextContainer.children[0];
// // 设置ul的宽度
// oImgUl.offsetWidth = (aImgLi.length + 1) * aImgLi[0].offsetWidth;
// 定位imgUrl的初始位置
var iNow = 0;
console.log(aTextLi[1].offsetHeight);
oImgUl.style.left = -aImgLi[0].offsetWidth * iNow + "px";
bgshadow.style.top = 0 + "px";
timer = setInterval(() => {
iNow++;
if (iNow == 6) {
iNow = 0;
}
oImgUl.style.left = -aImgLi[0].offsetWidth * iNow + "px";
bgshadow.style.top = aTextLi[1].offsetHeight * iNow + 0 + "px";
for (var i = 0; i < aImgLi.length; i++) {
aImgLi[i].className = "fl";
}
aImgLi[iNow].className = "fl on";
}, 3000);
for (let i = 0; i < aTextLi.length; i++) {
// 当hover时，背景变色,清除定时器
aTextLi[i].onmouseover = function () {
clearInterval(timer);
bgshadow.style.top = bgshadow.offsetHeight * i + 0 + "px";
for (let j = 0; j < aImgLi.length; j++) {
aImgLi[j].className = "fl";
}
aImgLi[i].className = "fl on";
oImgUl.style.left = -aImgLi[0].offsetWidth * i + "px";
};
}
//当鼠标移出的时候开启定时器让ul自动向前运动
oTextContainer.onmouseleave = function () {
clearInterval(timer);
timer = setInterval(() => {
iNow++;
if (iNow == 6) {
iNow = 0;
}
oImgUl.style.left = -aImgLi[0].offsetWidth * iNow + "px";
bgshadow.style.top = bgshadow.offsetHeight * iNow + 0 + "px";
for (var i = 0; i < aImgLi.length; i++) {
aImgLi[i].className = "fl";
}
aImgLi[iNow].className = "fl on";
}, 3000);
};
}
render() {
return (
<div className="" style={{ background: "#fff" }}>
<Header active={"product"}></Header>
<div className="cloud-class">
<div className="xm-head-content center">
<div className="title">云课堂，教培机构专属在线课堂</div>
<div className="content">
支持1v1、小班课、大班课，覆盖专业线上教学场景
</div>
<Button
size="large"
onClick={() => {
window.WEBTRACING('WebG_product_cloudClass_showEvent_openPage', 'WebG_产品_云课堂_Banner_点击事件_点击免费试用', {page: 'cloudClass'})
this.renderModal(true);
}}
>
免费试用
</Button>
</div>
</div>
<div className="content-module"></div>
<div className="content-module content-module-3">
<div className="center">
<div className="module-item">
<div className="module-title">覆盖专业线上教学场景</div>
<div className="online-teach">
<div className="online-teach-item">
<div className="img1"></div>
<p>班型</p>
<span>
支持1v1、小班互动、 <br /> 大班直播等多种教学形态
</span>
</div>
<div className="online-teach-item">
<div className="img2"></div>
<p>互动</p>
<span>
音、视频实时同步，一键分发
<br /> 答题器，趣味师生互动，课
<br /> 堂氛围佳
</span>
</div>
<div className="online-teach-item">
<div className="img3"></div>
<p>回顾</p>
<span>
支持学生无限次回放视频， <br /> 及时查漏补缺
</span>
</div>
<div className="online-teach-item">
<div className="img4"></div>
<p>课件</p>
<span>
支持PPT/PDF/WORD/ <br /> MP4+屏幕共享
</span>
</div>
<div className="online-teach-item">
<div className="img5"></div>
<p>白板</p>
<span>
支持外接手写设备，还原教 <br /> 师黑板状态
</span>
</div>
</div>
</div>
</div>
</div>
<div className="content-module content-module-3">
<div className="center">
<div className="module-item">
<div className="module-title">支持多种班型，轻松开启在线课堂</div>
<div className="cloud-content-module-body">
<div className="module-img" id="img-container1">
<div className="img-wrap">
<ul className="ul ul2">
<li className="fl on">
<img
src="https://image.xiaomaiketang.com/xm/W6wBJZnzcY.png"
alt=""
className="img1 picture"
/>
</li>
<li className="fl">
<img
src="https://image.xiaomaiketang.com/xm/x3CmjFJBXH.png"
alt=""
className="img2 on picture"
/>
</li>
<li className="fl">
<img
src="https://image.xiaomaiketang.com/xm/xYMBNnrac3.png"
alt=""
className="img3 picture"
/>
</li>
</ul>
</div>
</div>
<div className="module-text" id="text-container1">
<div className="bg-shadow"></div>
<ul>
<li>
<div className="left-img img1"></div>
<div className="right-text">
<div className="title">1v1小班课</div>
<div className="detail">
师生音视频实时同步，1v1沉浸式教学场景，保障高
效学习氛围
</div>
</div>
</li>
<li>
<div className="left-img img2"></div>
<div className="right-text">
<div className="title">多人小班课</div>
<div className="detail">
支持1v2....1v12多种类型互动课，老师上课期间可一键开关学生音视频
</div>
</div>
</li>
<li>
<div className="left-img img3"></div>
<div className="right-text">
<div className="title">千人大班课</div>
<div className="detail">
直播不卡顿，支持1-12个学生举手连麦上讲台 ，大
班课更生动有趣
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div className="content-module content-module-3">
<div className="body-center center">
<div className="module-title">
配套多样化教学工具，提供教学全流程解决方案
</div>
<div
className="cloud-content-module-body"
style={{ padding: "40px 20px 0 40px" }}
>
<div className="module-text" id="text-container2">
<div className="bg-shadow2"></div>
<ul>
<li>
<div className="left-img img1"></div>
<div className="right-text">
<div className="title">课前丨上课提醒通知</div>
<div className="detail">
支持教务老师、助教、教学老师一键通知上课学员，减少老师通知工作量
</div>
</div>
</li>
<li>
<div className="left-img img2"></div>
<div className="right-text">
<div className="title">课中丨课件与白板</div>
<div className="detail">
支持PPT/PDF/WORD/MP4等各类格式课件，支持教师共享屏幕，白板工具实时同步书写、画图
</div>
</div>
</li>
<li>
<div className="left-img img3"></div>
<div className="right-text">
<div className="title">课中丨互动答题</div>
<div className="detail">
客观题答题器支持单选、多选，答题统计实时反馈，把握课中教学效果，及时查漏补缺
</div>
</div>
</li>
<li>
<div className="left-img img4"></div>
<div className="right-text">
<div className="title">课后丨学生回顾课程</div>
<div className="detail">
支持无限次回放，做到温故而知新，及时复盘线上教学结果
</div>
</div>
</li>
<li>
<div className="left-img img5"></div>
<div className="right-text">
<div className="title">课后丨资料同步</div>
<div className="detail">
专属备课云盘，老师在线保存直播课资料，学生随时随地可查看
</div>
</div>
</li>
<li>
<div className="left-img img6"></div>
<div className="right-text">
<div className="title">课后丨数据反馈</div>
<div className="detail">
上课数据实时反馈，学生课后复习情况一手掌握
</div>
</div>
</li>
</ul>
</div>
<div className="module-img-2" id="img-container2">
<div className="img-wrap">
<ul className="ul ul2">
<li className="fl on">
<img
src="https://image.xiaomaiketang.com/xm/hW4WSN2ECZ.png"
alt="打卡作业"
className="img1 picture"
/>
</li>
<li className="fl">
<img
src="https://image.xiaomaiketang.com/xm/zb5aSJmCpD.png"
alt="内容分享"
className="img2 on picture"
/>
</li>
<li className="fl">
<img
src="https://image.xiaomaiketang.com/xm/7DweirK7ce.png"
alt="内容分享"
className="img2 on picture"
/>
</li>
<li className="fl">
<img
src="https://image.xiaomaiketang.com/xm/nz7HZ7fRaA.png"
alt="内容分享"
className="img2 on picture"
/>
</li>
<li className="fl">
<img
src="https://image.xiaomaiketang.com/xm/B5f7cTriPn.png"
alt="内容分享"
className="img2 on picture"
/>
</li>
<li className="fl">
<img
src="https://image.xiaomaiketang.com/xm/e8Chfhk5RH.png"
alt="内容分享"
className="img2 on picture"
/>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
{/* {this.state.isShow ? (
<FreeTrial handModalShow={this.renderModal}></FreeTrial>
) : (
""
)} */}
<Footer page="cloudClass" isTrial={true}></Footer>
<SiderBar />
</div>
);
}
}
export default cloudClass;
pages/cloudClass.less deleted 100644 → 0
.cloud-class {
width: 100%;
height: 540px;
background-image: url(https://image.xiaomaiketang.com/xm/FdZCEhY2fZ.png);
background-repeat: no-repeat;
background-position: 50% 50%;
position: relative;
display: flex;
align-items: center;
}
.online-teach{
display: flex;
margin: 110px 0 31px 0;
justify-content: space-between;
.online-teach-item{
width:212px;
height:178px;
background:rgba(255,255,255,1);
box-shadow:0px 2px 40px 0px rgba(234,238,244,1);
border-radius:4px;
text-align: center;
font-size:14px;
line-height:20px;
p{
font-weight:500;
color: #333333;
margin-bottom: 8px;
margin-top: -10px;
}
span{
color: #666666;
font-weight:400;
}
img{
width: 69px;
transform: translateY(-50%);
}
.img1{
width: 69px;
height: 69px;
display: inline-block;
transform: translateY(-50%);
background: url('https://image.xiaomaiketang.com/xm/cYepcpPfwH.png');
background-size: contain;
background-position: center;
// cursor: pointer;
// &:hover{
// background: url("https://image.xiaomaiketang.com/xm/zxnCzzWGCW.png");
// background-size: contain;
// }
}
.img2{
width: 69px;
height: 69px;
display: inline-block;
transform: translateY(-50%);
background: url('https://image.xiaomaiketang.com/xm/8Ppt7xGXHK.png');
background-size: contain;
background-position: center;
// cursor: pointer;
// &:hover{
// background: url("https://image.xiaomaiketang.com/xm/TianCteAz5.png");
// background-size: contain;
// }
}
.img3{
width: 69px;
height: 69px;
display: inline-block;
transform: translateY(-50%);
background: url('https://image.xiaomaiketang.com/xm/ZZZ2wDXpMM.png');
background-size: contain;
background-position: center;
// cursor: pointer;
// &:hover{
// background: url("https://image.xiaomaiketang.com/xm/BbtWMdeshm.png");
// background-size: contain;
// }
}
.img4{
width: 69px;
height: 69px;
display: inline-block;
transform: translateY(-50%);
background: url('https://image.xiaomaiketang.com/xm/E5x5Yspic8.png');
background-size: contain;
background-position: center;
// cursor: pointer;
// &:hover{
// background: url("https://image.xiaomaiketang.com/xm/8sBD7NNHXS.png");
// background-size: contain;
// }
}
.img5{
width: 69px;
height: 69px;
display: inline-block;
transform: translateY(-50%);
background: url('https://image.xiaomaiketang.com/xm/WDysjJa8Xr.png');
background-size: contain;
background-position: center;
// cursor: pointer;
// &:hover{
// background: url("https://image.xiaomaiketang.com/xm/ie5Qzr3SFe.png");
// background-size: contain;
// }
}
}
}
.cloud-content-module-body {
display: flex;
justify-content: space-between;
.module-img {
box-sizing: border-box;
position: relative;
.img-wrap {
width: 660px;
ul {
width: 2023px;
position: relative;
li {
left: 0;
width: 618px;
opacity: 0;
&.on{
transition: opacity 0.5s;
opacity: 1;
}
.picture {
width: 618px;
padding: 20px;
border: #D7DFE8 2px dashed;
box-shadow: 0 0 10px rgba(234, 239,246,0.5);
}
}
}
}
}
.module-img-2 {
margin-top: 110px;
margin-left: 70px;
padding: 52px 16px 108px 0px;
box-sizing: border-box;
position: relative;
.img-wrap {
width: 630px;
margin-left: -19px;
ul {
width: 4023px;
position: relative;
left: 22px;
&.ul2 {
left: 0px;
}
&.ul3 {
left: 0px;
}
li {
width: 618px;
opacity: 0;
&.on{
transition: opacity 0.5s;
opacity: 1;
}
.picture {
width: 588px;
padding: 20px;
border: #D7DFE8 2px dashed;
box-shadow: 0 0 10px rgba(234, 239,246,0.5);
}
}
}
}
}
.web-img {
box-shadow: 0 0 30px #eaeff6;
}
.module-text {
position: relative;
overflow: hidden;
.bg-shadow{
width: 100%;
height: 126px;
background-color: #fff;
// opacity: 0.1;
position: absolute;
// top:100px;
transition: top 0.2s;
}
.bg-shadow2{
width: 100%;
height: 126px;
background-color: #f4f6f9;
// opacity: 0.1;
position: absolute;
// top:100px;
transition: top 0.2s;
}
ul {
li {
position: relative;
z-index: 10;
padding: 31px 53px 32px 25px;
box-sizing: border-box;
display: flex;
justify-content: flex-start;
&.on {
background-color: rgba(244, 246, 249, 1);
}
.left-img {
width: 48px;
height: 48px;
margin-right: 20px;
background-repeat: no-repeat;
background-size: contain;
&.img1 {
background-image: url("https://image.xiaomaiketang.com/xm/fWd2KAh3F2.png");
}
&.img2 {
background-image: url("https://image.xiaomaiketang.com/xm/ZmBFfNMHAr.png");
}
&.img3 {
background-image: url("https://image.xiaomaiketang.com/xm/AHz2aFMCEZ.png");
}
&.img4 {
background-image: url("https://image.xiaomaiketang.com/xm/Ata3XQK4FE.png");
}
&.img5 {
background-image: url("https://image.xiaomaiketang.com/xm/wt7aEawwE8.png");
}
&.img6 {
background-image: url("https://image.xiaomaiketang.com/xm/SQrmWc6yra.png");
}
}
.right-text {
width: 276px;
.title {
font-size: 16px;
font-weight: 400;
color: rgba(51, 51, 51, 1);
line-height: 22px;
margin-bottom: 7px;
}
.detail {
font-size: 12px;
font-weight: 400;
color: rgba(102, 102, 102, 1);
line-height: 17px;
}
}
}
}
&#text-container1 {
ul {
margin-top: 26px;
li {
&.on {
background-color: #fff;
}
.left-img {
width: 48px;
height: 48px;
margin-right: 20px;
background-repeat: no-repeat;
background-size: contain;
&.img1 {
background-image: url("https://image.xiaomaiketang.com/xm/RPnMDpE82X.png");
}
&.img2 {
background-image: url("https://image.xiaomaiketang.com/xm/MhEzRRQWfn.png");
}
&.img3 {
background-image: url("https://image.xiaomaiketang.com/xm/zzYdbxsEQ6.png");
}
}
}
}
}
}
}
\ No newline at end of file
pages/company-profile.jsx deleted 100644 → 0
/*
* @Author: zhujiapeng
* @Date: 2021-06-04 14:38:09
* @LastEditors: liguokang
* @LastEditTime: 2021-07-14 20:39:36
* @Description: 公司简介页面
* @Copyright: ©2021 杭州杰竞科技有限公司 版权所有
*/
import Header from '../components/Header';
import Footer from '../components/Footer';
import SiderBar from '../components/SiderBar';
import './CompanyProfile.less';
export default function CompanyProfile() {
return (
<div className="company-profile" style={{ background: "#fff" }}>
<Header active={"aboutUs"}></Header>
<div className="swiper-img">
<div className="swiper-img-content center">
<p>为教育产业赋能</p>
<span>
小麦助教，隶属于杭州杰竞科技有限公司，是专业的教育信息化全场景服务商，以数据和技术为引擎，为教育机构提供一站式数字化运营管理解决方案，致力于构建教育信息化新生态。目前已成功服务超80000家教育品牌， 超105万位教育从业者，连接近4500万名学员和家长。
</span>
</div>
</div>
<div className="content">
<div className="center">
<div
className="content-module content-module-1"
style={{ paddingTop: 0, background: '#fff' }}
>
<div className="content-module-body">
<p>
基于互联网领域的创新技术及对用户行为的洞察，小麦助教打通了教育机构线上线下的各类真实场景，实现教育机构的信息化办公，极大提升了教育行业的整体经营效率。目前小麦助教的业务已覆盖全国200多个城市和地区，现产品体系包含小麦助教管理系统、小麦秀、小麦校讯通、小麦云课堂、麦麦打卡、小麦学院、小麦收银等，帮助教育机构解决招生营销、教务管理、家校服务、在线教学、课后督学、品牌传播、经营进阶等全流程运营管理难题，率先实现了在SaaS信息化服务、内容营销、金融服务等多元领域的落地应用。
</p>
<p>以“为教育产业赋能”为使命，小麦助教愿做教育路上的助力者，用科技创新为中国的教育事业贡献力量。</p>
</div>
</div>
</div>
<div className="content-module content-module-1">
<div className="center">
<div className="module-title">我们的价值观</div>
<div className="content-module-img">
<div className="img">
<img
src="https://image.xiaomaiketang.com/xm/x8ErbPGQXD.png"
alt="小麦助教价值观-严谨"
title="小麦助教价值观-严谨"
/>
<div className="img-tip">
<h2>严谨</h2>
<span>RIGOROUS</span>
</div>
</div>
<div className="img">
<img
src="https://image.xiaomaiketang.com/xm/GxeN3dHHz5.png"
alt="小麦助教价值观-激情"
title="小麦助教价值观-激情"
/>
<div className="img-tip">
<h2>激情</h2>
<span>ENTHUSIASM</span>
</div>
</div>
<div className="img">
<img
src="https://image.xiaomaiketang.com/xm/ZyxZh3SHTa.png"
alt="小麦助教价值观-成长"
title="小麦助教价值观-成长"
/>
<div className="img-tip">
<h2>成长</h2>
<span>DEVELOPMENT</span>
</div>
</div>
</div>
</div>
</div>
<div className="content-module content-module-1" style={{ background: '#fff' }}>
<div className="center">
<div className="module-title">我们的服务宗旨</div>
<div className="content-module-img">
<div className="img1">
<img
style={{ width: "100%" }}
src="https://image.xiaomaiketang.com/xm/y4zh3eWWXM.png"
alt="小麦助教服务宗旨-客户成功，小麦成功"
title="小麦助教服务宗旨-客户成功，小麦成功"
/>
<div className="img-tip">客户成功 小麦成功</div>
</div>
</div>
</div>
</div>
<div className="content-module content-module-2">
<div className="center">
<div id="team-pic" className="anchor"></div>
<div className="module-title">团队照片</div>
<div className="content-module-body">
<div className="picture-wrap center">
<div className="left">
<div className="top tran-scale">
<img
src="https://image.xiaomaiketang.com/xm/GixsZkGpYA.png"
alt="小麦助教团队照片"
/>
</div>
<div className="bottom tran-scale">
<img
src="https://image.xiaomaiketang.com/xm/rmxbJd8fdD.png"
alt="小麦助教团队照片"
/>
</div>
</div>
<div className="right">
<div className="top">
<div className="top-left tran-scale">
<img
src="https://image.xiaomaiketang.com/xm/Sryk6k7mwB.png"
alt="小麦助教团队照片"
/>
</div>
<div className="top-right tran-scale">
<img
src="https://image.xiaomaiketang.com/xm/axyPA5EpkY.png"
alt="小麦助教团队照片"
/>
</div>
</div>
<div className="middle tran-scale">
<img
src="https://image.xiaomaiketang.com/xm/5rHjiWnPGh.png"
alt="小麦助教团队照片"
/>
</div>
<div className="bottom">
<div className="bottom-left tran-scale">
<img
src="https://image.xiaomaiketang.com/xm/hxWNwYB7F6.png"
alt="小麦助教团队照片"
/>
</div>
<div className="bottom-right tran-scale">
<img
src="https://image.xiaomaiketang.com/xm/dkbNb3x2E2.png"
alt="小麦助教团队照片"
/>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<Footer></Footer>
<SiderBar />
</div>
);
}
pages/companyProfile.less deleted 100644 → 0
.company-profile {
.swiper-img {
min-width: 1729px;
height: 626px;
background-image: url(https://image.xiaomaiketang.com/xm/pXNA4ZsXN4.png);
background-repeat: no-repeat;
background-position: 50% 50%;
background-size: contain;
position: relative;
.swiper-img-content {
z-index: 2;
color: #f5f7fa;
width: 1200px;
padding-top: 130px;
text-align: left;
p {
font-size: 50px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: rgba(255, 255, 255, 1);
line-height: 40px;
margin-bottom: 20px;
}
span {
font-size: 20px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(255, 255, 255, 1);
line-height: 40px;
display: inline-block;
width: 411px;
text-align: justify;
}
}
}
.content-module-1 {
padding-bottom: 78px !important;
background-color: #fff;
.module-title {
font-size: 38px;
font-weight: 400;
color: rgba(51, 51, 51, 1);
line-height: 53px;
text-align: center;
margin-bottom: 42px;
}
.content-module-body {
p {
font-size: 20px;
font-family: PingFangSC;
font-weight: 400;
color: rgba(51, 51, 51, 1);
line-height: 40px;
text-indent: 40px;
}
}
.content-module-img {
display: flex;
justify-content: space-between;
.img {
width: 373px;
height: 460px;
background: rgba(255, 255, 255, 1);
box-shadow: 0px 5px 16px 0px rgba(110, 123, 140, 0.1);
border-radius: 5px;
text-align: center;
padding-top: 24px;
position: relative;
.img-tip{
width:269px;
height:162px;
background:rgba(255,255,255,0.7);
box-shadow:0px 5px 16px 0px rgba(110,123,140,0.1);
border-radius:4px;
position: absolute;
left: 50%;
margin-left: -134.5px;
bottom: 25px;
padding: 19px;
span{
font-size:18px;
margin-top: 11px;
font-weight:400;
color:rgba(153,153,153,1);
line-height:25px;
text-shadow:0px 5px 16px rgba(110,123,140,0.1);
}
h2{
font-size:48px;
font-weight:500;
color:rgba(51,51,51,1);
line-height:67px;
text-shadow:0px 5px 16px rgba(110,123,140,0.1);
}
}
img{
width: 318px;
height: 344px;
margin-bottom: 12px;
}
}
.img1{
height:342px;
width: 1200px;
box-shadow: 0px 5px 16px 0px rgba(110, 123, 140, 0.1);
padding: 19px 27px;
position: relative;
.img-tip{
width:526px;
height:86px;
background:rgba(255,255,255,0.7);
position: absolute;
z-index: 11;
font-size:48px;
font-weight:400;
color:rgba(51,51,51,1);
line-height:67px;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
left: 50%;
margin-left: -263px;
bottom: 18px;
}
}
}
}
.content-module-2 {
height: 1178px !important;
padding-top: 0px !important;
.module-title {
font-size: 36px;
font-family: PingFangSC-Regular;
font-weight: 400;
color: rgba(51, 51, 51, 1);
line-height: 50px;
text-align: center;
margin-bottom: 42px;
}
.content-module-body {
.picture-wrap {
height: 970px;
width: 100%;
display: flex;
justify-content: space-between;
.tran-scale {
transition: transform 0.5s ease-in-out;
&:hover {
transform: scale(1.05, 1.05);
}
}
.left {
display: flex;
justify-content: space-between;
flex-direction: column;
.top {
img {
width: 553px;
height: 391px;
}
}
.bottom {
img {
width: 553px;
height: 553px;
}
}
}
.right {
display: flex;
flex-direction: column;
justify-content: space-between;
.top {
display: flex;
justify-content: space-between;
.top-left {
img {
width: 252px;
height: 188px;
}
}
.top-right {
img {
width: 345px;
height: 188px;
}
}
}
.middle {
img {
width: 623px;
height: 391px;
}
}
.bottom {
display: flex;
justify-content: space-between;
.bottom-left {
img {
width: 326px;
height: 339px;
}
}
.bottom-right {
img {
width: 271px;
height: 339px;
}
}
}
}
}
}
}
}
pages/customer-case.jsx deleted 100644 → 0
/*
* @Description:
* @Author: zangsuyun
* @Date: 2020-07-23 13:55:11
* @LastEditors: zhujiapeng
* @LastEditTime: 2021-06-07 14:38:23
* @Copyright: © 2020 杭州杰竞科技有限公司 版权所有
*/
import React from 'react';
import { Carousel, Button } from 'antd';
import lottie from 'lottie-web'
// import Swiper from '../../common/js/swiper.min.js'
// import "../../common/css/swiper.min.css"
// import Swiper from "swiper"
// import "swiper/swiper.less"
import Header from '../components/Header';
import Footer from '../components/Footer';
import SiderBar from '../components/SiderBar';
import "./customerCase.less"
// import $ from 'jquery'
// import FreeTrial from "@/components/FreeTrial";
class CustomerCase extends React.Component {
constructor(props) {
super(props);
this.state = {
activeFlag: 1,
settings: {
variableWidth: true,
arrows: true,
autoplay: true,
speed: 2000,
autoplaySpeed: 5000,
cssEase: 'linear'
},
datalist: [
{
title: '艺萌舞蹈 江苏·徐州',
keyWord: '关键词：课后作业',
content: ' 以前艺萌舞蹈通过微信群布置作业，消息容易被刷屏淹没、提交作业的节点模糊，作业质量有待提升，使用系统后家长对于课后作业的关注度明显提升。',
src: 'https://image.xiaomaiketang.com/xm/E8ZmRtjyA7.png',
url: 'https://mp.weixin.qq.com/s/il9M2wKL15Bf4Ao40fZUoA'
},
{
title: '翼飞教育 江苏·南京',
keyWord: '关键词：数据沉淀 优质服务',
content: ' 2020APC峰会上，小麦助教有幸收获了一份来自翼飞教育的表扬信。作为万人大校，翼飞教育在信息化工具的助力下，校区决策有数可依，运营管理效率大幅提升。',
src: 'https://image.xiaomaiketang.com/xm/dBd8ECMm5G.png',
url: 'https://mp.weixin.qq.com/s/hXVm0pRgEZ1nFLouBW1meQ'
},
{
title: '弘悦教育 山西·大同',
keyWord: '关键词：教学服务 营销引流',
content: ' “每每看到家长们看了成长档案后，感慨孩子的字写得越来越好了，我们真是说不出的开心。”校区负责人范老师笑着说到。',
src: 'https://image.xiaomaiketang.com/xm/m8menarKfh.png',
url: 'https://mp.weixin.qq.com/s/6xtAhR2r8sgpM98rkiP-CQ'
},
{
title: '仁义武道 江西·吉安',
keyWord: '关键词：家长满意度提升',
content: ' 通过微官网、公众号运营等方式，仁义武道在品牌传播和家校互动上做得越来越好，家长满意度和续费率持续提升。',
src: 'https://image.xiaomaiketang.com/xm/PCZ3J7GRN3.png',
url: 'https://mp.weixin.qq.com/s/wcRucmoH49U2IQLGjLK3QA'
},
{
title: '金声飞扬语言艺术中心 河南·信阳',
keyWord: '关键词：续费预警',
content: ' 招生非常重要，同时保生也意义重大。续费预警功能方便老师提前了解学员续费情况，为保生续班活动做准备。',
src: 'https://image.xiaomaiketang.com/xm/CjJaNAHkj4.png',
url: 'https://mp.weixin.qq.com/s/1vCHEU65-dt8uJUdStfOFQ'
},
{
title: '橙子里艺术空间 陕西·西安 ',
keyWord: '关键词：教务管理 成长档案',
content: ' 课前、课中、课后各环节纳入信息化管理，实时记录学员成长点滴，小麦助教让橙子里艺术空间的每一处细节做得更加完善。',
src: 'https://image.xiaomaiketang.com/xm/GDpPcTcfs2.png',
url: 'https://mp.weixin.qq.com/s/6RkqcYr0GHWxwSabh5RMOA'
}
],
list: [
{
title: '比爱诺钢琴 北京市',
keyWord: '关键词：云课堂、OMO',
content: ' 短短两个月，比爱诺钢琴单月线上课次从20多节到230多节，覆盖学员数超过40%，实现了OMO教学模式升级。',
src: 'https://image.xiaomaiketang.com/xm/tpDQxAFQKy.png',
url: 'https://mp.weixin.qq.com/s/ojHdMl0BiOe5HM1qrRVKyw'
},
{
title: '暖色调儿童美学 山东·青岛',
keyWord: '关键词：教务管理',
content: ' 暖色调是一家小而美的工作室，使用小麦助教后大量繁杂的人工统计工作均纳入线上系统管理，大幅度减轻了老师的工作压力。',
src: 'https://image.xiaomaiketang.com/xm/ebCD63ZFPe.png',
url: 'https://mp.weixin.qq.com/s/WOy4wcAHIIOmZ6E20Lay3A'
},
{
title: '爱豆时代艺术学院 福建·福州',
keyWord: '关键词：家校互动、品牌传播',
content: ' 爱豆时代学院目前拥有两大校区，旗下拥有3000名在读学员，通过小麦校讯通、微官网等工具，让家长和学员更直观地了解机构，拉近了家校距离。',
src: 'https://image.xiaomaiketang.com/xm/xKfTY5QidM.png',
url: 'https://mp.weixin.qq.com/s/hVjpjSqEMlaCejI5W_Z2Kw'
},
{
title: '橙果儿少儿美学馆 浙江·嘉兴',
keyWord: '关键词：数据沉淀',
content: ' 校长王老师在创业前就已经是小麦的用户，依托于数据中心，销售、教务、家校、财务全业务环节都有数据沉淀，有效提升校区经营决策效率。',
src: 'https://image.xiaomaiketang.com/xm/xTxfss364D.png',
url: 'https://mp.weixin.qq.com/s/yBPMqXEjkLWgzcTFsForIA'
},
{
title: '智高点教育 山东·临沂',
keyWord: '关键词：教务管理 家校互动',
content: ' 通过小麦助教平台，智高点教育在教师管理、学员管理、家校互动、市场推广等方面的工作效率大大提升，校区的各项工作都更有秩序。',
src: 'https://image.xiaomaiketang.com/xm/wMDNRhtZnG.png',
url: 'https://mp.weixin.qq.com/s/QUEAyYJ0hC77zP6ho2vDOw'
},
{
title: '戏舞巴士 浙江·杭州',
keyWord: '关键词：移动化办公',
content: ' 针对舞蹈课需要多场景办公的性质，小麦助教APP端和微信端有效满足移动化办公需求，机构对于家长端的服务响应更加及时。',
src: 'https://image.xiaomaiketang.com/xm/NJaW4i3XfD.png',
url: 'https://mp.weixin.qq.com/s/lBgCUb9zqknKmY-8v5cYbw'
},
]
}
}
componentWillMount() {
// if (
// navigator.userAgent.match(
// /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i
// )
// ) {
// //pc端访问 跳转至pc页面
// window.location.href = "../wap/cooperationCase.html";
// }
}
componentDidMount() {
var animation = lottie.loadAnimation({
container: document.getElementById('bag'), // Required
path: 'https://image.xiaomaiketang.com/xm/azRYmTyrBR.json', // Required
renderer: 'svg', // Required
loop: false, // Optional
autoplay: true, // Optional
name: "Hello World", // Name for future reference. Optional.
})
// window.WEBTRACING('WebG_customerCase_showEvent_openPage', 'WebG_客户案例_曝光事件_打开页面', { page: 'customerCase' })
}
renderModal = (flag) => {
this.setState({
isShow: flag,
});
};
render() {
const activeFlag = this.state.activeFlag;
const list = this.state.list
const datalist = this.state.datalist
return (
<div style={{ background: '#fff' }}>
<Header active={'customerCase'}></Header>
<div className="customerCase">
<div className="xm-customerCase-content center">
<div className="title">超80000家培训机构都在使用小麦助教</div>
<div className="content">快人一步，实现校区信息化升级</div>
<Button style={{ background: '#383944', color: '#FFFFFF' }} size="large"
onClick={() => {
window.WEBTRACING('WebG_customerCase_banner_clickEvent_clickFreeUse', 'WebG_客户案例_Banner_点击事件_点击免费试用', { page: 'customerCase' })
this.renderModal(true);
}}>免费试用</Button>
</div>
</div>
<div className="content">
<div className="instHopes">
<div className="title">
深度满足机构经营需求，为客户创造更大价值
</div>
<div className="swiper-container">
<div className="swiper-wrapper">
<Carousel style={{ width: 1200 }} slidesToShow={1}
>
<div className="swiper-slide">
<div className="module-products clearfix">
{
list &&
list.map((item, index) => {
return (
<div
className="product" key={index}
>
<img src={item.src} alt="" />
<div className="module-contents">
<p className="product_title">{item.title}</p>
<p className="keyWord">{item.keyWord}</p>
<p className="content">{item.content}</p>
<Button onClick={() => {
const openWindow = window.open('_blank');
openWindow.location = item.url;
}}>
查看案例
</Button>
</div>
</div>
)
})
}
</div>
</div>
<div className="swiper-slide">
<div className="module-products clearfix">
{
datalist &&
datalist.map((item, index) => {
return (
<div
className="product" key={index}
>
<img src={item.src} alt="" />
<div className="module-contents">
<p className="product_title">{item.title}</p>
<p className="keyWord">{item.keyWord}</p>
<p className="content">{item.content}</p>
<Button onClick={() => {
const openWindow = window.open('_blank');
openWindow.location = item.url;
}}>
查看案例
</Button>
</div>
</div>
)
})
}
</div>
</div>
</Carousel>,
</div>
</div>
</div>
<div className="instHope">
<div className="title">
机构寄语
</div>
<div className="swiper-container">
<div className="swiper-all" >
<div className="prev" onClick={() => {
this.refs.welcome.prev()
}}></div>
<div className="next" onClick={() => {
this.refs.welcome.next()
}}></div>
<div className="swiper-wrapper">
<Carousel autoplay autoplaySpeed={7000} style={{ width: 1200 }} slidesToShow={3}
ref="welcome"
beforeChange={(oldIndex, newIndex) => {
if (newIndex === 6) newIndex = -1
this.setState({
activeFlag: newIndex + 1
})
}}>
<div className={activeFlag === 0 ? "swiper-slide on" : "swiper-slide"}>
<div className="item">
<div className="text">
小麦助教——优质的系统平台，服务周到，培训老师耐心专业，是一家值得信赖的企业。希望小麦助教系统可以更加完善，更加全面，同时也预祝小麦可以越走越远！
<img src="https://image.xiaomaiketang.com/xm/c2eW5XFP5y.png" alt="" className="left" />
<img src="https://image.xiaomaiketang.com/xm/QEPmb7d4dS.png" alt="" className="right" />
</div>
<div className="item_bottom">
<div className='item_bottom_left'>
<p>顾校长</p>
<p>佰特机器人</p>
</div>
<div>
<img className='portrait' src="https://image.xiaomaiketang.com/xm/yWtshSjKQK.png" alt="" />
</div>
</div>
</div>
</div>
<div className={activeFlag === 1 ? "swiper-slide on" : "swiper-slide"}>
<div className="item">
<div className="text">
大数据不仅改变了生活，也同样改变了教育产业。小麦对数据的整合在教培行业中展现出了极高的水平，它所提供的便捷性，实用性以及延展性，非常贴合目前的教培市场。希望小麦不断提升，能为教培市场开辟新的视角，带来新的变革。
<img src="https://image.xiaomaiketang.com/xm/c2eW5XFP5y.png" alt="" className="left" />
<img src="https://image.xiaomaiketang.com/xm/QEPmb7d4dS.png" alt="" className="right" />
</div>
<div className="item_bottom">
<div className='item_bottom_left'>
<p>胡校长</p>
<p>艺之韵艺术培训</p>
</div>
<div>
<img className='portrait' src="https://image.xiaomaiketang.com/xm/KPNJQrpKac.png" alt="" />
</div>
</div>
</div>
</div>
<div className={activeFlag === 2 ? "swiper-slide on" : "swiper-slide"}>
<div className="item">
<div className="text">
小麦助教用了一年了，到现在已得心应手，离不开运营老师的帮助。信息化时代，用系统代替人工是必然趋势。小麦系统给我们带来了很多便利：报名管理、消课统计、财务管理、老师管理等等。我最喜欢的是家校互动功能，清楚记录孩子的每一步成长，同时也让家长感觉到我们的用心。希望小麦办得越来越好！
<img src="https://image.xiaomaiketang.com/xm/c2eW5XFP5y.png" alt="" className="left" />
<img src="https://image.xiaomaiketang.com/xm/QEPmb7d4dS.png" alt="" className="right" />
</div>
<div className="item_bottom">
<div className='item_bottom_left'>
<p>小米校长</p>
<p>宁波想象粒集团</p>
</div>
<div>
<img className='portrait' src="https://image.xiaomaiketang.com/xm/xbT2QtCnkA.png" alt="" />
</div>
</div>
</div>
</div>
<div className={activeFlag === 3 ? "swiper-slide on" : "swiper-slide"}>
<div className="item">
<div className="text">
在遇到小麦助教之前，我都用着手记方式登记学员报名和课消等，耗费大量精力还容易出错。庆幸自己遇到小麦助教，只用一部手机，到哪都可以随时工作。我还借助小麦秀给机构增加了几千流量。最让我感动的是小麦助教还提供了感恩母亲节活动，家长看了孩子们的视频都很感动，也让家长对我们机构更认可。为小麦助教疯狂打call！
<img src="https://image.xiaomaiketang.com/xm/c2eW5XFP5y.png" alt="" className="left" />
<img src="https://image.xiaomaiketang.com/xm/QEPmb7d4dS.png" alt="" className="right" />
</div>
<div className="item_bottom">
<div className='item_bottom_left'>
<p>周校长</p>
<p>思明书画私塾</p>
</div>
<div>
<img className='portrait' src="https://image.xiaomaiketang.com/xm/WyR6ZzZDiy.png" alt="" />
</div>
</div>
</div>
</div>
<div className={activeFlag === 4 ? "swiper-slide on" : "swiper-slide"}>
<div className="item">
<div className="text">
最早在老单位工作的时候就用小麦助教，后来自己创立画室，毫不犹豫再次选择了小麦助教。信息化、数字化是大势所趋。依托于小麦助教的数据中心，销售、教务、家校、财务全业务环节都有相应的数据记录和分析，在校区经营决策上发挥了很大的作用，橙果儿顺利完成了数字化管理升级。
<img src="https://image.xiaomaiketang.com/xm/c2eW5XFP5y.png" alt="" className="left" />
<img src="https://image.xiaomaiketang.com/xm/QEPmb7d4dS.png" alt="" className="right" />
</div>
<div className="item_bottom">
<div className='item_bottom_left'>
<p>王校长</p>
<p>橙果儿少儿美学馆</p>
</div>
<div>
<img className='portrait' src="https://image.xiaomaiketang.com/xm/JPENn435S2.png" alt="" />
</div>
</div>
</div>
</div>
<div className={activeFlag === 5 ? "swiper-slide on" : "swiper-slide"}>
<div className="item">
<div className="text">
简单高效是我们选择小麦助教的初衷。有了小麦助教后，智高点的学校管理水平更上一层楼，校区的各项工作都更有秩序。前台忙碌的场景不见了，各项数据有效沉淀下来，和家长之间的互动也越来越好，信息化管理模式受到了老师、学员、家长的一致认可。我相信在小麦助教的助力下，未来校区运转将会更加科学、理性、健康。
<img src="https://image.xiaomaiketang.com/xm/c2eW5XFP5y.png" alt="" className="left" />
<img src="https://image.xiaomaiketang.com/xm/QEPmb7d4dS.png" alt="" className="right" />
</div>
<div className="item_bottom">
<div className='item_bottom_left'>
<p>彭校长</p>
<p>智高点教育</p>
</div>
<div>
<img className='portrait' src="https://image.xiaomaiketang.com/xm/KwQ3xbfnZc.png" alt="" />
</div>
</div>
</div>
</div>
<div className={activeFlag === 6 ? "swiper-slide on" : "swiper-slide"}>
<div className="item">
<div className="text">
在我眼里，橙子里不仅仅是一个画画班，更是有情怀、有温度、带给人美好体验的空间，“注重细节”是橙子里一直以来坚持做的事。从点对点的上课提醒到考勤消课，再到课后作业点评、成长档案，每一处细节都有小麦助教的身影。大数据不仅让我们更好地见证孩子的点滴成长，也记录了我们校区的发展与进步，选择小麦助教，拥抱数据智能未来！
<img src="https://image.xiaomaiketang.com/xm/c2eW5XFP5y.png" alt="" className="left" />
<img src="https://image.xiaomaiketang.com/xm/QEPmb7d4dS.png" alt="" className="right" />
</div>
<div className="item_bottom">
<div className='item_bottom_left'>
<p>李校长</p>
<p>橙子里艺术空间</p>
</div>
<div>
<img className='portrait' src="https://image.xiaomaiketang.com/xm/i5GpBe7z5Z.png" alt="" />
</div>
</div>
</div>
</div>
</Carousel>,
</div>
</div>
</div>
</div>
<div className="inst">
<div className="title">为教育产业持续赋能，与万家机构共同进步</div>
<div className="list">
<img src="https://image.xiaomaiketang.com/xm/EWApYHJSKz.png" alt="" />
</div>
</div>
</div>
{/* {this.state.isShow ? (
<FreeTrial handModalShow={this.renderModal}></FreeTrial>
) : (
""
)} */}
<Footer page="customerCase" isTrial={true}></Footer>
<SiderBar />
</div>
)
}
}
export default CustomerCase;
\ No newline at end of file
pages/customerCase.less deleted 100644 → 0
.customer-case {
height: 100vh;
width: 100%;
position: relative;
background: rgba(48, 52, 62, 1);
.box {
position: absolute;
left: 50%;
margin-left: -55.5vh;
width: 111vh;
top: 5.37vh;
.img {
width: 111vh;
}
}
.data {
position: absolute;
width: 100%;
bottom: 0px;
height: 180px;
background: rgba(255, 255, 255, 0.1175);
padding-top: 1px;
.content {
width: 901px;
margin: 50px auto 0;
overflow: hidden;
.item {
width: 300px;
float: left;
text-align: center;
.num {
text-align: center;
// font-size:46px;
font-family: PingFangSC-Semibold;
font-weight: 600;
color: rgba(255, 255, 255, 1);
line-height: 65px;
span {
font-size: 20px;
font-family: PingFangSC-Medium;
font-weight: 500;
color: rgba(255, 255, 255, 1);
line-height: 28px;
}
.pre-unit,
.number {
text-align: center;
font-size: 46px;
font-family: PingFangSC-Semibold;
font-weight: 600;
color: rgba(255, 255, 255, 1);
line-height: 65px;
}
}
p {
font-size: 16px;
font-family: PingFangSC-Regular;
font-weight: 400;
color: rgba(255, 255, 255, 1);
line-height: 22px;
margin-top: 10px;
}
}
}
}
}
.customerCase {
width: 100%;
height: 720px;
background-image: url(https://image.xiaomaiketang.com/xm/FrZfn72eDp.png);
background-repeat: no-repeat;
background-position: 50% 50%;
position: relative;
display: flex;
align-items: center;
}
.instHope {
position: relative;
.prev:hover {
transform: scale(1.2);
}
.next:hover {
transform: scale(1.2);
}
.prev {
width: 25px;
cursor: pointer;
height: 45px;
position: absolute;
top: 50%;
left: 1%;
background-image: url(https://image.xiaomaiketang.com/xm/tWtf8Hh3e4.png);
background-size: contain;
z-index: 99;
}
.next {
width: 25px;
cursor: pointer;
height: 45px;
margin-left: 50px;
top: 50%;
right: 1%;
position: absolute;
background-image: url(https://image.xiaomaiketang.com/xm/th5m2MZryW.png);
background-size: contain;
z-index: 99;
}
// .swiper-pagination {
// width: 140px;
// height: 8px;
// margin: 0 auto;
// position: static;
// transition: all 3s 3s ;
// .swiper-pagination-bullet {
// width: 25px;
// height: 8px;
// background: rgba(216, 216, 216, 1);
// border-radius: 6px;
// float: left;
// margin-right: 5px;
// &.swiper-pagination-bullet-active {
// background: linear-gradient(
// 90deg,
// rgba(255, 133, 52, 1) 0%,
// rgba(255, 173, 52, 1) 100%
// );
// }
// }
// }
.title {
font-size: 38px;
font-family: PingFangSC-Regular;
font-weight: 400;
color: rgba(51, 51, 51, 1);
line-height: 53px;
text-align: center;
margin: 70px auto;
}
.swiper-container {
width: 1350px;
margin: 0 auto;
// left: 50px;
width: 1300px;
.swiper-all {
width: 1300px;
}
.swiper-wrapper {
margin-left: 50px;
// .ant-carousel {
// .slick-dots {
// bottom: 0;
// li {
// margin: 0 8px;
// button {
// width: 24px;
// height: 8px !important;
// background: rgba(216, 216, 216, 1) !important;
// border-radius: 6px;
// float: left;
// margin-right: 5px;
// }
// &.slick-active{
// button{
// width: 30px;
// background:linear-gradient(90deg,rgba(255,133,52,1) 0%,rgba(255,173,52,1) 100%) !important;
// }
// }
// }
// }
// }
}
.swiper-slide {
width: 380px;
height: 570px;
transition: all 0.3s;
.item {
width: 320px;
transition: all 3s;
margin: 0 auto;
position: relative;
padding-top: 1px;
height: 423px;
margin-top: 70px;
box-shadow: 0px 1px 19px 0px rgba(228, 233, 239, 0.5);
background-color: #fff;
.item_bottom {
display: flex;
justify-content: flex-end;
padding: 30px;
position: absolute;
bottom: 0;
width: 100%;
}
.portrait {
width: 90px;
left: 110px;
}
.item_bottom_left {
text-align: right;
margin: 20px 20px 0px 0px;
p {
color: #666666;
font-size: 16px;
}
}
.text {
position: relative;
width: 216px;
font-size: 13px;
color: rgba(102, 102, 102, 1);
margin: 0 auto;
margin-top: 45px;
line-height: 21px;
.left {
position: absolute;
width: 24px;
left: -35px;
top: -13px;
}
.right {
position: absolute;
width: 24px;
right: -35px;
bottom: -20px;
}
}
// .p1 {
// font-size: 16px;
// color: rgba(51, 51, 51, 1);
// margin-top: 70px;
// text-align: center;
// }
// .p2 {
// font-size: 13px;
// color: rgba(102, 102, 102, 1);
// line-height: 25px;
// text-align: center;
// }
}
&.on {
transform: scale(1.1);
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-webkit-transform-origin: 50% 50%;
-moz-transform-origin: 50% 50%;
transform-origin: 50% 50%;
}
}
}
}
.xm-customerCase-content{
.title{
font-size: 60px;
width: 660px;
height: 168px;
font-weight: 500;
color: #FFFFFF;
line-height: 84px;
margin-bottom: 13px;
}
.content{
height: 42px;
font-size: 30px;
font-weight: 400;
color: #FFFFFF;
line-height: 42px;
margin-bottom: 20px;
}
button{
width: 160px;
height: 50px;
border: 0;
background: #383944;
border-radius: 2px;
font-size: 20px;
font-weight: 400;
color: #FFFFFF;
line-height: 28px;
}
}
.inst {
width: 1201px;
margin: 0 auto;
margin-top: -20px;
.title {
font-size: 38px;
font-family: PingFangSC-Regular;
font-weight: 400;
color: rgba(51, 51, 51, 1);
line-height: 53px;
text-align: center;
margin: 70px auto;
}
.list {
// overflow: hidden;
margin: 60px 0;
img {
width: 1200px;
}
.item {
width: 240px;
float: left;
text-align: center;
text-align: center;
}
}
}
.module-products {
display: flex;
justify-content: center;
flex-wrap: wrap;
.product {
width: 364px;
height: 465px;
background: rgba(250, 252, 253, 1);
padding: 30px 19px 28px 27px;
margin-bottom: 40px;
margin-right: 30px;
transition: transform 0.2s ease-in-out;
img {
width: 111px;
height: 111px;
position: relative;
margin: 0 auto;
margin: 0 0 25px 0;
}
.module-contents {
// font-family: PingFang SC,PingFangSC-Medium;
position: relative;
text-align: left;
height: 270px;
.title {
font-weight: bold;
margin-bottom: 14px;
font-size: 18px;
font-weight: bold;
color: rgba(51, 51, 51, 1);
line-height: 25px;
}
.product_title {
font-size: 18px;
font-weight: 500;
margin-bottom: 6px;
}
.keyWord {
color: #666666;
font-size: 16px;
margin-bottom: 31px;
}
.content {
font-size: 14px;
line-height: 22px;
width: 309px;
font-family: PingFangSC-Regular, PingFang SC;
color: #999999;
}
button{
position: absolute;
bottom: 0px;
}
.ant-btn {
width: 125px;
height: 42px;
background: #FF8534;
color: #FFFFFF;
font-family: PingFangSC-Regular, PingFang SC;
font-size: 16px;
border: none;
}
}
}
}
.instHopes {
.swiper-pagination {
width: 140px;
height: 8px;
margin: 0 auto;
position: static;
transition: all 0.3s 0.5s;
.swiper-pagination-bullet {
width: 25px;
height: 8px;
background: rgba(216, 216, 216, 1);
border-radius: 6px;
float: left;
margin-right: 5px;
&.swiper-pagination-bullet-active {
background: linear-gradient(90deg,
rgba(255, 133, 52, 1) 0%,
rgba(255, 173, 52, 1) 100%);
}
}
}
.title {
font-size: 38px;
font-family: PingFangSC-Regular;
font-weight: 400;
color: rgba(51, 51, 51, 1);
line-height: 53px;
text-align: center;
margin: 70px auto;
}
.swiper-container {
width: 1200px;
margin: 0 auto;
// left: 50px;
width: 1200px;
.swiper-wrapper {
.ant-carousel {
.slick-dots {
bottom: 0;
li {
margin: 0 8px;
button {
width: 24px;
height: 8px !important;
background: rgba(216, 216, 216, 1) !important;
border-radius: 6px;
float: left;
margin-right: 5px;
}
&.slick-active {
button {
width: 30px;
background: linear-gradient(90deg, rgba(255, 133, 52, 1) 0%, rgba(255, 173, 52, 1) 100%) !important;
}
}
}
}
}
}
.swiper-slide {
width: 380px;
// height: 570px;
transition: all 0.3s;
}
}
}
.inst {
width: 1201px;
margin: 0 auto;
margin-top: -20px;
.title {
font-size: 38px;
font-family: PingFangSC-Regular;
font-weight: 400;
color: rgba(51, 51, 51, 1);
line-height: 53px;
text-align: center;
margin: 70px auto;
}
.list {
// overflow: hidden;
margin: 60px 0;
img {
width: 1200px;
}
.item {
width: 240px;
float: left;
text-align: center;
text-align: center;
}
}
}
\ No newline at end of file
pages/honorary-certificate.jsx deleted 100644 → 0
/*
* @Author: zhujiapeng
* @Date: 2021-06-03 17:34:09
* @LastEditors: zhujiapeng
* @LastEditTime: 2021-06-04 14:08:53
* @Description: 荣誉资质界面
* @Copyright: ©2021 杭州杰竞科技有限公司 版权所有
*/
import { honoraryContant } from '../contants/honorary-certificate';
import Header from '../components/Header';
import Footer from '../components/Footer';
import SiderBar from '../components/SiderBar';
import './HonoraryCertificate.less';
export default function HonoraryCertificate() {
return (
<div className='honorary-certificate'>
<Header />
<div className="honorary-certificate-title">
<div className="center" style={{ textAlign: "center" }}>
<p>荣誉资质</p>
</div>
</div>
<div className='content'>
<div className='center'>
<div className='honorary-area'>
{
honoraryContant.map((item) => {
return (
<div className='honorary-list'>
<img src={item.imgUrl} alt={item.desc} title={item.desc} />
<p>{item.desc}</p>
</div>
);
})
}
</div>
</div>
</div>
<div className='footer'>
<Footer isTrial={false} />
<SiderBar />
</div>
</div>
)
}
pages/index.jsx deleted 100644 → 0
/*
* @Author: zhujiapeng
* @Date: 2021-06-02 15:08:14
* @LastEditors: liguokang
* @LastEditTime: 2021-07-14 20:39:57
* @Description: 主页
* @Copyright: ©2021 杭州杰竞科技有限公司 版权所有
*/
import { Button } from 'antd';
import Link from 'next/link';
import Header from '../components/Header';
import Footer from '../components/Footer';
import SiderBar from '../components/SiderBar';
import CarouselArea from '../components/CarouselArea';
import '../styles/globals.less';
import './index.less';
import {
ProductContant,
coreAdvantageContant,
customerNumContant
} from '../contants/home';
export default function Home() {
return (
<div className='home'>
<Header />
{/* <CarouselArea /> */}
<div className='content'>
<div className='operate-solutions'>
<div className='center'>
<div className='big-title'>为教培机构提供全场景运营管理解决方案</div>
<div className='product-area'>
{
ProductContant.map((item) => {
return (
<div
className="product"
onClick={() => {
this.handleToPage("/cloudClass");
}}
>
<div className="icon ykt">
<img src={item.imgUrl} alt={item.desc} title={item.desc} />
</div>
<div className="module-content">
<div className="title">{item.name}</div>
<div className="content">
{item.desc}
</div>
<div className="line"></div>
<Button>{item.buttonName}</Button>
<div className="go">
<img
src="https://image.xiaomaiketang.com/xm/BmKYSyet2Q.png"
alt="右箭头icon"
/>
</div>
</div>
</div>
)
})
}
</div>
</div>
</div>
<div className='core-advantage'>
<div className='center'>
<div className='big-title'>四大核心优势，为校区发展保驾护航</div>
<div className='department'>
{
coreAdvantageContant.map((item) => {
return (
<div className='department-tem'>
<img src={item.imgUrl} alt={item.desc} title={item.desc} />
<em />
<span className='title'>{item.name}</span>
<span className='desc'>{item.desc}</span>
</div>
)
})
}
</div>
</div>
</div>
<div className='customer-present'>
<div className='center'>
<div className='big-title'>用心做产品，赢得客户信赖</div>
<div className='numBox'>
{
customerNumContant.map((item) => {
return (
<div>
<span className='count'>{item.count}万</span>
<span className='company'>{item.company}</span>
<p className='desc'>{item.desc}</p>
</div>
);
})
}
</div>
<div className='cooperative-enterprise'>
<img src='https://image.xiaomaiketang.com/xm/EWApYHJSKz.png' alt='小麦助教合作企业' />
<Link href="/about">
<a className='more-case'>查看更多案例</a>
</Link>
</div>
</div>
</div>
</div>
<div className='footer'>
<Footer isTrial={true} />
<SiderBar />
</div>
</div>
);
}
pages/index.less deleted 100644 → 0
.home {
width: 100%;
overflow: hidden;
// .carouse{
// width: 100%;
// overflow: hidden;
// }
.content {
.big-title {
font-size: 38px;
color: #333;
margin-bottom: 65px;
text-align: center;
}
.operate-solutions {
padding-top: 78px;
box-sizing: border-box;
.product-area {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
.product {
width: 270px;
height: 340px;
background: rgba(250, 252, 253, 1);
padding: 30px 19px 28px 20px;
margin-bottom: 40px;
transition: transform 0.2s ease-in-out;
box-sizing: border-box;
img {
width: 82px;
height: 82px;
}
&:hover {
cursor: pointer;
background: #fff;
box-shadow: 0px 2px 30px 0px rgba(169, 186, 212, 0.2);
transform: scale(1.05, 1.05);
.go {
width: 100% !important;
}
}
.icon {
width: 82px;
height: 82px;
position: relative;
margin: 0 auto;
margin: 0 0 20px 0;
}
.module-content {
font-family: PingFang SC, PingFangSC-Medium;
text-align: left;
.title {
font-weight: bold;
margin-bottom: 14px;
font-size: 18px;
font-weight: bold;
color: rgba(51, 51, 51, 1);
line-height: 25px;
}
.line {
width: 80px;
height: 1px;
background: rgba(231, 231, 231, 1);
margin: 8px 0 10px 0;
}
.content {
font-style: 14px;
line-height: 20px;
height: 40px;
color: #999999;
font-weight: 400;
}
.ant-btn {
background: #f1f5f7;
border: none;
}
.go {
width: 30px;
height: 30px;
background: rgba(255, 133, 52, 1);
margin-top: 20px;
font-size: 20px;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
color: #fff;
line-height: 30px;
cursor: pointer;
&:hover {
width: 100%;
}
img {
width: 7px;
height: 12px;
}
transition: 0.2s;
}
}
}
}
}
.core-advantage {
background-color: #f4f6f9;
padding: 78px 0 34px 0;
box-sizing: border-box;
.department {
display: flex;
.department-tem {
width: 260px;
height: 231px;
margin-right: 53px;
box-sizing: border-box;
position: relative;
display: flex;
justify-content: center;
img {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
em {
display: inline-block;
width: 15px;
height: 3px;
background: #f87f5f;
position: absolute;
top: 120px;
}
.title {
position: absolute;
top: 140px;
color: #333;
font-size: 14px;
}
.desc {
position: absolute;
top: 175px;
color: #999;
font-size: 14px;
display: block;
max-width: 168px;
}
}
}
}
.customer-present {
padding-top: 78px;
box-sizing: border-box;
.numBox {
display: flex;
margin-bottom: 50px;
justify-content: space-around;
color: #333;
.count {
font-size: 72px;
}
.company {
font-size: 24px;
}
.desc {
font-size: 20px;
}
}
.cooperative-enterprise {
position: relative;
img {
width: 100%;
}
.more-case {
display: block;
width: 200px;
height: 36px;
line-height: 36px;
text-align: center;
border: 1px solid #eaeaea;
cursor: pointer;
color: #666;
text-decoration: none;
font-size: 14px;
position: absolute;
left: 50%;
margin: 40px 0 0 -100px;
}
}
}
}
.footer {
// overflow: hidden;
margin-top: 150px;
}
}
\ No newline at end of file
pages/microBrand.less deleted 100644 → 0
.micro-brand{
width: 100%;
height: 540px;
background-image: url(https://image.xiaomaiketang.com/xm/BNWbnDmF3Z.png);
background-repeat: no-repeat;
background-position: 50% 50%;
position: relative;
display: flex;
align-items: center;
.ant-btn{
color: #4F99FF !important;
}
}
.micro-brand-item{
height: 468px;
display: flex;
justify-content: space-between;
align-items: center;
margin: 80px 0 !important;
img{
width: 573px;
height: 100%;
}
.content{
text-align: left;
.title{
font-size:38px;
font-weight:500;
color:rgba(51,51,51,1);
line-height:53px;
margin-bottom: 17px;
}
span{
font-size:28px;
font-weight:400;
color:rgba(102,102,102,1);
line-height:40px;
}
}
}
\ No newline at end of file
pages/mm-chain.jsx deleted 100644 → 0
/*
* @Author: hongxutao
* @Date: 2021-01-27 18:18:02
* @LastEditors: zhujiapeng
* @LastEditTime: 2021-06-07 14:03:43
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
import React from "react";
import { Button } from "antd";
// import FreeTrial from "@/components/FreeTrial";
import Header from '../components/Header';
import Footer from '../components/Footer';
import SiderBar from '../components/SiderBar';
import "./mm-chain.less";
class mmChain extends React.Component {
constructor(props) {
super(props);
this.state = {
isShow: false,
};
}
componentWillMount(){
// if (
// navigator.userAgent.match(
// /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i
// )
// ) {
// //pc端访问 跳转至pc页面
// window.location.href = "../wap.html";
// }
}
componentDidMount() {
// window.WEBTRACING('WebG_product_xmChain_showEvent_openPageWebG_产品_小麦连锁版_曝光事件_打开页面', {page: 'mmChain'})
}
renderModal = (flag) => {
this.setState({
isShow: flag,
});
};
render() {
return (
<div className="cash-main" style={{ background: "#fff" }}>
<Header active={"product"} ></Header>
<div className="mai-Chain">
<div className="xm-head-chain-content center">
<div className="title">连锁品牌全场景数字化解决方案</div>
<div className="content">数据+营销，赋能多校区管理，实现盈利增长</div>
<Button
size="large"
onClick={() => {
window.WEBTRACING('WebG_product_xmChain_banner_clickEvent_clickFreeUseWebG_产品_小麦连锁版_Banner_点击事件_点击免费试用', {page: 'mmChain'})
this.renderModal(true);
}}
>
免费试用
</Button>
</div>
</div>
<div className="center">
<div className="chain-module-item">
<div className="module-title">线下连锁品牌面临的困境</div>
<div className="module-mm-chain clearfix">
<div className="mm-chain-item">
<div className="icon"></div>
<div className="module-content">
<div className="title">分校管理难</div>
<div className="content" style={{color:"#666666"}}>
没有形成明确的各级职责和权限，人员管 <br/> 理分散，分校区各自为战，难以形成合力
</div>
</div>
</div>
<div className="mm-chain-item">
<div className="icon"></div>
<div className="module-content">
<div className="title">经营分析难</div>
<div className="content" style={{color:"#666666"}}>
总校对分校的数据监控弱，日常数据总结 <br/> 分析不到位，校区经营决策无“数”可依
</div>
</div>
</div>
<div className="mm-chain-item">
<div className="icon"></div>
<div className="module-content">
<div className="title">品牌建设难</div>
<div className="content" style={{color:"#666666"}}>
总校与分校品牌宣传口径不统一，未形成 <br/> 体系化的品牌矩阵，品牌感知度弱
</div>
</div>
</div>
</div>
</div>
</div>
<div className="backGray">
<div className="center">
<div className="chain-module-item">
<div className="module-title" style={{paddingTop:80}}>小麦助教连锁版 <br/> 连锁品牌全场景数字化解决</div>
<div className="module-mm-chain clearfix" style={{paddingTop:40}}>
<div className="mm-Empowerment-item">
<div className="module-content">
<img src="https://image.xiaomaiketang.com/xm/TDmBjFjCHJ.png" alt=""/>
<p>管理赋能</p>
<div className="module-content-text">匹配总校原有管理架构，明确各级分校职责权限，灵活设置不同角色，提高校区管理效率</div>
</div>
</div>
<div className="mm-Empowerment-item">
<div className="module-content">
<img src="https://image.xiaomaiketang.com/xm/XZRK2iMiXk.png" alt=""/>
<p>数据赋能</p>
<div className="module-content-text">招生、教务、财务等各类数据尽在掌握，日常经营决策有“数”可依，各级管理更加有序</div>
</div>
</div>
<div className="mm-Empowerment-item">
<div className="module-content">
<img src="https://image.xiaomaiketang.com/xm/Ycnhz2Z6Md.png" alt=""/>
<p>品牌赋能</p>
<div className="module-content-text">配备专属微官网和家长端，自定义品牌信息，构建统一品牌矩阵，让家长成为机构忠粉</div>
</div>
</div>
</div>
</div>
</div>
<div className="center">
<div className="mai-Chain-item-img">
<img src="https://image.xiaomaiketang.com/xm/PwjFPhsPAZ.png" className="module-content-img" alt=""/>
</div>
</div>
<div className="center">
<div className="mai-Chain-item" style={{ height: 445 }}>
<div className="hard-content" >
<div className='title'>系统解决各级组织管理难点</div>
<ul>
<li>
<div className="left-img img1"></div>
<div className="right-text">
<div className="titles">多级组织架构管理</div>
<div className="detail">匹配校区实际管理架构，总校到分校各级权限职责明确，助力机构可持续发展</div>
</div>
</li>
<li>
<div className="left-img img2"></div>
<div className="right-text">
<div className="titles">加盟商/代理商管理</div>
<div className="detail">总校随时随地管控加盟商/代理商的基本经营情况，权限设置灵活高效</div>
</div>
</li>
<li>
<div className="left-img img3"></div>
<div className="right-text">
<div className="titles">跨校区教务管理</div>
<div className="detail">建立规范的跨校区工作运营流程，推动机构服务多样化，扩大学员和家长的选择面</div>
</div>
</li>
</ul>
</div>
<img
src="https://image.xiaomaiketang.com/xm/P3QwXb6AsE.png"
alt=""
/>
</div>
</div>
<div className="center">
<div className="mai-Chain-item" style={{ height: 445 }}>
<img
className="XmShow"
src="https://image.xiaomaiketang.com/xm/xDrJwb67dA.png"
alt=""
/>
<div className="hard-content" >
<div className='title'>逐个击破校区数据管理难点</div>
<ul>
<li>
<div className="left-img img3"></div>
<div className="right-text">
<div className="titles">招生、教务、财务各环节数据监控</div>
<div className="detail">总校运营中心建立数据监控看板，监控各分校招生、教务、财务等运营核心数据</div>
</div>
</li>
<li>
<div className="left-img img4"></div>
<div className="right-text">
<div className="titles">数据标签丰富，精细化运营分析</div>
<div className="detail">通过丰富的数据标签，精准定位用户画像，实现分层运营管理，提高线索转化效率</div>
</div>
</li>
<li>
<div className="left-img img5"></div>
<div className="right-text">
<div className="titles">多终端实时同步，建立机构的“智慧大脑”</div>
<div className="detail">支持电脑端和手机端展示，定期查看数据日报/周报/月报等，经营决策更高效</div>
</div>
</li>
</ul>
</div>
</div>
</div>
<div className="center">
<div className="mai-Chain-item" style={{ height: 445 }}>
<div className="hard-content" >
<div className='title'>精准把脉多级品牌管理难点</div>
<ul>
<li>
<div className="left-img img7"></div>
<div className="right-text">
<div className="titles">统一的品牌矩阵</div>
<div className="detail">总校运营中心统筹管理各校区品牌宣传，机构logo、宣传语、亮点等对外展示统一</div>
</div>
</li>
<li>
<div className="left-img img8"></div>
<div className="right-text">
<div className="titles">鲜明的品牌特色</div>
<div className="detail">配备独立微官网小程序，家长端装修自定义，登录页、系统域名自定义</div>
</div>
</li>
<li>
<div className="left-img img9"></div>
<div className="right-text">
<div className="titles">优质的口碑传播</div>
<div className="detail">嫁接机构官方微信号，优质内容一键分享，让家长和学员成为机构的品牌忠粉</div>
</div>
</li>
</ul>
</div>
<img
src="https://image.xiaomaiketang.com/xm/RcpJ6AKFZH.png"
alt=""
/>
</div>
</div>
</div>
<div className="center">
<div className="chain-module-item">
<div className="module-title" style={{margin:0}}>完善的服务保障体系，助力客户成功</div>
<div className="module-mm-chain clearfix" style={{marginBottom:40}}>
<div className="mm-Empowerment-item">
<div className="module-content">
<img src="https://image.xiaomaiketang.com/xm/hmynhD7MFe.png"style={{height:100}} alt=""/>
<p style={{marginTop:15}}>全渠道售后服务</p>
<div className="module-content-text">
7*13.5h在线人工服务 <br/>
7*13.5h热线人工服务 <br/>
智能系统工单支持 </div>
</div>
</div>
<div className="mm-Empowerment-item">
<div className="module-content">
<img src="https://image.xiaomaiketang.com/xm/GS2Sn3bmwD.png" style={{height:100}} alt=""/>
<p style={{marginTop:15}}>全智能服务支持</p>
<div className="module-content-text">
7*24h机器人自助服务 <br/>
帮助中心，随时查阅 <br/>
新手任务，逐步引导 <br/>
</div>
</div>
</div>
<div className="mm-Empowerment-item">
<div className="module-content">
<img src="https://image.xiaomaiketang.com/xm/dQZ5MM2e2D.png" style={{height:100}} alt=""/>
<p style={{marginTop:15}}>专属运营实施服务</p>
<div className="module-content-text">
2v1专属企业微信服务群 <br/>
三阶段直播培训 <br/>
三阶段视频课培训 <br/>
</div>
</div>
</div>
<div className="mm-Empowerment-item">
<div className="module-content">
<img src="https://image.xiaomaiketang.com/xm/2psZSHCxCj.png" style={{height:100}} alt=""/>
<p style={{marginTop:15}}>客户成功服务</p>
<div className="module-content-text">
1v1资深运营经理服务 <br/>
系统培训结业报告1次 <br/>
系统使用健康诊断报告1次 <br/>
</div>
</div>
</div>
</div>
</div>
</div>
{/* {this.state.isShow ? (
<FreeTrial handModalShow={this.renderModal}></FreeTrial>
) : (
""
)} */}
<Footer page="microBrandWeb" isTrial={true}></Footer>
<SiderBar></SiderBar>
</div>
);
}
}
export default mmChain;
pages/mm-chain.less deleted 100644 → 0
.mai-Chain{
width: 100%;
height: 540px;
background-image: url(https://image.xiaomaiketang.com/xm/wj6TJSrPsf.png);
background-repeat: no-repeat;
background-position: 50% 50%;
position: relative;
display: flex;
align-items: center;
.center{
.module-title{
width: 100%;
text-align: center;
font-size: 38px;
color: #333;
height: 53px;
line-height: 53px;
margin-bottom: 50px;
p{
font-size:24px;
line-height:33px;
font-weight:400;
margin-top: 10px;
}
}
}
}
.backGray{
background: #F4F6F9;
}
.xm-head-chain-content {
.title{
height: 62px;
font-size: 44px;
font-weight: 500;
color: #333333;
}
.content{
margin-top: 2px;
font-size: 20px;
}
button{
margin-top: 48px;
width: 138px;
height: 44px;
background: #333;
border: 0;
border-radius: 2px;
font-size: 16px;
color: #F9C152
}
}
.hard-content{
.title{
font-size: 24px;
font-weight: 500;
margin-left: 15px;
}
ul {
margin-top: 23px;
padding: 0;
li {
position: relative;
z-index: 10;
padding: 20px 40px 15px 15px;
box-sizing: border-box;
display: flex;
justify-content: flex-start;
.left-img {
width: 48px;
height: 48px;
margin-right: 20px;
background-repeat: no-repeat;
background-size: contain;
&.img1 {
background-image: url("https://image.xiaomaiketang.com/xm/etPkfQMwXF.png");
}
&.img2 {
background-image: url("https://image.xiaomaiketang.com/xm/4KKpBBBZrZ.png");
}
&.img3 {
background-image: url("https://image.xiaomaiketang.com/xm/Ci7HXz74hi.png");
}
&.img4 {
background-image: url("https://image.xiaomaiketang.com/xm/jrpycZcRMc.png");
}
&.img5 {
background-image: url("https://image.xiaomaiketang.com/xm/fJC2FHdye3.png");
}
&.img6 {
background-image: url("https://image.xiaomaiketang.com/xm/dfnCicy752.png");
}
&.img7 {
background-image: url("https://image.xiaomaiketang.com/xm/xb27KfFMGy.png");
}
&.img8 {
background-image: url("https://image.xiaomaiketang.com/xm/zDXHFH8Q7w.png");
}
&.img9 {
background-image: url("https://image.xiaomaiketang.com/xm/arwJibAZZs.png");
}
}
.right-text {
.titles {
font-size: 16px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #333333;
line-height: 22px;
margin-bottom: 7px;
}
.detail {
font-size: 12px;
font-weight: 400;
color: rgba(102, 102, 102, 1);
line-height: 17px;
}
}
}
}
}
.chain-module-item{
.module-title{
width: 100%;
text-align: center;
font-size: 38px;
color: #333;
height: 53px;
line-height: 53px;
margin-bottom: 50px;
margin-top: 46px;
p{
font-size:24px;
line-height:33px;
font-weight:400;
}
}
.module-mm-chain{
display: flex;
align-items: center;
justify-content: space-around;
.mm-Empowerment-item{
width: 306px;
height: 208px;
text-align: center;
margin-top: 80px;
img{
width: 100px;
height: 82px;
background-size: 100%;
}
p{
font-weight: 500;
margin-bottom: 7px;
position: relative;
}
.module-content-text{
color:#999;
width: 282px;
height: 40px;
font-size: 14px;
margin: 0 auto;
text-align: center;
p{
text-align: center;
}
}
}
.mm-chain-item{
width: 306px;
height: 208px;
background: #FAFCFD;
border-radius: 4px;
text-align: center;
position: relative;
.module-content{
margin-top: 70px;
.title{
font-size: 18px;
font-weight: 500;
margin-bottom: 15px;
}
}
.icon {
width: 73px;
height: 73px;
position: absolute;
top:0;
left:0;
background-image: url("https://image.xiaomaiketang.com/xm/CGijXE3TWP.png");
background-size: 100%;
}
}
}
}
.mai-Chain-item-img{
margin-top: 50px;
.module-content-img{
width: 1196px;
height: 469px;
background-size: 100%;
}
}
.mai-Chain-item{
height: 468px;
display: flex;
justify-content: space-between;
align-items: center;
margin: 40px 0 !important;
.template{
width: 601px;
height: 386px;
}
img:nth-child(2) {
width: 601px;
height: 380px;
}
.XmShow{
width: 601px;
height: 474px;
}
.content{
text-align: left;
width: 580px;
.title{
font-size:38px;
font-weight:500;
color:rgba(51,51,51,1);
line-height:53px;
margin-bottom: 17px;
}
span{
font-size:28px;
font-weight:400;
color:rgba(102,102,102,1);
line-height:40px;
}
}
}
\ No newline at end of file
pages/mm-checkIn.jsx deleted 100644 → 0
/*
* @Description:
* @Author: zangsuyun
* @Date: 2020-07-23 15:38:50
* @LastEditors: zhujiapeng
* @LastEditTime: 2021-06-07 13:58:08
* @Copyright: © 2020 杭州杰竞科技有限公司 版权所有
*/
import React from 'react';
import {Button} from 'antd';
// import FreeTrial from "@/components/FreeTrial";
import Header from '../components/Header';
import Footer from '../components/Footer';
import SiderBar from '../components/SiderBar';
import './mmCheckIn.less'
class mmCheckIn extends React.Component {
constructor(props) {
super(props);
this.state = {
isShow:false,
}
}
componentWillMount(){
// if (
// navigator.userAgent.match(
// /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i
// )
// ) {
// //pc端访问 跳转至pc页面
// window.location.href = "../wap/pages/RenewalAndReferral.html";
// }
}
componentDidMount() {
this.firstMove()
// window.WEBTRACING('WebG_product_mmCheckIn_showEvent_openPage', 'WebG_产品_麦麦打卡_曝光事件_打开页面', {page: 'mmCheckIn'})
}
firstMove() {
var oImgContainer1 = document.getElementById('img-container1');
var oImgContainer2 = document.getElementById('img-container2');
var oImgContainer3 = document.getElementById('img-container3');
var oImgContainer4 = document.getElementById('img-container4');
var oImgUl1 = oImgContainer1.getElementsByTagName('ul')[0];
var oImgUl2 = oImgContainer2.getElementsByTagName('ul')[0];
var oImgUl3 = oImgContainer3.getElementsByTagName('ul')[0];
var oImgUl4 = oImgContainer4.getElementsByTagName('ul')[0];
var aImgLi1 = oImgUl1.children;
var aImgLi2 = oImgUl2.children;
var aImgLi3 = oImgUl3.children;
var aImgLi4 = oImgUl4.children;
var oTextContainer1 = document.getElementById('text-container1');
var oTextContainer2 = document.getElementById('text-container2');
var oTextContainer3 = document.getElementById('text-container3');
var oTextContainer4 = document.getElementById('text-container4');
var oTextUl1 = oTextContainer1.getElementsByTagName('ul')[0];
var oTextUl2 = oTextContainer2.getElementsByTagName('ul')[0];
var oTextUl3 = oTextContainer3.getElementsByTagName('ul')[0];
var oTextUl4 = oTextContainer4.getElementsByTagName('ul')[0];
var aTextLi1 = oTextUl1.children;
var aTextLi2 = oTextUl2.children;
var aTextLi3 = oTextUl3.children;
var aTextLi4 = oTextUl4.children;
var timer1 = null;
var timer2 = null;
var timer3 = null;
var timer4 = null;
var bgshadow1 = oTextContainer1.children[0];
var bgshadow2 = oTextContainer2.children[0];
var bgshadow3 = oTextContainer3.children[0];
var bgshadow4 = oTextContainer4.children[0];
// // 设置ul的宽度
// oImgUl.offsetWidth = (aImgLi.length + 1) * aImgLi[0].offsetWidth;
// 定位imgUrl的初始位置
var iNow1 = 0;
var iNow2 = 0;
var iNow3 = 0;
var iNow4 = 0;
oImgUl1.style.left = -aImgLi1[0].offsetWidth * iNow1 + 'px';
oImgUl2.style.left = -aImgLi2[0].offsetWidth * iNow2 + 'px';
oImgUl3.style.left = -aImgLi3[0].offsetWidth * iNow3 + 'px';
oImgUl4.style.left = -aImgLi4[0].offsetWidth * iNow4 + 'px';
bgshadow1.style.top = 135 + 'px';
timer1 = setInterval(() => {
iNow1++;
if (iNow1 == 4) {
iNow1 = 0;
}
oImgUl1.style.left = -aImgLi1[0].offsetWidth * iNow1 + 'px';
bgshadow1.style.top = aTextLi1[1].offsetHeight * iNow1 + 135 + 'px';
for (var i = 0; i < aImgLi1.length; i++) {
aImgLi1[i].className = 'fl';
}
aImgLi1[iNow1].className = 'fl on';
}, 3000);
for (let i = 0; i < aTextLi1.length; i++) {
// 当hover时，背景变色,清除定时器
aTextLi1[i].onmouseover = function () {
clearInterval(timer1);
bgshadow1.style.top = bgshadow1.offsetHeight * i + 135 + 'px';
for (let j = 0; j < aImgLi1.length; j++) {
aImgLi1[j].className = 'fl';
}
aImgLi1[i].className = 'fl on';
oImgUl1.style.left = -aImgLi1[0].offsetWidth * i + 'px';
};
}
//当鼠标移出的时候开启定时器让ul自动向前运动
oTextContainer1.onmouseleave = function () {
clearInterval(timer1);
timer1 = setInterval(() => {
iNow1++;
if (iNow1 == 4) {
iNow1 = 0;
}
oImgUl1.style.left = -aImgLi1[0].offsetWidth * iNow1 + 'px';
bgshadow1.style.top = bgshadow1.offsetHeight * iNow1 + 135 + 'px';
for (var i = 0; i < aImgLi1.length; i++) {
aImgLi1[i].className = 'fl';
}
aImgLi1[iNow1].className = 'fl on';
}, 3000)
}
timer2 = setInterval(() => {
iNow2++;
if (iNow2 == 4) {
iNow2 = 0;
}
oImgUl2.style.left = -aImgLi2[0].offsetWidth * iNow2 + 'px';
bgshadow2.style.top = aTextLi2[1].offsetHeight * iNow2 + 135 + 'px';
for (var i = 0; i < aImgLi2.length; i++) {
aImgLi2[i].className = 'fl';
}
aImgLi2[iNow2].className = 'fl on';
}, 3000);
for (let i = 0; i < aTextLi2.length; i++) {
// 当hover时，背景变色,清除定时器
aTextLi2[i].onmouseover = function () {
clearInterval(timer2);
bgshadow2.style.top = bgshadow2.offsetHeight * i + 135 + 'px';
for (let j = 0; j < aImgLi2.length; j++) {
aImgLi2[j].className = 'fl';
}
aImgLi2[i].className = 'fl on';
oImgUl2.style.left = -aImgLi2[0].offsetWidth * i + 'px';
};
}
//当鼠标移出的时候开启定时器让ul自动向前运动
oTextContainer2.onmouseleave = function () {
clearInterval(timer2);
timer2 = setInterval(() => {
iNow2++;
if (iNow2 == 4) {
iNow2 = 0;
}
oImgUl2.style.left = -aImgLi2[0].offsetWidth * iNow2 + 'px';
bgshadow2.style.top = bgshadow2.offsetHeight * iNow2 + 135 + 'px';
for (var i = 0; i < aImgLi2.length; i++) {
aImgLi2[i].className = 'fl';
}
aImgLi2[iNow2].className = 'fl on';
}, 3000)
}
timer3 = setInterval(() => {
iNow3++;
if (iNow3 == 4) {
iNow3 = 0;
}
oImgUl3.style.left = -aImgLi3[0].offsetWidth * iNow3 + 'px';
bgshadow3.style.top = aTextLi3[1].offsetHeight * iNow3 + 135 + 'px';
for (var i = 0; i < aImgLi3.length; i++) {
aImgLi3[i].className = 'fl';
}
aImgLi3[iNow3].className = 'fl on';
}, 3000);
for (let i = 0; i < aTextLi3.length; i++) {
// 当hover时，背景变色,清除定时器
aTextLi3[i].onmouseover = function () {
clearInterval(timer3);
bgshadow3.style.top = bgshadow3.offsetHeight * i + 135 + 'px';
for (let j = 0; j < aImgLi3.length; j++) {
aImgLi3[j].className = 'fl';
}
aImgLi3[i].className = 'fl on';
oImgUl3.style.left = -aImgLi3[0].offsetWidth * i + 'px';
};
}
//当鼠标移出的时候开启定时器让ul自动向前运动
oTextContainer3.onmouseleave = function () {
clearInterval(timer3);
timer3 = setInterval(() => {
iNow3++;
if (iNow3 == 4) {
iNow3 = 0;
}
oImgUl3.style.left = -aImgLi3[0].offsetWidth * iNow3 + 'px';
bgshadow3.style.top = bgshadow3.offsetHeight * iNow3 + 135 + 'px';
for (var i = 0; i < aImgLi3.length; i++) {
aImgLi3[i].className = 'fl';
}
aImgLi3[iNow3].className = 'fl on';
}, 3000)
}
timer4 = setInterval(() => {
iNow4++;
if (iNow4 == 4) {
iNow4 = 0;
}
oImgUl4.style.left = -aImgLi4[0].offsetWidth * iNow4 + 'px';
bgshadow4.style.top = aTextLi4[1].offsetHeight * iNow4 + 135 + 'px';
for (var i = 0; i < aImgLi4.length; i++) {
aImgLi4[i].className = 'fl';
}
aImgLi4[iNow4].className = 'fl on';
}, 3000);
for (let i = 0; i < aTextLi4.length; i++) {
// 当hover时，背景变色,清除定时器
aTextLi4[i].onmouseover = function () {
clearInterval(timer4);
bgshadow4.style.top = bgshadow4.offsetHeight * i + 135 + 'px';
for (let j = 0; j < aImgLi4.length; j++) {
aImgLi4[j].className = 'fl';
}
aImgLi4[i].className = 'fl on';
oImgUl4.style.left = -aImgLi4[0].offsetWidth * i + 'px';
};
}
//当鼠标移出的时候开启定时器让ul自动向前运动
oTextContainer4.onmouseleave = function () {
clearInterval(timer4);
timer4 = setInterval(() => {
iNow4++;
if (iNow4 == 4) {
iNow4 = 0;
}
oImgUl4.style.left = -aImgLi4[0].offsetWidth * iNow4 + 'px';
bgshadow4.style.top = bgshadow4.offsetHeight * iNow4 + 135 + 'px';
for (var i = 0; i < aImgLi4.length; i++) {
aImgLi4[i].className = 'fl';
}
aImgLi4[iNow4].className = 'fl on';
}, 3000)
}
}
renderModal = (flag) => {
this.setState({
isShow: flag,
});
};
render() {
return (
<div className="cash-main" style={{background:'#fff'}}>
<Header active={'product'}></Header>
<div className="mm-check">
<div className="xm-head-content center" style={{ color : '#394655'}}>
<div className="title">麦麦打卡，教培机构督学营销工具</div>
<div className="content">创造教学闭环，提升社群活跃</div>
<Button size="large"
onClick={() => {
window.WEBTRACING('WebG_product_mmCheckIn_banner_clickEvent_clickFreeUse', 'WebG_产品_麦麦打卡_Banner_点击事件_点击免费试用', {page: 'mmCheckIn'})
this.renderModal(true);
}}>免费试用</Button>
</div>
</div>
<div className="content-module"></div>
<div className="content-module content-module-3">
<div className="center">
<div className="module-title">麦麦打卡，高频学习互动带来高频裂变<p>创造高频互动学习场景，丰富的激励机制和分享模式</p> </div>
<div className="module-mm-check clearfix">
<div className="item">
<div className="icon icon1"></div>
<p>互动点赞</p>
</div>
<div className="item">
<div className="icon icon2"></div>
<p>积分奖励</p>
</div>
<div className="item">
<div className="icon icon3"></div>
<p>日签海报</p>
</div>
</div>
<div className="module-mm-check clearfix">
<div className="item">
<div className="icon icon4"></div>
<p>日历打卡</p>
</div>
<div className="item">
<div className="icon icon5"></div>
<p>闯关打卡</p>
</div>
<div className="item">
<div className="icon icon6"></div>
<p>后台数据跟踪</p>
</div>
</div>
</div>
</div>
<div className="content-module content-module-2">
<div className="body-center">
<div className="module-title">
支持多种营销模式，口碑传播更进一步
</div>
<div className="mm-check-content-module-body center" style={{ padding: '0 170px'}}>
<div className="module-img" id="img-container1">
<div className="img-wrap">
<ul className="ul">
<li className="fl on"><img src="https://image.xiaomaiketang.com/xm/7j8tizn8nG.png" alt=""className="img1 picture" /></li>
<li className="fl"><img src="https://image.xiaomaiketang.com/xm/eWJ5nmrR6w.png" alt="" className="img2 on picture" /></li>
<li className="fl"><img src="https://image.xiaomaiketang.com/xm/zTsje6knmz.png" alt="" className="img3 picture" /></li>
<li className="fl"><img src="https://image.xiaomaiketang.com/xm/G3xWQN3ryG.png" alt="" className="img4 picture" /></li>
</ul>
</div>
</div>
<div className="module-text" id="text-container1">
<div className="bg-shadow"></div>
<div className="module-top-content">
<div className="title">个性化教学模式</div>
<span>匹配不同教学场景，机构实现教育闭环</span>
</div>
<ul>
<li>
<div className="left-img img1"></div>
<div className="right-text">
<div className="title">日历打卡</div>
<div className="detail">每日打卡，学生学习习惯养成</div>
</div>
</li>
<li>
<div className="left-img img2"></div>
<div className="right-text">
<div className="title">闯关打卡</div>
<div className="detail">解锁打卡，刺激学员自主学习</div>
</div>
</li>
<li>
<div className="left-img img3"></div>
<div className="right-text">
<div className="title">富文本编辑</div>
<div className="detail">图文并茂设置任务，让打卡更有吸引力</div>
</div>
</li>
<li>
<div className="left-img img4"></div>
<div className="right-text">
<div className="title">一键复制任务</div>
<div className="detail">打卡任务可复制，提升机构管理效率</div>
</div>
</li>
</ul>
</div>
</div>
<div className="mm-check-content-module-body center" style={{ padding: '0 170px'}}>
<div className="module-text" id="text-container2">
<div className="bg-shadow"></div>
<div className="module-top-content">
<div className="title">客情维护模式</div>
<span>创造高频学习，维护师生互动</span>
</div>
<ul>
<li>
<div className="left-img img1"></div>
<div className="right-text">
<div className="title">待完成任务</div>
<div className="detail">首页入口直观，任务可视化</div>
</div>
</li>
<li>
<div className="left-img img2"></div>
<div className="right-text">
<div className="title">查看打卡圈</div>
<div className="detail">任务对应打卡圈，围观详情重学习</div>
</div>
</li>
<li>
<div className="left-img img3"></div>
<div className="right-text">
<div className="title">评论点赞</div>
<div className="detail">双向互动提升用户粘性，让家校互动更有温度更有趣</div>
</div>
</li>
<li>
<div className="left-img img4"></div>
<div className="right-text">
<div className="title">打卡统计</div>
<div className="detail">关联多个学员，同时打卡作业</div>
</div>
</li>
</ul>
</div>
<div className="module-img" id="img-container2">
<div className="img-wrap">
<ul className="ul">
<li className="fl on"><img src="https://image.xiaomaiketang.com/xm/SdsArYThx3.png" alt=""className="img1 picture" /></li>
<li className="fl"><img src="https://image.xiaomaiketang.com/xm/3kYeTPzQyW.png" alt="" className="img2 on picture" /></li>
<li className="fl"><img src="https://image.xiaomaiketang.com/xm/hSZRBaKaBY.png" alt="" className="img3 picture" /></li>
<li className="fl"><img src="https://image.xiaomaiketang.com/xm/mNmdBFSsta.png" alt="" className="img4 picture" /></li>
</ul>
</div>
</div>
</div>
<div className="mm-check-content-module-body center" style={{ padding: '0 170px'}}>
<div className="module-img" id="img-container3">
<div className="img-wrap">
<ul className="ul">
<li className="fl on"><img src="https://image.xiaomaiketang.com/xm/G56mfezeti.png" alt=""className="img1 picture" /></li>
<li className="fl"><img src="https://image.xiaomaiketang.com/xm/ena8QG82CQ.png" alt="" className="img2 on picture" /></li>
<li className="fl"><img src="https://image.xiaomaiketang.com/xm/iRQxZfBmeQ.png" alt="" className="img3 picture" /></li>
<li className="fl"><img src="https://image.xiaomaiketang.com/xm/ZmR78ABeP6.png" alt="" className="img4 picture" /></li>
</ul>
</div>
</div>
<div className="module-text" id="text-container3">
<div className="bg-shadow"></div>
<div className="module-top-content">
<div className="title">课消续费模式</div>
<span>提高学员完课率，实现高客单价</span>
</div>
<ul>
<li>
<div className="left-img img1"></div>
<div className="right-text">
<div className="title">打卡提醒</div>
<div className="detail">为机构布置作业提供抓手，多渠道打卡提醒</div>
</div>
</li>
<li>
<div className="left-img img2"></div>
<div className="right-text">
<div className="title">积分奖励</div>
<div className="detail">小麦粒积分接入，激励学员打卡</div>
</div>
</li>
<li>
<div className="left-img img3"></div>
<div className="right-text">
<div className="title">作业留存</div>
<div className="detail">学生历史打卡留存，记录点滴成长</div>
</div>
</li>
<li>
<div className="left-img img4"></div>
<div className="right-text">
<div className="title">数据追踪</div>
<div className="detail">打卡数据可视化，为机构再添抓手</div>
</div>
</li>
</ul>
</div>
</div>
<div className="mm-check-content-module-body center" style={{ padding: '0 170px'}}>
<div className="module-text" id="text-container4">
<div className="bg-shadow"></div>
<div className="module-top-content">
<div className="title">营销招生模式</div>
<span>朋友圈分享裂变，机构口碑营销沉淀</span>
</div>
<ul>
<li>
<div className="left-img img1"></div>
<div className="right-text">
<div className="title">分享公开打卡</div>
<div className="detail">海报分享公开打卡，支持潜在学员报名</div>
</div>
</li>
<li>
<div className="left-img img2"></div>
<div className="right-text">
<div className="title">管理学员打卡</div>
<div className="detail">机构打卡作业可控化，净化打卡环境</div>
</div>
</li>
<li>
<div className="left-img img3"></div>
<div className="right-text">
<div className="title">日签海报分享</div>
<div className="detail">打卡完成生成日签，引导用户分享</div>
</div>
</li>
<li>
<div className="left-img img4"></div>
<div className="right-text">
<div className="title">优质作业分享</div>
<div className="detail">精选作业分享，增加机构曝光</div>
</div>
</li>
</ul>
</div>
<div className="module-img" id="img-container4">
<div className="img-wrap">
<ul className="ul">
<li className="fl on"><img src="https://image.xiaomaiketang.com/xm/sEHr2AbsDF.png" alt=""className="img1 picture" /></li>
<li className="fl"><img src="https://image.xiaomaiketang.com/xm/7xitjPs7Pz.png" alt="" className="img2 on picture" /></li>
<li className="fl"><img src="https://image.xiaomaiketang.com/xm/k8TGT5xMsE.png" alt="" className="img3 picture" /></li>
<li className="fl"><img src="https://image.xiaomaiketang.com/xm/znjAA63kdP.png" alt="" className="img4 picture" /></li>
</ul>
</div>
</div>
</div>
</div>
</div>
{/* {this.state.isShow ? (
<FreeTrial handModalShow={this.renderModal}></FreeTrial>
) : (
""
)} */}
<Footer page="mmCheckIn" isTrial={true}></Footer>
<SiderBar/>
</div>
)
}
}
export default mmCheckIn;
\ No newline at end of file
pages/mm-poster.jsx deleted 100644 → 0
/*
* @Author: hongxutao
* @Date: 2021-01-27 18:18:02
* @LastEditors: zhujiapeng
* @LastEditTime: 2021-06-07 14:01:33
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
import React from "react";
import { Button } from "antd";
// import FreeTrial from "@/components/FreeTrial";
import Header from '../components/Header';
import Footer from '../components/Footer';
import SiderBar from '../components/SiderBar';
import "./mm-poster.less";
class mmPoster extends React.Component {
constructor(props) {
super(props);
this.state = {
isShow: false,
};
}
componentWillMount(){
// if (
// navigator.userAgent.match(
// /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i
// )
// ) {
// //pc端访问 跳转至pc页面
// window.location.href = "../wap.html";
// }
}
componentDidMount() {
// window.WEBTRACING('WebG_product_mmPoster_showEvent_openPage', 'WebG_产品_麦萌海报_曝光事件_打开页面', {page: 'mmPoster'})
}
renderModal = (flag) => {
this.setState({
isShow: flag,
});
};
render() {
return (
<div className="cash-main" style={{ background: "#fff" }}>
<Header active={"product"}></Header>
<div className="mai-poster">
<div className="xm-head-content center">
<div className="title">麦萌海报，教培机构专属海报设计管家</div>
<div className="content">精选十大主题模版，轻松打造品牌形象</div>
<Button
size="large"
onClick={() => {
window.WEBTRACING('WebG_product_mmPoster_banner_clickEvent_clickFreeUse', ' WebG_产品_麦萌海报_Banner_点击事件_点击免费试用', {page: 'mmPoster'})
this.renderModal(true);
}}
>
免费试用
</Button>
</div>
</div>
<div className="center">
<div className="mai-poster-item" style={{ height: 345 }}>
<img
className="template"
src="https://image.xiaomaiketang.com/xm/GCkFZDQMTf.png"
alt=""
/>
<div className="content" style={{marginLeft:120}}>
<div className="title">海量精美模板供您挑选，满足各类教学场景</div>
<span>适用于招生宣传/通知海报/邀请函/倒计时/<br/>荣誉海报/课程宣传……</span>
</div>
</div>
</div>
<div className="center">
<div className="mai-poster-item" style={{ height: 345 }}>
<div className="content" >
<div className="title">操作便捷易上手，一键修改文字， <br/> 轻松打造品牌形象</div>
<span>只需简单拖拽，3分钟产出精美海报</span>
</div>
<img
src="https://image.xiaomaiketang.com/xm/QN7kkeNizN.png"
alt=""
/>
</div>
</div>
<div className="center">
<div className="mai-poster-item" style={{ height: 345 }}>
<img
className="XmShow"
src="https://image.xiaomaiketang.com/xm/rryTSRJwSw.png"
alt=""
/>
<div className="content" style={{marginLeft:90}}>
<div className="title">关联小麦秀、微官网、麦田表单，招生裂变更高效</div>
<span>营销活动码智能调用，一键传播激活社交圈</span>
</div>
</div>
</div>
{/* {this.state.isShow ? (
<FreeTrial handModalShow={this.renderModal}></FreeTrial>
) : (
""
)} */}
<Footer page="microBrandWeb" isTrial={true}></Footer>
<SiderBar></SiderBar>
</div>
);
}
}
export default mmPoster;
pages/mm-poster.less deleted 100644 → 0
.mai-poster{
width: 100%;
height: 540px;
background-image: url(https://image.xiaomaiketang.com/xm/NmEnTeaJZ2.png);
background-repeat: no-repeat;
background-position: 50% 50%;
position: relative;
display: flex;
align-items: center;
.ant-btn{
color: #FF8A1D !important;
}
}
.mai-poster-item{
height: 468px;
display: flex;
justify-content: space-between;
align-items: center;
margin: 80px 0 !important;
.template{
width: 565px;
height: 368px;
}
img:nth-child(2) {
width: 565px;
height: 412px;
}
.XmShow{
width: 585px;
height: 356px;
}
.content{
text-align: left;
width: 580px;
.title{
font-size:38px;
font-weight:500;
color:rgba(51,51,51,1);
line-height:53px;
margin-bottom: 17px;
}
span{
font-size:28px;
font-weight:400;
color:rgba(102,102,102,1);
line-height:40px;
}
}
}
\ No newline at end of file
pages/mmCheckIn.less deleted 100644 → 0
.mm-check {
width: 100%;
height: 540px;
background-image: url(https://image.xiaomaiketang.com/xm/fxXtrhCdnR.png);
background-repeat: no-repeat;
background-position: 50% 50%;
position: relative;
display: flex;
align-items: center;
}
.module-mm-check {
display: flex;
justify-content: space-between;
.item {
width: 120px;
height: 140px;
box-sizing: border-box;
margin: 0px;
text-align: center;
margin-top: 40px;
p{
font-size:20px;
font-weight:400;
color:rgba(51,51,51,1);
line-height:28px;
margin-bottom: 50px;
}
&:nth-child(1) {
margin-top: 60px;
}
&:nth-child(2) {
margin-top: 60px;
}
&:nth-child(3) {
margin-top: 60px;
}
.icon {
width: 100px;
height: 100px;
position: relative;
margin: 0 auto;
margin-bottom: 11px;
&.icon1 {
background-image: url("https://image.xiaomaiketang.com/xm/QSfMmtKfXk.png");
background-size: contain;
}
&.icon2 {
background-image: url("https://image.xiaomaiketang.com/xm/iBj2ZRiKRh.png");
background-size: contain;
}
&.icon3 {
background-image: url("https://image.xiaomaiketang.com/xm/pNCZTNkK2M.png");
background-size: contain;
}
&.icon4 {
background-image: url("https://image.xiaomaiketang.com/xm/3sCGJwNZFk.png");
background-size: contain;
}
&.icon5 {
background-image: url("https://image.xiaomaiketang.com/xm/QcaXrsdj5C.png");
background-size: contain;
}
&.icon6 {
background-image: url("https://image.xiaomaiketang.com/xm/nhnrFBQwRp.png");
background-size: contain;
}
}
}
}
.mm-check-content-module-body {
display: flex;
justify-content: space-between;
.module-img {
width: 322px;
height: 640px;
background-image: url(https://image.xiaomaiketang.com/xm/6GSxeFPZwe.png);
background-size: 102% 101%;
background-repeat: no-repeat;
padding: 52px 16px 108px 26px;
box-sizing: border-box;
overflow: hidden;
position: relative;
margin-bottom: 87px;
.img-wrap {
width: 290px;
height: 516px;
overflow: hidden;
ul {
width: 2023px;
height: 516px;
overflow: hidden;
position: relative;
padding-left: 0px;
li {
width: 289px;
opacity: 0;
&.on{
transition: opacity 0.5s;
opacity: 1;
}
.picture {
width: 279px;
height: 506px;
}
}
}
}
}
.web-img {
box-shadow: 0 0 30px #eaeff6;
}
.module-text {
position: relative;
overflow: hidden;
.module-top-content{
color:rgba(51,51,51,1);
margin-top: 59px;
.title{
font-size:24px;
font-weight:500;
line-height:33px;
}
span{
font-size:16px;
font-weight:400;
line-height:22px;
}
}
.bg-shadow{
width: 100%;
height: 111px;
background-color: #fff;
// opacity: 0.1;
position: absolute;
top:135px;
transition: top 0.2s;
}
.bg-shadow2{
width: 100%;
height: 111px;
background-color: #fff;
// opacity: 0.1;
position: absolute;
top:135px;
transition: top 0.2s;
}
ul {
margin-top: 23px;
padding: 0;
li {
position: relative;
z-index: 10;
padding: 31px 53px 32px 25px;
box-sizing: border-box;
display: flex;
justify-content: flex-start;
&.on {
background-color: rgba(244, 246, 249, 1);
}
.left-img {
width: 48px;
height: 48px;
margin-right: 20px;
background-repeat: no-repeat;
background-size: contain;
&.img1 {
background-image: url("https://image.xiaomaiketang.com/xm/rbi6dPW8xZ.png");
}
&.img2 {
background-image: url("https://image.xiaomaiketang.com/xm/YnWhp3fCQY.png");
}
&.img3 {
background-image: url("https://image.xiaomaiketang.com/xm/zB7dSye2JQ.png");
}
&.img4 {
background-image: url("https://image.xiaomaiketang.com/xm/tRMncCGFW5.png");
}
}
.right-text {
.title {
font-size: 16px;
font-weight: 400;
color: rgba(51, 51, 51, 1);
line-height: 22px;
margin-bottom: 7px;
}
.detail {
font-size: 12px;
font-weight: 400;
color: rgba(102, 102, 102, 1);
line-height: 17px;
}
}
}
}
&#text-container2 {
ul {
li {
&.on {
background-color: #fff;
}
.left-img {
width: 48px;
height: 48px;
margin-right: 20px;
background-repeat: no-repeat;
background-size: contain;
&.img1 {
background-image: url("https://image.xiaomaiketang.com/xm/wKB8iEK3S3.png");
}
&.img2 {
background-image: url("https://image.xiaomaiketang.com/xm/676JnCaPPZ.png");
}
&.img3 {
background-image: url("https://image.xiaomaiketang.com/xm/mpC2pTDB4a.png");
}
&.img4 {
background-image: url("https://image.xiaomaiketang.com/xm/iGJCesY4dw.png");
}
}
}
}
}
&#text-container3 {
ul {
.left-img {
width: 48px;
height: 48px;
margin-right: 20px;
background-repeat: no-repeat;
background-size: contain;
&.img1 {
background-image: url("https://image.xiaomaiketang.com/xm/abKDQh3TcS.png");
}
&.img2 {
background-image: url("https://image.xiaomaiketang.com/xm/cT4JBAk6AH.png");
}
&.img3 {
background-image: url("https://image.xiaomaiketang.com/xm/f3NA2Bxskt.png");
}
&.img4 {
background-image: url("https://image.xiaomaiketang.com/xm/GMhbs5Xbwf.png");
}
}
}
}
&#text-container4 {
ul {
.left-img {
width: 48px;
height: 48px;
margin-right: 20px;
background-repeat: no-repeat;
background-size: contain;
&.img1 {
background-image: url("https://image.xiaomaiketang.com/xm/tc72zMAMRi.png");
}
&.img2 {
background-image: url("https://image.xiaomaiketang.com/xm/jPWAdNX56C.png");
}
&.img3 {
background-image: url("https://image.xiaomaiketang.com/xm/MxcabfCEJ6.png");
}
&.img4 {
background-image: url("https://image.xiaomaiketang.com/xm/GYQraztebN.png");
}
}
}
}
}
}
\ No newline at end of file
pages/new-dynamic.jsx deleted 100644 → 0
/*
* @Author: zhujiapeng
* @Date: 2021-06-04 15:09:14
* @LastEditors: liguokang
* @LastEditTime: 2021-07-14 20:40:16
* @Description: 新闻动态页面
* @Copyright: ©2021 杭州杰竞科技有限公司 版权所有
*/
import { useState, useEffect } from 'react';
import Header from '../components/Header';
import Footer from '../components/Footer';
import SiderBar from '../components/SiderBar';
import moment from 'moment';
import { Pagination } from 'antd';
// import NewsAPI from "../data-source/news/news-apis";
import axios from 'axios';
import './newsDynamic.less';
export default function NewsDynamic() {
const [list, setList] = useState([]); // 新闻列表
const [total, setTotal] = useState(0);
const [query, setQuery] = useState({
current: 1,
size: 10
});
useEffect(() => {
getList();
}, []);
// 获取新闻列表
function getList() {
const params = {
...query,
};
axios.post('https://heimdall.xiaomai5.com/workbench/anon/website/fetchPublishedNews', params).then((res) => {
const { data: { result } } = res;
const { records, total } = result;
setList(records);
setTotal(total);
});
}
return (
<div className="" style={{ background: "#fff" }}>
<Header active={'aboutUs'}></Header>
<div className="news-dynamic">
<div className="center">
<p>新闻动态</p>
</div>
</div>
<div id="news" className="center">
{list &&
list.map((item, index) => {
return (
<div className="news-list" key={index} onClick={() => {
this.props.history.push({
pathname: '/newsDetail',
state: {
item
}
})
}}>
<div className="img">
<img src={item.coverUrl} alt="" />
</div>
<div className="content">
<h1>{item.title}</h1>
<div className="item-content"> {item.summary}</div>
<span className="item-source">来源： {item.source} </span>
<span className="item-time"> {moment(Number(item.publishTime)).format("YYYY-MM-DD HH:mm")} </span>
</div>
</div>
);
})}
<Pagination
// style={{ textAlign: 'right' }}
current={query.current}
pageSize={query.size}
// onChange={this.getEffectActivity}
total={total} />
</div>
<Footer></Footer>
<SiderBar />
</div>
)
}
pages/newsDynamic.less deleted 100644 → 0
.news-dynamic {
width: 100%;
height: 266px;
background-image: url(https://image.xiaomaiketang.com/xm/mjNCxXt8HJ.png);
background-repeat: no-repeat;
position: relative;
background-position: top;
background-size: cover;
margin-bottom: 80px;
p {
font-size: 38px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(255, 255, 255, 1);
line-height: 53px;
position: absolute;
left: 50%;
top: 100px;
margin-left: -76px;
}
}
.news-list {
height: 280px;
margin: 40px auto;
position: relative;
border-bottom: 1px solid #e8e8e8;
cursor: pointer;
&:last-child {
border-bottom: none;
}
img {
width: 320px;
height: 240px;
object-fit: cover;
}
.content,
.img {
display: inline-block;
}
.content {
width: 860px;
height: 240px;
position: absolute;
margin-left: 20px;
font-size: 16px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(102, 102, 102, 1);
.item-source{
position: absolute;
bottom: 0;
}
.item-time{
position: absolute;
bottom: 0;
right: 0;
}
h1 {
font-size: 22px;
font-weight: 500;
color: rgba(51, 51, 51, 1);
line-height: 40px;
margin-bottom: 10px;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
}
p {
line-height: 22px;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
}
span {
line-height: 22px;
margin-top: 87px;
}
.item-content{
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
}
}
}
pages/wheat-school.jsx → pages/wheat-school/index.jsx
......@@ -2,14 +2,14 @@
* @Description:
* @Author: zangsuyun
* @Date: 2020-07-23 13:38:22
* @LastEditors: zhujiapeng
* @LastEditTime: 2021-06-07 14:35:17
* @LastEditors: liguokang
* @LastEditTime: 2021-07-15 10:15:28
* @Copyright: © 2020 杭州杰竞科技有限公司 版权所有
*/
import React from "react";
import { Carousel, Modal } from "antd";
import Header from '../components/Header';
import Header from '../../components/Header';
import "./wheatSchool.less";
class WheatSchool extends React.Component {
......
pages/wheat-system.jsx deleted 100644 → 0
/*
* @Author: zhujiapeng
* @Date: 2021-06-04 17:29:38
* @LastEditors: liguokang
* @LastEditTime: 2021-07-14 20:40:26
* @Description: 招商加盟-小麦助教系统
* @Copyright: ©2021 杭州杰竞科技有限公司 版权所有
*/
import Header from '../components/Header';
import './WheatSystem.less';
export default function WheatSystem() {
return (
<div className='wheat-system'>
<Header active={"joinIn"}></Header>
<div className="banner">
<div className="text">
<p>小麦助教</p>
<p>诚招全国合伙人</p>
<p className="subTitle">共享万亿级教育培训行业市场红利</p>
<div className='button'
onClick={() => {
// window.WEBTRACING('WebG_merchantsJoin_xmErp_banner_clickEvent_clickApply', 'WebG_招商加盟_小麦助教系统_Banner_点击事件_点击立即申请', {
// page: 'wheatSystem'
// })
// this.renderModal(true);
}}>立即申请</div>
</div>
</div>
<div className="tab">
<div className="tab-1 tab-margin">
<p className="title">四大核心优势，圆您创业梦想</p>
<ul>
<li>
<img src="https://image.xiaomaiketang.com/xm/kKbKdtdPAt.png" alt="" />
<div>
<p>超高返点</p>
<p>利润清晰可见</p>
</div>
</li>
<li>
<img src="https://image.xiaomaiketang.com/xm/JwNSeTNYyc.png" alt="" />
<div>
<p>超低加盟门槛</p>
<p>助您轻松创业</p>
</div>
</li>
<li>
<img src="https://image.xiaomaiketang.com/xm/hi3rBhed6c.png" alt="" />
<div>
<p>多方位项目支持</p>
<p>解您后顾之忧</p>
</div>
</li>
<li>
<img src="https://image.xiaomaiketang.com/xm/GNP4M2R4SM.png" alt="" />
<div>
<p>高速成长行业</p>
<p>无限市场空间</p>
</div>
</li>
</ul>
</div>
<div className="tab-2 tab-margin">
<p className="title">产业体量</p>
<ul>
<li>
<img src="https://image.xiaomaiketang.com/xm/fWPHps8ph2.png" alt="" />
<p>100万+</p>
<p>教培机构数</p>
</li>
<li>
<img src="https://image.xiaomaiketang.com/xm/QXWapiamPR.png" alt="" />
<p>30000亿</p>
<p>市场体量</p>
</li>
<li>
<img src="https://image.xiaomaiketang.com/xm/x6CBmazp7t.png" alt="" />
<p>400万</p>
<p>从业人员</p>
</li>
<li>
<img src="https://image.xiaomaiketang.com/xm/Kcfp4jfERt.png" alt="" />
<p>30%</p>
<p>行业年增速</p>
</li>
</ul>
</div>
<div className="tab-3 tab-margin">
<p className="title">小麦助教，懂教育的移动互联网SaaS管理软件</p>
<ul>
<li>
<div className="tab3-background"></div>
<div className="tab3-fontsie">
<p>95%</p>
覆盖线下教育<br />
培训机构95%以上<br />
真实场景
</div>
</li>
<li>
<div className="tab3-background"></div>
<div className="tab3-fontsie">
<p>67%</p>
提升67%<br />
客户满意度和续签率
</div>
</li>
<li>
<div className="tab3-background"></div>
<div className="tab3-fontsie">
<p>60%</p>
节约机构60%<br />
运营管理时间
</div>
</li>
<li>
<div className="tab3-background"></div>
<div className="tab3-fontsie">
<p>60000+</p>
服务教育机构<br />
60000+家
</div>
</li>
<li>
<div className="tab3-background"></div>
<div className="tab3-fontsie">
<p>30+</p>
服务超过30种<br />
教培行业品类
</div>
</li>
</ul>
</div>
<div className="tab-4 tab-margin">
<p className="title">八大支持助您创业无忧</p>
<ul>
<li>
<div className="show-way">
<img src="https://image.xiaomaiketang.com/xm/frdEY8rKEY.png" alt="" />
<span>品牌支持</span>
</div>
<div className="introduce">
<h4>品牌支持</h4>
<div>
为渠道合伙人提供品牌授权资质证书、授权牌匾、名片模板、易拉宝模板、宣传册模板等销售物料的企业形象标识品牌背书。
</div>
</div>
</li>
<li>
<div className="show-way">
<img src="https://image.xiaomaiketang.com/xm/nKpTdhQ62m.png" alt="" />
<span>培训支持</span>
</div>
<div className="introduce">
<h4>培训支持</h4>
<p>
1. 为渠道合伙人提供线上线下相结合的行业、产品、销售等专业培训；
</p>
<p>
2. 定期组织渠道合伙人到杭州总部举行封闭式集训。
</p>
</div>
</li>
<li>
<div className="show-way">
<img src="https://image.xiaomaiketang.com/xm/GKn6MGf5MG.png" alt="" />
<span>销售支持</span>
</div>
<div className="introduce">
<h4>销售支持</h4>
<p>
1. 提供最新全套销售资料；
</p>
<p>
2. 协助重要客户陪访，远程协助演示；
</p>
<p>
3. 渠道经理定期到当地对重要客户进行走访培训。
</p>
</div>
</li>
<li>
<div className="show-way">
<img src="https://image.xiaomaiketang.com/xm/RHK6x5aEzY.png" alt="" />
<span>运营支持</span>
</div>
<div className="introduce">
<h4>运营支持</h4>
<p>
1. 总部全程提供签约机构的线上售后 服务;
</p>
<p>
2. 每季度协助渠道合伙人进行一次线 下服务培训。
</p>
</div>
</li>
<li>
<div className="show-way">
<img src="https://image.xiaomaiketang.com/xm/JQMM3mMycX.png" alt="" />
<span>市场支持</span>
</div>
<div className="introduce">
<h4>市场支持</h4>
<div>
配合渠道合伙人所辖市场的线上、线 下营销和品牌宣传/广告支持，并输 出统一营销政策和市场激励政策，当 地政府/行业等资源协助对接。
</div>
</div>
</li>
<li>
<div className="show-way">
<img src="https://image.xiaomaiketang.com/xm/dsj6hdnMFA.png" alt="" />
<span>活动支持</span>
</div>
<div className="introduce">
<h4>活动支持</h4>
<div>
为渠道合伙人在当地举办区域性营销活动提供讲师、物料、课件、会议流程辅导等支持。
</div>
</div>
</li>
<li>
<div className="show-way">
<img src="https://image.xiaomaiketang.com/xm/wY4TnFMkAa.png" alt="" />
<span>工具支持</span>
</div>
<div className="introduce">
<h4>工具支持</h4>
<div>
提供小麦独立开发的crm客户管理系 统，供渠道合伙人进行客户管理。
</div>
</div>
</li>
<li>
<div className="show-way">
<img src="https://image.xiaomaiketang.com/xm/X8cEsWcmSM.png" alt="" />
<span>物料支持</span>
</div>
<div className="introduce">
<h4>物料支持</h4>
<p>
1. 提供全套销售资料（含产品手册、宣传单页、报价单等）；
</p>
<p>
2. 提供举办活动所需物料。
</p>
</div>
</li>
</ul>
</div>
<div className="tab-5 tab-margin">
<p className="title">渠道合伙人资质</p>
<ul>
<li>
<img src="https://image.xiaomaiketang.com/xm/M3Tt6HjxYj.png" alt="" />
<p>
正规注册公司，独立法人 <br />
有志于从事教育培训行业
</p>
</li>
<li>
<img src="https://image.xiaomaiketang.com/xm/fCzeMhXtEj.png" alt="" />
<p>
有三人（含）以上 <br />
销售团队
</p>
</li>
<li>
<img src="https://image.xiaomaiketang.com/xm/rK7yaz6MmJ.png" alt="" />
<p>
教育/互联网/软件/广告 <br />
/传媒相关行业优先
</p>
<p className="supplement">
在当地有教培机构资源者(非强制)
</p>
</li>
<li>
<img src="https://image.xiaomaiketang.com/xm/rjNrHnMstc.png" alt="" />
<p>
认可小麦价值观 <br />
公司无不良经营历史
</p>
</li>
</ul>
</div>
<div className="tab-6">
<div className="step-pic">
<h4>渠道合伙人加盟流程</h4>
<ul>
<li className="step">
<img src="https://image.xiaomaiketang.com/xm/ZAGNfcE4mH.png" alt="" />
<span>加盟咨询</span>
</li>
<li className="direct">
<img src="https://image.xiaomaiketang.com/xm/CeSZc5T6Y4.png" alt="" />
</li>
<li className="step">
<img src="https://image.xiaomaiketang.com/xm/jxnsnXCpzJ.png" alt="" />
<span>双向考察</span>
</li>
<li className="direct">
<img src="https://image.xiaomaiketang.com/xm/CeSZc5T6Y4.png" alt="" />
</li>
<li className="step">
<img src="https://image.xiaomaiketang.com/xm/ePPwzfnRyK.png" alt="" />
<span>资质审核</span>
</li>
<li className="direct">
<img src="https://image.xiaomaiketang.com/xm/CeSZc5T6Y4.png" alt="" />
</li>
<li className="step">
<img src="https://image.xiaomaiketang.com/xm/QSKBZfPasc.png" alt="" />
<span>签约合作</span>
</li>
</ul>
<div className='button'
onClick={() => {
window.WEBTRACING('WebG_merchantsJoin_xmErp_foot_clickEvent_clickApply', 'WebG_招商加盟_小麦助教系统_页面底部_点击事件_点击立即申请', { page: 'wheatSystem' })
this.renderModal(true);
}}>立即申请合伙人</div>
</div>
<div className="footer">
<div className="contact">
<p>加盟热线：400-6677-456 135-8873-2892</p>
<p>咨询邮箱：yaobin@xiaomai5.com</p>
<p>公司地址 : 杭州市西湖区古墩路598号同人广场A座3楼</p>
</div>
<div className="QR-code">
<img src="https://image.xiaomaiketang.com/xm/y5N26sycRQ.png" alt="" />
<p>扫码咨询</p>
</div>
</div>
</div>
</div>
</div>
);
}
pages/xm-erp.jsx deleted 100644 → 0
/*
* @Description:
* @Author: zangsuyun
* @Date: 2020-07-23 15:36:28
* @LastEditors: zhujiapeng
* @LastEditTime: 2021-06-07 14:16:50
* @Copyright: © 2020 杭州杰竞科技有限公司 版权所有
*/
import React from 'react';
import { Button, Tabs } from 'antd';
import Header from '../components/Header';
import Footer from '../components/Footer';
import SiderBar from '../components/SiderBar';
// import FreeTrial from "@/components/FreeTrial";
import './xmErp.less'
const { TabPane } = Tabs;
class xmErp extends React.Component {
constructor(props) {
super(props);
this.state = {
activeKey: '1',
leftFlag: false,
rightFlag: true,
isShow: false,
}
}
componentWillMount() {
// if (
// navigator.userAgent.match(
// /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i
// )
// ) {
// //pc端访问 跳转至pc页面
// window.location.href = "../wap/pages/ManagementAndData.html";
// }
}
componentDidMount() {
// window.WEBTRACING('WebG_product_xmErp_showEvent_openPage', 'WebG_产品_小麦助教_曝光事件_打开页面', { page: 'xmErp' })
}
handTabClick(e) {
if (e >= 2 && e <= 6) {
this.setState({
rightFlag: true,
leftFlag: true
})
}
else if (e === '1') {
this.setState({
leftFlag: false,
rightFlag: true
})
} else if (e === '7') {
this.setState({
rightFlag: false,
leftFlag: true
})
}
this.setState({
activeKey: e,
})
}
renderModal = (flag) => {
this.setState({
isShow: flag,
});
};
handLeftClick() {
if (parseInt(this.state.activeKey) === 1) return
if (parseInt(this.state.activeKey) === 2) {
this.setState({
activeKey: (parseInt(this.state.activeKey) - 1).toString(),
leftFlag: false
})
return
}
this.setState({
activeKey: (parseInt(this.state.activeKey) - 1).toString(),
rightFlag: true
})
}
handRightClick() {
if (parseInt(this.state.activeKey) === 7) return
if (parseInt(this.state.activeKey) === 6) {
this.setState({
activeKey: (parseInt(this.state.activeKey) + 1).toString(),
rightFlag: false
})
return
}
this.setState({
activeKey: (parseInt(this.state.activeKey) + 1).toString(),
leftFlag: true
})
}
render() {
const { leftFlag, rightFlag } = this.state
return (
<div className="cash-main" style={{ background: '#fff' }}>
<Header active={'product'}></Header>
<div className="xm-erp">
<div className="xm-head-content center">
<div className="title">小麦助教校务管理系统</div>
<div className="content">精细管理&精准营销，多方位提升办学效率</div>
<Button size="large"
onClick={() => {
window.WEBTRACING('WebG_product_xmErp_banner_clickEvent_clickFreeUse', 'WebG_产品_小麦助教_Banner_点击事件_点击免费试用', { page: 'xmErp' })
this.renderModal(true);
}}
>
免费试用
</Button>
</div>
</div>
<div className="content-module content-module-3" style={{ background: '#fff' }}>
<div className="module-title">教培机构运营管理全场景解决方案 <p>技术驱动，打通线上线下各类真实教学场景</p></div>
<div className="xm-erp-img center">
<div className="center-img"></div>
<img src="https://image.xiaomaiketang.com/xm/HeQiF4aTTB.png" alt="" className="erp-img1" />
<img src="https://image.xiaomaiketang.com/xm/zSBXYkjZhM.png" alt="" className="erp-img2" />
<img src="https://image.xiaomaiketang.com/xm/F8DCFPwrFp.png" alt="" className="erp-img3" />
<img src="https://image.xiaomaiketang.com/xm/sdZp6hXyjB.png" alt="" className="erp-img4" />
<img src="https://image.xiaomaiketang.com/xm/FRkHMZffFd.png" alt="" className="erp-img5" />
<img src="https://image.xiaomaiketang.com/xm/QXxJFC73YT.png" alt="" className="erp-img6" />
<img src="https://image.xiaomaiketang.com/xm/6SNf2CpPe7.png" alt="" className="erp-img7" />
</div>
</div>
<div className="content-module-3">
<div className="tabs center">
<div className={leftFlag ? "left-switch left-active" : "left-switch"} onClick={() => this.handLeftClick()}></div>
<div className={rightFlag ? "right-switch right-active" : 'right-switch'} onClick={() => this.handRightClick()}></div>
<Tabs style={{ color: '#ff8534' }} activeKey={this.state.activeKey} animated onTabClick={(e) => this.handTabClick(e)} size='large' tabBarGutter={62} tabBarStyle={{}} type="card">
<TabPane tab="招生营销" key="1" style={{ color: '#ff8534' }}>
<div className="tab-content" style={{ color: '#000' }} >
<img src="https://image.xiaomaiketang.com/xm/hJEzEZaaYi.png" alt="" />
<div className="tab-detail">
<p>招生营销</p>
<span>线索获取、分配、跟进、转化全链路解决方案</span>
<div className="detail-content">
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/27fWcEe32Z.png" alt="" />
<div className="right-content fr">
<p>小麦秀</p>
<div className="span">数百套火爆活动方案，玩转线上招生</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/xXbJGTFYDA.png" alt="" />
<div className="right-content fr">
<p>转介绍</p>
<div className="span">让转介绍像打招呼一样简单</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/CheX555apc.png" alt="" />
<div className="right-content fr">
<p>优惠券</p>
<div className="span">优惠刺激家长报名，机构增收源源不断</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/DZFnrzTjmy.png" alt="" />
<div className="right-content fr">
<p>在线商城</p>
<div className="span">家长自助下单缴费，打造机构专属商城</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/wFWKyB3xtX.png" alt="" />
<div className="right-content fr">
<p>CRM</p>
<div className="span">销售全流程管理，提升线索流转效率</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/EJRfmcbr37.png" alt="" />
<div className="right-content fr">
<p>试听管理</p>
<div className="span">可视化试听记录，高效锁定意向学员</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/wGnXD2HZzT.png" alt="" />
<div className="right-content fr">
<p>麦田表单</p>
<div className="span">高效收集活动信息，助力地推招生</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/dMNMffr5sA.png" alt="" />
<div className="right-content fr">
<p>麦萌海报</p>
<div className="span">在线设计精美海报，操作便捷易上手</div>
</div>
</div>
</div>
</div>
</div>
</TabPane>
<TabPane tab="教务管理" key="2">
<div className="tab-content" style={{ color: '#000' }}>
<img src="https://image.xiaomaiketang.com/xm/KfWcrxcwTk.png" alt="" />
<div className="tab-detail">
<p>教务管理</p>
<span>校区管理信息化，全面提升办学效率</span>
<div className="detail-content">
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/GDiktmpTcx.png" alt="" />
<div className="right-content fr">
<p>班级管理</p>
<div className="span">多维度班级信息展示，快速了解班级排课、学员情况、上课信息</div>
</div>
</div>
<div className="item fl" style={{ marginBottom: 17 }}>
<img src="https://image.xiaomaiketang.com/xm/pS8wkjDSnw.png" alt="" />
<div className="right-content fr">
<p>智能排课</p>
<div className="span">可视化线上排课，提高教务排课效率</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/pTM4MFA2pe.png" alt="" />
<div className="right-content fr">
<p>选班调班</p>
<div className="span">班级学员灵活安排，调整信息实时同步</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/tAMp4hf7yX.png" alt="" />
<div className="right-content fr">
<p>请假补课</p>
<div className="span">支持线上请假补课，有效管理学员考勤</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/PGCAGkHbN2.png" alt="" />
<div className="right-content fr">
<p>线上约课</p>
<div className="span">学员自主预约上课，时间安排更加灵活</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/EnRe4QpQ2d.png" alt="" />
<div className="right-content fr">
<p>员工管理</p>
<div className="span">维护员工信息档案，管理员工访问权限</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/kS66YG4Ram.png" alt="" />
<div className="right-content fr">
<p>人脸考勤</p>
<div className="span">智能人脸识别考勤，学员消课秒速完成</div>
</div>
</div>
</div>
</div>
</div>
</TabPane>
<TabPane tab="经营分析" key="3">
<div className="tab-content" style={{ color: '#000' }}>
<img src="https://image.xiaomaiketang.com/xm/y2hiYnZ8zi.png" alt="" />
<div className="tab-detail">
<p>经营分析</p>
<span>核心数据深度分析，高效决策避免风险</span>
<div className="detail-content">
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/ZH7C2KZD8a.png" alt="" />
<div className="right-content fr">
<p>小麦收银</p>
<div className="span">超低费率，多码合一，结算安全</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/HiJG7yQPTY.png" alt="" />
<div className="right-content fr">
<p>财务对账</p>
<div className="span">订单明细清晰记录，实现对账高效便捷</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/JWX6mFYZf4.png" alt="" />
<div className="right-content fr">
<p>进销存管理</p>
<div className="span">物品进出库自动记录，库存补给及时预警</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/EWQxjB7tmD.png" alt="" />
<div className="right-content fr">
<p>数据中心</p>
<div className="span">销售、教务、家校、财务全业务环节数据支撑，经营情况尽在掌握</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/Xnr43jw8fa.png" alt="" />
<div className="right-content fr">
<p>工资结算</p>
<div className="span">不同梯度绩效体系，一键结算高效准确</div>
</div>
</div>
</div>
</div>
</div>
</TabPane>
<TabPane tab="家校服务" key="4">
<div className="tab-content" style={{ color: '#000' }}>
<img src="https://image.xiaomaiketang.com/xm/WmyzWWkia7.png" alt="" />
<div className="tab-detail">
<p>家校服务</p>
<span>一对一家校服务，提升家长满意度，铸口碑促续费</span>
<div className="detail-content">
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/zwESQ3z7bK.png" alt="" />
<div className="right-content fr">
<p>电子相册</p>
<div className="span">学员成长点滴一键生成相册，助力机构续费</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/in5b7HMwes.png" alt="" />
<div className="right-content fr">
<p>课后作业</p>
<div className="span">支持文字、图片、视频多种形式，在线收发/批改作业</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/jspJEzNQEt.png" alt="" />
<div className="right-content fr">
<p>师生互评</p>
<div className="span">评价学员赢取口碑，评价老师获得反馈</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/kWHFfibkn4.png" alt="" />
<div className="right-content fr">
<p>成长档案</p>
<div className="span">学员档案随时查看，直观感受孩子成长</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/4KNs8nQ7CR.png" alt="" />
<div className="right-content fr">
<p>成绩单</p>
<div className="span">记录学员成绩变化，效果外化好帮手</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/NQpki3xjXj.png" alt="" />
<div className="right-content fr">
<p>消息通知</p>
<div className="span">重要通知实时推送，传达情况有效监控</div>
</div>
</div>
</div>
</div>
</div>
</TabPane>
<TabPane tab="在线教学" key="5">
<div className="tab-content" style={{ color: '#000' }}>
<img src="https://image.xiaomaiketang.com/xm/nAYrbEcpcj.png" alt="" />
<div className="tab-detail">
<p>在线教学</p>
<span>支持多种班型，覆盖专业线上教学场景</span>
<div className="detail-content">
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/cRxj3zmHdd.png" alt="" />
<div className="right-content fr">
<p>大班直播</p>
<div className="span">1000人以内同时上课，支持二维码报名课程</div>
</div>
</div>
<div className="item fl" style={{ marginBottom: 17 }}>
<img src="https://image.xiaomaiketang.com/xm/SaXfEPtYrK.png" alt="" />
<div className="right-content fr">
<p>互动班课</p>
<div className="span">大/小班互动课，支持1-12名学生连麦上台</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/2TeBpSFsnF.png" alt="" />
<div className="right-content fr">
<p>资料云盘</p>
<div className="span">云端存储教学教研资料，支持作业、直播间随时调用</div>
</div>
</div>
</div>
</div>
</div>
</TabPane>
<TabPane tab="课后督学" key="6">
<div className="tab-content" style={{ color: '#000' }}>
<img src="https://image.xiaomaiketang.com/xm/jrhippHCKb.png" alt="" />
<div className="tab-detail">
<p>课后督学</p>
<span>多场景督学互动工具，让学习更有温度、更有效</span>
<div className="detail-content">
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/Bs82ZNEr24.png" alt="" />
<div className="right-content fr">
<p>闯关打卡</p>
<div className="span">游戏化闯关打卡模式，激发学员打卡动力</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/yKcXr4Y7m6.png" alt="" />
<div className="right-content fr">
<p>日历打卡</p>
<div className="span">每日打卡模式，培养学员学习习惯</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/rwZEPGMbME.png" alt="" />
<div className="right-content fr">
<p>日签</p>
<div className="span">一键打卡生成日签，激活家长朋友圈</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/QdYHcYTQyi.png" alt="" />
<div className="right-content fr">
<p>积分</p>
<div className="span">收获积分兑换礼物，每天努力更有意义</div>
</div>
</div>
</div>
</div>
</div>
</TabPane>
<TabPane tab="品牌传播" key="7">
<div className="tab-content" style={{ color: '#000' }}>
<img src="https://image.xiaomaiketang.com/xm/irY8GnKRaG.png" alt="" />
<div className="tab-detail">
<p>品牌传播</p>
<span>打造品牌质感，引导口碑传播</span>
<div className="detail-content">
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/smew7ZyjJi.png" alt="" />
<div className="right-content fr">
<p>微官网</p>
<div className="span">能宣传能招生的综合性营销平台，帮助机构实现品牌营销</div>
</div>
</div>
<div className="item fl" style={{ marginBottom: 17 }}>
<img src="https://image.xiaomaiketang.com/xm/2KeycN7TJX.png" alt="" />
<div className="right-content fr">
<p>内容分享</p>
<div className="span">家长信任背书，引起潜客兴趣</div>
</div>
</div>
<div className="item fl">
<img src="https://image.xiaomaiketang.com/xm/GbTNrbhsKC.png" alt="" />
<div className="right-content fr">
<p>专属家长端</p>
<div className="span">嫁接机构公众号，家校互动更高效</div>
</div>
</div>
</div>
</div>
</div>
</TabPane>
</Tabs>
</div>
</div>
{/* {this.state.isShow ? (
<FreeTrial handModalShow={this.renderModal}></FreeTrial>
) : (
""
)} */}
<Footer page='xmErp' isTrial={true}></Footer>
<SiderBar />
</div>
)
}
}
export default xmErp;
\ No newline at end of file
pages/xm-school-info.jsx deleted 100644 → 0
/*
* @Description:
* @Author: zangsuyun
* @Date: 2020-07-23 15:51:45
* @LastEditors: zhujiapeng
* @LastEditTime: 2021-06-07 14:11:48
* @Copyright: © 2020 杭州杰竞科技有限公司 版权所有
*/
import React from "react";
import { Button } from "antd";
// import FreeTrial from "@/components/FreeTrial";
import Header from '../components/Header';
import Footer from '../components/Footer';
import SiderBar from '../components/SiderBar';
import "./xmSchoolInfo.less";
class xmSchoolInfo extends React.Component {
constructor(props) {
super(props);
this.state = {
isShow: false,
};
}
componentWillMount(){
// if (
// navigator.userAgent.match(
// /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i
// )
// ) {
// //pc端访问 跳转至pc页面
// window.location.href = "../wap.html";
// }
}
componentDidMount() {
this.firstMove();
this.secondMove();
// window.WEBTRACING('WebG_product_xmSchoolInfo_showEvent_openPage', 'WebG_产品_小麦校讯通_曝光事件_打开页面', {page: 'xmSchoolInfo'})
}
renderModal = (flag) => {
this.setState({
isShow: flag,
});
};
firstMove() {
var oImgContainer = document.getElementById("img-container1");
var oImgUl = oImgContainer.getElementsByTagName("ul")[0];
var aImgLi = oImgUl.children;
var oTextContainer = document.getElementById("text-container1");
var oTextUl = oTextContainer.getElementsByTagName("ul")[0];
var aTextLi = oTextUl.children;
var timer = null;
var bgshadow = oTextContainer.children[0];
// // 设置ul的宽度
// oImgUl.offsetWidth = (aImgLi.length + 1) * aImgLi[0].offsetWidth;
// 定位imgUrl的初始位置
var iNow = 0;
console.log(aTextLi[1].offsetHeight);
oImgUl.style.left = -aImgLi[0].offsetWidth * iNow + "px";
bgshadow.style.top = 110 + "px";
timer = setInterval(() => {
iNow++;
if (iNow == 4) {
iNow = 0;
}
oImgUl.style.left = -aImgLi[0].offsetWidth * iNow + "px";
bgshadow.style.top = aTextLi[1].offsetHeight * iNow + 110 + "px";
for (var i = 0; i < aImgLi.length; i++) {
aImgLi[i].className = "fl";
}
aImgLi[iNow].className = "fl on";
}, 3000);
for (let i = 0; i < aTextLi.length; i++) {
// 当hover时，背景变色,清除定时器
aTextLi[i].onmouseover = function () {
clearInterval(timer);
bgshadow.style.top = bgshadow.offsetHeight * i + 110 + "px";
for (let j = 0; j < aImgLi.length; j++) {
aImgLi[j].className = "fl";
}
aImgLi[i].className = "fl on";
oImgUl.style.left = -aImgLi[0].offsetWidth * i + "px";
};
}
//当鼠标移出的时候开启定时器让ul自动向前运动
oTextContainer.onmouseleave = function () {
clearInterval(timer);
timer = setInterval(() => {
iNow++;
if (iNow == 4) {
iNow = 0;
}
oImgUl.style.left = -aImgLi[0].offsetWidth * iNow + "px";
bgshadow.style.top = bgshadow.offsetHeight * iNow + 110 + "px";
for (var i = 0; i < aImgLi.length; i++) {
aImgLi[i].className = "fl";
}
aImgLi[iNow].className = "fl on";
}, 3000);
};
}
secondMove() {
var oImgContainer = document.getElementById("img-container2");
var oImgUl = oImgContainer.getElementsByTagName("ul")[0];
var aImgLi = oImgUl.children;
var oTextContainer = document.getElementById("text-container2");
var oTextUl = oTextContainer.getElementsByTagName("ul")[0];
var aTextLi = oTextUl.children;
var timer = null;
var bgshadow = oTextContainer.children[0];
// // 设置ul的宽度
// oImgUl.offsetWidth = (aImgLi.length + 1) * aImgLi[0].offsetWidth;
// 定位imgUrl的初始位置
var iNow = 0;
console.log(aTextLi[1].offsetHeight);
oImgUl.style.left = -aImgLi[0].offsetWidth * iNow + "px";
bgshadow.style.top = 110 + "px";
timer = setInterval(() => {
iNow++;
if (iNow == 4) {
iNow = 0;
}
oImgUl.style.left = -aImgLi[0].offsetWidth * iNow + "px";
bgshadow.style.top = aTextLi[1].offsetHeight * iNow + 110 + "px";
for (var i = 0; i < aImgLi.length; i++) {
aImgLi[i].className = "fl";
}
aImgLi[iNow].className = "fl on";
}, 3000);
for (let i = 0; i < aTextLi.length; i++) {
// 当hover时，背景变色,清除定时器
aTextLi[i].onmouseover = function () {
clearInterval(timer);
bgshadow.style.top = bgshadow.offsetHeight * i + 110 + "px";
for (let j = 0; j < aImgLi.length; j++) {
aImgLi[j].className = "fl";
}
aImgLi[i].className = "fl on";
oImgUl.style.left = -aImgLi[0].offsetWidth * i + "px";
};
}
//当鼠标移出的时候开启定时器让ul自动向前运动
oTextContainer.onmouseleave = function () {
clearInterval(timer);
timer = setInterval(() => {
iNow++;
if (iNow == 4) {
iNow = 0;
}
oImgUl.style.left = -aImgLi[0].offsetWidth * iNow + "px";
bgshadow.style.top = bgshadow.offsetHeight * iNow + 110 + "px";
for (var i = 0; i < aImgLi.length; i++) {
aImgLi[i].className = "fl";
}
aImgLi[iNow].className = "fl on";
}, 3000);
};
}
render() {
return (
<div className="" style={{ background: "#fff" }}>
<Header active={"product"}></Header>
<div className="xm-school-info">
<div className="xm-head-content center">
<div className="title">小麦校讯通，一对一家校服务</div>
<div className="content">持续提升家长满意度，铸口碑促续费</div>
<Button
size="large"
onClick={() => {
window.WEBTRACING('WebG_product_xmSchoolInfo_banner_clickEvent_clickFreeUse', ' WebG_产品_小麦校讯通_Banner_点击事件_点击免费试用', {page: 'xmSchoolInfo'})
this.renderModal(true);
}}
>
免费试用
</Button>
</div>
</div>
<div className="content-module content-module-2">
<div className="body-center">
<div className="module-title">家校实时互联，服务有温度</div>
<div
className="xm-schoolinfo-content-module-body center"
style={{ padding: "0 170px" }}
>
<div className="module-img" id="img-container1">
<div className="img-wrap">
<ul className="ul">
<li className="fl on">
<img
src="https://image.xiaomaiketang.com/xm/bc7WDW6hbp.png"
alt=""
className="img1 picture"
/>
</li>
<li className="fl">
<img
src="https://image.xiaomaiketang.com/xm/E4xiJNzSmK.png"
alt=""
className="img2 on picture"
/>
</li>
<li className="fl">
<img
src="https://image.xiaomaiketang.com/xm/EYSjMR2Gpw.png"
alt=""
className="img3 picture"
/>
</li>
<li className="fl">
<img
src="https://image.xiaomaiketang.com/xm/4PeJWRkPex.png"
alt=""
className="img4 picture"
/>
</li>
</ul>
</div>
</div>
<div className="module-text" id="text-container1">
<div className="bg-shadow"></div>
<ul>
<li>
<div className="left-img img1"></div>
<div className="right-text">
<div className="title">机构专属家长端</div>
<div className="detail">
专属家长端，服务1对1，提示机构品牌力
</div>
</div>
</li>
<li>
<div className="left-img img2"></div>
<div className="right-text">
<div className="title">学员考勤通知</div>
<div className="detail">
上课、签到通知实时达，贴心服务获认可
</div>
</div>
</li>
<li>
<div className="left-img img3"></div>
<div className="right-text">
<div className="title">重要通知确认传达</div>
<div className="detail">
重要通知接受确认，保障家长知晓机构安排
</div>
</div>
</li>
<li>
<div className="left-img img4"></div>
<div className="right-text">
<div className="title">家长请假在线操作</div>
<div className="detail">
家长在线请假，老师实时知悉，传达更方便
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
<div className="content-module content-module-2">
<div className="body-center">
<div className="module-title">学员成长全程记录，服务效果外化</div>
<div
className="xm-schoolinfo-content-module-body center"
style={{ padding: "0 170px" }}
>
<div className="module-text" id="text-container2">
<div className="bg-shadow2"></div>
<ul>
<li>
<div className="left-img img1"></div>
<div className="right-text">
<div className="title">课后点评</div>
<div className="detail">
记录学员课堂成长，支持文字/图片/语音/视频形式
</div>
</div>
</li>
<li>
<div className="left-img img2"></div>
<div className="right-text">
<div className="title">作业布置</div>
<div className="detail">
课后作业线上布置/批改，点评打分同步操作
</div>
</div>
</li>
<li>
<div className="left-img img3"></div>
<div className="right-text">
<div className="title">学员档案</div>
<div className="detail">
学员成长用心记录，学员档案随时查看
</div>
</div>
</li>
<li>
<div className="left-img img4"></div>
<div className="right-text">
<div className="title">师生互评</div>
<div className="detail">
评价学员赢取口碑，评价老师获得反馈
</div>
</div>
</li>
</ul>
</div>
<div className="module-img" id="img-container2">
<div className="img-wrap">
<ul className="ul">
<li className="fl on">
<img
src="https://image.xiaomaiketang.com/xm/sMNMd2e8HM.png"
alt=""
className="img1 picture"
/>
</li>
<li className="fl">
<img
src="https://image.xiaomaiketang.com/xm/Sds8Yjrkcc.png"
alt=""
className="img2 on picture"
/>
</li>
<li className="fl">
<img
src="https://image.xiaomaiketang.com/xm/Hke38nBBNZ.png"
alt=""
className="img3 picture"
/>
</li>
<li className="fl">
<img
src="https://image.xiaomaiketang.com/xm/Tyd7Aj5GBQ.png"
alt=""
className="img4 picture"
/>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
{/* {this.state.isShow ? (
<FreeTrial handModalShow={this.renderModal}></FreeTrial>
) : (
""
)} */}
<Footer page="xmSchoolInfo" isTrial={true}></Footer>
<SiderBar />
</div>
);
}
}
export default xmSchoolInfo;
pages/xm-show.jsx deleted 100644 → 0
/*
* @Author: zhujiapeng
* @Date: 2021-06-07 13:45:47
* @LastEditors: zhujiapeng
* @LastEditTime: 2021-06-07 13:53:23
* @Description: 小麦秀
* @Copyright: ©2021 杭州杰竞科技有限公司 版权所有
*/
import React from "react";
import { Button } from "antd";
// import FreeTrial from "@/components/FreeTrial";
import Header from '../components/Header';
import Footer from '../components/Footer';
import SiderBar from '../components/SiderBar';
import "./xmShow.less";
class xmShow extends React.Component {
constructor(props) {
super(props);
this.state = {
isAdd : false,
isShow:false,
};
}
// componentWillMount(){
// if (
// navigator.userAgent.match(
// /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i
// )
// ) {
// //pc端访问 跳转至pc页面
// window.location.href = "../wap/pages/EnrollmentAndMarketing.html";
// }
// }
componentDidMount() {
this.firstMove()
this.secondMove()
window.addEventListener("scroll", this.handleScroll);
// window.WEBTRACING('WebG_product_xmShow_showEvent_openPage', 'WebG_产品_小麦秀_曝光事件_打开页面', {page: 'xmShow'})
}
//定义handleScroll事件函数
handleScroll = (e) => {
if (this.state.isAdd) {
return;
}
if (window.pageYOffset >= 1500) {
this.setState({
isAdd:true
},()=>{
this.runNum(this.refs.student,1700,1000)
this.runNum1(this.refs.exposure,2.5,100)
})
}
};
runNum1(dom,max,time){
const step = 1
const _time = time ;
let num = 0;
dom.innerHTML=num;
var intv = setInterval(function () {
num += step;
if (num > max) {
num = max;
clearInterval(intv)
}
dom.innerHTML=num;
}, _time)
}
runNum(dom,max,time){
const step = parseInt(max / 100);
const _time = time / 100;
let num = 0;
dom.innerHTML=num;
var intv = setInterval(function () {
num += step;
if (num > max) {
num = max;
clearInterval(intv)
}
dom.innerHTML=num;
}, _time)
}
firstMove() {
var oImgContainer = document.getElementById('img-container');
var oImgUl = oImgContainer.getElementsByTagName('ul')[0];
var aImgLi = oImgUl.children;
var oTextContainer = document.getElementById('text-container');
var oTextUl = oTextContainer.getElementsByTagName('ul')[0];
var aTextLi = oTextUl.children;
var timer = null;
var bgshadow = oTextContainer.children[0];
// // 设置ul的宽度
// oImgUl.offsetWidth = (aImgLi.length + 1) * aImgLi[0].offsetWidth;
// 定位imgUrl的初始位置
var iNow = 0;
oImgUl.style.left = -aImgLi[0].offsetWidth * iNow + 'px';
bgshadow.style.top = 50 + 'px';
timer = setInterval(() => {
iNow++;
if (iNow == 5) {
iNow = 0;
}
oImgUl.style.left = -aImgLi[0].offsetWidth * iNow + 'px';
bgshadow.style.top = aTextLi[1].offsetHeight * iNow + 50 + 'px';
for (var i = 0; i < aImgLi.length; i++) {
aImgLi[i].className = 'fl';
}
aImgLi[iNow].className = 'fl on';
}, 3000);
for (let i = 0; i < aTextLi.length; i++) {
// 当hover时，背景变色,清除定时器
aTextLi[i].onmouseover = function () {
clearInterval(timer);
bgshadow.style.top = bgshadow.offsetHeight * i + 50 + 'px';
for (let j = 0; j < aImgLi.length; j++) {
aImgLi[j].className = 'fl';
}
aImgLi[i].className = 'fl on';
oImgUl.style.left = -aImgLi[0].offsetWidth * i + 'px';
};
}
//当鼠标移出的时候开启定时器让ul自动向前运动
oTextContainer.onmouseleave = function () {
clearInterval(timer);
timer = setInterval(() => {
iNow++;
if (iNow == 5) {
iNow = 0;
}
oImgUl.style.left = -aImgLi[0].offsetWidth * iNow + 'px';
bgshadow.style.top = bgshadow.offsetHeight * iNow + 50 + 'px';
for (var i = 0; i < aImgLi.length; i++) {
aImgLi[i].className = 'fl';
}
aImgLi[iNow].className = 'fl on';
}, 3000)
}
}
secondMove() {
var oImgContainer = document.getElementById('img-container2');
var oImgUl = oImgContainer.getElementsByTagName('ul')[0];
var aImgLi = oImgUl.children;
var oTextContainer = document.getElementById('text-container2');
var oTextUl = oTextContainer.getElementsByTagName('ul')[0];
var aTextLi = oTextUl.children;
var timer = null;
var bgshadow = oTextContainer.children[0];
// // 设置ul的宽度
// oImgUl.offsetWidth = (aImgLi.length + 1) * aImgLi[0].offsetWidth;
// 定位imgUrl的初始位置
var iNow = 0;
oImgUl.style.left = -aImgLi[0].offsetWidth * iNow + 'px';
bgshadow.style.top = 190 + 'px';
timer = setInterval(() => {
iNow++;
if (iNow == 2) {
iNow = 0;
}
oImgUl.style.left = -aImgLi[0].offsetWidth * iNow + 'px';
bgshadow.style.top = aTextLi[1].offsetHeight * iNow + 190 + 'px';
for (var i = 0; i < aImgLi.length; i++) {
aImgLi[i].className = 'fl';
}
aImgLi[iNow].className = 'fl on';
}, 3000);
for (let i = 0; i < aTextLi.length; i++) {
// 当hover时，背景变色,清除定时器
aTextLi[i].onmouseover = function () {
clearInterval(timer);
bgshadow.style.top = bgshadow.offsetHeight * i + 190 + 'px';
for (let j = 0; j < aImgLi.length; j++) {
aImgLi[j].className = 'fl';
}
aImgLi[i].className = 'fl on';
oImgUl.style.left = -aImgLi[0].offsetWidth * i + 'px';
};
}
//当鼠标移出的时候开启定时器让ul自动向前运动
oTextContainer.onmouseleave = function () {
clearInterval(timer);
timer = setInterval(() => {
iNow++;
if (iNow == 2) {
iNow = 0;
}
oImgUl.style.left = -aImgLi[0].offsetWidth * iNow + 'px';
bgshadow.style.top = bgshadow.offsetHeight * iNow + 190 + 'px';
for (var i = 0; i < aImgLi.length; i++) {
aImgLi[i].className = 'fl';
}
aImgLi[iNow].className = 'fl on';
}, 3000)
}
}
renderModal = (flag) => {
this.setState({
isShow: flag,
});
};
render() {
return (
<div className="" style={{ background: "#fff" }}>
<Header active={"product"}></Header>
<div className="xm-show">
<div className="xm-head-content center">
<div className="title">小麦秀，教培机构招生营销利器</div>
<div className="content">已助力机构招到超350万学员</div>
<Button size="large"
onClick={() => {
window.WEBTRACING('WebG_product_xmShow_banner_clickEvent_clickFreeUse', 'WebG_产品_小麦助教_Banner_点击事件_点击免费试用', {page: 'xmShow'})
this.renderModal(true);
}}>免费试用</Button>
</div>
</div>
<div className="content-module content-module-3" style={{ backgroundColor:'#fff'}}>
<div className="center">
<div className="module-item">
<div className="module-title">各类营销活动<br/>满足多种场景，持续招生获客</div>
</div>
<div className="show-content-module-body center" style={{width:872}}>
<div className="module-img" id="img-container">
<div className="img-wrap">
<ul>
<li className="fl on"><img src="https://image.xiaomaiketang.com/xm/aJaeM4HbTa.png" alt="砍价活动" className="img1 on picture" /></li>
<li className="fl"><img src="https://image.xiaomaiketang.com/xm/zF4HMitKwD.png" alt="团购活动" className="img2 picture" /></li>
<li className="fl"><img src="https://image.xiaomaiketang.com/xm/G7KhH2apHG.png" alt="助力活动" className="img4 picture" /></li>
<li className="fl"><img src="https://image.xiaomaiketang.com/xm/mXEJRzt4cA.png" alt="互动游戏" className="img5 picture" /></li>
<li className="fl"><img src="https://image.xiaomaiketang.com/xm/JFDnbn8kye.png" alt="投票活动" className="img3 picture" /></li>
</ul>
</div>
</div>
<div className="module-text" id="text-container">
<div className="bg-shadow"></div>
<ul>
<li>
<div className="left-img img1"></div>
<div className="right-text">
<div className="title">砍价活动</div>
<div className="detail">优惠刺激转化，精准获取潜在学员线索</div>
</div>
</li>
<li>
<div className="left-img img2"></div>
<div className="right-text">
<div className="title">团购活动</div>
<div className="detail">多人成团，老带新，学员背书捆绑式营销</div>
</div>
</li>
<li>
<div className="left-img img3"></div>
<div className="right-text">
<div className="title">助力活动</div>
<div className="detail">病毒式裂变传播，一键发送，引爆朋友圈</div>
</div>
</li>
<li>
<div className="left-img img4"></div>
<div className="right-text">
<div className="title">趣味游戏</div>
<div className="detail">趣味小游戏，寓教于乐，朋友圈传播无阻碍</div>
</div>
</li>
<li>
<div className="left-img img5"></div>
<div className="right-text">
<div className="title">投票活动</div>
<div className="detail">学员成果分享，课程效果展示，铸口碑促招生</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
<div className="content-module content-module-3" style={{ backgroundColor:'#f4f6f9'}}>
<div className="body-center center">
<div className="module-title">
数据助力招生<br />活动数据深度分析，高效转化意向学员
</div>
<div className="show-content-module-body" style={{padding:'40px 20px 0 140px'}}>
<div className="module-text" id="text-container2">
<div className="bg-shadow2"></div>
<ul>
<li>
<div className="left-img img1"></div>
<div className="right-text">
<div className="title">活动数据深度分析</div>
<div className="detail">助力机构复盘活动，数据驱动打造爆款活动</div>
</div>
</li>
<li>
<div className="left-img img2"></div>
<div className="right-text">
<div className="title">学员社交关系图</div>
<div className="detail">潜在学员社交关系图，助力挖掘核心学员价值</div>
</div>
</li>
</ul>
</div>
<div className="module-img-2" id="img-container2">
<div className="img-wrap">
<ul className="ul ul2">
<li className="fl on"><img src="https://image.xiaomaiketang.com/xm/4XfzbDi7wj.png" alt="打卡作业" className="img1 picture" /></li>
<li className="fl"><img src="https://image.xiaomaiketang.com/xm/TwaZhyw54X.png" alt="内容分享" className="img2 on picture" /></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div className="content-module content-module-2" style={{background:'#fff'}}>
<div className="module-unit">
<div className="center">
<div className="module-title">小麦秀，助力机构招生营销</div>
<div className="top clearfix numBox">
<div className="item item1 fl">
<div className="wrap">
<span ref="student" className="num">1700</span>
<span className="pre-unit">万</span>
</div>
<p className="type">累计招生数</p>
</div>
{/* <div className="line"></div> */}
<div className="item item2 fl">
<div className="wrap">
<span ref="exposure" className="num">2.5</span>
<span className="pre-unit">亿</span>
</div>
<p className="type">累计曝光量</p>
</div>
</div>
</div>
</div>
</div>
{/* {this.state.isShow ? (
<FreeTrial handModalShow={this.renderModal}></FreeTrial>
) : (
""
)} */}
<Footer page="xmShow"></Footer>
<SiderBar/>
</div>
);
}
}
export default xmShow;
pages/xmErp.less deleted 100644 → 0
.xm-erp {
width: 100%;
height: 540px;
background-image: url(https://image.xiaomaiketang.com/xm/YrnaJJHAPR.png);
background-repeat: no-repeat;
background-position: 50% 50%;
position: relative;
display: flex;
align-items: center;
}
.xm-erp-img{
width: 100%;
height: 691px;
text-align: center;
position: relative;
.center-img{
width: 735px;
height: 317px;
background-image: url('https://image.xiaomaiketang.com/xm/ysmeYpfzTc.png');
background-size: contain;
margin-top: 175px;
display: inline-block;
}
img{
width: 168px;
height: 174px;
position: absolute;
cursor: pointer;
transition: 1s;
&:hover{
transform: translateY(-10px);
}
&.erp-img1{
left: 50%;
top: 2%;
margin-left: -72px;
}
&.erp-img2{
left: 68%;
top: 17%;
}
&.erp-img3{
right: 7%;
top: 47%;
}
&.erp-img4{
right: 26%;
bottom: 6%;
}
&.erp-img5{
left: 26%;
bottom: 6%;
}
&.erp-img6{
left: 7%;
top: 47%;
}
&.erp-img7{
left: 19%;
top: 17%;
}
}
}
.tabs{
background: #fff;
position: relative;
.left-switch{
width:25px;
cursor: pointer;
height:45px;
position: absolute;
top: 260px;
background-image: url('https://image.xiaomaiketang.com/xm/tWtf8Hh3e4.png');
background-size: contain;
&.left-active{
background-image: url('https://image.xiaomaiketang.com/xm/jJhN2zPMmt.png');
}
}
.right-switch{
width:25px;
cursor: pointer;
height:45px;
position: absolute;
top: 260px;
right: 10px;
background-image: url('https://image.xiaomaiketang.com/xm/th5m2MZryW.png');
background-size: contain;
&.right-active{
background-image: url('https://image.xiaomaiketang.com/xm/HYQKKwCJNB.png');
}
}
.ant-tabs{
.ant-tabs-nav{
.ant-tabs-nav-wrap{
.ant-tabs-nav-list{
border-bottom: 1px solid #E8E8E8;
button{
color: blanchedalmond;
}
.ant-tabs-tab{
border: none;
padding: 16px 0;
font-size:22px;
line-height:30px;
color: #333333 !important;
margin: 0 20px;
background: #fff;
.ant-tabs-tab-btn,.ant-tabs-tab-remove{
&:active,&:focus {
color: #ff8534 !important;
}
}
}
.ant-tabs-tab:hover{
color: #ff8534 !important;
}
.ant-tabs-tab.ant-tabs-tab-active {
color: #ff8534 !important;
.ant-tabs-tab-btn{
color: #ff8534 !important;
&:focus,&:active{
color: #ff8534 !important;
}
}
font-weight: 500;
&:after {
content: '';
position: absolute;
bottom: 0px;
top: auto;
left: 28px;
height: 4px;
width: 30px;
background-color: #fe925b;
}
}
}
}
}
@keyframes hideTabIndex{
0%{ opacity: 0; transform: translate(0, 0) }
100%{opacity: 1; transform: translate(0, 0) }
}
.tab-content{
padding: 20px 0 20px 49px;
display: flex;
align-items: center;
height: 500px;
animation: hideTabIndex 0.8s;
img{
width: 650px;
}
.tab-detail{
width: 477px;
display: inline-block;
text-align: left;
margin: 15px 0 0 26px;
p{
font-size:24px;
font-weight:500;
line-height:33px;
margin-bottom: 5px;
}
span{
font-size:16px;
line-height:22px;
font-weight:400;
}
.detail-content{
.item{
width: 189px;
margin-top: 27px;
margin-right: 27px;
img{
width: 36px;
height: 36px;
margin-right: 10px;
}
.right-content{
width: 143px;
p{
font-size:16px;
line-height:22px;
font-weight:400;
margin-bottom: 7px;
}
.span{
font-size:12px;
line-height: 17px;
letter-spacing: 1px;
}
}
}
}
}
}
}
}
pages/xmSchoolInfo.less deleted 100644 → 0
.xm-school-info{
width: 100%;
height: 540px;
background-image: url(https://image.xiaomaiketang.com/xm/2YZXGDYWtx.png);
background-repeat: no-repeat;
background-position: 50% 50%;
position: relative;
display: flex;
align-items: center;
.ant-btn{
color: #4F99FF !important;
}
}
.xm-schoolinfo-content-module-body {
display: flex;
justify-content: space-between;
.module-img {
width: 322px;
height: 640px;
background-image: url(https://image.xiaomaiketang.com/xm/6GSxeFPZwe.png);
background-size: 102% 101%;
background-repeat: no-repeat;
padding: 52px 16px 108px 26px;
box-sizing: border-box;
overflow: hidden;
position: relative;
margin-bottom: 87px;
.img-wrap {
width: 289px;
height: 506px;
overflow: hidden;
margin-left: -6px;
ul {
width: 2023px;
height: 506px;
overflow: hidden;
position: relative;
padding-left: 0px;
li {
width: 289px;
opacity: 0;
&.on{
transition: opacity 0.5s;
opacity: 1;
}
.picture {
width: 289px;
height: 506px;
}
}
}
}
}
.web-img {
box-shadow: 0 0 30px #eaeff6;
}
.module-text {
position: relative;
overflow: hidden;
.module-top-content{
color:rgba(51,51,51,1);
margin-top: 59px;
.title{
font-size:24px;
font-weight:500;
line-height:33px;
}
span{
font-size:16px;
font-weight:400;
line-height:22px;
}
}
.bg-shadow{
width: 100%;
height: 111px;
background-color: #fff;
// opacity: 0.1;
position: absolute;
top: 110px;
transition: top 0.2s;
}
.bg-shadow2{
width: 100%;
height: 111px;
background-color: #F4F6F9;
// opacity: 0.1;
position: absolute;
top: 110px;
transition: top 0.2s;
}
ul {
margin-top: 114px;
padding: 0;
li {
position: relative;
z-index: 10;
padding: 31px 53px 32px 25px;
box-sizing: border-box;
display: flex;
justify-content: flex-start;
&.on {
background-color: rgba(244, 246, 249, 1);
}
.left-img {
width: 48px;
height: 48px;
margin-right: 20px;
background-repeat: no-repeat;
background-size: contain;
&.img1 {
background-image: url("https://image.xiaomaiketang.com/xm/hp3Sh28hpD.png");
}
&.img2 {
background-image: url("https://image.xiaomaiketang.com/xm/bryyYHtTPa.png");
}
&.img3 {
background-image: url("https://image.xiaomaiketang.com/xm/NrRwHXkZKD.png");
}
&.img4 {
background-image: url("https://image.xiaomaiketang.com/xm/5HwpbQPkCH.png");
}
}
.right-text {
.title {
font-size: 16px;
font-weight: 400;
color: rgba(51, 51, 51, 1);
line-height: 22px;
margin-bottom: 7px;
}
.detail {
font-size: 12px;
font-weight: 400;
color: rgba(102, 102, 102, 1);
line-height: 17px;
}
}
}
}
&#text-container2 {
ul {
li {
&.on {
background-color: #eee;
}
.left-img {
width: 48px;
height: 48px;
margin-right: 20px;
background-repeat: no-repeat;
background-size: contain;
&.img1 {
background-image: url("https://image.xiaomaiketang.com/xm/btFmMSXf5S.png");
}
&.img2 {
background-image: url("https://image.xiaomaiketang.com/xm/fhthaMK4wa.png");
}
&.img3 {
background-image: url("https://image.xiaomaiketang.com/xm/PsGScSz2kh.png");
}
&.img4 {
background-image: url("https://image.xiaomaiketang.com/xm/xRPNNbQH5b.png");
}
}
}
}
}
}
}
\ No newline at end of file
pages/xmShow.less deleted 100644 → 0
.xm-show {
width: 100%;
height: 540px;
background-image: url(https://image.xiaomaiketang.com/xm/Ry84nrZrtC.png);
background-repeat: no-repeat;
background-position: 50% 50%;
position: relative;
display: flex;
align-items: center;
}
.module-unit {
border-top: 1px solid transparent;
.top {
margin-top: 60px;
padding-bottom: 50px;
display: flex;
justify-content: space-around;
align-items: center;
.line{
width:1px;
height:76px;
background: #000;
}
.item {
width: 400px;
.wrap {
text-align: center;
}
.num {
font-size: 72px;
line-height: 100px;
color: #333333;
text-align: center;
}
.pre-unit {
font-size: 72px;
line-height: 100px;
color: #333333;
text-align: center;
}
.type {
font-size: 20px;
font-weight: 400;
color: #333333;
line-height: 28px;
text-align: center;
}
}
}
}
.show-content-module-body {
display: flex;
justify-content: space-between;
padding-top: 40px;
.module-img {
width: 322px;
height: 640px;
background-image: url(https://image.xiaomaiketang.com/xm/6GSxeFPZwe.png);
background-size: 103% 101%;
background-repeat: no-repeat;
// box-shadow: 0 0 30px #eaeff6;
padding: 52px 16px 108px 0px;
box-sizing: border-box;
overflow: hidden;
position: relative;
&#img-container2 {
// box-shadow: 0 0 30px #ffeaeff6;
}
.img-wrap {
width: 289px;
height: 506px;
// overflow: hidden;
margin-left: -19px;
ul {
width: 2023px;
height: 506px;
overflow: hidden;
position: relative;
// top:52px;
left: 22px;
&.ul2 {
left: 0px;
}
&.ul3 {
left: 0px;
}
li {
width: 289px;
opacity: 0;
overflow: hidden;
&.on{
transition: opacity 0.5s;
opacity: 1;
}
.picture {
width: 289px;
height: 506px;
}
}
}
}
}
.module-img-2 {
// width: 640px;
height: 591px;
padding: 52px 16px 108px 0px;
box-sizing: border-box;
// overflow: hidden;
position: relative;
.img-wrap {
width: 625px;
height: 591px;
// overflow: hidden;
margin-left: -19px;
ul {
width: 2023px;
height: 506px;
overflow: hidden;
position: relative;
// top:52px;
left: 22px;
&.ul2 {
left: 0px;
}
&.ul3 {
left: 0px;
}
li {
width: 625px;
opacity: 0;
&.on{
transition: opacity 0.5s;
opacity: 1;
}
.picture {
width: 625px;
height: 591px;
}
}
}
}
}
.module-text {
position: relative;
overflow: hidden;
padding-top: 50px;
.bg-shadow{
width: 100%;
height: 111px;
background-color: #f4f6f9;
// opacity: 0.1;
position: absolute;
top:100px;
transition: top 0.2s;
}
.bg-shadow2{
width: 100%;
height: 111px;
background-color: #fff;
// opacity: 0.1;
position: absolute;
top:100px;
transition: top 0.2s;
}
ul {
li {
position: relative;
z-index: 10;
padding: 31px 53px 32px 25px;
box-sizing: border-box;
display: flex;
justify-content: flex-start;
&.on {
background-color: rgba(244, 246, 249, 1);
}
.left-img {
width: 48px;
height: 48px;
margin-right: 20px;
background-repeat: no-repeat;
background-size: contain;
&.img1 {
background-image: url("https://image.xiaomaiketang.com/xm/77TcaAiRWG.png");
}
&.img2 {
background-image: url("https://image.xiaomaiketang.com/xm/dHAez2h5P6.png");
}
&.img3 {
background-image: url("https://image.xiaomaiketang.com/xm/h68pepjB3m.png");
}
&.img4 {
background-image: url("https://image.xiaomaiketang.com/xm/GHhZcYTzJX.png");
}
&.img5 {
background-image: url("https://image.xiaomaiketang.com/xm/bzfGZ5DfFk.png");
}
}
.right-text {
width: 246px;
.title {
font-size: 16px;
font-weight: 400;
color: rgba(51, 51, 51, 1);
line-height: 22px;
margin-bottom: 7px;
.inner {
width:47px;
height:15px;
background:rgba(221,221,221,1);
border-radius:2px;
margin-left: 4px;
font-size:12px;
font-weight:400;
color:rgba(102,102,102,1);
line-height:17px;
display: inline-block;
text-align: center;
}
}
.detail {
font-size: 12px;
font-weight: 400;
color: rgba(102, 102, 102, 1);
line-height: 17px;
}
}
}
}
&#text-container2 {
ul {
margin-top: 140px;
li {
&.on {
background-color: #111111 !important;
}
.left-img {
width: 48px;
height: 48px;
margin-right: 20px;
background-repeat: no-repeat;
background-size: contain;
&.img1 {
background-image: url("https://image.xiaomaiketang.com/xm/EsKycwy6He.png");
}
&.img2 {
background-image: url("https://image.xiaomaiketang.com/xm/srD3zM5YtP.png");
}
}
}
}
}
}
}
redux/reducer/index.js
/*
* @Description:
* @Date: 2020-03-18 18:19:52
* @LastEditTime: 2021-04-20 11:25:50
* @LastEditors: JamosLi
* @LastEditTime: 2021-07-15 10:17:35
* @LastEditors: liguokang
*/
import { actionTypes } from '../action/action-types';
import cityMap from 'static/cityconfig.json';
let initState = {
city: '',
cityMap: cityMap,
cityMap: {},
};
//根据url 设置客户端城市初始值,
if (typeof window === 'object') {
// debugger;
const href = window.location.href;
// initState.city = createCityBySubDomain(href, JSON.parse(sessionStorage.getItem('citylist')))
initState.city = '杭州';
}
export default (state = initState, action) => {
......
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