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

Merge pull request 'dev' (#364) from dev into master

Browse Source 
Reviewed-on: http://git.feashow.cn/clay/tunnel-cloud-web/pulls/364
This commit is contained in:
odjbin
2024-08-17 07:34:40 +00:00
parent 11b3c82e22 ea01ca3f79
commit 9217ce35da
9 changed files with 138 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
.env.development
View File

@@ -3,4 +3,5 @@
VITE_BASE_URL='/api' VITE_BASE_URL='/api'
# VITE_BASE_URL='http://192.168.101.7:8000' # VITE_BASE_URL='http://192.168.101.7:8000'
VITE_BASE_WSURL='ws://web-tunnel.feashow.com/api' #VITE_BASE_WSURL='ws://web-tunnel.feashow.com/api'
VITE_BASE_WSURL='/websocket'

3
.env.production
View File

@@ -4,4 +4,5 @@ VITE_TITLE='fateverse'
VITE_BASE_URL='/api' VITE_BASE_URL='/api'
VITE_BASE_WSURL='ws://web-tunnel.feashow.com/api' #VITE_BASE_WSURL='ws://web-tunnel.feashow.com/api'
VITE_BASE_WSURL='/websocket'

2
Dockerfile
View File

@@ -1,4 +1,4 @@
FROM nginx FROM 10.7.127.190:38080/nginx:latest
RUN rm -rf /etc/nginx/conf.d/default.conf RUN rm -rf /etc/nginx/conf.d/default.conf
RUN rm -rf /etc/nginx/nginx.conf RUN rm -rf /etc/nginx/nginx.conf

5
src/views/debug/index.vue
View File

@@ -74,8 +74,9 @@ const handleSend = () => {
dataList.value.push(data) dataList.value.push(data)
} }
const initWebSocket = () => { const initWebSocket = () => {
// let wsUrl = `ws://192.168.31.175:9000/websocket/debug/${token}/${serialNumber.value}` // let wsUrl = `ws://192.168.31.176:9000/websocket/debug/${token}/${serialNumber.value}`
let wsUrl = `ws://web-tunnel.feashow.com/api/wstunnel/websocket/debug/${token}/${serialNumber.value}` let wsUrl = import.meta.env.VITE_BASE_WSURL+`/${token}/${serialNumber.value}`;
// let wsUrl = `ws://web-tunnel.feashow.com/api/wstunnel/websocket/debug/${token}/${serialNumber.value}`
console.log(wsUrl) console.log(wsUrl)
socket = new WebSocket(wsUrl) socket = new WebSocket(wsUrl)
//连接发生错误的回调方法 //连接发生错误的回调方法

105
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">
@@ -532,9 +532,28 @@ getList()
width: 450px!important; width: 450px!important;
} }
} }
.el-table__cell{ .el-select.serialNumber {
border-radius: 6px!important;
border: 1px solid #05FEFF!important;
background-color: transparent!important;
.el-select__wrapper{
height: 54px!important;
color: #FFFFFF!important;
font-size: 40px!important;
//height: auto!important;
line-height: normal!important;
border-radius: 6px!important;
border: 1px solid #05FEFF!important;
background-color: transparent!important;
}
.el-select__placeholder {
height: 54px;
line-height: 54px;
color: #FFFFFF;
}
} }
.serialNumber-select.el-popper { .serialNumber-select.el-popper {
background: #064B66 !important; background: #064B66 !important;
border: 2px solid #05FEFF !important; border: 2px solid #05FEFF !important;
@@ -542,7 +561,9 @@ getList()
.el-select-dropdown { .el-select-dropdown {
min-width: 130px !important; min-width: 130px !important;
} }
.el-select-dropdown__item.is-hovering{
background-color: #064B66 !important;
}
.el-select-dropdown__item { .el-select-dropdown__item {
color: #FFFFFF; color: #FFFFFF;
border-bottom: 1px solid #05FEFF; border-bottom: 1px solid #05FEFF;

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

@@ -12,15 +12,21 @@
</div> </div>
</div> </div>
<div class="edit-box"> <div class="edit-box">
<el-form :model="form" :label-position="right" label-width="188px"> <el-form :model="form" :label-position="right" label-width="230px">
<el-form-item label="隧道名称"> <el-form-item label="隧道名称">
<el-input v-model="form.tunnelName" placeholder="请输入隧道名称"/> <el-input v-model="form.tunnelName" placeholder="请输入隧道名称"/>
</el-form-item> </el-form-item>
<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="序列号"> <el-form-item label="序列号前缀" prop="serialNumberPrefix">
<el-input v-model="form.serialNumber" placeholder="请输入序列号"/> <el-input v-model="form.serialNumberPrefix" placeholder="请输入序列号前缀"/>
</el-form-item>
<el-form-item label="序列号" prop="serialNumberOne">
<el-input v-model="form.serialNumberOne" placeholder="请输入序列号"/>
</el-form-item>
<el-form-item label="序列号1" prop="serialNumber">
<el-input v-model="form.serialNumber" placeholder="请输入序列号1"/>
</el-form-item> </el-form-item>
<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="请输入隧道长度"/>
@@ -86,7 +92,9 @@ const type = reactive(router.currentRoute.value.params.type);
const modelEquipmentList = ref(null) const modelEquipmentList = ref(null)
const form = ref({ const form = ref({
tunnelName: "", tunnelName: "",
serialNumber: "", serialNumberPrefix: '',
serialNumberOne: '',
serialNumber: '',
totalLength: "", totalLength: "",
referenceFrequency: '', referenceFrequency: '',
upTime: '', upTime: '',

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

@@ -90,16 +90,23 @@
<div class="siteId"> <div class="siteId">
<span>{{ title }}</span> <span>{{ title }}</span>
</div> </div>
<el-form :model="form" :label-position="right" label-width="188px" :rules="formRules" ref="formInstance"> <el-form :model="form" :label-position="right" label-width="230px" :rules="formRules" ref="formInstance">
<el-form-item label="隧道名称" prop="tunnelName"> <el-form-item label="隧道名称" prop="tunnelName">
<el-input v-model="form.tunnelName" placeholder="请输入隧道名称"/> <el-input v-model="form.tunnelName" placeholder="请输入隧道名称"/>
</el-form-item> </el-form-item>
<el-form-item label="隧道简称" prop="tunnelAlias"> <el-form-item label="隧道简称" prop="tunnelAlias">
<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="serialNumber"> <!-- <el-form-item label="序列号前缀" prop="serialNumberPrefix">-->
<el-input v-model="form.serialNumber" placeholder="请输入序列号"/> <!-- <el-input v-model="form.serialNumberPrefix" placeholder="请输入序列号前缀"/>-->
</el-form-item> <!-- </el-form-item>-->
<!-- <el-form-item label="序列号1" prop="serialNumber">-->
<!-- <el-input v-model="form.serialNumber" placeholder="请输入序列号1"/>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="序列号2" prop="serialNumberOne">-->
<!-- <el-input v-model="form.serialNumberOne" placeholder="请输入序列号2"/>-->
<!-- </el-form-item>-->
<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>
@@ -174,6 +181,12 @@ 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) => {
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()
const showAddIcon = ref(true) const showAddIcon = ref(true)
@@ -184,9 +197,22 @@ const type = reactive(params.type)
const formRules = ref({ const formRules = ref({
tunnelName: [{required: true, message: '请输入隧道名称', trigger: ['blur', 'change']}], tunnelName: [{required: true, message: '请输入隧道名称', trigger: ['blur', 'change']}],
tunnelAlias: [{required: true, message: '请输入隧道简称', trigger: ['blur', 'change']}], tunnelAlias: [{required: true, message: '请输入隧道简称', trigger: ['blur', 'change']}],
serialNumberPrefix: [
{required: true, message: '请输入序列号前缀', trigger: ['blur', 'change']},
{validator: validateNumber, message: '请输入英文、数字、英文数字组合的序列号前缀', trigger: ['blur', 'change']},
{ min:14,max:14,message: '隧道序列号前缀长度为14位',trigger: ['blur', 'change'] },
],
serialNumber: [ serialNumber: [
{required: true, message: '请输入序列号', trigger: ['blur', 'change']}, {required: true, message: '请输入序列号1', trigger: ['blur', 'change']},
{validator: validateNumber, message: '请输入英文、数字、英文数字组合的用户名', trigger: ['blur', 'change']} {validator: validateNumber, message: '请输入英文、数字、英文数字组合的序列号1', trigger: ['blur', 'change']},
{ min:16,max:16,message: '隧道序列号1长度为16位',trigger: ['blur', 'change']},
// {validator: validateSerialNumberPrefix, message: '同一隧道的序列号前缀需相同', trigger: ['blur', 'change']}
],
serialNumberOne: [
// {required: true, message: '请输入序列号2', trigger: ['blur', 'change']},
// {validator: validateNumber, message: '请输入英文、数字、英文数字组合的序列号2', trigger: ['blur', 'change']},
// { min:16,max:16,message: '隧道序列号2长度为16位',trigger: ['blur', 'change']},
// {validator: validateSerialNumberOnePrefix, message: '同一隧道的序列号前缀需相同', trigger: ['blur', 'change']}
], ],
totalLength: [{required: true, message: '请输入隧道长度', trigger: ['blur', 'change']}], totalLength: [{required: true, message: '请输入隧道长度', trigger: ['blur', 'change']}],
constructionLength: [{required: true, message: '请输入施工长度', trigger: ['blur', 'change']}], constructionLength: [{required: true, message: '请输入施工长度', trigger: ['blur', 'change']}],
@@ -272,6 +298,8 @@ const siteName = ref(localStorage.getItem('site'))
const form = ref({ const form = ref({
tunnelName: '', tunnelName: '',
tunnelAlias: '', tunnelAlias: '',
serialNumberPrefix: '',
serialNumberOne: '',
serialNumber: '', serialNumber: '',
totalLength: '', totalLength: '',
referenceFrequency: '', referenceFrequency: '',

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

@@ -435,7 +435,8 @@ const getScreenInfo = (id) => {
initSceneData(id).then((res) => { initSceneData(id).then((res) => {
tunnelLength.value = res.data.tunnelLength tunnelLength.value = res.data.tunnelLength
constructionLength.value = res.data.constructionLength constructionLength.value = res.data.constructionLength
serialNumber.value = res.data.serialNumber // serialNumber.value = res.data.serialNumber.slice(0, -2)
serialNumber.value = res.data.serialNumberPrefix
initWebSocket(); initWebSocket();
}) })
} }
@@ -563,8 +564,10 @@ const nextBtn = () => {
}; };
const initWebSocket = () => { const initWebSocket = () => {
// let wsUrl = `ws://192.168.31.175: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 = `ws://clay.frp.feashow.cn/wstunnel/websocket/equipment/${token}/${serialNumber.value}`;
socket = new WebSocket(wsUrl); socket = new WebSocket(wsUrl);
//连接发生错误的回调方法 //连接发生错误的回调方法
socket.onerror = function () { socket.onerror = function () {
@@ -576,7 +579,7 @@ const initWebSocket = () => {
}; };
//接收到消息的回调方法 //接收到消息的回调方法
socket.onmessage = function (event) { socket.onmessage = function (event) {
// console.log("服务器返回的信息: ", JSON.parse(event.data)); console.log("服务器返回的信息: ", JSON.parse(event.data));
const type = JSON.parse(event.data).type; const type = JSON.parse(event.data).type;
const data = JSON.parse(event.data).data; const data = JSON.parse(event.data).data;
if (type === "equipment") { if (type === "equipment") {

18
vite.config.js
View File

@@ -58,9 +58,12 @@ export default defineConfig({
strictPort: false, strictPort: false,
open: true, open: true,
proxy: { proxy: {
// '/api/tunnel': { // // '/api/tunnel': {
// // target: 'http://gateway.feashow.cn', // '/tunnel': {
// target: 'http://192.168.31.175:8000', //
// // // target: 'http://gateway.feashow.cn',
// target: 'http://frp.feashow.cn:31800/',
// // target: 'http://clay.frp.feashow.cn',
// changeOrigin: true, // changeOrigin: true,
// rewrite: (path) => path.replace(/^\/api/, ''), // rewrite: (path) => path.replace(/^\/api/, ''),
// }, // },
@@ -72,13 +75,20 @@ export default defineConfig({
// }, // },
'/api': { '/api': {
target: 'http://web-tunnel.feashow.com/api', target: 'http://web-tunnel.feashow.com/api',
// target: 'http://192.168.31.175:8000',
changeOrigin: true, changeOrigin: true,
rewrite: (path) => path.replace(/^\/api/, ''), rewrite: (path) => path.replace(/^\/api/, ''),
}, },
'/socket': { '/socket': {
target: 'ws://web-tunnel.feashow.com/api/notice-ws/notice', target: 'ws://web-tunnel.feashow.com/api/notice-ws/notice',
ws: true ws: true
},
'/websocket': {
target: 'ws://web-tunnel.feashow.com/api/wstunnel/websocket/equipment',
// target: 'ws://192.168.31.176:9000/websocket/debug',
changeOrigin: true,
ws: true,
rewrite: (path) => path.replace(/^\/websocket/, '')
} }
} }
} }