st-comp 0.0.277 → 0.0.279

package/packages/FactorWarning/tools.js

@@ -1,10 +0,0 @@
-export const defaultShowConfig = {
-  // 表单字段
-  ruleFormPrice: true, // 价格范围
-  ruleFormMark: true, // 备注
-  // 表格字段
-  tableStatus: true, // 状态
-  tableCreateTime: true, // 设置时间
-  tableMark: true, // 备注
-  tableEnable: true, // 启用按钮
-};

package/packages/HeatMap/index.ts

@@ -1,8 +0,0 @@
-import { App } from "vue";
-import StHeatMap from "./index.vue";
-
-export default {
-  install(app: App) {
-    app.component("st-heatMap", StHeatMap);
-  },
-}

package/packages/HeatMap/index.vue

@@ -1,141 +0,0 @@
-<template>
-  <div
-    ref="chartRef"
-    class="chart"
-  ></div>
-</template>
-
-<script setup lang="ts">
-  import { ref, onMounted, onUnmounted, computed, watch } from "vue"
-  import * as echarts from 'echarts'
-  import type { EChartsType } from 'echarts'
-  
-  const defaultConfig = {
-    tooltipFormatter: null,
-    dataZoom: null,
-    grid: {
-      left: '60px',
-      bottom: '20px',
-      right: '0',
-      top: 0
-    }
-  }
-  let chart: EChartsType
-  let resizeRo: any
-
-  const props = defineProps({
-    data: {
-      type: Object,
-      default: () => ({}),
-    }, // 数据
-    config: {
-      type: Object,
-      default: () => ({})
-    }
-  })
-
-  const chartRef = ref<HTMLElement>()
-
-  const mergeConfig = computed(() => ({ ...defaultConfig, ...props.config }))
-
-  watch(
-    () => [props.data],
-    () => {
-      draw()
-    },
-    { deep: true }
-  )
-
-  onMounted(() => {
-    chart = echarts.init(chartRef.value)
-    draw()
-    // 绑定resize事件
-    let isFirst: boolean | null = true
-    resizeRo = new ResizeObserver(() => {
-      if (isFirst) {
-        isFirst = null
-        return
-      }
-      chart.resize()
-    })
-    resizeRo.observe(chartRef.value)
-  })
-
-  onUnmounted(() => {
-    chart.dispose()
-    resizeRo.disconnect()
-    resizeRo = null
-  })
-
-  const draw = () => {
-    chart.setOption(
-      {
-        tooltip: {
-          confine: true,
-          formatter: mergeConfig.value.tooltipFormatter ? (info: any) => {
-            return (mergeConfig.value.tooltipFormatter as Function)(info, props.data)
-          }: null,
-        },
-        grid: mergeConfig.value.grid,
-        xAxis: {
-          type: "category",
-          data: props.data.date,
-        },
-        yAxis: {
-          type: "category",
-          inverse: true,
-          data: props.data.data.map((i: any) => i.name),
-        },
-        visualMap: {
-          type: 'piecewise', // 类型: 分段式[piecewise] | 连续形[continuous]
-          show: false,
-          inRange: [],
-        },
-        dataZoom: mergeConfig.value.dataZoom,
-        series: [
-          {
-            name: "热力图",
-            type: "heatmap",
-            info: props.data,
-            data: props.data.data.reduce((res: any[], item: any, index: number) => {
-              return [
-                ...res,
-                ...item.data.reduce((res: any[], i: any, iIndex: number) => {
-                  if (i === null) {
-                    return res
-                  }
-                  return [
-                    ...res,
-                    {
-                      value: [iIndex, index, i.value],
-                      itemStyle: {
-                        color: i.color
-                      },
-                    }
-                  ]
-                }, [])
-              ]
-            }, []),
-            label: {
-              show: false, // 是否展示方块格上的数字
-            },
-          },
-        ],
-      }
-    )
-  }
-
-  defineExpose({
-    reset: () => {
-      draw()
-    }, // 重置
-  })
-</script>
-
-<style lang="scss" scoped>
-.chart {
-  width: 100%;
-  height: 100%;
-  overflow: hidden;
-}
-</style>

package/packages/Kline/components/Contextmenu/index.vue

@@ -1,110 +0,0 @@
-<!-- 右键菜单组件 -->
-<template>
-  <div
-    ref="contextmenuRef"
-    class="contextmenu"
-    @contextmenu="openContextMenuContent"
-    @mouseleave="closeContextMenuContent"
-  >
-    <slot />
-    <div
-      ref="contextmenuContentRef"
-      v-if="contextmenuContentStyle.display !== 'none'"
-      class="contextmenu-popover"
-      :style="contextmenuContentStyle"
-    >
-      <slot name="popover" />
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-  import { ref, nextTick } from 'vue'
-
-  // 接收传入的自定义事件函数
-  const emits = defineEmits(['closeContextMenuCallBack'])
-
-  // 组件Ref
-  const contextmenuRef = ref()
-
-  // 悬浮菜单Ref
-  const contextmenuContentRef = ref()
-  // 悬浮菜单样式
-  const contextmenuContentStyle = ref({
-    display: 'none',
-    top: '0px',
-    left: '0px',
-  })
-
-  /**
-   * @description: 关闭悬浮菜单
-   * @todo: 支持触发传入的回调函数
-   */
-  const closeContextMenuContent = () => {
-    contextmenuContentStyle.value.display = 'none'
-    emits('closeContextMenuCallBack')
-    document.removeEventListener('click', closeContextMenuContent)
-  }
-
-  /**
-   * @description: 右键点击
-   * @todo: 打开悬浮菜单
-   */
-  const openContextMenuContent = (el: MouseEvent) => {
-    // 1.阻止默认事件 + 冒泡
-    el.preventDefault()
-    el.stopPropagation()
-    /**
-     * @todo: 解决在悬浮菜单已经打开时,右键菜单项,重复触发本函数导致菜单位置异常问题
-     */
-    if (contextmenuContentStyle.value.display === 'block') {
-      // 判断鼠标位置是否在悬浮菜单内,如果是,则return,否则继续执行在新的位置打开
-      const { offsetX, offsetY } = el // 鼠标
-      const { offsetWidth, offsetHeight } = contextmenuContentRef.value
-      if (offsetX <= offsetWidth && offsetY <= offsetHeight) {
-        return
-      }
-    }
-    contextmenuRef.value.click()
-    // 2.初始化展示悬浮菜单位置
-    contextmenuContentStyle.value = {
-      display: 'block',
-      top: `${el.offsetY}px`,
-      left: `${el.offsetX}px`,
-    }
-    // 3.计算悬浮菜单是否超出范围
-    nextTick(() => {
-      const { bottom, height, right, width } = contextmenuContentRef.value.getBoundingClientRect()
-      if (bottom > window.innerHeight) {
-        // 高度超出
-        contextmenuContentStyle.value = {
-          display: 'block',
-          top: `${el.offsetY - height}px`,
-          left: `${el.offsetX}px`,
-        }
-      } else if (right > window.innerWidth) {
-        // 宽度超出
-        contextmenuContentStyle.value = {
-          display: 'block',
-          top: `${el.offsetY}px`,
-          left: `${el.offsetX - width}px`,
-        }
-      }
-    })
-    // 4.监听点击事件 -> 调用关闭悬浮菜单事件
-    document.addEventListener('click', closeContextMenuContent)
-  }
-</script>
-
-<style lang="scss" scoped>
-  .contextmenu {
-    position: relative;
-    width: 100%;
-    height: 100%;
-    &-popover {
-      position: absolute;
-      z-index: 10;
-      display: none;
-    }
-  }
-</style>

package/packages/Kline/components/Tips/index.vue

@@ -1,40 +0,0 @@
-<template>
-  <div class="st-kline-tips">
-    <div class="st-kline-tips-row">
-      <div
-        v-for="item in data"
-        class="st-kline-tips-row-item"
-        :style="{ color: item.color }"
-      >
-        {{ item.label }} {{ item.value }}
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-  interface dataType {
-    label: string
-    value: any
-    color: string
-  }
-  const props = defineProps({
-    // 提示数据
-    data: {
-      type: Array as () => dataType[],
-      default: () => [],
-    },
-  })
-</script>
-
-<style lang="scss" scoped>
-  .st-kline-tips {
-    font-size: 12px;
-    &-row {
-      &-item {
-        display: inline-block;
-        margin-right: 10px;
-      }
-    }
-  }
-</style>

package/packages/Kline/componentsNew/KlineSlide/index.vue

@@ -1,155 +0,0 @@
-<template>
-  <div class="klineSlide" ref="slideChartRef"></div>
-</template>
-
-<script setup>
-import { ref, watch, onMounted, onUnmounted } from 'vue'
-import * as echarts from 'echarts'
-
-let slideChart
-let resizeRo // dom元素监听事件
-let slideDataZoomTimer = null // 滑动图数据缩放定时器
-
-const emit = defineEmits(['change'])
-const props = defineProps({
-  data: { type: Array, default: () => [] }, // 时间数据
-})
-
-const slideChartRef = ref() // 拖动轴
-
-watch(
-  () => props.data,
-  () => {
-    draw()
-  },
-  { deep: true },
-)
-
-onMounted(() => {
-  slideChart = echarts.init(slideChartRef.value)
-  addEventListener()
-  draw()
-  // 绑定resize事件
-  let isFirst = true
-  resizeRo = new ResizeObserver(() => {
-    if (isFirst) {
-      isFirst = null
-      return
-    }
-    slideChart.resize()
-  })
-  resizeRo.observe(slideChartRef.value)
-})
-
-onUnmounted(() => {
-  slideChart.off("datazoom");
-  slideChart.dispose()
-  resizeRo.disconnect()
-  resizeRo = null
-})
-
-// 绑定事件
-const addEventListener = () => {
-  slideChart.on('datazoom', params => {
-    if(!params.dataZoomId) return
-    clearTimeout(slideDataZoomTimer)
-    slideDataZoomTimer = setTimeout(() => {
-      const { data } = props
-      const { start, end } = params
-      const startIndex = Math.floor(start * data.length / 100)
-      const endIndex = end === 100 ? data.length - 1 : Math.floor(end * data.length / 100)
-      change(startIndex, endIndex)
-      clearTimeout(slideDataZoomTimer)
-    }, 100)
-  })
-}
-
-// 拖动回调
-const change = (startIndex, endIndex) => {
-  const data = props.data
-  if (data.length === 0) return
-  const startTime = data[startIndex][0].split(' ')[0]
-  const endTime = data[endIndex][0].split(' ')[0]
-  emit('change', {
-    startTime: `${startTime} 00:00:00`,
-    endTime: `${endTime} 24:00:00`,
-  })
-}
-
-const draw = () => {
-  const { data } = props
-  if(data.length === 0) return
-  const xAxisData = data.map(item => item[0].split(' ')[0])
-  const lineData = data.map(item => item[1])
-  slideChart.setOption({
-    grid: {
-      height: 0,
-      left: '80px',
-      right: '80px',
-    },
-    xAxis: {
-      type: 'category',
-      data: xAxisData,
-      show: false,
-    },
-    yAxis: {
-      type: 'value'
-    },
-    series: [
-      {
-        data: lineData,
-        type: 'line'
-      }
-    ]
-  }, true)
-}
-
-defineExpose({
-  resetSlide: (startTime, endTime, maxValueSpan) => {
-    let slideStartIndex = -1
-    let slideEndIndex = -1
-    props.data.forEach((item, index) => {
-      if (slideStartIndex === -1 && item[0] === startTime) {
-        slideStartIndex = index
-      } else if (slideStartIndex === -1 && new Date(item[0]) > new Date(startTime)) {
-        slideStartIndex = index - 1
-      }
-      if (slideEndIndex === -1 && item[0] === endTime) {
-        slideEndIndex = index
-      } else if (slideEndIndex === -1 && new Date(item[0]) > new Date(endTime)) {
-        slideEndIndex = index
-      }
-    })
-    slideEndIndex = slideEndIndex === -1 ? props.data.length - 1 : slideEndIndex
-    slideChart.setOption({
-      dataZoom: [
-        {
-          show: true,
-          startValue: slideStartIndex,
-          endValue: slideEndIndex,
-          maxValueSpan,
-          textStyle: {
-            color: '#ccc',
-          }
-        },
-        {
-          type: 'inside',
-          startValue: slideStartIndex,
-          endValue: slideEndIndex,
-          maxValueSpan,
-        }
-      ],
-    })
-  }, // 重置
-  resize: () => {
-    slideChart?.resize()
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-.klineSlide {
-  width: 100%;
-  height: 50px;
-}
-</style>