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

flx：修改侧边弹窗目录结构

Browse Source
This commit is contained in:
X_Rian 2024-07-26 18:18:43 +08:00
parent 0d94579acf
commit 54aed72315
1 changed files with 46 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

87
src/views/commandScreen/commandCenter/index.vue
View File

@ -12,18 +12,17 @@
<rightAll class="rightAll" @openDialog="openPeopleCountDialog"></rightAll> <rightAll class="rightAll" @openDialog="openPeopleCountDialog"></rightAll>
</div> </div>
<dataDialog ref="partyBuildRef"></dataDialog> <dataDialog ref="partyBuildRef"></dataDialog>
<div :class="{'contentsBox':true,'openDialog': show,'hiddenDialog': !show}"> <div :class="{ contentsBox: true, openDialog: show, hiddenDialog: !show }">
<div class="topBox"> <div class="topBox">
<div class="expand"> <div class="expand"></div>
</div>
<div class="retract"> <div class="retract">
<el-icon color="#fff" size="26" v-show="show" @click="retract"><DArrowLeft /></el-icon> <el-icon color="#fff" size="26" v-show="show" @click="retract"><DArrowLeft /></el-icon>
</div> </div>
</div> </div>
<div class="bottomBox" v-if="show"> <div class="bottomBox" v-if="show">
<div v-for="(item,i) in backendUrls" :key="i"> <div v-for="(item, i) in backendUrls" :key="i">
<div class="listItem" @click="goBackend(item)"> <div class="listItem" @click="goBackend(item)">
<div class="itemIcon" :style="{'background':item.color !== '#dc3c00' ? item.color: 'rgba(0,0,0,0)'}"> <div class="itemIcon" :style="{ background: item.color !== '#dc3c00' ? item.color : 'rgba(0,0,0,0)' }">
<el-icon :color="item.color == '#dc3c00' ? '#dc3c00' : '#fff'" size="32"><StarFilled /></el-icon> <el-icon :color="item.color == '#dc3c00' ? '#dc3c00' : '#fff'" size="32"><StarFilled /></el-icon>
</div> </div>
<span class="itemText">{{ item.name }}</span> <span class="itemText">{{ item.name }}</span>
@ -46,7 +45,7 @@ import rightAll from "@/views/commandScreen/commandCenter/rightAll.vue";
import { GlobalStore } from "@/stores"; import { GlobalStore } from "@/stores";
import dataDialog from "../dialogCompnnents/data-dialog.vue"; import dataDialog from "../dialogCompnnents/data-dialog.vue";
import * as mqtt from "mqtt/dist/mqtt.min"; import * as mqtt from "mqtt/dist/mqtt.min";
const BASEURL = import.meta.env.VITE_API_URL const BASEURL = import.meta.env.VITE_API_URL;
// import { getWorkerStatisticsCountApi, getProjectDetail } from "@/api/modules/projectOverview"; // import { getWorkerStatisticsCountApi, getProjectDetail } from "@/api/modules/projectOverview";
import { ref, onMounted } from "vue"; import { ref, onMounted } from "vue";
@ -96,39 +95,45 @@ const mqttMSG = () => {
// client.on("reconnect", (error) => { // client.on("reconnect", (error) => {
// }); // });
// 链接异常处理 // 链接异常处理
client.on("error", (error: any) => { client.on("error", (error: any) => {});
});
}; };
const backendUrls = ref([ const backendUrls = ref([
{id:1, name:'项目概况', url:'', color:'#dc3c00'}, { id: 1, name: "综合管理", url: "", color: "#dc3c00" },
{id:2, name:'工作台', url:'/workSpace', color:'#00aff0'},{id:3, name:'项目基本信息管理', url:'/project/summary/baseInfo', color:'#00aff0'}, { id: 3, name: "基本信息", url: "/project/summary/baseInfo", color: "#00aff0" },
{id:4, name:'区域管理', url:'/project/quality/business', color:'#00aff0'},{id:5, name:'进度管理', url:'/project/progressManagementAg/projectganttChart', color:'#00aff0'}, { id: 4, name: "区域管理", url: "/project/quality/business", color: "#00aff0" },
{ id: 5, name: "进度管理", url: "/project/progressManagementAg/projectganttChart", color: "#00aff0" },
{ id: 17, name: "质量管理", url: "/project/quality/qualityAnalysis", color: "#00aff0" },
{id:6, name:'安全准入', url:'', color:'#dc3c00'}, { id: 6, name: "安全准入", url: "", color: "#dc3c00" },
{id:7, name:'人员管理', url:'/project/labor/personManage', color:'#0078d7'},{id:8, name:'车辆管理', url:'/project/carManage/realTimeData', color:'#0078d7'}, { id: 2, name: "审批管理", url: "/workSpace", color: "#0078d7" },
{id:9, name:'访客管理', url:'/project/labor/visitRecord', color:'#0078d7'},{id:10, name:'材料入场管理', url:'/project/materialManage/materialEntryManage', color:'#0078d7'}, { id: 7, name: "人员管理", url: "/project/labor/personManage", color: "#0078d7" },
{id:11, name:'材料出场管理', url:'/project/materialManage/materialExitManage', color:'#0078d7'}, { id: 8, name: "车辆管理", url: "/project/carManage/realTimeData", color: "#0078d7" },
{ id: 9, name: "访客管理", url: "/project/labor/visitRecord", color: "#0078d7" },
{ id: 10, name: "材料管理", url: "/project/materialManage/materialEntryManage", color: "#0078d7" },
// { id: 11, name: "材料出场管理", url: "/project/materialManage/materialExitManage", color: "#0078d7" },
{id:12, name:'安全管理', url:'', color:'#dc3c00'}, { id: 12, name: "安全管理", url: "", color: "#dc3c00" },
{id:13, name:'安全隐患检查', url:'/project/safetyEducation/safetyAnalysis', color:'#113768'},{id:14, name:'AI预警分析', url:'/project/aiAnalysis/dealPushManage', color:'#113768'}, { id: 13, name: "隐患治理", url: "/project/safetyEducation/safetyAnalysis", color: "#113768" },
{id:15, name:'AI训练模型', url:'/project/videoOverview', color:'#113768'},{id:16, name:'综合考试培训', url:'/project/examSystem2/subjectManagement', color:'#113768'}, { id: 14, name: "AI预警分析", url: "/project/aiAnalysis/dealPushManage", color: "#113768" },
{id:17, name:'质量管理', url:'/project/quality/qualityAnalysis', color:'#113768'},{id:18, name:'特殊作业', url:'/project/specialWork/fireWork', color:'#113768'}, { id: 15, name: "AI训练模型", url: "/project/videoOverview", color: "#113768" },
{id:19, name:'智能巡检', url:'/project/inspecPoint/inspection', color:'#113768'}, { id: 16, name: "教育培训", url: "/project/examSystem2/subjectManagement", color: "#113768" },
] as any) { id: 18, name: "特殊作业", url: "/project/specialWork/fireWork", color: "#113768" },
function goBackend(item: any){ { id: 19, name: "智能巡检", url: "/project/inspecPoint/inspection", color: "#113768" }
if(item.url != ''){ ] as any);
function goBackend(item: any) {
if (item.url != "") {
// window.location.replace('http://localhost:8080/#/login?command=1&pathItem='+ item.url +'&token=' + store.token); // window.location.replace('http://localhost:8080/#/login?command=1&pathItem='+ item.url +'&token=' + store.token);
console.log(BASEURL) console.log(BASEURL);
window.open(BASEURL + '/#/login?command=1&pathItem='+ item.url +'&token=' + store.token, '_blank'); window.open("http://192.168.34.175:8080" + "/#/login?command=1&pathItem=" + item.url + "&token=" + store.token, "_blank");
// window.open('http://10.0.1.77:8080' + '/#/login?command=1&pathItem='+ item.url +'&token=' + store.token, '_blank'); // window.open('http://10.0.1.77:8080' + '/#/login?command=1&pathItem='+ item.url +'&token=' + store.token, '_blank');
} }
} }
const show = ref(false as any) const show = ref(false as any);
function retract(){ function retract() {
show.value = false show.value = false;
} }
function expand(){ function expand() {
show.value = true show.value = true;
} }
onMounted(() => { onMounted(() => {
@ -252,7 +257,7 @@ onMounted(() => {
// } // }
} }
.contentsBox{ .contentsBox {
position: fixed; position: fixed;
top: 1px; top: 1px;
left: 0px; left: 0px;
@ -260,22 +265,22 @@ onMounted(() => {
height: 100%; height: 100%;
// padding-top: 10px; // padding-top: 10px;
// transition: left 0.5s; /* 添加过渡效果 */ // transition: left 0.5s; /* 添加过渡效果 */
.topBox{ .topBox {
height: 3.7%; height: 3.7%;
width: 100%; width: 100%;
background-color: rgba($color: #000000, $alpha: 0); background-color: rgba($color: #000000, $alpha: 0);
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
.retract{ .retract {
cursor: pointer; cursor: pointer;
} }
} }
.bottomBox{ .bottomBox {
height: 96.3%; height: 96.3%;
width: 93%; width: 93%;
background: #0a1334; background: #0a1334;
.listItem{ .listItem {
color: #fff; color: #fff;
height: 40px; height: 40px;
// background-color: darkred; // background-color: darkred;
@ -283,7 +288,7 @@ onMounted(() => {
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
cursor: pointer; cursor: pointer;
.itemIcon{ .itemIcon {
margin-left: 10px; margin-left: 10px;
width: 60px; width: 60px;
height: 35px; height: 35px;
@ -292,26 +297,26 @@ onMounted(() => {
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} }
.itemText{ .itemText {
margin-left: 10px; margin-left: 10px;
font-size: 16px; font-size: 16px;
} }
} }
} }
} }
.hiddenDialog{ .hiddenDialog {
left: -1000px; left: -1000px;
} }
.openDialog{ .openDialog {
left: 0; left: 0;
} }
.expandBtn{ .expandBtn {
cursor: pointer; cursor: pointer;
color: #fff; color: #fff;
position: fixed; position: fixed;
width: auto; width: auto;
height: 3.7%; height: 3.7%;
top:0; top: 0;
left: 0; left: 0;
// background-color: #061f51; // background-color: #061f51;
background-color: rgba($color: #000000, $alpha: 0); background-color: rgba($color: #000000, $alpha: 0);