odjbin/tunnel-cloud-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request '邓洁: 接口及细节优化' (#249) from dengjie into dev

Browse Source 
Reviewed-on: http://git.feashow.cn/clay/tunnel-cloud-web/pulls/249
This commit is contained in:
odjbin
2024-01-21 15:14:03 +00:00
parent 58ef00be98 99d89d6a2b
commit bb111af19f
6 changed files with 184 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
src/api/largeScreen.js
View File

@@ -42,3 +42,27 @@ export const getFanEchartsInfo = (equipmentId) => {
method: 'get'
})
}
//风机频率修改
export const editFrequency = (data) => {
return request({
url: '/tunnel/large/screen/frequency',
method: 'put',
data
})
}
//风机运行模式切换
export const editFrequencyModelSwitch = (data) => {
return request({
url: '/tunnel/large/screen/model/switch',
method: 'post',
data
})
}
//风机开关切换
export const editFrequencyOperationSwitch = (data) => {
return request({
url: '/tunnel/large/screen/operation/switch',
method: 'post',
data
})
}

3
src/components/content/airInfo/AirInfo.vue
View File

@@ -238,8 +238,7 @@ const initChart = (type, values) => {
let content = `
<div style="background: linear-gradient(180deg, #254062 0%, rgba(20,36,51,0.3) 100%);;border: 2px solid #6087BA;border-radius: 4px;padding: 8px 16px;">
<div style="font-size: 52px;font-family: PingFang SC-Regular, PingFang SC;font-weight: 400;color: #EFEEEE;margin-bottom: 8px;">${params[0].name}</div>
<div style="font-size: 48px;line-height: 48px;font-family: Bebas Neue-Regular, Bebas Neue;font-weight: 400;"><span style="color: #FFFFFF">进风口: </span><span style="background: linear-gradient(180deg, #F5B85F 0%, #FFFFFF 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;">${params[0].value}</span></div>
<div style="font-size: 48px;line-height: 48px;font-family: Bebas Neue-Regular, Bebas Neue;font-weight: 400;margin-top: 30px"><span style="color: #FFFFFF">出风口: </span><span style="background: linear-gradient(180deg, #F5B85F 0%, #FFFFFF 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;">${params[1].value}</span></div>
<div style="font-size: 48px;line-height: 48px;font-family: Bebas Neue-Regular, Bebas Neue;font-weight: 400;"><span style="background: linear-gradient(180deg, #F5B85F 0%, #FFFFFF 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;">${params[0].value}</span></div>
</div>`;
return content;
},

168
src/components/content/fanInfo/FanInfo.vue
View File

@@ -24,14 +24,14 @@
<div
id="auto"
:class="{ active: item.running }"
@click="item.running = true"
@click="item.running = true;editOperate(item)"
>
启动
</div>
<div
id="stop"
:class="{ active: !item.running }"
@click="item.running = false"
@click="item.running = false;editOperate(item)"
>
停止
</div>
@@ -39,20 +39,27 @@
</div>
<div class="power">
<div class="check-box">
<el-radio-group v-model="item.autoMode">
<el-radio-group v-model="item.autoMode" @change="changeModel(item)">
<el-radio :label="true">自动</el-radio>
<el-radio :label="false">手动</el-radio>
</el-radio-group>
</div>
<div class="edit-power">
<span style="color: white">当前功率</span>
<span class="units"
><input
type="number"
min="0"
v-model="item.frequencySetting"
:disabled="item.autoMode"
/></span>
<span style="color: white">给定频率</span>
<!-- <span class="units"-->
<!-- ><input-->
<!-- type="number"-->
<!-- min="0"-->
<!-- v-model="item.frequencySetting"-->
<!-- onchange="changeFrequency(item)"-->
<!-- :disabled="item.autoMode"-->
<!-- /></span>-->
<el-input type="number" min="0" v-model="item.frequencySetting" :disabled="item.autoMode"
@change="changeFrequency(item)">
<template #suffix>
<span>Hz</span>
</template>
</el-input>
</div>
</div>
</div>
@@ -108,10 +115,16 @@
<script setup>
import * as echarts from "echarts";
import FanInfoItem from "./FanInfoItem.vue";
import {getFanEchartsInfo} from "../../../api/largeScreen";
import {
editFrequency,
editFrequencyModelSwitch,
editFrequencyOperationSwitch,
getFanEchartsInfo
} from "../../../api/largeScreen";
const props = defineProps({
list: Array,
tunnelId: Number,
fanData: Array,
transducerData: Array,
loading: Number,
@@ -145,6 +158,9 @@ let myEcharts = reactive({});
watch(() => props.loading, (now) => {
props.loading = now
}, {deep: true});
watch(() => props.tunnelId, (now) => {
props.tunnelId = now
}, {deep: true});
watch(() => props.transducerData, (now) => {
getTransData(now.frequencyChangerList)
}, {deep: true});
@@ -178,6 +194,47 @@ watch(() => props.list, (now) => {
})
handleOnMounted()
}, {deep: true});
const packageData = (item, type, flag) => {
let number = 0
if (item.equipmentType === "frequency1") {
number = 1
} else if (item.equipmentType === "frequency2") {
number = 2
}
if (flag) {
return {
number: number,
value: type,//浮点数
tunnelId: props.tunnelId,
}
} else {
return {
number: number,
state: type === true ? 0 : 1,
tunnelId: props.tunnelId,
}
}
}
//启动/停止
const editOperate = (item) => {
const data = packageData(item, item.running)
editFrequencyOperationSwitch(data).then(res => {
console.log('修改风机启动', res)
})
}
const changeFrequency = (item) => {
console.log()
const data = packageData(item, item.frequencySetting, true)
editFrequency(data).then(res => {
console.log('修改风机频率', res)
})
}
const changeModel = (item) => {
const data = packageData(item, item.autoMode)
editFrequencyModelSwitch(data).then(res => {
console.log('修改自动模式', res)
})
}
const getFanInfo = (equipmentId) => {
isVisited.value = true
showLoading.value = true
@@ -242,11 +299,12 @@ const getBasicData = (data) => {
data?.map(item => {
tranObj = {
equipmentId: item.equipmentId,
equipmentType: item.equipmentType,
autoMode: item.autoMode,//自动模式
breakdown: item.breakdown,//故障
running: item.running,//启动,
frequencyFeedback: item.frequencyFeedback,//当前功率
frequencySetting: item.frequencySetting//当前功率
frequencyFeedback: item.frequencyFeedback,
frequencySetting: item.frequencySetting
}
tranArr.push(tranObj)
})
@@ -795,34 +853,70 @@ input[type="number"] {
.edit-power {
margin-top: 10px;
display: flex;
.units {
position: relative;
> span:first-child {
white-space: pre;
margin-right: 14px;
}
.units::after {
content: "Hz";
position: absolute;
right: 6px;
top: 50%;
transform: translateY(-50%);
font-size: 28px;
color: #38cafb;
line-height: 37px;
}
input {
//:deep(.is-disabled) {
// .el-input__inner{
// color: #FFFFFF!important;
// }
//}
:deep(.el-input__wrapper) {
width: 130px;
height: 44px;
border: 2px solid #0f82af;
background: transparent;
margin-left: 14px;
outline: none;
font-size: 28px;
font-weight: bold;
color: #38cafb;
line-height: 37px;
background-color: transparent;
box-shadow: none;
border: 1px solid #38CAFB;
transform: none;
transition: none;
margin-right: 10px;
.el-input__inner {
height: 44px;
font-size: 30px;
font-weight: bold;
color: #38CAFB;
}
.el-input__suffix-inner {
font-size: 30px;
color: #38CAFB;
line-height: 40px;
font-weight: bold;
}
}
//.units {
// position: relative;
//}
//
//.units::after {
// content: "Hz";
// position: absolute;
// right: 6px;
// top: 50%;
// transform: translateY(-50%);
// font-size: 28px;
// color: #38cafb;
// line-height: 37px;
//}
//
//input {
// width: 130px;
// height: 44px;
// border: 2px solid #0f82af;
// background: transparent;
// margin-left: 14px;
// outline: none;
// font-size: 28px;
// font-weight: bold;
// color: #38cafb;
// line-height: 37px;
//}
}
}
}

12
src/views/edit/edit.vue
View File

@@ -16,6 +16,9 @@
<el-form-item label="隧道名称">
<el-input v-model="form.tunnelName" placeholder="请输入隧道名称"/>
</el-form-item>
<el-form-item label="隧道简称">
<el-input v-model="form.tunnelAlias" placeholder="请输入隧道简称"/>
</el-form-item>
<el-form-item label="序列号">
<el-input v-model="form.serialNumber" placeholder="请输入序列号"/>
</el-form-item>
@@ -52,7 +55,7 @@ const tunnelId = reactive(router.currentRoute.value.params.tunnelId);
const userId = reactive(router.currentRoute.value.params.userId);
const type = reactive(router.currentRoute.value.params.type);
const modelStore = useModelSceneStore();
const constructionLength = ref(null)
const constructionLength = ref(0)
const modelEquipmentList = ref(null)
const form = ref({
tunnelName: "",
@@ -87,9 +90,16 @@ const getTunnelInfo = () => {
initSceneData(tunnelId).then((res) => {
constructionLength.value = res.data.constructionLength
modelEquipmentList.value = JSON.parse(res.data.tunnelThreeConfig)
if(constructionLength.value===null){
constructionLength.value=0
}
if(modelEquipmentList.value===null){
modelEquipmentList.value=[]
}
const data = {
tunnelId: tunnelId,
tunnelName: form.value.tunnelName,
tunnelAlias: form.value.tunnelAlias,
serialNumber: form.value.serialNumber,
remarks: form.value.remarks,
constructionLength: constructionLength.value,

12
src/views/tunnel-manage/index.vue
View File

@@ -45,8 +45,8 @@
</div>
<div class="tunnel-right">
<div>
<div class="fan-icon"></div>
<span>风机异常</span>
<!-- <div class="fan-icon"></div>-->
<!-- <span>风机异常</span>-->
</div>
<div class="icons-block">
<div v-for="equItem in iconsList" :key="item.icon" class="icon-text">
@@ -70,6 +70,9 @@
<el-form-item label="隧道名称" prop="tunnelName">
<el-input v-model="form.tunnelName" placeholder="请输入隧道名称"/>
</el-form-item>
<el-form-item label="隧道简称" prop="tunnelAlias">
<el-input v-model="form.tunnelAlias" placeholder="请输入隧道简称"/>
</el-form-item>
<el-form-item label="序列号" prop="serialNumber">
<el-input v-model="form.serialNumber" placeholder="请输入序列号"/>
</el-form-item>
@@ -123,6 +126,7 @@ const validateNumber = (rule, value) => {
}
const formRules = ref({
tunnelName: [{required: true, message: '请输入隧道名称', trigger: ['blur', 'change']}],
tunnelAlias: [{required: true, message: '请输入隧道简称', trigger: ['blur', 'change']}],
serialNumber: [
{required: true, message: '请输入序列号', trigger: ['blur', 'change']},
{validator: validateNumber, message: '请输入英文、数字、英文数字组合的用户名', trigger: ['blur', 'change']}
@@ -190,6 +194,7 @@ const tunnelNameList = ref([])
const siteName = ref(localStorage.getItem('site'))
const form = ref({
tunnelName: '',
tunnelAlias: '',
serialNumber: '',
totalLength: '',
remarks: '',
@@ -297,6 +302,7 @@ const handleEditDevice = (tunnelId) => {
const restFrom = () => {
form.value = {
tunnelName: '',
tunnelAlias: '',
serialNumber: '',
totalLength: '',
remarks: '',
@@ -650,7 +656,7 @@ const handleMoreDelete = () => {
}
.icons-block {
margin-top: 30px;
margin-top: 50px;
display: flex;
flex-wrap: wrap;

18
src/views/tunnel/index.vue
View File

@@ -5,7 +5,7 @@
<div class="tunnel-title"></div>
<!-- <manage-length class="tunnel-length"></manage-length>-->
<div class="top-length">
<span>隧道总长度: {{ tunnelLength }}米</span>
<!-- <span>隧道总长度: {{ tunnelLength }}米</span>-->
<span>当前施工长度: {{ constructionLength }}米</span>
</div>
<div class="top-right">
@@ -39,7 +39,7 @@
<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">
<fan-info v-if="showFan" :list="socketData.leftData" :fan-data="largeScreenData"
:transducer-data="largeScreenData" :loading="showFanLoading" />
: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>
@@ -115,8 +115,6 @@ const routeList = ref([]);
let socket = reactive("");
let tunnelName = reactive("")
const btnList = ref([
{
route: '/site',
@@ -143,7 +141,7 @@ const btnList = ref([
// name: '模拟仿真'
// },
])
const serialNumber = ref("SC00DY00GH00ELBT");
const serialNumber = ref("");
let token = getToken();
let send = {
type: "ping",
@@ -154,10 +152,11 @@ const socketData = reactive({
windPressure: [],
sensor: [],
});
let tunnelLen = computed(() => tunnelLength);
onMounted(() => {
if (previewId) {
getScreenInfo(previewId)
}
getUser()
getOtherInfo()
@@ -165,6 +164,7 @@ onMounted(() => {
showFan.value = true;
});
});
const getUser = () => {
getUserInfo().then(res => {
currentUser.value = res.data.user.userName
@@ -245,6 +245,8 @@ const getScreenInfo = (id) => {
initSceneData(id).then((res) => {
tunnelLength.value = res.data.tunnelLength
constructionLength.value = res.data.constructionLength
serialNumber.value=res.data.serialNumber
initWebSocket();
})
}
};
@@ -359,10 +361,6 @@ const initWebSocket = () => {
socket.send(JSON.stringify(send));
}, 30000);
};
initWebSocket();
let tunnelLen = computed(() => tunnelLength);
</script>
<style lang="scss">
.el-drawer__header {