admin/zhgdlarge
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

七参数页面调整提交

Browse Source
This commit is contained in:
jxj_yjl 2023-09-04 14:43:33 +08:00
parent 31f1fe1ecf
commit b244ea805e
15 changed files with 621 additions and 489 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
.env.development
View File

@ -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'
# 上传

2
public/static/bim.html
View File

@ -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
View File

@ -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就会导致地图搜索失效

5
src/api/modules/login.ts
View File

@ -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
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 613 B

4
src/routers/index.ts
View File

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

16
src/routers/modules/staticRouter.ts
View File

@ -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",

6
src/views/login/index.vue
View File

@ -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) => {

26
src/views/sevenLargeScreen/distributionMonitoring/bottomRight.vue
View File

@ -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%;

14
src/views/sevenLargeScreen/distributionMonitoring/topCenter.vue
View File

@ -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,

39
src/views/sevenLargeScreen/distributionMonitoring/topLeft.vue
View File

@ -17,8 +17,13 @@
</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'">
<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>
@ -26,9 +31,11 @@
</div>
<div class="status">{{ item.isClosed === 1 ? "离线" : "在线" }}</div>
</div>
<!-- <div class="notoDta" v-else>
<img src="@/assets/images/noData.png" alt="" />
<p>暂无数据</p>
</div> -->
</el-scrollbar>
</div>
</div>
</div>
@ -45,7 +52,6 @@ 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 = {
@ -317,7 +323,7 @@ function drawChart() {
width: 26,
color: [
[
analysisData.value/100,
analysisData.value / 100,
new echarts.graphic.LinearGradient(0, 0, 1, 0, [
{
offset: 0.5,
@ -427,7 +433,7 @@ function drawChart() {
]
}
]
};
};
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
src/views/sevenLargeScreen/distributionMonitoring/topRight.vue
View File

@ -22,14 +22,17 @@
<div class="tabTwo">报警时间</div>
<div class="tabThree">报警类型</div>
</div>
<el-scrollbar style="height:85%">
<el-scrollbar style="height: 85%">
<div class="listBox">
<div v-for="item in boxAlarmData.list" class="listStyle" :key="item.id">
<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>
</el-scrollbar>
</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%;
}
}
}
}
}

59
src/views/sevenLargeScreen/indexL.vue
View File

@ -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,8 +77,7 @@ 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: [
let menuList = ref([
{ moduleName: "扬尘噪声", modulePath: "/headNoise" },
{ moduleName: "劳务管理", modulePath: "/laborManagement" },
{ moduleName: "视频管理", modulePath: "/videoManagement" },
@ -83,23 +86,48 @@ let menuData = reactive({
{ moduleName: "塔吊监测", modulePath: "/towerCraneMonitoring" },
{ moduleName: "升降机监测", modulePath: "/elevatorMonitoring" },
{ moduleName: "BIM模型", modulePath: "/bImModel" }
],
activeIndex: 0
});
]);
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>
@ -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;

1
src/views/sevenLargeScreen/towerCraneMonitoring/leftCenter.vue
View File

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

97
src/views/sevenLargeScreen/towerCraneMonitoring/right.vue
View File

@ -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">
@ -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,26 +143,17 @@
<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 class="textColor" style="width: 10%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap">
拆除单位：</span
>{{ towerDetailData.demolitionUnit || "未知" }}
</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,6 +333,8 @@ const getTowerNumAndAlarmList = async () => {
projectSn: store.sn
});
if (res.result) {
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;
@ -354,6 +346,7 @@ const getTowerNumAndAlarmList = async () => {
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;
}