七参数页面调整提交
This commit is contained in:
parent
31f1fe1ecf
commit
b244ea805e
@ -3,9 +3,9 @@ NODE_ENV = 'development'
|
||||
|
||||
# 本地环境接口地址(/api/index.ts文件中使用)
|
||||
# VITE_API_URL = 'http://121.196.214.246/api'
|
||||
# VITE_API_URL = 'http://182.90.224.147:100'
|
||||
VITE_API_URL = 'http://182.90.224.147:100'
|
||||
# VITE_API_URL = 'http://192.168.34.221:12360'
|
||||
VITE_API_URL = 'http://192.168.34.221:30002'
|
||||
# VITE_API_URL = 'http://192.168.34.221:30002'
|
||||
|
||||
|
||||
# 上传
|
||||
|
||||
@ -18,7 +18,7 @@
|
||||
// console.log('取到的token',token);
|
||||
let viewer3D;
|
||||
let app;
|
||||
let viewToken = "f8b70c0a02244f89be38229da2302f09";
|
||||
let viewToken = "29a730ca254548e18d441293f13d5720";
|
||||
console.log('viewToken',viewToken);
|
||||
let loaderConfig = new BimfaceSDKLoaderConfig();
|
||||
loaderConfig.viewToken = viewToken;
|
||||
|
||||
19
src/App.vue
19
src/App.vue
@ -5,7 +5,7 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, reactive, computed, nextTick, provide } from "vue";
|
||||
import { ref, reactive, computed, nextTick, provide, onMounted } from "vue";
|
||||
import { GlobalStore } from "@/stores";
|
||||
import { getBrowserLang } from "@/utils/util";
|
||||
import { ElConfigProvider } from "element-plus";
|
||||
@ -37,6 +37,23 @@ const i18nLocale = computed(() => {
|
||||
|
||||
// 配置全局组件大小
|
||||
const assemblySize = computed(() => globalStore.assemblySize);
|
||||
onMounted(() => {
|
||||
window.onload = function () {
|
||||
if (!window.sessionStorage["login"]) {
|
||||
// 关闭浏览器时清空
|
||||
//window.localStorage.removeItem("userInfo"); 或者写这俩
|
||||
//window.localStorage.removeItem("token");
|
||||
globalStore.setToken("");
|
||||
globalStore.setUserInfo("");
|
||||
}
|
||||
};
|
||||
window.onunload = function () {
|
||||
window.sessionStorage["login"] = true;
|
||||
};
|
||||
window.onbeforeunload = function () {
|
||||
window.sessionStorage["login"] = true;
|
||||
};
|
||||
});
|
||||
</script>
|
||||
<style lang="scss">
|
||||
// 地图的搜索层级功能 去掉或者加上scope就会导致地图搜索失效
|
||||
|
||||
@ -40,3 +40,8 @@ export const getAuthMenuListApi = (params?: any) => {
|
||||
export const logoutApi = () => {
|
||||
return http.post(BASEURL + `/xmgl/systemUser/logout`);
|
||||
};
|
||||
|
||||
// * 页面跳转免登录
|
||||
// export const jumpLoginApi = () => {
|
||||
// return http.post(BASEURL + ``);
|
||||
// };
|
||||
|
||||
BIN
src/assets/images/dustNoise/jumpIcon.png
Normal file
BIN
src/assets/images/dustNoise/jumpIcon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 613 B |
@ -37,6 +37,7 @@ const router = createRouter({
|
||||
router.beforeEach(async (to, from, next) => {
|
||||
const globalStore = GlobalStore();
|
||||
console.log("路由拦截 beforeEach:", to);
|
||||
console.log("路由拦截 to.path:", to.path);
|
||||
|
||||
// 1.NProgress 开始
|
||||
NProgress.start();
|
||||
@ -49,9 +50,10 @@ router.beforeEach(async (to, from, next) => {
|
||||
// 3.判断是访问登陆页,有 Token 就在当前页面,没有 Token 重置路由并放行到登陆页
|
||||
if (to.path === LOGIN_URL) {
|
||||
console.log("判断是访问登陆页,有:", from.fullPath);
|
||||
console.log("判断是访问登陆页,globalStore.token有:", globalStore.token);
|
||||
|
||||
if (globalStore.token) return next(from.fullPath);
|
||||
resetRouter();
|
||||
// resetRouter();//重置路由
|
||||
return next();
|
||||
}
|
||||
|
||||
|
||||
@ -12,14 +12,14 @@ export const staticRouter: RouteRecordRaw[] = [
|
||||
// path: "/",
|
||||
// redirect: HOME_URL[0]
|
||||
// },
|
||||
{
|
||||
path: "/",
|
||||
name: "login",
|
||||
component: () => import("@/views/login/index.vue"),
|
||||
meta: {
|
||||
title: "登录"
|
||||
}
|
||||
},
|
||||
// {
|
||||
// path: "/",
|
||||
// name: "login",
|
||||
// component: () => import("@/views/login/index.vue"),
|
||||
// meta: {
|
||||
// title: "登录"
|
||||
// }
|
||||
// },
|
||||
{
|
||||
path: "/login",
|
||||
name: "login",
|
||||
|
||||
@ -45,7 +45,7 @@ import { ref, reactive, onMounted, onBeforeUnmount } from "vue";
|
||||
import { useRouter } from "vue-router";
|
||||
import { Login } from "@/api/interface";
|
||||
import { ElMessage, ElNotification } from "element-plus";
|
||||
import { loginApi } from "@/api/modules/login";
|
||||
import { loginApi, jumpLoginApi } from "@/api/modules/login";
|
||||
import { GlobalStore } from "@/stores";
|
||||
import { TabsStore } from "@/stores/modules/tabs";
|
||||
import { KeepAliveStore } from "@/stores/modules/keepAlive";
|
||||
@ -118,8 +118,8 @@ const resetForm = (formEl: FormInstance | undefined) => {
|
||||
formEl.resetFields();
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
// console.log(import.meta.env.VITE_API_URL);
|
||||
onMounted(async () => {
|
||||
|
||||
|
||||
// 监听enter事件(调用登录)
|
||||
document.onkeydown = (e: any) => {
|
||||
|
||||
@ -2,12 +2,16 @@
|
||||
<div class="bottomRightBox">
|
||||
<div class="title"><i>设备监控台</i></div>
|
||||
<div class="content">
|
||||
<div class="equipmentMonitoring" v-for="item in deviceData.list" :key="item.id">
|
||||
<div class="equipmentMonitoring" v-for="item in deviceData" :key="item.id" v-if="deviceData.length > 0">
|
||||
<div class="equipmentList" :class="item.isClosed == 1 ? 'offline' : 'online'">
|
||||
<p>{{ item.isClosed == 1 ? "离线" : "在线" }}</p>
|
||||
<p class="bottomText">{{ item.devName }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="notoDta" v-else>
|
||||
<img src="@/assets/images/noData.png" alt="" />
|
||||
<p>暂无数据</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -28,7 +32,9 @@ const getDevStatisticsList = async () => {
|
||||
projectSn: store.sn
|
||||
});
|
||||
if (res.result) {
|
||||
deviceData.value = res.result;
|
||||
deviceData.value = res.result.list;
|
||||
} else {
|
||||
deviceData.value = [];
|
||||
}
|
||||
console.log("配电箱实时数据", res);
|
||||
};
|
||||
@ -83,6 +89,22 @@ onMounted(() => {
|
||||
}
|
||||
}
|
||||
}
|
||||
.notoDta {
|
||||
width: 20%;
|
||||
height: 20%;
|
||||
margin-left: 40%;
|
||||
margin-top: 8%;
|
||||
img {
|
||||
width: 38%;
|
||||
margin: 6% 36%;
|
||||
}
|
||||
p {
|
||||
width: 100%;
|
||||
color: #fff;
|
||||
font-size: calc(100vw * 14 / 1920);
|
||||
margin: -5% 38%;
|
||||
}
|
||||
}
|
||||
.online {
|
||||
background: url("@/assets/images/distributionMonitoring/sbjkOpen.webp") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="topCenterBox" v-if="realTimeData">
|
||||
<div class="topCenterBox">
|
||||
<div class="title"><i>配电箱实时数据</i></div>
|
||||
|
||||
<div class="content">
|
||||
@ -101,9 +101,17 @@ const getDevOption = async () => {
|
||||
console.log("电相option", noiseList.value);
|
||||
}
|
||||
};
|
||||
|
||||
// let devSn = ref("" as any);
|
||||
let realTimeData = ref(null as any);
|
||||
let realTimeData = ref({
|
||||
ambientTemperature: 0,
|
||||
voltageA: 0,
|
||||
cableTemperatureA: 0,
|
||||
phaseCurrentA: 0,
|
||||
electricLeakage: 0,
|
||||
phaseCurrentB: 0,
|
||||
cableTemperatureB: 0,
|
||||
voltageB: 0
|
||||
} as any);
|
||||
const getRealTimeList = async () => {
|
||||
const res: any = await getRealTimeDataApi({
|
||||
projectSn: store.sn,
|
||||
|
||||
@ -17,18 +17,25 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="decivList">
|
||||
<el-scrollbar style="height:90%">
|
||||
<div class="menuDev" v-for="item in deviceData.list" :key="item.id" :class="item.isClosed != 0 ? 'online' : 'offline'">
|
||||
<div class="decName">
|
||||
<span v-if="item.isClosed === 1"><img src="@/assets/images/dustNoise/offImg.png" alt="" /></span>
|
||||
<span v-else><img src="@/assets/images/dustNoise/onlineImg.png" alt="" /></span>
|
||||
<span> {{ item.devName }}</span>
|
||||
<el-scrollbar style="height: 90%">
|
||||
<div
|
||||
class="menuDev"
|
||||
v-for="item in deviceData.list"
|
||||
:key="item.id"
|
||||
:class="item.isClosed != 0 ? 'online' : 'offline'"
|
||||
>
|
||||
<div class="decName">
|
||||
<span v-if="item.isClosed === 1"><img src="@/assets/images/dustNoise/offImg.png" alt="" /></span>
|
||||
<span v-else><img src="@/assets/images/dustNoise/onlineImg.png" alt="" /></span>
|
||||
<span> {{ item.devName }}</span>
|
||||
</div>
|
||||
<div class="status">{{ item.isClosed === 1 ? "离线" : "在线" }}</div>
|
||||
</div>
|
||||
<div class="status">{{ item.isClosed === 1 ? "离线" : "在线" }}</div>
|
||||
</div>
|
||||
|
||||
</el-scrollbar>
|
||||
|
||||
<!-- <div class="notoDta" v-else>
|
||||
<img src="@/assets/images/noData.png" alt="" />
|
||||
<p>暂无数据</p>
|
||||
</div> -->
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -45,389 +52,388 @@ const store = GlobalStore();
|
||||
const analysisData = ref(0 as any);
|
||||
const posCenter = reactive(["50%", "64%"]);
|
||||
|
||||
|
||||
function drawChart() {
|
||||
let leftTopEcharts = echarts.init(document.getElementById("topLeftEcharts"));
|
||||
let option = {
|
||||
series: [
|
||||
{
|
||||
// 外围刻度
|
||||
type: "gauge",
|
||||
radius: "100%",
|
||||
center: posCenter,
|
||||
splitNumber: 10,
|
||||
min: 0,
|
||||
max: 100,
|
||||
startAngle: 180,
|
||||
endAngle: 0,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
width: 18,
|
||||
shadowBlur: 0,
|
||||
color: [
|
||||
[
|
||||
1,
|
||||
new echarts.graphic.LinearGradient(0, 0, 1, 0, [
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(151, 12, 12, 1)"
|
||||
},
|
||||
{
|
||||
offset: 0.2,
|
||||
color: "rgba(137, 14, 161, 1)"
|
||||
},
|
||||
{
|
||||
offset: 0.4,
|
||||
color: "rgba(119, 24, 254, 1)"
|
||||
},
|
||||
{
|
||||
offset: 0.5,
|
||||
color: "rgba(254, 122, 24, 1)"
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(255, 187, 56, 1)"
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "rgba(101, 215, 249, 1)"
|
||||
}
|
||||
])
|
||||
series: [
|
||||
{
|
||||
// 外围刻度
|
||||
type: "gauge",
|
||||
radius: "100%",
|
||||
center: posCenter,
|
||||
splitNumber: 10,
|
||||
min: 0,
|
||||
max: 100,
|
||||
startAngle: 180,
|
||||
endAngle: 0,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
width: 18,
|
||||
shadowBlur: 0,
|
||||
color: [
|
||||
[
|
||||
1,
|
||||
new echarts.graphic.LinearGradient(0, 0, 1, 0, [
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(151, 12, 12, 1)"
|
||||
},
|
||||
{
|
||||
offset: 0.2,
|
||||
color: "rgba(137, 14, 161, 1)"
|
||||
},
|
||||
{
|
||||
offset: 0.4,
|
||||
color: "rgba(119, 24, 254, 1)"
|
||||
},
|
||||
{
|
||||
offset: 0.5,
|
||||
color: "rgba(254, 122, 24, 1)"
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(255, 187, 56, 1)"
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "rgba(101, 215, 249, 1)"
|
||||
}
|
||||
])
|
||||
]
|
||||
]
|
||||
]
|
||||
}
|
||||
},
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
show: true,
|
||||
color: "#fff",
|
||||
fontSize: 10,
|
||||
distance: -40
|
||||
},
|
||||
pointer: {
|
||||
show: 0
|
||||
}
|
||||
},
|
||||
{
|
||||
// 内侧指针、数值显示
|
||||
name: "",
|
||||
type: "gauge",
|
||||
radius: "95%",
|
||||
center: posCenter,
|
||||
startAngle: 180,
|
||||
endAngle: 0,
|
||||
min: 0, //最小刻度
|
||||
max: 100, //最大刻度
|
||||
splitNumber: 20, //刻度数量
|
||||
axisLine: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
show: false
|
||||
}, //刻度标签。
|
||||
axisTick: {
|
||||
show: false
|
||||
}, //刻度样式
|
||||
splitLine: {
|
||||
show: true,
|
||||
length: 5,
|
||||
lineStyle: {
|
||||
color: "#87E0FB",
|
||||
width: 1
|
||||
}
|
||||
},
|
||||
detail: {
|
||||
show: false
|
||||
},
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#fff"
|
||||
}
|
||||
},
|
||||
data: [
|
||||
{
|
||||
value: analysisData.value
|
||||
}
|
||||
],
|
||||
z: 9
|
||||
},
|
||||
// 第三个圆
|
||||
{
|
||||
type: "gauge",
|
||||
radius: "70%",
|
||||
center: posCenter,
|
||||
splitNumber: 4,
|
||||
min: 0,
|
||||
max: 100,
|
||||
startAngle: 180,
|
||||
endAngle: 0,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
width: 2,
|
||||
shadowBlur: 0,
|
||||
color: [
|
||||
[
|
||||
1,
|
||||
new echarts.graphic.LinearGradient(0, 0, 1, 0, [
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgb(1,192,229)"
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "#87E0FB "
|
||||
}
|
||||
])
|
||||
]
|
||||
]
|
||||
}
|
||||
},
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
show: false
|
||||
},
|
||||
pointer: {
|
||||
show: 0
|
||||
},
|
||||
detail: {
|
||||
show: 0
|
||||
}
|
||||
},
|
||||
// 第二个圆
|
||||
{
|
||||
type: "gauge",
|
||||
radius: "45%",
|
||||
center: posCenter,
|
||||
splitNumber: 4,
|
||||
min: 0,
|
||||
max: 100,
|
||||
startAngle: 180,
|
||||
endAngle: 0,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
width: 2,
|
||||
shadowBlur: 0,
|
||||
color: [
|
||||
[
|
||||
1,
|
||||
new echarts.graphic.LinearGradient(0, 0, 1, 0, [
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgb(1,192,229)"
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "#87E0FB "
|
||||
}
|
||||
])
|
||||
]
|
||||
]
|
||||
}
|
||||
},
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
show: false
|
||||
},
|
||||
pointer: {
|
||||
show: 0
|
||||
},
|
||||
detail: {
|
||||
show: 0
|
||||
}
|
||||
},
|
||||
// 第一个圆
|
||||
{
|
||||
type: "gauge",
|
||||
radius: "25%",
|
||||
center: posCenter,
|
||||
splitNumber: 4,
|
||||
min: 0,
|
||||
max: 100,
|
||||
startAngle: 180,
|
||||
endAngle: 0,
|
||||
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
width: 200,
|
||||
shadowBlur: 0,
|
||||
color: [
|
||||
[
|
||||
1,
|
||||
new echarts.graphic.LinearGradient(0, 0, 1, 0, [
|
||||
{
|
||||
offset: 1,
|
||||
color: "rgba(135, 224, 251, 0.2)"
|
||||
},
|
||||
{
|
||||
offset: 0.2,
|
||||
color: "rgba(135, 224, 251, 0.7)"
|
||||
}
|
||||
])
|
||||
],
|
||||
[1, "transparent"]
|
||||
]
|
||||
}
|
||||
},
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
show: false
|
||||
},
|
||||
pointer: {
|
||||
show: 0
|
||||
},
|
||||
detail: {
|
||||
show: 0
|
||||
}
|
||||
},
|
||||
{
|
||||
type: "gauge",
|
||||
radius: "70%",
|
||||
center: posCenter,
|
||||
splitNumber: 0, //刻度数量
|
||||
startAngle: 180,
|
||||
endAngle: 0,
|
||||
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
width: 26,
|
||||
color: [
|
||||
[
|
||||
analysisData.value/100,
|
||||
new echarts.graphic.LinearGradient(0, 0, 1, 0, [
|
||||
{
|
||||
offset: 0.5,
|
||||
color: "rgba(135, 224, 251, 1)"
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "#fff"
|
||||
}
|
||||
])
|
||||
],
|
||||
[1, "transparent"]
|
||||
]
|
||||
}
|
||||
},
|
||||
//分隔线样式。
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
show: false
|
||||
},
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
pointer: {
|
||||
show: false
|
||||
},
|
||||
title: {
|
||||
show: false
|
||||
},
|
||||
//仪表盘详情,用于显示数据。
|
||||
detail: {
|
||||
show: false
|
||||
},
|
||||
data: [
|
||||
{
|
||||
value: analysisData.value,
|
||||
itemStyle: {
|
||||
color: "red"
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
//指针外环
|
||||
type: "pie",
|
||||
hoverAnimation: false,
|
||||
legendHoverLink: false,
|
||||
center: posCenter,
|
||||
radius: ["8%", "6%"],
|
||||
// width:5,
|
||||
z: 10,
|
||||
label: {
|
||||
normal: {
|
||||
},
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
show: true,
|
||||
color: "#fff",
|
||||
fontSize: 10,
|
||||
distance: -40
|
||||
},
|
||||
pointer: {
|
||||
show: 0
|
||||
}
|
||||
},
|
||||
labelLine: {
|
||||
normal: {
|
||||
{
|
||||
// 内侧指针、数值显示
|
||||
name: "",
|
||||
type: "gauge",
|
||||
radius: "95%",
|
||||
center: posCenter,
|
||||
startAngle: 180,
|
||||
endAngle: 0,
|
||||
min: 0, //最小刻度
|
||||
max: 100, //最大刻度
|
||||
splitNumber: 20, //刻度数量
|
||||
axisLine: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
show: false
|
||||
}, //刻度标签。
|
||||
axisTick: {
|
||||
show: false
|
||||
}, //刻度样式
|
||||
splitLine: {
|
||||
show: true,
|
||||
length: 5,
|
||||
lineStyle: {
|
||||
color: "#87E0FB",
|
||||
width: 1
|
||||
}
|
||||
},
|
||||
detail: {
|
||||
show: false
|
||||
},
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#fff"
|
||||
}
|
||||
},
|
||||
data: [
|
||||
{
|
||||
value: analysisData.value
|
||||
}
|
||||
],
|
||||
z: 9
|
||||
},
|
||||
// 第三个圆
|
||||
{
|
||||
type: "gauge",
|
||||
radius: "70%",
|
||||
center: posCenter,
|
||||
splitNumber: 4,
|
||||
min: 0,
|
||||
max: 100,
|
||||
startAngle: 180,
|
||||
endAngle: 0,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
width: 2,
|
||||
shadowBlur: 0,
|
||||
color: [
|
||||
[
|
||||
1,
|
||||
new echarts.graphic.LinearGradient(0, 0, 1, 0, [
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgb(1,192,229)"
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "#87E0FB "
|
||||
}
|
||||
])
|
||||
]
|
||||
]
|
||||
}
|
||||
},
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
show: false
|
||||
},
|
||||
pointer: {
|
||||
show: 0
|
||||
},
|
||||
detail: {
|
||||
show: 0
|
||||
}
|
||||
},
|
||||
data: [
|
||||
{
|
||||
value: analysisData.value,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#87E0FB"
|
||||
// 第二个圆
|
||||
{
|
||||
type: "gauge",
|
||||
radius: "45%",
|
||||
center: posCenter,
|
||||
splitNumber: 4,
|
||||
min: 0,
|
||||
max: 100,
|
||||
startAngle: 180,
|
||||
endAngle: 0,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
width: 2,
|
||||
shadowBlur: 0,
|
||||
color: [
|
||||
[
|
||||
1,
|
||||
new echarts.graphic.LinearGradient(0, 0, 1, 0, [
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgb(1,192,229)"
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "#87E0FB "
|
||||
}
|
||||
])
|
||||
]
|
||||
]
|
||||
}
|
||||
},
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
show: false
|
||||
},
|
||||
pointer: {
|
||||
show: 0
|
||||
},
|
||||
detail: {
|
||||
show: 0
|
||||
}
|
||||
},
|
||||
// 第一个圆
|
||||
{
|
||||
type: "gauge",
|
||||
radius: "25%",
|
||||
center: posCenter,
|
||||
splitNumber: 4,
|
||||
min: 0,
|
||||
max: 100,
|
||||
startAngle: 180,
|
||||
endAngle: 0,
|
||||
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
width: 200,
|
||||
shadowBlur: 0,
|
||||
color: [
|
||||
[
|
||||
1,
|
||||
new echarts.graphic.LinearGradient(0, 0, 1, 0, [
|
||||
{
|
||||
offset: 1,
|
||||
color: "rgba(135, 224, 251, 0.2)"
|
||||
},
|
||||
{
|
||||
offset: 0.2,
|
||||
color: "rgba(135, 224, 251, 0.7)"
|
||||
}
|
||||
])
|
||||
],
|
||||
[1, "transparent"]
|
||||
]
|
||||
}
|
||||
},
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
show: false
|
||||
},
|
||||
pointer: {
|
||||
show: 0
|
||||
},
|
||||
detail: {
|
||||
show: 0
|
||||
}
|
||||
},
|
||||
{
|
||||
type: "gauge",
|
||||
radius: "70%",
|
||||
center: posCenter,
|
||||
splitNumber: 0, //刻度数量
|
||||
startAngle: 180,
|
||||
endAngle: 0,
|
||||
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
width: 26,
|
||||
color: [
|
||||
[
|
||||
analysisData.value / 100,
|
||||
new echarts.graphic.LinearGradient(0, 0, 1, 0, [
|
||||
{
|
||||
offset: 0.5,
|
||||
color: "rgba(135, 224, 251, 1)"
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "#fff"
|
||||
}
|
||||
])
|
||||
],
|
||||
[1, "transparent"]
|
||||
]
|
||||
}
|
||||
},
|
||||
//分隔线样式。
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
show: false
|
||||
},
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
pointer: {
|
||||
show: false
|
||||
},
|
||||
title: {
|
||||
show: false
|
||||
},
|
||||
//仪表盘详情,用于显示数据。
|
||||
detail: {
|
||||
show: false
|
||||
},
|
||||
data: [
|
||||
{
|
||||
value: analysisData.value,
|
||||
itemStyle: {
|
||||
color: "red"
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
//指针内环
|
||||
type: "pie",
|
||||
hoverAnimation: false,
|
||||
legendHoverLink: false,
|
||||
center: posCenter,
|
||||
radius: ["-2%", "4%"],
|
||||
z: 10,
|
||||
|
||||
axisLine: {
|
||||
show: true
|
||||
]
|
||||
},
|
||||
label: {
|
||||
normal: {
|
||||
show: false
|
||||
}
|
||||
},
|
||||
labelLine: {
|
||||
normal: {
|
||||
show: false
|
||||
}
|
||||
},
|
||||
|
||||
data: [
|
||||
{
|
||||
value: analysisData.value,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "rgba(7, 31, 60) "
|
||||
{
|
||||
//指针外环
|
||||
type: "pie",
|
||||
hoverAnimation: false,
|
||||
legendHoverLink: false,
|
||||
center: posCenter,
|
||||
radius: ["8%", "6%"],
|
||||
// width:5,
|
||||
z: 10,
|
||||
label: {
|
||||
normal: {
|
||||
show: false
|
||||
}
|
||||
},
|
||||
labelLine: {
|
||||
normal: {
|
||||
show: false
|
||||
}
|
||||
},
|
||||
data: [
|
||||
{
|
||||
value: analysisData.value,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#87E0FB"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
};
|
||||
]
|
||||
},
|
||||
{
|
||||
//指针内环
|
||||
type: "pie",
|
||||
hoverAnimation: false,
|
||||
legendHoverLink: false,
|
||||
center: posCenter,
|
||||
radius: ["-2%", "4%"],
|
||||
z: 10,
|
||||
|
||||
axisLine: {
|
||||
show: true
|
||||
},
|
||||
label: {
|
||||
normal: {
|
||||
show: false
|
||||
}
|
||||
},
|
||||
labelLine: {
|
||||
normal: {
|
||||
show: false
|
||||
}
|
||||
},
|
||||
|
||||
data: [
|
||||
{
|
||||
value: analysisData.value,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "rgba(7, 31, 60) "
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
};
|
||||
leftTopEcharts.setOption(option);
|
||||
}
|
||||
// 配电箱设备统计
|
||||
@ -442,7 +448,7 @@ const getDevStatisticsList = async () => {
|
||||
analysisData.value = res.result.grade;
|
||||
drawChart();
|
||||
}
|
||||
console.log("配电箱实时数据", res);
|
||||
console.log("配电箱实时数据123", res);
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
@ -527,6 +533,22 @@ onMounted(() => {
|
||||
margin-left: 60%;
|
||||
}
|
||||
}
|
||||
.notoDta {
|
||||
width: 20%;
|
||||
height: 20%;
|
||||
margin-left: 40%;
|
||||
margin-top: 8%;
|
||||
img {
|
||||
width: 38%;
|
||||
margin: 6% 36%;
|
||||
}
|
||||
p {
|
||||
width: 100%;
|
||||
color: #fff;
|
||||
font-size: calc(100vw * 14 / 1920);
|
||||
margin: -5% 38%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.online {
|
||||
.status {
|
||||
@ -540,6 +562,5 @@ onMounted(() => {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -22,16 +22,19 @@
|
||||
<div class="tabTwo">报警时间</div>
|
||||
<div class="tabThree">报警类型</div>
|
||||
</div>
|
||||
<el-scrollbar style="height:85%">
|
||||
<div class="listBox">
|
||||
<div v-for="item in boxAlarmData.list" class="listStyle" :key="item.id">
|
||||
<div class="dev" style="margin-left: 5%">{{ item.devName }}</div>
|
||||
<div class="time">{{ item.creatTime }}</div>
|
||||
<div class="type" style="margin-right: 5%">{{ item.alarmType }}</div>
|
||||
<el-scrollbar style="height: 85%">
|
||||
<div class="listBox">
|
||||
<div v-for="item in boxAlarmData.list" class="listStyle" :key="item.id" v-if="boxAlarmData.list.length > 0">
|
||||
<div class="dev" style="margin-left: 5%">{{ item.devName }}</div>
|
||||
<div class="time">{{ item.creatTime }}</div>
|
||||
<div class="type" style="margin-right: 5%">{{ item.alarmType }}</div>
|
||||
</div>
|
||||
<div class="notoDta" v-else>
|
||||
<img src="@/assets/images/noData.png" alt="" />
|
||||
<p>暂无数据</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</el-scrollbar>
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -176,6 +179,19 @@ onMounted(async () => {
|
||||
background: #091f3f;
|
||||
}
|
||||
}
|
||||
.notoDta {
|
||||
margin-left: 10%;
|
||||
margin-top: 8%;
|
||||
img {
|
||||
width: 16%;
|
||||
margin: 6% 36%;
|
||||
}
|
||||
p {
|
||||
color: #fff;
|
||||
font-size: calc(100vw * 14 / 1920);
|
||||
margin: -5% 38%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -39,6 +39,10 @@
|
||||
<div class="icon"><img src="@/assets/images/dustNoise/userIcon.png" /></div>
|
||||
<div class="userName">{{ adminName }}</div>
|
||||
</div>
|
||||
<div class="loginOut" @click="jumpBgd">
|
||||
<div class="loginOutIcon"><img src="@/assets/images/dustNoise/jumpIcon.png" /></div>
|
||||
<div class="userName">项目后台</div>
|
||||
</div>
|
||||
<div class="loginOut" @click="loginOut">
|
||||
<div class="loginOutIcon"><img src="@/assets/images/dustNoise/loginOut.png" /></div>
|
||||
<div class="userName">退出登录</div>
|
||||
@ -48,11 +52,11 @@
|
||||
</div>
|
||||
<div class="menuList">
|
||||
<div
|
||||
v-for="(item, index) in menuData.menuList"
|
||||
v-for="(item, index) in menuList"
|
||||
:key="index"
|
||||
:class="{
|
||||
right: index > (menuData.menuList.length - 1) / 2,
|
||||
active: menuData.activeIndex == index ? 'active' : ''
|
||||
right: index > (menuList.length - 1) / 2,
|
||||
active: activeIndex == index ? 'active' : ''
|
||||
}"
|
||||
@click="menuClick(item, index)"
|
||||
>
|
||||
@ -73,33 +77,57 @@ const store = GlobalStore();
|
||||
let nowTime = ref("2023-04-16 09:22:12" as any);
|
||||
let showUserBox = ref(false as any);
|
||||
let adminName = ref("" as any);
|
||||
let menuData = reactive({
|
||||
menuList: [
|
||||
{ moduleName: "扬尘噪声", modulePath: "/headNoise" },
|
||||
{ moduleName: "劳务管理", modulePath: "/laborManagement" },
|
||||
{ moduleName: "视频管理", modulePath: "/videoManagement" },
|
||||
{ moduleName: "配电箱监测", modulePath: "/distributionMonitoring" },
|
||||
{ moduleName: "车辆管理", modulePath: "/vehicleManagement" },
|
||||
{ moduleName: "塔吊监测", modulePath: "/towerCraneMonitoring" },
|
||||
{ moduleName: "升降机监测", modulePath: "/elevatorMonitoring" },
|
||||
{ moduleName: "BIM模型", modulePath: "/bImModel" }
|
||||
],
|
||||
activeIndex: 0
|
||||
});
|
||||
let menuList = ref([
|
||||
{ moduleName: "扬尘噪声", modulePath: "/headNoise" },
|
||||
{ moduleName: "劳务管理", modulePath: "/laborManagement" },
|
||||
{ moduleName: "视频管理", modulePath: "/videoManagement" },
|
||||
{ moduleName: "配电箱监测", modulePath: "/distributionMonitoring" },
|
||||
{ moduleName: "车辆管理", modulePath: "/vehicleManagement" },
|
||||
{ moduleName: "塔吊监测", modulePath: "/towerCraneMonitoring" },
|
||||
{ moduleName: "升降机监测", modulePath: "/elevatorMonitoring" },
|
||||
{ moduleName: "BIM模型", modulePath: "/bImModel" }
|
||||
]);
|
||||
const activeIndex=ref(0)
|
||||
const router = useRouter();
|
||||
|
||||
const menuClick = (item, index) => {
|
||||
menuData.activeIndex = index;
|
||||
activeIndex.value = index;
|
||||
console.log("点击了tab", item);
|
||||
if (item.modulePath.includes("/")) {
|
||||
router.push(item.modulePath);
|
||||
}
|
||||
};
|
||||
onMounted(() => {
|
||||
const moduleListData = ref([] as any);//动态路由
|
||||
onMounted(async () => {
|
||||
//数据看板跳转免登录
|
||||
if (window.location.href.indexOf("token") != -1) {
|
||||
const token = window.location.href.split("token=")[1];
|
||||
const res = await fetch(import.meta.env.VITE_API_URL + "/xmgl/base/getLoginInfoByToken", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json"
|
||||
},
|
||||
body: JSON.stringify({ token: token })
|
||||
});
|
||||
const data = await res.json();
|
||||
console.log("调用免登录接口返回的数据", data);
|
||||
// let arr = data.result.menuAuthority.moduleList;
|
||||
// arr.forEach((item: any) => {
|
||||
// if (item.moduleType == 4) {
|
||||
// moduleListData.value.push(item);
|
||||
// return;
|
||||
// }
|
||||
// });
|
||||
// console.log("当前项目的看板数据::", moduleListData.value);
|
||||
store.setSN(data.result.sn);
|
||||
store.setToken(data.result.token);
|
||||
store.setAccount(data.result.account);
|
||||
store.setAccountType(data.result.accountType);
|
||||
}
|
||||
// console.log("进入页面, ");
|
||||
adminName.value = store.account;
|
||||
// console.log("store数据", store.account);
|
||||
menuClick(menuData.menuList[0], menuData.activeIndex);
|
||||
menuClick(menuList.value[0], activeIndex.value);
|
||||
getNowTime();
|
||||
document.addEventListener("click", bodyCloseMenus);
|
||||
});
|
||||
@ -139,6 +167,10 @@ function loginOut() {
|
||||
location.reload();
|
||||
router.push("/login");
|
||||
}
|
||||
//跳转后台
|
||||
function jumpBgd() {
|
||||
window.location.replace("http://192.168.34.226:8081/#/projectIndex");
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@ -153,7 +185,7 @@ function loginOut() {
|
||||
height: 100%;
|
||||
background: url("@/assets/images/bigImg.gif") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
|
||||
|
||||
.header {
|
||||
width: 100vw;
|
||||
height: 12%;
|
||||
@ -240,7 +272,7 @@ function loginOut() {
|
||||
.userItem {
|
||||
position: absolute;
|
||||
width: 100px;
|
||||
height: 64px;
|
||||
height: 100px;
|
||||
right: 3%;
|
||||
top: 4%;
|
||||
background: #112d59;
|
||||
@ -285,8 +317,9 @@ function loginOut() {
|
||||
justify-content: space-evenly;
|
||||
align-items: center;
|
||||
height: 26px;
|
||||
padding-left: 8px;
|
||||
padding-left: 5px;
|
||||
cursor: pointer;
|
||||
height: 30px;
|
||||
.loginOutIcon {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
|
||||
@ -259,7 +259,6 @@ function _pie3() {
|
||||
let dataName = ref([] as any);
|
||||
let towerAlarmData = ref(null as any);
|
||||
const getTowerNumAndAlarmList = async (type: any) => {
|
||||
|
||||
if (type == 1) {
|
||||
//近七天
|
||||
var currentDate = new Date();
|
||||
|
||||
@ -17,7 +17,7 @@
|
||||
/>
|
||||
</el-select>
|
||||
</div>
|
||||
<div class="contentSmall" v-if="towerDetailData">
|
||||
<div class="contentSmall" v-if="towerDetailData != null">
|
||||
<div class="top">
|
||||
<div class="leftTowerImg">
|
||||
<div class="titleData">
|
||||
@ -72,7 +72,7 @@
|
||||
<div>转角</div>
|
||||
<div style="color: #65d7f9">{{ towerDetail.angle || 0 }}°</div>
|
||||
</div>
|
||||
<div class="lineBdata" v-show="dataShow" style="left: 57%; top: 65%">
|
||||
<div class="lineBdata" v-show="dataShow" style="left: 57%; top: 65%">
|
||||
<div>倾角</div>
|
||||
<div style="color: #ec6266">{{ towerDetail.obliguity || 0 }}°</div>
|
||||
</div>
|
||||
@ -96,16 +96,18 @@
|
||||
</div>
|
||||
<div class="rightInfo">
|
||||
<div class="titleStatus">
|
||||
<span style="color:#fff;cursor: pointer" v-if="isShow==false" @click="infoBtn">司机信息</span>
|
||||
<span style="color:#ccc;cursor: pointer" v-else @click="infoBtn">司机信息</span>
|
||||
<span style="color: #fff; cursor: pointer" v-if="isShow == false" @click="infoBtn">司机信息</span>
|
||||
<span style="color: #ccc; cursor: pointer" v-else @click="infoBtn">司机信息</span>
|
||||
<span
|
||||
><img style="margin-left: 4%; width: 6%" src="@/assets/images/towerCraneMonitoring/setUp.png" alt="" />
|
||||
</span>
|
||||
<span v-if="isShow==true" style="margin-left: 6%; color: #fff; cursor: pointer" @click="deviceInf">设备信息</span>
|
||||
<span v-if="isShow == true" style="margin-left: 6%; color: #fff; cursor: pointer" @click="deviceInf"
|
||||
>设备信息</span
|
||||
>
|
||||
<span v-else style="margin-left: 6%; color: #ccc; cursor: pointer" @click="deviceInf">设备信息</span>
|
||||
</div>
|
||||
<!-- 司机信息 -->
|
||||
<div class="infoBox" v-show="isShowTime==true">
|
||||
<div class="infoBox" v-show="isShowTime == true">
|
||||
<div><span class="textColor"> 姓名:</span>{{ driverInfo.workerName || "未知" }}</div>
|
||||
<div>
|
||||
<span class="textColor"> 性别:</span>{{ driverInfo.sex == 1 ? "男" : driverInfo.sex == 2 ? "女" : "未知" }}
|
||||
@ -113,18 +115,12 @@
|
||||
<div><span class="textColor"> 年龄:</span>{{ driverInfo.age || "未知" }}</div>
|
||||
<div><span class="textColor"> 本次连续工作时长:</span>{{ driverInfo.continuousWorkingTimeName || 0 }}</div>
|
||||
<div style="width: 95%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap">
|
||||
<span
|
||||
class="textColor"
|
||||
style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;"
|
||||
>
|
||||
<span class="textColor" style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap">
|
||||
身份证号:</span
|
||||
>{{ driverInfo.idCard || "未知" }}
|
||||
</div>
|
||||
<div style="width: 96%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap">
|
||||
<span
|
||||
class="textColor"
|
||||
style="width: 10%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;"
|
||||
>
|
||||
<span class="textColor" style="width: 10%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap">
|
||||
特种资格证书编号:</span
|
||||
>{{ driverInfo.specialCertificateNumber || "未知" }}
|
||||
</div>
|
||||
@ -135,7 +131,7 @@
|
||||
</div>
|
||||
<div class="driverPhoto"><img :src="BASEURL + '/image/' + driverInfo.imageUrl" alt="" /></div>
|
||||
<!-- 设备信息 -->
|
||||
<div class="infoBox" v-show="isShow==true">
|
||||
<div class="infoBox" v-show="isShow == true">
|
||||
<div style="width: 98%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap">
|
||||
<span class="textColor" style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap">
|
||||
出厂日期:</span
|
||||
@ -147,27 +143,18 @@
|
||||
<div><span class="textColor"> 规格型号:</span>{{ towerDetailData.devModel || "未知" }}</div>
|
||||
<div><span class="textColor"> 产权单位:</span>{{ towerDetailData.propertyUnit || "未知" }}</div>
|
||||
<div>
|
||||
<span
|
||||
class="textColor"
|
||||
style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap; "
|
||||
>
|
||||
<span class="textColor" style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap">
|
||||
安装单位:</span
|
||||
>{{ towerDetailData.installationUnit || "未知" }}
|
||||
</div>
|
||||
<div>
|
||||
<span
|
||||
class="textColor"
|
||||
style="width: 10%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap"
|
||||
>
|
||||
<span class="textColor" style="width: 10%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap">
|
||||
制造厂家:</span
|
||||
>{{ towerDetailData.factoryName || "未知" }}
|
||||
</div>
|
||||
<div>
|
||||
<span
|
||||
class="textColor"
|
||||
style="width: 10%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap"
|
||||
>
|
||||
拆除单位:</span
|
||||
<span class="textColor" style="width: 10%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap">
|
||||
拆除单位:</span
|
||||
>{{ towerDetailData.demolitionUnit || "未知" }}
|
||||
</div>
|
||||
</div>
|
||||
@ -193,22 +180,22 @@
|
||||
</div>
|
||||
<div class="bottomList">
|
||||
<p>高度限位</p>
|
||||
<p class="number">{{ list.heightAlarm==0?'正常':list.heightAlarm==1?'报警':'预警'}}</p>
|
||||
<p class="number">{{ list.heightAlarm == 0 ? "正常" : list.heightAlarm == 1 ? "报警" : "预警" }}</p>
|
||||
<div class="bg"></div>
|
||||
</div>
|
||||
<div class="bottomList">
|
||||
<p>幅度限位</p>
|
||||
<p class="number">{{ list.minRangeAlarm ==0?'正常':list.minRangeAlarm==1?'报警':'预警'}}</p>
|
||||
<p class="number">{{ list.minRangeAlarm == 0 ? "正常" : list.minRangeAlarm == 1 ? "报警" : "预警" }}</p>
|
||||
<div class="bg"></div>
|
||||
</div>
|
||||
<div class="bottomList">
|
||||
<p>回转限位</p>
|
||||
<p class="number">{{ list.posAngleAlarm==0?'正常':list.posAngleAlarm0==1?'报警':'预警'}}</p>
|
||||
<p class="number">{{ list.posAngleAlarm == 0 ? "正常" : list.posAngleAlarm0 == 1 ? "报警" : "预警" }}</p>
|
||||
<div class="bg"></div>
|
||||
</div>
|
||||
<div class="bottomList">
|
||||
<p>多机防撞</p>
|
||||
<p class="number">{{ list.multiAlarmAll ==0?'正常':list.multiAlarmAll==1?'报警':'预警' }}</p>
|
||||
<p class="number">{{ list.multiAlarmAll == 0 ? "正常" : list.multiAlarmAll == 1 ? "报警" : "预警" }}</p>
|
||||
<div class="bg"></div>
|
||||
</div>
|
||||
<!-- <div class="bottomList">
|
||||
@ -218,12 +205,12 @@
|
||||
</div> -->
|
||||
<div class="bottomList">
|
||||
<p>禁入区</p>
|
||||
<p class="number">{{ list.forbidEntryAlarm==0?'正常':list.forbidEntryAlarm==1?'报警':'预警' }}</p>
|
||||
<p class="number">{{ list.forbidEntryAlarm == 0 ? "正常" : list.forbidEntryAlarm == 1 ? "报警" : "预警" }}</p>
|
||||
<div class="bg"></div>
|
||||
</div>
|
||||
<div class="bottomList">
|
||||
<p>传感器故障</p>
|
||||
<p class="number">{{ list.weightError==0?'无故障':'有故障' }}</p>
|
||||
<p class="number">{{ list.weightError == 0 ? "无故障" : "有故障" }}</p>
|
||||
<div class="bg"></div>
|
||||
</div>
|
||||
<div class="bottomList">
|
||||
@ -238,6 +225,10 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="notoDta" v-else>
|
||||
<img src="@/assets/images/noData.png" alt="" />
|
||||
<p>暂无数据</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -259,22 +250,21 @@ import {
|
||||
} from "@/api/modules/tower";
|
||||
import { GlobalStore } from "@/stores";
|
||||
const store = GlobalStore();
|
||||
let towerValue = ref("" as any);
|
||||
let towerValue = ref("暂无数据" as any);
|
||||
let dataShow = ref(false);
|
||||
let noiseList = ref([]);
|
||||
let isShowTime = ref(true); //司机信息
|
||||
let isShow = ref(false); //设备信息
|
||||
|
||||
//司机点击
|
||||
const infoBtn=()=>{
|
||||
isShowTime.value=true
|
||||
isShow.value=false
|
||||
}
|
||||
const infoBtn = () => {
|
||||
isShowTime.value = true;
|
||||
isShow.value = false;
|
||||
};
|
||||
//设备信息
|
||||
const deviceInf = () => {
|
||||
isShow.value=true
|
||||
isShowTime.value=false
|
||||
|
||||
isShow.value = true;
|
||||
isShowTime.value = false;
|
||||
};
|
||||
//中间塔吊点击事件
|
||||
function moveAnimation() {
|
||||
@ -329,10 +319,10 @@ const getTowerData = async () => {
|
||||
const res = await getNewestTowerApi({
|
||||
devSn: towerDevSn.value
|
||||
});
|
||||
if (res.result !=null) {
|
||||
if (res.result != null) {
|
||||
towerDetail.value = res.result;
|
||||
}else{
|
||||
towerDetail.value=[]
|
||||
} else {
|
||||
towerDetail.value = [];
|
||||
}
|
||||
console.log("获取塔吊实时数据", res);
|
||||
};
|
||||
@ -343,16 +333,19 @@ const getTowerNumAndAlarmList = async () => {
|
||||
projectSn: store.sn
|
||||
});
|
||||
if (res.result) {
|
||||
towerValue.value = res.result.deviceList[0].id;
|
||||
towerDevSn.value = res.result.deviceList[0].devSn;
|
||||
noiseList.value = res.result.deviceList;
|
||||
console.log("塔吊option", noiseList.value);
|
||||
mitts.emit("selectId", towerValue.value);
|
||||
await getTowerDetail();
|
||||
await getTowerData();
|
||||
await getSelectTower();
|
||||
await getDriverInfoList();
|
||||
await getNewestData();
|
||||
console.log("获取塔吊列表", res);
|
||||
if (res.result.deviceList.length > 0) {
|
||||
towerValue.value = res.result.deviceList[0].id;
|
||||
towerDevSn.value = res.result.deviceList[0].devSn;
|
||||
noiseList.value = res.result.deviceList;
|
||||
console.log("塔吊option", noiseList.value);
|
||||
mitts.emit("selectId", towerValue.value);
|
||||
await getTowerDetail();
|
||||
await getTowerData();
|
||||
await getSelectTower();
|
||||
await getDriverInfoList();
|
||||
await getNewestData();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@ -653,7 +646,7 @@ onMounted(async () => {
|
||||
}
|
||||
}
|
||||
.driverPhoto {
|
||||
top: 64%;
|
||||
top: 59%;
|
||||
position: absolute;
|
||||
left: 94%;
|
||||
img {
|
||||
@ -694,6 +687,22 @@ onMounted(async () => {
|
||||
}
|
||||
}
|
||||
}
|
||||
.notoDta {
|
||||
width: 20%;
|
||||
height: 20%;
|
||||
margin-top: 20%;
|
||||
margin-left: 40%;
|
||||
img {
|
||||
width: 30%;
|
||||
margin: 6% 36%;
|
||||
}
|
||||
p {
|
||||
width: 100%;
|
||||
color: #fff;
|
||||
font-size: calc(100vw * 14 / 1920);
|
||||
margin: -5% 41%;
|
||||
}
|
||||
}
|
||||
::v-deep .el-input__wrapper {
|
||||
background: #112d59;
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user