Commit aeffaaa8189911bcf8244ff55553d61c8e776f6b

Authored by fengtao
1 parent f69b0e80

pref:优化LWM2M表单

@@ -7,7 +7,7 @@ @@ -7,7 +7,7 @@
7 import { BasicForm, useForm } from '/@/components/Form'; 7 import { BasicForm, useForm } from '/@/components/Form';
8 import { serverSchemas } from '../index'; 8 import { serverSchemas } from '../index';
9 9
10 - const [registerServer, { getFieldsValue, setFieldsValue }] = useForm({ 10 + const [registerServer, { getFieldsValue, setFieldsValue, resetFields }] = useForm({
11 labelWidth: 180, 11 labelWidth: 180,
12 schemas: serverSchemas, 12 schemas: serverSchemas,
13 actionColOptions: { 13 actionColOptions: {
@@ -24,9 +24,11 @@ @@ -24,9 +24,11 @@
24 if (!value) return; 24 if (!value) return;
25 return value; 25 return value;
26 }; 26 };
  27 + const resetFormData = () => resetFields();
27 defineExpose({ 28 defineExpose({
28 getBootStrapFormFunc, 29 getBootStrapFormFunc,
29 editBootStrapFormFunc, 30 editBootStrapFormFunc,
  31 + resetFormData,
30 }); 32 });
31 </script> 33 </script>
32 <style lang="less" scoped></style> 34 <style lang="less" scoped></style>
@@ -312,6 +312,7 @@ export const serverSchemas: FormSchema[] = [ @@ -312,6 +312,7 @@ export const serverSchemas: FormSchema[] = [
312 field: 'shortServerId', 312 field: 'shortServerId',
313 component: 'InputNumber', 313 component: 'InputNumber',
314 label: '短服务器ID', 314 label: '短服务器ID',
  315 + helpMessage: ['短服务器ID是唯一的'],
315 required: true, 316 required: true,
316 defaultValue: 123, 317 defaultValue: 123,
317 colProps: { span: 8 }, 318 colProps: { span: 8 },
@@ -320,6 +321,7 @@ export const serverSchemas: FormSchema[] = [ @@ -320,6 +321,7 @@ export const serverSchemas: FormSchema[] = [
320 field: 'host', 321 field: 'host',
321 component: 'Input', 322 component: 'Input',
322 label: '主机', 323 label: '主机',
  324 + helpMessage: ['主机是唯一的'],
323 required: true, 325 required: true,
324 defaultValue: '0.0.0.0', 326 defaultValue: '0.0.0.0',
325 colProps: { span: 8 }, 327 colProps: { span: 8 },
@@ -328,9 +330,13 @@ export const serverSchemas: FormSchema[] = [ @@ -328,9 +330,13 @@ export const serverSchemas: FormSchema[] = [
328 field: 'port', 330 field: 'port',
329 component: 'Input', 331 component: 'Input',
330 label: '端口', 332 label: '端口',
  333 + helpMessage: ['端口必须是5685'],
331 required: true, 334 required: true,
332 defaultValue: 5685, 335 defaultValue: 5685,
333 colProps: { span: 8 }, 336 colProps: { span: 8 },
  337 + componentProps: {
  338 + disabled: true,
  339 + },
334 }, 340 },
335 { 341 {
336 field: 'clientHoldOffTime', 342 field: 'clientHoldOffTime',
1 <template> 1 <template>
2 <div> 2 <div>
3 - <Tabs  
4 - v-model:activeKey="currentKey"  
5 - :size="currentSize"  
6 - :animated="true"  
7 - @change="handleChange"  
8 - > 3 + <Tabs v-model:activeKey="currentKey" :size="currentSize" :animated="true">
9 <TabPane forceRender key="1" tab="LWM2M Model"> 4 <TabPane forceRender key="1" tab="LWM2M Model">
10 <BasicForm :showResetButton="false" :showSubmitButton="false" @register="registerModel" /> 5 <BasicForm :showResetButton="false" :showSubmitButton="false" @register="registerModel" />
11 </TabPane> 6 </TabPane>
@@ -108,7 +103,6 @@ @@ -108,7 +103,6 @@
108 const currentSize = ref('large'); 103 const currentSize = ref('large');
109 let allObj: any = reactive({}); 104 let allObj: any = reactive({});
110 let allEchoObj: any = reactive({}); 105 let allEchoObj: any = reactive({});
111 - let allEchoStatus = ref(false);  
112 let clientLwM2mSettingsObj = reactive({}); 106 let clientLwM2mSettingsObj = reactive({});
113 let observeAttrObj = reactive({ 107 let observeAttrObj = reactive({
114 attribute: [], 108 attribute: [],
@@ -166,49 +160,21 @@ @@ -166,49 +160,21 @@
166 const handleRemove = (index) => { 160 const handleRemove = (index) => {
167 dynamicBOOTSTRAP.bootstrap.splice(index, 1); 161 dynamicBOOTSTRAP.bootstrap.splice(index, 1);
168 }; 162 };
169 - const handleChange = (e) => {  
170 - if (allEchoStatus.value) {  
171 - switch (e) {  
172 - case '1':  
173 - break;  
174 - case '2':  
175 - nextTick(() => {  
176 - bootstrapServerUpdateEnable.value = allEchoObj.bootstrapServerUpdateEnable;  
177 - dynamicBOOTSTRAP.bootstrap = allEchoObj.bootstrap;  
178 - dynamicBOOTSTRAP.bootstrap.forEach((bootstrap, index: number) => {  
179 - nextTick(() => {  
180 - unref(dynamicBindRef.BootStrapFormItemRef)[index]?.editBootStrapFormFunc(bootstrap);  
181 - });  
182 - });  
183 - });  
184 - break;  
185 - case '3':  
186 - nextTick(() => {  
187 - settingsSetFieldsValueFunc({  
188 - powerMode: allEchoObj?.clientLwM2mSettings?.powerMode,  
189 - psmActivityTimer: allEchoObj?.clientLwM2mSettings?.psmActivityTimer,  
190 - edrxCycle: allEchoObj?.clientLwM2mSettings?.edrxCycle,  
191 - pagingTransmissionWindow: allEchoObj?.clientLwM2mSettings?.pagingTransmissionWindow,  
192 - fwUpdateStrategy: allEchoObj?.clientLwM2mSettings?.fwUpdateStrategy,  
193 - swUpdateStrategy: allEchoObj?.clientLwM2mSettings?.swUpdateStrategy,  
194 - clientOnlyObserveAfterConnect:  
195 - allEchoObj?.clientLwM2mSettings?.clientOnlyObserveAfterConnect,  
196 - fwUpdateResource: allEchoObj?.clientLwM2mSettings?.fwUpdateResource,  
197 - swUpdateResource: allEchoObj?.clientLwM2mSettings?.swUpdateResource,  
198 - compositeOperationsSupport:  
199 - allEchoObj?.clientLwM2mSettings?.compositeOperationsSupport,  
200 - });  
201 - });  
202 - break;  
203 - case '4':  
204 - break;  
205 - }  
206 - }  
207 - };  
208 const setFormData = (v) => { 163 const setFormData = (v) => {
209 if (v) { 164 if (v) {
210 allEchoObj = v; 165 allEchoObj = v;
211 - allEchoStatus.value = true; 166 + settingsSetFieldsValueFunc({
  167 + ...allEchoObj?.clientLwM2mSettings,
  168 + });
  169 + nextTick(() => {
  170 + bootstrapServerUpdateEnable.value = allEchoObj.bootstrapServerUpdateEnable;
  171 + dynamicBOOTSTRAP.bootstrap = allEchoObj.bootstrap;
  172 + dynamicBOOTSTRAP.bootstrap.forEach((bootstrap, index: number) => {
  173 + nextTick(() => {
  174 + unref(dynamicBindRef.BootStrapFormItemRef)[index]?.editBootStrapFormFunc(bootstrap);
  175 + });
  176 + });
  177 + });
212 } 178 }
213 }; 179 };
214 const tempBootStrap: any = []; 180 const tempBootStrap: any = [];
@@ -249,11 +215,13 @@ @@ -249,11 +215,13 @@
249 }; 215 };
250 216
251 const resetFormData = () => { 217 const resetFormData = () => {
252 - allEchoStatus.value = false;  
253 nextTick(() => { 218 nextTick(() => {
254 resetObjectListValue(); 219 resetObjectListValue();
255 resetSettingsValue(); 220 resetSettingsValue();
256 resetDeviceValue(); 221 resetDeviceValue();
  222 + unref(dynamicBindRef.BootStrapFormItemRef).map((item) => {
  223 + item.resetFormData();
  224 + });
257 }); 225 });
258 }; 226 };
259 const selectCheckStatus = ref(false); 227 const selectCheckStatus = ref(false);
@@ -290,7 +258,6 @@ @@ -290,7 +258,6 @@
290 registerDevice, 258 registerDevice,
291 getFormData, 259 getFormData,
292 setFormData, 260 setFormData,
293 - handleChange,  
294 resetFormData, 261 resetFormData,
295 dynamicBOOTSTRAP, 262 dynamicBOOTSTRAP,
296 dynamicBindRef, 263 dynamicBindRef,