|
|
@ -1,13 +1,11 @@ |
|
|
<script lang='ts' setup> |
|
|
<script lang='ts' setup> |
|
|
import { useUserStore } from "@/store/modules/user" |
|
|
import { useUserStore } from "@/store/modules/user" |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
import { ref } from 'vue' |
|
|
import { ref } from 'vue' |
|
|
import { getUserDetail, getZxxyNavis, getTuijian, getCarousel } from '@/api/knowledge/index' |
|
|
import { getUserDetail, getZxxyNavis, getTuijian, getCarousel } from '@/api/knowledge/index' |
|
|
import Archivestype from '@/views/knowledge/knowledge/components/archivestype.vue' |
|
|
import Archivestype from '@/views/knowledge/knowledge/components/archivestype.vue' |
|
|
import Navili from './components/Navili.vue' |
|
|
import Navili from './components/Navili.vue' |
|
|
import KnowledgeContent from './components/KnowledgeContent.vue' |
|
|
import KnowledgeContent from './components/KnowledgeContent.vue' |
|
|
|
|
|
|
|
|
import { UserQuery, UserDetail, NaviQuery, Navi, Graphicform, PageParam } from '@/api/knowledge/types' |
|
|
import { UserQuery, UserDetail, NaviQuery, Navi, Graphicform, PageParam } from '@/api/knowledge/types' |
|
|
import { onScroll, formatDate } from '@/api/knowledge/scroll' |
|
|
import { onScroll, formatDate } from '@/api/knowledge/scroll' |
|
|
import { useRouter } from 'vue-router' |
|
|
import { useRouter } from 'vue-router' |
|
|
@ -37,9 +35,7 @@ const userDetail = ref<UserDetail>({ |
|
|
const tuijianPage = ref<Graphicform[]>(); |
|
|
const tuijianPage = ref<Graphicform[]>(); |
|
|
|
|
|
|
|
|
const naviList = ref<Navi[]>(); |
|
|
const naviList = ref<Navi[]>(); |
|
|
|
|
|
|
|
|
const naviList1 = ref<Navi[]>(); |
|
|
const naviList1 = ref<Navi[]>(); |
|
|
|
|
|
|
|
|
//用户信息查询参数 |
|
|
//用户信息查询参数 |
|
|
const userQueryParam = reactive<UserQuery>({ |
|
|
const userQueryParam = reactive<UserQuery>({ |
|
|
userkey: userKey, |
|
|
userkey: userKey, |
|
|
@ -48,10 +44,8 @@ const userQueryParam = reactive<UserQuery>({ |
|
|
//navi查询参数 |
|
|
//navi查询参数 |
|
|
const naviQueryParam = reactive<NaviQuery>({ |
|
|
const naviQueryParam = reactive<NaviQuery>({ |
|
|
atParentId: "",//知识库 |
|
|
atParentId: "",//知识库 |
|
|
|
|
|
|
|
|
userkey: userKey, |
|
|
userkey: userKey, |
|
|
usertoken: userToken, |
|
|
usertoken: userToken, |
|
|
|
|
|
|
|
|
}); |
|
|
}); |
|
|
const pageParamTuijian = reactive<PageParam>({ |
|
|
const pageParamTuijian = reactive<PageParam>({ |
|
|
total: 0, |
|
|
total: 0, |
|
|
@ -75,9 +69,6 @@ function errorImg(e: any) { |
|
|
} |
|
|
} |
|
|
const fatherisReady = ref(0); |
|
|
const fatherisReady = ref(0); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const router = useRouter() |
|
|
const router = useRouter() |
|
|
const routerUrl = toRaw(router).currentRoute.value.fullPath |
|
|
const routerUrl = toRaw(router).currentRoute.value.fullPath |
|
|
onBeforeMount(() => { |
|
|
onBeforeMount(() => { |
|
|
@ -87,7 +78,6 @@ onBeforeMount(() => { |
|
|
userDetail.value = data |
|
|
userDetail.value = data |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}) |
|
|
}) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
@ -124,54 +114,23 @@ onMounted(() => { |
|
|
getZxxyNavis(naviQueryParam) |
|
|
getZxxyNavis(naviQueryParam) |
|
|
.then(({ data }) => { |
|
|
.then(({ data }) => { |
|
|
naviList.value = data |
|
|
naviList.value = data |
|
|
<<<<<<< HEAD |
|
|
|
|
|
//console.log(naviList.value) |
|
|
|
|
|
|
|
|
|
|
|
}).finally(() => { |
|
|
}).finally(() => { |
|
|
fatherisReady.value = 100; |
|
|
fatherisReady.value = 100; |
|
|
}) |
|
|
}) |
|
|
|
|
|
|
|
|
//当前登录用户详细信息 |
|
|
|
|
|
getUserDetail(userQueryParam) |
|
|
|
|
|
.then(({ data }) => { |
|
|
|
|
|
userDetail.value = data |
|
|
|
|
|
//console.log(userDetail.value) |
|
|
|
|
|
}).finally(() => { |
|
|
|
|
|
fatherisReady.value = 100; |
|
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
|
|
======= |
|
|
|
|
|
}).finally(() => { |
|
|
|
|
|
fatherisReady.value = 100; |
|
|
|
|
|
}) |
|
|
|
|
|
>>>>>>> v3_liwenxuan |
|
|
|
|
|
//推荐 |
|
|
//推荐 |
|
|
getTuijian(pageParamTuijian) |
|
|
getTuijian(pageParamTuijian) |
|
|
.then(({ data }) => { |
|
|
.then(({ data }) => { |
|
|
tuijianPage.value = data.list |
|
|
tuijianPage.value = data.list |
|
|
pageParamTuijian.page = data.pageNum |
|
|
pageParamTuijian.page = data.pageNum |
|
|
pageParamTuijian.total = data.total |
|
|
pageParamTuijian.total = data.total |
|
|
|
|
|
|
|
|
}); |
|
|
}); |
|
|
getCarousel(pageParamTuijian) |
|
|
getCarousel(pageParamTuijian) |
|
|
.then(({ data }) => { |
|
|
.then(({ data }) => { |
|
|
carousel.value = data.list |
|
|
carousel.value = data.list |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//console.log(tuijianPage.value) |
|
|
|
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//setTimeout(function(){ fatherisReady.value = 100;}, 3000); //三秒之后执行函数 |
|
|
|
|
|
|
|
|
|
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function jsScroll() { |
|
|
function jsScroll() { |
|
|
active.value = onScroll(); |
|
|
active.value = onScroll(); |
|
|
} |
|
|
} |
|
|
@ -198,7 +157,6 @@ const showContentBox = ref(false); //详情弹窗 |
|
|
function showContentDialog(item: any) { |
|
|
function showContentDialog(item: any) { |
|
|
showContentBox.value = true; |
|
|
showContentBox.value = true; |
|
|
cardContentSource.value = item; |
|
|
cardContentSource.value = item; |
|
|
|
|
|
|
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
@ -216,7 +174,6 @@ function scrollTo(index: any) { |
|
|
|
|
|
|
|
|
</script> |
|
|
</script> |
|
|
<template> |
|
|
<template> |
|
|
|
|
|
|
|
|
<div class="app-container"> |
|
|
<div class="app-container"> |
|
|
|
|
|
|
|
|
<!-- 导航区域 --> |
|
|
<!-- 导航区域 --> |
|
|
@ -228,7 +185,7 @@ function scrollTo(index: any) { |
|
|
</li> |
|
|
</li> |
|
|
|
|
|
|
|
|
<template v-for="(item, index) in naviList"> |
|
|
<template v-for="(item, index) in naviList"> |
|
|
<Navili :class="{ active: active === index+1 }" :oneli=item :index=(index+1) v-if="item.hasCard" :active=active |
|
|
<Navili :class="{ active: active === index+1 }" :oneli=item v-if="item.hasCard" :index=(index+1) :active=active |
|
|
@click="scrollTo(index + 1)"></Navili> |
|
|
@click="scrollTo(index + 1)"></Navili> |
|
|
</template> |
|
|
</template> |
|
|
|
|
|
|
|
|
@ -239,7 +196,6 @@ function scrollTo(index: any) { |
|
|
<!-- 内容区域 --> |
|
|
<!-- 内容区域 --> |
|
|
<div class="content"> |
|
|
<div class="content"> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div class="models "> |
|
|
<div class="models "> |
|
|
|
|
|
|
|
|
<div class="model-title"> |
|
|
<div class="model-title"> |
|
|
@ -247,20 +203,16 @@ function scrollTo(index: any) { |
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
<div class="grid-tuijian"> |
|
|
<div class="grid-tuijian"> |
|
|
|
|
|
|
|
|
<el-carousel indicator-position="outside" class="mycarousel" arrow="always"> |
|
|
<el-carousel indicator-position="outside" class="mycarousel" arrow="always"> |
|
|
<el-carousel-item v-for="(item, index) in carousel" :key="index" @click="showContentDialog(item)"> |
|
|
<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;" |
|
|
<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)" /> |
|
|
referrerpolicy="no-referrer" :src="item.gThumbnail" fit="fill" loading="lazy" @error="errorImg($event)" /> |
|
|
</el-carousel-item> |
|
|
</el-carousel-item> |
|
|
</el-carousel> |
|
|
</el-carousel> |
|
|
|
|
|
|
|
|
<div v-for="(item, index) in tuijianPage" :key="index" class="tuijian-card" @click="showContentDialog(item)"> |
|
|
<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;" |
|
|
<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)" /> |
|
|
referrerpolicy="no-referrer" :src="item.gThumbnail" fit="fill" loading="lazy" @error="errorImg($event)" /> |
|
|
|
|
|
|
|
|
<div class="card-right"> |
|
|
<div class="card-right"> |
|
|
@ -279,79 +231,28 @@ function scrollTo(index: any) { |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<el-pagination class="pagi" v-model:current-page="pageParamTuijian.page" v-if="pageParamTuijian.total > 0" |
|
|
<el-pagination |
|
|
v-model:page-size="pageParamTuijian.pagesize" layout="prev, pager, next, jumper" :total="pageParamTuijian.total" |
|
|
v-if="pageParamTuijian.total > 0" v-model:current-page="pageParamTuijian.page" |
|
|
|
|
|
v-model:page-size="pageParamTuijian.pagesize" layout="prev, pager, next, jumper" :total="pageParamTuijian.total" class="pagi" |
|
|
|
|
|
@current-change="handleCurrentChange" /> |
|
|
@current-change="handleCurrentChange" /> |
|
|
</div> |
|
|
</div> |
|
|
<!-- 各知识/新闻分区 --> |
|
|
<!-- 各知识/新闻分区 --> |
|
|
<Archivestype v-for="(item, index) in naviList" :key="index" :fatherisReady="fatherisReady" :liContent=item :index=(index) :routerUrl="routerUrl"> |
|
|
|
|
|
</Archivestype> |
|
|
<template v-for="(item, index) in naviList"> |
|
|
|
|
|
<Archivestype :liContent=item :index=(index) :fatherisReady="fatherisReady" :router-url="routerUrl"></Archivestype> |
|
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
<!-- 内容详情组件 --> |
|
|
<!-- 内容详情组件 --> |
|
|
<KnowledgeContent v-model:isShow="showContentBox" :contentSource="cardContentSource"></KnowledgeContent> |
|
|
<KnowledgeContent v-model:isShow="showContentBox" :contentSource="cardContentSource"></KnowledgeContent> |
|
|
|
|
|
|
|
|
<<<<<<< HEAD |
|
|
|
|
|
|
|
|
|
|
|
<!-- 导航区域 --> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 导航区域 --> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<ul class="navs"> |
|
|
|
|
|
<li :class="{ active: active === 0 }" @click="scrollTo(0)"> |
|
|
|
|
|
推荐 |
|
|
|
|
|
</li> |
|
|
|
|
|
|
|
|
|
|
|
<Navili v-for="(item, index) in naviList" :key="index" :class="{ active: active === index+1 }" :oneli=item :index=(index+1) |
|
|
|
|
|
:active=active @click="scrollTo(index+1)"></Navili> |
|
|
|
|
|
|
|
|
|
|
|
</ul> |
|
|
|
|
|
|
|
|
|
|
|
======= |
|
|
|
|
|
|
|
|
|
|
|
>>>>>>> v3_liwenxuan |
|
|
|
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
</template> |
|
|
</template> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<style scoped> |
|
|
<style scoped> |
|
|
<<<<<<< HEAD |
|
|
|
|
|
|
|
|
|
|
|
/* 内容区的样式 */ |
|
|
|
|
|
.content { |
|
|
|
|
|
background-color: white; |
|
|
|
|
|
width: 100%; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.models { |
|
|
|
|
|
width: 100%; |
|
|
|
|
|
/* min-height: 500px; */ |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 导航栏的样式 */ |
|
|
|
|
|
.navs { |
|
|
|
|
|
position: fixed; |
|
|
|
|
|
top: 100px; |
|
|
|
|
|
|
|
|
|
|
|
.content { |
|
|
|
|
|
background-color: white; |
|
|
|
|
|
width: 89.1%; |
|
|
|
|
|
margin-left: 190px; |
|
|
|
|
|
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; |
|
|
|
|
|
border-radius: 5px; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
======= |
|
|
|
|
|
.app-container { |
|
|
.app-container { |
|
|
height: calc(100vh - 125px); |
|
|
height: calc(100vh - 125px); |
|
|
width: 100%; |
|
|
width: 100%; |
|
|
@ -375,7 +276,6 @@ h3 { |
|
|
margin-left: 10px; |
|
|
margin-left: 10px; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
>>>>>>> v3_liwenxuan |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
@ -384,27 +284,6 @@ h3 { |
|
|
width: 142px; |
|
|
width: 142px; |
|
|
position: fixed; |
|
|
position: fixed; |
|
|
height: auto; |
|
|
height: auto; |
|
|
<<<<<<< HEAD |
|
|
|
|
|
top: 95px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.navs li { |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
padding: 0 40px; |
|
|
|
|
|
line-height: 2.6; |
|
|
|
|
|
font-size: 15px; |
|
|
|
|
|
color: #909399; |
|
|
|
|
|
|
|
|
|
|
|
text-align: center; |
|
|
|
|
|
line-height: 3; |
|
|
|
|
|
font-size: 15.5px; |
|
|
|
|
|
color: #909399; |
|
|
|
|
|
background-color: white; |
|
|
|
|
|
margin-right: 15px; |
|
|
|
|
|
======= |
|
|
|
|
|
top: 105px; |
|
|
top: 105px; |
|
|
text-align: center; |
|
|
text-align: center; |
|
|
line-height: 5; |
|
|
line-height: 5; |
|
|
@ -424,7 +303,6 @@ li { |
|
|
color: #909399; |
|
|
color: #909399; |
|
|
background-color: white; |
|
|
background-color: white; |
|
|
|
|
|
|
|
|
>>>>>>> v3_liwenxuan |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
@ -443,19 +321,15 @@ li:hover { |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.model-title { |
|
|
.model-title { |
|
|
|
|
|
|
|
|
margin-top: -9px; |
|
|
margin-top: -9px; |
|
|
|
|
|
|
|
|
height: 30px; |
|
|
height: 30px; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.grid-tuijian { |
|
|
.grid-tuijian { |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
display: grid; |
|
|
display: grid; |
|
|
grid-template-columns: repeat(auto-fill, 484px); |
|
|
grid-template-columns: repeat(auto-fill, 484px); |
|
|
|
|
|
|
|
|
gap: 10px; |
|
|
gap: 10px; |
|
|
grid-auto-flow: row dense; |
|
|
grid-auto-flow: row dense; |
|
|
|
|
|
|
|
|
@ -463,9 +337,7 @@ li:hover { |
|
|
|
|
|
|
|
|
.tuijian-card { |
|
|
.tuijian-card { |
|
|
display: flex; |
|
|
display: flex; |
|
|
|
|
|
|
|
|
width: 481px; |
|
|
width: 481px; |
|
|
|
|
|
|
|
|
height: 140px; |
|
|
height: 140px; |
|
|
padding: 3px; |
|
|
padding: 3px; |
|
|
border-radius: 8px; |
|
|
border-radius: 8px; |
|
|
@ -476,7 +348,6 @@ li:hover { |
|
|
|
|
|
|
|
|
.mycarousel { |
|
|
.mycarousel { |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
grid-row-start: 1; |
|
|
grid-row-start: 1; |
|
|
grid-row-end: 3; |
|
|
grid-row-end: 3; |
|
|
border-radius: 15px; |
|
|
border-radius: 15px; |
|
|
@ -487,9 +358,7 @@ li:hover { |
|
|
|
|
|
|
|
|
.card-right { |
|
|
.card-right { |
|
|
display: flex; |
|
|
display: flex; |
|
|
|
|
|
|
|
|
width: 300px; |
|
|
width: 300px; |
|
|
|
|
|
|
|
|
flex-direction: column; |
|
|
flex-direction: column; |
|
|
flex-wrap: wrap; |
|
|
flex-wrap: wrap; |
|
|
padding-left: 8px; |
|
|
padding-left: 8px; |
|
|
|
