aldehyde 0.2.480 → 0.2.481

package/src/aldehyde/list/vertical-list/item.tsx

@@ -1,136 +1,136 @@
-import React, { useState, useMemo } from "react";
-import { Row, Col, Space, Button, Descriptions } from "antd";
-import { DownOutlined, UpOutlined } from '@ant-design/icons';
-import { useLocale } from "../../locale/useLocale";
-import ViewControl from "../../controls/view-control";
-import { CardListConfig, FieldConfig } from "../../tmpl/interface";
-import "./index.less";
-
-type Props = {
-    listConfig?: CardListConfig;
-    current?: any;
-    renderOpt?: React.ReactNode;
-    serverKey?: string;
-    columnConfigs?: FieldConfig[];
-};
-
-const dataKeys = ["primaryColumn", "primaryColumnLabel", "secondColumn", "secondColumnLabel", "cardShowCols", "labelColumn", "mainPicture", "mainPictureLabel"];
-
-const Index = (props: Props) => {
-    const { listConfig, current, renderOpt, serverKey, columnConfigs } = props;
-    const [detailOpen, setDetailOpen] = useState<boolean>(false);
-    const [detailColumn, setDetailColumn] = useState<FieldConfig[]>([]);
-    const { translate } = useLocale();
-
-    const initViewList = () => {
-        const itemList = [];
-        if (detailColumn.length > 0) {
-            detailColumn.forEach((item, index) => {
-                let fieldValue = current ? current[item.id] : undefined;
-                //fieldValue 没有值时不能为null 要为 undefined。antd input所限制
-                fieldValue = fieldValue ? fieldValue : item.defaultValue ? item.defaultValue : undefined;
-                const domItem = (
-                    <div className="detail-content-item" key={index}>
-                        <div className="title">{translate("${" + item.title + "}")}：</div>
-                        <div className="element">
-                            <ViewControl
-                                serverKey={serverKey}
-                                holderType={"table"}
-                                value={fieldValue}
-                                fieldConfig={item}
-                            />
-                        </div>
-                    </div>
-                );
-                itemList.push(domItem);
-            });
-        }
-        return itemList;
-    };
-
-    const handleData = (item, type: string) => {
-        const itemConfig = listConfig?.[type];
-        if (!itemConfig) {
-            return "";
-        }
-        if (type === "cardShowCols") {
-            return itemConfig.map(r => {
-                const value = item[r.id];
-                const element = <ViewControl serverKey={serverKey} holderType="table" value={value} fieldConfig={r} />;
-                const title = r.title;
-                return { element, value, title, id: r.id };
-            });
-        }
-        const value = item[itemConfig.id];
-        const element = <ViewControl serverKey={serverKey} holderType="table" value={value} fieldConfig={type === "mainPicture" ? { ...itemConfig, preview: false } : itemConfig} />;
-        const title = itemConfig.title;
-        return { element, value, title, id: itemConfig.id };
-    }
-
-    const temData = useMemo(() => {
-        const dataObj = dataKeys.reduce((total, next) => {
-            total[next] = handleData(current, next);
-            return total;
-        }, {});
-        const ids = Object.values(dataObj).flat().filter(Boolean).map((r: any) => r.id);
-        const temDetailColumn = columnConfigs.filter(r => !["10000", "20000", ...ids].includes(r.id) && !["操作", "序号"].includes(r.title));
-        setDetailColumn(temDetailColumn);
-        return dataObj;
-    }, [current]);
-
-    return <div className="list-item">
-        {listConfig?.["mainPicture"] ?
-            <div className="list-item-icon">
-                {temData["mainPicture"]?.element}
-            </div>
-            : ""}
-        <div className="list-item-right" style={listConfig?.["mainPicture"] ? {} : { width: "100%" }}>
-            <div className="list-item-head">
-                <div className="list-item-head-title">
-                    {temData["primaryColumn"] ?
-                        <div className="list-item-head-primary">
-                            <div className="primary-column">{temData["primaryColumn"]?.element}</div>
-                            <div className="primary-column-label">{temData["primaryColumnLabel"]?.element}</div>
-                        </div>
-                        : ""}
-                    <div className="label-column">{temData["labelColumn"]?.element}</div>
-                </div>
-                <div className="list-item-head-title">
-                    {temData["secondColumn"] ?
-                        <div className="list-item-head-second">
-                            <div className="second-column">{temData["secondColumn"].value ? temData["secondColumn"]?.element : "-"}</div>
-                            <div className="second-column-label">{temData["secondColumnLabel"]?.element}</div>
-                        </div>
-                        : ""}
-                </div>
-            </div>
-            <div className="list-content">
-                <div className="list-content-card ">
-                    <div className="card-cols">
-                        {temData["cardShowCols"] ?
-                            <Space size="large">
-                                {temData["cardShowCols"].map((col, index) =>
-                                    <div className="card-show-item" key={index}>
-                                        <div className="title">{translate("${" + col.title + "}")}：</div>
-                                        <div className="element">{(col.value || col.value === 0) ? col.element : "-"}</div>
-                                    </div>)}
-                            </Space> :
-                            ""}
-                    </div>
-                    <div className="list-content-option">
-                        {renderOpt}
-                        {detailColumn.length ? <Button size="small" type="text" style={{ margin: 0 }} onClick={() => setDetailOpen(!detailOpen)}>{detailOpen ? <UpOutlined /> : <DownOutlined />}</Button> : ""}
-                    </div>
-                </div>
-                {detailOpen ?
-                    <div className="detail-content">
-                        <Space size="middle" wrap={true}>
-                            {initViewList()}
-                        </Space>
-                    </div> : ""}
-            </div>
-        </div>
-    </div>;
-};
-
-export default Index;
+import React, { useState, useMemo } from "react";
+import { Row, Col, Space, Button, Descriptions } from "antd";
+import { DownOutlined, UpOutlined } from '@ant-design/icons';
+import { useLocale } from "../../locale/useLocale";
+import ViewControl from "../../controls/view-control";
+import { CardListConfig, FieldConfig } from "../../tmpl/interface";
+import "./index.less";
+
+type Props = {
+    listConfig?: CardListConfig;
+    current?: any;
+    renderOpt?: React.ReactNode;
+    serverKey?: string;
+    columnConfigs?: FieldConfig[];
+};
+
+const dataKeys = ["primaryColumn", "primaryColumnLabel", "secondColumn", "secondColumnLabel", "cardShowCols", "labelColumn", "mainPicture", "mainPictureLabel"];
+
+const Index = (props: Props) => {
+    const { listConfig, current, renderOpt, serverKey, columnConfigs } = props;
+    const [detailOpen, setDetailOpen] = useState<boolean>(false);
+    const [detailColumn, setDetailColumn] = useState<FieldConfig[]>([]);
+    const { translate } = useLocale();
+
+    const initViewList = () => {
+        const itemList = [];
+        if (detailColumn.length > 0) {
+            detailColumn.forEach((item, index) => {
+                let fieldValue = current ? current[item.id] : undefined;
+                //fieldValue 没有值时不能为null 要为 undefined。antd input所限制
+                fieldValue = fieldValue ? fieldValue : item.defaultValue ? item.defaultValue : undefined;
+                const domItem = (
+                    <div className="detail-content-item" key={index}>
+                        <div className="title">{translate("${" + item.title + "}")}：</div>
+                        <div className="element">
+                            <ViewControl
+                                serverKey={serverKey}
+                                holderType={"table"}
+                                value={fieldValue}
+                                fieldConfig={item}
+                            />
+                        </div>
+                    </div>
+                );
+                itemList.push(domItem);
+            });
+        }
+        return itemList;
+    };
+
+    const handleData = (item, type: string) => {
+        const itemConfig = listConfig?.[type];
+        if (!itemConfig) {
+            return "";
+        }
+        if (type === "cardShowCols") {
+            return itemConfig.map(r => {
+                const value = item[r.id];
+                const element = <ViewControl serverKey={serverKey} holderType="table" value={value} fieldConfig={r} />;
+                const title = r.title;
+                return { element, value, title, id: r.id };
+            });
+        }
+        const value = item[itemConfig.id];
+        const element = <ViewControl serverKey={serverKey} holderType="table" value={value} fieldConfig={type === "mainPicture" ? { ...itemConfig, preview: false } : itemConfig} />;
+        const title = itemConfig.title;
+        return { element, value, title, id: itemConfig.id };
+    }
+
+    const temData = useMemo(() => {
+        const dataObj = dataKeys.reduce((total, next) => {
+            total[next] = handleData(current, next);
+            return total;
+        }, {});
+        const ids = Object.values(dataObj).flat().filter(Boolean).map((r: any) => r.id);
+        const temDetailColumn = columnConfigs.filter(r => !["10000", "20000", ...ids].includes(r.id) && !["操作", "序号"].includes(r.title));
+        setDetailColumn(temDetailColumn);
+        return dataObj;
+    }, [current]);
+
+    return <div className="list-item">
+        {listConfig?.["mainPicture"] ?
+            <div className="list-item-icon">
+                {temData["mainPicture"]?.element}
+            </div>
+            : ""}
+        <div className="list-item-right" style={listConfig?.["mainPicture"] ? {} : { width: "100%" }}>
+            <div className="list-item-head">
+                <div className="list-item-head-title">
+                    {temData["primaryColumn"] ?
+                        <div className="list-item-head-primary">
+                            <div className="primary-column">{temData["primaryColumn"]?.element}</div>
+                            <div className="primary-column-label">{temData["primaryColumnLabel"]?.element}</div>
+                        </div>
+                        : ""}
+                    <div className="label-column">{temData["labelColumn"]?.element}</div>
+                </div>
+                <div className="list-item-head-title">
+                    {temData["secondColumn"] ?
+                        <div className="list-item-head-second">
+                            <div className="second-column">{temData["secondColumn"].value ? temData["secondColumn"]?.element : "-"}</div>
+                            <div className="second-column-label">{temData["secondColumnLabel"]?.element}</div>
+                        </div>
+                        : ""}
+                </div>
+            </div>
+            <div className="list-content">
+                <div className="list-content-card ">
+                    <div className="card-cols">
+                        {temData["cardShowCols"] ?
+                            <Space size="large">
+                                {temData["cardShowCols"].map((col, index) =>
+                                    <div className="card-show-item" key={index}>
+                                        <div className="title">{translate("${" + col.title + "}")}：</div>
+                                        <div className="element">{(col.value || col.value === 0) ? col.element : "-"}</div>
+                                    </div>)}
+                            </Space> :
+                            ""}
+                    </div>
+                    <div className="list-content-option">
+                        {renderOpt}
+                        {detailColumn.length ? <Button size="small" type="text" style={{ margin: 0 }} onClick={() => setDetailOpen(!detailOpen)}>{detailOpen ? <UpOutlined /> : <DownOutlined />}</Button> : ""}
+                    </div>
+                </div>
+                {detailOpen ?
+                    <div className="detail-content">
+                        <Space size="middle" wrap={true}>
+                            {initViewList()}
+                        </Space>
+                    </div> : ""}
+            </div>
+        </div>
+    </div>;
+};
+
+export default Index;

package/src/aldehyde/locale/LocaleButton.tsx

@@ -1,48 +1,48 @@
-import { GlobalOutlined } from "@ant-design/icons";
-import { Button, ButtonProps, Dropdown, MenuProps, theme } from "antd";
-import { useLocale } from "./useLocale";
-import { LocaleType } from "./langMp";
-import React from "react";
-
-const { useToken } = theme;
-
-interface Props extends ButtonProps {
-  children?: React.ReactNode,
-  placement?: "topLeft" | "topCenter" | "topRight" | "bottomLeft" | "bottomCenter" | "bottomRight" | "top" | "bottom",
-}
-
-const LocaleButton = (props: Props) => {
-  const { children, placement, ...otherProps } = props;
-  const { token } = useToken();
-  const { getLocale, setLocale, availableLang } = useLocale();
-
-  const onClick: MenuProps["onClick"] = ({ key }) => {
-    setLocale(key as LocaleType);
-  };
-
-  const items: MenuProps["items"] = availableLang.map((lang) => ({
-    label: (
-      <span style={getLocale() === lang ? { color: token.colorPrimary } : {}}>
-        {lang}
-      </span>
-    ),
-    key: lang,
-  }))
-
-  items.unshift({
-    label: (
-      <span style={(!getLocale() || getLocale() === "zh") ? { color: token.colorPrimary } : {}}>
-        中文
-      </span>
-    ),
-    key: "zh",
-  });
-
-  return (
-    <Dropdown arrow={{ pointAtCenter: true }} placement={placement} overlayStyle={{ minWidth: "105px" }} overlayClassName="localeButton" menu={{ items, onClick }}>
-      {children || <Button type="primary" shape="circle" icon={<GlobalOutlined />}  {...otherProps} />}
-    </Dropdown>
-  );
-};
-
-export default LocaleButton;
+import { GlobalOutlined } from "@ant-design/icons";
+import { Button, ButtonProps, Dropdown, MenuProps, theme } from "antd";
+import { useLocale } from "./useLocale";
+import { LocaleType } from "./langMp";
+import React from "react";
+
+const { useToken } = theme;
+
+interface Props extends ButtonProps {
+  children?: React.ReactNode,
+  placement?: "topLeft" | "topCenter" | "topRight" | "bottomLeft" | "bottomCenter" | "bottomRight" | "top" | "bottom",
+}
+
+const LocaleButton = (props: Props) => {
+  const { children, placement, ...otherProps } = props;
+  const { token } = useToken();
+  const { getLocale, setLocale, availableLang } = useLocale();
+
+  const onClick: MenuProps["onClick"] = ({ key }) => {
+    setLocale(key as LocaleType);
+  };
+
+  const items: MenuProps["items"] = availableLang.map((lang) => ({
+    label: (
+      <span style={getLocale() === lang ? { color: token.colorPrimary } : {}}>
+        {lang}
+      </span>
+    ),
+    key: lang,
+  }))
+
+  items.unshift({
+    label: (
+      <span style={(!getLocale() || getLocale() === "zh") ? { color: token.colorPrimary } : {}}>
+        中文
+      </span>
+    ),
+    key: "zh",
+  });
+
+  return (
+    <Dropdown arrow={{ pointAtCenter: true }} placement={placement} overlayStyle={{ minWidth: "105px" }} overlayClassName="localeButton" menu={{ items, onClick }}>
+      {children || <Button type="primary" shape="circle" icon={<GlobalOutlined />}  {...otherProps} />}
+    </Dropdown>
+  );
+};
+
+export default LocaleButton;