108 lines
2.3 KiB
Vue
108 lines
2.3 KiB
Vue
<template>
|
|
<view class="content">
|
|
<u-index-list :index-list="indexList">
|
|
<template v-for="(item, index) in indexList">
|
|
<u-index-item :key='index'>
|
|
<u-index-anchor :text="item['label']"></u-index-anchor>
|
|
<view :key='index2' class="list-cell" v-for="(cell, index2) in item['list']" @tap="SelectAddress(cell['city_name'],cell['city_id'])">
|
|
{{cell['city_name']}}
|
|
</view>
|
|
</u-index-item>
|
|
</template>
|
|
</u-index-list>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
// 请求接口
|
|
import {
|
|
getCityListAPI
|
|
} from '@/request/restaurant/index.js';
|
|
import { mapMutations} from 'vuex'
|
|
export default {
|
|
data() {
|
|
return {
|
|
indexList: [],
|
|
}
|
|
},
|
|
onLoad() {
|
|
this.Datainit();
|
|
},
|
|
methods: {
|
|
...mapMutations({
|
|
SETCITYCODE:'SETCITYCODE',
|
|
SETRUSERAREA:'SETRUSERAREA'
|
|
}),
|
|
/**
|
|
* @获取位置数据然后整合成组件需要的数据格式
|
|
* */
|
|
Datainit() {
|
|
let index = 0;
|
|
let arr = []
|
|
getCityListAPI().then(data => {
|
|
let d = data['data'];
|
|
console.log(d,'ddd')
|
|
for (let key in d) {
|
|
console.log(d[key]['length'],'d[key]')
|
|
arr[index] = {
|
|
label: key,
|
|
list: []
|
|
};
|
|
for (let i = 0; i < d[key]['length']; i++) {
|
|
arr[index]['list'].push({
|
|
"id": d[key][i]['id'],
|
|
"province_id": d[key][i]['province_id'],
|
|
"city_id": d[key][i]['city_id'],
|
|
"city_name": d[key][i]['city_name'],
|
|
"pinyin": d[key][i]['pinyin'],
|
|
"c_name": d[key][i]['c_name'],
|
|
})
|
|
};
|
|
index++;
|
|
};
|
|
console.log(arr,'arr');
|
|
this['indexList'] = arr;
|
|
})
|
|
},
|
|
/**
|
|
* @设置当前地区code然后推页
|
|
* */
|
|
SelectAddress(area,city_id){
|
|
if(!city_id){
|
|
uni.showToast({
|
|
title:'该地区选择错误',
|
|
icon:'none'
|
|
});
|
|
return;
|
|
}
|
|
this.SETCITYCODE(city_id);
|
|
this.SETRUSERAREA(area);
|
|
// 保存之后退页
|
|
uni.navigateBack({
|
|
delta: 1
|
|
});
|
|
|
|
},
|
|
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
/deep/ .u-border-bottom {
|
|
background-color: #ffffff !important;
|
|
border: none !important;
|
|
}
|
|
/deep/ .list-cell{
|
|
padding: 32rpx 0;
|
|
border-bottom: 1rpx solid #E2E2E2;
|
|
color: #333333;
|
|
font-size: 28rpx;
|
|
}
|
|
|
|
.content {
|
|
padding: 32rpx;
|
|
}
|
|
</style>
|