flx：新增人员定位大屏
This commit is contained in:
parent
c8658c737d
commit
ced0beac6b
@ -4,7 +4,7 @@ NODE_ENV = 'development'
|
||||
# 本地环境接口地址(/api/index.ts文件中使用)
|
||||
# 后端本地
|
||||
# VITE_API_URL = 'http://192.168.34.155:19111'
|
||||
VITE_API_URL = 'http://192.168.34.221:9111' #雄哥本地
|
||||
# VITE_API_URL = 'http://192.168.34.221:9111' #雄哥本地
|
||||
# VITE_API_URL = 'http://182.90.224.237:51234' #雄哥远程
|
||||
# VITE_API_URL = 'http://192.168.34.221:28889'
|
||||
# VITE_API_URL = 'http://121.196.214.246/api'
|
||||
@ -25,7 +25,7 @@ VITE_API_URL = 'http://192.168.34.221:9111' #雄哥本地
|
||||
# 七参数标准版(演示平台)
|
||||
# VITE_API_URL = 'http://jxj.zhgdyun.com:9809'
|
||||
# agjt
|
||||
# VITE_API_URL = 'http://42.180.188.17:9809' #生产环境
|
||||
VITE_API_URL = 'http://42.180.188.17:9809' #生产环境
|
||||
# VITE_API_URL = 'http://42.180.188.17:11211' #测试环境
|
||||
# VITE_API_URL = 'http://jxj.zhgdyun.com:19812'
|
||||
# 苏立信/重庆市南岸区
|
||||
|
||||
@ -29,9 +29,10 @@ export const BASE_IMAGE_URL = import.meta.env.VITE_BASE_IMAGE_URL;
|
||||
// export const COMPANY: string = "as"; //鞍山项目
|
||||
// export const COMPANY: string = "agjt"; //鞍钢集团
|
||||
// export const COMPANY: string = "agjtLive"; //鞍钢集团现场大屏
|
||||
export const COMPANY: string = "agjtCommand"; //鞍钢集团指挥部大屏
|
||||
// export const COMPANY: string = "agjtCommand"; //鞍钢集团指挥部大屏
|
||||
// export const COMPANY: string = "agjtProjectKanban"; //鞍钢集团项目看板大屏
|
||||
// export const COMPANY: string = "agjtOverviewScreen"; //鞍钢集团项目总览
|
||||
export const COMPANY: string = "agjtLocationLive"; //鞍钢集团人员定位大屏
|
||||
// export const COMPANY: string = "zkjc"; //中科佳成项目
|
||||
// export const COMPANY: string = "cqna"; //重庆南岸项目
|
||||
// export const COMPANY: string = "slx"; //苏立信项目
|
||||
|
||||
@ -25,9 +25,10 @@ export const staticRouter: RouteRecordRaw[] = [
|
||||
path: "/large",
|
||||
name: "大屏",
|
||||
// component: () => import("@/views/sevenLargeScreen/indexL.vue"), //七参数标准版
|
||||
component: () => import("@/views/commandScreen/indexCommand.vue"), //指挥部大屏
|
||||
// component: () => import("@/views/commandScreen/indexCommand.vue"), //指挥部大屏
|
||||
// component: () => import("@/views/agjtLiveScreen/indexLive.vue"), //鞍钢现场大屏
|
||||
// component: () => import("@/views/overviewScreen/indexCommand.vue"), //总览大屏
|
||||
component: () => import("@/views/locationLive/locationL.vue"), //人员定位大屏
|
||||
// component: () => import("@/views/agjtProjectKanban/indexL.vue"), //鞍钢集团项目看板大屏
|
||||
// component: () => import("@/views/sevenLargeScreen/indexL_syhy.vue"), // 只有一级路由(盘锦、嘉兴、鄱湖美湾医疗项目需切换至该首页)
|
||||
children: [
|
||||
@ -307,11 +308,16 @@ export const staticRouter: RouteRecordRaw[] = [
|
||||
path: "/overviewScreen",
|
||||
name: "大屏总览",
|
||||
component: () => import("@/views/overviewScreen/commandCenter/index.vue")
|
||||
},
|
||||
{
|
||||
path: "/locationLive",
|
||||
name: "人员定位大屏",
|
||||
component: () => import("@/views/locationLive/commandCenter/index.vue")
|
||||
}
|
||||
],
|
||||
meta: {
|
||||
// title: "数字化项目监管平台"
|
||||
title: "智慧工厂安全生产监管平台" //鞍钢项目
|
||||
title: "智慧工厂安全生产监管平台" //鞍钢项目
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
250
src/views/locationLive/commandCenter/index.vue
Normal file
250
src/views/locationLive/commandCenter/index.vue
Normal file
@ -0,0 +1,250 @@
|
||||
<!-- eslint-disable vue/v-on-event-hyphenation -->
|
||||
<template>
|
||||
<div class="projectContent">
|
||||
<smartSafeHat></smartSafeHat>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import smartSafeHat from "@/views/sevenLargeScreen/digitalConstruction/smartSafeHat/index.vue";
|
||||
// import { GlobalStore } from "@/stores";
|
||||
// import { getCountTaskProgressApi } from "@/api/modules/agjtCommandApi";
|
||||
// import * as mqtt from "mqtt/dist/mqtt.min";
|
||||
|
||||
// import { getWorkerStatisticsCountApi, getProjectDetail } from "@/api/modules/projectOverview";
|
||||
import { onMounted, ref } from "vue";
|
||||
// const store = GlobalStore();
|
||||
// const statisticsCount = ref(null as any);
|
||||
|
||||
// const projectData = ref(null as any);
|
||||
|
||||
// const options = {
|
||||
// connectTimeout: 40000,
|
||||
// clientId: "mqttjs_" + Math.random().toString(16).substr(2, 8),
|
||||
// username: "root",
|
||||
// password: "123456",
|
||||
// clean: true
|
||||
// };
|
||||
// 监听mqtt下发信息然后刷新列表
|
||||
// const mqttMSG = () => {
|
||||
// // this.userId = this.$store.state.userInfo.userId;
|
||||
// // this.topicName = this.$store.state.userInfo.scope;
|
||||
// const client = mqtt.connect("ws://jxj.zhgdyun.com:8083/mqtt", options);
|
||||
// console.log("11111111~~~~~~~~~~~", client);
|
||||
// // mqtt连接 +"/#" +workerId
|
||||
// client.on("connect", () => {
|
||||
// // console.log('连接成功:', this.topicName + this.userId)
|
||||
// // this.topicName + this.userId
|
||||
// client.subscribe("zjsjTopic" + store.userId + "/bigScreen/emergency/alert", { qos: 0 }, (error: any) => {
|
||||
// if (!error) {
|
||||
// console.log("订阅成功123");
|
||||
// } else {
|
||||
// console.log("订阅失败");
|
||||
// }
|
||||
// });
|
||||
// });
|
||||
// // 接收消息处理
|
||||
// client.on("message", (topic: any, message: any) => {
|
||||
// console.log("~~~~~~~", topic, JSON.parse(message));
|
||||
// const result = JSON.parse(message);
|
||||
// openPeopleCountDialog({
|
||||
// index: 10,
|
||||
// title: "人员呼叫",
|
||||
// timeOut: 60,
|
||||
// timeFlag: null,
|
||||
// show: true,
|
||||
// mapsDetail: JSON.parse(result.payload)
|
||||
// });
|
||||
// });
|
||||
// // 断开发起重连
|
||||
// // client.on("reconnect", (error) => {
|
||||
// // console.log("正在重连:", error);
|
||||
// // });
|
||||
// // 链接异常处理
|
||||
// client.on("error", (error: any) => {
|
||||
// console.log("连接失败:", error);
|
||||
// });
|
||||
// };
|
||||
// // 项目剩余天数
|
||||
// let projectSurplusDayNum = ref("" as any);
|
||||
// // 获取项目总进度/项目剩余天数
|
||||
// const getCountTaskProgress = async (showLoading: boolean) => {
|
||||
// const res: any = await getCountTaskProgressApi(
|
||||
// {
|
||||
// projectSn: store.sn
|
||||
// },
|
||||
// showLoading
|
||||
// );
|
||||
// if (res.result) {
|
||||
// console.log("项目总进度/项目剩余天数", res);
|
||||
// projectSurplusDayNum.value = res.result.projectSurplusDayNum + "";
|
||||
// }
|
||||
// };
|
||||
onMounted(() => {
|
||||
// getCountTaskProgress(false);
|
||||
// mqttMSG();
|
||||
// setTimeout(() => {
|
||||
// openPeopleCountDialog({
|
||||
// index: 10,
|
||||
// title: "人员呼叫",
|
||||
// timeOut: 10,
|
||||
// timeFlag: null,
|
||||
// show: true,
|
||||
// mapsDetail: {
|
||||
// alarmPersonId: "1795271026055901186",
|
||||
// alarmPersonName: "测试0528",
|
||||
// alarmTime: "2024-06-03 19:19:23",
|
||||
// departmentName: null,
|
||||
// disposalReport: null,
|
||||
// dispositionStatus: 1,
|
||||
// emergencyDetail: null,
|
||||
// emergencyTypeId: "-1",
|
||||
// emergencyTypeName: "一键报警",
|
||||
// enterpriseId: "1786223302337675266",
|
||||
// enterpriseName: "测试企业1",
|
||||
// id: "1797588887538925569",
|
||||
// incidentClosedStatus: 1,
|
||||
// incidentSite: "广东省深圳市宝安区福海路福永意库",
|
||||
// latitude: 22.67405,
|
||||
// livePicture: null,
|
||||
// liveVideoSituation: null,
|
||||
// longitude: 113.80984,
|
||||
// projectSn: "BD3137498CB84BF0969979E0342CDBCA",
|
||||
// situations: null,
|
||||
// teamName: "司机-1",
|
||||
// updateDate: "2024-06-03 19:19:30"
|
||||
// }
|
||||
// });
|
||||
// }, 3000);
|
||||
// setTimeout(() => {
|
||||
// openPeopleCountDialog({
|
||||
// index: 10,
|
||||
// title: "查看1",
|
||||
// timeOut: 10,
|
||||
// timeFlag: null,
|
||||
// show: true,
|
||||
// mapsDetail: {
|
||||
// alarmPersonId: "1795271026055901186",
|
||||
// alarmPersonName: "测试0528",
|
||||
// alarmTime: "2024-06-03 19:19:23",
|
||||
// departmentName: null,
|
||||
// disposalReport: null,
|
||||
// dispositionStatus: 1,
|
||||
// emergencyDetail: null,
|
||||
// emergencyTypeId: "-1",
|
||||
// emergencyTypeName: "一键报警",
|
||||
// enterpriseId: "1786223302337675266",
|
||||
// enterpriseName: "测试企业1",
|
||||
// id: "1797588887538925568",
|
||||
// incidentClosedStatus: 1,
|
||||
// incidentSite: "广东省深圳市宝安区福海路福永意库",
|
||||
// latitude: 22.67405,
|
||||
// livePicture: null,
|
||||
// liveVideoSituation: null,
|
||||
// longitude: 113.80984,
|
||||
// projectSn: "BD3137498CB84BF0969979E0342CDBCA",
|
||||
// situations: null,
|
||||
// teamName: "司机-1",
|
||||
// updateDate: "2024-06-03 19:19:30"
|
||||
// }
|
||||
// });
|
||||
// }, 6000);
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.finish-restTime {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0.8%;
|
||||
top: -6.4%;
|
||||
color: #fff;
|
||||
line-height: 32px;
|
||||
font-size: 16px;
|
||||
.dayImg {
|
||||
margin-left: 2%;
|
||||
font-size: 26px;
|
||||
display: inline-block;
|
||||
width: 29px;
|
||||
height: 32px;
|
||||
font-family: sadigitalNumber;
|
||||
background: url("@/assets/images/comprehensiveManage/project1.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
text-align: center;
|
||||
color: #4ac0f3;
|
||||
}
|
||||
}
|
||||
.line1 {
|
||||
color: #fff;
|
||||
padding-top: 5px;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
line-height: 30px;
|
||||
height: 30px;
|
||||
font-size: 16px;
|
||||
position: absolute;
|
||||
top: -53px;
|
||||
|
||||
.numberCard {
|
||||
font-size: 26px;
|
||||
padding: 0 8px;
|
||||
margin-left: 3px;
|
||||
font-weight: bold;
|
||||
color: #47bcec;
|
||||
background: url("@/assets/images/commandScreen/number-bg.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.projectContent {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
|
||||
.left {
|
||||
height: 100%;
|
||||
width: 26%;
|
||||
transform: translateY(0px);
|
||||
|
||||
.leftTop {
|
||||
height: 31%;
|
||||
}
|
||||
|
||||
.leftBottom {
|
||||
height: 69%;
|
||||
margin: 1% 0;
|
||||
}
|
||||
}
|
||||
|
||||
.center {
|
||||
width: 46%;
|
||||
margin: 0 1%;
|
||||
|
||||
.centerTop {
|
||||
height: 66.5%;
|
||||
// margin-bottom: 3%;
|
||||
}
|
||||
|
||||
.centerBottom {
|
||||
height: 33.5%;
|
||||
margin: 1% 0 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
width: 26%;
|
||||
height: 100%;
|
||||
// transform: translateY(-70px);
|
||||
// .rightAll {
|
||||
// height: 32%;
|
||||
// }
|
||||
// .rightCenter {
|
||||
// height: 33%;
|
||||
// margin: 3% 0 3% 0;
|
||||
// }
|
||||
// .rightBottom {
|
||||
// height: 32%;
|
||||
// }
|
||||
}
|
||||
}
|
||||
</style>
|
||||
503
src/views/locationLive/locationL.vue
Normal file
503
src/views/locationLive/locationL.vue
Normal file
@ -0,0 +1,503 @@
|
||||
<template>
|
||||
<!-- 沈阳合盈 盘锦项目 首页定制 -->
|
||||
<ScaleBox :width="1920" :height="1080" bgc="transparent" :delay="100" :isFlat="false">
|
||||
<div class="largeScreen" ref="dataScreenRef">
|
||||
<div class="header">
|
||||
<span class="projectTitle">
|
||||
<p v-if="COMPANY === 'agjtLocationLive'">人员定位大屏</p>
|
||||
</span>
|
||||
<div class="leftIcon">
|
||||
<div class="info">数字化项目监管平台</div>
|
||||
</div>
|
||||
<div class="rightIcon" @click.stop>
|
||||
<div class="time">{{ nowTime }}</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>
|
||||
</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>
|
||||
<div class="dataBoardContent">
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
</div>
|
||||
</ScaleBox>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import ScaleBox from "vue3-scale-box";
|
||||
import { ref, reactive, onMounted, onBeforeUnmount } from "vue";
|
||||
import { useRouter } from "vue-router";
|
||||
import { GlobalStore } from "@/stores";
|
||||
import { jumpLargeUserInfoApi } from "@/api/modules/login";
|
||||
import { COMPANY } from "@/config/config";
|
||||
const BASEURL = import.meta.env.VITE_API_URL;
|
||||
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 menuList = ref([
|
||||
{
|
||||
moduleName: "人员定位大屏",
|
||||
modulePath: "/locationLive"
|
||||
}
|
||||
]);
|
||||
// 鞍山指挥部大屏
|
||||
let agjtCommandList = ref([
|
||||
{
|
||||
moduleName: "人员定位大屏",
|
||||
modulePath: "/locationLive"
|
||||
}
|
||||
]);
|
||||
|
||||
const itemList = ref([]);
|
||||
const activeTab = ref(0);
|
||||
const activeTab2 = ref(0);
|
||||
const router = useRouter();
|
||||
|
||||
//获取动态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;
|
||||
itemList.value = path.menuList;
|
||||
router.push(path.modulePath);
|
||||
} else {
|
||||
activeTab2.value = path.companyPath;
|
||||
router.push(path.companyPath);
|
||||
}
|
||||
};
|
||||
onMounted(async () => {
|
||||
if (COMPANY === "agjtCommand") {
|
||||
// menuList.value = AGJTCommandMenu;
|
||||
menuList.value = agjtCommandList.value;
|
||||
}
|
||||
//这里是跳转过来后免登录的操作，接收token 登录 懂了
|
||||
//数据看板跳转免登录
|
||||
if (window.location.href.indexOf("token") != -1) {
|
||||
console.log("跳转进来了吗----", window.location.href.indexOf("token"));
|
||||
|
||||
const newToken = window.location.href.split("token=")[1];
|
||||
const data = await jumpLargeUserInfoApi({ token: newToken });
|
||||
console.log("跳转请求的数据----", data.result);
|
||||
store.setSN(data.result.sn);
|
||||
store.setToken(data.result.token);
|
||||
store.setAccount(data.result.account);
|
||||
store.setAccountType(data.result.accountType);
|
||||
store.setProjectDateAuth(data.menuAuthority);
|
||||
// const data = await res.json();
|
||||
// console.log("调用免登录接口返回的数据", data);
|
||||
// let arr = data.result.menuAuthority.moduleList;
|
||||
// arr.forEach((item: any) => {
|
||||
// if (item.moduleType == 4) {
|
||||
// menuList.value.push(item);
|
||||
// return;
|
||||
// }
|
||||
// });
|
||||
// console.log("当前项目的看板数据：：", moduleListData.value);
|
||||
}
|
||||
// await getAllModelMenu();
|
||||
navigateTo(menuList.value[0], 1);
|
||||
activeTab.value = menuList.value[0].modulePath;
|
||||
itemList.value = menuList.value[0].menuList;
|
||||
|
||||
// console.log("进入页面， ");
|
||||
adminName.value = store.account;
|
||||
// console.log("store数据", store.account);
|
||||
// menuClick(menuList.value[0], activeIndex.value);
|
||||
getNowTime();
|
||||
document.addEventListener("click", bodyCloseMenus);
|
||||
const subMenus = document.querySelectorAll(".menStyle");
|
||||
if (subMenus.length >= 5 && COMPANY !== "hfqc") {
|
||||
subMenus[4].style.marginLeft = "30%";
|
||||
}
|
||||
if (COMPANY === "hfqc") {
|
||||
subMenus[3].style.marginLeft = "44%";
|
||||
}
|
||||
});
|
||||
|
||||
let timer = ref(null as any);
|
||||
onBeforeUnmount(() => {
|
||||
clearInterval(timer);
|
||||
document.removeEventListener("click", bodyCloseMenus);
|
||||
});
|
||||
|
||||
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() {
|
||||
// window.location.replace("http://192.168.34.226:8080/#/projectIndex");
|
||||
if (COMPANY === "syhy") {
|
||||
window.location.replace("http://101.43.164.214:45020/#/projectIndex"); //沈阳和盈
|
||||
}
|
||||
if (COMPANY === "jxwjj") {
|
||||
window.location.replace("http://183.249.224.118:9000/#/projectIndex"); //嘉兴王江泾公用码头
|
||||
}
|
||||
if (COMPANY === "phmw") {
|
||||
window.location.replace("http://101.43.164.214:11111/#/projectIndex"); // 鄱湖美湾医疗、医美产业集群项目
|
||||
}
|
||||
if (COMPANY === "hfqc") {
|
||||
window.location.replace("http://101.43.164.214:11111/#/projectIndex"); // 鄱湖美湾医疗、医美产业集群项目
|
||||
}
|
||||
if (COMPANY === "as") {
|
||||
window.location.replace("http://182.90.224.237:15551/#/projectIndex"); // 鞍山项目
|
||||
}
|
||||
if (COMPANY === "agjtCommand") {
|
||||
window.location.replace("http://47.93.215.234:9809" + "/#/login?token=" + store.token);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.el-popper__arrow {
|
||||
background-color: #112d59;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.largeScreen {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: url("@/assets/images/bigImg.gif") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
|
||||
.header {
|
||||
width: 100%;
|
||||
height: 10%;
|
||||
background: url("@/assets/images/headerImg.webp") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
|
||||
.projectTitle {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 38px;
|
||||
color: #fff;
|
||||
font-family: YouSheBiaoTiHei;
|
||||
}
|
||||
|
||||
.projectSmallTitle {
|
||||
position: absolute;
|
||||
top: 6%;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 20px;
|
||||
color: #fff;
|
||||
font-family: YouSheBiaoTiHei;
|
||||
}
|
||||
|
||||
.leftIcon {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
width: 30%;
|
||||
left: 15%;
|
||||
color: #fff;
|
||||
top: 1%;
|
||||
|
||||
.info {
|
||||
font-size: 14px;
|
||||
font-family: sadigitalNumber;
|
||||
margin: 0.1% 40% 0 10%;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.rightIcon {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
width: 30%;
|
||||
left: 70%;
|
||||
color: #fff;
|
||||
top: 1%;
|
||||
|
||||
.time {
|
||||
font-size: 13px;
|
||||
font-family: sadigitalNumber;
|
||||
margin: 0.5% 40% 0 10%;
|
||||
}
|
||||
|
||||
.Icon {
|
||||
margin-right: 2%;
|
||||
cursor: pointer;
|
||||
width: 25px;
|
||||
// margin-top: 0.1%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.menuList {
|
||||
display: flex;
|
||||
height: 6%;
|
||||
color: #ccc;
|
||||
line-height: 55px;
|
||||
margin: -4% auto 0 2%;
|
||||
font-family: pmzd;
|
||||
|
||||
div {
|
||||
position: relative;
|
||||
margin-top: 1%;
|
||||
height: 60%;
|
||||
width: 9%; //二级
|
||||
// width: 10%;//一级
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.subMenu {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
font-size: 20px;
|
||||
|
||||
span {
|
||||
width: 90%;
|
||||
height: 10%;
|
||||
margin-left: 2%;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.subMenuList {
|
||||
position: absolute;
|
||||
width: 98%;
|
||||
height: 4%;
|
||||
display: flex;
|
||||
margin-top: 5%;
|
||||
font-size: 14px;
|
||||
font-family: none;
|
||||
background: url("@/assets/images/subTabImg.gif") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin-left: -1%;
|
||||
|
||||
.subItem {
|
||||
width: 100px;
|
||||
margin-top: -1.5%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
: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: 85%; //一级
|
||||
// height: calc(100% - 15px - 50px - 60px - 20px);
|
||||
// margin: 75px auto 16px auto;//二级
|
||||
margin: 10px auto 10px auto; //一级
|
||||
width: calc(100% - 40px);
|
||||
// background-color: #01131F;
|
||||
// opacity: 0.9;
|
||||
}
|
||||
}
|
||||
|
||||
.active {
|
||||
display: inline-block;
|
||||
height: 100%;
|
||||
width: 90%;
|
||||
background: url("@/assets/images/dustNoise/menuImg.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.active2 {
|
||||
color: #fff;
|
||||
font-family: none;
|
||||
}
|
||||
|
||||
.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 {
|
||||
.userItem {
|
||||
position: absolute;
|
||||
width: 110px;
|
||||
// height: 100px;
|
||||
// height: 75px;
|
||||
padding-bottom: 4px;
|
||||
right: 2%;
|
||||
top: 4%;
|
||||
background: #112d59;
|
||||
border-radius: 0px 0px 0px 0px;
|
||||
border: 0px solid #405e97;
|
||||
z-index: 9;
|
||||
|
||||
.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: 5%;
|
||||
width: 12%;
|
||||
position: absolute;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
x
Reference in New Issue
Block a user