632 lines
27 KiB
Vue
632 lines
27 KiB
Vue
<template>
|
|
<div>
|
|
<!-- <div class="ban"></div> -->
|
|
<div class="contant">
|
|
<div class="PageBox">
|
|
<div class="scrollbox cl">
|
|
<!-- 头条 -->
|
|
<div id="scrollDiv">
|
|
<el-carousel height="100px" direction="vertical" :autoplay="true" indicator-position="outside" ref="prev">
|
|
<el-carousel-item v-for="(tt,ttIndex) in ttList" :key="ttIndex" class="toutiaoItem">
|
|
<h2 class="toutiaoH" style="cursor:pointer;" @click="$to('detailedPage',{id:tt.id})">{{tt.title}}</h2>
|
|
<p class="elli" style="cursor:pointer;" @click="$to('detailedPage',{id:tt.id})">{{$tfnm(tt,'content',60)}}</p>
|
|
</el-carousel-item>
|
|
|
|
<div style="position: absolute;top: 34px;right: 14px;z-index: 99999;">
|
|
<div @click="()=>$refs.prev.prev()" class="txfd"><i class="el-icon-arrow-up"></i></div>
|
|
<div @click="()=>$refs.prev.next()" class="txfd"><i class="el-icon-arrow-down"></i></div>
|
|
</div>
|
|
</el-carousel>
|
|
</div>
|
|
</div>
|
|
<div class="PageOne clearfloat">
|
|
<!-- 轮播图 -->
|
|
<div class="PageOneL left">
|
|
<div id="inlunbo" class="pos1">
|
|
<el-carousel style="width: 590px;height: 400px;" indicator-position="none" ref="prev2" @change="hdpChange" >
|
|
<el-carousel-item v-for="(lbt,lbtIndex) in lbtList" :key="lbtIndex">
|
|
<a href="javascript:void(0);" @click="$to('detailedPage',{id:lbt.id})"><img :src="$tImg(lbt,'cover')"></a>
|
|
<div class="luntxt">
|
|
<a href="javascript:void(0);" class="ltxta elli" @click="$to('detailedPage',{id:lbt.id})" style="color:white !important;">{{lbt.title}}</a>
|
|
</div>
|
|
</el-carousel-item>
|
|
</el-carousel>
|
|
<div style="position: absolute;bottom: 22px;right: 10px;z-index: 99999;color: white;">
|
|
<span :id="`hdp`+lbtIndex" @click="()=>$refs.prev2.setActiveItem(lbtIndex)" class="hdpfy" v-for="(lbt,lbtIndex) in lbtList" :key="lbtIndex">{{lbtIndex+1}}
|
|
</span>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- 工作动态、行业要闻切换 -->
|
|
<div class="PageOneR right">
|
|
<div id="tab">
|
|
<div class="PageOneRUp">
|
|
<a href="javascript:void(0);" @click="$to('listPage3',{pid:1,id:currentTab})" class="gengdduo right">更多></a>
|
|
<ul class="tab_menu">
|
|
<li :class="currentTab == 301 ? 'selected' : ''" @mouseenter="changeTab(301)" style="font-size: 18px;">工作动态</li>
|
|
<li :class="currentTab == 302 ? 'selected' : ''" @mouseenter="changeTab(302)" style="font-size: 18px;">行业要闻</li>
|
|
</ul>
|
|
</div>
|
|
<div class="tab_box">
|
|
<div class="tab_boxdas" v-show="currentTab == 301">
|
|
<ul>
|
|
<li>
|
|
<span class="tagup" @click="$to('detailedPage3',{id:gzdtList[0].id})" style="cursor:pointer;">
|
|
<h3 class="elli">{{gzdtList[0].title}}</h3>
|
|
<p class="over-line2">{{$tfnm(gzdtList[0],'content',84)}}</p>
|
|
</span>
|
|
</li>
|
|
<template v-for="(gzdt,gzdtIndex) in gzdtList">
|
|
<li :key="gzdtIndex" >
|
|
<template v-if="gzdtIndex>0">
|
|
<a class="clearfloat" href="javascript:void(0);" @click="$to('detailedPage3',{id:gzdt.id})">
|
|
<h3 class="elli">> {{gzdt.title}}</h3>
|
|
<span>{{gzdt.createTime}}</span>
|
|
</a>
|
|
</template>
|
|
</li>
|
|
</template>
|
|
</ul>
|
|
</div>
|
|
<div class="tab_boxdas" v-show="currentTab == 302">
|
|
<ul>
|
|
<li>
|
|
<span class="tagup" @click="$to('detailedPage3',{id:hyywList[0].id})" style="cursor:pointer;">
|
|
<h3 class="elli">{{hyywList[0].title}}</h3>
|
|
<p class="over-line2">{{$tfnm(hyywList[0],'content',84)}}</p>
|
|
</span>
|
|
</li>
|
|
<li v-for="(hyyw,hyywIndex) in hyywList" :key="hyywIndex" >
|
|
<template v-if="hyywIndex>0">
|
|
<a class="clearfloat" href="javascript:void(0);" @click="$to('detailedPage3',{id:hyyw.id})">
|
|
<h3 class="elli">> {{hyyw.title}}</h3>
|
|
<span>{{hyyw.createTime}}</span>
|
|
</a>
|
|
</template>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="kjrukou">
|
|
<ul>
|
|
<li>
|
|
<a href="javascript:void(0);" @click="$to('listPage2',{pid:101,id:10101})">
|
|
<span class="spanmg"><img src="img/k_01.png" ></span>
|
|
<span class="spanmg1" style="display: none;"><img src="img/k_01-1.png" ></span>
|
|
<h3>西部杂粮杂豆</h3>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="javascript:void(0);" @click="$to('listPage2',{pid:101,id:10102})">
|
|
<span class="spanmg"><img src="img/k_02.png" ></span>
|
|
<span class="spanmg1" style="display: none;"><img src="img/k_02-2.png" ></span>
|
|
<h3>东部经济资源</h3>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="javascript:void(0);" @click="$to('listPage2',{pid:101,id:10103})">
|
|
<span class="spanmg"><img src="img/k_03.png" ></span>
|
|
<span class="spanmg1" style="display: none;"><img src="img/k_03-3.png" ></span>
|
|
<h3>中部粮食资源</h3>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="javascript:void(0);" @click="$to('listPage2',{pid:101,id:10104})">
|
|
<span class="spanmg"><img src="img/k_05.png" ></span>
|
|
<span class="spanmg1" style="display: none;"><img src="img/k_05-5.png" ></span>
|
|
<h3>适宜吉林省种质资源</h3>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<div class="hzjlbox">
|
|
<div class="hzjl clearfloat">
|
|
<div class="h_l left">
|
|
<!-- 数据中心 -->
|
|
<div class="h_lup clearfloat">
|
|
<span class="h_lupl left">数据<span class="h_luph">中心</span></span>
|
|
<a href="javascript:void(0);" @click="$to('listPage3',{id:sjzxTab,pid:401})" class="right">更多></a>
|
|
</div>
|
|
<div id="tab">
|
|
<ul class="tab_menu">
|
|
<li :class="sjzxTab == 40101 ? 'selected' : ''" @mouseenter="changeTabSjzx(40101)">微观经济调查</li>
|
|
<li :class="sjzxTab == 40102 ? 'selected' : ''" @mouseenter="changeTabSjzx(40102)">农业资源数据</li>
|
|
<li :class="sjzxTab == 40103 ? 'selected' : ''" @mouseenter="changeTabSjzx(40103)">遥感数据</li>
|
|
</ul>
|
|
</div>
|
|
<div class="h_ldown">
|
|
<ul>
|
|
<li v-for="(kycg,kycgIndex) in sjzxList" :key="kycgIndex">
|
|
<a href="javascript:void(0);" @click="$to('detailedPage3',{id:kycg.id})" class="elli">
|
|
<span class="spimg">></span>
|
|
{{kycg.title}}
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="h_r left">
|
|
<!-- 科研成果 -->
|
|
<div class="h_lup clearfloat">
|
|
<span class="h_lupl left">科研<span class="h_luph">成果</span></span>
|
|
<a href="javascript:void(0);" @click="$to('listPage3',{id:kycgTab,pid:304})" class="right">更多></a>
|
|
</div>
|
|
<div id="tab">
|
|
<ul class="tab_menu">
|
|
<li :class="kycgTab == 30401 ? 'selected' : ''" @mouseenter="changeTabKycg(30401)">成果登记</li>
|
|
<li :class="kycgTab == 30402 ? 'selected' : ''" @mouseenter="changeTabKycg(30402)">获奖情况</li>
|
|
<li :class="kycgTab == 30403 ? 'selected' : ''" @mouseenter="changeTabKycg(30403)">发表论文</li>
|
|
</ul>
|
|
</div>
|
|
<div class="h_ldown">
|
|
<ul>
|
|
<li v-for="(kycg,kycgIndex) in kycgList" :key="kycgIndex">
|
|
<a href="javascript:void(0);" @click="$to('detailedPage3',{id:kycg.id})" class="elli">
|
|
<span class="spimg">></span>
|
|
{{kycg.title}}
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<!-- </div> -->
|
|
</div>
|
|
<div class="h_l right">
|
|
<!-- 政策文件 -->
|
|
<div class="h_lup clearfloat">
|
|
<span class="h_lupl left">政策<span class="h_luph">文件</span></span>
|
|
<a href="javascript:void(0);" @click="$to('listPage3',{id:zcwjTab,pid:305})" class="right">更多></a>
|
|
</div>
|
|
<div id="tab">
|
|
<ul class="tab_menu">
|
|
<li :class="zcwjTab == 30501 ? 'selected' : ''" @mouseenter="changeTabZcwj(30501)">省内政策</li>
|
|
<li :class="zcwjTab == 30502 ? 'selected' : ''" @mouseenter="changeTabZcwj(30502)">国内政策</li>
|
|
</ul>
|
|
</div>
|
|
<div class="h_ldown">
|
|
<ul>
|
|
<li v-for="(kycg,kycgIndex) in zcwjList" :key="kycgIndex">
|
|
<a href="javascript:void(0);" @click="$to('detailedPage3',{id:kycg.id})" class="elli">
|
|
<span class="spimg">></span>
|
|
{{kycg.title}}
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="hzjl clearfloat">
|
|
<div class="h_l left">
|
|
<!-- 特色农业资源最新动态 -->
|
|
<div class="h_lup clearfloat">
|
|
<span class="h_lupl left">特色农业资源<span class="h_luph">最新动态</span></span>
|
|
<a href="javascript:void(0);" @click="$to('listPage3',{id:'306',pid:'1'})" class="right">更多></a>
|
|
</div>
|
|
<div class="h_ldown" style="margin-top: 14px;">
|
|
<div class="tsnyzyb" @click="$to('detailedPage3',{id:tsnyzyList[0].id})" style="cursor:pointer;">
|
|
<a href="javascript:void(0);" class="elli" style="color:white !important">{{tsnyzyList[0].title}}</a>
|
|
<div class="tsnyzyimg"><img :src="tsnyzyList[0].cover?$tImg(tsnyzyList[0],'cover'):'img/tu3.png'" alt="" style="width:300px;height:146px;"></div>
|
|
</div>
|
|
<ul>
|
|
<template v-for="(kycg,kycgIndex) in tsnyzyList">
|
|
<template v-if="kycgIndex>0">
|
|
<li :key="kycgIndex">
|
|
<a href="javascript:void(0);" @click="$to('detailedPage3',{id:kycg.id})" class="elli">
|
|
<span class="spimg">></span>
|
|
{{kycg.title}}
|
|
</a>
|
|
</li>
|
|
</template>
|
|
</template>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="h_r left">
|
|
<!-- 合作交流 -->
|
|
<div class="h_lup clearfloat">
|
|
<span class="h_lupl left">合作<span class="h_luph">交流</span></span>
|
|
<a href="javascript:void(0);" @click="$to('listPage3',{id:303,pid:1})" class="right">更多></a>
|
|
</div>
|
|
<div class="h_rdown" style="margin-top: 14px;">
|
|
<div class="spbox clearfloat" @click="$to('detailedPage3',{id:hzjlList[0].id})" style="cursor:pointer;">
|
|
<span class="spimg"><img :src="hzjlList[0].cover?$tImg(hzjlList[0],'cover'):'img/kycg_1.png'" style="width:210px;height:146px;"></span>
|
|
<div class="spcont">
|
|
<a class="spydsb elli">{{hzjlList[0].title}}</a>
|
|
<p class="over-line2">{{$tfnm(hzjlList[0],'content',84)}}</p>
|
|
<div class="yueduit clearfloat">
|
|
<!-- <a href="javascript:void(0);" @click="$to('detailedPage3',{id:hzjlList[0].id})">[阅读]</a> -->
|
|
<span>{{getYearMonthDay(hzjlList[0].updateTime || hzjlList[0].createTime)}}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<ul>
|
|
<template v-for="(kycg,kycgIndex) in hzjlList" >
|
|
<template v-if="kycgIndex>0">
|
|
<li style="margin-top: 13px;" :key="kycgIndex">
|
|
<a href="javascript:void(0);" @click="$to('detailedPage3',{id:kycg.id})" class="clearfloat">
|
|
<span class="sadfa">></span>
|
|
<h4 class="elli">{{kycg.title}}</h4>
|
|
<span class="sadfasp">{{getYearMonthDay(kycg.updateTime || kycg.createTime)}}</span>
|
|
</a>
|
|
</li>
|
|
</template>
|
|
</template>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="h_l right">
|
|
<!-- 专题专栏 -->
|
|
<div class="h_lup clearfloat">
|
|
<span class="h_lupl left">专题<span class="h_luph">专栏</span></span>
|
|
<a href="javascript:void(0);" @click="$to('listPage3',{pid:1,id:501})" class="right">更多></a>
|
|
</div>
|
|
<div class="h_ldown" style="margin-top: 14px;">
|
|
<a href="javascript:void(0);" @click="$to('listPage3',{pid:501,id:50101})" class="elli" style="margin-bottom: 18px;"><img src="img/zt_1.png" alt="" style="height: 80px;"></a>
|
|
<a href="javascript:void(0);" @click="$to('listPage3',{pid:501,id:50102})" class="elli" style="margin-bottom: 18px;"><img src="img/zt_2.png" alt="" style="height: 80px;"></a>
|
|
<a href="javascript:void(0);" @click="$to('listPage3',{pid:501,id:50103})" class="elli" style="margin-bottom: 18px;"><img src="img/zt_3.png" alt="" style="height: 80px;"></a>
|
|
<a href="javascript:void(0);" @click="$to('listPage3',{pid:501,id:50104})" class="elli"><img src="img/zt_4.png" alt="" style="height: 80px;"></a>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { getAction } from '@/api/manage'
|
|
import { getwayMixin } from '@/views/gateway/mixins/getwayMixin'
|
|
import vueSeamlessScroll from './vue-seamless-scroll'
|
|
|
|
export default {
|
|
mixins:[getwayMixin],
|
|
components:{ vueSeamlessScroll },
|
|
props:{
|
|
},
|
|
data(){
|
|
return {
|
|
window,
|
|
ttList:[], //头条
|
|
lbtList:[], //轮播图
|
|
gzdtList:[], //工作动态
|
|
hyywList:[], //行业要闻
|
|
hzjlList:[], //合作交流
|
|
kycgList:[], //科研成果
|
|
zcwjList:[], //政策文件
|
|
tsnyzyList:[], //特色农业资源最新动态
|
|
sjzxList:[], //数据中心
|
|
tzggList:[],
|
|
linksKsdhList:[],
|
|
linksYqljList:[],
|
|
classOption: {
|
|
limitMoveNum: 2,
|
|
direction: 2,
|
|
},
|
|
carouselHeight: '',
|
|
currentTab:301,//工作动态/行业新闻
|
|
zcwjTab:30501,//政策文件
|
|
kycgTab:30401,//科研成果
|
|
sjzxTab:40101,//数据中心
|
|
}
|
|
},
|
|
computed:{
|
|
lbtActiveIndex(){
|
|
// if(this.$refs.prev2){
|
|
// return this.$refs.prev2.activeIndex
|
|
// }else{
|
|
// return this.$refs.prev2
|
|
// }
|
|
// return (this.$refs.prev2 || {}).activeIndex || 0
|
|
}
|
|
},
|
|
mounted(){
|
|
this.loadData();
|
|
const that = this
|
|
let load = () => {
|
|
return (() => {
|
|
let image = document.querySelector('.el-carousel__item.is-active.is-animating img')
|
|
that.refreshImageHeight(image);
|
|
})()
|
|
};
|
|
//当页面大小变动时，更新高度
|
|
window.onresize = load;
|
|
},
|
|
watch:{
|
|
|
|
},
|
|
updated(){
|
|
},
|
|
methods:{
|
|
hdpChange(record){
|
|
console.log('hdpChange-->',record);
|
|
document.getElementById('hdp0').style="background-color: #fff;color: #000;"
|
|
document.getElementById('hdp1').style="background-color: #fff;color: #000;"
|
|
document.getElementById('hdp2').style="background-color: #fff;color: #000;"
|
|
document.getElementById('hdp'+record).style="background-color: #801b1f;color: #fff;"
|
|
},
|
|
loadData(){
|
|
//头条
|
|
getAction('/gateway/gatewayArticle/list',{pageSize:3,isRelease:'Y',columnId:'201',column: 'createTime',order: 'desc'}).then((res)=>{
|
|
if(res.success){
|
|
let list = res.result.records||res.result;
|
|
this.ttList = list;
|
|
}
|
|
});
|
|
//轮播图
|
|
getAction('/gateway/gatewayArticle/list',{pageSize:3,isRelease:'Y',columnId:'001',column: 'createTime',order: 'desc'}).then((res)=>{
|
|
if(res.success){
|
|
let list = res.result.records||res.result;
|
|
this.lbtList = list;
|
|
setTimeout(() => {
|
|
this.hdpChange(0)
|
|
}, 100);
|
|
}
|
|
});
|
|
//工作动态
|
|
getAction('/gateway/gatewayArticle/list',{pageSize:7,isRelease:'Y',columnId:'301',column: 'createTime',order: 'desc'}).then((res)=>{
|
|
if(res.success){
|
|
let list = res.result.records||res.result;
|
|
this.gzdtList = list;
|
|
}
|
|
});
|
|
//行业要闻
|
|
getAction('/gateway/gatewayArticle/list',{pageSize:7,isRelease:'Y',columnId:'302',column: 'createTime',order: 'desc'}).then((res)=>{
|
|
if(res.success){
|
|
let list = res.result.records||res.result;
|
|
this.hyywList = list;
|
|
}
|
|
});
|
|
//数据中心
|
|
getAction('/gateway/gatewayArticle/list',{pageSize:6,isRelease:'Y',columnId:'40101',column: 'createTime',order: 'desc'}).then((res)=>{
|
|
if(res.success){
|
|
let list = res.result.records||res.result;
|
|
this.sjzxList = list;
|
|
}
|
|
});
|
|
|
|
//科研成果
|
|
getAction('/gateway/gatewayArticle/list',{pageSize:6,isRelease:'Y',columnId:'30401',column: 'createTime',order: 'desc'}).then((res)=>{
|
|
if(res.success){
|
|
let list = res.result.records||res.result;
|
|
this.kycgList = list;
|
|
}
|
|
});
|
|
|
|
//政策文件
|
|
getAction('/gateway/gatewayArticle/list',{pageSize:6,isRelease:'Y',columnId:'30501',column: 'createTime',order: 'desc'}).then((res)=>{
|
|
if(res.success){
|
|
let list = res.result.records||res.result;
|
|
this.zcwjList = list;
|
|
}
|
|
});
|
|
//特色农业资源最新动态
|
|
getAction('/gateway/gatewayArticle/list',{pageSize:6,isRelease:'Y',columnId:'306',column: 'createTime',order: 'desc'}).then((res)=>{
|
|
if(res.success){
|
|
let list = res.result.records||res.result;
|
|
this.tsnyzyList = list;
|
|
}
|
|
});
|
|
//合作交流
|
|
getAction('/gateway/gatewayArticle/list',{pageSize:6,isRelease:'Y',columnId:'303',column: 'createTime',order: 'desc'}).then((res)=>{
|
|
if(res.success){
|
|
let list = res.result.records||res.result;
|
|
this.hzjlList = list;
|
|
}
|
|
});
|
|
},
|
|
|
|
//工作动态、行业要闻切换
|
|
changeTab(index){
|
|
this.currentTab = index;
|
|
},
|
|
//数据中心
|
|
changeTabSjzx(index){
|
|
console.log('changeTabSjzx-->',index);
|
|
this.sjzxTab = index;
|
|
getAction('/gateway/gatewayArticle/list',{pageSize:6,isRelease:'Y',columnId:index,column: 'createTime',order: 'desc'}).then((res)=>{
|
|
if(res.success){
|
|
let list = res.result.records||res.result;
|
|
this.sjzxList = list;
|
|
}
|
|
});
|
|
},
|
|
//科研成果
|
|
changeTabKycg(index){
|
|
this.kycgTab = index;
|
|
getAction('/gateway/gatewayArticle/list',{pageSize:6,isRelease:'Y',columnId:index,column: 'createTime',order: 'desc'}).then((res)=>{
|
|
if(res.success){
|
|
let list = res.result.records||res.result;
|
|
this.kycgList = list;
|
|
}
|
|
});
|
|
},
|
|
//政策文件
|
|
changeTabZcwj(index){
|
|
this.zcwjTab = index;
|
|
getAction('/gateway/gatewayArticle/list',{pageSize:6,isRelease:'Y',columnId:index,column: 'createTime',order: 'desc'}).then((res)=>{
|
|
if(res.success){
|
|
let list = res.result.records||res.result;
|
|
this.zcwjList = list;
|
|
}
|
|
});
|
|
},
|
|
getDay(dateTime){
|
|
if(!dateTime) return '';
|
|
let d = new Date(dateTime);
|
|
return d.getDate()
|
|
},
|
|
getYearAndMonth(dateTime){
|
|
if(!dateTime) return '';
|
|
let d = new Date(dateTime);
|
|
return d.getFullYear() + '-' + (d.getMonth()+1)
|
|
},
|
|
//根据image对象刷新高度
|
|
refreshImageHeight(image){
|
|
const that = this
|
|
if(!image){
|
|
that.carouselHeight = '';
|
|
return;
|
|
}
|
|
let url = image.src;
|
|
this.refreshImageHeightByUrl(url);
|
|
},
|
|
//刷新轮播图高度
|
|
refreshImageHeightByUrl(url){
|
|
const that = this
|
|
let nImg = new Image();
|
|
nImg.src = url;
|
|
if(!nImg.height){
|
|
that.carouselHeight = '';
|
|
return;
|
|
}
|
|
let width = nImg.width;
|
|
let height = nImg.height;
|
|
|
|
let maxWidth = document.body.offsetWidth;
|
|
|
|
let widthProportion = maxWidth/width;
|
|
that.carouselHeight = (height*widthProportion) + 'px';
|
|
},
|
|
//由轮播图变换触发的
|
|
changeCarouselHeight(index){
|
|
let image = document.querySelectorAll('.d1')[index];
|
|
this.refreshImageHeight(image);
|
|
},
|
|
|
|
getDay(dateTime){
|
|
if(!dateTime) return '';
|
|
let d = new Date(dateTime);
|
|
return d.getDate()
|
|
},
|
|
getMonthAndDay(dateTime){
|
|
if(!dateTime) return '';
|
|
let d = new Date(dateTime);
|
|
return (d.getMonth()+1) + '-' + d.getDate();
|
|
},
|
|
getYearAndMonth(dateTime){
|
|
if(!dateTime) return '';
|
|
let d = new Date(dateTime);
|
|
return d.getFullYear() + '-' + (d.getMonth()+1)
|
|
},
|
|
getYearMonthDay(dateTime){
|
|
if(!dateTime) return '';
|
|
let d = new Date(dateTime);
|
|
var month = (d.getMonth()+1)
|
|
if(month<10){
|
|
month = "0"+(d.getMonth()+1)
|
|
}
|
|
var day = d.getDate()
|
|
if(d.getDate()<10){
|
|
day = "0"+d.getDate()
|
|
}
|
|
return d.getFullYear() + '-' + month + '-' +day
|
|
},
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
h4{
|
|
margin: 0;
|
|
}
|
|
|
|
.warp {
|
|
width: 1264px;
|
|
height: 120px;
|
|
margin: 0 auto;
|
|
overflow: hidden;
|
|
ul {
|
|
list-style: none;
|
|
padding: 0;
|
|
margin: 0 auto;
|
|
&.ul-item {
|
|
display: flex;
|
|
.li-item {
|
|
width: 120px;
|
|
height: 120px;
|
|
margin-right: 10px;
|
|
line-height: 120px;
|
|
background-color: #999;
|
|
color: #fff;
|
|
text-align: center;
|
|
font-size: 30px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.OneTxt2{
|
|
font-size:2rem;
|
|
.OneTxt2_txt{
|
|
position: relative;
|
|
z-index: 2;
|
|
color:#006876;
|
|
}
|
|
.OneTxt2_back{
|
|
width: 8rem;
|
|
height: 1rem;
|
|
border-radius: 1%;
|
|
background-color: #fdf9d9;
|
|
position: relative;
|
|
z-index: 1;
|
|
top: -1rem;
|
|
}
|
|
}
|
|
.toutiaoItem{
|
|
width: 100%;
|
|
height: 100px;
|
|
padding: 10px;
|
|
text-align: center;
|
|
box-sizing: border-box;
|
|
transition: 0.5s all;
|
|
-webkit-transition: 0.5s all;
|
|
-moz-transition: 0.5s all;
|
|
-o-transition: 0.5s all;
|
|
}
|
|
.toutiaoH{
|
|
font-size: 22px;
|
|
font-weight: bold;
|
|
margin-top: 8px;
|
|
margin-bottom: 10px;
|
|
color: #333;
|
|
}
|
|
.txfd{
|
|
width: 18px;
|
|
height: 18px;
|
|
line-height: 18px;
|
|
background-color: #bbbbbb;
|
|
color: #fff;
|
|
text-align: center;
|
|
margin-bottom: 5px;
|
|
cursor: pointer;
|
|
}
|
|
.txfd:hover{
|
|
background-color: #ee8515;
|
|
}
|
|
.txfd i{
|
|
color: #fff;
|
|
}
|
|
.hdpfy{
|
|
display: inline-block;
|
|
width: 16px;
|
|
height: 16px;
|
|
font-size: 12px;
|
|
text-align: center;
|
|
line-height: 16px;
|
|
margin-left: 5px;
|
|
cursor: pointer;
|
|
}
|
|
/deep/ .el-carousel__container{
|
|
height: 400px;
|
|
}
|
|
</style> |