Commit 0de36dc037cfaadbb69d5c9ca6356a2091d2a29e
Merge branch 'dev-fix-ww' into 'main_dev'
fix(动态请求/公共接口): DEFECT-1269修复动态请求切换公共接口为清空表单 See merge request yunteng/thingskit-view!54
Showing
2 changed files
with
15 additions
and
9 deletions
src/views/chart/ContentConfigurations/components/ChartData/external/components/DynamicForm/index.vue
| @@ -4,7 +4,7 @@ import { FormItemInst, NDatePicker, NForm, NFormItem, NInput, NSelect, NTreeSele | @@ -4,7 +4,7 @@ import { FormItemInst, NDatePicker, NForm, NFormItem, NInput, NSelect, NTreeSele | ||
| 4 | import { computed, nextTick, ref, unref, watch } from 'vue'; | 4 | import { computed, nextTick, ref, unref, watch } from 'vue'; |
| 5 | import { ComponentType, useDynamicPublicForm } from './useDynamicPublicForm'; | 5 | import { ComponentType, useDynamicPublicForm } from './useDynamicPublicForm'; |
| 6 | import { Help } from '@vicons/ionicons5' | 6 | import { Help } from '@vicons/ionicons5' |
| 7 | -import { SelectTimeAggregation } from '../SelectTImeAggregation'; | 7 | +import { SelectTimeAggregation } from '../SelectTImeAggregation'; |
| 8 | 8 | ||
| 9 | const props = defineProps<{ | 9 | const props = defineProps<{ |
| 10 | paramsItemList: ParamsItemType[] | 10 | paramsItemList: ParamsItemType[] |
| @@ -41,12 +41,16 @@ const setConfigurationData = async (params: Recordable) => { | @@ -41,12 +41,16 @@ const setConfigurationData = async (params: Recordable) => { | ||
| 41 | setDynamicFormValue(params) | 41 | setDynamicFormValue(params) |
| 42 | } | 42 | } |
| 43 | 43 | ||
| 44 | +const recreate = ref(false) | ||
| 45 | + | ||
| 44 | watch( | 46 | watch( |
| 45 | () => props.paramsItemList, | 47 | () => props.paramsItemList, |
| 46 | (newValue) => { | 48 | (newValue) => { |
| 47 | if (newValue) { | 49 | if (newValue) { |
| 50 | + recreate.value = true | ||
| 48 | clearParams() | 51 | clearParams() |
| 49 | createForm() | 52 | createForm() |
| 53 | + recreate.value = false | ||
| 50 | } | 54 | } |
| 51 | } | 55 | } |
| 52 | ) | 56 | ) |
| @@ -61,8 +65,8 @@ defineExpose({ | @@ -61,8 +65,8 @@ defineExpose({ | ||
| 61 | 65 | ||
| 62 | <template> | 66 | <template> |
| 63 | <NForm> | 67 | <NForm> |
| 64 | - <template v-for="item in getDynamicFormSchemas" :key="item.key"> | ||
| 65 | - <NFormItem ref="dynamicFormItemEl" :required="item.required" :rule="item.rules"> | 68 | + <template v-for="item in getDynamicFormSchemas" :key="item.uuid"> |
| 69 | + <NFormItem v-if="!recreate" ref="dynamicFormItemEl" :required="item.required" :rule="item.rules"> | ||
| 66 | <template #label> | 70 | <template #label> |
| 67 | <div class="label-container"> | 71 | <div class="label-container"> |
| 68 | <span>{{ item.name }}</span> | 72 | <span>{{ item.name }}</span> |
| @@ -31,6 +31,7 @@ export enum ComponentType { | @@ -31,6 +31,7 @@ export enum ComponentType { | ||
| 31 | 31 | ||
| 32 | 32 | ||
| 33 | export interface DynamicFormSchema { | 33 | export interface DynamicFormSchema { |
| 34 | + uuid?: string | ||
| 34 | key: string | 35 | key: string |
| 35 | name?: string | 36 | name?: string |
| 36 | component: ComponentType, | 37 | component: ComponentType, |
| @@ -336,6 +337,7 @@ export const useDynamicPublicForm = (paramsItemList: Ref<ParamsItemType[]>) => { | @@ -336,6 +337,7 @@ export const useDynamicPublicForm = (paramsItemList: Ref<ParamsItemType[]>) => { | ||
| 336 | }] as FormItemRule | 337 | }] as FormItemRule |
| 337 | } | 338 | } |
| 338 | 339 | ||
| 340 | + const uuid = () => Number(Math.random().toString().substring(2)).toString(32) | ||
| 339 | const toFormSchemas = (builtInVariableKey: string, required: boolean, value: any, mores: boolean) => { | 341 | const toFormSchemas = (builtInVariableKey: string, required: boolean, value: any, mores: boolean) => { |
| 340 | const groupList = (builtInVariableKey || '').split(GROUP_SEPARATOR) | 342 | const groupList = (builtInVariableKey || '').split(GROUP_SEPARATOR) |
| 341 | return groupList.reduce((prev, next) => { | 343 | return groupList.reduce((prev, next) => { |
| @@ -351,6 +353,7 @@ export const useDynamicPublicForm = (paramsItemList: Ref<ParamsItemType[]>) => { | @@ -351,6 +353,7 @@ export const useDynamicPublicForm = (paramsItemList: Ref<ParamsItemType[]>) => { | ||
| 351 | 353 | ||
| 352 | schema = { | 354 | schema = { |
| 353 | ...result, | 355 | ...result, |
| 356 | + // uuid: uuid(), | ||
| 354 | props, | 357 | props, |
| 355 | name, | 358 | name, |
| 356 | required, | 359 | required, |
| @@ -358,6 +361,7 @@ export const useDynamicPublicForm = (paramsItemList: Ref<ParamsItemType[]>) => { | @@ -358,6 +361,7 @@ export const useDynamicPublicForm = (paramsItemList: Ref<ParamsItemType[]>) => { | ||
| 358 | } as DynamicFormSchema | 361 | } as DynamicFormSchema |
| 359 | } else { | 362 | } else { |
| 360 | schema = { | 363 | schema = { |
| 364 | + // uuid: uuid(), | ||
| 361 | key: value, | 365 | key: value, |
| 362 | name: value, | 366 | name: value, |
| 363 | component: ComponentType.INPUT, | 367 | component: ComponentType.INPUT, |
| @@ -377,22 +381,19 @@ export const useDynamicPublicForm = (paramsItemList: Ref<ParamsItemType[]>) => { | @@ -377,22 +381,19 @@ export const useDynamicPublicForm = (paramsItemList: Ref<ParamsItemType[]>) => { | ||
| 377 | const schemas = toFormSchemas(key, required, value, mores) | 381 | const schemas = toFormSchemas(key, required, value, mores) |
| 378 | return [...prev, ...schemas] | 382 | return [...prev, ...schemas] |
| 379 | }, [] as DynamicFormSchema[]) | 383 | }, [] as DynamicFormSchema[]) |
| 380 | - console.log(result) | ||
| 381 | return result | 384 | return result |
| 382 | }) | 385 | }) |
| 383 | 386 | ||
| 384 | const createForm = async () => { | 387 | const createForm = async () => { |
| 385 | - console.log('enter') | ||
| 386 | await getBuiltInVariable() | 388 | await getBuiltInVariable() |
| 387 | await getOrgOption() | 389 | await getOrgOption() |
| 388 | getDeviceProfileOption() | 390 | getDeviceProfileOption() |
| 389 | getDeviceOption() | 391 | getDeviceOption() |
| 390 | - clearParams() | ||
| 391 | } | 392 | } |
| 392 | 393 | ||
| 393 | const setParams = (Params: Recordable = {}) => { | 394 | const setParams = (Params: Recordable = {}) => { |
| 394 | for (const { key, value, mores } of unref(getParams)) { | 395 | for (const { key, value, mores } of unref(getParams)) { |
| 395 | - const splitKeys = value ? value.split(GROUP_SEPARATOR) : key.split(GROUP_SEPARATOR) | 396 | + const splitKeys = value ? value.split(GROUP_SEPARATOR) : (key || '').split(GROUP_SEPARATOR) |
| 396 | if (isDateComponent(key as BuiltInVariable)) { | 397 | if (isDateComponent(key as BuiltInVariable)) { |
| 397 | if (key as BuiltInVariable === BuiltInVariable.DATE_FIXED) { | 398 | if (key as BuiltInVariable === BuiltInVariable.DATE_FIXED) { |
| 398 | params[key] = Params[splitKeys[0]] || null | 399 | params[key] = Params[splitKeys[0]] || null |
| @@ -417,9 +418,10 @@ export const useDynamicPublicForm = (paramsItemList: Ref<ParamsItemType[]>) => { | @@ -417,9 +418,10 @@ export const useDynamicPublicForm = (paramsItemList: Ref<ParamsItemType[]>) => { | ||
| 417 | 418 | ||
| 418 | const clearParams = () => { | 419 | const clearParams = () => { |
| 419 | Object.keys(params).forEach(key => { | 420 | Object.keys(params).forEach(key => { |
| 420 | - // Reflect.deleteProperty(params, key) | ||
| 421 | - params[key] = null | 421 | + Reflect.deleteProperty(params, key) |
| 422 | + // params[key] = null | ||
| 422 | }) | 423 | }) |
| 424 | + // params[BuiltInVariable.SELECT_TIME_AGGREGATION] = { startTs: null, endTs: null, limit: null, interval: null } | ||
| 423 | params[BuiltInVariable.SELECT_TIME_AGGREGATION] = {} | 425 | params[BuiltInVariable.SELECT_TIME_AGGREGATION] = {} |
| 424 | } | 426 | } |
| 425 | 427 |