19a4329d
 刘淇
周边服务
|
1
|
<template>
|
|
cf4544fa
刘淇
周边服务
|
2
3
4
5
6
7
8
|
<div>
<div style="height: 44px;">
<mt-search
v-model="value"
cancel-text="取消"
placeholder="搜索">
</mt-search>
|
|
19a4329d
刘淇
周边服务
|
9
|
</div>
|
|
cf4544fa
刘淇
周边服务
|
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
|
<group title="" label-width="5em">
<popup-picker :title="title1" :data="list1" v-model="value1" @on-show="onShow" @on-hide="onHide" @on-change="onChange" placeholder="请选择"></popup-picker>
<popup-picker :title="title2" :data="list2" v-model="value2" @on-show="onShow" @on-hide="onHide" @on-change="onChange" placeholder="请选择"></popup-picker>
</group>
<ul class="serviceDetailWrap">
<li>
<div class="serviceDetailTop">
<p>
<span style="color: #ffbe00;font-weight: 600;font-size: 16px;">途虎养车磁湖东路店</span>
</p>
<p>
<span style="color: #ff4949">营业时间：早8店晚21点</span>
</p>
<p>
<span>店长：梁浩</span>
</p>
<p>
|
|
cf4544fa
刘淇
周边服务
|
28
|
|
|
cf4544fa
刘淇
周边服务
|
29
|
<span>联系电话：13333333333</span>
|
|
0a26514e
刘淇
周边服务
|
30
|
|
|
cf4544fa
刘淇
周边服务
|
31
32
33
34
|
</p>
</div>
<p style="display: flex;justify-content: space-between;">
<span>地理位置: 黄石西塞山区慈湖东路26号途虎养车</span>
|
|
0a26514e
刘淇
周边服务
|
35
36
|
<span @click="toLinkApp()">
<img src="../../assets/images/service/serviceNav.png" height="18" width="18"/>
|
|
cf4544fa
刘淇
周边服务
|
37
38
39
40
|
</span>
</p>
<p style="display: flex;justify-content: space-between;padding-top: 5px;">
<span class="serviceStar">八公里内道路援助</span>
|
|
0a26514e
刘淇
周边服务
|
41
42
|
<span @click="callPhone('13333333333')">
<img src="../../assets/images/service/serviceIphone.png" height="18" width="18"/>
|
|
cf4544fa
刘淇
周边服务
|
43
44
45
46
|
</span>
</p>
</li>
|
|
0a26514e
刘淇
周边服务
|
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
|
<!--<li>-->
<!--<div class="serviceDetailTop">-->
<!--<p>-->
<!--<span style="color: #ffbe00;font-weight: 600;font-size: 16px;">途虎养车磁湖东路店</span>-->
<!--</p>-->
<!--<p>-->
<!--<span style="color: #ff4949">营业时间：早8店晚21点</span>-->
<!--</p>-->
<!--<p>-->
<!--<span>店长：梁浩</span>-->
<!--</p>-->
<!--<p>-->
<!--<span>联系电话：13333333333</span>-->
<!--</p>-->
<!--</div>-->
<!--<p style="display: flex;justify-content: space-between;">-->
<!--<span>地理位置: 黄石西塞山区慈湖东路26号途虎养车</span>-->
<!--<span>-->
<!--<img src="../../assets/images/service/serviceNav.png" height="16" width="16"/>-->
<!--</span>-->
<!--</p>-->
<!--<p style="display: flex;justify-content: space-between;padding-top: 5px;">-->
<!--<span class="serviceStar">八公里内道路援助</span>-->
<!--<span>-->
<!--<img src="../../assets/images/service/serviceIphone.png" height="16" width="16"/>-->
<!--</span>-->
<!--</p>-->
<!--</li>-->
|
|
cf4544fa
刘淇
周边服务
|
76
77
|
</ul>
</div>
|
|
19a4329d
刘淇
周边服务
|
78
79
80
81
|
</template>
<script>
export default {
|
|
cf4544fa
刘淇
周边服务
|
82
83
84
85
86
87
88
89
90
91
92
93
|
name: "serviceDetail",
data () {
return {
value:'',
title1: '全部服务',
value1: ['全部'],
list1: [['全部', '汽车', '美容']],
title2: '附近',
value2: ['3KM'],
list2: [['3KM', '10KM', '20KM']],
}
},
|
|
0a26514e
刘淇
周边服务
|
94
95
96
|
mounted() {
window.toLinkApp = this.toLinkApp;
},
|
|
cf4544fa
刘淇
周边服务
|
97
|
methods: {
|
|
0a26514e
刘淇
周边服务
|
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
|
callPhone(telNum) {
var u = navigator.userAgent,
app = navigator.appVersion;
var isAndroid = u.indexOf("Android") > -1 || u.indexOf("Linux") > -1;
var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
if (isAndroid) {
// alert("我是安卓");
window.JSInterface.callAppPhone(telNum);
}
if (isIOS) {
// alert("我是苹果");
window.webkit.messageHandlers.callAppPhone.postMessage({ "phoneNumber": telNum})
}
},
toLinkApp(){
var u = navigator.userAgent,
app = navigator.appVersion;
var isAndroid = u.indexOf("Android") > -1 || u.indexOf("Linux") > -1;
var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
if (isAndroid) {
// alert("我是安卓");
window.JSInterface.toApp('116.301359','39.938395','北京');
}
if (isIOS) {
// alert("我是苹果");
window.webkit.messageHandlers.toApp.postMessage({ "lon": "116.301359", "lat": "39.938395", "name": "北京"})
}
},
|
|
cf4544fa
刘淇
周边服务
|
128
129
130
131
132
133
134
135
136
137
138
139
|
onChange (val) {
console.log('val change', val)
},
changeList10 () {
this.list1 = [['小米1', 'iPhone1', '华为1', '情怀1', '三星1', '其他1', '不告诉你1']]
},
changeList11 () {
this.list1[0].push('我是push条目')
},
changeList20 () {
},
|
|
19a4329d
刘淇
周边服务
|
140
|
|
|
cf4544fa
刘淇
周边服务
|
141
142
143
144
145
146
147
|
onShow () {
console.log('on show')
},
onHide (type) {
console.log('on hide', type)
}
},
|
|
19a4329d
刘淇
周边服务
|
148
|
}
|
|
cf4544fa
刘淇
周边服务
|
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
|
</script>
<style scoped lang="scss">
.serviceDetailWrap {
padding: 10px 10px;
> li {
height: 140px;
margin-bottom: 10px;
border-bottom: 1px solid #eee;
/*display: flex;*/
}
}
.serviceDetailTop {
padding-left: 130px;
background-image: url("../../assets/images/service/service.jpg");
background-repeat: no-repeat;
background-size: 120px 100px;
margin-bottom: 5px;
}
.serviceStar{
padding-left: 20px;
background: url("../../assets/images/service/serviceSrar.png") no-repeat 0 center;
color: #ff4949;
}
|
|
19a4329d
刘淇
周边服务
|
175
|
</style>
|
