调整首页

This commit is contained in:
2021-11-23 15:47:47 +08:00
parent e4f40ebb9a
commit ed19a7f0ce
2 changed files with 421 additions and 300 deletions

View File

@@ -187,7 +187,7 @@ body {
.banner-nav li {
display: inline-block;
padding: 0 22px;
padding: 0 18px;
font-size: 17px;
}
@@ -384,6 +384,36 @@ body {
margin-right: 5px;
}
.indexImg-title {
position: absolute;
z-index:5;
left: 0;
bottom: 0;
background-color: rgba(0,0,0,.5);
width: 100%;
color: #fff;
padding: 10px 15px;
box-sizing: border-box;
font-size: 16px;
}
.indexImg-pagination, .indexNews-pagination {
text-align: right !important;
padding-right: 20px!important;
bottom: 16px!important;
}
.swiper-pagination-bullet {
background: #ffffff!important;
opacity: .5!important;
}
.swiper-pagination-bullet-active {
opacity: 1;
background: #449942!important;
}
/*首页模块二*/
.modularTwo {
overflow: hidden;
@@ -845,21 +875,56 @@ body {
top: 64px;
}
.briefSurvey {
overflow: hidden;
}
.briefSurvey-cont-text {
font-size: 14px;
color: #353535;
line-height: 30px;
height: 154px;
overflow: hidden;
text-indent: 2em;
text-align: justify;
}
.briefSurvey-cont-img {
float: left;
margin-right: 40px;
width: 400px;
}
.briefSurvey-cont {
float: right;
margin: 0 0 10px 15px;
width: calc(100% - 440px);
}
.briefSurvey-cont-new {
font-size: 22px;
text-align: center;
font-weight: 600;
margin-bottom: 10px;
}
.baseMap {
background-color: #efefef;
width: 100%;
height: 80px;
position: relative;
margin-bottom: 40px;
margin-top: 10px;
}
.baseMap-img {
position: absolute;
right: 10px;
top: -70px;
width: 160px;
height: 160px;
}
.briefSurvey-more {
text-align: center;
margin-top: 30px;
transition: .2s;
cursor: pointer;

View File

@@ -35,8 +35,21 @@
<div class="row">
@if (getArticlesBYCate(66,7)->isNotEmpty())
<div class="col-md-6 col-xs-12">
<div class="indexNew-img ce-img">
<span style="background-image: url({{getArticlesBYCate(66,8)->first()->cover_url}});"></span>
<div class="swiper-container indexBig">
<div class="swiper-wrapper">
@foreach (getArticlesCoverByCate(66,5) as $info)
<div class="swiper-slide">
<div class="indexNew-img ce-img">
<span style="background-image: url({{ $info->cover_url}});"></span>
<div class="ce-nowrap indexImg-title">
{{ $info->title }}
</div>
</div>
</div>
@endforeach
</div>
<!-- Add Pagination -->
<div class="swiper-pagination indexImg-pagination"></div>
</div>
</div>
<div class="col-md-6 col-xs-12">
@@ -60,8 +73,27 @@
<div class="row">
@if (getArticlesBYCate(67,7)->isNotEmpty())
<div class="col-md-6 col-xs-12">
<div class="indexNew-img ce-img">
<span style="background-image: url({{getArticlesBYCate(67,8)->first()->cover_url}});"></span>
<div class="swiper-container indexNew">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="indexNew-img ce-img">
<span style="background-image: url({{getArticlesBYCate(66,8)->first()->cover_url}});"></span>
<div class="ce-nowrap indexImg-title">
黑龙江省科学院大庆分院1
</div>
</div>
</div>
<div class="swiper-slide">
<div class="indexNew-img ce-img">
<span style="background-image: url({{getArticlesBYCate(66,8)->first()->cover_url}});"></span>
<div class="ce-nowrap indexImg-title">
黑龙江省科学院大庆分院2
</div>
</div>
</div>
</div>
<!-- Add Pagination -->
<div class="swiper-pagination indexImg-pagination indexNew-pagination"></div>
</div>
</div>
<div class="col-md-6 col-xs-12">
@@ -82,236 +114,238 @@
</div>
</div>
</div>
</div>
<!-- 模块一 -->
<div class="container">
<div class="row">
<div class="col-md-4 col-xs-12">
<div class="modularOne-label">
<img class="modularOne-icon" src="/assets/index/images/indexIcon/titleIcon_02.png"/>
<span data-href="{{ getOneCategory(17,'link') }}">{{ getOneCategory(17,'title') }}</span>
<img class="modularOne-img" src="/assets/index/images/indexIcon/titleIcon_02.png"/>
</div>
</div>
<div class="col-md-4 col-xs-12">
<div class="modularOne-label">
<img class="modularOne-icon" src="/assets/index/images/indexIcon/titleIcon_03.png"/>
<span data-href="{{ getOneCategory(26,'link') }}">{{ getOneCategory(26,'title') }}</span>
<img class="modularOne-img" src="/assets/index/images/indexIcon/titleIcon_03.png"/>
</div>
</div>
<div class="col-md-4 col-xs-12">
<div class="modularOne-label">
<img class="modularOne-icon" src="/assets/index/images/indexIcon/titleIcon_04.png"/>
<span data-href="{{ getOneCategory(6,'link') }}">{{ getOneCategory(6,'title') }}</span>
<img class="modularOne-img" src="/assets/index/images/indexIcon/titleIcon_04.png"/>
</div>
</div>
</div>
</div>
<!-- 模块二 -->
<div class="container">
{{--科学研究与特色品牌建设--}}
<div class="publicTab">
<ul class="publicTab-ul">
<li role="presentation" class="active">
<img src="/assets/index/images/indexIcon/titleIcon_05.png"/>
{{ getOneCategory(2,'title') }}
</li>
</ul>
<div class="publicTab-more" data-href="{{ getOneCategory(2,'link') }}">更多<span>+</span></div>
</div>
<div class="modularTwo">
<div class="row">
@if (getArticlesBYCate(18,10)->isNotEmpty())
@foreach (getArticlesBYCate(18,10) as $info)
<div class="publicHover modularTwo-list col-xs-12" data-href="{{ $info->link }}">
<div class="ce-img modularTwo-list-img">
<!-- 图片比例4:3 -->
<span style="background-image: url({{ $info->cover_url }});"></span>
</div>
<div class="ce-nowrap modularTwo-list-name">{{ $info->title }}</div>
</div>
@endforeach
@endif
</div>
</div>
</div>
<!-- 模块三 -->
<div class="container">
{{--省级领军人才梯队--}}
<div class="publicTab">
<ul class="publicTab-ul">
<li role="presentation" class="active">
<img src="/assets/index/images/indexIcon/titleIcon_06.png"/>
{{ getOneCategory(31,'title') }}
</li>
</ul>
</div>
<div class="modularThree">
<div class="row">
@if (getArticlesBYCate(31,3)->isNotEmpty())
@foreach (getArticlesBYCate(31,3) as $info)
<div class="publicHover col-md-4 col-xs-12" data-href="{{ $info->link }}">
<div class="modularThree-back">
<div class="modularThree-name">{{ $info->title }}</div>
<div class="modularThree-list">
<div class="ce-img modularThree-list-img">
<!-- 图片比例5:3 -->
<span style="background-image: url({{ $info->cover_url }});"></span>
</div>
<div class="ce-nowrap-multi modularThree-list-text">
{{ $info->description }}
</div>
</div>
</div>
</div>
@endforeach
@endif
</div>
</div>
</div>
<!-- 模块四 -->
<div class="container">
{{--院级重点学科--}}
<div class="publicTab">
<ul class="publicTab-ul">
<li role="presentation" class="active">
<img src="/assets/index/images/indexIcon/titleIcon_07.png"/>
{{ getOneCategory(32,'title') }}
</li>
</ul>
</div>
<div class="modularThree">
<div class="row">
@if (getArticlesBYCate(32,3)->isNotEmpty())
@foreach (getArticlesBYCate(32,3) as $info)
<div class="publicHover col-md-4 col-xs-12" data-href="{{ $info->link }}">
<div class="modularThree-back">
<div class="modularThree-name">{{ $info->title }}</div>
<div class="modularThree-list">
<div class="ce-img modularThree-list-img">
<!-- 图片比例5:3 -->
<span style="background-image: url({{ $info->cover_url }});"></span>
</div>
<div class="ce-nowrap-multi modularThree-list-text">
{{ $info->description }}
</div>
</div>
</div>
</div>
@endforeach
@endif
</div>
</div>
</div>
<!-- 模块五 -->
<div class="container">
<div class="publicTab">
<ul class="publicTab-ul">
<li role="presentation" class="active">
<img src="/assets/index/images/indexIcon/titleIcon_08.png"/>
{{ getOneCategory(5,'title') }}
</li>
</ul>
</div>
<div class="modularFive">
<div class="row">
@if(getCateChild(5,3)->isNotEmpty())
@foreach(getCateChild(5,3) as $cate)
<div class="col-md-4 col-xs-12">
<div class="modularFive-top">
<span>{{ $cate->title }}</span>
</div>
<div class="modularThree-back">
<div class="modularThree-list">
<div class="ce-img modularFive-img">
<!-- 图片比例3:2 -->
<span style="background-image: url({{ $cate->cover_url }});"></span>
</div>
<ul class="modularFive-list">
@if (getArticlesBYCate($cate->id,3)->isNotEmpty())
@foreach (getArticlesBYCate($cate->id,3) as $info)
<li class="publicHover ce-nowrap-multi" data-href="{{ $info->link }}">
{{ $info->title }}
</li>
@endforeach
@endif
</ul>
</div>
<div class="modularFive-more" data-href="{{ $cate->link }}">
<span>查看更多</span><img src="/assets/index/images/indexIcon/indexRow.png"/>
</div>
</div>
</div>
@endforeach
@endif
</div>
</div>
</div>
<!-- 广告图片 -->
<div class="container">
<div class="indexAdvert">
<div class="row">
<div class="col-xs-12 col-md-12"
@if(getOneAdvertByCate(35,'url')) data-href="{{ getOneAdvertByCate(35,'url') }}" @endif>
<img src="{{ getOneAdvertByCate(35,'cover_url') }}"/>
</div>
</div>
</div>
</div>
<!-- 模块六 -->
<div class="container">
<div class="publicTab">
<ul class="publicTab-ul">
<li role="presentation" class="active">
<img src="/assets/index/images/indexIcon/titleIcon_09.png"/>
{{ getOneCategory(43,'title') }}
</li>
</ul>
</div>
<div class="modularSix">
<!-- 模块一 -->
<div class="container">
<div class="row">
<div class="col-md-4 col-xs-12">
<div class="modularThree-back">
@if (getArticlesBYCate(43,3,1)->isNotEmpty())
@foreach (getArticlesBYCate(43,3,1) as $info)
<div class="ce-img modularSix-img" data-href="{{ $info->link }}">
<!-- 图片比例5:3 -->
<span style="background-image: url({{ $info->cover_url }});"></span>
<div class="ce-nowrap modularThree-img-title"> {{ $info->title }}</div>
</div>
@endforeach
@endif
<div class="modularOne-label">
<img class="modularOne-icon" src="/assets/index/images/indexIcon/titleIcon_02.png"/>
<span data-href="{{ getOneCategory(17,'link') }}">{{ getOneCategory(17,'title') }}</span>
<img class="modularOne-img" src="/assets/index/images/indexIcon/titleIcon_02.png"/>
</div>
</div>
<div class="col-md-8 col-xs-12">
<div class="modularThree-back modularSix-space">
<div class="row">
@if (getArticlesBYCate(43,14)->isNotEmpty())
@foreach (getArticlesBYCate(43,14) as $info)
<div class="col-md-4 col-xs-12 modularSix-padding" data-href="{{ $info->link }}">
<div class="modularSix-label">
<div class="modularSix-label-cont">
<img src="{{ $info->logo_url }}"/>
<span>{{ $info->title }}</span>
</div>
<div class="col-md-4 col-xs-12">
<div class="modularOne-label">
<img class="modularOne-icon" src="/assets/index/images/indexIcon/titleIcon_03.png"/>
<span data-href="{{ getOneCategory(26,'link') }}">{{ getOneCategory(26,'title') }}</span>
<img class="modularOne-img" src="/assets/index/images/indexIcon/titleIcon_03.png"/>
</div>
</div>
<div class="col-md-4 col-xs-12">
<div class="modularOne-label">
<img class="modularOne-icon" src="/assets/index/images/indexIcon/titleIcon_04.png"/>
<span data-href="{{ getOneCategory(6,'link') }}">{{ getOneCategory(6,'title') }}</span>
<img class="modularOne-img" src="/assets/index/images/indexIcon/titleIcon_04.png"/>
</div>
</div>
</div>
</div>
<!-- 模块二 -->
<div class="container">
{{--科学研究与特色品牌建设--}}
<div class="publicTab">
<ul class="publicTab-ul">
<li role="presentation" class="active">
<img src="/assets/index/images/indexIcon/titleIcon_05.png"/>
{{ getOneCategory(18,'title') }}
</li>
</ul>
<div class="publicTab-more" data-href="{{ getOneCategory(18,'link') }}">更多<span>+</span></div>
</div>
<div class="modularTwo">
<div class="row">
@if (getArticlesBYCate(18,10)->isNotEmpty())
@foreach (getArticlesBYCate(18,10) as $info)
<div class="publicHover modularTwo-list col-xs-12" data-href="{{ $info->link }}">
<div class="ce-img modularTwo-list-img">
<!-- 图片比例4:3 -->
<span style="background-image: url({{ $info->cover_url }});"></span>
</div>
<div class="ce-nowrap modularTwo-list-name">{{ $info->title }}</div>
</div>
@endforeach
@endif
</div>
</div>
</div>
<!-- 模块三 -->
<div class="container">
{{--省级领军人才梯队--}}
<div class="publicTab">
<ul class="publicTab-ul">
<li role="presentation" class="active">
<img src="/assets/index/images/indexIcon/titleIcon_06.png"/>
{{ getOneCategory(31,'title') }}
</li>
</ul>
</div>
<div class="modularThree">
<div class="row">
@if (getArticlesBYCate(31,3)->isNotEmpty())
@foreach (getArticlesBYCate(31,3) as $info)
<div class="publicHover col-md-4 col-xs-12" data-href="{{ $info->link }}">
<div class="modularThree-back">
<div class="modularThree-name">{{ $info->title }}</div>
<div class="modularThree-list">
<div class="ce-img modularThree-list-img">
<!-- 图片比例5:3 -->
<span style="background-image: url({{ $info->cover_url }});"></span>
</div>
<div class="ce-nowrap-multi modularThree-list-text">
{{ $info->description }}
</div>
</div>
</div>
</div>
@endforeach
@endif
</div>
</div>
</div>
<!-- 模块四 -->
<div class="container">
{{--院级重点学科--}}
<div class="publicTab">
<ul class="publicTab-ul">
<li role="presentation" class="active">
<img src="/assets/index/images/indexIcon/titleIcon_07.png"/>
{{ getOneCategory(32,'title') }}
</li>
</ul>
</div>
<div class="modularThree">
<div class="row">
@if (getArticlesBYCate(32,3)->isNotEmpty())
@foreach (getArticlesBYCate(32,3) as $info)
<div class="publicHover col-md-4 col-xs-12" data-href="{{ $info->link }}">
<div class="modularThree-back">
<div class="modularThree-name">{{ $info->title }}</div>
<div class="modularThree-list">
<div class="ce-img modularThree-list-img">
<!-- 图片比例5:3 -->
<span style="background-image: url({{ $info->cover_url }});"></span>
</div>
<div class="ce-nowrap-multi modularThree-list-text">
{{ $info->description }}
</div>
</div>
</div>
</div>
@endforeach
@endif
</div>
</div>
</div>
<!-- 模块五 -->
<div class="container">
<div class="publicTab">
<ul class="publicTab-ul">
<li role="presentation" class="active">
<img src="/assets/index/images/indexIcon/titleIcon_08.png"/>
{{ getOneCategory(5,'title') }}
</li>
</ul>
</div>
<div class="modularFive">
<div class="row">
@if(getCateChild(5,3)->isNotEmpty())
@foreach(getCateChild(5,3) as $cate)
<div class="col-md-4 col-xs-12">
<div class="modularFive-top">
<span>{{ $cate->title }}</span>
</div>
<div class="modularThree-back">
<div class="modularThree-list">
<div class="ce-img modularFive-img">
<!-- 图片比例3:2 -->
<span style="background-image: url({{ $cate->cover_url }});"></span>
</div>
<ul class="modularFive-list">
@if (getArticlesBYCate($cate->id,3)->isNotEmpty())
@foreach (getArticlesBYCate($cate->id,3) as $info)
<li class="publicHover ce-nowrap-multi"
data-href="{{ $info->link }}">
{{ $info->title }}
</li>
@endforeach
@endif
</ul>
</div>
<div class="modularFive-more" data-href="{{ $cate->link }}">
<span>查看更多</span><img src="/assets/index/images/indexIcon/indexRow.png"/>
</div>
</div>
</div>
@endforeach
@endif
</div>
</div>
</div>
<!-- 广告图片 -->
<div class="container">
<div class="indexAdvert">
<div class="row">
<div class="col-xs-12 col-md-12"
@if(getOneAdvertByCate(35,'url')) data-href="{{ getOneAdvertByCate(35,'url') }}" @endif>
<img src="{{ getOneAdvertByCate(35,'cover_url') }}"/>
</div>
</div>
</div>
</div>
<!-- 模块六 -->
<div class="container">
<div class="publicTab">
<ul class="publicTab-ul">
<li role="presentation" class="active">
<img src="/assets/index/images/indexIcon/titleIcon_09.png"/>
{{ getOneCategory(43,'title') }}
</li>
</ul>
</div>
<div class="modularSix">
<div class="row">
<div class="col-md-4 col-xs-12">
<div class="modularThree-back">
@if (getArticlesBYCate(43,3,1)->isNotEmpty())
@foreach (getArticlesBYCate(43,3,1) as $info)
<div class="ce-img modularSix-img" data-href="{{ $info->link }}">
<!-- 图片比例5:3 -->
<span style="background-image: url({{ $info->cover_url }});"></span>
<div class="ce-nowrap modularThree-img-title"> {{ $info->title }}</div>
</div>
@endforeach
@endif
<div class="col-md-4 col-xs-12 modularSix-padding">
<div class="modularSix-label">
<div class="modularSix-label-cont" data-href="{{ getOneCategory(43,'link') }}">
<img src="/assets/index/images/indexIcon/titleTem_14.png"/>
<span>查看更多 &gt;&gt;</span>
</div>
</div>
<div class="col-md-8 col-xs-12">
<div class="modularThree-back modularSix-space">
<div class="row">
@if (getArticlesBYCate(43,14)->isNotEmpty())
@foreach (getArticlesBYCate(43,14) as $info)
<div class="col-md-4 col-xs-12 modularSix-padding"
data-href="{{ $info->link }}">
<div class="modularSix-label">
<div class="modularSix-label-cont">
<img src="{{ $info->logo_url }}"/>
<span>{{ $info->title }}</span>
</div>
</div>
</div>
@endforeach
@endif
<div class="col-md-4 col-xs-12 modularSix-padding">
<div class="modularSix-label">
<div class="modularSix-label-cont" data-href="{{ getOneCategory(43,'link') }}">
<img src="/assets/index/images/indexIcon/titleTem_14.png"/>
<span>查看更多 &gt;&gt;</span>
</div>
</div>
</div>
</div>
@@ -320,91 +354,113 @@
</div>
</div>
</div>
</div>
<!-- 模块七 -->
<div class="container">
<div class="modularSever">
<div class="row">
{{--人才队伍--}}
<div class="col-xs-12 col-md-9">
<div class="publicTab" style="margin-bottom: 0">
<ul class="publicTab-ul">
<li role="presentation" class="active">
<img src="/assets/index/images/indexIcon/titleIcon_10.png"/>
{{ getOneCategory(3,'title') }}
</li>
</ul>
<div class="publicTab-more" data-href="{{ getOneCategory(3,'link') }}">更多<span>+</span></div>
</div>
<div class="modularThree-back modularSix-space">
<div class="row">
@if(getCateChild(42)->isNotEmpty())
@foreach(getCateChild(42) as $cate)
<div class="col-xs-12 col-md-4 modularSix-padding" data-href="{{ $cate->link }}">
<div class="modularServe-label">
<span> {{ $cate->title }}</span>
</div>
</div>
@endforeach
@endif
<!-- 模块七 -->
<div class="container">
<div class="modularSever">
<div class="row">
{{--人才队伍--}}
<div class="col-xs-12 col-md-9">
<div class="publicTab" style="margin-bottom: 0">
<ul class="publicTab-ul">
<li role="presentation" class="active">
<img src="/assets/index/images/indexIcon/titleIcon_10.png"/>
{{ getOneCategory(3,'title') }}
</li>
</ul>
<div class="publicTab-more" data-href="{{ getOneCategory(3,'link') }}">更多<span>+</span>
</div>
</div>
</div>
</div>
{{--政府决策服务--}}
<div class="col-xs-12 col-md-3">
<div class="publicTab" style="margin-bottom: 0">
<ul class="publicTab-ul">
<li role="presentation" class="active">
<img src="/assets/index/images/indexIcon/titleIcon_11.png"/>
{{ getOneCategory(27,'title') }}
</li>
</ul>
</div>
<div class="modularThree-back">
<ul class="modularServe-list">
@if (getArticlesBYCate(27,5)->isNotEmpty())
@foreach (getArticlesBYCate(27,5) as $info)
<li data-href="{{ $info->link }}">
<div class="ce-nowrap publicHover modularServe-name">
{{ $info->title }}
<div class="modularThree-back modularSix-space">
<div class="row">
@if(getCateChild(42)->isNotEmpty())
@foreach(getCateChild(42) as $cate)
<div class="col-xs-12 col-md-4 modularSix-padding"
data-href="{{ $cate->link }}">
<div class="modularServe-label">
<span> {{ $cate->title }}</span>
</div>
</div>
</li>
@endforeach
@endif
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- 模块七 -->
<div class="container">
<div class="modularEight">
<div class="row">
@if(getCateChild(73))
@foreach(getCateChild(73) as $cate)
<div class="col-xs-12 col-md-3"
@if($cate->url && $cate->type=='link')
data-href="{{ $cate->url }}"
@endforeach
@endif
/>
<div class="modularEight-label"
style="background-image: url({{ $cate->cover_url }});">
<div class="modularEight-title">{{ $cate->title }}</div>
</div>
</div>
</div>
{{--政府决策服务--}}
<div class="col-xs-12 col-md-3">
<div class="publicTab" style="margin-bottom: 0">
<ul class="publicTab-ul">
<li role="presentation" class="active">
<img src="/assets/index/images/indexIcon/titleIcon_11.png"/>
{{ getOneCategory(27,'title') }}
</li>
</ul>
</div>
<div class="modularThree-back">
<ul class="modularServe-list">
@if (getArticlesBYCate(27,5)->isNotEmpty())
@foreach (getArticlesBYCate(27,5) as $info)
<li data-href="{{ $info->link }}">
<div class="ce-nowrap publicHover modularServe-name">
{{ $info->title }}
</div>
</li>
@endforeach
@endif
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- 模块七 -->
<div class="container">
<div class="modularEight">
<div class="row">
@if(getCateChild(73))
@foreach(getCateChild(73) as $cate)
<div class="col-xs-12 col-md-3"
@if($cate->url && $cate->type=='link')
data-href="{{ $cate->url }}"
@endif
/>
<div class="modularEight-label"
style="background-image: url({{ $cate->cover_url }});">
<div class="modularEight-title">{{ $cate->title }}</div>
</div>
</div>
@endforeach
@endif
</div>
@endforeach
@endif
</div>
</div>
</div>
@endsection
@push('script')
<script type="text/javascript" src="{{ asset('assets/index/js/swiper.min.js') }}"></script>
<script type="text/javascript">
// 新闻轮播
var banner = new Swiper('.indexBig', {
pagination: '.indexImg-pagination',
paginationClickable: true,
spaceBetween: 30,
centeredSlides: true,
autoplay: 6000,
autoplayDisableOnInteraction: false
});
// 公告轮播
var banner = new Swiper('.indexNew', {
pagination: '.indexNew-pagination',
paginationClickable: true,
spaceBetween: 30,
centeredSlides: true,
autoplay: 6000,
autoplayDisableOnInteraction: false
});
$(document).ready(function () {
$('.new_list').click(function () {
var link = $(this).data('link');