4140a1b0
Andy
add 官网移植
|
1
2
|
<template>
<div>
|
4fc45339
Andy
首页 banner 更换icon ...
|
3
4
5
|
<div class="banner">
<div class="ban-tit"></div>
</div>
|
4140a1b0
Andy
add 官网移植
|
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
|
<div class="berth">
<h1 class="title">泊位分布</h1>
<div class="map" id="map"></div>
<div class="berth-num">
<p>区域泊位规划</p>
<ul class="berth-list">
<li>
<span class="fl">黄石铁山区</span>
<span class="fr">123</span>
</li>
<li>
<span class="fl">黄石下陆区</span>
<span class="fr">5007</span>
</li>
<li>
<span class="fl">黄石黄石港区</span>
<span class="fr">2395</span>
</li>
<li>
<span class="fl">黄石西塞山区</span>
<span class="fr">1188</span>
</li>
<li>
<span class="fl">黄石经济开发区</span>
<span class="fr">413</span>
</li>
</ul>
</div>
</div>
<div class="news-wrap">
<h1 class="title">新闻中心</h1>
<div class="fl news-bg"></div>
<ul class="fl news-con">
<li>
<ul>
<li class="fl date">
<h3>06</h3>
<h5>06</h5>
</li>
<li class="fl des">
<h3 onclick="window.open('http://www.hscfjt.com/art.php?id=16613')"><a>集聚人才新优势 激活发展新动能</a></h3>
<p>6月6日上午,市城发集团召开优秀青年人才表彰会,对四家重才爱才先进单位和十名优秀青年人才进行了表彰。</p>
</li>
</ul>
</li>
<li>
<ul>
<li class="fl date">
<h3>06</h3>
<h5>06</h5>
</li>
<li class="fl des">
<h3 onclick="window.open('http://www.hscfjt.com/art.php?id=16611')"><a>黄石城发集团春季招聘体检公告</a></h3>
<p>根据《黄石市城市发展投资集团有限公司春季招聘公告》及复试情况,现将体检人员名单及有关事项公告如下。</p>
</li>
</ul>
</li>
<li>
<ul>
<li class="fl date">
<h3>06</h3>
<h5>05</h5>
</li>
<li class="fl des">
<h3 onclick="window.open('http://www.hscfjt.com/art.php?id=16610')"><a>黄石城发集团再添新成员</a></h3>
<p>6月4日,市妇联和市城发集团签订协议,将市妇联所属市天宝幼儿园和市儿童活动中心移交给市城发集团。</p>
</li>
</ul>
</li>
</ul>
</div>
</div>
</template>
<script>
export default {
name: 'home',
mounted() {
// 百度地图API功能
|
dfc9b132
Andy
首页add 地图缩放
|
85
|
var map = new BMap.Map("map", {enableMapClick:false});
|
4140a1b0
Andy
add 官网移植
|
86
87
|
var point = new BMap.Point(115.078186, 30.232887);
map.centerAndZoom(point, 15);
|
dfc9b132
Andy
首页add 地图缩放
|
88
89
90
91
92
93
94
|
map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放
var top_left_control = new BMap.ScaleControl({anchor: BMAP_ANCHOR_TOP_LEFT});// 左上角,添加比例尺
var top_left_navigation = new BMap.NavigationControl(); //左上角,添加默认缩放平移控件
var top_right_navigation = new BMap.NavigationControl({anchor: BMAP_ANCHOR_TOP_RIGHT, type: BMAP_NAVIGATION_CONTROL_SMALL}); //右上角,仅包含平移和缩放按钮
map.addControl(top_left_control);
map.addControl(top_left_navigation);
map.addControl(top_right_navigation);
|
4140a1b0
Andy
add 官网移植
|
95
96
97
98
99
100
|
}
}
</script>
<style scoped lang="scss">
.banner {
|
4fc45339
Andy
首页 banner 更换icon ...
|
101
|
background: url("../assets/home/hs_bannerico.jpg") no-repeat center center;
|
4140a1b0
Andy
add 官网移植
|
102
|
background-size: 100% 100%;
|
4fc45339
Andy
首页 banner 更换icon ...
|
103
104
105
106
107
108
109
110
111
|
padding-top: 108px;
.ban-tit{
height: 80px;
width: 776px;
background: url("../assets/home/1.png") no-repeat center center;
background-size: 100% 100%;
margin: 0 auto;
/*margin-top: 108px;*/
}
|
4140a1b0
Andy
add 官网移植
|
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
|
}
.berth {
width: 1200px;
height: 823px;
padding: 50px 0;
position: relative;
margin: 0 auto;
}
.map{
width: 1200px;
height: 600px;
}
.berth-num{
width: 323px;
height: 368px;
position: absolute;
top:200px;
|
dfc9b132
Andy
首页add 地图缩放
|
131
|
right: 80px;
|
4140a1b0
Andy
add 官网移植
|
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
|
background: url("../assets/home/berth.png") no-repeat;
p{
padding-top: 20px;
font-size: 20px;
}
}
.berth-list{
margin-top: 50px;
li{
height: 21px;
line-height: 21px;
font-size: 16px;
color: #314659;
padding: 0 40px 30px 60px;
background: url("../assets/home/berth-list.png") no-repeat 30px 0;
margin-bottom: 15px;
}
}
.news-wrap{
width: 1200px;
margin: 0 auto;
padding: 50px 0;
overflow: hidden;
}
.title{
padding-bottom: 50px;
font-size:38px;
font-family:PingFangSC-Semibold;
font-weight:600;
color:rgba(49,70,89,1);
line-height:46px;
}
.news-bg{
width: 535px;
height: 401px;
margin-right: 45px;
background: url("../assets/home/news-bg.png") no-repeat;
}
.news-con {
width: 535px;
height: 401px;
}
.news-con>li{
height: 129px;
border-bottom: 1px solid rgba(216,216,216,1);
ul{
padding: 25px 0 0;
overflow: hidden;
}
}
.date{
width: 83px;
height: 83px;
margin-right: 20px;
background: #FF5656;
position: relative;
h3{
padding-top: 15px;
font-size:32px;
color:rgba(255,255,255,1);
}
h5{
font-size: 12px;
text-align: right;
padding-right: 10px;
color: #Fff;
}
&:before{
content: '';
position: absolute;
right: 14px;
|
dfc9b132
Andy
首页add 地图缩放
|
206
|
bottom: 36px;
|
4140a1b0
Andy
add 官网移植
|
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
|
transform: rotate(-45deg);
width: 25px;
height: 1px;
background:rgba(255,255,255,1)
}
}
.des h3{
padding-bottom: 15px;
font-size: 20px;
color: #0D1A26;
cursor: pointer;
}
.des p {
width: 430px;
line-height: 22px;
color: #314659;
}
</style>
|