大屏在同一标签页跳转
This commit is contained in:
parent
f724600ba2
commit
69bfee5580
@ -5,6 +5,10 @@ module.exports = {
|
||||
es2021: true,
|
||||
node: true,
|
||||
},
|
||||
globals: {
|
||||
BASE_API: 'readonly',
|
||||
API_URL_PRE: 'readonly',
|
||||
},
|
||||
parser: 'vue-eslint-parser',
|
||||
parserOptions: {
|
||||
ecmaVersion: 12,
|
||||
|
22
config.js
Normal file
22
config.js
Normal file
@ -0,0 +1,22 @@
|
||||
const BASE_API = {
|
||||
SERVER_IP: 'http://www.linxyun.com',
|
||||
// SERVER_IP: 'http://121.229.160.133:8088',
|
||||
GetFileConfigUrl: '/smartroadlamp/genFileConfig.action',
|
||||
// 部署时是否要加前缀,后端API地址需要统计加上这串,当部署不需要时,该串配置成空串就可以
|
||||
URL_PRE: '',
|
||||
// 显示的项目名称
|
||||
PROJECT_NAME: '智慧路灯',
|
||||
PROJECT_URI: '/smartroadlamp',
|
||||
ContainCustmerID: '0',
|
||||
CustomerType: 1,
|
||||
// 项目ID
|
||||
ENT_CODE: '56',
|
||||
SubSysID: '2',
|
||||
// 提示消息显示时长
|
||||
MSG_SHOW_TIME: 3000,
|
||||
IS_TEST: false,
|
||||
// 是否开启国际化
|
||||
I18N: false,
|
||||
// 管理员角色编码
|
||||
MANAGER_ROLE: '2101'
|
||||
}
|
@ -13,6 +13,7 @@
|
||||
content="vue-next-admin,基于 vue3 + CompositionAPI + typescript + vite + element plus,适配手机、平板、pc 的后台开源免费管理系统模板!vue-prev-admin,基于 vue2 + element ui,适配手机、平板、pc 的后台开源免费管理系统模板!"
|
||||
/>
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
<script src="./config.js"></script>
|
||||
<title>vue-next-admin</title>
|
||||
</head>
|
||||
<body>
|
||||
|
6
plugins.d.ts
vendored
Normal file
6
plugins.d.ts
vendored
Normal file
@ -0,0 +1,6 @@
|
||||
/* eslint-disable */
|
||||
declare module 'vue-grid-layout';
|
||||
declare module 'qrcodejs2-fixes';
|
||||
declare module 'splitpanes';
|
||||
declare module 'js-cookie';
|
||||
declare const BASE_API: any;
|
35
src/api/linxyun/common.ts
Normal file
35
src/api/linxyun/common.ts
Normal file
@ -0,0 +1,35 @@
|
||||
import request from '/@/utils/request';
|
||||
import { getApiUrl } from '/@/api/linxyun/linxyunapi';
|
||||
|
||||
// 获取所有数据
|
||||
export const getAllData = async (uriName: string) => {
|
||||
const records = [];
|
||||
let url = getApiUrl(uriName);
|
||||
let current = 1;
|
||||
let limit = 399;
|
||||
|
||||
while (true) {
|
||||
try {
|
||||
const response = await request({
|
||||
url: url,
|
||||
method: 'get',
|
||||
params: { current, limit }
|
||||
});
|
||||
|
||||
console.log("分页:", response);
|
||||
if (response.Records.length === 0) {
|
||||
console.log("分页结束: ", response);
|
||||
break;
|
||||
}
|
||||
// 将当前页的数据合并到 records 中
|
||||
records.push(...response.Records);
|
||||
|
||||
// 更新 current 或其他分页条件
|
||||
current++;
|
||||
} catch (error) {
|
||||
console.error('请求出错:', error);
|
||||
break;
|
||||
}
|
||||
}
|
||||
return records;
|
||||
};
|
@ -1,4 +1,3 @@
|
||||
import {BASE_API} from '/@/config.js'
|
||||
const apiUrl = new Map<string, string>();
|
||||
// apiurl.set('queryEnumOptions', '/eslithe/queryEnumOptionsNew.action');
|
||||
// apiurl.set('addEnumOptions', '/eslithe/add_dev_enum_options.action');
|
||||
@ -12,7 +11,7 @@ export function getApiUrl(apiName: string) {
|
||||
// 全量Url
|
||||
url = apiName;
|
||||
} else {
|
||||
let uri = '';
|
||||
let uri: string | undefined = '';
|
||||
if (apiName.indexOf('/') === 0) {
|
||||
//全量URI
|
||||
uri = apiName;
|
||||
|
@ -5,7 +5,6 @@
|
||||
<script setup>
|
||||
import { onMounted, onUnmounted, ref, defineProps, toRefs, watch } from "vue";
|
||||
import AMapLoader from "@amap/amap-jsapi-loader";
|
||||
import coordtransform from 'coordtransform';
|
||||
const props = defineProps({
|
||||
markerData: {
|
||||
type: Object,
|
||||
|
@ -1,65 +0,0 @@
|
||||
var BASE_URL = ''
|
||||
var BASE_API = null
|
||||
if (process.env.NODE_ENV == 'development') {
|
||||
BASE_API = {
|
||||
SERVER_IP: 'http://www.linxyun.com',
|
||||
// SERVER_IP: 'http://121.229.160.133:8088',
|
||||
GetFileConfigUrl: '/smartroadlamp/genFileConfig.action',
|
||||
// 部署时是否要加前缀,后端API地址需要统计加上这串,当部署不需要时,该串配置成空串就可以
|
||||
URL_PRE: '',
|
||||
// 显示的项目名称
|
||||
PROJECT_NAME: '智慧路灯',
|
||||
PROJECT_URI: '/smartroadlamp',
|
||||
ContainCustmerID: '0',
|
||||
CustomerType: 1,
|
||||
// 项目ID
|
||||
ENT_CODE: '56',
|
||||
SubSysID: '2',
|
||||
// 提示消息显示时长
|
||||
MSG_SHOW_TIME: 3000,
|
||||
IS_TEST: false,
|
||||
// 是否开启国际化
|
||||
I18N: false,
|
||||
// 管理员角色编码
|
||||
MANAGER_ROLE: '2101'
|
||||
}
|
||||
BASE_URL = BASE_API.SERVER_IP + BASE_API.URL_PRE + BASE_API.PROJECT_URI // qe环境
|
||||
// BASE_URL = 'http://dev.linxyun.com:8080'
|
||||
// BASE_URL = 'http://42.192.98.233:8080/usercenter' // qe环境
|
||||
} else {
|
||||
BASE_API = {
|
||||
SERVER_IP: 'http://www.linxyun.com',
|
||||
GetFileConfigUrl: '/smartroadlamp/genFileConfig.action',
|
||||
// 部署时是否要加前缀,后端API地址需要统计加上这串,当部署不需要时,该串配置成空串就可以
|
||||
URL_PRE: '',
|
||||
// 显示的项目名称
|
||||
PROJECT_NAME: '智慧路灯',
|
||||
PROJECT_URI: '/smartroadlamp',
|
||||
ContainCustmerID: '0',
|
||||
CustomerType: 1,
|
||||
// 项目ID
|
||||
ENT_CODE: '56',
|
||||
SubSysID: '2',
|
||||
// 提示消息显示时长
|
||||
MSG_SHOW_TIME: 3000,
|
||||
IS_TEST: false,
|
||||
// 是否开启国际化
|
||||
I18N: false,
|
||||
// 管理员角色编码
|
||||
MANAGER_ROLE: '2100'
|
||||
}
|
||||
BASE_URL = BASE_API.SERVER_IP + BASE_API.URL_PRE + BASE_API.PROJECT_URI // 生产环境
|
||||
// BASE_URL = 'http://dev.linxyun.com:8080'
|
||||
}
|
||||
//http://dev.linxyun.com:8080
|
||||
const config = {
|
||||
base_url: BASE_API.SERVER_IP + BASE_API.URL_PRE,
|
||||
project_url: BASE_API.URL_PRE + BASE_API.PROJECT_URI,
|
||||
project_pre: BASE_API.URL_PRE,
|
||||
server_addr: BASE_API.SERVER_IP,
|
||||
ent_code: BASE_API.ENT_CODE,
|
||||
msg_show_time: BASE_API.MSG_SHOW_TIME,
|
||||
sub_sys_id: BASE_API.SubSysID
|
||||
}
|
||||
|
||||
export { config, BASE_API }
|
@ -73,11 +73,10 @@ export default {
|
||||
layoutLinkView: '外链',
|
||||
layoutIframeViewOne: '内嵌 iframe1',
|
||||
layoutIframeViewTwo: '内嵌 iframe2',
|
||||
visualizingIndex: '可视化',
|
||||
visualizingDeviceManagement: '设备管理',
|
||||
visualizingEventList: '事件列表',
|
||||
visualizingEventHandle: '事件处理',
|
||||
visualizingDataStatistics: '数据统计'
|
||||
deviceManagement: '设备管理',
|
||||
eventList: '事件列表',
|
||||
eventHandle: '事件处理',
|
||||
dataStatistics: '数据统计'
|
||||
},
|
||||
staticRoutes: {
|
||||
signIn: '登录',
|
||||
|
@ -50,18 +50,74 @@ export const dynamicRoutes: Array<RouteRecordRaw> = [
|
||||
{
|
||||
path: '/home',
|
||||
name: 'home',
|
||||
component: () => import('/@/views/home/index.vue'),
|
||||
component: () => import('/@/views/visualizing/index.vue'),
|
||||
meta: {
|
||||
title: 'message.router.home',
|
||||
isLink: '',
|
||||
isHide: false,
|
||||
isKeepAlive: true,
|
||||
isAffix: true,
|
||||
isIframe: false,
|
||||
roles: ['admin', 'common'],
|
||||
roles: ['admin'],
|
||||
icon: 'iconfont icon-shouye',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/deviceManagement',
|
||||
name: 'deviceManagement',
|
||||
component: () => import('/@/views/visualizing/deviceManagement.vue'),
|
||||
meta: {
|
||||
title: 'message.router.deviceManagement',
|
||||
isHide: false,
|
||||
isKeepAlive: false,
|
||||
isAffix: false,
|
||||
isIframe: false,
|
||||
roles: ['admin'],
|
||||
icon: 'iconfont icon-caozuo-wailian',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/eventHandle',
|
||||
name: 'eventHandle',
|
||||
component: () => import('/@/views/visualizing/eventHandle.vue'),
|
||||
meta: {
|
||||
title: 'message.router.eventHandle',
|
||||
isLink: '/visualizingEventHandle',
|
||||
isHide: false,
|
||||
isKeepAlive: false,
|
||||
isAffix: false,
|
||||
isIframe: false,
|
||||
roles: ['admin'],
|
||||
icon: 'iconfont icon-caozuo-wailian',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/eventList',
|
||||
name: 'eventList',
|
||||
component: () => import('/@/views/visualizing/eventList.vue'),
|
||||
meta: {
|
||||
title: 'message.router.eventList',
|
||||
isHide: false,
|
||||
isKeepAlive: false,
|
||||
isAffix: false,
|
||||
isIframe: false,
|
||||
roles: ['admin'],
|
||||
icon: 'iconfont icon-caozuo-wailian',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/dataStatistics',
|
||||
name: 'dataStatistics',
|
||||
component: () => import('/@/views/visualizing/dataStatistics.vue'),
|
||||
meta: {
|
||||
title: 'message.router.dataStatistics',
|
||||
isHide: false,
|
||||
isKeepAlive: false,
|
||||
isAffix: false,
|
||||
isIframe: false,
|
||||
roles: ['admin'],
|
||||
icon: 'iconfont icon-caozuo-wailian',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/system',
|
||||
name: 'system',
|
||||
@ -1057,81 +1113,81 @@ export const dynamicRoutes: Array<RouteRecordRaw> = [
|
||||
* isLink 链接为内置的路由地址,地址为 staticRoutes 中定义
|
||||
*/
|
||||
children: [
|
||||
{
|
||||
path: '/visualizing/index',
|
||||
name: 'RootVisualizingIndex',
|
||||
component: () => import('/@/layout/routerView/link.vue'),
|
||||
meta: {
|
||||
title: 'message.router.visualizingIndex',
|
||||
isLink: '/visualizingIndex',
|
||||
isHide: false,
|
||||
isKeepAlive: false,
|
||||
isAffix: false,
|
||||
isIframe: false,
|
||||
roles: ['admin'],
|
||||
icon: 'iconfont icon-caozuo-wailian',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/visualizing/deviceManagement',
|
||||
name: 'RootVisualizingDeviceManagement',
|
||||
component: () => import('/@/layout/routerView/link.vue'),
|
||||
meta: {
|
||||
title: 'message.router.visualizingDeviceManagement',
|
||||
isLink: '/visualizingDeviceManagement',
|
||||
isHide: false,
|
||||
isKeepAlive: false,
|
||||
isAffix: false,
|
||||
isIframe: false,
|
||||
roles: ['admin'],
|
||||
icon: 'iconfont icon-caozuo-wailian',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/visualizing/eventHandle',
|
||||
name: 'RootVisualizingEventHandle',
|
||||
component: () => import('/@/layout/routerView/link.vue'),
|
||||
meta: {
|
||||
title: 'message.router.visualizingEventHandle',
|
||||
isLink: '/visualizingEventHandle',
|
||||
isHide: false,
|
||||
isKeepAlive: false,
|
||||
isAffix: false,
|
||||
isIframe: false,
|
||||
roles: ['admin'],
|
||||
icon: 'iconfont icon-caozuo-wailian',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/visualizing/eventList',
|
||||
name: 'RootVisualizingEventList',
|
||||
component: () => import('/@/layout/routerView/link.vue'),
|
||||
meta: {
|
||||
title: 'message.router.visualizingEventList',
|
||||
isLink: '/visualizingEventList',
|
||||
isHide: false,
|
||||
isKeepAlive: false,
|
||||
isAffix: false,
|
||||
isIframe: false,
|
||||
roles: ['admin'],
|
||||
icon: 'iconfont icon-caozuo-wailian',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/visualizing/dataStatistics',
|
||||
name: 'RootVisualizingDataStatistics',
|
||||
component: () => import('/@/layout/routerView/link.vue'),
|
||||
meta: {
|
||||
title: 'message.router.visualizingDataStatistics',
|
||||
isLink: '/visualizingDataStatistics',
|
||||
isHide: false,
|
||||
isKeepAlive: false,
|
||||
isAffix: false,
|
||||
isIframe: false,
|
||||
roles: ['admin'],
|
||||
icon: 'iconfont icon-caozuo-wailian',
|
||||
},
|
||||
},
|
||||
// {
|
||||
// path: '/visualizing/index',
|
||||
// name: 'RootVisualizingIndex',
|
||||
// component: () => import('/@/layout/routerView/link.vue'),
|
||||
// meta: {
|
||||
// title: 'message.router.visualizingIndex',
|
||||
// isLink: '/visualizingIndex',
|
||||
// isHide: false,
|
||||
// isKeepAlive: false,
|
||||
// isAffix: false,
|
||||
// isIframe: false,
|
||||
// roles: ['admin'],
|
||||
// icon: 'iconfont icon-caozuo-wailian',
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// path: '/visualizing/deviceManagement',
|
||||
// name: 'RootVisualizingDeviceManagement',
|
||||
// component: () => import('/@/layout/routerView/link.vue'),
|
||||
// meta: {
|
||||
// title: 'message.router.visualizingDeviceManagement',
|
||||
// isLink: '/visualizingDeviceManagement',
|
||||
// isHide: false,
|
||||
// isKeepAlive: false,
|
||||
// isAffix: false,
|
||||
// isIframe: false,
|
||||
// roles: ['admin'],
|
||||
// icon: 'iconfont icon-caozuo-wailian',
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// path: '/visualizing/eventHandle',
|
||||
// name: 'RootVisualizingEventHandle',
|
||||
// component: () => import('/@/layout/routerView/link.vue'),
|
||||
// meta: {
|
||||
// title: 'message.router.visualizingEventHandle',
|
||||
// isLink: '/visualizingEventHandle',
|
||||
// isHide: false,
|
||||
// isKeepAlive: false,
|
||||
// isAffix: false,
|
||||
// isIframe: false,
|
||||
// roles: ['admin'],
|
||||
// icon: 'iconfont icon-caozuo-wailian',
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// path: '/visualizing/eventList',
|
||||
// name: 'RootVisualizingEventList',
|
||||
// component: () => import('/@/layout/routerView/link.vue'),
|
||||
// meta: {
|
||||
// title: 'message.router.visualizingEventList',
|
||||
// isLink: '/visualizingEventList',
|
||||
// isHide: false,
|
||||
// isKeepAlive: false,
|
||||
// isAffix: false,
|
||||
// isIframe: false,
|
||||
// roles: ['admin'],
|
||||
// icon: 'iconfont icon-caozuo-wailian',
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// path: '/visualizing/dataStatistics',
|
||||
// name: 'RootVisualizingDataStatistics',
|
||||
// component: () => import('/@/layout/routerView/link.vue'),
|
||||
// meta: {
|
||||
// title: 'message.router.visualizingDataStatistics',
|
||||
// isLink: '/visualizingDataStatistics',
|
||||
// isHide: false,
|
||||
// isKeepAlive: false,
|
||||
// isAffix: false,
|
||||
// isIframe: false,
|
||||
// roles: ['admin'],
|
||||
// icon: 'iconfont icon-caozuo-wailian',
|
||||
// },
|
||||
// },
|
||||
],
|
||||
},
|
||||
{
|
||||
@ -1272,44 +1328,44 @@ export const staticRoutes: Array<RouteRecordRaw> = [
|
||||
* 提示:写在这里的为全屏界面,不建议写在这里
|
||||
* 请写在 `dynamicRoutes` 路由数组中
|
||||
*/
|
||||
{
|
||||
path: '/visualizingIndex',
|
||||
name: 'visualizingIndex',
|
||||
component: () => import('/@/views/visualizing/index.vue'),
|
||||
meta: {
|
||||
title: 'message.router.visualizingIndex',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/visualizingDeviceManagement',
|
||||
name: 'visualizingDeviceManagement',
|
||||
component: () => import('/@/views/visualizing/deviceManagement.vue'),
|
||||
meta: {
|
||||
title: 'message.router.visualizingDeviceManagement',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/visualizingEventHandle',
|
||||
name: 'visualizingEventHandle',
|
||||
component: () => import('/@/views/visualizing/eventHandle.vue'),
|
||||
meta: {
|
||||
title: 'message.router.visualizingEventHandle'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/visualizingEventList',
|
||||
name: 'visualizingEventList',
|
||||
component: () => import('/@/views/visualizing/eventList.vue'),
|
||||
meta: {
|
||||
title: 'message.router.visualizingEventList'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/visualizingDataStatistics',
|
||||
name: 'visualizingDataStatistics',
|
||||
component: () => import('/@/views/visualizing/dataStatistics.vue'),
|
||||
meta: {
|
||||
title: 'message.router.visualizingDataStatistics'
|
||||
}
|
||||
},
|
||||
// {
|
||||
// path: '/visualizingIndex',
|
||||
// name: 'visualizingIndex',
|
||||
// component: () => import('/@/views/visualizing/index.vue'),
|
||||
// meta: {
|
||||
// title: 'message.router.visualizingIndex',
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// path: '/visualizingDeviceManagement',
|
||||
// name: 'visualizingDeviceManagement',
|
||||
// component: () => import('/@/views/visualizing/deviceManagement.vue'),
|
||||
// meta: {
|
||||
// title: 'message.router.visualizingDeviceManagement',
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// path: '/visualizingEventHandle',
|
||||
// name: 'visualizingEventHandle',
|
||||
// component: () => import('/@/views/visualizing/eventHandle.vue'),
|
||||
// meta: {
|
||||
// title: 'message.router.visualizingEventHandle'
|
||||
// }
|
||||
// },
|
||||
// {
|
||||
// path: '/visualizingEventList',
|
||||
// name: 'visualizingEventList',
|
||||
// component: () => import('/@/views/visualizing/eventList.vue'),
|
||||
// meta: {
|
||||
// title: 'message.router.visualizingEventList'
|
||||
// }
|
||||
// },
|
||||
// {
|
||||
// path: '/visualizingDataStatistics',
|
||||
// name: 'visualizingDataStatistics',
|
||||
// component: () => import('/@/views/visualizing/dataStatistics.vue'),
|
||||
// meta: {
|
||||
// title: 'message.router.visualizingDataStatistics'
|
||||
// }
|
||||
// },
|
||||
];
|
||||
|
@ -5,7 +5,6 @@ import { Session } from '/@/utils/storage';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { useErrorInfo } from '/@/stores/errorInfo';
|
||||
import { UserInfosState } from '/@/stores/interface';
|
||||
import {BASE_API} from '/@/config.js'
|
||||
|
||||
|
||||
// 配置新建一个 axios 实例
|
||||
|
@ -76,10 +76,10 @@
|
||||
</div>
|
||||
|
||||
<div class="control-buttons">
|
||||
<button>预警管理</button>
|
||||
<button class="active" @click="router.push('/home')">数据统计</button>
|
||||
<button @click="router.push('/eventList')">预警管理</button>
|
||||
<button class="active" @click="router.push('/dataStatistics')">数据统计</button>
|
||||
</div>
|
||||
<EventPopUp :visible="false"/>
|
||||
<EventPopUp :visible="true"/>
|
||||
<LampPopUp :visible="false"/>
|
||||
<ScreenPopUp :visible="false"/>
|
||||
<BroadcastPopUp :visible="false"/>
|
||||
|
@ -19,7 +19,7 @@
|
||||
<img :src="item.icon" alt="">
|
||||
<div class="total">
|
||||
<div class="label">{{ item.title.substring(0, 2) }}总数</div>
|
||||
<div class="value">3900</div>
|
||||
<div class="value">{{ item.total }}</div>
|
||||
</div>
|
||||
<div class="online-rate">
|
||||
<div class="label">在线率</div>
|
||||
@ -33,18 +33,17 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-buttons">
|
||||
<button >可视化</button>
|
||||
<button class="active" @click="router.push('/home')">设备管理</button>
|
||||
<button @click="router.push('/home')">可视化</button>
|
||||
<button class="active" @click="router.push('/deviceManagement')">设备管理</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { defineAsyncComponent, computed, ref, onBeforeMount, onMounted, onUnmounted, nextTick, watch } from 'vue';
|
||||
import * as echarts from 'echarts';
|
||||
import { defineAsyncComponent, ref, onMounted} from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { NextLoading } from '/@/utils/loading';
|
||||
import { CirclePlus, Remove } from '@element-plus/icons-vue'
|
||||
import { getAllData } from '/@/api/linxyun/common'
|
||||
const Map = defineAsyncComponent(() => import('/@/components/map/index.vue'));
|
||||
const router = useRouter();
|
||||
import IconLamp from '/@/assets/icon-lamp.png'
|
||||
@ -52,14 +51,15 @@ import IconCamera from '/@/assets/icon-camera.png'
|
||||
import IconScreen from '/@/assets/icon-screen.png'
|
||||
import IconBroadcast from '/@/assets/icon-broadcast.png'
|
||||
|
||||
|
||||
const data = ref([
|
||||
{
|
||||
id: 1,
|
||||
title: '路灯管理',
|
||||
icon: IconLamp,
|
||||
total: 3900,
|
||||
onlineRate: 80,
|
||||
contactLossRate: 20
|
||||
total: 0,
|
||||
onlineRate: 0,
|
||||
contactLossRate: 0
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
@ -112,32 +112,33 @@ const options = [
|
||||
|
||||
|
||||
const markerData = ref({
|
||||
"lamps": [
|
||||
[118.853, 32.065],
|
||||
[118.855, 32.062],
|
||||
[118.851, 32.066]
|
||||
lamps: [
|
||||
],
|
||||
"cameras": [
|
||||
[118.854, 32.067],
|
||||
[118.852, 32.063],
|
||||
[118.856, 32.064]
|
||||
cameras: [
|
||||
],
|
||||
"screens": [
|
||||
[118.854, 32.061],
|
||||
[118.850, 32.068],
|
||||
[118.857, 32.062]
|
||||
screens: [
|
||||
]
|
||||
}
|
||||
)
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
// 获取浏览器的分辨率(窗口的宽度和高度)
|
||||
let width = window.innerWidth;
|
||||
let height = window.innerHeight;
|
||||
console.log('浏览器窗口宽度:', width);
|
||||
console.log('浏览器窗口高度:', height);
|
||||
const getLampData = async () => {
|
||||
// 返回列表
|
||||
let records = await getAllData('queryRoadLampInfo')
|
||||
if (!records) return;
|
||||
let lampData = data.value[0]
|
||||
console.log('lampData', lampData)
|
||||
lampData.total = parseInt(records.length)
|
||||
lampData.onlineRate = records.filter(item => parseInt(item.OnLineStatus) === 1).length / lampData.total * 100// 在线率
|
||||
lampData.contactLossRate = 100 - lampData.onlineRate
|
||||
markerData.value.lamps = records.map(item => {
|
||||
return [parseFloat(item.Lng), parseFloat(item.Lat)]
|
||||
})
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
// 获取浏览器的分辨率(窗口的宽度和高度)
|
||||
await getLampData()
|
||||
NextLoading.done();
|
||||
})
|
||||
|
||||
@ -207,23 +208,28 @@ onMounted(() => {
|
||||
height: 50px;
|
||||
background: linear-gradient(90deg, rgba(0, 131, 255, 0.5) 0%, rgba(9, 64, 125, 0.1) 100%);
|
||||
}
|
||||
|
||||
.content {
|
||||
background: linear-gradient(90deg, rgba(24, 42, 85, 0.7) 0%, rgba(24, 42, 85, 0.6) 48%, rgba(54, 69, 103, 0.1) 100%);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 135px;
|
||||
|
||||
img {
|
||||
width: 82px;
|
||||
height: 77px;
|
||||
}
|
||||
|
||||
.label {
|
||||
font-size: 16px;
|
||||
height: 16px;
|
||||
color: #fff;
|
||||
font-family: SourceHanSansCN-Medium;
|
||||
}
|
||||
|
||||
.total {
|
||||
margin-left: 24px;
|
||||
|
||||
.value {
|
||||
height: 18px;
|
||||
margin-top: 10px;
|
||||
@ -234,8 +240,10 @@ onMounted(() => {
|
||||
font-family: DOUYU;
|
||||
}
|
||||
}
|
||||
|
||||
.online-rate {
|
||||
margin-left: 60px;
|
||||
|
||||
.value {
|
||||
height: 18px;
|
||||
margin-top: 10px;
|
||||
@ -246,8 +254,10 @@ onMounted(() => {
|
||||
font-family: DOUYU;
|
||||
}
|
||||
}
|
||||
|
||||
.contact-loss-rate {
|
||||
margin-left: 48px;
|
||||
|
||||
.value {
|
||||
height: 18px;
|
||||
margin-top: 10px;
|
||||
|
@ -38,8 +38,8 @@
|
||||
:total="total" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
|
||||
</div>
|
||||
<div class="control-buttons">
|
||||
<button class="active">预警管理</button>
|
||||
<button @click="router.push('/home')">数据统计</button>
|
||||
<button class="active" @click="router.push('/eventList')">预警管理</button>
|
||||
<button @click="router.push('/dataStatistics')">数据统计</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -107,6 +107,26 @@ const tableData = [
|
||||
}
|
||||
]
|
||||
|
||||
const handleSizeChange = (val) => {
|
||||
// pageSize.value = val
|
||||
currentPage.value = 1
|
||||
getEventInfoList()
|
||||
}
|
||||
|
||||
const handleCurrentChange = (val) => {
|
||||
// currentPage.value = val
|
||||
getEventInfoList()
|
||||
}
|
||||
const getEventInfoList = async () => {
|
||||
let params = {
|
||||
current: currentPage.value,
|
||||
limit: pageSize.value
|
||||
}
|
||||
let resp = await http.Get('queryEventInfo', params)
|
||||
console.log('getEventInfoList', resp)
|
||||
eventInfoList.value = resp.Records
|
||||
}
|
||||
|
||||
|
||||
const options = [
|
||||
{
|
||||
|
@ -129,8 +129,8 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-buttons">
|
||||
<button class="active">可视化</button>
|
||||
<button @click="router.push('/home')">设备管理</button>
|
||||
<button class="active" @click="router.push('/home')">可视化</button>
|
||||
<button @click="router.push('/deviceManagement')">设备管理</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -140,9 +140,9 @@ import { defineAsyncComponent, computed, ref, onBeforeMount, onMounted, onUnmoun
|
||||
import * as echarts from 'echarts';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { NextLoading } from '/@/utils/loading';
|
||||
import { CirclePlus, Remove } from '@element-plus/icons-vue'
|
||||
import { CirclePlus, Remove } from '@element-plus/icons-vue';
|
||||
import { httpRequestApi } from '/@/api/linxyun/base/index';
|
||||
// import Map from '/@/components/map/index.vue';
|
||||
import {getAllData} from '/@/api/linxyun/common';
|
||||
const Map = defineAsyncComponent(() => import('/@/components/map/index.vue'));
|
||||
|
||||
const Total = defineAsyncComponent(() => import('/@/components/total/index.vue'));
|
||||
@ -156,6 +156,8 @@ const lampData = ref({
|
||||
records: []
|
||||
})
|
||||
|
||||
const eventInfoList = ref({})
|
||||
|
||||
const screenData = ref({
|
||||
current: 1,
|
||||
content: '驾校培训广告.mp4',
|
||||
@ -350,30 +352,35 @@ const initLightingRateChart = () => {
|
||||
echarts.init(lightingRateRef.value).setOption(option);
|
||||
}
|
||||
|
||||
const getEventInfoList = async () => {
|
||||
let params = {
|
||||
current: 1,
|
||||
limit: 5
|
||||
}
|
||||
let resp = await http.Get('queryEventInfo', params)
|
||||
console.log('getEventInfoList', resp)
|
||||
eventInfoList.value = resp.Records
|
||||
}
|
||||
|
||||
|
||||
const getLampData = async () => {
|
||||
// 返回列表
|
||||
let data = await http.Get('queryRoadLampInfo')
|
||||
console.log('data ', data)
|
||||
const { Records, TotalSize } = data
|
||||
lampData.value.total = parseInt(TotalSize)
|
||||
lampData.value.online = Records.filter(item => parseInt(item.OnLineStatus) === 1).length // 在线
|
||||
lampData.value.lighting = Records.filter(item => parseInt(item.Light) > 0).length // 亮度大于0就是开灯了
|
||||
lampData.value.records = Records
|
||||
markerData.value.lamps = Records.map(item => {
|
||||
let records = await getAllData('queryRoadLampInfo')
|
||||
if (!records) return;
|
||||
lampData.value.total = parseInt(records.length)
|
||||
lampData.value.online = records.filter(item => parseInt(item.OnLineStatus) === 1).length // 在线
|
||||
lampData.value.lighting = records.filter(item => parseInt(item.Light) > 0).length // 亮度大于0就是开灯了
|
||||
lampData.value.records = records
|
||||
markerData.value.lamps = records.map(item => {
|
||||
return [parseFloat(item.Lng), parseFloat(item.Lat)]
|
||||
})
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
// 获取浏览器的分辨率(窗口的宽度和高度)
|
||||
let width = window.innerWidth;
|
||||
let height = window.innerHeight;
|
||||
console.log('浏览器窗口宽度:', width);
|
||||
console.log('浏览器窗口高度:', height);
|
||||
getEventInfoList();
|
||||
await getLampData();
|
||||
initOnlineRateChart();
|
||||
initLightingRateChart();
|
||||
|
||||
NextLoading.done();
|
||||
})
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user