Skip to content

Commit 68e2a06

Browse files
bailicangdubailicangdu
committed
change chooseaddress
1 parent 8d6db06 commit 68e2a06

File tree

2 files changed

+66
-45
lines changed

2 files changed

+66
-45
lines changed

‎src/components/header/head.vue‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -35,9 +35,6 @@
3535
//获取用户信息
3636
this.getUserInfo();
3737
38-
},
39-
mounted(){
40-
4138
},
4239
props: ['signinUp', 'headTitle', 'goBack'],
4340
computed: {

‎src/page/confirmOrder/children/chooseAddress.vue‎

Lines changed: 66 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -5,44 +5,48 @@
55
<img src="../../../images/add_address.png" height="24" width="24">
66
<span>新增收货地址</span>
77
</router-link>
8-
<ul class="deliverable_address">
9-
<li v-for="(item,index) in deliverable" @click="chooseAddress(item, index)">
10-
<svg class="choosed_address" :class="{default_address: defaultIndex == index}">
11-
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#select"></use>
12-
</svg>
13-
<div>
14-
<header>
15-
<span>{{item.name}}</span>
16-
<span>{{item.sex == 1? '先生' : '女士'}}</span>
17-
<span>{{item.phone}}</span>
18-
</header>
19-
<div class="address_detail ellipsis">
20-
<span v-if="item.tag" :style="{backgroundColor: iconColor(item.tag)}">{{item.tag}}</span>
21-
<p>{{item.address_detail}}</p>
22-
</div>
23-
</div>
24-
</li>
25-
</ul>
26-
<section id="out_delivery" v-if="deliverdisable.length">
27-
<header class="out_header">以下地址超出配送范围</header>
28-
<ul class="deliverable_address">
29-
<li v-for="(item,index) in deliverdisable">
30-
<svg class="choosed_address">
31-
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#select"></use>
32-
</svg>
33-
<div>
34-
<header>
35-
<span>{{item.name}}</span>
36-
<span>{{item.sex == 1? '先生' : '女士'}}</span>
37-
<span>{{item.phone}}</span>
38-
</header>
39-
<div class="address_detail ellipsis">
40-
<span v-if="item.tag" :style="{backgroundColor: '#ccc'}">{{item.tag}}</span>
41-
<p>{{item.address_detail}}</p>
8+
<section id="scroll_section" class="scroll_container">
9+
<section class="list_cotainer">
10+
<ul class="deliverable_address">
11+
<li v-for="(item,index) in deliverable" @click="chooseAddress(item, index)">
12+
<svg class="choosed_address" :class="{default_address: defaultIndex == index}">
13+
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#select"></use>
14+
</svg>
15+
<div>
16+
<header>
17+
<span>{{item.name}}</span>
18+
<span>{{item.sex == 1? '先生' : '女士'}}</span>
19+
<span>{{item.phone}}</span>
20+
</header>
21+
<div class="address_detail ellipsis">
22+
<span v-if="item.tag" :style="{backgroundColor: iconColor(item.tag)}">{{item.tag}}</span>
23+
<p>{{item.address_detail}}</p>
24+
</div>
4225
</div>
43-
</div>
44-
</li>
45-
</ul>
26+
</li>
27+
</ul>
28+
<section id="out_delivery" v-if="deliverdisable.length">
29+
<header class="out_header">以下地址超出配送范围</header>
30+
<ul class="deliverable_address">
31+
<li v-for="(item,index) in deliverdisable">
32+
<svg class="choosed_address">
33+
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#select"></use>
34+
</svg>
35+
<div>
36+
<header>
37+
<span>{{item.name}}</span>
38+
<span>{{item.sex == 1? '先生' : '女士'}}</span>
39+
<span>{{item.phone}}</span>
40+
</header>
41+
<div class="address_detail ellipsis">
42+
<span v-if="item.tag" :style="{backgroundColor: '#ccc'}">{{item.tag}}</span>
43+
<p>{{item.address_detail}}</p>
44+
</div>
45+
</div>
46+
</li>
47+
</ul>
48+
</section>
49+
</section>
4650
</section>
4751
<alert-tip v-if="showAlert" @closeTip="showAlert = false" :alertText="alertText"></alert-tip>
4852
<transition name="router-slid" mode="out-in">
@@ -56,6 +60,7 @@
5660
import {mapState, mapMutations} from 'vuex'
5761
import {getAddress} from 'src/service/getData'
5862
import alertTip from 'src/components/common/alertTip'
63+
import BScroll from 'better-scroll'
5964
6065
export default {
6166
data(){
@@ -110,7 +115,14 @@
110115
}else{
111116
this.deliverdisable.push(item);
112117
}
113-
118+
})
119+
this.$nextTick(() => {
120+
new BScroll('#scroll_section', {
121+
deceleration: 0.001,
122+
bounce: true,
123+
swipeTime: 1800,
124+
click: true,
125+
});
114126
})
115127
}
116128
},
@@ -123,7 +135,7 @@
123135
//选择地址
124136
chooseAddress(address, index){
125137
this.CHOOSE_ADDRESS({address, index});
126-
this.$router.go(-1);
138+
127139
},
128140
},
129141
watch: {
@@ -134,7 +146,6 @@
134146
},
135147
newAddress: function (value) {
136148
this.initData();
137-
console.log(11111)
138149
},
139150
}
140151
}
@@ -149,13 +160,25 @@
149160
left: 0;
150161
right: 0;
151162
bottom: 0;
152-
background-color: #f5f5f5;
153-
z-index: 204;
163+
background-color: #fff;
164+
z-index: 202;
154165
padding-top: 1.95rem;
155166
p, span{
156167
font-family: Helvetica Neue,Tahoma,Arial;
157168
}
158169
}
170+
.scroll_container{
171+
position: fixed;
172+
top: 0;
173+
left: 0;
174+
right: 0;
175+
bottom: 0;
176+
padding-top: 1.95rem;
177+
overflow-y: auto;
178+
}
179+
.list_cotainer{
180+
padding-bottom: 5rem;
181+
}
159182
.add_icon_footer{
160183
position: fixed;
161184
bottom: 0;
@@ -220,6 +243,7 @@
220243
@include sc(.6rem, #666);
221244
line-height: 1.5rem;
222245
padding-left: .5rem;
246+
background-color: #f5f5f5;
223247
}
224248
*{
225249
color: #ccc;

0 commit comments

Comments
 (0)