Merge branch 'perf/view-05-29' into 'main_dev'

feat(src/views): 输入框和日期联动组件新增支持post

See merge request yunteng/thingskit-view!271

@@ -164,12 +164,17 @@
     <template #header>
       <n-switch v-model:value="yAxis.show" size="small"></n-switch>
     </template>
+    <setting-item-box name="范围">
+      <setting-item name="开启" >
+        <n-switch v-model:value="yAxis.showRange" size="small"></n-switch>
+      </setting-item>
+    </setting-item-box>
     <setting-item-box name="范围" v-if="yAxis.showRange">
       <setting-item name="最小值" >
-        <n-input-number  v-model:value="yAxis.min" size="small" min="0"></n-input-number>
+        <n-input-number v-model:value="yAxis.minData" size="small" min="0"></n-input-number>
       </setting-item>
       <setting-item name="最大值">
-        <n-input-number  v-model:value="yAxis.max" size="small" min="0"></n-input-number>
+        <n-input-number v-model:value="yAxis.maxData" size="small" min="0"></n-input-number>
       </setting-item>
     </setting-item-box>
     <setting-item-box name="单位">
@@ -418,13 +423,6 @@ const xAxis = computed(() => {
 })
 
 const yAxis = computed(() => {
-  if((props.optionData?.yAxis as Recordable)){
-    if(!(props.optionData?.yAxis as Recordable).showRange) {
-      //针对横向柱状图和热力图
-      Reflect.deleteProperty((props.optionData.yAxis as Recordable),'min');
-      Reflect.deleteProperty((props.optionData.yAxis as Recordable),'max');
-    }
-  }
   return props.optionData.yAxis
 })
 

@@ -12,6 +12,7 @@ import dayjs from 'dayjs'
 import { RequestDataPondItemType } from '@/store/modules/chartEditStore/chartEditStore.d'
 import { JSONParse, convertToCascadingData, findItemByLabel } from '@/utils/external/utils'
 import { CascaderOption } from 'naive-ui'
+import { useUserStore } from '@/store/external/modules/user'
 
 
 // 获取类型
@@ -102,10 +103,11 @@ export const useChartDataFetch = (
                         (toRaw(targetComponent.request).requestParams.Params.endTs as unknown as number) = endTs as unknown as number
                     } 
                     //处理过期
+                    const userStore = useUserStore();
                     const findCurrentPond = () => {
                         return chartEditStore.getRequestGlobalConfig.requestDataPond.find((pondItem: RequestDataPondItemType) => 
-                            pondItem.dataPondId === targetComponent?.request?.requestDataPondId && targetComponent.request.thirdTokenIsExp)
-                    }
+                            pondItem.dataPondId === targetComponent?.request?.requestDataPondId && userStore.getThirdTokenIsExp)
+                        }
                     const handleExecuteRequest = async () => {
                         try {
                         if(findCurrentPond()?.dataPondRequestConfig?.pondRequestOriginUrl){
@@ -127,11 +129,11 @@ export const useChartDataFetch = (
                           console.error(e)
                         }
                     }
-                      // 定时时间
-                    const time = targetInterval && targetInterval.value ? targetInterval.value : globalRequestInterval.value
+                    // 定时时间
+                    const time = targetInterval && targetInterval.value ? targetInterval.value : pondRequestGlobalInterval?.value?pondRequestGlobalInterval?.value: globalRequestInterval.value
                     // 单位
-                    const unit = targetInterval && targetInterval.value ? targetUnit.value : globalUnit.value
-                    setInterval(handleExecuteRequest, intervalUnitHandle(time, unit))
+                    const unit = targetInterval && targetInterval.value ? targetUnit.value :pondRequestGlobalIntervalUnit?.value?pondRequestGlobalIntervalUnit?.value: globalUnit.value
+                    setInterval(handleExecuteRequest, intervalUnitHandle(time, (unit as unknown as any)))
                     //
                     const res = await customRequest(toRaw(targetComponent.request))
                     if (res) {

@@ -2,8 +2,9 @@
  * 重写select下拉框联动
  */
 import { toRefs } from 'vue'
-import {  CreateComponentType } from '@/packages/index.d'
+import { CreateComponentType } from '@/packages/index.d'
 import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
+import { JSONParse } from '@/utils/external/utils'
 
 // 获取类型
 type ChartEditStoreType = typeof useChartEditStore
@@ -32,9 +33,19 @@ export const useChartInteract = (
     chartEditStore.getComponentList.forEach(targetItem => {
       if (targetItem.isGroup) {
         targetItem.groupList?.forEach(groupItem => {
+          let jsonBody: any = null
           if (groupItem.id === item.interactComponentId) {
-            const { Params, Header } = toRefs(groupItem.request.requestParams)
+            const { Params, Header, Body } = toRefs(groupItem.request.requestParams)
             Object.keys(item.interactFn).forEach(key => {
+              if (Body.value['json']) {
+                jsonBody = JSONParse(Body.value['json'])
+                const splitDaterange = param['daterange'].split('-')
+                jsonBody[item.interactFn[key][0]] = decodeURIComponent(splitDaterange[0])
+                jsonBody[item.interactFn[key][1]] = decodeURIComponent(splitDaterange[1])
+              }
+              if (jsonBody) {
+                Body.value['json'] = JSON.stringify(jsonBody)
+              }
               if (Params.value[key]) {
                 Params.value[key] = param[item.interactFn[key]]
               }
@@ -45,9 +56,19 @@ export const useChartInteract = (
           }
         })
       } else {
+        let jsonBody: any = null
         if (targetItem.id === item.interactComponentId) {
-          const { Params, Header } = toRefs(targetItem.request.requestParams)
+          const { Params, Header, Body } = toRefs(targetItem.request.requestParams)
           Object.keys(item.interactFn).forEach(key => {
+            if (Body.value['json']) {
+              jsonBody = JSONParse(Body.value['json'])
+              const splitDaterange = param['daterange'].split('-')
+              jsonBody[item.interactFn[key][0]] = decodeURIComponent(splitDaterange[0])
+              jsonBody[item.interactFn[key][1]] = decodeURIComponent(splitDaterange[1])
+            }
+            if (jsonBody) {
+              Body.value['json'] = JSON.stringify(jsonBody)
+            }
             if (Params.value[key]) {
               Params.value[key] = param[item.interactFn[key]]
             }

@@ -4,6 +4,7 @@
 import { toRefs } from 'vue'
 import { CreateComponentType } from '@/packages/index.d'
 import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
+import { JSONParse } from '@/utils'
 
 // 获取类型
 type ChartEditStoreType = typeof useChartEditStore
@@ -33,21 +34,38 @@ export const useChartInteract = (
       if (targetItem.isGroup) {
         targetItem.groupList?.forEach(groupItem => {
           if (groupItem.id === item.interactComponentId) {
-            const { Params, Header } = toRefs(groupItem.request.requestParams)
-            Object.keys(item.interactFn).forEach(key => {
-                Params.value[key] = decodeURIComponent(param[item.interactFn[key]])
-                if(Reflect.has(Params.value, 'attrName')) {
-                  Params.value['attrName'] = attrNames as unknown as string // 修改联动选择，lengend未实时更新
-                }
-                if (key in  Header.value) {
-                  Header.value[key] = param[item.interactFn[key]]
+            const { Params, Header, Body } = toRefs(groupItem.request.requestParams)
+            //特殊处理 只针对两个下拉选择器，一个是产品下拉，一个是设备下拉，选择了产品，设备列表选择值清空
+            if (targetItem.chartConfig.title.includes('设备列表下拉选择器')) {
+              if (window.location.href.includes('preview')) {
+                if (window.sessionStorage.getItem('deviceProfileSelectStatus') === 'selected') {
+                  targetItem.option.selectValue = "'"
                 }
+              }
+            }
+            //
+            let jsonBody: any = null
+            Object.keys(item.interactFn).forEach(key => {
+              Params.value[key] = decodeURIComponent(param[item.interactFn[key]])
+              if (Body.value['json']) {
+                jsonBody = JSONParse(Body.value['json'])
+                jsonBody[item.interactFn[key]] = decodeURIComponent(param['data'])
+              }
+              if (jsonBody) {
+                Body.value['json'] = JSON.stringify(jsonBody)
+              }
+              if (Reflect.has(Params.value, 'attrName')) {
+                Params.value['attrName'] = attrNames as unknown as string // 修改联动选择，lengend未实时更新
+              }
+              if (key in Header.value) {
+                Header.value[key] = param[item.interactFn[key]]
+              }
             })
           }
         })
       } else {
         if (targetItem.id === item.interactComponentId) {
-          const { Params, Header } = toRefs(targetItem.request.requestParams)
+          const { Params, Header, Body } = toRefs(targetItem.request.requestParams)
           //特殊处理 只针对两个下拉选择器，一个是产品下拉，一个是设备下拉，选择了产品，设备列表选择值清空
           if (targetItem.chartConfig.title.includes('设备列表下拉选择器')) {
             if (window.location.href.includes('preview')) {
@@ -57,14 +75,22 @@ export const useChartInteract = (
             }
           }
           //
+          let jsonBody: any = null
           Object.keys(item.interactFn).forEach(key => {
-              Params.value[key] = decodeURIComponent(param[item.interactFn[key]])
-              if(Reflect.has(Params.value, 'attrName')) {
-                Params.value['attrName'] = attrNames as unknown as string // 修改联动选择，lengend未实时更新
-              }
-              if (key in  Header.value) {
-                Header.value[key] = param[item.interactFn[key]]
-              }
+            Params.value[key] = decodeURIComponent(param[item.interactFn[key]])
+            if (Body.value['json']) {
+              jsonBody = JSONParse(Body.value['json'])
+              jsonBody[item.interactFn[key]] = decodeURIComponent(param['data'])
+            }
+            if (jsonBody) {
+              Body.value['json'] = JSON.stringify(jsonBody)
+            }
+            if (Reflect.has(Params.value, 'attrName')) {
+              Params.value['attrName'] = attrNames as unknown as string // 修改联动选择，lengend未实时更新
+            }
+            if (key in Header.value) {
+              Header.value[key] = param[item.interactFn[key]]
+            }
           })
         }
       }

@@ -71,7 +71,6 @@ const onChange = (v: number | number[] | null) => {
         dateEnd = dayjs(lastTs).set('hour', 23).set('minute', 59).set('second', 59).valueOf()
       }
     }
-    console.log(daterange)
     // 存储到联动数据
     useChartInteract(
       props.chartConfig,

@@ -48,9 +48,9 @@
     }
   },
   "yAxis": {
-    "showRange":true,
-    "min": 0,
-    "max": 200,
+    "showRange": false,
+    "minData": 0,
+    "maxData": 350,
     "show": true,
     "name": "",
     "nameGap": 15,

@@ -32,6 +32,7 @@ interface UserState {
   shareJwtToken?: string;
   shareRefreshToken?: string;
   outTarget?: string;
+  thirdTokenIsExp?: boolean;
 }
 
 const storage = createLocalStorage();
@@ -57,9 +58,14 @@ export const useUserStore = defineStore({
     sessionTimeout: false,
     // Last fetch time
     lastUpdateTime: 0,
+    // 用于三方接口Token是否过期
+    thirdTokenIsExp: false 
   }),
 
   getters: {
+    getThirdTokenIsExp(): boolean {
+      return this.thirdTokenIsExp!;
+    },
     getPlatInfo(): any {
       return this.platInfo;
     },
@@ -87,6 +93,9 @@ export const useUserStore = defineStore({
     },
   },
   actions: {
+    setThirdTokenIsExp(expStatus:boolean) {
+      this.thirdTokenIsExp = expStatus
+    },
     setPlatInfo(platInfo: any) {
       this.platInfo = platInfo;
     },

@@ -129,6 +129,9 @@ export class VAxios {
           const currentTime = (new Date().getTime() + (config.timeout || 0)) / 1000;
           if (currentTime >= res?.exp) {
             targetData.value.request.thirdTokenIsExp = true
+            userStore.setThirdTokenIsExp(true)
+           }else{
+            userStore.setThirdTokenIsExp(false)
            }
           } else {
           //此平台逻辑

@@ -91,7 +91,7 @@
       </setting-item-box>
       <!-- THINGS_KIT 修改多画布切换相关代码 用于切换画布 -->
 
-      <setting-item-box  v-if="!interactActionsIsPageChange&&fnDimensionsAndSource(item.interactOn).length" name="查询结果" :alone="true">
+      <setting-item-box  v-if="!interactActionsIsPageChange && fnDimensionsAndSource(item.interactOn, null, null)!.length" name="查询结果" :alone="true">
         <n-table size="small" striped>
           <thead>
             <tr>
@@ -99,9 +99,9 @@
             </tr>
           </thead>
           <tbody>
-            <tr v-for="(cItem, index) in fnDimensionsAndSource(item.interactOn)" :key="index">
-              <td>{{ cItem.value }}</td>
-              <td>{{ cItem.label }}</td>
+            <tr v-for="(cItem, index) in fnDimensionsAndSource(item.interactOn, null, null)" :key="index">
+              <td>{{ cItem?.value }}</td>
+              <td>{{ cItem?.label }}</td>
             </tr>
           </tbody>
         </n-table>
@@ -123,8 +123,10 @@
           <n-select
             size="tiny"
             v-model:value="item.interactFn[ovlKey]"
-            :options="fnDimensionsAndSource(item.interactOn)"
+            :options="fnDimensionsAndSource(item.interactOn, item.interactComponentId!, requestParamsItem)"
             clearable
+            multiple 
+            @update:value="(value: string, options: Recordable[])=>handleSelectInteract(value,options,item.interactOn,requestParamsItem)"
           ></n-select>
         </setting-item>
         <n-text
@@ -149,13 +151,13 @@ import { RequestParamsTypeEnum, RequestDataTypeEnum } from '@/enums/httpEnum'
 import { InteractEventOn, COMPONENT_INTERACT_EVENT_KET } from '@/enums/eventEnum'
 import { icon } from '@/plugins'
 import noData from '@/assets/images/canvas/noData.png'
-import { goDialog } from '@/utils'
+import { JSONParse, goDialog } from '@/utils'
 import { useTargetData } from '../../../hooks/useTargetData.hook'
 import {PageChartEditStoreType} from '@/store/modules/chartEditStore/chartEditStore.d'
 
 const { CloseIcon, AddIcon, HelpOutlineIcon } = icon.ionicons5
 const { targetData, chartEditStore } = useTargetData()
-const requestParamsTypeList = [RequestParamsTypeEnum.PARAMS, RequestParamsTypeEnum.HEADER]
+const requestParamsTypeList = [RequestParamsTypeEnum.PARAMS, RequestParamsTypeEnum.BODY, RequestParamsTypeEnum.HEADER]
 
 
 // THINGS_KIT 修改多画布切换相关代码 用于切换画布
@@ -186,19 +188,40 @@ const fnGetRequest = (id: string | undefined, key: RequestParamsTypeEnum) => {
   const globalConfigPindApr = chartEditStore.getRequestGlobalConfig.requestDataPond.find(item => {
     return item.dataPondId === id
   })?.dataPondRequestConfig.requestParams
-
   if (globalConfigPindApr) return globalConfigPindApr[key]
   return chartEditStore.getComponentList[chartEditStore.fetchTargetIndex(id)]?.request.requestParams[key]
 }
 
+const handleSelectInteract = (value: string, options: SelectOption[], interactOn: InteractEventOn | undefined, requestParamsItem: RequestParamsTypeEnum | null) => {
+  console.log(value)
+  console.log(options)
+  console.log(interactOn)
+  console.log(requestParamsItem)
+  console.log(targetData.value)
+}
+
 // 查询结果
-const fnDimensionsAndSource = (interactOn: InteractEventOn | undefined) => {
+const fnDimensionsAndSource = (interactOn: InteractEventOn | undefined, id?: string | null,  key?: RequestParamsTypeEnum | null) => {
   if (!interactOn || !targetData.value.interactActions) return []
   const tableData = targetData.value.interactActions.find(item => {
     return item.interactType === interactOn
   })
-
-  return tableData?.componentEmitEvents[option.value[COMPONENT_INTERACT_EVENT_KET]] || []
+  // 新增支持Body
+  let bodyJsonList: SelectOption[]= []
+  if (id) {
+    const { request } = chartEditStore.getComponentList[chartEditStore.fetchTargetIndex(id)]
+    const { requestParams } = request
+    const { Body } = requestParams
+    const { json } = Body
+    if (!json) return
+    const jsonDict = JSONParse(json)
+    if (key === RequestParamsTypeEnum.BODY) {
+      bodyJsonList = Object.keys(jsonDict)?.map(bodyItem=>({label: bodyItem, value: bodyItem}))
+    }
+  }
+  //
+  const paramsTableData: SelectOption[] = tableData?.componentEmitEvents[option.value[COMPONENT_INTERACT_EVENT_KET]] || []
+  return [...paramsTableData, ...bodyJsonList] as unknown as SelectOption[]
 }
 
 // 绑定组件列表
@@ -263,7 +286,6 @@ const fnEventsOptions = (): Array<SelectOption | SelectGroupOption> => {
       }
     })
   })
-console.log(tarArr)
   return tarArr
 }
 

@@ -16,7 +16,32 @@
 <script setup lang="ts">
 import { NameSetting, PositionSetting, SizeSetting, StylesSetting } from '@/components/Pages/ChartItemSetting'
 import { useTargetData } from '../hooks/useTargetData.hook'
+import { watch } from 'vue'
+import { CreateComponentType, CreateComponentGroupType } from '@/packages/index.d'
+
 const { targetData, chartEditStore } = useTargetData()
+
+watch(
+  () => targetData.value,
+  (newValue: CreateComponentType | CreateComponentGroupType) => {
+    if (!newValue) return
+    if (!('yAxis' in newValue.option)) return
+    try {
+      if (!newValue?.option?.yAxis?.showRange) {
+        Reflect.deleteProperty((targetData.value as unknown as Recordable).option.yAxis, 'min')
+        Reflect.deleteProperty((targetData.value as unknown as Recordable).option.yAxis, 'max')
+      } else {
+        Reflect.set((targetData.value as unknown as Recordable).option.yAxis, 'min', newValue?.option?.yAxis.minData)
+        Reflect.set((targetData.value as unknown as Recordable).option.yAxis, 'max', newValue?.option?.yAxis.maxData)
+      }
+    } catch (e) {
+      console.log('🚀 ~ e:', e)
+    }
+  },
+  {
+    deep: true
+  }
+)
 </script>
 
 <style lang="scss" scoped>