CompanyNews.vue
3.92 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
<template>
<!-- 公司新闻 -->
<div>
<el-tabs v-model="activeName" type="card" @tab-click="handleClick">
<el-tab-pane label="公司动态" name="first">
<div class="News-box">
<div class="News-left">
<img src="../../../../assets/images/新闻.png" alt="" />
<p>探索发展历程,敢于创新未来</p>
<div class="News-Time">
2021-07-08
<span>124人</span>
</div>
<div>
探索发展历程,敢于创新未来究战每常万我先细报离以海体。米许不工节说联数发团始战原价电会。资根种精声没很干
</div>
</div>
<div class="News-right">
<ul>
<li>
<i></i>
李克强主持召开国务院常务会议确定务会议相关内容，卓识...
<span>2021-07-08</span>
</li>
<li>
<i></i>
推进步行街改造提升，李克强强调要与务会议
<span>2021-07-08</span>
</li>
<li>
<i></i>
·省科协举办《政务处分法》宣讲活动
<span>2021-07-08</span>
</li>
<li>
<i></i>
推进步行街改造提升，李克强强调要与务会议
<span>2021-07-08</span>
</li>
<li>
<i></i>
省科协举办《政务处分法》宣讲活动
<span>2021-07-08</span>
</li>
<li>
<i></i>
省科协举办《政务处分法》宣讲活动
<span>2021-07-08</span>
</li>
</ul>
<div class="block">
<el-pagination
background
:current-page="page.pagenum"
:page-size="page.pagesize"
layout="prev, pager, next, jumper"
:total="total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
></el-pagination>
</div>
</div>
</div>
</el-tab-pane>
<el-tab-pane label="文化聚集" name="second">配置管理</el-tab-pane>
<el-tab-pane label="业务直通车" name="third">角色管理</el-tab-pane>
<el-tab-pane label="排行榜" name="fourth">定时任务补偿</el-tab-pane>
<el-tab-pane label="咨询中心" name="fourth">定时任务补偿</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
export default {
name: 'CompanyNews',
data() {
return {
total: 0,
activeName: 'first',
page: {
//当前页数
pagenum: 1,
//当前每页多少条数据
pagesize: 4,
},
}
},
methods: {
handleClick(tab, event) {},
},
}
</script>
<style lang="scss" scoped>
.el-tabs {
padding: 0px !important;
}
.News-box {
width: 100%;
display: flex;
justify-content: space-between;
.News-left {
width: 50%;
background-color: #f9f9f9;
.News-Time {
margin: 10px 0px;
color: #888888;
span {
padding-left: 40px;
}
}
p {
margin-top: 10px;
font-size: 18px;
font-weight: 600;
}
img {
width: 100%;
}
}
.News-right {
width: 50%;
ul {
margin-left: 30px;
li {
height: 45px;
line-height: 45px;
i {
display: inline-block;
margin-right: 10px;
line-height: 45px;
width: 5px;
height: 5px;
background-color: #0080fe;
border-radius: 50%;
}
}
}
.block {
float: right;
margin-top: 10px;
}
}
}
</style>