栏目左侧导航等

mobile
yujialong 2 years ago
parent 51e2105c94
commit d784d757ac
  1. 2
      src/layouts/header/index.vue
  2. 24
      src/mixins/page/index.js
  3. 43
      src/pages/column/index.vue
  4. 9
      src/pages/news/index.vue
  5. 1
      src/pages/research/index.vue

@ -97,10 +97,10 @@ $height: 90px;
width: 100%; width: 100%;
min-width: $min-width; min-width: $min-width;
height: $height; height: $height;
border-bottom: 1px solid #f7f7f7;
box-sizing: content-box; box-sizing: content-box;
&:not(.channel) { &:not(.channel) {
background-color: #fff; background-color: #fff;
border-bottom: 1px solid #f7f7f7;
} }
.logo{ .logo{
position: absolute; position: absolute;

@ -27,12 +27,13 @@ export default {
if (data.data.isDisable) { if (data.data.isDisable) {
return Util.errorMsg('该文章已禁用!') return Util.errorMsg('该文章已禁用!')
} else { } else {
href = '/article?articleId=' + link.articleId + '&id=' + link.columnId[link.columnId.length - 1] href = '/article?articleId=' + link.articleId
} }
} else { // 栏目 } else { // 栏目
href = '/column?id=' + link.columnId[link.columnId.length - 1] href = '/column?id=' + link.columnId[link.columnId.length - 1]
} }
href = this.$router.resolve(href + '&siteId=' + (this.$route.query.siteId || this.site)).href href += '&siteId=' + (this.$route.query.siteId || this.site)
if (!link.articleId) href = this.$router.resolve(href).href
} else if (type === 3) { // 站外链接 } else if (type === 3) { // 站外链接
if (link.otherArticleId) { // 文章 if (link.otherArticleId) { // 文章
// 查询文章详情。禁用的文章要提示 // 查询文章详情。禁用的文章要提示
@ -40,14 +41,27 @@ export default {
if (data.data.isDisable) { if (data.data.isDisable) {
return Util.errorMsg('该文章已禁用!') return Util.errorMsg('该文章已禁用!')
} else { } else {
href = '/article?articleId=' + link.otherArticleId + '&id=' + link.otherColumnId[link.otherColumnId.length - 1] href = '/article?articleId=' + link.otherArticleId
} }
} else { // 栏目 } else { // 栏目
href = '/column?id=' + link.otherColumnId[link.otherColumnId.length - 1] href = '/column?id=' + link.otherColumnId[link.otherColumnId.length - 1]
} }
href = this.$router.resolve(href + '&siteId=' + link.site).href href += '&siteId=' + link.site
if (!link.otherArticleId) href = this.$router.resolve(href).href
} }
if (link.isOpen) { // 如果是站内/站外链接,并且选择的是文章,则要获取当前长页名称传到文章详情里,面包屑点返回的时候需要返回到当前长页
if ((type === 1 && link.articleId) || (type === 3 && link.otherArticleId)) {
this.$post(`${this.api.findColumn}?id=${this.id}`).then(({ data }) => {
href = this.$router.resolve(href + '&id=' + this.id + '&columnName=' + data.columnName + '&path=' + this.$route.path.replace('/', '')).href
this.toHref(link.isOpen, href)
}).catch(res => {})
} else {
this.toHref(link.isOpen, href)
}
},
// 跳转地址
toHref(isOpen, href) {
if (isOpen) {
window.open(href) window.open(href)
} else { } else {
location.href = href location.href = href

@ -167,7 +167,8 @@ export default {
label: 'columnName' label: 'columnName'
}, },
news: [], news: [],
hots: [] hots: [],
deepestId: ''
} }
}, },
computed: { computed: {
@ -206,7 +207,6 @@ export default {
convokeType: null convokeType: null
} }
} else { } else {
this.getLeftColumn()
this.getInfo() this.getInfo()
} }
this.getColumn() this.getColumn()
@ -221,6 +221,7 @@ export default {
if (!data.columnBanner) data.columnBanner = require('@/assets/images/column-banner.png') if (!data.columnBanner) data.columnBanner = require('@/assets/images/column-banner.png')
this.info = data this.info = data
this.showNav = this.showNavIds.includes(data.listStyleId) this.showNav = this.showNavIds.includes(data.listStyleId)
this.getLeftColumn()
this.getClassification() this.getClassification()
}).catch(res => {}) }).catch(res => {})
}, },
@ -243,24 +244,46 @@ export default {
}).catch(err => {}) }).catch(err => {})
}, },
// //
handleColumn(data, id) { handleColumn(data, parent) {
for (const e of data) { for (const e of data) {
if (this.info.typeId === 4) { //
if (e.children.length) {
this.handleColumn(e.children)
} else if (!this.deepestId) {
this.deepestId = e.id
}
} else { //
if (e.id == this.id) {
this.allColumnId.push(e.id) this.allColumnId.push(e.id)
if (e.listStyleId !== id) { e.children.length && this.handleColumn(e.children, 1)
} else if (parent) {
if (e.listStyleId !== this.info.listStyleId) {
this.sameStyle = 0 this.sameStyle = 0
break break
} else {
this.allColumnId.push(e.id)
e.children.length && this.handleColumn(e.children, parent)
}
} else {
e.children.length && this.handleColumn(e.children, parent)
}
} }
this.handleColumn(e.children, id)
} }
}, },
// //
getLeftColumn() { getLeftColumn() {
this.$post(`${this.api.oneLevelChecksThemAll}?id=${this.id}`).then(({ data }) => { this.$post(`${this.api.oneLevelChecksThemAll}?id=${this.id}`).then(({ data }) => {
const fromColumn = this.$route.query.column // column const fromColumn = this.$route.query.column // column
const { typeId } = this.info
this.sameStyle = 1 this.sameStyle = 1
this.allColumnId = [] this.allColumnId = []
data.length && this.handleColumn(data, data[0].listStyleId) this.deepestId = ''
this.getArticle(this.sameStyle && !fromColumn ? this.allColumnId : [+this.$route.query.id]) data.length && this.handleColumn(data)
let id = this.sameStyle && typeId === 1 ? this.allColumnId : [+this.$route.query.id]
if (typeId === 4 && !fromColumn) {
id = [this.deepestId]
}
this.getArticle(id)
this.columns = data this.columns = data
this.$nextTick(() => { this.$nextTick(() => {
const el = this.$refs.leftColumn const el = this.$refs.leftColumn
@ -339,8 +362,9 @@ export default {
// //
const el = this.$refs.leftColumn const el = this.$refs.leftColumn
if (el) { if (el) {
this.$refs.leftColumn.store.nodesMap[to.id].expanded = !this.$refs.leftColumn.store.nodesMap[to.id].expanded // const exp = el.store.nodesMap[to.id].expanded
this.getArticle([to.children[0].id]) el.store.nodesMap[to.id].expanded = !exp //
el.setCurrentKey(this.id)
} }
} }
}, },
@ -367,7 +391,6 @@ export default {
...this.form ...this.form
}).then(({ data }) => { }).then(({ data }) => {
this.articles = Util.removeTag(data.records) this.articles = Util.removeTag(data.records)
console.log("🚀 ~ file: index.vue:369 ~ getArticle ~ this.articles", this.articles)
this.total = +data.total this.total = +data.total
// //
// this.total == 1 && this.info.showWithDetails && this.$router.push(`/article?articleId=${this.articles[0].id}&id=${this.articles[0].columnId}`) // this.total == 1 && this.info.showWithDetails && this.$router.push(`/article?articleId=${this.articles[0].id}&id=${this.articles[0].columnId}`)

@ -20,13 +20,7 @@
<div class="block"> <div class="block">
<div class="inner" v-if="modules[1].list[curColumn].articles.length"> <div class="inner" v-if="modules[1].list[curColumn].articles.length">
<div class="banner wow fadeInDown" data-wow-delay="0.5s" @click="toArtice(curArticle, modules[1].list[curColumn])"> <div class="banner wow fadeInDown" data-wow-delay="0.5s" @click="toArtice(curArticle, modules[1].list[curColumn])">
<el-carousel ref="carousel" class="articles" height="410px" arrow="never" :autoplay="false"> <img width="50%" height="410" :src="curArticle.titleImg" alt="">
<template v-for="(item, i) in modules[1].list[curColumn].articles">
<el-carousel-item v-if="i < 3" :key="i">
<img width="100%" height="480" :src="item.titleImg" alt="">
</el-carousel-item>
</template>
</el-carousel>
<div class="right"> <div class="right">
<h6>{{ curArticle.title }}</h6> <h6>{{ curArticle.title }}</h6>
<div class="des" v-html="curArticle.mainBody"></div> <div class="des" v-html="curArticle.mainBody"></div>
@ -209,7 +203,6 @@ export default {
// //
switchCarousel(i) { switchCarousel(i) {
if (this.curInd !== i) { if (this.curInd !== i) {
this.$refs.carousel[this.curInd > i ? 'prev' : 'next']()
this.curInd = i this.curInd = i
this.curArticle = this.modules[1].list[this.curColumn].articles[i] this.curArticle = this.modules[1].list[this.curColumn].articles[i]
} }

@ -181,6 +181,7 @@ export default {
justify-content: center; justify-content: center;
align-items: center; align-items: center;
height: 143px; height: 143px;
padding: 0 30px;
font-size: 30px; font-size: 30px;
font-family: SFProDisplay-Bold, SFProDisplay; font-family: SFProDisplay-Bold, SFProDisplay;
font-weight: bold; font-weight: bold;

Loading…
Cancel
Save