Compare commits

..

16 Commits

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
55 changed files with 2930 additions and 2429 deletions

View File

@ -1 +1,7 @@
交易信息数据大屏 # Vue 3 + Vite
This template should help get you started developing with Vue 3 in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
## Recommended IDE Setup
- [VS Code](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).

View File

@ -2,9 +2,9 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8" /> <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" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + Vue</title> <title>数据之眼可视化大屏</title>
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>
@ -13,3 +13,11 @@
</html> </html>
<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=b0c21bc6b220aa882bad8ffb6bce8829"></script> <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=b0c21bc6b220aa882bad8ffb6bce8829"></script>
<script>
</script>

1372
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -13,9 +13,10 @@
"@jiaminghi/data-view": "^2.10.0", "@jiaminghi/data-view": "^2.10.0",
"@vuepic/vue-datepicker": "^7.4.0", "@vuepic/vue-datepicker": "^7.4.0",
"amfe-flexible": "^2.2.1", "amfe-flexible": "^2.2.1",
"axios": "^1.6.2", "axios": "^1.6.5",
"echarts": "^5.4.3", "echarts": "^5.4.3",
"element-plus": "^2.4.4", "element-plus": "^2.4.4",
"mitt": "^3.0.1",
"pinia": "^2.1.7", "pinia": "^2.1.7",
"postcss-pxtorem": "^5.1.1", "postcss-pxtorem": "^5.1.1",
"vue": "^3.3.8", "vue": "^3.3.8",

BIN
public/index/CS.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 623 B

BIN
public/index/CY.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 567 B

BIN
public/index/CZ.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 582 B

BIN
public/index/CZXF.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 709 B

BIN
public/index/DD.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 560 B

BIN
public/index/JE.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 709 B

BIN
public/index/PHBBG.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 225 B

BIN
public/index/PM1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
public/index/PM2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

BIN
public/index/PM3.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 KiB

BIN
public/index/PM4.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 667 B

BIN
public/index/PT.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 359 B

BIN
public/index/PT1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 364 B

BIN
public/index/WX.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 796 B

BIN
public/index/XZ.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 762 B

BIN
public/index/YC.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 488 B

BIN
public/index/YE.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 442 B

BIN
public/index/YH.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 628 B

BIN
public/index/YJ.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 709 B

BIN
public/index/ZFB.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 816 B

BIN
public/index/ZY.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 649 B

BIN
public/logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.3 KiB

View File

@ -1,32 +1,84 @@
<script setup lang="ts"> <script setup lang="ts">
import { areaObj } from "@/store/index.js" 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-2uid1
var user_channel = connection.subscribe( uid==10?'user-' + uid:uid+'user-trad');
// var user_channel = connection.subscribe( 'a'+'user-trad');
// user-2message
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() 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")) { if (localStorage.getItem("TRADE_USER")) {
let userInfo = JSON.parse(localStorage.getItem('TRADE_USER')) let userInfo = JSON.parse(localStorage.getItem('TRADE_USER'))
areaStroe.changeUserInfo(userInfo) areaStroe.changeUserInfo(userInfo)
let { area_code, street_code } = userInfo.user let { area_code, street_code } = userInfo.user
areaStroe.changeArea({ areaCode: area_code, streetCode: street_code }) 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> </script>
<template> <template>
<div class="main-box"> <div class="main-box">

View File

@ -3,7 +3,7 @@ import axios from "axios";
import { ElMessage } from 'element-plus' import { ElMessage } from 'element-plus'
import router from "./router"; 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 实例 // 创建axios 实例
@ -11,27 +11,26 @@ const instacne = axios.create({
baseURL: "https://shop.lihaink.cn/", baseURL: "https://shop.lihaink.cn/",
timeout: 30000, timeout: 30000,
}); });
const instacneSend = axios.create({
baseURL: "http://chat.lihaink.cn/index/",
timeout: 30000,
});
// 请求拦截 // 请求拦截
instacne.interceptors.request.use( instacne.interceptors.request.use(
(config) => { (config) => {
// 在发送请求之前做什么 // 在发送请求之前做什么
let timestamp = Math.floor(new Date().getTime() / 1000); // let timestamp = Math.floor(new Date().getTime() / 1000);
// if (expire) {
if (expire) { // if (timestamp > expire) {
// ElMessage({
if (timestamp > expire) { // message: "登录过期,请重新登录",
ElMessage({ // type: 'warning',
message: "登录过期,请重新登录", // })
type: 'warning', // localStorage.removeItem('TRADE_USER')
}) // router.replace('/login')
// }
localStorage.removeItem('TRADE_USER') // }
router.replace('/login')
}
}
return config; return config;
}, },
@ -61,7 +60,9 @@ instacne.interceptors.response.use(
); );
export function sendMsg(params) {
return instacneSend.get('/dataviewTouchPush', { params })
}
export function getUserNumApi(params) { export function getUserNumApi(params) {
return instacne.get('/api/dataview/user_merchat_count', { params }) return instacne.get('/api/dataview/user_merchat_count', { params })

2
src/common/EventBus.js Normal file
View File

@ -0,0 +1,2 @@
import mitt from 'mitt'
export const globalEventBus = mitt()

751
src/common/push.js Normal file
View File

@ -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
// }

View File

@ -2,7 +2,7 @@
<div style="position: relative;margin-right: 21px; margin-top: 20px"> <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/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/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=""> alt="">
<div style="position: relative;padding: 0 10px;top: 5px;margin-left: 45px;"> <div style="position: relative;padding: 0 10px;top: 5px;margin-left: 45px;">
<div style="font-size: 16px;font-family: FZCYJ;color: #A9EDFC;">{{ data.num }} <div style="font-size: 16px;font-family: FZCYJ;color: #A9EDFC;">{{ data.num }}

View File

@ -1,102 +1,116 @@
<template> <template>
<Transition> <div class="address" >
<div class="address" v-if="props.choseArea"> <div class="address-li" @click="choseAreaFn">{{ "泸县" }} </div>
<div class="address-li" @click="choseAreaFn">泸县 </div>
<div class="address-li" @click="choseTownFn(item.code, item.name)" v-for="( item, index ) in areaList ">{{ <div class="address-li" @click="choseTownFn(item.code, item.name)" v-for="( item, index ) in areaList ">{{
item.name }} item.name }}
</div> </div>
</div> </div>
</Transition>
</template> </template>
<script setup> <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 { useRouter, useRoute } from 'vue-router'
import { areaObj } from '@/store/index.js' import { areaObj } from '@/store/index.js'
import axios from "axios" import axios from "axios"
const route = useRoute import { sendMsg } from "@/api.js"
import { globalEventBus } from '@/common/eventBus'
let areaStore = areaObj() let areaStore = areaObj()
const isMainScreen=JSON.parse(localStorage.getItem("TRADE_TYPE"))
const router = useRouter() const router = useRouter()
const emit = defineEmits(['offAreaList']) const emit = defineEmits(['offAreaList'])
const props = defineProps({ const props = defineProps({
choseArea: Boolean, choseArea: Boolean,
}) })
const sendFn = (event, data = '') => {
sendMsg({ channel: 'user-10', event, data })
}
let areaList = reactive([]) let areaList = reactive([])
// //
const choseTownFn = (id, name) => { const choseTownFn = (id, name) => {
areaStore.changeArea({ if(isMainScreen){
sendFn('header7', { name, code: id })
}else{
areaStore.changeArea({
areaCode: areaStore.area.areaCode, areaCode: areaStore.area.areaCode,
streetCode: id streetCode: id,
name:name
}) })
props.choseArea = false props.choseArea = false
emit('offAreaList', name) emit('offAreaList', name)
// router.go(0)
router.replace('/townDetail?code=' + id) router.replace('/townDetail?code=' + id)
}
} }
// x //
const choseAreaFn = () => { const choseAreaFn = (name='泸县') => {
areaStore.changeArea({ if(isMainScreen){
sendFn('header6', { name: "泸县", code: 0 })
}else{
areaStore.changeArea({
areaCode: areaStore.area.areaCode, areaCode: areaStore.area.areaCode,
streetCode: null streetCode: null,
name,
}) })
props.choseArea = false props.choseArea = false
emit('offAreaList',areaStore.area.name)
emit('offAreaList', "泸县")
router.replace('/') router.replace('/')
}
} }
onMounted(() => { 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) { .then(function (response) {
response.data.data.forEach(item => { response.data.data.forEach(item => {
areaList.push(item) areaList.push(item)
}) })
}) })
.catch(function (error) { })
//
}) globalEventBus.on('header6', data => {
.finally(function () { 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> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.address { .address {
left: 1vw;
top: 18px;
position: absolute;
width: 8vw; width: 8vw;
height: 18vh; // height: 100%;
background-color: #001E32; background-color: #001E32;
color: #C7DBE3; color: #C7DBE3;
z-index: 9999; z-index: 9999;
overflow-y: auto; overflow-y: auto;
box-sizing: border-box; box-sizing: border-box;
padding: 5px;
.address-li { .address-li {
padding: 2px 5px; padding: 5px;
cursor: pointer; cursor: pointer;
border-bottom: 0.1px solid #0E293C; border-bottom: 0.1px solid #0E293C;
} }
} }

View File

@ -1,64 +1,65 @@
<template> <template>
<div class="headers"> <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>
<div class="tab" v-if="role != 1"> <div class="tab" v-if="role != 1">
<div class="tab-li"> <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" <img @click="showFn(0, '/')" class="tab-img" v-if="show[0]" style="width: 6vw;height:2vh;"
alt=""> 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" <img @click="showFn(0, '/')" class="tab-img" v-else style="width: 7vw; height: 3vh;"
alt=""> src="/static/index/SYXZ.png" alt="">
</div> </div>
<div class="tab-li"> <div class="tab-li">
<img @click="showFn(1, '/commodity')" class="tab-img" v-if="show[1]" style="width: 6vw;height:2vh;" <img @click="showFn(1, '/commodity')" class="tab-img" v-if="show[1]" style="width: 6vw;height:2vh;"
src="/static/index/SP.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" <img @click="showFn(1, '/commodity')" class="tab-img" v-else style="width: 7vw;height:3vh;"
alt=""> src="/static/index/SPXZ.png" alt="">
</div> </div>
<div class="tab-li"> <div class="tab-li">
<img @click="showFn(2, '/Businesses')" class="tab-img" v-if="show[2]" style="width: 6vw;height:2vh;" <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;" <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>
<div class="tab-li"> <div class="tab-li">
<img @click="showFn(3, '/order')" class="tab-img" v-if="show[3]" style="width: 6vw;height:2vh;" <img @click="showFn(3, '/order')" class="tab-img" v-if="show[3]" style="width: 6vw;height:2vh;"
src="/static/index/DD.png" alt=""> src="/static/index/DD.png" alt="">
<img @click="showFn(3, '/order')" class="tab-img" v-else style="width: 7vw;height:3vh;" <img @click="showFn(3, '/order')" class="tab-img" v-else style="width: 7vw;height:3vh;"
src="/static/index/DDXZ.png" alt=""> src="/static/index/DDXZ.png" alt="">
</div> </div>
<div class="tab-li"> <div class="tab-li">
<img @click="showFn(4, '/finance')" class="tab-img" v-if="show[4]" style="width: 6vw;height:2vh;" <img @click="showFn(4, '/finance')" class="tab-img" v-if="show[4]" style="width: 6vw;height:2vh;"
src="/static/index/CW.png" alt=""> src="/static/index/CW.png" alt="">
<img @click="showFn(4, '/finance')" class="tab-img" v-else style="width: 7vw;height:3vh;" <img @click="showFn(4, '/finance')" class="tab-img" v-else style="width: 7vw;height:3vh;"
src="/static/index/CWXZ.png" alt=""> src="/static/index/CWXZ.png" alt="">
</div> </div>
<div class="tab-li" v-if="route.path == '/storeLogin'" @click="router.replace('/Businesses')"> <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;" <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> </div>
<div class="tab" v-else> <div class="tab" v-else>
<div class="tab-li"> <div class="tab-li">
<img @click="showFn(2, '/storeLogin')" class="tab-img" v-if="show[2]" style="width: 6vw;height:2vh;" <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;" <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> </div>
<div class="right"> <div class="right">
<datePicker></datePicker> <datePicker></datePicker>
<div class="rigth-li" @click="choseAreaFn"> <img style="width: 1VW;height:1VW;margin-right: 0.5vw;" <div class="rigth-li b-cls" @click="choseAreaFn"> <img style="width: 1VW;height:1VW;margin-right: 0.5vw;"
src="/static/index/DW.png" alt=""> {{ area }} src="/static/index/DW.png" alt=""> {{ areaStore.area.name || "泸县" }}
<areaList :choseArea="choseArea" @offAreaList="offAreaList" class="a-cls" :key="areaStore.area.areaCode" />
</div> </div>
<areaList :choseArea="choseArea" @offAreaList="offAreaList" style="left: 12vw;"></areaList>
<div class="right-line"> <div class="right-line">
<span></span> <span>
</span>
<span></span> <span></span>
</div> </div>
<div class="rigth-li" id="time">15:33:26</div> <div class="rigth-li" id="time">15:33:26</div>
@ -70,69 +71,75 @@
<span></span> <span></span>
<span></span> <span></span>
</div> </div>
<div class="rigth-li" @click="out"><img style="width: 1VW;height:1VW;margin-right: 0.5vw;" src="/static/index/GJ.png" <div class="rigth-li" @click="out"><img style="width: 1VW;height:1VW;margin-right: 0.5vw;"
alt=""></div> src="/static/index/GJ.png" alt=""></div>
<div class="right-line"> <div class="right-line">
<span></span> <span></span>
<span></span> <span></span>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script setup> <script setup>
import { ref, reactive, onMounted, watch } from "vue" import { ref, reactive, onMounted, watch } from "vue"
import areaList from "./areaList.vue"; import areaList from "./areaList.vue";
import { useRouter, useRoute } from 'vue-router' import { useRouter, useRoute } from 'vue-router'
import MapLoader from "@/view/utils/position.js"
import { areaObj } from "@/store/index.js" import { areaObj } from "@/store/index.js"
import datePicker from "@/components/datePicker.vue" import datePicker from "@/components/datePicker.vue"
import { globalEventBus } from '@/common/eventBus'
import { sendMsg } from "@/api.js"
const areaStore = areaObj() 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 userinfo = JSON.parse(localStorage.getItem('TRADE_USER'))
let role = ref(userinfo.role) let role = ref(userinfo.role)
const u = (name) => {
return `/static/index/${name}.png`
}
const router = useRouter() const router = useRouter()
const route = useRoute() const route = useRoute()
// //
const show = reactive([false, true, true, true, true]) const show = reactive([false, true, true, true, true])
const sendFn = (event, data = '') => {
sendMsg({ channel: 'user-10', event, data })
}
const showFn = (index, src) => { const showFn = (index, src) => {
show.forEach((item, i) => { show.forEach((item, i) => {
show[i] = true show[i] = true
}) })
show[index] = !show[index] show[index] = !show[index]
if (src) {
if (src && !isMainScreen) {
if (areaStore.area.streetCode && src == '/') { if (areaStore.area.streetCode && src == '/') {
router.push("/townDetail?code=510524102") router.push("/townDetail?code=510524102")
return return
} }
router.replace(src) router.replace(src)
}
else if(isMainScreen){
sendFn(`header${index+1}`)
} }
} }
const backUrl = ref('/') const changeArea = (name, code) => {
// alert(zz3) areaStore.changeArea({
areaCode: code,
streetCode: null,
name,
})
router.replace('/')
}
watch( if( !isMainScreen){
watch(
() => route.path, () => route.path,
(value, oldValue) => { (value, oldValue) => {
if (value == '/index') { if (value == '/index') {
showFn(0) showFn(0)
area.value = '泸县' area.value = areaStore.area.name || '泸县'
} }
if (value == '/townDetail') { if (value == '/townDetail') {
showFn(0) showFn(0)
@ -160,20 +167,13 @@ watch(
} }
) )
}
const choseAreaFn = () => { const choseAreaFn = () => {
if (role.value == 2) { if (role.value == 2) {
choseArea.value = true choseArea.value = true
} }
} }
// //
@ -181,12 +181,9 @@ const choseArea = ref(false)
// //
const offAreaList = (name) => { const offAreaList = (name) => {
choseArea.value = false choseArea.value = false
area.value = name
} }
const out = () => {
//@ts-ignore
// window.open("about:blank", "_top").close()
const out = () => {
localStorage.removeItem('TRADE_USER') localStorage.removeItem('TRADE_USER')
router.replace('/login') router.replace('/login')
} }
@ -217,11 +214,28 @@ const updateTime = () => {
} }
onMounted(() => { onMounted(() => {
setInterval(updateTime, 1000) 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> </script>
@ -230,7 +244,6 @@ onMounted(() => {
<style lang="scss" > <style lang="scss" >
.popperClass { .popperClass {
// background-color: red;
color: red; color: red;
border: none; border: none;
} }
@ -243,12 +256,9 @@ onMounted(() => {
justify-content: space-between; justify-content: space-between;
background-image: url('/static/index/LOGO.png'); background-image: url('/static/index/LOGO.png');
background-color: #000C14; background-color: #000C14;
background-size: cover; background-size: cover;
.logo { .logo {
width: 20vw; width: 20vw;
// margin-right: 30px;
height: 40px; height: 40px;
align-items: center; align-items: center;
} }
@ -259,7 +269,6 @@ onMounted(() => {
margin-left: 120px; margin-left: 120px;
width: auto; width: auto;
height: 100%; height: 100%;
// background-color: white;
.tab-li { .tab-li {
width: 8vw; width: 8vw;
@ -268,7 +277,6 @@ onMounted(() => {
cursor: pointer; cursor: pointer;
height: 1.5vh; height: 1.5vh;
position: relative; position: relative;
// background-color: red;
.tab-img { .tab-img {
position: absolute; position: absolute;
@ -287,41 +295,6 @@ onMounted(() => {
position: relative; position: relative;
align-items: center; 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 { .rigth-li {
height: 15px; height: 15px;
line-height: 15px; line-height: 15px;
@ -342,11 +315,29 @@ onMounted(() => {
width: 1px; width: 1px;
height: 7px; height: 7px;
background-color: #4BB9D0; 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-enter-active,
.v-leave-active { .v-leave-active {

View File

@ -3,9 +3,9 @@
<div style="height:5vh;"></div> <div style="height:5vh;"></div>
<div class="towns"> <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 }} v-for="(item, index) in streetList" @click="hdClick(item.street_code)">{{ item.street_name }}
</div> </div>
@ -20,17 +20,44 @@
import { ref, reactive, onMounted, defineProps } from "vue" import { ref, reactive, onMounted, defineProps } from "vue"
import * as echarts from 'echarts'; import * as echarts from 'echarts';
import { getUserTradeCountApi } from "@/api.js" import { getUserTradeCountApi } from "@/api.js"
import { globalEventBus } from '@/common/eventBus'
const props = defineProps({ const props = defineProps({
areaCodes: Object, 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) => { const hdClick = (code) => {
props.areaCodes.streetCode = code params.streetCode = code
init()
}
const hdClick1 = () => {
params.streetCode = ''
init() init()
} }
const streetList = reactive([]) const streetList = reactive([])
const area = reactive({ const area = reactive({
"area_code": "", "area_code": "",
@ -40,7 +67,7 @@ const area = reactive({
const init = () => { const init = () => {
getUserTradeCountApi(props.areaCodes).then(res => { getUserTradeCountApi(params).then(res => {
showChart.value = false showChart.value = false
option.xAxis[0].data.splice(0, option.xAxis[0].data.length) option.xAxis[0].data.splice(0, option.xAxis[0].data.length)
@ -236,7 +263,9 @@ const option = reactive({
onMounted(() => { onMounted(() => {
init() init()
}) })
globalEventBus.on('indexbottomcenter', data => {
hdClick(data.code)
})
</script> </script>
<style lang="scss"> <style lang="scss">
.towns { .towns {

View File

@ -13,13 +13,13 @@
<div style="font-size: 10px;">NUMBER OF COMMODITIES</div> <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=""> <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;">{{ <div style="margin-top: 2vh;position: relative;"> <span style="color: #9DD2E0;font-size: 16px;">{{
data?.totalProductCounInfo.todayProductCount }}</span> data.totalProductCounInfo.todayProductCount }}</span>
</div> </div>
<div style="margin-top: 1.5vh;display: flex;justify-content: space-around;padding: 0 1vw;"> <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;"> <div style="font-size: 12px;position: relative;display: flex;align-items: center;">
<img src="/static/index/ZRSJ.png" style="width: 1vw;height: 1vw;" alt=""> <img src="/static/index/ZRSJ.png" style="width: 1vw;height: 1vw;" alt="">
&nbsp; &nbsp;
昨日数据 {{ data?.totalProductCounInfo.yestertodayProductCount }} 昨日数据 {{ data.totalProductCounInfo.yestertodayProductCount }}
</div> </div>
<div style="font-size: 12px;position: relative;display: flex;align-items: center;"> <div style="font-size: 12px;position: relative;display: flex;align-items: center;">
<img src="/static/index/ZHB.png" style="width: 1vw;height: 1vw;" alt=""> <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;"> <div style="font-size: 12px;position: relative;display: flex;align-items: center;">
<img src="/static/index/ZRSJ.png" style="width: 1vw;height: 1vw;" alt=""> <img src="/static/index/ZRSJ.png" style="width: 1vw;height: 1vw;" alt="">
&nbsp; &nbsp;
昨日数据 {{ data?.newProductCountInfo?.yestertodayNewProductCount }} 昨日数据 {{ data.newProductCountInfo.yestertodayNewProductCount }}
</div> </div>
<div style="font-size: 12px;position: relative;display: flex;align-items: center;"> <div style="font-size: 12px;position: relative;display: flex;align-items: center;">
<img src="/static/index/ZHB.png" style="width: 1vw;height: 1vw;" alt=""> <img src="/static/index/ZHB.png" style="width: 1vw;height: 1vw;" alt="">
&nbsp; &nbsp;
周环比: {{ percent(data?.newProductCountInfo?.weeklyNewProductTotalGrowthRate) }} 周环比: {{ percent(data.newProductCountInfo.weeklyNewProductTotalGrowthRate) }}
</div> </div>
</div> </div>
</div> </div>
@ -73,13 +73,13 @@
<div style="font-size: 10px;">ACCUMULATED NUMBERS OF SHOPS</div> <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=""> <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;">{{ <div style="margin-top: 2vh;position: relative;"> <span style="color: #9DD2E0;font-size: 16px;">{{
data?.merchantCountInfo?.todayMerchantCount }}</span> data.merchantCountInfo.todayMerchantCount }}</span>
</div> </div>
<div style="margin-top: 1.5vh;display: flex;justify-content: space-around;padding: 0 1vw;"> <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;"> <div style="font-size: 12px;position: relative;display: flex;align-items: center;">
<img src="/static/index/ZRSJ.png" style="width: 1vw;height: 1vw;" alt=""> <img src="/static/index/ZRSJ.png" style="width: 1vw;height: 1vw;" alt="">
&nbsp; &nbsp;
昨日数据 {{ data?.merchantCountInfo?.yestertodayMerchantCount }} 昨日数据 {{ data.merchantCountInfo.yestertodayMerchantCount }}
</div> </div>
<div style="font-size: 12px;position: relative;display: flex;align-items: center;"> <div style="font-size: 12px;position: relative;display: flex;align-items: center;">
<img src="/static/index/ZHB.png" style="width: 1vw;height: 1vw;" alt=""> <img src="/static/index/ZHB.png" style="width: 1vw;height: 1vw;" alt="">
@ -117,24 +117,21 @@ const props = defineProps({
let data = reactive({ let data = reactive({
totalProductCounInfo: {
"totalProductCounInfo": { todayProductCount: 0,
"todayProductCount": 20, yestertodayProductCount: 0,
"yestertodayProductCount": 292, weeklyProductTotalGrowthRate: 0
"weeklyProductTotalGrowthRate": "9.42"
}, },
"newProductCountInfo": { newProductCountInfo: {
"todayNewProductCount": 0, todayNewProductCount: 0,
"yestertodayNewProductCount": 0, yestertodayNewProductCount: 0,
"weeklyNewProductTotalGrowthRate": "-1.00" weeklyNewProductTotalGrowthRate: 0
}, },
"merchantCountInfo": { merchantCountInfo: {
"todayMerchantCount": 22, todayMerchantCount: 0,
"yestertodayMerchantCount": 22, yestertodayMerchantCount: 0,
"weeklyMerchantGrowthRate": "-0.04" weeklyMerchantGrowthRate: 0
} }
}) })
let viewData = reactive( 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) => { const percent = (num) => {
return (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> </script>
<style lang="scss"> <style lang="scss">
.product-list { .product-list {

View File

@ -23,6 +23,7 @@
import * as echarts from 'echarts'; import * as echarts from 'echarts';
import { ref, reactive, defineProps } from "vue" import { ref, reactive, defineProps } from "vue"
import { getUserNumApi } from "@/api.js" import { getUserNumApi } from "@/api.js"
import { globalEventBus } from '@/common/eventBus'
@ -155,7 +156,7 @@ let Option = {
// option // option
let angle = 0;// let angle = 0;//
let getRange = (Num) => { let getRange = (Num,colors) => {
return { return {
backgroundColor: "#061740", backgroundColor: "#061740",
title: { title: {
@ -227,15 +228,15 @@ let getRange = (Num) => {
// //
borderWidth: 0.5, borderWidth: 0.5,
shadowBlur: 20, shadowBlur: 20,
borderColor: '#4bf3f9', borderColor: colors,
shadowColor: '#9bfeff', shadowColor: '#9bfeff',
color: { // color: { //
colorStops: [{ colorStops: [{
offset: 0, offset: 0,
color: '#4bf3f9', // 0% color: colors, // 0%
}, { }, {
offset: 1, offset: 1,
color: '#4bf3f9', // 100% color: colors, // 100%
}] }]
}, },
} }
@ -265,12 +266,12 @@ let getRange = (Num) => {
const storeData = reactive([]) const storeData = reactive([])
const initStoreOption = (pageData, total) => { const initStoreOption = (pageData, total) => {
storeData.splice(0, storeData.length); storeData.splice(0, storeData.length);
pageData.forEach(item => { pageData.forEach((item,index) => {
let range = ((item.merchant_count / total).toFixed(2) * 100) let range = ((item.merchant_count / total) * 100).toFixed(2)
storeData.push({ storeData.push({
name: item.street_name, name: item.street_name,
num: item.merchant_count, num: item.merchant_count,
option: getRange(range) option: getRange(range, index%2?"#4B5FDB":"#4bf3f9")
}) })
}) })
storeData.forEach((item, index) => { storeData.forEach((item, index) => {
@ -322,7 +323,10 @@ const pageFN = (Num) => {
} }
globalEventBus.on('indextopleft', data => {
console.log("houdao",data)
pageFN(Number(data.num) )
})
</script> </script>
<style lang="scss"> <style lang="scss">

View File

@ -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="config3" style="height: 17vh;margin-left: 1%;" />
<dv-scroll-board v-show="!showGoods" :config="config" style="height: 17vh;margin-left: 1%;" /> <dv-scroll-board v-show="!showGoods" :config="config" style="height: 17vh;margin-left: 1%;" />
</div> </div>
<div class="user" style="width: 98%; height: 25vh;" v-else>
</div>
<div class="storeNum"> <div class="storeNum">
<div class="tit"> <div class="tit">
</div> </div>
@ -31,8 +33,7 @@
import { ref, reactive, defineProps } from "vue" import { ref, reactive, defineProps } from "vue"
import { getSalesRankApi } from "@/api.js" import { getSalesRankApi } from "@/api.js"
import * as echarts from 'echarts'; import * as echarts from 'echarts';
import { globalEventBus } from '@/common/eventBus'
const props = defineProps({ const props = defineProps({
areaCodes: Object, areaCodes: Object,
}) })
@ -45,24 +46,19 @@ let merchantRankingTotal = ref(0)
let productRankingTotal = ref(0) let productRankingTotal = ref(0)
let townProductCount = ref(0) let townProductCount = ref(0)
const addFn = (data) => { const addFn = (data) => {
let list = [] let list = []
data.forEach((item, i) => { data.forEach((item, i) => {
list.push( 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='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='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> `<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>`, </div>`,
], ],
) )
}) })
return list return list
@ -91,7 +87,7 @@ const config = reactive({
// //
let angle = 0;// let angle = 0;//
let getRange = (Num) => { let getRange = (Num, colors) => {
return { return {
backgroundColor: "#061740", backgroundColor: "#061740",
title: { title: {
@ -163,15 +159,15 @@ let getRange = (Num) => {
// //
borderWidth: 0.5, borderWidth: 0.5,
shadowBlur: 20, shadowBlur: 20,
borderColor: '#4bf3f9', borderColor: colors,
shadowColor: '#9bfeff', shadowColor: '#9bfeff',
color: { // color: { //
colorStops: [{ colorStops: [{
offset: 0, offset: 0,
color: '#4bf3f9', // 0% color: colors, // 0%
}, { }, {
offset: 1, offset: 1,
color: '#4bf3f9', // 100% color: colors, // 100%
}] }]
}, },
} }
@ -205,12 +201,12 @@ const initCharts = (tag, option) => {
const storeData = reactive([]) const storeData = reactive([])
const initStoreOption = (pageData, total) => { const initStoreOption = (pageData, total) => {
storeData.splice(0, storeData.length); storeData.splice(0, storeData.length);
pageData.forEach(item => { pageData.forEach((item, index) => {
let range = (parseInt((item.product_count / total)*100)) let range = (parseInt((item.product_count / total) * 100))
storeData.push({ storeData.push({
name: item.street_name, name: item.street_name,
num: item.product_count, 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> </script>
<style lang="scss"> <style lang="scss">
.user { .user {

View File

@ -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='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 / 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> `<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>`, </div>`,
]) ])
}) })

View File

@ -126,17 +126,17 @@ const data = reactive(
"totalProductCounInfo": { "totalProductCounInfo": {
"todayProductCount": 0, "todayProductCount": 0,
"yestertodayProductCount": 0, "yestertodayProductCount": 0,
"weeklyProductTotalGrowthRate": 6.6842 "weeklyProductTotalGrowthRate": 0
}, },
"newProductCountInfo": { "newProductCountInfo": {
"todayNewProductCount": 0, "todayNewProductCount": 0,
"yestertodayNewProductCount": 0, "yestertodayNewProductCount": 0,
"weeklyNewProductTotalGrowthRate": -270 "weeklyNewProductTotalGrowthRate": 0
}, },
"merchantCountInfo": { "merchantCountInfo": {
"todayMerchantCount": 22, "todayMerchantCount": 0,
"yestertodayMerchantCount": 22, "yestertodayMerchantCount": 0,
"weeklyMerchantGrowthRate": 0.0476 "weeklyMerchantGrowthRate": 0
} }
} }

View File

@ -59,7 +59,6 @@ import * as echarts from 'echarts';
import { onMounted, defineProps } from "vue" import { onMounted, defineProps } from "vue"
import { order_user_num_countApi } from "@/api.js" import { order_user_num_countApi } from "@/api.js"
import { areaObj } from '../../store'; import { areaObj } from '../../store';
const areaStore = areaObj() const areaStore = areaObj()
order_user_num_countApi( order_user_num_countApi(
@ -73,9 +72,6 @@ order_user_num_countApi(
orderData2.series[0].data.push(res.data.monthOrderPayNum) orderData2.series[0].data.push(res.data.monthOrderPayNum)
initCharts('orderData', orderData) initCharts('orderData', orderData)
initCharts('orderData2', orderData2) initCharts('orderData2', orderData2)
console.log(45454)
}) })

View File

@ -4,6 +4,12 @@ import dataV from '@jiaminghi/data-view'
import router from "./router"; import router from "./router";
import ElementPlus from 'element-plus' import ElementPlus from 'element-plus'
import * as ElementPlusIconsVue from '@element-plus/icons-vue' import * as ElementPlusIconsVue from '@element-plus/icons-vue'
// 标准的ES模块化引入方式
import mitt from 'mitt'
import { import {
createPinia createPinia
@ -13,6 +19,7 @@ import 'element-plus/dist/index.css'
import 'amfe-flexible' import 'amfe-flexible'
const pinia = createPinia() const pinia = createPinia()
const app = createApp(App) const app = createApp(App)
app.config.globalProperties.$EventBus = new mitt()
app.use(router) app.use(router)

View File

@ -1,4 +1,4 @@
import { createRouter, createWebHistory } from 'vue-router' import { createRouter, createWebHashHistory } from 'vue-router'
const routes = [ const routes = [
{ {
@ -52,21 +52,15 @@ const routes = [
name: 'login', name: 'login',
component: () => import('@/view/login.vue'), component: () => import('@/view/login.vue'),
}, },
] ]
const router = createRouter({ const router = createRouter({
mode: 'hash', history: createWebHashHistory(),
history: createWebHistory(),
routes routes
}) })
router.beforeEach(async (to, from, next) => { router.beforeEach(async (to, from, next) => {
let token = localStorage.getItem("TRADE_USER") let token = localStorage.getItem("TRADE_USER")
if (to.name == "login" && token) { if (to.name == "login" && token) {
next("/") next("/")
return return

View File

@ -5,33 +5,24 @@ import {
const lastMouth = () => { const lastMouth = () => {
var thirtyDaysAgo = new Date(); var thirtyDaysAgo = new Date();
thirtyDaysAgo.setDate(thirtyDaysAgo.getDate() - 30); // 设置为30天前的日期 thirtyDaysAgo.setDate(thirtyDaysAgo.getDate() - 30); // 设置为30天前的日期
var year = thirtyDaysAgo.getFullYear(); var year = thirtyDaysAgo.getFullYear();
var month = thirtyDaysAgo.getMonth() + 1; // 月份从0开始需要加1 var month = thirtyDaysAgo.getMonth() + 1; // 月份从0开始需要加1
var day = thirtyDaysAgo.getDate(); var day = thirtyDaysAgo.getDate();
// 格式化为字符串如果需要补0可以使用padStart函数 // 格式化为字符串如果需要补0可以使用padStart函数
var formattedDate = year + '-' + month.toString().padStart(2, '0') + '-' + day.toString().padStart(2, '0'); var formattedDate = year + '-' + month.toString().padStart(2, '0') + '-' + day.toString().padStart(2, '0');
return formattedDate return formattedDate
} }
const now = () => { const now = () => {
// 创建一个新的Date对象表示当前日期和时间 // 创建一个新的Date对象表示当前日期和时间
var today = new Date(); var today = new Date();
// 获取年、月、日 // 获取年、月、日
var year = today.getFullYear(); var year = today.getFullYear();
var month = today.getMonth() + 1; // 月份从0开始需要加1 var month = today.getMonth() + 1; // 月份从0开始需要加1
var day = today.getDate(); var day = today.getDate();
// 格式化为字符串 // 格式化为字符串
var formattedDate = year + "-" + month + "-" + day; var formattedDate = year + "-" + month + "-" + day;
return formattedDate return formattedDate
} }
export const areaObj = defineStore('counter', { export const areaObj = defineStore('counter', {
@ -44,7 +35,7 @@ export const areaObj = defineStore('counter', {
}, },
time: [lastMouth(), now()], time: [lastMouth(), now()],
// 商户请求的参数 // 商户登录请求的参数
store: { store: {
areaCode: "", areaCode: "",
streetCode: "", streetCode: "",
@ -59,8 +50,6 @@ export const areaObj = defineStore('counter', {
}, },
changeUserInfo(obj) { changeUserInfo(obj) {
this.userInfo = obj this.userInfo = obj
if (obj?.user?.merchant) { if (obj?.user?.merchant) {
let { area_id, mer_id, street_id } = obj.user.merchant let { area_id, mer_id, street_id } = obj.user.merchant
this.store.areaCode = area_id this.store.areaCode = area_id

View File

@ -29,8 +29,9 @@ import { useRouter } from 'vue-router'
import { merchant_listApi, merchantApi } from "@/api.js" import { merchant_listApi, merchantApi } from "@/api.js"
import { areaObj } from '@/store/index.js' import { areaObj } from '@/store/index.js'
import router from "../router"; import router from "../router";
const showLogin = ref(false) import { globalEventBus } from '@/common/eventBus'
const showLogin = ref(false)
const areaStore = areaObj() const areaStore = areaObj()
const route = useRouter() const route = useRouter()
let status = ref(0) let status = ref(0)
@ -40,13 +41,10 @@ const num = (n) => {
htmls = htmls.concat('<input type="radio" name="rate" readonly>') htmls = htmls.concat('<input type="radio" name="rate" readonly>')
} }
return htmls return htmls
} }
let baseData = {} let baseData = {}
const changeTable = (num) => { const changeTable = (num) => {
configs.data.splice(0, configs.data.length) configs.data.splice(0, configs.data.length)
status.value = num status.value = num
merchant_listApi( merchant_listApi(
@ -62,7 +60,6 @@ const changeTable = (num) => {
} }
const hdClick = (e) => { const hdClick = (e) => {
if (e.columnIndex == 10) { if (e.columnIndex == 10) {
merchantApi( merchantApi(
@ -71,16 +68,13 @@ const hdClick = (e) => {
...areaStore.area ...areaStore.area
} }
).then(res => { ).then(res => {
localStorage.setItem('TRAD_STORE_INFO', JSON.stringify(res.data))
areaStore.storeLogin(res.data) areaStore.storeLogin(res.data)
router.push('/storeLogin') router.push('/storeLogin')
console.log(areaStore.userInfo)
}) })
} }
} }
const addConfigData = (data) => { const addConfigData = (data) => {
data.forEach((item, i) => { data.forEach((item, i) => {
if (i % 2 == 0) { 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;'>${item.status ? '开启' : '关闭'}</div>`,
`<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;color:#3D9EB5; cursor: pointer;'>登录</div>`, `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;color:#3D9EB5; cursor: pointer;'>登录</div>`,
] ]
) )
} }
}) })
} }
const configs = reactive({ const configs = reactive({
@ -149,6 +138,30 @@ const configs = reactive({
onMounted(() => { onMounted(() => {
changeTable(1) 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> </script>
@ -185,7 +198,7 @@ onMounted(() => {
.btn { .btn {
color: white; color: white;
// border: 1px solid #BF6D5D; // border: 1px solid #BF6D5D;
background-image: url('static/index/btn.png'); background-image: url('/static/index/btn.png');
background-size: 100% 100%; background-size: 100% 100%;
padding: 1vh 1vw; padding: 1vh 1vw;
border-radius: 20px; border-radius: 20px;
@ -200,8 +213,6 @@ onMounted(() => {
background-image: url('/static/index/actbg.png'); background-image: url('/static/index/actbg.png');
background-size: 100% 100%; background-size: 100% 100%;
border: none; border: none;
// border-bottom: 6px solid #BF6D5D
// border-bottom: 6px solid #BF6D5D;
} }
} }

View File

@ -4,21 +4,20 @@
<img src="/static/town/TABBG.png" style="width: 100%;height: 100%;position: absolute;z-index: -10000;" alt=""> <img src="/static/town/TABBG.png" style="width: 100%;height: 100%;position: absolute;z-index: -10000;" alt="">
<div class="content"> <div class="content">
<div class="btns"> <div class="btns">
<div class="btn " :class="ShwostoreType ? 'act-btn' : ''" @click="ShwostoreType = true">商品分类</div> <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 = false">商品分类</div>
<!-- <img src="/static/index/actbg.png" alt=""> --> <!-- <img src="/static/index/actbg.png" alt=""> -->
</div> </div>
<div style="display: flex;color: white;justify-content: flex-end;margin-right: 5vw;cursor: pointer;" <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" <div @click="initProduct(item.type)" class="manageBtn " v-for="(item) in proFilterList"
:class="{ actmanageBtn: type == item.type }">{{ item.name }}</div> :class="{ actmanageBtn: type == item.type }">{{ item.name }}</div>
</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%" /> <dv-scroll-board @click="tableClick" :config="configs" style="width:95vw;height:100%" />
</div> </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%" /> <dv-scroll-board :config="configs2" style="width:95vw;height:100%" />
<!-- <scrollTable :config="configs2" style="width:95vw;height:100%"></scrollTable> --> <!-- <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 { getProductCategoryListApi, getProductListApi, product_status_filterApi } from "@/api.js"
import { areaObj } from "../store"; import { areaObj } from "../store";
import scrollTable from "@/components/scrollTable.vue" // import scrollTable from "@/components/scrollTable.vue" //
import { globalEventBus } from '@/common/eventBus'
const areaStore = areaObj() const areaStore = areaObj()
@ -56,7 +56,6 @@ const initProduct = (num) => {
limit: 50, limit: 50,
type: type.value type: type.value
}).then(res => { }).then(res => {
a(configs2, res.data.list, true) a(configs2, res.data.list, true)
}) })
@ -76,7 +75,6 @@ const value = ref(2)
const tableClick = (e) => { const tableClick = (e) => {
if (e.ceil) { if (e.ceil) {
if (e.columnIndex == 1) { if (e.columnIndex == 1) {
let tag = document.getElementById(`zmj${e.rowIndex}`) let tag = document.getElementById(`zmj${e.rowIndex}`)
let tag2 = document.getElementById(`lj${e.rowIndex}`) let tag2 = document.getElementById(`lj${e.rowIndex}`)
tag.style.display = 'none' tag.style.display = 'none'
@ -105,6 +103,7 @@ const num = (n) => {
const ShwostoreType = ref(true) const ShwostoreType = ref(true)
const a = (aaa, data, flag) => { const a = (aaa, data, flag) => {
if (flag) { if (flag) {
console.log(data,'data')
data.forEach((item, i) => { data.forEach((item, i) => {
if (i % 2 == 0) { 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.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.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.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.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.stock}</div>`,
`<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #02243D;'> `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #02243D;'>
${num(item.star)} ${num(item.star)}
</div>`, </div>`,
`<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #02243D;'>${item.update_time}</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: 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;'> `<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'> <img src='${item.image}' style='width:25px;height:25px;margin-top:1px'>
</div>`, </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.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.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.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.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.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.stock}</div>`,
`<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;'> `<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;'>
${num(item.star)} ${num(item.star)}
</div>`, </div>`,
`<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;'>${item.update_time}</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_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.is_hot ? '推荐' : '不推荐'}</div>`,
`<div style='width: 100%;text-align: center; height: 100%; color: aliceblue; background: #102B3E;'>${item.create_time}</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({ const configs = reactive({
headerBGC: "linear-gradient(to right, #ff0000, #00ff00)", headerBGC: "linear-gradient(to right, #ff0000, #00ff00)",
@ -203,15 +190,12 @@ const configs = reactive({
evenRowBGC: "", evenRowBGC: "",
rowNum: 20, rowNum: 20,
header: [ 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>`,
`<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: [ data: [
] ]
@ -223,7 +207,6 @@ const configs2 = reactive({
evenRowBGC: "", evenRowBGC: "",
rowNum: 20, rowNum: 20,
header: [ 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);'>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>`,
`<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) 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> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -284,7 +295,7 @@ onMounted(() => {
.btn { .btn {
color: white; color: white;
// border: 1px solid #BF6D5D; // border: 1px solid #BF6D5D;
background-image: url('static/index/btn.png'); background-image: url('/static/index/btn.png');
background-size: 100% 100%; background-size: 100% 100%;
padding: 1vh 1vw; padding: 1vh 1vw;
border-radius: 20px; border-radius: 20px;

File diff suppressed because it is too large Load Diff

View File

@ -7,7 +7,17 @@
<script setup> <script setup>
import Header from "@/components/Header.vue" import Header from "@/components/Header.vue"
import { useRoute } from "vue-router"; 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> </script>

View File

@ -6,24 +6,24 @@
<div class="box" :style="{ opacity: showLoading ? 0 : 1 }"> <div class="box" :style="{ opacity: showLoading ? 0 : 1 }">
<div class="body"> <div class="body">
<div class="l"> <div class="l">
<topLeft :areaCodes="areaCodes" /> <topLeft :areaCodes="areaStore.area" :key="areaStore.area.areaCode" />
</div> </div>
<div class="c" id=""> <div class="c" id="">
<topCenter :areaCodes="areaCodes"></topCenter> <topCenter :areaCodes="areaStore.area" :key="areaStore.area.areaCode"></topCenter>
</div> </div>
<div class="r"> <div class="r">
<topRight :areaCodes="areaCodes"></topRight> <topRight :areaCodes="areaStore.area" :key="areaStore.area.areaCode"></topRight>
</div> </div>
</div> </div>
<div class="foot"> <div class="foot">
<div class="foot-l"> <div class="foot-l">
<bottomLeft :areaCodes="areaCodes"></bottomLeft> <bottomLeft :areaCodes="areaStore.area" :key="areaStore.area.areaCode"></bottomLeft>
</div> </div>
<div class="c"> <div class="c">
<bottomCenter :areaCodes="areaCodes"></bottomCenter> <bottomCenter :areaCodes="areaStore.area" :key="areaStore.area.areaCode"></bottomCenter>
</div> </div>
<div class="r"> <div class="r">
<bottomRight :areaCodes="areaCodes"></bottomRight> <bottomRight :areaCodes="areaStore.area" :key="areaStore.area.areaCode"></bottomRight>
</div> </div>
</div> </div>
</div> </div>
@ -38,21 +38,22 @@ import bottomLeft from "@/components/index/bottomLeft.vue"
import bottomCenter from "@/components/index/bottomCenter.vue" import bottomCenter from "@/components/index/bottomCenter.vue"
import bottomRight from "@/components/index/bottomRight.vue" import bottomRight from "@/components/index/bottomRight.vue"
import { areaObj } from '@/store/index.js' import { areaObj } from '@/store/index.js'
import { useRouter } from "vue-router" import { useRouter, useRoute } from "vue-router"
const router = useRouter() const route = useRoute()
const showLoading = ref(true) const showLoading = ref(true)
const areaStore = areaObj() const areaStore = areaObj()
const areaCodes = reactive({ const areaCodes = reactive({
...areaStore.area ...areaStore.area
}) })
setTimeout(() => { setTimeout(() => {
showLoading.value = false showLoading.value = false
}, 1000); }, 500);
// if (route.query?.type) { localStorage.setItem("TRADE_TYPE", true) }
// else {
// localStorage.setItem("TRADE_TYPE", false)
// }
</script> </script>
<style lang="scss"> <style lang="scss">
@keyframes jump { @keyframes jump {

View File

@ -46,8 +46,8 @@ const areaStroe = areaObj()
const router = useRouter() const router = useRouter()
const role = ref(null) const role = ref(null)
const show = ref(false) const show = ref(false)
const account = ref('叙永镇') const account = ref('')
const password = ref('xuyognzheng') const password = ref('')
const isAccount = ref(false) const isAccount = ref(false)
const isPassword = ref(false) const isPassword = ref(false)
const isRole = ref(false) const isRole = ref(false)
@ -94,9 +94,7 @@ const submit = () => {
}).then(res => { }).then(res => {
if (res.data.user.street_code) { if (res.data.user.street_code) {
role.value = 3 role.value = 3
res.data.role = role.value res.data.role = role.value
localStorage.setItem("TRADE_USER", JSON.stringify(res.data)) localStorage.setItem("TRADE_USER", JSON.stringify(res.data))
let { area_code, street_code } = res.data.user let { area_code, street_code } = res.data.user

View File

@ -1,19 +1,6 @@
import * as echarts from 'echarts'; import * as echarts from 'echarts';
let angle = 0;//角度,用来做简单的动画效果的 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 = { const optins = {

View File

@ -33,6 +33,8 @@ import { ref, reactive, onMounted } from "vue"
import Bill from "@/components/Bill.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 { order_listApi, order_list_count_titleApi, refund_order_listApi, take_order_listApi, take_order_count_titleApi } from "@/api.js"
import { areaObj } from "../store"; import { areaObj } from "../store";
import { globalEventBus } from '@/common/eventBus'
const areaStore = areaObj() const areaStore = areaObj()
const billList = reactive([ const billList = reactive([
{ {
@ -208,9 +210,11 @@ const tableHdClick = (e) => {
// console.log(e.rowIndex) // console.log(e.rowIndex)
let tag = document.getElementById(`order${e.rowIndex}`) let tag = document.getElementById(`order${e.rowIndex}`)
let tag2 = document.getElementById(`card${e.rowIndex}`) let tag2 = document.getElementById(`card${e.rowIndex}`)
tag.style.display = 'none' // tag.style.display = 'none'
tag2.style.display = 'block' // tag2.style.display = 'block'
console.log(e.rowIndex)
console.log(tag)
console.log(tag2)
} else { } else {
let tag = document.getElementsByClassName(`order`) let tag = document.getElementsByClassName(`order`)
@ -834,6 +838,23 @@ const configs3 = reactive({
onMounted(() => { onMounted(() => {
hdClick(0) 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> </script>
@ -873,7 +894,7 @@ onMounted(() => {
.btn { .btn {
color: white; color: white;
// border: 1px solid #BF6D5D; // border: 1px solid #BF6D5D;
background-image: url('static/index/btn.png'); background-image: url('/static/index/btn.png');
background-size: 100% 100%; background-size: 100% 100%;
padding: 1vh 1vw; padding: 1vh 1vw;
border-radius: 20px; border-radius: 20px;
@ -883,7 +904,6 @@ onMounted(() => {
} }
.act-btn { .act-btn {
background-image: url('/static/index/actbg.png'); background-image: url('/static/index/actbg.png');
background-size: 100% 100%; background-size: 100% 100%;
border: none; border: none;

View File

@ -124,24 +124,18 @@
</div> </div>
</div> </div>
<div class="bottom"> <div class="bottom">
<div class="ranking"> <div class="ranking">
<img src="/static/storeLogin/SPXSPH.png" class="img-cls" alt=""> <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>
<div class="ranking"> <div class="ranking">
<img src="/static/storeLogin/SPFKPH.png" class="img-cls" alt=""> <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>
<div class="ranking"> <div class="ranking">
<img src="/static/storeLogin/SPJGPH.png" class="img-cls" alt=""> <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>
</div> </div>
</template> </template>
@ -151,20 +145,18 @@
import { ref, reactive, onMounted, watch } from "vue" import { ref, reactive, onMounted, watch } from "vue"
import { merchant_count_mainApi, merchant_product_rankingApi, merchant_product_visitApi, merchant_product_cartApi, } from "@/api.js" import { merchant_count_mainApi, merchant_product_rankingApi, merchant_product_visitApi, merchant_product_cartApi, } from "@/api.js"
import { areaObj } from "../store"; import { areaObj } from "../store";
import { globalEventBus } from '@/common/eventBus'
const areaStore = areaObj() const areaStore = areaObj()
let query let query;
let userInfo = JSON.parse(localStorage.getItem('TRADE_USER')) 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)
// console.log const showConfig3=ref(false)
if (areaStore.userInfo.user?.merchant) { if (areaStore.userInfo.user?.merchant) {
let { area_id, mer_id, street_id } = areaStore.userInfo.user?.merchant let { area_id, mer_id, street_id } = areaStore.userInfo.user?.merchant
console.log(area_id, 5645545)
query = { query = {
areaCode: area_id, areaCode: area_id,
streetCode: street_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({ const config1 = reactive({
oddRowBGC: "#001C2E", oddRowBGC: "#001C2E",
@ -253,6 +251,10 @@ let total3 = ''
const init = () => { const init = () => {
showConfig1.value=false
showConfig2.value=false
showConfig3.value=false
merchant_product_rankingApi( merchant_product_rankingApi(
{ ...query, start_date: areaStore.time[0], end_date: areaStore.time[1] } { ...query, start_date: areaStore.time[0], end_date: areaStore.time[1] }
).then(res => { ).then(res => {
@ -280,7 +282,7 @@ const init = () => {
init() init()
const addData1 = (data) => { const addData1 = (data) => {
config1.data.splice(0,99999999) config1.data.splice(0, 99999999)
data.forEach((item, i) => { data.forEach((item, i) => {
config1.data.push( 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='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=' 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> `<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>`, </div>`,
] ]
) )
}) })
showConfig1.value=true
} }
const addData2 = (data) => { const addData2 = (data) => {
config2.data.splice(0,99999999) config2.data.splice(0, 99999999)
data.forEach((item, i) => { data.forEach((item, i) => {
config2.data.push( 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='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=' 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> `<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>`, </div>`,
] ]
) )
}) })
showConfig2.value=true
} }
const addData3 = (data) => { const addData3 = (data) => {
config3.data.splice(0, 99999999)
config3.data.splice(0,99999999)
data.forEach((item, i) => { data.forEach((item, i) => {
config3.data.push( 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='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=' 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> `<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>`, </div>`,
] ]
) )
}) })
showConfig3.value=true
} }
@ -351,7 +351,7 @@ merchant_count_mainApi(
watch( watch(
() => areaStore.time, () => areaStore.time,
(value, oldValue) => { (value, oldValue) => {
init() init()
}, { }, {
deep: true, 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> </script>

View File

@ -3,9 +3,7 @@
<dv-loading>Loading...</dv-loading> <dv-loading>Loading...</dv-loading>
</div> </div>
<div :style="{ opacity: show ? 0 : 1 }"> <div :style="{ opacity: show ? 0 : 1 }">
<div class="top box"> <div class="top box">
<div class="l"> <div class="l">
<topLeft :code="route.query.code" :key="route.query.code"></topLeft> <topLeft :code="route.query.code" :key="route.query.code"></topLeft>
@ -16,12 +14,9 @@
<div class="r"> <div class="r">
<topRight :code="route.query.code" :key="route.query.code"></topRight> <topRight :code="route.query.code" :key="route.query.code"></topRight>
</div> </div>
</div> </div>
<div class="bottom box"> <div class="bottom box">
<div class="l"> <div class="l">
<bottomleft :code="route.query.code" :key="route.query.code"></bottomleft> <bottomleft :code="route.query.code" :key="route.query.code"></bottomleft>
</div> </div>
<div class="c"> <div class="c">
@ -29,45 +24,37 @@
</div> </div>
<div class="r"> <div class="r">
<bottomRight :code="route.query.code" :key="route.query.code"></bottomRight> <bottomRight :code="route.query.code" :key="route.query.code"></bottomRight>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script setup> <script setup>
import { onMounted } from 'vue'; import { onMounted } from "vue";
import bottomRight from "@/components/townDetail/bottomRight.vue" import bottomRight from "@/components/townDetail/bottomRight.vue";
import bottomCenter from "@/components/townDetail/bottomCenter.vue" import bottomCenter from "@/components/townDetail/bottomCenter.vue";
import bottomleft from "@/components/townDetail/bottomleft.vue" import bottomleft from "@/components/townDetail/bottomleft.vue";
import { useRoute } from 'vue-router'; import { useRoute } from "vue-router";
import topCenter from "@/components/townDetail/topCenter.vue" import topCenter from "@/components/townDetail/topCenter.vue";
import topLeft from "@/components/townDetail/topLeft.vue" import topLeft from "@/components/townDetail/topLeft.vue";
import topRight from "@/components/townDetail/topRight.vue" import topRight from "@/components/townDetail/topRight.vue";
import { ref } from 'vue' import { ref } from "vue";
const show = ref(true) const show = ref(true);
const route = useRoute()
const route = useRoute();
onMounted(() => { onMounted(() => {
setTimeout(() => { setTimeout(() => {
show.value = false show.value = false;
}, 1000) }, 1000);
});
})
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.box { .box {
width: 100vw; width: 100vw;
height: 47vh; height: 47vh;
box-sizing: border-box; box-sizing: border-box;
} }
.top { .top {
@ -83,9 +70,6 @@ onMounted(() => {
box-sizing: border-box; box-sizing: border-box;
position: relative; position: relative;
padding-top: 6vh; padding-top: 6vh;
} }
.c { .c {
@ -95,19 +79,13 @@ onMounted(() => {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
} }
.r { .r {
width: 25vw; width: 25vw;
height: 46vh; height: 46vh;
position: relative; position: relative;
// background-color: RED; // background-color: RED;
} }
} }
@ -119,35 +97,26 @@ onMounted(() => {
.l { .l {
// flex: 1; // flex: 1;
width: 25VW; width: 25vw;
height: 46vh; height: 46vh;
position: relative; position: relative;
} }
.c { .c {
width: 48VW; width: 48vw;
height: 46vh; height: 46vh;
position: relative; position: relative;
} }
.r { .r {
width: 25VW; width: 25vw;
height: 46vh; height: 46vh;
position: relative; position: relative;
} }
} }
.center { .center {
position: absolute; position: absolute;
top: 50%; top: 50%;
@ -159,7 +128,7 @@ onMounted(() => {
transform: translateY(12px); transform: translateY(12px);
width: 100%; width: 100%;
height: 10px; height: 10px;
background-color: #122E3F; background-color: #122e3f;
// border-radius: 10px; // border-radius: 10px;
overflow: hidden; overflow: hidden;
} }
@ -167,7 +136,7 @@ onMounted(() => {
.progress { .progress {
width: 70%; width: 70%;
height: 100%; height: 100%;
background: linear-gradient(to right, #455CCC, #51C2E0); background: linear-gradient(to right, #455ccc, #51c2e0);
transition: width 0.5s ease-in-out; transition: width 0.5s ease-in-out;
} }

746
static/push.js Normal file
View File

@ -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('&');
}

View File

@ -5,7 +5,8 @@ import postCssPxToRem from 'postcss-pxtorem'
export default defineConfig({ export default defineConfig({
plugins: [vue()], plugins: [vue()],
server: { // ← ← ← ← ← ← server: { // ← ← ← ← ← ←
host: '0.0.0.0' // ← 新增内容 ← host: '0.0.0.0' ,// ← 新增内容 ←
port:"8891"
}, },
resolve: { resolve: {
//别名配置引用src路径下的东西可以通过@如import Layout from '@/layout/index.vue' //别名配置引用src路径下的东西可以通过@如import Layout from '@/layout/index.vue'