Skip to content

X
xiaomai-website-ssr-template
Commit f5feaa32 by liguokang
Options

feat: ⚡

parent 07dac285
Showing with 603 additions and 265 deletions
components/CarouselArea.jsx deleted 100644 → 0
/*
* @Author: liguokang
* @Date: 2021-07-14 20:36:28
* @LastEditors: liguokang
* @LastEditTime: 2021-07-15 10:25:29
* @Description:
* @Copyrigh: ©2021 杭州杰竞科技有限公司 版权所有
*/
import { Carousel } from 'antd';
import './CarouselArea.less';
export default function CarouselArea() {
return (
<div className='carousel-area'>
<Carousel autoplay>
<div className='tem'>
<img src='' />
</div>
</Carousel>
</div>
);
}
\ No newline at end of file
components/Footer.jsx deleted 100644 → 0
/*
* @Author: liguokang
* @Date: 2021-07-14 20:36:28
* @LastEditors: liguokang
* @LastEditTime: 2021-07-15 10:25:37
* @Description:
* @Copyrigh: ©2021 杭州杰竞科技有限公司 版权所有
*/
import Link from 'next/link';
import { useEffect } from 'react';
import lottie from 'lottie-web';
import './Footer.less';
interface FooterProps {
isTrial?: boolean;
}
export default function Footer(props: FooterProps) {
useEffect(() => {
if (props.isTrial) {
generateAnimation();
}
}, []);
// 生成动画
function generateAnimation() {
lottie.loadAnimation({
container: document.getElementById('big-img-svg'),
path: 'https://image.xiaomaiketang.com/xm/JPpibc4xdD.json',
renderer: 'svg',
loop: true,
autoplay: true,
name: 'Hello World',
});
}
return (
<footer>
{props.isTrial && (
<div className="content-module content-module-8">
<div className="module-model">
<div className="center">
<div className="big-img" id="big-img-4">
<div className="big-img-svg" id="big-img-svg">
<div className="wrap">
<div className="text">体验教育信息化新模式</div>
<div className="module-img">
<span className="btn-wrap">
<div
className="btn-click free-trial"
id="btn-free-try"
onClick={() => {
// window.WEBTRACING('WebG_foot_clickEvent_clickFreeUse', 'WebG_页面底部_点击事件_点击免费试用', { page: this.props.page })
this.renderModal(true);
}}
>
免费试用
</div>
</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
)}
<div className="center">
<div className="footer-middle">
<ul>
<li className="item">
<p>产品</p>
<div className="fl">
<Link href="/xmErp">
<span>小麦助教</span>
</Link>
<Link href="/cloud-class">
<span>云课堂</span>
</Link>
<Link href="/xm-school-info">
<span>小麦校讯通</span>
</Link>
<Link href="/micro-brand-web">
<span>微官网</span>
</Link>
</div>
<div className="fr" style={{ marginLeft: '30px' }}>
<Link href="/xm-show">
<span>小麦秀</span>
</Link>
<Link href="/mm-checkIn">
<span>麦麦打卡</span>
</Link>
<Link href="/mm-poster">
<span>麦萌海报</span>
</Link>
<Link href="/mm-chain">
<span>小麦连锁版</span>
</Link>
</div>
</li>
<li className="item">
<p>招商加盟</p>
<Link href="/wheat-system">
<span>小麦助教系统</span>
</Link>
</li>
<li className="item">
<p>关于我们</p>
<Link href="/company-profile">
<span>公司简介</span>
</Link>
<Link href="/honorary-certificate">
<span>荣誉资质</span>
</Link>
<Link href="/new-dynamic">
<span>新闻动态</span>
</Link>
<Link href="/join-us">
<span>加入我们</span>
</Link>
<a href="https://image.xiaomaiketang.com/xm/XGSwRGwacP.pdf" target="_blank" rel="noopener noreferrer">
<span>隐私声明</span>
</a>
</li>
<li className="item">
<p>联系我们</p>
<span>咨询电话：400-6677-456</span>
<span>联系地址 : 杭州市西湖区古墩路598号同人广场A座3楼</span>
</li>
<li className="item">
<div className="img">
<div className="img1"></div>
</div>
<span>小麦助教公众号</span>
</li>
<li className="item">
<div className="img">
<div className="img2"></div>
</div>
<span>下载小麦助教</span>
</li>
</ul>
</div>
<div className="footer-bottom">
<p>
©2015-2021&nbsp;&nbsp;杭州杰竞科技有限公司&nbsp;&nbsp;&nbsp;&nbsp;
<a target="_blank" rel="noopener noreferrer" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=33010602006090">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<img
src="https://image.xiaomaiketang.com/xm/6mH2HnzP3k.png"
alt=""
style={{
width: '16px',
height: '16px',
display: 'inline-block',
margin: '0 4px 0 0',
verticalAlign: '-3px',
}}
/>
浙公网安备33010602006090号
</a>
&nbsp;&nbsp;&nbsp;&nbsp;
<a style={{ marginLeft: '20px' }} target="_blank" rel="noopener noreferrer" href="https://beian.miit.gov.cn/#/Integrated/index">
浙ICP备15025826号-2
</a>
&nbsp;&nbsp;&nbsp;&nbsp;
<a style={{ marginLeft: '20px' }} target="_blank" rel="noopener noreferrer" href="https://image.xiaomaiketang.com/xm/ffXeG5fXn8.jpg">
增值电信业务经营许可证：浙B2-20180802
</a>
</p>
<p>
<span style={{ marginLeft: '20px' }}>教APP备3300311号</span>
&nbsp;&nbsp;&nbsp;&nbsp;
<span style={{ marginLeft: '20px' }}>教APP备3300313号</span>
&nbsp;&nbsp;&nbsp;&nbsp;
<span style={{ marginLeft: '20px' }}>教APP备3300315号</span>
</p>
</div>
</div>
</footer>
);
}
components/SiderBar.jsx deleted 100644 → 0
/*
* @Author: liguokang
* @Date: 2021-07-14 20:36:28
* @LastEditors: liguokang
* @LastEditTime: 2021-07-15 10:25:45
* @Description:
* @Copyrigh: ©2021 杭州杰竞科技有限公司 版权所有
*/
import './SiderBar.less';
export default function SiderBar() {
return (
<div className="sider-bar">
<div className="sider-tell">
<img src="https://image.xiaomaiketang.com/xm/kyiit34CzK.png" style={{ marginTop: 17 }} alt="" />
<p>咨询热线</p>
<div className="content">
<div className="consult-img fl"></div>
<div className="title fl">
了解产品和优惠
<br />
免费拨打
</div>
<div className="detail fl">400-6677-456</div>
</div>
</div>
<div
className="sider-apply"
onClick={() => {
this.renderModal(true);
}}
>
<div className="bg" style={{ marginTop: 17 }}></div>
<p>申请试用</p>
</div>
<div className="sider-focus">
<div className="bg"></div>
<p>扫码关注</p>
<div className="content">
<div className="consult-img fl"></div>
<div className="title fl">小麦助教公众号</div>
</div>
</div>
{/* {this.state.isShow ? (
<FreeTrial handModalShow={this.renderModal}></FreeTrial>
) : (
""
)} */}
</div>
);
}
components/layout/XMFooter/LaFooter.js 0 → 100644
/*
* @Description:
* @Date: 2020-03-18 18:19:52
* @LastEditTime: 2020-12-30 20:48:12
* @LastEditors: JamosLi
*/
import React from 'react';
import style from './laFooter.less';
import Link from 'next/link';
import LazyLoad from 'react-lazyload';
import { StaticImg } from '@/api/interfaces';
import Button from 'baseTemplate/lib/button';
const Img = StaticImg + '/Footer';
import { open } from '@/lib/methods';
class LaFooter extends React.Component {
render() {
return (
<footer className={style.laFooter}>
<div className={style.laFooterList2}>
<div className={style.List2Content}>
<div className={style.FooterBox1}>
<div>
<h2>关于中禄</h2>
<p>
<Link href={'/aboutUs'}>
<a>关于我们</a>
</Link>
</p>
<p>
<Link href={'/contactUs'}>
<a>联系我们</a>
</Link>
</p>
</div>
<div>
<h2>新手指南</h2>
<p onClick={open}>
<a>在线咨询</a>
</p>
<p onClick={open}>
<a>财税资讯</a>
</p>
<p>
<Link href={'/login/cusRegister'}>
<a>新手注册</a>
</Link>
</p>
</div>
<div>
<h2>服务推荐</h2>
<p>
<Link href={'/companyRegistration'}>
<a>公司注册</a>
</Link>
</p>
<p>
<Link href={'/agentAccount'}>
<a>代理记账</a>
</Link>
</p>
<p>
<Link href={'/qualification'}>
<a>资质办理</a>
</Link>
</p>
<p>
<Link href={'/BusinessService'}>
<a>商标知产</a>
</Link>
</p>
</div>
</div>
<div className={style.FooterBox2}>
<div className={style.Box2Line}>
<h3>服务热线</h3>
<LazyLoad height={72}>
<p style={{ backgroundImage: `url('${Img}/dianhua.svg')` }}>{this.props.phone || 400 - 690 - 8028}</p>
</LazyLoad>
<Button mode={'red'} className={style.inlineChat}>
<a onClick={open}>在线咨询</a>
</Button>
</div>
</div>
<div className={style.FooterBox3}>
<LazyLoad height={152}>
<div className={style.weChat} style={{ backgroundImage: `url('${Img}/wechat-min.jpg')` }} />
<span />
</LazyLoad>
<p>扫一扫，创业一手掌握</p>
</div>
</div>
</div>
<div className={style.laFooterList3}>
<a target="_blank" href="https://beian.miit.gov.cn">
<span>Copyright ©2017 浙江中禄财务咨询有限公司版权所有 浙ICP备16004996号-1</span>
</a>
</div>
</footer>
);
}
}
export default LaFooter;
components/layout/XMFooter/laFooter.less 0 → 100644
.laFooter {
height: 258px;
width: 100%;
.laFooterList2 {
height: 216px;
background-color: #242633;
display: flex;
align-items: center;
justify-content: center;
.List2Content {
display: flex;
width: 1200px;
height: 226px;
.FooterBox1 {
display: flex;
width: 545px;
height: 216px;
div {
display: flex;
flex-direction: column;
width: 188px;
height: 160px;
margin-top: 30px;
h2 {
font-size: 18px;
font-weight: normal;
color: #ffffff;
margin-bottom: 5px;
}
p a {
font-size: 14px;
color: #878d99;
&:hover {
color: #f05750;
}
}
p {
cursor: pointer;
margin-bottom: 0;
line-height: 28px;
}
}
div:last-child {
border-right: 1px solid #3c4b57;
}
}
.FooterBox2 {
width: 450px;
.Box2Line {
display: flex;
flex-direction: column;
width: 100%;
height: 160px;
margin-top: 30px;
padding-left: 108px;
border-right: 1px solid #3c4b57;
h3 {
font-size: 18px;
color: #878d99;
margin-bottom: 20px;
line-height: 1em;
}
p {
font-size: 30px;
height: 36px;
font-style: italic;
font-weight: bold;
color: #fff;
line-height: 36px;
padding-left: 36px;
margin-bottom: 36px;
background: no-repeat center left/24px 24px;
}
.inlineChat {
width: 192px;
height: 36px;
text-align: center;
line-height: 36px;
background-color: #e63e36;
cursor: pointer;
a {
font-size: 14px;
color: #ffffff;
}
}
}
}
.FooterBox3 {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-left: 50px;
width: 140px;
.weChat {
width: 140px;
height: 140px;
background: #fff no-repeat center center/120px 120px;
border-radius: 10px;
}
span {
display: block;
width: 0;
height: 0;
border-width: 6px;
border-style: solid;
border-color: #ffffff transparent transparent transparent;
}
p {
font-size: 12px;
color: #ffffff;
text-align: center;
}
}
}
}
.laFooterList3 {
height: 42px;
width: 100%;
background-color: #2e303c;
text-align: center;
span {
width: 1200px;
height: 100%;
font-size: 12px;
color: #878d99;
line-height: 42px;
}
}
}
components/layout/XMHeader/laHeader.less 0 → 100644
.laHeader {
width: 100%;
a {
text-decoration: none;
}
//顶部灰色盒子
.laTop {
height: 36px;
background-color: #ebeef4;
.topContent {
width: 1200px;
height: 36px;
margin: 0 auto;
display: flex;
align-items: center;
position: relative;
.CityList {
display: flex;
justify-content: center;
flex-direction: column;
position: absolute;
height: 36px;
width: 90px;
padding-left: 17px;
top: 0;
left: -17px;
.cityBox {
position: absolute;
display: flex;
flex-wrap: wrap;
background-color: #ffffff;
top: 36px;
left: -1px;
width: 270px;
text-align: center;
padding: 3px 18px 10px;
border: 1px solid #ebeef4;
border-top: none;
color: #878d99;
.city {
width: 58px;
height: 35px;
line-height: 35px;
font-size: 13px;
cursor: pointer;
}
.city:hover {
color: red !important;
}
}
.currentCity {
background: url('//statics.360jizhang.cn/staticFile/websiteFile/licenseAgent/dingwei.png') no-repeat center left;
display: inline-block;
height: 14px;
line-height: 14px;
width: 70px;
font-size: 13px;
padding-left: 18px;
border-right: 1px solid #bebebe;
cursor: pointer;
}
}
.number {
margin-left: 80px;
font-size: 12px;
color: #878d99;
}
span {
font-size: 12px;
color: #878d99;
}
.user {
display: flex;
align-items: center;
height: 100%;
position: absolute;
right: 0;
top: 0;
cursor: pointer;
.userDiv {
display: flex;
align-items: center;
span {
margin: 0 5px;
}
a {
display: flex;
align-items: center;
i {
margin-top: 4px;
}
}
a:hover {
span {
color: #e63e36;
}
svg {
path {
fill: #e63e36;
}
}
}
}
.userBox {
display: none;
position: absolute;
top: 36px;
right: 0px;
width: 109px;
height: 70px;
background: #fff;
border: 1px solid rgba(243, 243, 243, 1);
z-index: 999;
box-shadow: 0px 3px 12px rgba(98, 98, 98, 0.11);
ul {
width: 100%;
li {
display: flex;
align-items: center;
justify-content: center;
height: 35px;
width: 100%;
color: #333333;
font-size: 14px;
span {
font-size: 14px;
color: #333;
margin-left: 10px;
}
}
li:first-child {
border-bottom: 1px solid #f3f3f3;
}
li:hover {
svg {
path {
fill: #e63e36;
}
}
span {
color: #e63e36;
}
}
}
}
.userBox:after {
width: 0;
height: 0;
content: '';
position: absolute;
left: 45px;
top: -10px;
border-left: solid 10px transparent;
border-bottom: solid 10px white;
border-right: solid 10px transparent;
}
a {
font-size: 12px;
color: #878d99;
}
}
.user:hover {
.userBox {
display: block;
}
}
}
}
//导航栏部分
.laNav {
height: 80px;
width: 100%;
box-shadow: 0 1px 2px rgba(95, 95, 95, 0.1);
display: flex;
justify-content: center;
align-items: center;
background-color: #fff;
.laNavBody {
display: flex;
align-items: center;
justify-content: space-between;
width: 1200px;
height: 80px;
div:first-child {
display: flex;
align-items: center;
justify-content: center;
width: 240px;
min-width: 240px;
margin-right: 23px;
.laIcon {
width: 121px;
margin-right: 20px;
}
.allService {
display: flex;
align-items: center;
justify-content: center;
width: 102px;
height: 24px;
border: 1px solid #e63e36;
border-radius: 12px;
line-height: 24px;
a {
background: url('//statics.360jizhang.cn/staticFile/websiteFile/licenseAgent/xin.png') no-repeat 10px center;
background-size: 14px;
border-radius: 12px;
width: 100%;
padding-left: 28px;
height: 24px;
line-height: 24px;
display: inline-block;
font-size: 14px;
text-decoration: none;
color: #e63e36;
}
a:hover {
color: #fff;
background-image: url('//statics.360jizhang.cn/staticFile/websiteFile/licenseAgent/xin_bai.png');
background-color: #e63e36;
border: 1px solid #e63e36;
}
}
}
div:last-child {
height: 100%;
ul {
margin-bottom: 0;
list-style: none;
display: flex;
align-items: center;
justify-content: flex-end;
width: 920px;
height: 100%;
li {
margin-left: 53px;
a {
display: inline-block;
height: 50px;
line-height: 50px;
font-size: 16px;
font-weight: 400;
color: #1d2b36;
position: relative;
left: 0;
}
a:hover {
height: 70px;
line-height: 70px;
color: #e63e36;
}
}
}
}
}
}
}
components/layout/index.js 0 → 100644
import React from 'react';
import Head from 'next/head';
import { changeCity } from '../../redux/action';
// 组件
import XMHeader from './XMHeader/laHeader';
import XMFooter from './XMFooter/LaFooter';
import PropTypes from 'prop-types';
import { noXiaoHan } from '@/lib/methods';
import Sidebar from '../base/sidebar';
import { connect } from 'react-redux';
import { getCity } from 'static/js/util';
const Fragment = React.Fragment;
class Layout extends React.Component {
constructor(props) {
super(props);
this.state = {
phone: '',
};
}
static propTypes = {
title: PropTypes.string,
isHome: PropTypes.bool,
useAntd: PropTypes.bool,
noTop: PropTypes.bool,
noFooter: PropTypes.bool,
};
componentDidMount() {
if (window.location.pathname !== '/') {
// 关闭个人中心和商标页的小韩
noXiaoHan();
}
getCity(this.props.cityMap, window.location.href).then((res) => {
let cityConfig = res.data;
this.setState({ phone: cityConfig.config.phone });
this.setState({ hostname: cityConfig.hostname });
this.setState({ hmurl: cityConfig.config.hmurl });
this.setState({ cityname: cityConfig.config.city });
sessionStorage.setItem('pgtUrl', cityConfig.config.chatAnchor);
});
}
render() {
let mLink = '';
let hmurl = '';
const { title } = this.props;
let city = '';
if (this.state.cityname) {
city = this.state.cityname;
hmurl = this.state.hmurl;
mLink = this.state.hostname[1];
}
return (
<div style={{ minHeight: '100vh', position: 'relative' }}>
<Head>
<title>{title || `${city} `}</title>
<meta charSet="utf-8" />
<meta name="viewport" content="initial-scale=1.0, width=device-width" />
<meta httpEquiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />
<meta name="renderer" content="webkit|ie-comp|ie-stand" />
{/*添加keywords*/}
{this.props.useImgHead && <meta name="referrer" content="no-referrer" />}
<meta name="keywords" content=" " />
<link type="image/x-icon" rel="shortcut icon" href="static/images/favicon.ico" />
<link rel="stylesheet" href="/static/styles/ready.css" />
{/* 部分老页面对antd.css这个文件有依赖,传递useAntd*/}
<meta name="format-detection" content="telephone=no,email=no" />
<meta httpEquiv="mobile-agent" content={'format=xhtml;url=' + mLink} />
<meta name="description" content="" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script async defer src=" " />
<meta httpEquiv="Expires" content="0" />
</Head>
<XMHeader city={this.state.cityname} changeCity={this.props.changeCity} noTop={this.props.noTop} />
{this.props.children}
{this.props.noFooter || (
<Fragment>
<div style={{ width: '100%', height: 258, backgroundColor: '#fff' }}></div>
<footer style={{ position: 'absolute', bottom: 0, width: '100%' }}>
<XMFooter phone={this.state.phone} />
</footer>
</Fragment>
)}
<Sidebar props={{ phone: this.state.phone }} phone={this.state.phone} />
</div>
);
}
}
export default connect(
({ city, cityMap }) => ({ city, cityMap }),
(dispatchEvent) => {
return {
changeCity: (city) => {
dispatchEvent(changeCity(city));
},
};
},
)(Layout);
tsconfig.json
...@@ -23,7 +23,7 @@ ...@@ -23,7 +23,7 @@
"**/*.ts", "**/*.ts",
"**/*.tsx", "**/*.tsx",
"pages/index.jsx" "pages/index.jsx"
, "pages/company-profile.jsx", "pages/honorary-certificate.jsx", "pages/about.jsx", "pages/new-dynamic.jsx", "pages/wheat-system.jsx", "components/Footer.jsx", "components/SiderBar.jsx", "components/CarouselArea.jsx", "data-source/join-us/request-apisjts" ], , "pages/company-profile.jsx", "pages/honorary-certificate.jsx", "pages/about.jsx", "pages/new-dynamic.jsx", "pages/wheat-system.jsx", "components/Footer.tsx", "components/SiderBar.jsx", "components/CarouselArea.jsx", "data-source/join-us/request-apisjts" ],
"exclude": [ "exclude": [
"node_modules" "node_modules"
] ]
......
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