D-MAP/src/main.js

import Vue from "vue";
import App from "./App.vue";
import router from "./router/index";
import modules from "./store/index";
import VueSocketIO from "vue-socket.io";
import Vuex from 'vuex'
import vuescroll from 'vuescroll';


// 在这里设置全局配置
Vue.use(vuescroll, {
  ops: {
    mode: 'native',
    bar: {
      showDelay: 500,
      onlyShowBarOnScroll: true,//是否只有滚动的时候才显示滚动条
      keepShow: false,
      background: '#1AB063',
      opacity: 0.2,
      hoverStyle: false,
      specifyBorderRadius: false,
      minSize: false,
      size: '6px',
      disable: false,
    }
  }, // 在这里设置全局默认配置
  name: 'vueScroll' // 在这里自定义组件名字，默认是vueScroll
});

Vue.config.productionTip = false;

var strUrl=window.location.href;
var strIp = "";
if(strUrl.indexOf("172.16.50.4")!=-1)
{
  strIp = "172.16.50.4:19703";
}
else
{
  strIp = "47.102.97.214";
}

Vue.use(
  new VueSocketIO({
    debug: true,
    connection: "ws://" + strIp,
    //connection: "ws://121.42.8.157:19703",
    options: {
      transports: ["websocket", "polling"],
    },
  })
);
Vue.use(Vuex)
const store = new Vuex.Store(modules)
window.store = store;

window.vm = new Vue({
  /*
  @brief
    建立socket.io的监听事件
  @author
    zhuyf
  @date
    2022/05/10 14:10
   */
  el: '#app',
  created: function () {
    // console.log('created init home page')
    // init()
    
    
  },
  mounted: function () {
    console.log("mounted init home page");
    this.init();
  },
  data() {
    return {
      inited: false,
    };
  },
  methods: {
    init() {
      // console.log('created home page by init function' + this.name)
      this.initService();
    },
    initService() {
      if (this.inited === false) {
        this.inited = true;
        // 此函数内开启监听服务器端（gis-server）传的数据
        // 第一个参数是命令字，第二个参数是匿名回调函数，其中回调函数的参数是服务器端传的数据内容
        this.sockets.subscribe("login", (data) => {
          console.log("receive [login] msg from server: " + data);
        });
        this.sockets.subscribe("CALL", (data) => {
          // console.log('receive [CALL] msg from server: ' + data)
        });
      }
    },
  },
  sockets: {
    connecting() {
      console.log("正在连接");
    },
    disconnect() {
      console.log("Socket 断开");
    },
    connect_failed() {
      console.log("连接失败");
    },
    connected() {
      console.log("socket connected");
    },
    connect() {
      console.log("socket connect");
      var start = new Date().getTime();
      while (new Date().getTime() - start < 500) {
        // 使用continue 实现；
        continue;
      }
      // this.$socket.emit('login', `{"cmd": "login", "data": {"name": "COLLECTOR", "password": "666666"}}`)
      this.$socket.emit(
        "USER",
        {
          cmd: "login",
          data: {
            user_name: "zjs",
            user_pass: "123",
          },
        },
        (data) => {
          console.log("OK, got into login-callback");
          console.log(JSON.stringify(data));
        }
      );
      console.log(this);
      this.init();
    },

    device_state(data) {
      console.log(data);
    },
  },
  router,
  store,
  // store,
  render: (h) => h(App),
})

// window.vm.initService();

import ElementUI from "element-ui";
import "element-ui/lib/theme-chalk/index.css";
Vue.use(ElementUI);
import axios from "axios";
Vue.prototype.$axios = axios;