Prechádzať zdrojové kódy

feat: 新增组件更新单独设置功能

奔跑的面条 3 rokov pred
rodič
commit
88bb915161

+ 9 - 4
src/hooks/useChartDataFetch.hook.ts

@@ -9,7 +9,6 @@ import { isPreview, newFunctionHandle } from '@/utils'
 // 获取类型
 type ChartEditStoreType = typeof useChartEditStore
 
-
 /**
  * setdata 数据监听与更改
  * @param targetComponent
@@ -30,7 +29,12 @@ export const useChartDataFetch = (
     // 组件类型
     const { chartFrame } = targetComponent.chartConfig
     // 请求配置
-    const { requestDataType, requestHttpType, requestUrl } = toRefs(targetComponent.request)
+    const {
+      requestDataType,
+      requestHttpType,
+      requestUrl,
+      requestInterval: targetInterval
+    } = toRefs(targetComponent.request)
     // 非请求类型
     if (requestDataType.value !== RequestDataTypeEnum.AJAX) return
     // 处理地址
@@ -65,12 +69,13 @@ export const useChartDataFetch = (
 
       // 立即调用
       fetchFn()
+
       // 开启定时
-      fetchInterval = setInterval(fetchFn, requestInterval.value * 1000)
+      const time = targetInterval && targetInterval.value ? targetInterval.value : requestInterval.value
+      fetchInterval = setInterval(fetchFn, time * 1000)
     }
   }
 
   isPreview() && requestIntervalFn()
-
   return { vChartRef }
 }

+ 1 - 1
src/packages/public/publicConfig.ts

@@ -8,7 +8,7 @@ const requestConfig: RequestConfigType = {
   requestDataType: RequestDataTypeEnum.STATIC,
   requestHttpType: RequestHttpEnum.GET,
   requestUrl: '',
-  requestInterval: 0
+  requestInterval: undefined
 }
 
 export class publicConfig implements PublicConfigType {

+ 1 - 1
src/store/modules/chartEditStore/chartEditStore.d.ts

@@ -147,7 +147,7 @@ export type RequestConfigType = {
   // 源后续的 url
   requestUrl?: string
   // 组件定制轮询时间
-  requestInterval: number
+  requestInterval?: number
 }
 
 // Store 类型

+ 2 - 2
src/views/chart/ContentConfigurations/components/CanvasPage/components/ChartDataSetting/index.vue

@@ -6,12 +6,12 @@
         placeholder="源地址如: http://127.0.0.1"
       ></n-input>
     </setting-item-box>
-    <setting-item-box name="更新间隔">
+    <setting-item-box name="更新间隔" :alone="true">
       <n-input-number
         v-model:value.trim="chartEditStore.getRequestGlobalConfig.requestInterval"
         min="5"
         :show-button="false"
-        placeholder="为 0 不更新"
+        placeholder="将应用全局组件"
       >
         <template #suffix>

+ 16 - 5
src/views/chart/ContentConfigurations/components/ChartData/components/ChartDataAjax/index.vue

@@ -1,7 +1,19 @@
 <template>
   <div class="go-chart-configurations-data-ajax">
-    <setting-item-box name="类型" :alone="true">
-      <n-select v-model:value="targetData.request.requestHttpType" :options="selectOptions" />
+    <setting-item-box name="配置">
+      <setting-item name="类型">
+        <n-select v-model:value="targetData.request.requestHttpType" :options="selectOptions" />
+      </setting-item>
+      <setting-item name="默认使用全局间隔">
+        <n-input-number
+          v-model:value.trim="targetData.request.requestInterval"
+          min="5"
+          :show-button="false"
+          placeholder="可以为空"
+        >
+          <template #suffix> 秒 </template>
+        </n-input-number>
+      </setting-item>
     </setting-item-box>
 
     <setting-item-box name="源地址:" :alone="true">
@@ -27,7 +39,6 @@
       </template>
       <n-input v-model:value.trim="targetData.request.requestUrl" :min="1" placeholder="请输入地址(去除源)" />
     </setting-item-box>
-
     <setting-item-box :alone="true">
       <template #name>
         测试
@@ -60,7 +71,7 @@
 <script setup lang="ts">
 import { ref, toRefs, onBeforeUnmount, watchEffect } from 'vue'
 import { icon } from '@/plugins'
-import { SettingItemBox } from '@/components/Pages/ChartItemSetting'
+import { SettingItemBox, SettingItem } from '@/components/Pages/ChartItemSetting'
 import { RequestHttpEnum, ResultEnum } from '@/enums/httpEnum'
 import { chartDataUrl, rankListUrl, scrollBoardUrl, numberFloatUrl, numberIntUrl, textUrl, imageUrl } from '@/api/mock'
 import { http } from '@/api/http'
@@ -116,7 +127,7 @@ const selectOptions: SelectHttpType[] = [
 // 发送请求
 const sendHandle = async () => {
   loading.value = true
-  if(!targetData.value) return
+  if (!targetData.value) return
   const { requestUrl, requestHttpType } = targetData.value.request
   if (!requestUrl) {
     window['$message'].warning('请求参数不正确,请检查!')