Commit ef88324f8bfc76e0dd7fb2c458c9cfda6c8151a8
1 parent
0a26514e
黄石周边服务
Showing
10 changed files
with
147 additions
and
45 deletions
src/assets/images/service/development.jpeg
0 → 100644
79.4 KB
src/assets/images/service/serviceDetailTop1.jpg
0 → 100644
323 KB
src/assets/images/service/serviceDetailTop2.jpg
0 → 100644
254 KB
src/assets/images/service/serviceDetailTop3.jpg
0 → 100644
82.2 KB
src/assets/images/service/serviceIphone.png
src/assets/images/service/serviceNav.png
src/router/index.js
... | ... | @@ -284,6 +284,15 @@ export default new Router({ |
284 | 284 | } |
285 | 285 | }, |
286 | 286 | |
287 | + { | |
288 | + path: '/development', | |
289 | + name: 'development', | |
290 | + component: () => import("@/views/service/development.vue"), | |
291 | + meta:{ | |
292 | + title:'产品开发中' | |
293 | + } | |
294 | + }, | |
295 | + | |
287 | 296 | |
288 | 297 | |
289 | 298 | ... | ... |
src/views/service/development.vue
0 → 100644
1 | +<template> | |
2 | + | |
3 | + <div class="developmentBg"></div> | |
4 | + | |
5 | + | |
6 | + | |
7 | +</template> | |
8 | + | |
9 | +<script> | |
10 | +export default { | |
11 | + name: "development" | |
12 | +}; | |
13 | +</script> | |
14 | + | |
15 | +<style scoped> | |
16 | +.developmentBg{ | |
17 | + width: 100%; | |
18 | + height: 100%; | |
19 | + background:#fff url("../../assets/images/service/development.jpeg") no-repeat center center; | |
20 | + background-size: 332px 338px ; | |
21 | +} | |
22 | +</style> | ... | ... |
src/views/service/service.vue
... | ... | @@ -17,14 +17,14 @@ |
17 | 17 | </flexbox-item> |
18 | 18 | |
19 | 19 | <flexbox-item class="nav-warp"> |
20 | - <div> | |
20 | + <div @click="$router.push({path:'development'})"> | |
21 | 21 | <img src="../../assets/images/service/safeservice.png" height="32" width="32"/> |
22 | 22 | </div> |
23 | 23 | <p>保险服务</p> |
24 | 24 | </flexbox-item> |
25 | 25 | |
26 | 26 | <flexbox-item class="nav-warp"> |
27 | - <div> | |
27 | + <div @click="$router.push({path:'development'})"> | |
28 | 28 | <img src="../../assets/images/service/tripservice.png" height="32" width="32"/> |
29 | 29 | </div> |
30 | 30 | <p>出行服务</p> | ... | ... |
src/views/service/serviceDetail.vue
... | ... | @@ -14,64 +14,124 @@ |
14 | 14 | </group> |
15 | 15 | <ul class="serviceDetailWrap"> |
16 | 16 | <li> |
17 | - <div class="serviceDetailTop"> | |
17 | + <div class="serviceDetailTop serviceDetailTop1"> | |
18 | 18 | <p> |
19 | - <span style="color: #ffbe00;font-weight: 600;font-size: 16px;">途虎养车磁湖东路店</span> | |
19 | + <span style="color: #ffbe00;font-weight: 600;font-size: 16px;">黄石港区一川汽车服务运营中心</span> | |
20 | 20 | </p> |
21 | 21 | <p> |
22 | - <span style="color: #ff4949">营业时间:早8店晚21点</span> | |
22 | + <span style="color: #ff4949">营业时间:8:00-18:00</span> | |
23 | 23 | </p> |
24 | 24 | <p> |
25 | - <span>店长:梁浩</span> | |
25 | + <span>联系人:余红艳</span> | |
26 | 26 | </p> |
27 | 27 | <p> |
28 | 28 | |
29 | - <span>联系电话:13333333333</span> | |
29 | + <span>联系电话:13971750760</span> | |
30 | 30 | |
31 | 31 | </p> |
32 | 32 | </div> |
33 | 33 | <p style="display: flex;justify-content: space-between;"> |
34 | - <span>地理位置: 黄石西塞山区慈湖东路26号途虎养车</span> | |
35 | - <span @click="toLinkApp()"> | |
34 | + <span>地理位置: 黄石市黄石港区杭州路19号儿童公园加油站旁</span> | |
35 | + <span @click="toLinkApp('115.086987','30.217836','一川汽车服务运营中心')"> | |
36 | 36 | <img src="../../assets/images/service/serviceNav.png" height="18" width="18"/> |
37 | 37 | </span> |
38 | 38 | </p> |
39 | + | |
40 | + <p> | |
41 | + <span>服务范围:洗车,美容,音响改装</span> | |
42 | + </p> | |
43 | + <!--<p>--> | |
44 | + <!--<span></span>--> | |
45 | + <!--</p>--> | |
39 | 46 | <p style="display: flex;justify-content: space-between;padding-top: 5px;"> |
40 | - <span class="serviceStar">八公里内道路援助</span> | |
41 | - <span @click="callPhone('13333333333')"> | |
47 | + <span class="serviceStar">专业贴膜</span> | |
48 | + <span @click="callPhone('13971750760')"> | |
42 | 49 | <img src="../../assets/images/service/serviceIphone.png" height="18" width="18"/> |
43 | 50 | </span> |
44 | 51 | </p> |
45 | 52 | </li> |
46 | 53 | |
47 | - <!--<li>--> | |
48 | - <!--<div class="serviceDetailTop">--> | |
49 | - <!--<p>--> | |
50 | - <!--<span style="color: #ffbe00;font-weight: 600;font-size: 16px;">途虎养车磁湖东路店</span>--> | |
51 | - <!--</p>--> | |
52 | - <!--<p>--> | |
53 | - <!--<span style="color: #ff4949">营业时间:早8店晚21点</span>--> | |
54 | - <!--</p>--> | |
55 | - <!--<p>--> | |
56 | - <!--<span>店长:梁浩</span>--> | |
57 | - <!--</p>--> | |
58 | - <!--<p>--> | |
59 | - <!--<span>联系电话:13333333333</span>--> | |
60 | - <!--</p>--> | |
61 | - <!--</div>--> | |
62 | - <!--<p style="display: flex;justify-content: space-between;">--> | |
63 | - <!--<span>地理位置: 黄石西塞山区慈湖东路26号途虎养车</span>--> | |
64 | - <!--<span>--> | |
65 | - <!--<img src="../../assets/images/service/serviceNav.png" height="16" width="16"/>--> | |
66 | - <!--</span>--> | |
54 | + | |
55 | + <li> | |
56 | + <div class="serviceDetailTop serviceDetailTop2"> | |
57 | + <p> | |
58 | + <span style="color: #ffbe00;font-weight: 600;font-size: 16px;">途虎养车磁湖东路店</span> | |
59 | + </p> | |
60 | + <p> | |
61 | + <span style="color: #ff4949">营业时间:8:00-21:00</span> | |
62 | + </p> | |
63 | + <p> | |
64 | + <span>联系人:梁浩</span> | |
65 | + </p> | |
66 | + <p> | |
67 | + | |
68 | + <span>联系电话:13339906728</span> | |
69 | + | |
70 | + </p> | |
71 | + </div> | |
72 | + <p style="display: flex;justify-content: space-between;"> | |
73 | + <span>地理位置: 黄石西塞山区磁湖东路26号途虎养车</span> | |
74 | + <span @click="toLinkApp('115.089421','30.211496','途虎养车磁湖东路店')"> | |
75 | + <img src="../../assets/images/service/serviceNav.png" height="18" width="18"/> | |
76 | + </span> | |
77 | + </p> | |
78 | + | |
79 | + <p> | |
80 | + <span>服务范围:轮胎更换,美容洗车,车品安装</span> | |
81 | + </p> | |
82 | + <!--<p>--> | |
83 | + <!--<span></span>--> | |
67 | 84 | <!--</p>--> |
68 | - <!--<p style="display: flex;justify-content: space-between;padding-top: 5px;">--> | |
69 | - <!--<span class="serviceStar">八公里内道路援助</span>--> | |
70 | - <!--<span>--> | |
71 | - <!--<img src="../../assets/images/service/serviceIphone.png" height="16" width="16"/>--> | |
72 | - <!--</span>--> | |
85 | + <p style="display: flex;justify-content: space-between;padding-top: 5px;"> | |
86 | + <span class="serviceStar">维修、保养、美容</span> | |
87 | + <span @click="callPhone('13339906728')"> | |
88 | + <img src="../../assets/images/service/serviceIphone.png" height="18" width="18"/> | |
89 | + </span> | |
90 | + </p> | |
91 | + </li> | |
92 | + | |
93 | + | |
94 | + <li> | |
95 | + <div class="serviceDetailTop serviceDetailTop3"> | |
96 | + <p> | |
97 | + <span style="color: #ffbe00;font-weight: 600;font-size: 16px;">壹路美汽车服务中心</span> | |
98 | + </p> | |
99 | + <p> | |
100 | + <span style="color: #ff4949">营业时间:8:00-19:00</span> | |
101 | + </p> | |
102 | + <p> | |
103 | + <span>联系人:石先生</span> | |
104 | + </p> | |
105 | + <p> | |
106 | + | |
107 | + <span>联系电话:18162919877</span> | |
108 | + | |
109 | + </p> | |
110 | + </div> | |
111 | + <p style="display: flex;justify-content: space-between;"> | |
112 | + <span>地理位置: 黄石市下陆区明盛·湖景花园(广州路5号) </span> | |
113 | + <span @click="toLinkApp('115.040454','30.189769','壹路美汽车服务中心')"> | |
114 | + <img src="../../assets/images/service/serviceNav.png" height="18" width="18"/> | |
115 | + </span> | |
116 | + </p> | |
117 | + | |
118 | + <p> | |
119 | + <span>服务范围:机电维修 改装升级 美容装饰轮毂改装</span> | |
120 | + </p> | |
121 | + <!--<p>--> | |
122 | + <!--<span></span>--> | |
73 | 123 | <!--</p>--> |
74 | - <!--</li>--> | |
124 | + <p style="display: flex;justify-content: space-between;padding-top: 5px;"> | |
125 | + <span class="serviceStar">8公里内免费救援</span> | |
126 | + <span @click="callPhone('18162919877')"> | |
127 | + <img src="../../assets/images/service/serviceIphone.png" height="18" width="18"/> | |
128 | + </span> | |
129 | + </p> | |
130 | + </li> | |
131 | + | |
132 | + | |
133 | + | |
134 | + | |
75 | 135 | |
76 | 136 | </ul> |
77 | 137 | </div> |
... | ... | @@ -109,19 +169,18 @@ export default { |
109 | 169 | window.webkit.messageHandlers.callAppPhone.postMessage({ "phoneNumber": telNum}) |
110 | 170 | } |
111 | 171 | }, |
112 | - toLinkApp(){ | |
113 | - | |
172 | + toLinkApp(lon,lat,name){ | |
114 | 173 | var u = navigator.userAgent, |
115 | 174 | app = navigator.appVersion; |
116 | 175 | var isAndroid = u.indexOf("Android") > -1 || u.indexOf("Linux") > -1; |
117 | 176 | var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); |
118 | 177 | if (isAndroid) { |
119 | 178 | // alert("我是安卓"); |
120 | - window.JSInterface.toApp('116.301359','39.938395','北京'); | |
179 | + window.JSInterface.toApp(lon,lat,name); | |
121 | 180 | } |
122 | 181 | if (isIOS) { |
123 | 182 | // alert("我是苹果"); |
124 | - window.webkit.messageHandlers.toApp.postMessage({ "lon": "116.301359", "lat": "39.938395", "name": "北京"}) | |
183 | + window.webkit.messageHandlers.toApp.postMessage({ "lon": lon, "lat": lat, "name":name}) | |
125 | 184 | } |
126 | 185 | |
127 | 186 | }, |
... | ... | @@ -152,7 +211,7 @@ export default { |
152 | 211 | .serviceDetailWrap { |
153 | 212 | padding: 10px 10px; |
154 | 213 | > li { |
155 | - height: 140px; | |
214 | + height: 160px; | |
156 | 215 | margin-bottom: 10px; |
157 | 216 | border-bottom: 1px solid #eee; |
158 | 217 | /*display: flex;*/ |
... | ... | @@ -161,12 +220,24 @@ export default { |
161 | 220 | |
162 | 221 | .serviceDetailTop { |
163 | 222 | padding-left: 130px; |
164 | - background-image: url("../../assets/images/service/service.jpg"); | |
223 | + | |
224 | + margin-bottom: 5px; | |
225 | + } | |
226 | + .serviceDetailTop1{ | |
227 | + background-image: url("../../assets/images/service/serviceDetailTop1.jpg"); | |
228 | + background-repeat: no-repeat; | |
229 | + background-size: 120px 100px; | |
230 | + } | |
231 | + .serviceDetailTop2{ | |
232 | + background-image: url("../../assets/images/service/serviceDetailTop2.jpg"); | |
233 | + background-repeat: no-repeat; | |
234 | + background-size: 120px 100px; | |
235 | + } | |
236 | + .serviceDetailTop3{ | |
237 | + background-image: url("../../assets/images/service/serviceDetailTop3.jpg"); | |
165 | 238 | background-repeat: no-repeat; |
166 | 239 | background-size: 120px 100px; |
167 | - margin-bottom: 5px; | |
168 | 240 | } |
169 | - | |
170 | 241 | .serviceStar{ |
171 | 242 | padding-left: 20px; |
172 | 243 | background: url("../../assets/images/service/serviceSrar.png") no-repeat 0 center; | ... | ... |