zyronon
4 years ago
12 changed files with 481 additions and 35 deletions
@ -0,0 +1,131 @@
@@ -0,0 +1,131 @@
|
||||
<template> |
||||
<div class="choose-location"> |
||||
<BaseHeader> |
||||
<template v-slot:center> |
||||
<span class="f16">成都</span> |
||||
</template> |
||||
</BaseHeader> |
||||
<div class="content"> |
||||
<div class="schools"> |
||||
<div class="row" @click="save(item)" v-for="item in list"> |
||||
<span>{{ item }}</span> |
||||
<div class="right"> |
||||
<img src="../../../assets/img/icon/close-white.png" alt=""> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
|
||||
import {mapState} from "vuex"; |
||||
|
||||
export default { |
||||
name: "ChooseProvince", |
||||
data() { |
||||
return { |
||||
list: [ |
||||
'成都', |
||||
'自贡', |
||||
'攀枝花', |
||||
'泸州', |
||||
'德阳', |
||||
'绵阳', |
||||
'广元', |
||||
'遂宁', |
||||
'内江', |
||||
'乐山', |
||||
'南充', |
||||
'眉山', |
||||
'宜宾', |
||||
'广安', |
||||
'达州', |
||||
'雅安', |
||||
'巴中', |
||||
'资阳', |
||||
'阿坝', |
||||
'甘孜', |
||||
'凉山', |
||||
] |
||||
} |
||||
}, |
||||
computed: { |
||||
...mapState({ |
||||
userinfo: 'userinfo', |
||||
}) |
||||
}, |
||||
methods: { |
||||
async save(item) { |
||||
this.$showLoading() |
||||
let data = {...this.userinfo, ...{location: '中国-四川-成都'}} |
||||
this.$store.commit('setUserinfo', data) |
||||
await this.$sleep(500) |
||||
this.$hideLoading() |
||||
history.go(-3) |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
@import "../../../assets/scss/index"; |
||||
|
||||
.choose-location { |
||||
position: fixed; |
||||
left: 0; |
||||
right: 0; |
||||
bottom: 0; |
||||
top: 0; |
||||
color: white; |
||||
overflow: auto; |
||||
|
||||
.content { |
||||
padding-top: 6rem; |
||||
|
||||
.nearby { |
||||
|
||||
.title { |
||||
padding: 1rem 2rem; |
||||
|
||||
img { |
||||
width: 1rem; |
||||
height: 1rem; |
||||
margin-right: .2rem; |
||||
} |
||||
} |
||||
|
||||
} |
||||
|
||||
.row { |
||||
padding: 0 1.5rem; |
||||
display: flex; |
||||
justify-content: space-between; |
||||
align-items: center; |
||||
height: 5rem; |
||||
font-size: 1.4rem; |
||||
transition: all .1s; |
||||
background: $main-bg; |
||||
|
||||
.right { |
||||
display: flex; |
||||
justify-content: space-between; |
||||
align-items: center; |
||||
color: $second-text-color; |
||||
|
||||
img { |
||||
margin-left: 1rem; |
||||
width: 15px; |
||||
} |
||||
} |
||||
|
||||
&:active { |
||||
background: $active-main-bg; |
||||
color: $second-text-color; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
</style> |
||||
@ -0,0 +1,114 @@
@@ -0,0 +1,114 @@
|
||||
<template> |
||||
<div class="choose-location"> |
||||
<BaseHeader> |
||||
<template v-slot:center> |
||||
<span class="f16">选择地区</span> |
||||
</template> |
||||
</BaseHeader> |
||||
<div class="content"> |
||||
<div class="row" @click="save">暂不设置</div> |
||||
<div class="line" style="width: calc(100% - 4rem);margin-left: 2rem;"></div> |
||||
<div class="nearby"> |
||||
<div class="title"> |
||||
<img src="../../../assets/img/icon/location.svg" alt=""> |
||||
<span>当前位置</span> |
||||
</div> |
||||
<div class="row">无法获取</div> |
||||
</div> |
||||
<div class="line" style="width: calc(100% - 4rem);margin-left: 2rem;"></div> |
||||
<div class="schools"> |
||||
<div class="row" @click="$nav('/choose-province')"> |
||||
<span>中国</span> |
||||
<div class="right"> |
||||
<img src="../../../assets/img/icon/close-white.png" alt=""> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
|
||||
import {mapState} from "vuex"; |
||||
|
||||
export default { |
||||
name: "ChooseLocation", |
||||
computed: { |
||||
...mapState({ |
||||
userinfo: 'userinfo', |
||||
}) |
||||
}, |
||||
methods: { |
||||
async save(item) { |
||||
this.$showLoading() |
||||
let data = {...this.userinfo, ...{location: '暂不设置'}} |
||||
this.$store.commit('setUserinfo', data) |
||||
await this.$sleep(500) |
||||
this.$hideLoading() |
||||
this.$back() |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
@import "../../../assets/scss/index"; |
||||
|
||||
.choose-location { |
||||
position: fixed; |
||||
left: 0; |
||||
right: 0; |
||||
bottom: 0; |
||||
top: 0; |
||||
color: white; |
||||
overflow: auto; |
||||
|
||||
.content { |
||||
padding-top: 6rem; |
||||
|
||||
.nearby { |
||||
|
||||
.title { |
||||
padding: 1rem 2rem; |
||||
|
||||
img { |
||||
width: 1rem; |
||||
height: 1rem; |
||||
margin-right: .2rem; |
||||
} |
||||
} |
||||
|
||||
} |
||||
|
||||
.row { |
||||
padding: 0 1.5rem; |
||||
display: flex; |
||||
justify-content: space-between; |
||||
align-items: center; |
||||
height: 5rem; |
||||
font-size: 1.4rem; |
||||
transition: all .1s; |
||||
background: $main-bg; |
||||
|
||||
.right { |
||||
display: flex; |
||||
justify-content: space-between; |
||||
align-items: center; |
||||
color: $second-text-color; |
||||
|
||||
img { |
||||
margin-left: 1rem; |
||||
width: 15px; |
||||
} |
||||
} |
||||
|
||||
&:active { |
||||
background: $active-main-bg; |
||||
color: $second-text-color; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
</style> |
||||
@ -0,0 +1,97 @@
@@ -0,0 +1,97 @@
|
||||
<template> |
||||
<div class="choose-location"> |
||||
<BaseHeader> |
||||
<template v-slot:center> |
||||
<span class="f16">中国</span> |
||||
</template> |
||||
</BaseHeader> |
||||
<div class="content"> |
||||
<div class="schools"> |
||||
<div class="row" @click="$nav('/choose-city')" v-for="item in list"> |
||||
<span>{{ item }}</span> |
||||
<div class="right"> |
||||
<img src="../../../assets/img/icon/close-white.png" alt=""> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
|
||||
export default { |
||||
name: "ChooseProvince", |
||||
data() { |
||||
return { |
||||
list: [ |
||||
'河北', '山西', '辽宁', '吉林', '黑龙江', '江苏', '浙江', '安徽', '福建', '江西', '山东', '河南', '湖北', '湖南', '广东', '海南', '四川', '贵州', '云南', '陕西', '甘肃', '青海', '台湾', |
||||
'内蒙古', '广西', '西藏', '宁夏', '新疆', |
||||
'北京', '天津', '上海', '重庆', |
||||
'香港', '澳门' |
||||
] |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
@import "../../../assets/scss/index"; |
||||
|
||||
.choose-location { |
||||
position: fixed; |
||||
left: 0; |
||||
right: 0; |
||||
bottom: 0; |
||||
top: 0; |
||||
color: white; |
||||
overflow: auto; |
||||
|
||||
.content { |
||||
padding-top: 6rem; |
||||
|
||||
.nearby { |
||||
|
||||
.title { |
||||
padding: 1rem 2rem; |
||||
|
||||
img { |
||||
width: 1rem; |
||||
height: 1rem; |
||||
margin-right: .2rem; |
||||
} |
||||
} |
||||
|
||||
} |
||||
|
||||
.row { |
||||
padding: 0 1.5rem; |
||||
display: flex; |
||||
justify-content: space-between; |
||||
align-items: center; |
||||
height: 5rem; |
||||
font-size: 1.4rem; |
||||
transition: all .1s; |
||||
background: $main-bg; |
||||
|
||||
.right { |
||||
display: flex; |
||||
justify-content: space-between; |
||||
align-items: center; |
||||
color: $second-text-color; |
||||
|
||||
img { |
||||
margin-left: 1rem; |
||||
width: 15px; |
||||
} |
||||
} |
||||
|
||||
&:active { |
||||
background: $active-main-bg; |
||||
color: $second-text-color; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
</style> |
||||
Loading…
Reference in new issue