jialong.yu
/
FE_IASF_client
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 3 Wiki Activity

fix

Browse Source
master
yujialong 1 year ago
parent ef28afc850
commit e452965be2
6 changed files with 241 additions and 75 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 5
      package-lock.json
  2. 1
      package.json
  3. 80
      src/components/rightColumns/index.vue
  4. 1
      src/mixins/article/index.js
  5. 160
      src/pages/column/index.vue
  6. 69
      src/pages/iasf/index.vue

5
package-lock.json generated
Unescape View File

@ -8308,6 +8308,11 @@
"integrity": "sha1-FC0RHzpuPa6PSpr9d9RYVbWpzOM=", "integrity": "sha1-FC0RHzpuPa6PSpr9d9RYVbWpzOM=",
"dev": true "dev": true
}, },
"jquery": {
"version": "3.7.1",
"resolved": "https://registry.npmjs.org/jquery/-/jquery-3.7.1.tgz",
"integrity": "sha512-m4avr8yL8kmFN8psrbFFFmB/If14iN5o9nw/NgnnM+kybDJpRsAynV2BsfpTYrTRysYUdADVD7CkUUizgkpLfg=="
},
"js-base64": { "js-base64": {
"version": "2.6.4", "version": "2.6.4",
"resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.6.4.tgz", "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.6.4.tgz",

1
package.json
Unescape View File

@ -15,6 +15,7 @@
"element-theme": "^2.0.1", "element-theme": "^2.0.1",
"element-ui": "^2.15.6", "element-ui": "^2.15.6",
"html2canvas": "^1.3.2", "html2canvas": "^1.3.2",
"jquery": "^3.7.1",
"js-cookie": "^2.2.1", "js-cookie": "^2.2.1",
"jspdf": "^2.4.0", "jspdf": "^2.4.0",
"lru-cache": "^7.14.1", "lru-cache": "^7.14.1",

80
src/components/rightColumns/index.vue
Unescape View File

@ -9,27 +9,41 @@
node-key="id" node-key="id"
@node-click="columnTo"></el-tree> @node-click="columnTo"></el-tree>
<p class="l-title">{{$t('column.hot')}}</p> <template v-if="site == 2">
<ul class="list"> <p class="l-title">{{ $t('column.latestNews') }}</p>
<li v-for="(item, i) in hots" <ul class="list">
:key="i" <li v-for="(item, i) in site2News"
:title="item.title" :key="i"
@click="toArtice(item)"> :title="item.title"
<p class="text">{{ item.title }}</p> @click="toArtice(item)">
<span class="date">{{ item.releaseTime }}</span> <p class="text">{{ item.title }}</p>
</li> <span class="date">{{ item.releaseTime }}</span>
</ul> </li>
</ul>
</template>
<template v-else>
<p class="l-title">{{$t('column.hot')}}</p>
<ul class="list">
<li v-for="(item, i) in hots"
:key="i"
:title="item.title"
@click="toArtice(item)">
<p class="text">{{ item.title }}</p>
<span class="date">{{ item.releaseTime }}</span>
</li>
</ul>
<p class="l-title">{{$t('column.latestNews')}}</p> <p class="l-title">{{$t('column.latestNews')}}</p>
<ul class="list"> <ul class="list">
<li v-for="(item, i) in news" <li v-for="(item, i) in news"
:key="i" :key="i"
:title="item.title" :title="item.title"
@click="toArtice(item)"> @click="toArtice(item)">
<p class="text">{{ item.title }}</p> <p class="text">{{ item.title }}</p>
<span class="date">{{ item.releaseTime }}</span> <span class="date">{{ item.releaseTime }}</span>
</li> </li>
</ul> </ul>
</template>
</div> </div>
</template> </template>
@ -47,6 +61,7 @@ export default {
label: 'columnName' label: 'columnName'
}, },
news: [], news: [],
site2News: [],
hots: [] hots: []
} }
}, },
@ -71,13 +86,24 @@ export default {
this.hots = Util.removeTag(data) this.hots = Util.removeTag(data)
}).catch(err => { }) }).catch(err => { })
this.$post(this.api.newlyPublishedArticles, { if (this.site == 2) {
pageNum: 1, this.$post(this.api.newlyPublishedArticles, {
pageSize: 5, siteId: this.site,
siteId: this.site columnIds: [411, 412, 413],
}).then(({ data }) => { pageNum: 1,
this.news = Util.removeTag(data.records) pageSize: 8,
}).catch(res => { }) }).then(({ data }) => {
this.site2News = Util.removeTag(data.records);
}).catch((res) => { });
} else {
this.$post(this.api.newlyPublishedArticles, {
pageNum: 1,
pageSize: 5,
siteId: this.site
}).then(({ data }) => {
this.news = Util.removeTag(data.records)
}).catch(res => { })
}
}, },
} }
} }

1
src/mixins/article/index.js
Unescape View File

@ -56,6 +56,7 @@ export default {
}, },
// 跳转文章页面 // 跳转文章页面
toArtice(item) { toArtice(item) {
if (item.listStyleId === 74) return false
if (item.articleTemplate === 24) { // 链接 if (item.articleTemplate === 24) { // 链接
let href = item.linkAddress let href = item.linkAddress
const cType = item.connectionType const cType = item.connectionType

160
src/pages/column/index.vue
Unescape View File

@ -321,7 +321,7 @@
</template> </template>
<template v-else> <template v-else>
<div class="article-wrap"> <div class="article-wrap">
<ul class="articles"> <ul :class="['articles', {media: info.listStyleId === 74}]">
<li v-for="(item, i) in articles" <li v-for="(item, i) in articles"
:key="i" :key="i"
:class="{'news-notice': info.listStyleId === 55, 'org': info.listStyleId === 68}" :class="{'news-notice': info.listStyleId === 55, 'org': info.listStyleId === 68}"
@ -335,10 +335,29 @@
<div class="news-title">{{ item.title }}</div> <div class="news-title">{{ item.title }}</div>
</template> </template>
<template v-else> <template v-else>
<img class="pic" <img v-if="info.listStyleId !== 74"
class="pic"
:src="item.titleImg" :src="item.titleImg"
alt="" alt=""
onerror="javascript:this.src='./images/1.png';" /> onerror="javascript:this.src='./images/1.png';" />
<template v-else>
<video v-if="Util.isVideo(item.fileList[0].fileName.substring(item.fileList[0].fileName.lastIndexOf('.') + 1))"
class="media-video"
controls
preload>
<source :src="item.fileList[0].filePath"
type="video/mp4">
您的浏览器不支持 video 标签。
</video>
<el-image v-else
class="media-pic"
:style="{backgroundImage: 'url(' + item.fileList[0].filePath + ')'}"
:src="item.fileList[0].filePath"
:preview-src-list="[item.fileList[0].filePath]">
</el-image>
</template>
<div class="texts"> <div class="texts">
<p v-if="(item.listStyleId === 10 || item.listStyleId === 15) && item.classificationName" <p v-if="(item.listStyleId === 10 || item.listStyleId === 15) && item.classificationName"
class="type"> class="type">
@ -383,13 +402,11 @@
<el-button v-if="item.listStyleId === 15 || item.listStyleId == 68" <el-button v-if="item.listStyleId === 15 || item.listStyleId == 68"
type="primary" type="primary"
class="readDetailBtn">{{ $t('column.readDetail') }}</el-button> class="readDetailBtn">{{ $t('column.readDetail') }}</el-button>
</div> </div>
</template> </template>
</li> </li>
</ul> </ul>
<div v-if="articles.length" <div v-if="articles.length > pageSize"
class="pagination"> class="pagination">
<el-pagination background <el-pagination background
@current-change="currentChange" @current-change="currentChange"
@ -410,31 +427,46 @@
</div> </div>
</div> </div>
</div> </div>
<!-- 选择了“列表样式”，不用显示右侧部分 --> <template v-if="info.listStyleId !== 73 && info.listStyleId !== 74">
<div v-if="info.listStyleId !== 73" <div v-if="site == 2"
class="right"> class="right">
<p class="l-title">{{ $t('column.hot') }}</p> <p class="l-title">{{ $t('column.latestNews') }}</p>
<ul class="list"> <ul class="list">
<li v-for="(item, i) in hots" <li v-for="(item, i) in site2News"
:key="i" :key="i"
:title="item.title" :title="item.title"
@click="toArtice(item)"> @click="toArtice(item)">
<p class="text">{{ item.title }}</p> <p class="text">{{ item.title }}</p>
<span class="date">{{ item.releaseTime }}</span> <span class="date">{{ item.releaseTime }}</span>
</li> </li>
</ul> </ul>
</div>
<p class="l-title">{{ $t('column.latestNews') }}</p> <!-- 选择了“列表样式”，不用显示右侧部分 -->
<ul class="list"> <div v-else
<li v-for="(item, i) in news" class="right">
:key="i" <p class="l-title">{{ $t('column.hot') }}</p>
:title="item.title" <ul class="list">
@click="toArtice(item)"> <li v-for="(item, i) in hots"
<p class="text">{{ item.title }}</p> :key="i"
<span class="date">{{ item.releaseTime }}</span> :title="item.title"
</li> @click="toArtice(item)">
</ul> <p class="text">{{ item.title }}</p>
</div> <span class="date">{{ item.releaseTime }}</span>
</li>
</ul>
<p class="l-title">{{ $t('column.latestNews') }}</p>
<ul class="list">
<li v-for="(item, i) in news"
:key="i"
:title="item.title"
@click="toArtice(item)">
<p class="text">{{ item.title }}</p>
<span class="date">{{ item.releaseTime }}</span>
</li>
</ul>
</div>
</template>
</div> </div>
</div> </div>
</div> </div>
@ -449,6 +481,7 @@ export default {
mixins: [mixins], mixins: [mixins],
data () { data () {
return { return {
Util,
loaded: false, loaded: false,
fromColumn: this.$route.query.column, fromColumn: this.$route.query.column,
columnId: '', columnId: '',
@ -469,7 +502,7 @@ export default {
sameStyle: 1, sameStyle: 1,
allColumnId: [], allColumnId: [],
showNav: false, showNav: false,
showNavIds: [10, 11, 12, 16, 55, 68, 73], // 显示侧导航的模板id showNavIds: [10, 11, 12, 16, 55, 68, 73, 74], // 显示侧导航的模板id
isFilter: false, isFilter: false,
page: 1, page: 1,
pageSize: 10, pageSize: 10,
@ -479,6 +512,7 @@ export default {
value: 'id', value: 'id',
label: 'columnName' label: 'columnName'
}, },
site2News: [],
news: [], news: [],
hots: [], hots: [],
deepestId: '', deepestId: '',
@ -677,15 +711,24 @@ export default {
}, },
// 最新资讯 // 最新资讯
getNews () { getNews () {
this.$post(this.api.newlyPublishedArticles, { if (this.site == 2) {
pageNum: 1, this.$post(this.api.newlyPublishedArticles, {
pageSize: 5, siteId: this.site,
siteId: this.site columnIds: [411, 412, 413],
}) pageNum: 1,
.then(({ data }) => { pageSize: 10,
}).then(({ data }) => {
this.site2News = Util.removeTag(data.records);
}).catch((res) => { });
} else {
this.$post(this.api.newlyPublishedArticles, {
pageNum: 1,
pageSize: 5,
siteId: this.site
}).then(({ data }) => {
this.news = Util.removeTag(data.records); this.news = Util.removeTag(data.records);
}) }).catch((res) => { });
.catch((res) => { }); }
}, },
// 会议时间筛选回调 // 会议时间筛选回调
switchChange (item) { switchChange (item) {
@ -1121,6 +1164,43 @@ export default {
height: auto; height: auto;
} }
} }
.media {
display: flex;
flex-wrap: wrap;
margin-left: 10px;
li {
flex-direction: column;
width: calc(25% - 20px);
margin-right: 20px;
background-color: transparent;
&:nth-child(4n) {
margin-right: 0;
}
}
.media-video {
width: 100%;
height: 200px;
}
/deep/.media-pic {
width: 100%;
height: 200px;
// background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
img {
opacity: 0;
}
}
.texts {
width: 100% !important;
padding-left: 0;
}
h6 {
margin-top: 10px;
margin-bottom: 0;
text-align: center;
}
}
.news-notice { .news-notice {
.releaseTime { .releaseTime {
width: 88px; width: 88px;
@ -1253,6 +1333,8 @@ export default {
} }
.detail { .detail {
flex: 1; flex: 1;
padding: 10px 15px;
background-color: #fff;
h2 { h2 {
margin-bottom: 1rem; margin-bottom: 1rem;
font-size: 1.9rem; font-size: 1.9rem;

69
src/pages/iasf/index.vue
Unescape View File

@ -1,6 +1,7 @@
<template> <template>
<div class="wrap"> <div class="wrap">
<el-carousel :class="['carousel']" <el-carousel :class="['carousel']"
id="part1"
:interval="6000" :interval="6000"
:arrow="(modules[0] && modules[0].list.filter(e => e.isEnable).length > 1) ? 'hover' : 'never'" :arrow="(modules[0] && modules[0].list.filter(e => e.isEnable).length > 1) ? 'hover' : 'never'"
:indicator-position="modules[0].list.filter(e => e.isEnable).length > 1 ? '' : 'none'"> :indicator-position="modules[0].list.filter(e => e.isEnable).length > 1 ? '' : 'none'">
@ -19,9 +20,9 @@
</el-carousel-item> </el-carousel-item>
</template> </template>
</el-carousel> </el-carousel>
<div :class="['block-wrap',{active: hide}]"> <div :class="['block-wrap',{active: hide}]"
<div class="block" id="part2">
style="padding-top: 80px"> <div class="block card-block">
<div class="inner"> <div class="inner">
<h2 class="b-title">{{ modules[1].form.title }}</h2> <h2 class="b-title">{{ modules[1].form.title }}</h2>
<p class="intro" <p class="intro"
@ -291,6 +292,7 @@ import mixins from '@/mixins/page'
import Setting from '@/setting' import Setting from '@/setting'
import Util from '@/libs/util' import Util from '@/libs/util'
import WOW from 'wow.js' import WOW from 'wow.js'
import $ from 'jquery'
export default { export default {
mixins: [mixins], mixins: [mixins],
data () { data () {
@ -316,7 +318,7 @@ export default {
this.height = window.innerHeight + 'px' this.height = window.innerHeight + 'px'
new WOW().init() new WOW().init()
document.onscroll = this.throttle(this.scroll, 100) document.onscroll = this.throttle(this.scroll, 200)
}, },
methods: { methods: {
// 获取文章详情 // 获取文章详情
@ -415,14 +417,60 @@ export default {
scroll () { scroll () {
let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
console.log(33, this.lastScrollTop < scrollTop) if (this.lastScrollTop < scrollTop && !this.hide) {
if (this.lastScrollTop < scrollTop && scrollTop > 10) { // this.hide = true
// document.querySelector(`#part2`).scrollIntoView({
// behavior: 'smooth'
// })
this.hide = true this.hide = true
} else if (this.lastScrollTop > scrollTop && scrollTop <= (window.innerWidth / 2.03)) { setTimeout(() => {
$(window).scrollTop(100)
// window.scrollTo({
// top: window.innerWidth / 2.03,
// behavior: 'smooth' // 平滑滚动
// });
// this.scrollTop(window.innerWidth / 2.03, 200)
}, 300)
} else if (this.lastScrollTop > scrollTop && scrollTop == 0 && this.hide) {
// this.hide = false
// document.querySelector(`#part1`).scrollIntoView({
// behavior: 'smooth'
// })
// window.scrollTo({
// top: 0,
// behavior: 'smooth' // 平滑滚动
// });
this.hide = false this.hide = false
setTimeout(() => {
$(window).scrollTop(0)
// window.scrollTo({
// top: 0,
// behavior: 'smooth' // 平滑滚动
// });
// this.scrollTop(0, 200)
}, 300)
} }
this.lastScrollTop = scrollTop this.lastScrollTop = scrollTop
}, },
scrollTop (number = 0, time) {
if (!time) {
document.body.scrollTop = document.documentElement.scrollTop = number;
return number;
}
const spacingTime = 20; // 设置循环的间隔时间 值越小消耗性能越高
let spacingInex = time / spacingTime; // 计算循环的次数
let nowTop = document.body.scrollTop + document.documentElement.scrollTop; // 获取当前滚动条位置
let everTop = (number - nowTop) / spacingInex; // 计算每次滑动的距离
let scrollTimer = setInterval(() => {
if (spacingInex > 0) {
spacingInex--;
this.scrollTop(nowTop += everTop);
} else {
clearInterval(scrollTimer); // 清除计时器
}
}, spacingTime);
},
// 节流 // 节流
throttle (fn, time) { throttle (fn, time) {
// 上一次的执行时间 // 上一次的执行时间
@ -497,11 +545,11 @@ $bannerHeight: calc(100vw / 2.03);
z-index: 2; z-index: 2;
position: relative; position: relative;
top: $bannerHeight; top: $bannerHeight;
padding-bottom: 229px; padding: 6rem 0 229px;
background-color: #fff; background-color: #fff;
transition: all 0.7s cubic-bezier(0.5, 0, 0.2, 1) 0s; transition: all 0.7s cubic-bezier(0.5, 0, 0.2, 1) 0s;
&.active { &.active {
top: 130px; top: 106px;
} }
} }
.block { .block {
@ -521,6 +569,9 @@ $bannerHeight: calc(100vw / 2.03);
.inner { .inner {
width: 1200px; width: 1200px;
} }
.card-block {
background: url(http://10.10.11.7/images/iasf/14.jpg) 0 0/100% 100% no-repeat;
}
.card { .card {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;

Write Preview
Loading…
Cancel
Save