VladislavOstapov/terminal-web-server
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

рефактор параметров QoS и tcp-акселерации

Browse Source
This commit is contained in:
Vladislav Ostapov 2024-11-14 09:48:57 +03:00
parent 484a6abe08
commit 6467333846
1 changed files with 46 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

74
static/main.html
View File

@ -426,14 +426,14 @@
<div class="settings-set-container"> <div class="settings-set-container">
<label> <label>
<span>Активировать QoS</span> <span>Активировать QoS</span>
<span class="toggle-input"><input type="checkbox" v-model="qos.en" /><span class="slider"></span></span> <span class="toggle-input"><input type="checkbox" v-model="param.qos.en" /><span class="slider"></span></span>
</label> </label>
</div> </div>
<template> <template>
<div v-for="classesGroup in ['rt1', 'rt2', 'rt3', 'cd']"> <div v-for="classesGroup in ['rt1', 'rt2', 'rt3', 'cd']">
<h3>Классы {{ classesGroup.toUpperCase() }}</h3> <h3>Классы {{ classesGroup.toUpperCase() }}</h3>
<button class="action-button" @click="qosAddClass(classesGroup)">Добавить класс {{ classesGroup.toUpperCase() }}</button> <button class="action-button" @click="qosAddClass(classesGroup)">Добавить класс {{ classesGroup.toUpperCase() }}</button>
<details v-for="(qosClass, index) in qos[classesGroup]" :key="index" class="settings-set-container"> <details v-for="(qosClass, index) in param.qos[classesGroup]" :key="index" class="settings-set-container">
<summary> <summary>
<span v-if="classesGroup === 'cd'">#{{ index }} CIR={{ qosClass.cir }}кбит, PIR={{ qosClass.pir }}кбит {{ qosClass.description }}</span> <span v-if="classesGroup === 'cd'">#{{ index }} CIR={{ qosClass.cir }}кбит, PIR={{ qosClass.pir }}кбит {{ qosClass.description }}</span>
<span v-if="classesGroup !== 'cd'">#{{ index }} CBR={{ qosClass.cir }}кбит {{ qosClass.description }}</span> <span v-if="classesGroup !== 'cd'">#{{ index }} CBR={{ qosClass.cir }}кбит {{ qosClass.description }}</span>
@ -531,11 +531,11 @@
<div class="settings-set-container"> <div class="settings-set-container">
<label> <label>
<span>Активировать акселерацию</span> <span>Активировать акселерацию</span>
<span class="toggle-input"><input type="checkbox" v-model="tcpAccel.en" /><span class="slider"></span></span> <span class="toggle-input"><input type="checkbox" v-model="param.tcpAccel.en" /><span class="slider"></span></span>
</label> </label>
<label> <label>
<span>Максимальное количество соединений</span> <span>Максимальное количество соединений</span>
<input type="number" v-model="tcpAccel.maxConnections" min="1" max="10000" /> <input type="number" v-model="param.tcpAccel.maxConnections" min="1" max="10000" />
</label> </label>
</div> </div>
<button class="action-button" @click="settingsSubmitTcpAccel()">Применить <span class="submit-spinner" v-show="submitStatus.tcpAccel"></span></button> <button class="action-button" @click="settingsSubmitTcpAccel()">Применить <span class="submit-spinner" v-show="submitStatus.tcpAccel"></span></button>
@ -935,7 +935,6 @@
modemSn: '?', modemSn: '?',
macManagement: '?', macManagement: '?',
macData: '?', macData: '?',
}
}, },
qos: { qos: {
@ -950,6 +949,7 @@
en: false, en: false,
maxConnections: 128 maxConnections: 128
}, },
},
testState: false, testState: false,
initState: '', initState: '',
@ -1177,16 +1177,16 @@
return res return res
} }
let query = { let query = {
"en": this.qos.en, "en": this.param.qos.en,
"rt1": [], "rt1": [],
"rt2": [], "rt2": [],
"rt3": [], "rt3": [],
"cd": [] "cd": []
} }
for (let i = 0; i < this.qos.rt1.length; i++) { query.rt1.push(_translateQosClass('rt', this.qos.rt1[i])) } for (let i = 0; i < this.param.qos.rt1.length; i++) { query.rt1.push(_translateQosClass('rt', this.param.qos.rt1[i])) }
for (let i = 0; i < this.qos.rt2.length; i++) { query.rt2.push(_translateQosClass('rt', this.qos.rt2[i])) } for (let i = 0; i < this.param.qos.rt2.length; i++) { query.rt2.push(_translateQosClass('rt', this.param.qos.rt2[i])) }
for (let i = 0; i < this.qos.rt3.length; i++) { query.rt3.push(_translateQosClass('rt', this.qos.rt3[i])) } for (let i = 0; i < this.param.qos.rt3.length; i++) { query.rt3.push(_translateQosClass('rt', this.param.qos.rt3[i])) }
for (let i = 0; i < this.qos.cd.length; i++) { query.cd.push(_translateQosClass('rt', this.qos.cd[i])) } for (let i = 0; i < this.param.qos.cd.length; i++) { query.cd.push(_translateQosClass('rt', this.param.qos.cd[i])) }
console.log(query) console.log(query)
fetch('/api/set/qos', { fetch('/api/set/qos', {
@ -1360,14 +1360,14 @@
updateQosSettings(vals) { updateQosSettings(vals) {
this.submitStatus.qos = false this.submitStatus.qos = false
this.qos.en = vals["settings"]["qos.enabled"] this.param.qos.en = vals["settings"]["qos.enabled"]
const qosProfile = vals["settings"]["qos.profile"] const qosProfile = vals["settings"]["qos.profile"]
if (qosProfile !== null && qosProfile !== undefined) { if (qosProfile !== null && qosProfile !== undefined) {
this.qos.rt1 = [] // .splice(0, this.qos.rt1.length) this.param.qos.rt1 = [] // .splice(0, this.param.qos.rt1.length)
this.qos.rt2 = [] // .splice(0, this.qos.rt2.length) this.param.qos.rt2 = [] // .splice(0, this.param.qos.rt2.length)
this.qos.rt3 = [] // .splice(0, this.qos.rt3.length) this.param.qos.rt3 = [] // .splice(0, this.param.qos.rt3.length)
this.qos.cd = [] // .splice(0, this.qos.cd.length) this.param.qos.cd = [] // .splice(0, this.param.qos.cd.length)
for (let trafficClass in qosProfile) { for (let trafficClass in qosProfile) {
if (['rt1', 'rt2', 'rt3', 'cd'].indexOf(trafficClass) < 0) { if (['rt1', 'rt2', 'rt3', 'cd'].indexOf(trafficClass) < 0) {
@ -1402,10 +1402,10 @@
}) })
} }
switch (trafficClass) { switch (trafficClass) {
case 'rt1': this.qos.rt1.push(result); break case 'rt1': this.param.qos.rt1.push(result); break
case 'rt2': this.qos.rt2.push(result); break case 'rt2': this.param.qos.rt2.push(result); break
case 'rt3': this.qos.rt3.push(result); break case 'rt3': this.param.qos.rt3.push(result); break
case 'cd': this.qos.cd.push(result); break case 'cd': this.param.qos.cd.push(result); break
} }
} }
} }
@ -1448,7 +1448,6 @@
this.param.firmware.macData = vals["settings"]["firmware.macData"] this.param.firmware.macData = vals["settings"]["firmware.macData"]
}, },
// addQosClass()
qosAddClass(name) { qosAddClass(name) {
let res = { let res = {
isEnabled: true, isEnabled: true,
@ -1458,10 +1457,10 @@
filters: [] filters: []
} }
switch (name) { switch (name) {
case 'rt1': this.qos.rt1.push(res); break case 'rt1': this.param.qos.rt1.push(res); break
case 'rt2': this.qos.rt2.push(res); break case 'rt2': this.param.qos.rt2.push(res); break
case 'rt3': this.qos.rt3.push(res); break case 'rt3': this.param.qos.rt3.push(res); break
case 'cd': this.qos.cd.push(res); break case 'cd': this.param.qos.cd.push(res); break
} }
}, },
@ -1477,28 +1476,28 @@
dscp: "" dscp: ""
} }
switch (name) { switch (name) {
case 'rt1': this.qos.rt1[index].filters.push(rule); break case 'rt1': this.param.qos.rt1[index].filters.push(rule); break
case 'rt2': this.qos.rt2[index].filters.push(rule); break case 'rt2': this.param.qos.rt2[index].filters.push(rule); break
case 'rt3': this.qos.rt3[index].filters.push(rule); break case 'rt3': this.param.qos.rt3[index].filters.push(rule); break
case 'cd': this.qos.cd[index].filters.push(rule); break case 'cd': this.param.qos.cd[index].filters.push(rule); break
} }
}, },
qosDelClass(name, index) { qosDelClass(name, index) {
switch (name) { switch (name) {
case 'rt1': this.qos.rt1.splice(index, 1); break case 'rt1': this.param.qos.rt1.splice(index, 1); break
case 'rt2': this.qos.rt2.splice(index, 1); break case 'rt2': this.param.qos.rt2.splice(index, 1); break
case 'rt3': this.qos.rt3.splice(index, 1); break case 'rt3': this.param.qos.rt3.splice(index, 1); break
case 'cd': this.qos.cd.splice(index, 1); break case 'cd': this.param.qos.cd.splice(index, 1); break
} }
}, },
qosDelFilter(name, index, filterIndex) { qosDelFilter(name, index, filterIndex) {
switch (name) { switch (name) {
case 'rt1': this.qos.rt1[index].filters.splice(filterIndex, 1); break case 'rt1': this.param.qos.rt1[index].filters.splice(filterIndex, 1); break
case 'rt2': this.qos.rt2[index].filters.splice(filterIndex, 1); break case 'rt2': this.param.qos.rt2[index].filters.splice(filterIndex, 1); break
case 'rt3': this.qos.rt3[index].filters.splice(filterIndex, 1); break case 'rt3': this.param.qos.rt3[index].filters.splice(filterIndex, 1); break
case 'cd': this.qos.cd[index].filters.splice(filterIndex, 1); break case 'cd': this.param.qos.cd[index].filters.splice(filterIndex, 1); break
} }
}, },
@ -1564,9 +1563,6 @@
document.getElementById("app").removeAttribute("hidden") document.getElementById("app").removeAttribute("hidden")
} }
}) })
// import MyComponent from './modules/header'
// const sh = new Vue(MyComponent)
</script> </script>
</body> </body>
</html> </html>