@thefreshop/tb 1.1.2 → 1.1.4
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.
- package/README.md +273 -0
- package/dist/cjs/index.js +48 -13
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/tbframe/layout/main.d.ts +3 -1
- package/dist/cjs/tbframe/provider/provider.d.ts +2 -1
- package/dist/cjs/tbpage/component/modules/antBaseTable/btn_widget.d.ts +3 -1
- package/dist/cjs/types/antBaseTable.types.d.ts +1 -0
- package/dist/cjs/types/provider.types.d.ts +1 -0
- package/dist/cjs/types/tbframe.types.d.ts +1 -0
- package/dist/esm/index.js +48 -13
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/tbframe/layout/main.d.ts +3 -1
- package/dist/esm/tbframe/provider/provider.d.ts +2 -1
- package/dist/esm/tbpage/component/modules/antBaseTable/btn_widget.d.ts +3 -1
- package/dist/esm/types/antBaseTable.types.d.ts +1 -0
- package/dist/esm/types/provider.types.d.ts +1 -0
- package/dist/esm/types/tbframe.types.d.ts +1 -0
- package/dist/index.d.ts +3 -0
- package/package.json +1 -1
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import type { ProviderType } from "../../types";
|
|
3
|
-
export declare const TbProvider: ({ children }: {
|
|
3
|
+
export declare const TbProvider: ({ basename, children }: {
|
|
4
|
+
basename?: string;
|
|
4
5
|
children: React.ReactNode;
|
|
5
6
|
}) => React.JSX.Element;
|
|
6
7
|
export declare const useTbState: () => ProviderType;
|
|
@@ -17,7 +17,7 @@ import { btnReturnFType, customBtnReturnFType } from "../../../../types";
|
|
|
17
17
|
|
|
18
18
|
* @todo
|
|
19
19
|
*/
|
|
20
|
-
export declare const TableTopButtonGroup: ({ isSelect, onRefresh, isCounter, autoRefreshTime, addProps, modifyProps, deleteProps, removeProps, resetProps, customProps, }: {
|
|
20
|
+
export declare const TableTopButtonGroup: ({ isSelect, onRefresh, isCounter, autoRefreshTime, addProps, modifyProps, deleteProps, removeProps, resetProps, customProps, isInSearch, onInSearch, }: {
|
|
21
21
|
isSelect: boolean;
|
|
22
22
|
onRefresh?: () => void;
|
|
23
23
|
isCounter?: boolean;
|
|
@@ -28,6 +28,8 @@ export declare const TableTopButtonGroup: ({ isSelect, onRefresh, isCounter, aut
|
|
|
28
28
|
removeProps?: btnReturnFType;
|
|
29
29
|
resetProps?: btnReturnFType;
|
|
30
30
|
customProps?: customBtnReturnFType;
|
|
31
|
+
isInSearch?: boolean;
|
|
32
|
+
onInSearch?: (value: string) => void;
|
|
31
33
|
}) => React.JSX.Element | null;
|
|
32
34
|
export declare const TableBottomButtonGroup: ({ isSelect, topProps, bottomProps, upProps, downProps, }: {
|
|
33
35
|
isSelect: boolean;
|
|
@@ -45,6 +45,7 @@ export type antBasePropsType<T = AnyObject, K = string | GetRowKey<T>> = {
|
|
|
45
45
|
autoRefreshTime?: number;
|
|
46
46
|
createModalWidth?: React.CSSProperties["width"];
|
|
47
47
|
onCreateClose?: () => void;
|
|
48
|
+
isInSearch?: boolean;
|
|
48
49
|
};
|
|
49
50
|
export type antBaseColumnType = {
|
|
50
51
|
tableProps: (ColumnType<AnyObject> | ColumnGroupType<AnyObject>) & {
|
|
@@ -12,6 +12,7 @@ export type FrameStyleType = {
|
|
|
12
12
|
mainframe?: React.CSSProperties;
|
|
13
13
|
centerFrame?: React.CSSProperties;
|
|
14
14
|
contentsFrame?: React.CSSProperties;
|
|
15
|
+
contentsMainFrame?: React.CSSProperties;
|
|
15
16
|
bottomFrame?: React.CSSProperties;
|
|
16
17
|
naviFrame?: React.CSSProperties;
|
|
17
18
|
nav_item?: React.CSSProperties;
|
package/dist/esm/index.js
CHANGED
|
@@ -20,7 +20,7 @@ import 'dayjs/locale/ko';
|
|
|
20
20
|
const tbContext = createContext(undefined);
|
|
21
21
|
|
|
22
22
|
const SESSION_STORAGE_KEY = "tbFrameState";
|
|
23
|
-
const TbProvider = ({ children }) => {
|
|
23
|
+
const TbProvider = ({ basename, children }) => {
|
|
24
24
|
const [topkey, setTopkey] = useState("");
|
|
25
25
|
const [tabList, setTabList] = useState([]);
|
|
26
26
|
const [currentTabKey, setCurrentTabKey] = useState();
|
|
@@ -122,6 +122,7 @@ const TbProvider = ({ children }) => {
|
|
|
122
122
|
errMsg,
|
|
123
123
|
tabList,
|
|
124
124
|
setTabList,
|
|
125
|
+
basename,
|
|
125
126
|
} }, children));
|
|
126
127
|
};
|
|
127
128
|
const useTbState = () => {
|
|
@@ -382,11 +383,11 @@ var css_248z$7 = ".main-module_mainFrame__Etjvl{height:100%;width:100%}.main-mod
|
|
|
382
383
|
var styles$5 = {"mainFrame":"main-module_mainFrame__Etjvl","mainFrameFullscreen":"main-module_mainFrameFullscreen__oEwV8"};
|
|
383
384
|
styleInject(css_248z$7);
|
|
384
385
|
|
|
385
|
-
const Main = () => {
|
|
386
|
+
const Main = ({ style }) => {
|
|
386
387
|
const [sp] = useSearchParams();
|
|
387
388
|
const isFs = sp.get("fs") === "1" || sp.get("fullscreen") === "1";
|
|
388
389
|
// console.log("Main render, isFs:", isFs);
|
|
389
|
-
return (React__default.createElement("div", { className: isFs ? styles$5.mainFrameFullscreen : styles$5.mainFrame },
|
|
390
|
+
return (React__default.createElement("div", { className: isFs ? styles$5.mainFrameFullscreen : styles$5.mainFrame, style: style },
|
|
390
391
|
React__default.createElement(Outlet, null)));
|
|
391
392
|
};
|
|
392
393
|
|
|
@@ -481,7 +482,7 @@ const NullPage = () => {
|
|
|
481
482
|
};
|
|
482
483
|
|
|
483
484
|
const TbFrame = ({ setting, top, bottom, nav, top_banner, hashmode = false, frameStyle, }) => {
|
|
484
|
-
const { user, errMsg, tabList, setTabList, startTabKey, setStartTabKey, loginUser } = useTbState();
|
|
485
|
+
const { basename, user, errMsg, tabList, setTabList, startTabKey, setStartTabKey, loginUser } = useTbState();
|
|
485
486
|
useEffect(() => {
|
|
486
487
|
let p_tabList = [];
|
|
487
488
|
nav.menuSet.forEach((item) => {
|
|
@@ -554,7 +555,9 @@ const TbFrame = ({ setting, top, bottom, nav, top_banner, hashmode = false, fram
|
|
|
554
555
|
children: route(),
|
|
555
556
|
errorElement: React__default.createElement(NullPage, null),
|
|
556
557
|
},
|
|
557
|
-
]
|
|
558
|
+
], {
|
|
559
|
+
basename: basename ?? "/",
|
|
560
|
+
});
|
|
558
561
|
}
|
|
559
562
|
else {
|
|
560
563
|
return createBrowserRouter([
|
|
@@ -564,9 +567,11 @@ const TbFrame = ({ setting, top, bottom, nav, top_banner, hashmode = false, fram
|
|
|
564
567
|
children: route(),
|
|
565
568
|
errorElement: React__default.createElement(NullPage, null),
|
|
566
569
|
},
|
|
567
|
-
]
|
|
570
|
+
], {
|
|
571
|
+
basename: basename ?? "/",
|
|
572
|
+
});
|
|
568
573
|
}
|
|
569
|
-
}, [hashmode, user, top, nav, setting, top_banner, bottom, frameStyle]);
|
|
574
|
+
}, [hashmode, user, top, nav, setting, top_banner, bottom, frameStyle, basename]);
|
|
570
575
|
return React__default.createElement(RouterProvider, { router: router });
|
|
571
576
|
};
|
|
572
577
|
const MainLayout = ({ errMsg, setting, top_banner, nav, user, top, bottom, frameStyle, }) => {
|
|
@@ -611,7 +616,7 @@ const MainLayout = ({ errMsg, setting, top_banner, nav, user, top, bottom, frame
|
|
|
611
616
|
React__default.createElement(Nav, { nav: nav, islogin: setting.islogin ?? false, frameStyle: frameStyle }),
|
|
612
617
|
React__default.createElement("div", { className: styles$9.contentsFrame, style: frameStyle?.contentsFrame },
|
|
613
618
|
React__default.createElement(Tabs, { nav: nav, frameStyle: frameStyle }),
|
|
614
|
-
React__default.createElement(Main,
|
|
619
|
+
React__default.createElement(Main, { style: frameStyle?.contentsMainFrame }))),
|
|
615
620
|
React__default.createElement("div", { className: styles$9.bottomFrame, style: frameStyle?.bottomFrame }, bottom && React__default.createElement(Bottom, { bottom: bottom, frameStyle: frameStyle }))))));
|
|
616
621
|
};
|
|
617
622
|
|
|
@@ -680,7 +685,7 @@ const FORM_CREATE = "등록";
|
|
|
680
685
|
|
|
681
686
|
* @todo
|
|
682
687
|
*/
|
|
683
|
-
const TableTopButtonGroup = ({ isSelect, onRefresh, isCounter, autoRefreshTime, addProps, modifyProps, deleteProps, removeProps, resetProps, customProps, }) => {
|
|
688
|
+
const TableTopButtonGroup = ({ isSelect, onRefresh, isCounter, autoRefreshTime, addProps, modifyProps, deleteProps, removeProps, resetProps, customProps, isInSearch = false, onInSearch, }) => {
|
|
684
689
|
if (!addProps && !modifyProps && !deleteProps && !removeProps && !resetProps && !customProps && !onRefresh) {
|
|
685
690
|
return null;
|
|
686
691
|
}
|
|
@@ -727,7 +732,8 @@ const TableTopButtonGroup = ({ isSelect, onRefresh, isCounter, autoRefreshTime,
|
|
|
727
732
|
deleteProps ? (React__default.createElement(Button, { danger: true, disabled: !isSelect || deleteProps.disable, onClick: deleteProps.onFun }, deleteProps.title ? deleteProps.title : TABLE_DELETE)) : null,
|
|
728
733
|
resetProps ? (React__default.createElement(Button, { disabled: !isSelect || resetProps.disable, onClick: resetProps.onFun }, resetProps.title ? resetProps.title : TABLE_RESET)) : null,
|
|
729
734
|
removeProps ? (React__default.createElement(Button, { danger: true, type: "primary", disabled: !isSelect || removeProps.disable, onClick: removeProps.onFun }, removeProps.title ? removeProps.title : TABLE_REMOVE)) : null,
|
|
730
|
-
customProps?.rightRender && customProps?.rightRender()
|
|
735
|
+
customProps?.rightRender && customProps?.rightRender(),
|
|
736
|
+
isInSearch && onInSearch ? React__default.createElement(InSearchForm, { onInSearch: onInSearch }) : null))));
|
|
731
737
|
};
|
|
732
738
|
const TableBottomButtonGroup = ({ isSelect, topProps, bottomProps, upProps, downProps, }) => {
|
|
733
739
|
return (React__default.createElement(Row, { justify: "space-between" },
|
|
@@ -741,6 +747,22 @@ const TableBottomButtonGroup = ({ isSelect, topProps, bottomProps, upProps, down
|
|
|
741
747
|
downProps ? (React__default.createElement(Button, { disabled: !isSelect || downProps.disable, onClick: downProps.onFun }, TABLE_DOWN)) : null,
|
|
742
748
|
bottomProps ? (React__default.createElement(Button, { disabled: !isSelect || bottomProps.disable, onClick: bottomProps.onFun }, TABLE_BOTTOM)) : null))));
|
|
743
749
|
};
|
|
750
|
+
const InSearchForm = ({ onInSearch }) => {
|
|
751
|
+
const [inputSearch, setInputSearch] = useState("");
|
|
752
|
+
const SearchClick = () => {
|
|
753
|
+
onInSearch(inputSearch);
|
|
754
|
+
};
|
|
755
|
+
const activeEnter = (e) => {
|
|
756
|
+
if (e.key === "Enter") {
|
|
757
|
+
SearchClick();
|
|
758
|
+
}
|
|
759
|
+
};
|
|
760
|
+
return (React__default.createElement(Space.Compact, null,
|
|
761
|
+
React__default.createElement(Input, { style: { width: "150px" }, onChange: (e) => {
|
|
762
|
+
setInputSearch(e.target.value);
|
|
763
|
+
}, value: inputSearch, onKeyDown: (e) => activeEnter(e) }),
|
|
764
|
+
React__default.createElement(Button, { onClick: SearchClick }, "\uAC80\uC0C9")));
|
|
765
|
+
};
|
|
744
766
|
|
|
745
767
|
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
|
|
746
768
|
|
|
@@ -23318,11 +23340,24 @@ const AntBaseModalCreate = ({ modalProps, formProps, props }) => {
|
|
|
23318
23340
|
|
|
23319
23341
|
const { Title: Title$1 } = Typography;
|
|
23320
23342
|
const { confirm: confirm$1 } = Modal;
|
|
23321
|
-
const AntBaseTable$1 = ({ bordered, className, rowKey, rowName, dataSource, initData, customColumn, customValue, columns, expandable, size, onDoubleClick, onClick, selectProps, addProps, modifyProps, deleteProps, removeProps, resetProps, customProps, topProps, bottomProps, upProps, downProps, pageProps, scroll, onRefresh, isCounter, autoRefreshTime, createModalWidth = 1000, onCreateClose, }, ref) => {
|
|
23343
|
+
const AntBaseTable$1 = ({ bordered, className, rowKey, rowName, dataSource, initData, customColumn, customValue, columns, expandable, size, onDoubleClick, onClick, selectProps, addProps, modifyProps, deleteProps, removeProps, resetProps, customProps, topProps, bottomProps, upProps, downProps, pageProps, scroll, onRefresh, isCounter, autoRefreshTime, createModalWidth = 1000, onCreateClose, isInSearch = false, }, ref) => {
|
|
23322
23344
|
const [selectedRowKeys, setSelectedRowKeys] = useState([]);
|
|
23323
23345
|
const [selectedRow, setSelectedRow] = useState();
|
|
23324
23346
|
const [popupCreate, setPopupCreate] = useState(false);
|
|
23325
23347
|
const [popupModify, setPopupModify] = useState(false);
|
|
23348
|
+
const [viewData, setViewData] = useState(dataSource);
|
|
23349
|
+
const onInSearch = (value) => {
|
|
23350
|
+
const search = value.trim().toLowerCase();
|
|
23351
|
+
if (!search) {
|
|
23352
|
+
setViewData(dataSource);
|
|
23353
|
+
return;
|
|
23354
|
+
}
|
|
23355
|
+
setViewData(dataSource.filter((item) => Object.values(item).some((itemValue) => {
|
|
23356
|
+
if (itemValue == null)
|
|
23357
|
+
return false;
|
|
23358
|
+
return String(itemValue).toLowerCase().includes(search);
|
|
23359
|
+
})));
|
|
23360
|
+
};
|
|
23326
23361
|
useEffect(() => {
|
|
23327
23362
|
setSelectedRow(dataSource?.find((m) => {
|
|
23328
23363
|
if (m) {
|
|
@@ -23415,7 +23450,7 @@ const AntBaseTable$1 = ({ bordered, className, rowKey, rowName, dataSource, init
|
|
|
23415
23450
|
height: "100%",
|
|
23416
23451
|
padding: "20px",
|
|
23417
23452
|
} },
|
|
23418
|
-
React__default.createElement(TableTopButtonGroup, { isSelect: isSelect, isCounter: isCounter, onRefresh: onRefresh, autoRefreshTime: autoRefreshTime, addProps: addProps && {
|
|
23453
|
+
React__default.createElement(TableTopButtonGroup, { isInSearch: isInSearch, onInSearch: onInSearch, isSelect: isSelect, isCounter: isCounter, onRefresh: onRefresh, autoRefreshTime: autoRefreshTime, addProps: addProps && {
|
|
23419
23454
|
...addProps,
|
|
23420
23455
|
onFun: () => {
|
|
23421
23456
|
if (addProps.customModal) {
|
|
@@ -23596,7 +23631,7 @@ const AntBaseTable$1 = ({ bordered, className, rowKey, rowName, dataSource, init
|
|
|
23596
23631
|
return {
|
|
23597
23632
|
onClick: () => { }, // click header row
|
|
23598
23633
|
};
|
|
23599
|
-
}, dataSource:
|
|
23634
|
+
}, dataSource: viewData?.map((i) => i),
|
|
23600
23635
|
// columns={tableColumns(
|
|
23601
23636
|
// columns.concat(
|
|
23602
23637
|
// deleteCol({
|