跳转问题调整

This commit is contained in:
wuhongjian 2022-12-16 17:27:57 +08:00
parent 307f5bb4ce
commit 00d277dd39
5 changed files with 325 additions and 284 deletions

View File

@ -138,12 +138,20 @@
// //
function viewDetails(id) { function viewDetails(id) {
console.log('id=========>', id) console.log('id=========>', id)
router.push({ // router.push({
path: '/details', // path: '/details',
// query: {
// id: id,
// },
// })
const detailPage = router.resolve({
path: '/details', //
query: { query: {
id: id, id: id,
hiddenBackFlag: true,
}, },
}) })
window.open(detailPage.href, '_blank')
} }
// //
const praiseList = ref([]) const praiseList = ref([])

View File

@ -59,12 +59,20 @@
// //
function viewDetails(id) { function viewDetails(id) {
console.log('id=========>', id) console.log('id=========>', id)
router.push({ // router.push({
path: '/demandDetails', // path: '/demandDetails',
// query: {
// id: id,
// },
// })
const detailPage = router.resolve({
path: '/demandDetails', //
query: { query: {
id: id, id: id,
// hiddenBackFlag: true,
}, },
}) })
window.open(detailPage.href, '_blank')
} }
function jumpPage() { function jumpPage() {
router.push({ router.push({

View File

@ -8,13 +8,13 @@
<div class="bottom"> <div class="bottom">
<div class="item" v-for="item in productServiceData" :key="item.id"> <div class="item" v-for="item in productServiceData" :key="item.id">
<div class="img" :class="item.imgType"></div> <div class="img" :class="item.imgType"></div>
<a-tooltip > <a-tooltip>
<template #title>{{ item.name }}</template> <template #title>{{ item.name }}</template>
<div class="name">{{ item.name }}</div> <div class="name">{{ item.name }}</div>
</a-tooltip> </a-tooltip>
<div class="dec"> <div class="dec">
<span>{{ item.deptName }}</span> <span>{{ item.deptName }}</span>
</div> </div>
<div class="text"> <div class="text">
{{ item.description || '暂无描述' }} {{ item.description || '暂无描述' }}
</div> </div>
@ -81,18 +81,26 @@
query: { query: {
// select: '', // select: '',
select: DETAIL_PAGE_CONTENT_DEFAULT_TAB, select: DETAIL_PAGE_CONTENT_DEFAULT_TAB,
orderField:'tdr.create_date' orderField: 'tdr.create_date',
}, },
}) })
} }
const selectOne = (id) => { const selectOne = (id) => {
console.log('点击===============》', id) console.log('点击===============》', id)
router.push({ // router.push({
path: '/details', // path: '/details',
// query: {
// id: id,
// },
// })
const detailPage = router.resolve({
path: '/details', //
query: { query: {
id: id, id: id,
hiddenBackFlag: true,
}, },
}) })
window.open(detailPage.href, '_blank')
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
@ -177,15 +185,15 @@
word-break: break-all; word-break: break-all;
} }
.dec { .dec {
margin: 8px 8px; margin: 8px 8px;
text-align: center; text-align: center;
padding-right: 10px; padding-right: 10px;
color: #0058e1; color: #0058e1;
span { span {
background: rgba(0, 88, 225, 0.1); background: rgba(0, 88, 225, 0.1);
padding: 5px 5px; padding: 5px 5px;
}
} }
}
.text { .text {
width: 100%; width: 100%;
height: 0.9rem; height: 0.9rem;

View File

@ -48,11 +48,10 @@
<div class="dec"> <div class="dec">
<span>{{ item.deptName }}</span> <span>{{ item.deptName }}</span>
</div> </div>
<a-tooltip > <a-tooltip>
<template #title>{{ item.description || '暂无描述' }}</template> <template #title>{{ item.description || '暂无描述' }}</template>
<div class="text">{{item.description || '暂无描述'}}</div> <div class="text">{{ item.description || '暂无描述' }}</div>
</a-tooltip> </a-tooltip>
</div> </div>
</div> </div>
</div> </div>
@ -65,302 +64,312 @@
</div> </div>
</template> </template>
<script setup> <script setup>
import { ref } from 'vue' import { ref } from 'vue'
import { pageWithAttrs } from '@/api/home.js' import { pageWithAttrs } from '@/api/home.js'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { useStore } from 'vuex' import { useStore } from 'vuex'
import { DETAIL_PAGE_CONTENT_DEFAULT_TAB } from '@/global/GlobalConfig.js' import { DETAIL_PAGE_CONTENT_DEFAULT_TAB } from '@/global/GlobalConfig.js'
const store = useStore() const store = useStore()
const router = useRouter() const router = useRouter()
const select = ref('申请量') const select = ref('申请量')
const selList = ref(['申请量', '收藏量']) const selList = ref(['申请量', '收藏量'])
const list = ref([]) const list = ref([])
const paramsGetResources = { const paramsGetResources = {
districtId: '', districtId: '',
pageNum: 1, pageNum: 1,
pageSize: 6, pageSize: 6,
type: '应用资源', type: '应用资源',
name: '', name: '',
infoList: [], infoList: [],
orderField: 'applyCount', // total visits applyCount score collectCount orderField: 'applyCount', // total visits applyCount score collectCount
orderType: 'DESC', // ASC DESC orderType: 'DESC', // ASC DESC
} }
const selectChange = (sel) => { const selectChange = (sel) => {
select.value = sel select.value = sel
switch (select.value) { switch (select.value) {
case '浏览量': case '浏览量':
paramsGetResources.orderField = 'visits' paramsGetResources.orderField = 'visits'
break break
case '申请量': case '申请量':
paramsGetResources.orderField = 'applyCount' paramsGetResources.orderField = 'applyCount'
break break
case '收藏量': case '收藏量':
paramsGetResources.orderField = 'collectCount' paramsGetResources.orderField = 'collectCount'
break break
default: default:
paramsGetResources.orderField = 'total' paramsGetResources.orderField = 'total'
break break
}
getList()
}
const getList = () => {
pageWithAttrs(paramsGetResources).then((res) => {
console.log('查询列表============>', res.data.data.records)
res.data.data.records.forEach((val) => {
switch (val.type) {
case '组件服务':
val.imgType = 'zj'
break
case '应用资源':
val.imgType = 'yy'
break
case '基础设施':
val.imgType = 'jc'
break
case '数据资源':
val.imgType = 'sj'
break
case '知识库':
val.imgType = 'zs'
break
default:
val.imgType = 'zj'
break
}
})
list.value = res.data.data.records
})
} }
getList() getList()
}
const getList = () => {
pageWithAttrs(paramsGetResources).then((res) => {
console.log('查询列表============>', res.data.data.records)
res.data.data.records.forEach((val) => {
switch (val.type) {
case '组件服务':
val.imgType = 'zj'
break
case '应用资源':
val.imgType = 'yy'
break
case '基础设施':
val.imgType = 'jc'
break
case '数据资源':
val.imgType = 'sj'
break
case '知识库':
val.imgType = 'zs'
break
default:
val.imgType = 'zj'
break
}
})
list.value = res.data.data.records
})
}
getList()
function jumpPage() { function jumpPage() {
// store // store
store.commit('home/selectCardsData', { store.commit('home/selectCardsData', {
selectCardsnum: '组件服务', selectCardsnum: '组件服务',
}) })
console.log('选中===================>', store.getters['home/selectCardsnum']) console.log(
router.push({ '选中===================>',
path: '/DetailsPageconetent', store.getters['home/selectCardsnum']
query: { )
// select: '', router.push({
select: DETAIL_PAGE_CONTENT_DEFAULT_TAB, path: '/DetailsPageconetent',
orderField:paramsGetResources.orderField // query: {
}, // select: '',
}) select: DETAIL_PAGE_CONTENT_DEFAULT_TAB,
} orderField: paramsGetResources.orderField, //
const selectOne = (id) => { },
console.log('点击===============》', id) })
router.push({ }
path: '/details', const selectOne = (id) => {
query: { console.log('点击===============》', id)
id: id, // router.push({
}, // path: '/details',
}) // query: {
} // id: id,
// },
// })
const detailPage = router.resolve({
path: '/details', //
query: {
id: id,
hiddenBackFlag: true,
},
})
window.open(detailPage.href, '_blank')
}
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.popular-ability { .popular-ability {
height: 6.8rem; height: 6.8rem;
background: url('~@/assets/newHome/popular-bg.png') no-repeat; background: url('~@/assets/newHome/popular-bg.png') no-repeat;
background-size: 100%; background-size: 100%;
display: flex;
justify-content: center;
.main {
width: 13rem;
margin-top: 0.78rem;
display: flex; display: flex;
flex-direction: column; justify-content: center;
flex-wrap: wrap; .main {
.top { width: 13rem;
font-size: 0.3rem; margin-top: 0.78rem;
color: #fff;
text-align: center;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: center; .top {
align-items: center; font-size: 0.3rem;
.line { color: #fff;
width: 0.34rem; text-align: center;
height: 0.03rem;
background-color: #fff;
margin-top: 0.08rem;
}
}
.bottom {
display: flex;
justify-content: space-between;
margin-top: 0.52rem;
.left {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
flex-wrap: wrap; flex-wrap: wrap;
.select { justify-content: center;
cursor: pointer; align-items: center;
.line {
width: 0.34rem;
height: 0.03rem;
background-color: #fff;
margin-top: 0.08rem;
}
}
.bottom {
display: flex;
justify-content: space-between;
margin-top: 0.52rem;
.left {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
flex-wrap: wrap; flex-wrap: wrap;
align-items: center; .select {
justify-content: center; cursor: pointer;
width: 1.05rem;
height: 2.1rem;
background: rgba(255, 255, 255, 0.08);
margin-bottom: 0.01rem;
border-right: 0.02rem solid rgba(233, 233, 233, 0.3);
.img {
width: 0.36rem;
height: 0.36rem;
background-size: 100%;
}
.fwl {
background: url('~@/assets/newHome/fwl-no.png') no-repeat;
background-size: contain;
}
.sgl {
background: url('~@/assets/newHome/sgl-no.png') no-repeat;
background-size: contain;
}
.scl {
background: url('~@/assets/newHome/scl-no.png') no-repeat;
background-size: contain;
}
.text {
color: rgba(255, 255, 255, 0.6);
font-size: 0.14rem;
}
}
.select:hover {
background: rgba(255, 255, 255, 0.12);
}
.checked {
background: rgba(255, 255, 255, 0.18) !important;
border-right: 0.02rem solid #fff;
}
}
.right {
cursor: pointer;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-left: 0.2rem;
.item {
width: 3.78rem;
height: 2rem;
display: flex;
.item-left {
width: 0.83rem;
height: 100%;
display: flex; display: flex;
justify-content: center; flex-direction: column;
flex-wrap: wrap;
align-items: center; align-items: center;
background: #eef1f8; justify-content: center;
width: 1.05rem;
height: 2.1rem;
background: rgba(255, 255, 255, 0.08);
margin-bottom: 0.01rem;
border-right: 0.02rem solid rgba(233, 233, 233, 0.3);
.img { .img {
width: 0.56rem; width: 0.36rem;
height: 0.56rem; height: 0.36rem;
background-size: 100%; background-size: 100%;
} }
.zj { .fwl {
background: url('~@/assets/newHome/popular-zj.png') no-repeat; background: url('~@/assets/newHome/fwl-no.png') no-repeat;
background-size: contain; background-size: contain;
} }
.yy { .sgl {
background: url('~@/assets/newHome/popular-yy.png') no-repeat; background: url('~@/assets/newHome/sgl-no.png') no-repeat;
background-size: contain; background-size: contain;
} }
.jc { .scl {
background: url('~@/assets/newHome/popular-jc.png') no-repeat; background: url('~@/assets/newHome/scl-no.png') no-repeat;
background-size: contain; background-size: contain;
} }
.sj {
background: url('~@/assets/newHome/popular-sj.png') no-repeat;
background-size: contain;
}
.zs {
background: url('~@/assets/newHome/popular-zs.png') no-repeat;
background-size: contain;
}
}
.item-right {
width: 100%;
height: 100%;
background: #fff;
.fw {
width: 100%;
padding-right: 0.1rem;
padding-top: 0.03rem;
text-align: right;
color: 666;
font-size: 0.14rem;
color: #666;
}
.name {
font-size: 0.18rem;
color: #212121;
text-align: center;
margin-top: 0.05rem;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
word-break: break-all;
}
.dec {
margin: 8px 8px;
text-align: center;
padding-right: 10px;
color: #0058e1;
span {
background: rgba(0, 88, 225, 0.1);
padding: 5px 5px;
}
}
.text { .text {
width: 100%; color: rgba(255, 255, 255, 0.6);
padding: 0rem 0.03rem;
font-size: 0.14rem; font-size: 0.14rem;
color: #212121;
line-height: 0.24rem;
height: 1rem;
word-break: break-all;
overflow: hidden;
} }
} }
.select:hover {
background: rgba(255, 255, 255, 0.12);
}
.checked {
background: rgba(255, 255, 255, 0.18) !important;
border-right: 0.02rem solid #fff;
}
} }
.item:nth-of-type(4), .right {
.item:nth-of-type(5), cursor: pointer;
.item:nth-of-type(6) { display: flex;
margin-top: 0.2rem; justify-content: space-between;
} flex-wrap: wrap;
.item:hover { margin-left: 0.2rem;
border-radius: 0.02rem; .item {
border: 0.01rem solid #0058e1; width: 3.78rem;
box-shadow: 0rem 0.08rem 0.2rem rgba(0, 88, 225, 0.3); height: 2rem;
display: flex;
.item-left {
width: 0.83rem;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
background: #eef1f8;
.img {
width: 0.56rem;
height: 0.56rem;
background-size: 100%;
}
.zj {
background: url('~@/assets/newHome/popular-zj.png') no-repeat;
background-size: contain;
}
.yy {
background: url('~@/assets/newHome/popular-yy.png') no-repeat;
background-size: contain;
}
.jc {
background: url('~@/assets/newHome/popular-jc.png') no-repeat;
background-size: contain;
}
.sj {
background: url('~@/assets/newHome/popular-sj.png') no-repeat;
background-size: contain;
}
.zs {
background: url('~@/assets/newHome/popular-zs.png') no-repeat;
background-size: contain;
}
}
.item-right {
width: 100%;
height: 100%;
background: #fff;
.fw {
width: 100%;
padding-right: 0.1rem;
padding-top: 0.03rem;
text-align: right;
color: 666;
font-size: 0.14rem;
color: #666;
}
.name {
font-size: 0.18rem;
color: #212121;
text-align: center;
margin-top: 0.05rem;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
word-break: break-all;
}
.dec {
margin: 8px 8px;
text-align: center;
padding-right: 10px;
color: #0058e1;
span {
background: rgba(0, 88, 225, 0.1);
padding: 5px 5px;
}
}
.text {
width: 100%;
padding: 0rem 0.03rem;
font-size: 0.14rem;
color: #212121;
line-height: 0.24rem;
height: 1rem;
word-break: break-all;
overflow: hidden;
}
}
}
.item:nth-of-type(4),
.item:nth-of-type(5),
.item:nth-of-type(6) {
margin-top: 0.2rem;
}
.item:hover {
border-radius: 0.02rem;
border: 0.01rem solid #0058e1;
box-shadow: 0rem 0.08rem 0.2rem rgba(0, 88, 225, 0.3);
}
} }
} }
} .bottom-btn {
.bottom-btn { cursor: pointer;
cursor: pointer; text-align: center;
text-align: center; margin-top: 0.24rem;
margin-top: 0.24rem; color: #fff;
color: #fff; width: 1rem;
width: 1rem; height: 0.24rem;
height: 0.24rem; line-height: 0.24rem;
line-height: 0.24rem; margin-left: 6rem;
margin-left: 6rem; span {
span { display: inline-block;
display: inline-block; width: 0.1rem;
width: 0.1rem; height: 0.1rem;
height: 0.1rem; background: url('~@/assets/newHome/gd.png') no-repeat;
background: url('~@/assets/newHome/gd.png') no-repeat; background-size: contain;
background-size: contain; }
}
.bottom-btn:hover {
background: rgba(0, 88, 225, 0.1);
} }
}
.bottom-btn:hover {
background: rgba(0, 88, 225, 0.1);
} }
} }
}
</style> </style>

View File

@ -104,12 +104,20 @@
} }
const selectOne = (id) => { const selectOne = (id) => {
console.log('点击===============》', id) console.log('点击===============》', id)
router.push({ // router.push({
path: '/details', // path: '/details',
// query: {
// id: id,
// },
// })
const detailPage = router.resolve({
path: '/details', //
query: { query: {
id: id, id: id,
hiddenBackFlag: true,
}, },
}) })
window.open(detailPage.href, '_blank')
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>