Outbound modal

This commit is contained in:
Alireza Ahmadi
2024-05-09 23:27:08 +02:00
parent 9a02e6593c
commit 43d1aecec7
45 changed files with 2391 additions and 308 deletions
+128
View File
@@ -0,0 +1,128 @@
<template>
<v-card :subtitle="$t('in.multiplex')">
<v-row>
<v-col cols="12" sm="6" md="4">
<v-switch color="primary" label="Enable Multiplex" v-model="muxEnable" hide-details></v-switch>
</v-col>
<template v-if="mux.enabled">
<template v-if="direction=='out'">
<v-col cols="12" sm="6" md="4">
<v-select
hide-details
:items="[ 'smux', 'yamux', 'h2mux']"
label="Protocol"
clearable
@click:clear="mux.protocol=undefined"
v-model="mux.protocol">
</v-select>
</v-col>
<v-col cols="12" sm="6" md="4">
<v-text-field
label="Max Connections"
hide-details
type="number"
min=0
v-model.number="max_connections">
</v-text-field>
</v-col>
<v-col cols="12" sm="6" md="4">
<v-text-field
label="Min Streams"
hide-details
type="number"
min=0
v-model.number="min_streams">
</v-text-field>
</v-col>
<v-col cols="12" sm="6" md="4">
<v-text-field
label="Max Streams"
hide-details
type="number"
:min="min_streams"
v-model.number="max_streams">
</v-text-field>
</v-col>
</template>
<v-col cols="12" sm="6" md="4">
<v-switch color="primary" label="Reject Non-Padded" v-model="mux.padding" hide-details></v-switch>
</v-col>
<v-col cols="12" sm="6" md="4">
<v-switch color="primary" label="Enable Brutal" v-model="burtalEnable" hide-details></v-switch>
</v-col>
</template>
</v-row>
<v-row v-if="mux.brutal?.enabled">
<v-col cols="12" sm="6" md="4">
<v-text-field
label="Uplink Bandwidth"
hide-details
type="number"
suffix="Mbps"
v-model.number="up_mbps">
</v-text-field>
</v-col>
<v-col cols="12" sm="6" md="4">
<v-text-field
label="Downlink Bandwidth"
hide-details
type="number"
suffix="Mbps"
min="0"
v-model.number="down_mbps">
</v-text-field>
</v-col>
</v-row>
</v-card>
</template>
<script lang="ts">
import { oMultiplex } from '@/types/multiplex'
export default {
props: ['data', 'direction'],
data() {
return {}
},
computed: {
mux(): oMultiplex {
return <oMultiplex> this.$props.data.multiplex
},
muxEnable: {
get(): boolean { return this.mux ? this.mux.enabled : false },
set(newValue:boolean) { this.$props.data.multiplex = newValue ? { enabled: newValue } : {} }
},
max_connections: {
get(): number { return this.mux.max_connections ? this.mux.max_connections : 0 },
set(newValue:number) { this.mux.max_connections = newValue > 0 ? newValue : undefined }
},
min_streams: {
get(): number { return this.mux.min_streams ? this.mux.min_streams : 0 },
set(newValue:number) { this.mux.min_streams = newValue > 0 ? newValue : undefined }
},
max_streams: {
get(): number { return this.mux.max_streams ? this.mux.max_streams : 0 },
set(newValue:number) { this.mux.max_streams = newValue > 0 ? newValue : undefined }
},
burtalEnable: {
get(): boolean { return this.mux.brutal ? this.mux.brutal.enabled : false },
set(newValue:boolean) { this.mux.brutal = newValue ? { enabled: newValue, up_mbps: 100, down_mbps: 100 } : undefined }
},
down_mbps: {
get() { return this.mux.brutal && this.mux.brutal.down_mbps ? this.mux.brutal.down_mbps : 0 },
set(newValue:any) {
if (this.mux.brutal){
this.mux.brutal.down_mbps = newValue.length != 0 ? newValue : 0
}
}
},
up_mbps: {
get() { return this.mux.brutal && this.mux.brutal.up_mbps ? this.mux.brutal.up_mbps : 0 },
set(newValue:any) {
if (this.mux.brutal){
this.mux.brutal.up_mbps = newValue.length != 0 ? newValue : 0
}
}
},
}
}
</script>