提交 aa925bd8 authored 作者: matian's avatar matian

项目优化

上级 075448fc
src/assets/images/major-set/mid-2.png

121.7 KB | W: | H:

src/assets/images/major-set/mid-2.png

199.7 KB | W: | H:

src/assets/images/major-set/mid-2.png
src/assets/images/major-set/mid-2.png
src/assets/images/major-set/mid-2.png
src/assets/images/major-set/mid-2.png
  • 2-up
  • Swipe
  • Onion skin
...@@ -107,8 +107,7 @@ export default { ...@@ -107,8 +107,7 @@ export default {
phone: this.formInfo.phone phone: this.formInfo.phone
} }
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
cAction.News.postNes(params) cAction.News.postNes(params).then(res => {
.then(res => {
if (res && res.status === 200 && res.error === 0) { if (res && res.status === 200 && res.error === 0) {
resolve({ resolve({
type: 'enroll', type: 'enroll',
...@@ -188,7 +187,7 @@ export default { ...@@ -188,7 +187,7 @@ export default {
top: 50%; top: 50%;
right: 10px; right: 10px;
z-index: 9999; z-index: 9999;
transform:translateY(-50%); transform: translateY(-50%);
.tab_btns { .tab_btns {
width: 72px; width: 72px;
height: 136px; height: 136px;
...@@ -288,10 +287,10 @@ export default { ...@@ -288,10 +287,10 @@ export default {
.right_bar .sendcode .el-input { .right_bar .sendcode .el-input {
width: 170px; width: 170px;
} }
.right_bar .el-button{ .right_bar .el-button {
background: #ff8e1a; background: #ff8e1a;
border:#ff8e1a 1px solid; border: #ff8e1a 1px solid;
color:rgba(255,255,255,.9); color: rgba(255, 255, 255, 0.9);
} }
.sendcode .el-button { .sendcode .el-button {
width: 94px; width: 94px;
......
...@@ -90,13 +90,13 @@ export default { ...@@ -90,13 +90,13 @@ export default {
} }
.slider-banner { .slider-banner {
display: flex; display: flex;
flex: 2; flex: 5;
.tab-item { .tab-item {
flex: 1; flex: 1;
text-align: center; text-align: center;
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
justify-content: flex-end; justify-content: center;
.app-link { .app-link {
color: #fff; color: #fff;
&.router-link-active .tab-link { &.router-link-active .tab-link {
......
<template> <template>
<div <div class="section-form">
class="homepage_message" <div class="section-form-inner">
:style="{'min-height': leavheight + 'px', backgroundImage:'url(' + imgUrlBg + ')' }" <div class="form-box">
> <h2>报名咨询CUW家庭教育硕士</h2>
<div class="homepage_message-main"> <p>填写姓名 + 手机, 点击报名咨询</p>
<h3> <el-form :model="ruleForm" :rules="rules" ref="ruleForm">
<span>留下您的信息</span>
</h3>
<h5>紫荆教育学位顾问为您提供专业的服务</h5>
<div class="homepage_message_body">
<div class="body_img">
<img :src="imgUrl" alt :style="imgUrl.indexOf('mes1') != -1 ? 'width:472px' : ''"/>
</div>
<div class="body_input">
<el-form
:model="ruleForm"
:rules="rules"
ref="ruleForm"
label-width="0px"
class="demo-ruleForm"
>
<el-form-item prop="name"> <el-form-item prop="name">
<el-input v-model="ruleForm.name" placeholder="姓名"></el-input> <el-input v-model="ruleForm.name" placeholder="姓名"></el-input>
</el-form-item> </el-form-item>
...@@ -27,13 +12,12 @@ ...@@ -27,13 +12,12 @@
<el-input v-model="ruleForm.phone" placeholder="手机"></el-input> <el-input v-model="ruleForm.phone" placeholder="手机"></el-input>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" :loading="isLoading" @click="submit">提交</el-button> <el-button type="primary" :loading="isLoading" @click="submit">报名咨询</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
</div> </div>
</div> </div>
</div> </div>
</div>
</template> </template>
<script> <script>
...@@ -99,81 +83,62 @@ export default { ...@@ -99,81 +83,62 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.homepage_message { .section-form {
width: 100%;
position: relative; position: relative;
background-repeat: no-repeat;
background-size: cover;
display: flex; display: flex;
justify-content: center; justify-content: center;
.homepage_message-main { height: 554px;
width: 80%; background: url(@/assets/images/major-set/mz.png) no-repeat center;
background-repeat: no-repeat;
background-size: 100%;
}
.section-form-inner {
width: 70%;
margin: 0 auto; margin: 0 auto;
h3 { h2 {
margin-top: 80px; font-size: 26px;
font-family: SourceHanSansCN-Medium, SourceHanSansCN;
font-weight: 500;
color: #0466a1;
line-height: 40px;
letter-spacing: 5px;
text-align: center; text-align: center;
color: rgba(255, 255, 255, 1);
font-size: 40px;
font-family: PingFangSC-Medium, PingFang SC;
span {
display: inline-block;
position: relative;
&::before {
content: '';
position: absolute;
bottom: -4px;
height: 3px;
background: #ffffff;
width: 100%;
}
}
} }
h5 { p {
padding-top: 24px; margin-bottom: 30px;
font-size: 18px; font-size: 20px;
font-family: PingFangSC-Semibold, PingFang SC; font-family: SourceHanSansCN-Regular, SourceHanSansCN;
font-weight: 600; font-weight: 400;
opacity: 0.6; color: #777777;
color: rgba(255, 255, 255, 1); line-height: 30px;
letter-spacing: 2px;
text-align: center; text-align: center;
} }
.homepage_message_body { .form-box {
padding: 63px 0px 0px 0px; width: 400px;
display: flex; padding: 40px;
width: 100%; background-color: #fff;
.body_img { margin-top: 100px;
flex: 1;
padding: 0px 30px;
}
.body_input {
flex: 1;
padding: 0px 30px;
.demo-ruleForm {
display: flex;
justify-content: space-between;
flex-direction: column;
height: 100%;
}
.el-input { .el-input {
max-width: 324px; width: 100%;
} }
::v-deep .el-input__inner { ::v-deep .el-input__inner {
border: 0px;
background: transparent; background: transparent;
border-bottom: 2px solid #fff; border: 0px;
border-bottom: 1px solid #000;
border-radius: 0px; border-radius: 0px;
padding: 0px; padding: 0px;
color: #fff; color: #333;
} }
::v-deep .el-button { ::v-deep .el-button {
width: 132px; margin-top: 20px;
height: 54px; color: #fff;
border-radius: 4px; background-color: #faa634;
.el-icon-loading { border: 1px solid #faa634;
color: #fff !important; width: 100%;
} height: 40px;
} border-radius: 0;
}
} }
} }
} }
......
...@@ -505,7 +505,7 @@ export default { ...@@ -505,7 +505,7 @@ export default {
h2 { h2 {
margin-top: 16px; margin-top: 16px;
font-size: 26px; font-size: 26px;
color: #e27f4d; color: #fff;
font-weight: 400; font-weight: 400;
text-align: right; text-align: right;
} }
......
...@@ -63,11 +63,11 @@ ...@@ -63,11 +63,11 @@
<img src="@/assets/images/major-set/mid-7.png" alt="" /> <img src="@/assets/images/major-set/mid-7.png" alt="" />
</div> </div>
<div class="p3"> <div class="p3">
<div class="txt">《狂喜之后》《踏上心灵幽》作者、正念导师 杰克·康菲尔德</div> <div class="txt">《狂喜之后》《踏上心灵幽》作者、正念导师 杰克·康菲尔德</div>
<img src="@/assets/images/major-set/mid-3.png" alt="" /> <img src="@/assets/images/major-set/mid-3.png" alt="" />
</div> </div>
<div class="p5"> <div class="p5">
<div class="txt">澳门城市大学教授、华南师范大学教授 申荷永</div> <div class="txt">澳门城市大学教授、华南师范大学教授 <br />申荷永</div>
<img src="@/assets/images/major-set/mid-new2.png" alt="" /> <img src="@/assets/images/major-set/mid-new2.png" alt="" />
</div> </div>
<!-- <div class="p4"> <!-- <div class="p4">
...@@ -132,39 +132,6 @@ ...@@ -132,39 +132,6 @@
</div> </div>
</div> </div>
</vue-lazy-component> </vue-lazy-component>
<vue-lazy-component>
<div class="layout_com_page_banner major-kc-sy" :style="{ 'min-height': 700 + 'px' }">
<div class="sy-body">
<div
class="sy-banner"
v-for="(item, index) in timeList"
:key="index"
:class="{ 'blacker-sy': !item.bgShow }"
@mouseenter="outsyStyle(item, index)"
>
<div class="sy-banner-bg sy-banner-header">
<img :src="require('@/assets/images/major-set/blxbjh.png')" />
<span class="sy-banner-bg-layout">{{ item.name }}</span>
</div>
<div class="sy-banner-bg sy-banner-main">
<img :src="item.img" />
<div class="sy-banner-bg-layout">
<span class="font-size-18">{{ item.title }}</span>
<span class="font-size-18">{{ item.title1 }}</span>
<span class="font-size-18">{{ item.title2 }}</span>
<span class="font-size-18">{{ item.title3 }}</span>
<span class="font-size-18">{{ item.title4 }}</span>
<span class="font-size-18">{{ item.title5 }}</span>
</div>
<div class="sy-banner-bg-00" v-if="!item.bgShow"></div>
</div>
</div>
</div>
<div class="sy-footer">
<img :src="require('@/assets/images/major-set/su.png')" />
</div>
</div>
</vue-lazy-component>
<vue-lazy-component> <vue-lazy-component>
<div class="layout_com_page_banner major-kc-wm" :style="{ 'min-height': 700 + 'px' }"> <div class="layout_com_page_banner major-kc-wm" :style="{ 'min-height': 700 + 'px' }">
<h3> <h3>
...@@ -190,18 +157,6 @@ ...@@ -190,18 +157,6 @@
</template> </template>
<div class="swiper-pagination" slot="pagination"></div> <div class="swiper-pagination" slot="pagination"></div>
</swiper> </swiper>
<!-- <div class="major-kc-wm-list" v-for="(item, index) in wmList" :key="index">
<div class="list-img">
<img :src="item.img" />
</div>
<div class="list-body">
<span class="font-size-18 nowrap title">{{item.title}}</span>
<span class="font-size-14 wm-red zs">{{item.label}}</span>
<template v-for="(sItem, sIndex) in item.main">
<span :key="sIndex+'-'+index" class="font-size-14 mian-txt">{{sItem}}</span>
</template>
</div>
</div> -->
</div> </div>
</div> </div>
</vue-lazy-component> </vue-lazy-component>
...@@ -245,6 +200,40 @@ ...@@ -245,6 +200,40 @@
</div> </div>
</div> </div>
</vue-lazy-component> </vue-lazy-component>
<vue-lazy-component>
<div class="layout_com_page_banner major-kc-sy" :style="{ 'min-height': 700 + 'px' }">
<div class="sy-body">
<div
class="sy-banner"
v-for="(item, index) in timeList"
:key="index"
:class="{ 'blacker-sy': !item.bgShow }"
@mouseenter="outsyStyle(item, index)"
>
<div class="sy-banner-bg sy-banner-header">
<img :src="require('@/assets/images/major-set/blxbjh.png')" />
<span class="sy-banner-bg-layout">{{ item.name }}</span>
</div>
<div class="sy-banner-bg sy-banner-main">
<img :src="item.img" />
<div class="sy-banner-bg-layout">
<span class="font-size-18">{{ item.title }}</span>
<span class="font-size-18">{{ item.title1 }}</span>
<span class="font-size-18">{{ item.title2 }}</span>
<span class="font-size-18">{{ item.title3 }}</span>
<span class="font-size-18">{{ item.title4 }}</span>
<span class="font-size-18">{{ item.title5 }}</span>
</div>
<div class="sy-banner-bg-00" v-if="!item.bgShow"></div>
</div>
</div>
</div>
<div class="sy-footer">
<img :src="require('@/assets/images/major-set/su.png')" />
</div>
</div>
</vue-lazy-component>
<!-- <vue-lazy-component> <!-- <vue-lazy-component>
<swiper ref="mySwiper" :options="swiperOptions"> <swiper ref="mySwiper" :options="swiperOptions">
<swiper-slide>Slide 1</swiper-slide> <swiper-slide>Slide 1</swiper-slide>
...@@ -257,11 +246,7 @@ ...@@ -257,11 +246,7 @@
</vue-lazy-component> --> </vue-lazy-component> -->
<vue-lazy-component> <vue-lazy-component>
<div ref="leavex"> <div ref="leavex">
<leavex <leavex :imgUrlBg="require('@/assets/images/major-set/mz.png')" :leavheight="heightdy - 60" />
:imgUrl="require('@/assets/images/mes1.png')"
:imgUrlBg="require('@/assets/images/major-set/mz.png')"
:leavheight="heightdy - 60"
/>
</div> </div>
</vue-lazy-component> </vue-lazy-component>
<vue-lazy-component> <vue-lazy-component>
...@@ -1297,13 +1282,13 @@ export default { ...@@ -1297,13 +1282,13 @@ export default {
.pics .left { .pics .left {
display: inline-block; display: inline-block;
width: 15.95%; width: 15.98%;
overflow: hidden; overflow: hidden;
} }
.pics .right { .pics .right {
display: inline-block; display: inline-block;
width: 15.95%; width: 15.98%;
overflow: hidden; overflow: hidden;
} }
...@@ -1313,16 +1298,16 @@ export default { ...@@ -1313,16 +1298,16 @@ export default {
.pics .mid { .pics .mid {
display: inline-block; display: inline-block;
width: 68.1%; width: 68.04%;
overflow: hidden; overflow: hidden;
} }
.pics .mid .p1 { .pics .mid .p1 {
width: 33.2%; width: 33.4%;
} }
.pics .mid .p2 { .pics .mid .p2 {
width: 66.8%; width: 66.6%;
} }
.pics .mid .p3 { .pics .mid .p3 {
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论