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

Merge pull request 'de' (#367) from de into dev

Browse Source 
Reviewed-on: http://git.feashow.cn/clay/tunnel-cloud-web/pulls/367
This commit is contained in:
odjbin
2024-08-20 10:07:52 +00:00
parent e6cd9c8836 4378ec571c
commit 9aef340598
4 changed files with 124 additions and 88 deletions
Download Patch File Download Diff File Expand all files Collapse all files

80
src/views/device-manage/index.vue
View File

@@ -76,19 +76,19 @@
@change="changeFanData(scope.row)"></el-input> @change="changeFanData(scope.row)"></el-input>
</template> </template>
</el-table-column> </el-table-column>
<!-- <el-table-column prop="serialNumber" label="序列号" align="center" width="500">--> <el-table-column prop="serialNumber" label="序列号" align="center" width="500">
<!-- <template #default="scope">--> <template #default="scope">
<!-- <el-select placeholder="请选择" v-model="scope.row.serialNumber" popper-class="serialNumber-select"--> <el-select placeholder="请选择" v-model="scope.row.serialNumber" popper-class="serialNumber-select"
<!-- @change="changeFanData(scope.row)" class="serialNumber">--> @change="changeFanData(scope.row)" class="serialNumber">
<!-- <el-option--> <el-option
<!-- v-for="item in serialNumberOptions"--> v-for="item in serialNumberOptions"
<!-- :key="item.value"--> :key="item.value"
<!-- :label="item.label"--> :label="item.label"
<!-- :value="item.value"--> :value="item.value"
<!-- />--> />
<!-- </el-select>--> </el-select>
<!-- </template>--> </template>
<!-- </el-table-column>--> </el-table-column>
<el-table-column prop="state" label="状态" align="center" min-width="86"> <el-table-column prop="state" label="状态" align="center" min-width="86">
<template #default="scope"> <template #default="scope">
<div class="switch"> <div class="switch">
@@ -160,19 +160,19 @@
@change="changeWindData(scope.row)"></el-input> @change="changeWindData(scope.row)"></el-input>
</template> </template>
</el-table-column> </el-table-column>
<!-- <el-table-column prop="serialNumber" label="序列号" align="center" width="500">--> <el-table-column prop="serialNumber" label="序列号" align="center" width="500">
<!-- <template #default="scope">--> <template #default="scope">
<!-- <el-select placeholder="请选择" v-model="scope.row.serialNumber" popper-class="serialNumber-select"--> <el-select placeholder="请选择" v-model="scope.row.serialNumber" popper-class="serialNumber-select"
<!-- @change="changeWindData(scope.row)" class="serialNumber">--> @change="changeWindData(scope.row)" class="serialNumber">
<!-- <el-option--> <el-option
<!-- v-for="item in serialNumberOptions"--> v-for="item in serialNumberOptions"
<!-- :key="item.value"--> :key="item.value"
<!-- :label="item.label"--> :label="item.label"
<!-- :value="item.value"--> :value="item.value"
<!-- />--> />
<!-- </el-select>--> </el-select>
<!-- </template>--> </template>
<!-- </el-table-column>--> </el-table-column>
<el-table-column prop="state" label="状态" align="center"> <el-table-column prop="state" label="状态" align="center">
<template #default="scope"> <template #default="scope">
<div class="switch wind-switch"> <div class="switch wind-switch">
@@ -244,19 +244,19 @@
@change="changeOtherData(scope.row)"></el-input> @change="changeOtherData(scope.row)"></el-input>
</template> </template>
</el-table-column> </el-table-column>
<!-- <el-table-column prop="serialNumber" label="序列号" align="center" width="500">--> <el-table-column prop="serialNumber" label="序列号" align="center" width="500">
<!-- <template #default="scope">--> <template #default="scope">
<!-- <el-select placeholder="请选择" v-model="scope.row.serialNumber" popper-class="serialNumber-select"--> <el-select placeholder="请选择" v-model="scope.row.serialNumber" popper-class="serialNumber-select"
<!-- @change="changeOtherData(scope.row)" clearable class="serialNumber">--> @change="changeOtherData(scope.row)" clearable class="serialNumber">
<!-- <el-option--> <el-option
<!-- v-for="item in serialNumberOptions"--> v-for="item in serialNumberOptions"
<!-- :key="item.value"--> :key="item.value"
<!-- :label="item.label"--> :label="item.label"
<!-- :value="item.value"--> :value="item.value"
<!-- />--> />
<!-- </el-select>--> </el-select>
<!-- </template>--> </template>
<!-- </el-table-column>--> </el-table-column>
<el-table-column prop="state" label="状态" align="center"> <el-table-column prop="state" label="状态" align="center">
<template #default="scope"> <template #default="scope">
<div class="switch wind-switch"> <div class="switch wind-switch">
@@ -630,7 +630,7 @@ getList()
.device-box { .device-box {
display: flex; display: flex;
width: 2680px; width: 2800px;
height: 1600px; height: 1600px;
background: #064B66; background: #064B66;
border-radius: 20px; border-radius: 20px;

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

@@ -19,15 +19,21 @@
<el-form-item label="隧道简称"> <el-form-item label="隧道简称">
<el-input v-model="form.tunnelAlias" placeholder="请输入隧道简称"/> <el-input v-model="form.tunnelAlias" placeholder="请输入隧道简称"/>
</el-form-item> </el-form-item>
<el-form-item label="序列号前缀" prop="serialNumberPrefix"> <!-- <el-form-item label="序列号前缀" prop="serialNumberPrefix">-->
<el-input v-model="form.serialNumberPrefix" placeholder="请输入序列号前缀"/> <!-- <el-input v-model="form.serialNumberPrefix" placeholder="请输入序列号前缀"/>-->
</el-form-item> <!-- </el-form-item>-->
<el-form-item label="序列号" prop="serialNumberOne"> <!-- <el-form-item label="PLC序列号" prop="serialNumber">-->
<el-input v-model="form.serialNumberOne" placeholder="请输入序列号"/> <!-- <el-input v-model="form.serialNumber" placeholder="请输入PLC序列号"/>-->
</el-form-item> <!-- </el-form-item>-->
<el-form-item label="序列号1" prop="serialNumber"> <!-- <div style="display: flex;flex-direction: column">-->
<el-input v-model="form.serialNumber" placeholder="请输入序列号1"/> <!-- <div v-for="(item,index) in form.serialNumberList" :key="index" >-->
</el-form-item> <!-- <el-form-item :label="'序列号'+(index+2)">-->
<!-- <div style="flex: 1;display: flex;">-->
<!-- <el-input v-model="item.serialNumberOne" :placeholder="'请输入序列号'+(index+2)" />-->
<!-- </div>-->
<!-- </el-form-item>-->
<!-- </div>-->
<!-- </div>-->
<el-form-item label="隧道长度"> <el-form-item label="隧道长度">
<el-input type="number" v-model="form.totalLength" placeholder="请输入隧道长度"/> <el-input type="number" v-model="form.totalLength" placeholder="请输入隧道长度"/>
</el-form-item> </el-form-item>
@@ -103,6 +109,7 @@ const form = ref({
dropFrequency: '', dropFrequency: '',
isDefault: false, isDefault: false,
remarks: "", remarks: "",
serialNumberList:[]
}); });
const getTunnel = () => { const getTunnel = () => {
const loading = ElLoading.service({ const loading = ElLoading.service({
@@ -113,6 +120,7 @@ const getTunnel = () => {
}) })
getTunnelDetail(tunnelId).then((res) => { getTunnelDetail(tunnelId).then((res) => {
if (res?.code === 1000) { if (res?.code === 1000) {
res.data.serialNumberList= res.data.serialNumberList?.map(item=>({serialNumberOne:item}))
form.value = res.data; form.value = res.data;
} }
loading.close() loading.close()
@@ -136,9 +144,12 @@ const getTunnelInfo = () => {
if (modelEquipmentList.value === null) { if (modelEquipmentList.value === null) {
modelEquipmentList.value = [] modelEquipmentList.value = []
} }
let serialNumberList=form.value.serialNumberList.map(item=>item.serialNumberOne)
const data = { const data = {
tunnelId: tunnelId, tunnelId: tunnelId,
...form.value, ...form.value,
serialNumberList:serialNumberList,
tunnelLength: form.value.totalLength, tunnelLength: form.value.totalLength,
modelEquipmentList: modelEquipmentList.value, modelEquipmentList: modelEquipmentList.value,
}; };

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

@@ -8,16 +8,16 @@
<div class="site-name"> <div class="site-name">
{{ siteName }} {{ siteName }}
</div> </div>
<!-- <div class="model-change">--> <!-- <div class="model-change">-->
<!-- <div class="model" @click="clickModel=1;showNull=false">--> <!-- <div class="model" @click="clickModel=1;showNull=false">-->
<!-- <div class="card-bg"></div>--> <!-- <div class="card-bg"></div>-->
<!-- <span>卡片模式</span>--> <!-- <span>卡片模式</span>-->
<!-- </div>--> <!-- </div>-->
<!-- <div class="model" @click="clickModel=2;getSiteImg()">--> <!-- <div class="model" @click="clickModel=2;getSiteImg()">-->
<!-- <div class="img-bg"></div>--> <!-- <div class="img-bg"></div>-->
<!-- <span>图纸导航</span>--> <!-- <span>图纸导航</span>-->
<!-- </div>--> <!-- </div>-->
<!-- </div>--> <!-- </div>-->
<tunnel-title/> <tunnel-title/>
<div class="all-del-btn" v-if="showOperation"> <div class="all-del-btn" v-if="showOperation">
<div class="all-btn" style=" margin-right: 40px;" v-if="!showAddIcon" @click="handleAdd"> <div class="all-btn" style=" margin-right: 40px;" v-if="!showAddIcon" @click="handleAdd">
@@ -78,8 +78,8 @@
</div> </div>
<div class="img-box" v-else> <div class="img-box" v-else>
<!-- @/assets/images/tunnel/img.png--> <!-- @/assets/images/tunnel/img.png-->
<!-- <img :src="'data:image/png;base64,'+siteImage" style="width:3500px;height:1789px" id="imgModel" usemap="#image"--> <!-- <img :src="'data:image/png;base64,'+siteImage" style="width:3500px;height:1789px" id="imgModel" usemap="#image"-->
<!-- alt="" @click="clickHandler">--> <!-- alt="" @click="clickHandler">-->
<map name="image" id="image"> <map name="image" id="image">
<area shape="poly" v-for="(item,index) in coordsList" :coords="item.coords" :key="index" alt="" <area shape="poly" v-for="(item,index) in coordsList" :coords="item.coords" :key="index" alt=""
:title="item.tunnelId+'隧道'" :href="'/' + item.tunnelId + '/' + siteId" @click="clickHot(item.tunnelId)"> :title="item.tunnelId+'隧道'" :href="'/' + item.tunnelId + '/' + siteId" @click="clickHot(item.tunnelId)">
@@ -100,13 +100,24 @@
<!-- <el-form-item label="序列号前缀" prop="serialNumberPrefix">--> <!-- <el-form-item label="序列号前缀" prop="serialNumberPrefix">-->
<!-- <el-input v-model="form.serialNumberPrefix" placeholder="请输入序列号前缀"/>--> <!-- <el-input v-model="form.serialNumberPrefix" placeholder="请输入序列号前缀"/>-->
<!-- </el-form-item>--> <!-- </el-form-item>-->
<!-- <el-form-item label="序列号1" prop="serialNumber">--> <!-- <el-form-item label="PLC序列号" prop="serialNumber">-->
<!-- <el-input v-model="form.serialNumber" placeholder="请输入序列号1"/>--> <!-- <el-input v-model="form.serialNumber" placeholder="请输入PLC序列号"/>-->
<!-- </el-form-item>--> <!-- </el-form-item>-->
<!-- <el-form-item label="序列号2" prop="serialNumberOne">--> <!-- <div style="display: flex;flex-direction: column">-->
<!-- <el-input v-model="form.serialNumberOne" placeholder="请输入序列号2"/>--> <!-- <div v-for="(item,index) in serialNumberList" :key="index" >-->
<!-- </el-form-item>--> <!-- <el-form-item :label="'序列号'+(index+2)">-->
<!-- <div style="flex: 1;display: flex;">-->
<!-- <el-input v-model="item.serialNumberOne" :placeholder="'请输入序列号'+(index+2)" />-->
<!-- <el-icon size="74" color="#08B7B8" style="margin-left: 20px;cursor: pointer" @click="addSerialNumber" v-if="index===0">-->
<!-- <CirclePlus/>-->
<!-- </el-icon>-->
<!-- <el-icon v-else size="74" color="#08B7B8" style="margin-left: 20px;cursor: pointer" @click="delSerialNumber(index)" >-->
<!-- <Remove/>-->
<!-- </el-icon>-->
<!-- </div>-->
<!-- </el-form-item>-->
<!-- </div>-->
<!-- </div>-->
<el-form-item label="隧道长度" prop="totalLength"> <el-form-item label="隧道长度" prop="totalLength">
<el-input type="number" v-model="form.totalLength" placeholder="请输入隧道长度"/> <el-input type="number" v-model="form.totalLength" placeholder="请输入隧道长度"/>
</el-form-item> </el-form-item>
@@ -175,17 +186,20 @@ import {getTunnelList, addTunnel, deleteTunnel} from "@/api/tunnelManage";
import {getSiteDrawing, getSiteDetail} from "@/api/site"; import {getSiteDrawing, getSiteDetail} from "@/api/site";
import TunnelTitle from "@/components/tunnelTitle/index.vue"; import TunnelTitle from "@/components/tunnelTitle/index.vue";
import {getTunnelBySiteId} from "@/api/largeScreen"; import {getTunnelBySiteId} from "@/api/largeScreen";
import { debounce } from 'lodash' import {debounce} from 'lodash'
const serialNumberList = ref([
{
serialNumberOne: ''
}
])
const validateNumber = (rule, value) => { const validateNumber = (rule, value) => {
const reg = /^[A-Za-z0-9]+$/; const reg = /^[A-Za-z0-9]+$/;
return reg.test(value); return reg.test(value);
} }
const validateSerialNumberPrefix = (rule, value) => { const validateSerialNumberPrefix = (rule, value) => {
return value.length > 13 && value.slice(0,-2) == form.value.serialNumberPrefix; return value.length > 13 && value.slice(0, -2) == form.value.serialNumberPrefix;
}
const validateSerialNumberOnePrefix = (rule, value) => {
return value.length > 13 && value.slice(0,-2) == form.value.serialNumberPrefix;
} }
const router = useRouter() const router = useRouter()
const siteImage = ref() const siteImage = ref()
@@ -200,12 +214,12 @@ const formRules = ref({
serialNumberPrefix: [ serialNumberPrefix: [
{required: true, message: '请输入序列号前缀', trigger: ['blur', 'change']}, {required: true, message: '请输入序列号前缀', trigger: ['blur', 'change']},
{validator: validateNumber, message: '请输入英文、数字、英文数字组合的序列号前缀', trigger: ['blur', 'change']}, {validator: validateNumber, message: '请输入英文、数字、英文数字组合的序列号前缀', trigger: ['blur', 'change']},
{ min:14,max:14,message: '隧道序列号前缀长度为14位',trigger: ['blur', 'change'] }, {min: 14, max: 14, message: '隧道序列号前缀长度为14位', trigger: ['blur', 'change']},
], ],
serialNumber: [ serialNumber: [
{required: true, message: '请输入序列号1', trigger: ['blur', 'change']}, {required: true, message: '请输入PLC序列号', trigger: ['blur', 'change']},
{validator: validateNumber, message: '请输入英文、数字、英文数字组合的序列号1', trigger: ['blur', 'change']}, {validator: validateNumber, message: '请输入英文、数字、英文数字组合的PLC序列号', trigger: ['blur', 'change']},
{ min:16,max:16,message: '隧道序列号1长度为16位',trigger: ['blur', 'change']}, {min: 16, max: 16, message: '隧道PLC序列号长度为16位', trigger: ['blur', 'change']},
// {validator: validateSerialNumberPrefix, message: '同一隧道的序列号前缀需相同', trigger: ['blur', 'change']} // {validator: validateSerialNumberPrefix, message: '同一隧道的序列号前缀需相同', trigger: ['blur', 'change']}
], ],
serialNumberOne: [ serialNumberOne: [
@@ -319,11 +333,19 @@ const total = ref(10);
onMounted(() => { onMounted(() => {
showOperation.value = localStorage.getItem('roleKey') !== 'tunnel_admin'; showOperation.value = localStorage.getItem('roleKey') !== 'tunnel_admin';
}) })
const addSerialNumber = () => {
serialNumberList.value.push({
serialNumberOne: ''
})
}
const delSerialNumber = (index) => {
serialNumberList.value.splice(index, 1)
}
const getSiteImg = () => { const getSiteImg = () => {
showNull.value=false showNull.value = false
getSiteDrawing(siteId).then((res) => { getSiteDrawing(siteId).then((res) => {
if (res.code === 1000) { if (res.code === 1000) {
if(res.data.drawingData===null){ if (res.data.drawingData === null) {
// ElMessageBox.confirm('暂无图纸, 是否前往站点管理上传图纸?', '系统提示', { // ElMessageBox.confirm('暂无图纸, 是否前往站点管理上传图纸?', '系统提示', {
// confirmButtonText: '确定', // confirmButtonText: '确定',
// cancelButtonText: '取消', // cancelButtonText: '取消',
@@ -331,10 +353,10 @@ const getSiteImg = () => {
// }).then(() => { // }).then(() => {
// router.push('/site/' + userId + '/' + localStorage.getItem('currentSiteId')) // router.push('/site/' + userId + '/' + localStorage.getItem('currentSiteId'))
// }).catch(()=>{ // }).catch(()=>{
showNull.value=true showNull.value = true
// }) // })
}else{ } else {
showNull.value=false showNull.value = false
siteImage.value = res.data.drawingData siteImage.value = res.data.drawingData
} }
} }
@@ -405,12 +427,14 @@ const handleCurrentChange = (val) => {
getList() getList()
} }
const handleSubmit = debounce((instance) => { const handleSubmit = debounce((instance) => {
let serialNumberListParam=serialNumberList.value.map(item=>item.serialNumberOne)
if (!instance) return if (!instance) return
instance.validate(async (valid) => { instance.validate(async (valid) => {
if (!valid) return if (!valid) return
const data = { const data = {
siteId: siteId, siteId: siteId,
...form.value ...form.value,
serialNumberList:serialNumberListParam
} }
addTunnel(data).then(res => { addTunnel(data).then(res => {
if (res.code === 1000) { if (res.code === 1000) {
@@ -422,7 +446,7 @@ const handleSubmit = debounce((instance) => {
} }
}) })
}) })
},100) }, 100)
//预览隧道 //预览隧道
const handlePreview = (id) => { const handlePreview = (id) => {
console.log('预览') console.log('预览')
@@ -459,7 +483,7 @@ const handleChooseAll = debounce(() => {
}) })
} }
}) })
},100) }, 100)
const handleEditDevice = (tunnelId) => { const handleEditDevice = (tunnelId) => {
if (type === 'bySite') { if (type === 'bySite') {
router.push('/device/' + tunnelId + '/bySite/' + userId) router.push('/device/' + tunnelId + '/bySite/' + userId)
@@ -533,16 +557,17 @@ const handleMoreDelete = debounce(() => {
}) })
}) })
} }
},100) }, 100)
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.showNull{ .showNull {
margin-top: 150px; margin-top: 150px;
font-size: 60px; font-size: 60px;
color: #05FEFF; color: #05FEFF;
} }
:deep(.el-form-item__error) { :deep(.el-form-item__error) {
font-size: 35px; font-size: 35px;
} }

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

@@ -565,8 +565,8 @@ const nextBtn = () => {
const initWebSocket = () => { const initWebSocket = () => {
// let wsUrl = `ws://192.168.31.176:9000/websocket/equipment/${token}/${serialNumber.value}` // let wsUrl = `ws://192.168.31.176:9000/websocket/equipment/${token}/${serialNumber.value}`
// let wsUrl = `ws://web-tunnel.feashow.com/api/wstunnel/websocket/equipment/${token}/${serialNumber.value}`; let wsUrl = `ws://web-tunnel.feashow.com/api/wstunnel/websocket/equipment/${token}/${serialNumber.value}`;
let wsUrl = import.meta.env.VITE_BASE_WSURL+`/${token}/${serialNumber.value}`; // let wsUrl = import.meta.env.VITE_BASE_WSURL+`/${token}/${serialNumber.value}`;
// let wsUrl = `ws://clay.frp.feashow.cn/wstunnel/websocket/equipment/${token}/${serialNumber.value}`; // let wsUrl = `ws://clay.frp.feashow.cn/wstunnel/websocket/equipment/${token}/${serialNumber.value}`;
socket = new WebSocket(wsUrl); socket = new WebSocket(wsUrl);
//连接发生错误的回调方法 //连接发生错误的回调方法