添加国际城市页

@@ -24,7 +24,8 @@
     "pages/meal/detail/detail",
     "pages/order/complain/complain",
     "pages/order/order-detail/order-detail",
-    "pages/comment/comment"
+    "pages/comment/comment",
+    "pages/index/city-list/city-list"
   ],
   "window": {
     "backgroundTextStyle": "light",

+// pages/index/city-list/city-list.js
+const app = getApp();
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+        current: 0,
+        list:[],
+        status:0,
+    },
+    //tab点击事件
+    chargeTab(e) {
+        const current = +e.currentTarget.dataset.current;
+        this.setData({
+            current: current,
+        });
+        if(current === 0) {
+            this.getCityList()
+        }else if(current === 1) {
+            this.getAbroadList()
+        }
+        // this.getList();
+    },
+    //获取国内城市列表
+    getCityList() {
+        const self = this;
+        let url = '/portal/Index/cityList';
+        app.post(url, {}, {}).then((res) => {
+            console.log('获取城市列表', res);
+            if (+res.code === 1) {
+                const arr = [];
+                res.data.list.forEach((item) => {
+                    arr.push(item.title)
+                });
+                self.setData({
+                    city_picker_list: arr,
+                    cityList:res.data.list,
+                });
+            }
+        })
+    },
+    //获取国外名
+    getAbroadList() {
+        const self = this;
+        let url = '/portal/Index/addr';
+        let params = {
+            token: wx.getStorageSync('token'),
+        };
+        app.post(url, params, {}).then((res) => {
+            console.log('获取国外列表', res);
+            if (+res.code === 1) {
+                const arr = [];
+                res.data.forEach((item) => {
+                    arr.push(item.title)
+                });
+                self.setData({
+                    city_picker_list: arr,
+                    cityList:res.data,
+                });
+            }
+        })
+    },
+    //选择国内城市
+    chooseDomesticCity(e) {
+        const current = e.currentTarget.dataset.index;
+        wx.showLoading({title:'加载中',mask:true});
+        this.setData({is_show_city:false});
+        const lat = this.data.cityList[current].latng.split(',')[1];
+        const lng = this.data.cityList[current].latng.split(',')[0];
+        this.setData({lat: lat, lng: lng,addr:this.data.cityList[current].title});
+        // console.log('lat', 'lng',lat,lng);
+        // this.getIndex();
+    },
+    //选择国外城市
+    chooseAbroadCity(e) {
+        const current = e.currentTarget.dataset.index;
+        wx.showLoading({title:'加载中',mask:true});
+        this.setData({
+            // current_city: e.detail.value,
+            is_city_change: true,
+            is_show_city:false
+        });
+        const lat = this.data.AbroadCityList[current].latng.split(',')[1];
+        const lng = this.data.AbroadCityList[current].latng.split(',')[0];
+        this.setData({lat: lat, lng: lng,addr:this.data.AbroadCityList[current].title});
+        console.log('lat', 'lng',lat,lng);
+        // this.getIndex();
+    },
+    chooseCity(e) {
+        wx.showLoading({title:'加载中',mask:true});
+        const current = e.currentTarget.dataset.index;
+        const lat = this.data.cityList[current].latng.split(',')[1];
+        const lng = this.data.cityList[current].latng.split(',')[0];
+        const addr = this.data.cityList[current].title;
+        console.log('addr', addr);
+        this.setData({current_city:current});
+        wx.setStorageSync('lat',lat);
+        wx.setStorageSync('lng',lng);
+        wx.setStorageSync('addr',addr);
+        setTimeout(function () {
+            wx.hideLoading();
+            wx.navigateBack({delta:1})
+        }, 1000)
+    },
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad: function (options) {
+        this.getCityList();
+    },
+
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload: function () {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh: function () {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom: function () {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    onShareAppMessage: function () {
+
+    }
+})
\ No newline at end of file

+{
+  "navigationBarTitleText": "选择国家或城市",
+  "usingComponents": {}
+}
\ No newline at end of file

+<!--pages/index/city-list/city-list.wxml-->
+<view class="content">
+    <view class='tab_box'>
+        <view class="tab_item {{current==0?'active':''}}" data-current='{{0}}' bindtap='chargeTab'>国内</view>
+        <view class="tab_item {{current==1?'active':''}}" data-current='{{1}}' bindtap='chargeTab'>国际</view>
+    </view>
+    <view class="city-box">
+        <view wx:for="{{city_picker_list}}" wx:key="index">
+            <view class="city-item {{current_city === index?'change-bg':''}}" bindtap="chooseCity" data-index="{{index}}">{{item}}</view>
+        </view>
+    </view>
+</view>
\ No newline at end of file

+/* pages/index/city-list/city-list.wxss */
+page {
+    height: 100%;
+    background-color: #f5f6f8;
+}
+.content {
+    height: 100%;
+    background-color: #f5f6f8;
+}
+.tab_box {
+    width: 100%;
+    /* padding: 0 70rpx; */
+    height: 90rpx;
+    line-height: 90rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    /* border-bottom: 20rpx solid #f5f5f5; */
+    overflow: hidden;
+    white-space: nowrap;
+    flex-wrap: nowrap;
+    position: fixed;
+    top:0;
+    left:0;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    background-color: #fff;
+}
+.tab_item {
+    width:50%;
+    display: inline-block;
+    /* width: 160rpx; */
+    font-size: 30rpx;
+    color: #333333;
+    position: relative;
+    text-align: center;
+    border-bottom: 4rpx solid transparent;
+    /* border: 1rpx solid red; */
+}
+.tab_box .active {
+    border-bottom: 4rpx solid #DB4E2A;
+    /*font-weight: bold;*/
+    /*color: #0E050A;*/
+}
+
+/*.tab_box .active::after {*/
+    /*content: "";*/
+    /*!*border: 2rpx solid #DB4E2A;*!*/
+    /*position: absolute;*/
+    /*bottom: 0rpx;*/
+    /*left: 50%;*/
+    /*transform: translateX(-50%);*/
+    /*width: 250rpx;*/
+    /*height: 3rpx;*/
+    /*background: #2C82E6;*/
+/*}*/
+.city-box {
+    margin-top: 104rpx;
+    display: flex;
+    flex-wrap: wrap;
+    align-items: flex-start;
+    padding: 10rpx 30rpx;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+}
+.city-item {
+    padding: 10rpx 40rpx;
+    font-size: 28rpx;
+    color: #666666;
+    border-radius: 6rpx;
+    margin-top: 20rpx;
+    margin-right: 20rpx;
+    border:1rpx solid #e8e8e8;
+    background-color: #fff;
+}
+.change-bg {
+    background-color: #DB4E2A;
+    color: #ffffff;
+}
\ No newline at end of file

@@ -45,75 +45,6 @@ Page({
             // Do something when catch error
         }
     },
-    //获取国内城市列表
-    getCityList() {
-        const self = this;
-        let url = '/portal/Index/cityList';
-        app.post(url, {}, {}).then((res) => {
-            console.log('获取城市列表', res);
-            if (+res.code === 1) {
-                const arr = [];
-                res.data.list.forEach((item) => {
-                   arr.push(item.title)
-                });
-                self.setData({
-                    city_picker_list: arr,
-                    cityList:res.data.list,
-                });
-            }
-        })
-    },
-    //获取国外名
-    getAbroadList() {
-        const self = this;
-        let url = '/portal/Index/addr';
-        let params = {
-            token: wx.getStorageSync('token'),
-        };
-        app.post(url, params, {}).then((res) => {
-            console.log('获取国外列表', res);
-            if (+res.code === 1) {
-                const arr = [];
-                res.data.list.forEach((item) => {
-                    arr.push(item.title)
-                });
-                self.setData({
-                    Abroad_city_picker_list: arr,
-                    AbroadCityList:res.data.list,
-                });
-            }
-        })
-    },
-    chooseCity() {
-        this.setData({is_show_city:!this.data.is_show_city})
-    },
-    chooseDomesticCity(e) {
-        this.setData({is_show_city:false});
-    },
-    chooseAbroadCity(e) {
-        this.setData({
-            current_city: e.detail.value,
-            is_city_change: true,
-            is_show_city:false
-        });
-        const lat = this.data.cityList[e.detail.value].latng.split(',')[1];
-        const lng = this.data.cityList[e.detail.value].latng.split(',')[0];
-        this.setData({lat: lat, lng: lng,addr:this.data.cityList[e.detail.value].title});
-        // console.log('lat', 'lng',lat,lng);
-        this.getIndex();
-    },
-    //切换城市
-    cityPickerChange(e) {
-        this.setData({
-            current_city: e.detail.value,
-            is_city_change: true
-        });
-        const lat = this.data.cityList[e.detail.value].latng.split(',')[1];
-        const lng = this.data.cityList[e.detail.value].latng.split(',')[0];
-        this.setData({lat: lat, lng: lng,addr:this.data.cityList[e.detail.value].title});
-        // console.log('lat', 'lng',lat,lng);
-        this.getIndex();
-    },
     swiperChange(e) {
         this.setData({current_swiper: e.detail.current})
     },
@@ -176,7 +107,8 @@ Page({
         let city = null;
         if(this.data.is_city_change) {
             city = JSON.stringify({
-                name:this.data.cityList[this.data.current_city].title,
+                // name:this.data.cityList[this.data.current_city].title,
+                name:this.data.addr,
                 lat: this.data.lat,
                 lng: this.data.lng,
             })
@@ -344,25 +276,111 @@ Page({
             })
         }
     },
-    //获取经纬度
-    getLat() {
+    //获取国内城市列表
+    getCityList() {
         const self = this;
-        wx.getLocation({  //获取当前经纬度
-            type: 'wgs84', //返回可以用于wx.openLocation的经纬度，官方提示bug: iOS 6.3.30 type 参数不生效，只会返回 wgs84 类型的坐标信息
-            success: function (res) {
-                console.log('获取当前经纬度', res);
-                self.setData({lat: res.latitude, lng: res.longitude});
-                // app.loginCallback();
-                // app.loginCallback = res => {
-                //     console.log('show-callback-res', res);
-                app.getLogin().then(function (res) {
-                    console.log('res', res);
-                    self.getIndex(res.token);//获取首页
-                    self.getIsWrite(); //判断是否已填写个人信息
+        let url = '/portal/Index/cityList';
+        app.post(url, {}, {}).then((res) => {
+            console.log('获取城市列表', res);
+            if (+res.code === 1) {
+                const arr = [];
+                res.data.list.forEach((item) => {
+                    arr.push(item.title)
+                });
+                self.setData({
+                    city_picker_list: arr,
+                    cityList:res.data.list,
+                });
+            }
+        })
+    },
+    //获取国外名
+    getAbroadList() {
+        const self = this;
+        let url = '/portal/Index/addr';
+        let params = {
+            token: wx.getStorageSync('token'),
+        };
+        app.post(url, params, {}).then((res) => {
+            console.log('获取国外列表', res);
+            if (+res.code === 1) {
+                const arr = [];
+                res.data.forEach((item) => {
+                    arr.push(item.title)
+                });
+                self.setData({
+                    Abroad_city_picker_list: arr,
+                    AbroadCityList:res.data,
                 });
-                // };
             }
+        })
+    },
+    //打开城市列表
+    chooseCity() {
+        // this.setData({is_show_city:!this.data.is_show_city})
+        wx.navigateTo({url:'/pages/index/city-list/city-list'})
+    },
+    //选择国内城市
+    chooseDomesticCity(e) {
+        const current = e.currentTarget.dataset.index;
+        wx.showLoading({title:'加载中',mask:true});
+        this.setData({is_show_city:false});
+        const lat = this.data.cityList[current].latng.split(',')[1];
+        const lng = this.data.cityList[current].latng.split(',')[0];
+        this.setData({lat: lat, lng: lng,addr:this.data.cityList[current].title});
+        // console.log('lat', 'lng',lat,lng);
+        this.getIndex();
+    },
+    //选择国外城市
+    chooseAbroadCity(e) {
+        const current = e.currentTarget.dataset.index;
+        wx.showLoading({title:'加载中',mask:true});
+        this.setData({
+            // current_city: e.detail.value,
+            is_city_change: true,
+            is_show_city:false
         });
+        const lat = this.data.AbroadCityList[current].latng.split(',')[1];
+        const lng = this.data.AbroadCityList[current].latng.split(',')[0];
+        this.setData({lat: lat, lng: lng,addr:this.data.AbroadCityList[current].title});
+        console.log('lat', 'lng',lat,lng);
+        this.getIndex();
+    },
+    //切换城市
+    // cityPickerChange(e) {
+    //     this.setData({
+    //         current_city: e.detail.value,
+    //         is_city_change: true
+    //     });
+    //     const lat = this.data.cityList[e.detail.value].latng.split(',')[1];
+    //     const lng = this.data.cityList[e.detail.value].latng.split(',')[0];
+    //     this.setData({lat: lat, lng: lng,addr:this.data.cityList[e.detail.value].title});
+    //     // console.log('lat', 'lng',lat,lng);
+    //     this.getIndex();
+    // },
+    //获取经纬度
+    getLat() {
+        const self = this;
+        if(wx.getStorageSync('lat') === '' &&
+            wx.getStorageSync('lng') === '' &&
+            wx.getStorageSync('addr') === '') {
+            wx.getLocation({  //获取当前经纬度
+                type: 'wgs84', //返回可以用于wx.openLocation的经纬度，官方提示bug: iOS 6.3.30 type 参数不生效，只会返回 wgs84 类型的坐标信息
+                success: function (res) {
+                    console.log('获取当前经纬度', res);
+                    self.setData({lat: res.latitude, lng: res.longitude});
+                    // app.loginCallback();
+                    // app.loginCallback = res => {
+                    //     console.log('show-callback-res', res);
+                    app.getLogin().then(function (res) {
+                        console.log('res', res);
+                        self.getIndex(res.token);//获取首页
+                        self.getIsWrite(); //判断是否已填写个人信息
+                    });
+                    // };
+                }
+            });
+        }
         // wx.setStorageSync('score',30);
         console.log('score',wx.getStorageSync('score'));
         if(wx.getStorageSync('score') !== '' && wx.getStorageSync('score')>=80) {
@@ -389,10 +407,11 @@ Page({
         app.post(url, params, {}).then((res) => {
             console.log('获取首页', res);
             if (+res.code === 1) {
+                wx.hideLoading();
                 self.setData({
                     slide: res.data.banner,
                     cate: res.data.cate,
-                    china_city: res.data.city.city,
+                    city: res.data.city,
                     noticeList: res.data.extra,
                     meal_banner: res.data.meal,
                     items: res.data.active,
@@ -428,14 +447,26 @@ Page({
         })
     },
     onLoad: function () {
-        this.getCityList();
-        this.getAbroadList();
+        // this.getCityList();
+        // this.getAbroadList();
         this._doRefreshMasonry(this.data.items)
     },
     onShow() {
         if(wx.getStorageSync('isLogin') === true) {
             this.getLat();//获取经纬度
         }
+        if(wx.getStorageSync('lat') !== '' &&
+            wx.getStorageSync('lng') !== '' &&
+            wx.getStorageSync('addr') !== '') {
+            console.log('已选择城市');
+            this.setData({
+                is_city_change:true,
+                lat:wx.getStorageSync('lat'),
+                lng: wx.getStorageSync('lng'),
+                addr:wx.getStorageSync('addr'),
+            });
+            this.getIndex()
+        }
         // wx.chooseLocation({
         //     success(res) {
         //         console.log(res);

@@ -14,7 +14,7 @@
                   class="picker">
                 <view class="left">
                     <view class="iconfont icon-location"></view>
-                    <text>{{city_picker_list[current_city] || china_city}}</text>
+                    <text>{{city}}</text>
                     <view class="iconfont icon-arrow-down"></view>
                 </view>
             </view>

@@ -23,14 +23,14 @@
     bottom:0;
     left:0;
     width: 100%;
-    height: 354rpx;
+    height: 409rpx;
     z-index:100;
 }
 .area_box {
     width: 50%;
-    height: 354rpx;
+    height: 409rpx;
     background-color: #fff;
-    padding: 30rpx 0;
+    padding: 50rpx 0;
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box;
@@ -46,8 +46,8 @@
 }
 .area {
     width: 100%;
-    height: 60rpx;
-    line-height: 60rpx;
+    height: 80rpx;
+    line-height: 80rpx;
     /* background-color: #D5F0FF; */
     font-size: 32rpx;
     color: #000000;