股份+地图

src/views/baseInfo/companyInfo/companyMap.vue

+<template>
+  <baidu-map id="map" class="map" style="height: 350px;" :center="center" :zoom="zoom" @ready="handler" @click="mapClick(this, $event)">
+    <!--  缩放  -->
+    <bm-navigation anchor="BMAP_ANCHOR_TOP_RIGHT"></bm-navigation>
+  </baidu-map>
+</template>
+<script src="http://api.map.baidu.com/api?v=2.0&ak=iSEprDCqtYn5aC06Y3cDyGCEOP1hydwR"></script>
+
+<script>
+  import BaiduMap from 'vue-baidu-map';
+  import {
+    getSonRegionByCodes,
+    getRegionByCodes,
+  } from 'api/base_info/region/';
+  import {
+    page,
+    addObj,
+    getObj,
+    delObj,
+    putObj
+  } from 'api/base_info/branch_company';
+  export default {
+    props: ["toSonData","provinceName"],
+    data() {
+      return {
+        center: {
+          lng: 108.9462765501,
+          lat: 34.3474989219
+        },  // 经纬度
+        zoom: 4, // 地图展示级别
+        pointList: [],
+        pickPoint: null,
+        listQuery: {
+          page: 1,
+          limit: 10000,
+          addrProvince: undefined,
+          addrCity: undefined,
+          addrTown: undefined
+        },
+      }
+    },
+    mounted() {
+    },
+    watch: {
+      provinceName(newValue, oldValue) {
+        console.log(this.toSonData);
+        console.log(this.provinceName);
+//        var map = new BMap.Map("map"); //创建Map实例
+//        map.centerAndZoom(this.provinceName,6);
+      },
+    },
+    methods: {
+      getList() {
+        page(this.listQuery)
+          .then(response => {
+            let listTemp = response.data.data;
+            //一次读入所有涉及地区，防止多次读取
+            if (!this.$utils.isEmpty(listTemp)) {
+              let allRegions = new Set();
+              for (let index in listTemp) {
+                allRegions.add(listTemp[index].addrProvince);
+                allRegions.add(listTemp[index].addrCity);
+                allRegions.add(listTemp[index].addrTown);
+                let regions = getRegionByCodes([listTemp[index].addrProvince, listTemp[index].addrCity, listTemp[index].addrTown]);
+                listTemp[index].address = regions[0].name + ' ' + regions[1].name + ' ' + regions[2].name + ' ';
+              }
+              getRegionByCodes([...allRegions]);
+            }
+            let arr = this.list;
+            listTemp.map(function(item){
+              arr.push(item);
+            });
+            this.list = arr;
+          })
+      },
+      handler({map}) {
+        let list = this.toSonData;
+        // 定位
+        this.geolocation(map);
+        // 产生随机点
+        const bounds = map.getBounds();
+        for (let i = 0; i < list.length; i++) {
+          const point = {
+            title: list[i].name,
+            point: {
+              lng: list[i].longitude,
+              lat: list[i].latitude
+            }
+          };
+          this.pointList.push(point);
+        }
+        this.addMarker(map);
+      },
+      mapClick(map, e) {
+        const point = e.point;
+        if (this.pickPoint) {
+          map.removeOverlay(this.pickPoint);
+        }
+        console.log(point.lng + ',' + point.lat);
+        map.panTo(point);
+        map.centerAndZoom(point,6);
+        const p = new BMap.Point(point.lng, point.lat);
+        this.pickPoint = new BMap.Marker(p);
+        this.addressDetail(point);//根据经纬度获取省市信息
+      },
+      addressDetail(point){ //获取地理位置
+        let mydata = getSonRegionByCodes(1);
+        console.log(mydata);
+        var self = this;
+        var myGeo = new BMap.Geocoder();
+        myGeo.getLocation(new BMap.Point(point.lng, point.lat), function(result){
+          if (result){
+//根据当前位置经纬度解析成地址
+//            console.log(result.addressComponents);
+            mydata.map(function(item){
+              if(result.addressComponents.province.indexOf("北京") !=-1 || result.addressComponents.province.indexOf("重庆") !=-1
+                || result.addressComponents.province.indexOf("上海") !=-1 || result.addressComponents.province.indexOf("台湾") !=-1 || result.addressComponents.province.indexOf("天津") !=-1){
+                result.addressComponents.province=result.addressComponents.province.substring(0,2);
+              }
+              if(item.name.indexOf(result.addressComponents.province) !=-1){
+                self.$emit('headCallBack', item.agencyId);
+              }
+            });
+          }
+        });
+      },
+      addMarker(map) {
+        for (const item of this.pointList) {
+          const point = new BMap.Point(item.point.lng, item.point.lat);
+          const mk = new BMap.Marker(point);
+          const label = new BMap.Label(item.title);
+          label.setOffset(new BMap.Size(15, -15));
+          label.setStyle({
+            'border-radius': '5px',
+            border: '0px',
+            'background-color': '#FFFFFF11',
+            color: 'red',
+            'font-family': '黑体',
+            'font-weight': 'bold',
+            'font-size': '16px'
+          });
+          mk.setLabel(label);
+          map.addOverlay(mk);
+        }
+      },
+      geolocation(map) {
+        const geolocation = new BMap.Geolocation();
+        geolocation.enableSDKLocation();
+        geolocation.getCurrentPosition(function (r) {
+          if (this.getStatus() === BMAP_STATUS_SUCCESS) {
+            // const mk = new BMap.Marker(r.point);
+            // map.addOverlay(mk);
+            var b = new BMap.Bounds(new BMap.Point(116.027143, 39.772348),new BMap.Point(116.832025, 40.126349)); // 范围 左下角，右上角的点位置
+//            map.panTo(r.point);
+            map.centerAndZoom("兰州",4);
+            map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放
+            console.log('您的位置：' + r.point.lng + ',' + r.point.lat);
+          } else {
+            alert('failed' + this.getStatus());
+          }
+        });
+      }
+    }
+  }
+</script>
+
+<style scoped>
+  .map {
+    width: 100%;
+    height: 500px;
+  }
+</style>

src/views/baseInfo/companyInfo/index.vue

@@ -3,26 +3,27 @@
     <div class="header-css">
       <!--@click="$router.push({name:'mypoints'})"-->
       <!--<img @click="goBack()" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAfCAYAAADqUJ2JAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjU0OTNGQTA2QTEwNTExRTg4M0E3OUI4RkYwRDg3RUU4IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjU0OTNGQTA3QTEwNTExRTg4M0E3OUI4RkYwRDg3RUU4Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NTQ5M0ZBMDRBMTA1MTFFODgzQTc5QjhGRjBEODdFRTgiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NTQ5M0ZBMDVBMTA1MTFFODgzQTc5QjhGRjBEODdFRTgiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4bKBAsAAAAzklEQVR42qzWWQrCMBDG8VzCtVb01ZuIFJUq4nU8l+AlXEsFXz2CC+iXB2EYgjBL4P/6o4Qk0xD0q4G2aBSMyB590F2LNQkSe6OFFGmhA0PWUqSNjgxZWZEXWkqRDjpZkS46E+Sp2diIXAjyQKUUyRLIXIr0UMWQmQapGTKVInkCKaTIAF0ZMtEgN4aMNZdwR5DYRvskuH1RXEOPPfqtfgIrtFjucY5cTza9a5X1rv27uKUWc3mPXF9I+ma7YuYp4jrXXCet6+xP/o18BRgA2Nl6bmmSdvgAAAAASUVORK5CYII=" size="25" style="width: 15px; height: 20px; margin: 10px">-->
-      <span class="header-title">全国公司列表</span>
+      <span class="header-title">公司列表</span>
     </div>
     <div class="main-container">
       <div class="shoppings main-container">
         <div class="filter-container" ref="filter-container">
           <el-form :rules="rules4Query" ref="queryForm" style="display: flex;" :inline="inline" :model="listQuery">
-            <el-select class="filter-item" v-model="listQuery.addrProvince" placeholder="请选择省份（直辖市）" @change='getValue'>
-              <el-option :key="undefined" label="全国" :value="undefined"></el-option>
+            <el-select class="filter-item" style="width: 45%" v-model="listQuery.addrProvince" placeholder="请选择省份（直辖市）" @change='getValue'>
+              <el-option :key="undefined" label="全部" :value="undefined"></el-option>
               <el-option v-for="item in provinceRegions" :key="item.id" :label="item.name" :value="item.id"></el-option>
             </el-select>
-            <!--<el-select class="filter-item" v-model="listQuery.addrCity" placeholder="请选择城市"  @change='getCompanyList'>-->
-              <!--<el-option v-for="item in cityRegions4Query" :key="item.id" :label="item.name" :value="item.id"></el-option>-->
-            <!--</el-select>-->
+            <el-select class="filter-item" style="width: 45%;margin-left: 10px;" v-model="listQuery.addrCity" placeholder="请选择城市"  @change='getCompanyList'>
+              <el-option :key="undefined" label="全部" :value="undefined"></el-option>
+              <el-option v-for="item in cityRegions4Query" :key="item.id" :label="item.name" :value="item.id"></el-option>
+            </el-select>
           </el-form>
         </div>
       </div>
       <!--分公司分布图-->
-      <!--<company-map :toSonData="list"></company-map>-->
+      <company-map v-on:headCallBack="headCall"  v-if="toList" :toSonData="list" :provinceName="provinceName"></company-map>
       <!--地图-->
-      <china-map v-on:headCallBack="headCall" :list="list" :provinceName="provinceName"></china-map>
+      <!--<china-map v-on:headCallBack="headCall" :list="list" :provinceName="provinceName"></china-map>-->
       <!--分公司数据-->
       <div class="shoppings company-list"
            v-for="item in list"
@@ -76,6 +77,7 @@
     putObj
   } from 'api/base_info/branch_company';
   import chinaMap from './chinaMap';
+  import companyMap from "./companyMap";
 
   import {
     getSonRegionByCodes,
@@ -85,16 +87,18 @@
   import {mapGetters} from 'vuex';
   import BmMap from "../../../../node_modules/vue-baidu-map/components/map/Map.vue";
 
+
   export default {
     name: 'branchCompany',
     components: {
       BmMap,
-      chinaMap},
+      chinaMap,
+      companyMap},
     data() {
       return {
+        toList: false,
         nodata: false,
         nomore:false,
-        provinceName: "",
         form: {
           id: undefined,
           name: undefined,
@@ -224,6 +228,7 @@
           update: '编辑',
           create: '创建'
         },
+        provinceName: "",
         tableKey: 0,
         send: !1,//是否已发送请求
       }
@@ -269,33 +274,16 @@
     },
     methods: {
       getCompanyList(e){
+        let that = this;
+        this.provinceRegions.map(function(item){
+          if(item.id == that.listQuery.addrProvince){
+            that.provinceName = item.name;
+          }
+        });
         this.getList();
       },
       getValue(e){
-        if(!e){
-          //全国
-//          location.reload();
-//          this.provinceName = "china";
-          return;
-        }
-//        this.provinceName = e;
         this.listQuery.addrCity = undefined;
-        if(e){
-          console.log(this.provinceRegions);
-          let name = "";
-          this.provinceRegions.map(function(item){
-            if(e == item.id){
-              if(item.name.indexOf("黑龙江") !=-1 || item.name.indexOf("内蒙古") !=-1){
-                name = item.name.substring(0,3);
-              } else {
-                name = item.name.substring(0,2);
-              }
-            }
-          });
-          this.$router.push({path: '/provinceMap?provinceId='+e+"&provinceName="+name});
-        }
-
-//        this.getList();
       },
       headCall: function (msg) { //回调方法，接收子组件传的参数
         this.listQuery.addrProvince = msg;
@@ -354,6 +342,7 @@
               this.nomore = true;
             }
             this.send = !1;
+            this.toList = true;
           })
       },
       getAddrStr(branchCompany) {

src/views/baseInfo/stockCrowd/stockCrowd.vue

@@ -54,7 +54,7 @@
                       </div>
                       <div class="ft12">剩余:{{item.balance}}股</div>
                     </div>
-                    <div class="ft20">￥{{item.price}}/股</div>
+                    <div class="ft20">￥{{item.price}}w/股</div>
                   </div>
                 </div>
               </div>
@@ -134,7 +134,7 @@
         list: [],
         allStockPrice: null,
         listQuery: {
-          limit: 10,
+          limit: 5,
           priceStart: undefined,
           priceEnd: undefined,
           addrProvince: undefined,
@@ -153,7 +153,12 @@
         let that = this;
         getAllStockPrice()
           .then(response => {
-            that.allStockPrice = response.data;
+            let arr = [];
+            response.data.map(function(item){
+              item = item / 10000+"w";
+              arr.push(item);
+            });
+            that.allStockPrice = arr;
           });
 
       },
@@ -169,7 +174,8 @@
        * @param target
        */
       getStartValue() {
-        this.listQuery.priceEnd = this.listQuery.priceStart;
+        this.listQuery.priceEnd = this.listQuery.priceStart.substring(0,this.listQuery.priceStart.length-1)*10000;
+        this.listQuery.priceStart = this.listQuery.priceStart.substring(0,this.listQuery.priceStart.length-1)*10000;
         // if (this.listQuery.priceStart >= this.listQuery.priceEnd) {
         //   this.listQuery.priceEnd = undefined;
         // }
@@ -196,13 +202,14 @@
         this.busy = true;
         this.loading = true;
         let params = this.listQuery;
+//        this.listQuery.priceStart = this.listQuery.priceStart/10000+"w";
         params.page = this.page++;
-        stockSearchPage(this.listQuery)
+        stockSearchPage(params)
           .then(res => {
             this.loading = false;
             let allList = [];
             res.data.list.forEach(function (item) {
-              item.price = item.price / 1000 + ",000";
+              item.price = item.price / 10000;
               item.width = (item.total - item.balance) / item.total * 100 + "px";
               item.companyPic = "https://xxfcmgmt.upyuns.com/vehicle/branchCompany/stock/download/companyPic?realFileRelPath=" + item.companyPic;
               allList.push(item);