yujialong 1 year ago
parent 8b572d29cf
commit ad5d81c0b3
  1. 20
      src/pages/article/activity.vue
  2. 75
      src/pages/article/index.vue
  3. 635
      src/pages/careers/index.vue
  4. 8
      src/pages/column/index.vue
  5. 11
      src/pages/industrial/index.vue
  6. 63
      src/pages/newsPress/index.vue
  7. 144
      src/pages/overview/index.vue
  8. 5
      src/pages/publication/patent.vue
  9. 26
      src/pages/publication/thesis.vue
  10. 21
      src/pages/publish/show.vue
  11. 56
      src/pages/researchTeam/index.vue
  12. 22
      src/pages/talentCentre/index.vue
  13. 22
      src/pages/team/index.vue
  14. 18
      src/styles/page/publication.scss

@ -202,24 +202,4 @@ export default {
font-size: 18px; font-size: 18px;
} }
} }
@media (max-width: 1420px) {
.content {
width: 98%;
}
}
@media (max-width: 1200px) {
.banner {
height: 15rem;
}
.article {
flex-direction: column;
.left {
width: 100%;
h2 {
font-size: 1.5rem;
}
}
}
}
</style> </style>

@ -258,79 +258,4 @@ export default {
} }
} }
} }
@media (max-width: 1420px) {
.content {
width: 98%;
}
}
@media (max-width: 1200px) {
.article {
/deep/.des {
img {
max-width: 100%;
height: 15rem;
}
}
}
.banner {
font-size: 1.5rem;
}
.article {
flex-direction: column;
.left {
width: 100%;
h2 {
font-size: 1.5rem;
}
}
}
.article {
.des {
img {
height: 15rem !important;
}
}
}
}
@media (max-width: 480px) {
.wrap {
.banner {
padding: 8rem 0 0 10rem;
height: 17rem;
}
}
}
@media (min-width: 480px) and (max-width: 640px) {
.wrap {
.banner {
padding: 12rem 0 0 10rem;
height: 20rem;
}
}
}
@media (min-width: 640px) and (max-width: 768px) {
.wrap {
.banner {
padding: 14rem 0 0 10rem;
height: 22rem;
}
}
}
@media (min-width: 768px) and (max-width: 980px) {
.wrap {
.banner {
padding: 16rem 0 0 10rem;
height: 26rem;
}
}
}
@media (min-width: 980px) and (max-width: 1200px) {
.wrap {
.banner {
padding: 18rem 0 0 10rem;
height: 30rem;
}
}
}
</style> </style>

@ -1,10 +1,15 @@
<template> <template>
<div class="wrap"> <div class="wrap">
<el-carousel :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'"> <el-carousel :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"> <template v-for="(item, i) in modules[0].list">
<el-carousel-item v-if="item.pic && item.isEnable" :key="i"> <el-carousel-item v-if="item.pic && item.isEnable"
<div :class="['banner-item', {'cursor-pointer': isLink(item.link.linkName)}]" @click="openLink(item)"> :key="i">
<img :src="item.pic" alt=""> <div :class="['banner-item', {'cursor-pointer': isLink(item.link.linkName)}]"
@click="openLink(item)">
<img :src="item.pic"
alt="">
<p class="banner-name">{{ item.title }}</p> <p class="banner-name">{{ item.title }}</p>
</div> </div>
</el-carousel-item> </el-carousel-item>
@ -14,44 +19,68 @@
<div class="block"> <div class="block">
<div class="inner"> <div class="inner">
<ul class="card"> <ul class="card">
<li class="wow fadeInDown" data-wow-delay="0.1s"> <li class="wow fadeInDown"
<img class="pic" :src="modules[1].form.pic" alt=""> data-wow-delay="0.1s">
<img class="pic"
:src="modules[1].form.pic"
alt="">
<div class="texts"> <div class="texts">
<h6>{{ modules[1].form.title }}</h6> <h6>{{ modules[1].form.title }}</h6>
<p class="text">{{ modules[1].form.des }}</p> <p class="text">{{ modules[1].form.des }}</p>
</div> </div>
<div class="arrow"> <div class="arrow">
<img src="@/assets/images/arrow-white.png" alt="" :class="{'cursor-pointer': isLink(modules[1].form.link.linkName)}" @click="openLink(modules[1].form)"> <img src="@/assets/images/arrow-white.png"
alt=""
:class="{'cursor-pointer': isLink(modules[1].form.link.linkName)}"
@click="openLink(modules[1].form)">
</div> </div>
</li> </li>
<li class="wow fadeInDown" data-wow-delay="0.3s"> <li class="wow fadeInDown"
<img class="pic" :src="modules[2].form.pic" alt=""> data-wow-delay="0.3s">
<img class="pic"
:src="modules[2].form.pic"
alt="">
<div class="texts"> <div class="texts">
<h6>{{ modules[2].form.title }}</h6> <h6>{{ modules[2].form.title }}</h6>
<p class="text">{{ modules[2].form.des }}</p> <p class="text">{{ modules[2].form.des }}</p>
</div> </div>
<div class="arrow"> <div class="arrow">
<img src="@/assets/images/arrow-white.png" alt="" :class="{'cursor-pointer': isLink(modules[2].form.link.linkName)}" @click="openLink(modules[2].form)"> <img src="@/assets/images/arrow-white.png"
alt=""
:class="{'cursor-pointer': isLink(modules[2].form.link.linkName)}"
@click="openLink(modules[2].form)">
</div> </div>
</li> </li>
<li class="wow fadeInDown" data-wow-delay="0.5s"> <li class="wow fadeInDown"
<img class="pic" :src="modules[3].form.pic" alt=""> data-wow-delay="0.5s">
<img class="pic"
:src="modules[3].form.pic"
alt="">
<div class="texts"> <div class="texts">
<h6>{{ modules[3].form.title }}</h6> <h6>{{ modules[3].form.title }}</h6>
<p class="text">{{ modules[3].form.des }}</p> <p class="text">{{ modules[3].form.des }}</p>
</div> </div>
<div class="arrow"> <div class="arrow">
<img src="@/assets/images/arrow-white.png" alt="" :class="{'cursor-pointer': isLink(modules[3].form.link.linkName)}" @click="openLink(modules[3].form)"> <img src="@/assets/images/arrow-white.png"
alt=""
:class="{'cursor-pointer': isLink(modules[3].form.link.linkName)}"
@click="openLink(modules[3].form)">
</div> </div>
</li> </li>
<li class="wow fadeInDown" data-wow-delay="0.7s"> <li class="wow fadeInDown"
<img class="pic" :src="modules[4].form.pic" alt=""> data-wow-delay="0.7s">
<img class="pic"
:src="modules[4].form.pic"
alt="">
<div class="texts"> <div class="texts">
<h6>{{ modules[4].form.title }}</h6> <h6>{{ modules[4].form.title }}</h6>
<p class="text">{{ modules[4].form.des }}</p> <p class="text">{{ modules[4].form.des }}</p>
</div> </div>
<div class="arrow"> <div class="arrow">
<img src="@/assets/images/arrow-white.png" alt="" :class="{'cursor-pointer': isLink(modules[4].form.link.linkName)}" @click="openLink(modules[4].form)"> <img src="@/assets/images/arrow-white.png"
alt=""
:class="{'cursor-pointer': isLink(modules[4].form.link.linkName)}"
@click="openLink(modules[4].form)">
</div> </div>
</li> </li>
</ul> </ul>
@ -61,16 +90,26 @@
<div class="block gray"> <div class="block gray">
<div class="inner"> <div class="inner">
<h2 class="b-title wow fadeInUp">{{ modules[5].form.title }}</h2> <h2 class="b-title wow fadeInUp">{{ modules[5].form.title }}</h2>
<p class="intro wow fadeInUp" data-wow-delay="0.5s">{{ modules[5].form.des }}</p> <p class="intro wow fadeInUp"
data-wow-delay="0.5s">{{ modules[5].form.des }}</p>
<ul class="people"> <ul class="people">
<template v-for="(item, i) in modules[6].list"> <template v-for="(item, i) in modules[6].list">
<li v-if="item.isEnable" :key="i" class="wow fadeInDown" data-wow-delay="0.5s" :class="{'cursor-pointer': isLink(item.link.linkName)}" @click="openLink(item)"> <li v-if="item.isEnable"
<img class="comma" src="@/assets/images/comma.png" alt=""> :key="i"
class="wow fadeInDown"
data-wow-delay="0.5s"
:class="{'cursor-pointer': isLink(item.link.linkName)}"
@click="openLink(item)">
<img class="comma"
src="@/assets/images/comma.png"
alt="">
<div class="left"> <div class="left">
<h6>{{ item.title }}</h6> <h6>{{ item.title }}</h6>
<div class="des">{{ item.des }}</div> <div class="des">{{ item.des }}</div>
</div> </div>
<img class="pic" :src="item.pic" alt=""> <img class="pic"
:src="item.pic"
alt="">
</li> </li>
</template> </template>
</ul> </ul>
@ -79,14 +118,23 @@
<ul class="shows"> <ul class="shows">
<template v-for="(item, i) in modules[7].list"> <template v-for="(item, i) in modules[7].list">
<li v-if="item.isEnable" :key="i" class="wow fadeInDown" data-wow-delay="0.3s"> <li v-if="item.isEnable"
:key="i"
class="wow fadeInDown"
data-wow-delay="0.3s">
<div class="left"> <div class="left">
<h6>{{ item.title }}</h6> <h6>{{ item.title }}</h6>
<div class="sub">{{ item.subTitle }}</div> <div class="sub">{{ item.subTitle }}</div>
<div class="des">{{ item.des }}</div> <div class="des">{{ item.des }}</div>
<img src="@/assets/images/arrow-white.png" alt="" class="icon" :class="{'arrow': isLink(item.link.linkName)}" @click="openLink(item)"> <img src="@/assets/images/arrow-white.png"
alt=""
class="icon"
:class="{'arrow': isLink(item.link.linkName)}"
@click="openLink(item)">
</div> </div>
<img class="pic" :src="item.pic" alt=""> <img class="pic"
:src="item.pic"
alt="">
</li> </li>
</template> </template>
</ul> </ul>
@ -100,17 +148,17 @@ import Util from '@/libs/util'
import WOW from 'wow.js' import WOW from 'wow.js'
export default { export default {
mixins: [mixins], mixins: [mixins],
data() { data () {
return { return {
} }
}, },
mounted() { mounted () {
new WOW().init() new WOW().init()
}, },
methods: { methods: {
// //
getInfo() { getInfo () {
// / // /
this.$post(`${this.api[this.preview ? 'getRedisCache' : 'findPage']}?columnId=${this.id}`).then(({ data }) => { this.$post(`${this.api[this.preview ? 'getRedisCache' : 'findPage']}?columnId=${this.id}`).then(({ data }) => {
if (data.length) { if (data.length) {
@ -121,7 +169,7 @@ export default {
this.modules = json this.modules = json
console.log("🚀 ~ file: index.vue ~ line 180 ~ this.$post ~ json", json) console.log("🚀 ~ file: index.vue ~ line 180 ~ this.$post ~ json", json)
} }
}).catch(err => {}) }).catch(err => { })
}, },
} }
}; };
@ -129,14 +177,14 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
@import url(../../plugins/wow/animate.css); @import url(../../plugins/wow/animate.css);
@import "../../styles/page/page.scss"; @import '../../styles/page/page.scss';
.wrap{ .wrap {
/deep/ .el-carousel { /deep/ .el-carousel {
height: 21.6rem; height: 21.6rem;
.el-carousel__container{ .el-carousel__container {
height: 21.6rem; height: 21.6rem;
} }
img{ img {
height: 21.6rem; height: 21.6rem;
} }
} }
@ -157,7 +205,6 @@ export default {
.intro { .intro {
margin-bottom: 6.9rem; margin-bottom: 6.9rem;
} }
} }
} }
.card { .card {
@ -201,9 +248,9 @@ export default {
width: 100%; width: 100%;
height: 7.9rem; height: 7.9rem;
text-align: center; text-align: center;
background: #36404A; background: #36404a;
opacity: 0; opacity: 0;
transition: .3s; transition: 0.3s;
cursor: default; cursor: default;
display: flex; display: flex;
align-items: center; align-items: center;
@ -218,7 +265,7 @@ export default {
padding: 4.5rem 3.15rem 4.5rem 2.565rem; padding: 4.5rem 3.15rem 4.5rem 2.565rem;
margin-bottom: 100px; margin-bottom: 100px;
background-color: #fff; background-color: #fff;
transition: .3s; transition: 0.3s;
&:hover { &:hover {
transform: scale(1.05); transform: scale(1.05);
} }
@ -271,7 +318,10 @@ export default {
margin-bottom: 40px; margin-bottom: 40px;
color: #fff; color: #fff;
&:hover .left { &:hover .left {
h6, .sub, .des, .icon { h6,
.sub,
.des,
.icon {
transform: translateY(20px); transform: translateY(20px);
} }
} }
@ -280,13 +330,13 @@ export default {
} }
&:nth-child(2) { &:nth-child(2) {
.left { .left {
background-color: rgba(47, 79, 23, .65); background-color: rgba(47, 79, 23, 0.65);
} }
} }
&:nth-child(3) { &:nth-child(3) {
.left { .left {
width: 43%; width: 43%;
background-color: rgba(91, 58, 35, .65); background-color: rgba(91, 58, 35, 0.65);
} }
} }
} }
@ -296,7 +346,7 @@ export default {
width: 43.333%; width: 43.333%;
height: 100%; height: 100%;
padding: 138px 30px 130px 103px; padding: 138px 30px 130px 103px;
background-color: rgba(54, 54, 54, .65); background-color: rgba(54, 54, 54, 0.65);
} }
.pic { .pic {
position: absolute; position: absolute;
@ -307,519 +357,20 @@ export default {
} }
h6 { h6 {
font-size: 2.07rem; font-size: 2.07rem;
transition: .3s; transition: 0.3s;
} }
.sub { .sub {
margin: 20px 0 20px 0; margin: 20px 0 20px 0;
font-size: 1.35rem; font-size: 1.35rem;
transition: .3s; transition: 0.3s;
} }
.des { .des {
margin-bottom: 40px; margin-bottom: 40px;
font-size: 1.08rem; font-size: 1.08rem;
transition: .3s; transition: 0.3s;
}
.icon {
transition: .3s;
}
}
@media (min-width: 280px) and (max-width: 1200px) {
.wrap{
/deep/ .el-carousel {
height: 15rem;
.el-carousel__container{
height: 15rem;
}
img{
height: 15rem;
}
}
}
.block{
padding: 50px 0;
.inner {
width: 95%;margin: 0 auto;
.card{
flex-direction: column;
li{
margin-top: 20px;
width: 100%;
height: 27rem;
}
}
.people{
li {
padding: 200px 20px 30px;
.left {
width: 100%;
}
.pic{
top: -60px;
right: 13px;
width: 60%;
height: 12.5rem;
}
}
}
}
}
.shows{
li {
flex-direction: column;
align-items:flex-start;
height: 16rem;
.left {
padding: 10px ;
h6{
font-size: 1.5rem ;
}
.sub {
margin: .5rem;
font-size: 1rem;
}
.des{
margin-bottom: 1.25rem;
}
.icon {
width: 3.5rem;
height: 3.5rem;
}
}
}
}
}
@media (max-width: 320px) {
.wrap {
/deep/ .el-carousel{
height: 12rem !important;
}
/deep/ .el-carousel__container{
height: 12rem !important;
}
/deep/ .el-carousel__item {
height: 12rem !important;
}
}
.banner-item{
img {
height: 12rem !important;
}
.banner-name {
font-size: 1.5rem;
line-height: 1rem;
left: 2rem;
bottom: 2rem;
}
}
.block {
padding: 1.25rem 0;
.inner {
.card {
li {
flex: none;
height: 25rem;
.pic {
height: 25rem;
}
}
}
.people {
li {
padding: 10rem 1.25rem 1.5rem;
.pic {
top: -40px;
height: auto;
}
}
}
}
}
.shows {
li {
height: auto;
.left {
h6 {
font-size: 1rem;
}
.sub {
font-size: .9rem;
}
.des {
font-size: .88rem;
margin-bottom: .5rem;
}
.icon {
width: 2rem;height: 2rem;
}
}
}
}
}
@media (min-width: 320px) and (max-width: 375px) {
.wrap {
/deep/ .el-carousel{
height: 12rem !important;
}
/deep/ .el-carousel__container{
height: 12rem !important;
}
/deep/ .el-carousel__item {
height: 12rem !important;
}
}
.banner-item{
img {
height: 12rem !important;
}
.banner-name {
font-size: 1.5rem;
line-height: 1rem;
left: 2rem;
bottom: 2rem;
}
}
.block {
padding: 1.25rem 0;
.inner {
.card {
li {
flex: none;
height: 25rem;
.pic {
height: 25rem;
}
}
}
.people {
li {
padding: 10rem 1.25rem 1.5rem;
.pic {
top: -40px;
height: auto;
}
}
}
}
}
.shows {
li {
height: auto;
.left {
h6 {
font-size: 1rem;
}
.sub {
font-size: .9rem;
}
.des {
font-size: .88rem;
margin-bottom: .5rem;
}
.icon {
width: 2rem;height: 2rem;
}
}
}
}
}
@media (min-width: 375px) and (max-width: 480px) {
.wrap {
/deep/ .el-carousel{
height: 12rem !important;
}
/deep/ .el-carousel__container{
height: 12rem !important;
}
/deep/ .el-carousel__item {
height: 12rem !important;
}
}
.banner-item{
img {
height: 12rem !important;
}
.banner-name {
font-size: 1.5rem;
line-height: 1rem;
left: 2rem;
bottom: 2rem;
}
}
.block {
padding: 1.25rem 0;
.inner {
.card {
li {
flex: none;
height: 25rem;
.pic {
height: 25rem;
}
}
}
.people {
li {
padding: 10rem 1.25rem 1.5rem;
.pic {
top: -40px;
height: auto;
}
}
}
}
}
.shows {
li {
height: auto;
.left {
h6 {
font-size: 1rem;
}
.sub {
font-size: .9rem;
}
.des {
font-size: .88rem;
margin-bottom: .5rem;
} }
.icon { .icon {
width: 2rem;height: 2rem; transition: 0.3s;
}
}
}
}
}
@media (min-width: 480px) and (max-width: 640px) {
.wrap {
/deep/ .el-carousel{
height: 12rem !important;
}
/deep/ .el-carousel__container{
height: 12rem !important;
}
/deep/ .el-carousel__item {
height: 12rem !important;
}
}
.banner-item{
img {
height: 12rem !important;
}
.banner-name {
font-size: 1.5rem;
line-height: 1rem;
left: 2rem;
bottom: 2rem;
}
}
.block {
padding: 1.25rem 0;
.inner {
.card {
li {
flex: none;
height: 25rem;
.pic {
height: 25rem;
}
}
}
.people {
li {
margin-bottom: 15rem;
padding: 10rem 1.25rem 1.5rem;
.pic {
top: -40%;
height: auto;
}
}
}
}
}
.shows {
li {
height: auto;
.left {
padding: 2rem 2rem;
}
}
}
}
@media (min-width: 640px) and (max-width: 768px) {
.wrap {
/deep/ .el-carousel{
height: 12rem !important;
}
/deep/ .el-carousel__container{
height: 12rem !important;
}
/deep/ .el-carousel__item {
height: 12rem !important;
}
}
.banner-item{
img {
height: 12rem !important;
}
.banner-name {
font-size: 1.5rem;
line-height: 1rem;
left: 2rem;
bottom: 2rem;
}
}
.block {
padding: 1.25rem 0;
.inner {
.card {
li {
flex: none;
height: 25rem;
.pic {
height: 25rem;
}
}
}
.people {
li {
padding: 10rem 1.25rem 1.5rem;
margin-bottom: 15rem;
.pic {
top: -60%;
height: auto;
}
}
}
}
}
.shows {
li {
height: auto;
.left {
padding: 3rem 2rem;
}
}
}
}
@media (min-width: 768px) and (max-width: 980px) {
.wrap {
/deep/ .el-carousel{
height: 12rem !important;
}
/deep/ .el-carousel__container{
height: 12rem !important;
}
/deep/ .el-carousel__item {
height: 12rem !important;
}
}
.banner-item{
img {
height: 12rem !important;
}
.banner-name {
font-size: 1.5rem;
line-height: 1rem;
left: 2rem;
bottom: 2rem;
}
}
.block {
padding: 1.25rem 0;
.inner {
.card {
li {
flex: none;
height: 25rem;
.pic {
height: 25rem;
}
}
}
.people {
li {
margin-bottom: 20rem;
padding: 10rem 1.25rem 1.5rem;
.pic {
top: -85%;
height: auto;
}
}
}
}
}
.shows {
li {
height: auto;
.left {
padding: 4rem 2rem;
}
}
}
}
@media (min-width: 980px) and (max-width: 1200px) {
.wrap {
/deep/ .el-carousel{
height: 12rem !important;
}
/deep/ .el-carousel__container{
height: 12rem !important;
}
/deep/ .el-carousel__item {
height: 12rem !important;
}
}
.banner-item{
img {
height: 12rem !important;
}
.banner-name {
font-size: 1.5rem;
line-height: 1rem;
left: 2rem;
bottom: 2rem;
}
}
.block {
padding: 1.25rem 0;
.inner {
.card {
li {
flex: none;
height: 25rem;
.pic {
height: 25rem;
}
}
}
.people {
li {
margin-bottom: 30rem;
padding: 10rem 1.25rem 1.5rem;
.pic {
top: -115%;
height: auto;
}
}
}
}
}
.shows {
li {
height: auto;
.left {
padding: 4rem 2rem;
}
}
} }
} }
</style> </style>

@ -126,7 +126,8 @@
:props="defaultProps" :props="defaultProps"
node-key="id" node-key="id"
icon-class="el-icon-arrow-down" icon-class="el-icon-arrow-down"
@node-click="(item) => columnClick(item, 1)"> @node-click="(item) => columnClick(item, 1)"
@current-change="(item) => columnClick(item, 1)">
<span class="custom-tree-node" <span class="custom-tree-node"
slot-scope="{ node, data }" slot-scope="{ node, data }"
style="padding-left: 10px;"> style="padding-left: 10px;">
@ -367,7 +368,8 @@
class="type"> class="type">
{{ item.classificationName }} {{ item.classificationName }}
</p> </p>
<h6 class="titleDes">{{ item.title }}</h6> <h6 class="titleDes"
:title="item.title">{{ item.title }}</h6>
<template v-if="item.listStyleId === 11 || item.listStyleId == 12 || item.listStyleId == 68"> <template v-if="item.listStyleId === 11 || item.listStyleId == 12 || item.listStyleId == 68">
<span class="meta">{{ item.releaseTime }}</span> <span class="meta">{{ item.releaseTime }}</span>
<div class="des" <div class="des"
@ -746,6 +748,7 @@ export default {
}, },
// //
columnClick (to, left) { columnClick (to, left) {
console.log("🚀 ~ file: index.vue:749 ~ columnClick ~ to, left:", to, left)
const { typeId } = to; const { typeId } = to;
// / // /
if (left && to.level === 1 && (typeId === 2 || typeId === 3)) return false; if (left && to.level === 1 && (typeId === 2 || typeId === 3)) return false;
@ -1206,6 +1209,7 @@ export default {
margin-bottom: 0; margin-bottom: 0;
font-size: 1rem; font-size: 1rem;
text-align: center; text-align: center;
-webkit-line-clamp: 1;
} }
} }
.news-notice { .news-notice {

@ -82,16 +82,16 @@
<div class="block"> <div class="block">
<div class="inner"> <div class="inner">
<h2 class="b-title wow fadeInUp" <h2 class="b-title"
:class="{'wow fadeInUp': $store.getters.getModelType}"
v-html="modules[6].form.title"></h2> v-html="modules[6].form.title"></h2>
<p class="intro wow fadeInUp" <p class="intro wow fadeInUp"
data-wow-delay="0.5s">{{ modules[6].form.des }}</p> data-wow-delay="0.5s">{{ modules[6].form.des }}</p>
<ul class="app"> <ul class="app">
<li v-for="(item, i) in modules[7].list" <li v-for="(item, i) in modules[7].list"
:key="i" :key="i"
class="wow fadeInDown"
:data-wow-delay="(0.2 * i).toFixed(1) + 's'" :data-wow-delay="(0.2 * i).toFixed(1) + 's'"
:class="{'cursor-pointer': isLink(item.link.linkName)}" :class="{'cursor-pointer': isLink(item.link.linkName),'wow fadeInDown': $store.getters.getModelType}"
@click="openLink(item)"> @click="openLink(item)">
<img class="bg" <img class="bg"
:src="require('@/assets/images/industrial/app' + (i + 1) + '.png')" :src="require('@/assets/images/industrial/app' + (i + 1) + '.png')"
@ -107,12 +107,13 @@
<div class="block news-block"> <div class="block news-block">
<div class="inner"> <div class="inner">
<h2 class="b-title wow fadeInUp" <h2 class="b-title"
:class="{'wow fadeInUp': $store.getters.getModelType}"
v-html="modules[8].form.title"></h2> v-html="modules[8].form.title"></h2>
<p class="intro wow fadeInUp" <p class="intro wow fadeInUp"
data-wow-delay="0.5s">{{ modules[8].form.des }}</p> data-wow-delay="0.5s">{{ modules[8].form.des }}</p>
<ul class="news"> <ul class="news">
<li class="wow fadeInDown" <li :class="{'wow fadeInDown': $store.getters.getModelType}"
:data-wow-delay="(0.2 * i).toFixed(1) + 's'" :data-wow-delay="(0.2 * i).toFixed(1) + 's'"
v-for="(item, i) in articles" v-for="(item, i) in articles"
:key="i" :key="i"

@ -190,67 +190,4 @@ export default {
height: 3.3rem; height: 3.3rem;
} }
} }
@media (max-width: 1520px) {
.list {
li {
&:nth-child(even) {
.texts {
left: 25px;
}
}
}
.texts {
right: 25px;
width: 55%;
}
}
}
@media (min-width: 280px) and (max-width: 1200px) {
.wrap {
/deep/ .el-carousel {
height: 18rem;
.el-carousel__container {
height: 18rem;
}
img {
height: 18rem;
}
}
}
.banner-item .banner-name[data-v-1525064c] {
font-size: 1.5rem;
}
.inner {
width: 95%;
.list {
li {
margin-top: 20px;
.pic {
width: 100%;
height: 25rem !important;
}
.texts {
padding: 10px 5px 10px !important;
top: 30px;
height: auto;
h6 {
font-size: 1.5rem !important;
}
p {
font-size: 1rem;
margin: 5px 0 !important;
line-height: 1.5rem;
}
.sub {
margin: 10px 0;
}
.des {
margin-bottom: 10px;
}
}
}
}
}
}
</style> </style>

@ -389,148 +389,4 @@ export default {
// height: 700px; // height: 700px;
} }
} }
@media (min-width: 2000px) {
.scan {
.scan-inner {
justify-content: flex-start;
padding-left: 22%;
}
.left {
width: 37%;
}
.pic {
width: 800px;
}
}
}
@media (min-width: 2400px) {
.scan {
.scan-inner {
padding-left: 24%;
}
}
}
@media (min-width: 2500px) {
.scan {
.scan-inner {
padding-left: 26%;
}
}
}
@media (min-width: 2800px) {
.scan {
.scan-inner {
padding-left: 29%;
}
}
}
@media (min-width: 3500px) {
.scan {
.scan-inner {
padding-left: 35%;
}
.left {
width: 32%;
}
}
}
@media (min-width: 5000px) {
.scan {
.scan-inner {
padding-left: 39.5%;
}
.left {
width: 20%;
}
}
}
@media (min-width: 6000px) {
.scan {
.scan-inner {
padding-left: 42%;
}
}
}
@media (max-width: 1800px) {
.scan .scan-inner {
padding-left: 14%;
}
}
@media (max-width: 1500px) {
.scan .scan-inner {
padding-left: 10%;
}
}
@media (max-width: 1400px) {
.history {
.texts {
flex-direction: column;
}
.left {
width: 100%;
}
.bg {
width: auto;
max-width: 100%;
height: auto;
margin: 20px 0 0 0;
}
}
.scan {
.scan-inner {
flex-direction: column;
padding: 0 10%;
}
.left {
width: 100%;
}
.pic {
width: 100%;
height: auto;
margin-top: 2rem;
}
}
.fac {
.event {
.texts {
position: static;
margin-top: 20px;
}
}
}
}
@media (max-width: 920px) {
.core {
.texts {
top: 20px !important;
left: 20px !important;
right: 20px !important;
width: auto;
}
}
.scan {
padding: 20px;
}
.fac {
.l-card {
flex-direction: column;
li {
width: 100%;
margin-bottom: 1rem;
}
}
}
}
@media (max-width: 750px) {
.core {
.texts {
position: static;
padding: 20px;
color: #333;
}
.line {
background: #333;
}
}
}
</style> </style>

@ -25,15 +25,10 @@
</el-date-picker> </el-date-picker>
</div> </div>
<div class="search"> <div class="search">
<el-tooltip class="item"
effect="dark"
:content="$t('column.pleaseEnterPatentOfficer')"
placement="top-start">
<input type="text" <input type="text"
:placeholder="$t('column.pleaseEnterPatentOfficer')" :placeholder="$t('column.pleaseEnterPatentOfficer')"
v-model="form.patentQueryKeyWord" v-model="form.patentQueryKeyWord"
clearable> clearable>
</el-tooltip>
</div> </div>
</div> </div>

@ -3,8 +3,7 @@
<div class="forms"> <div class="forms">
<div class="item"> <div class="item">
<span class="label">{{$t('column.publicationyear')}}</span> <span class="label">{{$t('column.publicationyear')}}</span>
<el-date-picker <el-date-picker style="width: 300px"
style="width: 300px"
v-model="form.publicationYear" v-model="form.publicationYear"
type="year" type="year"
:placeholder="$t('column.pleaseSelectThePublicationTime')" :placeholder="$t('column.pleaseSelectThePublicationTime')"
@ -15,14 +14,17 @@
</el-date-picker> </el-date-picker>
</div> </div>
<div class="search"> <div class="search">
<el-tooltip class="item" effect="dark" :content="$t('column.PleaseEnterThePaperName')" placement="top-start"> <input type="text"
<input type="text" :placeholder="$t('column.PleaseEnterThePaperName')" v-model="form.paperQueryKeyWord" clearable> :placeholder="$t('column.PleaseEnterThePaperName')"
</el-tooltip> v-model="form.paperQueryKeyWord"
clearable>
</div> </div>
</div> </div>
<ul class="list"> <ul class="list">
<li v-for="(item, i) in articles" :key="i" @click="$parent.toArtice(item)"> <li v-for="(item, i) in articles"
:key="i"
@click="$parent.toArtice(item)">
<h6>{{ item.title }}</h6> <h6>{{ item.title }}</h6>
<p class="meta">{{$t('column.author')}}: {{ item.author }}</p> <p class="meta">{{$t('column.author')}}: {{ item.author }}</p>
<p class="meta">{{$t('column.journalName')}}: {{ item.periodicalName }}</p> <p class="meta">{{$t('column.journalName')}}: {{ item.periodicalName }}</p>
@ -36,7 +38,7 @@
import Util from '@/libs/util'; import Util from '@/libs/util';
export default { export default {
props: ['id'], props: ['id'],
data() { data () {
return { return {
searchTimer: null, searchTimer: null,
form: { form: {
@ -51,7 +53,7 @@ export default {
} }
}, },
watch: { watch: {
id() { id () {
this.id && this.initData() this.id && this.initData()
}, },
'form.paperQueryKeyWord': function (val) { 'form.paperQueryKeyWord': function (val) {
@ -61,12 +63,12 @@ export default {
}, 500); }, 500);
} }
}, },
mounted() { mounted () {
this.initData() this.initData()
}, },
methods: { methods: {
// //
getArticle() { getArticle () {
this.id && this.$post(this.api.newlyPublishedArticles, { this.id && this.$post(this.api.newlyPublishedArticles, {
siteId: this.$route.query.siteId || this.$store.state.content.site, siteId: this.$route.query.siteId || this.$store.state.content.site,
columnIds: this.id, columnIds: this.id,
@ -80,7 +82,7 @@ export default {
}) })
.catch((res) => { }); .catch((res) => { });
}, },
initData() { initData () {
this.page = 1 this.page = 1
this.getArticle() this.getArticle()
}, },
@ -89,7 +91,7 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import "../../styles/page/publication.scss"; @import '../../styles/page/publication.scss';
.list { .list {
li { li {
padding: 30px; padding: 30px;

@ -51,27 +51,6 @@
<p class="name">DOI</p> <p class="name">DOI</p>
<p class="val">{{ form.doi }}</p> <p class="val">{{ form.doi }}</p>
</template> </template>
<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>
<ul class="list">
<li v-for="(item, i) in news"
:key="i"
@click="toArtice(item)">
<p class="text">{{ item.title }}</p>
<span class="date">{{ item.releaseTime }}</span>
</li>
</ul>
</div> </div>
</div> </div>
</div> </div>

@ -238,60 +238,4 @@ export default {
} }
} }
} }
@media (max-width: 1200px) {
.content {
width: 95%;
}
.article {
flex-direction: column;
.left,
.right {
width: 100%;
}
.left {
margin-bottom: 30px;
}
}
}
@media (max-width: 980px) {
.article {
.team-wrap {
display: flex;
align-items: flex-start;
}
.letter {
flex-direction: column;
margin: 16px 10px 0 0;
.item {
border: 1px solid #dbdbdb;
border-top: 0;
&:first-child {
border-top: 1px solid #dbdbdb;
border-radius: 4px 4px 0 0;
}
&:last-child {
border-radius: 0 0 4px 4px;
}
}
}
.teams {
flex: 1;
}
}
}
@media (max-width: 640px) {
.article {
.left {
.search {
width: 50%;
}
}
.teams {
flex-direction: column;
li {
width: 100%;
}
}
}
}
</style> </style>

@ -71,28 +71,6 @@
<span class="date">{{ item.releaseTime }}</span> <span class="date">{{ item.releaseTime }}</span>
</li> </li>
</ul> </ul>
<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>
<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> </div>
</div> </div>
</div> </div>

@ -124,26 +124,4 @@ export default {
} }
} }
} }
@media (max-width: 1200px) {
.content {
width: 95%;
flex-direction: column;
.left,
.right {
width: 100%;
}
}
}
@media (max-width: 640px) {
.content {
.list {
li {
flex-direction: column;
}
.pic {
margin: 0 0 20px 0;
}
}
}
}
</style> </style>

@ -19,7 +19,7 @@
height: 38px; height: 38px;
line-height: 38px; line-height: 38px;
border: 0; border: 0;
background: #F7F7F7; background: #f7f7f7;
} }
.search { .search {
display: inline-flex; display: inline-flex;
@ -30,7 +30,7 @@
padding: 0 15px; padding: 0 15px;
font-size: 14px; font-size: 14px;
color: #333; color: #333;
background: #F7F7F7; background: #f7f7f7;
border: 0; border: 0;
border-top-left-radius: 6px; border-top-left-radius: 6px;
border-bottom-left-radius: 6px; border-bottom-left-radius: 6px;
@ -45,20 +45,8 @@
align-items: center; align-items: center;
width: 62px; width: 62px;
height: 38px; height: 38px;
background: #1583FF; background: #1583ff;
border-radius: 0px 6px 6px 0px; border-radius: 0px 6px 6px 0px;
cursor: pointer; cursor: pointer;
} }
} }
@media (max-width: 1200px) {
.forms {
padding: 1.25rem;
flex-direction: column;
.item, .search,div {
width: 80%;margin: 0 auto;
justify-content: center;
margin-top: 20px;
}
}
}
Loading…
Cancel
Save