feat : 新增报警信息功能
This commit is contained in:
@@ -101,13 +101,21 @@
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog :close-on-click-modal="false" v-model="isUploadVisited" width="1558px">
|
||||
<div @click="isUploadVisited=false" style="position: absolute;right: 20px;top:10px;cursor: pointer">
|
||||
<el-icon size="80" color="#fff">
|
||||
<Close/>
|
||||
</el-icon>
|
||||
</div>
|
||||
<el-upload
|
||||
class="upload-demo"
|
||||
style="margin-top:40px"
|
||||
drag
|
||||
limit="1"
|
||||
:action="uploadFileUrl"
|
||||
:auto-upload="false"
|
||||
:auto-upload="true"
|
||||
:headers="headers"
|
||||
:data="uploadData"
|
||||
:on-success="handleUploadSuccess"
|
||||
:before-upload="beforeUpload"
|
||||
>
|
||||
<el-icon>
|
||||
<upload-filled/>
|
||||
@@ -115,17 +123,12 @@
|
||||
<div class="el-upload__text">
|
||||
拖拽一张图纸到这里 或者 <em>点击上传</em>
|
||||
</div>
|
||||
<template #tip>
|
||||
<div class="el-upload__tip">
|
||||
文件限制大小为 16MB
|
||||
</div>
|
||||
</template>
|
||||
</el-upload>
|
||||
<template #footer>
|
||||
<div class="btns">
|
||||
<div class="cancel-btn" @click="isUploadVisited=false">
|
||||
取消
|
||||
</div>
|
||||
<div class="sure-btn" @click="handleSubmit(formInstance)">
|
||||
确定
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<div class="pagination">
|
||||
<span @click="firstPage" v-if="showFirst">首页</span>
|
||||
@@ -141,6 +144,7 @@
|
||||
import {editSite, getSiteDetail, getSiteList, addSite, deleteSite} from "@/api/site";
|
||||
import {ElMessage, ElMessageBox} from "element-plus";
|
||||
import TunnelTitle from "@/components/tunnelTitle/index.vue";
|
||||
import {getToken} from '@/utils/auth'
|
||||
|
||||
const router = useRouter()
|
||||
const userId = reactive(router.currentRoute.value.params.userId)
|
||||
@@ -148,9 +152,13 @@ const siteId = reactive(router.currentRoute.value.params.siteId)
|
||||
const siteList = ref([])
|
||||
const siteIds = ref([])
|
||||
const siteNameList = ref([])
|
||||
const clickSiteId = ref('')
|
||||
const uploadData = ref()
|
||||
const baseURL = import.meta.env.VITE_BASE_URL
|
||||
// const uploadFileUrl = ref(baseURL + "/workflow/process/file");
|
||||
const uploadFileUrl = ref("#");
|
||||
const uploadFileUrl = ref(baseURL + '/tunnel/site/upload');
|
||||
const headers = reactive({
|
||||
authorization: getToken()
|
||||
})
|
||||
const info = ref({
|
||||
tunnelName: '',
|
||||
constructionLength: 0,
|
||||
@@ -176,13 +184,17 @@ const formRules = ref({
|
||||
siteName: [{required: true, message: '请输入站点名称', trigger: ['blur', 'change']}]
|
||||
})
|
||||
const formInstance = ref()
|
||||
const handleUploadSuccess = (res, file) => {
|
||||
console.log('file', file)
|
||||
const beforeUpload = () => {
|
||||
uploadData.value = {
|
||||
siteId: clickSiteId.value
|
||||
}
|
||||
}
|
||||
const handleUploadSuccess = (res) => {
|
||||
if (res.code !== 1000) {
|
||||
ElMessage.error("上传失败");
|
||||
} else {
|
||||
ElMessage.success("上传成功");
|
||||
}
|
||||
let data = res.data;
|
||||
// attachmentList.value.push(data);
|
||||
};
|
||||
|
||||
const handleGoHome = () => {
|
||||
@@ -255,6 +267,7 @@ const handleEdit = (item) => {
|
||||
}
|
||||
const handleUpload = (siteId) => {
|
||||
isUploadVisited.value = true
|
||||
clickSiteId.value = siteId
|
||||
}
|
||||
const handleAdd = () => {
|
||||
restFrom()
|
||||
@@ -356,6 +369,11 @@ const handleCurrentChange = (val) => {
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
:deep(.el-upload__tip) {
|
||||
font-size: 40px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
:deep(.el-upload-dragger) {
|
||||
background-color: transparent;
|
||||
box-shadow: none;
|
||||
@@ -373,22 +391,29 @@ const handleCurrentChange = (val) => {
|
||||
.el-upload__text {
|
||||
font-size: 50px;
|
||||
color: #FFFFFF;
|
||||
em{
|
||||
|
||||
em {
|
||||
color: #05FEFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.el-upload-list) {
|
||||
.el-upload-list__item{
|
||||
.el-upload-list__item {
|
||||
&:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
.el-icon{
|
||||
|
||||
.el-icon {
|
||||
font-size: 61px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.el-icon--close-tip {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.el-upload-list__item-name {
|
||||
font-size: 61px !important;
|
||||
color: #FFFFFF;
|
||||
|
||||
@@ -74,7 +74,8 @@
|
||||
</div>
|
||||
<div v-else>
|
||||
<div class="img-box">
|
||||
<img src="@/assets/images/tunnel/img.png" style="width:3500px;height:1789px" id="imgModel" usemap="#image"
|
||||
<!-- @/assets/images/tunnel/img.png-->
|
||||
<img :src="'data:image/png;base64,'+siteImage" style="width:3500px;height:1789px" id="imgModel" usemap="#image"
|
||||
alt="" @click="clickHandler">
|
||||
<map name="image" id="image">
|
||||
<area shape="poly" v-for="(item,index) in coordsList" :coords="item.coords" :key="index" alt=""
|
||||
@@ -153,15 +154,15 @@
|
||||
<script setup>
|
||||
import {ElMessage, ElMessageBox} from "element-plus";
|
||||
import {getTunnelList, addTunnel, deleteTunnel} from "@/api/tunnelManage";
|
||||
import {getSiteDetail} from "@/api/site";
|
||||
import {getSiteDrawing,getSiteDetail } from "@/api/site";
|
||||
import TunnelTitle from "@/components/tunnelTitle/index.vue";
|
||||
import {getTunnelBySiteId} from "@/api/largeScreen";
|
||||
|
||||
const validateNumber = (rule, value) => {
|
||||
const reg = /^[A-Za-z0-9]+$/;
|
||||
return reg.test(value);
|
||||
}
|
||||
const router = useRouter()
|
||||
const siteImage = ref()
|
||||
const showAddIcon = ref(true)
|
||||
const params = router.currentRoute.value.params;
|
||||
const siteId = reactive(params.siteId)
|
||||
@@ -182,7 +183,7 @@ const formRules = ref({
|
||||
dropTime: [{required: true, message: '请选择降频时间', trigger: ['blur', 'change']}],
|
||||
dropFrequency: [{required: true, message: '请输入降频率', trigger: ['blur', 'change']}]
|
||||
})
|
||||
const clickModel = ref(1)
|
||||
let clickModel = ref(1)
|
||||
const showFirst = ref(true)
|
||||
const showOperation = ref(true)
|
||||
const formInstance = ref()
|
||||
@@ -192,10 +193,10 @@ const coordsList = ref([
|
||||
tunnelId: 1,
|
||||
coords: '767,1117,793,1182,2379,682,2437,454,2349,505,2298,666,2221,531,2153,578,2212,692,765,1126',
|
||||
}, {
|
||||
tunnelId: 91,
|
||||
tunnelId: 1,
|
||||
coords: '863,1475,1135,1494,2321,1078,3023,801,3214,703,3288,752,2300,1154,1560,1438,1170,1554,844,1529',
|
||||
}, {
|
||||
tunnelId: 1,
|
||||
tunnelId: 94,
|
||||
coords: '1181,1364,2105,622,2005,589,1116,1324'
|
||||
}
|
||||
])
|
||||
@@ -276,6 +277,14 @@ const total = ref(10);
|
||||
onMounted(() => {
|
||||
showOperation.value = localStorage.getItem('roleKey') !== 'tunnel_admin';
|
||||
})
|
||||
const getSiteImg = () => {
|
||||
getSiteDrawing(siteId).then((res) => {
|
||||
if(res.code === 1000){
|
||||
siteImage.value=res.data.drawingData
|
||||
}
|
||||
});
|
||||
}
|
||||
getSiteImg()
|
||||
const clickHot = (id) => {
|
||||
console.log('点击热区===============')
|
||||
router.push('/' + id + '/' + siteId)
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
<template>
|
||||
<div id="main">
|
||||
<div class="box-top">
|
||||
<manage-btn v-model="selectIndex" @select="manageSelect" :list="routeList" v-if="showMenu" />
|
||||
<tunnel-title v-if="showTunnelTitle" />
|
||||
<manage-btn v-model="selectIndex" @select="manageSelect" :list="routeList" v-if="showMenu"/>
|
||||
<tunnel-title v-if="showTunnelTitle"/>
|
||||
<div class="top-length">
|
||||
<!-- <span>隧道总长度: {{ tunnelLength }}米</span>-->
|
||||
<span>当前施工长度: {{ constructionLength }}米</span>
|
||||
@@ -10,17 +10,21 @@
|
||||
<div class="top-right">
|
||||
<div class="current-site">
|
||||
当前站点：<span>{{ currentSite }}</span>
|
||||
<el-dropdown trigger="click" @command="handleChangeSite">
|
||||
<el-dropdown trigger="click" @command="handleChangeSite" popper-class="dropdown-style">
|
||||
<div class="toggle"></div>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item v-for="item in siteList" :key="item.value" :command="item">{{
|
||||
item.label
|
||||
}}
|
||||
item.label
|
||||
}}
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<el-icon size="50" color="#0BE9FA" style="margin-left: 50px;cursor: pointer"
|
||||
@click="isVisited=true;getAlarmList()">
|
||||
<Bell/>
|
||||
</el-icon>
|
||||
</div>
|
||||
<div class="current-user">
|
||||
你好！<span>{{ currentUser }}</span>
|
||||
@@ -32,25 +36,25 @@
|
||||
<!-- <tunnel-scene id="tunnel-box" :isedit="false" /> -->
|
||||
<!-- 一进去的话应该是预览模式，所以引入这个组件1 -->
|
||||
<preview-scene id="tunnel-box" :isedit="false" :tunnelId="tunnelId" :key="tunnelId" :tunnelLen="tunnelLen"
|
||||
:largeScreen="largeScreen"></preview-scene>
|
||||
:largeScreen="largeScreen"></preview-scene>
|
||||
<div class="left">
|
||||
<el-drawer v-model="drawerLeft" direction="ltr" modal-class="modal-box" :modal="false" :show-close="false"
|
||||
:close-on-click-modal="false" :close-on-press-escape="false">
|
||||
:close-on-click-modal="false" :close-on-press-escape="false">
|
||||
<fan-info v-if="showFan" :list="socketData.leftData" :fan-data="largeScreenData"
|
||||
:transducer-data="largeScreenData" :loading="showFanLoading" :tunnel-id="tunnelId" />
|
||||
<used-ele v-if="showFan" :list="socketData.leftData" :ele-data="largeScreenData" />
|
||||
:transducer-data="largeScreenData" :loading="showFanLoading" :tunnel-id="tunnelId"/>
|
||||
<used-ele v-if="showFan" :list="socketData.leftData" :ele-data="largeScreenData"/>
|
||||
</el-drawer>
|
||||
<div v-if="drawerLeft" class="left-arrow" @click="closeLeft"></div>
|
||||
<div v-else class="shrink-left" @click="closeLeft"></div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<el-drawer v-model="drawerRight" direction="rtl" modal-class="modal-box" :modal="false" :show-close="false"
|
||||
:close-on-click-modal="false" :close-on-press-escape="false">
|
||||
:close-on-click-modal="false" :close-on-press-escape="false">
|
||||
<wind-pressure-list v-if="showFan" :list="socketData.windPressure" :win-data="largeScreenData"
|
||||
:loading="showWindLoading" />
|
||||
<air-info v-if="showFan" :list="socketData.sensor" :air-data="largeScreenData" />
|
||||
:loading="showWindLoading"/>
|
||||
<air-info v-if="showFan" :list="socketData.sensor" :air-data="largeScreenData"/>
|
||||
<bad-gas-info v-if="showFan" :list="socketData.sensor" :bad-gas-data="largeScreenData" :tunnelId="tunnelId"
|
||||
:loading="showBadLoading" />
|
||||
:loading="showBadLoading"/>
|
||||
</el-drawer>
|
||||
<div v-if="drawerRight" class="right-arrow" @click="closeRight"></div>
|
||||
<div v-else class="shrink-right" @click="closeRight"></div>
|
||||
@@ -58,7 +62,7 @@
|
||||
<div class="switch-btn">
|
||||
<div class="arrow" @click="previousBtn"></div>
|
||||
<el-carousel height="150px" type="card" ref="tunnelBtn" :autoplay="false" :initial-index="initialIndex"
|
||||
@change="changeTunnel">
|
||||
@change="changeTunnel">
|
||||
<div class="btn">
|
||||
<el-carousel-item v-for="item in tunnelList" :key="item.value">
|
||||
{{ item.label }}
|
||||
@@ -68,6 +72,85 @@
|
||||
<div class="arrow right" @click="nextBtn"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="alarm-dialog digital-tunnel">
|
||||
<el-dialog :close-on-click-modal="false" v-model="isDetailVisited" title="报警信息详情"
|
||||
width="1500px">
|
||||
<div class="detail">
|
||||
<div>报警时间：</div>
|
||||
{{ alarmDetail.alarmTime }}
|
||||
</div>
|
||||
<div class="detail">
|
||||
<div>报警内容：</div>
|
||||
{{ alarmDetail.alarmContent }}
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
<div class="digital-tunnel">
|
||||
<el-dialog :close-on-click-modal="false" v-model="isVisited" title="报警信息"
|
||||
width="2175px"
|
||||
:modal="false">
|
||||
<div class="left-top-icon"></div>
|
||||
<div class="right-top-icon"></div>
|
||||
<el-form :model="queryParams" inline class="query-form" ref="queryForm" @submit.prevent="getAlarmList"
|
||||
v-if="roleKey!=='administrator'">
|
||||
<el-form-item label="查阅状态" prop="lookupStatus">
|
||||
<el-select v-model="queryParams.lookupStatus" placeholder="请选择查阅状态" :fit-input-width="true"
|
||||
:teleported="false" clearable filterable>
|
||||
<el-option label="已读" :value="true"/>
|
||||
<el-option label="未读" :value="false"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="getAlarmList">搜索</el-button>
|
||||
<el-button @click="handleReset">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="device-table">
|
||||
<el-table stripe
|
||||
style="background-color: #011c29;--el-table-border-color: none;"
|
||||
:header-cell-style="{backgroundColor: '#064B66',color: '#fff',fontSize: '40px',borderBottom: 'none' }"
|
||||
:data="alarmList">
|
||||
<!-- <el-table-column prop="equipmentId" label="设备名称" align="center" width="400px">-->
|
||||
<!-- <template #default="scope">-->
|
||||
<!-- {{ changeName(scope.row.equipmentId) }}-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-table-column>-->
|
||||
<el-table-column prop="alarmContent" label="告警信息" align="center">
|
||||
<template #default="scope">
|
||||
<div class="alarm-content" :style="{width:roleKey==='administrator'?'':'730px'}">{{
|
||||
scope.row.alarmContent
|
||||
}}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="alarmTime" label="告警时间" align="center" width="480px"/>
|
||||
<el-table-column prop="lookupStatus" label="查阅状态" align="center" width="200px"
|
||||
v-if="roleKey!=='administrator'">
|
||||
<template #default="scope">
|
||||
<el-tag :type="scope.row.lookupStatus?'success':'warning'">{{ scope.row.lookupStatus ? '已读' : '未读' }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" width="300px">
|
||||
<template #default="scope">
|
||||
<el-button type="primary" size="mini" style="font-weight: bold" @click="handleView(scope.row)" link>详情
|
||||
</el-button>
|
||||
<el-button type="danger" size="mini" v-if="roleKey!=='administrator'" @click="handleDelete(scope.row)"
|
||||
link>删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="pagination">
|
||||
<el-pagination background v-model:current-page="pageInfo.pageNum" v-model:page-size="pageInfo.pageSize"
|
||||
:total="total" prev-text="上一页" next-text="下一页" layout="prev, pager, next"
|
||||
@current-change="handleCurrentChange" :hide-on-single-page="true"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="left-bottom-icon"></div>
|
||||
<div class="right-bottom-icon"></div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
@@ -79,15 +162,22 @@ import AirInfo from "@/components/content/airInfo/AirInfo.vue";
|
||||
import BadGasInfo from "@/components/content/badGasInfo/BadGasInfo.vue";
|
||||
import ManageBtn from "@/components/manageBtn/index.vue";
|
||||
import TunnelTitle from "@/components/tunnelTitle/index.vue";
|
||||
import { dateFormat } from "@/utils/date.js";
|
||||
import { getToken } from "@/utils/auth";
|
||||
import { useAuthStore } from "@/store/userstore.js";
|
||||
import { getLargeScreen, getLargeScreenInfo, getTunnelBySiteId } from "@/api/largeScreen";
|
||||
import { ElMessage, ElMessageBox } from "element-plus";
|
||||
import { getUserInfo } from "@/api/login";
|
||||
import { initSceneData } from "@/api/tunnelScene";
|
||||
import { getTunnelList } from "@/api/tunnelManage";
|
||||
import { computed } from "vue";
|
||||
import {dateFormat} from "@/utils/date.js";
|
||||
import {getToken} from "@/utils/auth";
|
||||
import {useAuthStore} from "@/store/userstore.js";
|
||||
import {
|
||||
getLargeScreen,
|
||||
getLargeScreenInfo,
|
||||
getTunnelBySiteId,
|
||||
getAlarmInfo,
|
||||
deleteAlarmSate,
|
||||
getAlarmDetail,
|
||||
updateAlarmState
|
||||
} from "@/api/largeScreen";
|
||||
import {ElMessage, ElMessageBox} from "element-plus";
|
||||
import {getUserInfo} from "@/api/login";
|
||||
import {initSceneData} from "@/api/tunnelScene";
|
||||
import {getTunnelList} from "@/api/tunnelManage";
|
||||
|
||||
const authStore = useAuthStore();
|
||||
const router = useRouter();
|
||||
@@ -95,6 +185,8 @@ const previewId = reactive(router.currentRoute.value.params.tunnelId)
|
||||
const siteId = reactive(router.currentRoute.value.params.siteId)
|
||||
const tunnelIdFlag = reactive(router.currentRoute.value.params.tunnelId)
|
||||
const selectIndex = ref(-1);
|
||||
const isVisited = ref(false);
|
||||
const isDetailVisited = ref(false);
|
||||
const showFan = ref(false);
|
||||
const drawerLeft = ref(true);
|
||||
const showTunnelTitle = ref(true);
|
||||
@@ -107,6 +199,8 @@ const showMenu = ref(false);
|
||||
const currentSiteId = ref(0);
|
||||
const currentSite = ref("");
|
||||
const siteList = ref([])
|
||||
const alarmList = ref([])
|
||||
const alarmDetail = ref([])
|
||||
const totalTunnelList = ref([])
|
||||
const currentUser = ref("");
|
||||
const currentUserId = ref(0);
|
||||
@@ -120,8 +214,7 @@ const routeList = ref([]);
|
||||
let socket = reactive("");
|
||||
let pattern = reactive(new RegExp("[A-Za-z]+"));
|
||||
let isTunnel = reactive(false)
|
||||
|
||||
|
||||
const equipmentOption = ref([])
|
||||
const btnList = ref([
|
||||
{
|
||||
route: '/site',
|
||||
@@ -149,10 +242,17 @@ const btnList = ref([
|
||||
// },
|
||||
])
|
||||
const serialNumber = ref("");
|
||||
const roleKey = ref("");
|
||||
let token = getToken();
|
||||
let send = {
|
||||
type: "ping",
|
||||
};
|
||||
const pageInfo = reactive({
|
||||
pageNum: 1,
|
||||
pageSize: 10
|
||||
});
|
||||
const queryForm = ref()
|
||||
const total = ref(10);
|
||||
const largeScreenData = ref(null);
|
||||
const socketData = reactive({
|
||||
leftData: [],
|
||||
@@ -160,7 +260,10 @@ const socketData = reactive({
|
||||
sensor: [],
|
||||
});
|
||||
let tunnelLen = computed(() => tunnelLength);
|
||||
|
||||
const queryParams = reactive({
|
||||
equipmentId: '',
|
||||
lookupStatus: ''
|
||||
})
|
||||
onMounted(() => {
|
||||
getList()
|
||||
getUser()
|
||||
@@ -168,20 +271,87 @@ onMounted(() => {
|
||||
nextTick(() => {
|
||||
showFan.value = true;
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
const changeName = (id) => {
|
||||
for (let item of equipmentOption.value) {
|
||||
if (item.value === id) {
|
||||
return item.label;
|
||||
}
|
||||
}
|
||||
return "";
|
||||
}
|
||||
const handleReset = () => {
|
||||
queryForm.value.resetFields()
|
||||
getList()
|
||||
}
|
||||
//点击页码进行分页功能
|
||||
const handleCurrentChange = (val) => {
|
||||
pageInfo.pageNum = val
|
||||
getAlarmList()
|
||||
}
|
||||
const handleDelete = (row) => {
|
||||
ElMessageBox.confirm(`确认删除名称为${changeName(row.equipmentId)}的报警信息吗？`, '系统提示', {
|
||||
type: 'warning',
|
||||
closeOnClickModal: false
|
||||
}).then(() => {
|
||||
deleteAlarmSate(row.alarmId).then(res => {
|
||||
if (res.code === 1000) {
|
||||
ElMessage.success('删除成功')
|
||||
getAlarmList()
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
//查看报警信息详情
|
||||
const handleView = (row) => {
|
||||
getAlarmDetail(row.alarmId).then(res => {
|
||||
if (res.code === 1000) {
|
||||
isDetailVisited.value = true
|
||||
alarmDetail.value = res.data
|
||||
if (roleKey.value !== 'administrator') {
|
||||
handleChangeState(row)
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
const handleChangeState = (row) => {
|
||||
updateAlarmState([{
|
||||
alarmId: row.alarmId,
|
||||
lookupStatus: true,
|
||||
userId: currentUserId.value,
|
||||
}]).then(res => {
|
||||
if (res.code === 1000) {
|
||||
// ElMessage.success(res.msg);
|
||||
} else {
|
||||
// ElMessage.error(res.msg);
|
||||
}
|
||||
});
|
||||
}
|
||||
const getAlarmList = () => {
|
||||
getAlarmInfo({
|
||||
tunnelId: tunnelId.value,
|
||||
lookupStatus: queryParams.lookupStatus,
|
||||
...pageInfo
|
||||
}).then(res => {
|
||||
if (res.code === 1000) {
|
||||
alarmList.value = res.data.rows
|
||||
total.value = res.data.total
|
||||
}
|
||||
})
|
||||
}
|
||||
const getUser = () => {
|
||||
getUserInfo().then(res => {
|
||||
currentUser.value = res.data.user.userName
|
||||
currentUserId.value = res.data.user.userId
|
||||
localStorage.setItem('roleKey', res.data.user.roles[0].roleKey)
|
||||
roleKey.value = res.data.roles[0]
|
||||
localStorage.setItem('roleKey', res.data.roles[0])
|
||||
localStorage.setItem('userId', currentUserId.value)
|
||||
})
|
||||
}
|
||||
|
||||
const getOtherInfo = () => {
|
||||
getLargeScreenInfo().then((res) => {
|
||||
// console.log(res);
|
||||
if (res?.code === 1000) {
|
||||
let routeArr = [];
|
||||
res.data.routeList.forEach((item) => {
|
||||
@@ -205,7 +375,6 @@ const getOtherInfo = () => {
|
||||
nextTick(() => {
|
||||
showTunnelTitle.value = true
|
||||
});
|
||||
console.log('siteId', siteId)
|
||||
getTunnel(siteId)
|
||||
} else {
|
||||
getTunnel(res.data.siteOption[0].value)
|
||||
@@ -220,27 +389,50 @@ const getOtherInfo = () => {
|
||||
const getScreenInfo = (id) => {
|
||||
if (id) {
|
||||
tunnelId.value = id
|
||||
equipmentOption.value = []
|
||||
getLargeScreen(id).then((res) => {
|
||||
if (res?.code === 1000) {
|
||||
let option = {}
|
||||
if (res.data.frequencyChangerList.length !== 0) {
|
||||
res.data.frequencyChangerList.forEach((item) => {
|
||||
option = {
|
||||
value: item.equipmentId,
|
||||
label: item.equipmentName,
|
||||
}
|
||||
equipmentOption.value.push(option)
|
||||
})
|
||||
showFanLoading.value = 0
|
||||
} else {
|
||||
showFanLoading.value = 1
|
||||
}
|
||||
if (res.data.windPressureSensorList.length !== 0) {
|
||||
res.data.windPressureSensorList.forEach((item) => {
|
||||
option = {
|
||||
value: item.equipmentId,
|
||||
label: item.equipmentName,
|
||||
}
|
||||
equipmentOption.value.push(option)
|
||||
})
|
||||
showWindLoading.value = 0
|
||||
} else {
|
||||
showWindLoading.value = 1
|
||||
}
|
||||
if (res.data.sensorList.length !== 0) {
|
||||
res.data.sensorList.forEach((item) => {
|
||||
option = {
|
||||
value: item.equipmentId,
|
||||
label: item.equipmentName,
|
||||
}
|
||||
equipmentOption.value.push(option)
|
||||
})
|
||||
res.data.sensorList.forEach((item) => {
|
||||
if (
|
||||
item.equipmentType === "carbonDioxide" ||
|
||||
item.equipmentType === "carbonMonoxide" ||
|
||||
item.equipmentType === "hydrogenSulfide" ||
|
||||
item.equipmentType === "sulfurDioxide" ||
|
||||
item.equipmentType === "sulfurMonoxide" ||
|
||||
item.equipmentType === "nitrogenDioxide"
|
||||
item.equipmentType === "carbonDioxide" ||
|
||||
item.equipmentType === "carbonMonoxide" ||
|
||||
item.equipmentType === "hydrogenSulfide" ||
|
||||
item.equipmentType === "sulfurDioxide" ||
|
||||
item.equipmentType === "sulfurMonoxide" ||
|
||||
item.equipmentType === "nitrogenDioxide"
|
||||
) {
|
||||
showBadLoading.value = 0
|
||||
} else {
|
||||
@@ -251,6 +443,7 @@ const getScreenInfo = (id) => {
|
||||
showBadLoading.value = 1
|
||||
}
|
||||
largeScreenData.value = res.data;
|
||||
// console.log(largeScreenData.value);
|
||||
} else {
|
||||
ElMessage.warning(res.msg)
|
||||
}
|
||||
@@ -268,8 +461,6 @@ const getList = () => {
|
||||
getTunnelList({
|
||||
siteId: siteId
|
||||
}).then(res => {
|
||||
//这里拿到我们的隧道简称
|
||||
|
||||
if (res.code === 1000) {
|
||||
if (res.data.rows.length !== 0) {
|
||||
isTunnel = true;
|
||||
@@ -298,7 +489,6 @@ const getTunnel = (id) => {
|
||||
getScreenInfo(previewId)
|
||||
} else {
|
||||
getScreenInfo(res.data[0]?.value)
|
||||
console.log(res);
|
||||
}
|
||||
tunnelList.value = res.data
|
||||
tunnelList.value.forEach((item, index) => {
|
||||
@@ -320,6 +510,7 @@ const changeTunnel = (e) => {
|
||||
showBadLoading.value = 0
|
||||
showWindLoading.value = 0
|
||||
showFanLoading.value = 0
|
||||
pageInfo.pageNum = 1
|
||||
getScreenInfo(newObj.value)
|
||||
nextTick(() => {
|
||||
showFan.value = true;
|
||||
@@ -440,11 +631,7 @@ const initWebSocket = () => {
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.is-light {
|
||||
background: rgba(7, 35, 72, 0.9);
|
||||
}
|
||||
|
||||
.el-popper {
|
||||
.dropdown-style {
|
||||
padding: 20px;
|
||||
margin-left: 50px;
|
||||
width: 150px;
|
||||
@@ -477,6 +664,11 @@ const initWebSocket = () => {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.is-light {
|
||||
background: rgba(7, 35, 72, 0.9);
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -490,4 +682,257 @@ const initWebSocket = () => {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.alarm-dialog {
|
||||
:deep(.el-dialog ) {
|
||||
height: auto !important;
|
||||
margin: 820px auto 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
.digital-tunnel {
|
||||
.detail {
|
||||
font-size: 50px;
|
||||
color: #FFFFFF;
|
||||
|
||||
> div {
|
||||
color: #f5f5f5;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.digital-tunnel {
|
||||
:deep(.el-dialog ) {
|
||||
height: 1380px;
|
||||
|
||||
.alarm-content {
|
||||
//width: 730px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.el-tag {
|
||||
font-size: 36px;
|
||||
height: 60px;
|
||||
padding: 0 20px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.query-form {
|
||||
:deep(.el-form-item__label) {
|
||||
font-size: 45px;
|
||||
height: 70px;
|
||||
line-height: 70px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
:deep(.el-form-item__content) {
|
||||
.el-select__popper {
|
||||
margin-top: -12px !important;
|
||||
background: #072247 !important;
|
||||
border: 1px solid #0F82AF !important;
|
||||
|
||||
.el-select-dropdown__item {
|
||||
font-size: 38px !important;
|
||||
height: 70px !important;
|
||||
line-height: 70px !important;
|
||||
|
||||
> span {
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
.el-select-dropdown__item.hover, .el-select-dropdown__item:hover {
|
||||
background-color: #064B66 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.el-button {
|
||||
height: 70px;
|
||||
font-size: 40px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.el-button--primary {
|
||||
background: #064B66;
|
||||
}
|
||||
|
||||
.el-input {
|
||||
width: 380px;
|
||||
height: 70px;
|
||||
|
||||
.el-input__wrapper {
|
||||
font-size: 40px;
|
||||
background-color: transparent;
|
||||
border: 1px solid #08B7B8;
|
||||
box-shadow: none;
|
||||
|
||||
.el-input__inner {
|
||||
height: 70px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.el-input__suffix-inner {
|
||||
.el-icon {
|
||||
font-size: 40px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.device-table {
|
||||
margin-top: 7px;
|
||||
|
||||
:deep(.el-button) {
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
.active {
|
||||
color: #FFFFFF;
|
||||
background: #0f7da9;
|
||||
}
|
||||
|
||||
.wind-switch {
|
||||
margin-left: 65px;
|
||||
}
|
||||
|
||||
.switch {
|
||||
margin-top: 22px;
|
||||
display: flex;
|
||||
width: 200px;
|
||||
height: 50px;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #05FEFF;
|
||||
overflow: hidden;
|
||||
color: #51A2B3;
|
||||
line-height: 40px;
|
||||
font-size: 36px;
|
||||
|
||||
& > div {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.el-table--fit) {
|
||||
//width: 1780px !important;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
:deep(.cell) {
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
color: #fff;
|
||||
font-size: 38px;
|
||||
}
|
||||
|
||||
:deep(.el-table tr) {
|
||||
background-color: #1C5971;
|
||||
}
|
||||
|
||||
:deep(.el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell) {
|
||||
background-color: #1C5971;
|
||||
}
|
||||
|
||||
:deep(.el-table__row--striped) {
|
||||
background-color: #13849C !important;
|
||||
}
|
||||
|
||||
:deep(.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell) {
|
||||
background-color: #13849C !important;
|
||||
}
|
||||
|
||||
:deep(.el-table__cell) {
|
||||
.el-input {
|
||||
width: 180px;
|
||||
height: 53px;
|
||||
}
|
||||
|
||||
.el-input__wrapper {
|
||||
border-radius: 6px;
|
||||
border: 1px solid #05FEFF;
|
||||
background-color: transparent;
|
||||
|
||||
.el-input__inner {
|
||||
color: #FFFFFF;
|
||||
font-size: 40px;
|
||||
height: auto;
|
||||
line-height: normal;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.el-table__inner-wrapper::before) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.pagination {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
bottom: 0;
|
||||
color: #60DDDE;
|
||||
font-size: 38px;
|
||||
font-weight: bold;
|
||||
|
||||
> span:first-child {
|
||||
margin-right: 60px;
|
||||
}
|
||||
|
||||
> span:last-child {
|
||||
margin-left: 71px;
|
||||
}
|
||||
|
||||
:deep(.btn-prev) {
|
||||
background-color: transparent;
|
||||
font-size: 38px;
|
||||
font-weight: bold;
|
||||
color: #60DDDE;
|
||||
margin-right: 20px;
|
||||
|
||||
}
|
||||
|
||||
:deep(.btn-next) {
|
||||
background-color: transparent;
|
||||
font-size: 38px;
|
||||
font-weight: bold;
|
||||
color: #60DDDE;
|
||||
margin-left: 30px;
|
||||
}
|
||||
|
||||
:deep(.el-pager li.is-active ) {
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
background: #60DDDE;
|
||||
border-radius: 50%;
|
||||
color: #071F40;
|
||||
font-size: 38px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
:deep(.el-pager li) {
|
||||
margin-left: 40px;
|
||||
}
|
||||
|
||||
:deep(.el-pager li:not(.is-active) ) {
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
border: 1px solid #60DDDE;
|
||||
border-radius: 50%;
|
||||
background-color: transparent;
|
||||
font-size: 38px;
|
||||
font-weight: bold;
|
||||
color: #60DDDE;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -169,7 +169,7 @@ const form = ref({
|
||||
nickName: '',
|
||||
phoneNumber: '',
|
||||
state: '1',
|
||||
roleId: [],
|
||||
roleId: 3,
|
||||
tunnelList: [1]
|
||||
});
|
||||
const validateName = (rule, value) => {
|
||||
@@ -207,6 +207,10 @@ const handleAddUser = () => {
|
||||
reset()
|
||||
title.value = '添加用户'
|
||||
isVisited.value = true
|
||||
nextTick(() => {
|
||||
// 清空校验
|
||||
formInstance.value.clearValidate()
|
||||
})
|
||||
}
|
||||
const handleEditUser = (row) => {
|
||||
reset()
|
||||
@@ -247,7 +251,7 @@ const reset = () => {
|
||||
nickName: '',
|
||||
phoneNumber: '',
|
||||
state: '1',
|
||||
roleId: [],
|
||||
roleId: 3,
|
||||
tunnelList: []
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user