@bit-sun/business-component 2.0.16 → 2.0.17

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 (17) hide show
  1. package/dist/components/Business/CommonGuideWrapper/index.d.ts +6 -0
  2. package/dist/components/Business/StateFlow/index.d.ts +3 -0
  3. package/dist/index.d.ts +2 -0
  4. package/dist/index.esm.js +149 -2
  5. package/dist/index.js +149 -0
  6. package/package.json +1 -1
  7. package/src/assets/arrow_top.png +0 -0
  8. package/src/assets/drag.svg +17 -0
  9. package/src/assets/label_icon_bottom.svg +26 -0
  10. package/src/components/Business/CommonGuideWrapper/index.less +112 -0
  11. package/src/components/Business/CommonGuideWrapper/index.md +39 -0
  12. package/src/components/Business/CommonGuideWrapper/index.tsx +84 -0
  13. package/src/components/Business/StateFlow/index.less +131 -0
  14. package/src/components/Business/StateFlow/index.md +60 -0
  15. package/src/components/Business/StateFlow/index.tsx +30 -0
  16. package/src/index.ts +2 -0
  17. package/typings.d.ts +2 -0
package/dist/components/Business/CommonGuideWrapper/index.d.ts ADDED
@@ -0,0 +1,6 @@
1
+ import { Component } from "react";
2
+ import './index.less';
3
+ export default class GuideWrapper extends Component {
4
+ static Field: ({ children, ...props }: any) => JSX.Element;
5
+ render(): JSX.Element;
6
+ }
package/dist/components/Business/StateFlow/index.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ import './index.less';
2
+ declare const _default: (props: any) => JSX.Element;
3
+ export default _default;
package/dist/index.d.ts CHANGED
@@ -11,3 +11,5 @@ export { default as CommodityEntry } from './components/Business/CommodityEntry'
11
11
  export { default as CheckOneUser } from './utils/CheckOneUser';
12
12
  export { default as TreeSearchSelect } from './components/Functional/TreeSearchSelect';
13
13
  export { default as BusinessTreeSearchSelect } from './components/Business/TreeSearchSelect';
14
+ export { default as StateFlow } from './components/Business/StateFlow';
15
+ export { default as GuideWrapper } from './components/Business/CommonGuideWrapper';
package/dist/index.esm.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import axios from 'axios';
2
- import React, { createContext, useContext, useEffect, forwardRef, createElement, useState, useImperativeHandle, useRef, useMemo } from 'react';
2
+ import React, { createContext, useContext, useEffect, forwardRef, createElement, useState, useImperativeHandle, useRef, useMemo, Component } from 'react';
3
3
  import { message, Menu, Space, Dropdown, Tooltip, Button, Checkbox, Input, Modal, Select, Form, Divider, Spin, Table, TreeSelect, Tag, InputNumber, Popover } from 'antd';
4
4
  import { DragDropContext, Droppable, Draggable } from 'react-beautiful-dnd';
5
5
  import classNames from 'classnames';
@@ -8833,4 +8833,151 @@ var index$1 = /*#__PURE__*/React.memo(BusinessTreeSearchSelect, function (props,
8833
8833
  return true;
8834
8834
  });
8835
8835
 
8836
- export { AddSelect, AddSkuSelect, BillEntry, BusinessSearchSelect$1 as BusinessSearchSelect, index$1 as BusinessTreeSearchSelect, index as CheckOneUser, CommodityEntry, DataImport, DataValidation, QueryMutipleInput, SearchSelect, TreeSearchSelect };
8836
+ var css_248z$6 = ".form-status-label {\n height: 48px;\n margin-right: 12px;\n display: inline-block;\n position: relative;\n background-color: #B0B4B7;\n align-items: center;\n}\n.choosed-status-label.form-status-label {\n background-color: #005CFF;\n}\n.form-status-label:last-child {\n margin-right: 0px;\n}\n.form-status-label:first-child::after {\n position: absolute;\n display: block;\n content: '';\n right: -48px;\n top: 0;\n width: 48px;\n height: 48px;\n border: 24px solid;\n border-color: transparent transparent transparent transparent;\n border-left: 12px solid #B0B4B7;\n}\n.choosed-status-label.form-status-label::after {\n border-left: 12px solid #005CFF;\n}\n.choosed-status-label.form-status-label:not(:first-child):not(:last-child)::after {\n border-left: 12px solid #005CFF;\n}\n.form-status-label:last-child::after {\n position: absolute;\n display: block;\n content: '';\n left: 0;\n top: 0;\n width: 48px;\n height: 48px;\n border: 24px solid;\n border-color: transparent transparent transparent transparent;\n border-left: 12px solid #ffffff;\n}\n.form-status-label:not(:first-child):not(:last-child)::before {\n position: absolute;\n display: block;\n content: '';\n left: 0;\n top: 0;\n width: 48px;\n height: 48px;\n border: 24px solid;\n border-color: transparent transparent transparent transparent;\n border-left: 12px solid #ffffff;\n}\n.form-status-label:not(:first-child):not(:last-child)::after {\n position: absolute;\n display: block;\n content: '';\n right: -48px;\n top: 0;\n width: 48px;\n height: 48px;\n border: 24px solid;\n border-color: transparent transparent transparent transparent;\n border-left: 12px solid #B0B4B7;\n}\n.status-label-index {\n display: inline-block;\n width: 24px;\n height: 24px;\n border: 1px solid #FFFFFF;\n color: #FFFFFF;\n border-radius: 50%;\n font-family: Montserrat;\n font-size: 14px;\n line-height: 24px;\n text-align: center;\n margin: 0 6px 0 20px;\n}\n.status-label-key {\n width: 50px;\n height: 100%;\n display: inline-flex;\n float: left;\n align-items: center;\n justify-content: center;\n}\n.status-label-operate {\n float: left;\n width: calc(100% - 50px);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n height: 100%;\n margin: 4px 0;\n}\n.status-label-operate > div {\n font-size: 12px;\n height: 20px;\n line-height: 20px;\n color: #FFFFFF;\n font-family: PingFangSC;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.status-label-operate > div:first-child {\n font-size: 14px;\n font-weight: 600;\n}\n.only-one-child.form-status-label::after,\n.only-one-child.form-status-label::before {\n border-left: 0px;\n}\n";
8837
+ styleInject(css_248z$6);
8838
+
8839
+ var index$2 = (function (props) {
8840
+ var _props$formStatusMapp = props.formStatusMapping,
8841
+ formStatusMapping = _props$formStatusMapp === void 0 ? [] : _props$formStatusMapp;
8842
+ return /*#__PURE__*/React.createElement("div", {
8843
+ style: {
8844
+ display: 'flex',
8845
+ padding: '10px 60px 0px',
8846
+ background: '#FFFFFF'
8847
+ }
8848
+ }, formStatusMapping.map(function (item, index) {
8849
+ return /*#__PURE__*/React.createElement("div", {
8850
+ style: {
8851
+ width: "".concat((100 / formStatusMapping.length).toFixed(2), "%")
8852
+ },
8853
+ className: "form-status-label ".concat(item.isDone ? 'choosed-status-label' : '', " ").concat(formStatusMapping.length === 1 ? 'only-one-child' : '')
8854
+ }, /*#__PURE__*/React.createElement("div", {
8855
+ className: 'status-label-key'
8856
+ }, /*#__PURE__*/React.createElement("span", {
8857
+ className: 'status-label-index'
8858
+ }, index + 1)), /*#__PURE__*/React.createElement("div", {
8859
+ className: 'status-label-operate'
8860
+ }, /*#__PURE__*/React.createElement("div", {
8861
+ style: !item.isDone ? {
8862
+ height: '40px',
8863
+ lineHeight: '40px'
8864
+ } : {}
8865
+ }, item.text), item.isDone ? /*#__PURE__*/React.createElement("div", {
8866
+ title: "".concat(item.modifyUserName || '--', " ").concat(item.modifyTime || '--')
8867
+ }, "".concat(item.modifyUserName || '--', " ").concat(item.modifyTime || '--')) : null), /*#__PURE__*/React.createElement("div", {
8868
+ style: {
8869
+ clear: 'both'
8870
+ }
8871
+ }));
8872
+ }));
8873
+ });
8874
+
8875
+ var dragImg = "data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20viewBox%3D%220%200%2024%2024%22%20class%3D%22design-iconfont%22%3E%20%20%3Cdefs%3E%20%20%20%20%3ClinearGradient%20x1%3D%22100%25%22%20y1%3D%2250%25%22%20x2%3D%220%25%22%20y2%3D%2250%25%22%20id%3D%22l1lf23lgga%22%3E%20%20%20%20%20%20%3Cstop%20stop-color%3D%22%2310295B%22%20offset%3D%220%25%22%2F%3E%20%20%20%20%20%20%3Cstop%20stop-color%3D%22%230F2A61%22%20offset%3D%22100%25%22%2F%3E%20%20%20%20%3C%2FlinearGradient%3E%20%20%20%20%3Cpath%20id%3D%22okxu11mz5b%22%20d%3D%22M0%200H24V24H0z%22%2F%3E%20%20%3C%2Fdefs%3E%20%20%3Cg%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%20%20%20%20%3Cmask%20id%3D%227u8dk2lilc%22%20fill%3D%22%23fff%22%3E%20%20%20%20%20%20%3Cuse%20xlink%3Ahref%3D%22%23okxu11mz5b%22%2F%3E%20%20%20%20%3C%2Fmask%3E%20%20%20%20%3Cg%20mask%3D%22url%28%237u8dk2lilc%29%22%20fill%3D%22%23999%22%20fill-rule%3D%22nonzero%22%3E%20%20%20%20%20%20%3Cpath%20d%3D%22M1.31655092%2C7%20C2.03935948%2C7%202.6253116%2C7.58595212%202.6253116%2C8.30876068%20C2.6253116%2C9.03156925%202.03935948%2C9.61752137%201.31655092%2C9.61752137%20C0.593742351%2C9.61752137%200.00779023438%2C9.03156925%200.00779023438%2C8.30876068%20C0.00779023438%2C7.58595212%200.593742351%2C7%201.31655092%2C7%20Z%20M6.99034011%2C7%20C7.71314867%2C7%208.29910079%2C7.58595212%208.29910079%2C8.30876068%20C8.29910079%2C9.03156925%207.71314867%2C9.61752137%206.99034011%2C9.61752137%20C6.26753154%2C9.61752137%205.68157942%2C9.03156925%205.68157942%2C8.30876068%20C5.68157942%2C7.58595212%206.26753154%2C7%206.99034011%2C7%20Z%20M12.6641293%2C7%20C13.3869378%2C7%2013.97289%2C7.58595212%2013.97289%2C8.30876068%20C13.97289%2C9.03156925%2013.3869378%2C9.61752137%2012.6641293%2C9.61752137%20C11.9413207%2C9.61752137%2011.3553686%2C9.03156925%2011.3553686%2C8.30876068%20C11.3553686%2C7.58595212%2011.9413207%2C7%2012.6641293%2C7%20Z%20M1.31655092%2C-5.32907052e-15%20C2.03935948%2C-5.32907052e-15%202.6253116%2C0.585952117%202.6253116%2C1.30876068%20C2.6253116%2C2.03156925%202.03935948%2C2.61752137%201.31655092%2C2.61752137%20C0.593742351%2C2.61752137%200.00779023438%2C2.03156925%200.00779023438%2C1.30876068%20C0.00779023438%2C0.585952117%200.593742351%2C-5.32907052e-15%201.31655092%2C-5.32907052e-15%20Z%20M6.99034011%2C-5.32907052e-15%20C7.71314867%2C-5.32907052e-15%208.29910079%2C0.585952117%208.29910079%2C1.30876068%20C8.29910079%2C2.03156925%207.71314867%2C2.61752137%206.99034011%2C2.61752137%20C6.26753154%2C2.61752137%205.68157942%2C2.03156925%205.68157942%2C1.30876068%20C5.68157942%2C0.585952117%206.26753154%2C-5.32907052e-15%206.99034011%2C-5.32907052e-15%20Z%20M12.6641293%2C-5.32907052e-15%20C13.3869378%2C-5.32907052e-15%2013.97289%2C0.585952117%2013.97289%2C1.30876068%20C13.97289%2C2.03156925%2013.3869378%2C2.61752137%2012.6641293%2C2.61752137%20C11.9413207%2C2.61752137%2011.3553686%2C2.03156925%2011.3553686%2C1.30876068%20C11.3553686%2C0.585952117%2011.9413207%2C-5.32907052e-15%2012.6641293%2C-5.32907052e-15%20Z%22%20transform%3D%22translate%285%207%29%22%2F%3E%20%20%20%20%3C%2Fg%3E%20%20%3C%2Fg%3E%3C%2Fsvg%3E";
8876
+
8877
+ var label_icon_bottom = "data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20width%3D%2224px%22%20height%3D%2224px%22%20viewBox%3D%220%200%2024%2024%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%20%20%20%20%3Ctitle%3E%E7%BC%96%E7%BB%84%203%E5%A4%87%E4%BB%BD%204%3C%2Ftitle%3E%20%20%20%20%3Cdefs%3E%20%20%20%20%20%20%20%20%3Crect%20id%3D%22path-1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2224%22%20height%3D%2224%22%3E%3C%2Frect%3E%20%20%20%20%3C%2Fdefs%3E%20%20%20%20%3Cg%20id%3D%22%E9%A1%B5%E9%9D%A2-1%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%20%20%20%20%20%20%20%20%3Cg%20id%3D%22%E5%8D%95%E6%8D%AE-%E8%AF%A6%E6%83%85%E9%A1%B5%EF%BC%88%E4%BA%8C%E7%BA%A7%E9%A1%B5%EF%BC%89-%E4%B8%8B%E6%8B%89%22%20transform%3D%22translate%28-1858.000000%2C%20-1326.000000%29%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22%E7%BC%96%E7%BB%84-20%22%20transform%3D%22translate%28280.000000%2C%20866.000000%29%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22%E7%BC%96%E7%BB%84-5%22%20transform%3D%22translate%281554.000000%2C%20179.000000%29%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22%E7%BC%96%E7%BB%84-3%E5%A4%87%E4%BB%BD-4%22%20transform%3D%22translate%2824.000000%2C%20281.000000%29%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cmask%20id%3D%22mask-2%22%20fill%3D%22white%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cuse%20xlink%3Ahref%3D%22%23path-1%22%3E%3C%2Fuse%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fmask%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cuse%20id%3D%22%E8%92%99%E7%89%88%22%20fill%3D%22%23D8D8D8%22%20opacity%3D%220%22%20xlink%3Ahref%3D%22%23path-1%22%3E%3C%2Fuse%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22%E7%BC%96%E7%BB%84%22%20mask%3D%22url%28%23mask-2%29%22%20fill%3D%22%23B1BAD4%22%20fill-rule%3D%22nonzero%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20transform%3D%22translate%283.000000%2C%203.000000%29%22%20id%3D%22%E5%BD%A2%E7%8A%B6%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M5.99072727%2C0.237481917%20C6.50454545%2C-0.0418576482%206.56509091%2C-0.0745634228%206.97254545%2C0.138292264%20L7.15527271%2C0.236945765%20C7.31727271%2C0.445512161%207.34672726%2C0.483579531%207.3761818%2C0.664265595%20L7.39690908%2C0.809565049%20L7.39690908%2C17%20L5.76054545%2C17%20L5.76054545%2C2.73974241%20L1.15690909%2C7.26654448%20L0%2C6.12934831%20L5.99072727%2C0.237481917%20Z%20M13.0909091%2C13.6720525%20L13.0909091%2C15.2805337%20L9.81818182%2C15.2805337%20L9.81818182%2C13.6720525%20L13.0909091%2C13.6720525%20Z%20M14.7272727%2C9.91892987%20L14.7272727%2C11.527411%20L9.81818182%2C11.527411%20L9.81818182%2C9.91892987%20L14.7272727%2C9.91892987%20Z%20M16.3636364%2C6.16580723%20L16.3636364%2C7.77428836%20L9.81818182%2C7.77428836%20L9.81818182%2C6.16580723%20L16.3636364%2C6.16580723%20Z%20M18%2C2.41268459%20L18%2C4.02116572%20L9.81818182%2C4.02116572%20L9.81818182%2C2.41268459%20L18%2C2.41268459%20Z%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%3C%2Fg%3E%3C%2Fsvg%3E";
8878
+
8879
+ var arrow_top = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAAXNSR0IArs4c6QAAAuBJREFUaEPtl0urjlEUx3/HXUkpErkkJAYoGbhkJB2SW2IgBibKVL6Cz2BgQMqAXCKXiHIGBhiIDJEJyjXlfu2vtWp36nj2fvZ+HG/tXW/n7bz7Wft/WXut9fTR46uvx/FTCQy3g9WB6kCmAjWFMgXMfrw6kC1hZoDqQKaA2Y//Cwd0xq9spEME6JLACOCnnRt+L8qlKwIOeDT8GRi/Ap2Q6ILASOAHsAo4DEwGDgAnAP+tmAulCTjANcBpA6/812e3kRgFfC/FoCQBByblzxl4Tx399hnYA5wq6UQpAq78ClN+mqWR/q+llNL3T8BO4AJQxIkSBBz8cgM2FfgCjAXOAC+A/cA3QJf6vZG4UoJELgEHvww4C8wMgF40oB+BI8Bey30p/xbYDtzITaccAg5+CXAJmB4oL3UF8IMBVD84DuwK9rwCNgO3cki0JeDgF9uFnRMof83AK1VU+7VEYBxwDNgR7H0GbAVutyXRhoCDXwhcBmYHql4HtlmeD+7EKqW6A6pCm4JnRGI9cL8NiVQCDn6RKT/fuuwY4CawBXg3BBAnNAE4aaD9Yj+ydHqYSiKFgIOfByjH5wYqDlgqvGkYGZzERCu3a4MYIrEOeJxCIpaAT5RSXE1KDqhJSXldQqXE68iDXYhJwHlgdRDrgTnxxGaoxik2hoCrNgu4CiwIVBN4pc3LxGHNY04xQVYGMXUX+oHnMTFjCPjYouoiyzUSqKLcBTYY+DZd1Z1Q41NKLg1iq4dsjJmXmgh46owHngJSTOuOKa8KkjMmh+4qndRTtHSXZtjo8dcXoiYCCuYB1IQOAfeAfTYitFF+sLDuhMrxUXPioHXvxre5GALhgarjGszUmBqDx6SA7fFYEkSENEtFrRQCfoj+6uOvi1EHRWxyLKo80eKkEIjAUGRLNHjP7yKnDleQ/9GBJC0qgSS5OthcHehA1KSQ1YEkuTrYXB3oQNSkkNWBJLk62NzzDvwGGnWoMahVpG4AAAAASUVORK5CYII=";
8880
+
8881
+ var css_248z$7 = ".form-guide {\n cursor: pointer;\n position: fixed;\n right: 5px;\n color: #B1BAD4;\n padding: 5px 0;\n width: 48px;\n z-index: 10;\n top: 50%;\n transform: translateY(-50%);\n background-color: #141620;\n border-radius: 5px;\n}\n.form-guide .form-guide-top {\n padding: 0px 10px;\n display: flex;\n justify-content: center;\n}\n.form-guide .form-guide-center {\n border-top: 1px solid #6E7588;\n border-bottom: 1px solid #6E7588;\n padding: 0px 10px;\n}\n.form-guide .form-guide-item {\n width: 28px;\n padding: 5px 0;\n display: block;\n word-break: break-all;\n color: #B1BAD4;\n font-size: 14px;\n line-height: 16px;\n position: relative;\n}\n.form-guide .form-guide-item::after {\n content: '';\n display: block;\n width: 15px;\n height: 1px;\n background-color: #6E7588;\n position: absolute;\n bottom: 0px;\n left: 7px;\n}\n.form-guide .form-guide-bottom {\n padding: 5px 10px;\n display: flex;\n justify-content: center;\n}\n.form-guide .form-guide-item:last-child::after {\n content: '';\n display: none;\n width: 15px;\n height: 1px;\n background-color: #6E7588;\n position: absolute;\n bottom: 0px;\n left: 7px;\n}\n.white-card.bitsun-form-card-class .ant-card-body {\n background-color: #FFFFFF;\n padding: 0px;\n}\n.bitsun-form-card-class > .ant-card-body {\n margin-bottom: 10px;\n}\n.bitsun-form-card-class .ant-card-head {\n border: 0px;\n padding: 0px;\n height: 48px;\n}\n.bitsun-form-card-class .ant-card-body {\n padding: 12px 0 0;\n margin-top: -4px;\n background-color: #F3F3F3;\n}\n.bitsun-form-card-class .ant-card-head-title {\n display: flex;\n align-items: center;\n font-size: 16px;\n color: #000000;\n font-weight: 600;\n font-family: PingFangSC;\n background-color: #FFFFFF;\n padding: 8px 0;\n margin: 0px;\n}\n.bitsun-form-card-class .ant-card-head-title .title-left-line {\n display: inline-block;\n width: 4px;\n height: 100%;\n background-color: #005CFF;\n height: 20px;\n margin-right: 16px;\n}\n.field-group-hidden .ant-card-body {\n display: none !important;\n}\n";
8882
+ styleInject(css_248z$7);
8883
+
8884
+ var _excluded$5 = ["children"],
8885
+ _excluded2$2 = ["children"];
8886
+
8887
+ var Field = function Field(_ref) {
8888
+ var children = _ref.children,
8889
+ props = _objectWithoutProperties(_ref, _excluded$5);
8890
+
8891
+ var _React$useState = React.useState(true),
8892
+ _React$useState2 = _slicedToArray(_React$useState, 2),
8893
+ fieldGroupVisible = _React$useState2[0],
8894
+ setVisible = _React$useState2[1];
8895
+
8896
+ return /*#__PURE__*/React.createElement("div", {
8897
+ className: "bitsun-form-card-class \n ".concat(fieldGroupVisible ? '' : 'field-group-hidden', " \n ").concat(props.isWhiteCard ? 'white-card' : '', "\n "),
8898
+ id: props.id
8899
+ }, /*#__PURE__*/React.createElement("div", {
8900
+ className: "ant-card-head"
8901
+ }, /*#__PURE__*/React.createElement("div", {
8902
+ className: "ant-card-head-title"
8903
+ }, /*#__PURE__*/React.createElement("span", {
8904
+ className: 'title-left-line'
8905
+ }), /*#__PURE__*/React.createElement("span", {
8906
+ style: {
8907
+ marginRight: '5px'
8908
+ }
8909
+ }, props === null || props === void 0 ? void 0 : props.title), /*#__PURE__*/React.createElement("img", {
8910
+ width: 24,
8911
+ style: {
8912
+ transform: fieldGroupVisible ? 'inherit' : 'rotate(180deg)',
8913
+ cursor: 'pointer'
8914
+ },
8915
+ src: arrow_top,
8916
+ onClick: function onClick(e) {
8917
+ e.stopPropagation();
8918
+ setVisible(!fieldGroupVisible);
8919
+ }
8920
+ }))), /*#__PURE__*/React.createElement("div", {
8921
+ className: "ant-card-body"
8922
+ }, children));
8923
+ };
8924
+
8925
+ var GuideWrapper = /*#__PURE__*/function (_Component) {
8926
+ _inherits(GuideWrapper, _Component);
8927
+
8928
+ var _super = _createSuper(GuideWrapper);
8929
+
8930
+ function GuideWrapper() {
8931
+ _classCallCheck(this, GuideWrapper);
8932
+
8933
+ return _super.apply(this, arguments);
8934
+ }
8935
+
8936
+ _createClass(GuideWrapper, [{
8937
+ key: "render",
8938
+ value: function render() {
8939
+ var _this$props = this.props,
8940
+ _this$props$children = _this$props.children,
8941
+ children = _this$props$children === void 0 ? [] : _this$props$children,
8942
+ props = _objectWithoutProperties(_this$props, _excluded2$2);
8943
+
8944
+ var cardGroups = children.filter(function (item) {
8945
+ var _item$props, _item$props2;
8946
+
8947
+ return (item === null || item === void 0 ? void 0 : (_item$props = item.props) === null || _item$props === void 0 ? void 0 : _item$props.id) && (item === null || item === void 0 ? void 0 : (_item$props2 = item.props) === null || _item$props2 === void 0 ? void 0 : _item$props2.title);
8948
+ });
8949
+ return /*#__PURE__*/React.createElement("div", _objectSpread2({}, props), children, /*#__PURE__*/React.createElement("div", {
8950
+ className: 'form-guide'
8951
+ }, /*#__PURE__*/React.createElement("div", {
8952
+ className: 'form-guide-top'
8953
+ }, /*#__PURE__*/React.createElement("img", {
8954
+ width: 24,
8955
+ src: dragImg
8956
+ })), /*#__PURE__*/React.createElement("div", {
8957
+ className: 'form-guide-center'
8958
+ }, cardGroups.map(function (item) {
8959
+ return /*#__PURE__*/React.createElement("span", {
8960
+ className: 'form-guide-item',
8961
+ onClick: function onClick() {
8962
+ var currentDom = document.getElementById(item.props.id);
8963
+ currentDom && currentDom.scrollIntoView({
8964
+ block: 'center',
8965
+ behavior: 'smooth'
8966
+ });
8967
+ }
8968
+ }, item.props.title);
8969
+ })), /*#__PURE__*/React.createElement("div", {
8970
+ className: 'form-guide-bottom'
8971
+ }, /*#__PURE__*/React.createElement("img", {
8972
+ width: 24,
8973
+ src: label_icon_bottom
8974
+ }))));
8975
+ }
8976
+ }]);
8977
+
8978
+ return GuideWrapper;
8979
+ }(Component);
8980
+
8981
+ GuideWrapper.Field = Field;
8982
+
8983
+ export { AddSelect, AddSkuSelect, BillEntry, BusinessSearchSelect$1 as BusinessSearchSelect, index$1 as BusinessTreeSearchSelect, index as CheckOneUser, CommodityEntry, DataImport, DataValidation, GuideWrapper, QueryMutipleInput, SearchSelect, index$2 as StateFlow, TreeSearchSelect };
package/dist/index.js CHANGED
@@ -8844,6 +8844,153 @@ var index$1 = /*#__PURE__*/React__default['default'].memo(BusinessTreeSearchSele
8844
8844
  return true;
8845
8845
  });
8846
8846
 
8847
+ var css_248z$6 = ".form-status-label {\n height: 48px;\n margin-right: 12px;\n display: inline-block;\n position: relative;\n background-color: #B0B4B7;\n align-items: center;\n}\n.choosed-status-label.form-status-label {\n background-color: #005CFF;\n}\n.form-status-label:last-child {\n margin-right: 0px;\n}\n.form-status-label:first-child::after {\n position: absolute;\n display: block;\n content: '';\n right: -48px;\n top: 0;\n width: 48px;\n height: 48px;\n border: 24px solid;\n border-color: transparent transparent transparent transparent;\n border-left: 12px solid #B0B4B7;\n}\n.choosed-status-label.form-status-label::after {\n border-left: 12px solid #005CFF;\n}\n.choosed-status-label.form-status-label:not(:first-child):not(:last-child)::after {\n border-left: 12px solid #005CFF;\n}\n.form-status-label:last-child::after {\n position: absolute;\n display: block;\n content: '';\n left: 0;\n top: 0;\n width: 48px;\n height: 48px;\n border: 24px solid;\n border-color: transparent transparent transparent transparent;\n border-left: 12px solid #ffffff;\n}\n.form-status-label:not(:first-child):not(:last-child)::before {\n position: absolute;\n display: block;\n content: '';\n left: 0;\n top: 0;\n width: 48px;\n height: 48px;\n border: 24px solid;\n border-color: transparent transparent transparent transparent;\n border-left: 12px solid #ffffff;\n}\n.form-status-label:not(:first-child):not(:last-child)::after {\n position: absolute;\n display: block;\n content: '';\n right: -48px;\n top: 0;\n width: 48px;\n height: 48px;\n border: 24px solid;\n border-color: transparent transparent transparent transparent;\n border-left: 12px solid #B0B4B7;\n}\n.status-label-index {\n display: inline-block;\n width: 24px;\n height: 24px;\n border: 1px solid #FFFFFF;\n color: #FFFFFF;\n border-radius: 50%;\n font-family: Montserrat;\n font-size: 14px;\n line-height: 24px;\n text-align: center;\n margin: 0 6px 0 20px;\n}\n.status-label-key {\n width: 50px;\n height: 100%;\n display: inline-flex;\n float: left;\n align-items: center;\n justify-content: center;\n}\n.status-label-operate {\n float: left;\n width: calc(100% - 50px);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n height: 100%;\n margin: 4px 0;\n}\n.status-label-operate > div {\n font-size: 12px;\n height: 20px;\n line-height: 20px;\n color: #FFFFFF;\n font-family: PingFangSC;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.status-label-operate > div:first-child {\n font-size: 14px;\n font-weight: 600;\n}\n.only-one-child.form-status-label::after,\n.only-one-child.form-status-label::before {\n border-left: 0px;\n}\n";
8848
+ styleInject(css_248z$6);
8849
+
8850
+ var index$2 = (function (props) {
8851
+ var _props$formStatusMapp = props.formStatusMapping,
8852
+ formStatusMapping = _props$formStatusMapp === void 0 ? [] : _props$formStatusMapp;
8853
+ return /*#__PURE__*/React__default['default'].createElement("div", {
8854
+ style: {
8855
+ display: 'flex',
8856
+ padding: '10px 60px 0px',
8857
+ background: '#FFFFFF'
8858
+ }
8859
+ }, formStatusMapping.map(function (item, index) {
8860
+ return /*#__PURE__*/React__default['default'].createElement("div", {
8861
+ style: {
8862
+ width: "".concat((100 / formStatusMapping.length).toFixed(2), "%")
8863
+ },
8864
+ className: "form-status-label ".concat(item.isDone ? 'choosed-status-label' : '', " ").concat(formStatusMapping.length === 1 ? 'only-one-child' : '')
8865
+ }, /*#__PURE__*/React__default['default'].createElement("div", {
8866
+ className: 'status-label-key'
8867
+ }, /*#__PURE__*/React__default['default'].createElement("span", {
8868
+ className: 'status-label-index'
8869
+ }, index + 1)), /*#__PURE__*/React__default['default'].createElement("div", {
8870
+ className: 'status-label-operate'
8871
+ }, /*#__PURE__*/React__default['default'].createElement("div", {
8872
+ style: !item.isDone ? {
8873
+ height: '40px',
8874
+ lineHeight: '40px'
8875
+ } : {}
8876
+ }, item.text), item.isDone ? /*#__PURE__*/React__default['default'].createElement("div", {
8877
+ title: "".concat(item.modifyUserName || '--', " ").concat(item.modifyTime || '--')
8878
+ }, "".concat(item.modifyUserName || '--', " ").concat(item.modifyTime || '--')) : null), /*#__PURE__*/React__default['default'].createElement("div", {
8879
+ style: {
8880
+ clear: 'both'
8881
+ }
8882
+ }));
8883
+ }));
8884
+ });
8885
+
8886
+ var dragImg = "data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20viewBox%3D%220%200%2024%2024%22%20class%3D%22design-iconfont%22%3E%20%20%3Cdefs%3E%20%20%20%20%3ClinearGradient%20x1%3D%22100%25%22%20y1%3D%2250%25%22%20x2%3D%220%25%22%20y2%3D%2250%25%22%20id%3D%22l1lf23lgga%22%3E%20%20%20%20%20%20%3Cstop%20stop-color%3D%22%2310295B%22%20offset%3D%220%25%22%2F%3E%20%20%20%20%20%20%3Cstop%20stop-color%3D%22%230F2A61%22%20offset%3D%22100%25%22%2F%3E%20%20%20%20%3C%2FlinearGradient%3E%20%20%20%20%3Cpath%20id%3D%22okxu11mz5b%22%20d%3D%22M0%200H24V24H0z%22%2F%3E%20%20%3C%2Fdefs%3E%20%20%3Cg%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%20%20%20%20%3Cmask%20id%3D%227u8dk2lilc%22%20fill%3D%22%23fff%22%3E%20%20%20%20%20%20%3Cuse%20xlink%3Ahref%3D%22%23okxu11mz5b%22%2F%3E%20%20%20%20%3C%2Fmask%3E%20%20%20%20%3Cg%20mask%3D%22url%28%237u8dk2lilc%29%22%20fill%3D%22%23999%22%20fill-rule%3D%22nonzero%22%3E%20%20%20%20%20%20%3Cpath%20d%3D%22M1.31655092%2C7%20C2.03935948%2C7%202.6253116%2C7.58595212%202.6253116%2C8.30876068%20C2.6253116%2C9.03156925%202.03935948%2C9.61752137%201.31655092%2C9.61752137%20C0.593742351%2C9.61752137%200.00779023438%2C9.03156925%200.00779023438%2C8.30876068%20C0.00779023438%2C7.58595212%200.593742351%2C7%201.31655092%2C7%20Z%20M6.99034011%2C7%20C7.71314867%2C7%208.29910079%2C7.58595212%208.29910079%2C8.30876068%20C8.29910079%2C9.03156925%207.71314867%2C9.61752137%206.99034011%2C9.61752137%20C6.26753154%2C9.61752137%205.68157942%2C9.03156925%205.68157942%2C8.30876068%20C5.68157942%2C7.58595212%206.26753154%2C7%206.99034011%2C7%20Z%20M12.6641293%2C7%20C13.3869378%2C7%2013.97289%2C7.58595212%2013.97289%2C8.30876068%20C13.97289%2C9.03156925%2013.3869378%2C9.61752137%2012.6641293%2C9.61752137%20C11.9413207%2C9.61752137%2011.3553686%2C9.03156925%2011.3553686%2C8.30876068%20C11.3553686%2C7.58595212%2011.9413207%2C7%2012.6641293%2C7%20Z%20M1.31655092%2C-5.32907052e-15%20C2.03935948%2C-5.32907052e-15%202.6253116%2C0.585952117%202.6253116%2C1.30876068%20C2.6253116%2C2.03156925%202.03935948%2C2.61752137%201.31655092%2C2.61752137%20C0.593742351%2C2.61752137%200.00779023438%2C2.03156925%200.00779023438%2C1.30876068%20C0.00779023438%2C0.585952117%200.593742351%2C-5.32907052e-15%201.31655092%2C-5.32907052e-15%20Z%20M6.99034011%2C-5.32907052e-15%20C7.71314867%2C-5.32907052e-15%208.29910079%2C0.585952117%208.29910079%2C1.30876068%20C8.29910079%2C2.03156925%207.71314867%2C2.61752137%206.99034011%2C2.61752137%20C6.26753154%2C2.61752137%205.68157942%2C2.03156925%205.68157942%2C1.30876068%20C5.68157942%2C0.585952117%206.26753154%2C-5.32907052e-15%206.99034011%2C-5.32907052e-15%20Z%20M12.6641293%2C-5.32907052e-15%20C13.3869378%2C-5.32907052e-15%2013.97289%2C0.585952117%2013.97289%2C1.30876068%20C13.97289%2C2.03156925%2013.3869378%2C2.61752137%2012.6641293%2C2.61752137%20C11.9413207%2C2.61752137%2011.3553686%2C2.03156925%2011.3553686%2C1.30876068%20C11.3553686%2C0.585952117%2011.9413207%2C-5.32907052e-15%2012.6641293%2C-5.32907052e-15%20Z%22%20transform%3D%22translate%285%207%29%22%2F%3E%20%20%20%20%3C%2Fg%3E%20%20%3C%2Fg%3E%3C%2Fsvg%3E";
8887
+
8888
+ var label_icon_bottom = "data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20width%3D%2224px%22%20height%3D%2224px%22%20viewBox%3D%220%200%2024%2024%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%20%20%20%20%3Ctitle%3E%E7%BC%96%E7%BB%84%203%E5%A4%87%E4%BB%BD%204%3C%2Ftitle%3E%20%20%20%20%3Cdefs%3E%20%20%20%20%20%20%20%20%3Crect%20id%3D%22path-1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2224%22%20height%3D%2224%22%3E%3C%2Frect%3E%20%20%20%20%3C%2Fdefs%3E%20%20%20%20%3Cg%20id%3D%22%E9%A1%B5%E9%9D%A2-1%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%20%20%20%20%20%20%20%20%3Cg%20id%3D%22%E5%8D%95%E6%8D%AE-%E8%AF%A6%E6%83%85%E9%A1%B5%EF%BC%88%E4%BA%8C%E7%BA%A7%E9%A1%B5%EF%BC%89-%E4%B8%8B%E6%8B%89%22%20transform%3D%22translate%28-1858.000000%2C%20-1326.000000%29%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22%E7%BC%96%E7%BB%84-20%22%20transform%3D%22translate%28280.000000%2C%20866.000000%29%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22%E7%BC%96%E7%BB%84-5%22%20transform%3D%22translate%281554.000000%2C%20179.000000%29%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22%E7%BC%96%E7%BB%84-3%E5%A4%87%E4%BB%BD-4%22%20transform%3D%22translate%2824.000000%2C%20281.000000%29%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cmask%20id%3D%22mask-2%22%20fill%3D%22white%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cuse%20xlink%3Ahref%3D%22%23path-1%22%3E%3C%2Fuse%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fmask%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cuse%20id%3D%22%E8%92%99%E7%89%88%22%20fill%3D%22%23D8D8D8%22%20opacity%3D%220%22%20xlink%3Ahref%3D%22%23path-1%22%3E%3C%2Fuse%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22%E7%BC%96%E7%BB%84%22%20mask%3D%22url%28%23mask-2%29%22%20fill%3D%22%23B1BAD4%22%20fill-rule%3D%22nonzero%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20transform%3D%22translate%283.000000%2C%203.000000%29%22%20id%3D%22%E5%BD%A2%E7%8A%B6%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M5.99072727%2C0.237481917%20C6.50454545%2C-0.0418576482%206.56509091%2C-0.0745634228%206.97254545%2C0.138292264%20L7.15527271%2C0.236945765%20C7.31727271%2C0.445512161%207.34672726%2C0.483579531%207.3761818%2C0.664265595%20L7.39690908%2C0.809565049%20L7.39690908%2C17%20L5.76054545%2C17%20L5.76054545%2C2.73974241%20L1.15690909%2C7.26654448%20L0%2C6.12934831%20L5.99072727%2C0.237481917%20Z%20M13.0909091%2C13.6720525%20L13.0909091%2C15.2805337%20L9.81818182%2C15.2805337%20L9.81818182%2C13.6720525%20L13.0909091%2C13.6720525%20Z%20M14.7272727%2C9.91892987%20L14.7272727%2C11.527411%20L9.81818182%2C11.527411%20L9.81818182%2C9.91892987%20L14.7272727%2C9.91892987%20Z%20M16.3636364%2C6.16580723%20L16.3636364%2C7.77428836%20L9.81818182%2C7.77428836%20L9.81818182%2C6.16580723%20L16.3636364%2C6.16580723%20Z%20M18%2C2.41268459%20L18%2C4.02116572%20L9.81818182%2C4.02116572%20L9.81818182%2C2.41268459%20L18%2C2.41268459%20Z%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%3C%2Fg%3E%3C%2Fsvg%3E";
8889
+
8890
+ var arrow_top = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAAXNSR0IArs4c6QAAAuBJREFUaEPtl0urjlEUx3/HXUkpErkkJAYoGbhkJB2SW2IgBibKVL6Cz2BgQMqAXCKXiHIGBhiIDJEJyjXlfu2vtWp36nj2fvZ+HG/tXW/n7bz7Wft/WXut9fTR46uvx/FTCQy3g9WB6kCmAjWFMgXMfrw6kC1hZoDqQKaA2Y//Cwd0xq9spEME6JLACOCnnRt+L8qlKwIOeDT8GRi/Ap2Q6ILASOAHsAo4DEwGDgAnAP+tmAulCTjANcBpA6/812e3kRgFfC/FoCQBByblzxl4Tx399hnYA5wq6UQpAq78ClN+mqWR/q+llNL3T8BO4AJQxIkSBBz8cgM2FfgCjAXOAC+A/cA3QJf6vZG4UoJELgEHvww4C8wMgF40oB+BI8Bey30p/xbYDtzITaccAg5+CXAJmB4oL3UF8IMBVD84DuwK9rwCNgO3cki0JeDgF9uFnRMof83AK1VU+7VEYBxwDNgR7H0GbAVutyXRhoCDXwhcBmYHql4HtlmeD+7EKqW6A6pCm4JnRGI9cL8NiVQCDn6RKT/fuuwY4CawBXg3BBAnNAE4aaD9Yj+ydHqYSiKFgIOfByjH5wYqDlgqvGkYGZzERCu3a4MYIrEOeJxCIpaAT5RSXE1KDqhJSXldQqXE68iDXYhJwHlgdRDrgTnxxGaoxik2hoCrNgu4CiwIVBN4pc3LxGHNY04xQVYGMXUX+oHnMTFjCPjYouoiyzUSqKLcBTYY+DZd1Z1Q41NKLg1iq4dsjJmXmgh46owHngJSTOuOKa8KkjMmh+4qndRTtHSXZtjo8dcXoiYCCuYB1IQOAfeAfTYitFF+sLDuhMrxUXPioHXvxre5GALhgarjGszUmBqDx6SA7fFYEkSENEtFrRQCfoj+6uOvi1EHRWxyLKo80eKkEIjAUGRLNHjP7yKnDleQ/9GBJC0qgSS5OthcHehA1KSQ1YEkuTrYXB3oQNSkkNWBJLk62NzzDvwGGnWoMahVpG4AAAAASUVORK5CYII=";
8891
+
8892
+ var css_248z$7 = ".form-guide {\n cursor: pointer;\n position: fixed;\n right: 5px;\n color: #B1BAD4;\n padding: 5px 0;\n width: 48px;\n z-index: 10;\n top: 50%;\n transform: translateY(-50%);\n background-color: #141620;\n border-radius: 5px;\n}\n.form-guide .form-guide-top {\n padding: 0px 10px;\n display: flex;\n justify-content: center;\n}\n.form-guide .form-guide-center {\n border-top: 1px solid #6E7588;\n border-bottom: 1px solid #6E7588;\n padding: 0px 10px;\n}\n.form-guide .form-guide-item {\n width: 28px;\n padding: 5px 0;\n display: block;\n word-break: break-all;\n color: #B1BAD4;\n font-size: 14px;\n line-height: 16px;\n position: relative;\n}\n.form-guide .form-guide-item::after {\n content: '';\n display: block;\n width: 15px;\n height: 1px;\n background-color: #6E7588;\n position: absolute;\n bottom: 0px;\n left: 7px;\n}\n.form-guide .form-guide-bottom {\n padding: 5px 10px;\n display: flex;\n justify-content: center;\n}\n.form-guide .form-guide-item:last-child::after {\n content: '';\n display: none;\n width: 15px;\n height: 1px;\n background-color: #6E7588;\n position: absolute;\n bottom: 0px;\n left: 7px;\n}\n.white-card.bitsun-form-card-class .ant-card-body {\n background-color: #FFFFFF;\n padding: 0px;\n}\n.bitsun-form-card-class > .ant-card-body {\n margin-bottom: 10px;\n}\n.bitsun-form-card-class .ant-card-head {\n border: 0px;\n padding: 0px;\n height: 48px;\n}\n.bitsun-form-card-class .ant-card-body {\n padding: 12px 0 0;\n margin-top: -4px;\n background-color: #F3F3F3;\n}\n.bitsun-form-card-class .ant-card-head-title {\n display: flex;\n align-items: center;\n font-size: 16px;\n color: #000000;\n font-weight: 600;\n font-family: PingFangSC;\n background-color: #FFFFFF;\n padding: 8px 0;\n margin: 0px;\n}\n.bitsun-form-card-class .ant-card-head-title .title-left-line {\n display: inline-block;\n width: 4px;\n height: 100%;\n background-color: #005CFF;\n height: 20px;\n margin-right: 16px;\n}\n.field-group-hidden .ant-card-body {\n display: none !important;\n}\n";
8893
+ styleInject(css_248z$7);
8894
+
8895
+ var _excluded$5 = ["children"],
8896
+ _excluded2$2 = ["children"];
8897
+
8898
+ var Field = function Field(_ref) {
8899
+ var children = _ref.children,
8900
+ props = _objectWithoutProperties(_ref, _excluded$5);
8901
+
8902
+ var _React$useState = React__default['default'].useState(true),
8903
+ _React$useState2 = _slicedToArray(_React$useState, 2),
8904
+ fieldGroupVisible = _React$useState2[0],
8905
+ setVisible = _React$useState2[1];
8906
+
8907
+ return /*#__PURE__*/React__default['default'].createElement("div", {
8908
+ className: "bitsun-form-card-class \n ".concat(fieldGroupVisible ? '' : 'field-group-hidden', " \n ").concat(props.isWhiteCard ? 'white-card' : '', "\n "),
8909
+ id: props.id
8910
+ }, /*#__PURE__*/React__default['default'].createElement("div", {
8911
+ className: "ant-card-head"
8912
+ }, /*#__PURE__*/React__default['default'].createElement("div", {
8913
+ className: "ant-card-head-title"
8914
+ }, /*#__PURE__*/React__default['default'].createElement("span", {
8915
+ className: 'title-left-line'
8916
+ }), /*#__PURE__*/React__default['default'].createElement("span", {
8917
+ style: {
8918
+ marginRight: '5px'
8919
+ }
8920
+ }, props === null || props === void 0 ? void 0 : props.title), /*#__PURE__*/React__default['default'].createElement("img", {
8921
+ width: 24,
8922
+ style: {
8923
+ transform: fieldGroupVisible ? 'inherit' : 'rotate(180deg)',
8924
+ cursor: 'pointer'
8925
+ },
8926
+ src: arrow_top,
8927
+ onClick: function onClick(e) {
8928
+ e.stopPropagation();
8929
+ setVisible(!fieldGroupVisible);
8930
+ }
8931
+ }))), /*#__PURE__*/React__default['default'].createElement("div", {
8932
+ className: "ant-card-body"
8933
+ }, children));
8934
+ };
8935
+
8936
+ var GuideWrapper = /*#__PURE__*/function (_Component) {
8937
+ _inherits(GuideWrapper, _Component);
8938
+
8939
+ var _super = _createSuper(GuideWrapper);
8940
+
8941
+ function GuideWrapper() {
8942
+ _classCallCheck(this, GuideWrapper);
8943
+
8944
+ return _super.apply(this, arguments);
8945
+ }
8946
+
8947
+ _createClass(GuideWrapper, [{
8948
+ key: "render",
8949
+ value: function render() {
8950
+ var _this$props = this.props,
8951
+ _this$props$children = _this$props.children,
8952
+ children = _this$props$children === void 0 ? [] : _this$props$children,
8953
+ props = _objectWithoutProperties(_this$props, _excluded2$2);
8954
+
8955
+ var cardGroups = children.filter(function (item) {
8956
+ var _item$props, _item$props2;
8957
+
8958
+ return (item === null || item === void 0 ? void 0 : (_item$props = item.props) === null || _item$props === void 0 ? void 0 : _item$props.id) && (item === null || item === void 0 ? void 0 : (_item$props2 = item.props) === null || _item$props2 === void 0 ? void 0 : _item$props2.title);
8959
+ });
8960
+ return /*#__PURE__*/React__default['default'].createElement("div", _objectSpread2({}, props), children, /*#__PURE__*/React__default['default'].createElement("div", {
8961
+ className: 'form-guide'
8962
+ }, /*#__PURE__*/React__default['default'].createElement("div", {
8963
+ className: 'form-guide-top'
8964
+ }, /*#__PURE__*/React__default['default'].createElement("img", {
8965
+ width: 24,
8966
+ src: dragImg
8967
+ })), /*#__PURE__*/React__default['default'].createElement("div", {
8968
+ className: 'form-guide-center'
8969
+ }, cardGroups.map(function (item) {
8970
+ return /*#__PURE__*/React__default['default'].createElement("span", {
8971
+ className: 'form-guide-item',
8972
+ onClick: function onClick() {
8973
+ var currentDom = document.getElementById(item.props.id);
8974
+ currentDom && currentDom.scrollIntoView({
8975
+ block: 'center',
8976
+ behavior: 'smooth'
8977
+ });
8978
+ }
8979
+ }, item.props.title);
8980
+ })), /*#__PURE__*/React__default['default'].createElement("div", {
8981
+ className: 'form-guide-bottom'
8982
+ }, /*#__PURE__*/React__default['default'].createElement("img", {
8983
+ width: 24,
8984
+ src: label_icon_bottom
8985
+ }))));
8986
+ }
8987
+ }]);
8988
+
8989
+ return GuideWrapper;
8990
+ }(React.Component);
8991
+
8992
+ GuideWrapper.Field = Field;
8993
+
8847
8994
  exports.AddSelect = AddSelect;
8848
8995
  exports.AddSkuSelect = AddSkuSelect;
8849
8996
  exports.BillEntry = BillEntry;
@@ -8853,6 +9000,8 @@ exports.CheckOneUser = index;
8853
9000
  exports.CommodityEntry = CommodityEntry;
8854
9001
  exports.DataImport = DataImport;
8855
9002
  exports.DataValidation = DataValidation;
9003
+ exports.GuideWrapper = GuideWrapper;
8856
9004
  exports.QueryMutipleInput = QueryMutipleInput;
8857
9005
  exports.SearchSelect = SearchSelect;
9006
+ exports.StateFlow = index$2;
8858
9007
  exports.TreeSearchSelect = TreeSearchSelect;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bit-sun/business-component",
3
- "version": "2.0.16",
3
+ "version": "2.0.17",
4
4
  "scripts": {
5
5
  "start": "dumi dev",
6
6
  "docs:build": "dumi build",
package/src/assets/arrow_top.png ADDED
Binary file
package/src/assets/drag.svg ADDED
@@ -0,0 +1,17 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 24 24" class="design-iconfont">
2
+ <defs>
3
+ <linearGradient x1="100%" y1="50%" x2="0%" y2="50%" id="l1lf23lgga">
4
+ <stop stop-color="#10295B" offset="0%"/>
5
+ <stop stop-color="#0F2A61" offset="100%"/>
6
+ </linearGradient>
7
+ <path id="okxu11mz5b" d="M0 0H24V24H0z"/>
8
+ </defs>
9
+ <g fill="none" fill-rule="evenodd">
10
+ <mask id="7u8dk2lilc" fill="#fff">
11
+ <use xlink:href="#okxu11mz5b"/>
12
+ </mask>
13
+ <g mask="url(#7u8dk2lilc)" fill="#999" fill-rule="nonzero">
14
+ <path d="M1.31655092,7 C2.03935948,7 2.6253116,7.58595212 2.6253116,8.30876068 C2.6253116,9.03156925 2.03935948,9.61752137 1.31655092,9.61752137 C0.593742351,9.61752137 0.00779023438,9.03156925 0.00779023438,8.30876068 C0.00779023438,7.58595212 0.593742351,7 1.31655092,7 Z M6.99034011,7 C7.71314867,7 8.29910079,7.58595212 8.29910079,8.30876068 C8.29910079,9.03156925 7.71314867,9.61752137 6.99034011,9.61752137 C6.26753154,9.61752137 5.68157942,9.03156925 5.68157942,8.30876068 C5.68157942,7.58595212 6.26753154,7 6.99034011,7 Z M12.6641293,7 C13.3869378,7 13.97289,7.58595212 13.97289,8.30876068 C13.97289,9.03156925 13.3869378,9.61752137 12.6641293,9.61752137 C11.9413207,9.61752137 11.3553686,9.03156925 11.3553686,8.30876068 C11.3553686,7.58595212 11.9413207,7 12.6641293,7 Z M1.31655092,-5.32907052e-15 C2.03935948,-5.32907052e-15 2.6253116,0.585952117 2.6253116,1.30876068 C2.6253116,2.03156925 2.03935948,2.61752137 1.31655092,2.61752137 C0.593742351,2.61752137 0.00779023438,2.03156925 0.00779023438,1.30876068 C0.00779023438,0.585952117 0.593742351,-5.32907052e-15 1.31655092,-5.32907052e-15 Z M6.99034011,-5.32907052e-15 C7.71314867,-5.32907052e-15 8.29910079,0.585952117 8.29910079,1.30876068 C8.29910079,2.03156925 7.71314867,2.61752137 6.99034011,2.61752137 C6.26753154,2.61752137 5.68157942,2.03156925 5.68157942,1.30876068 C5.68157942,0.585952117 6.26753154,-5.32907052e-15 6.99034011,-5.32907052e-15 Z M12.6641293,-5.32907052e-15 C13.3869378,-5.32907052e-15 13.97289,0.585952117 13.97289,1.30876068 C13.97289,2.03156925 13.3869378,2.61752137 12.6641293,2.61752137 C11.9413207,2.61752137 11.3553686,2.03156925 11.3553686,1.30876068 C11.3553686,0.585952117 11.9413207,-5.32907052e-15 12.6641293,-5.32907052e-15 Z" transform="translate(5 7)"/>
15
+ </g>
16
+ </g>
17
+ </svg>
package/src/assets/label_icon_bottom.svg ADDED
@@ -0,0 +1,26 @@
1
+ <?xml version="1.0" encoding="UTF-8"?>
2
+ <svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
3
+ <title>编组 3备份 4</title>
4
+ <defs>
5
+ <rect id="path-1" x="0" y="0" width="24" height="24"></rect>
6
+ </defs>
7
+ <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
8
+ <g id="单据-详情页（二级页）-下拉" transform="translate(-1858.000000, -1326.000000)">
9
+ <g id="编组-20" transform="translate(280.000000, 866.000000)">
10
+ <g id="编组-5" transform="translate(1554.000000, 179.000000)">
11
+ <g id="编组-3备份-4" transform="translate(24.000000, 281.000000)">
12
+ <mask id="mask-2" fill="white">
13
+ <use xlink:href="#path-1"></use>
14
+ </mask>
15
+ <use id="蒙版" fill="#D8D8D8" opacity="0" xlink:href="#path-1"></use>
16
+ <g id="编组" mask="url(#mask-2)" fill="#B1BAD4" fill-rule="nonzero">
17
+ <g transform="translate(3.000000, 3.000000)" id="形状">
18
+ <path d="M5.99072727,0.237481917 C6.50454545,-0.0418576482 6.56509091,-0.0745634228 6.97254545,0.138292264 L7.15527271,0.236945765 C7.31727271,0.445512161 7.34672726,0.483579531 7.3761818,0.664265595 L7.39690908,0.809565049 L7.39690908,17 L5.76054545,17 L5.76054545,2.73974241 L1.15690909,7.26654448 L0,6.12934831 L5.99072727,0.237481917 Z M13.0909091,13.6720525 L13.0909091,15.2805337 L9.81818182,15.2805337 L9.81818182,13.6720525 L13.0909091,13.6720525 Z M14.7272727,9.91892987 L14.7272727,11.527411 L9.81818182,11.527411 L9.81818182,9.91892987 L14.7272727,9.91892987 Z M16.3636364,6.16580723 L16.3636364,7.77428836 L9.81818182,7.77428836 L9.81818182,6.16580723 L16.3636364,6.16580723 Z M18,2.41268459 L18,4.02116572 L9.81818182,4.02116572 L9.81818182,2.41268459 L18,2.41268459 Z"></path>
19
+ </g>
20
+ </g>
21
+ </g>
22
+ </g>
23
+ </g>
24
+ </g>
25
+ </g>
26
+ </svg>
package/src/components/Business/CommonGuideWrapper/index.less ADDED
@@ -0,0 +1,112 @@
1
+ .form-guide {
2
+ cursor: pointer;
3
+ position: fixed;
4
+ right: 5px;
5
+ color: #B1BAD4;
6
+ padding: 5px 0;
7
+ width: 48px;
8
+ z-index: 10;
9
+ top: 50%;
10
+ transform: translateY(-50%);
11
+ background-color: #141620;
12
+ .form-guide-top {
13
+ padding: 0px 10px;
14
+ display: flex;
15
+ justify-content: center;
16
+ }
17
+ border-radius: 5px;
18
+ .form-guide-center {
19
+ border-top: 1px solid #6E7588;
20
+ border-bottom: 1px solid #6E7588;
21
+ padding: 0px 10px;
22
+ }
23
+ .form-guide-item {
24
+ width: 28px;
25
+ padding: 5px 0;
26
+ display: block;
27
+ word-break: break-all;
28
+ color: #B1BAD4;
29
+ font-size: 14px;
30
+ line-height: 16px;
31
+ position: relative;
32
+ }
33
+ .form-guide-item::after {
34
+ content: '';
35
+ display: block;
36
+ width: 15px;
37
+ height: 1px;
38
+ background-color: #6E7588;
39
+ position: absolute;
40
+ bottom: 0px;
41
+ left: 7px;
42
+ }
43
+
44
+ .form-guide-bottom {
45
+ padding: 5px 10px;
46
+ display: flex;
47
+ justify-content: center;
48
+ }
49
+ .form-guide-item:last-child::after {
50
+ content: '';
51
+ display: none;
52
+ width: 15px;
53
+ height: 1px;
54
+ background-color: #6E7588;
55
+ position: absolute;
56
+ bottom: 0px;
57
+ left: 7px;
58
+ }
59
+ }
60
+
61
+ .white-card.bitsun-form-card-class {
62
+ .ant-card-body {
63
+ background-color: #FFFFFF;
64
+ padding: 0px;
65
+ }
66
+ }
67
+
68
+ .bitsun-form-card-class {
69
+ &>.ant-card-body {
70
+ margin-bottom: 10px;
71
+ }
72
+ }
73
+
74
+ .bitsun-form-card-class {
75
+ .ant-card-head {
76
+ border: 0px;
77
+ padding: 0px;
78
+ height: 48px;
79
+ }
80
+
81
+ .ant-card-body {
82
+ padding: 12px 0 0;
83
+ margin-top: -4px;
84
+ background-color: #F3F3F3;
85
+ }
86
+
87
+ .ant-card-head-title {
88
+ display: flex;
89
+ align-items: center;
90
+ font-size: 16px;
91
+ color: #000000;
92
+ font-weight: 600;
93
+ font-family: PingFangSC;
94
+ background-color: #FFFFFF;
95
+ padding: 8px 0;
96
+ margin: 0px;
97
+ .title-left-line {
98
+ display: inline-block;
99
+ width: 4px;
100
+ height: 100%;
101
+ background-color: #005CFF;
102
+ height: 20px;
103
+ margin-right: 16px;
104
+ }
105
+ }
106
+ }
107
+
108
+ .field-group-hidden {
109
+ .ant-card-body {
110
+ display: none !important;
111
+ }
112
+ }
package/src/components/Business/CommonGuideWrapper/index.md ADDED
@@ -0,0 +1,39 @@
1
+ ---
2
+ nav:
3
+ title: '组件'
4
+ order: 1
5
+ group:
6
+ title: 业务组件
7
+ order: 1
8
+ title: 模块导航容器组件
9
+ order: 1
10
+ ---
11
+
12
+ # GuideWrapper
13
+
14
+
15
+ ## 容器模块导航
16
+
17
+ ```tsx
18
+ import React, { useState } from 'react';
19
+ import { GuideWrapper } from '../../../index.ts';
20
+
21
+ export default () => {
22
+ const { Field } = GuideWrapper;
23
+
24
+ return (
25
+ <GuideWrapper>
26
+ <Field id='test1' title='基础信息'>
27
+ <div style={{height: '400px', textAlign:'center', lineHeight: '400px'}}>模块一</div>
28
+ </Field>
29
+ <Field id='test2' title='销售信息' isWhiteCard={true}>
30
+ <div style={{height: '400px', textAlign:'center', lineHeight: '400px'}}>模块二</div>
31
+ </Field>
32
+ <Field id='test3' title='其他信息'>
33
+ <div style={{height: '400px', textAlign:'center', lineHeight: '400px'}}>模块三</div>
34
+ </Field>
35
+ </GuideWrapper>
36
+
37
+ );
38
+ };
39
+ ```
package/src/components/Business/CommonGuideWrapper/index.tsx ADDED
@@ -0,0 +1,84 @@
1
+ import React, { Component } from "react";
2
+ import dragImg from '../../../assets/drag.svg';
3
+ import label_icon_bottom from '../../../assets/label_icon_bottom.svg';
4
+ import arrow_top from '../../../assets/arrow_top.png';
5
+ import './index.less';
6
+
7
+ const Field = ({ children, ...props }: any) => {
8
+ const [fieldGroupVisible, setVisible] = React.useState(true);
9
+ return (
10
+ <div
11
+ className={
12
+ `bitsun-form-card-class
13
+ ${fieldGroupVisible ? '' : 'field-group-hidden'}
14
+ ${props.isWhiteCard ? 'white-card' : ''}
15
+ `
16
+ }
17
+ id={props.id}
18
+ >
19
+ <div className="ant-card-head">
20
+ <div className="ant-card-head-title">
21
+ <span className='title-left-line'></span>
22
+ <span style={{ marginRight: '5px' }}>
23
+ {props?.title}
24
+ </span>
25
+ <img
26
+ width={24}
27
+ style={{
28
+ transform: fieldGroupVisible ? 'inherit' : 'rotate(180deg)',
29
+ cursor: 'pointer'
30
+ }}
31
+ src={arrow_top}
32
+ onClick={(e) => {
33
+ e.stopPropagation();
34
+ setVisible(!fieldGroupVisible);
35
+ }}
36
+ />
37
+ </div>
38
+ </div>
39
+ <div className="ant-card-body">
40
+ {children}
41
+ </div>
42
+ </div>
43
+ )
44
+ }
45
+
46
+ export default class GuideWrapper extends Component {
47
+ static Field = Field;
48
+ render() {
49
+ const { children = [], ...props }: any = this.props;
50
+ let cardGroups = children.filter((item:any) => item?.props?.id && item?.props?.title);
51
+ return (
52
+ <div {...props}>
53
+ {children}
54
+ <div
55
+ className='form-guide'
56
+ >
57
+ <div className='form-guide-top'>
58
+ <img width={24} src={dragImg} />
59
+ </div>
60
+ <div className='form-guide-center'>
61
+ {
62
+ cardGroups.map((item:any) => {
63
+ return (
64
+ <span
65
+ className='form-guide-item'
66
+ onClick={() => {
67
+ let currentDom = document.getElementById(item.props.id);
68
+ currentDom && currentDom.scrollIntoView({ block: 'center', behavior: 'smooth' });
69
+ }}
70
+ >
71
+ {item.props.title}
72
+ </span>
73
+ )
74
+ })
75
+ }
76
+ </div>
77
+ <div className='form-guide-bottom'>
78
+ <img width={24} src={label_icon_bottom} />
79
+ </div>
80
+ </div>
81
+ </div>
82
+ )
83
+ }
84
+ }
package/src/components/Business/StateFlow/index.less ADDED
@@ -0,0 +1,131 @@
1
+ .form-status-label {
2
+ height: 48px;
3
+ margin-right: 12px;
4
+ // flex-grow: 1;
5
+ // flex-shrink: 1;
6
+ display: inline-block;
7
+ position: relative;
8
+ background-color: #B0B4B7;
9
+ align-items: center;
10
+ }
11
+ .choosed-status-label.form-status-label {
12
+ background-color: #005CFF;
13
+ }
14
+
15
+ .form-status-label:last-child {
16
+ margin-right: 0px;
17
+ }
18
+
19
+ .form-status-label:first-child::after {
20
+ position: absolute;
21
+ display: block;
22
+ content: '';
23
+ right: -48px;
24
+ top: 0;
25
+ width: 48px;
26
+ height: 48px;
27
+ border: 24px solid;
28
+ border-color: transparent transparent transparent transparent;
29
+ border-left: 12px solid #B0B4B7;
30
+ }
31
+
32
+ .choosed-status-label.form-status-label::after {
33
+ border-left: 12px solid #005CFF;
34
+ }
35
+
36
+ .choosed-status-label.form-status-label:not(:first-child):not(:last-child)::after {
37
+ border-left: 12px solid #005CFF;
38
+ }
39
+
40
+ .form-status-label:last-child::after {
41
+ position: absolute;
42
+ display: block;
43
+ content: '';
44
+ left: 0;
45
+ top: 0;
46
+ width: 48px;
47
+ height: 48px;
48
+ border: 24px solid;
49
+ border-color: transparent transparent transparent transparent;
50
+ border-left: 12px solid #ffffff;
51
+ }
52
+
53
+ .form-status-label:not(:first-child):not(:last-child)::before {
54
+ position: absolute;
55
+ display: block;
56
+ content: '';
57
+ left: 0;
58
+ top: 0;
59
+ width: 48px;
60
+ height: 48px;
61
+ border: 24px solid;
62
+ border-color: transparent transparent transparent transparent;
63
+ border-left: 12px solid #ffffff;
64
+ }
65
+
66
+ .form-status-label:not(:first-child):not(:last-child)::after {
67
+ position: absolute;
68
+ display: block;
69
+ content: '';
70
+ right: -48px;
71
+ top: 0;
72
+ width: 48px;
73
+ height: 48px;
74
+ border: 24px solid;
75
+ border-color: transparent transparent transparent transparent;
76
+ border-left: 12px solid #B0B4B7;
77
+ }
78
+
79
+ .status-label-index {
80
+ display: inline-block;
81
+ width: 24px;
82
+ height: 24px;
83
+ border: 1px solid #FFFFFF;
84
+ color: #FFFFFF;
85
+ border-radius: 50%;
86
+ font-family: Montserrat;
87
+ font-size: 14px;line-height: 24px;
88
+ text-align: center;
89
+ margin: 0 6px 0 20px;
90
+ }
91
+
92
+ .status-label-key {
93
+ width: 50px;
94
+ height: 100%;
95
+ display: inline-flex;
96
+ float: left;
97
+ // flex-grow: 0;
98
+ // flex-shrink: 0;
99
+ align-items: center;
100
+ justify-content: center;
101
+ }
102
+
103
+ .status-label-operate {
104
+ // flex-grow: 1;
105
+ // flex-shrink: 1;
106
+ float: left;
107
+ width: calc(100% - 50px);
108
+ overflow: hidden;
109
+ text-overflow: ellipsis;
110
+ white-space: nowrap;
111
+ height: 100%;
112
+ margin: 4px 0;
113
+ &>div {
114
+ font-size: 12px;
115
+ height: 20px;
116
+ line-height: 20px;
117
+ color: #FFFFFF;
118
+ font-family: PingFangSC;
119
+ overflow: hidden;
120
+ text-overflow: ellipsis;
121
+ white-space: nowrap;
122
+ }
123
+ &>div:first-child {
124
+ font-size: 14px;
125
+ font-weight: 600;
126
+ }
127
+ }
128
+
129
+ .only-one-child.form-status-label::after,.only-one-child.form-status-label::before {
130
+ border-left: 0px;
131
+ }
package/src/components/Business/StateFlow/index.md ADDED
@@ -0,0 +1,60 @@
1
+ ---
2
+ nav:
3
+ title: '组件'
4
+ order: 1
5
+ group:
6
+ title: 业务组件
7
+ order: 1
8
+ title: 状态流转
9
+ order: 1
10
+ ---
11
+
12
+ # StateFlow
13
+
14
+
15
+ ## 单据状态流转
16
+
17
+ ```tsx
18
+ import React, { useState } from 'react';
19
+ import { StateFlow } from '../../../index.ts';
20
+
21
+ export default () => {
22
+ const formStatusMapping = [
23
+ {
24
+ text: '状态1',
25
+ modifyUserName: '张三',
26
+ modifyTime: '2022-09-01 12:20:20',
27
+ isDone: true,
28
+ },
29
+ {
30
+ text: '状态2',
31
+ modifyUserName: '李四',
32
+ modifyTime: '2022-09-01 12:20:20',
33
+ isDone: true,
34
+ },
35
+ {
36
+ text: '状态3',
37
+ modifyUserName: '王五',
38
+ modifyTime: '2022-09-01 12:20:20',
39
+ isDone: true,
40
+ },
41
+ {
42
+ text: '状态4',
43
+ modifyUserName: '韩梅梅',
44
+ isDone: true,
45
+ modifyTime: '2022-09-01 12:20:20',
46
+ },
47
+ {
48
+ text: '状态5',
49
+ modifyUserName: '李雷',
50
+ isDone: true,
51
+ modifyTime: '2022-09-01 12:20:20',
52
+ },
53
+ ]
54
+ return (
55
+ <StateFlow
56
+ formStatusMapping={formStatusMapping}
57
+ />
58
+ );
59
+ };
60
+ ```
package/src/components/Business/StateFlow/index.tsx ADDED
@@ -0,0 +1,30 @@
1
+ import React from "react";
2
+ import './index.less'
3
+
4
+ export default (props: any) => {
5
+ const { formStatusMapping = [] } = props;
6
+ return (
7
+ <div style={{display: 'flex', padding: '10px 60px 0px', background: '#FFFFFF'}}>
8
+ {
9
+ formStatusMapping.map((item:any, index:number) => {
10
+ return (
11
+ <div style={{width: `${(100/formStatusMapping.length).toFixed(2)}%`}} className={`form-status-label ${item.isDone ? 'choosed-status-label' : ''} ${formStatusMapping.length === 1 ? 'only-one-child' : ''}`}>
12
+ <div className='status-label-key'>
13
+ <span className='status-label-index'>{index+1}</span>
14
+ </div>
15
+ <div className='status-label-operate'>
16
+ <div style={!item.isDone ? {height: '40px', lineHeight: '40px'} : {}}>{item.text}</div>
17
+ {
18
+ item.isDone ? (
19
+ <div title={`${item.modifyUserName || '--'} ${item.modifyTime || '--'}`}>{`${item.modifyUserName || '--'} ${item.modifyTime || '--'}`}</div>
20
+ ) : null
21
+ }
22
+ </div>
23
+ <div style={{clear: 'both'}}></div>
24
+ </div>
25
+ )
26
+ })
27
+ }
28
+ </div>
29
+ )
30
+ }
package/src/index.ts CHANGED
@@ -20,3 +20,5 @@ export { default as CommodityEntry } from './components/Business/CommodityEntry'
20
20
  export { default as CheckOneUser } from './utils/CheckOneUser';
21
21
  export { default as TreeSearchSelect } from './components/Functional/TreeSearchSelect';
22
22
  export { default as BusinessTreeSearchSelect } from './components/Business/TreeSearchSelect';
23
+ export { default as StateFlow } from './components/Business/StateFlow';
24
+ export { default as GuideWrapper } from './components/Business/CommonGuideWrapper';
package/typings.d.ts CHANGED
@@ -1,2 +1,4 @@
1
1
  declare module '*.css';
2
2
  declare module '*.less';
3
+ declare module '*.png';
4
+ declare module '*.svg';