aldehyde 0.2.197 → 0.2.199

package/src/aldehyde/table/column/column-selector.tsx

@@ -1,130 +1,130 @@
-import React from "react";
-import { Checkbox, Col, Row } from "antd";
-import { ColumnConfig } from "../../tmpl/interface";
-import { MenuOutlined } from "@ant-design/icons";
-import {
-  SortableContainer,
-  SortableElement,
-  SortableHandle,
-} from "react-sortable-hoc";
-import { arrayMoveImmutable } from "array-move";
-import { useLocale } from "../../locale/useLocale";
-
-interface ColumnSelectorProps {
-  columns: ColumnConfig[];
-  hiddenColIds: string[];
-  ignoredColIds?: string[];
-  disabledColIds?: string[];
-  onChangeHiddenCols?: (hiddenColIds: string[]) => void;
-  onChangeColSort?: (columns: ColumnConfig[]) => void;
-}
-
-interface ColumnSelectorStat {}
-
-interface SortableElementProps {
-  index: number;
-  value: string;
-  disabledColIds: string[];
-}
-
-interface SortableContainerProps {
-  selected: string[];
-  items: ColumnConfig[];
-  disabledColIds: string[];
-  onChange: (checkedValues: []) => void;
-}
-
-const SortableCheckbox = SortableElement<SortableElementProps>(
-  ({ value, index, disabledColIds }) => {
-    const { translate } = useLocale();
-    return (
-      <Col key={index} span={24}>
-        <Checkbox disabled={disabledColIds.includes(value.id)} value={value.id}>
-          <DragHandle /> {translate("${" + value.title + "}")}
-        </Checkbox>
-      </Col>
-    );
-  }
-);
-const DragHandle = SortableHandle(() => (
-  <MenuOutlined style={{ cursor: "grab", color: "#999" }} />
-));
-const SortableGroupContainer = SortableContainer<SortableContainerProps>(
-  ({ items, selected, onChange, disabledColIds }) => {
-    return (
-      <Checkbox.Group value={selected} onChange={onChange}>
-        <Row style={{ width: "148px" }}>
-          {items.map((value, index) => (
-            <SortableCheckbox
-              key={`item-${value.id}`}
-              index={index}
-              value={value}
-              disabledColIds={disabledColIds}
-            />
-          ))}
-        </Row>
-      </Checkbox.Group>
-    );
-  }
-);
-
-class ColumnSelector extends React.PureComponent<
-  ColumnSelectorProps,
-  ColumnSelectorStat
-> {
-  static defaultProps = {
-    ignoredColIds: [],
-  };
-
-  onChange = (checkedValues) => {
-    const { onChangeHiddenCols, columns, ignoredColIds } = this.props;
-    //console.log('checked = ', checkedValues);
-    const hiddenColIds = [];
-    for (let c of columns) {
-      if (
-        checkedValues.length != 0 &&
-        !checkedValues.includes(c.id) &&
-        !ignoredColIds.includes(c.id)
-      ) {
-        hiddenColIds.push(c.id);
-      }
-    }
-    onChangeHiddenCols(hiddenColIds);
-  };
-  onSortEnd = ({ oldIndex, newIndex }) => {
-    const { columns, onChangeColSort } = this.props;
-    if (oldIndex !== newIndex) {
-      const newData = arrayMoveImmutable(
-        [].concat(columns),
-        oldIndex,
-        newIndex
-      ).filter((el) => !!el);
-      //console.log('Sorted items: ', newData);
-      onChangeColSort(newData);
-    }
-  };
-
-  render() {
-    const { hiddenColIds, columns, disabledColIds } = this.props;
-    const showColIds_str = [];
-    if (columns) {
-      for (let c of columns) {
-        if (!hiddenColIds || !hiddenColIds.includes(c.id)) {
-          showColIds_str.push(c.id);
-        }
-      }
-    }
-    return (
-      <SortableGroupContainer
-        disabledColIds={disabledColIds}
-        helperClass={"row-dragging"}
-        items={columns}
-        selected={showColIds_str}
-        onChange={this.onChange}
-        onSortEnd={this.onSortEnd}
-      />
-    );
-  }
-}
-
-export default ColumnSelector;
+import React from "react";
+import { Checkbox, Col, Row } from "antd";
+import { ColumnConfig } from "../../tmpl/interface";
+import { MenuOutlined } from "@ant-design/icons";
+import {
+  SortableContainer,
+  SortableElement,
+  SortableHandle,
+} from "react-sortable-hoc";
+import { arrayMoveImmutable } from "array-move";
+import { useLocale } from "../../locale/useLocale";
+
+interface ColumnSelectorProps {
+  columns: ColumnConfig[];
+  hiddenColIds: string[];
+  ignoredColIds?: string[];
+  disabledColIds?: string[];
+  onChangeHiddenCols?: (hiddenColIds: string[]) => void;
+  onChangeColSort?: (columns: ColumnConfig[]) => void;
+}
+
+interface ColumnSelectorStat {}
+
+interface SortableElementProps {
+  index: number;
+  value: string;
+  disabledColIds: string[];
+}
+
+interface SortableContainerProps {
+  selected: string[];
+  items: ColumnConfig[];
+  disabledColIds: string[];
+  onChange: (checkedValues: []) => void;
+}
+
+const SortableCheckbox = SortableElement<SortableElementProps>(
+  ({ value, index, disabledColIds }) => {
+    const { translate } = useLocale();
+    return (
+      <Col key={index} span={24}>
+        <Checkbox disabled={disabledColIds.includes(value.id)} value={value.id}>
+          <DragHandle /> {translate("${" + value.title + "}")}
+        </Checkbox>
+      </Col>
+    );
+  }
+);
+const DragHandle = SortableHandle(() => (
+  <MenuOutlined style={{ cursor: "grab", color: "#999" }} />
+));
+const SortableGroupContainer = SortableContainer<SortableContainerProps>(
+  ({ items, selected, onChange, disabledColIds }) => {
+    return (
+      <Checkbox.Group value={selected} onChange={onChange}>
+        <Row style={{ width: "148px" }}>
+          {items.map((value, index) => (
+            <SortableCheckbox
+              key={`item-${value.id}`}
+              index={index}
+              value={value}
+              disabledColIds={disabledColIds}
+            />
+          ))}
+        </Row>
+      </Checkbox.Group>
+    );
+  }
+);
+
+class ColumnSelector extends React.PureComponent<
+  ColumnSelectorProps,
+  ColumnSelectorStat
+> {
+  static defaultProps = {
+    ignoredColIds: [],
+  };
+
+  onChange = (checkedValues) => {
+    const { onChangeHiddenCols, columns, ignoredColIds } = this.props;
+    //console.log('checked = ', checkedValues);
+    const hiddenColIds = [];
+    for (let c of columns) {
+      if (
+        checkedValues.length != 0 &&
+        !checkedValues.includes(c.id) &&
+        !ignoredColIds.includes(c.id)
+      ) {
+        hiddenColIds.push(c.id);
+      }
+    }
+    onChangeHiddenCols(hiddenColIds);
+  };
+  onSortEnd = ({ oldIndex, newIndex }) => {
+    const { columns, onChangeColSort } = this.props;
+    if (oldIndex !== newIndex) {
+      const newData = arrayMoveImmutable(
+        [].concat(columns),
+        oldIndex,
+        newIndex
+      ).filter((el) => !!el);
+      //console.log('Sorted items: ', newData);
+      onChangeColSort(newData);
+    }
+  };
+
+  render() {
+    const { hiddenColIds, columns, disabledColIds } = this.props;
+    const showColIds_str = [];
+    if (columns) {
+      for (let c of columns) {
+        if (!hiddenColIds || !hiddenColIds.includes(c.id)) {
+          showColIds_str.push(c.id);
+        }
+      }
+    }
+    return (
+      <SortableGroupContainer
+        disabledColIds={disabledColIds}
+        helperClass={"row-dragging"}
+        items={columns}
+        selected={showColIds_str}
+        onChange={this.onChange}
+        onSortEnd={this.onSortEnd}
+      />
+    );
+  }
+}
+
+export default ColumnSelector;

package/src/aldehyde/table/column/index.css

@@ -1,14 +1,14 @@
-
-.row-dragging {
-    background: #fafafa;
-    border: 1px solid #ccc;
-    z-index: 1031;
-}
-
-.row-dragging div {
-    padding: 14px;
-}
-
-.row-dragging .drag-visible {
-    visibility: visible;
+
+.row-dragging {
+    background: #fafafa;
+    border: 1px solid #ccc;
+    z-index: 1031;
+}
+
+.row-dragging div {
+    padding: 14px;
+}
+
+.row-dragging .drag-visible {
+    visibility: visible;
 }

package/src/aldehyde/table/control-table-x-axis-wrapper.tsx

@@ -1,80 +1,80 @@
-import React, {
-  forwardRef,
-  useEffect,
-  useImperativeHandle,
-  useRef,
-} from "react";
-import { Table as _Table, TableProps } from "antd";
-import { TableRef } from "antd/es/table";
-
-const useAntdTableXAxis = () => {
-  const table = useRef<TableRef>(null);
-  useEffect(() => {
-    const tableBody = table.current.nativeElement.querySelector(".ant-table");
-    let isMove = false;
-    const mouseDown = (e) => {
-      if (e.which === 3) isMove = true;
-    };
-    const mouseUp = (e) => {
-      if (e.which === 3) isMove = false;
-    };
-    const mouseMove = (e: any) => {
-      if (isMove) {
-        const { movementX, movementY, offsetX, offsetY } = e;
-        tableBody.scrollBy(movementX * 5, 0);
-        e.preventDefault();
-      }
-    };
-    const contextmenu = (e: any) => {
-      e.preventDefault();
-    };
-    if (tableBody) {
-      tableBody.addEventListener("mousedown", mouseDown);
-      tableBody.addEventListener("mousemove", mouseMove);
-      tableBody.addEventListener("mouseup", mouseUp);
-      tableBody.addEventListener("contextmenu", contextmenu);
-    }
-    return () => {
-      if (tableBody) {
-        tableBody.removeEventListener("mousedown", mouseDown);
-        tableBody.removeEventListener("mousemove", mouseMove);
-        tableBody.removeEventListener("mouseup", mouseUp);
-        tableBody.removeEventListener("contextmenu", contextmenu);
-      }
-    };
-  }, []);
-
-  return {
-    table,
-  };
-};
-
-const Table = (props: TableProps, ref) => {
-  const { table: tableRef } = useAntdTableXAxis();
-
-  useImperativeHandle(
-    ref,
-    () => {
-      return {
-        nativeElement: tableRef.current.nativeElement,
-        scrollTo: tableRef.current.scrollTo,
-      };
-    },
-    []
-  );
-
-  return <_Table {...props} ref={tableRef}></_Table>;
-};
-
-const ForwardTable = (forwardRef(Table) as unknown) as typeof _Table;
-
-ForwardTable.SELECTION_COLUMN = _Table.SELECTION_COLUMN;
-ForwardTable.EXPAND_COLUMN = _Table.EXPAND_COLUMN;
-ForwardTable.SELECTION_ALL = _Table.SELECTION_ALL;
-ForwardTable.SELECTION_INVERT = _Table.SELECTION_INVERT;
-ForwardTable.SELECTION_NONE = _Table.SELECTION_NONE;
-ForwardTable.Column = _Table.Column;
-ForwardTable.ColumnGroup = _Table.ColumnGroup;
-ForwardTable.Summary = _Table.Summary;
-// 这里为可以右键滑动控制X轴坐标的二封 antd 的 table 组件
-export default ForwardTable;
+import React, {
+  forwardRef,
+  useEffect,
+  useImperativeHandle,
+  useRef,
+} from "react";
+import { Table as _Table, TableProps } from "antd";
+import { TableRef } from "antd/es/table";
+
+const useAntdTableXAxis = () => {
+  const table = useRef<TableRef>(null);
+  useEffect(() => {
+    const tableBody = table.current.nativeElement.querySelector(".ant-table");
+    let isMove = false;
+    const mouseDown = (e) => {
+      if (e.which === 3) isMove = true;
+    };
+    const mouseUp = (e) => {
+      if (e.which === 3) isMove = false;
+    };
+    const mouseMove = (e: any) => {
+      if (isMove) {
+        const { movementX, movementY, offsetX, offsetY } = e;
+        tableBody.scrollBy(movementX * 5, 0);
+        e.preventDefault();
+      }
+    };
+    const contextmenu = (e: any) => {
+      e.preventDefault();
+    };
+    if (tableBody) {
+      tableBody.addEventListener("mousedown", mouseDown);
+      tableBody.addEventListener("mousemove", mouseMove);
+      tableBody.addEventListener("mouseup", mouseUp);
+      tableBody.addEventListener("contextmenu", contextmenu);
+    }
+    return () => {
+      if (tableBody) {
+        tableBody.removeEventListener("mousedown", mouseDown);
+        tableBody.removeEventListener("mousemove", mouseMove);
+        tableBody.removeEventListener("mouseup", mouseUp);
+        tableBody.removeEventListener("contextmenu", contextmenu);
+      }
+    };
+  }, []);
+
+  return {
+    table,
+  };
+};
+
+const Table = (props: TableProps, ref) => {
+  const { table: tableRef } = useAntdTableXAxis();
+
+  useImperativeHandle(
+    ref,
+    () => {
+      return {
+        nativeElement: tableRef.current.nativeElement,
+        scrollTo: tableRef.current.scrollTo,
+      };
+    },
+    []
+  );
+
+  return <_Table {...props} ref={tableRef}></_Table>;
+};
+
+const ForwardTable = (forwardRef(Table) as unknown) as typeof _Table;
+
+ForwardTable.SELECTION_COLUMN = _Table.SELECTION_COLUMN;
+ForwardTable.EXPAND_COLUMN = _Table.EXPAND_COLUMN;
+ForwardTable.SELECTION_ALL = _Table.SELECTION_ALL;
+ForwardTable.SELECTION_INVERT = _Table.SELECTION_INVERT;
+ForwardTable.SELECTION_NONE = _Table.SELECTION_NONE;
+ForwardTable.Column = _Table.Column;
+ForwardTable.ColumnGroup = _Table.ColumnGroup;
+ForwardTable.Summary = _Table.Summary;
+// 这里为可以右键滑动控制X轴坐标的二封 antd 的 table 组件
+export default ForwardTable;

package/src/aldehyde/table/index.css

@@ -1,71 +1,71 @@
-.editTableList .ant-upload-list-picture .ant-upload-list-item {
-  width: 110px;
-}
-.SearchForm {
-  padding: 8px;
-  background: #fff;
-  box-shadow: 0 0 5px rgb(187, 182, 182);
-  border-radius: 3px;
-}
-.actTable button {
-  margin-right: 5px;
-}
-.actTable a {
-  margin-right: 5px;
-}
-.actTable h3 {
-  font-size: 18px;
-}
-
-.row-dragging {
-  background: #fafafa;
-  border: 1px solid #ccc;
-  z-index: 9999;
-}
-
-.row-dragging td {
-  padding: 14px;
-}
-
-.row-dragging .drag-visible {
-  visibility: visible;
-}
-
-.opsColumn {
-  min-width: 156px;
-}
-
-.ant-table {
-  line-height: 1;
-  overflow-x: auto;
-  overflow-y: hidden;
-}
-
-/*.collapse .ant-card-body {*/
-/*    padding:0px*/
-/*}*/
-
-/*.ant-card-head-title button{*/
-/*    font-size: 16px;*/
-/*    padding:0px;*/
-/*}*/
-
-.ant-table-cell:has(.xiaoji) {
-  background-color: var(--color-1) !important;
-}
-
-.ant-table-cell:has(.zongji) {
-  background-color: var(--color-3) !important;
-}
-
-.xiaoji {
-  background-color: var(--color-1) !important;
-}
-
-.zongji {
-  background-color: var(--color-3) !important;
-}
-
-.sortable-item-hover:hover > td {
-  background-color: var(--ant-table-row-hover-bg);
-}
+.editTableList .ant-upload-list-picture .ant-upload-list-item {
+  width: 110px;
+}
+.SearchForm {
+  padding: 8px;
+  background: #fff;
+  box-shadow: 0 0 5px rgb(187, 182, 182);
+  border-radius: 3px;
+}
+.actTable button {
+  margin-right: 5px;
+}
+.actTable a {
+  margin-right: 5px;
+}
+.actTable h3 {
+  font-size: 18px;
+}
+
+.row-dragging {
+  background: #fafafa;
+  border: 1px solid #ccc;
+  z-index: 9999;
+}
+
+.row-dragging td {
+  padding: 14px;
+}
+
+.row-dragging .drag-visible {
+  visibility: visible;
+}
+
+.opsColumn {
+  min-width: 156px;
+}
+
+.ant-table {
+  line-height: 1;
+  overflow-x: auto;
+  overflow-y: hidden;
+}
+
+/*.collapse .ant-card-body {*/
+/*    padding:0px*/
+/*}*/
+
+/*.ant-card-head-title button{*/
+/*    font-size: 16px;*/
+/*    padding:0px;*/
+/*}*/
+
+.ant-table-cell:has(.xiaoji) {
+  background-color: var(--color-1) !important;
+}
+
+.ant-table-cell:has(.zongji) {
+  background-color: var(--color-3) !important;
+}
+
+.xiaoji {
+  background-color: var(--color-1) !important;
+}
+
+.zongji {
+  background-color: var(--color-3) !important;
+}
+
+.sortable-item-hover:hover > td {
+  background-color: var(--ant-table-row-hover-bg);
+}