出版物等联调

mobile
yujialong 2 years ago
parent f0b8550b14
commit f01b497e16
  1. BIN
      src/assets/images/device/13.png
  2. BIN
      src/assets/images/device/14.png
  3. BIN
      src/assets/images/device/15.png
  4. BIN
      src/assets/images/device/4.png
  5. 31
      src/const/column.js
  6. 7
      src/pages/article/index.vue
  7. 8
      src/pages/column/index.vue
  8. 71
      src/pages/device/beam.vue
  9. 21
      src/pages/device/layout.vue
  10. 96
      src/pages/device/super.vue
  11. 16
      src/pages/news/index.vue
  12. 47
      src/pages/publish/index.vue
  13. 12
      src/pages/publish/show.vue
  14. 54
      src/pages/sfel/index.vue
  15. 6
      src/styles/page/page.scss

Binary file not shown.

After

Width:  |  Height:  |  Size: 904 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 857 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.0 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 22 KiB

After

Width:  |  Height:  |  Size: 25 KiB

@ -22,52 +22,43 @@
name: '子级优先栏目'
}
],
// 长页样式
pageStyle: [
// 出版物类型
publicationTypes: [
{
id: 1,
path: 'home',
name: 'HOME'
name: '科技图书'
},
{
id: 2,
path: 'about',
name: 'ABOUT'
name: '科技期刊'
},
{
id: 3,
path: 'careers',
name: 'CAREERS'
name: '专利文献'
},
{
id: 4,
path: 'edu',
name: 'EDUCATION & COLLABORATION'
name: '会议文献'
},
{
id: 5,
path: 'news',
name: 'NEWS&EVENTS'
name: '科技报告'
},
{
id: 6,
path: 'newsPress',
name: 'NEWS&EVENTS-PRESS ROOM'
name: '政府出版物'
},
{
id: 7,
path: 'newsProcurement',
name: 'NEWS&EVENTS-PROCUREMENT'
name: '学位论文'
},
{
id: 8,
path: 'research',
name: 'RESEARCH'
name: '标准文献'
},
{
id: 9,
path: 'application',
name: 'APPLICATION'
name: '产品资料和其它'
}
],
}

@ -101,11 +101,14 @@ export default {
name: data.title
}
]
//
if (data.isDisable) {
this.$router.back()
} else {
if (data.articleTemplate === 25) { //
this.$router.replace(`/article/activity?articleId=${this.id}&id=${id}&columnName=${columnName || ''}&path=${path || ''}`)
const temId = data.articleTemplate
let path = `?articleId=${this.id}&id=${id}&columnName=${columnName || ''}&path=${path || ''}`
if (temId === 25 || temId === 26) { // /
this.$router.replace((temId === 25 ? '/article/activity' : '/publish/show') + path)
} else {
this.form = data
this.columnId = data.columnId

@ -338,6 +338,11 @@ export default {
const { typeId } = to
// /
if (left && to.level === 1 && (typeId === 2 || typeId === 3)) return false
//
if (to.templateId === 8) {
this.$router.replace(`/publish?id=${this.id}&siteId=${this.$route.query.siteId || this.site}`)
return
}
//
if (typeId === 2) {
let href = to.linkAddress
@ -434,6 +439,9 @@ export default {
</script>
<style lang="scss" scoped>
.l-title {
font-weight: 600;
}
.banner {
position: relative;
height: 280px;

@ -1,15 +1,6 @@
<template>
<div class="wrap">
<el-carousel height="480px" :interval="6000" :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'">
<template v-for="(item, i) in modules[0].list">
<el-carousel-item v-if="item.pic && item.isEnable" :key="i">
<div :class="['banner-item', {'cursor-pointer': item.link.linkName !== '无'}]" @click="openLink(item)">
<img :src="item.pic" alt="">
<p class="banner-name">{{ item.title }}</p>
</div>
</el-carousel-item>
</template>
</el-carousel>
<div class="banner">装置介绍</div>
<div class="block share">
<div class="inner">
@ -18,8 +9,7 @@
<div class="sum">S³FEL光束线覆盖的波段范围为1~30 nm包含前端区光学传输系统和诊断系统是连接自由电子激光光源和后端科学实验站的桥梁</div>
<div class="flex">
<div class="left">
<div class="des">光束线的作用是将光源发出的超快全相干高亮度的激光高效地传输到实验站样品处并在传输过程中对FEL脉冲进行频谱诊断脉冲能量诊断光斑位置诊断光斑横向分布诊断脉冲到达时间诊断波前诊断偏振诊断等同时根据后端实验站的不同科学需求可进一步对FEL脉冲进行单色化脉冲能量衰减横向光斑微聚焦等
</div>
<div class="des">光束线的作用是将光源发出的超快全相干高亮度的激光高效地传输到实验站样品处并在传输过程中对FEL脉冲进行频谱诊断脉冲能量诊断光斑位置诊断光斑横向分布诊断脉冲到达时间诊断波前诊断偏振诊断等同时根据后端实验站的不同科学需求可进一步对FEL脉冲进行单色化脉冲能量衰减横向光斑微聚焦等</div>
</div>
<img class="pic" src="@/assets/images/device/1.png" alt="">
</div>
@ -40,67 +30,19 @@
<script>
import mixins from '@/mixins/page'
import Setting from '@/setting'
import Util from '@/libs/util'
import Breadcrumb from '@/components/breadcrumb'
import WOW from 'wow.js'
export default {
mixins: [mixins],
data() {
return {
routes: []
}
},
components: {
Breadcrumb
},
mounted() {
new WOW().init()
this.getColumn()
},
methods: {
//
getInfo() {
// /
this.$post(`${this.api[this.preview ? 'getRedisCache' : 'findPage']}?columnId=${this.id}`).then(({ data }) => {
if (data.length) {
// state1theEditedJson稿0jsonBeforeEditing
const json = JSON.parse(this.preview ?
data :
data[data.length - 1][data[data.length - 1].state ? 'theEditedJson' : 'jsonBeforeEditing'])
this.modules = json
console.log("🚀 ~ file: index.vue ~ line 180 ~ this.$post ~ json", json)
}
}).catch(err => {})
},
// id
getParent(data, id) {
for (const e of data) {
if (e.id == id) {
this.routes.push({
name: e.columnName,
query: {
id: e.id
}
})
break
} else if (e.children.length) {
this.routes.push({
name: e.columnName,
query: {
id: e.id
}
})
this.getParent(e.children, id)
}
}
},
//
getColumn() {
this.$post(`${this.api.oneLevelChecksThemAll}?id=${this.id}`).then(({ data }) => {
this.getParent(data, this.id)
}).catch(err => {})
},
}
};
</script>
@ -109,7 +51,10 @@ export default {
@import url(../../plugins/wow/animate.css);
@import "../../styles/page/page.scss";
.wrap {
background: url(../../assets/images/device/4.png) bottom right/auto no-repeat;
background: url(../../assets/images/device/4.png) (100% 1363px)/auto no-repeat;
}
.banner {
background: url(../../assets/images/device/13.png) 0 0/100% 100% no-repeat;
}
.share {
position: relative;

@ -1,15 +1,6 @@
<template>
<div class="wrap">
<el-carousel height="480px" :interval="6000" :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'">
<template v-for="(item, i) in modules[0].list">
<el-carousel-item v-if="item.pic && item.isEnable" :key="i">
<div :class="['banner-item', {'cursor-pointer': item.link.linkName !== '无'}]" @click="openLink(item)">
<img :src="item.pic" alt="">
<p class="banner-name">{{ item.title }}</p>
</div>
</el-carousel-item>
</template>
</el-carousel>
<div class="banner">装置介绍</div>
<div class="block share">
<div class="inner">
@ -110,10 +101,14 @@ export default {
.wrap {
background: url(../../assets/images/device/4.png) bottom right/auto no-repeat;
}
.banner {
background: url(../../assets/images/device/14.png) 0 0/100% 100% no-repeat;
}
.share {
position: relative;
.inner {
width: 1323px;
width: 90%;
max-width: 1323px;
}
.left {
width: 547px;
@ -138,8 +133,7 @@ export default {
left: 0;
max-width: 1671px;
width: 90%;
height: 171px;
padding-left: 20%;
padding: 32px 52px 25px 16%;
font-size: 24px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
@ -173,6 +167,7 @@ export default {
position: absolute;
top: 67px;
left: 15%;
width: 74%;
}
}
.unit {

@ -1,27 +1,18 @@
<template>
<div class="wrap">
<el-carousel height="480px" :interval="6000" :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'">
<template v-for="(item, i) in modules[0].list">
<el-carousel-item v-if="item.pic && item.isEnable" :key="i">
<div :class="['banner-item', {'cursor-pointer': item.link.linkName !== '无'}]" @click="openLink(item)">
<img :src="item.pic" alt="">
<p class="banner-name">{{ item.title }}</p>
</div>
</el-carousel-item>
</template>
</el-carousel>
<div class="banner">装置介绍</div>
<div class="block history gray">
<div class="inner">
<h2 class="wow fadeInLeft">{{ modules[1].form.title }}</h2>
<h2 class="wow fadeInLeft">超导直线加速器-1</h2>
<p class="en">Superconducting linac -1</p>
<div class="texts wow fadeInDown" data-wow-delay="0.5s">
<div class="left">
<h6>{{ modules[1].form.subTitle }}</h6>
<h6>S³FEL的光阴极注入器/电子枪利用光电效应产生高亮度电子束团并将其加速到90 MeV</h6>
<div class="line"></div>
<div class="des">{{ modules[1].form.des }}</div>
<div class="des">主加速器基于超导连续波工作模式采用三级加速两级压缩的结构将电子束团能量提高到2.5 GeV同时在保持横向发射度不变的情况下将电子束长度从几皮秒压缩到几十飞秒峰值流强提升到800 A以上相比基于常温加速技术的高增益FEL超导直线加速器技术可以有效提高电子束流的重复频率实现最高每秒106脉冲输出常温加速技术为~102脉冲/进而大幅度提高FEL激光的平均功率</div>
</div>
<img class="bg" width="562" height="506" :src="modules[1].form.pic" alt="">
<img class="bg" src="@/assets/images/device/10.png" alt="">
</div>
</div>
</div>
@ -43,67 +34,19 @@
<script>
import mixins from '@/mixins/page'
import Setting from '@/setting'
import Util from '@/libs/util'
import Breadcrumb from '@/components/breadcrumb'
import WOW from 'wow.js'
export default {
mixins: [mixins],
data() {
return {
routes: []
}
},
components: {
Breadcrumb
},
mounted() {
new WOW().init()
this.getColumn()
},
methods: {
//
getInfo() {
// /
this.$post(`${this.api[this.preview ? 'getRedisCache' : 'findPage']}?columnId=${this.id}`).then(({ data }) => {
if (data.length) {
// state1theEditedJson稿0jsonBeforeEditing
const json = JSON.parse(this.preview ?
data :
data[data.length - 1][data[data.length - 1].state ? 'theEditedJson' : 'jsonBeforeEditing'])
this.modules = json
console.log("🚀 ~ file: index.vue ~ line 180 ~ this.$post ~ json", json)
}
}).catch(err => {})
},
// id
getParent(data, id) {
for (const e of data) {
if (e.id == id) {
this.routes.push({
name: e.columnName,
query: {
id: e.id
}
})
break
} else if (e.children.length) {
this.routes.push({
name: e.columnName,
query: {
id: e.id
}
})
this.getParent(e.children, id)
}
}
},
//
getColumn() {
this.$post(`${this.api.oneLevelChecksThemAll}?id=${this.id}`).then(({ data }) => {
this.getParent(data, this.id)
}).catch(err => {})
},
}
};
</script>
@ -111,7 +54,14 @@ export default {
<style lang="scss" scoped>
@import url(../../plugins/wow/animate.css);
@import "../../styles/page/page.scss";
.banner {
background: url(../../assets/images/device/15.png) 0 0/100% 100% no-repeat;
}
.history {
.inner {
width: 90%;
max-width: 1504px;
}
h2 {
position: relative;
font-size: 48px;
@ -139,7 +89,7 @@ export default {
}
}
.left {
width: 695px;
width: 50%;
}
h6 {
font-size: 28px;
@ -147,23 +97,32 @@ export default {
font-weight: 500;
color: #FFFFFF;
}
.line {
width: 214px;
height: 5px;
margin: 54px 0 44px;
background: #FFFFFF;
opacity: 0.52;
}
.des {
margin: 20px 0;
font-size: 22px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #FFFFFF;
line-height: 44px;
overflow: visible;
}
.bg {
margin: -122px -30px 0 0;
width: 50%;
margin: -142px -50px 0 0;
border-top-left-radius: 30px;
}
}
.intro {
.inner {
display: flex;
width: 1506px;
width: 90%;
max-width: 1504px;
}
.left {
width: 30%;
@ -190,6 +149,7 @@ export default {
}
img {
width: 100%;
height: 85%;
}
}
</style>

@ -19,7 +19,7 @@
<div class="block">
<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="news-banner wow fadeInDown" data-wow-delay="0.5s" @click="toArtice(curArticle, modules[1].list[curColumn])">
<img width="50%" height="410" :src="curArticle.titleImg" alt="">
<div class="right">
<h6>{{ curArticle.title }}</h6>
@ -53,7 +53,7 @@
<p class="intro wow fadeInUp" data-wow-delay="0.5s">{{ modules[2].form.des }}</p>
<div class="shop-shows" v-if="articles.length">
<div class="left wow fadeInLeft" data-wow-delay="0.5s" @click="toArtice(articles[0], modules[3].form)">
<img width="100%" height="400" :src="articles[0].titleImg" alt="">
<img class="pic" width="100%" height="400" :src="articles[0].titleImg" alt="">
<div class="texts">
<h6>{{ articles[0].title }}</h6>
<div class="des" v-html="articles[0].mainBody"></div>
@ -301,7 +301,7 @@ export default {
left: 804px;
}
}
.banner {
.news-banner {
display: flex;
cursor: pointer;
.pic {
@ -414,6 +414,12 @@ export default {
margin-right: 20px;
background-color: #fff;
cursor: pointer;
.pic {
transition: .3s;
&:hover {
transform: scale(1.05);
}
}
.texts {
padding: 40px 30px;
}
@ -444,6 +450,10 @@ export default {
.pic {
width: 401px;
height: 197px;
transition: .3s;
&:hover {
transform: scale(1.05);
}
}
.des {
position: absolute;

@ -1,6 +1,6 @@
<template>
<div class="wrap">
<div class="banner">
<div v-if="info.columnBanner" class="banner">
<img width="100%" height="280" :src="info.columnBanner" alt="">
<div class="texts">
<p class="text">{{ info.columnName }}</p>
@ -10,22 +10,15 @@
<div class="inner">
<ul class="tabs">
<li v-for="(item, i) in tabs" :key="i" :class="{active: active === i}">{{ item }}</li>
<li v-for="(item, i) in tabs" :key="i" :class="{active: active === i}" @click="tabChange(i)">{{ item }}</li>
</ul>
<ul class="list">
<li>
<img class="pic" src="@/assets/images/about-bg.png" alt="">
<li v-for="(item, i) in list" :key="i">
<img class="pic" :src="item.titleImg" alt="">
<div class="texts">
<h6>研究院与深大签约共建产学研专用线基本站建设</h6>
<div class="des">智能电网被设想为适应分布式光伏 ( PV ) 发电的高渗透率这可能会在电压违规方面造成不利的电网影响因此PV Hosting 容量被用作规划工具以确定导致第一次电压违规及以上需要基础设施升级的最大光伏安装容量传统的托管容量分析方法基于场景且计算复杂因为它们依赖迭代潮流算法需要调查</div>
</div>
</li>
<li>
<img class="pic" src="@/assets/images/about-bg.png" alt="">
<div class="texts">
<h6>研究院与深大签约共建产学研专用线基本站建设</h6>
<div class="des">智能电网被设想为适应分布式光伏 ( PV ) 发电的高渗透率这可能会在电压违规方面造成不利的电网影响因此PV Hosting 容量被用作规划工具以确定导致第一次电压违规及以上需要基础设施升级的最大光伏安装容量传统的托管容量分析方法基于场景且计算复杂因为它们依赖迭代潮流算法需要调查</div>
<h6>{{ item.title }}</h6>
<div v-html="item.quote" class="des"></div>
</div>
</li>
</ul>
@ -34,7 +27,7 @@
</template>
<script>
import mixins from '@/mixins/page'
import mixins from '@/mixins/article'
import Setting from '@/setting'
import Util from '@/libs/util'
export default {
@ -43,20 +36,39 @@ export default {
return {
info: {},
active: 0,
tabs: ['发表论文', '申请专利']
tabs: ['发表论文', '申请专利'],
list: [],
page: 1,
pageSize: 10,
total: 0,
}
},
mounted() {
this.getInfo()
this.getArticle()
},
methods: {
//
getInfo() {
this.$post(`${this.api.findColumn}?id=${this.id}`).then(({ data }) => {
if (!data.columnBanner) data.columnBanner = require('@/assets/images/publish-bg.png')
this.info = data
}).catch(res => {})
},
//
getArticle() {
this.$post(this.api.newlyPublishedArticles, {
siteId: this.$route.query.siteId || this.site,
columnIds: [this.id],
pageNum: this.page,
pageSize: this.pageSize,
}).then(({ data }) => {
this.list = Util.removeTag(data.records)
this.total = +data.total
}).catch(res => {})
},
tabChange(i) {
this.active = i
}
}
};
</script>
@ -68,11 +80,10 @@ export default {
.banner {
position: relative;
height: 280px;
color: #fff;
.texts {
position: absolute;
top: 123px;
top: 80px;
left: 243px;
}
.text {

@ -8,19 +8,19 @@
<p class="name">作者</p>
<p class="val">{{ form.author }}</p>
<p class="name">引用</p>
<p class="val">{{ form.author }}</p>
<p class="val">{{ form.quote }}</p>
<p class="name">摘要</p>
<div class="des" v-html="form.summary"></div>
<div class="des" v-html="form.mainBody"></div>
</div>
<div class="right">
<img class="pic" src="@/assets/images/publish3.png" alt="">
<div class="texts">
<p class="name">出版年份</p>
<p class="val">2022</p>
<p class="val">{{ form.publicationYear }}</p>
<p class="name">出版物类型</p>
<p class="val">2022</p>
<p class="val">{{ form.publicationTypeId && publicationTypes.find(e => e.id == form.publicationTypeId).name }}</p>
<p class="name">DOI</p>
<p class="val">2022</p>
<p class="val">{{ form.doi }}</p>
<p class="name">其他字段</p>
<p class="val">2022</p>
</div>
@ -35,11 +35,13 @@ import Setting from '@/setting'
import Util from '@/libs/util'
import Breadcrumb from '@/components/breadcrumb'
import mixins from '@/mixins/article'
import ColumnConst from '@/const/column'
export default {
mixins: [mixins],
data() {
return {
id: this.$route.query.articleId,
publicationTypes: ColumnConst.publicationTypes,
routes: [],
columnId: '',
form: {},

@ -257,6 +257,15 @@
</ul>
</div>
</div>
<div class="tools">
<div class="logo">
<img src="@/assets/images/logo.png" alt="">
</div>
<ul class="nav">
<li v-for="(item, i) in columns" :key="i" class="column">{{ item.columnName }}</li>
</ul>
</div>
</div>
</template>
@ -269,6 +278,7 @@ export default {
mixins: [mixins],
data() {
return {
columns: [],
curColumn: 0,
articles: [],
articles1: [],
@ -279,6 +289,7 @@ export default {
},
mounted() {
new WOW().init()
this.getColumn()
},
methods: {
//
@ -388,11 +399,18 @@ export default {
this.curColumn = i
}
},
// more
toMore() {
const { column } = this.modules[1].list[this.curColumn]
column.length && this.$router.push(`/column?id=${column[column.length - 1]}`)
}
//
getColumn() {
this.$post(this.api.listWithTreeMenuVisible, {
siteId: this.$route.query.siteId || this.$store.state.content.site,
columnName: '',
templateId: '',
typeId : '',
isSort: 1
}).then(({ data }) => {
this.columns = data
}).catch(err => {})
},
}
};
</script>
@ -918,6 +936,32 @@ export default {
}
}
}
.tools {
position: absolute;
top: 600px;
left: 0;
width: 226px;
text-align: center;
.logo {
padding: 44px 0;
background: #0C60BE;
box-shadow: 0px 0px 20px 0px rgba(184,191,200,0.3);
}
.nav {
li {
padding: 0 10px;
font-size: 24px;
line-height: 83px;
color: #fff;
background-color: #1D1D1D;
cursor: pointer;
@include ellipsis;
&.active {
background-color: #1583FF;
}
}
}
}
@media (max-width: 1520px) {
.lg {
width: 98%;

@ -35,6 +35,12 @@
width: 1400px;
margin: 0 auto;
}
.banner {
height: 280px;
padding: 123px 0 0 243px;
font-size: 48px;
color: #fff;
}
.banner-item {
position: relative;
width: 100%;

Loading…
Cancel
Save