Skip to content
项目
群组
代码片段
帮助
当前项目
正在载入...
登录 / 注册
切换导航面板
P
project-online-pc
项目
项目
详情
活动
周期分析
仓库
仓库
文件
提交
分支
标签
贡献者
图表
比较
统计图
议题
0
议题
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
CI / CD
CI / CD
流水线
作业
日程
统计图
Wiki
Wiki
代码片段
代码片段
成员
成员
折叠边栏
关闭边栏
活动
图像
聊天
创建新问题
作业
提交
问题看板
Open sidebar
EzijingWeb
project-online-pc
Commits
5c165e3d
提交
5c165e3d
authored
6月 17, 2021
作者:
lihuihui
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
首页pc h5 合并
上级
0c808a16
显示空白字符变更
内嵌
并排
正在显示
8 个修改的文件
包含
441 行增加
和
111 行删除
+441
-111
banner.vue
components/home/banner.vue
+5
-0
commonProblem.vue
components/home/commonProblem.vue
+103
-45
news.vue
components/home/news.vue
+81
-6
openClass.vue
components/home/openClass.vue
+55
-15
presence.vue
components/home/presence.vue
+111
-39
projectFeatures.vue
components/home/projectFeatures.vue
+0
-2
schoolRanking.vue
components/home/schoolRanking.vue
+85
-3
index.vue
pages/index.vue
+1
-1
没有找到文件。
components/home/banner.vue
浏览文件 @
5c165e3d
...
@@ -14,8 +14,10 @@
...
@@ -14,8 +14,10 @@
</div>
</div>
</div>
</div>
</div>
</div>
<
template
v-if=
"!isMobile"
>
<div
class=
"prev-button"
></div>
<div
class=
"prev-button"
></div>
<div
class=
"next-button"
></div>
<div
class=
"next-button"
></div>
</
template
>
</div>
</div>
</template>
</template>
<
script
>
<
script
>
...
@@ -45,6 +47,9 @@ export default {
...
@@ -45,6 +47,9 @@ export default {
computed
:
{
computed
:
{
swiper
()
{
swiper
()
{
return
this
.
$refs
.
mySwiper
.
swiper
return
this
.
$refs
.
mySwiper
.
swiper
},
isMobile
()
{
return
this
.
$store
.
state
.
isMobile
}
}
},
},
mounted
()
{},
mounted
()
{},
...
...
components/home/commonProblem.vue
浏览文件 @
5c165e3d
<
template
>
<
template
>
<div
:class=
"isMobile ? 'is-h5' : 'is-pc'"
>
<div
class=
"common-content-box"
>
<div
class=
"common-content-box"
>
<m-title
:data=
"titleParams"
class=
"m-title"
/>
<card
:title=
"$t('home.problem.title')"
>
<template
#
header-aside
><nuxt-link
to=
"/apply/problem"
>
{{
$t
(
'viewMore'
)
}}
</nuxt-link></
template
>
<div
class=
"content-mian"
>
<div
class=
"content-mian"
>
<app-link
:item=
"{ path: '/news/hot' }"
>
<app-link
:item=
"{ path: '/news/hot' }"
>
<div
class=
"list-box"
>
<div
class=
"list-box"
>
<ul>
<ul>
<li
>
<li
v-for=
"(item, index) in problem.itemLeft"
:key=
"index"
>
<div
class=
"icon"
></div>
<div
class=
"icon"
></div>
<div
class=
"text"
>
Kelley商学院毕业生颁发的学位证书与在美国颁发的证书有何不同?
</div>
<div
class=
"text"
>
{{ item }}
</div>
</li>
<li>
<div
class=
"icon"
></div>
<div
class=
"text"
>
本项目是上课形式是怎么样?
</div>
</li>
<li>
<div
class=
"icon"
></div>
<div
class=
"text"
>
本项目学制多久?
</div>
</li>
<li>
<div
class=
"icon"
></div>
<div
class=
"text"
>
能否顺利毕业拿到证书呢?
</div>
</li>
<li>
<div
class=
"icon"
></div>
<div
class=
"text"
>
本项目是在职还是全职?
</div>
</li>
</li>
</ul>
</ul>
<ul>
<ul>
<li
>
<li
v-for=
"(item, index) in problem.itemRight"
:key=
"index"
>
<div
class=
"icon"
></div>
<div
class=
"icon"
></div>
<div
class=
"text"
>
如何申请Kelley商学院金融学硕士?
</div>
<div
class=
"text"
>
{{ item }}
</div>
</li>
<li>
<div
class=
"icon"
></div>
<div
class=
"text"
>
大概流程是什么?
</div>
</li>
<li>
<div
class=
"icon"
></div>
<div
class=
"text"
>
需要提交哪些材料?
</div>
</li>
<li>
<div
class=
"icon"
></div>
<div
class=
"text"
>
美国印第安纳大学Kelley商学院金融学硕士的学费是多少?
</div>
</li>
<li>
<div
class=
"icon"
></div>
<div
class=
"text"
>
学费可以分期吗?
</div>
</li>
</li>
</ul>
</ul>
</div>
</div>
...
@@ -59,34 +29,52 @@
...
@@ -59,34 +29,52 @@
<div
class=
"btn"
>
在线留言
</div>
<div
class=
"btn"
>
在线留言
</div>
</div>
</div>
</div>
</div>
</card>
</div>
</div>
</div>
</template>
</template>
<
script
>
<
script
>
import
mTitle
from
'@/components/home/moduleTitle
'
import
Card
from
'@/components/Card
'
import
AppLink
from
'@/components/Link'
import
AppLink
from
'@/components/Link'
export
default
{
export
default
{
name
:
'commonProblem'
,
name
:
'commonProblem'
,
components
:
{
components
:
{
mTitle
,
Card
,
AppLink
AppLink
},
},
data
()
{
data
()
{
return
{
return
{
titleParams
:
{
problem
:
{
name
:
this
.
$t
(
'home.problem.title'
),
itemLeft
:
[
more
:
{
'Kelley商学院毕业生颁发的学位证书与在美国颁发的证书有何不同?'
,
path
:
'/apply/problem'
'本项目是上课形式是怎么样?'
,
}
'本项目学制多久?'
,
'能否顺利毕业拿到证书呢?'
,
'本项目是在职还是全职?'
],
itemRight
:
[
'如何申请Kelley商学院金融学硕士?'
,
'大概流程是什么?'
,
'需要提交哪些材料?'
,
'美国印第安纳大学Kelley商学院金融学硕士的学费是多少?'
,
'学费可以分期吗?'
]
},
},
textarea
:
''
textarea
:
''
}
}
},
computed
:
{
isMobile
()
{
return
this
.
$store
.
state
.
isMobile
}
}
}
}
}
</
script
>
</
script
>
<
style
lang=
"scss"
scoped
>
<
style
lang=
"scss"
scoped
>
.common-content-box
{
.is-pc
{
.common-content-box
{
width
:
1200px
;
width
:
1200px
;
margin
:
0
auto
;
margin
:
0
auto
;
padding-top
:
77px
;
padding-top
:
77px
;
...
@@ -160,5 +148,74 @@ export default {
...
@@ -160,5 +148,74 @@ export default {
}
}
}
}
}
}
}
}
.is-h5
{
.common-content-box
{
.content-mian
{
.msg-box
{
padding-top
:
.2rem
;
box-sizing
:
border-box
;
::v-deep
{
.el-textarea__inner
{
background
:
none
;
resize
:none
;
}
}
input
{
height
:
.29rem
;
border
:
.01rem
solid
rgba
(
153
,
153
,
153
,
.2
);
margin-top
:
.05rem
;
outline
:
none
;
width
:
100%
;
background
:
none
;
padding-left
:
.2rem
;
box-sizing
:
border-box
;
font-size
:
0
.1rem
;
color
:
#999999
;
}
.btn
{
height
:
0
.24rem
;
background
:
#AA1941
;
font-size
:
0
.12rem
;
text-align
:
center
;
color
:
#FFFFFF
;
margin-top
:
.1rem
;
line-height
:
.24rem
;
}
}
.list-box
{
ul
{
li
{
display
:
flex
;
align-items
:
center
;
padding
:
0
.04rem
0
0
.04rem
0
;
&
:nth-child
(
even
)
{
.text
{
background
:
none
;
}
}
.icon
{
width
:
0
.04rem
;
height
:
0
.04rem
;
background
:
#AA1941
;
border-radius
:
50%
;
}
.text
{
overflow
:
hidden
;
text-overflow
:ellipsis
;
white-space
:
nowrap
;
font-size
:
.12rem
;
color
:
#666666
;
padding-left
:
.02rem
;
width
:
100%
;
background
:
rgba
(
153
,
153
,
153
,
.2
);
margin-left
:
.07rem
;
}
}
}
}
}
}
}
}
</
style
>
</
style
>
\ No newline at end of file
components/home/news.vue
浏览文件 @
5c165e3d
<
template
>
<
template
>
<div
:class=
"isMobile ? 'is-h5' : 'is-pc'"
>
<div
class=
"news-content-box"
>
<div
class=
"news-content-box"
>
<m-title
:data=
"titleParams"
/>
<card
:title=
"$t('home.news.title')"
>
<template
#
header-aside
><nuxt-link
to=
"/news/hot"
>
{{
$t
(
'viewMore'
)
}}
</nuxt-link></
template
>
<div
class=
"content-box"
v-if=
"Object.keys(listData.first).length"
>
<div
class=
"content-box"
v-if=
"Object.keys(listData.first).length"
>
<div
class=
"news-left"
>
<div
class=
"news-left"
>
<app-link
:item=
"{ news: { data: listData.first, path: '/news/hot' } }"
>
<app-link
:item=
"{ news: { data: listData.first, path: '/news/hot' } }"
>
<img
:src=
"listData.first.web_img_uri"
alt=
""
/>
<img
:src=
"listData.first.web_img_uri"
alt=
""
/>
<div
class=
"mantle-box"
>
<div
class=
"mantle-box"
>
<div
class=
"tit
"
>
{{
listData
.
first
.
title
}}
</div>
<div
class=
"tit"
v-if=
"!isMobile
"
>
{{ listData.first.title }}
</div>
<div
class=
"con-txt"
>
{{ listData.first.abstract }}
</div>
<div
class=
"con-txt"
>
{{ listData.first.abstract }}
</div>
</div>
</div>
</app-link>
</app-link>
...
@@ -21,15 +23,17 @@
...
@@ -21,15 +23,17 @@
</li>
</li>
</ul>
</ul>
</div>
</div>
</card>
</div>
</div>
</div>
</template>
</template>
<
script
>
<
script
>
import
mTitle
from
'@/components/home/moduleTitle
'
import
Card
from
'@/components/Card
'
import
AppLink
from
'@/components/Link'
import
AppLink
from
'@/components/Link'
export
default
{
export
default
{
name
:
'news'
,
name
:
'news'
,
components
:
{
components
:
{
mTitle
,
Card
,
AppLink
AppLink
},
},
async
fetch
()
{
async
fetch
()
{
...
@@ -42,7 +46,7 @@ export default {
...
@@ -42,7 +46,7 @@ export default {
return
{
return
{
data
:
[],
data
:
[],
titleParams
:
{
titleParams
:
{
name
:
this
.
$t
(
'home.news.title'
)
,
name
:
'最新动态'
,
more
:
{
more
:
{
path
:
'/news/hot'
path
:
'/news/hot'
}
}
...
@@ -53,6 +57,9 @@ export default {
...
@@ -53,6 +57,9 @@ export default {
listData
()
{
listData
()
{
const
[
first
=
{},
...
list
]
=
this
.
data
const
[
first
=
{},
...
list
]
=
this
.
data
return
{
first
,
list
:
list
||
[]
}
return
{
first
,
list
:
list
||
[]
}
},
isMobile
()
{
return
this
.
$store
.
state
.
isMobile
}
}
},
},
methods
:
{
methods
:
{
...
@@ -65,7 +72,8 @@ export default {
...
@@ -65,7 +72,8 @@ export default {
}
}
</
script
>
</
script
>
<
style
lang=
"scss"
scoped
>
<
style
lang=
"scss"
scoped
>
.news-content-box
{
.is-pc
{
.news-content-box
{
width
:
1200px
;
width
:
1200px
;
margin
:
0
auto
;
margin
:
0
auto
;
padding-top
:
65px
;
padding-top
:
65px
;
...
@@ -149,5 +157,72 @@ export default {
...
@@ -149,5 +157,72 @@ export default {
}
}
}
}
}
}
}
}
.is-h5
{
.news-content-box
{
.content-box
{
// height: 2.18rem;
position
:
relative
;
img
{
width
:
100%
;
height
:
100%
;
display
:
block
;
}
.news-left
{
position
:
relative
;
}
.mantle-box
{
width
:
100%
;
position
:
absolute
;
bottom
:
0
;
left
:
0
;
background
:
rgba
(
8
,
8
,
8
,
0
.45
);
padding-bottom
:
.14rem
;
.con-txt
{
font-size
:
0
.12rem
;
font-weight
:
bold
;
line-height
:
0
.17rem
;
color
:
#FFFFFF
;
padding
:
.14rem
.32rem
0
.19rem
;
overflow
:
hidden
;
display
:
-
webkit-box
;
-webkit-box-orient
:
vertical
;
-webkit-line-clamp
:
2
;
}
}
}
.news-right
{
li
{
margin-top
:
.1rem
;
padding
:
.13rem
.14rem
.11rem
.12rem
;
background
:
#fff
;
.time
{
font-size
:
0
.1rem
;
line-height
:
100%
;
color
:
#AB0A3D
;
}
.news-r-title
{
font-size
:
0
.14rem
;
color
:
#333333
;
margin-top
:
.1rem
;
line-height
:
0
.21rem
;
overflow
:
hidden
;
display
:
-
webkit-box
;
-webkit-box-orient
:
vertical
;
-webkit-line-clamp
:
2
;
}
.del
{
font-size
:
0
.11rem
;
line-height
:
0
.2rem
;
color
:
#666666
;
overflow
:
hidden
;
display
:
-
webkit-box
;
-webkit-box-orient
:
vertical
;
-webkit-line-clamp
:
2
;
}
}
}
}
}
}
</
style
>
</
style
>
components/home/openClass.vue
浏览文件 @
5c165e3d
<
template
>
<
template
>
<div
:class=
"isMobile ? 'is-h5' : 'is-pc'"
>
<template
v-if=
"!isMobile"
>
<div
class=
"alumni-content max-width"
>
<div
class=
"alumni-content max-width"
>
<m-title
:data=
"titleParams"
class=
"m-title"
/
>
<card
:title=
"$t('home.course.title')"
>
<div
class=
"swiper-content"
@
mouseenter=
"swiperStop"
@
mouseleave=
"swiperStart"
>
<div
class=
"swiper-content"
@
mouseenter=
"swiperStop"
@
mouseleave=
"swiperStart"
>
<div
v-swiper:mySwiper=
"swiperOption"
ref=
"mySwiper"
>
<div
v-swiper:mySwiper=
"swiperOption"
ref=
"mySwiper"
>
<div
class=
"swiper-wrapper"
>
<div
class=
"swiper-wrapper"
>
...
@@ -13,26 +15,41 @@
...
@@ -13,26 +15,41 @@
</div>
</div>
</div>
</div>
</div>
</div>
</card>
</div>
</
template
>
<
template
v-else
>
<card
:title=
"$t('home.course.title')"
>
<van-swipe
class=
"my-swipe"
:loop=
"true"
:autoplay=
"5000"
:show-indicators=
"false"
>
<template
v-for=
"(item, index) in listData"
>
<van-swipe-item
:key=
"index"
>
<div
class=
"case"
>
<app-link
:item=
"
{ news: { data: item, path: '/news/hot' } }">
<img
:src=
"item.web_img_uri"
class=
"case-pic"
/>
<p
class=
"case-title"
>
{{
item
.
title
}}
</p>
</app-link>
</div>
</van-swipe-item>
</
template
>
</van-swipe>
</card>
</template>
</div>
</div>
</template>
</template>
<
script
>
<
script
>
import
mTitle
from
'@/components/home/moduleTitle
'
import
Card
from
'@/components/Card
'
import
AppLink
from
'@/components/Link'
import
AppLink
from
'@/components/Link'
export
default
{
export
default
{
name
:
'openClass'
,
name
:
'openClass'
,
components
:
{
components
:
{
mTitle
,
Card
,
AppLink
AppLink
},
},
data
()
{
data
()
{
const
_this
=
this
const
_this
=
this
return
{
return
{
titleParams
:
{
name
:
this
.
$t
(
'home.course.title'
)
},
isScale
:
false
,
isScale
:
false
,
listData
:
[],
listData
:
[],
// 轮播图配置信息, 更多请参考 swiper.js 中文网,上面很详细。
swiperOption
:
{
swiperOption
:
{
observer
:
true
,
observer
:
true
,
observeParents
:
true
,
observeParents
:
true
,
...
@@ -58,13 +75,13 @@ export default {
...
@@ -58,13 +75,13 @@ export default {
computed
:
{
computed
:
{
swiper
()
{
swiper
()
{
return
this
.
$refs
.
mySwiper
.
swiper
return
this
.
$refs
.
mySwiper
.
swiper
},
isMobile
()
{
return
this
.
$store
.
state
.
isMobile
}
}
},
},
created
()
{},
created
()
{},
mounted
()
{
mounted
()
{
if
(
document
.
documentElement
.
clientWidth
<
1400
)
{
// this.isScale = true
}
},
},
methods
:
{
methods
:
{
swiperStop
()
{
swiperStop
()
{
...
@@ -77,11 +94,13 @@ export default {
...
@@ -77,11 +94,13 @@ export default {
}
}
</
script
>
</
script
>
<
style
lang=
"scss"
scoped
>
<
style
lang=
"scss"
scoped
>
.max-width
{
.is-pc
{
.max-width
{
width
:
1200px
;
width
:
1200px
;
margin
:
0
auto
;
margin
:
0
auto
;
}
}
.alumni-content
{
.alumni-content
{
padding-top
:
89px
;
padding-top
:
89px
;
.title-content
{
.title-content
{
display
:
flex
;
display
:
flex
;
...
@@ -143,8 +162,29 @@ export default {
...
@@ -143,8 +162,29 @@ export default {
margin-top
:
0
;
margin-top
:
0
;
}
}
}
}
}
}
}
.scale
{
.is-h5
{
transform
:
scale
(
0
.85
);
.case
{
position
:
relative
;
}
.case-pic
{
display
:
block
;
width
:
100%
;
height
:
1
.17rem
;
object-fit
:
cover
;
}
.case-title
{
position
:
absolute
;
left
:
0
;
right
:
0
;
bottom
:
0
;
height
:
0
.24rem
;
padding
:
0
0
.1rem
;
font-size
:
0
.1rem
;
line-height
:
0
.24rem
;
color
:
#fff
;
background-color
:
rgba
(
0
,
0
,
0
,
0
.5
);
}
}
}
</
style
>
</
style
>
components/home/presence.vue
浏览文件 @
5c165e3d
<
template
>
<
template
>
<div
:class=
"isMobile ? 'is-h5' : 'is-pc'"
>
<div
class=
"presence-content-box"
>
<div
class=
"presence-content-box"
>
<m-title
:data=
"titleParams"
class=
"m-title"
/>
<card
:title=
"$t('home.presence.title')"
class=
"card-style"
>
<template
#
header-aside
><nuxt-link
to=
"/alumni/sharing"
>
{{
$t
(
'viewMore'
)
}}
</nuxt-link></
template
>
</card>
<div
class=
"content-mian"
>
<div
class=
"content-mian"
>
<div
class=
"banner-box"
@
mouseenter=
"swiperStop"
@
mouseleave=
"swiperStart"
>
<van-swipe
class=
"my-swipe"
:autoplay=
"5000"
:vertical=
"true"
indicator-color=
"white"
>
<div
v-swiper:mySwiper=
"swiperOption"
ref=
"mySwiper"
>
<
template
v-for=
"(item, index) in listData"
>
<div
class=
"swiper-wrapper"
>
<van-swipe-item
:key=
"index"
>
<div
class=
"swiper-slide"
v-for=
"(item, index) in listData"
:key=
"index"
>
<app-link
:item=
"
{ news: { data: item, path: '/news/hot' } }">
<app-link
:item=
"
{ news: { data: item, path: '/news/hot' } }">
<img
:src=
"item.web_img_uri"
/>
<img
:src=
"item.web_img_uri"
/>
</app-link>
</app-link>
</div>
</van-swipe-item>
</div>
</
template
>
<div
class=
"swiper-pagination swiper-pagination-bullets"
></div>
</van-swipe>
</div>
<div
class=
"form-box"
>
</div>
<div
class=
"title-box"
>
<div
class=
"enroll-box"
>
<div
class=
"bt"
v-html=
"$t('home.presence.tips1')"
></div>
<div
class=
"left-content"
>
<div
class=
"tit"
v-html=
"$t('home.presence.tips1')"
></div>
<div
class=
"tips"
>
{{ $t('home.presence.tips2') }}
</div>
<div
class=
"tips"
>
{{ $t('home.presence.tips2') }}
</div>
</div>
</div>
<div
class=
"right-content
"
>
<div
class=
"form
"
>
<div
class=
"li"
>
<div
class=
"li"
>
<el-select
v-model=
"form.years"
:placeholder=
"$t('home.presence.yearsholder')"
>
<el-select
v-model=
"form.years"
:placeholder=
"$t('home.presence.yearsholder')"
>
<el-option
v-for=
"item in yearsOptions"
:key=
"item.value"
:label=
"item.label"
:value=
"item.value"
>
<el-option
v-for=
"item in yearsOptions"
:key=
"item.value"
:label=
"item.label"
:value=
"item.value"
>
...
@@ -43,16 +43,17 @@
...
@@ -43,16 +43,17 @@
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
</template>
<
script
>
<
script
>
import
mTitle
from
'@/components/home/moduleTitle
'
import
Card
from
'@/components/Card
'
import
AppLink
from
'@/components/Link'
import
AppLink
from
'@/components/Link'
import
{
postNes
}
from
'@/api'
import
{
postNes
}
from
'@/api'
export
default
{
export
default
{
name
:
'presence'
,
name
:
'presence'
,
components
:
{
components
:
{
mTitle
,
Card
,
AppLink
AppLink
},
},
data
()
{
data
()
{
...
@@ -98,7 +99,6 @@ export default {
...
@@ -98,7 +99,6 @@ export default {
degree
:
''
,
degree
:
''
,
name
:
''
,
name
:
''
,
phone
:
''
,
phone
:
''
,
// channel: 19960,
project_id
:
process
.
env
.
newProjectId
project_id
:
process
.
env
.
newProjectId
},
},
value
:
''
,
value
:
''
,
...
@@ -109,19 +109,6 @@ export default {
...
@@ -109,19 +109,6 @@ export default {
}
}
},
},
listData
:
[],
listData
:
[],
swiperOption
:
{
speed
:
400
,
// autoplay: true,
delay
:
3000
,
loop
:
true
,
pagination
:
{
el
:
'.swiper-pagination'
,
clickable
:
true
},
direction
:
'vertical'
,
height
:
500
// autoHeight: true
}
}
}
},
},
async
fetch
()
{
async
fetch
()
{
...
@@ -131,6 +118,9 @@ export default {
...
@@ -131,6 +118,9 @@ export default {
computed
:
{
computed
:
{
swiper
()
{
swiper
()
{
return
this
.
$refs
.
mySwiper
.
swiper
return
this
.
$refs
.
mySwiper
.
swiper
},
isMobile
()
{
return
this
.
$store
.
state
.
isMobile
}
}
},
},
mounted
()
{},
mounted
()
{},
...
@@ -173,7 +163,12 @@ export default {
...
@@ -173,7 +163,12 @@ export default {
</
script
>
</
script
>
<
style
lang=
"scss"
scoped
>
<
style
lang=
"scss"
scoped
>
.presence-content-box
{
.is-pc
{
.card-style
{
width
:
1200px
;
margin
:
0
auto
;
}
.presence-content-box
{
padding-top
:
80px
;
padding-top
:
80px
;
.m-title
{
.m-title
{
width
:
1200px
;
width
:
1200px
;
...
@@ -181,16 +176,15 @@ export default {
...
@@ -181,16 +176,15 @@ export default {
}
}
.content-mian
{
.content-mian
{
padding-top
:
24px
;
padding-top
:
24px
;
.banner-box
{
.my-swipe
{
height
:
500px
;
height
:
500px
;
overflow
:
hidden
;
img
{
img
{
width
:
100%
;
width
:
100%
;
height
:
520px
;
height
:
100%
;
display
:
block
;
display
:
block
;
}
}
}
}
.enroll
-box
{
.form
-box
{
width
:
1200px
;
width
:
1200px
;
height
:
540px
;
height
:
540px
;
margin
:
80px
auto
0
;
margin
:
80px
auto
0
;
...
@@ -198,13 +192,13 @@ export default {
...
@@ -198,13 +192,13 @@ export default {
background-size
:
100%
100%
;
background-size
:
100%
100%
;
display
:
flex
;
display
:
flex
;
justify-content
:
space-between
;
justify-content
:
space-between
;
.left-content
{
.title-box
{
width
:
592px
;
width
:
592px
;
height
:
223px
;
height
:
223px
;
background
:
rgba
(
170
,
25
,
65
,
0
.63
);
background
:
rgba
(
170
,
25
,
65
,
0
.63
);
box-shadow
:
0px
0px
122px
rgba
(
0
,
0
,
0
,
0
.07
);
box-shadow
:
0px
0px
122px
rgba
(
0
,
0
,
0
,
0
.07
);
margin-top
:
127px
;
margin-top
:
127px
;
.ti
t
{
.b
t
{
font-size
:
48px
;
font-size
:
48px
;
font-weight
:
bold
;
font-weight
:
bold
;
line-height
:
58px
;
line-height
:
58px
;
...
@@ -220,7 +214,7 @@ export default {
...
@@ -220,7 +214,7 @@ export default {
text-align
:
center
;
text-align
:
center
;
}
}
}
}
.right-content
{
.form
{
width
:
401px
;
width
:
401px
;
height
:
382px
;
height
:
382px
;
background
:
#ffffff
;
background
:
#ffffff
;
...
@@ -249,5 +243,82 @@ export default {
...
@@ -249,5 +243,82 @@ export default {
}
}
}
}
}
}
}
}
.is-h5
{
.card-width
{
width
:
100%
;
margin
:
0
;
::v-deep
{
.card-hd
{
margin
:
0
.2rem
0
.15rem
;
}
}
}
.presence-content-box
{
.my-swipe
{
height
:
1
.58rem
;
img
{
width
:
100%
;
height
:
100%
;
display
:
block
;
}
}
.form-box
{
background
:
url(https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley-h5/home-presen-bg-new1.png)
center
;
background-size
:
cover
;
padding-top
:
.18rem
;
box-sizing
:
border-box
;
margin-top
:
.27rem
;
padding-bottom
:
.05rem
;
.title-box
{
width
:
3
.75rem
;
height
:
1
.2rem
;
background
:
rgba
(
170
,
25
,
65
,
.63
);
box-shadow
:
0rem
0rem
1rem
rgba
(
0
,
0
,
0
,
0
.07
);
.bt
{
text-align
:
center
;
font-size
:
0
.26rem
;
// font-weight: bold;
line-height
:
0
.31rem
;
color
:
#FFFFFF
;
text-align
:
center
;
padding-top
:
.16rem
;
}
.tips
{
font-size
:
0
.1rem
;
line-height
:
0
.12rem
;
color
:
#FFFFFF
;
text-align
:
center
;
padding-top
:
.1rem
;
}
}
.form
{
width
:
2
.7rem
;
background
:
#FFFFFF
;
margin
:
.2rem
auto
;
padding
:
.25rem
.2rem
;
box-sizing
:
border-box
;
.li
{
margin-bottom
:
.2rem
;
}
::v-deep
{
.el-select
{
width
:
100%
;
height
:
100%
;
}
}
.btn
{
font-size
:
.12rem
;
line-height
:
.16rem
;
color
:
#ffffff
;
background
:
#aa1941
;
border-radius
:
.02rem
;
text-align
:
center
;
cursor
:
pointer
;
}
}
}
}
}
}
</
style
>
</
style
>
\ No newline at end of file
components/home/projectFeatures.vue
浏览文件 @
5c165e3d
...
@@ -15,12 +15,10 @@
...
@@ -15,12 +15,10 @@
</
template
>
</
template
>
<
script
>
<
script
>
import
Card
from
'@/components/Card'
import
Card
from
'@/components/Card'
import
mTitle
from
'@/components/home/moduleTitle'
import
AppLink
from
'@/components/Link'
import
AppLink
from
'@/components/Link'
export
default
{
export
default
{
name
:
'projectFeatures'
,
name
:
'projectFeatures'
,
components
:
{
components
:
{
mTitle
,
AppLink
,
AppLink
,
Card
Card
},
},
...
...
components/home/schoolRanking.vue
浏览文件 @
5c165e3d
<
template
>
<
template
>
<div
:class=
"isMobile ? 'is-h5' : 'is-pc'"
>
<div
class=
"ranking-content-box"
>
<div
class=
"ranking-content-box"
>
<div
class=
"title"
>
<div
class=
"title"
>
<div
class=
"line"
></div>
<div
class=
"line"
></div>
...
@@ -24,7 +25,7 @@
...
@@ -24,7 +25,7 @@
<div
class=
"p"
v-html=
"$t('home.ranking.item2Txt1')"
></div>
<div
class=
"p"
v-html=
"$t('home.ranking.item2Txt1')"
></div>
</div>
</div>
<div
class=
"item"
>
<div
class=
"item"
>
<div
class=
"tit
"
><span>
No.
</span>
1
</div>
<div
class=
"tit"
style=
"padding-top: .32rem;
"
><span>
No.
</span>
1
</div>
<div
class=
"p"
v-html=
"$t('home.ranking.item2Txt2')"
></div>
<div
class=
"p"
v-html=
"$t('home.ranking.item2Txt2')"
></div>
</div>
</div>
</div>
</div>
...
@@ -41,14 +42,21 @@
...
@@ -41,14 +42,21 @@
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</
template
>
</
template
>
<
script
>
<
script
>
export
default
{
export
default
{
name
:
'schoolRanking'
name
:
'schoolRanking'
,
computed
:
{
isMobile
()
{
return
this
.
$store
.
state
.
isMobile
}
}
}
}
</
script
>
</
script
>
<
style
lang=
"scss"
scoped
>
<
style
lang=
"scss"
scoped
>
.ranking-content-box
{
.is-pc
{
.ranking-content-box
{
margin-top
:
57px
;
margin-top
:
57px
;
width
:
100%
;
width
:
100%
;
height
:
680px
;
height
:
680px
;
...
@@ -116,5 +124,78 @@ export default {
...
@@ -116,5 +124,78 @@ export default {
}
}
}
}
}
}
}
}
.is-h5
{
.ranking-content-box
{
margin-top
:
.2rem
;
width
:
100%
;
min-height
:
2
.84rem
;
background
:
url(https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/kelley-h5/home-ranking-bg.png)
center
;
background-size
:
cover
;
padding
:
0
.1rem
;
box-sizing
:
border-box
;
.title
{
width
:
3
.41rem
;
display
:
flex
;
margin
:
0
auto
;
justify-content
:
space-between
;
align-items
:
center
;
padding
:
.27rem
0
.26rem
;
.line
{
width
:
1rem
;
height
:
.01rem
;
background
:
#FFFFFF
;
}
.name
{
font-size
:
0
.17rem
;
font-weight
:
bold
;
line-height
:
0
.33rem
;
color
:
#FFFFFF
;
}
}
.content-mian
{
// width: 1000px;
// margin: 0 auto;
display
:
flex
;
justify-content
:
space-between
;
.li
{
width
:
1
.05rem
;
&
.mar-t
{
transform
:
translateY
(
-.15rem
);
.li-tit
{
line-height
:
0
.15rem
;
transform
:
translateY
(
.1rem
);
}
}
.li-tit
{
text-align
:
center
;
font-size
:
0
.13rem
;
line-height
:
100%
;
color
:
#fff
;
}
.item
{
.tit
{
padding-top
:
.15rem
;
font-size
:
0
.24rem
;
color
:
#FFFFFF
;
text-align
:
center
;
margin-bottom
:
.03rem
;
line-height
:
100%
;
span
{
font-size
:
.12rem
;
}
}
.p
{
font-size
:
0
.1rem
;
line-height
:
0
.16rem
;
margin-bottom
:
.05rem
;
color
:
#FFFFFF
;
text-align
:
center
;
}
}
}
}
}
}
}
</
style
>
</
style
>
\ No newline at end of file
pages/index.vue
浏览文件 @
5c165e3d
...
@@ -56,6 +56,6 @@ export default {
...
@@ -56,6 +56,6 @@ export default {
<
style
>
<
style
>
.container
{
.container
{
width
:
100%
;
width
:
100%
;
padding-bottom
:
10
0px
;
padding-bottom
:
5
0px
;
}
}
</
style
>
</
style
>
编写
预览
Markdown
格式
0%
重试
或
添加新文件
添加附件
取消
您添加了
0
人
到此讨论。请谨慎行事。
请先完成此评论的编辑!
取消
请
注册
或者
登录
后发表评论