高级设置修改端口号时提示当前实际的端口号

This commit is contained in:
fangxiang 2022-07-22 15:17:54 +08:00
parent f9316f01e7
commit 4a50f89a69
6 changed files with 130 additions and 47 deletions

View File

@ -132,50 +132,87 @@
</q-card-section> </q-card-section>
<q-card-section class="q-py-none q-my-none"> <q-card-section class="q-py-none q-my-none">
<q-card> <q-card>
<q-list> <q-form>
<q-item> <q-list class="q-pb-md">
<q-item-section avatar class="header_label"> <q-item>
{{ $t("http") }}{{ $t(" ") }}{{ $t("port") }}: <q-item-section avatar class="header_label">
</q-item-section> {{ $t("http") }}{{ $t(" ") }}{{ $t("port") }}:
<q-item-section> </q-item-section>
<q-input <q-item-section>
type="number" <q-input
v-model="http_port" type="number"
max="65535" v-model="http_port"
min="1" max="65535"
/> maxlength="5"
</q-item-section> min="0"
<q-item-section avatar> :rules="[
<q-btn (val) =>
:disable="old_http_port == http_port" (val != null &&
no-caps val != undefined &&
:label="$t('commit')" val.toString().length > 0) ||
@click="commitHttpPort" $t('Please type something'),
/> (val) =>
</q-item-section> (parseInt(val) >= 0 && parseInt(val) <= 65535) ||
</q-item> $t('the port number must be between 0 and 65535'),
<q-item> ]"
<q-item-section avatar class="header_label"> />
{{ $t("control") }}{{ $t(" ") }}{{ $t("port") }}: </q-item-section>
</q-item-section> <q-item-section>
<q-item-section> <q-item-label>
<q-input ({{ $t($t("current real")) }}{{ $t(" ") }}{{ $t("http")
type="number" }}{{ $t(" ") }}{{ $t("port") }}: {{ real_http_port }})
v-model="websocket_port" </q-item-label>
max="65535" </q-item-section>
min="1" <q-item-section avatar>
/> <q-btn
</q-item-section> :disable="old_http_port == http_port"
<q-item-section avatar> no-caps
<q-btn :label="$t('commit')"
:disable="old_websocket_port == websocket_port" @click="commitHttpPort"
no-caps />
:label="$t('commit')" </q-item-section>
@click="commitWebsocketPort" </q-item>
/> <q-item>
</q-item-section> <q-item-section avatar class="header_label">
</q-item> {{ $t("control") }}{{ $t(" ") }}{{ $t("port") }}:
</q-list> </q-item-section>
<q-item-section>
<q-input
maxlength="5"
type="number"
v-model="websocket_port"
max="65535"
min="0"
:rules="[
(val) =>
(val != null &&
val != undefined &&
val.toString().length > 0) ||
$t('Please type something'),
(val) =>
(parseInt(val) >= 0 && parseInt(val) <= 65535) ||
$t('the port number must be between 0 and 65535'),
]"
/>
</q-item-section>
<q-item-section>
<q-item-label>
({{ $t($t("current real")) }}{{ $t(" ")
}}{{ $t("control") }}{{ $t(" ") }}{{ $t("port") }}:
{{ real_websocket_port }})
</q-item-label>
</q-item-section>
<q-item-section avatar>
<q-btn
:disable="old_websocket_port == websocket_port"
no-caps
:label="$t('commit')"
@click="commitWebsocketPort"
/>
</q-item-section>
</q-item>
</q-list>
</q-form>
</q-card> </q-card>
</q-card-section> </q-card-section>
</q-card-section> </q-card-section>
@ -221,7 +258,7 @@
<style lang="sass"> <style lang="sass">
.advance-ip-table .advance-ip-table
/* height or max-height is important */ /* height or max-height is important */
max-height: 52vh max-height: 45vh
min-height: 30vh min-height: 30vh
.q-table__top, .q-table__top,
@ -248,6 +285,8 @@ import { useI18n } from "vue-i18n";
import GlobalData from "src/common/GlobalData"; import GlobalData from "src/common/GlobalData";
import AdvancedIpAddressDialog from "src/components/AdvancedIpAddressDialog.vue"; import AdvancedIpAddressDialog from "src/components/AdvancedIpAddressDialog.vue";
import { AdvancedIpAddressEntity } from "src/entities/AdvancedIpAddressEntity"; import { AdvancedIpAddressEntity } from "src/entities/AdvancedIpAddressEntity";
import { api } from "src/boot/axios";
import { HttpProtocol } from "src/entities/HttpProtocol";
export default defineComponent({ export default defineComponent({
name: "ComponentSystenSettingAdvancedNetworkDialog", name: "ComponentSystenSettingAdvancedNetworkDialog",
@ -266,8 +305,10 @@ export default defineComponent({
const old_http_port = ref(80); const old_http_port = ref(80);
const http_port = ref(80); const http_port = ref(80);
const real_http_port = ref(80);
const old_websocket_port = ref(GlobalData.kDefaultWebsocektPort); const old_websocket_port = ref(GlobalData.kDefaultWebsocektPort);
const websocket_port = ref(GlobalData.kDefaultWebsocektPort); const websocket_port = ref(GlobalData.kDefaultWebsocektPort);
const real_websocket_port = ref(80);
const advance_ip_columns = [ const advance_ip_columns = [
{ {
@ -325,8 +366,10 @@ export default defineComponent({
host_name, host_name,
http_port, http_port,
old_http_port, old_http_port,
real_http_port,
websocket_port, websocket_port,
old_websocket_port, old_websocket_port,
real_websocket_port,
loga(a: any) { loga(a: any) {
console.log(a); console.log(a);
}, },
@ -383,6 +426,35 @@ export default defineComponent({
old_websocket_port.value = GlobalData.kDefaultWebsocektPort; old_websocket_port.value = GlobalData.kDefaultWebsocektPort;
} }
} }
{
api
.get(HttpProtocol.RequestPathGetAllPort)
.then((response) => {
if (response && typeof response.data != "undefined") {
if (typeof response.data.http == "number") {
real_http_port.value = response.data.http;
} else if (typeof response.data.http == "string") {
const temp = parseInt(response.data.http);
if (!isNaN(temp) && temp != Infinity) {
real_http_port.value = temp;
}
}
if (typeof response.data.websocket == "number") {
real_websocket_port.value = response.data.websocket;
} else if (typeof response.data.websocket == "string") {
const temp = parseInt(response.data.websocket);
if (!isNaN(temp) && temp != Infinity) {
real_websocket_port.value = temp;
}
}
}
})
.catch((e) => {
console.log(e);
});
}
show_dialog.value = true; show_dialog.value = true;
}); });
}, },

View File

@ -6,6 +6,8 @@ export namespace HttpProtocol {
export const RequestPathListFile = "/list_file"; export const RequestPathListFile = "/list_file";
export const RequestPathCreateDirectory = "/create_directory"; export const RequestPathCreateDirectory = "/create_directory";
export const RequestPathCheckFileSupport = "/check_file_support"; export const RequestPathCheckFileSupport = "/check_file_support";
export const RequestPathGetWebscoketPort = "/get_websocket_port";
export const RequestPathGetAllPort = "/get_all_port";
export const RequestPathDeleteFile = "/delete_file"; export const RequestPathDeleteFile = "/delete_file";
export const RequestPathRenameFile = "/rename_file"; export const RequestPathRenameFile = "/rename_file";
export const RequestCheckModeIndex = "/check_mode_index"; export const RequestCheckModeIndex = "/check_mode_index";

View File

@ -320,4 +320,8 @@ export default {
"restart now": "Restart Now", "restart now": "Restart Now",
_SOFT_PAD_LOGIN_TITLE_: "LEDPLAYER", _SOFT_PAD_LOGIN_TITLE_: "LEDPLAYER",
welcome: "Welcome", welcome: "Welcome",
real: "Real",
"current real": "Current Real",
"the port number must be between 0 and 65535":
"The Port Number Must Be Between 0 And 65535",
}; };

View File

@ -606,4 +606,7 @@ export default {
port: "端口", port: "端口",
http: "Http", http: "Http",
"restart now": "现在重启", "restart now": "现在重启",
real: "实际",
"current real": "当前实际",
"the port number must be between 0 and 65535": "端口号只能在0~65535之间",
}; };

View File

@ -257,6 +257,7 @@ import { useStore } from "src/store";
import { Md5 } from "ts-md5/dist/md5"; import { Md5 } from "ts-md5/dist/md5";
import Initializer from "src/common/Initializer"; import Initializer from "src/common/Initializer";
import { api } from "src/boot/axios"; import { api } from "src/boot/axios";
import { HttpProtocol } from "src/entities/HttpProtocol";
class _Data { class _Data {
user_name: string | null = null; user_name: string | null = null;
@ -388,7 +389,7 @@ export default defineComponent({
try { try {
let global_data = GlobalData.getInstance(); let global_data = GlobalData.getInstance();
api api
.get("/get_websocket_port") .get(HttpProtocol.RequestPathGetWebscoketPort)
.then((response) => { .then((response) => {
let final_ws_port = GlobalData.kDefaultWebsocektPort; let final_ws_port = GlobalData.kDefaultWebsocektPort;
if (response && typeof response.data != "undefined") { if (response && typeof response.data != "undefined") {

View File

@ -204,6 +204,7 @@ import { useStore } from "src/store";
import { Md5 } from "ts-md5/dist/md5"; import { Md5 } from "ts-md5/dist/md5";
import Initializer from "src/common/Initializer"; import Initializer from "src/common/Initializer";
import { api } from "src/boot/axios"; import { api } from "src/boot/axios";
import { HttpProtocol } from "src/entities/HttpProtocol";
class _Data { class _Data {
user_name: string | null = null; user_name: string | null = null;
@ -319,7 +320,7 @@ export default defineComponent({
try { try {
let global_data = GlobalData.getInstance(); let global_data = GlobalData.getInstance();
api api
.get("/get_websocket_port") .get(HttpProtocol.RequestPathGetWebscoketPort)
.then((response) => { .then((response) => {
let final_ws_port = GlobalData.kDefaultWebsocektPort; let final_ws_port = GlobalData.kDefaultWebsocektPort;
if (response && typeof response.data != "undefined") { if (response && typeof response.data != "undefined") {