113 lines
3.3 KiB
Vue
113 lines
3.3 KiB
Vue
<template>
|
||
<div class="page">
|
||
<div class="list">
|
||
<div class="item" v-for="item in data">
|
||
<div class="title">
|
||
<span class="position">{{item.tittle}}</span>
|
||
</div>
|
||
<div class="content">
|
||
<div class="left">
|
||
<div class="num">招聘人数：{{item.excerpt.split('|')[0]}}</div>
|
||
<div class="area">工作地点：连云港</div>
|
||
<div class="time">发布日期：{{item.submitTime}}</div>
|
||
</div>
|
||
<div class="requirement center" v-html="item.excerpt.split('|')[1]">
|
||
</div>
|
||
<div class="requirement right" v-html="item.content">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
name: 'Bottom',
|
||
components: {
|
||
},
|
||
data(){
|
||
return{
|
||
data:[]
|
||
}
|
||
},
|
||
created(){
|
||
this.getData()
|
||
},
|
||
|
||
methods:{
|
||
getData(){
|
||
this.$http.get(`zy/website/article/page?type=人才招聘`).then(res=>{
|
||
this.data = res.data.rows
|
||
})
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
<style lang="scss" scoped>
|
||
.page{
|
||
.list{
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
padding: 1rem 2.375rem;
|
||
background-color: #fff;
|
||
/* justify-content: space-between; */
|
||
.item{
|
||
width: 100%;
|
||
padding: .375rem;
|
||
background: #EEF3F9;
|
||
position: relative;
|
||
&::after{
|
||
content: '';
|
||
position: absolute;
|
||
width: .4375rem;
|
||
height: .1rem;
|
||
background: #E60012;
|
||
left: 1.1rem;
|
||
top: 0;
|
||
}
|
||
.title{
|
||
display: flex;
|
||
justify-content: space-between;
|
||
.position{
|
||
font-size: .375rem;
|
||
color: #000000;
|
||
}
|
||
}
|
||
.content{
|
||
margin-top: .25rem;
|
||
display: flex;
|
||
.left{
|
||
div{
|
||
width: 2.975rem;
|
||
height: .35rem;
|
||
line-height: .35rem;
|
||
background: linear-gradient(to right,#1D2088,#EEF3F9);
|
||
margin-bottom: .125rem;
|
||
font-size: .175rem;
|
||
color: #FFFFFF;
|
||
padding-left: .175rem;
|
||
}
|
||
}
|
||
.requirement{
|
||
width: 7.5625rem;
|
||
margin-left: .6rem;
|
||
font-size: .25rem;
|
||
color: #000000;
|
||
line-height: .45rem;
|
||
}
|
||
.center{
|
||
}
|
||
.right{
|
||
|
||
}
|
||
|
||
}
|
||
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
</style>
|
||
|