@cainiaofe/cn-ui-m
Version:
16 lines (15 loc) • 1.16 kB
JavaScript
import React from 'react';
import { CnProgress, CnDemoBlock, CnIcon, CnBox, CnDemoPage, } from "../../..";
var textRender = function (percent) {
if (percent === 100) {
return React.createElement(CnIcon, { type: "complete", size: "medium" });
}
return "".concat(percent.toFixed(2), "%");
};
export var 自定义百分比 = function () {
return (React.createElement(CnDemoPage, { title: "\u81EA\u5B9A\u4E49\u767E\u5206\u6BD4" },
React.createElement(CnDemoBlock, { title: "\u81EA\u5B9A\u4E49\u767E\u5206\u6BD4" },
React.createElement(CnBox, { direction: "row", wrap: true, spacing: 20 }, [1, 2, 3, 4, 5, 6].map(function (value, index) { return (React.createElement(CnProgress, { key: index, percent: (value / 6) * 100, shape: "circle", color: "hsl(".concat(index * 60 + 60, ", 90%, 50%)"), textRender: textRender })); })),
[1, 2, 3, 4, 5, 6].map(function (value, index) { return (React.createElement(CnProgress, { key: index, percent: (value / 6) * 100, shape: "line", color: "hsl(".concat(index * 60 + 60, ", 90%, 50%)"), textRender: textRender })); }))));
};
export default { title: 'demo/CnProgress' };