(下班)

add
2024-06-01 17:33:03 +08:00 · 2024-04-09 17:52:37 +08:00 · 2024-04-09 16:06:56 +08:00 · 2024-02-29 09:24:40 +08:00 · 2024-02-28 15:42:37 +08:00 · 2024-02-24 17:29:02 +08:00
54 changed files with 2923 additions and 2428 deletions
--- a/index.html
+++ b/index.html
@ -2,9 +2,9 @@
 <html lang="en">
  <head>
    <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <link rel="icon" type="image/svg+xml" href="/logo.png" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Vite + Vue</title>
+    <title>数据之眼可视化大屏</title>
  </head>
  <body>
    <div id="app"></div>
@ -13,3 +13,11 @@
 </html>
 <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=b0c21bc6b220aa882bad8ffb6bce8829"></script>

+
+
+
+<script>
+
+
+</script>
+
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -13,9 +13,10 @@
    "@jiaminghi/data-view": "^2.10.0",
    "@vuepic/vue-datepicker": "^7.4.0",
    "amfe-flexible": "^2.2.1",
-    "axios": "^1.6.2",
+    "axios": "^1.6.5",
    "echarts": "^5.4.3",
    "element-plus": "^2.4.4",
+    "mitt": "^3.0.1",
    "pinia": "^2.1.7",
    "postcss-pxtorem": "^5.1.1",
    "vue": "^3.3.8",
--- a/public/index/CS.png
+++ b/public/index/CS.png
--- a/public/index/CY.png
+++ b/public/index/CY.png
--- a/public/index/CZ.png
+++ b/public/index/CZ.png
--- a/public/index/CZXF.png
+++ b/public/index/CZXF.png
--- a/public/index/DD.png
+++ b/public/index/DD.png
--- a/public/index/JE.png
+++ b/public/index/JE.png
--- a/public/index/PHBBG.png
+++ b/public/index/PHBBG.png
--- a/public/index/PM1.png
+++ b/public/index/PM1.png
--- a/public/index/PM2.png
+++ b/public/index/PM2.png
--- a/public/index/PM3.png
+++ b/public/index/PM3.png
--- a/public/index/PM4.png
+++ b/public/index/PM4.png
--- a/public/index/PT.png
+++ b/public/index/PT.png
--- a/public/index/PT1.png
+++ b/public/index/PT1.png
--- a/public/index/WX.png
+++ b/public/index/WX.png
--- a/public/index/XZ.png
+++ b/public/index/XZ.png
--- a/public/index/YC.png
+++ b/public/index/YC.png
--- a/public/index/YE.png
+++ b/public/index/YE.png
--- a/public/index/YH.png
+++ b/public/index/YH.png
--- a/public/index/YJ.png
+++ b/public/index/YJ.png
--- a/public/index/ZFB.png
+++ b/public/index/ZFB.png
--- a/public/index/ZY.png
+++ b/public/index/ZY.png
--- a/public/logo.png
+++ b/public/logo.png
--- a/src/App.vue
+++ b/src/App.vue
@ -1,32 +1,84 @@
 <script setup lang="ts">
 import { areaObj } from "@/store/index.js"
+import { globalEventBus } from '@/common/eventBus'
+import { Push } from '@/common/push'
+
+// 获取 URL 中的查询参数部分
+var queryString = window.location.hash.split("?")[1];
+// 解析查询参数字符串
+const searchParamsType = new URLSearchParams(queryString);
+// 读取名为 id 的参数
+const type = searchParamsType.get('type') || '';
+if (type) { localStorage.setItem("TRADE_TYPE", true) }
+else {
+  localStorage.setItem("TRADE_TYPE", false)
+}
+const isMainScreen = Boolean(type)
+console.log(isMainScreen, 'isMainScreen')
+
+
+const openPush = (uid = 10) => {
+  if (isMainScreen) return
+
+  var connection = new Push({
+    url: 'wss://chat.lihaink.cn/tts', // websocket地址
+    app_key: 'aaea61749929eb53a4bd75a1474c1d27',
+  });
+  // 浏览器监听user-2频道的消息，也就是用户uid为1的用户消息
+  var user_channel = connection.subscribe( uid==10?'user-' + uid:uid+'user-trad');
+  // var user_channel = connection.subscribe( 'a'+'user-trad');
+  // 当user-2频道有message事件的消息时
+  user_channel.on('message', function (data) {
+    console.log("收到事件",data)
+    globalEventBus.emit(data.content.event, data.content.data)
+
+  });
+  // 断线事件
+  user_channel.on('close', function () {
+
+  });
+}
+
 const areaStroe = areaObj()
-
-
-
+let res = {
+  "status": 200,
+  "message": "success",
+  "data": {
+    "user": {
+      "id": 1,
+      "account_type": 1,
+      "area_code": "510521",
+      "street_code": null,
+      "account": "泸县",
+      "password": "ec2dff05d20472c43afbd8329c80d59a"
+    },
+    "token": "0f040d372e39938f1a4d2964506a87c5",
+    "expire": 999999999999999999999999999999999,
+    role: 2
+  }
+}
+res.data.role = 2
+localStorage.setItem("TRADE_USER", JSON.stringify(res.data))
+let { area_code, street_code } = res.data.user
+areaStroe.changeArea({ areaCode: area_code, streetCode: street_code })

 if (localStorage.getItem("TRADE_USER")) {
  let userInfo = JSON.parse(localStorage.getItem('TRADE_USER'))
  areaStroe.changeUserInfo(userInfo)
  let { area_code, street_code } = userInfo.user
  areaStroe.changeArea({ areaCode: area_code, streetCode: street_code })
-
 }



+// 获取 URL 中的查询参数部分
+var queryString = window.location.hash.split("?")[1];
+// 解析查询参数字符串
+const searchParams = new URLSearchParams(queryString);

-
-
-
-
-
-
-
-
-
-
-
+// 读取名为 id 的参数
+const id = searchParams.get('local') || '';
+id ? openPush(id) : openPush()
 </script>
 <template>
  <div class="main-box">
--- a/src/api.js
+++ b/src/api.js
@ -3,7 +3,7 @@ import axios from "axios";
 import { ElMessage } from 'element-plus'
 import router from "./router";

-let expire = localStorage.getItem("TRADE_USER") ? JSON.parse(localStorage.getItem("TRADE_USER")).expire : {}
+// let expire = localStorage.getItem("TRADE_USER") ? JSON.parse(localStorage.getItem("TRADE_USER")).expire : {}


 // 创建axios 实例
@ -11,27 +11,26 @@ const instacne = axios.create({
    baseURL: "https://shop.lihaink.cn/",
    timeout: 30000,
 });
+const instacneSend = axios.create({
+    baseURL: "http://chat.lihaink.cn/index/",
+    timeout: 30000,
+});

 // 请求拦截
 instacne.interceptors.request.use(
    (config) => {
        // 在发送请求之前做什么
-        let timestamp = Math.floor(new Date().getTime() / 1000);
-
-        if (expire) {
-
-            if (timestamp > expire) {
-                ElMessage({
-                    message: "登录过期，请重新登录",
-                    type: 'warning',
-                })
-
-                localStorage.removeItem('TRADE_USER')
-                router.replace('/login')
-
-            }
-
-        }
+        // let timestamp = Math.floor(new Date().getTime() / 1000);
+        // if (expire) {
+        //     if (timestamp > expire) {
+        //         ElMessage({
+        //             message: "登录过期，请重新登录",
+        //             type: 'warning',
+        //         })
+        //         localStorage.removeItem('TRADE_USER')
+        //         router.replace('/login')
+        //     }
+        // }

        return config;
    },
@ -61,7 +60,9 @@ instacne.interceptors.response.use(
 );


-
+export function sendMsg(params) {
+    return instacneSend.get('/dataviewTouchPush', { params })
+}

 export function getUserNumApi(params) {
    return instacne.get('/api/dataview/user_merchat_count', { params })
--- a/src/common/EventBus.js
+++ b/src/common/EventBus.js
@ -0,0 +1,2 @@
+import mitt from 'mitt'
+export const globalEventBus =  mitt()
--- a/src/common/push.js
+++ b/src/common/push.js
@ -0,0 +1,751 @@
+
+
+export const Push = function Push(options) {
+    this.doNotConnect = 0;
+    options = options || {};
+    options.heartbeat  = options.heartbeat || 25000;
+    options.pingTimeout = options.pingTimeout || 10000;
+    this.config = options;
+    this.uid = 0;
+    this.channels = {};
+    this.connection = null;
+    this.pingTimeoutTimer = 0;
+    Push.instances.push(this);
+    this.createConnection();
+}
+
+Push.prototype.checkoutPing = function() {
+    var _this = this;
+    _this.checkoutPingTimer && clearTimeout(_this.checkoutPingTimer);
+    _this.checkoutPingTimer = setTimeout(function () {
+        _this.checkoutPingTimer = 0;
+        if (_this.connection.state === 'connected') {
+            _this.connection.send('{"event":"pusher:ping","data":{}}');
+            if (_this.pingTimeoutTimer) {
+                clearTimeout(_this.pingTimeoutTimer);
+                _this.pingTimeoutTimer = 0;
+            }
+            _this.pingTimeoutTimer = setTimeout(function () {
+                _this.connection.closeAndClean();
+                if (!_this.connection.doNotConnect) {
+                    _this.connection.waitReconnect();
+                }
+            }, _this.config.pingTimeout);
+        }
+    }, this.config.heartbeat);
+};
+
+Push.prototype.channel = function (name) {
+    return this.channels.find(name);
+};
+Push.prototype.allChannels = function () {
+    return this.channels.all();
+};
+Push.prototype.createConnection = function () {
+    if (this.connection) {
+        throw Error('Connection already exist');
+    }
+    var _this = this;
+    var url = this.config.url;
+    function updateSubscribed () {
+        for (var i in _this.channels) {
+            _this.channels[i].subscribed = false;
+        }
+    }
+    this.connection = new Connection({
+        url: url,
+        app_key: this.config.app_key,
+        onOpen: function () {
+            _this.connection.state  ='connecting';
+            _this.checkoutPing();
+        },
+        onMessage: function(params) {
+            if(_this.pingTimeoutTimer) {
+                clearTimeout(_this.pingTimeoutTimer);
+                _this.pingTimeoutTimer = 0;
+            }
+
+            params = JSON.parse(params.data);
+            var event = params.event;
+            var channel_name = params.channel;
+
+            if (event === 'pusher:pong') {
+                _this.checkoutPing();
+                return;
+            }
+            if (event === 'pusher:error') {
+                throw Error(params.data.message);
+            }
+            var data = JSON.parse(params.data), channel;
+            if (event === 'pusher_internal:subscription_succeeded') {
+                channel = _this.channels[channel_name];
+                channel.subscribed = true;
+                channel.processQueue();
+                channel.emit('pusher:subscription_succeeded');
+                return;
+            }
+            if (event === 'pusher:connection_established') {
+                _this.connection.socket_id = data.socket_id;
+                _this.connection.updateNetworkState('connected');
+                _this.subscribeAll();
+            }
+            if (event.indexOf('pusher_internal') !== -1) {
+                console.log("Event '"+event+"' not implement");
+                return;
+            }
+            channel = _this.channels[channel_name];
+            if (channel) {
+                channel.emit(event, data);
+            }
+        },
+        onClose: function () {
+            updateSubscribed();
+        },
+        onError: function () {
+            updateSubscribed();
+        }
+    });
+};
+Push.prototype.disconnect = function () {
+    this.connection.doNotConnect = 1;
+    this.connection.close();
+};
+
+Push.prototype.subscribeAll = function () {
+    if (this.connection.state !== 'connected') {
+        return;
+    }
+    for (var channel_name in this.channels) {
+        //this.connection.send(JSON.stringify({event:"pusher:subscribe", data:{channel:channel_name}}));
+        this.channels[channel_name].processSubscribe();
+    }
+};
+
+Push.prototype.unsubscribe = function (channel_name) {
+    if (this.channels[channel_name]) {
+        delete this.channels[channel_name];
+        if (this.connection.state === 'connected') {
+            this.connection.send(JSON.stringify({event:"pusher:unsubscribe", data:{channel:channel_name}}));
+        }
+    }
+};
+Push.prototype.unsubscribeAll = function () {
+    var channels = Object.keys(this.channels);
+    if (channels.length) {
+        if (this.connection.state === 'connected') {
+            for (var channel_name in this.channels) {
+                this.unsubscribe(channel_name);
+            }
+        }
+    }
+    this.channels = {};
+};
+Push.prototype.subscribe = function (channel_name) {
+    if (this.channels[channel_name]) {
+        return this.channels[channel_name];
+    }
+    if (channel_name.indexOf('private-') === 0) {
+        return createPrivateChannel(channel_name, this);
+    }
+    if (channel_name.indexOf('presence-') === 0) {
+        return createPresenceChannel(channel_name, this);
+    }
+    return createChannel(channel_name, this);
+};
+Push.instances = [];
+
+function createChannel(channel_name, push)
+{
+    var channel = new Channel(push.connection, channel_name);
+    push.channels[channel_name] = channel;
+    channel.subscribeCb = function () {
+        push.connection.send(JSON.stringify({event:"pusher:subscribe", data:{channel:channel_name}}));
+    }
+    channel.processSubscribe();
+    return channel;
+}
+
+function createPrivateChannel(channel_name, push)
+{
+    var channel = new Channel(push.connection, channel_name);
+    push.channels[channel_name] = channel;
+    channel.subscribeCb = function () {
+        __ajax({
+            url: push.config.auth,
+            type: 'POST',
+            data: {channel_name: channel_name, socket_id: push.connection.socket_id},
+            success: function (data) {
+                data = JSON.parse(data);
+                data.channel = channel_name;
+                push.connection.send(JSON.stringify({event:"pusher:subscribe", data:data}));
+            },
+            error: function (e) {
+                throw Error(e);
+            }
+        });
+    };
+    channel.processSubscribe();
+    return channel;
+}
+
+function createPresenceChannel(channel_name, push)
+{
+    return createPrivateChannel(channel_name, push);
+}
+
+/*window.addEventListener('online',  function(){
+    var con;
+    for (var i in Push.instances) {
+        con = Push.instances[i].connection;
+        con.reconnectInterval = 1;
+        if (con.state === 'connecting') {
+            con.connect();
+        }
+    }
+});*/
+
+
+function Connection(options) {
+    this.dispatcher = new Dispatcher();
+    __extends(this, this.dispatcher);
+    var properies = ['on', 'off', 'emit'];
+    for (var i in properies) {
+        this[properies[i]] = this.dispatcher[properies[i]];
+    }
+    this.options = options;
+    this.state = 'initialized'; //initialized connecting connected disconnected
+    this.doNotConnect = 0;
+    this.reconnectInterval = 1;
+    this.connection = null;
+    this.reconnectTimer = 0;
+    this.connect();
+}
+
+Connection.prototype.updateNetworkState = function(state){
+    var old_state = this.state;
+    this.state = state;
+    if (old_state !== state) {
+        this.emit('state_change', { previous: old_state, current: state });
+    }
+};
+
+Connection.prototype.connect = function () {
+    this.doNotConnect = 0;
+    if (this.state === 'connected') {
+        console.log('networkState is "' + this.state + '" and do not need connect');
+        return;
+    }
+    if (this.reconnectTimer) {
+        clearTimeout(this.reconnectTimer);
+        this.reconnectTimer = 0;
+    }
+
+    this.closeAndClean();
+
+    var options = this.options;
+    var websocket = new WebSocket(options.url+'/app/'+options.app_key);
+
+    this.updateNetworkState('connecting');
+
+    var _this = this;
+    websocket.onopen = function (res) {
+        _this.reconnectInterval = 1;
+        if (_this.doNotConnect) {
+            _this.updateNetworkState('disconnected');
+            websocket.close();
+            return;
+        }
+        if (options.onOpen) {
+            options.onOpen(res);
+        }
+    };
+
+    if (options.onMessage) {
+        websocket.onmessage = options.onMessage;
+    }
+
+    websocket.onclose = function (res) {
+        websocket.onmessage = websocket.onopen = websocket.onclose = websocket.onerror = null;
+        _this.updateNetworkState('disconnected');
+        if (!_this.doNotConnect) {
+            _this.waitReconnect();
+        }
+        if (options.onClose) {
+            options.onClose(res);
+        }
+    };
+
+    websocket.onerror = function (res) {
+        _this.close();
+        if (!_this.doNotConnect) {
+            _this.waitReconnect();
+        }
+        if (options.onError) {
+            options.onError(res);
+        }
+    };
+    this.connection = websocket;
+}
+
+Connection.prototype.closeAndClean = function () {
+    if(this.connection) {
+        var websocket = this.connection;
+        websocket.onmessage = websocket.onopen = websocket.onclose = websocket.onerror = null;
+        try {
+            websocket.close();
+        } catch (e) {}
+        this.updateNetworkState('disconnected');
+    }
+};
+
+Connection.prototype.waitReconnect = function () {
+    if (this.state === 'connected' || this.state === 'connecting') {
+        return;
+    }
+    if (!this.doNotConnect) {
+        this.updateNetworkState('connecting');
+        var _this = this;
+        if (this.reconnectTimer) {
+            clearTimeout(this.reconnectTimer);
+        }
+        this.reconnectTimer = setTimeout(function(){
+            _this.connect();
+        }, this.reconnectInterval);
+        if (this.reconnectInterval < 1000) {
+            this.reconnectInterval = 1000;
+        } else {
+            // 每次重连间隔增大一倍
+            this.reconnectInterval = this.reconnectInterval * 2;
+        }
+        // 有网络的状态下，重连间隔最大2秒
+        if (this.reconnectInterval > 2000 && navigator.onLine) {
+            _this.reconnectInterval = 2000;
+        }
+    }
+}
+
+Connection.prototype.send = function(data) {
+    if (this.state !== 'connected') {
+        console.trace('networkState is "' + this.state + '", can not send ' + data);
+        return;
+    }
+    this.connection.send(data);
+}
+
+Connection.prototype.close = function(){
+    this.updateNetworkState('disconnected');
+    this.connection.close();
+}
+
+var __extends = (this && this.__extends) || function (d, b) {
+    for (var p in b) if (b.hasOwnProperty(p)) {d[p] = b[p];}
+    function __() { this.constructor = d; }
+    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+};
+
+function Channel(connection, channel_name) {
+    this.subscribed = false;
+    this.dispatcher = new Dispatcher();
+    this.connection = connection;
+    this.channelName = channel_name;
+    this.subscribeCb = null;
+    this.queue = [];
+    __extends(this, this.dispatcher);
+    var properies = ['on', 'off', 'emit'];
+    for (var i in properies) {
+        this[properies[i]] = this.dispatcher[properies[i]];
+    }
+}
+
+Channel.prototype.processSubscribe = function () {
+    if (this.connection.state !== 'connected') {
+        return;
+    }
+    this.subscribeCb();
+};
+
+Channel.prototype.processQueue = function () {
+    if (this.connection.state !== 'connected' || !this.subscribed) {
+        return;
+    }
+    for (var i in this.queue) {
+        this.queue[i]();
+    }
+    this.queue = [];
+};
+
+Channel.prototype.trigger = function (event, data) {
+    if (event.indexOf('client-') !== 0) {
+        throw new Error("Event '" + event + "' should start with 'client-'");
+    }
+    var _this = this;
+    this.queue.push(function () {
+        _this.connection.send(JSON.stringify({ event: event, data: data, channel: _this.channelName }));
+    });
+    this.processQueue();
+};
+
+////////////////
+var Collections = (function () {
+    var exports = {};
+    function extend(target) {
+        var sources = [];
+        for (var _i = 1; _i < arguments.length; _i++) {
+            sources[_i - 1] = arguments[_i];
+        }
+        for (var i = 0; i < sources.length; i++) {
+            var extensions = sources[i];
+            for (var property in extensions) {
+                if (extensions[property] && extensions[property].constructor &&
+                    extensions[property].constructor === Object) {
+                    target[property] = extend(target[property] || {}, extensions[property]);
+                }
+                else {
+                    target[property] = extensions[property];
+                }
+            }
+        }
+        return target;
+    }
+
+    exports.extend = extend;
+    function stringify() {
+        var m = ["Push"];
+        for (var i = 0; i < arguments.length; i++) {
+            if (typeof arguments[i] === "string") {
+                m.push(arguments[i]);
+            }
+            else {
+                m.push(safeJSONStringify(arguments[i]));
+            }
+        }
+        return m.join(" : ");
+    }
+
+    exports.stringify = stringify;
+    function arrayIndexOf(array, item) {
+        var nativeIndexOf = Array.prototype.indexOf;
+        if (array === null) {
+            return -1;
+        }
+        if (nativeIndexOf && array.indexOf === nativeIndexOf) {
+            return array.indexOf(item);
+        }
+        for (var i = 0, l = array.length; i < l; i++) {
+            if (array[i] === item) {
+                return i;
+            }
+        }
+        return -1;
+    }
+
+    exports.arrayIndexOf = arrayIndexOf;
+    function objectApply(object, f) {
+        for (var key in object) {
+            if (Object.prototype.hasOwnProperty.call(object, key)) {
+                f(object[key], key, object);
+            }
+        }
+    }
+
+    exports.objectApply = objectApply;
+    function keys(object) {
+        var keys = [];
+        objectApply(object, function (_, key) {
+            keys.push(key);
+        });
+        return keys;
+    }
+
+    exports.keys = keys;
+    function values(object) {
+        var values = [];
+        objectApply(object, function (value) {
+            values.push(value);
+        });
+        return values;
+    }
+
+    exports.values = values;
+    function apply(array, f, context) {
+        for (var i = 0; i < array.length; i++) {
+            f.call(context || (window), array[i], i, array);
+        }
+    }
+
+    exports.apply = apply;
+    function map(array, f) {
+        var result = [];
+        for (var i = 0; i < array.length; i++) {
+            result.push(f(array[i], i, array, result));
+        }
+        return result;
+    }
+
+    exports.map = map;
+    function mapObject(object, f) {
+        var result = {};
+        objectApply(object, function (value, key) {
+            result[key] = f(value);
+        });
+        return result;
+    }
+
+    exports.mapObject = mapObject;
+    function filter(array, test) {
+        test = test || function (value) {
+            return !!value;
+        };
+        var result = [];
+        for (var i = 0; i < array.length; i++) {
+            if (test(array[i], i, array, result)) {
+                result.push(array[i]);
+            }
+        }
+        return result;
+    }
+
+    exports.filter = filter;
+    function filterObject(object, test) {
+        var result = {};
+        objectApply(object, function (value, key) {
+            if ((test && test(value, key, object, result)) || Boolean(value)) {
+                result[key] = value;
+            }
+        });
+        return result;
+    }
+
+    exports.filterObject = filterObject;
+    function flatten(object) {
+        var result = [];
+        objectApply(object, function (value, key) {
+            result.push([key, value]);
+        });
+        return result;
+    }
+
+    exports.flatten = flatten;
+    function any(array, test) {
+        for (var i = 0; i < array.length; i++) {
+            if (test(array[i], i, array)) {
+                return true;
+            }
+        }
+        return false;
+    }
+
+    exports.any = any;
+    function all(array, test) {
+        for (var i = 0; i < array.length; i++) {
+            if (!test(array[i], i, array)) {
+                return false;
+            }
+        }
+        return true;
+    }
+
+    exports.all = all;
+    function encodeParamsObject(data) {
+        return mapObject(data, function (value) {
+            if (typeof value === "object") {
+                value = safeJSONStringify(value);
+            }
+            return encodeURIComponent(base64_1["default"](value.toString()));
+        });
+    }
+
+    exports.encodeParamsObject = encodeParamsObject;
+    function buildQueryString(data) {
+        var params = filterObject(data, function (value) {
+            return value !== undefined;
+        });
+        return map(flatten(encodeParamsObject(params)), util_1["default"].method("join", "=")).join("&");
+    }
+
+    exports.buildQueryString = buildQueryString;
+    function decycleObject(object) {
+        var objects = [], paths = [];
+        return (function derez(value, path) {
+            var i, name, nu;
+            switch (typeof value) {
+                case 'object':
+                    if (!value) {
+                        return null;
+                    }
+                    for (i = 0; i < objects.length; i += 1) {
+                        if (objects[i] === value) {
+                            return {$ref: paths[i]};
+                        }
+                    }
+                    objects.push(value);
+                    paths.push(path);
+                    if (Object.prototype.toString.apply(value) === '[object Array]') {
+                        nu = [];
+                        for (i = 0; i < value.length; i += 1) {
+                            nu[i] = derez(value[i], path + '[' + i + ']');
+                        }
+                    }
+                    else {
+                        nu = {};
+                        for (name in value) {
+                            if (Object.prototype.hasOwnProperty.call(value, name)) {
+                                nu[name] = derez(value[name], path + '[' + JSON.stringify(name) + ']');
+                            }
+                        }
+                    }
+                    return nu;
+                case 'number':
+                case 'string':
+                case 'boolean':
+                    return value;
+            }
+        }(object, '$'));
+    }
+
+    exports.decycleObject = decycleObject;
+    function safeJSONStringify(source) {
+        try {
+            return JSON.stringify(source);
+        }
+        catch (e) {
+            return JSON.stringify(decycleObject(source));
+        }
+    }
+
+    exports.safeJSONStringify = safeJSONStringify;
+    return exports;
+})();
+
+var Dispatcher = (function () {
+    function Dispatcher(failThrough) {
+        this.callbacks = new CallbackRegistry();
+        this.global_callbacks = [];
+        this.failThrough = failThrough;
+    }
+    Dispatcher.prototype.on = function (eventName, callback, context) {
+        this.callbacks.add(eventName, callback, context);
+        return this;
+    };
+    Dispatcher.prototype.on_global = function (callback) {
+        this.global_callbacks.push(callback);
+        return this;
+    };
+    Dispatcher.prototype.off = function (eventName, callback, context) {
+        this.callbacks.remove(eventName, callback, context);
+        return this;
+    };
+    Dispatcher.prototype.emit = function (eventName, data) {
+        var i;
+        for (i = 0; i < this.global_callbacks.length; i++) {
+            this.global_callbacks[i](eventName, data);
+        }
+        var callbacks = this.callbacks.get(eventName);
+        if (callbacks && callbacks.length > 0) {
+            for (i = 0; i < callbacks.length; i++) {
+                callbacks[i].fn.call(callbacks[i].context || (window), data);
+            }
+        }
+        else if (this.failThrough) {
+            this.failThrough(eventName, data);
+        }
+        return this;
+    };
+    return Dispatcher;
+}());
+
+var CallbackRegistry = (function () {
+    function CallbackRegistry() {
+        this._callbacks = {};
+    }
+    CallbackRegistry.prototype.get = function (name) {
+        return this._callbacks[prefix(name)];
+    };
+    CallbackRegistry.prototype.add = function (name, callback, context) {
+        var prefixedEventName = prefix(name);
+        this._callbacks[prefixedEventName] = this._callbacks[prefixedEventName] || [];
+        this._callbacks[prefixedEventName].push({
+            fn: callback,
+            context: context
+        });
+    };
+    CallbackRegistry.prototype.remove = function (name, callback, context) {
+        if (!name && !callback && !context) {
+            this._callbacks = {};
+            return;
+        }
+        var names = name ? [prefix(name)] : Collections.keys(this._callbacks);
+        if (callback || context) {
+            this.removeCallback(names, callback, context);
+        }
+        else {
+            this.removeAllCallbacks(names);
+        }
+    };
+    CallbackRegistry.prototype.removeCallback = function (names, callback, context) {
+        Collections.apply(names, function (name) {
+            this._callbacks[name] = Collections.filter(this._callbacks[name] || [], function (oning) {
+                return (callback && callback !== oning.fn) ||
+                    (context && context !== oning.context);
+            });
+            if (this._callbacks[name].length === 0) {
+                delete this._callbacks[name];
+            }
+        }, this);
+    };
+    CallbackRegistry.prototype.removeAllCallbacks = function (names) {
+        Collections.apply(names, function (name) {
+            delete this._callbacks[name];
+        }, this);
+    };
+    return CallbackRegistry;
+}());
+function prefix(name) {
+    return "_" + name;
+}
+
+function __ajax(options){
+    options=options||{};
+    options.type=(options.type||'GET').toUpperCase();
+    options.dataType=options.dataType||'json';
+    params=formatParams(options.data);
+
+    var xhr;
+    if(window.XMLHttpRequest){
+        xhr=new XMLHttpRequest();
+    }else{
+        xhr=ActiveXObject('Microsoft.XMLHTTP');
+    }
+
+    xhr.onreadystatechange=function(){
+        if(xhr.readyState === 4){
+            var status=xhr.status;
+            if(status>=200 && status<300){
+                options.success&&options.success(xhr.responseText,xhr.responseXML);
+            }else{
+                options.error&&options.error(status);
+            }
+        }
+    }
+
+    if(options.type==='GET'){
+        xhr.open('GET',options.url+'?'+params,true);
+        xhr.send(null);
+    }else if(options.type==='POST'){
+        xhr.open('POST',options.url,true);
+        xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
+        xhr.send(params);
+    }
+}
+
+function formatParams(data){
+    var arr=[];
+    for(var name in data){
+        arr.push(encodeURIComponent(name)+'='+encodeURIComponent(data[name]));
+    }
+    return arr.join('&');
+}
+
+// export const push =  {
+//     a:6
+// }
--- a/src/components/Bill.vue
+++ b/src/components/Bill.vue
@ -2,7 +2,7 @@
    <div style="position: relative;margin-right: 21px; margin-top: 20px">
        <img src="/static/a/bg.png" style="width: ;position: absolute;height: 50px;width: 100%;" alt="">
        <img src="/static/a/Y.png" style="position: absolute;" alt="">
-        <img :src="`/static/a/${data.icon}.png`" style="position: absolute;top: 50%;transform: translate(15px,-30%);"
+        <img :src="`/index/${data.icon}.png`" style="position: absolute;top: 50%;transform: translate(15px,-30%);"
            alt="">
        <div style="position: relative;padding: 0 10px;top: 5px;margin-left: 45px;">
            <div style="font-size: 16px;font-family: FZCYJ;color: #A9EDFC;">{{ data.num }}
--- a/src/components/areaList.vue
+++ b/src/components/areaList.vue
@ -1,102 +1,116 @@
 <template>
-    <Transition>
-        <div class="address" v-if="props.choseArea">
-
-            <div class="address-li" @click="choseAreaFn">泸县 </div>
-
+        <div class="address" >
+            <div class="address-li" @click="choseAreaFn">{{ "泸县" }} </div>
            <div class="address-li" @click="choseTownFn(item.code, item.name)" v-for="( item, index ) in areaList ">{{
                item.name }}
            </div>
        </div>
-    </Transition>
 </template>

 <script setup>
-import { defineProps, defineEmits, onMounted, reactive, watch } from "vue"
+import { defineProps, defineEmits, onMounted, reactive, watch ,ref} from "vue"
 import { useRouter, useRoute } from 'vue-router'
 import { areaObj } from '@/store/index.js'
 import axios from "axios"
-const route = useRoute
-
+import { sendMsg } from "@/api.js"
+import { globalEventBus } from '@/common/eventBus'
 let areaStore = areaObj()

+const isMainScreen=JSON.parse(localStorage.getItem("TRADE_TYPE"))
 const router = useRouter()
 const emit = defineEmits(['offAreaList'])
 const props = defineProps({
    choseArea: Boolean,
 })
+const sendFn = (event, data = '') => {
+    sendMsg({ channel: 'user-10', event, data })
+}
 let areaList = reactive([])
-// 选额镇
+// 选择镇
 const choseTownFn = (id, name) => {
-    areaStore.changeArea({
+    if(isMainScreen){
+        sendFn('header7', { name, code: id })
+    }else{
+        areaStore.changeArea({
        areaCode: areaStore.area.areaCode,
-        streetCode: id
-
+        streetCode: id,
+        name:name
    })
-
    props.choseArea = false
    emit('offAreaList', name)
-
-    // router.go(0)
-
    router.replace('/townDetail?code=' + id)
-
+    }
 }

-// x选择区县
-const choseAreaFn = () => {
-    areaStore.changeArea({
+// 选择区县
+const choseAreaFn = (name='泸县') => {
+    if(isMainScreen){
+        sendFn('header6', { name: "泸县", code: 0 })
+    }else{
+        areaStore.changeArea({
        areaCode: areaStore.area.areaCode,
-        streetCode: null
-
+        streetCode: null,
+        name,
    })
    props.choseArea = false
-
-    emit('offAreaList', "泸县")
+    emit('offAreaList',areaStore.area.name)
    router.replace('/')
-
-
+    }
+  
 }
+
 onMounted(() => {
-    axios.get(`https://crmeb-test.shop.lihaink.cn/api/city/get_street?area_code=${areaStore.area.areaCode}`)
+    axios.get(`https://shop.lihaink.cn/api/city/get_street?area_code=${areaStore.area.areaCode}`)
        .then(function (response) {
            response.data.data.forEach(item => {
                areaList.push(item)
            })
-
-        })
-        .catch(function (error) {
-            // 处理错误情况
-        })
-        .finally(function () {
-            // 总是会执行
-        });
-
-
-
-
+        })    
 })

+globalEventBus.on('header6', data => {
+    choseAreaFn()
+})
+
+globalEventBus.on('header7', data => {
+    choseTownFn(data.code,data.name)
+})
+
+
+globalEventBus.on('choserArea', data => {
+    areaStore.changeArea({
+        areaCode: data.code,
+        streetCode: null,
+        name:data.name
+    })
+})
+
+globalEventBus.on('choseTown', data => {
+    areaStore.changeArea({
+        areaCode: areaStore.area.areaCode,
+        streetCode: data.code,
+        name:data.name
+    })
+    router.replace('/townDetail?code=' + data.code)
+    
+})
+
+
 </script>

 <style lang="scss" scoped>
 .address {
-    left: 1vw;
-    top: 18px;
-    position: absolute;
    width: 8vw;
-    height: 18vh;
+    // height: 100%;
    background-color: #001E32;
    color: #C7DBE3;
    z-index: 9999;
    overflow-y: auto;
    box-sizing: border-box;
-    padding: 5px;

    .address-li {
-        padding: 2px 5px;
+        padding: 5px;
        cursor: pointer;
-
        border-bottom: 0.1px solid #0E293C;
    }
 }
--- a/src/components/header.vue
+++ b/src/components/header.vue
@ -1,64 +1,65 @@
 <template>
    <div class="headers">
-        <div class="logo">
+        <div class="logo" >
+            <img style="width: 33px;height:33px;margin-left: 50px;margin-top: 5px;"
+                    src="/logo.png" alt="">
+           <!-- <span style="color: red;">{{ areaStore.area }}</span>          -->
        </div>
        <div class="tab" v-if="role != 1">
            <div class="tab-li">
-                <img @click="showFn(0, '/')" class="tab-img" v-if="show[0]" style="width: 6vw;height:2vh;" src="/static/index/SY.png"  
-                    alt="">
-                <img @click="showFn(0, '/')" class="tab-img" v-else style="width: 7vw; height: 3vh;" src="/static/index/SYXZ.png"  
-                    alt="">
+                <img @click="showFn(0, '/')" class="tab-img" v-if="show[0]" style="width: 6vw;height:2vh;"
+                    src="/static/index/SY.png" alt="">
+                <img @click="showFn(0, '/')" class="tab-img" v-else style="width: 7vw; height: 3vh;"
+                    src="/static/index/SYXZ.png" alt="">
            </div>
            <div class="tab-li">
                <img @click="showFn(1, '/commodity')" class="tab-img" v-if="show[1]" style="width: 6vw;height:2vh;"
-                src="/static/index/SP.png"       alt="">
-                <img @click="showFn(1, '/commodity')" class="tab-img" v-else style="width: 7vw;height:3vh;"   src="/static/index/SPXZ.png"  
-                    alt="">
+                    src="/static/index/SP.png" alt="">
+                <img @click="showFn(1, '/commodity')" class="tab-img" v-else style="width: 7vw;height:3vh;"
+                    src="/static/index/SPXZ.png" alt="">
            </div>

            <div class="tab-li">
                <img @click="showFn(2, '/Businesses')" class="tab-img" v-if="show[2]" style="width: 6vw;height:2vh;"
-                src="/static/index/SH.png"       alt="">
+                    src="/static/index/SH.png" alt="">
                <img @click="showFn(2, '/Businesses')" class="tab-img" v-else style="width: 7vw;height:3vh;"
-                src="/static/index/SHXZ.png"       alt="">
+                    src="/static/index/SHXZ.png" alt="">
            </div>
            <div class="tab-li">
                <img @click="showFn(3, '/order')" class="tab-img" v-if="show[3]" style="width: 6vw;height:2vh;"
-                src="/static/index/DD.png"        alt="">
-                <img @click="showFn(3, '/order')" class="tab-img" v-else style="width: 7vw;height:3vh;" 
-                src="/static/index/DDXZ.png"          alt="">
-
+                    src="/static/index/DD.png" alt="">
+                <img @click="showFn(3, '/order')" class="tab-img" v-else style="width: 7vw;height:3vh;"
+                    src="/static/index/DDXZ.png" alt="">
            </div>
            <div class="tab-li">
                <img @click="showFn(4, '/finance')" class="tab-img" v-if="show[4]" style="width: 6vw;height:2vh;"
-                src="/static/index/CW.png"          alt="">
-                <img @click="showFn(4, '/finance')" class="tab-img" v-else style="width: 7vw;height:3vh;" 
-                src="/static/index/CWXZ.png"       alt="">
-
+                    src="/static/index/CW.png" alt="">
+                <img @click="showFn(4, '/finance')" class="tab-img" v-else style="width: 7vw;height:3vh;"
+                    src="/static/index/CWXZ.png" alt="">
            </div>
            <div class="tab-li" v-if="route.path == '/storeLogin'" @click="router.replace('/Businesses')">
                <img @click="showFn(4, '/finance')" class="tab-img" v-if="show[4]" style="width: 6vw;height:2vh;"
-                src="/static/index/FH.png"      alt="">
-
+                    src="/static/index/FH.png" alt="">
            </div>
        </div>
        <div class="tab" v-else>
-
            <div class="tab-li">
                <img @click="showFn(2, '/storeLogin')" class="tab-img" v-if="show[2]" style="width: 6vw;height:2vh;"
-                src="/static/index/SH.png"      alt="">
+                    src="/static/index/SH.png" alt="">
                <img @click="showFn(2, '/storeLogin')" class="tab-img" v-else style="width: 7vw;height:3vh;"
-                src="/static/index/SHXZ.png"      alt="">
+                    src="/static/index/SHXZ.png" alt="">
            </div>
        </div>
        <div class="right">
            <datePicker></datePicker>
-            <div class="rigth-li" @click="choseAreaFn"> <img style="width: 1VW;height:1VW;margin-right: 0.5vw;"
-                src="/static/index/DW.png"        alt=""> {{ area }}
+            <div class="rigth-li b-cls" @click="choseAreaFn"> <img style="width: 1VW;height:1VW;margin-right: 0.5vw;"
+                    src="/static/index/DW.png" alt=""> {{ areaStore.area.name || "泸县" }}
+                    <areaList :choseArea="choseArea" @offAreaList="offAreaList" class="a-cls"  :key="areaStore.area.areaCode" />
            </div>
-            <areaList :choseArea="choseArea" @offAreaList="offAreaList" style="left: 12vw;"></areaList>
+          
            <div class="right-line">
-                <span></span>
+                <span>
+                </span>
                <span></span>
            </div>
            <div class="rigth-li" id="time">15:33:26</div>
@ -70,69 +71,75 @@
                <span></span>
                <span></span>
            </div>
-            <div class="rigth-li" @click="out"><img style="width: 1VW;height:1VW;margin-right: 0.5vw;"  src="/static/index/GJ.png"  
-                    alt=""></div>
+            <div class="rigth-li" @click="out"><img style="width: 1VW;height:1VW;margin-right: 0.5vw;"
+                    src="/static/index/GJ.png" alt=""></div>
            <div class="right-line">
                <span></span>
                <span></span>
            </div>
-
        </div>
    </div>
 </template>

-
-
-
 <script  setup>
 import { ref, reactive, onMounted, watch } from "vue"
 import areaList from "./areaList.vue";
 import { useRouter, useRoute } from 'vue-router'
-import MapLoader from "@/view/utils/position.js"
 import { areaObj } from "@/store/index.js"
 import datePicker from "@/components/datePicker.vue"
+import { globalEventBus } from '@/common/eventBus'
+import { sendMsg } from "@/api.js"
 const areaStore = areaObj()
-let area = ref('')
+const isMainScreen=JSON.parse(localStorage.getItem("TRADE_TYPE"))
+let area = ref(areaStore.area.name || '')
 let userinfo = JSON.parse(localStorage.getItem('TRADE_USER'))
 let role = ref(userinfo.role)
-const u = (name) => {
-    return `/static/index/${name}.png`
-}
+
 const router = useRouter()
 const route = useRoute()
 // 标题
 const show = reactive([false, true, true, true, true])

+
+const sendFn = (event, data = '') => {
+    sendMsg({ channel: 'user-10', event, data })
+}
+
+
 const showFn = (index, src) => {
    show.forEach((item, i) => {
        show[i] = true
    })
    show[index] = !show[index]
-    if (src) {

+    if (src && !isMainScreen)  {
        if (areaStore.area.streetCode && src == '/') {
-
-
            router.push("/townDetail?code=510524102")
            return
        }
        router.replace(src)
-
+    }
+    else if(isMainScreen){
+        sendFn(`header${index+1}`)
    }
 }

-const backUrl = ref('/')
-// alert(zz3)
+const changeArea = (name, code) => {
+    areaStore.changeArea({
+        areaCode: code,
+        streetCode: null,
+        name,
+    })
+    router.replace('/')
+}

-watch(
+if( !isMainScreen){
+    watch(
    () => route.path,
    (value, oldValue) => {
-
-
-
        if (value == '/index') {
            showFn(0)
-            area.value = '泸县'
+            area.value = areaStore.area.name || '泸县'
        }
        if (value == '/townDetail') {
            showFn(0)
@ -160,20 +167,13 @@ watch(
 }

 )
-
-
-
+}


 const choseAreaFn = () => {
-
    if (role.value == 2) {
        choseArea.value = true
-
    }
-
-
-
 }

 // 选额镇
@ -181,12 +181,9 @@ const choseArea = ref(false)
 // 关闭
 const offAreaList = (name) => {
    choseArea.value = false
-    area.value = name
 }
-const out = () => {
-    //@ts-ignore
-    // window.open("about:blank", "_top").close()

+const out = () => {
    localStorage.removeItem('TRADE_USER')
    router.replace('/login')
 }
@ -217,11 +214,28 @@ const updateTime = () => {
 }
 onMounted(() => {
    setInterval(updateTime, 1000)
-    // MapLoader().then(res => {
-    //     area.value = res.addressComponent.district
-    // })
+})

+globalEventBus.on('compheader1', data => {
+    showFn(0, '/')
+})

+globalEventBus.on('compheader2', data => {
+    showFn(1, '/commodity')
+
+})
+
+globalEventBus.on('compheader3', data => {
+    showFn(2, '/Businesses')
+})
+globalEventBus.on('compheader4', data => {
+    showFn(3, '/order')
+})
+globalEventBus.on('compheader5', data => {
+    showFn(4, '/finance')
+})
+globalEventBus.on('choserArea', data => {
+    changeArea(data.name, data.code)
 })
 </script>

@ -230,7 +244,6 @@ onMounted(() => {

 <style lang="scss" >
 .popperClass {
-    // background-color: red;
    color: red;
    border: none;
 }
@ -243,12 +256,9 @@ onMounted(() => {
    justify-content: space-between;
    background-image: url('/static/index/LOGO.png');
    background-color: #000C14;
-
    background-size: cover;
-
    .logo {
        width: 20vw;
-        // margin-right: 30px;
        height: 40px;
        align-items: center;
    }
@ -259,7 +269,6 @@ onMounted(() => {
        margin-left: 120px;
        width: auto;
        height: 100%;
-        // background-color: white;

        .tab-li {
            width: 8vw;
@ -268,7 +277,6 @@ onMounted(() => {
            cursor: pointer;
            height: 1.5vh;
            position: relative;
-            // background-color: red;

            .tab-img {
                position: absolute;
@ -287,41 +295,6 @@ onMounted(() => {
        position: relative;
        align-items: center;

-        .address {
-            left: 1vw;
-            top: 18px;
-            position: absolute;
-            width: 8vw;
-            height: 18vh;
-            background-color: #001E32;
-            color: #C7DBE3;
-            z-index: 9999;
-            overflow-y: auto;
-            box-sizing: border-box;
-            padding: 5px;
-
-            .address-li {
-                padding: 2px 5px;
-                cursor: pointer;
-
-                border-bottom: 0.1px solid #0E293C;
-            }
-        }
-
-        .address::-webkit-scrollbar {
-            width: 10px;
-            background-color: #153041;
-        }
-
-        .address::-webkit-scrollbar-track {
-            background-color: #153041;
-        }
-
-        ::-webkit-scrollbar-thumb {
-            background-color: #4AB9D0;
-            border-radius: 5px;
-        }
-
        .rigth-li {
            height: 15px;
            line-height: 15px;
@ -342,11 +315,29 @@ onMounted(() => {
                width: 1px;
                height: 7px;
                background-color: #4BB9D0;
-
            }
        }
    }
 }
+.a-cls{
+    height: 0;
+    overflow: hidden;
+    position: absolute;
+    top: 2vh;
+    display: block;
+    z-index: 999;
+    transition: 300ms;
+    left: 2vw;
+
+}
+.b-cls{
+    position: relative;
+}
+
+.b-cls:hover .a-cls{
+    height: 18vh;
+    display: block;
+}

 .v-enter-active,
 .v-leave-active {
--- a/src/components/index/bottomCenter.vue
+++ b/src/components/index/bottomCenter.vue
@ -3,9 +3,9 @@

    <div style="height:5vh;"></div>
    <div class="towns">
-        <div class="town-li act">{{ area.area_name }} </div>
+        <div class="town-li act" @click="hdClick1">{{ area.area_name }} </div>

-        <div class="town-li" :class="{ act: item.street_code == props.areaCodes.streetCode }"
+        <div class="town-li" :class="{ act: item.street_code == params.streetCode }"
            v-for="(item, index) in streetList" @click="hdClick(item.street_code)">{{ item.street_name }}
        </div>

@ -20,17 +20,44 @@
 import { ref, reactive, onMounted, defineProps } from "vue"
 import * as echarts from 'echarts';
 import { getUserTradeCountApi } from "@/api.js"
+import { globalEventBus } from '@/common/eventBus'

 const props = defineProps({
    areaCodes: Object,
 })


+const deepCopy=(obj)=> {
+  // 如果是基本数据类型或者 null，则直接返回
+  if (typeof obj !== 'object' || obj === null) {
+    return obj;
+  }
+
+  // 根据对象的类型进行分别处理
+  let result;
+  if (obj instanceof Array) {
+    result = [];
+    for (let i = 0; i < obj.length; i++) {
+      result[i] = deepCopy(obj[i]);
+    }
+  } else {
+    result = {};
+    for (let key in obj) {
+      result[key] = deepCopy(obj[key]);
+    }
+  }
+
+  return result;
+}
+let params=deepCopy( props.areaCodes)
 const hdClick = (code) => {
-    props.areaCodes.streetCode = code
+    params.streetCode = code
+    init()
+}
+const hdClick1 = () => {
+    params.streetCode = ''
    init()
 }
-
 const streetList = reactive([])
 const area = reactive({
    "area_code": "",
@ -40,7 +67,7 @@ const area = reactive({

 const init = () => {

-    getUserTradeCountApi(props.areaCodes).then(res => {
+    getUserTradeCountApi(params).then(res => {

        showChart.value = false
        option.xAxis[0].data.splice(0, option.xAxis[0].data.length)
@ -236,7 +263,9 @@ const option = reactive({
 onMounted(() => {
    init()
 })
-
+globalEventBus.on('indexbottomcenter', data => {
+    hdClick(data.code)
+})
 </script>
 <style lang="scss">
 .towns {
--- a/src/components/index/topCenter.vue
+++ b/src/components/index/topCenter.vue
@ -13,13 +13,13 @@
                <div style="font-size: 10px;">NUMBER OF COMMODITIES</div>
                <img src="/static/index/JR.png" style="width: 75%;position: relative;margin-top: 3.7vh;" alt="">
                <div style="margin-top: 2vh;position: relative;"> <span style="color: #9DD2E0;font-size: 16px;">{{
-                    data?.totalProductCounInfo.todayProductCount }}</span>
+                    data.totalProductCounInfo.todayProductCount }}</span>
                    件</div>
                <div style="margin-top: 1.5vh;display: flex;justify-content: space-around;padding: 0 1vw;">
                    <div style="font-size: 12px;position: relative;display: flex;align-items: center;">
                        <img src="/static/index/ZRSJ.png" style="width: 1vw;height: 1vw;" alt="">
                        &nbsp;
-                        昨日数据： {{ data?.totalProductCounInfo.yestertodayProductCount }}
+                        昨日数据： {{ data.totalProductCounInfo.yestertodayProductCount }}
                    </div>
                    <div style="font-size: 12px;position: relative;display: flex;align-items: center;">
                        <img src="/static/index/ZHB.png" style="width: 1vw;height: 1vw;" alt="">
@ -50,12 +50,12 @@
                    <div style="font-size: 12px;position: relative;display: flex;align-items: center;">
                        <img src="/static/index/ZRSJ.png" style="width: 1vw;height: 1vw;" alt="">
                        &nbsp;
-                        昨日数据： {{ data?.newProductCountInfo?.yestertodayNewProductCount }}
+                        昨日数据： {{ data.newProductCountInfo.yestertodayNewProductCount }}
                    </div>
                    <div style="font-size: 12px;position: relative;display: flex;align-items: center;">
                        <img src="/static/index/ZHB.png" style="width: 1vw;height: 1vw;" alt="">
                        &nbsp;
-                        周环比: {{ percent(data?.newProductCountInfo?.weeklyNewProductTotalGrowthRate) }}
+                        周环比: {{ percent(data.newProductCountInfo.weeklyNewProductTotalGrowthRate) }}
                    </div>
                </div>
            </div>
@ -73,13 +73,13 @@
                <div style="font-size: 10px;">ACCUMULATED NUMBERS OF SHOPS</div>
                <img src="/static/index/JR.png" style="width: 75%;position: relative;margin-top: 3.7vh;" alt="">
                <div style="margin-top: 2vh;position: relative;"> <span style="color: #9DD2E0;font-size: 16px;">{{
-                    data?.merchantCountInfo?.todayMerchantCount }}</span>
+                    data.merchantCountInfo.todayMerchantCount }}</span>
                    个</div>
                <div style="margin-top: 1.5vh;display: flex;justify-content: space-around;padding: 0 1vw;">
                    <div style="font-size: 12px;position: relative;display: flex;align-items: center;">
                        <img src="/static/index/ZRSJ.png" style="width: 1vw;height: 1vw;" alt="">
                        &nbsp;
-                        昨日数据： {{ data?.merchantCountInfo?.yestertodayMerchantCount }}
+                        昨日数据： {{ data.merchantCountInfo.yestertodayMerchantCount }}
                    </div>
                    <div style="font-size: 12px;position: relative;display: flex;align-items: center;">
                        <img src="/static/index/ZHB.png" style="width: 1vw;height: 1vw;" alt="">
@ -117,24 +117,21 @@ const props = defineProps({


 let data = reactive({
-
-    "totalProductCounInfo": {
-        "todayProductCount": 20,
-        "yestertodayProductCount": 292,
-        "weeklyProductTotalGrowthRate": "9.42"
+    totalProductCounInfo: {
+        todayProductCount: 0,
+        yestertodayProductCount: 0,
+        weeklyProductTotalGrowthRate: 0
    },
-    "newProductCountInfo": {
-        "todayNewProductCount": 0,
-        "yestertodayNewProductCount": 0,
-        "weeklyNewProductTotalGrowthRate": "-1.00"
+    newProductCountInfo: {
+        todayNewProductCount: 0,
+        yestertodayNewProductCount: 0,
+        weeklyNewProductTotalGrowthRate: 0
    },
-    "merchantCountInfo": {
-        "todayMerchantCount": 22,
-        "yestertodayMerchantCount": 22,
-        "weeklyMerchantGrowthRate": "-0.04"
+    merchantCountInfo: {
+        todayMerchantCount: 0,
+        yestertodayMerchantCount: 0,
+        weeklyMerchantGrowthRate: 0
    }
-
-
 })

 let viewData = reactive(
@ -153,22 +150,23 @@ const clone = (data1, data2) => {

 }

-getProductCountApi(props.areaCodes).then(res => {
-    data = reactive(res.data)
-    clone(res.data, data)
-})

-getViewCountApi(props.areaCodes).then(res => {
-    clone(res.data, viewData)
-})

 const percent = (num) => {
-
-
-
    return (num) + "%"
 }

+onMounted(() => {
+    getProductCountApi(props.areaCodes).then(res => {
+        data = reactive(res.data)
+        clone(res.data, data)
+    })
+
+    getViewCountApi(props.areaCodes).then(res => {
+        clone(res.data, viewData)
+    })
+})
+
 </script>
 <style lang="scss">
 .product-list {
--- a/src/components/index/topLeft.vue
+++ b/src/components/index/topLeft.vue
@ -23,6 +23,7 @@
 import * as echarts from 'echarts';
 import { ref, reactive, defineProps } from "vue"
 import { getUserNumApi } from "@/api.js"
+import { globalEventBus } from '@/common/eventBus'



@ -155,7 +156,7 @@ let Option = {
 // 地方店铺数量统计option
 let angle = 0;//角度，用来做简单的动画效果的

-let getRange = (Num) => {
+let getRange = (Num,colors) => {
    return {
        backgroundColor: "#061740",
        title: {
@ -227,15 +228,15 @@ let getRange = (Num) => {
                                //外环发光
                                borderWidth: 0.5,
                                shadowBlur: 20,
-                                borderColor: '#4bf3f9',
+                                borderColor: colors,
                                shadowColor: '#9bfeff',
                                color: { // 圆环的颜色
                                    colorStops: [{
                                        offset: 0,
-                                        color: '#4bf3f9', // 0% 处的颜色
+                                        color: colors, // 0% 处的颜色
                                    }, {
                                        offset: 1,
-                                        color: '#4bf3f9', // 100% 处的颜色
+                                        color: colors, // 100% 处的颜色
                                    }]
                                },
                            }
@ -265,12 +266,12 @@ let getRange = (Num) => {
 const storeData = reactive([])
 const initStoreOption = (pageData, total) => {
    storeData.splice(0, storeData.length);
-    pageData.forEach(item => {
-        let range = ((item.merchant_count / total).toFixed(2) * 100)
+    pageData.forEach((item,index) => {
+        let range = ((item.merchant_count / total) * 100).toFixed(2)
        storeData.push({
            name: item.street_name,
            num: item.merchant_count,
-            option: getRange(range)
+            option: getRange(range, index%2?"#4B5FDB":"#4bf3f9")
        })
    })
    storeData.forEach((item, index) => {
@ -322,7 +323,10 @@ const pageFN = (Num) => {

 }

-
+globalEventBus.on('indextopleft', data => {
+    console.log("houdao",data)
+    pageFN(Number(data.num) )
+})

 </script>
 <style lang="scss">
--- a/src/components/index/topRight.vue
+++ b/src/components/index/topRight.vue
@ -9,7 +9,9 @@
        <dv-scroll-board v-show="showGoods" :config="config3" style="height: 17vh;margin-left: 1%;" />
        <dv-scroll-board v-show="!showGoods" :config="config" style="height: 17vh;margin-left: 1%;" />
    </div>
+    <div class="user" style="width: 98%; height: 25vh;" v-else>

+    </div>
    <div class="storeNum">
        <div class="tit">
        </div>
@ -31,8 +33,7 @@
 import { ref, reactive, defineProps } from "vue"
 import { getSalesRankApi } from "@/api.js"
 import * as echarts from 'echarts';
-
-
+import { globalEventBus } from '@/common/eventBus'
 const props = defineProps({
    areaCodes: Object,
 })
@ -45,24 +46,19 @@ let merchantRankingTotal = ref(0)
 let productRankingTotal = ref(0)
 let townProductCount = ref(0)

-
-
 const addFn = (data) => {
    let list = []
    data.forEach((item, i) => {
        list.push(
            [
-                `<div style="line-height:30px; text-align: center;background-image: url('/static/index/PM${(i + 1) <= 3 ? (i + 1) : 4}.png');width: 30px;height: 30px;background-size: cover;" >${i + 1}</div> `,
+                `<div style="line-height:30px; text-align: center;background-image: url('/index/PM${(i + 1) <= 3 ? (i + 1) : 4}.png');width: 30px;height: 30px;background-size: cover;" >${i + 1}</div> `,
                `<div style='background:red;position:relative'><img src="${item.image || item.mini_banner}" style="width: 30px;height: 30px;position:absolute" alt=""></div>`,
                `<div style='height:40px;line-height:40px; white-space: nowrap; overflow: hidden;text-overflow: ellipsis;'>${item.store_name || item.mer_name}</div>`,
-                `<div style='  transform: translateY(12px); width: 100%; height: 10px; background-color: #122E3F;overflow: hidden;'> <div style=' width:  ${item.store_name ? (item.total_sales / productRankingTotal.value).toFixed(2) * 100 : (item.total_sales / townProductCount.value).toFixed(2) * 100}%;height: 100%; background: linear-gradient(to right, #4459CC, #53CAE2);transition: width 0.5s ease-in-out;'></div> </div>`,
+                `<div style='  transform: translateY(12px); width: 100%; height: 10px; background-color: #122E3F;overflow: hidden;'> <div style=' width:  ${item.store_name ? (item.total_sales / productRankingTotal.value).toFixed(2) * 100 : (item.total_sales / merchantRankingTotal.value).toFixed(2) * 100}%;height: 100%; background: linear-gradient(to right, #4459CC, #53CAE2);transition: width 0.5s ease-in-out;'></div> </div>`,
                `<div style=' position: relative;line-height:30px;text-align:center' >${item.total_sales} <span style='font-size:10px'>单</span>
-                     <img src="/static/index/PHBBG.png" style="position: absolute;width: 100%;height: 30px; top:0px;left:0px" alt="">
-                 </div>`,
-
+                 <img src="/index/PHBBG.png" style="position: absolute;width: 100%;height: 30px; top:0px;left:0px" alt="">
+                    </div>`,
            ],
-
-
        )
    })
    return list
@ -91,7 +87,7 @@ const config = reactive({
 // 地方商品数量统计
 let angle = 0;//角度，用来做简单的动画效果的

-let getRange = (Num) => {
+let getRange = (Num, colors) => {
    return {
        backgroundColor: "#061740",
        title: {
@ -163,15 +159,15 @@ let getRange = (Num) => {
                                //外环发光
                                borderWidth: 0.5,
                                shadowBlur: 20,
-                                borderColor: '#4bf3f9',
+                                borderColor: colors,
                                shadowColor: '#9bfeff',
                                color: { // 圆环的颜色
                                    colorStops: [{
                                        offset: 0,
-                                        color: '#4bf3f9', // 0% 处的颜色
+                                        color: colors, // 0% 处的颜色
                                    }, {
                                        offset: 1,
-                                        color: '#4bf3f9', // 100% 处的颜色
+                                        color: colors, // 100% 处的颜色
                                    }]
                                },
                            }
@ -205,12 +201,12 @@ const initCharts = (tag, option) => {
 const storeData = reactive([])
 const initStoreOption = (pageData, total) => {
    storeData.splice(0, storeData.length);
-    pageData.forEach(item => {
-        let range = (parseInt((item.product_count / total)*100))
+    pageData.forEach((item, index) => {
+        let range = (parseInt((item.product_count / total) * 100))
        storeData.push({
            name: item.street_name,
            num: item.product_count,
-            option: getRange(range)
+            option: getRange(range, index % 2 ? "#4B5FDB" : "#4bf3f9")
        })

    })
@ -253,6 +249,22 @@ const pageFN = (Num) => {
    }
 }

+
+
+
+globalEventBus.on('indextopright', data => {
+    pageFN(Number(data.num))
+})
+
+globalEventBus.on('indextopright-1', data => {
+    showGoods.value = true
+})
+globalEventBus.on('indextopright-2', data => {
+    showGoods.value = false
+})
+
+
+
 </script>
 <style lang="scss">
 .user {
--- a/src/components/townDetail/bottomRight.vue
+++ b/src/components/townDetail/bottomRight.vue
@ -42,11 +42,8 @@ const aa = (cig, data) => {
            `<div style='height:40px;line-height:40px; white-space: nowrap; overflow: hidden;text-overflow: ellipsis;'>${item.store_name || item.mer_name}</div>`,
            `<div style='  transform: translateY(12px); width: 100%; height: 10px; background-color: #122E3F;overflow: hidden;'> <div style=' width:  ${item.store_name ? (item.total_sales / productRankingTotal.value).toFixed(2) * 100 : (item.total_sales / townProductCount.value).toFixed(2) * 100}%;height: 100%; background: linear-gradient(to right, #4459CC, #53CAE2);transition: width 0.5s ease-in-out;'></div> </div>`,
            `<div style=' position: relative;line-height:30px;text-align:center' >${item.total_sales} <span style='font-size:10px'>单</span>
-                    <img src="/static/index/PHBBG.png" style="position: absolute;width: 100%;height: 30px; top:0px;left:0px" alt="">
+                    <img src="/index/PHBBG.png" style="position: absolute;width: 100%;height: 30px; top:0px;left:0px" alt="">
                </div>`,
-
-
-
        ])
    })

--- a/src/components/townDetail/topCenter.vue
+++ b/src/components/townDetail/topCenter.vue
@ -126,17 +126,17 @@ const data = reactive(
        "totalProductCounInfo": {
            "todayProductCount": 0,
            "yestertodayProductCount": 0,
-            "weeklyProductTotalGrowthRate": 6.6842
+            "weeklyProductTotalGrowthRate": 0
        },
        "newProductCountInfo": {
            "todayNewProductCount": 0,
            "yestertodayNewProductCount": 0,
-            "weeklyNewProductTotalGrowthRate": -270
+            "weeklyNewProductTotalGrowthRate": 0
        },
        "merchantCountInfo": {
-            "todayMerchantCount": 22,
-            "yestertodayMerchantCount": 22,
-            "weeklyMerchantGrowthRate": 0.0476
+            "todayMerchantCount": 0,
+            "yestertodayMerchantCount": 0,
+            "weeklyMerchantGrowthRate": 0
        }
    }

--- a/src/components/townDetail/topRight.vue
+++ b/src/components/townDetail/topRight.vue
@ -59,7 +59,6 @@ import * as echarts from 'echarts';
 import { onMounted, defineProps } from "vue"
 import { order_user_num_countApi } from "@/api.js"
 import { areaObj } from '../../store';
-
 const areaStore = areaObj()

 order_user_num_countApi(
@ -73,9 +72,6 @@ order_user_num_countApi(
    orderData2.series[0].data.push(res.data.monthOrderPayNum)
    initCharts('orderData', orderData)
    initCharts('orderData2', orderData2)
-
-
-    console.log(45454)
 })


--- a/src/main.js
+++ b/src/main.js
@ -4,6 +4,12 @@ import dataV from '@jiaminghi/data-view'
 import router from "./router";
 import ElementPlus from 'element-plus'
 import * as ElementPlusIconsVue from '@element-plus/icons-vue'
+// 标准的ES模块化引入方式
+import mitt from 'mitt'
+
+
+
+

 import {
    createPinia
@ -13,6 +19,7 @@ import 'element-plus/dist/index.css'
 import 'amfe-flexible'
 const pinia = createPinia()
 const app = createApp(App)
+app.config.globalProperties.$EventBus = new mitt()


 app.use(router)
--- a/src/router/index.js
+++ b/src/router/index.js
@ -1,4 +1,4 @@
-import { createRouter, createWebHistory } from 'vue-router'
+import { createRouter, createWebHashHistory } from 'vue-router'

 const routes = [
    {
@ -52,21 +52,15 @@ const routes = [
        name: 'login',
        component: () => import('@/view/login.vue'),
    },
-
-
-
 ]

 const router = createRouter({
-    mode: 'hash',
-    history: createWebHistory(),
+    history: createWebHashHistory(),
    routes
 })

 router.beforeEach(async (to, from, next) => {
-
    let token = localStorage.getItem("TRADE_USER")
-
    if (to.name == "login" && token) {
        next("/")
        return
--- a/src/store/index.js
+++ b/src/store/index.js
@ -5,33 +5,24 @@ import {
 const lastMouth = () => {
    var thirtyDaysAgo = new Date();
    thirtyDaysAgo.setDate(thirtyDaysAgo.getDate() - 30); // 设置为30天前的日期
-
    var year = thirtyDaysAgo.getFullYear();
    var month = thirtyDaysAgo.getMonth() + 1; // 月份从0开始，需要加1
    var day = thirtyDaysAgo.getDate();
-
    // 格式化为字符串，如果需要补0可以使用padStart函数
    var formattedDate = year + '-' + month.toString().padStart(2, '0') + '-' + day.toString().padStart(2, '0');
-
-
    return formattedDate
-
 }
 const now = () => {
    // 创建一个新的Date对象，表示当前日期和时间
    var today = new Date();
-
    // 获取年、月、日
    var year = today.getFullYear();
    var month = today.getMonth() + 1; // 月份从0开始，需要加1
    var day = today.getDate();
-
    // 格式化为字符串
    var formattedDate = year + "-" + month + "-" + day;
    return formattedDate

-
-
 }

 export const areaObj = defineStore('counter', {
@ -44,7 +35,7 @@ export const areaObj = defineStore('counter', {

        },
        time: [lastMouth(), now()],
-        // 商户请求的参数
+        // 商户登录请求的参数
        store: {
            areaCode: "",
            streetCode: "",
@ -59,8 +50,6 @@ export const areaObj = defineStore('counter', {
        },
        changeUserInfo(obj) {
            this.userInfo = obj
-
-
            if (obj?.user?.merchant) {
                let { area_id, mer_id, street_id } = obj.user.merchant
                this.store.areaCode = area_id
--- a/src/view/Businesses.vue
+++ b/src/view/Businesses.vue
@ -29,8 +29,9 @@ import { useRouter } from 'vue-router'
 import { merchant_listApi, merchantApi } from "@/api.js"
 import { areaObj } from '@/store/index.js'
 import router from "../router";
-const showLogin = ref(false)
+import { globalEventBus } from '@/common/eventBus'

+const showLogin = ref(false)
 const areaStore = areaObj()
 const route = useRouter()
 let status = ref(0)
@ -40,13 +41,10 @@ const num = (n) => {
        htmls = htmls.concat('<input type="radio" name="rate" readonly>')
    }
    return htmls
-
 }

-
 let baseData = {}
 const changeTable = (num) => {
-
    configs.data.splice(0, configs.data.length)
    status.value = num
    merchant_listApi(
@ -62,7 +60,6 @@ const changeTable = (num) => {

 }

-
 const hdClick = (e) => {
    if (e.columnIndex == 10) {
        merchantApi(
@ -71,16 +68,13 @@ const hdClick = (e) => {
                ...areaStore.area
            }
        ).then(res => {
+            localStorage.setItem('TRAD_STORE_INFO', JSON.stringify(res.data))
            areaStore.storeLogin(res.data)
            router.push('/storeLogin')
-
-
-            console.log(areaStore.userInfo)
        })
    }
-
-
 }
+
 const addConfigData = (data) => {
    data.forEach((item, i) => {
        if (i % 2 == 0) {
@ -114,15 +108,10 @@ const addConfigData = (data) => {
                    `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;'>${item.status ? '开启' : '关闭'}</div>`,
                    `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;color:#3D9EB5; cursor: pointer;'>登录</div>`,
                ]
-
-
            )
        }

    })
-
-
-
 }

 const configs = reactive({
@ -149,6 +138,30 @@ const configs = reactive({
 onMounted(() => {
    changeTable(1)
 })
+
+
+
+globalEventBus.on('header3-1', data => {
+    changeTable(1)
+})
+globalEventBus.on('header3-2', data => {
+    changeTable(0)
+})
+
+globalEventBus.on('header3-3', data => {
+    merchantApi(
+        {
+            mer_id: data.id,
+            ...areaStore.area
+        }
+    ).then(res => {
+        localStorage.setItem('TRAD_STORE_INFO', JSON.stringify(res.data))
+        areaStore.storeLogin(res.data)
+        router.push('/storeLogin')
+    })
+})
+
+
 </script>


@ -185,7 +198,7 @@ onMounted(() => {
        .btn {
            color: white;
            // border: 1px solid #BF6D5D;
-            background-image: url('static/index/btn.png');
+            background-image: url('/static/index/btn.png');
            background-size: 100% 100%;
            padding: 1vh 1vw;
            border-radius: 20px;
@ -200,8 +213,6 @@ onMounted(() => {
            background-image: url('/static/index/actbg.png');
            background-size: 100% 100%;
            border: none;
-            // border-bottom: 6px solid #BF6D5D
-            // border-bottom: 6px solid #BF6D5D;
        }
    }

--- a/src/view/commodity.vue
+++ b/src/view/commodity.vue
@ -4,21 +4,20 @@
            <img src="/static/town/TABBG.png" style="width: 100%;height: 100%;position: absolute;z-index: -10000;" alt="">
            <div class="content">
                <div class="btns">
-                    <div class="btn " :class="ShwostoreType ? 'act-btn' : ''" @click="ShwostoreType = true">商品分类</div>
-                    <div class="btn" :class="!ShwostoreType ? 'act-btn' : ''" @click="ShwostoreType = false">商品管理</div>
+                    <div class="btn " :class="ShwostoreType ? 'act-btn' : ''" @click="ShwostoreType = true">商品管理</div>
+                    <div class="btn" :class="!ShwostoreType ? 'act-btn' : ''" @click="ShwostoreType = false">商品分类</div>
                    <!-- <img src="/static/index/actbg.png" alt=""> -->
                </div>
                <div style="display: flex;color: white;justify-content: flex-end;margin-right: 5vw;cursor: pointer;"
-                    v-if="!ShwostoreType">
+                    v-if="ShwostoreType">
                    <div @click="initProduct(item.type)" class="manageBtn " v-for="(item) in proFilterList"
                        :class="{ actmanageBtn: type == item.type }">{{ item.name }}</div>

                </div>
-                <div class="table" v-if="ShwostoreType && configs.data.length">
-
+                <div class="table" v-if="!ShwostoreType && configs.data.length">
                    <dv-scroll-board @click="tableClick" :config="configs" style="width:95vw;height:100%" />
                </div>
-                <div class="table" v-if="!ShwostoreType && configs2.data.length">
+                <div class="table" v-if="ShwostoreType && configs2.data.length">
                    <dv-scroll-board :config="configs2" style="width:95vw;height:100%" />
                    <!-- <scrollTable :config="configs2" style="width:95vw;height:100%"></scrollTable> -->

@ -34,6 +33,7 @@ import { ref, reactive, onMounted } from "vue"
 import { getProductCategoryListApi, getProductListApi, product_status_filterApi } from "@/api.js"
 import { areaObj } from "../store";
 import scrollTable from "@/components/scrollTable.vue" // 五角星样式，有用
+import { globalEventBus } from '@/common/eventBus'

 const areaStore = areaObj()

@ -56,7 +56,6 @@ const initProduct = (num) => {
        limit: 50,
        type: type.value
    }).then(res => {
-
        a(configs2, res.data.list, true)
    })

@ -76,7 +75,6 @@ const value = ref(2)
 const tableClick = (e) => {
    if (e.ceil) {
        if (e.columnIndex == 1) {
-
            let tag = document.getElementById(`zmj${e.rowIndex}`)
            let tag2 = document.getElementById(`lj${e.rowIndex}`)
            tag.style.display = 'none'
@ -105,6 +103,7 @@ const num = (n) => {
 const ShwostoreType = ref(true)
 const a = (aaa, data, flag) => {
    if (flag) {
+    console.log(data,'data')

        data.forEach((item, i) => {
            if (i % 2 == 0) {
@ -119,12 +118,11 @@ const a = (aaa, data, flag) => {
                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #02243D;'>${item.merchant?.is_trader ? '自营' : '非自营' || '--'}</div>`,
                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #02243D;'>${item.price}</div>`,
                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #02243D;'>${item.storeCategory?.cate_name || '--'}</div>`,
-                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #02243D;'>${item.attrValue[0].sales}</div>`,
-                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #02243D;'>${item.attrValue[0].stock}</div>`,
+                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #02243D;'>${item.sales}</div>`,
+                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #02243D;'>${item.stock}</div>`,
                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #02243D;'>
                            ${num(item.star)} 
                            </div>`,
-
                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #02243D;'>${item.update_time}</div>`,
                    ]
                )
@ -134,22 +132,17 @@ const a = (aaa, data, flag) => {
                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;'>${i + 1}</div>`,
                        `<div style='width: 100%;text-align: center; height: 40px; color: aliceblue; background: #102B3E;dislay:flex;align-items:center;box-sizing: border-box; padding-top: 5px;'>
                            <img src='${item.image}' style='width:25px;height:25px;margin-top:1px'>
-
                            </div>`,
                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;'>${item.store_name}</div>`,
-                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;'>${item.merchant.mer_name}</div>`,
+                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;'>${item.merchant?.mer_name}</div>`,
                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;'>${item.merchant?.is_trader ? '自营' : '非自营' || '--'}</div>`,
                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;'>${item.price}</div>`,
                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;'>${item.storeCategory?.cate_name || "--"}</div>`,
-                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;'>${item.attrValue[0].sales}</div>`,
-                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;'>${item.attrValue[0].stock}</div>`,
+                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;'>${item.sales}</div>`,
+                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;'>${item.stock}</div>`,
                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;'>
-                            
                           ${num(item.star)} 
-                            
                            </div>`,
-
-
                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;'>${item.update_time}</div>`,
                    ]
                )
@ -185,17 +178,11 @@ const a = (aaa, data, flag) => {
                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;'>${item.is_show ? '显示' : '不显示'}</div>`,
                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;'>${item.is_hot ? '推荐' : '不推荐'}</div>`,
                        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;'>${item.create_time}</div>`,
-
                    ]
-
-
                )
            }
        })
    }
-
-    // <img src='${item.image}' style='width:25px;height:25px;margin-top:5px'>
-
 }
 const configs = reactive({
    headerBGC: "linear-gradient(to right, #ff0000, #00ff00)",
@ -203,15 +190,12 @@ const configs = reactive({
    evenRowBGC: "",
    rowNum: 20,
    header: [
-
        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: linear-gradient(#002841, #007092);'>排序</div>`,
        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: linear-gradient(#002841, #007092);'>分类名称</div>`,
        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: linear-gradient(#002841, #007092);'>分类图标</div>`,
        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: linear-gradient(#002841, #007092);'>是否显示</div>`,
        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: linear-gradient(#002841, #007092);'>是否推荐</div>`,
        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: linear-gradient(#002841, #007092);'>创建时间</div>`
-
-
    ],
    data: [
    ]
@ -223,7 +207,6 @@ const configs2 = reactive({
    evenRowBGC: "",
    rowNum: 20,
    header: [
-
        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: linear-gradient(#002841, #007092);'>ID</div>`,
        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: linear-gradient(#002841, #007092);'>商品图</div>`,
        `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: linear-gradient(#002841, #007092);'>商品名称</div>`,
@ -246,6 +229,34 @@ onMounted(() => {
    initProduct(1)

 })
+globalEventBus.on('header2-1', data => {
+    ShwostoreType.value = false
+
+})
+globalEventBus.on('header2-2', data => {
+    ShwostoreType.value = true
+
+})
+globalEventBus.on('header2-2-1', data => {
+    initProduct(data.type)
+
+})
+globalEventBus.on('header2-2-2', data => {
+    initProduct(data.type)
+
+
+})
+globalEventBus.on('header2-2-3', data => {
+    initProduct(data.type)
+
+
+})
+globalEventBus.on('header2-2-4', data => {
+    initProduct(data.type)
+
+
+})
+
 </script>

 <style lang="scss" scoped>
@ -284,7 +295,7 @@ onMounted(() => {
        .btn {
            color: white;
            // border: 1px solid #BF6D5D;
-            background-image: url('static/index/btn.png');
+            background-image: url('/static/index/btn.png');
            background-size: 100% 100%;
            padding: 1vh 1vw;
            border-radius: 20px;
--- a/src/view/finance.vue
+++ b/src/view/finance.vue
--- a/src/view/home.vue
+++ b/src/view/home.vue
@ -7,7 +7,17 @@
 <script setup>
 import Header from "@/components/Header.vue"
 import { useRoute } from "vue-router";
-const route =useRoute()
+
+const route = useRoute()
+import { globalEventBus } from '@/common/eventBus'
+
+
+// 标题事件
+for (let i = 1; i < 6; i++) {
+    globalEventBus.on('header' + i, data => {
+        globalEventBus.emit('compheader' + i, data)
+    })
+}


 </script>
--- a/src/view/index.vue
+++ b/src/view/index.vue
@ -6,24 +6,24 @@
    <div class="box" :style="{ opacity: showLoading ? 0 : 1 }">
        <div class="body">
            <div class="l">
-                <topLeft :areaCodes="areaCodes" />
+                <topLeft :areaCodes="areaStore.area" :key="areaStore.area.areaCode" />
            </div>
            <div class="c" id="">
-                <topCenter :areaCodes="areaCodes"></topCenter>
+                <topCenter :areaCodes="areaStore.area" :key="areaStore.area.areaCode"></topCenter>
            </div>
            <div class="r">
-                <topRight :areaCodes="areaCodes"></topRight>
+                <topRight :areaCodes="areaStore.area" :key="areaStore.area.areaCode"></topRight>
            </div>
        </div>
        <div class="foot">
            <div class="foot-l">
-                <bottomLeft :areaCodes="areaCodes"></bottomLeft>
+                <bottomLeft :areaCodes="areaStore.area" :key="areaStore.area.areaCode"></bottomLeft>
            </div>
            <div class="c">
-                <bottomCenter :areaCodes="areaCodes"></bottomCenter>
+                <bottomCenter :areaCodes="areaStore.area" :key="areaStore.area.areaCode"></bottomCenter>
            </div>
            <div class="r">
-                <bottomRight :areaCodes="areaCodes"></bottomRight>
+                <bottomRight :areaCodes="areaStore.area" :key="areaStore.area.areaCode"></bottomRight>
            </div>
        </div>
    </div>
@ -38,21 +38,22 @@ import bottomLeft from "@/components/index/bottomLeft.vue"
 import bottomCenter from "@/components/index/bottomCenter.vue"
 import bottomRight from "@/components/index/bottomRight.vue"
 import { areaObj } from '@/store/index.js'
-import { useRouter } from "vue-router"
-const router = useRouter()
-
-
-
+import { useRouter, useRoute } from "vue-router"
+const route = useRoute()
 const showLoading = ref(true)
 const areaStore = areaObj()
 const areaCodes = reactive({
    ...areaStore.area
 })

-
 setTimeout(() => {
    showLoading.value = false
-}, 1000);
+}, 500);
+
+// if (route.query?.type) { localStorage.setItem("TRADE_TYPE", true) }
+// else {
+//     localStorage.setItem("TRADE_TYPE", false)
+// }
 </script>
 <style lang="scss">
@keyframes jump {
--- a/src/view/login.vue
+++ b/src/view/login.vue
@ -46,8 +46,8 @@ const areaStroe = areaObj()
 const router = useRouter()
 const role = ref(null)
 const show = ref(false)
-const account = ref('叙永镇')
-const password = ref('xuyognzheng')
+const account = ref('')
+const password = ref('')
 const isAccount = ref(false)
 const isPassword = ref(false)
 const isRole = ref(false)
@ -94,9 +94,7 @@ const submit = () => {
        }).then(res => {

            if (res.data.user.street_code) {
-
                role.value = 3
-
                res.data.role = role.value
                localStorage.setItem("TRADE_USER", JSON.stringify(res.data))
                let { area_code, street_code } = res.data.user
--- a/src/view/option.js
+++ b/src/view/option.js
@ -1,19 +1,6 @@
 import * as echarts from 'echarts';

 let angle = 0;//角度，用来做简单的动画效果的
-let value = 78; //图上角度数据
-let result = [
-  { name: '制造业', value: 5713, itemStyle: { color: '#FF7734' } },
-  { name: '信息传输、软件和信息技术服务业', value: 3022, itemStyle: { color: '#FFC700' } },
-  { name: '科学研究和技术服务业', value: 2647, itemStyle: { color: '#34FFE7' } },
-  { name: '金融业', value: 2291 },
-  { name: '批发和零售业', value: 1946 },
-  { name: '交通运输、仓储和邮政业', value: 1812 },
-  { name: '教育', value: 1756 },
-  { name: '建筑业', value: 1712 },
-  { name: '房地产业', value: 1666 },
-  { name: '水利、环境和公共设施管理业', value: 1621 }
-]

 const optins = {

--- a/src/view/order.vue
+++ b/src/view/order.vue
@ -33,6 +33,8 @@ import { ref, reactive, onMounted } from "vue"
 import Bill from "@/components/Bill.vue"
 import { order_listApi, order_list_count_titleApi, refund_order_listApi, take_order_listApi, take_order_count_titleApi } from "@/api.js"
 import { areaObj } from "../store";
+import { globalEventBus } from '@/common/eventBus'
+
 const areaStore = areaObj()
 const billList = reactive([
    {
@ -208,9 +210,11 @@ const tableHdClick = (e) => {
            // console.log(e.rowIndex)
            let tag = document.getElementById(`order${e.rowIndex}`)
            let tag2 = document.getElementById(`card${e.rowIndex}`)
-            tag.style.display = 'none'
-            tag2.style.display = 'block'
-
+            // tag.style.display = 'none'
+            // tag2.style.display = 'block'
+            console.log(e.rowIndex)
+            console.log(tag)
+            console.log(tag2)

        } else {
            let tag = document.getElementsByClassName(`order`)
@ -834,6 +838,23 @@ const configs3 = reactive({
 onMounted(() => {
    hdClick(0)
 })
+
+globalEventBus.on('header4-1', data => {
+    hdClick(0)
+})
+globalEventBus.on('header4-2', data => {
+    hdClick(1)
+})
+globalEventBus.on('header4-3', data => {
+    hdClick(2)
+})
+globalEventBus.on('header4-1-1', data => {
+    // console.log(e.rowIndex)
+    let tag = document.getElementById(`order${data.index}`)
+    let tag2 = document.getElementById(`card${data.index}`)
+    tag.style.display = 'none'
+    tag2.style.display = 'block'
+})
 </script>


@ -873,7 +894,7 @@ onMounted(() => {
        .btn {
            color: white;
            // border: 1px solid #BF6D5D;
-            background-image: url('static/index/btn.png');
+            background-image: url('/static/index/btn.png');
            background-size: 100% 100%;
            padding: 1vh 1vw;
            border-radius: 20px;
@ -883,7 +904,6 @@ onMounted(() => {
        }

        .act-btn {
-
            background-image: url('/static/index/actbg.png');
            background-size: 100% 100%;
            border: none;
--- a/src/view/storeLogin.vue
+++ b/src/view/storeLogin.vue
@ -124,24 +124,18 @@
        </div>

    </div>
-
-
    <div class="bottom">
-
        <div class="ranking">
            <img src="/static/storeLogin/SPXSPH.png" class="img-cls" alt="">
-            <dv-scroll-board :config="config1" v-if="config1.data.length" class="list" />
-
+            <dv-scroll-board :config="config1" v-if="showConfig1" class="list" />
        </div>
        <div class="ranking">
            <img src="/static/storeLogin/SPFKPH.png" class="img-cls" alt="">
-            <dv-scroll-board :config="config2" v-if="config2.data.length" class="list" />
-
+            <dv-scroll-board :config="config2" v-if="showConfig2" class="list" />
        </div>
        <div class="ranking">
            <img src="/static/storeLogin/SPJGPH.png" class="img-cls" alt="">
-            <dv-scroll-board :config="config3" v-if="config3.data.length" class="list" />
-
+            <dv-scroll-board :config="config3" v-if="showConfig3" class="list" />
        </div>
    </div>
 </template>
@ -151,20 +145,18 @@
 import { ref, reactive, onMounted, watch } from "vue"
 import { merchant_count_mainApi, merchant_product_rankingApi, merchant_product_visitApi, merchant_product_cartApi, } from "@/api.js"
 import { areaObj } from "../store";
+import { globalEventBus } from '@/common/eventBus'

 const areaStore = areaObj()
-let query
-let userInfo = JSON.parse(localStorage.getItem('TRADE_USER'))
-
-
-
-// console.log
-
-
+let query;
+let userInfo = JSON.parse(localStorage.getItem('TRADE_USER'));
+let storeLogin = JSON.parse(localStorage.getItem('TRAD_STORE_INFO'))
+const showConfig1=ref(false)
+const showConfig2=ref(false)
+const showConfig3=ref(false)

 if (areaStore.userInfo.user?.merchant) {
    let { area_id, mer_id, street_id } = areaStore.userInfo.user?.merchant
-    console.log(area_id, 5645545)
    query = {
        areaCode: area_id,
        streetCode: street_id,
@ -181,8 +173,14 @@ if (userInfo.user?.merchant) {
    }
 }

-
-
+if (storeLogin?.merchant) {
+    let { area_id, mer_id, street_id } = storeLogin.merchant
+    query = {
+        areaCode: area_id,
+        streetCode: street_id,
+        mer_id: mer_id
+    }
+}

 const config1 = reactive({
    oddRowBGC: "#001C2E",
@ -253,6 +251,10 @@ let total3 = ''


 const init = () => {
+    showConfig1.value=false
+    showConfig2.value=false
+    showConfig3.value=false
+
    merchant_product_rankingApi(
        { ...query, start_date: areaStore.time[0], end_date: areaStore.time[1] }
    ).then(res => {
@ -280,7 +282,7 @@ const init = () => {
 init()

 const addData1 = (data) => {
-    config1.data.splice(0,99999999)
+    config1.data.splice(0, 99999999)
    data.forEach((item, i) => {
        config1.data.push(
            [
@ -289,18 +291,18 @@ const addData1 = (data) => {
                `<div style='height:40px;line-height:40px;  white-space: nowrap; overflow: hidden;text-overflow: ellipsis;'>${item.cart_info.product.store_name}</div>`,
                `<div style='  transform: translateY(12px); width: 100%; height: 10px; background-color: #122E3F;overflow: hidden;'> <div style=' width:${(item.total / total1) * 100}%;height: 100%; background: linear-gradient(to right, #4459CC, #53CAE2);transition: width 0.5s ease-in-out;'></div> </div>`,
                `<div style=' position: relative;line-height:30px;text-align:center;' >${item.total} <span style='font-size:10px'>单</span>
-                     <img src="/static/index/PHBBG.png" style="position: absolute;width: 90px;height: 30px; top:0px;left:0px" alt="">
+                     <img src="/index/PHBBG.png" style="position: absolute;width: 90px;height: 30px; top:0px;left:0px" alt="">
                 </div>`,
            ]
        )
    })
+    showConfig1.value=true



 }
 const addData2 = (data) => {
-    config2.data.splice(0,99999999)
-
+    config2.data.splice(0, 99999999)
    data.forEach((item, i) => {
        config2.data.push(
            [
@ -309,18 +311,17 @@ const addData2 = (data) => {
                `<div style='height:40px;line-height:40px;  white-space: nowrap; overflow: hidden;text-overflow: ellipsis;'>${item.store_name}</div>`,
                `<div style='  transform: translateY(12px); width: 100%; height: 10px; background-color: #122E3F;overflow: hidden;'> <div style=' width:${(item.total / total2) * 100}%;height: 100%; background: linear-gradient(to right, #4459CC, #53CAE2);transition: width 0.5s ease-in-out;'></div> </div>`,
                `<div style=' position: relative;line-height:30px;text-align:center;' >${item.total} <span style='font-size:10px'>人</span>
-                     <img src="/static/index/PHBBG.png" style="position: absolute;width: 90px;height: 30px; top:0px;left:0px" alt="">
+                     <img src="/index/PHBBG.png" style="position: absolute;width: 90px;height: 30px; top:0px;left:0px" alt="">
                 </div>`,
            ]
        )
    })

-
+    showConfig2.value=true

 }
 const addData3 = (data) => {
-    
-    config3.data.splice(0,99999999)
+    config3.data.splice(0, 99999999)
    data.forEach((item, i) => {
        config3.data.push(
            [
@ -329,13 +330,12 @@ const addData3 = (data) => {
                `<div style='height:40px;line-height:40px;  white-space: nowrap; overflow: hidden;text-overflow: ellipsis;'>${item.store_name}</div>`,
                `<div style='  transform: translateY(12px); width: 100%; height: 10px; background-color: #122E3F;overflow: hidden;'> <div style=' width:${(item.total / total3) * 100}%;height: 100%; background: linear-gradient(to right, #4459CC, #53CAE2);transition: width 0.5s ease-in-out;'></div> </div>`,
                `<div style=' position: relative;line-height:30px;text-align:center;' >${item.total} <span style='font-size:10px'>单</span>
-                     <img src="/static/index/PHBBG.png" style="position: absolute;width: 90px;height: 30px; top:0px;left:0px" alt="">
+                     <img src="/index/PHBBG.png" style="position: absolute;width: 90px;height: 30px; top:0px;left:0px" alt="">
                 </div>`,
            ]
        )
    })
-
-
+    showConfig3.value=true

 }

@ -351,7 +351,7 @@ merchant_count_mainApi(
 watch(
    () => areaStore.time,
    (value, oldValue) => {
-      init()
+        init()

    }, {
    deep: true,
@ -359,7 +359,23 @@ watch(
 }

 )
+globalEventBus.on('header3-3', datas => {
+    let { area_id, mer_id, street_id } = storeLogin.merchant
+    query = {
+        areaCode: area_id,
+        streetCode: street_id,
+        mer_id: datas.id
+    }
+    init()
+    merchant_count_mainApi(
+        { ...query }
+    ).then((res) => {
+        for (let key in res.data) {
+            data[key] = res.data[key]
+        }
+    })

+})

 </script>

--- a/src/view/townDetail.vue
+++ b/src/view/townDetail.vue
@ -3,9 +3,7 @@
        <dv-loading>Loading...</dv-loading>
    </div>

-
    <div :style="{ opacity: show ? 0 : 1 }">
-
        <div class="top box">
            <div class="l">
                <topLeft :code="route.query.code" :key="route.query.code"></topLeft>
@ -16,12 +14,9 @@
            <div class="r">
                <topRight :code="route.query.code" :key="route.query.code"></topRight>
            </div>
-
-
        </div>
        <div class="bottom box">
            <div class="l">
-
                <bottomleft :code="route.query.code" :key="route.query.code"></bottomleft>
            </div>
            <div class="c">
@ -29,45 +24,37 @@
            </div>
            <div class="r">
                <bottomRight :code="route.query.code" :key="route.query.code"></bottomRight>
-
            </div>
        </div>
    </div>
 </template>
 <script setup>
-import { onMounted } from 'vue';
-import bottomRight from "@/components/townDetail/bottomRight.vue"
-import bottomCenter from "@/components/townDetail/bottomCenter.vue"
-import bottomleft from "@/components/townDetail/bottomleft.vue"
-import { useRoute } from 'vue-router';
-import topCenter from "@/components/townDetail/topCenter.vue"
-import topLeft from "@/components/townDetail/topLeft.vue"
-import topRight from "@/components/townDetail/topRight.vue"
-import { ref } from 'vue'
+import { onMounted } from "vue";
+import bottomRight from "@/components/townDetail/bottomRight.vue";
+import bottomCenter from "@/components/townDetail/bottomCenter.vue";
+import bottomleft from "@/components/townDetail/bottomleft.vue";
+import { useRoute } from "vue-router";
+import topCenter from "@/components/townDetail/topCenter.vue";
+import topLeft from "@/components/townDetail/topLeft.vue";
+import topRight from "@/components/townDetail/topRight.vue";
+import { ref } from "vue";

-const show = ref(true)
-
-
-const route = useRoute()
+const show = ref(true);

+const route = useRoute();

 onMounted(() => {
-
    setTimeout(() => {
-        show.value = false
-    }, 1000)
-
-})
-
+        show.value = false;
+    }, 1000);
+});
 </script>

-
 <style lang="scss" scoped>
 .box {
    width: 100vw;
    height: 47vh;
    box-sizing: border-box;
-
 }

 .top {
@ -83,9 +70,6 @@ onMounted(() => {
        box-sizing: border-box;
        position: relative;
        padding-top: 6vh;
-
-
-
    }

    .c {
@ -95,19 +79,13 @@ onMounted(() => {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
-
-
    }

-
    .r {
        width: 25vw;
        height: 46vh;
        position: relative;
        // background-color: RED;
-
-
-
    }
 }

@ -119,35 +97,26 @@ onMounted(() => {

    .l {
        // flex: 1;
-        width: 25VW;
+        width: 25vw;
        height: 46vh;
        position: relative;
-
-
-
    }

    .c {
-        width: 48VW;
+        width: 48vw;

        height: 46vh;
        position: relative;
-
-
-
    }

    .r {
-        width: 25VW;
+        width: 25vw;

        height: 46vh;
        position: relative;
-
-
    }
 }

-
 .center {
    position: absolute;
    top: 50%;
@ -159,7 +128,7 @@ onMounted(() => {
    transform: translateY(12px);
    width: 100%;
    height: 10px;
-    background-color: #122E3F;
+    background-color: #122e3f;
    // border-radius: 10px;
    overflow: hidden;
 }
@ -167,7 +136,7 @@ onMounted(() => {
 .progress {
    width: 70%;
    height: 100%;
-    background: linear-gradient(to right, #455CCC, #51C2E0);
+    background: linear-gradient(to right, #455ccc, #51c2e0);
    transition: width 0.5s ease-in-out;
 }

@ -178,4 +147,4 @@ onMounted(() => {
    transform: translate(-50%, -50%);
    color: white;
 }
-</style>
+</style>
--- a/static/push.js
+++ b/static/push.js
@ -0,0 +1,746 @@
+
+function Push(options) {
+    this.doNotConnect = 0;
+    options = options || {};
+    options.heartbeat  = options.heartbeat || 25000;
+    options.pingTimeout = options.pingTimeout || 10000;
+    this.config = options;
+    this.uid = 0;
+    this.channels = {};
+    this.connection = null;
+    this.pingTimeoutTimer = 0;
+    Push.instances.push(this);
+    this.createConnection();
+}
+
+Push.prototype.checkoutPing = function() {
+    var _this = this;
+    _this.checkoutPingTimer && clearTimeout(_this.checkoutPingTimer);
+    _this.checkoutPingTimer = setTimeout(function () {
+        _this.checkoutPingTimer = 0;
+        if (_this.connection.state === 'connected') {
+            _this.connection.send('{"event":"pusher:ping","data":{}}');
+            if (_this.pingTimeoutTimer) {
+                clearTimeout(_this.pingTimeoutTimer);
+                _this.pingTimeoutTimer = 0;
+            }
+            _this.pingTimeoutTimer = setTimeout(function () {
+                _this.connection.closeAndClean();
+                if (!_this.connection.doNotConnect) {
+                    _this.connection.waitReconnect();
+                }
+            }, _this.config.pingTimeout);
+        }
+    }, this.config.heartbeat);
+};
+
+Push.prototype.channel = function (name) {
+    return this.channels.find(name);
+};
+Push.prototype.allChannels = function () {
+    return this.channels.all();
+};
+Push.prototype.createConnection = function () {
+    if (this.connection) {
+        throw Error('Connection already exist');
+    }
+    var _this = this;
+    var url = this.config.url;
+    function updateSubscribed () {
+        for (var i in _this.channels) {
+            _this.channels[i].subscribed = false;
+        }
+    }
+    this.connection = new Connection({
+        url: url,
+        app_key: this.config.app_key,
+        onOpen: function () {
+            _this.connection.state  ='connecting';
+            _this.checkoutPing();
+        },
+        onMessage: function(params) {
+            if(_this.pingTimeoutTimer) {
+                clearTimeout(_this.pingTimeoutTimer);
+                _this.pingTimeoutTimer = 0;
+            }
+
+            params = JSON.parse(params.data);
+            var event = params.event;
+            var channel_name = params.channel;
+
+            if (event === 'pusher:pong') {
+                _this.checkoutPing();
+                return;
+            }
+            if (event === 'pusher:error') {
+                throw Error(params.data.message);
+            }
+            var data = JSON.parse(params.data), channel;
+            if (event === 'pusher_internal:subscription_succeeded') {
+                channel = _this.channels[channel_name];
+                channel.subscribed = true;
+                channel.processQueue();
+                channel.emit('pusher:subscription_succeeded');
+                return;
+            }
+            if (event === 'pusher:connection_established') {
+                _this.connection.socket_id = data.socket_id;
+                _this.connection.updateNetworkState('connected');
+                _this.subscribeAll();
+            }
+            if (event.indexOf('pusher_internal') !== -1) {
+                console.log("Event '"+event+"' not implement");
+                return;
+            }
+            channel = _this.channels[channel_name];
+            if (channel) {
+                channel.emit(event, data);
+            }
+        },
+        onClose: function () {
+            updateSubscribed();
+        },
+        onError: function () {
+            updateSubscribed();
+        }
+    });
+};
+Push.prototype.disconnect = function () {
+    this.connection.doNotConnect = 1;
+    this.connection.close();
+};
+
+Push.prototype.subscribeAll = function () {
+    if (this.connection.state !== 'connected') {
+        return;
+    }
+    for (var channel_name in this.channels) {
+        //this.connection.send(JSON.stringify({event:"pusher:subscribe", data:{channel:channel_name}}));
+        this.channels[channel_name].processSubscribe();
+    }
+};
+
+Push.prototype.unsubscribe = function (channel_name) {
+    if (this.channels[channel_name]) {
+        delete this.channels[channel_name];
+        if (this.connection.state === 'connected') {
+            this.connection.send(JSON.stringify({event:"pusher:unsubscribe", data:{channel:channel_name}}));
+        }
+    }
+};
+Push.prototype.unsubscribeAll = function () {
+    var channels = Object.keys(this.channels);
+    if (channels.length) {
+        if (this.connection.state === 'connected') {
+            for (var channel_name in this.channels) {
+                this.unsubscribe(channel_name);
+            }
+        }
+    }
+    this.channels = {};
+};
+Push.prototype.subscribe = function (channel_name) {
+    if (this.channels[channel_name]) {
+        return this.channels[channel_name];
+    }
+    if (channel_name.indexOf('private-') === 0) {
+        return createPrivateChannel(channel_name, this);
+    }
+    if (channel_name.indexOf('presence-') === 0) {
+        return createPresenceChannel(channel_name, this);
+    }
+    return createChannel(channel_name, this);
+};
+Push.instances = [];
+
+function createChannel(channel_name, push)
+{
+    var channel = new Channel(push.connection, channel_name);
+    push.channels[channel_name] = channel;
+    channel.subscribeCb = function () {
+        push.connection.send(JSON.stringify({event:"pusher:subscribe", data:{channel:channel_name}}));
+    }
+    channel.processSubscribe();
+    return channel;
+}
+
+function createPrivateChannel(channel_name, push)
+{
+    var channel = new Channel(push.connection, channel_name);
+    push.channels[channel_name] = channel;
+    channel.subscribeCb = function () {
+        __ajax({
+            url: push.config.auth,
+            type: 'POST',
+            data: {channel_name: channel_name, socket_id: push.connection.socket_id},
+            success: function (data) {
+                data = JSON.parse(data);
+                data.channel = channel_name;
+                push.connection.send(JSON.stringify({event:"pusher:subscribe", data:data}));
+            },
+            error: function (e) {
+                throw Error(e);
+            }
+        });
+    };
+    channel.processSubscribe();
+    return channel;
+}
+
+function createPresenceChannel(channel_name, push)
+{
+    return createPrivateChannel(channel_name, push);
+}
+
+/*window.addEventListener('online',  function(){
+    var con;
+    for (var i in Push.instances) {
+        con = Push.instances[i].connection;
+        con.reconnectInterval = 1;
+        if (con.state === 'connecting') {
+            con.connect();
+        }
+    }
+});*/
+
+
+function Connection(options) {
+    this.dispatcher = new Dispatcher();
+    __extends(this, this.dispatcher);
+    var properies = ['on', 'off', 'emit'];
+    for (var i in properies) {
+        this[properies[i]] = this.dispatcher[properies[i]];
+    }
+    this.options = options;
+    this.state = 'initialized'; //initialized connecting connected disconnected
+    this.doNotConnect = 0;
+    this.reconnectInterval = 1;
+    this.connection = null;
+    this.reconnectTimer = 0;
+    this.connect();
+}
+
+Connection.prototype.updateNetworkState = function(state){
+    var old_state = this.state;
+    this.state = state;
+    if (old_state !== state) {
+        this.emit('state_change', { previous: old_state, current: state });
+    }
+};
+
+Connection.prototype.connect = function () {
+    this.doNotConnect = 0;
+    if (this.state === 'connected') {
+        console.log('networkState is "' + this.state + '" and do not need connect');
+        return;
+    }
+    if (this.reconnectTimer) {
+        clearTimeout(this.reconnectTimer);
+        this.reconnectTimer = 0;
+    }
+
+    this.closeAndClean();
+
+    var options = this.options;
+    var websocket = new WebSocket(options.url+'/app/'+options.app_key);
+
+    this.updateNetworkState('connecting');
+
+    var _this = this;
+    websocket.onopen = function (res) {
+        _this.reconnectInterval = 1;
+        if (_this.doNotConnect) {
+            _this.updateNetworkState('disconnected');
+            websocket.close();
+            return;
+        }
+        if (options.onOpen) {
+            options.onOpen(res);
+        }
+    };
+
+    if (options.onMessage) {
+        websocket.onmessage = options.onMessage;
+    }
+
+    websocket.onclose = function (res) {
+        websocket.onmessage = websocket.onopen = websocket.onclose = websocket.onerror = null;
+        _this.updateNetworkState('disconnected');
+        if (!_this.doNotConnect) {
+            _this.waitReconnect();
+        }
+        if (options.onClose) {
+            options.onClose(res);
+        }
+    };
+
+    websocket.onerror = function (res) {
+        _this.close();
+        if (!_this.doNotConnect) {
+            _this.waitReconnect();
+        }
+        if (options.onError) {
+            options.onError(res);
+        }
+    };
+    this.connection = websocket;
+}
+
+Connection.prototype.closeAndClean = function () {
+    if(this.connection) {
+        var websocket = this.connection;
+        websocket.onmessage = websocket.onopen = websocket.onclose = websocket.onerror = null;
+        try {
+            websocket.close();
+        } catch (e) {}
+        this.updateNetworkState('disconnected');
+    }
+};
+
+Connection.prototype.waitReconnect = function () {
+    if (this.state === 'connected' || this.state === 'connecting') {
+        return;
+    }
+    if (!this.doNotConnect) {
+        this.updateNetworkState('connecting');
+        var _this = this;
+        if (this.reconnectTimer) {
+            clearTimeout(this.reconnectTimer);
+        }
+        this.reconnectTimer = setTimeout(function(){
+            _this.connect();
+        }, this.reconnectInterval);
+        if (this.reconnectInterval < 1000) {
+            this.reconnectInterval = 1000;
+        } else {
+            // 每次重连间隔增大一倍
+            this.reconnectInterval = this.reconnectInterval * 2;
+        }
+        // 有网络的状态下，重连间隔最大2秒
+        if (this.reconnectInterval > 2000 && navigator.onLine) {
+            _this.reconnectInterval = 2000;
+        }
+    }
+}
+
+Connection.prototype.send = function(data) {
+    if (this.state !== 'connected') {
+        console.trace('networkState is "' + this.state + '", can not send ' + data);
+        return;
+    }
+    this.connection.send(data);
+}
+
+Connection.prototype.close = function(){
+    this.updateNetworkState('disconnected');
+    this.connection.close();
+}
+
+var __extends = (this && this.__extends) || function (d, b) {
+    for (var p in b) if (b.hasOwnProperty(p)) {d[p] = b[p];}
+    function __() { this.constructor = d; }
+    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+};
+
+function Channel(connection, channel_name) {
+    this.subscribed = false;
+    this.dispatcher = new Dispatcher();
+    this.connection = connection;
+    this.channelName = channel_name;
+    this.subscribeCb = null;
+    this.queue = [];
+    __extends(this, this.dispatcher);
+    var properies = ['on', 'off', 'emit'];
+    for (var i in properies) {
+        this[properies[i]] = this.dispatcher[properies[i]];
+    }
+}
+
+Channel.prototype.processSubscribe = function () {
+    if (this.connection.state !== 'connected') {
+        return;
+    }
+    this.subscribeCb();
+};
+
+Channel.prototype.processQueue = function () {
+    if (this.connection.state !== 'connected' || !this.subscribed) {
+        return;
+    }
+    for (var i in this.queue) {
+        this.queue[i]();
+    }
+    this.queue = [];
+};
+
+Channel.prototype.trigger = function (event, data) {
+    if (event.indexOf('client-') !== 0) {
+        throw new Error("Event '" + event + "' should start with 'client-'");
+    }
+    var _this = this;
+    this.queue.push(function () {
+        _this.connection.send(JSON.stringify({ event: event, data: data, channel: _this.channelName }));
+    });
+    this.processQueue();
+};
+
+////////////////
+var Collections = (function () {
+    var exports = {};
+    function extend(target) {
+        var sources = [];
+        for (var _i = 1; _i < arguments.length; _i++) {
+            sources[_i - 1] = arguments[_i];
+        }
+        for (var i = 0; i < sources.length; i++) {
+            var extensions = sources[i];
+            for (var property in extensions) {
+                if (extensions[property] && extensions[property].constructor &&
+                    extensions[property].constructor === Object) {
+                    target[property] = extend(target[property] || {}, extensions[property]);
+                }
+                else {
+                    target[property] = extensions[property];
+                }
+            }
+        }
+        return target;
+    }
+
+    exports.extend = extend;
+    function stringify() {
+        var m = ["Push"];
+        for (var i = 0; i < arguments.length; i++) {
+            if (typeof arguments[i] === "string") {
+                m.push(arguments[i]);
+            }
+            else {
+                m.push(safeJSONStringify(arguments[i]));
+            }
+        }
+        return m.join(" : ");
+    }
+
+    exports.stringify = stringify;
+    function arrayIndexOf(array, item) {
+        var nativeIndexOf = Array.prototype.indexOf;
+        if (array === null) {
+            return -1;
+        }
+        if (nativeIndexOf && array.indexOf === nativeIndexOf) {
+            return array.indexOf(item);
+        }
+        for (var i = 0, l = array.length; i < l; i++) {
+            if (array[i] === item) {
+                return i;
+            }
+        }
+        return -1;
+    }
+
+    exports.arrayIndexOf = arrayIndexOf;
+    function objectApply(object, f) {
+        for (var key in object) {
+            if (Object.prototype.hasOwnProperty.call(object, key)) {
+                f(object[key], key, object);
+            }
+        }
+    }
+
+    exports.objectApply = objectApply;
+    function keys(object) {
+        var keys = [];
+        objectApply(object, function (_, key) {
+            keys.push(key);
+        });
+        return keys;
+    }
+
+    exports.keys = keys;
+    function values(object) {
+        var values = [];
+        objectApply(object, function (value) {
+            values.push(value);
+        });
+        return values;
+    }
+
+    exports.values = values;
+    function apply(array, f, context) {
+        for (var i = 0; i < array.length; i++) {
+            f.call(context || (window), array[i], i, array);
+        }
+    }
+
+    exports.apply = apply;
+    function map(array, f) {
+        var result = [];
+        for (var i = 0; i < array.length; i++) {
+            result.push(f(array[i], i, array, result));
+        }
+        return result;
+    }
+
+    exports.map = map;
+    function mapObject(object, f) {
+        var result = {};
+        objectApply(object, function (value, key) {
+            result[key] = f(value);
+        });
+        return result;
+    }
+
+    exports.mapObject = mapObject;
+    function filter(array, test) {
+        test = test || function (value) {
+            return !!value;
+        };
+        var result = [];
+        for (var i = 0; i < array.length; i++) {
+            if (test(array[i], i, array, result)) {
+                result.push(array[i]);
+            }
+        }
+        return result;
+    }
+
+    exports.filter = filter;
+    function filterObject(object, test) {
+        var result = {};
+        objectApply(object, function (value, key) {
+            if ((test && test(value, key, object, result)) || Boolean(value)) {
+                result[key] = value;
+            }
+        });
+        return result;
+    }
+
+    exports.filterObject = filterObject;
+    function flatten(object) {
+        var result = [];
+        objectApply(object, function (value, key) {
+            result.push([key, value]);
+        });
+        return result;
+    }
+
+    exports.flatten = flatten;
+    function any(array, test) {
+        for (var i = 0; i < array.length; i++) {
+            if (test(array[i], i, array)) {
+                return true;
+            }
+        }
+        return false;
+    }
+
+    exports.any = any;
+    function all(array, test) {
+        for (var i = 0; i < array.length; i++) {
+            if (!test(array[i], i, array)) {
+                return false;
+            }
+        }
+        return true;
+    }
+
+    exports.all = all;
+    function encodeParamsObject(data) {
+        return mapObject(data, function (value) {
+            if (typeof value === "object") {
+                value = safeJSONStringify(value);
+            }
+            return encodeURIComponent(base64_1["default"](value.toString()));
+        });
+    }
+
+    exports.encodeParamsObject = encodeParamsObject;
+    function buildQueryString(data) {
+        var params = filterObject(data, function (value) {
+            return value !== undefined;
+        });
+        return map(flatten(encodeParamsObject(params)), util_1["default"].method("join", "=")).join("&");
+    }
+
+    exports.buildQueryString = buildQueryString;
+    function decycleObject(object) {
+        var objects = [], paths = [];
+        return (function derez(value, path) {
+            var i, name, nu;
+            switch (typeof value) {
+                case 'object':
+                    if (!value) {
+                        return null;
+                    }
+                    for (i = 0; i < objects.length; i += 1) {
+                        if (objects[i] === value) {
+                            return {$ref: paths[i]};
+                        }
+                    }
+                    objects.push(value);
+                    paths.push(path);
+                    if (Object.prototype.toString.apply(value) === '[object Array]') {
+                        nu = [];
+                        for (i = 0; i < value.length; i += 1) {
+                            nu[i] = derez(value[i], path + '[' + i + ']');
+                        }
+                    }
+                    else {
+                        nu = {};
+                        for (name in value) {
+                            if (Object.prototype.hasOwnProperty.call(value, name)) {
+                                nu[name] = derez(value[name], path + '[' + JSON.stringify(name) + ']');
+                            }
+                        }
+                    }
+                    return nu;
+                case 'number':
+                case 'string':
+                case 'boolean':
+                    return value;
+            }
+        }(object, '$'));
+    }
+
+    exports.decycleObject = decycleObject;
+    function safeJSONStringify(source) {
+        try {
+            return JSON.stringify(source);
+        }
+        catch (e) {
+            return JSON.stringify(decycleObject(source));
+        }
+    }
+
+    exports.safeJSONStringify = safeJSONStringify;
+    return exports;
+})();
+
+var Dispatcher = (function () {
+    function Dispatcher(failThrough) {
+        this.callbacks = new CallbackRegistry();
+        this.global_callbacks = [];
+        this.failThrough = failThrough;
+    }
+    Dispatcher.prototype.on = function (eventName, callback, context) {
+        this.callbacks.add(eventName, callback, context);
+        return this;
+    };
+    Dispatcher.prototype.on_global = function (callback) {
+        this.global_callbacks.push(callback);
+        return this;
+    };
+    Dispatcher.prototype.off = function (eventName, callback, context) {
+        this.callbacks.remove(eventName, callback, context);
+        return this;
+    };
+    Dispatcher.prototype.emit = function (eventName, data) {
+        var i;
+        for (i = 0; i < this.global_callbacks.length; i++) {
+            this.global_callbacks[i](eventName, data);
+        }
+        var callbacks = this.callbacks.get(eventName);
+        if (callbacks && callbacks.length > 0) {
+            for (i = 0; i < callbacks.length; i++) {
+                callbacks[i].fn.call(callbacks[i].context || (window), data);
+            }
+        }
+        else if (this.failThrough) {
+            this.failThrough(eventName, data);
+        }
+        return this;
+    };
+    return Dispatcher;
+}());
+
+var CallbackRegistry = (function () {
+    function CallbackRegistry() {
+        this._callbacks = {};
+    }
+    CallbackRegistry.prototype.get = function (name) {
+        return this._callbacks[prefix(name)];
+    };
+    CallbackRegistry.prototype.add = function (name, callback, context) {
+        var prefixedEventName = prefix(name);
+        this._callbacks[prefixedEventName] = this._callbacks[prefixedEventName] || [];
+        this._callbacks[prefixedEventName].push({
+            fn: callback,
+            context: context
+        });
+    };
+    CallbackRegistry.prototype.remove = function (name, callback, context) {
+        if (!name && !callback && !context) {
+            this._callbacks = {};
+            return;
+        }
+        var names = name ? [prefix(name)] : Collections.keys(this._callbacks);
+        if (callback || context) {
+            this.removeCallback(names, callback, context);
+        }
+        else {
+            this.removeAllCallbacks(names);
+        }
+    };
+    CallbackRegistry.prototype.removeCallback = function (names, callback, context) {
+        Collections.apply(names, function (name) {
+            this._callbacks[name] = Collections.filter(this._callbacks[name] || [], function (oning) {
+                return (callback && callback !== oning.fn) ||
+                    (context && context !== oning.context);
+            });
+            if (this._callbacks[name].length === 0) {
+                delete this._callbacks[name];
+            }
+        }, this);
+    };
+    CallbackRegistry.prototype.removeAllCallbacks = function (names) {
+        Collections.apply(names, function (name) {
+            delete this._callbacks[name];
+        }, this);
+    };
+    return CallbackRegistry;
+}());
+function prefix(name) {
+    return "_" + name;
+}
+
+function __ajax(options){
+    options=options||{};
+    options.type=(options.type||'GET').toUpperCase();
+    options.dataType=options.dataType||'json';
+    params=formatParams(options.data);
+
+    var xhr;
+    if(window.XMLHttpRequest){
+        xhr=new XMLHttpRequest();
+    }else{
+        xhr=ActiveXObject('Microsoft.XMLHTTP');
+    }
+
+    xhr.onreadystatechange=function(){
+        if(xhr.readyState === 4){
+            var status=xhr.status;
+            if(status>=200 && status<300){
+                options.success&&options.success(xhr.responseText,xhr.responseXML);
+            }else{
+                options.error&&options.error(status);
+            }
+        }
+    }
+
+    if(options.type==='GET'){
+        xhr.open('GET',options.url+'?'+params,true);
+        xhr.send(null);
+    }else if(options.type==='POST'){
+        xhr.open('POST',options.url,true);
+        xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
+        xhr.send(params);
+    }
+}
+
+function formatParams(data){
+    var arr=[];
+    for(var name in data){
+        arr.push(encodeURIComponent(name)+'='+encodeURIComponent(data[name]));
+    }
+    return arr.join('&');
+}
--- a/vite.config.js
+++ b/vite.config.js
@ -5,7 +5,8 @@ import postCssPxToRem from 'postcss-pxtorem'
 export default defineConfig({
  plugins: [vue()],
  server: {				// ← ← ← ← ← ←
-    host: '0.0.0.0'	// ← 新增内容 ←
+    host: '0.0.0.0'	,// ← 新增内容 ←
+    port:"8891"
  },
  resolve: {
    //别名配置，引用src路径下的东西可以通过@如：import Layout from '@/layout/index.vue'
Author	SHA1	Message	Date
zmj	b3d7de63bb	(下班)	2024-06-01 17:33:03 +08:00
zmj	96bcd8a40d	add	2024-04-09 17:52:37 +08:00
zmj	29c5f8f57a	add	2024-04-09 16:06:56 +08:00
zmj	53217ec58e	add	2024-02-29 09:24:40 +08:00
zmj	164220a37f	add	2024-02-28 15:42:37 +08:00
zmj	b15e2eb7ba	下班	2024-02-24 17:29:02 +08:00
zmj	4365d790cc	下班	2024-02-23 18:19:50 +08:00
zmj	ef54ea4ef4	add	2024-02-05 16:47:43 +08:00
zmj	50f6ac8314	究极更新	2024-02-04 13:34:22 +08:00
zmj	2d541ba5ba	双屏联动	2024-02-02 15:44:13 +08:00
zmj	c666592979	a	2024-01-23 08:58:51 +08:00
lxz	5aa4425837	更新	2024-01-11 18:16:50 +08:00
lxz	ab5208c59c	uad	2024-01-09 18:34:29 +08:00
lxz	ed4e9542ea	c	2024-01-08 18:32:35 +08:00
zmj	d7013e1d36	mitt	2024-01-07 22:19:35 +08:00
lxz	56544d7a5e	video	2024-01-06 18:32:20 +08:00