1324 lines
33 KiB
Vue
1324 lines
33 KiB
Vue
<template>
|
||
<ScaleBox :width="1920" :height="1080" bgc="transparent" :delay="100" :isFlat="false" @scaleChange="scaleChange">
|
||
<!-- <div class="container"> -->
|
||
<div class="largeScreen" :class="{'largeScreen1': store.isIframe}" ref="dataScreenRef" style="width: 100%; height: 100%">
|
||
<div v-if="!store.isIframe" class="header" :class="!EntityMap.Mapswitch ? 'storeheader' : ''">
|
||
<!-- <div class="hearderIcon"><img src="@/assets/images/jxjLogo.png" alt="" /></div> -->
|
||
<span class="projectTitle" v-if="!isEditTitle">
|
||
<p>{{ projectTitle }}</p>
|
||
<el-icon class="editIcon" size="20px" color="#b6d0e5" @click="handleEditTitle"><Edit /></el-icon>
|
||
<!-- <p>江坑110kv变电站智慧工地</p> -->
|
||
</span>
|
||
<span class="projectTitle" v-if="isEditTitle">
|
||
<el-input
|
||
type="text"
|
||
style="width: 400px"
|
||
v-model="editTitle"
|
||
@change="handleChangeTitle"
|
||
@blur="isEditTitle = false"
|
||
ref="titleInputRef"
|
||
/>
|
||
</span>
|
||
<div class="time">{{ nowTime }}</div>
|
||
|
||
<!-- 新版 去掉子标题 -->
|
||
<!-- <span :class="{ projectSmallTitle: true, zsbf: COMPANY === 'zsbf' }">
|
||
<p>{{ projectTimeInfo.name || "" }}</p>
|
||
</span> -->
|
||
<div class="rightIcon" @click.stop>
|
||
<!-- <div class="Icon">
|
||
<img src="@/assets/images/dustNoise/jobIcon.png" alt="" />
|
||
</div>
|
||
<div class="Icon">
|
||
<img src="@/assets/images/dustNoise/ysbfIcon.png" alt="" />
|
||
</div>
|
||
<div class="Icon">
|
||
<img src="@/assets/images/dustNoise/sjzxIcon.png" alt="" />
|
||
</div>
|
||
<div class="Icon">
|
||
<img src="@/assets/images/dustNoise/dpIcon.png" alt="" />
|
||
</div>-->
|
||
<div class="Icon">
|
||
<img src="@/assets/images/dustNoise/tbsjIcon.png" alt="" />
|
||
</div>
|
||
<div class="Icon" @click="showUserBox = !showUserBox">
|
||
<img src="@/assets/images/dustNoise/ryIcon.png" alt="" />
|
||
</div>
|
||
|
||
<!-- <el-dropdown trigger="click">
|
||
|
||
<template #dropdown>
|
||
<div class="userDialog" @click="loginOut">退出登录</div>
|
||
</template>
|
||
</el-dropdown>-->
|
||
</div>
|
||
<div class="userBox" v-show="showUserBox">
|
||
<div class="userItem">
|
||
<div class="sanJiao"></div>
|
||
<div class="userIcon">
|
||
<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>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 原项目 -->
|
||
<template v-if="EntityMap.Mapswitch">
|
||
<div class="menuList">
|
||
<div v-for="(item, index) in menuList" :key="index" class="menStyle">
|
||
<div
|
||
:index="item.modulePath"
|
||
:class="{
|
||
subMenu: true,
|
||
active: activeTab === item.modulePath
|
||
}"
|
||
>
|
||
<!-- zsbf: COMPANY === 'zsbf' -->
|
||
<span @click="navigateTo(item, 1)">{{ item.moduleName }}</span>
|
||
</div>
|
||
</div>
|
||
<div :class="{ subMenuList: true }" v-if="itemList != null && itemList.length >= 1">
|
||
<!-- , zsbf: COMPANY === 'zsbf' -->
|
||
<el-scrollbar ref="scrollbarRef" class="scrollItem" @wheel.prevent="handleScroll">
|
||
<div class="subMenuItem">
|
||
<div
|
||
class="subItem"
|
||
:class="{ active: activeTab2 === data.companyPath }"
|
||
:style="COMPANY === 'hfqc' ? 'width:120px' : ''"
|
||
v-for="(data, i) in itemList"
|
||
:key="i"
|
||
:index="data.companyPath"
|
||
@click="navigateTo(data, 2)"
|
||
>
|
||
<span style="white-space: nowrap">{{ data.menuName }}</span>
|
||
</div>
|
||
</div>
|
||
</el-scrollbar>
|
||
</div>
|
||
</div>
|
||
<!-- <div class="contentDate">
|
||
<span>
|
||
自{{ projectTimeInfo.contractPeriodStartTime }}起开始计算，至今日{{ nowDate }}为
|
||
<span class="numColor"> {{ projectPassDay }} </span>个日历天
|
||
</span>
|
||
</div> -->
|
||
<div class="dataBoardContent">
|
||
<router-view></router-view>
|
||
</div>
|
||
</template>
|
||
|
||
<div v-if="!EntityMap.Mapswitch" class="map-box">
|
||
<ProjectShow />
|
||
</div>
|
||
</div>
|
||
<!-- </div> -->
|
||
</ScaleBox>
|
||
</template>
|
||
|
||
<script lang="ts" setup>
|
||
import { Edit } from "@element-plus/icons-vue";
|
||
// 大屏模块--
|
||
import ProjectShow from "@/views/sevenLargeScreen/projectshow/index.vue";
|
||
|
||
import { MapViewdata } from "@/stores/modules/map3D";
|
||
const EntityMap = MapViewdata();
|
||
|
||
// 大屏模块--
|
||
import ScaleBox from "vue3-scale-box";
|
||
import { ElMessage } from "element-plus";
|
||
import { ref, reactive, onMounted, onBeforeUnmount, computed, nextTick } from "vue";
|
||
import { getTaskTimeDetail } from "@/api/modules/schedulePlan";
|
||
import { queryByProject, addLargeScreenConfig, updateLargeScreenConfig } from "@/api/modules/config";
|
||
import { jumpLargeUserInfoApi, jumpLargeByUserIdApi, getAllModule, getScreenAuthModuleAndMenuApi } from "@/api/modules/login";
|
||
import {
|
||
JSYCMenu,
|
||
XJNBMenu,
|
||
AHSAMenu,
|
||
HFQCMenu,
|
||
ASMenu,
|
||
AGJTMenu,
|
||
SLXMenu,
|
||
ZSBFMenu,
|
||
ZHZRFMenu,
|
||
ZKAXMenu,
|
||
CQNAMenu,
|
||
ZKJCMenu,
|
||
CPGSMenu,
|
||
TJMenu,
|
||
SCWCMenu,
|
||
JZJTMenu,
|
||
BTHGMenu,
|
||
DLJBMenu,
|
||
WHZTMenu,
|
||
ZTSYJMenu,
|
||
XNYZHJJMenu,
|
||
GWKJMenu,
|
||
JXWJJMenu,
|
||
ALLXMMenu,
|
||
HBLAMenu,
|
||
QYGMenu
|
||
} from "@/config/staticMenu";
|
||
import { COMPANY } from "@/config/config";
|
||
import { useRouter } from "vue-router";
|
||
import { GlobalStore } from "@/stores";
|
||
const store = GlobalStore();
|
||
const BASEURL = import.meta.env.VITE_API_URL;
|
||
|
||
const isEditTitle = ref(false);
|
||
const editTitle = ref("");
|
||
const titleInputRef = ref(null as any);
|
||
const projectTitle = ref("");
|
||
const titleConfig = ref(null);
|
||
const initProjectTitle = async () => {
|
||
let title = "数字化项目监管平台";
|
||
if (COMPANY === "xjnb") {
|
||
title = "智慧工地项目监管平台";
|
||
}
|
||
projectTitle.value = title;
|
||
await getTitleConfig();
|
||
};
|
||
const getTitleConfig = async () => {
|
||
const res: any = await queryByProject({ configKey: "largeScreenTitle", projectSn: store.sn });
|
||
console.log(res, "res");
|
||
if (res.code === 200) {
|
||
const { title: curTitle } = JSON.parse(res.result?.configValue || "{}");
|
||
titleConfig.value = res.result;
|
||
if (curTitle) {
|
||
projectTitle.value = curTitle;
|
||
}
|
||
}
|
||
};
|
||
|
||
const handleEditTitle = () => {
|
||
editTitle.value = projectTitle.value;
|
||
isEditTitle.value = true;
|
||
nextTick(() => {
|
||
titleInputRef.value.focus();
|
||
});
|
||
};
|
||
|
||
const handleChangeTitle = async () => {
|
||
if (editTitle.value.trim() !== "") {
|
||
const api = titleConfig.value?.id ? updateLargeScreenConfig : addLargeScreenConfig;
|
||
const res = await api({
|
||
id: titleConfig.value?.id,
|
||
configKey: "largeScreenTitle",
|
||
projectSn: store.sn,
|
||
configValue: JSON.stringify({ title: editTitle.value })
|
||
});
|
||
if (res.code === 200) {
|
||
isEditTitle.value = false;
|
||
projectTitle.value = editTitle.value;
|
||
}
|
||
} else {
|
||
ElMessage.error("请输入项目名称");
|
||
}
|
||
};
|
||
|
||
let nowTime = ref("2023-04-16 09:22:12" as any);
|
||
|
||
let nowDate = ref("2023.11.16" as any);
|
||
|
||
let projectPassDay = ref(0 as any);
|
||
//获取项目信息
|
||
const projectTimeInfo = ref({} as any);
|
||
const contentWidth = ref(0);
|
||
const contentHeight = ref(0);
|
||
const calculateAspectRatio = () => {
|
||
const container = document.querySelector(".largeScreen");
|
||
// const containerWidth = document.body.offsetWidth;
|
||
const containerWidth = document.documentElement.offsetWidth;
|
||
// const containerWidth: number = (<HTMLElement>container).offsetWidth;
|
||
// const containerHeight = document.body.offsetHeight;
|
||
const containerHeight = document.documentElement.offsetHeight;
|
||
// const containerHeight: number = (<HTMLElement>container).offsetHeight;
|
||
console.log(containerWidth, containerHeight);
|
||
const aspectRatio = 16 / 9; // 16:9 比例
|
||
const containerAspectRatio = containerWidth / containerHeight;
|
||
if (containerAspectRatio > aspectRatio) {
|
||
// 以高度为基准，按比例计算宽度
|
||
contentHeight.value = containerHeight;
|
||
contentWidth.value = Math.floor(containerHeight * aspectRatio);
|
||
} else {
|
||
// 以宽度为基准，按比例计算高度
|
||
contentWidth.value = containerWidth;
|
||
contentHeight.value = Math.floor(containerWidth / aspectRatio);
|
||
}
|
||
console.log("contentWidth", contentWidth.value);
|
||
console.log("contentHeight", contentHeight.value);
|
||
};
|
||
const scaleChange = (data: any) => {
|
||
store.globalScale = data;
|
||
};
|
||
const getProjectInfo = async () => {
|
||
getNowDate();
|
||
const res: any = await getTaskTimeDetail({ projectSn: store.sn });
|
||
console.log("获取项目信息", res);
|
||
projectTimeInfo.value = res.result;
|
||
projectPassDay.value = calculateDaysPassed(projectTimeInfo.value.contractPeriodStartTime);
|
||
};
|
||
|
||
function calculateDaysPassed(startDate: any) {
|
||
const start = new Date(startDate);
|
||
const today = new Date();
|
||
const timeDiff = today.getTime() - start.getTime();
|
||
const daysPassed = Math.floor(timeDiff / (1000 * 60 * 60 * 24));
|
||
return daysPassed;
|
||
}
|
||
|
||
function getNowDate() {
|
||
const date = new Date();
|
||
const year = date.getFullYear();
|
||
const month = ("0" + (date.getMonth() + 1)).slice(-2);
|
||
const day = ("0" + date.getDate()).slice(-2);
|
||
const formattedDate = `${year}-${month}-${day}`;
|
||
nowDate.value = formattedDate;
|
||
// console.log(formattedDate); // 输出 "2021-06-01"
|
||
}
|
||
|
||
let showUserBox = ref(false as any);
|
||
let adminName = ref("" as any);
|
||
let menuList = ref([]);
|
||
// let menuList = ref([
|
||
// {
|
||
// moduleName: "综合管理",
|
||
// modulePath: "/projectOverviewL",
|
||
// menuList: [
|
||
// {
|
||
// menuName: "新工程概况",
|
||
// companyPath: "/projectOverviewL"
|
||
// },
|
||
// {
|
||
// menuName: "工程概况",
|
||
// companyPath: "/projectOverview"
|
||
// },
|
||
// {
|
||
// menuName: "智慧党建",
|
||
// companyPath: "/smartPartyBuilding"
|
||
// },
|
||
// {
|
||
// menuName: "双碳管理",
|
||
// companyPath: "/projectioter"
|
||
// }
|
||
// // {
|
||
// // menuName: "工程概况-1",
|
||
// // companyPath: "/projectOverviewer"
|
||
// // }
|
||
// ]
|
||
// },
|
||
// {
|
||
// moduleName: "数字工地",
|
||
// modulePath: "/videoManagement",
|
||
// menuList: [
|
||
// {
|
||
// menuName: "视频管理",
|
||
// companyPath: "/videoManagement"
|
||
// },
|
||
// {
|
||
// menuName: "AI预警",
|
||
// companyPath: "/aIEarlyWarning"
|
||
// },
|
||
// {
|
||
// menuName: "地磅管理",
|
||
// companyPath: "/loadometerManage"
|
||
// },
|
||
// {
|
||
// menuName: "车辆管理",
|
||
// companyPath: "/vehicleManagement"
|
||
// },
|
||
// {
|
||
// menuName: "车辆测速",
|
||
// companyPath: "/vehicleManagspeed"
|
||
// },
|
||
// {
|
||
// menuName: "配电箱监测",
|
||
// companyPath: "/distributionMonitoring"
|
||
// },
|
||
// {
|
||
// menuName: "标养室监测",
|
||
// companyPath: "/standardCureRoom"
|
||
// },
|
||
// {
|
||
// menuName: "车辆定位",
|
||
// companyPath: "/carPosition"
|
||
// },
|
||
// {
|
||
// menuName: "机械设备定位",
|
||
// companyPath: "/equipmentPosition"
|
||
// },
|
||
// {
|
||
// menuName: "智能安全帽",
|
||
// companyPath: "/smartSafeHat"
|
||
// },
|
||
// {
|
||
// menuName: "新智能安全帽",
|
||
// companyPath: "/smartSafeHater"
|
||
// }
|
||
// ]
|
||
// },
|
||
// {
|
||
// moduleName: "劳务管理",
|
||
// modulePath: "/laborManagement",
|
||
// menuList: [
|
||
// {
|
||
// menuName: "劳务管理",
|
||
// companyPath: "/laborManagement"
|
||
// }
|
||
// ]
|
||
// },
|
||
// {
|
||
// moduleName: "安全管理",
|
||
// modulePath: "/securityManagement",
|
||
// menuList: [
|
||
// {
|
||
// menuName: "安全管理",
|
||
// companyPath: "/securityManagement"
|
||
// },
|
||
// {
|
||
// companyPath: "/foundationPitMonitor",
|
||
// menuName: "基坑监测"
|
||
// },
|
||
// {
|
||
// menuName: "隧道定位监测",
|
||
// companyPath: "/tunnelPosition"
|
||
// },
|
||
// {
|
||
// menuName: "临边防护网",
|
||
// companyPath: "/edgeProtection"
|
||
// },
|
||
// {
|
||
// menuName: "有毒气体监测",
|
||
// companyPath: "/toxicGasMonitor"
|
||
// },
|
||
// {
|
||
// menuName: "高支模监测",
|
||
// companyPath: "/highFormwork"
|
||
// },
|
||
// {
|
||
// menuName: "高边坡监测",
|
||
// companyPath: "/highSlope"
|
||
// },
|
||
// {
|
||
// menuName: "烟感监测",
|
||
// companyPath: "/smokeSensor"
|
||
// },
|
||
// {
|
||
// menuName: "安全教育",
|
||
// companyPath: "/safeEducation"
|
||
// },
|
||
// {
|
||
// menuName: "外墙脚手架",
|
||
// companyPath: "/wallScaffold2"
|
||
// },
|
||
// {
|
||
// menuName: "临边防护",
|
||
// companyPath: "/newEdgeProtection"
|
||
// }
|
||
// ]
|
||
// },
|
||
// {
|
||
// moduleName: "质量管理",
|
||
// modulePath: "/qualityManagement",
|
||
// menuList: [
|
||
// {
|
||
// menuName: "质量管理",
|
||
// companyPath: "/qualityManagement"
|
||
// },
|
||
// {
|
||
// menuName: "混凝土测温",
|
||
// companyPath: "/concreteMonitor"
|
||
// },
|
||
// {
|
||
// menuName: "进度计划",
|
||
// companyPath: "/schedulePlan"
|
||
// }
|
||
// ]
|
||
// },
|
||
// {
|
||
// moduleName: "绿色施工",
|
||
// modulePath: "/headNoise",
|
||
// menuList: [
|
||
// {
|
||
// menuName: "扬尘噪声",
|
||
// companyPath: "/headNoise"
|
||
// },
|
||
// {
|
||
// companyPath: "/electricityMonitor",
|
||
// menuName: "用电监测"
|
||
// },
|
||
// {
|
||
// companyPath: "/waterMonitor",
|
||
// menuName: "用水监测"
|
||
// },
|
||
// {
|
||
// companyPath: "/sewageMonitor",
|
||
// menuName: "污水监测"
|
||
// },
|
||
// {
|
||
// companyPath: "/rainfallMonitoring",
|
||
// menuName: "雨量监测"
|
||
// }
|
||
// ]
|
||
// },
|
||
// {
|
||
// moduleName: "大型机械",
|
||
// modulePath: "/towerCraneMonitoring",
|
||
// menuList: [
|
||
// {
|
||
// menuName: "塔吊监测",
|
||
// companyPath: "/towerCraneMonitoring"
|
||
// },
|
||
// {
|
||
// menuName: "汽车吊监测",
|
||
// companyPath: "/cathangCrane"
|
||
// },
|
||
// {
|
||
// menuName: "履带吊监测",
|
||
// companyPath: "/trackCrane"
|
||
// },
|
||
// {
|
||
// menuName: "升降机监测",
|
||
// companyPath: "/elevatorMonitoring"
|
||
// },
|
||
// {
|
||
// menuName: "卸料平台",
|
||
// companyPath: "/unloadPlatform"
|
||
// },
|
||
// {
|
||
// menuName: "混凝土拌合站",
|
||
// companyPath: "/concreteMixingPlant"
|
||
// },
|
||
// {
|
||
// menuName: "龙门吊监测",
|
||
// companyPath: "/gantryCrane"
|
||
// },
|
||
// {
|
||
// companyPath: "/erectCrane",
|
||
// menuName: "架桥机"
|
||
// },
|
||
// {
|
||
// companyPath: "/hangBasket",
|
||
// menuName: "挂篮监测"
|
||
// },
|
||
// {
|
||
// companyPath: "/pressureTestMachine",
|
||
// menuName: "压力试验机"
|
||
// },
|
||
// {
|
||
// companyPath: "/universalTestMachine",
|
||
// menuName: "万能试验机"
|
||
// },
|
||
// {
|
||
// companyPath: "/compressionIntegrate",
|
||
// menuName: "抗压一体机"
|
||
// },
|
||
// {
|
||
// companyPath: "/asphaltMixer",
|
||
// menuName: "沥青拌合站"
|
||
// },
|
||
// {
|
||
// companyPath: "/waterStabilizedMixer",
|
||
// menuName: "水稳拌合站"
|
||
// },
|
||
// {
|
||
// companyPath: "/intelligentTension",
|
||
// menuName: "智能张拉"
|
||
// },
|
||
// {
|
||
// companyPath: "/intelligentGrout",
|
||
// menuName: "智能压浆"
|
||
// },
|
||
// {
|
||
// companyPath: "/roadPaving",
|
||
// menuName: "路面摊铺"
|
||
// },
|
||
// {
|
||
// companyPath: "/roadCompaction",
|
||
// menuName: "路面压实"
|
||
// }
|
||
// ]
|
||
// },
|
||
// { moduleName: "BIM模型", modulePath: "/bImModel" }
|
||
// ]);
|
||
const itemList = ref([]);
|
||
const activeTab = ref(0);
|
||
const activeTab2 = ref("");
|
||
const router = useRouter();
|
||
const getAspectRatioStyle = computed(() => ({
|
||
width: `${contentWidth.value}px`,
|
||
height: `${contentHeight.value}px`
|
||
}));
|
||
//获取动态tab
|
||
const getAllModelMenu = () => {
|
||
let half = store.projectDateAuth.moduleList;
|
||
half.forEach((item: any) => {
|
||
if (item.moduleType == 4) {
|
||
menuList.value.push(item);
|
||
return;
|
||
}
|
||
});
|
||
console.log("筛选出的数据看板路由", menuList.value);
|
||
};
|
||
|
||
const navigateTo = (path, type) => {
|
||
console.log("点击的路由---", path, type);
|
||
if (type == 1) {
|
||
activeTab.value = path.modulePath;
|
||
activeTab2.value = path.menuList.length ? path.menuList[0].companyPath : path.modulePath;
|
||
itemList.value = path.menuList;
|
||
let index = activeTab2.value.indexOf("?");
|
||
console.log("获取到的参数----", index);
|
||
if (index > -1) {
|
||
let result = activeTab2.value.substring(index);
|
||
const uIndex = result.indexOf("url=");
|
||
if (uIndex > -1) {
|
||
const url = result.substring(uIndex + 4);
|
||
console.log("获取到的参数----", url);
|
||
router.push({
|
||
path: activeTab2.value,
|
||
query: {
|
||
url
|
||
}
|
||
});
|
||
return;
|
||
}
|
||
}
|
||
router.push({
|
||
path: activeTab2.value
|
||
});
|
||
} else {
|
||
activeTab2.value = path.companyPath;
|
||
let index = path.companyPath.indexOf("?");
|
||
console.log("获取到的参数----", index);
|
||
if (index > -1) {
|
||
let result = path.companyPath.substring(index);
|
||
const uIndex = result.indexOf("url=");
|
||
if (uIndex > -1) {
|
||
const url = result.substring(uIndex + 4);
|
||
console.log("获取到的参数----", url);
|
||
router.push({
|
||
path: path.companyPath,
|
||
query: {
|
||
url
|
||
}
|
||
});
|
||
return;
|
||
}
|
||
}
|
||
// console.log("点击的路由---", activeTab2.value);
|
||
router.push({
|
||
path: path.companyPath
|
||
});
|
||
}
|
||
};
|
||
|
||
// 获取动态菜单
|
||
const getModuleMenu = async () => {
|
||
const res = await getScreenAuthModuleAndMenuApi();
|
||
console.info(res, "allModule");
|
||
if (res.code == 200) {
|
||
const list = res.result || [];
|
||
if (list.length) {
|
||
menuList.value = list.map(item => {
|
||
let childrenList = item.children?.map(val => {
|
||
return {
|
||
menuName: val.name,
|
||
companyPath: val.routePath
|
||
};
|
||
});
|
||
return {
|
||
moduleName: item.name,
|
||
modulePath: item.routePath,
|
||
menuList: childrenList
|
||
};
|
||
});
|
||
}
|
||
}
|
||
// const res = await getAllModule({ moduleType: 8, userId: store.userId, projectSn: store.sn });
|
||
// console.info(res, "allModule");
|
||
// if (res.code == 200) {
|
||
// const { moduleList } = res.result;
|
||
// if (moduleList.length) {
|
||
// menuList.value = moduleList;
|
||
// }
|
||
// }
|
||
};
|
||
onMounted(async () => {
|
||
if (window.location.href.indexOf("token") != -1) {
|
||
console.log("免登录跳转进来了吗----", window.location.href.indexOf("token"));
|
||
const newToken = window.location.href.split("token=")[1].split("&")[0];
|
||
const data: any = await jumpLargeUserInfoApi({ token: newToken });
|
||
console.log("跳转请求的数据----", data.result);
|
||
if (data.result.sn) {
|
||
store.setSN(data.result.sn);
|
||
}
|
||
store.setToken(data.result.token);
|
||
store.setAccount(data.result.account);
|
||
store.setAccountType(data.result.accountType);
|
||
store.setProjectDateAuth(data.menuAuthority);
|
||
}
|
||
if (window.location.href.indexOf("userId") != -1) {
|
||
console.log("免登录跳转进来了吗----", window.location.href.indexOf("userId"));
|
||
const newUserId = window.location.href.split("userId=")[1].split("&")[0];
|
||
let projectSn = window.location.href.split("sn=")[1];
|
||
projectSn.includes("&") && (projectSn = projectSn.split("&")[0]);
|
||
let isIframe = window.location.href.split("isIframe=")[1];
|
||
if(isIframe){
|
||
isIframe.includes("&") && (isIframe = isIframe.split("&")[0]);
|
||
isIframe === "true" && (store.setIsIframe(true));
|
||
} else {
|
||
store.setIsIframe(false);
|
||
}
|
||
|
||
|
||
console.log("获取到的参数----", newUserId, projectSn, isIframe);
|
||
// return
|
||
const data: any = await jumpLargeByUserIdApi({ userId: newUserId });
|
||
console.log("跳转请求的数据----", data.result);
|
||
if (data.result.sn) {
|
||
const accountTypeList = [2, 3, 4, 7];
|
||
const sn = accountTypeList.includes(data.result.accountType) ? projectSn : data.result.sn;
|
||
console.log("获取到的参数----1111", sn);
|
||
store.setSN(sn);
|
||
}
|
||
console.log("获取到的参数----", store.sn);
|
||
store.setToken(data.result.token);
|
||
store.setAccount(data.result.account);
|
||
store.setAccountType(data.result.accountType);
|
||
store.setProjectDateAuth(data.menuAuthority);
|
||
}
|
||
initProjectTitle();
|
||
await getModuleMenu();
|
||
if (COMPANY === "jsyc") {
|
||
menuList.value = JSYCMenu;
|
||
}
|
||
if (COMPANY === "xjnb") {
|
||
menuList.value = XJNBMenu;
|
||
}
|
||
if (COMPANY === "ahsa") {
|
||
menuList.value = AHSAMenu;
|
||
}
|
||
if (COMPANY === "hfqc") {
|
||
menuList.value = HFQCMenu;
|
||
}
|
||
if (COMPANY === "as") {
|
||
menuList.value = ASMenu;
|
||
}
|
||
if (COMPANY === "agjt") {
|
||
menuList.value = AGJTMenu;
|
||
}
|
||
if (COMPANY === "slx") {
|
||
menuList.value = SLXMenu;
|
||
}
|
||
if (COMPANY === "zsbf") {
|
||
menuList.value = ZSBFMenu;
|
||
}
|
||
if (COMPANY === "zhzrf") {
|
||
menuList.value = ZHZRFMenu;
|
||
}
|
||
if (COMPANY === "zkax") {
|
||
menuList.value = ZKAXMenu;
|
||
}
|
||
if (COMPANY === "cqna") {
|
||
menuList.value = CQNAMenu;
|
||
}
|
||
if (COMPANY === "zkjc") {
|
||
menuList.value = ZKJCMenu;
|
||
}
|
||
if (COMPANY === "cpgs") {
|
||
menuList.value = CPGSMenu;
|
||
}
|
||
if (COMPANY === "tj") {
|
||
menuList.value = TJMenu;
|
||
}
|
||
if (COMPANY === "scwc") {
|
||
menuList.value = SCWCMenu;
|
||
}
|
||
if (COMPANY === "jzjt") {
|
||
menuList.value = JZJTMenu;
|
||
}
|
||
if (COMPANY === "bthg") {
|
||
menuList.value = BTHGMenu;
|
||
}
|
||
if (COMPANY === "dljb") {
|
||
menuList.value = DLJBMenu;
|
||
}
|
||
if (COMPANY === "whzt") {
|
||
menuList.value = WHZTMenu;
|
||
}
|
||
if (COMPANY === "ztsyj") {
|
||
menuList.value = ZTSYJMenu;
|
||
}
|
||
if (COMPANY === "xnyzhjj") {
|
||
menuList.value = XNYZHJJMenu;
|
||
}
|
||
if (COMPANY === "gwkj") {
|
||
menuList.value = GWKJMenu;
|
||
}
|
||
if (COMPANY === "jxwjj") {
|
||
menuList.value = JXWJJMenu;
|
||
}
|
||
if (COMPANY === "allxm") {
|
||
menuList.value = ALLXMMenu;
|
||
}
|
||
if (COMPANY === "hbla") {
|
||
menuList.value = HBLAMenu;
|
||
}
|
||
if (COMPANY === "qyg") {
|
||
menuList.value = QYGMenu;
|
||
}
|
||
console.log("配置菜单", menuList.value);
|
||
console.log("当前跳转的路由", router.currentRoute.value);
|
||
adminName.value = store.account;
|
||
if (!menuList.value.length) {
|
||
// 暂无权限，请联系管理员配置权限
|
||
return ElMessage({
|
||
message: "暂无权限，请联系管理员配置权限",
|
||
type: "warning"
|
||
});
|
||
}
|
||
// await getAllModelMenu();
|
||
// activeTab2.value = router.currentRoute.value;
|
||
activeTab.value = menuList.value[0].modulePath;
|
||
activeTab2.value = menuList.value[0].modulePath;
|
||
itemList.value = menuList.value[0].menuList;
|
||
//数据看板跳转免登录
|
||
navigateTo(menuList.value[0], 1);
|
||
|
||
// console.log("进入页面， ");
|
||
// console.log("store数据", store.account);
|
||
// menuClick(menuList.value[0], activeIndex.value);
|
||
getNowTime();
|
||
document.addEventListener("click", bodyCloseMenus);
|
||
// nextTick(async () => {
|
||
// const subMenus = document.querySelectorAll(".menStyle");
|
||
// const dataBoardContent = document.querySelector(".dataBoardContent");
|
||
// if (subMenus.length >= 5 && COMPANY !== "hfqc") {
|
||
// subMenus[4].style.marginLeft = "30%";
|
||
// }
|
||
// if (COMPANY === "hfqc") {
|
||
// subMenus[3].style.marginLeft = "44%";
|
||
// }
|
||
// if (COMPANY === "zhzrf") {
|
||
// // subMenus[4].style.marginLeft = "34%";
|
||
// }
|
||
// if (COMPANY === "agjt") {
|
||
// dataBoardContent.style.height = "85%";
|
||
// dataBoardContent.style.margin = "30px auto 16px auto";
|
||
// }
|
||
// if (COMPANY === "zkjc") {
|
||
// console.info(subMenus, "==========");
|
||
// subMenus[1].style.marginLeft = "5%";
|
||
// subMenus[1].style.marginRight = "auto";
|
||
// subMenus[2].style.marginRight = "5%";
|
||
// subMenus[3].style.marginRight = "5%";
|
||
// }
|
||
// });
|
||
await getProjectInfo();
|
||
|
||
calculateAspectRatio();
|
||
window.addEventListener("resize", calculateAspectRatio);
|
||
});
|
||
|
||
let timer = ref(null as any);
|
||
onBeforeUnmount(() => {
|
||
clearInterval(timer);
|
||
document.removeEventListener("click", bodyCloseMenus);
|
||
window.removeEventListener("resize", calculateAspectRatio);
|
||
});
|
||
|
||
function bodyCloseMenus() {
|
||
if (showUserBox.value === true) {
|
||
showUserBox.value = false;
|
||
}
|
||
}
|
||
|
||
function getNowTime() {
|
||
let speed = 1000;
|
||
let theNowTime = function () {
|
||
nowTime.value = timeNumber();
|
||
};
|
||
timer.value = setInterval(theNowTime, speed);
|
||
}
|
||
function timeNumber() {
|
||
let today = new Date();
|
||
let date = today.getFullYear() + "-" + twoDigits(today.getMonth() + 1) + "-" + twoDigits(today.getDate());
|
||
let time = twoDigits(today.getHours()) + ":" + twoDigits(today.getMinutes()) + ":" + twoDigits(today.getSeconds());
|
||
return date + " " + time;
|
||
}
|
||
function twoDigits(val: any) {
|
||
if (val < 10) return "0" + val;
|
||
return val;
|
||
}
|
||
|
||
function loginOut() {
|
||
localStorage.removeItem("GlobalState");
|
||
location.reload();
|
||
router.push("/login");
|
||
}
|
||
//跳转后台
|
||
function jumpBgd() {
|
||
const envList = ["agjt", "zkax", "zkjc", "hfqc", "cpgs", "cqna", "jzjt", "tj", "scwc", "bthg", "zmml"]; // 环境标识
|
||
// 标准版——跳转演示平台项目后台
|
||
if (COMPANY == "" || COMPANY == "gsgs") {
|
||
console.log(2222, window.location);
|
||
// window.location.replace("http://192.168.34.216:8080/#/login?token=" + store.token);
|
||
// window.location.replace("http://jxj.zhgdyun.com:100/#/login?token=" + store.token);
|
||
// window.location.replace(BASEURL + "/#/login?token=" + store.token);
|
||
// 新项目通用(百色服务器)
|
||
// window.location.replace("http://101.43.164.214:11111/#/login?token=" + store.token);
|
||
window.location.replace(`${window.location.protocol}//${window.location.host}/#/login?token=` + store.token);
|
||
} else if (COMPANY === "tj") {
|
||
window.location.replace("http://192.168.110.220:9809/#/login?token=" + store.token);
|
||
} else if (COMPANY === "as") {
|
||
window.location.replace("http://182.90.224.237:15551/#/login?token=" + store.token);
|
||
} else if (COMPANY === "scwc") {
|
||
window.location.replace("http://192.168.9.249:9809/#/login?token=" + store.token);
|
||
} else if (COMPANY === "jxwjj") {
|
||
window.location.replace("http://183.249.224.118:9000/#/login?token=" + store.token); //嘉兴王江泾公用码头
|
||
} else if (COMPANY === "xnyzhjj") {
|
||
// 内网
|
||
// window.location.replace("http://10.30.102.4:9809/#/login?token=" + store.token);
|
||
// 外网
|
||
window.location.replace("http://117.146.73.156:9809/#/login?token=" + store.token);
|
||
} else if (COMPANY === "gwkj") {
|
||
window.location.replace("http://10.216.103.99:9809/#/login?token=" + store.token);
|
||
} else if (COMPANY === "xnyzhjj") {
|
||
window.location.replace("http://121.37.106.37:9809/#/login?token=" + store.token);
|
||
} else if (envList.includes(COMPANY)) {
|
||
window.location.replace(BASEURL + "/#/login?token=" + store.token);
|
||
} else {
|
||
// 新项目通用(百色服务器)
|
||
window.location.replace("http://101.43.164.214:11111/#/login?token=" + store.token);
|
||
// window.location.replace("http://192.168.34.138:8080/#/login?token=" + store.token);
|
||
// window.open("http://192.168.34.138:8080/#/login?token=" + store.token);
|
||
}
|
||
|
||
// else if (COMPANY === "jzjt") {
|
||
// window.location.replace("http://jxjzw.zhgdyun.com:6089/#/login?token=" + store.token);
|
||
// }
|
||
}
|
||
const scrollbarRef = ref();
|
||
const handleScroll = (e: any) => {
|
||
const wheelDelta = e.wheelDelta || -e.deltaY * 40;
|
||
scrollbarRef.value.setScrollLeft(scrollbarRef.value.wrapRef.scrollLeft - wheelDelta);
|
||
};
|
||
</script>
|
||
|
||
<style>
|
||
.el-popper__arrow {
|
||
background-color: #112d59;
|
||
}
|
||
</style>
|
||
|
||
<style lang="scss" scoped>
|
||
.container {
|
||
width: 100%;
|
||
height: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
.largeScreen1 {
|
||
margin-top: 130px;
|
||
}
|
||
.largeScreen {
|
||
background: url("@/assets/images/bigImg.png") no-repeat;
|
||
background-size: 100% 100%;
|
||
position: relative;
|
||
|
||
.map-box {
|
||
height: 94.5%;
|
||
// background: skyblue;
|
||
transform: translateY(-8.5%);
|
||
position: relative;
|
||
z-index: 2;
|
||
}
|
||
.storeheader {
|
||
position: relative;
|
||
z-index: 20;
|
||
background: url("@/assets/images/backmap.png") no-repeat !important;
|
||
}
|
||
|
||
.header {
|
||
width: 100%;
|
||
height: 12%;
|
||
// background: url("@/assets/images/headerImg.webp") no-repeat;
|
||
// background: url("@/assets/images/backmap.png") no-repeat;
|
||
|
||
background-size: 100% 100%;
|
||
// position: relative;
|
||
// z-index: 6;
|
||
|
||
// .projectTitle {
|
||
// display: flex;
|
||
// align-items: center;
|
||
// justify-content: center;
|
||
// font-size: 44px;
|
||
// color: #fff;
|
||
// font-family: YouSheBiaoTiHei;
|
||
// }
|
||
|
||
.projectTitle {
|
||
display: flex;
|
||
justify-content: center;
|
||
font-size: 36px;
|
||
line-height: 42px;
|
||
color: #fff;
|
||
font-family: AlibabaPuHuiTi;
|
||
width: 84%;
|
||
height: 60px;
|
||
margin: 0 auto;
|
||
background: url("@/assets/images/header/header-bg.png") no-repeat;
|
||
background-size: 100% 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
p {
|
||
margin: 0;
|
||
letter-spacing: 3px;
|
||
text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
|
||
background-image: linear-gradient(90deg, #e6ecff 10%, #c1e3fb 100%);
|
||
color: transparent;
|
||
-webkit-background-clip: text;
|
||
font-weight: 600;
|
||
}
|
||
.editIcon {
|
||
cursor: pointer;
|
||
visibility: hidden;
|
||
}
|
||
&:hover {
|
||
.editIcon {
|
||
visibility: visible;
|
||
}
|
||
}
|
||
::v-deep .el-input__wrapper {
|
||
background: #2758c0;
|
||
background: rgba(39, 88, 192, 0.4);
|
||
border: 1px solid #2758c0;
|
||
.el-input__inner {
|
||
color: #fff;
|
||
}
|
||
}
|
||
}
|
||
|
||
.time {
|
||
font-size: 13px;
|
||
font-family: sadigitalNumber;
|
||
position: absolute;
|
||
left: 16px;
|
||
top: 34px;
|
||
color: #fff;
|
||
}
|
||
|
||
.projectSmallTitle {
|
||
position: absolute;
|
||
top: 6%;
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-size: 20px;
|
||
color: #fff;
|
||
font-family: YouSheBiaoTiHei;
|
||
&.zsbf {
|
||
font-size: 28px;
|
||
top: 5%;
|
||
}
|
||
}
|
||
|
||
.rightIcon {
|
||
position: absolute;
|
||
display: flex;
|
||
// width: 30%;
|
||
top: 30px;
|
||
right: 16px;
|
||
color: #fff;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 16px;
|
||
|
||
.Icon {
|
||
cursor: pointer;
|
||
width: 25px;
|
||
margin-top: 1%;
|
||
}
|
||
}
|
||
}
|
||
|
||
.menuList {
|
||
display: flex;
|
||
justify-content: center;
|
||
height: 6%;
|
||
color: #ccc;
|
||
line-height: 55px;
|
||
margin: -76px auto 0 0;
|
||
font-family: pmzd;
|
||
position: relative;
|
||
z-index: 15;
|
||
gap: 16px;
|
||
|
||
> div {
|
||
position: relative;
|
||
margin-top: 16px;
|
||
height: 32px;
|
||
// width: 9%;
|
||
cursor: pointer;
|
||
// &:nth-of-type(2) {
|
||
// margin-right: 30%;
|
||
// }
|
||
}
|
||
|
||
.subMenu {
|
||
// width: 100%;
|
||
height: 100%;
|
||
display: flex;
|
||
font-size: 16px;
|
||
padding: 0 16px;
|
||
background: url("@/assets/images/header/tab-bg.png") no-repeat;
|
||
background-size: 100% 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
&.zsbf {
|
||
font-size: 24px;
|
||
}
|
||
|
||
&.active {
|
||
background: url("@/assets/images/header/tab-bg-active.png") no-repeat;
|
||
background-size: 100% 100%;
|
||
color: #fff;
|
||
}
|
||
|
||
span {
|
||
// width: 90%;
|
||
// height: 10%;
|
||
// margin-left: 2%;
|
||
line-height: 26px;
|
||
letter-spacing: 1px;
|
||
text-align: center;
|
||
font-family: AlibabaPuHuiTi;
|
||
}
|
||
}
|
||
|
||
.subMenuList {
|
||
position: absolute;
|
||
width: 98%;
|
||
height: 40px;
|
||
// display: flex;
|
||
margin-top: 5%;
|
||
font-size: 14px;
|
||
font-family: none;
|
||
// background: url("@/assets/images/subTabImg.gif") no-repeat;
|
||
// background-size: 100% 35%;
|
||
&.zsbf {
|
||
font-size: 16px;
|
||
}
|
||
|
||
.scrollItem {
|
||
width: 100%;
|
||
height: 40px;
|
||
// height: max-content;
|
||
margin-top: -2%;
|
||
background: url("@/assets/images/header/sub-header-bg.png") no-repeat;
|
||
background-size: 100% 100%;
|
||
// margin-left: 2%;
|
||
|
||
.subMenuItem {
|
||
// width: 100%;
|
||
width: fit-content;
|
||
height: 40px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin: 0 auto;
|
||
|
||
.subItem {
|
||
width: 100px;
|
||
height: 28px;
|
||
line-height: 28px;
|
||
text-align: center;
|
||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||
font-weight: 800;
|
||
font-size: 16px;
|
||
flex-shrink: 0;
|
||
&.active {
|
||
background: url("@/assets/images/header/sub-tab-bg-active.png") no-repeat;
|
||
background-size: 100% 100%;
|
||
font-size: 16px;
|
||
color: #ffffff;
|
||
text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.75);
|
||
}
|
||
}
|
||
|
||
// .subItem:not(:last-child) {
|
||
// margin-right: 0.3%;
|
||
// }
|
||
}
|
||
}
|
||
|
||
// :nth-child(1) {
|
||
// margin-left: 2%;
|
||
// }
|
||
}
|
||
}
|
||
|
||
.contentDate {
|
||
color: #fff;
|
||
float: right;
|
||
margin-right: 2%;
|
||
font-size: 14px;
|
||
|
||
.numColor {
|
||
color: #82fbea;
|
||
font-family: sadigitalNumber;
|
||
font-size: 24px;
|
||
font-weight: bold;
|
||
}
|
||
}
|
||
|
||
.dataBoardContent {
|
||
height: 81%;
|
||
// height: calc(100% - 15px - 50px - 60px - 20px);
|
||
margin: 64px auto 16px auto;
|
||
width: calc(100% - 40px);
|
||
// background-color: #01131F;
|
||
// opacity: 0.9;
|
||
}
|
||
}
|
||
|
||
.userDialog {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
width: 70px;
|
||
height: 25px;
|
||
text-align: center;
|
||
background-color: #112d59;
|
||
color: #5d75a0;
|
||
font-size: 12px;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.userBox {
|
||
position: relative;
|
||
|
||
.userItem {
|
||
position: fixed;
|
||
width: 110px;
|
||
height: 100px;
|
||
right: 26px;
|
||
top: 72px;
|
||
background: #112d59;
|
||
border-radius: 0px 0px 0px 0px;
|
||
border: 0px solid #405e97;
|
||
z-index: 24;
|
||
|
||
.sanJiao {
|
||
position: absolute;
|
||
width: 0;
|
||
height: 0;
|
||
right: 0%;
|
||
top: -10%;
|
||
border-left: 6px solid transparent;
|
||
/* 左边框透明 */
|
||
border-right: 6px solid transparent;
|
||
/* 右边框透明 */
|
||
border-bottom: 6px solid #405e97;
|
||
/* 底部边框颜色 */
|
||
transform: rotate(0deg);
|
||
/* 旋转45度 */
|
||
}
|
||
|
||
.userIcon {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-evenly;
|
||
height: 38px;
|
||
border-bottom: 1px solid #405e97;
|
||
cursor: pointer;
|
||
|
||
.icon {
|
||
width: 18px;
|
||
height: 18px;
|
||
|
||
img {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.userName {
|
||
width: 40px;
|
||
font-size: 12px;
|
||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||
color: #a9bce6;
|
||
white-space: nowrap;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
}
|
||
}
|
||
|
||
.loginOut {
|
||
display: flex;
|
||
justify-content: space-evenly;
|
||
align-items: center;
|
||
height: 26px;
|
||
padding-left: 5px;
|
||
cursor: pointer;
|
||
height: 30px;
|
||
|
||
.loginOutIcon {
|
||
width: 12px;
|
||
height: 12px;
|
||
|
||
img {
|
||
width: 100&;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.userName {
|
||
width: 50px;
|
||
font-size: 12px;
|
||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||
color: #a9bce6;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.loginOut:hover {
|
||
background-color: #2758c0;
|
||
}
|
||
|
||
.hearderIcon {
|
||
left: 1%;
|
||
top: 1%;
|
||
height: 3%;
|
||
width: 8%;
|
||
position: absolute;
|
||
|
||
img {
|
||
width: 100%;
|
||
height: 100%;
|
||
object-fit: contain;
|
||
}
|
||
}
|
||
</style>
|