Merge pull request 'dengjie' (#153) from dengjie into dev
Reviewed-on: http://git.feashow.cn/clay/tunnel-cloud-web/pulls/153
This commit is contained in:
@@ -14,3 +14,10 @@ export const getLargeScreenInfo = () => {
|
|||||||
method: 'get'
|
method: 'get'
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
// 风压echarts数据
|
||||||
|
export const getEchartsInfo = (equipmentId) => {
|
||||||
|
return request({
|
||||||
|
url: `/tunnel/large/screen/echarts/wind/pressure/${equipmentId}`,
|
||||||
|
method: 'get'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|||||||
@@ -293,7 +293,9 @@ input[type="number"] {
|
|||||||
}
|
}
|
||||||
|
|
||||||
#fan_info {
|
#fan_info {
|
||||||
height: 795px;
|
min-height: 547px;
|
||||||
|
max-height: 795px;
|
||||||
|
height: 547px;
|
||||||
width: 830px;
|
width: 830px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
z-index: 100;
|
z-index: 100;
|
||||||
@@ -321,7 +323,7 @@ input[type="number"] {
|
|||||||
height: calc(100% - 30px);
|
height: calc(100% - 30px);
|
||||||
|
|
||||||
.fan-item {
|
.fan-item {
|
||||||
height: 33.3%;
|
height: 50%;
|
||||||
display: flex;
|
display: flex;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
|
|
||||||
|
|||||||
@@ -125,10 +125,12 @@ const getBasicData = (data) => {
|
|||||||
#transducer-list {
|
#transducer-list {
|
||||||
color: rgb(226, 26, 26);
|
color: rgb(226, 26, 26);
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 1015px;
|
//top: 1015px;
|
||||||
|
top: 760px;
|
||||||
left: 70px;
|
left: 70px;
|
||||||
width: 830px;
|
width: 830px;
|
||||||
height: 928px;
|
//height: 928px;
|
||||||
|
height: 620px;
|
||||||
background-image: url(@/assets/images/transducer/bg.png);
|
background-image: url(@/assets/images/transducer/bg.png);
|
||||||
padding: 0 30px;
|
padding: 0 30px;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
|
|||||||
@@ -187,7 +187,8 @@ const getImageUrl = (name) => {
|
|||||||
height: 90px;
|
height: 90px;
|
||||||
color: aliceblue;
|
color: aliceblue;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 1980px;
|
//top: 1980px;
|
||||||
|
top: 1420px;
|
||||||
left: 68px;
|
left: 68px;
|
||||||
background-image: url(../../../assets/images/usedEle/bg.png);
|
background-image: url(../../../assets/images/usedEle/bg.png);
|
||||||
padding: 21px 62px 35px 62px;
|
padding: 21px 62px 35px 62px;
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
<div id="wind-pressure">
|
<div id="wind-pressure">
|
||||||
<div class="name">风压</div>
|
<div class="name">风压</div>
|
||||||
<div class="list">
|
<div class="list">
|
||||||
<wind-pressure-item v-for="(item,index) in wpList" :key="item.equipmentId" :wp="item" :index="index+1" @click="handleOpenChart(index+1)"/>
|
<wind-pressure-item v-for="(item,index) in wpList" :key="item.equipmentId" :wp="item" :index="index+1" @click="handleOpenChart(item,index+1)"/>
|
||||||
</div>
|
</div>
|
||||||
<div class="digital-tunnel">
|
<div class="digital-tunnel">
|
||||||
<el-dialog v-model="isVisited" :title="windSort+'号风压监控数据'" width="2175px" :modal="false">
|
<el-dialog v-model="isVisited" :title="windSort+'号风压监控数据'" width="2175px" :modal="false">
|
||||||
@@ -30,6 +30,7 @@
|
|||||||
import WindPressureItem from "./childComps/WindPressureItem.vue";
|
import WindPressureItem from "./childComps/WindPressureItem.vue";
|
||||||
import TimeRangeBtn from "@/components/timeRangeBtn/index.vue"
|
import TimeRangeBtn from "@/components/timeRangeBtn/index.vue"
|
||||||
import * as echarts from 'echarts';
|
import * as echarts from 'echarts';
|
||||||
|
import {getEchartsInfo} from "../../../api/largeScreen";
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
list: Array,
|
list: Array,
|
||||||
winData: Array
|
winData: Array
|
||||||
@@ -40,6 +41,7 @@ const selectTimeButton = ref(2);
|
|||||||
const isVisited = ref(false);
|
const isVisited = ref(false);
|
||||||
let myEcharts = reactive({});
|
let myEcharts = reactive({});
|
||||||
const wpList = ref([]);
|
const wpList = ref([]);
|
||||||
|
const chartData=ref()
|
||||||
watch(() => props.list, (now) => {
|
watch(() => props.list, (now) => {
|
||||||
wpList.value.forEach(item=>{
|
wpList.value.forEach(item=>{
|
||||||
now.forEach(newItem=>{
|
now.forEach(newItem=>{
|
||||||
@@ -53,14 +55,23 @@ watch(() => props.list, (now) => {
|
|||||||
watch(() => props.winData, (now) => {
|
watch(() => props.winData, (now) => {
|
||||||
getScreenInfo(now.windPressureSensorList)
|
getScreenInfo(now.windPressureSensorList)
|
||||||
}, {deep: true});
|
}, {deep: true});
|
||||||
const handleOpenChart = (index) => {
|
|
||||||
console.log('用电量弹窗')
|
const getWindInfo=(equipmentId)=>{
|
||||||
isVisited.value = true
|
getEchartsInfo(equipmentId).then(res=>{
|
||||||
windSort.value=index
|
console.log('res-wind',res)
|
||||||
nextTick(() => {
|
if(res?.code===1000){
|
||||||
initChart()
|
isVisited.value = true
|
||||||
|
nextTick(() => {
|
||||||
|
initChart(res.data.dates,res.data.values)
|
||||||
|
})
|
||||||
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const handleOpenChart = (item,index) => {
|
||||||
|
getWindInfo(item.equipmentId)
|
||||||
|
windSort.value=index
|
||||||
|
}
|
||||||
const timeSelect = (index) => {
|
const timeSelect = (index) => {
|
||||||
console.log('选择时间', index)
|
console.log('选择时间', index)
|
||||||
if(index===0){
|
if(index===0){
|
||||||
@@ -89,7 +100,7 @@ const getScreenInfo = (now) => {
|
|||||||
/**
|
/**
|
||||||
* 初始化echarts实例方法
|
* 初始化echarts实例方法
|
||||||
*/
|
*/
|
||||||
const initChart = () => {
|
const initChart = (type,values) => {
|
||||||
//3.初始化container容器
|
//3.初始化container容器
|
||||||
myEcharts = echarts.init(document.getElementById('container'));
|
myEcharts = echarts.init(document.getElementById('container'));
|
||||||
//5.传入数据
|
//5.传入数据
|
||||||
@@ -123,7 +134,8 @@ const initChart = () => {
|
|||||||
//X轴
|
//X轴
|
||||||
xAxis: {
|
xAxis: {
|
||||||
type: 'category',
|
type: 'category',
|
||||||
data: ['00:00', '01:00', '02:00', '03:00', '04:00', '05:00', '06:00','07:00', '08:00', '09:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '16:00', '17:00', '18:00','19:00', '20:00', '21:00', '22:00', '23:00','24:00'],
|
// data: ['00:00', '01:00', '02:00', '03:00', '04:00', '05:00', '06:00','07:00', '08:00', '09:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '16:00', '17:00', '18:00','19:00', '20:00', '21:00', '22:00', '23:00','24:00'],
|
||||||
|
data: type,
|
||||||
axisLabel: {
|
axisLabel: {
|
||||||
textStyle: {
|
textStyle: {
|
||||||
fontSize: 45,
|
fontSize: 45,
|
||||||
@@ -144,7 +156,8 @@ const initChart = () => {
|
|||||||
//配置项
|
//配置项
|
||||||
series: [
|
series: [
|
||||||
{
|
{
|
||||||
data: [56, 12, 89, 34, 71, 43, 67, 20, 98, 72, 19, 61, 3, 85, 47, 92, 17, 76, 69, 25, 31, 49, 81, 63],
|
// data: [56, 12, 89, 34, 71, 43, 67, 20, 98, 72, 19, 61, 3, 85, 47, 92, 17, 76, 69, 25, 31, 49, 81, 63],
|
||||||
|
data: values,
|
||||||
type: 'line',
|
type: 'line',
|
||||||
smooth: true,
|
smooth: true,
|
||||||
symbolSize: 24,
|
symbolSize: 24,
|
||||||
|
|||||||
@@ -67,7 +67,7 @@ import { getToken } from "@/utils/auth";
|
|||||||
import { useAuthStore } from "@/store/userstore.js";
|
import { useAuthStore } from "@/store/userstore.js";
|
||||||
import { getLargeScreen, getLargeScreenInfo } from "@/api/largeScreen";
|
import { getLargeScreen, getLargeScreenInfo } from "@/api/largeScreen";
|
||||||
import { ElMessageBox } from "element-plus";
|
import { ElMessageBox } from "element-plus";
|
||||||
|
import {getUserInfo} from "@/api/login";
|
||||||
const authStore = useAuthStore();
|
const authStore = useAuthStore();
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const selectIndex = ref(-1);
|
const selectIndex = ref(-1);
|
||||||
@@ -75,7 +75,7 @@ const showFan = ref(false);
|
|||||||
const drawerLeft = ref(true);
|
const drawerLeft = ref(true);
|
||||||
const drawerRight = ref(true);
|
const drawerRight = ref(true);
|
||||||
const currentSite = ref("松江站");
|
const currentSite = ref("松江站");
|
||||||
const currentUser = ref("admin");
|
const currentUser = ref("");
|
||||||
const currentDate = ref(dateFormat());
|
const currentDate = ref(dateFormat());
|
||||||
const tunnelBtn = ref();
|
const tunnelBtn = ref();
|
||||||
const tunnelList = ref([]);
|
const tunnelList = ref([]);
|
||||||
@@ -97,10 +97,16 @@ onMounted(() => {
|
|||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
showFan.value = true;
|
showFan.value = true;
|
||||||
});
|
});
|
||||||
|
getUser()
|
||||||
getOtherInfo()
|
getOtherInfo()
|
||||||
getScreenInfo();
|
getScreenInfo();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const getUser=()=>{
|
||||||
|
getUserInfo().then(res=>{
|
||||||
|
currentUser.value=res.data.user.userName
|
||||||
|
})
|
||||||
|
}
|
||||||
const getOtherInfo = async () => {
|
const getOtherInfo = async () => {
|
||||||
await getLargeScreenInfo().then((res) => {
|
await getLargeScreenInfo().then((res) => {
|
||||||
if (res?.code === 1000) {
|
if (res?.code === 1000) {
|
||||||
|
|||||||
Reference in New Issue
Block a user