提交 1cf4ea4c authored 作者: 王鹏飞's avatar 王鹏飞

update

上级 9d69c36f
......@@ -26,7 +26,7 @@ export default {
// 每页多少条数据
limit: { type: Number, default: 20 },
// 页面跳转地址
to: { type: Function }
to: { type: [Function, String, Object] }
},
data() {
return {
......
<template>
<div class="article-item">
<new-link :data="data" v-bind="$attrs">
<app-link :data="data" v-bind="$attrs">
<div class="article-item-inner">
<img :src="data.web_img_uri" class="article-item-pic" />
<div class="article-item-content">
......@@ -9,13 +9,15 @@
<div class="article-item-content__text">{{ data.abstract }}</div>
</div>
</div>
</new-link>
</app-link>
</div>
</template>
<script>
import AppLink from '@/components/Link'
export default {
name: 'ArticleItem',
components: { AppLink },
props: { data: { type: Object, required: true } },
methods: {
formatDate(value) {
......
<template>
<div class="foot-mian">
<div class="foot-box">
<div class="foot-content">
<div class="left-content">
<div>
<a href="http://jsj.moe.gov.cn" target="_blank" >
{{ $t('foot.link1') }}
</a>
</div>
<div>
<a href="http://jsj.moe.gov.cn" target="_blank" >
{{ $t('foot.link2') }}
</a>
</div>
<div>
<a href="http://www.pbcsf.tsinghua.edu.cn" target="_blank" >
{{ $t('foot.link3') }}
</a>
</div>
<div>
<a href="http://www.pbcsf.tsinghua.edu.cn" target="_blank" >
{{ $t('foot.link4') }}
</a>
</div>
<div>
<a href="http://www.ezijing.com" target="_blank" >
{{ $t('foot.link5') }}
</a>
</div>
<!-- <div>
合作大学官网
</div> -->
</div>
<div class="center-content">
<div class="address" v-html="$t('foot.address')"></div>
<div class="phone" v-html="$t('foot.contact')"></div>
<div class="mail" v-html="$t('foot.email')"></div>
</div>
<div class="right-content">
<img src="https://zws-imgs-pub.ezijing.com/static/public/734d8fd7b853b838e5e029049e2d9db3.png" alt="" class="code">
<div class="tips-txt">
<img src="https://zws-imgs-pub.ezijing.com/static/public/184235d9f6edbb39d52fc6f77339ff5b.png" alt="">
<div class="txt">{{ $t('foot.weChat') }}</div>
</div>
</div>
</div>
<!-- <div class="links">
友情链接:中国人民银行 中国涉外监管网 中国银行协会 中国证券投资基金业协会
</div> -->
</div>
<div class="copyright" style="height: 40px;line-height: 40px;color: rgba(153, 153, 153, 1);background: #fff;">
<div class="inner" style="width: 100%;justify-content: center;display: flex;">
<p style="font-size: 12px;">Copyright © 2017 Zijing Education. All rights reserved. 清控紫荆(北京)教育科技股份有限公司</p>
<a target="_blank" href="https://tsm.miit.gov.cn/dxxzsp/" style="color: rgba(153, 153, 153, 1);text-decoration:none;margin-left: 10px;">
<p style="font-size: 12px;">京ICP证150431号</p>
</a>
<a target="_blank" class="record" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010802023681"
style="color: rgba(153, 153, 153, 1);text-decoration:none;align-items: center;display: flex;margin-right: 5px;">
<img src="https://zws-imgs-pub.ezijing.com/e0a0ec47dfdfc1e0797b1d5254021d00.png" alt=""
style="width: 20px;height: 20px;margin: 0 6px;display: block;">
<p style="font-size: 12px;">安备 11010802023681号</p>
</a>
<a target="_blank" href="https://beian.miit.gov.cn/#/Integrated/index" style="color: rgba(153, 153, 153, 1);text-decoration:none;">
<p style="font-size: 12px;">京ICP备15016866号-1</p>
</a>
</div>
</div>
</div>
</template>
<script>
export default {
}
</script>
<style lang="scss" scoped>
.foot-mian{
width: 100%;
background: rgba(170, 25, 65, 1);
.links{
padding-top: 12px;
font-size: 14px;
font-weight: 300;
line-height: 24px;
color: #FFFFFF;
opacity: 0.6;
width: 1200px;
margin: 0 auto;
}
.foot-box{
padding: 80px 0 35px;
width: 1200px;
margin: 0 auto;
}
.foot-content{
// height: 300px;
display: flex;
.left-content{
div{
opacity: 0.7;
font-size: 22px;
font-weight: 300;
line-height: 50px;
color: #FFFFFF;
text-decoration: underline;
letter-spacing: 3px;
}
}
.center-content{
font-size: 16px;
line-height: 32px;
color: #FFFFFF;
letter-spacing: 3px;
opacity: 0.7;
margin-left: 88px;
}
.right-content{
margin-left: auto;
padding-top: 20px;
.code{
width: 120px;
display: block;
}
.tips-txt{
padding-top: 20px;
display: flex;
align-items: center;
justify-content: center;
img{
width: 21px;
display: block;
}
.txt{
font-size: 14px;
color: #FFFFFF;
margin-left: 7px;
}
}
}
}
}
</style>
\ No newline at end of file
<template>
<div class="head-mian">
<div class="color-bar"></div>
<div class="head-top-content">
<div class="max-width-content">
<app-link :item="{ path: '/' }">
<img src="https://zws-imgs-pub.ezijing.com/static/public/307f688850f8308a5c944bd129436fe0.png" />
</app-link>
<div class="user" v-if="user.id">
<span>{{ user.realname || user.nickname }}</span
><em>|</em><span class="logout" @click="logout">{{ $t('menu.out') }}</span>
</div>
<div class="login-btn-box" v-else>
<div class="login"><a :href="loginURL">{{ $t('menu.fastLogin') }}</a></div>
<div class="register"><a :href="registerURL">{{ $t('menu.register') }}</a></div>
</div>
<div class="language">
<span @click="switchLocale('zh-CN')">中文</span> / <span @click="switchLocale('en-US')">EN</span>
</div>
</div>
</div>
<div class="head-nav-content max-width-content">
<app-menu></app-menu>
<div class="search-box"></div>
</div>
</div>
</template>
<script>
import AppLink from '@/components/Link'
import AppMenu from '@/components/Menu'
export default {
components: {
AppMenu,
AppLink
},
data() {
return {}
},
methods: {
logout() {
this.$store.dispatch('logout').then(() => {
this.$router.replace('/')
})
},
switchLocale(locale) {
this.$i18n.locale = locale
this.$cookies.set('lang', locale)
process.client && location.reload()
}
},
computed: {
user() {
return this.$store.state.user || {}
},
loginURL() {
return process.client
? `${process.env.loginURL}/login/index?redirect_uri=${encodeURIComponent(
location.origin + this.$route.fullPath
)}`
: ''
},
registerURL() {
return process.client
? `${process.env.loginURL}/register?redirect_uri=${encodeURIComponent(location.origin + this.$route.fullPath)}`
: ''
}
}
}
</script>
<style lang="scss" scoped>
ul,
li {
margin: 0;
padding: 0;
list-style: none;
}
.head-mian {
width: 100%;
background: #fff;
.color-bar {
height: 10px;
background: #aa1941;
}
.head-top-content {
// width: 1200px;
// margin: 0 auto;
border: 1px solid #ebebeb;
padding: 23px 0 22px;
.max-width-content {
display: flex;
align-items: center;
img {
height: 55px;
cursor: pointer;
display: block;
}
.user {
margin-left: auto;
font-size: 14px;
em {
font-size: 14px;
font-style: normal;
padding: 0 14px;
}
.logout {
cursor: pointer;
}
}
.login-btn-box {
margin-left: auto;
display: flex;
div {
width: 72px;
height: 24px;
box-sizing: border-box;
text-align: center;
line-height: 24px;
font-size: 12px;
border-radius: 6px;
margin-left: 10px;
cursor: pointer;
}
.login {
background: #aa1941;
color: #fff;
}
.register {
color: #333333;
border: 1px solid #eaeaea;
}
}
.language {
margin-left: 24px;
font-size: 14px;
color: #333;
cursor: pointer;
}
}
}
.max-width-content {
width: 1200px;
margin: 0 auto;
}
.head-nav-content {
height: 72px;
display: flex;
align-items: center;
}
}
</style>
<template>
<div class="link-content">
<template v-if="item.news">
<a
:target="item.news.data.uri !== '' ? '_blank' : '_self'"
:href="item.news.data.uri !== '' ? item.news.data.uri : `${item.news.path}/${item.news.data.id}`">
<slot />
</a>
</template>
<template v-else>
<nuxt-link
:to="item.path">
<slot />
</nuxt-link>
</template>
<div>
<!-- 外部链接跳转 -->
<a :href="href" :target="target" v-if="href"><slot /></a>
<!-- 站内跳转 -->
<nuxt-link :to="path" v-else-if="path"><slot /></nuxt-link>
<!-- 事件 -->
<div v-else-if="item.onClick" @click="item.onClick"><slot /></div>
<template v-else><slot /></template>
</div>
</template>
<script>
export default {
props: { item: { type: Object } }
name: 'Link',
props: {
data: { type: Object, default: () => ({}) },
to: { type: [Function, String, Object] },
target: { type: String, default: '_blnak' }
},
computed: {
href() {
return this.data.href || this.data.uri
},
path() {
if (Array.isArray(this.to)) {
return this.to(this.data)
}
return this.data.path || this.to
}
}
}
</script>
<style lang="scss" scoped>
.link-content{
height: 100%;
}
</style>
<template>
<ul class="nav-item-box" @mouseleave="navLeave">
<template v-for="(item, index) in navData">
<li :key="index">
<div :class="getNameActive(item)">
<template v-if="!item.path">
<template v-if="item.click">
<span @click="showEnroll">{{ item.name }}</span>
</template>
<template v-else>
{{ item.name }}
</template>
</template>
<template v-else>
<nuxt-link :to="item.path">{{ item.name }}</nuxt-link>
</template>
</div>
<div class="child-item" v-if="item.childern">
<div class="one-level">
<template v-for="(level2Item, level2Index) in item.childern">
<div
:class="$route.path === level2Item.path || level2Item.isShow ? 'li active' : 'li'"
:key="level2Index + 'level2'"
@mouseenter="levelShow(level2Item)"
@mouseleave="levelShow(level2Item, 'out')"
>
<app-link :item="{
path: level2Item.path
}">
<div class="name">
{{ level2Item.name }}
</div>
<div class="el-icon-arrow-right" v-if="level2Item.childern"></div>
</app-link>
</div>
</template>
</div>
</div>
</li>
</template>
</ul>
</template>
<script>
import AppLink from '@/components/Link'
export default {
name: 'AppMenu',
components: { AppLink },
data() {
return {
navData: [
{
name: this.$t('menu.project'),
path: '/project-intro/bg',
childern: [
{ name: this.$t('menu.projectChild.bg'), path: '/project-intro/bg' },
{ name: this.$t('menu.projectChild.feature'), path: '/project-intro/charac' },
{ name: this.$t('menu.projectChild.cert'), path: '/project-intro/certificate' }
]
},
{
name: this.$t('menu.course'),
path: '/about/course',
childern: [
{ name: this.$t('menu.courseChild.set'), path: '/about/course' },
{ name: this.$t('menu.courseChild.teachers'), path: '/about/teacher' }
]
},
{
name: this.$t('menu.news'),
path: '/news/hot',
childern: [
{ name: this.$t('menu.newsChild.hot'), path: '/news/hot' },
{ name: this.$t('menu.newsChild.interview'), path: '/news/interview' }
]
},
{
name: this.$t('menu.recruit'),
path: '/apply/relevant',
childern: [
{ name: this.$t('menu.recruitChild.apply'), path: '/apply/relevant' },
{ name: this.$t('menu.recruitChild.cost'), path: '/apply/support' },
{ name: this.$t('menu.recruitChild.problem'), path: '/apply/problem' }
]
},
{
name: this.$t('menu.alumni'),
path: '/alumni/outstanding',
childern: [
{ name: this.$t('menu.alumniChild.outstanding'), path: '/alumni/outstanding' },
{ name: this.$t('menu.alumniChild.share'), path: '/alumni/sharing' }
]
},
{
name: this.$t('menu.enroll'),
path: '/my'
}
],
time: null
}
},
methods: {
navLeave() {
this.navData.map(item => {
if (item.childern) {
item.childern.map(cItem => {
cItem.isShow = false
})
}
})
this.$forceUpdate()
},
levelShow(item, isOut) {
if (item.childern) {
if (isOut) {
clearTimeout(this.time)
this.time = setTimeout(() => {
item.isShow = false
}, 500)
return
}
this.navLeave()
item.isShow = true
} else {
this.navLeave()
}
}
},
computed: {
getNameActive() {
return item => {
const currentPath = this.$route.path
if (currentPath.includes(item.path)) {
return 'name active'
} else {
let className = 'name'
if (item.childern) {
item.childern.map(cData => {
currentPath.includes(cData.path) && (className = 'name active')
})
}
return className
}
}
}
}
}
</script>
<style lang="scss" scoped>
.nav-item-box {
padding-left: 11px;
display: flex;
li {
position: relative;
margin-right: 60px;
.name {
line-height: 72px;
font-size: 22px;
color: #333333;
cursor: pointer;
a {
color: #333333;
font-size: 22px;
text-decoration: none;
}
&.active {
font-weight: 500;
color: #aa1941;
a {
// font-weight: 500;
color: #aa1941;
}
}
}
&:hover {
.name {
color: #aa1941;
font-weight: 500;
a {
// font-weight: 500;
color: #aa1941;
}
}
.child-item {
.one-level {
display: block;
}
}
}
.child-item {
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
position: absolute;
top: 72px;
left: -10px;
display: flex;
background: #fff;
z-index: 999;
.one-level {
padding: 36px 24px 0;
border-top: 4px solid rgba(170, 25, 65, 1);
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
display: none;
.li {
margin-bottom: 36px;
display: flex;
justify-content: space-between;
&.active {
.name {
color: rgba(170, 25, 65, 1);
}
}
.name {
font-weight: 400;
line-height: 100%;
color: #333333;
font-size: 16px;
white-space: nowrap;
a {
color: #333333;
font-size: 16px;
}
}
.el-icon-arrow-right {
color: rgba(51, 51, 51, 1);
margin-left: 15px;
}
&:hover {
.name {
color: rgba(170, 25, 65, 1);
a {
color: rgba(170, 25, 65, 1);
}
}
.el-icon-arrow-right {
color: rgba(170, 25, 65, 1);
}
}
}
}
.two-level {
pointer-events: auto;
padding: 34px 41px 0 24px;
.name {
font-size: 16px;
font-weight: 400;
line-height: 20px;
color: #333333;
margin-bottom: 36px;
white-space: nowrap;
&:hover {
color: rgba(170, 25, 65, 1);
}
a {
font-size: 16px;
font-weight: 400;
line-height: 20px;
color: #333333;
margin-bottom: 36px;
white-space: nowrap;
}
}
}
}
}
}
</style>
<template>
<a :href="data.uri" :target="target" v-if="data.uri">
<slot />
</a>
<nuxt-link :to="to(data)" v-else-if="to">
<slot />
</nuxt-link>
<div v-else>
<slot />
</div>
</template>
<script>
export default {
name: 'Link',
props: {
data: { type: Object, required: true },
to: { type: Function },
target: { type: String, default: '_blnak' }
}
}
</script>
<template>
<div>
<!-- 外部链接跳转 -->
<a :href="item.href" target="_blank" v-if="item.href"><slot /></a>
<!-- 站内跳转 -->
<nuxt-link :to="item.path" v-else-if="item.path"><slot /></nuxt-link>
<!-- 事件 -->
<div v-else-if="item.onClick" @click="item.onClick"><slot /></div>
<template v-else><slot /></template>
</div>
</template>
<script>
export default {
props: { item: { type: Object } }
}
</script>
......@@ -4,7 +4,7 @@
<h2 class="hot-search__title">热门搜索</h2>
<ul class="hot-search__list">
<li v-for="(item, index) in hotList" :key="index">
<app-link :item="item">{{ item.name }}</app-link>
<app-link :data="item">{{ item.name }}</app-link>
</li>
</ul>
</div>
......@@ -12,9 +12,7 @@
</template>
<script>
import AppLink from './Link'
export default {
components: { AppLink },
data() {
return {
hotList: [
......
......@@ -2,7 +2,7 @@
<li class="tree-item">
<div class="cell" :class="{ bold: isFolder }" @click="toggle">
<div class="cell-title">
<app-link :item="item">{{ item.name }}</app-link>
<app-link :data="item">{{ item.name }}</app-link>
</div>
<div class="cell-icon" v-if="isFolder">
<van-icon name="arrow-up" v-if="isOpen" />
......@@ -17,12 +17,11 @@
<script>
import AppLink from './Link'
import TreeItem from './TreeItem'
export default {
name: 'TreeItem',
props: { item: Object },
components: { AppLink, TreeItem },
components: { TreeItem },
data: function () {
return {
isOpen: false
......
......@@ -2,9 +2,11 @@
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<div class="common-content-box">
<card :title="$t('home.problem.title')">
<template #header-aside><nuxt-link to="/apply/problem">{{ $t('viewMore') }}</nuxt-link></template>
<template #header-aside
><nuxt-link to="/apply/problem">{{ $t('viewMore') }}</nuxt-link></template
>
<div class="content-mian">
<app-link :item="{ path: '/news/hot' }">
<app-link to="/apply/problem">
<div class="list-box">
<ul>
<li v-for="(item, index) in problem.itemLeft" :key="index">
......@@ -21,11 +23,7 @@
</div>
</app-link>
<div class="msg-box">
<el-input
type="textarea"
placeholder="请输入内容"
v-model="textarea">
</el-input>
<el-input type="textarea" placeholder="请输入内容" v-model="textarea"> </el-input>
<div class="btn">在线留言</div>
</div>
</div>
......@@ -43,7 +41,7 @@ export default {
Card,
AppLink
},
data () {
data() {
return {
problem: {
itemLeft: [
......@@ -73,75 +71,75 @@ export default {
</script>
<style lang="scss" scoped>
.is-pc{
.common-content-box{
.is-pc {
.common-content-box {
width: 1200px;
margin: 0 auto;
padding-top: 77px;
.content-mian{
.content-mian {
padding-top: 50px;
.msg-box{
.msg-box {
padding-top: 40px;
box-sizing: border-box;
height: 56px;
display: flex;
align-items: center;
justify-content: space-between;
::v-deep{
.el-textarea__inner{
::v-deep {
.el-textarea__inner {
background: none;
resize:none;
resize: none;
}
}
.btn{
.btn {
width: 136px;
height: 36px;
background: #AA1941;
background: #aa1941;
opacity: 1;
border-radius: 4px;
font-size: 18px;
line-height: 36px;
text-align: center;
color: #FFFFFF;
color: #ffffff;
margin-left: 57px;
cursor: pointer;
}
}
.list-box{
.list-box {
display: flex;
justify-content: space-between;
ul{
&:nth-child(2){
ul {
&:nth-child(2) {
margin-left: 8px;
}
li{
li {
display: flex;
align-items: center;
width: 600px;
height: 25px;
margin-bottom: 10px;
cursor: pointer;
&:nth-child(even){
.text{
&:nth-child(even) {
.text {
background: none;
}
}
.icon{
.icon {
width: 7px;
height: 7px;
background: #AA1941;
background: #aa1941;
border-radius: 50%;
}
.text{
.text {
overflow: hidden;
text-overflow:ellipsis;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 14px;
line-height: 25px;
color: #666666;
padding-left: 4px;
width: 570px;
background: rgba(153, 153, 153, .2);
background: rgba(153, 153, 153, 0.2);
margin-left: 15px;
}
}
......@@ -150,67 +148,67 @@ export default {
}
}
}
.is-h5{
.common-content-box{
.content-mian{
.msg-box{
padding-top: .2rem;
.is-h5 {
.common-content-box {
.content-mian {
.msg-box {
padding-top: 0.2rem;
box-sizing: border-box;
::v-deep{
.el-textarea__inner{
::v-deep {
.el-textarea__inner {
background: none;
resize:none;
resize: none;
}
}
input{
height: .29rem;
border: .01rem solid rgba(153, 153, 153, .2);
margin-top: .05rem;
input {
height: 0.29rem;
border: 0.01rem solid rgba(153, 153, 153, 0.2);
margin-top: 0.05rem;
outline: none;
width: 100%;
background: none;
padding-left: .2rem;
padding-left: 0.2rem;
box-sizing: border-box;
font-size: 0.1rem;
color: #999999;
}
.btn{
.btn {
height: 0.24rem;
background: #AA1941;
background: #aa1941;
font-size: 0.12rem;
text-align: center;
color: #FFFFFF;
margin-top: .1rem;
line-height: .24rem;
color: #ffffff;
margin-top: 0.1rem;
line-height: 0.24rem;
}
}
.list-box{
ul{
li{
.list-box {
ul {
li {
display: flex;
align-items: center;
padding: 0.04rem 0 0.04rem 0;
&:nth-child(even){
.text{
&:nth-child(even) {
.text {
background: none;
}
}
.icon{
.icon {
width: 0.04rem;
height: 0.04rem;
background: #AA1941;
background: #aa1941;
border-radius: 50%;
}
.text{
.text {
overflow: hidden;
text-overflow:ellipsis;
text-overflow: ellipsis;
white-space: nowrap;
font-size: .12rem;
font-size: 0.12rem;
color: #666666;
padding-left: .02rem;
padding-left: 0.02rem;
width: 100%;
background: rgba(153, 153, 153, .2);
margin-left: .07rem;
background: rgba(153, 153, 153, 0.2);
margin-left: 0.07rem;
}
}
}
......
......@@ -2,10 +2,12 @@
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<div class="news-content-box">
<card :title="$t('home.news.title')">
<template #header-aside><nuxt-link to="/news/hot">{{ $t('viewMore') }}</nuxt-link></template>
<template #header-aside
><nuxt-link to="/news/hot">{{ $t('viewMore') }}</nuxt-link></template
>
<div class="content-box" v-if="Object.keys(listData.first).length">
<div class="news-left">
<app-link :item="{ news: { data: listData.first, path: '/news/hot' } }">
<app-link :data="listData.first" :to="`/news/hot/${listData.first.id}`">
<img :src="listData.first.web_img_uri" alt="" />
<div class="mantle-box">
<div class="tit" v-if="!isMobile">{{ listData.first.title }}</div>
......@@ -15,7 +17,7 @@
</div>
<ul class="news-right">
<li v-for="(item, index) in listData.list" :key="index">
<app-link :item="{ news: { data: listData.first, path: '/news/hot' } }">
<app-link :data="item" :to="`/news/hot/${item.id}`">
<div class="time">{{ formatDate(item.start_time) }}</div>
<div class="news-r-title">{{ item.title }}</div>
<div class="del">{{ item.abstract }}</div>
......@@ -72,7 +74,7 @@ export default {
}
</script>
<style lang="scss" scoped>
.is-pc{
.is-pc {
.news-content-box {
width: 1200px;
margin: 0 auto;
......@@ -159,32 +161,32 @@ export default {
}
}
}
.is-h5{
.news-content-box{
.content-box{
.is-h5 {
.news-content-box {
.content-box {
// height: 2.18rem;
position: relative;
img{
img {
width: 100%;
height: 100%;
display: block;
}
.news-left{
.news-left {
position: relative;
}
.mantle-box{
.mantle-box {
width: 100%;
position: absolute;
bottom: 0;
left: 0;
background: rgba(8, 8, 8, 0.45);
padding-bottom: .14rem;
.con-txt{
padding-bottom: 0.14rem;
.con-txt {
font-size: 0.12rem;
font-weight: bold;
line-height: 0.17rem;
color: #FFFFFF;
padding: .14rem .32rem 0 .19rem;
color: #ffffff;
padding: 0.14rem 0.32rem 0 0.19rem;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
......@@ -192,27 +194,27 @@ export default {
}
}
}
.news-right{
li{
margin-top: .1rem;
padding: .13rem .14rem .11rem .12rem;
.news-right {
li {
margin-top: 0.1rem;
padding: 0.13rem 0.14rem 0.11rem 0.12rem;
background: #fff;
.time{
.time {
font-size: 0.1rem;
line-height: 100%;
color: #AB0A3D;
color: #ab0a3d;
}
.news-r-title{
.news-r-title {
font-size: 0.14rem;
color: #333333;
margin-top: .1rem;
margin-top: 0.1rem;
line-height: 0.21rem;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.del{
.del {
font-size: 0.11rem;
line-height: 0.2rem;
color: #666666;
......
......@@ -7,7 +7,7 @@
<div v-swiper:mySwiper="swiperOption" ref="mySwiper">
<div class="swiper-wrapper">
<div class="swiper-slide" v-for="(item, index) in listData" :key="index">
<app-link :item="{ news: { data: item, path: '/news/hot' } }">
<app-link :data="item" :to="`/news/hot/${item.id}`">
<img :src="item.web_img_uri" />
<div class="text">{{ item.title }}</div>
</app-link>
......@@ -24,7 +24,7 @@
<template v-for="(item, index) in listData">
<van-swipe-item :key="index">
<div class="case">
<app-link :item="{ news: { data: item, path: '/news/hot' } }">
<app-link :data="item" :to="`/news/hot/${item.id}`">
<img :src="item.web_img_uri" class="case-pic" />
<p class="case-title">{{ item.title }}</p>
</app-link>
......@@ -81,8 +81,7 @@ export default {
}
},
created() {},
mounted() {
},
mounted() {},
methods: {
swiperStop() {
this.swiper.autoplay.stop()
......@@ -94,8 +93,7 @@ export default {
}
</script>
<style lang="scss" scoped>
.is-pc{
.is-pc {
.max-width {
width: 1200px;
margin: 0 auto;
......@@ -164,7 +162,7 @@ export default {
}
}
}
.is-h5{
.is-h5 {
.case {
position: relative;
}
......
......@@ -2,15 +2,15 @@
<div :class="isMobile ? 'is-h5' : 'is-pc'">
<div class="presence-content-box">
<card :title="$t('home.presence.title')" class="card-style">
<template #header-aside
><nuxt-link to="/alumni/sharing">{{ $t('viewMore') }}</nuxt-link></template
>
<template #header-aside>
<nuxt-link to="/alumni/sharing">{{ $t('viewMore') }}</nuxt-link>
</template>
</card>
<div class="content-mian">
<van-swipe class="my-swipe" :autoplay="5000" :vertical="true" indicator-color="white">
<template v-for="(item, index) in listData">
<van-swipe-item :key="index">
<app-link :item="{ news: { data: item, path: '/news/hot' } }">
<app-link :data="item" :to="`/news/hot/${item.id}`">
<img :src="item.web_img_uri" />
</app-link>
</van-swipe-item>
......
......@@ -3,16 +3,20 @@
<div class="color-bar"></div>
<div class="head-top-content">
<div class="max-width-content">
<app-link :item="{ path: '/' }">
<nuxt-link to="/">
<img src="https://zws-imgs-pub.ezijing.com/static/public/307f688850f8308a5c944bd129436fe0.png" />
</app-link>
</nuxt-link>
<div class="user" v-if="user.id">
<span>{{ user.realname || user.nickname }}</span
><em>|</em><span class="logout" @click="logout">{{ $t('menu.out') }}</span>
</div>
<div class="login-btn-box" v-else>
<div class="login"><a :href="loginURL">{{ $t('menu.fastLogin') }}</a></div>
<div class="register"><a :href="registerURL">{{ $t('menu.register') }}</a></div>
<div class="login">
<a :href="loginURL">{{ $t('menu.fastLogin') }}</a>
</div>
<div class="register">
<a :href="registerURL">{{ $t('menu.register') }}</a>
</div>
</div>
<div class="language">
<span @click="switchLocale('zh-CN')">中文</span> / <span @click="switchLocale('en-US')">EN</span>
......@@ -26,12 +30,10 @@
</div>
</template>
<script>
import AppLink from '@/components/Link'
import AppMenu from '@/components/Menu'
import AppMenu from './Menu'
export default {
components: {
AppMenu,
AppLink
AppMenu
},
data() {
return {}
......
<template>
<div class="link-content">
<template v-if="item.news">
<a
:target="item.news.data.uri !== '' ? '_blank' : '_self'"
:href="item.news.data.uri !== '' ? item.news.data.uri : `${item.news.path}/${item.news.data.id}`">
<slot />
</a>
</template>
<template v-else>
<nuxt-link
:to="item.path">
<slot />
</nuxt-link>
</template>
</div>
</template>
<script>
export default {
props: { item: { type: Object } }
}
</script>
<style lang="scss" scoped>
.link-content{
height: 100%;
}
</style>
......@@ -24,9 +24,7 @@
@mouseenter="levelShow(level2Item)"
@mouseleave="levelShow(level2Item, 'out')"
>
<app-link :item="{
path: level2Item.path
}">
<app-link :to="level2Item.path">
<div class="name">
{{ level2Item.name }}
</div>
......
......@@ -7,14 +7,7 @@
</div>
<ul class="list-box">
<li v-for="(item, index) in listData" :key="index">
<app-link
:item="{
news: {
data: item,
path: '/news/hot'
}
}"
>
<app-link :data="item" :to="`/news/hot/${item.id}`">
<img :src="item.web_img_uri" alt="" />
<div class="dec">{{ item.title }}</div>
</app-link>
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论