Commit 4b5a14e31458826e25e33c74772aaa7ade306b4f

Authored by ww
1 parent 6ce66876

perf(dynamicParams): 公共接口自定义参数为entityType时增加tooltip提示

1 <script lang="ts" setup> 1 <script lang="ts" setup>
2 -import { ParamsItemType, PublicInterfaceRecord } from '@/api/external/dynamicRequest/model';  
3 -import { RequestParams } from '@/enums/httpEnum';  
4 -import { FormItemInst, NDatePicker, NForm, NFormItem, NInput, NSelect, NTreeSelect } from 'naive-ui' 2 +import { ParamsItemType } from '@/api/external/dynamicRequest/model';
  3 +import { FormItemInst, NDatePicker, NForm, NFormItem, NInput, NSelect, NTreeSelect, NIcon, NTooltip } from 'naive-ui'
5 import { computed, nextTick, ref, unref, watch } from 'vue'; 4 import { computed, nextTick, ref, unref, watch } from 'vue';
6 -import { ComponentType, useDynamicPublicForm } from './useDynamicPublicForm'; 5 +import { ComponentType, useDynamicPublicForm } from './useDynamicPublicForm';
  6 +import { Help } from '@vicons/ionicons5'
7 7
8 const props = defineProps<{ 8 const props = defineProps<{
9 paramsItemList: ParamsItemType[] 9 paramsItemList: ParamsItemType[]
@@ -16,7 +16,7 @@ const componentMap: { [key in ComponentType]?: any } = { @@ -16,7 +16,7 @@ const componentMap: { [key in ComponentType]?: any } = {
16 [ComponentType.DATE_PICKER]: NDatePicker 16 [ComponentType.DATE_PICKER]: NDatePicker
17 } 17 }
18 18
19 -const getParamsItemList = computed(() => { 19 +const getParamsItemList = computed(() => {
20 return props.paramsItemList 20 return props.paramsItemList
21 }) 21 })
22 22
@@ -35,7 +35,7 @@ const validate = async () => { @@ -35,7 +35,7 @@ const validate = async () => {
35 return unref(validFlag) 35 return unref(validFlag)
36 } 36 }
37 const setConfigurationData = async (params: Recordable) => { 37 const setConfigurationData = async (params: Recordable) => {
38 - await nextTick() 38 + await nextTick()
39 setDynamicFormValue(params) 39 setDynamicFormValue(params)
40 } 40 }
41 41
@@ -60,9 +60,36 @@ defineExpose({ @@ -60,9 +60,36 @@ defineExpose({
60 <template> 60 <template>
61 <NForm> 61 <NForm>
62 <template v-for="item in getDynamicFormSchemas" :key="item.key"> 62 <template v-for="item in getDynamicFormSchemas" :key="item.key">
63 - <NFormItem ref="dynamicFormItemEl" :required="item.required" :label="item.name" :rule="item.rules"> 63 + <NFormItem ref="dynamicFormItemEl" :required="item.required" :rule="item.rules">
  64 + <template #label>
  65 + <div class="label-container">
  66 + <span>{{ item.name }}</span>
  67 + <NTooltip v-if="item.name === 'entityType'" trigger="hover">
  68 + <template #trigger>
  69 + <NIcon>
  70 + <Help />
  71 + </NIcon>
  72 + </template>
  73 + 请填入DEVICE
  74 + </NTooltip>
  75 + </div>
  76 + </template>
64 <component :is="componentMap[item.component]" v-bind="item.props" clearable /> 77 <component :is="componentMap[item.component]" v-bind="item.props" clearable />
65 </NFormItem> 78 </NFormItem>
66 </template> 79 </template>
67 </NForm> 80 </NForm>
68 </template> 81 </template>
  82 +
  83 +<style scoped lang="scss">
  84 +.label-container {
  85 + display: flex;
  86 + align-items: center;
  87 + cursor: pointer;
  88 + gap: 5px;
  89 +
  90 + i {
  91 + border: 1px solid #000;
  92 + border-radius: 50%;
  93 + }
  94 +}
  95 +</style>