index.config.ts 2.21 KB
import { FormFieldsEnum, defaultFlowmetmerColorConfig } from './form.config'
import { isLightboxMode } from '@/utils/env'
import type { FlowMeterColorItemType } from '@/api/node/model'

export function getSetValue(value: number) {
  return [
    value / 100,
    (value - 10) / 100,
    (value - 20) / 100,
  ]
}
export const setOption = (value: number = 40, circularFlowMeterOption: FlowMeterColorItemType[] = defaultFlowmetmerColorConfig) => {
  const colorMap = (isLightboxMode() ? circularFlowMeterOption : defaultFlowmetmerColorConfig).reduce((prev, next) => ({ ...prev, [next.key]: next.value }), {} as Record<FormFieldsEnum, string>)
  return {
    series: [
      {
        type: 'liquidFill',
        radius: '90%',
        data: getSetValue(value),
        color: [colorMap[FormFieldsEnum.COLOR_FIRST], colorMap[FormFieldsEnum.COLOR_SECOND], colorMap[FormFieldsEnum.COLOR_THIRD]],
        itemStyle: {
          opacity: 0.6,
        },
        backgroundStyle: {
          borderWidth: 1,
          color: colorMap[FormFieldsEnum.BACKGROUND], // 这里设置背景色
        },
        emphasis: {
          itemStyle: {
            opacity: 0.9,
          },
        },
        label: {
          color: '#fff',
          insideColor: '#f7e8c1',
          left: '50%',
          top: '40%',
          textAlign: 'center',
          fontSize: 20,
          fontWeight: 600,
          textBorderColor: 'rgba(0, 0, 0, 0)',
          textShadowColor: '#000',
          textShadowBlur: 0,
          textShadowOffsetX: 0,
          textShadowOffsetY: 1,
        },

        outline: {
          show: true,
          borderDistance: 1,
          itemStyle: {
            borderWidth: 0,
            color: {
              type: 'linear',
              x: 0,
              y: 0,
              x2: 1,
              y2: 0,
              colorStops: [
                {
                  offset: 0,
                  color: '#0b2355', // 这里设置水球外边框 0% 处的颜色
                },
                {
                  offset: 1,
                  color: '#195b9d', // 这里设置水球外边框 100% 处的颜色
                },
              ],
              global: false,
            },
          },
        },
      },
    ],
  }
}