'主页定位'

src/pages/home/home-page.vue

@@ -2,12 +2,12 @@
    * @Descrip: 主页
  * @Author: your name
  * @Date: 2019-10-10 14:25:15
- * @LastEditTime: 2019-10-12 17:22:27
+ * @LastEditTime: 2019-10-14 13:57:37
  * @LastEditors: Please set LastEditors
    -->
 <template>
   <h-view id="homePage" class="public-style" title="徐工租赁">
-    <h-header class="bar-custom">
+    <h-header :proportion="[7,8,0]" class="bar-custom">
       <div slot="left" class="h-header-btn">
         <!-- <i class="ion-ios-arrow-back" /> -->
         <img class="locations" src="@/assets/homePage/location.png" alt="" @click="location">
@@ -74,6 +74,7 @@ export default {
   data () {
     return {
       city: '',
+      province: '',
       functionList: [
         {
           functionIcon: require('@/assets/homePage/product-select.png'),
@@ -107,26 +108,24 @@ export default {
  {
    // 定位
    getLocation () {
-     //  let url = 'http://api.map.baidu.com/location/ip?ak=2h7McXV8X4CmFkYEuhPGWLKWpdQrdHCg&coor=bd09ll'
-     //  this.hlsHttp.post(url).then(function (res) {
-     //    console.log(res)
-     //  })
-     //  this.getAddress = function () {
      let vm = this
      var geolocation = new BMap.Geolocation()
      geolocation.getCurrentPosition(function (res) {
        //  debugger
        if (this.getStatus() === 0) {
-         console.log('定位。。。。', res.address.city)
-         vm.city = res.address.city
-         //  $rootScope.city = res.address.city
-         //  $rootScope.addr = ''
-       } else {
-         //  $rootScope.city = ''
-         //  $rootScope.addr = ''
+         console.log('定位。。。。', res.address)
+         // 判断是否是手动选择过定位
+         if (window.localStorage.getItem('province')) {
+           console.log('ssss', window.localStorage.getItem('province'))
+           vm.city = window.localStorage.getItem('city')
+           vm.province = window.localStorage.getItem('province')
+         } else {
+           // 没有就定位当前位置
+           vm.city = res.address.city
+           vm.province = res.address.province
+         }
        }
      }, {enableHighAccuracy: true})
-     //  }
    },
    goFunctionHome (data) {
      //  if (data.functionState === 'NaturePersonReadOnly') {
@@ -156,15 +155,23 @@ export default {
    location () {
      this.$router.push({
        name: 'Location',
+       params: {
+         province: this.province,
+         city: this.city,
+       },
      })
    },
  },
 }
 </script>
 <style lang='less' scoped>
+
 #homePage {
     .h-header .h-header-left .h-header-btn:first-of-type {
     padding-left: 0.2rem;
+}
+.h-header .h-header-center div{
+  text-align: left!important;
 }
     .locations {
         height: 24px;
@@ -253,7 +260,7 @@ export default {
           }
       }
       .item-content {
-          width: 90%;
+          // width: 90%;
           height: 110px;
         //   border: 1px solid #ccc;
           .top {

src/pages/home/location.vue

@@ -2,7 +2,7 @@
    * @Descrip""/>User Settings Edit
  * @Author: your name
  * @Date: 2019-10-11 09:39:51
- * @LastEditTime: 2019-10-11 15:55:47
+ * @LastEditTime: 2019-10-14 14:05:34
  * @LastEditors: Please set LastEditors
    -->
 <template>
@@ -23,12 +23,12 @@
       </div>
 
       <list-item>
-        <item>
+        <item :proportion="[5,2]">
           <section slot="name" class="place">{{ places }}</section>
           <section slot="content" class="relocation">
             <div>
               <img src="@/assets/homePage/relocation.png" alt="">
-              <p>重新定位</p>
+              <p @click="relocation">重新定位</p>
             </div>
 
           </section>
@@ -42,15 +42,18 @@
         <p :class="{styles:!flag}" @click="changeStyle(1)">{{ province }}</p>
         <p :class="{styles:flag}" @click="changeStyle(2)">{{ city }}</p>
       </div>
+
+      <!-- 省份 -->
       <list-item v-if="province_flag" :item-height="40">
-        <item v-for="(item,index) in lists" :key="index">
-          <section slot="name" @click="selectProvince(item)">{{ item }}</section>
+        <item v-for="(item,index) in lists" :key="index" :proportion="[5,2]">
+          <section slot="name" @click="selectProvince(item)">{{ item.province_name }}</section>
         </item>
       </list-item>
 
+      <!-- 城市 -->
       <list-item v-if="!province_flag" :item-height="40">
-        <item v-for="(item,index) in cityList" :key="index">
-          <section slot="name" @click="selectCity(item)">{{ item }}</section>
+        <item v-for="(item,index) in cityList" :key="index" :proportion="[5,2]">
+          <section slot="name" @click="selectCity(item.city_name)">{{ item.city_name }}</section>
         </item>
       </list-item>
     </h-content>
@@ -65,18 +68,54 @@ export default {
       province_flag: true,
       province: '请选择省',
       city: '请选择市',
-      places: '江苏省-徐州市',
-      lists: ['北京省', '浙江省', '四川省'],
-      cityList: ['北京市', '成都市', '上海市', '广州市'],
+      places: '',
+      lists: [],
+      cityList: [],
     }
   },
   computed: {},
   watch: {},
+  created () {
+    // 判断是否是初次进入，不是就显示手动绑定的位置
+    if (window.localStorage.getItem('province')) {
+      this.places = window.localStorage.getItem('province') + '-' + window.localStorage.getItem('city')
+    } else {
+      this.places = this.$route.params.province + '-' + this.$route.params.city
+    }
+    this.selectLocation()
+  },
   methods:
  {
+   // 重新定位到当前位置
+   relocation () {
+     let vm = this
+     var geolocation = new BMap.Geolocation()
+     geolocation.getCurrentPosition(function (res) {
+       //  debugger
+       if (this.getStatus() === 0) {
+         console.log('定位。。。。', res.address)
+         window.localStorage.setItem('province', res.address.province)
+         window.localStorage.setItem('city', res.address.city)
+         vm.places = window.localStorage.getItem('province') + '-' + window.localStorage.getItem('city')
+       }
+     }, {enableHighAccuracy: true})
+   },
+
+   // 省份查询
+   selectLocation () {
+     let vm = this
+     let url = process.env.basePath + 'fnd_province_query'
+     let param = {}
+     vm.hlsHttp.post(url, param).then(function (res) {
+       console.log(res)
+       vm.lists = res.lists
+     })
+   },
    switchCity () {
 
    },
+
+   // 省份与城市切换
    changeStyle (val) {
      console.log(val)
      if (val === 1) {
@@ -86,8 +125,20 @@ export default {
        this.flag = true
      }
    },
+
+   // 城市查询
    selectProvince (val) {
-     this.province = val
+     this.province = val.province_name
+     let url = process.env.basePath + 'fnd_city_query'
+     let param = {
+       province_id: val.province_id,
+     }
+     let vm = this
+     this.hlsHttp.post(url, param).then(function (res) {
+       console.log(res)
+       //  this.lists = res.lists
+       vm.cityList = res.lists
+     })
      this.flag = !this.flag
      this.province_flag = false
    },
@@ -98,6 +149,9 @@ export default {
        onConfirm: (data) => {
          console.log(data)
          if (data) {
+           //  window.sessionStorage.setItem('bp_class', item.bp_class)
+           window.localStorage.setItem('province', this.province)
+           window.localStorage.setItem('city', val)
            this.places = this.province + '-' + val
            this.city = val
          }

src/router/index.js

@@ -2,7 +2,7 @@
  * @Description: In User Settings Edit
  * @Author: your name
  * @Date: 2019-09-24 12:34:06
- * @LastEditTime: 2019-10-11 09:47:23
+ * @LastEditTime: 2019-10-14 13:47:34
  * @LastEditors: Please set LastEditors
  */
 import Vue from 'vue'
@@ -89,7 +89,7 @@ export default new Router({
       path: '/home-page',
       component: HomePage,
       name: 'HomePage',
-      meta: {keepAlive: true},
+      meta: {keepAlive: false},
     },
     {
       path: '/location',