Showing
1 changed file
with
38 additions
and
15 deletions
| 1 | <template> | 1 | <template> |
| 2 | <n-space class="go-decorates-flipper-number" :size="flipperGap" align="center" justify="center"> | 2 | <n-space class="go-decorates-flipper-number" :size="flipperGap" align="center" justify="center"> |
| 3 | - <flipper | ||
| 4 | - :count="item" | ||
| 5 | - :width="flipperWidth" | ||
| 6 | - :height="flipperHeight" | ||
| 7 | - :front-color="flipperTextColor" | ||
| 8 | - :back-color="flipperBgColor" | ||
| 9 | - :radius="flipperRadius" | ||
| 10 | - :flip-type="flipperType" | ||
| 11 | - :duration="flipperSpeed" | ||
| 12 | - :border-width="flipperBorderWidth" | ||
| 13 | - v-for="(item, index) in flipperData" | ||
| 14 | - :key="index" | ||
| 15 | - class="go-d-block" | ||
| 16 | - /> | 3 | + <flipper :count="item" :width="flipperWidth" :height="flipperHeight" :front-color="flipperTextColor" |
| 4 | + :back-color="flipperBgColor" :radius="flipperRadius" :flip-type="flipperType" :duration="flipperSpeed" | ||
| 5 | + :border-width="flipperBorderWidth" v-for="(item, index) in flipperData" :key="index" class="go-d-block" /> | ||
| 17 | </n-space> | 6 | </n-space> |
| 18 | </template> | 7 | </template> |
| 19 | 8 | ||
| 20 | <script setup lang="ts"> | 9 | <script setup lang="ts"> |
| 21 | -import { PropType, toRefs, watch, ref } from 'vue' | 10 | +import { PropType, toRefs, watch, ref, computed, unref } from 'vue' |
| 22 | import { CreateComponentType } from '@/packages/index.d' | 11 | import { CreateComponentType } from '@/packages/index.d' |
| 23 | import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore' | 12 | import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore' |
| 24 | import { useChartDataFetch } from '@/hooks' | 13 | import { useChartDataFetch } from '@/hooks' |
| 25 | import { Flipper } from '@/components/Pages/Flipper' | 14 | import { Flipper } from '@/components/Pages/Flipper' |
| 26 | import { OptionType } from './config' | 15 | import { OptionType } from './config' |
| 16 | +import { RequestContentTypeEnum } from '@/enums/external/httpEnum' | ||
| 17 | +import { useTargetData } from '@/views/chart/ContentConfigurations/components/hooks/useTargetData.hook' | ||
| 27 | 18 | ||
| 28 | const props = defineProps({ | 19 | const props = defineProps({ |
| 29 | chartConfig: { | 20 | chartConfig: { |
| @@ -34,6 +25,37 @@ const props = defineProps({ | @@ -34,6 +25,37 @@ const props = defineProps({ | ||
| 34 | 25 | ||
| 35 | const { w, h } = toRefs(props.chartConfig.attr) | 26 | const { w, h } = toRefs(props.chartConfig.attr) |
| 36 | 27 | ||
| 28 | +const { targetData, chartEditStore } = useTargetData() | ||
| 29 | + | ||
| 30 | +const isWebsocket = computed(() => { | ||
| 31 | + const result = query(chartEditStore.getComponentList) | ||
| 32 | + if (result === false) return false | ||
| 33 | + | ||
| 34 | + if (result.id === targetData.value.id) | ||
| 35 | + return targetData.value.request.requestContentType as RequestContentTypeEnum === RequestContentTypeEnum.WEB_SOCKET | ||
| 36 | + else { | ||
| 37 | + return result.request.requestContentType as RequestContentTypeEnum === RequestContentTypeEnum.WEB_SOCKET | ||
| 38 | + } | ||
| 39 | +}) | ||
| 40 | + | ||
| 41 | +function query(list: CreateComponentType[]) { | ||
| 42 | + if (!list || !list?.length) return false | ||
| 43 | + | ||
| 44 | + for (const item of list) { | ||
| 45 | + if (item.id === targetData.value.id) { | ||
| 46 | + return item | ||
| 47 | + } | ||
| 48 | + if (item.groupList && item.groupList?.length) { | ||
| 49 | + const flag = query(list) | ||
| 50 | + if (flag) { | ||
| 51 | + return item | ||
| 52 | + } | ||
| 53 | + } | ||
| 54 | + } | ||
| 55 | + | ||
| 56 | + return false | ||
| 57 | +} | ||
| 58 | + | ||
| 37 | const { | 59 | const { |
| 38 | flipperLength, | 60 | flipperLength, |
| 39 | flipperBgColor, | 61 | flipperBgColor, |
| @@ -75,6 +97,7 @@ watch( | @@ -75,6 +97,7 @@ watch( | ||
| 75 | ) | 97 | ) |
| 76 | 98 | ||
| 77 | useChartDataFetch(props.chartConfig, useChartEditStore, (newVal: string | number) => { | 99 | useChartDataFetch(props.chartConfig, useChartEditStore, (newVal: string | number) => { |
| 100 | + if (unref(isWebsocket)) return | ||
| 78 | updateDatasetHandler(newVal) | 101 | updateDatasetHandler(newVal) |
| 79 | }) | 102 | }) |
| 80 | </script> | 103 | </script> |