任务修改1
This commit is contained in:
dong_bo0602
parent
4da0d97963
commit
2bcfb62e13
@ -1,239 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<Header></Header>
|
||||
<div class="main">
|
||||
<div class="left">
|
||||
<div class="left-title">
|
||||
<div class="title">
|
||||
社会责任
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab-list">
|
||||
<ul>
|
||||
<li :class="{active: tab == 0}" @click="tab = 0">社会责任</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<div class="location">
|
||||
当前位置：<router-link to="/">首页</router-link> > 社会责任
|
||||
</div>
|
||||
<div class="right-content news-list">
|
||||
<ul>
|
||||
<li>
|
||||
<router-link to="/detail">企业复工给员工发口罩</router-link>
|
||||
<span>2020-04-08</span>
|
||||
</li>
|
||||
<li>
|
||||
<router-link to="/detail">企业复工给员工发口罩</router-link>
|
||||
<span>2020-04-08</span>
|
||||
</li>
|
||||
<li>
|
||||
<router-link to="/detail">企业复工给员工发口罩</router-link>
|
||||
<span>2020-04-08</span>
|
||||
</li>
|
||||
<li>
|
||||
<router-link to="/detail">企业复工给员工发口罩</router-link>
|
||||
<span>2020-04-08</span>
|
||||
</li>
|
||||
<li>
|
||||
<router-link to="/detail">企业复工给员工发口罩</router-link>
|
||||
<span>2020-04-08</span>
|
||||
</li>
|
||||
<li>
|
||||
<router-link to="/detail">企业复工给员工发口罩</router-link>
|
||||
<span>2020-04-08</span>
|
||||
</li>
|
||||
<li>
|
||||
<router-link to="/detail">企业复工给员工发口罩</router-link>
|
||||
<span>2020-04-08</span>
|
||||
</li>
|
||||
<li>
|
||||
<router-link to="/detail">企业复工给员工发口罩</router-link>
|
||||
<span>2020-04-08</span>
|
||||
</li>
|
||||
<li>
|
||||
<router-link to="/detail">企业复工给员工发口罩</router-link>
|
||||
<span>2020-04-08</span>
|
||||
</li>
|
||||
<li>
|
||||
<router-link to="/detail">企业复工给员工发口罩</router-link>
|
||||
<span>2020-04-08</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="pager">
|
||||
<span @click="paging(1)">首页</span>
|
||||
<span @click="paging(page.page - 1)" v-if="page.page > 1">上一页</span>
|
||||
<ul v-if="page.totalPage > 0 && page.totalPage <= 5">
|
||||
<li v-for="cpage in page.totalPage" :class="{'active': page.page == cpage}" :key="cpage" @click="paging(cpage)">
|
||||
{{cpage}}
|
||||
</li>
|
||||
</ul>
|
||||
<ul v-if="page.totalPage > 5">
|
||||
<li v-if="page.page < 3" v-for="cpage in 5" :class="{'active': page.page == cpage}" :key="cpage" @click="paging(cpage)">
|
||||
{{cpage}}
|
||||
</li>
|
||||
<li v-if="page.page > page.totalPage - 2" v-for="cpage in 5" :class="{'active': page.page == (page.totalPage - 5 + cpage)}" :key="cpage" @click="paging(page.totalPage - 5 + cpage)">
|
||||
{{page.totalPage - 5 + cpage}}
|
||||
</li>
|
||||
<li v-if="page.page >= 3 && page.page <= page.totalPage - 2" v-for="cpage in 5" :class="{'active': page.page == (page.page - (3 - cpage))}" :key="cpage" @click="paging(page.page - (3 - cpage))">
|
||||
{{page.page - (3 - cpage)}}
|
||||
</li>
|
||||
</ul>
|
||||
<span @click="paging(page.page + 1)" v-if="page.page < page.totalPage">下一页</span>
|
||||
<span @click="paging(page.totalPage)">尾页</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Footer></Footer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Header from '@/assets/components/Header'
|
||||
import Footer from '@/assets/components/Footer'
|
||||
export default {
|
||||
name: 'Responsibility',
|
||||
components: {
|
||||
Header,
|
||||
Footer
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
tab: 0,
|
||||
page: {
|
||||
page: 1,
|
||||
rows: 10,
|
||||
totalPage: 10
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {},
|
||||
mounted: function () {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="stylus" rel="stylesheet/stylus" scoped>
|
||||
.main
|
||||
width 1200px
|
||||
margin 20px auto
|
||||
overflow hidden
|
||||
.left
|
||||
width 350px
|
||||
float left
|
||||
padding 0 20px
|
||||
box-sizing border-box
|
||||
border 1px solid #e3e3e3
|
||||
border-bottom 3px solid #e3e3e3
|
||||
.left-title
|
||||
height 50px
|
||||
font-size 16px
|
||||
color #333
|
||||
border-bottom 1px solid #e3e3e3
|
||||
.title
|
||||
display inline-block
|
||||
border-top 4px solid #ff4f01
|
||||
line-height 46px
|
||||
box-sizing border-box
|
||||
.tab-list
|
||||
padding 20px 0
|
||||
ul
|
||||
li
|
||||
border-bottom 1px dashed #e3e3e3
|
||||
padding-left 30px
|
||||
height 45px
|
||||
line-height 45px
|
||||
box-sizing border-box
|
||||
font-size 16px
|
||||
color #333
|
||||
position relative
|
||||
cursor pointer
|
||||
&.active
|
||||
background #ededed
|
||||
color #ff4f01
|
||||
&:after
|
||||
content ''
|
||||
display block
|
||||
width 3px
|
||||
height 100%
|
||||
background #ff4f01
|
||||
position absolute
|
||||
top 0
|
||||
left 0
|
||||
.right
|
||||
float right
|
||||
width 830px
|
||||
padding 0 20px
|
||||
box-sizing border-box
|
||||
border 1px solid #e3e3e3
|
||||
border-bottom 3px solid #e3e3e3
|
||||
.location
|
||||
height 50px
|
||||
line-height 50px
|
||||
border-bottom 1px solid #e3e3e3
|
||||
font-size 14px
|
||||
color #333
|
||||
a
|
||||
color #333
|
||||
.right-content
|
||||
margin 20px 0
|
||||
.news-list
|
||||
padding 0 20px
|
||||
ul
|
||||
min-height 460px
|
||||
li
|
||||
padding-left 15px
|
||||
height 45px
|
||||
line-height 45px
|
||||
border-bottom 1px dashed #e3e3e3
|
||||
background url("~@/assets/images/list-icon.png") left center no-repeat
|
||||
a
|
||||
font-size 16px
|
||||
color #333
|
||||
display inline-block
|
||||
white-space nowrap
|
||||
overflow hidden
|
||||
text-overflow ellipsis
|
||||
max-width 65%
|
||||
&:hover
|
||||
color #ff4f01
|
||||
span
|
||||
float right
|
||||
color #999
|
||||
font-size 14px
|
||||
.pager
|
||||
text-align center
|
||||
font-size 0
|
||||
margin-bottom 20px
|
||||
span
|
||||
display inline-block
|
||||
padding 0 15px
|
||||
line-height 30px
|
||||
color #333
|
||||
font-size 14px
|
||||
margin 0 5px
|
||||
vertical-align middle
|
||||
cursor pointer
|
||||
border 1px solid #CCCCCC
|
||||
ul
|
||||
display inline-block
|
||||
overflow hidden
|
||||
vertical-align middle
|
||||
li
|
||||
width 30px
|
||||
line-height 30px
|
||||
float left
|
||||
margin-right 10px
|
||||
cursor pointer
|
||||
text-align center
|
||||
font-size 14px
|
||||
color #333
|
||||
border 1px solid #CCCCCC
|
||||
&.active
|
||||
color: #ff4f01
|
||||
border 1px solid #ff4f01
|
||||
box-sizing border-box
|
||||
&:last-child
|
||||
margin 0
|
||||
</style>
|
||||
@ -26,7 +26,7 @@ export default new Router({
|
||||
name: 'Notice',
|
||||
component: Notice,
|
||||
meta: {
|
||||
title: '北京明世纪元'
|
||||
title: '北京明世纪元-信息公告'
|
||||
}
|
||||
},
|
||||
{
|
||||
@ -34,7 +34,7 @@ export default new Router({
|
||||
name: 'Law',
|
||||
component: Law,
|
||||
meta: {
|
||||
title: '北京明世纪元'
|
||||
title: '北京明世纪元-政策法规'
|
||||
}
|
||||
},
|
||||
{
|
||||
@ -42,7 +42,7 @@ export default new Router({
|
||||
name: 'Recruit',
|
||||
component: Recruit,
|
||||
meta: {
|
||||
title: '北京明世纪元'
|
||||
title: '北京明世纪元-相关招聘'
|
||||
}
|
||||
},
|
||||
{
|
||||
@ -50,7 +50,7 @@ export default new Router({
|
||||
name: 'NewsDetail',
|
||||
component: NewsDetail,
|
||||
meta: {
|
||||
title: '北京明世纪元'
|
||||
title: '北京明世纪元-新闻详情'
|
||||
}
|
||||
},
|
||||
{
|
||||
@ -58,7 +58,7 @@ export default new Router({
|
||||
name: 'Search',
|
||||
component: Search,
|
||||
meta: {
|
||||
title: '北京明世纪元'
|
||||
title: '北京明世纪元-搜索结果'
|
||||
}
|
||||
},
|
||||
{
|
||||
@ -66,7 +66,7 @@ export default new Router({
|
||||
name: 'CompanyQualify',
|
||||
component: CompanyQualify,
|
||||
meta: {
|
||||
title: '北京明世纪元'
|
||||
title: '北京明世纪元-公司介绍和荣誉'
|
||||
}
|
||||
},
|
||||
{
|
||||
@ -74,7 +74,7 @@ export default new Router({
|
||||
name: 'Source',
|
||||
component: Source,
|
||||
meta: {
|
||||
title: '北京明世纪元'
|
||||
title: '北京明世纪元-单一来源公示'
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
Loading…
Reference in New Issue
Block a user