bi-sdk-react 0.0.78 → 0.0.79

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/es/js/bi-sdk.es.js +74 -69
  2. package/dist/umd/js/bi-sdk.umd.min.js +47 -42
  3. package/package.json +1 -1
  4. package/src/components/layout/PageItem.tsx +4 -0
  5. package/src/components/plugins/@antd/item-props/EchartsProps.tsx +653 -171
package/src/components/plugins/@antd/item-props/EchartsProps.tsx CHANGED
@@ -27,6 +27,7 @@ import {
27
27
  Radio,
28
28
  Row,
29
29
  Select,
30
+ Slider,
30
31
  Space,
31
32
  Switch,
32
33
  Tooltip,
@@ -69,10 +70,15 @@ const ChartTypeRadio = styled(Radio.Group)`
69
70
 
70
71
  .anticon {
71
72
  font-size: 28px;
73
+ color: var(--ant-color-primary);
72
74
  }
73
75
  }
76
+
77
+ &-checked .anticon {
78
+ color: #ffffff!important;
79
+ }
74
80
  }
75
- `
81
+ `;
76
82
 
77
83
  export type EchartsModel = { script: string; height?: number };
78
84
 
@@ -789,6 +795,7 @@ export const EchartsProps: React.FC<PropEditorProps<EchartsModel>> = ({
789
795
  title: { textStyle: { color: v.toHexString() } },
790
796
  })
791
797
  }
798
+ allowClear={true}
792
799
  />
793
800
  </Space.Compact>
794
801
  <Space.Compact size="small" style={{ width: "100%" }}>
@@ -837,6 +844,7 @@ export const EchartsProps: React.FC<PropEditorProps<EchartsModel>> = ({
837
844
  title: { subtextStyle: { color: v.toHexString() } },
838
845
  })
839
846
  }
847
+ allowClear={true}
840
848
  />
841
849
  </Space.Compact>
842
850
  {positionRender("title")}
@@ -1008,6 +1016,7 @@ export const EchartsProps: React.FC<PropEditorProps<EchartsModel>> = ({
1008
1016
  grid: { backgroundColor: e.toHexString() },
1009
1017
  })
1010
1018
  }
1019
+ allowClear={true}
1011
1020
  />
1012
1021
  </Form.Item>
1013
1022
  <Form.Item
@@ -1023,6 +1032,7 @@ export const EchartsProps: React.FC<PropEditorProps<EchartsModel>> = ({
1023
1032
  grid: { borderColor: e.toHexString() },
1024
1033
  })
1025
1034
  }
1035
+ allowClear={true}
1026
1036
  />
1027
1037
  </Form.Item>
1028
1038
  <Form.Item
@@ -1447,6 +1457,7 @@ export const EchartsProps: React.FC<PropEditorProps<EchartsModel>> = ({
1447
1457
  tooltip: { backgroundColor: v.toHexString() },
1448
1458
  })
1449
1459
  }
1460
+ allowClear={true}
1450
1461
  />
1451
1462
  </Form.Item>
1452
1463
  <Form.Item
@@ -1462,6 +1473,7 @@ export const EchartsProps: React.FC<PropEditorProps<EchartsModel>> = ({
1462
1473
  tooltip: { borderColor: v.toHexString() },
1463
1474
  })
1464
1475
  }
1476
+ allowClear={true}
1465
1477
  />
1466
1478
  </Form.Item>
1467
1479
  <Form.Item
@@ -1521,176 +1533,646 @@ export const EchartsProps: React.FC<PropEditorProps<EchartsModel>> = ({
1521
1533
  </Space>
1522
1534
  ),
1523
1535
  },
1524
- // {
1525
- // key: "series",
1526
- // label: "系列",
1527
- // collapsible: "icon",
1528
- // extra: (
1529
- // <Select
1530
- // size="small"
1531
- // options={(parseConfig?.series || []).map(
1532
- // (item: any, index: number) => ({
1533
- // label: item.name || `系列 ${index + 1}`,
1534
- // value: index,
1535
- // }),
1536
- // )}
1537
- // value={selectSeries}
1538
- // onChange={(v) => setSelectSeries(v)}
1539
- // style={{ width: 120 }}
1540
- // />
1541
- // ),
1542
- // children: (
1543
- // <Space vertical style={{ width: "100%" }}>
1544
- // <ChartTypeRadio
1545
- // size="small"
1546
- // optionType="button"
1547
- // buttonStyle="solid"
1548
- // value={parseConfig?.series[selectSeries]?.type || "line"}
1549
- // onChange={(e) =>
1550
- // transformReturn({ series: { type: e.target.value } })
1551
- // }
1552
- // options={[
1553
- // { label: <Flex><IconFont type="icon-chart-line" />折线图</Flex>, value: "line" },
1554
- // { label: <Flex><IconFont type="icon-chart-bar" />柱状图</Flex>, value: "bar" },
1555
- // { label: <Flex><IconFont type="icon-chart-candlestick" />K线图</Flex>, value: "candlestick" },
1556
- // { label: <Flex><IconFont type="icon-chart-scatter" />散点图</Flex>, value: "scatter" },
1557
- // { label: <Flex><IconFont type="icon-map" />地图</Flex>, value: "map" },
1558
- // { label: <Flex><IconFont type="icon-chart-pie" />饼图</Flex>, value: "pie" },
1559
- // { label: <Flex><IconFont type="icon-chart-gauge" />仪表盘</Flex>, value: "gauge" },
1560
- // { label: <Flex><IconFont type="icon-chart-funnel" />漏斗图</Flex>, value: "funnel" },
1561
- // { label: <Flex><IconFont type="icon-chart-radar" />雷达图</Flex>, value: "radar" },
1562
- // ]}
1563
- // />
1564
- // <Form.Item
1565
- // label="触发类型"
1566
- // labelCol={{ span: 6 }}
1567
- // wrapperCol={{ span: 18 }}
1568
- // >
1569
- // <Radio.Group
1570
- // size="small"
1571
- // optionType="button"
1572
- // buttonStyle="solid"
1573
- // value={parseConfig?.tooltip?.trigger || "item"}
1574
- // onChange={(e) =>
1575
- // transformReturn({ tooltip: { trigger: e.target.value } })
1576
- // }
1577
- // options={[
1578
- // { label: "item", value: "item" },
1579
- // { label: "axis", value: "axis" },
1580
- // { label: "none", value: "none" },
1581
- // ]}
1582
- // />
1583
- // </Form.Item>
1584
- // <Form.Item
1585
- // label="触发条件"
1586
- // labelCol={{ span: 6 }}
1587
- // wrapperCol={{ span: 18 }}
1588
- // >
1589
- // <Radio.Group
1590
- // size="small"
1591
- // optionType="button"
1592
- // buttonStyle="solid"
1593
- // value={parseConfig?.tooltip?.triggerOn || "item"}
1594
- // onChange={(e) =>
1595
- // transformReturn({
1596
- // tooltip: { triggerOn: e.target.value },
1597
- // })
1598
- // }
1599
- // options={[
1600
- // { label: "移动", value: "mousemove" },
1601
- // { label: "点击", value: "click" },
1602
- // { label: "移动或点击", value: "mousemove|click" },
1603
- // { label: "无", value: "none" },
1604
- // ]}
1605
- // />
1606
- // </Form.Item>
1607
- // <Form.Item
1608
- // label="背景颜色"
1609
- // labelCol={{ span: 12 }}
1610
- // wrapperCol={{ span: 12 }}
1611
- // >
1612
- // <ColorPicker
1613
- // size="small"
1614
- // value={parseConfig?.tooltip?.backgroundColor}
1615
- // onChange={(v) =>
1616
- // transformReturn({
1617
- // tooltip: { backgroundColor: v.toHexString() },
1618
- // })
1619
- // }
1620
- // />
1621
- // </Form.Item>
1622
- // <Form.Item
1623
- // label="边框颜色"
1624
- // labelCol={{ span: 12 }}
1625
- // wrapperCol={{ span: 12 }}
1626
- // >
1627
- // <ColorPicker
1628
- // size="small"
1629
- // value={parseConfig?.tooltip?.borderColor}
1630
- // onChange={(v) =>
1631
- // transformReturn({
1632
- // tooltip: { borderColor: v.toHexString() },
1633
- // })
1634
- // }
1635
- // />
1636
- // </Form.Item>
1637
- // <Form.Item
1638
- // label="边框宽度"
1639
- // labelCol={{ span: 12 }}
1640
- // wrapperCol={{ span: 12 }}
1641
- // >
1642
- // <InputNumber
1643
- // size="small"
1644
- // value={parseConfig?.tooltip?.borderWidth || 0}
1645
- // min={0}
1646
- // suffix="px"
1647
- // onChange={(v) =>
1648
- // transformReturn({ tooltip: { borderWidth: v } })
1649
- // }
1650
- // />
1651
- // </Form.Item>
1652
- // <Form.Item
1653
- // label="浮层内边距"
1654
- // labelCol={{ span: 12 }}
1655
- // wrapperCol={{ span: 12 }}
1656
- // >
1657
- // <InputNumber
1658
- // size="small"
1659
- // value={parseConfig?.tooltip?.padding || 5}
1660
- // min={0}
1661
- // suffix="px"
1662
- // onChange={(v) =>
1663
- // transformReturn({ tooltip: { padding: v } })
1664
- // }
1665
- // />
1666
- // </Form.Item>
1667
- // <Form.Item
1668
- // label="内容格式器"
1669
- // layout="vertical"
1670
- // tooltip={
1671
- // <div>
1672
- // {`模板变量有 {a}, {b}，{c}，{d}，{e}，分别表示系列名，数据名，数据值等。 在 trigger 为 'axis' 的时候，会有多个系列的数据，此时可以通过 {a0}, {a1}, {a2} 这种后面加索引的方式表示系列的索引。 不同图表类型下的 {a}，{b}，{c}，{d} 含义不一样。 其中变量{a}, {b}, {c}, {d}在不同图表类型下代表数据含义为：`}
1673
- // <ul>
1674
- // <li>{`折线（区域）图、柱状（条形）图、K线图 : {a}（系列名称），{b}（类目值），{c}（数值）, {d}（无）`}</li>
1675
- // <li>{`散点图（气泡）图 : {a}（系列名称），{b}（数据名称），{c}（数值数组）, {d}（无）`}</li>
1676
- // <li>{`地图 : {a}（系列名称），{b}（区域名称），{c}（合并数值）, {d}（无）`}</li>
1677
- // <li>{`饼图、仪表盘、漏斗图: {a}（系列名称），{b}（数据项名称），{c}（数值）, {d}（百分比）`}</li>
1678
- // </ul>
1679
- // </div>
1680
- // }
1681
- // >
1682
- // <Input.TextArea
1683
- // value={parseConfig?.tooltip?.formatter}
1684
- // onChange={(e) =>
1685
- // transformReturn({
1686
- // tooltip: { formatter: e.target.value },
1687
- // })
1688
- // }
1689
- // />
1690
- // </Form.Item>
1691
- // </Space>
1692
- // ),
1693
- // },
1536
+ {
1537
+ key: "series",
1538
+ label: "系列",
1539
+ collapsible: "icon",
1540
+ extra: (
1541
+ <Select
1542
+ size="small"
1543
+ options={(parseConfig?.series || []).map(
1544
+ (item: any, index: number) => ({
1545
+ label: item.name || `系列 ${index + 1}`,
1546
+ value: index,
1547
+ }),
1548
+ )}
1549
+ value={selectSeries}
1550
+ onChange={(v) => setSelectSeries(v)}
1551
+ style={{ width: 120 }}
1552
+ />
1553
+ ),
1554
+ children: (
1555
+ <Space vertical style={{ width: "100%" }}>
1556
+ <ChartTypeRadio
1557
+ size="small"
1558
+ optionType="button"
1559
+ buttonStyle="solid"
1560
+ value={parseConfig?.series?.[selectSeries]?.type || "line"}
1561
+ onChange={(e) =>
1562
+ transformReturn({ series: { type: e.target.value } })
1563
+ }
1564
+ options={[
1565
+ {
1566
+ label: (
1567
+ <Flex>
1568
+ <IconFont type="icon-chart-pie" />
1569
+ 饼图
1570
+ </Flex>
1571
+ ),
1572
+ value: "pie",
1573
+ },
1574
+ {
1575
+ label: (
1576
+ <Flex>
1577
+ <IconFont type="icon-chart-line" />
1578
+ 折线图
1579
+ </Flex>
1580
+ ),
1581
+ value: "line",
1582
+ },
1583
+ {
1584
+ label: (
1585
+ <Flex>
1586
+ <IconFont type="icon-chart-bar" />
1587
+ 柱状图
1588
+ </Flex>
1589
+ ),
1590
+ value: "bar",
1591
+ },
1592
+ {
1593
+ label: (
1594
+ <Flex>
1595
+ <IconFont type="icon-chart-scatter" />
1596
+ 散点图
1597
+ </Flex>
1598
+ ),
1599
+ value: "scatter",
1600
+ },
1601
+ {
1602
+ label: (
1603
+ <Flex>
1604
+ <IconFont type="icon-chart-radar" />
1605
+ 雷达图
1606
+ </Flex>
1607
+ ),
1608
+ value: "radar",
1609
+ },
1610
+ {
1611
+ label: (
1612
+ <Flex>
1613
+ <IconFont type="icon-map" />
1614
+ 地图
1615
+ </Flex>
1616
+ ),
1617
+ value: "map",
1618
+ },
1619
+ {
1620
+ label: (
1621
+ <Flex>
1622
+ <IconFont type="icon-chart-gauge" />
1623
+ 仪表盘
1624
+ </Flex>
1625
+ ),
1626
+ value: "gauge",
1627
+ },
1628
+ {
1629
+ label: (
1630
+ <Flex>
1631
+ <IconFont type="icon-chart-funnel" />
1632
+ 漏斗图
1633
+ </Flex>
1634
+ ),
1635
+ value: "funnel",
1636
+ },
1637
+ {
1638
+ label: (
1639
+ <Flex>
1640
+ <IconFont type="icon-chart-treemap" />
1641
+ treemap
1642
+ </Flex>
1643
+ ),
1644
+ value: "treemap",
1645
+ },
1646
+ {
1647
+ label: (
1648
+ <Flex>
1649
+ <IconFont type="icon-chart-sunburst" />
1650
+ 旭日图
1651
+ </Flex>
1652
+ ),
1653
+ value: "sunburst",
1654
+ },
1655
+ {
1656
+ label: (
1657
+ <Flex>
1658
+ <IconFont type="icon-chart-boxplot" />
1659
+ 箱线图
1660
+ </Flex>
1661
+ ),
1662
+ value: "boxplot",
1663
+ },
1664
+ {
1665
+ label: (
1666
+ <Flex>
1667
+ <IconFont type="icon-chart-candlestick" />
1668
+ K线图
1669
+ </Flex>
1670
+ ),
1671
+ value: "candlestick",
1672
+ },
1673
+ {
1674
+ label: (
1675
+ <Flex>
1676
+ <IconFont type="icon-chart-heatmap" />
1677
+ 热力图
1678
+ </Flex>
1679
+ ),
1680
+ value: "heatmap",
1681
+ },
1682
+ {
1683
+ label: (
1684
+ <Flex>
1685
+ <IconFont type="icon-chart-sankey" />
1686
+ 桑基图
1687
+ </Flex>
1688
+ ),
1689
+ value: "sankey",
1690
+ },
1691
+ {
1692
+ label: (
1693
+ <Flex>
1694
+ <IconFont type="icon-chart-theme-river" />
1695
+ 河流图
1696
+ </Flex>
1697
+ ),
1698
+ value: "themeRiver",
1699
+ },
1700
+ {
1701
+ label: (
1702
+ <Flex>
1703
+ <IconFont type="icon-chart-chord" />
1704
+ 和弦图
1705
+ </Flex>
1706
+ ),
1707
+ value: "chord",
1708
+ },
1709
+ ]}
1710
+ />
1711
+ <Form.Item
1712
+ label="系列名称"
1713
+ labelCol={{ span: 6 }}
1714
+ wrapperCol={{ span: 18 }}
1715
+ >
1716
+ <Input
1717
+ size="small"
1718
+ placeholder="请输入系列名称"
1719
+ value={parseConfig?.series?.[selectSeries]?.name || ""}
1720
+ onChange={(e) =>
1721
+ transformReturn({ series: { name: e.target.value } })
1722
+ }
1723
+ style={{ width: 120 }}
1724
+ />
1725
+ </Form.Item>
1726
+ {["line", "bar"].includes(
1727
+ parseConfig?.series?.[selectSeries]?.type || "",
1728
+ ) && (
1729
+ <>
1730
+ <Form.Item
1731
+ label="堆叠组名"
1732
+ labelCol={{ span: 6 }}
1733
+ wrapperCol={{ span: 18 }}
1734
+ >
1735
+ <Input
1736
+ size="small"
1737
+ placeholder="请输入堆叠组名"
1738
+ value={parseConfig?.series?.[selectSeries]?.stack || ""}
1739
+ onChange={(e) =>
1740
+ transformReturn({ series: { stack: e.target.value } })
1741
+ }
1742
+ style={{ width: 120 }}
1743
+ />
1744
+ </Form.Item>
1745
+ <Form.Item
1746
+ label="堆叠计算方式"
1747
+ labelCol={{ span: 8 }}
1748
+ wrapperCol={{ span: 16 }}
1749
+ >
1750
+ <Select
1751
+ size="small"
1752
+ value={
1753
+ parseConfig?.series?.[selectSeries]?.stackStrategy ||
1754
+ "samesign"
1755
+ }
1756
+ onChange={(e) =>
1757
+ transformReturn({
1758
+ series: { stackStrategy: e.target.value },
1759
+ })
1760
+ }
1761
+ options={[
1762
+ { label: "samesign", value: "samesign" },
1763
+ { label: "all", value: "all" },
1764
+ { label: "positive", value: "positive" },
1765
+ { label: "negative", value: "negative" },
1766
+ ]}
1767
+ style={{ width: 120 }}
1768
+ />
1769
+ </Form.Item>
1770
+ <Form.Item
1771
+ label="堆叠顺序"
1772
+ labelCol={{ span: 8 }}
1773
+ wrapperCol={{ span: 16 }}
1774
+ >
1775
+ <Radio.Group
1776
+ size="small"
1777
+ optionType="button"
1778
+ buttonStyle="solid"
1779
+ value={
1780
+ parseConfig?.series?.[selectSeries]?.stackOrder ||
1781
+ "seriesAsc"
1782
+ }
1783
+ onChange={(e) =>
1784
+ transformReturn({
1785
+ series: { stackOrder: e.target.value },
1786
+ })
1787
+ }
1788
+ options={[
1789
+ { label: "顺序", value: "seriesAsc" },
1790
+ { label: "倒序", value: "seriesDesc" },
1791
+ ]}
1792
+ style={{ width: 120 }}
1793
+ />
1794
+ </Form.Item>
1795
+ </>
1796
+ )}
1797
+ {["line", "scatter", "radar"].includes(
1798
+ parseConfig?.series?.[selectSeries]?.type || "",
1799
+ ) && (
1800
+ <>
1801
+ <Form.Item
1802
+ label="显示标记"
1803
+ labelCol={{ span: 12 }}
1804
+ wrapperCol={{ span: 12 }}
1805
+ >
1806
+ <Switch
1807
+ size="small"
1808
+ value={
1809
+ typeof parseConfig?.series?.[selectSeries]
1810
+ ?.showSymbol === "boolean"
1811
+ ? parseConfig?.series?.[selectSeries]?.showSymbol
1812
+ : true
1813
+ }
1814
+ onChange={(v) =>
1815
+ transformReturn({ series: { showSymbol: v } })
1816
+ }
1817
+ />
1818
+ </Form.Item>
1819
+ <Form.Item
1820
+ label="标记图形"
1821
+ labelCol={{ span: 6 }}
1822
+ wrapperCol={{ span: 18 }}
1823
+ >
1824
+ <Select
1825
+ size="small"
1826
+ value={
1827
+ parseConfig?.series?.[selectSeries]?.symbol ||
1828
+ "emptyCircle"
1829
+ }
1830
+ onChange={(v) =>
1831
+ transformReturn({ series: { symbol: v } })
1832
+ }
1833
+ options={[
1834
+ // 'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow', 'none'
1835
+ { label: "空心圆", value: "emptyCircle" },
1836
+ { label: "圆", value: "circle" },
1837
+ { label: "矩形", value: "rect" },
1838
+ { label: "圆角矩形", value: "roundRect" },
1839
+ { label: "三角形", value: "triangle" },
1840
+ { label: "菱形", value: "diamond" },
1841
+ { label: "图钉", value: "pin" },
1842
+ { label: "箭头", value: "arrow" },
1843
+ { label: "无", value: "none" },
1844
+ ]}
1845
+ style={{ width: 120 }}
1846
+ />
1847
+ </Form.Item>
1848
+ <Form.Item
1849
+ label="标记大小"
1850
+ labelCol={{ span: 12 }}
1851
+ wrapperCol={{ span: 12 }}
1852
+ >
1853
+ <InputNumber
1854
+ size="small"
1855
+ value={
1856
+ parseConfig?.series?.[selectSeries]?.symbolSize || 4
1857
+ }
1858
+ min={0}
1859
+ suffix="px"
1860
+ onChange={(v) =>
1861
+ transformReturn({ series: { symbolSize: v } })
1862
+ }
1863
+ />
1864
+ </Form.Item>
1865
+ <Form.Item
1866
+ label="标记角度"
1867
+ labelCol={{ span: 12 }}
1868
+ wrapperCol={{ span: 12 }}
1869
+ >
1870
+ <InputNumber
1871
+ size="small"
1872
+ value={parseConfig?.series?.[selectSeries]?.symbolRotate}
1873
+ min={0}
1874
+ suffix="°"
1875
+ onChange={(v) =>
1876
+ transformReturn({ series: { symbolRotate: v } })
1877
+ }
1878
+ />
1879
+ </Form.Item>
1880
+ </>
1881
+ )}
1882
+ {parseConfig?.series?.[selectSeries]?.type === "line" && (
1883
+ <>
1884
+ <Form.Item
1885
+ label="平滑曲线"
1886
+ labelCol={{ span: 12 }}
1887
+ wrapperCol={{ span: 12 }}
1888
+ >
1889
+ <Switch
1890
+ size="small"
1891
+ value={
1892
+ typeof parseConfig?.series?.[selectSeries]?.smooth ===
1893
+ "boolean"
1894
+ ? parseConfig?.series?.[selectSeries]?.smooth
1895
+ : false
1896
+ }
1897
+ onChange={(v) =>
1898
+ transformReturn({ series: { smooth: v } })
1899
+ }
1900
+ />
1901
+ </Form.Item>
1902
+ <Form.Item
1903
+ label="面积图"
1904
+ labelCol={{ span: 12 }}
1905
+ wrapperCol={{ span: 12 }}
1906
+ >
1907
+ <Switch
1908
+ size="small"
1909
+ value={
1910
+ typeof parseConfig?.series?.[selectSeries]
1911
+ ?.areaStyle === "object"
1912
+ }
1913
+ onChange={(v) =>
1914
+ transformReturn({
1915
+ series: { areaStyle: v ? {} : undefined },
1916
+ })
1917
+ }
1918
+ />
1919
+ </Form.Item>
1920
+ <Form.Item
1921
+ label="面积图填充色"
1922
+ labelCol={{ span: 12 }}
1923
+ wrapperCol={{ span: 12 }}
1924
+ >
1925
+ <ColorPicker
1926
+ size="small"
1927
+ value={
1928
+ parseConfig?.series?.[selectSeries]?.areaStyle?.color ||
1929
+ ""
1930
+ }
1931
+ onChange={(v) =>
1932
+ transformReturn({
1933
+ series: { areaStyle: { color: v.toHexString() } },
1934
+ })
1935
+ }
1936
+ allowClear
1937
+ />
1938
+ </Form.Item>
1939
+ <Form.Item
1940
+ label="面积图透明度"
1941
+ labelCol={{ span: 12 }}
1942
+ wrapperCol={{ span: 12 }}
1943
+ >
1944
+ <Slider
1945
+ min={0}
1946
+ max={1}
1947
+ step={0.1}
1948
+ value={
1949
+ parseConfig?.series?.[selectSeries]?.areaStyle
1950
+ ?.opacity || 0.7
1951
+ }
1952
+ onChange={(v) =>
1953
+ transformReturn({
1954
+ series: { areaStyle: { opacity: v } },
1955
+ })
1956
+ }
1957
+ />
1958
+ </Form.Item>
1959
+ </>
1960
+ )}
1961
+ {parseConfig?.series?.[selectSeries]?.type === "bar" && (
1962
+ <>
1963
+ <Form.Item
1964
+ label="柱条宽度"
1965
+ labelCol={{ span: 12 }}
1966
+ wrapperCol={{ span: 12 }}
1967
+ >
1968
+ <InputNumber
1969
+ size="small"
1970
+ value={parseConfig?.series?.[selectSeries]?.barWidth}
1971
+ min={0}
1972
+ suffix="px"
1973
+ onChange={(v) =>
1974
+ transformReturn({ series: { barWidth: v } })
1975
+ }
1976
+ />
1977
+ </Form.Item>
1978
+ <Form.Item
1979
+ label="柱条最小宽度"
1980
+ labelCol={{ span: 12 }}
1981
+ wrapperCol={{ span: 12 }}
1982
+ >
1983
+ <InputNumber
1984
+ size="small"
1985
+ value={parseConfig?.series?.[selectSeries]?.barMinWidth}
1986
+ min={0}
1987
+ suffix="px"
1988
+ onChange={(v) =>
1989
+ transformReturn({ series: { barMinWidth: v } })
1990
+ }
1991
+ />
1992
+ </Form.Item>
1993
+ <Form.Item
1994
+ label="柱条最大宽度"
1995
+ labelCol={{ span: 12 }}
1996
+ wrapperCol={{ span: 12 }}
1997
+ >
1998
+ <InputNumber
1999
+ size="small"
2000
+ value={parseConfig?.series?.[selectSeries]?.barMaxWidth}
2001
+ min={0}
2002
+ suffix="px"
2003
+ onChange={(v) =>
2004
+ transformReturn({ series: { barMaxWidth: v } })
2005
+ }
2006
+ />
2007
+ </Form.Item>
2008
+ <Form.Item
2009
+ label="柱条最小高度"
2010
+ labelCol={{ span: 12 }}
2011
+ wrapperCol={{ span: 12 }}
2012
+ >
2013
+ <InputNumber
2014
+ size="small"
2015
+ value={parseConfig?.series?.[selectSeries]?.barMinHeight}
2016
+ min={0}
2017
+ suffix="px"
2018
+ onChange={(v) =>
2019
+ transformReturn({ series: { barMinHeight: v } })
2020
+ }
2021
+ />
2022
+ </Form.Item>
2023
+ <Form.Item
2024
+ label="柱条最小角度"
2025
+ labelCol={{ span: 12 }}
2026
+ wrapperCol={{ span: 12 }}
2027
+ >
2028
+ <InputNumber
2029
+ size="small"
2030
+ value={parseConfig?.series?.[selectSeries]?.barMinAngle}
2031
+ min={0}
2032
+ suffix="°"
2033
+ onChange={(v) =>
2034
+ transformReturn({ series: { barMinAngle: v } })
2035
+ }
2036
+ />
2037
+ </Form.Item>
2038
+ <Form.Item
2039
+ label="柱间距离"
2040
+ labelCol={{ span: 12 }}
2041
+ wrapperCol={{ span: 12 }}
2042
+ >
2043
+ <InputNumber
2044
+ size="small"
2045
+ value={
2046
+ parseConfig?.series?.[selectSeries]?.barGap?.length
2047
+ ? parseInt(
2048
+ parseConfig?.series[
2049
+ selectSeries
2050
+ ]?.barGap.replace("%", ""),
2051
+ )
2052
+ : 0
2053
+ }
2054
+ min={0}
2055
+ suffix="%"
2056
+ onChange={(v) =>
2057
+ transformReturn({
2058
+ series: { barGap: v ? v + "%" : "" },
2059
+ })
2060
+ }
2061
+ />
2062
+ </Form.Item>
2063
+ </>
2064
+ )}
2065
+ {parseConfig?.series?.[selectSeries]?.type === "pie" && (
2066
+ <>
2067
+ <Form.Item
2068
+ label="南丁格尔图"
2069
+ labelCol={{ span: 12 }}
2070
+ wrapperCol={{ span: 12 }}
2071
+ >
2072
+ <Radio.Group
2073
+ size="small"
2074
+ optionType="button"
2075
+ buttonStyle="solid"
2076
+ options={[
2077
+ {
2078
+ label: "无",
2079
+ value: "none",
2080
+ },
2081
+ {
2082
+ label: "radius",
2083
+ value: "radius",
2084
+ },
2085
+ {
2086
+ label: "area",
2087
+ value: "area",
2088
+ },
2089
+ ]}
2090
+ value={
2091
+ parseConfig?.series?.[selectSeries]?.roseType || "none"
2092
+ }
2093
+ onChange={(e) =>
2094
+ transformReturn({
2095
+ series: {
2096
+ roseType:
2097
+ e.target.value === "none" ? "" : e.target.value,
2098
+ },
2099
+ })
2100
+ }
2101
+ />
2102
+ </Form.Item>
2103
+ </>
2104
+ )}
2105
+ {["pie", "sunburst", "chord"].includes(
2106
+ parseConfig?.series?.[selectSeries]?.type || "",
2107
+ ) && (
2108
+ <>
2109
+ <Form.Item
2110
+ label="角度"
2111
+ labelCol={{ span: 12 }}
2112
+ wrapperCol={{ span: 12 }}
2113
+ >
2114
+ <Slider
2115
+ value={
2116
+ parseConfig?.series?.[selectSeries]?.startAngle || 90
2117
+ }
2118
+ min={0}
2119
+ max={360}
2120
+ onChange={(v) =>
2121
+ transformReturn({ series: { startAngle: v } })
2122
+ }
2123
+ />
2124
+ </Form.Item>
2125
+ <Form.Item
2126
+ label="半径"
2127
+ labelCol={{ span: 12 }}
2128
+ wrapperCol={{ span: 12 }}
2129
+ >
2130
+ <Slider
2131
+ value={
2132
+ parseConfig?.series?.[selectSeries]?.radius
2133
+ ? parseConfig?.series?.[selectSeries]?.radius.map(
2134
+ (i: string) => parseInt(i.replace("%", "")),
2135
+ )
2136
+ : [0, 100]
2137
+ }
2138
+ min={0}
2139
+ max={100}
2140
+ range={{ draggableTrack: true }}
2141
+ onChange={(v: number[]) =>
2142
+ transformReturn({
2143
+ series: { radius: [v[0] + "%", v[1] + "%"] },
2144
+ })
2145
+ }
2146
+ />
2147
+ </Form.Item>
2148
+ <Form.Item
2149
+ label="中心坐标"
2150
+ labelCol={{ span: 12 }}
2151
+ wrapperCol={{ span: 12 }}
2152
+ >
2153
+ <Slider
2154
+ value={
2155
+ parseConfig?.series?.[selectSeries]?.center
2156
+ ? parseConfig?.series?.[selectSeries]?.center.map(
2157
+ (i: string) => parseInt(i.replace("%", "")),
2158
+ )
2159
+ : [50, 50]
2160
+ }
2161
+ min={0}
2162
+ max={100}
2163
+ range={{ draggableTrack: true }}
2164
+ onChange={(v: number[]) =>
2165
+ transformReturn({
2166
+ series: { center: [v[0] + "%", v[1] + "%"] },
2167
+ })
2168
+ }
2169
+ />
2170
+ </Form.Item>
2171
+ </>
2172
+ )}
2173
+ </Space>
2174
+ ),
2175
+ },
1694
2176
  {
1695
2177
  key: "custom",
1696
2178
  label: "自定义配置",