Commit 7ddb9dc028a36e047879721bcae03b99a709c422

Authored by fengwotao
2 parents 986418f8 ef098c9f

Merge branch 'main_dev' into ft

1 1 import { ref, toRefs, toRaw, watch } from 'vue'
2 2 import type VChart from 'vue-echarts'
3   -import { customizeHttp } from '@/api/http'
4 3 import { useChartDataPondFetch } from '@/hooks/'
5 4 import { CreateComponentType, ChartFrameEnum } from '@/packages/index.d'
6 5 import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
7   -import { RequestDataTypeEnum } from '@/enums/httpEnum'
8   -import { isPreview, newFunctionHandle, intervalUnitHandle } from '@/utils'
  6 +import { isPreview, intervalUnitHandle } from '@/utils'
9 7 import { setOption } from '@/packages/public/chart'
  8 +import { useChartDataSocket } from './useChartDataSocket'
  9 +import { customRequest } from '@/api/external/customRequest'
  10 +import { useFilterFn } from './useFilterFn'
10 11
11 12 // 获取类型
12 13 type ChartEditStoreType = typeof useChartEditStore
... ... @@ -52,18 +53,13 @@ export const useChartDataFetch = (
52 53
53 54 // 目标组件
54 55 const {
55   - requestDataType,
56 56 requestUrl,
57 57 requestIntervalUnit: targetUnit,
58 58 requestInterval: targetInterval
59 59 } = toRefs(targetComponent.request)
60 60
61   - // 非请求类型
62   - if (requestDataType.value !== RequestDataTypeEnum.AJAX) return
63   -
64 61 try {
65   - // 处理地址
66   - // @ts-ignore
  62 + // 处理地址
67 63 if (requestUrl?.value) {
68 64 // requestOriginUrl 允许为空
69 65 const completePath = requestOriginUrl && requestOriginUrl.value + requestUrl.value
... ... @@ -72,14 +68,15 @@ export const useChartDataFetch = (
72 68 clearInterval(fetchInterval)
73 69
74 70 const fetchFn = async () => {
75   - const res = await customizeHttp(toRaw(targetComponent.request), toRaw(chartEditStore.getRequestGlobalConfig))
  71 + const res = await customRequest(toRaw(targetComponent.request))
76 72 if (res) {
77 73 try {
78 74 const filter = targetComponent.filter
79   - echartsUpdateHandle(newFunctionHandle(res?.data, res, filter))
  75 + const { value } = useFilterFn(filter, res)
  76 + echartsUpdateHandle(value)
80 77 // 更新回调函数
81 78 if (updateCallback) {
82   - updateCallback(newFunctionHandle(res?.data, res, filter))
  79 + updateCallback(value)
83 80 }
84 81 } catch (error) {
85 82 console.error(error)
... ... @@ -113,10 +110,9 @@ export const useChartDataFetch = (
113 110 }
114 111
115 112 if (isPreview()) {
116   - // 判断是否是数据池类型
117   - targetComponent.request.requestDataType === RequestDataTypeEnum.Pond
118   - ? addGlobalDataInterface(targetComponent, useChartEditStore, updateCallback || echartsUpdateHandle)
119   - : requestIntervalFn()
  113 + requestIntervalFn()
  114 + const { initial } = useChartDataSocket()
  115 + initial(targetComponent, useChartEditStore, updateCallback)
120 116 }
121 117 return { vChartRef }
122 118 }
... ...
... ... @@ -7,18 +7,21 @@ import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore
7 7 import { RequestDataTypeEnum } from '@/enums/httpEnum'
8 8 import { isPreview, newFunctionHandle, intervalUnitHandle } from '@/utils'
9 9 import { setOption } from '@/packages/public/chart'
10   -import { useChartDataSocket } from './external/useChartDataSocket'
  10 +
  11 +// THINGS_KIT 重写默认方法
  12 +export { useChartDataFetch } from './external/useChartDataFetch.hook'
11 13
12 14 // 获取类型
13 15 type ChartEditStoreType = typeof useChartEditStore
14 16
  17 +// THINGS_KIT 重命名默认方法
15 18 /**
16 19 * setdata 数据监听与更改
17 20 * @param targetComponent
18 21 * @param useChartEditStore 若直接引会报错,只能动态传递
19 22 * @param updateCallback 自定义更新函数
20 23 */
21   -export const useChartDataFetch = (
  24 +export const originUseChartDataFetch = (
22 25 targetComponent: CreateComponentType,
23 26 useChartEditStore: ChartEditStoreType,
24 27 updateCallback?: (...args: any) => any
... ... @@ -119,9 +122,5 @@ export const useChartDataFetch = (
119 122 ? addGlobalDataInterface(targetComponent, useChartEditStore, updateCallback || echartsUpdateHandle)
120 123 : requestIntervalFn()
121 124 }
122   -
123   - // THINGS_KIT 添加socket支持
124   - const { initial } = useChartDataSocket()
125   - initial(targetComponent, useChartEditStore, updateCallback)
126 125 return { vChartRef }
127 126 }
... ...
... ... @@ -37,7 +37,6 @@ export function createPermissionGuard(router: Router) {
37 37 }
38 38
39 39 const token = userStore.getJwtToken
40   - console.log(token)
41 40
42 41 if (to.matched.find(item => whitePathList.includes(item.path))) {
43 42 if (to.path === PageEnum.BASE_LOGIN && token) {
... ...
1 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 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 8 const props = defineProps<{
9 9 paramsItemList: ParamsItemType[]
... ... @@ -16,7 +16,7 @@ const componentMap: { [key in ComponentType]?: any } = {
16 16 [ComponentType.DATE_PICKER]: NDatePicker
17 17 }
18 18
19   -const getParamsItemList = computed(() => {
  19 +const getParamsItemList = computed(() => {
20 20 return props.paramsItemList
21 21 })
22 22
... ... @@ -35,7 +35,7 @@ const validate = async () => {
35 35 return unref(validFlag)
36 36 }
37 37 const setConfigurationData = async (params: Recordable) => {
38   - await nextTick()
  38 + await nextTick()
39 39 setDynamicFormValue(params)
40 40 }
41 41
... ... @@ -60,9 +60,36 @@ defineExpose({
60 60 <template>
61 61 <NForm>
62 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 77 <component :is="componentMap[item.component]" v-bind="item.props" clearable />
65 78 </NFormItem>
66 79 </template>
67 80 </NForm>
68 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>
... ...
... ... @@ -54,7 +54,7 @@ const handleFilter = (query: string, option: SelectOption) => {
54 54
55 55 const requestHttpTypeRef = ref<RequestHttpEnum>()
56 56
57   -const requestIntervalValueRef = ref<number>(30)
  57 +const requestIntervalValueRef = ref<undefined | number>(30)
58 58
59 59 const requestIntervalUnitRef = ref<RequestHttpIntervalEnum>(RequestHttpIntervalEnum.SECOND)
60 60
... ... @@ -112,12 +112,14 @@ const getConfigurationData = () => {
112 112 record.requestParams[RequestParamsTypeEnum.PARAMS] = getDynamicFormValue()
113 113 record.requestParams[RequestParamsTypeEnum.HEADER] = unref(headerRef)
114 114 record.requestParams[RequestParamsTypeEnum.BODY] = bodyValue
  115 + record.requestInterval = unref(requestIntervalValueRef)
  116 + record.requestIntervalUnit = unref(requestIntervalUnitRef)
115 117 return record
116 118 }
117 119
118 120 const setConfigurationData = async (request: ExtraRequestConfigType) => {
119 121 await getPublicInterfaceList()
120   - const { requestDataPondId, requestParams, requestParamsBodyType, requestContentType, requestHttpType } = request
  122 + const { requestDataPondId, requestParams, requestParamsBodyType, requestContentType, requestHttpType, requestIntervalUnit, requestInterval } = request
121 123 const { Header } = requestParams
122 124 selectedPublicInterface.value = requestDataPondId
123 125 requestContentTypeRef.value = requestContentType
... ... @@ -125,6 +127,8 @@ const setConfigurationData = async (request: ExtraRequestConfigType) => {
125 127 headerRef.value = Header
126 128 requestParamsBodyTypeRef.value = requestParamsBodyType
127 129 requestBodyRef.value = requestParams
  130 + requestIntervalUnitRef.value = requestIntervalUnit
  131 + requestIntervalValueRef.value = requestInterval
128 132 await nextTick()
129 133 setDynamicFormValue(request)
130 134 }
... ...
... ... @@ -124,7 +124,7 @@ const props = withDefaults(
124 124 maxRow: 50,
125 125 }
126 126 )
127   -
  127 +
128 128
129 129 const emit = defineEmits(['update:value'])
130 130
... ... @@ -143,7 +143,7 @@ watch(
143 143 dataSource.value = Object.keys(props.value || {}).map(keyName => ({ ...createNewRow(), keyName, value: Reflect.get(props.value || {}, keyName) }))
144 144 } else {
145 145 dataSource.value = [createNewRow()]
146   - }
  146 + }
147 147 },
148 148 {
149 149 immediate: true,
... ... @@ -167,11 +167,11 @@ const handleAddRow = (record: DataSource) => {
167 167 const handleSubtractRow = (record: DataSource) => {
168 168 const index = unref(dataSource).findIndex(item => item.id === record.id)
169 169 if (unref(dataSource).length === 1) {
170   - unref(dataSource)[index].keyName = ''
171   - unref(dataSource)[index].value = ''
172   - return
  170 + emit('update:value', {})
  171 + } else {
  172 + unref(dataSource).splice(index, 1)
  173 + emit('update:value', getHeaderConfiguration())
173 174 }
174   - unref(dataSource).splice(index, 1)
175 175 }
176 176
177 177
... ... @@ -194,5 +194,5 @@ const getHeaderConfiguration = () => {
194 194 </script>
195 195
196 196 <template>
197   - <NDataTable size="small" :columns="columns" :data="dataSource" max-height="300" />
  197 + <NDataTable size="small" :columns="columns" :row-key="rowData => rowData.id" :data="dataSource" max-height="300" />
198 198 </template>
... ...
... ... @@ -69,8 +69,7 @@ const getResult = () => {
69 69
70 70 const handleSaveAction = async () => {
71 71 if (!(await validate())) return
72   - const value = getResult()
73   - console.log(value)
  72 + const value = getResult()
74 73 if (unref(selectTarget)) {
75 74 chartEditStore.updateComponentList(chartEditStore.fetchTargetIndex(), {
76 75 ...unref(selectTarget)!,
... ...