|
@@ -352,14 +352,18 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-tab-pane>
|
|
|
+ <el-tab-pane label="地图" name="fifth">
|
|
|
+ <div id="map" style="width:100%; height: 700px;"></div>
|
|
|
+ </el-tab-pane>
|
|
|
<!-- <el-tab-pane label="会务数据统计" name="third">会务数据统计</el-tab-pane> -->
|
|
|
|
|
|
- <!-- <el-tab-pane label="定时任务补偿" name="fourth">定时任务补偿</el-tab-pane> -->
|
|
|
+
|
|
|
</el-tabs>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
+import { getToken } from 'mapkit-token';
|
|
|
import * as echarts from 'echarts';
|
|
|
export default {
|
|
|
data () {
|
|
@@ -438,6 +442,8 @@ export default {
|
|
|
fourthPagesize:10,
|
|
|
fourthtotal:0,
|
|
|
input:'',
|
|
|
+ map:null,
|
|
|
+ //
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
@@ -484,6 +490,9 @@ export default {
|
|
|
this.input='';
|
|
|
this.StatisticsGroupCost()
|
|
|
}
|
|
|
+ if (this.activeName=='fifth') {
|
|
|
+ this.getonline();
|
|
|
+ }
|
|
|
// console.log(tab, event);
|
|
|
},
|
|
|
//处理时间
|
|
@@ -589,6 +598,58 @@ export default {
|
|
|
series: [{ type: 'bar' }]
|
|
|
},true);
|
|
|
},
|
|
|
+ //在线引入
|
|
|
+ getonline(){
|
|
|
+ // const oScript = document.createElement('script');
|
|
|
+ // oScript.type = 'text/javascript';
|
|
|
+ // oScript.src = 'https://cdn.apple-mapkit.com/mk/5.x.x/mapkit.core.js';
|
|
|
+ // document.body.appendChild(oScript);
|
|
|
+ this.onlinemap();
|
|
|
+ },
|
|
|
+ //在线地图
|
|
|
+ onlinemap(){
|
|
|
+ // var token="eyJraWQiOiI1NEIyRkFLODMzIiwidHlwIjoiSldUIiwiYWxnIjoiRVMyNTYifQ.eyJpc3MiOiJIS0YzNzJKU01LIiwiaWF0IjoxNzMzMTkxMzI2LCJvcmlnaW4iOiJvYS5wYW4tYW1lcmljYW4taW50bC5jb20ifQ.1czYQb-Nxh6n4kG9sVylQH32XawN92gBKXjn6i_SU0F2M9fpwbStM-gDRvfANEiEUDz5ogUmm_FQf9eBF8o9Zg";
|
|
|
+ // mapkit.init({
|
|
|
+ // authorization: token, // 使用获取到的token
|
|
|
+ // language: 'zh'
|
|
|
+ // });
|
|
|
+ // this.map = new mapkit.Map(document.getElementById('map'), {
|
|
|
+ // center: new mapkit.Coordinate(37.7749, -122.4194),
|
|
|
+ // zoom: 11
|
|
|
+ // });
|
|
|
+ // const token = mapkitToken.getToken(CLIENT_ID, TEAM_ID, KEY_ID, PRIVATE_KEY);
|
|
|
+ // const { getToken } = require('mapkit-token');
|
|
|
+ const token = "eyJraWQiOiI1NEIyRkFLODMzIiwidHlwIjoiSldUIiwiYWxnIjoiRVMyNTYifQ.eyJpc3MiOiJIS0YzNzJKU01LIiwiaWF0IjoxNzMzMTkxMzI2LCJvcmlnaW4iOiJvYS5wYW4tYW1lcmljYW4taW50bC5jb20ifQ.1czYQb-Nxh6n4kG9sVylQH32XawN92gBKXjn6i_SU0F2M9fpwbStM-gDRvfANEiEUDz5ogUmm_FQf9eBF8o9Zg";
|
|
|
+ mapkit.init({
|
|
|
+ language: 'zh-Hans',
|
|
|
+ authorizationCallback: function(done) {
|
|
|
+ done(token);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ // var map = new mapkit.Map('map', { center: new mapkit.Coordinate(104.096488, 30.635261) });
|
|
|
+ // const coordinate = new mapkit.Coordinate(104.096488, 30.635261)
|
|
|
+ // const map = new mapkit.Map("map", {
|
|
|
+ // center: coordinate,
|
|
|
+ // countryCode: "CN",
|
|
|
+ // isZoomEnabled:true,
|
|
|
+ // })
|
|
|
+ let map = new mapkit.Map("map", {
|
|
|
+ center: new mapkit.Coordinate(104.096488, 30.635261),
|
|
|
+ showsMapTypeControl: true,
|
|
|
+ showsZoomControl: true,
|
|
|
+ showsUserLocation: true,
|
|
|
+ zoomEnabled: true,
|
|
|
+ region: new mapkit.CoordinateRegion(
|
|
|
+ new mapkit.Coordinate(104.096488, 30.635261),
|
|
|
+ new mapkit.CoordinateSpan(0.01, 0.01)
|
|
|
+ )
|
|
|
+ });
|
|
|
+ let overlay = new mapkit.MapOverlay(map.region, {
|
|
|
+ urlTemplate: "https://example.com/overlay/{x}/{y}/{z}.png"
|
|
|
+ });
|
|
|
+ map.addOverlay(overlay);
|
|
|
+
|
|
|
+ },
|
|
|
//团组酒店
|
|
|
grouphotel(){
|
|
|
var hoteltopten = echarts.init(document.getElementById('hoteltopten'));
|
|
@@ -667,7 +728,12 @@ export default {
|
|
|
dataset: {
|
|
|
source: this.invitationtop
|
|
|
},
|
|
|
- xAxis: { type: 'category' },
|
|
|
+ xAxis: {
|
|
|
+ type: 'category',
|
|
|
+ axisLabel:{
|
|
|
+ rotate:30
|
|
|
+ },
|
|
|
+ },
|
|
|
yAxis: {
|
|
|
name: '数量',
|
|
|
},
|
|
@@ -692,7 +758,12 @@ export default {
|
|
|
dataset: {
|
|
|
source: this.teamCooperation
|
|
|
},
|
|
|
- xAxis: { type: 'category' },
|
|
|
+ xAxis: {
|
|
|
+ type: 'category',
|
|
|
+ axisLabel:{
|
|
|
+ rotate:25
|
|
|
+ },
|
|
|
+ },
|
|
|
yAxis: {
|
|
|
name: '次数',
|
|
|
},
|
|
@@ -868,6 +939,9 @@ export default {
|
|
|
this.input='';
|
|
|
this.StatisticsGroupCost()
|
|
|
}
|
|
|
+ if (this.activeName=='fifth') {
|
|
|
+ this.getonline();
|
|
|
+ }
|
|
|
// this.businessincome=[];
|
|
|
// this.Grossprofit=[];
|
|
|
// this.costing=[];
|
|
@@ -1051,7 +1125,7 @@ export default {
|
|
|
}).then(function (res) {
|
|
|
if(res.data.code==200){
|
|
|
that.invitationtop=[];
|
|
|
- let datainfo=res.data.data;
|
|
|
+ let datainfo=res.data.data.groupByCountry;
|
|
|
that.invitationtop.push(['product','商邀邀请国家数量']);
|
|
|
for(let i=0;i<datainfo.length;i++){
|
|
|
that.invitationtop.push([datainfo[i].country,datainfo[i].timeNum]);
|