|
|
|
@ -84,7 +84,7 @@ onBeforeMount(() => { |
|
|
|
onMounted(() => { |
|
|
|
// 监听滚动事件 |
|
|
|
//window.addEventListener('scroll', jsScroll, false) |
|
|
|
document.querySelector('.app-container')!.addEventListener('scroll', jsScroll, false) |
|
|
|
document.querySelector('.content')!.addEventListener('scroll', jsScroll, false) |
|
|
|
|
|
|
|
document.querySelector('.navs')!.addEventListener('wheel', (e) => { |
|
|
|
//阻止默认行为（页面的滚动行为） |
|
|
|
@ -185,8 +185,12 @@ function scrollTo(index: any) { |
|
|
|
</li> |
|
|
|
|
|
|
|
<template v-for="(item, index) in naviList" :key="index"> |
|
|
|
<<<<<<< HEAD |
|
|
|
<Navili :class="{ active: active === index+1 }" :oneli=item v-if="item.hasCard" :index=(index+1) :active=active |
|
|
|
@click="scrollTo(index + 1)"></Navili> |
|
|
|
======= |
|
|
|
<Navili v-if="item.hasCard" :class="{ active: active === index+1 }" :oneli=item :index=(index+1) :active=active @click="scrollTo(index + 1)"></Navili> |
|
|
|
>>>>>>> v3_liwenxuan |
|
|
|
</template> |
|
|
|
|
|
|
|
</ul> |
|
|
|
@ -194,6 +198,7 @@ function scrollTo(index: any) { |
|
|
|
|
|
|
|
|
|
|
|
<!-- 内容区域 --> |
|
|
|
<div class = "content1"> |
|
|
|
<div class="content"> |
|
|
|
|
|
|
|
<div class="models "> |
|
|
|
@ -206,18 +211,16 @@ function scrollTo(index: any) { |
|
|
|
<el-carousel indicator-position="outside" class="mycarousel" arrow="always"> |
|
|
|
<el-carousel-item v-for="(item, index) in carousel" :key="index" @click="showContentDialog(item)"> |
|
|
|
|
|
|
|
<img style="width: 495px; height: 300px;border-radius:16px;margin-top: 4px; margin-left: 4px;" |
|
|
|
referrerpolicy="no-referrer" :src="item.gThumbnail" fit="fill" loading="lazy" @error="errorImg($event)" /> |
|
|
|
<img style="width: 471px; height: 300px;border-radius:16px;margin-top: 4px; margin-left: 4px;" referrerpolicy="no-referrer" :src="item.gThumbnail" fit="fill" loading="lazy" @error="errorImg($event)" /> |
|
|
|
</el-carousel-item> |
|
|
|
</el-carousel> |
|
|
|
|
|
|
|
<div v-for="(item, index) in tuijianPage" :key="index" class="tuijian-card" @click="showContentDialog(item)"> |
|
|
|
<img style="width: 170px; height: 126px;border-radius:8px;margin-top: 4px; margin-left: 4px;" |
|
|
|
referrerpolicy="no-referrer" :src="item.gThumbnail" fit="fill" loading="lazy" @error="errorImg($event)" /> |
|
|
|
<img style="width: 196px; height: 126px;border-radius:8px;margin-top: 4px; margin-left: 4px;" referrerpolicy="no-referrer" :src="item.gThumbnail" fit="fill" loading="lazy" @error="errorImg($event)" /> |
|
|
|
|
|
|
|
<div class="card-right"> |
|
|
|
<span class="card-title" :title=item.gTitle>{{ item.gTitle }}</span> |
|
|
|
<span class="card-text" :title=item.gDescribe>{{ item.gDescribe }}</span> |
|
|
|
<!-- <span class="card-text" :title=item.gDescribe>{{ item.gDescribe }}</span> --> |
|
|
|
|
|
|
|
<span class="time-span"><span class="fa fa-clock-o"></span>{{ formatDate(item.gAddTime) }}</span> |
|
|
|
|
|
|
|
@ -231,20 +234,24 @@ function scrollTo(index: any) { |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
<el-pagination class="pagi" v-model:current-page="pageParamTuijian.page" v-if="pageParamTuijian.total > 0" |
|
|
|
v-model:page-size="pageParamTuijian.pagesize" layout="prev, pager, next, jumper" :total="pageParamTuijian.total" |
|
|
|
@current-change="handleCurrentChange" /> |
|
|
|
<el-pagination v-if="pageParamTuijian.total > 0" v-model:current-page="pageParamTuijian.page" v-model:page-size="pageParamTuijian.pagesize" class="pagi" layout="prev, pager, next, jumper" :total="pageParamTuijian.total" @current-change="handleCurrentChange" /> |
|
|
|
</div> |
|
|
|
<!-- 各知识/新闻分区 --> |
|
|
|
|
|
|
|
<<<<<<< HEAD |
|
|
|
<template v-for="(item, index) in naviList" :key="index"> |
|
|
|
<Archivestype :liContent=item :index=(index) :fatherisReady="fatherisReady" :router-url="routerUrl"></Archivestype> |
|
|
|
======= |
|
|
|
<template v-for="(item, index) in naviList" :key="index"> |
|
|
|
<Archivestype :li-content=item :index=(index) :fatheris-ready="fatherisReady" :router-url="routerUrl"></Archivestype> |
|
|
|
>>>>>>> v3_liwenxuan |
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<!-- 内容详情组件 --> |
|
|
|
<KnowledgeContent v-model:isShow="showContentBox" :contentSource="cardContentSource"></KnowledgeContent> |
|
|
|
<KnowledgeContent v-model:isShow="showContentBox" :content-source="cardContentSource"></KnowledgeContent> |
|
|
|
|
|
|
|
|
|
|
|
</div> |
|
|
|
@ -257,21 +264,37 @@ function scrollTo(index: any) { |
|
|
|
height: calc(100vh - 125px); |
|
|
|
width: 100%; |
|
|
|
overflow: auto; |
|
|
|
padding: 0 10px 0 30px; |
|
|
|
padding: 0 10px 0 0; |
|
|
|
display: grid; |
|
|
|
/* 声明了三列，宽度分别为 200px 100px 200px */ |
|
|
|
grid-template-columns: 200px auto; |
|
|
|
grid-template-columns: 163px auto; |
|
|
|
} |
|
|
|
|
|
|
|
.content { |
|
|
|
background-color: white; |
|
|
|
width: auto; |
|
|
|
max-width: 87%; |
|
|
|
padding-left: 9%; |
|
|
|
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; |
|
|
|
border-radius: 5px; |
|
|
|
max-width: 100%; |
|
|
|
margin-top: -20px; |
|
|
|
padding-left: 20px; |
|
|
|
/* box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; */ |
|
|
|
border-radius: 7px; |
|
|
|
overflow-y:auto; |
|
|
|
height: 103%; |
|
|
|
} |
|
|
|
|
|
|
|
.content1 { |
|
|
|
height: calc(100vh - 125px); |
|
|
|
width: auto; |
|
|
|
/* max-width: 98.4%; */ |
|
|
|
margin-right: 34px; |
|
|
|
border-radius: 7px; |
|
|
|
/* box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; */ |
|
|
|
overflow:hidden; |
|
|
|
|
|
|
|
} |
|
|
|
::-webkit-scrollbar { |
|
|
|
display: none; |
|
|
|
} |
|
|
|
h3 { |
|
|
|
margin-left: 10px; |
|
|
|
} |
|
|
|
@ -321,7 +344,7 @@ li:hover { |
|
|
|
} |
|
|
|
|
|
|
|
.model-title { |
|
|
|
margin-top: -9px; |
|
|
|
margin-top: 29px; |
|
|
|
height: 30px; |
|
|
|
} |
|
|
|
|
|
|
|
@ -329,7 +352,7 @@ li:hover { |
|
|
|
|
|
|
|
|
|
|
|
display: grid; |
|
|
|
grid-template-columns: repeat(auto-fill, 484px); |
|
|
|
grid-template-columns: repeat(auto-fill, 480px); |
|
|
|
gap: 10px; |
|
|
|
grid-auto-flow: row dense; |
|
|
|
|
|
|
|
@ -337,7 +360,7 @@ li:hover { |
|
|
|
|
|
|
|
.tuijian-card { |
|
|
|
display: flex; |
|
|
|
width: 481px; |
|
|
|
width: 480px; |
|
|
|
height: 140px; |
|
|
|
padding: 3px; |
|
|
|
border-radius: 8px; |
|
|
|
@ -351,28 +374,33 @@ li:hover { |
|
|
|
grid-row-start: 1; |
|
|
|
grid-row-end: 3; |
|
|
|
border-radius: 15px; |
|
|
|
width: 480px; |
|
|
|
width: 470px; |
|
|
|
height: 290px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.card-right { |
|
|
|
display: flex; |
|
|
|
width: 300px; |
|
|
|
width: 260px; |
|
|
|
flex-direction: column; |
|
|
|
flex-wrap: wrap; |
|
|
|
padding-left: 8px; |
|
|
|
} |
|
|
|
|
|
|
|
.card-title { |
|
|
|
|
|
|
|
|
|
|
|
height: 1.5em !important; |
|
|
|
/* height: 1.5em !important; |
|
|
|
display: -webkit-box; |
|
|
|
-webkit-box-orient: vertical; |
|
|
|
overflow: hidden; |
|
|
|
-webkit-line-clamp: 1; |
|
|
|
|
|
|
|
-webkit-line-clamp: 1; */ |
|
|
|
word-break: break-all; |
|
|
|
height: 3.5em !important; |
|
|
|
overflow: hidden; |
|
|
|
display: -webkit-box; |
|
|
|
-webkit-line-clamp: 2; |
|
|
|
-webkit-box-orient: vertical; |
|
|
|
padding-left: 0.7em; |
|
|
|
padding-top: 0.5em; |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
