@bit-sun/business-component 2.3.22-beta9 → 2.3.23-beta01

package/src/components/Business/JsonQueryTable/components/MaintainOptions.tsx

@@ -1,127 +1,127 @@
-import React, { useRef } from 'react';
-import { Button, Input, Modal } from 'antd';
-import { Table } from 'bssula';
-import { uuid } from '@/utils/utils';
-
-export default (props: any) => {
-  const tableRef:any = useRef(null);
-  const { onParentOk, record } = props;
-  const config = {
-    initialDataSource:
-      Object.keys(record.choiceInfo || {})?.map((d: any) => ({
-        text: record.choiceInfo[d],
-        value: d,
-        id: uuid(),
-      })) || [],
-    columns: [
-      {
-        key: 'value',
-        title: '值',
-        render: ({ text, record }: any) => {
-          return (
-            <Input
-              onChange={(e) => {
-                record['value'] = e.target.value;
-              }}
-              value={text}
-            />
-          );
-        },
-      },
-      {
-        key: 'text',
-        title: '文本',
-        render: ({ record, text }: any) => {
-          return (
-            <Input
-              onChange={(e) => {
-                record['text'] = e.target.value;
-              }}
-              value={text}
-            />
-          );
-        },
-      },
-      {
-        key: 'operation',
-        title: '操作',
-        render: [
-          {
-            type: 'link',
-            props: {
-              children: '删除',
-            },
-            action: ({ record, table }: any) => {
-              table.setDataSource(
-                table.getDataSource().filter((d: any) => d.id !== record.id),
-              );
-            },
-          },
-        ],
-      },
-    ],
-    rowKey: 'id',
-    onChange: (pag:any) => {
-      tableRef?.current?.setPagination(pag);
-    },
-    footer: () => {
-      return (
-        <div>
-          <Button
-            type={'primary'}
-            onClick={() => {
-              const data = tableRef?.current?.getDataSource();
-              tableRef?.current?.setDataSource([
-                ...data,
-                {
-                  id: uuid(),
-                },
-              ]);
-            }}
-          >
-            添加一行
-          </Button>
-          <Button
-            onClick={() => {
-              const data = tableRef?.current?.getDataSource();
-              tableRef?.current?.setDataSource([
-                ...data,
-                {
-                  id: uuid(),
-                },
-                {
-                  id: uuid(),
-                },
-                {
-                  id: uuid(),
-                },
-                {
-                  id: uuid(),
-                },
-                {
-                  id: uuid(),
-                },
-              ]);
-            }}
-          >
-            添加五行
-          </Button>
-        </div>
-      );
-    },
-  };
-  return (
-    <Modal
-      {...props}
-      maskClosable={false}
-      onOk={() => {
-        onParentOk(
-          tableRef?.current?.getDataSource().filter((d: any) => d.text && d.value),
-        );
-      }}
-    >
-      <Table {...config} style={{ width: '500px' }} ref={tableRef} />
-    </Modal>
-  );
-};
-
+import React, { useRef } from 'react';
+import { Button, Input, Modal } from 'antd';
+import { Table } from 'bssula';
+import { uuid } from '@/utils/utils';
+
+export default (props: any) => {
+  const tableRef:any = useRef(null);
+  const { onParentOk, record } = props;
+  const config = {
+    initialDataSource:
+      Object.keys(record.choiceInfo || {})?.map((d: any) => ({
+        text: record.choiceInfo[d],
+        value: d,
+        id: uuid(),
+      })) || [],
+    columns: [
+      {
+        key: 'value',
+        title: '值',
+        render: ({ text, record }: any) => {
+          return (
+            <Input
+              onChange={(e) => {
+                record['value'] = e.target.value;
+              }}
+              value={text}
+            />
+          );
+        },
+      },
+      {
+        key: 'text',
+        title: '文本',
+        render: ({ record, text }: any) => {
+          return (
+            <Input
+              onChange={(e) => {
+                record['text'] = e.target.value;
+              }}
+              value={text}
+            />
+          );
+        },
+      },
+      {
+        key: 'operation',
+        title: '操作',
+        render: [
+          {
+            type: 'link',
+            props: {
+              children: '删除',
+            },
+            action: ({ record, table }: any) => {
+              table.setDataSource(
+                table.getDataSource().filter((d: any) => d.id !== record.id),
+              );
+            },
+          },
+        ],
+      },
+    ],
+    rowKey: 'id',
+    onChange: (pag:any) => {
+      tableRef?.current?.setPagination(pag);
+    },
+    footer: () => {
+      return (
+        <div>
+          <Button
+            type={'primary'}
+            onClick={() => {
+              const data = tableRef?.current?.getDataSource();
+              tableRef?.current?.setDataSource([
+                ...data,
+                {
+                  id: uuid(),
+                },
+              ]);
+            }}
+          >
+            添加一行
+          </Button>
+          <Button
+            onClick={() => {
+              const data = tableRef?.current?.getDataSource();
+              tableRef?.current?.setDataSource([
+                ...data,
+                {
+                  id: uuid(),
+                },
+                {
+                  id: uuid(),
+                },
+                {
+                  id: uuid(),
+                },
+                {
+                  id: uuid(),
+                },
+                {
+                  id: uuid(),
+                },
+              ]);
+            }}
+          >
+            添加五行
+          </Button>
+        </div>
+      );
+    },
+  };
+  return (
+    <Modal
+      {...props}
+      maskClosable={false}
+      onOk={() => {
+        onParentOk(
+          tableRef?.current?.getDataSource().filter((d: any) => d.text && d.value),
+        );
+      }}
+    >
+      <Table {...config} style={{ width: '500px' }} ref={tableRef} />
+    </Modal>
+  );
+};
+

package/src/components/Business/JsonQueryTable/configButton/index.js

@@ -1,20 +1,20 @@
-import React from 'react';
-import { Affix, Button } from 'antd';
-import { SettingOutlined } from '@ant-design/icons';
-
-export default props => {
-  const { onClick } = props;
-
-  const style = { position: 'fixed', top: 360, right: 24, zIndex: 1001 };
-
-  return (
-    <Affix style={style}>
-      <Button
-        style={{ width: 50, height: 50, lineHeight: '57px' }}
-        icon={<SettingOutlined style={{ fontSize: 30 }} />}
-        type="primary"
-        onClick={onClick}
-      />
-    </Affix>
-  );
-};
+import React from 'react';
+import { Affix, Button } from 'antd';
+import { SettingOutlined } from '@ant-design/icons';
+
+export default props => {
+  const { onClick } = props;
+
+  const style = { position: 'fixed', top: 360, right: 24, zIndex: 1001 };
+
+  return (
+    <Affix style={style}>
+      <Button
+        style={{ width: 50, height: 50, lineHeight: '57px' }}
+        icon={<SettingOutlined style={{ fontSize: 30 }} />}
+        type="primary"
+        onClick={onClick}
+      />
+    </Affix>
+  );
+};

package/src/components/Business/JsonQueryTable/configTree/component/compactArrayView.js

@@ -1,25 +1,25 @@
-import React from 'react';
-
-const prefixCls = 'tree-compact';
-
-export default class CompactArrayView extends React.Component {
-  shouldComponentUpdate(nextProps) {
-    return nextProps.array.length !== this.props.array.length;
-  }
-
-  render() {
-    let { array } = this.props;
-    let count = array.length;
-
-    if (count === 0) {
-      return <span>{'[ ]'}</span>;
-    }
-    return (
-      <span className={prefixCls}>
-        <span>{'['}</span>
-        <span>{count + ' element' + (count > 1 ? 's' : '')}</span>
-        <span>{']'}</span>
-      </span>
-    );
-  }
-}
+import React from 'react';
+
+const prefixCls = 'tree-compact';
+
+export default class CompactArrayView extends React.Component {
+  shouldComponentUpdate(nextProps) {
+    return nextProps.array.length !== this.props.array.length;
+  }
+
+  render() {
+    let { array } = this.props;
+    let count = array.length;
+
+    if (count === 0) {
+      return <span>{'[ ]'}</span>;
+    }
+    return (
+      <span className={prefixCls}>
+        <span>{'['}</span>
+        <span>{count + ' element' + (count > 1 ? 's' : '')}</span>
+        <span>{']'}</span>
+      </span>
+    );
+  }
+}

package/src/components/Business/JsonQueryTable/configTree/component/compactObjectView.js

@@ -1,30 +1,30 @@
-import React from 'react';
-
-const prefixCls = 'tree-compact';
-
-export default class CompactObjectView extends React.Component {
-  shouldComponentUpdate(nextProps) {
-    const nextLength = Object.keys(nextProps.object).length;
-    const prevLength = Object.keys(this.props.object).length;
-    return nextLength !== prevLength;
-  }
-
-  render() {
-    let keys = this.props.object.map(v => v.name);
-    let count = keys.length;
-
-    if (count === 0) {
-      return <span>{'{ }'}</span>;
-    }
-    if (count > 2) {
-      keys = keys.slice(0, 2).concat([`... +${count - 2}`]);
-    }
-    return (
-      <span className={prefixCls}>
-        <span>{'{'}</span>
-        <span>{keys.join(', ')}</span>
-        <span>{'}'}</span>
-      </span>
-    );
-  }
-}
+import React from 'react';
+
+const prefixCls = 'tree-compact';
+
+export default class CompactObjectView extends React.Component {
+  shouldComponentUpdate(nextProps) {
+    const nextLength = Object.keys(nextProps.object).length;
+    const prevLength = Object.keys(this.props.object).length;
+    return nextLength !== prevLength;
+  }
+
+  render() {
+    let keys = this.props.object.map(v => v.name);
+    let count = keys.length;
+
+    if (count === 0) {
+      return <span>{'{ }'}</span>;
+    }
+    if (count > 2) {
+      keys = keys.slice(0, 2).concat([`... +${count - 2}`]);
+    }
+    return (
+      <span className={prefixCls}>
+        <span>{'{'}</span>
+        <span>{keys.join(', ')}</span>
+        <span>{'}'}</span>
+      </span>
+    );
+  }
+}

package/src/components/Business/JsonQueryTable/configTree/index.js

@@ -1,82 +1,82 @@
-import React, { useState, useEffect } from 'react';
-import castArray from 'lodash/castArray';
-import createTreeData, { getConfigNode } from './parser';
-import { createHighLightTreeData, clearActiveNode } from './parser/highlight';
-import TreeNode from './treeNode';
-import iconRender from './render/iconRender';
-import nameRender from './render/nameRender';
-
-import './index.less';
-
-export { iconRender, nameRender };
-
-function parseData(data) {
-  let res;
-  try {
-    res = createTreeData(getConfigNode(data));
-  } catch (e) {}
-
-  return res;
-}
-
-export default props => {
-  const {
-    data,
-    onToggle,
-    onSelect,
-    nameRender,
-    iconRender,
-    contextMenuRender,
-    style,
-    level = 0,
-    currentLine,
-  } = props;
-  const [treeData, setTreeData] = useState(parseData(data));
-  const [activeLine, setActiveLine] = useState(-1);
-
-  useEffect(() => {
-    setTreeData(parseData(data));
-  }, [data]);
-
-  useEffect(() => {
-    if (!treeData || !treeData[0]) {
-      setActiveLine(-1);
-    } else {
-      setActiveLine(currentLine);
-    }
-  }, [treeData, currentLine]);
-
-  useEffect(() => {
-    setTimeout(() => {
-      setTreeData(createHighLightTreeData(treeData, activeLine));
-    });
-  }, [activeLine]);
-
-  const handleSelect = (node, hasChildren) => {
-    const noActiveData = clearActiveNode(treeData);
-    setTreeData(noActiveData);
-    onSelect(node, hasChildren);
-  };
-
-  return (
-    <div className="si-tree" style={style}>
-      {castArray(treeData).map((node, index) => {
-        if (!node) return;
-
-        return (
-          <TreeNode
-            data={node}
-            onToggle={onToggle}
-            onSelect={handleSelect}
-            nameRender={nameRender}
-            iconRender={iconRender}
-            contextMenuRender={contextMenuRender}
-            key={node.name || index}
-            level={level}
-            activeLine={activeLine}
-          />
-        );
-      })}
-    </div>
-  );
-};
+import React, { useState, useEffect } from 'react';
+import castArray from 'lodash/castArray';
+import createTreeData, { getConfigNode } from './parser';
+import { createHighLightTreeData, clearActiveNode } from './parser/highlight';
+import TreeNode from './treeNode';
+import iconRender from './render/iconRender';
+import nameRender from './render/nameRender';
+
+import './index.less';
+
+export { iconRender, nameRender };
+
+function parseData(data) {
+  let res;
+  try {
+    res = createTreeData(getConfigNode(data));
+  } catch (e) {}
+
+  return res;
+}
+
+export default props => {
+  const {
+    data,
+    onToggle,
+    onSelect,
+    nameRender,
+    iconRender,
+    contextMenuRender,
+    style,
+    level = 0,
+    currentLine,
+  } = props;
+  const [treeData, setTreeData] = useState(parseData(data));
+  const [activeLine, setActiveLine] = useState(-1);
+
+  useEffect(() => {
+    setTreeData(parseData(data));
+  }, [data]);
+
+  useEffect(() => {
+    if (!treeData || !treeData[0]) {
+      setActiveLine(-1);
+    } else {
+      setActiveLine(currentLine);
+    }
+  }, [treeData, currentLine]);
+
+  useEffect(() => {
+    setTimeout(() => {
+      setTreeData(createHighLightTreeData(treeData, activeLine));
+    });
+  }, [activeLine]);
+
+  const handleSelect = (node, hasChildren) => {
+    const noActiveData = clearActiveNode(treeData);
+    setTreeData(noActiveData);
+    onSelect(node, hasChildren);
+  };
+
+  return (
+    <div className="si-tree" style={style}>
+      {castArray(treeData).map((node, index) => {
+        if (!node) return;
+
+        return (
+          <TreeNode
+            data={node}
+            onToggle={onToggle}
+            onSelect={handleSelect}
+            nameRender={nameRender}
+            iconRender={iconRender}
+            contextMenuRender={contextMenuRender}
+            key={node.name || index}
+            level={level}
+            activeLine={activeLine}
+          />
+        );
+      })}
+    </div>
+  );
+};

package/src/components/Business/JsonQueryTable/configTree/index.less

@@ -1,44 +1,44 @@
-// hover background
-@hover-background: #1990ffab;
-
-.si-tree {
-  font-size: 14px;
-
-  &-node {
-    &-block {
-      display: flex;
-      align-items: center;
-      padding: 2px 4px;
-      cursor: pointer;
-      user-select: none;
-      &:hover {
-        background-color: @hover-background;
-        color: #fff;
-      }
-
-      &-actived {
-        background-color: @hover-background;
-        color: #fff;
-      }
-    }
-
-    &-switcher {
-      margin-right: 2px;
-    }
-
-    &-icon {
-      margin-right: 4px;
-      display: flex;
-    }
-
-    &-name {
-    }
-  }
-}
-
-.tree-compact {
-  margin-left: 4px;
-  font-size: 13px;
-  font-style: italic;
-  color: #49aa19;
-}
+// hover background
+@hover-background: #1990ffab;
+
+.si-tree {
+  font-size: 14px;
+
+  &-node {
+    &-block {
+      display: flex;
+      align-items: center;
+      padding: 2px 4px;
+      cursor: pointer;
+      user-select: none;
+      &:hover {
+        background-color: @hover-background;
+        color: #fff;
+      }
+
+      &-actived {
+        background-color: @hover-background;
+        color: #fff;
+      }
+    }
+
+    &-switcher {
+      margin-right: 2px;
+    }
+
+    &-icon {
+      margin-right: 4px;
+      display: flex;
+    }
+
+    &-name {
+    }
+  }
+}
+
+.tree-compact {
+  margin-left: 4px;
+  font-size: 13px;
+  font-style: italic;
+  color: #49aa19;
+}