@easyv/config 1.1.6 → 1.1.7

package/src/animation.js

@@ -1,256 +1,257 @@
-import { multiColor, font } from './';
-const animation = {
-  show: false,
-  duration: 3,
-  interval: 3,
-};
-export default ({
-  show = animation.show,
-  duration = animation.duration,
-  interval = animation.interval,
-} = animation) => ({
-  name: 'animation',
-  displayName: '轮播动画',
-  value: [
-    {
-      name: 'show',
-      displayName: '打开',
-      value: show,
-      type: 'boolean',
-    },
-    {
-      rule: [['show', '$eq', true]],
-      name: 'duration',
-      displayName: '滚动时长',
-      value: duration,
-      type: 'number',
-      config: {
-        span: 12,
-        suffix: 's',
-      },
-    },
-    {
-      rule: [['show', '$eq', true]],
-      name: 'interval',
-      displayName: '间隔时长',
-      value: interval,
-      type: 'number',
-      config: {
-        span: 12,
-        suffix: 's',
-      },
-    },
-  ],
-});
-
-const defaultDataAnimation = {
-  show: false,
-  duration: 3,
-};
-export const dataAnimation = ({
-  show = defaultDataAnimation.show,
-  duration = defaultDataAnimation.duration,
-} = defaultDataAnimation) => ({
-  name: 'dataAnimation',
-  displayName: '数据动画',
-  value: [
-    {
-      name: 'show',
-      displayName: '打开',
-      value: show,
-      type: 'boolean',
-    },
-    {
-      rule: [['show', '$eq', true]],
-      name: 'duration',
-      displayName: '滚动时长',
-      value: duration,
-      type: 'number',
-      config: {
-        span: 12,
-        suffix: 's',
-      },
-    },
-  ],
-});
-
-const defaultAnimationOfPie = {
-  show: true,
-  current: { heighten: 10, opacity: 60 },
-  interval: 3,
-  interactive: '',
-};
-export const animationOfPie = ({
-  show = defaultAnimationOfPie.show,
-  current: {
-    heighten = defaultAnimationOfPie.current.heighten,
-    opacity = defaultAnimationOfPie.current.opacity,
-  } = defaultAnimationOfPie.current,
-  interval = defaultAnimationOfPie.interval,
-  interactive = defaultAnimationOfPie.interactive,
-} = defaultAnimationOfPie) => ({
-  name: 'animation',
-  displayName: '轮播动画',
-  value: [
-    {
-      name: 'on',
-      displayName: '开启',
-      value: show,
-      type: 'boolean',
-    },
-    {
-      rule: [['on', '$eq', true]],
-      name: 'current',
-      displayName: '当前值',
-      value: [
-        {
-          name: 'heighten',
-          displayName: '高度增长',
-          value: heighten,
-          type: 'number',
-        },
-        {
-          name: 'opacity',
-          displayName: '透明度',
-          value: opacity,
-          type: 'range',
-          config: {
-            min: 0,
-            max: 100,
-            suffix: '%',
-          },
-        },
-      ],
-      config: {
-        defaultOpen: true,
-      },
-    },
-    {
-      rule: [['on', '$eq', true]],
-      name: 'interval',
-      displayName: '间隔时长',
-      value: interval,
-      type: 'number',
-      config: {
-        suffix: 's',
-      },
-    },
-    {
-      tip: '选择点击或悬浮，鼠标点击/悬浮各数据块时停止轮播仅显示当前数据信息',
-      rule: [['on', '$eq', true]],
-      name: 'interactive',
-      displayName: '交互方式',
-      value: interactive,
-      type: 'radio',
-      config: {
-        options: [
-          { name: '无', value: '' },
-          { name: '点击', value: 'click' },
-          { name: '悬停', value: 'hover' },
-        ],
-      },
-    },
-  ],
-});
-
-const defaultAnimationOfCarousel = {
-  show: true,
-  current: {
-    width: 0.1,
-    color: multiColor(),
-    font: font(),
-    gap: 15,
-  },
-  interval: 3,
-  rotate: 30,
-  interactive: true,
-};
-export const animationOfCarousel = ({
-  show = defaultAnimationOfCarousel.show,
-  current: {
-    width = defaultAnimationOfCarousel.current.width,
-    color = defaultAnimationOfCarousel.current.color,
-    textStyle = defaultAnimationOfCarousel.current.font,
-    gap = defaultAnimationOfCarousel.current.gap,
-  } = defaultAnimationOfCarousel.current,
-  interval = defaultAnimationOfCarousel.interval,
-  rotate = defaultAnimationOfCarousel.rotate,
-  interactive = defaultAnimationOfCarousel.interactive,
-} = defaultAnimationOfCarousel) => ({
-  name: 'animation',
-  displayName: '轮播动画',
-  value: [
-    {
-      name: 'on',
-      displayName: '开启',
-      value: show,
-      type: 'boolean',
-    },
-    {
-      rule: [['on', '$eq', true]],
-      name: 'current',
-      displayName: '当前值',
-      value: [
-        {
-          name: 'width',
-          displayName: '弧宽增长',
-          value: width,
-          type: 'number',
-        },
-        {
-          name: 'color',
-          displayName: '颜色',
-          value: multiColor(color),
-          type: 'multicolor',
-        },
-        {
-          name: 'textStyle',
-          displayName: '类目文本样式',
-          value: font(textStyle),
-          type: 'textStyle',
-          markColorType: 'textColor',
-        },
-        {
-          name: 'gap',
-          displayName: '类目文本间距',
-          value: gap,
-          type: 'number',
-          config: {
-            suffix: 'px',
-          },
-        },
-      ],
-      config: {
-        defaultOpen: true,
-      },
-    },
-    {
-      rule: [['on', '$eq', true]],
-      name: 'interval',
-      displayName: '间隔时长',
-      value: interval,
-      type: 'number',
-      config: {
-        suffix: 's',
-      },
-    },
-    {
-      rule: [['on', '$eq', true]],
-      name: 'rotate',
-      displayName: '旋转',
-      value: rotate,
-      type: 'number',
-      config: {
-        min: 0,
-        max: 360,
-        suffix: '°',
-      },
-    },
-    {
-      name: 'interactive',
-      displayName: '点击交互',
-      value: interactive,
-      type: 'boolean',
-    },
-  ],
-});
+import { multiColor, font } from './';
+const animation = {
+  show: false,
+  duration: 3,
+  interval: 3,
+};
+export default ({
+  show = animation.show,
+  duration = animation.duration,
+  interval = animation.interval,
+} = animation) => ({
+  name: 'animation',
+  displayName: '轮播动画',
+  type: 'group',
+  value: [
+    {
+      name: 'show',
+      displayName: '打开',
+      value: show,
+      type: 'boolean',
+    },
+    {
+      rule: [['show', '$eq', true]],
+      name: 'duration',
+      displayName: '滚动时长',
+      value: duration,
+      type: 'number',
+      config: {
+        span: 12,
+        suffix: 's',
+      },
+    },
+    {
+      rule: [['show', '$eq', true]],
+      name: 'interval',
+      displayName: '间隔时长',
+      value: interval,
+      type: 'number',
+      config: {
+        span: 12,
+        suffix: 's',
+      },
+    },
+  ],
+});
+
+const defaultDataAnimation = {
+  show: false,
+  duration: 3,
+};
+export const dataAnimation = ({
+  show = defaultDataAnimation.show,
+  duration = defaultDataAnimation.duration,
+} = defaultDataAnimation) => ({
+  name: 'dataAnimation',
+  displayName: '数据动画',
+  value: [
+    {
+      name: 'show',
+      displayName: '打开',
+      value: show,
+      type: 'boolean',
+    },
+    {
+      rule: [['show', '$eq', true]],
+      name: 'duration',
+      displayName: '滚动时长',
+      value: duration,
+      type: 'number',
+      config: {
+        span: 12,
+        suffix: 's',
+      },
+    },
+  ],
+});
+
+const defaultAnimationOfPie = {
+  show: true,
+  current: { heighten: 10, opacity: 60 },
+  interval: 3,
+  interactive: '',
+};
+export const animationOfPie = ({
+  show = defaultAnimationOfPie.show,
+  current: {
+    heighten = defaultAnimationOfPie.current.heighten,
+    opacity = defaultAnimationOfPie.current.opacity,
+  } = defaultAnimationOfPie.current,
+  interval = defaultAnimationOfPie.interval,
+  interactive = defaultAnimationOfPie.interactive,
+} = defaultAnimationOfPie) => ({
+  name: 'animation',
+  displayName: '轮播动画',
+  value: [
+    {
+      name: 'on',
+      displayName: '开启',
+      value: show,
+      type: 'boolean',
+    },
+    {
+      rule: [['on', '$eq', true]],
+      name: 'current',
+      displayName: '当前值',
+      value: [
+        {
+          name: 'heighten',
+          displayName: '高度增长',
+          value: heighten,
+          type: 'number',
+        },
+        {
+          name: 'opacity',
+          displayName: '透明度',
+          value: opacity,
+          type: 'range',
+          config: {
+            min: 0,
+            max: 100,
+            suffix: '%',
+          },
+        },
+      ],
+      config: {
+        defaultOpen: true,
+      },
+    },
+    {
+      rule: [['on', '$eq', true]],
+      name: 'interval',
+      displayName: '间隔时长',
+      value: interval,
+      type: 'number',
+      config: {
+        suffix: 's',
+      },
+    },
+    {
+      tip: '选择点击或悬浮，鼠标点击/悬浮各数据块时停止轮播仅显示当前数据信息',
+      rule: [['on', '$eq', true]],
+      name: 'interactive',
+      displayName: '交互方式',
+      value: interactive,
+      type: 'radio',
+      config: {
+        options: [
+          { name: '无', value: '' },
+          { name: '点击', value: 'click' },
+          { name: '悬停', value: 'hover' },
+        ],
+      },
+    },
+  ],
+});
+
+const defaultAnimationOfCarousel = {
+  show: true,
+  current: {
+    width: 0.1,
+    color: multiColor(),
+    font: font(),
+    gap: 15,
+  },
+  interval: 3,
+  rotate: 30,
+  interactive: true,
+};
+export const animationOfCarousel = ({
+  show = defaultAnimationOfCarousel.show,
+  current: {
+    width = defaultAnimationOfCarousel.current.width,
+    color = defaultAnimationOfCarousel.current.color,
+    textStyle = defaultAnimationOfCarousel.current.font,
+    gap = defaultAnimationOfCarousel.current.gap,
+  } = defaultAnimationOfCarousel.current,
+  interval = defaultAnimationOfCarousel.interval,
+  rotate = defaultAnimationOfCarousel.rotate,
+  interactive = defaultAnimationOfCarousel.interactive,
+} = defaultAnimationOfCarousel) => ({
+  name: 'animation',
+  displayName: '轮播动画',
+  value: [
+    {
+      name: 'on',
+      displayName: '开启',
+      value: show,
+      type: 'boolean',
+    },
+    {
+      rule: [['on', '$eq', true]],
+      name: 'current',
+      displayName: '当前值',
+      value: [
+        {
+          name: 'width',
+          displayName: '弧宽增长',
+          value: width,
+          type: 'number',
+        },
+        {
+          name: 'color',
+          displayName: '颜色',
+          value: multiColor(color),
+          type: 'multicolor',
+        },
+        {
+          name: 'textStyle',
+          displayName: '类目文本样式',
+          value: font(textStyle),
+          type: 'textStyle',
+          markColorType: 'textColor',
+        },
+        {
+          name: 'gap',
+          displayName: '类目文本间距',
+          value: gap,
+          type: 'number',
+          config: {
+            suffix: 'px',
+          },
+        },
+      ],
+      config: {
+        defaultOpen: true,
+      },
+    },
+    {
+      rule: [['on', '$eq', true]],
+      name: 'interval',
+      displayName: '间隔时长',
+      value: interval,
+      type: 'number',
+      config: {
+        suffix: 's',
+      },
+    },
+    {
+      rule: [['on', '$eq', true]],
+      name: 'rotate',
+      displayName: '旋转',
+      value: rotate,
+      type: 'number',
+      config: {
+        min: 0,
+        max: 360,
+        suffix: '°',
+      },
+    },
+    {
+      name: 'interactive',
+      displayName: '点击交互',
+      value: interactive,
+      type: 'boolean',
+    },
+  ],
+});