huoran
/
FE_huoran_client
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix

Browse Source
master
yujialong 6 months ago
parent c85c10d515
commit 7a6823be70
3 changed files with 258 additions and 218 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. 24
      src/i18n/index.js
  2. 235
      src/pages/article/activity.vue
  3. 217
      src/pages/publish/show.vue

24
src/i18n/index.js
Unescape View File

@ -22,7 +22,7 @@ export const messages = {
series: '演讲系列', series: '演讲系列',
all: '全部', all: '全部',
readDetail: '阅读详情', readDetail: '阅读详情',
offline:'线下', offline: '线下',
more: '更多', more: '更多',
author: '作者', author: '作者',
quote: '引用', quote: '引用',
@ -57,20 +57,22 @@ export const messages = {
seeMore: '查看更多', seeMore: '查看更多',
inventionpatent: '发明专利', inventionpatent: '发明专利',
practicalAppearance: '实用外观', practicalAppearance: '实用外观',
patent:'专利', patent: '专利',
monograph: '专著', monograph: '专著',
paper: '论文', paper: '论文',
scientificResearch: '科学研究', scientificResearch: '科学研究',
sfeLintroduce: 'S³FEL介绍', sfeLintroduce: 'S³FEL介绍',
develHistory:'发展历程', develHistory: '发展历程',
sfeltrailer: 'S³FEL宣传片', sfeltrailer: 'S³FEL宣传片',
geographicLocation: '地理位置', geographicLocation: '地理位置',
organization: '机构设置', organization: '机构设置',
introduce: '介绍', introduce: '介绍',
ActivityIntroduction: '活动简介', ActivityIntroduction: '活动简介',
back: '返回', back: '返回',
comming: '暂无更多信息，敬请期待。', comming: '暂无更多信息，敬请期待。',
nothing: '没有找到您搜索的内容，您可尝试搜索其他关键词。', nothing: '没有找到您搜索的内容，您可尝试搜索其他关键词。',
source: '来源',
keyword: '关键字',
} }
}, },
'en': { 'en': {
@ -117,7 +119,7 @@ export const messages = {
pleaseEnterPatentOfficer: 'Please enter the patent name/inventor name/application number', pleaseEnterPatentOfficer: 'Please enter the patent name/inventor name/application number',
patentName: 'Patent title', patentName: 'Patent title',
patentClassification: 'Patent classification', patentClassification: 'Patent classification',
ApplicationNumber:'Application number', ApplicationNumber: 'Application number',
ApplicationDate: 'Application date', ApplicationDate: 'Application date',
AuthorizationDate: 'Authorization Date', AuthorizationDate: 'Authorization Date',
inventor: 'Inventor', inventor: 'Inventor',
@ -129,21 +131,23 @@ export const messages = {
authorPersion: 'Author', authorPersion: 'Author',
seeMore: 'See more', seeMore: 'See more',
inventionpatent: 'Invention Patent', inventionpatent: 'Invention Patent',
practicalAppearance:'Practical appearance', practicalAppearance: 'Practical appearance',
patent: 'Patent', patent: 'Patent',
monograph: 'Monograph', monograph: 'Monograph',
paper: 'Paper', paper: 'Paper',
scientificResearch: 'Scientific research', scientificResearch: 'Scientific research',
sfeLintroduce: 'Sfe lintroduce', sfeLintroduce: 'Sfe lintroduce',
develHistory:'Development history', develHistory: 'Development history',
sfeltrailer: 'Sfel trailer', sfeltrailer: 'Sfel trailer',
geographicLocation: 'geographic location', geographicLocation: 'geographic location',
organization: 'Organization', organization: 'Organization',
introduce: 'Introduce', introduce: 'Introduce',
ActivityIntroduction: 'Activity Introduction', ActivityIntroduction: 'Activity Introduction',
back: 'Back', back: 'Back',
comming: 'coming soone', comming: 'coming soone',
nothing: `We couldn't find the content you were searching for. You can try searching for other keywords.`, nothing: `We couldn't find the content you were searching for. You can try searching for other keywords.`,
source: 'Source',
keyword: 'Keyword',
} }
} }
}; };

235
src/pages/article/activity.vue
Unescape View File

@ -1,42 +1,33 @@
<template> <template>
<div class="wrap"> <div class="wrap">
<div v-if="form.bannerImg" <div v-if="form.bannerImg" class="banner"
class="banner" :style="{ backgroundImage: form.bannerImg ? ('url(' + form.bannerImg + ')') : '' }">
:style="{backgroundImage: form.bannerImg ? ('url(' + form.bannerImg + ')') : ''}">
{{ form.columnName }} {{ form.columnName }}
</div> </div>
<div class="content"> <div class="content">
<Breadcrumb ref="breadcrumb" <Breadcrumb ref="breadcrumb" :data.sync="routes" />
:data.sync="routes" />
<div class="article"> <div class="article">
<div class="left"> <div class="left">
<h2>{{ form.title }}</h2> <h2>{{ form.title }}</h2>
<div class="meta">{{$t('column.time')}}：{{ form.activityStartTime }}</div> <div class="meta">{{ $t('column.time') }}：{{ form.activityStartTime }} ~ {{ form.activityEndTime }}</div>
<div v-if="form.offlineLocation" <div v-if="form.offlineLocation" class="meta">{{ $t('column.address') }}：{{ form.offlineLocation }}</div>
class="meta">{{$t('column.address')}}：{{ form.offlineLocation }}</div> <div v-if="form.onlineLocation" class="meta">{{ $t('column.online') }}：{{ form.onlineLocation }}</div>
<div v-if="form.onlineLocation" <div v-if="form.offlineLocation" class="meta">{{ $t('column.offline') }}：{{ form.offlineLocation }}</div>
class="meta">{{$t('column.online')}}：{{ form.onlineLocation }}</div> <div v-if="form.keynoteSpeaker" class="meta">{{ $t('column.speaker') }}：{{ form.keynoteSpeaker }}</div>
<div v-if="form.offlineLocation" <div v-if="form.lectureSeries" class="meta">{{ $t('column.series') }}：{{ form.lectureSeries }}</div>
class="meta">{{$t('column.offline')}}：{{ form.offlineLocation }}</div> <div v-if="form.source" class="meta">{{ $t('column.source') }}：{{ form.source }}</div>
<div v-if="form.keynoteSpeaker"
class="meta">{{$t('column.speaker')}}：{{ form.keynoteSpeaker }}</div> <h6>{{ $t('column.ActivityIntroduction') }}</h6>
<div v-if="form.lectureSeries"
class="meta">{{$t('column.series')}}：{{ form.lectureSeries }}</div>
<h6>{{$t('column.ActivityIntroduction')}}</h6>
<div> {{ form.eventProfile }}</div> <div> {{ form.eventProfile }}</div>
<h6>{{$t('column.content')}}</h6> <h6>{{ $t('column.content') }}</h6>
<div v-html="form.mainBody"></div> <div v-html="form.mainBody"></div>
<div v-if="form.fileList && form.fileList.length" <div v-if="form.fileList && form.fileList.length" class="annex">
class="annex"> <h6>{{ $t('column.attachmentDownload') }}</h6>
<h6>{{$t('column.attachmentDownload')}}</h6>
<ul class="files"> <ul class="files">
<li v-for="(file, i) in form.fileList" <li v-for="(file, i) in form.fileList" :key="i">
:key="i">
<span class="name">{{ file.fileName }}</span> <span class="name">{{ file.fileName }}</span>
<span class="download" <span class="download" @click="download(file)">{{ $t('column.download') }}</span>
@click="download(file)">{{$t('column.download')}}</span>
</li> </li>
</ul> </ul>
</div> </div>
@ -48,7 +39,6 @@
</template> </template>
<script> <script>
import Setting from '@/setting'
import Util from '@/libs/util' import Util from '@/libs/util'
import Breadcrumb from '@/components/breadcrumb' import Breadcrumb from '@/components/breadcrumb'
import RightColumns from '@/components/rightColumns' import RightColumns from '@/components/rightColumns'
@ -144,110 +134,131 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
@import './editor.css'; @import './editor.css';
.content { .content {
width: 1200px; width: 1200px;
} }
.banner { .banner {
height: 280px; height: 280px;
padding: 123px 0 0 243px; padding: 123px 0 0 243px;
font-size: 48px; font-size: 48px;
color: #fff; color: #fff;
background: url(../../assets/images/intro-bg.png) 0 0/100% 100% no-repeat; background: url(../../assets/images/intro-bg.png) 0 0/100% 100% no-repeat;
object-fit: cover; object-fit: cover;
} }
.article { .article {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.left {
width: 66%; .left {
width: 66%;
}
h2 {
margin-bottom: 20px;
font-size: 36px;
color: #1c1c1c;
}
.meta {
margin: 10px 0;
font-size: 18px;
font-weight: 600;
color: #333;
}
/deep/.des {
a {
color: rgb(0, 0, 238);
word-wrap: break-word;
} }
h2 {
margin-bottom: 20px; img {
font-size: 36px; max-width: 100%;
color: #1c1c1c;
} }
.meta { }
margin: 10px 0;
font-size: 18px; .annex {
font-weight: 600; margin-top: 30px;
color: #333;
h6 {
padding-left: 8px;
margin-bottom: 20px;
font-size: 16px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
line-height: 1;
color: #333;
border-left: 4px solid #1583ff;
} }
/deep/.des {
a { li {
color: rgb(0, 0, 238); display: flex;
word-wrap: break-word; align-items: center;
} margin-bottom: 10px;
img {
max-width: 100%;
}
} }
.annex {
margin-top: 30px; .name {
h6 { margin-right: 8px;
padding-left: 8px; font-size: 14px;
margin-bottom: 20px;
font-size: 16px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
line-height: 1;
color: #333;
border-left: 4px solid #1583ff;
}
li {
display: flex;
align-items: center;
margin-bottom: 10px;
}
.name {
margin-right: 8px;
font-size: 14px;
}
.download {
color: #1583ff;
cursor: pointer;
}
} }
h6 {
margin: 30px 0 10px; .download {
font-size: 18px; color: #1583ff;
cursor: pointer;
} }
}
h6 {
margin: 30px 0 10px;
font-size: 18px;
}
} }
@media (max-width: 1420px) { @media (max-width: 1420px) {
.content { .content {
width: 98%; width: 98%;
} }
} }
@media (max-width: 1200px) { @media (max-width: 1200px) {
.article { .article {
/deep/.des { /deep/.des {
img { img {
max-width: 100%; max-width: 100%;
height: 15rem; height: 15rem;
} }
}
} }
.banner { }
.banner {
font-size: 1.5rem;
}
.article {
flex-direction: column;
.left {
width: 100%;
h2 {
font-size: 1.5rem; font-size: 1.5rem;
}
} }
.article { }
flex-direction: column;
.left { .article {
width: 100%; .des {
h2 { img {
font-size: 1.5rem; height: 15rem !important;
} }
}
}
.article {
.des {
img {
height: 15rem !important;
}
}
}
.right {
width: 100%;
} }
}
.right {
width: 100%;
}
} }
</style> </style>

217
src/pages/publish/show.vue
Unescape View File

@ -1,8 +1,7 @@
<template> <template>
<div class="wrap"> <div class="wrap">
<div class="content"> <div class="content">
<Breadcrumb ref="breadcrumb" <Breadcrumb ref="breadcrumb" :data.sync="routes" />
:data.sync="routes" />
<div class="article"> <div class="article">
<div class="left"> <div class="left">
<h2>{{ form.title }}</h2> <h2>{{ form.title }}</h2>
@ -10,21 +9,26 @@
<p class="name">{{ $t('column.author') }}</p> <p class="name">{{ $t('column.author') }}</p>
<p class="val">{{ form.author }}</p> <p class="val">{{ form.author }}</p>
</template> </template>
<template v-if="form.source">
<p class="name">{{ $t('column.source') }}</p>
<p class="val">{{ form.source }}</p>
</template>
<template v-if="form.quote"> <template v-if="form.quote">
<p class="name">{{ $t('column.quote') }}</p> <p class="name">{{ $t('column.quote') }}</p>
<p class="val">{{ form.quote }}</p> <p class="val">{{ form.quote }}</p>
</template> </template>
<template v-if="form.keyword">
<p class="name">{{ $t('column.keyword') }}</p>
<p class="val">{{ form.keyword }}</p>
</template>
<p class="name">{{ $t('column.introduce') }}</p> <p class="name">{{ $t('column.introduce') }}</p>
<div class="flex"> <div class="flex">
<div class="des" <div class="des" v-html="form.mainBody"></div>
v-html="form.mainBody"></div>
<!-- <img v-if="form.titleImg" width="222" height="222" :src="form.titleImg" alt=""> --> <!-- <img v-if="form.titleImg" width="222" height="222" :src="form.titleImg" alt=""> -->
</div> </div>
</div> </div>
<div class="right"> <div class="right">
<img class="pic" <img class="pic" src="@/assets/images/publish3.png" alt="">
src="@/assets/images/publish3.png"
alt="">
<div class="texts"> <div class="texts">
<template v-if="form.periodicalName"> <template v-if="form.periodicalName">
<p class="name">{{ $t('column.publicationName') }}</p> <p class="name">{{ $t('column.publicationName') }}</p>
@ -33,8 +37,7 @@
<p class="name">{{ $t('column.yearOfPublication') }}</p> <p class="name">{{ $t('column.yearOfPublication') }}</p>
<p class="val">{{ form.publicationYear }}{{ $t('column.year') }}</p> <p class="val">{{ form.publicationYear }}{{ $t('column.year') }}</p>
<div class="flex"> <div class="flex">
<div v-if="form.reel" <div v-if="form.reel" class="m-r-20">
class="m-r-20">
<p class="name">{{ $t('column.rollUp') }}</p> <p class="name">{{ $t('column.rollUp') }}</p>
<p class="val">{{ form.reel }}</p> <p class="val">{{ form.reel }}</p>
</div> </div>
@ -45,7 +48,8 @@
</div> </div>
<template v-if="form.publicationTypeId"> <template v-if="form.publicationTypeId">
<p class="name">{{ $t('column.publicationType') }}</p> <p class="name">{{ $t('column.publicationType') }}</p>
<p class="val">{{ form.publicationTypeId && publicationTypes.find(e => e.id == form.publicationTypeId).name }}</p> <p class="val">{{ form.publicationTypeId && publicationTypes.find(e => e.id ==
form.publicationTypeId).name }}</p>
</template> </template>
<template v-if="form.doi"> <template v-if="form.doi">
<p class="name">DOI</p> <p class="name">DOI</p>
@ -154,105 +158,126 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.wrap { .wrap {
background: url(../../assets/images/publish1.png) no-repeat; background: url(../../assets/images/publish1.png) no-repeat;
} }
.content { .content {
width: 1084px; width: 1084px;
padding-top: 25px; padding-top: 25px;
background: url(../../assets/images/publish2.png) bottom right/auto no-repeat; background: url(../../assets/images/publish2.png) bottom right/auto no-repeat;
} }
.breadcrumb { .breadcrumb {
margin-bottom: 25px; margin-bottom: 25px;
} }
.article { .article {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.left {
width: 846px; .left {
padding: 30px; width: 846px;
margin-right: 16px; padding: 30px;
background: #fff; margin-right: 16px;
.name { background: #fff;
font-size: 24px;
font-family: PingFangSC-Medium, PingFang SC; .name {
font-weight: 500; font-size: 24px;
color: #333333; font-family: PingFangSC-Medium, PingFang SC;
line-height: 33px; font-weight: 500;
} color: #333333;
.val { line-height: 33px;
margin-bottom: 38px;
font-size: 16px;
color: #333;
line-height: 30px;
}
.des {
width: 100%;
// margin-right: 49px;
}
} }
h2 {
padding-bottom: 27px; .val {
margin-bottom: 40px; margin-bottom: 38px;
font-size: 36px; font-size: 16px;
font-family: PingFangSC-Medium, PingFang SC; color: #333;
color: #333; line-height: 30px;
line-height: 50px;
border-bottom: 1px solid #ddd;
} }
.right {
width: 222px; .des {
background: #fff; width: 100%;
.texts { // margin-right: 49px;
padding: 15px;
}
.name {
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
line-height: 20px;
color: #666666;
}
.val {
margin: 5px 0 36px;
font-size: 14px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #333333;
line-height: 20px;
}
} }
.list { }
margin-bottom: 20px;
li { h2 {
padding: 16px 0; padding-bottom: 27px;
border-bottom: 1px solid #d8d8d8; margin-bottom: 40px;
} font-size: 36px;
.text { font-family: PingFangSC-Medium, PingFang SC;
margin-bottom: 5px; color: #333;
font-size: 14px; line-height: 50px;
cursor: pointer; border-bottom: 1px solid #ddd;
&:hover { }
color: $main-color;
} .right {
} width: 222px;
.date { background: #fff;
font-size: 12px;
color: #999; .texts {
} padding: 15px;
} }
.name {
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
line-height: 20px;
color: #666666;
}
.val {
margin: 5px 0 36px;
font-size: 14px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #333333;
line-height: 20px;
}
}
.list {
margin-bottom: 20px;
li {
padding: 16px 0;
border-bottom: 1px solid #d8d8d8;
}
.text {
margin-bottom: 5px;
font-size: 14px;
cursor: pointer;
&:hover {
color: $main-color;
}
}
.date {
font-size: 12px;
color: #999;
}
}
} }
@media (max-width: 1084px) { @media (max-width: 1084px) {
.content { .content {
width: 95%; width: 95%;
}
.article {
flex-direction: column;
.left,
.right {
width: 100%;
} }
.article {
flex-direction: column; .right {
.left, margin: 20px 0 0;
.right {
width: 100%;
}
.right {
margin: 20px 0 0;
}
} }
}
} }
</style> </style>
Write Preview
Loading…
Cancel
Save