fix: 无法修改网络配置表单值

This commit is contained in:
Caulic
2025-01-22 01:10:08 +08:00
parent fa13a56697
commit e44e8423d0
6 changed files with 73 additions and 71 deletions

View File

@@ -149,8 +149,10 @@
</t-select> </t-select>
</t-form-item> </t-form-item>
<div> <div>
<component :is="resolveDynamicComponent(getComponent(newTab.type as ComponentKey))" <component
:config="newTab.data" /> :is="resolveDynamicComponent(getComponent(newTab.type as ComponentKey))"
:config="newTab"
/>
</div> </div>
</t-form> </t-form>
</div> </div>

View File

@@ -2,22 +2,22 @@
<div> <div>
<t-form labelAlign="left"> <t-form labelAlign="left">
<t-form-item label="启用"> <t-form-item label="启用">
<t-switch v-model="config.enable" /> <t-switch v-model="props.config.data.enable" />
</t-form-item> </t-form-item>
<t-form-item label="URL"> <t-form-item label="URL">
<t-input v-model="config.url" /> <t-input v-model="props.config.data.url" />
</t-form-item> </t-form-item>
<t-form-item label="消息格式"> <t-form-item label="消息格式">
<t-select v-model="config.messagePostFormat" :options="messageFormatOptions" /> <t-select v-model="props.config.data.messagePostFormat" :options="messageFormatOptions" />
</t-form-item> </t-form-item>
<t-form-item label="报告自身消息"> <t-form-item label="报告自身消息">
<t-switch v-model="config.reportSelfMessage" /> <t-switch v-model="props.config.data.reportSelfMessage" />
</t-form-item> </t-form-item>
<t-form-item label="Token"> <t-form-item label="Token">
<t-input v-model="config.token" /> <t-input v-model="props.config.data.token" />
</t-form-item> </t-form-item>
<t-form-item label="调试模式"> <t-form-item label="调试模式">
<t-switch v-model="config.debug" /> <t-switch v-model="props.config.data.debug" />
</t-form-item> </t-form-item>
</t-form> </t-form>
</div> </div>
@@ -34,14 +34,14 @@ const defaultConfig: HttpClientConfig = {
messagePostFormat: 'array', messagePostFormat: 'array',
reportSelfMessage: false, reportSelfMessage: false,
token: '', token: '',
debug: false debug: false,
}; };
const props = defineProps<{ const props = defineProps<{
config: HttpClientConfig; config: { data: HttpClientConfig };
}>(); }>();
const config = ref(Object.assign({}, defaultConfig, props.config)); props.config.data = { ...defaultConfig, ...props.config.data };
const messageFormatOptions = ref([ const messageFormatOptions = ref([
{ label: 'Array', value: 'array' }, { label: 'Array', value: 'array' },
@@ -49,10 +49,10 @@ const messageFormatOptions = ref([
]); ]);
watch( watch(
() => config.value.messagePostFormat, () => props.config.data.messagePostFormat,
(newValue) => { (newValue) => {
if (newValue !== 'array' && newValue !== 'string') { if (newValue !== 'array' && newValue !== 'string') {
config.value.messagePostFormat = 'array'; props.config.data.messagePostFormat = 'array';
} }
} }
); );

View File

@@ -2,28 +2,28 @@
<div> <div>
<t-form labelAlign="left"> <t-form labelAlign="left">
<t-form-item label="启用"> <t-form-item label="启用">
<t-switch v-model="config.enable" /> <t-switch v-model="props.config.data.enable" />
</t-form-item> </t-form-item>
<t-form-item label="端口"> <t-form-item label="端口">
<t-input v-model.number="config.port" type="number" /> <t-input v-model.number="props.config.data.port" type="number" />
</t-form-item> </t-form-item>
<t-form-item label="主机"> <t-form-item label="主机">
<t-input v-model="config.host" type="text" /> <t-input v-model="props.config.data.host" type="text" />
</t-form-item> </t-form-item>
<t-form-item label="启用 CORS"> <t-form-item label="启用 CORS">
<t-switch v-model="config.enableCors" /> <t-switch v-model="props.config.data.enableCors" />
</t-form-item> </t-form-item>
<t-form-item label="启用 WS"> <t-form-item label="启用 WS">
<t-switch v-model="config.enableWebsocket" /> <t-switch v-model="props.config.data.enableWebsocket" />
</t-form-item> </t-form-item>
<t-form-item label="消息格式"> <t-form-item label="消息格式">
<t-select v-model="config.messagePostFormat" :options="messageFormatOptions" /> <t-select v-model="props.config.data.messagePostFormat" :options="messageFormatOptions" />
</t-form-item> </t-form-item>
<t-form-item label="Token"> <t-form-item label="Token">
<t-input v-model="config.token" type="text" /> <t-input v-model="props.config.data.token" type="text" />
</t-form-item> </t-form-item>
<t-form-item label="调试模式"> <t-form-item label="调试模式">
<t-switch v-model="config.debug" /> <t-switch v-model="props.config.data.debug" />
</t-form-item> </t-form-item>
</t-form> </t-form>
</div> </div>
@@ -42,14 +42,14 @@ const defaultConfig: HttpServerConfig = {
enableWebsocket: true, enableWebsocket: true,
messagePostFormat: 'array', messagePostFormat: 'array',
token: '', token: '',
debug: false debug: false,
}; };
const props = defineProps<{ const props = defineProps<{
config: HttpServerConfig; config: { data: HttpServerConfig };
}>(); }>();
const config = ref(Object.assign({}, defaultConfig, props.config)); props.config.data = { ...defaultConfig, ...props.config.data };
const messageFormatOptions = ref([ const messageFormatOptions = ref([
{ label: 'Array', value: 'array' }, { label: 'Array', value: 'array' },
@@ -57,10 +57,10 @@ const messageFormatOptions = ref([
]); ]);
watch( watch(
() => config.value.messagePostFormat, () => props.config.data.messagePostFormat,
(newValue) => { (newValue) => {
if (newValue !== 'array' && newValue !== 'string') { if (newValue !== 'array' && newValue !== 'string') {
config.value.messagePostFormat = 'array'; props.config.data.messagePostFormat = 'array';
} }
} }
); );

View File

@@ -2,31 +2,31 @@
<div> <div>
<t-form labelAlign="left"> <t-form labelAlign="left">
<t-form-item label="启用"> <t-form-item label="启用">
<t-switch v-model="config.enable" /> <t-switch v-model="props.config.data.enable" />
</t-form-item> </t-form-item>
<t-form-item label="端口"> <t-form-item label="端口">
<t-input v-model.number="config.port" type="number" /> <t-input v-model.number="props.config.data.port" type="number" />
</t-form-item> </t-form-item>
<t-form-item label="主机"> <t-form-item label="主机">
<t-input v-model="config.host" type="text" /> <t-input v-model="props.config.data.host" type="text" />
</t-form-item> </t-form-item>
<t-form-item label="报告自身消息"> <t-form-item label="报告自身消息">
<t-switch v-model="config.reportSelfMessage" /> <t-switch v-model="props.config.data.reportSelfMessage" />
</t-form-item> </t-form-item>
<t-form-item label="启用 CORS"> <t-form-item label="启用 CORS">
<t-switch v-model="config.enableCors" /> <t-switch v-model="props.config.data.enableCors" />
</t-form-item> </t-form-item>
<t-form-item label="启用 WS"> <t-form-item label="启用 WS">
<t-switch v-model="config.enableWebsocket" /> <t-switch v-model="props.config.data.enableWebsocket" />
</t-form-item> </t-form-item>
<t-form-item label="消息格式"> <t-form-item label="消息格式">
<t-select v-model="config.messagePostFormat" :options="messageFormatOptions" /> <t-select v-model="props.config.data.messagePostFormat" :options="messageFormatOptions" />
</t-form-item> </t-form-item>
<t-form-item label="Token"> <t-form-item label="Token">
<t-input v-model="config.token" type="text" /> <t-input v-model="props.config.data.token" type="text" />
</t-form-item> </t-form-item>
<t-form-item label="调试模式"> <t-form-item label="调试模式">
<t-switch v-model="config.debug" /> <t-switch v-model="props.config.data.debug" />
</t-form-item> </t-form-item>
</t-form> </t-form>
</div> </div>
@@ -46,14 +46,14 @@ const defaultConfig: HttpSseServerConfig = {
messagePostFormat: 'array', messagePostFormat: 'array',
token: '', token: '',
debug: false, debug: false,
reportSelfMessage: false reportSelfMessage: false,
}; };
const props = defineProps<{ const props = defineProps<{
config: HttpSseServerConfig; config: { data: HttpSseServerConfig };
}>(); }>();
const config = ref(Object.assign({}, defaultConfig, props.config)); props.config.data = { ...defaultConfig, ...props.config.data };
const messageFormatOptions = ref([ const messageFormatOptions = ref([
{ label: 'Array', value: 'array' }, { label: 'Array', value: 'array' },
@@ -61,10 +61,10 @@ const messageFormatOptions = ref([
]); ]);
watch( watch(
() => config.value.messagePostFormat, () => props.config.data.messagePostFormat,
(newValue) => { (newValue) => {
if (newValue !== 'array' && newValue !== 'string') { if (newValue !== 'array' && newValue !== 'string') {
config.value.messagePostFormat = 'array'; props.config.data.messagePostFormat = 'array';
} }
} }
); );

View File

@@ -2,25 +2,25 @@
<div> <div>
<t-form labelAlign="left"> <t-form labelAlign="left">
<t-form-item label="启用"> <t-form-item label="启用">
<t-switch v-model="config.enable" /> <t-switch v-model="props.config.data.enable" />
</t-form-item> </t-form-item>
<t-form-item label="URL"> <t-form-item label="URL">
<t-input v-model="config.url" /> <t-input v-model="props.config.data.url" />
</t-form-item> </t-form-item>
<t-form-item label="消息格式"> <t-form-item label="消息格式">
<t-select v-model="config.messagePostFormat" :options="messageFormatOptions" /> <t-select v-model="props.config.data.messagePostFormat" :options="messageFormatOptions" />
</t-form-item> </t-form-item>
<t-form-item label="报告自身消息"> <t-form-item label="报告自身消息">
<t-switch v-model="config.reportSelfMessage" /> <t-switch v-model="props.config.data.reportSelfMessage" />
</t-form-item> </t-form-item>
<t-form-item label="Token"> <t-form-item label="Token">
<t-input v-model="config.token" /> <t-input v-model="props.config.data.token" />
</t-form-item> </t-form-item>
<t-form-item label="调试模式"> <t-form-item label="调试模式">
<t-switch v-model="config.debug" /> <t-switch v-model="props.config.data.debug" />
</t-form-item> </t-form-item>
<t-form-item label="心跳间隔"> <t-form-item label="心跳间隔">
<t-input v-model.number="config.heartInterval" type="number" /> <t-input v-model.number="props.config.data.heartInterval" type="number" />
</t-form-item> </t-form-item>
</t-form> </t-form>
</div> </div>
@@ -39,14 +39,14 @@ const defaultConfig: WebsocketClientConfig = {
reconnectInterval: 5000, reconnectInterval: 5000,
token: '', token: '',
debug: false, debug: false,
heartInterval: 30000 heartInterval: 30000,
}; };
const props = defineProps<{ const props = defineProps<{
config: WebsocketClientConfig; config: { data: WebsocketClientConfig };
}>(); }>();
const config = ref(Object.assign({}, defaultConfig, props.config)); props.config.data = { ...defaultConfig, ...props.config.data };
const messageFormatOptions = ref([ const messageFormatOptions = ref([
{ label: 'Array', value: 'array' }, { label: 'Array', value: 'array' },
@@ -54,10 +54,10 @@ const messageFormatOptions = ref([
]); ]);
watch( watch(
() => config.value.messagePostFormat, () => props.config.data.messagePostFormat,
(newValue) => { (newValue) => {
if (newValue !== 'array' && newValue !== 'string') { if (newValue !== 'array' && newValue !== 'string') {
config.value.messagePostFormat = 'array'; props.config.data.messagePostFormat = 'array';
} }
} }
); );

View File

@@ -2,31 +2,31 @@
<div> <div>
<t-form labelAlign="left"> <t-form labelAlign="left">
<t-form-item label="启用"> <t-form-item label="启用">
<t-switch v-model="config.enable" /> <t-switch v-model="props.config.data.enable" />
</t-form-item> </t-form-item>
<t-form-item label="主机"> <t-form-item label="主机">
<t-input v-model="config.host" /> <t-input v-model="props.config.data.host" />
</t-form-item> </t-form-item>
<t-form-item label="端口"> <t-form-item label="端口">
<t-input v-model.number="config.port" type="number" /> <t-input v-model.number="props.config.data.port" type="number" />
</t-form-item> </t-form-item>
<t-form-item label="消息格式"> <t-form-item label="消息格式">
<t-select v-model="config.messagePostFormat" :options="messageFormatOptions" /> <t-select v-model="props.config.data.messagePostFormat" :options="messageFormatOptions" />
</t-form-item> </t-form-item>
<t-form-item label="上报自身消息"> <t-form-item label="上报自身消息">
<t-switch v-model="config.reportSelfMessage" /> <t-switch v-model="props.config.data.reportSelfMessage" />
</t-form-item> </t-form-item>
<t-form-item label="Token"> <t-form-item label="Token">
<t-input v-model="config.token" /> <t-input v-model="props.config.data.token" />
</t-form-item> </t-form-item>
<t-form-item label="强制推送事件"> <t-form-item label="强制推送事件">
<t-switch v-model="config.enableForcePushEvent" /> <t-switch v-model="props.config.data.enableForcePushEvent" />
</t-form-item> </t-form-item>
<t-form-item label="调试模式"> <t-form-item label="调试模式">
<t-switch v-model="config.debug" /> <t-switch v-model="props.config.data.debug" />
</t-form-item> </t-form-item>
<t-form-item label="心跳间隔"> <t-form-item label="心跳间隔">
<t-input v-model.number="config.heartInterval" type="number" /> <t-input v-model.number="props.config.data.heartInterval" type="number" />
</t-form-item> </t-form-item>
</t-form> </t-form>
</div> </div>
@@ -46,14 +46,14 @@ const defaultConfig: WebsocketServerConfig = {
token: '', token: '',
enableForcePushEvent: true, enableForcePushEvent: true,
debug: false, debug: false,
heartInterval: 30000 heartInterval: 30000,
}; };
const props = defineProps<{ const props = defineProps<{
config: WebsocketServerConfig; config: { data: WebsocketServerConfig };
}>(); }>();
const config = ref(Object.assign({}, defaultConfig, props.config)); props.config.data = { ...defaultConfig, ...props.config.data };
const messageFormatOptions = ref([ const messageFormatOptions = ref([
{ label: 'Array', value: 'array' }, { label: 'Array', value: 'array' },
@@ -61,10 +61,10 @@ const messageFormatOptions = ref([
]); ]);
watch( watch(
() => config.value.messagePostFormat, () => props.config.data.messagePostFormat,
(newValue) => { (newValue) => {
if (newValue !== 'array' && newValue !== 'string') { if (newValue !== 'array' && newValue !== 'string') {
config.value.messagePostFormat = 'array'; props.config.data.messagePostFormat = 'array';
} }
} }
); );