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

This commit is contained in:
Vladislav Ostapov 2024-11-14 09:48:57 +03:00
parent 484a6abe08
commit 6467333846

View File

@ -426,14 +426,14 @@
<div class="settings-set-container">
<label>
<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>
</div>
<template>
<div v-for="classesGroup in ['rt1', 'rt2', 'rt3', 'cd']">
<h3>Классы {{ classesGroup.toUpperCase() }}</h3>
<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>
<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>
@ -531,11 +531,11 @@
<div class="settings-set-container">
<label>
<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>
<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>
</div>
<button class="action-button" @click="settingsSubmitTcpAccel()">Применить <span class="submit-spinner" v-show="submitStatus.tcpAccel"></span></button>
@ -935,7 +935,6 @@
modemSn: '?',
macManagement: '?',
macData: '?',
}
},
qos: {
@ -950,6 +949,7 @@
en: false,
maxConnections: 128
},
},
testState: false,
initState: '',
@ -1177,16 +1177,16 @@
return res
}
let query = {
"en": this.qos.en,
"en": this.param.qos.en,
"rt1": [],
"rt2": [],
"rt3": [],
"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.qos.rt2.length; i++) { query.rt2.push(_translateQosClass('rt', this.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.qos.cd.length; i++) { query.cd.push(_translateQosClass('rt', this.qos.cd[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.param.qos.rt2.length; i++) { query.rt2.push(_translateQosClass('rt', this.param.qos.rt2[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.param.qos.cd.length; i++) { query.cd.push(_translateQosClass('rt', this.param.qos.cd[i])) }
console.log(query)
fetch('/api/set/qos', {
@ -1360,14 +1360,14 @@
updateQosSettings(vals) {
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"]
if (qosProfile !== null && qosProfile !== undefined) {
this.qos.rt1 = [] // .splice(0, this.qos.rt1.length)
this.qos.rt2 = [] // .splice(0, this.qos.rt2.length)
this.qos.rt3 = [] // .splice(0, this.qos.rt3.length)
this.qos.cd = [] // .splice(0, this.qos.cd.length)
this.param.qos.rt1 = [] // .splice(0, this.param.qos.rt1.length)
this.param.qos.rt2 = [] // .splice(0, this.param.qos.rt2.length)
this.param.qos.rt3 = [] // .splice(0, this.param.qos.rt3.length)
this.param.qos.cd = [] // .splice(0, this.param.qos.cd.length)
for (let trafficClass in qosProfile) {
if (['rt1', 'rt2', 'rt3', 'cd'].indexOf(trafficClass) < 0) {
@ -1402,10 +1402,10 @@
})
}
switch (trafficClass) {
case 'rt1': this.qos.rt1.push(result); break
case 'rt2': this.qos.rt2.push(result); break
case 'rt3': this.qos.rt3.push(result); break
case 'cd': this.qos.cd.push(result); break
case 'rt1': this.param.qos.rt1.push(result); break
case 'rt2': this.param.qos.rt2.push(result); break
case 'rt3': this.param.qos.rt3.push(result); break
case 'cd': this.param.qos.cd.push(result); break
}
}
}
@ -1448,7 +1448,6 @@
this.param.firmware.macData = vals["settings"]["firmware.macData"]
},
// addQosClass()
qosAddClass(name) {
let res = {
isEnabled: true,
@ -1458,10 +1457,10 @@
filters: []
}
switch (name) {
case 'rt1': this.qos.rt1.push(res); break
case 'rt2': this.qos.rt2.push(res); break
case 'rt3': this.qos.rt3.push(res); break
case 'cd': this.qos.cd.push(res); break
case 'rt1': this.param.qos.rt1.push(res); break
case 'rt2': this.param.qos.rt2.push(res); break
case 'rt3': this.param.qos.rt3.push(res); break
case 'cd': this.param.qos.cd.push(res); break
}
},
@ -1477,28 +1476,28 @@
dscp: ""
}
switch (name) {
case 'rt1': this.qos.rt1[index].filters.push(rule); break
case 'rt2': this.qos.rt2[index].filters.push(rule); break
case 'rt3': this.qos.rt3[index].filters.push(rule); break
case 'cd': this.qos.cd[index].filters.push(rule); break
case 'rt1': this.param.qos.rt1[index].filters.push(rule); break
case 'rt2': this.param.qos.rt2[index].filters.push(rule); break
case 'rt3': this.param.qos.rt3[index].filters.push(rule); break
case 'cd': this.param.qos.cd[index].filters.push(rule); break
}
},
qosDelClass(name, index) {
switch (name) {
case 'rt1': this.qos.rt1.splice(index, 1); break
case 'rt2': this.qos.rt2.splice(index, 1); break
case 'rt3': this.qos.rt3.splice(index, 1); break
case 'cd': this.qos.cd.splice(index, 1); break
case 'rt1': this.param.qos.rt1.splice(index, 1); break
case 'rt2': this.param.qos.rt2.splice(index, 1); break
case 'rt3': this.param.qos.rt3.splice(index, 1); break
case 'cd': this.param.qos.cd.splice(index, 1); break
}
},
qosDelFilter(name, index, filterIndex) {
switch (name) {
case 'rt1': this.qos.rt1[index].filters.splice(filterIndex, 1); break
case 'rt2': this.qos.rt2[index].filters.splice(filterIndex, 1); break
case 'rt3': this.qos.rt3[index].filters.splice(filterIndex, 1); break
case 'cd': this.qos.cd[index].filters.splice(filterIndex, 1); break
case 'rt1': this.param.qos.rt1[index].filters.splice(filterIndex, 1); break
case 'rt2': this.param.qos.rt2[index].filters.splice(filterIndex, 1); break
case 'rt3': this.param.qos.rt3[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")
}
})
// import MyComponent from './modules/header'
// const sh = new Vue(MyComponent)
</script>
</body>
</html>