@flatbiz/antd 4.4.34 → 4.4.36
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/esm/block-layout/index.css +1 -0
- package/esm/block-layout/index.js +5 -0
- package/esm/block-layout/index.js.map +1 -0
- package/esm/bootstrap/index.js +2 -1
- package/esm/bootstrap/index.js.map +1 -1
- package/esm/card-layout/index.css +1 -1
- package/esm/card-layout/index.js +2 -1
- package/esm/card-layout/index.js.map +1 -1
- package/esm/drag-form-list/index.css +1 -1
- package/esm/drag-form-list/index.js +2 -1
- package/esm/drag-form-list/index.js.map +1 -1
- package/esm/drag-table/index.js +1 -1
- package/esm/drag-table/index.js.map +1 -1
- package/esm/easy-table/index.css +1 -1
- package/esm/easy-table/index.js +7 -3
- package/esm/easy-table/index.js.map +1 -1
- package/esm/fba-app/index.css +1 -1
- package/esm/fba-app/index.js +2 -1
- package/esm/fba-app/index.js.map +1 -1
- package/esm/icon-wrapper/index.js +1 -1
- package/esm/icon-wrapper/index.js.map +1 -1
- package/esm/index.css +0 -1
- package/esm/index.js +3 -2
- package/esm/svg-http-view/index.js +1 -1
- package/esm/svg-http-view/index.js.map +1 -1
- package/index.d.ts +61 -23
- package/package.json +1 -1
- package/esm/index-1f45bfd5.js +0 -3
- package/esm/index-1f45bfd5.js.map +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.block-layout{background-color:var(--block-bg-color)}.light-theme .block-layout{color:rgba(0,0,0,.88)}.dark-theme .block-layout{color:hsla(0,0%,100%,.85)}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/* eslint-disable */
|
|
2
|
+
import './index.css';
|
|
3
|
+
/*! @flatjs/forge MIT @flatbiz/antd */
|
|
4
|
+
import{_ as r}from"../_rollupPluginBabelHelpers-a0769acd.js";import{classNames as s}from"@dimjs/utils/cjs/class-names";import{jsx as l}from"react/jsx-runtime";var e=function e(a){return l("div",r({},a,{className:s("block-layout",a.className),children:a.children}))};export{e as BlockLayout};
|
|
5
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["@flatbiz/antd/src/block-layout/layout.tsx"],"sourcesContent":["import { classNames } from '@dimjs/utils';\nimport { type DetailedHTMLProps } from 'react';\nimport './style.less';\n\ntype BlockLayoutProps = DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>;\n/**\n * 块布局(控制light/dark模式下,块背景色和字体颜色)\n * ```\n * 1. light 模式\n * 网页背景色为 #1b1a1a(黑灰),此时块布局背景色为 #000(黑色),字体颜色rgba(255, 255, 255, 0.85)\n * 2. dark 模式\n * 网页背景色为 #f9f9f9(白灰),此时块布局背景色为 #FFF(白色),字体颜色rgba(0, 0, 0, 0.88)\n * ```\n * @param props\n * @returns\n */\nexport const BlockLayout = (props: BlockLayoutProps) => {\n return (\n <div {...props} className={classNames('block-layout', props.className)}>\n {props.children}\n </div>\n );\n};\n"],"names":["BlockLayout","props","_jsx","_extends","className","_classNames","children"],"mappings":";mKAgBaA,EAAc,SAAdA,EAAeC,GAC1B,OACEC,EAAA,MAAAC,EAAA,CAAA,EAASF,EAAK,CAAEG,UAAWC,EAAW,eAAgBJ,EAAMG,WAAWE,SACpEL,EAAMK,WAGb"}
|
package/esm/bootstrap/index.js
CHANGED
|
@@ -6,7 +6,8 @@ import './../fba-app/index.css';
|
|
|
6
6
|
import './../fba-utils/index.css';
|
|
7
7
|
import './../button-wrapper/index.css';
|
|
8
8
|
import './../flex-layout/index.css';
|
|
9
|
+
import './../block-layout/index.css';
|
|
9
10
|
import './index.css';
|
|
10
11
|
/*! @flatjs/forge MIT @flatbiz/antd */
|
|
11
|
-
import{_ as o}from"../_rollupPluginBabelHelpers-a0769acd.js";import{get as r}from"@dimjs/utils/cjs/get";import{theme as i,App as e}from"antd";import{C as t}from"../index-7f4ad045.js";import{FbaApp as s}from"../fba-app/index.js";import{fbaHooks as a}from"../fba-hooks/index.js";import{jsx as l}from"react/jsx-runtime";import"antd/es/locale/en_US";import"antd/es/locale/zh_CN";import"dayjs";import"dayjs/locale/en";import"dayjs/locale/zh-cn";import"dayjs/plugin/advancedFormat";import"dayjs/plugin/customParseFormat";import"dayjs/plugin/localeData";import"dayjs/plugin/utc";import"dayjs/plugin/weekday";import"dayjs/plugin/weekOfYear";import"dayjs/plugin/weekYear";import"@dimjs/utils/cjs/extend";import"../fba-utils/index.js";import"@dimjs/lang/cjs/is-array";import"@flatbiz/utils";import"@wove/react/cjs/hooks";import"react";import"@dimjs/utils/cjs/class-names";import"@dimjs/lang/cjs/is-null";import"@dimjs/lang/cjs/is-promise";import"ahooks";import"../button-wrapper/index.js";import"@ant-design/icons/es/icons/LoadingOutlined";import"../flex-layout/index.js";import"../index
|
|
12
|
+
import{_ as o}from"../_rollupPluginBabelHelpers-a0769acd.js";import{get as r}from"@dimjs/utils/cjs/get";import{theme as i,App as e}from"antd";import{C as t}from"../index-7f4ad045.js";import{FbaApp as s}from"../fba-app/index.js";import{fbaHooks as a}from"../fba-hooks/index.js";import{jsx as l}from"react/jsx-runtime";import"antd/es/locale/en_US";import"antd/es/locale/zh_CN";import"dayjs";import"dayjs/locale/en";import"dayjs/locale/zh-cn";import"dayjs/plugin/advancedFormat";import"dayjs/plugin/customParseFormat";import"dayjs/plugin/localeData";import"dayjs/plugin/utc";import"dayjs/plugin/weekday";import"dayjs/plugin/weekOfYear";import"dayjs/plugin/weekYear";import"@dimjs/utils/cjs/extend";import"../fba-utils/index.js";import"@dimjs/lang/cjs/is-array";import"@flatbiz/utils";import"@wove/react/cjs/hooks";import"react";import"@dimjs/utils/cjs/class-names";import"@dimjs/lang/cjs/is-null";import"@dimjs/lang/cjs/is-promise";import"ahooks";import"../button-wrapper/index.js";import"@ant-design/icons/es/icons/LoadingOutlined";import"../flex-layout/index.js";import"../block-layout/index.js";import"../use-responsive-point-21b8c601.js";var m=function m(d){var n;a.useEffectCustom((function(){var o=document.body.style.cssText;var i={};if(o){var e=/(.+?):\s*(.+?);/g;var t;while(t=e.exec(o)){var s=t[1].trim();var a=t[2];i[s]=a}}if(d.dark){i["--bg-color"]=r(d,"bgColorConfig.dark.bgColor","#1b1a1a");i["--block-bg-color"]=r(d,"bgColorConfig.dark.blockBgColor","#000")}else{i["--bg-color"]=r(d,"bgColorConfig.light.bgColor","#f9f9f9");i["--block-bg-color"]=r(d,"bgColorConfig.light.blockBgColor","#FFF")}var l="";Object.keys(i).forEach((function(o){if(i[o]){l=l+(o+":"+i[o]+";")}}));document.body.style.cssText=l;if(d.dark){document.body.classList.add("dark-theme")}else{document.body.classList.add("light-theme")}}),[d.bgColorConfig,d.dark]);var c=a.useThemeToken();return l(t,o({locale:d.locale,componentSize:"middle",space:{size:"middle"}},d.configProviderProps,{theme:o({},(n=d.configProviderProps)==null?void 0:n.theme,{algorithm:d.dark?i.darkAlgorithm:undefined}),children:l(e,{style:{"--color-primary":c.colorPrimary},className:"bootstrap-app",children:l(s,{children:d.children})})}))};export{m as Bootstrap};
|
|
12
13
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["@flatbiz/antd/src/bootstrap/bootstrap.tsx"],"sourcesContent":["import { get } from '@dimjs/utils';\nimport { TAny } from '@flatbiz/utils';\nimport { App, theme } from 'antd';\nimport { CSSProperties, ReactNode } from 'react';\nimport { ConfigProviderWrapper, ConfigProviderWrapperProps } from '../config-provider-wrapper';\nimport { FbaApp } from '../fba-app';\nimport { fbaHooks } from '../fba-hooks';\nimport './style.less';\n\nexport type BootstrapProps = {\n dark?: boolean;\n children: ReactNode;\n configProviderProps?: ConfigProviderWrapperProps;\n /** @default zhCN */\n locale?: 'en' | 'zh-cn';\n /**\n * 背景颜色配置\n * ```\n * 默认值:\n * dark: { bgColor: '#1b1a1a', blockBgColor: '#000' }\n * light: { bgColor: '#f9f9f9', blockBgColor: '#FFF' }\n * ```\n */\n bgColorConfig?: {\n dark?: {\n bgColor?: string;\n blockBgColor?: string;\n };\n light?: {\n bgColor?: string;\n blockBgColor?: string;\n };\n };\n};\n/**\n * 如果当前项目入口不使用@flatbiz/pro-layout,必须使用 Bootstrap 组件包装\n * ```\n * Bootstrap 内部\n * 1. 封装 antd App组件\n * 2. 封装 @flatbiz/antd FbaApp组件\n * 3. 适配 light/dark模式\n * 4. 封装 antd ConfigProvider 可配置主题\n * ```\n */\nexport const Bootstrap = (props: BootstrapProps) => {\n fbaHooks.useEffectCustom(() => {\n const bodyStyle = document.body.style.cssText;\n const keyValuePairs = {};\n if (bodyStyle) {\n const regex = /(.+?):\\s*(.+?);/g;\n\n let match;\n while ((match = regex.exec(bodyStyle))) {\n const key = match[1].trim();\n const value = match[2];\n keyValuePairs[key] = value;\n }\n }\n if (props.dark) {\n keyValuePairs['--bg-color'] = get(props, 'bgColorConfig.dark.bgColor', '#1b1a1a');\n keyValuePairs['--block-bg-color'] = get(props, 'bgColorConfig.dark.blockBgColor', '#000');\n } else {\n keyValuePairs['--bg-color'] = get(props, 'bgColorConfig.light.bgColor', '#f9f9f9');\n keyValuePairs['--block-bg-color'] = get(props, 'bgColorConfig.light.blockBgColor', '#FFF');\n }\n let varStyleText = '';\n Object.keys(keyValuePairs).forEach((key) => {\n if (keyValuePairs[key]) {\n varStyleText = varStyleText + `${key}:${keyValuePairs[key]};`;\n }\n });\n document.body.style.cssText = varStyleText;\n\n if (props.dark) {\n document.body.classList.add('dark-theme');\n } else {\n document.body.classList.add('light-theme');\n }\n }, [props.bgColorConfig, props.dark]);\n\n const innerTheme = fbaHooks.useThemeToken();\n\n return (\n <ConfigProviderWrapper\n locale={props.locale as TAny}\n componentSize={'middle'}\n space={{ size: 'middle' }}\n {...props.configProviderProps}\n theme={{\n ...props.configProviderProps?.theme,\n algorithm: props.dark ? theme.darkAlgorithm : undefined,\n }}\n >\n <App style={{ '--color-primary': innerTheme.colorPrimary } as CSSProperties} className=\"bootstrap-app\">\n <FbaApp>{props.children}</FbaApp>\n </App>\n </ConfigProviderWrapper>\n );\n};\n"],"names":["Bootstrap","props","_props$configProvider","fbaHooks","useEffectCustom","bodyStyle","document","body","style","cssText","keyValuePairs","regex","match","exec","key","trim","value","dark","_get","varStyleText","Object","keys","forEach","classList","add","bgColorConfig","innerTheme","useThemeToken","_jsx","ConfigProviderWrapper","_extends","locale","componentSize","space","size","configProviderProps","theme","algorithm","darkAlgorithm","undefined","children","App","colorPrimary","className","FbaApp"],"mappings":";
|
|
1
|
+
{"version":3,"file":"index.js","sources":["@flatbiz/antd/src/bootstrap/bootstrap.tsx"],"sourcesContent":["import { get } from '@dimjs/utils';\nimport { TAny } from '@flatbiz/utils';\nimport { App, theme } from 'antd';\nimport { CSSProperties, ReactNode } from 'react';\nimport { ConfigProviderWrapper, ConfigProviderWrapperProps } from '../config-provider-wrapper';\nimport { FbaApp } from '../fba-app';\nimport { fbaHooks } from '../fba-hooks';\nimport './style.less';\n\nexport type BootstrapProps = {\n dark?: boolean;\n children: ReactNode;\n configProviderProps?: ConfigProviderWrapperProps;\n /** @default zhCN */\n locale?: 'en' | 'zh-cn';\n /**\n * 背景颜色配置\n * ```\n * 默认值:\n * dark: { bgColor: '#1b1a1a', blockBgColor: '#000' }\n * light: { bgColor: '#f9f9f9', blockBgColor: '#FFF' }\n * ```\n */\n bgColorConfig?: {\n dark?: {\n bgColor?: string;\n blockBgColor?: string;\n };\n light?: {\n bgColor?: string;\n blockBgColor?: string;\n };\n };\n};\n/**\n * 如果当前项目入口不使用@flatbiz/pro-layout,必须使用 Bootstrap 组件包装\n * ```\n * Bootstrap 内部\n * 1. 封装 antd App组件\n * 2. 封装 @flatbiz/antd FbaApp组件\n * 3. 适配 light/dark模式\n * 4. 封装 antd ConfigProvider 可配置主题\n * ```\n */\nexport const Bootstrap = (props: BootstrapProps) => {\n fbaHooks.useEffectCustom(() => {\n const bodyStyle = document.body.style.cssText;\n const keyValuePairs = {};\n if (bodyStyle) {\n const regex = /(.+?):\\s*(.+?);/g;\n\n let match;\n while ((match = regex.exec(bodyStyle))) {\n const key = match[1].trim();\n const value = match[2];\n keyValuePairs[key] = value;\n }\n }\n if (props.dark) {\n keyValuePairs['--bg-color'] = get(props, 'bgColorConfig.dark.bgColor', '#1b1a1a');\n keyValuePairs['--block-bg-color'] = get(props, 'bgColorConfig.dark.blockBgColor', '#000');\n } else {\n keyValuePairs['--bg-color'] = get(props, 'bgColorConfig.light.bgColor', '#f9f9f9');\n keyValuePairs['--block-bg-color'] = get(props, 'bgColorConfig.light.blockBgColor', '#FFF');\n }\n let varStyleText = '';\n Object.keys(keyValuePairs).forEach((key) => {\n if (keyValuePairs[key]) {\n varStyleText = varStyleText + `${key}:${keyValuePairs[key]};`;\n }\n });\n document.body.style.cssText = varStyleText;\n\n if (props.dark) {\n document.body.classList.add('dark-theme');\n } else {\n document.body.classList.add('light-theme');\n }\n }, [props.bgColorConfig, props.dark]);\n\n const innerTheme = fbaHooks.useThemeToken();\n\n return (\n <ConfigProviderWrapper\n locale={props.locale as TAny}\n componentSize={'middle'}\n space={{ size: 'middle' }}\n {...props.configProviderProps}\n theme={{\n ...props.configProviderProps?.theme,\n algorithm: props.dark ? theme.darkAlgorithm : undefined,\n }}\n >\n <App style={{ '--color-primary': innerTheme.colorPrimary } as CSSProperties} className=\"bootstrap-app\">\n <FbaApp>{props.children}</FbaApp>\n </App>\n </ConfigProviderWrapper>\n );\n};\n"],"names":["Bootstrap","props","_props$configProvider","fbaHooks","useEffectCustom","bodyStyle","document","body","style","cssText","keyValuePairs","regex","match","exec","key","trim","value","dark","_get","varStyleText","Object","keys","forEach","classList","add","bgColorConfig","innerTheme","useThemeToken","_jsx","ConfigProviderWrapper","_extends","locale","componentSize","space","size","configProviderProps","theme","algorithm","darkAlgorithm","undefined","children","App","colorPrimary","className","FbaApp"],"mappings":";unCA4CaA,EAAY,SAAZA,EAAaC,GAA0B,IAAAC,EAClDC,EAASC,iBAAgB,WACvB,IAAMC,EAAYC,SAASC,KAAKC,MAAMC,QACtC,IAAMC,EAAgB,CAAA,EACtB,GAAIL,EAAW,CACb,IAAMM,EAAQ,mBAEd,IAAIC,EACJ,MAAQA,EAAQD,EAAME,KAAKR,GAAa,CACtC,IAAMS,EAAMF,EAAM,GAAGG,OACrB,IAAMC,EAAQJ,EAAM,GACpBF,EAAcI,GAAOE,CACvB,CACF,CACA,GAAIf,EAAMgB,KAAM,CACdP,EAAc,cAAgBQ,EAAIjB,EAAO,6BAA8B,WACvES,EAAc,oBAAsBQ,EAAIjB,EAAO,kCAAmC,OACpF,KAAO,CACLS,EAAc,cAAgBQ,EAAIjB,EAAO,8BAA+B,WACxES,EAAc,oBAAsBQ,EAAIjB,EAAO,mCAAoC,OACrF,CACA,IAAIkB,EAAe,GACnBC,OAAOC,KAAKX,GAAeY,SAAQ,SAACR,GAClC,GAAIJ,EAAcI,GAAM,CACtBK,EAAeA,GAAkBL,MAAOJ,EAAcI,GAAO,IAC/D,CACF,IACAR,SAASC,KAAKC,MAAMC,QAAUU,EAE9B,GAAIlB,EAAMgB,KAAM,CACdX,SAASC,KAAKgB,UAAUC,IAAI,aAC9B,KAAO,CACLlB,SAASC,KAAKgB,UAAUC,IAAI,cAC9B,CACD,GAAE,CAACvB,EAAMwB,cAAexB,EAAMgB,OAE/B,IAAMS,EAAavB,EAASwB,gBAE5B,OACEC,EAACC,EAAqBC,EAAA,CACpBC,OAAQ9B,EAAM8B,OACdC,cAAe,SACfC,MAAO,CAAEC,KAAM,WACXjC,EAAMkC,oBAAmB,CAC7BC,MAAKN,EAAA,IAAA5B,EACAD,EAAMkC,sBAAmB,UAAA,EAAzBjC,EAA2BkC,MAAK,CACnCC,UAAWpC,EAAMgB,KAAOmB,EAAME,cAAgBC,YAC9CC,SAEFZ,EAACa,EAAG,CAACjC,MAAO,CAAE,kBAAmBkB,EAAWgB,cAAiCC,UAAU,gBAAeH,SACpGZ,EAACgB,EAAM,CAAAJ,SAAEvC,EAAMuC,eAIvB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
.card-layout{border-radius:6px;padding:15px}.card-layout-title-sign{padding-left:10px;position:relative}.card-layout-title-sign:before{background:var(--color-primary,#1677ff);border-radius:3px;content:"";height:13px;left:0;position:absolute;top:50%;transform:translateY(-50%);width:3px}.card-layout-title{align-items:center;display:flex;position:relative}.card-layout-title+.card-layout-content{margin-top:8px}.card-layout-title-content{font-size:16px;font-weight:500}.card-layout-subtitle,.card-layout-title-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card-layout-subtitle{color:#969696;flex:1;font-size:12px}.card-layout-title-extra{margin-left:15px}.card-layout-desc,.card-layout-desc-list{font-size:12px;opacity:.7}.card-layout+.card-layout,.card-layout-desc+.card-layout-content,.card-layout-desc-list+.card-layout-content{margin-top:8px}.card-layout-title-fixed{display:flex;flex-direction:column;height:100%;overflow:hidden}.card-layout-title-fixed>.card-layout-content{flex:1;overflow-y:auto}.card-layout-small{padding:8px 15px}.card-layout-small .card-layout-content{margin-top:0}.card-layout-small .card-layout-title-content{font-size:14px}.card-layout-small .card-layout-title-sign:before{height:11px}.card-layout-tight{border-radius:0;padding:0}
|
package/esm/card-layout/index.js
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
/* eslint-disable */
|
|
2
|
+
import './../block-layout/index.css';
|
|
2
3
|
import './index.css';
|
|
3
4
|
/*! @flatjs/forge MIT @flatbiz/antd */
|
|
4
|
-
import{isArray as t}from"@dimjs/lang/cjs/is-array";import{_ as e}from"../_rollupPluginBabelHelpers-a0769acd.js";import{extend as l}from"@dimjs/utils/cjs/extend";import{classNames as i}from"@dimjs/utils/cjs/class-names";import{Space as a}from"antd";import{Fragment as r}from"react";import{
|
|
5
|
+
import{isArray as t}from"@dimjs/lang/cjs/is-array";import{_ as e}from"../_rollupPluginBabelHelpers-a0769acd.js";import{extend as l}from"@dimjs/utils/cjs/extend";import{classNames as i}from"@dimjs/utils/cjs/class-names";import{Space as a}from"antd";import{Fragment as r}from"react";import{BlockLayout as s}from"../block-layout/index.js";import{jsx as d,jsxs as c}from"react/jsx-runtime";var n=function n(o){var u;var m=i("card-layout",{"card-layout-tight":o.layoutType==="tight","card-layout-title-fixed":o.titleFixed,"card-layout-small":o.size==="small"},o.className);var y=l(o.style,{padding:o.padding,width:o.width,height:o.height,overflowY:!o.titleFixed&&(o.height||(u=o.style)!=null&&u.height)?"auto":undefined});if(o.hidden)return d(r,{});return c(s,{className:m,style:y,onClick:o.onClick,children:[o.title||o.titleExtra?c("div",{className:i("card-layout-title",{"card-layout-title-sign":o.title?o.titleLeftLine:false}),style:o.titleStyle,children:[o.subTitle?c(r,{children:[d("div",{className:"card-layout-title-content",style:o.titleContentStyle,children:o.title}),d("div",{className:"card-layout-subtitle",style:e({marginLeft:10},o.subTitleStyle),children:o.subTitle})]}):d("div",{className:"card-layout-title-content",style:e({flex:1},o.titleContentStyle),children:o.title}),o.titleExtra?d("div",{className:"card-layout-title-extra",style:o.titleExtraStyle,children:o.titleExtra}):null]}):null,o.desc&&!t(o.desc)?d("div",{className:"card-layout-desc",children:o.desc}):null,o.desc&&t(o.desc)?d("div",{className:"card-layout-desc-list",children:d(a,{direction:"vertical",size:0,children:o.desc.map((function(t,e){return d(r,{children:t},e)}))})}):null,o.children?d("div",{className:"card-layout-content",style:o.contentStyle,children:o.children}):null]})};n.defaultProps={titleLeftLine:true,layoutType:"layer"};export{n as CardLayout};
|
|
5
6
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["@flatbiz/antd/src/card-layout/card-layout.tsx"],"sourcesContent":["import { isArray } from '@dimjs/lang';\nimport { classNames, extend } from '@dimjs/utils';\nimport { Space } from 'antd';\nimport { Fragment, type CSSProperties, type ReactElement, type ReactNode } from 'react';\nimport { BlockLayout } from '../block-layout';\nimport './style.less';\n\nexport type CardLayoutProps = {\n /** 描述 */\n desc?: string | string[] | ReactElement | ReactElement[];\n /** 标题 */\n title?: string | ReactElement;\n /** 子标题,在标题右侧 */\n subTitle?: string | ReactElement;\n /**\n * layoutType 布局类型\n * ```\n * 1. layer:分层布局\n * 2. tight:紧凑布局(没有外边距)\n * ```\n */\n layoutType?: 'layer' | 'tight';\n /** 隐藏标题左侧符号 */\n titleLeftLine?: boolean;\n titleStyle?: CSSProperties;\n titleContentStyle?: CSSProperties;\n subTitleStyle?: CSSProperties;\n titleExtraStyle?: CSSProperties;\n contentStyle?: CSSProperties;\n /** 优先级大于 style padding */\n padding?: CSSProperties['padding'];\n /** 优先级大于 style width */\n width?: CSSProperties['width'];\n /** 优先级大于 style height */\n height?: CSSProperties['height'];\n /** 标题右侧布局 */\n titleExtra?: string | ReactElement;\n /** 当存在滚动条时,标题固定,滚动区域为内部部分 */\n titleFixed?: boolean;\n /**\n * 间距尺寸\n * 1. default = 15\n * 2. small = 8\n */\n size?: 'default' | 'small';\n onClick?: (event) => void;\n hidden?: boolean;\n children?: ReactNode;\n className?: string;\n style?: CSSProperties;\n};\n\n/**\n * 卡片结构布局,替代 SimpleLayout 组件\n * @param props\n * @returns\n * ```\n * 1. layoutType 布局类型\n * layer:分层布局\n * tight:紧凑布局(没有外边距)\n * ```\n */\nexport const CardLayout = (props: CardLayoutProps) => {\n const className = classNames(\n 'card-layout',\n {\n 'card-layout-tight': props.layoutType === 'tight',\n // 'card-layout-formlabel-left': labelAlign === 'left',\n 'card-layout-title-fixed': props.titleFixed,\n 'card-layout-small': props.size === 'small',\n },\n props.className,\n );\n\n // const theme = fbaHooks.useThemeToken();\n const style = extend(\n // { '--card-layout-colorPrimary': theme.colorPrimary },\n props.style,\n {\n padding: props.padding,\n width: props.width,\n height: props.height,\n overflowY: !props.titleFixed && (props.height || props.style?.height) ? 'auto' : undefined,\n },\n );\n\n if (props.hidden) return <Fragment />;\n\n return (\n <BlockLayout className={className} style={style} onClick={props.onClick}>\n {props.title || props.titleExtra ? (\n <div\n className={classNames('card-layout-title', {\n 'card-layout-title-sign': props.title ? props.titleLeftLine : false,\n })}\n style={props.titleStyle}\n >\n {props.subTitle ? (\n <Fragment>\n <div className=\"card-layout-title-content\" style={props.titleContentStyle}>\n {props.title}\n </div>\n <div className=\"card-layout-subtitle\" style={{ marginLeft: 10, ...props.subTitleStyle }}>\n {props.subTitle}\n </div>\n </Fragment>\n ) : (\n <div\n className=\"card-layout-title-content\"\n style={{\n flex: 1,\n ...props.titleContentStyle,\n }}\n >\n {props.title}\n </div>\n )}\n\n {props.titleExtra ? (\n <div className=\"card-layout-title-extra\" style={props.titleExtraStyle}>\n {props.titleExtra}\n </div>\n ) : null}\n </div>\n ) : null}\n {props.desc && !isArray(props.desc) ? <div className=\"card-layout-desc\">{props.desc}</div> : null}\n {props.desc && isArray(props.desc) ? (\n <div className=\"card-layout-desc-list\">\n <Space direction=\"vertical\" size={0}>\n {(props.desc as string[]).map((item, index) => {\n return <Fragment key={index}>{item}</Fragment>;\n })}\n </Space>\n </div>\n ) : null}\n {props.children ? (\n <div className=\"card-layout-content\" style={props.contentStyle}>\n {props.children}\n </div>\n ) : null}\n </BlockLayout>\n );\n};\n\nCardLayout.defaultProps = {\n titleLeftLine: true,\n layoutType: 'layer',\n};\n"],"names":["CardLayout","props","_props$style","className","_classNames","layoutType","titleFixed","size","style","_extend","padding","width","height","overflowY","undefined","hidden","_jsx","Fragment","_jsxs","BlockLayout","onClick","children","title","titleExtra","titleLeftLine","titleStyle","subTitle","titleContentStyle","_extends","marginLeft","subTitleStyle","flex","titleExtraStyle","desc","_isArray","Space","direction","map","item","index","contentStyle","defaultProps"],"mappings":";
|
|
1
|
+
{"version":3,"file":"index.js","sources":["@flatbiz/antd/src/card-layout/card-layout.tsx"],"sourcesContent":["import { isArray } from '@dimjs/lang';\nimport { classNames, extend } from '@dimjs/utils';\nimport { Space } from 'antd';\nimport { Fragment, type CSSProperties, type ReactElement, type ReactNode } from 'react';\nimport { BlockLayout } from '../block-layout';\nimport './style.less';\n\nexport type CardLayoutProps = {\n /** 描述 */\n desc?: string | string[] | ReactElement | ReactElement[];\n /** 标题 */\n title?: string | ReactElement;\n /** 子标题,在标题右侧 */\n subTitle?: string | ReactElement;\n /**\n * layoutType 布局类型\n * ```\n * 1. layer:分层布局\n * 2. tight:紧凑布局(没有外边距)\n * ```\n */\n layoutType?: 'layer' | 'tight';\n /** 隐藏标题左侧符号 */\n titleLeftLine?: boolean;\n titleStyle?: CSSProperties;\n titleContentStyle?: CSSProperties;\n subTitleStyle?: CSSProperties;\n titleExtraStyle?: CSSProperties;\n contentStyle?: CSSProperties;\n /** 优先级大于 style padding */\n padding?: CSSProperties['padding'];\n /** 优先级大于 style width */\n width?: CSSProperties['width'];\n /** 优先级大于 style height */\n height?: CSSProperties['height'];\n /** 标题右侧布局 */\n titleExtra?: string | ReactElement;\n /** 当存在滚动条时,标题固定,滚动区域为内部部分 */\n titleFixed?: boolean;\n /**\n * 间距尺寸\n * 1. default = 15\n * 2. small = 8\n */\n size?: 'default' | 'small';\n onClick?: (event) => void;\n hidden?: boolean;\n children?: ReactNode;\n className?: string;\n style?: CSSProperties;\n};\n\n/**\n * 卡片结构布局,替代 SimpleLayout 组件\n * @param props\n * @returns\n * ```\n * 1. layoutType 布局类型\n * layer:分层布局\n * tight:紧凑布局(没有外边距)\n * ```\n */\nexport const CardLayout = (props: CardLayoutProps) => {\n const className = classNames(\n 'card-layout',\n {\n 'card-layout-tight': props.layoutType === 'tight',\n // 'card-layout-formlabel-left': labelAlign === 'left',\n 'card-layout-title-fixed': props.titleFixed,\n 'card-layout-small': props.size === 'small',\n },\n props.className,\n );\n\n // const theme = fbaHooks.useThemeToken();\n const style = extend(\n // { '--card-layout-colorPrimary': theme.colorPrimary },\n props.style,\n {\n padding: props.padding,\n width: props.width,\n height: props.height,\n overflowY: !props.titleFixed && (props.height || props.style?.height) ? 'auto' : undefined,\n },\n );\n\n if (props.hidden) return <Fragment />;\n\n return (\n <BlockLayout className={className} style={style} onClick={props.onClick}>\n {props.title || props.titleExtra ? (\n <div\n className={classNames('card-layout-title', {\n 'card-layout-title-sign': props.title ? props.titleLeftLine : false,\n })}\n style={props.titleStyle}\n >\n {props.subTitle ? (\n <Fragment>\n <div className=\"card-layout-title-content\" style={props.titleContentStyle}>\n {props.title}\n </div>\n <div className=\"card-layout-subtitle\" style={{ marginLeft: 10, ...props.subTitleStyle }}>\n {props.subTitle}\n </div>\n </Fragment>\n ) : (\n <div\n className=\"card-layout-title-content\"\n style={{\n flex: 1,\n ...props.titleContentStyle,\n }}\n >\n {props.title}\n </div>\n )}\n\n {props.titleExtra ? (\n <div className=\"card-layout-title-extra\" style={props.titleExtraStyle}>\n {props.titleExtra}\n </div>\n ) : null}\n </div>\n ) : null}\n {props.desc && !isArray(props.desc) ? <div className=\"card-layout-desc\">{props.desc}</div> : null}\n {props.desc && isArray(props.desc) ? (\n <div className=\"card-layout-desc-list\">\n <Space direction=\"vertical\" size={0}>\n {(props.desc as string[]).map((item, index) => {\n return <Fragment key={index}>{item}</Fragment>;\n })}\n </Space>\n </div>\n ) : null}\n {props.children ? (\n <div className=\"card-layout-content\" style={props.contentStyle}>\n {props.children}\n </div>\n ) : null}\n </BlockLayout>\n );\n};\n\nCardLayout.defaultProps = {\n titleLeftLine: true,\n layoutType: 'layer',\n};\n"],"names":["CardLayout","props","_props$style","className","_classNames","layoutType","titleFixed","size","style","_extend","padding","width","height","overflowY","undefined","hidden","_jsx","Fragment","_jsxs","BlockLayout","onClick","children","title","titleExtra","titleLeftLine","titleStyle","subTitle","titleContentStyle","_extends","marginLeft","subTitleStyle","flex","titleExtraStyle","desc","_isArray","Space","direction","map","item","index","contentStyle","defaultProps"],"mappings":";sYA8DaA,EAAa,SAAbA,EAAcC,GAA2B,IAAAC,EACpD,IAAMC,EAAYC,EAChB,cACA,CACE,oBAAqBH,EAAMI,aAAe,QAE1C,0BAA2BJ,EAAMK,WACjC,oBAAqBL,EAAMM,OAAS,SAEtCN,EAAME,WAIR,IAAMK,EAAQC,EAEZR,EAAMO,MACN,CACEE,QAAST,EAAMS,QACfC,MAAOV,EAAMU,MACbC,OAAQX,EAAMW,OACdC,WAAYZ,EAAMK,aAAeL,EAAMW,SAAMV,EAAID,EAAMO,QAANN,MAAAA,EAAaU,QAAU,OAASE,YAIrF,GAAIb,EAAMc,OAAQ,OAAOC,EAACC,EAAQ,CAAE,GAEpC,OACEC,EAACC,EAAW,CAAChB,UAAWA,EAAWK,MAAOA,EAAOY,QAASnB,EAAMmB,QAAQC,SAAA,CACrEpB,EAAMqB,OAASrB,EAAMsB,WACpBL,EAAA,MAAA,CACEf,UAAWC,EAAW,oBAAqB,CACzC,yBAA0BH,EAAMqB,MAAQrB,EAAMuB,cAAgB,QAEhEhB,MAAOP,EAAMwB,WAAWJ,UAEvBpB,EAAMyB,SACLR,EAACD,EAAQ,CAAAI,UACPL,EAAA,MAAA,CAAKb,UAAU,4BAA4BK,MAAOP,EAAM0B,kBAAkBN,SACvEpB,EAAMqB,QAETN,EAAA,MAAA,CAAKb,UAAU,uBAAuBK,MAAKoB,EAAA,CAAIC,WAAY,IAAO5B,EAAM6B,eAAgBT,SACrFpB,EAAMyB,cAIXV,EAAA,MAAA,CACEb,UAAU,4BACVK,MAAKoB,EAAA,CACHG,KAAM,GACH9B,EAAM0B,mBACTN,SAEDpB,EAAMqB,QAIVrB,EAAMsB,WACLP,EAAA,MAAA,CAAKb,UAAU,0BAA0BK,MAAOP,EAAM+B,gBAAgBX,SACnEpB,EAAMsB,aAEP,QAEJ,KACHtB,EAAMgC,OAASC,EAAQjC,EAAMgC,MAAQjB,EAAA,MAAA,CAAKb,UAAU,mBAAkBkB,SAAEpB,EAAMgC,OAAc,KAC5FhC,EAAMgC,MAAQC,EAAQjC,EAAMgC,MAC3BjB,EAAA,MAAA,CAAKb,UAAU,wBAAuBkB,SACpCL,EAACmB,EAAK,CAACC,UAAU,WAAW7B,KAAM,EAAEc,SAChCpB,EAAMgC,KAAkBI,KAAI,SAACC,EAAMC,GACnC,OAAOvB,EAACC,EAAQ,CAAAI,SAAciB,GAARC,UAI1B,KACHtC,EAAMoB,SACLL,EAAA,MAAA,CAAKb,UAAU,sBAAsBK,MAAOP,EAAMuC,aAAanB,SAC5DpB,EAAMoB,WAEP,OAGV,EAEArB,EAAWyC,aAAe,CACxBjB,cAAe,KACfnB,WAAY"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
.union-after-text,.union-before-text{align-self:flex-start;flex-shrink:0;line-height:32px}.union-after-element,.union-before-element{align-self:flex-start}.form-item-group-horizontal-union .v-flex-layout .ant-form-item{align-self:flex-start;margin-bottom:0}.form-item-group-horizontal-union .v-flex-layout{align-items:flex-start}.drag-form-list-item-grap *{opacity:.7!important}.drag-form-list-item-disabled .drag-form-list-item-trigger{cursor:no-drop;opacity:.6}.drag-form-list-overlay{border:none;border-radius:6px;box-shadow:0 0 12px 4px rgba(34,33,81,.1)}.drag-form-list-overlay .ant-collapse-item{border-bottom:none}.drag-form-list-overlay .drag-form-list-item-trigger{background-color:transparent}.drag-form-list-icon{display:inline-block;width:30px}.drag-form-list-item{align-items:center;background-color:var(--block-bg-color);display:flex;padding:8px 0}.drag-form-list .drag-form-list-item-content{flex:1}.drag-form-list .drag-form-list-item-content .ant-form-item.form-item-group-horizontal-union,.drag-form-list .drag-form-list-item-content .ant-form-item.form-item-group-horizontal-union .ant-form-item{margin-bottom:0}.drag-form-list-item-trigger{align-items:center;border-radius:6px;cursor:move;display:inline-flex;font-size:16px;height:30px;justify-content:center;margin-right:5px;width:30px}.drag-form-list-item-trigger:hover{background-color:rgba(0,0,0,.1)}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
/* eslint-disable */
|
|
2
|
+
import './../block-layout/index.css';
|
|
2
3
|
import './../button-wrapper/index.css';
|
|
3
4
|
import './../config-provider-wrapper/index.css';
|
|
4
5
|
import './../fba-hooks/index.css';
|
|
@@ -9,5 +10,5 @@ import './../flex-layout/index.css';
|
|
|
9
10
|
import './../text-symbol-wrapper/index.css';
|
|
10
11
|
import './index.css';
|
|
11
12
|
/*! @flatjs/forge MIT @flatbiz/antd */
|
|
12
|
-
import{classNames as e}from"@dimjs/utils/cjs/class-names";import{hooks as r}from"@wove/react/cjs/hooks";import{_ as t}from"../_rollupPluginBabelHelpers-a0769acd.js";import{DndContext as i,closestCenter as n,DragOverlay as a}from"@dnd-kit/core";import{useSortable as o,SortableContext as d,verticalListSortingStrategy as l,arrayMove as m}from"@dnd-kit/sortable";import{toArray as s,getUuid as u}from"@flatbiz/utils";import{Form as p,Empty as c}from"antd";import{Fragment as f,useState as g,useRef as v,useMemo as h}from"react";import{
|
|
13
|
+
import{classNames as e}from"@dimjs/utils/cjs/class-names";import{hooks as r}from"@wove/react/cjs/hooks";import{_ as t}from"../_rollupPluginBabelHelpers-a0769acd.js";import{DndContext as i,closestCenter as n,DragOverlay as a}from"@dnd-kit/core";import{useSortable as o,SortableContext as d,verticalListSortingStrategy as l,arrayMove as m}from"@dnd-kit/sortable";import{toArray as s,getUuid as u}from"@flatbiz/utils";import{Form as p,Empty as c}from"antd";import{Fragment as f,useState as g,useRef as v,useMemo as h}from"react";import{BlockLayout as y}from"../block-layout/index.js";import{ButtonWrapper as I}from"../button-wrapper/index.js";import{FormItemGroup as x}from"../form-item-group/index.js";import{TextSymbolWrapper as j}from"../text-symbol-wrapper/index.js";import D from"@ant-design/icons/es/icons/DragOutlined";import{CSS as b}from"@dnd-kit/utilities";import{jsx as L,jsxs as N}from"react/jsx-runtime";import"@ant-design/icons/es/icons/LoadingOutlined";import"@dimjs/lang/cjs/is-promise";import"../index-7f4ad045.js";import"antd/es/locale/en_US";import"antd/es/locale/zh_CN";import"dayjs";import"dayjs/locale/en";import"dayjs/locale/zh-cn";import"dayjs/plugin/advancedFormat";import"dayjs/plugin/customParseFormat";import"dayjs/plugin/localeData";import"dayjs/plugin/utc";import"dayjs/plugin/weekday";import"dayjs/plugin/weekOfYear";import"dayjs/plugin/weekYear";import"../fba-hooks/index.js";import"@dimjs/lang/cjs/is-array";import"../use-responsive-point-21b8c601.js";import"@dimjs/utils/cjs/extend";import"../fba-utils/index.js";import"../flex-layout/index.js";function C(i){var n=p.useFormInstance();var a=i.isOverlay?false:i.getItemDragDisabled==null?void 0:i.getItemDragDisabled(i.uid,i.index);var d=o({id:i.uid,disabled:a}),l=d.listeners,m=d.setNodeRef,s=d.transform,u=d.transition;var c=r.useCallbackRef((function(){var e=i.dragIcon?i.dragIcon:L(D,{});return i.dragDisabled?L(f,{}):L("span",t({className:"drag-form-list-item-trigger"},l,{children:L("span",{children:e})}))}));var g=t({transform:b.Transform.toString(s),transition:u},i.style);var v=e("drag-form-list-item",{"drag-form-list-item-grap":i.isGray,"drag-form-list-item-disabled":a},i.className);return N("div",{style:t({},g),ref:m,className:v,children:[L(p.Item,{noStyle:true,children:c()}),L("div",{className:"drag-form-list-item-content",children:i.children({formListFieldData:i.formListFieldData,operation:i.formListOperate,formStageCompleteName:i.formStageCompleteName,index:i.index,getInsideFormItemName:function e(r){return[i.formListFieldData.name,r]},getInsideFormItemData:function e(){return n.getFieldValue(i.formStageCompleteName)||{}},prevCompleteName:i.prevCompleteName,uidKey:i.uidFieldName})})]})}var w=function e(r){if(r.wrapper)return r.wrapper({children:r.children});return r.children};var F=function e(r){var i,n,a;var o=(i=r.formListItemTitleHProps)==null?void 0:i.gap;var d=r.dragDisabled?[]:[{width:35,mainItem:L("div",{style:{marginRight:o===undefined?-15:-o}})}];return L(x.HorizontalUnion,t({},r.formListItemTitleHProps,{style:t({marginBottom:10},(n=r.formListItemTitleHProps)==null?void 0:n.style),groupConfigList:d.concat(((a=r.formListItemTitleList)==null?void 0:a.map((function(e){if(e.required){return{width:e.width,mainItem:L("div",{style:{textAlign:"center"},children:L(j,{text:e.title,symbolType:"required"})})}}return{width:e.width,mainItem:L("div",{style:{textAlign:"center"},children:e.title})}})))||[])}))};var k=function o(x){var j=[].concat(x.prevCompleteName,s(x.name));var D=g(),b=D[0],k=D[1];var R=p.useFormInstance();var S=v([]);var T=x.uidFieldName||"uid";var A=p.useWatch(j,R);var P=r.useCallbackRef((function(e){return e==null?void 0:e[T]}));function E(e){var r=e.active;k(r.id)}var O=r.useCallbackRef((function(){return R.getFieldValue(j)||[]}));function H(e){var r=e.active,t=e.over;var i=O();if(r.id!==t.id){var n=i.findIndex((function(e){return P(e)===r.id}));var a=i.findIndex((function(e){return P(e)===t.id}));var o=m(i,n,a);R.setFields([{name:x.name,value:o}]);x.onDropChange==null?void 0:x.onDropChange(o)}k(undefined)}var _=h((function(){if(!b)return undefined;var e=O();var r=e.findIndex((function(e){return P(e)===b}));return S.current.find((function(e){return e.name===r}))}),[b,O,P]);var z=x.itemGap?x.itemGap/2:8;return L(y,{className:e("drag-form-list",x.className),style:x.style,children:L(i,{collisionDetection:n,onDragStart:E,onDragEnd:H,children:L(p.List,{name:x.name,rules:x.rules,children:function e(r,i,n){var o;var m=n.errors;S.current=r;return N("div",{style:{borderRadius:"6px",border:m!=null&&m.length?"1px solid #ff4d4f":"1px solid transparent"},children:[(o=x.formListItemTitleList)!=null&&o.length?L(F,{formListItemTitleList:x.formListItemTitleList,formListItemTitleHProps:x.formListItemTitleHorizontalUnionProps,dragDisabled:x.dragDisabled}):null,!x.hiddenEmptyRender&&!(A!=null&&A.length)?L(c,{image:c.PRESENTED_IMAGE_SIMPLE,style:{margin:"15px 0"}}):null,N(f,{children:[L(d,{items:O().map((function(e){return P(e)})),strategy:l,children:N(f,{children:[L(w,{wrapper:x.formListChildrenWrapper,children:L(f,{children:r.map((function(e,r){var n=P(O()[r]);if(!n)return null;return L(C,{formListOperate:i,formListFieldData:e,uid:n,dragIcon:x.dragIcon,getItemDragDisabled:x.getItemDragDisabled,dragDisabled:x.dragDisabled,isGray:!!n&&n===b,index:r,formStageCompleteName:[].concat(j,[e.name]),prevCompleteName:j,uidFieldName:T,style:t({},x.itemStyle,{padding:z+"px 0 "+z+"px 0"}),children:x.children},n+"-"+e.key)}))})}),x.onCustomAddRowButton?x.onCustomAddRowButton(i):L(I,{hidden:x.hiddenAddRowButton,type:"dashed",block:true,onClick:function e(){var r;return i.add(t((r={},r[T]=u(),r),x.getAddRowDefaultValues==null?void 0:x.getAddRowDefaultValues()))},children:"添加"})]})}),L(a,{dropAnimation:{duration:0},children:b&&_?L(C,{isOverlay:true,uid:b,className:"drag-form-list-overlay",formListFieldData:_,dragIcon:x.dragIcon,formListOperate:null,index:0,formStageCompleteName:[].concat(j,[_.name]),prevCompleteName:j,uidFieldName:T,children:x.children},b):null}),L(p.ErrorList,{errors:m?[L("div",{style:{color:"#ff4d4f",padding:"5px"},children:m})]:undefined})]})]})}})})})};export{k as DragFormList};
|
|
13
14
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["@flatbiz/antd/src/drag-form-list/sortable-item.tsx","@flatbiz/antd/src/drag-form-list/drag-form-list.tsx"],"sourcesContent":["import { DragOutlined } from '@ant-design/icons';\nimport { classNames } from '@dimjs/utils';\nimport { useSortable } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport { hooks } from '@wove/react';\nimport { Form, type FormListFieldData, type FormListOperation } from 'antd';\nimport { Fragment, type CSSProperties, type ReactElement } from 'react';\nimport { type DragFormListContentProps, type DragFormListProps } from './types';\nexport type SortableItemProps = {\n formListFieldData: FormListFieldData;\n formListOperate: FormListOperation;\n dragIcon?: DragFormListProps['dragIcon'];\n getItemDragDisabled?: DragFormListProps['getItemDragDisabled'];\n dragDisabled?: DragFormListProps['dragDisabled'];\n isGray?: boolean;\n className?: string;\n style?: CSSProperties;\n uid: string | number;\n index: number;\n isOverlay?: boolean;\n formStageCompleteName: (string | number)[];\n children: (data: DragFormListContentProps) => ReactElement;\n prevCompleteName: (string | number)[];\n uidFieldName: string;\n};\nexport function SortableItem(props: SortableItemProps) {\n const form = Form.useFormInstance();\n const isDisabled = props.isOverlay\n ? false\n : props.getItemDragDisabled?.(props.uid, props.index);\n const { listeners, setNodeRef, transform, transition } = useSortable({\n id: props.uid,\n disabled: isDisabled,\n });\n\n const dragIconRender = hooks.useCallbackRef(() => {\n const dragIcon = props.dragIcon ? props.dragIcon : <DragOutlined />;\n return props.dragDisabled ? (\n <Fragment />\n ) : (\n <span className=\"drag-form-list-item-trigger\" {...listeners}>\n <span>{dragIcon}</span>\n </span>\n );\n });\n\n const style = {\n transform: CSS.Transform.toString(transform),\n transition,\n ...props.style,\n };\n\n const cname = classNames(\n 'drag-form-list-item',\n {\n 'drag-form-list-item-grap': props.isGray,\n 'drag-form-list-item-disabled': isDisabled,\n },\n props.className\n );\n return (\n <div style={{ ...style }} ref={setNodeRef} className={cname}>\n <Form.Item noStyle>{dragIconRender()}</Form.Item>\n <div className=\"drag-form-list-item-content\">\n {props.children({\n formListFieldData: props.formListFieldData,\n operation: props.formListOperate,\n formStageCompleteName: props.formStageCompleteName,\n index: props.index,\n getInsideFormItemName: (key: string) => {\n return [props.formListFieldData.name, key];\n },\n getInsideFormItemData: () => {\n return form.getFieldValue(props.formStageCompleteName) || {};\n },\n prevCompleteName: props.prevCompleteName,\n uidKey: props.uidFieldName,\n })}\n </div>\n </div>\n );\n}\n","import { classNames } from '@dimjs/utils';\nimport { closestCenter, DndContext, DragOverlay } from '@dnd-kit/core';\nimport { arrayMove, SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable';\nimport { getUuid, toArray, type TAny, type TPlainObject } from '@flatbiz/utils';\nimport { hooks } from '@wove/react';\nimport { Empty, Form, type FormListFieldData } from 'antd';\nimport { Fragment, useMemo, useRef, useState, type ReactElement } from 'react';\nimport { BlockLayout } from '../block-layout';\nimport { ButtonWrapper } from '../button-wrapper';\nimport { FormItemGroup } from '../form-item-group';\nimport { FormItemHorizontalUnionProps } from '../form-item-group/horizontal-union';\nimport { TextSymbolWrapper } from '../text-symbol-wrapper';\nimport { SortableItem } from './sortable-item';\nimport './style.less';\nimport { type DragFormListProps } from './types';\n\ntype FormListChildrenWrapperProps = {\n wrapper?: DragFormListProps['formListChildrenWrapper'];\n\n children: ReactElement;\n};\nconst FormListChildrenWrapper = (props: FormListChildrenWrapperProps) => {\n if (props.wrapper) return props.wrapper({ children: props.children });\n return props.children;\n};\n\nconst FormListTitleRender = (props: {\n formListItemTitleList: DragFormListProps['formListItemTitleList'];\n formListItemTitleHProps?: DragFormListProps['formListItemTitleHorizontalUnionProps'];\n dragDisabled?: boolean;\n}) => {\n const gap = props.formListItemTitleHProps?.gap;\n const innerList: FormItemHorizontalUnionProps['groupConfigList'] = props.dragDisabled\n ? []\n : [\n {\n width: 35,\n mainItem: <div style={{ marginRight: gap === undefined ? -15 : -gap }} />,\n },\n ];\n return (\n <FormItemGroup.HorizontalUnion\n {...props.formListItemTitleHProps}\n style={{ marginBottom: 10, ...props.formListItemTitleHProps?.style }}\n groupConfigList={innerList.concat(\n props.formListItemTitleList?.map((item) => {\n if (item.required) {\n return {\n width: item.width,\n mainItem: (\n <div style={{ textAlign: 'center' }}>\n <TextSymbolWrapper text={item.title} symbolType=\"required\" />\n </div>\n ),\n };\n }\n return {\n width: item.width,\n mainItem: <div style={{ textAlign: 'center' }}>{item.title}</div>,\n };\n }) || [],\n )}\n />\n );\n};\n\n/**\n * 可拖拽FormList\n * ```\n * Demo: https://fex.qa.tcshuke.com/docs/admin/main/form/list\n * 1. FormList数组中必须要有唯一值字段,默认值字段名称uid,可通过uidFieldName自定义设置\n * 2. 通过 itemGap 设置FormList Item 之间间隙\n * ```\n */\nexport const DragFormList = (props: DragFormListProps) => {\n const stageCompleteName = [...props.prevCompleteName, ...toArray(props.name)] as Array<string | number>;\n const [dragActiveId, setDragActiveId] = useState<string | number>();\n const form = Form.useFormInstance();\n const formListOperationRef = useRef<FormListFieldData[]>([]);\n\n const uidFieldName = props.uidFieldName || 'uid';\n // 使用 useWatch 可确保FormList在变更后及时刷新\n const formListValue = Form.useWatch(stageCompleteName, form);\n\n const getUidValue = hooks.useCallbackRef((item) => {\n return item?.[uidFieldName] as string | number;\n });\n\n function handleDragStart(event) {\n const { active } = event;\n setDragActiveId(active.id);\n }\n\n const getItems = hooks.useCallbackRef(() => {\n /** 只能通过getFieldValue取值 */\n return (form.getFieldValue(stageCompleteName) || []) as TPlainObject[];\n });\n\n function handleDragEnd(event) {\n const { active, over } = event;\n const items = getItems();\n if (active.id !== over.id) {\n const oldIndex = items.findIndex((item) => getUidValue(item) === active.id);\n const newIndex = items.findIndex((item) => getUidValue(item) === over.id);\n const newList = arrayMove<TPlainObject>(items, oldIndex, newIndex);\n form.setFields([\n {\n name: props.name,\n value: newList,\n },\n ]);\n props.onDropChange?.(newList);\n }\n setDragActiveId(undefined);\n }\n\n const dragOverlayItem = useMemo(() => {\n if (!dragActiveId) return undefined;\n const items = getItems();\n const targetIndex = items.findIndex((item) => getUidValue(item) === dragActiveId);\n return formListOperationRef.current.find((item) => item.name === targetIndex);\n }, [dragActiveId, getItems, getUidValue]);\n\n const gapHalf = props.itemGap ? props.itemGap / 2 : 8;\n\n return (\n <BlockLayout className={classNames('drag-form-list', props.className)} style={props.style}>\n <DndContext collisionDetection={closestCenter} onDragStart={handleDragStart} onDragEnd={handleDragEnd}>\n <Form.List name={props.name} rules={props.rules}>\n {(fields, operation, { errors }) => {\n formListOperationRef.current = fields;\n return (\n <div\n style={{\n borderRadius: '6px',\n border: errors?.length ? '1px solid #ff4d4f' : '1px solid transparent',\n }}\n >\n {props.formListItemTitleList?.length ? (\n <FormListTitleRender\n formListItemTitleList={props.formListItemTitleList}\n formListItemTitleHProps={props.formListItemTitleHorizontalUnionProps}\n dragDisabled={props.dragDisabled}\n />\n ) : null}\n {!props.hiddenEmptyRender && !formListValue?.length ? (\n <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} style={{ margin: '15px 0' }} />\n ) : null}\n <Fragment>\n <SortableContext\n items={getItems().map((temp) => getUidValue(temp))}\n strategy={verticalListSortingStrategy}\n >\n <Fragment>\n <FormListChildrenWrapper wrapper={props.formListChildrenWrapper}>\n <Fragment>\n {fields.map((item, index) => {\n const uid = getUidValue(getItems()[index]);\n if (!uid) return null;\n return (\n <SortableItem\n formListOperate={operation}\n formListFieldData={item}\n uid={uid}\n key={`${uid}-${item.key}`}\n dragIcon={props.dragIcon}\n getItemDragDisabled={props.getItemDragDisabled}\n dragDisabled={props.dragDisabled}\n isGray={!!uid && uid === dragActiveId}\n index={index}\n formStageCompleteName={[...stageCompleteName, item.name]}\n prevCompleteName={stageCompleteName}\n uidFieldName={uidFieldName}\n style={{\n ...props.itemStyle,\n padding: `${gapHalf}px 0 ${gapHalf}px 0`,\n }}\n >\n {props.children}\n </SortableItem>\n );\n })}\n </Fragment>\n </FormListChildrenWrapper>\n {props.onCustomAddRowButton ? (\n props.onCustomAddRowButton(operation)\n ) : (\n <ButtonWrapper\n hidden={props.hiddenAddRowButton}\n type=\"dashed\"\n block\n onClick={() =>\n operation.add({\n [uidFieldName]: getUuid(),\n ...props.getAddRowDefaultValues?.(),\n })\n }\n >\n 添加\n </ButtonWrapper>\n )}\n </Fragment>\n </SortableContext>\n <DragOverlay dropAnimation={{ duration: 0 }}>\n {dragActiveId && dragOverlayItem ? (\n <SortableItem\n isOverlay={true}\n uid={dragActiveId}\n key={dragActiveId}\n className=\"drag-form-list-overlay\"\n formListFieldData={dragOverlayItem}\n dragIcon={props.dragIcon}\n formListOperate={null as TAny}\n index={0}\n formStageCompleteName={[...stageCompleteName, dragOverlayItem.name]}\n prevCompleteName={stageCompleteName}\n uidFieldName={uidFieldName}\n >\n {props.children}\n </SortableItem>\n ) : null}\n </DragOverlay>\n <Form.ErrorList\n errors={\n errors ? [<div style={{ color: '#ff4d4f', padding: '5px' }}>{errors}</div>] : undefined\n }\n />\n </Fragment>\n </div>\n );\n }}\n </Form.List>\n </DndContext>\n </BlockLayout>\n );\n};\n"],"names":["SortableItem","props","form","Form","useFormInstance","isDisabled","isOverlay","getItemDragDisabled","uid","index","_useSortable","useSortable","id","disabled","listeners","setNodeRef","transform","transition","dragIconRender","_hooks","useCallbackRef","dragIcon","_jsx","_DragOutlined","dragDisabled","Fragment","_extends","className","children","style","CSS","Transform","toString","cname","_classNames","isGray","_jsxs","ref","Item","noStyle","formListFieldData","operation","formListOperate","formStageCompleteName","getInsideFormItemName","key","name","getInsideFormItemData","getFieldValue","prevCompleteName","uidKey","uidFieldName","FormListChildrenWrapper","wrapper","FormListTitleRender","_props$formListItemTi","_props$formListItemTi2","_props$formListItemTi3","gap","formListItemTitleHProps","innerList","width","mainItem","marginRight","undefined","FormItemGroup","HorizontalUnion","marginBottom","groupConfigList","concat","formListItemTitleList","map","item","required","textAlign","TextSymbolWrapper","text","title","symbolType","DragFormList","stageCompleteName","toArray","_useState","useState","dragActiveId","setDragActiveId","formListOperationRef","useRef","formListValue","useWatch","getUidValue","handleDragStart","event","active","getItems","handleDragEnd","over","items","oldIndex","findIndex","newIndex","newList","arrayMove","setFields","value","onDropChange","dragOverlayItem","useMemo","targetIndex","current","find","gapHalf","itemGap","BlockLayout","DndContext","collisionDetection","closestCenter","onDragStart","onDragEnd","List","rules","fields","_ref","_props$formListItemTi4","errors","borderRadius","border","length","formListItemTitleHorizontalUnionProps","hiddenEmptyRender","Empty","image","PRESENTED_IMAGE_SIMPLE","margin","SortableContext","temp","strategy","verticalListSortingStrategy","formListChildrenWrapper","itemStyle","padding","onCustomAddRowButton","ButtonWrapper","hidden","hiddenAddRowButton","type","block","onClick","_extends2","add","getUuid","getAddRowDefaultValues","DragOverlay","dropAnimation","duration","ErrorList","color"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["@flatbiz/antd/src/drag-form-list/sortable-item.tsx","@flatbiz/antd/src/drag-form-list/drag-form-list.tsx"],"sourcesContent":["import { DragOutlined } from '@ant-design/icons';\nimport { classNames } from '@dimjs/utils';\nimport { useSortable } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport { hooks } from '@wove/react';\nimport { Form, type FormListFieldData, type FormListOperation } from 'antd';\nimport { Fragment, type CSSProperties, type ReactElement } from 'react';\nimport { type DragFormListContentProps, type DragFormListProps } from './types';\nexport type SortableItemProps = {\n formListFieldData: FormListFieldData;\n formListOperate: FormListOperation;\n dragIcon?: DragFormListProps['dragIcon'];\n getItemDragDisabled?: DragFormListProps['getItemDragDisabled'];\n dragDisabled?: DragFormListProps['dragDisabled'];\n isGray?: boolean;\n className?: string;\n style?: CSSProperties;\n uid: string | number;\n index: number;\n isOverlay?: boolean;\n formStageCompleteName: (string | number)[];\n children: (data: DragFormListContentProps) => ReactElement;\n prevCompleteName: (string | number)[];\n uidFieldName: string;\n};\nexport function SortableItem(props: SortableItemProps) {\n const form = Form.useFormInstance();\n const isDisabled = props.isOverlay\n ? false\n : props.getItemDragDisabled?.(props.uid, props.index);\n const { listeners, setNodeRef, transform, transition } = useSortable({\n id: props.uid,\n disabled: isDisabled,\n });\n\n const dragIconRender = hooks.useCallbackRef(() => {\n const dragIcon = props.dragIcon ? props.dragIcon : <DragOutlined />;\n return props.dragDisabled ? (\n <Fragment />\n ) : (\n <span className=\"drag-form-list-item-trigger\" {...listeners}>\n <span>{dragIcon}</span>\n </span>\n );\n });\n\n const style = {\n transform: CSS.Transform.toString(transform),\n transition,\n ...props.style,\n };\n\n const cname = classNames(\n 'drag-form-list-item',\n {\n 'drag-form-list-item-grap': props.isGray,\n 'drag-form-list-item-disabled': isDisabled,\n },\n props.className\n );\n return (\n <div style={{ ...style }} ref={setNodeRef} className={cname}>\n <Form.Item noStyle>{dragIconRender()}</Form.Item>\n <div className=\"drag-form-list-item-content\">\n {props.children({\n formListFieldData: props.formListFieldData,\n operation: props.formListOperate,\n formStageCompleteName: props.formStageCompleteName,\n index: props.index,\n getInsideFormItemName: (key: string) => {\n return [props.formListFieldData.name, key];\n },\n getInsideFormItemData: () => {\n return form.getFieldValue(props.formStageCompleteName) || {};\n },\n prevCompleteName: props.prevCompleteName,\n uidKey: props.uidFieldName,\n })}\n </div>\n </div>\n );\n}\n","import { classNames } from '@dimjs/utils';\nimport { closestCenter, DndContext, DragOverlay } from '@dnd-kit/core';\nimport { arrayMove, SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable';\nimport { getUuid, toArray, type TAny, type TPlainObject } from '@flatbiz/utils';\nimport { hooks } from '@wove/react';\nimport { Empty, Form, type FormListFieldData } from 'antd';\nimport { Fragment, useMemo, useRef, useState, type ReactElement } from 'react';\nimport { BlockLayout } from '../block-layout';\nimport { ButtonWrapper } from '../button-wrapper';\nimport { FormItemGroup } from '../form-item-group';\nimport { FormItemHorizontalUnionProps } from '../form-item-group/horizontal-union';\nimport { TextSymbolWrapper } from '../text-symbol-wrapper';\nimport { SortableItem } from './sortable-item';\nimport './style.less';\nimport { type DragFormListProps } from './types';\n\ntype FormListChildrenWrapperProps = {\n wrapper?: DragFormListProps['formListChildrenWrapper'];\n\n children: ReactElement;\n};\nconst FormListChildrenWrapper = (props: FormListChildrenWrapperProps) => {\n if (props.wrapper) return props.wrapper({ children: props.children });\n return props.children;\n};\n\nconst FormListTitleRender = (props: {\n formListItemTitleList: DragFormListProps['formListItemTitleList'];\n formListItemTitleHProps?: DragFormListProps['formListItemTitleHorizontalUnionProps'];\n dragDisabled?: boolean;\n}) => {\n const gap = props.formListItemTitleHProps?.gap;\n const innerList: FormItemHorizontalUnionProps['groupConfigList'] = props.dragDisabled\n ? []\n : [\n {\n width: 35,\n mainItem: <div style={{ marginRight: gap === undefined ? -15 : -gap }} />,\n },\n ];\n return (\n <FormItemGroup.HorizontalUnion\n {...props.formListItemTitleHProps}\n style={{ marginBottom: 10, ...props.formListItemTitleHProps?.style }}\n groupConfigList={innerList.concat(\n props.formListItemTitleList?.map((item) => {\n if (item.required) {\n return {\n width: item.width,\n mainItem: (\n <div style={{ textAlign: 'center' }}>\n <TextSymbolWrapper text={item.title} symbolType=\"required\" />\n </div>\n ),\n };\n }\n return {\n width: item.width,\n mainItem: <div style={{ textAlign: 'center' }}>{item.title}</div>,\n };\n }) || [],\n )}\n />\n );\n};\n\n/**\n * 可拖拽FormList\n * ```\n * Demo: https://fex.qa.tcshuke.com/docs/admin/main/form/list\n * 1. FormList数组中必须要有唯一值字段,默认值字段名称uid,可通过uidFieldName自定义设置\n * 2. 通过 itemGap 设置FormList Item 之间间隙\n * ```\n */\nexport const DragFormList = (props: DragFormListProps) => {\n const stageCompleteName = [...props.prevCompleteName, ...toArray(props.name)] as Array<string | number>;\n const [dragActiveId, setDragActiveId] = useState<string | number>();\n const form = Form.useFormInstance();\n const formListOperationRef = useRef<FormListFieldData[]>([]);\n\n const uidFieldName = props.uidFieldName || 'uid';\n // 使用 useWatch 可确保FormList在变更后及时刷新\n const formListValue = Form.useWatch(stageCompleteName, form);\n\n const getUidValue = hooks.useCallbackRef((item) => {\n return item?.[uidFieldName] as string | number;\n });\n\n function handleDragStart(event) {\n const { active } = event;\n setDragActiveId(active.id);\n }\n\n const getItems = hooks.useCallbackRef(() => {\n /** 只能通过getFieldValue取值 */\n return (form.getFieldValue(stageCompleteName) || []) as TPlainObject[];\n });\n\n function handleDragEnd(event) {\n const { active, over } = event;\n const items = getItems();\n if (active.id !== over.id) {\n const oldIndex = items.findIndex((item) => getUidValue(item) === active.id);\n const newIndex = items.findIndex((item) => getUidValue(item) === over.id);\n const newList = arrayMove<TPlainObject>(items, oldIndex, newIndex);\n form.setFields([\n {\n name: props.name,\n value: newList,\n },\n ]);\n props.onDropChange?.(newList);\n }\n setDragActiveId(undefined);\n }\n\n const dragOverlayItem = useMemo(() => {\n if (!dragActiveId) return undefined;\n const items = getItems();\n const targetIndex = items.findIndex((item) => getUidValue(item) === dragActiveId);\n return formListOperationRef.current.find((item) => item.name === targetIndex);\n }, [dragActiveId, getItems, getUidValue]);\n\n const gapHalf = props.itemGap ? props.itemGap / 2 : 8;\n\n return (\n <BlockLayout className={classNames('drag-form-list', props.className)} style={props.style}>\n <DndContext collisionDetection={closestCenter} onDragStart={handleDragStart} onDragEnd={handleDragEnd}>\n <Form.List name={props.name} rules={props.rules}>\n {(fields, operation, { errors }) => {\n formListOperationRef.current = fields;\n return (\n <div\n style={{\n borderRadius: '6px',\n border: errors?.length ? '1px solid #ff4d4f' : '1px solid transparent',\n }}\n >\n {props.formListItemTitleList?.length ? (\n <FormListTitleRender\n formListItemTitleList={props.formListItemTitleList}\n formListItemTitleHProps={props.formListItemTitleHorizontalUnionProps}\n dragDisabled={props.dragDisabled}\n />\n ) : null}\n {!props.hiddenEmptyRender && !formListValue?.length ? (\n <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} style={{ margin: '15px 0' }} />\n ) : null}\n <Fragment>\n <SortableContext\n items={getItems().map((temp) => getUidValue(temp))}\n strategy={verticalListSortingStrategy}\n >\n <Fragment>\n <FormListChildrenWrapper wrapper={props.formListChildrenWrapper}>\n <Fragment>\n {fields.map((item, index) => {\n const uid = getUidValue(getItems()[index]);\n if (!uid) return null;\n return (\n <SortableItem\n formListOperate={operation}\n formListFieldData={item}\n uid={uid}\n key={`${uid}-${item.key}`}\n dragIcon={props.dragIcon}\n getItemDragDisabled={props.getItemDragDisabled}\n dragDisabled={props.dragDisabled}\n isGray={!!uid && uid === dragActiveId}\n index={index}\n formStageCompleteName={[...stageCompleteName, item.name]}\n prevCompleteName={stageCompleteName}\n uidFieldName={uidFieldName}\n style={{\n ...props.itemStyle,\n padding: `${gapHalf}px 0 ${gapHalf}px 0`,\n }}\n >\n {props.children}\n </SortableItem>\n );\n })}\n </Fragment>\n </FormListChildrenWrapper>\n {props.onCustomAddRowButton ? (\n props.onCustomAddRowButton(operation)\n ) : (\n <ButtonWrapper\n hidden={props.hiddenAddRowButton}\n type=\"dashed\"\n block\n onClick={() =>\n operation.add({\n [uidFieldName]: getUuid(),\n ...props.getAddRowDefaultValues?.(),\n })\n }\n >\n 添加\n </ButtonWrapper>\n )}\n </Fragment>\n </SortableContext>\n <DragOverlay dropAnimation={{ duration: 0 }}>\n {dragActiveId && dragOverlayItem ? (\n <SortableItem\n isOverlay={true}\n uid={dragActiveId}\n key={dragActiveId}\n className=\"drag-form-list-overlay\"\n formListFieldData={dragOverlayItem}\n dragIcon={props.dragIcon}\n formListOperate={null as TAny}\n index={0}\n formStageCompleteName={[...stageCompleteName, dragOverlayItem.name]}\n prevCompleteName={stageCompleteName}\n uidFieldName={uidFieldName}\n >\n {props.children}\n </SortableItem>\n ) : null}\n </DragOverlay>\n <Form.ErrorList\n errors={\n errors ? [<div style={{ color: '#ff4d4f', padding: '5px' }}>{errors}</div>] : undefined\n }\n />\n </Fragment>\n </div>\n );\n }}\n </Form.List>\n </DndContext>\n </BlockLayout>\n );\n};\n"],"names":["SortableItem","props","form","Form","useFormInstance","isDisabled","isOverlay","getItemDragDisabled","uid","index","_useSortable","useSortable","id","disabled","listeners","setNodeRef","transform","transition","dragIconRender","_hooks","useCallbackRef","dragIcon","_jsx","_DragOutlined","dragDisabled","Fragment","_extends","className","children","style","CSS","Transform","toString","cname","_classNames","isGray","_jsxs","ref","Item","noStyle","formListFieldData","operation","formListOperate","formStageCompleteName","getInsideFormItemName","key","name","getInsideFormItemData","getFieldValue","prevCompleteName","uidKey","uidFieldName","FormListChildrenWrapper","wrapper","FormListTitleRender","_props$formListItemTi","_props$formListItemTi2","_props$formListItemTi3","gap","formListItemTitleHProps","innerList","width","mainItem","marginRight","undefined","FormItemGroup","HorizontalUnion","marginBottom","groupConfigList","concat","formListItemTitleList","map","item","required","textAlign","TextSymbolWrapper","text","title","symbolType","DragFormList","stageCompleteName","toArray","_useState","useState","dragActiveId","setDragActiveId","formListOperationRef","useRef","formListValue","useWatch","getUidValue","handleDragStart","event","active","getItems","handleDragEnd","over","items","oldIndex","findIndex","newIndex","newList","arrayMove","setFields","value","onDropChange","dragOverlayItem","useMemo","targetIndex","current","find","gapHalf","itemGap","BlockLayout","DndContext","collisionDetection","closestCenter","onDragStart","onDragEnd","List","rules","fields","_ref","_props$formListItemTi4","errors","borderRadius","border","length","formListItemTitleHorizontalUnionProps","hiddenEmptyRender","Empty","image","PRESENTED_IMAGE_SIMPLE","margin","SortableContext","temp","strategy","verticalListSortingStrategy","formListChildrenWrapper","itemStyle","padding","onCustomAddRowButton","ButtonWrapper","hidden","hiddenAddRowButton","type","block","onClick","_extends2","add","getUuid","getAddRowDefaultValues","DragOverlay","dropAnimation","duration","ErrorList","color"],"mappings":"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"}
|
package/esm/drag-table/index.js
CHANGED
|
@@ -2,5 +2,5 @@
|
|
|
2
2
|
import './../icon-wrapper/index.css';
|
|
3
3
|
import './index.css';
|
|
4
4
|
/*! @flatjs/forge MIT @flatbiz/antd */
|
|
5
|
-
import{_ as r,a as n}from"../_rollupPluginBabelHelpers-a0769acd.js";import{useSensors as o,useSensor as e,PointerSensor as t,DndContext as i}from"@dnd-kit/core";import{restrictToVerticalAxis as a}from"@dnd-kit/modifiers";import{useSortable as d,SortableContext as s,verticalListSortingStrategy as c,arrayMove as l}from"@dnd-kit/sortable";import{Table as
|
|
5
|
+
import{_ as r,a as n}from"../_rollupPluginBabelHelpers-a0769acd.js";import{useSensors as o,useSensor as e,PointerSensor as t,DndContext as i}from"@dnd-kit/core";import{restrictToVerticalAxis as a}from"@dnd-kit/modifiers";import{useSortable as d,SortableContext as s,verticalListSortingStrategy as c,arrayMove as l}from"@dnd-kit/sortable";import{Table as f}from"antd";import{Children as u,cloneElement as m,isValidElement as v,useState as p,useEffect as g,useMemo as x}from"react";import{createCtx as y}from"@wove/react/cjs/create-ctx";import{CSS as I}from"@dnd-kit/utilities";import{jsx as b}from"react/jsx-runtime";import h from"@ant-design/icons/es/icons/DragOutlined";import{noop as k}from"@flatbiz/utils";import{IconWrapper as j}from"../icon-wrapper/index.js";import"@dimjs/utils/cjs/class-names";import"@dimjs/lang/cjs/is-undefined";var w=y(),D=w[0],S=w[1];var C=function n(o){var e=d({id:o["data-row-key"]}),t=e.listeners,i=e.setNodeRef,a=e.transform,s=e.transition,c=e.isDragging;var l=r({},o.style,{transform:I.Transform.toString(a&&r({},a,{scaleY:1})),transition:s,cursor:"move"},c?{position:"relative",zIndex:9999,boxShadow:" 0px 0px 12px 4px rgba(34, 33, 81, 0.1)"}:{});return b("tr",r({},o,{ref:i,style:l},t))};var z=["dragIcon"];var A=function o(e){var t=e.dragIcon,i=n(e,z);var a=i["data-row-key"];var s=d({id:a}),c=s.setActivatorNodeRef,l=s.listeners,f=s.setNodeRef,p=s.transform,g=s.transition,x=s.isDragging;if(!a){return b("tr",r({},i))}var y=r({},i.style,{transform:I.Transform.toString(p&&r({},p,{scaleY:1})),transition:g,cursor:t===false?"move":undefined},x?{position:"relative",zIndex:9999,boxShadow:" 0px 0px 12px 4px rgba(34, 33, 81, 0.1)",backgroundColor:"var(--block-bg-color)"}:{});var w=v(t)?t:b(h,{});return b("tr",r({},i,{ref:f,style:y,children:u.map(e.children,(function(n){if(n.key==="sort"){return m(n,{children:b("span",r({ref:c,style:{touchAction:"none",cursor:"move",position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",display:"inline-flex"}},l,{children:b(j,{style:{touchAction:"none",cursor:"move",padding:"1px 0px",margin:0,justifyContent:"center",color:"#787878"},icon:w,onClick:k})}))})}return n}))}))};var K=function n(o){var e=D();return e.dragIcon===false?b(C,r({},o,{dragIcon:e.dragIcon})):b(A,r({},o,{dragIcon:e.dragIcon}))};var N=["dragIcon","uidFieldKey","columns","dataSource","onDragChange","disabledDrag"];var R=function d(u){var m;var v=u.dragIcon,y=u.uidFieldKey,I=u.columns,h=u.dataSource,k=u.onDragChange,j=u.disabledDrag,w=n(u,N);var D=p([]),C=D[0],z=D[1];g((function(){z(h||[])}),[h]);var A=function r(n){var o=n.active,e=n.over;if(o.id!==(e==null?void 0:e.id)){var t=C.findIndex((function(r){return r[y]===o.id}));var i=C.findIndex((function(r){return r[y]===(e==null?void 0:e.id)}));var a=l(C,t,i);z([].concat(a));k==null?void 0:k(a,{activeId:o.id,activeIndex:t,overIndex:i})}};var R=x((function(){if(v===false||u.disabledDrag)return I;return[{key:"sort",dataIndex:"sort",align:"center",width:50}].concat(I||[])}),[I,v]);var F=o(e(t,{activationConstraint:{delay:v===false?150:0,tolerance:0}}));return b(S,{value:{dragIcon:v},children:b(i,{sensors:F,modifiers:[a],onDragEnd:A,children:b(s,{items:C.map((function(r){return r[y]})),strategy:c,children:b(f,r({pagination:false,rowKey:y,bordered:true,components:r({},w.components,{body:r({},(m=w.components)==null?void 0:m.body,{row:j?undefined:K})})},w,{dataSource:C,columns:R}))})})})};export{R as DragTable};
|
|
6
6
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["@flatbiz/antd/src/drag-table/context.ts","@flatbiz/antd/src/drag-table/table-tr.tsx","@flatbiz/antd/src/drag-table/table-tr-handle.tsx","@flatbiz/antd/src/drag-table/row.tsx","@flatbiz/antd/src/drag-table/drag-table.tsx"],"sourcesContent":["import { createCtx } from '@wove/react';\nimport { type ReactElement } from 'react';\n\nexport const [getCtx, CtxProvider] = createCtx<{\n dragIcon?: false | ReactElement;\n}>();\n","import { useSortable } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\n\nexport const TableTr = (props) => {\n const { listeners, setNodeRef, transform, transition, isDragging } = useSortable({\n id: props['data-row-key'],\n });\n\n const style: React.CSSProperties = {\n ...props.style,\n transform: CSS.Transform.toString(transform && { ...transform, scaleY: 1 }),\n transition,\n cursor: 'move',\n ...(isDragging\n ? {\n position: 'relative',\n zIndex: 9999,\n boxShadow: ' 0px 0px 12px 4px rgba(34, 33, 81, 0.1)',\n }\n : {}),\n };\n\n return <tr {...props} ref={setNodeRef} style={style} {...listeners} />;\n};\n","import { DragOutlined } from '@ant-design/icons';\nimport { useSortable } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport { noop } from '@flatbiz/utils';\nimport { type RowProps } from 'antd';\nimport { Children, cloneElement, isValidElement, type ReactElement } from 'react';\nimport { IconWrapper } from '../icon-wrapper';\ntype TableTrHandleProps = RowProps & {\n dragIcon?: false | ReactElement;\n};\nexport const TableTrHandle = (props: TableTrHandleProps) => {\n const { dragIcon, ...innerProps } = props;\n const rowId = innerProps['data-row-key'];\n const { setActivatorNodeRef, listeners, setNodeRef, transform, transition, isDragging } = useSortable({\n id: rowId,\n });\n\n if (!rowId) {\n return <tr {...innerProps} />;\n }\n const style: React.CSSProperties = {\n ...innerProps.style,\n transform: CSS.Transform.toString(transform && { ...transform, scaleY: 1 }),\n transition,\n cursor: dragIcon === false ? 'move' : undefined,\n ...(isDragging\n ? {\n position: 'relative',\n zIndex: 9999,\n boxShadow: ' 0px 0px 12px 4px rgba(34, 33, 81, 0.1)',\n backgroundColor: 'var(--block-bg-color)',\n }\n : {}),\n };\n const iconElement = isValidElement(dragIcon) ? dragIcon : <DragOutlined />;\n return (\n <tr {...innerProps} ref={setNodeRef} style={style}>\n {Children.map(props.children, (child) => {\n if ((child as React.ReactElement).key === 'sort') {\n return cloneElement(child as React.ReactElement, {\n children: (\n <span ref={setActivatorNodeRef} style={{ touchAction: 'none', cursor: 'move' }} {...listeners}>\n <IconWrapper\n style={{\n touchAction: 'none',\n cursor: 'move',\n padding: '1px 0px',\n margin: 0,\n justifyContent: 'center',\n color: '#787878',\n }}\n icon={iconElement}\n onClick={noop}\n />\n </span>\n ),\n });\n }\n return child;\n })}\n </tr>\n );\n};\n","import { getCtx } from './context';\nimport { TableTr } from './table-tr';\nimport { TableTrHandle } from './table-tr-handle';\n\nexport const Row = (props) => {\n const ctx = getCtx();\n return ctx.dragIcon === false ? (\n <TableTr {...props} dragIcon={ctx.dragIcon} />\n ) : (\n <TableTrHandle {...props} dragIcon={ctx.dragIcon} />\n );\n};\n","import { DndContext, PointerSensor, useSensor, useSensors, type DragEndEvent } from '@dnd-kit/core';\nimport { restrictToVerticalAxis } from '@dnd-kit/modifiers';\nimport { arrayMove, SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable';\nimport { type TAny, type TPlainObject } from '@flatbiz/utils';\nimport { Table, type TableProps } from 'antd';\nimport { useEffect, useMemo, useState, type ReactElement } from 'react';\nimport { CtxProvider } from './context';\nimport { Row } from './row';\n\ntype DragTableProps = Omit<TableProps<TPlainObject>, 'dataSource'> & {\n /**\n * ```\n * 1. 可自定义拖拽图标\n * 2. dragIcon = false,可设置表格行拖拽\n * ```\n */\n dragIcon?: false | ReactElement;\n /** 表格数据唯一值字段Key,未填或者无法唯一,都不能拖拽能力 */\n uidFieldKey: string;\n dataSource?: TPlainObject[];\n /** 禁用拖拽 */\n disabledDrag?: boolean;\n /**\n * 拖拽结束事件\n * ```\n * dataSource: 拖拽完成后的数据源\n * dragData\n * 1. activeId 拖拽ID\n * 2. activeIndex 拖拽起始表格数组索引值\n * 3. overIndex 拖拽结束表格数组索引值\n * ```\n */\n onDragChange?: (\n dataSource: TPlainObject[],\n dragData: {\n activeId: string | number;\n activeIndex: number;\n overIndex: number;\n },\n ) => void;\n};\n\n/**\n * 可拖拽表格\n * ```\n * 1. 必须设置唯一值字段 uidFieldKey\n * 2. 如果拖拽显示异常,请检查 uidFieldKey 是否正确\n * 3. Table 参数 components.body.row 被组件内部使用\n * ```\n */\nexport const DragTable = (props: DragTableProps) => {\n const { dragIcon, uidFieldKey, columns, dataSource, onDragChange, disabledDrag, ...otherProps } = props;\n const [dataList, setDataList] = useState<TAny[]>([]);\n\n useEffect(() => {\n setDataList(dataSource || []);\n }, [dataSource]);\n\n const onDragEnd = ({ active, over }: DragEndEvent) => {\n if (active.id !== over?.id) {\n const activeIndex = dataList.findIndex((i) => i[uidFieldKey] === active.id);\n const overIndex = dataList.findIndex((i) => i[uidFieldKey] === over?.id);\n const dataListNew = arrayMove(dataList, activeIndex, overIndex);\n setDataList([...dataListNew]);\n onDragChange?.(dataListNew, {\n activeId: active.id,\n activeIndex,\n overIndex,\n });\n }\n };\n\n const columnsList = useMemo(() => {\n if (dragIcon === false) return columns;\n return [\n {\n key: 'sort',\n dataIndex: 'sort',\n align: 'center',\n width: 50,\n } as TAny,\n ].concat(columns || []);\n }, [columns, dragIcon]);\n\n const sensors = useSensors(\n useSensor(PointerSensor, {\n activationConstraint: {\n // 当拖拽触发区域有其他点击事件时,需要延迟触发拖拽动作\n delay: dragIcon === false ? 150 : 0,\n tolerance: 0,\n },\n }),\n );\n\n return (\n <CtxProvider value={{ dragIcon }}>\n <DndContext sensors={sensors} modifiers={[restrictToVerticalAxis]} onDragEnd={onDragEnd}>\n <SortableContext items={dataList.map((i) => i[uidFieldKey])} strategy={verticalListSortingStrategy}>\n <Table\n pagination={false}\n rowKey={uidFieldKey}\n bordered\n components={{\n ...otherProps.components,\n body: {\n ...otherProps.components?.body,\n row: disabledDrag ? undefined : Row,\n },\n }}\n {...otherProps}\n dataSource={dataList}\n columns={columnsList}\n />\n </SortableContext>\n </DndContext>\n </CtxProvider>\n );\n};\n"],"names":["_createCtx","_createCtx2","getCtx","CtxProvider","TableTr","props","_useSortable","useSortable","id","listeners","setNodeRef","transform","transition","isDragging","style","_extends","CSS","Transform","toString","scaleY","cursor","position","zIndex","boxShadow","_jsx","ref","TableTrHandle","dragIcon","innerProps","_objectWithoutPropertiesLoose","_excluded","rowId","setActivatorNodeRef","undefined","backgroundColor","iconElement","isValidElement","_DragOutlined","children","Children","map","child","key","cloneElement","touchAction","IconWrapper","padding","margin","justifyContent","color","icon","onClick","noop","Row","ctx","DragTable","_otherProps$component","uidFieldKey","columns","dataSource","onDragChange","disabledDrag","otherProps","_useState","useState","dataList","setDataList","useEffect","onDragEnd","_ref","active","over","activeIndex","findIndex","i","overIndex","dataListNew","arrayMove","concat","activeId","columnsList","useMemo","dataIndex","align","width","sensors","useSensors","useSensor","PointerSensor","activationConstraint","delay","tolerance","value","DndContext","modifiers","restrictToVerticalAxis","SortableContext","items","strategy","verticalListSortingStrategy","Table","pagination","rowKey","bordered","components","body","row"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["@flatbiz/antd/src/drag-table/context.ts","@flatbiz/antd/src/drag-table/table-tr.tsx","@flatbiz/antd/src/drag-table/table-tr-handle.tsx","@flatbiz/antd/src/drag-table/row.tsx","@flatbiz/antd/src/drag-table/drag-table.tsx"],"sourcesContent":["import { createCtx } from '@wove/react';\nimport { type ReactElement } from 'react';\n\nexport const [getCtx, CtxProvider] = createCtx<{\n dragIcon?: false | ReactElement;\n}>();\n","import { useSortable } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\n\nexport const TableTr = (props) => {\n const { listeners, setNodeRef, transform, transition, isDragging } = useSortable({\n id: props['data-row-key'],\n });\n\n const style: React.CSSProperties = {\n ...props.style,\n transform: CSS.Transform.toString(transform && { ...transform, scaleY: 1 }),\n transition,\n cursor: 'move',\n ...(isDragging\n ? {\n position: 'relative',\n zIndex: 9999,\n boxShadow: ' 0px 0px 12px 4px rgba(34, 33, 81, 0.1)',\n }\n : {}),\n };\n\n return <tr {...props} ref={setNodeRef} style={style} {...listeners} />;\n};\n","import { DragOutlined } from '@ant-design/icons';\nimport { useSortable } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport { noop } from '@flatbiz/utils';\nimport { type RowProps } from 'antd';\nimport { Children, cloneElement, isValidElement, type ReactElement } from 'react';\nimport { IconWrapper } from '../icon-wrapper';\ntype TableTrHandleProps = RowProps & {\n dragIcon?: false | ReactElement;\n};\nexport const TableTrHandle = (props: TableTrHandleProps) => {\n const { dragIcon, ...innerProps } = props;\n const rowId = innerProps['data-row-key'];\n const { setActivatorNodeRef, listeners, setNodeRef, transform, transition, isDragging } = useSortable({\n id: rowId,\n });\n\n if (!rowId) {\n return <tr {...innerProps} />;\n }\n const style: React.CSSProperties = {\n ...innerProps.style,\n transform: CSS.Transform.toString(transform && { ...transform, scaleY: 1 }),\n transition,\n cursor: dragIcon === false ? 'move' : undefined,\n ...(isDragging\n ? {\n position: 'relative',\n zIndex: 9999,\n boxShadow: ' 0px 0px 12px 4px rgba(34, 33, 81, 0.1)',\n backgroundColor: 'var(--block-bg-color)',\n }\n : {}),\n };\n const iconElement = isValidElement(dragIcon) ? dragIcon : <DragOutlined />;\n return (\n <tr {...innerProps} ref={setNodeRef} style={style}>\n {Children.map(props.children, (child) => {\n if ((child as React.ReactElement).key === 'sort') {\n return cloneElement(child as React.ReactElement, {\n children: (\n <span\n ref={setActivatorNodeRef}\n style={{\n touchAction: 'none',\n cursor: 'move',\n position: 'absolute',\n top: '50%',\n left: '50%',\n transform: 'translate(-50%, -50%)',\n display: 'inline-flex',\n }}\n {...listeners}\n >\n <IconWrapper\n style={{\n touchAction: 'none',\n cursor: 'move',\n padding: '1px 0px',\n margin: 0,\n justifyContent: 'center',\n color: '#787878',\n }}\n icon={iconElement}\n onClick={noop}\n />\n </span>\n ),\n });\n }\n return child;\n })}\n </tr>\n );\n};\n","import { getCtx } from './context';\nimport { TableTr } from './table-tr';\nimport { TableTrHandle } from './table-tr-handle';\n\nexport const Row = (props) => {\n const ctx = getCtx();\n return ctx.dragIcon === false ? (\n <TableTr {...props} dragIcon={ctx.dragIcon} />\n ) : (\n <TableTrHandle {...props} dragIcon={ctx.dragIcon} />\n );\n};\n","import { DndContext, PointerSensor, useSensor, useSensors, type DragEndEvent } from '@dnd-kit/core';\nimport { restrictToVerticalAxis } from '@dnd-kit/modifiers';\nimport { arrayMove, SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable';\nimport { type TAny, type TPlainObject } from '@flatbiz/utils';\nimport { Table, type TableProps } from 'antd';\nimport { useEffect, useMemo, useState, type ReactElement } from 'react';\nimport { CtxProvider } from './context';\nimport { Row } from './row';\n\ntype DragTableProps = Omit<TableProps<TPlainObject>, 'dataSource'> & {\n /**\n * ```\n * 1. 可自定义拖拽图标\n * 2. dragIcon = false,可设置表格行拖拽\n * ```\n */\n dragIcon?: false | ReactElement;\n /** 表格数据唯一值字段Key,未填或者无法唯一,都不能拖拽能力 */\n uidFieldKey: string;\n dataSource?: TPlainObject[];\n /** 禁用拖拽 */\n disabledDrag?: boolean;\n /**\n * 拖拽结束事件\n * ```\n * dataSource: 拖拽完成后的数据源\n * dragData\n * 1. activeId 拖拽ID\n * 2. activeIndex 拖拽起始表格数组索引值\n * 3. overIndex 拖拽结束表格数组索引值\n * ```\n */\n onDragChange?: (\n dataSource: TPlainObject[],\n dragData: {\n activeId: string | number;\n activeIndex: number;\n overIndex: number;\n },\n ) => void;\n};\n\n/**\n * 可拖拽表格\n * ```\n * 1. 必须设置唯一值字段 uidFieldKey\n * 2. 如果拖拽显示异常,请检查 uidFieldKey 是否正确\n * 3. Table 参数 components.body.row 被组件内部使用\n * ```\n */\nexport const DragTable = (props: DragTableProps) => {\n const { dragIcon, uidFieldKey, columns, dataSource, onDragChange, disabledDrag, ...otherProps } = props;\n const [dataList, setDataList] = useState<TAny[]>([]);\n\n useEffect(() => {\n setDataList(dataSource || []);\n }, [dataSource]);\n\n const onDragEnd = ({ active, over }: DragEndEvent) => {\n if (active.id !== over?.id) {\n const activeIndex = dataList.findIndex((i) => i[uidFieldKey] === active.id);\n const overIndex = dataList.findIndex((i) => i[uidFieldKey] === over?.id);\n const dataListNew = arrayMove(dataList, activeIndex, overIndex);\n setDataList([...dataListNew]);\n onDragChange?.(dataListNew, {\n activeId: active.id,\n activeIndex,\n overIndex,\n });\n }\n };\n\n const columnsList = useMemo(() => {\n if (dragIcon === false || props.disabledDrag) return columns;\n return [\n {\n key: 'sort',\n dataIndex: 'sort',\n align: 'center',\n width: 50,\n } as TAny,\n ].concat(columns || []);\n }, [columns, dragIcon]);\n\n const sensors = useSensors(\n useSensor(PointerSensor, {\n activationConstraint: {\n // 当拖拽触发区域有其他点击事件时,需要延迟触发拖拽动作\n delay: dragIcon === false ? 150 : 0,\n tolerance: 0,\n },\n }),\n );\n\n return (\n <CtxProvider value={{ dragIcon }}>\n <DndContext sensors={sensors} modifiers={[restrictToVerticalAxis]} onDragEnd={onDragEnd}>\n <SortableContext items={dataList.map((i) => i[uidFieldKey])} strategy={verticalListSortingStrategy}>\n <Table\n pagination={false}\n rowKey={uidFieldKey}\n bordered\n components={{\n ...otherProps.components,\n body: {\n ...otherProps.components?.body,\n row: disabledDrag ? undefined : Row,\n },\n }}\n {...otherProps}\n dataSource={dataList}\n columns={columnsList}\n />\n </SortableContext>\n </DndContext>\n </CtxProvider>\n );\n};\n"],"names":["_createCtx","_createCtx2","getCtx","CtxProvider","TableTr","props","_useSortable","useSortable","id","listeners","setNodeRef","transform","transition","isDragging","style","_extends","CSS","Transform","toString","scaleY","cursor","position","zIndex","boxShadow","_jsx","ref","TableTrHandle","dragIcon","innerProps","_objectWithoutPropertiesLoose","_excluded","rowId","setActivatorNodeRef","undefined","backgroundColor","iconElement","isValidElement","_DragOutlined","children","Children","map","child","key","cloneElement","touchAction","top","left","display","IconWrapper","padding","margin","justifyContent","color","icon","onClick","noop","Row","ctx","DragTable","_otherProps$component","uidFieldKey","columns","dataSource","onDragChange","disabledDrag","otherProps","_useState","useState","dataList","setDataList","useEffect","onDragEnd","_ref","active","over","activeIndex","findIndex","i","overIndex","dataListNew","arrayMove","concat","activeId","columnsList","useMemo","dataIndex","align","width","sensors","useSensors","useSensor","PointerSensor","activationConstraint","delay","tolerance","value","DndContext","modifiers","restrictToVerticalAxis","SortableContext","items","strategy","verticalListSortingStrategy","Table","pagination","rowKey","bordered","components","body","row"],"mappings":"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"}
|
package/esm/easy-table/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.easy-table-table{border-radius:6px}.fba-easy-table-filter-fixed,.fba-easy-table-full,.fba-easy-table-pagination-fixed{display:flex;flex-direction:column;height:100%}.fba-easy-table-filter-fixed .easy-table-table,.fba-easy-table-full .easy-table-table,.fba-easy-table-pagination-fixed .easy-table-table{flex:1}.fba-easy-table-filter-fixed{overflow:hidden}.fba-easy-table-filter-fixed .easy-table-table{overflow-y:auto}.fba-easy-table-wrapper{display:flex;flex-direction:column;height:100%;overflow-x:hidden}.fba-easy-table-wrapper .fba-easy-table{flex:1;height:unset;overflow-y:auto}.fba-easy-table-pagination{background-color:var(--block-bg-color);box-shadow:0 0 17px rgba(0,0,0,.06);padding:15px 15px 20px;position:relative;text-align:right;z-index:2}.fba-easy-table-wrapper-inline .easy-table-table{margin:0;padding:0}.fba-easy-table-wrapper-inline .easy-table-filter{margin:0;padding:0 0 15px}.easy-table-table{padding:10px 15px}.easy-table-filter{border-radius:6px;margin-bottom:10px;padding:10px 15px}.ett-empty-show-small .ant-table-placeholder .ant-empty{align-items:center;display:flex;justify-content:center;margin:0}.ett-empty-show-small .ant-table-placeholder .ant-empty-image{height:25px;margin:0;width:50px}.
|
|
1
|
+
.easy-table-table{border-radius:6px}.fba-easy-table-filter-fixed,.fba-easy-table-full,.fba-easy-table-pagination-fixed{display:flex;flex-direction:column;height:100%}.fba-easy-table-filter-fixed .easy-table-table,.fba-easy-table-full .easy-table-table,.fba-easy-table-pagination-fixed .easy-table-table{flex:1}.fba-easy-table-filter-fixed{overflow:hidden}.fba-easy-table-filter-fixed .easy-table-table{overflow-y:auto}.fba-easy-table-wrapper{display:flex;flex-direction:column;height:100%;overflow-x:hidden}.fba-easy-table-wrapper .fba-easy-table{flex:1;height:unset;overflow-y:auto}.fba-easy-table-pagination{background-color:var(--block-bg-color);box-shadow:0 0 17px rgba(0,0,0,.06);padding:15px 15px 20px;position:relative;text-align:right;z-index:2}.fba-easy-table-wrapper-inline .easy-table-table{margin:0;padding:0}.fba-easy-table-wrapper-inline .easy-table-filter{margin:0;padding:0 0 15px}.easy-table-table{padding:10px 15px}.easy-table-filter{border-radius:6px;margin-bottom:10px;padding:10px 15px}.ett-empty-show-small .ant-table-placeholder .ant-empty{align-items:center;display:flex;justify-content:center;margin:0}.ett-empty-show-small .ant-table-placeholder .ant-empty-image{height:25px;margin:0;width:50px}.fold-operate-popiver.ant-popover .ant-popover-title{min-width:100px}
|
package/esm/easy-table/index.js
CHANGED
|
@@ -1,10 +1,15 @@
|
|
|
1
1
|
/* eslint-disable */
|
|
2
2
|
import './../fba-utils/index.css';
|
|
3
|
+
import './../fba-hooks/index.css';
|
|
4
|
+
import './../flex-layout/index.css';
|
|
5
|
+
import './../icon-wrapper/index.css';
|
|
3
6
|
import './../pagination-wrapper/index.css';
|
|
7
|
+
import './../svg-http-view/index.css';
|
|
8
|
+
import './../table-title-tooltip/index.css';
|
|
4
9
|
import './../tips-wrapper/index.css';
|
|
10
|
+
import './../block-layout/index.css';
|
|
5
11
|
import './../button-wrapper/index.css';
|
|
6
12
|
import './../config-provider-wrapper/index.css';
|
|
7
|
-
import './../fba-hooks/index.css';
|
|
8
13
|
import './../types/index.css';
|
|
9
14
|
import './../easy-form/index.css';
|
|
10
15
|
import './../box-grid/index.css';
|
|
@@ -12,8 +17,7 @@ import './../form-wrapper/index.css';
|
|
|
12
17
|
import './../pre-defined-class-name/index.css';
|
|
13
18
|
import './../form-grid/index.css';
|
|
14
19
|
import './../table-scrollbar/index.css';
|
|
15
|
-
import './../table-title-tooltip/index.css';
|
|
16
20
|
import './index.css';
|
|
17
21
|
/*! @flatjs/forge MIT @flatbiz/antd */
|
|
18
|
-
import{fbaUtils as e}from"../fba-utils/index.js";import{classNames as t}from"@dimjs/utils/cjs/class-names";import{isUndefined as r}from"@dimjs/lang/cjs/is-undefined";import{isArray as i}from"@dimjs/lang/cjs/is-array";import{get as n}from"@dimjs/utils/cjs/get";import{_ as a,a as o}from"../_rollupPluginBabelHelpers-a0769acd.js";import{hooks as l}from"@wove/react/cjs/hooks";import{cloneState as s}from"@dimjs/model";import{Form as u,message as c,Table as d}from"antd";import{createContext as f,forwardRef as p,useState as m,useMemo as g,useRef as v,useImperativeHandle as y,useContext as h,Children as C,Fragment as S}from"react";import{P as b,S as j}from"../index-6677fbfc.js";import{noop as F,isUndefinedOrNull as x,getUuid as q,isMacEnv as z}from"@flatbiz/utils";import{Model as w}from"@dimjs/model-react";import{jsx as R,jsxs as N}from"react/jsx-runtime";import P from"@ant-design/icons/es/icons/DownOutlined";import k from"@ant-design/icons/es/icons/UpOutlined";import{isFragment as T}from"react-is";import{B as D}from"../index-1f45bfd5.js";import{ButtonWrapper as A}from"../button-wrapper/index.js";import{EasyForm as K}from"../easy-form/index.js";import{u as E}from"../use-responsive-point-21b8c601.js";import{FormGrid as V}from"../form-grid/index.js";import{fbaHooks as B}from"../fba-hooks/index.js";import{TableScrollbar as I}from"../table-scrollbar/index.js";import{TableTitleTooltip as L}from"../table-title-tooltip/index.js";import{TipsWrapper as O}from"../tips-wrapper/index.js";import"@ant-design/icons/es/icons/LoadingOutlined";import"@dimjs/lang/cjs/is-promise";import"../index-7f4ad045.js";import"antd/es/locale/en_US";import"antd/es/locale/zh_CN";import"dayjs";import"dayjs/locale/en";import"dayjs/locale/zh-cn";import"dayjs/plugin/advancedFormat";import"dayjs/plugin/customParseFormat";import"dayjs/plugin/localeData";import"dayjs/plugin/utc";import"dayjs/plugin/weekday";import"dayjs/plugin/weekOfYear";import"dayjs/plugin/weekYear";import"@dimjs/utils/cjs/extend";import"../box-grid/index.js";import"@dimjs/lang/cjs/is-number";import"ahooks";import"../form-wrapper/index.js";import"../pre-defined-class-name/index.js";import"@ant-design/icons/es/icons/QuestionCircleOutlined";var W=f({onRequest:F,tableList:[],getEasyTableRef:function e(){}});var _={queryCondition:{},isInit:true};var H={actions:{updateFilterCondition:function e(t){return function(e){e.queryCondition=a({},e.queryCondition,t)}},resetFilterCondition:function e(t){return function(e){e.queryCondition=a({},_.queryCondition,t)}},updateInitStatus:function e(){return function(e){e.isInit=false}}},state:_};var U={};var Y=function e(t){if(!U[t]){U[t]=w(H)}return U[t]};var G=p((function(e,o){var d;var f=m(),p=f[0],h=f[1];var C=m(0),S=C[0],j=C[1];var F=m(false),x=F[0],q=F[1];var z=l.useId(undefined,"easy-table-key");var w=g((function(){if(e.cacheSwitch===true){return location.pathname}if(typeof e.cacheSwitch==="string"){return e.cacheSwitch}return z}),[z,e.cacheSwitch]);var P=Y(w).useStore(),k=P[0],T=P[1];var D=e.pageSize||((d=e.initialPaginationParams)==null?void 0:d.pageSize)||10;var A=e.initRequest===undefined?true:e.initRequest;var K=m(false),E=K[0],V=K[1];var B=v();var I=v([]);var L=m(),O=L[0],_=L[1];var H=a({list:"list",total:"total",pageNo:"pageNo",pageSize:"pageSize"},e.fieldNames);var U=u.useForm(e.form),G=U[0];var Q=l.useCallbackRef((function(t){return new Promise((function(r,a){var o,l,u,d,f,p,m,g,v,y,C,S;var b=function(){try{return r()}catch(e){return a(e)}};var F=function(t){try{q(false);if(e.onRequestErrorHandle){e.onRequestErrorHandle(t)}else{void c.error(t.message)}return b()}catch(e){return a(e)}};try{q(true);return Promise.resolve(T.updateFilterCondition(t)).then((function(t){try{o=t;l=s(o.queryCondition||{});u=e.serviceConfig,d=u.requestParamsAdapter,f=u.onRequest,p=u.requestResultAdapter,m=u.dynamicColumsAdapter;g=d?d(l):l;return Promise.resolve(f(g)).then((function(t){try{v=t||{};B.current=v;e.onDataSourceChange==null?void 0:e.onDataSourceChange(v);y=v;if(p){y=p(v)}if(m){C=m(v,I.current);_(C)}S=n(y,H.list);h(i(S)?S:[]);j(n(y,H.total));q(false);return b()}catch(e){return F(e)}}),F)}catch(e){return F(e)}}),F)}catch(e){F(e)}}))}));var $=l.useCallbackRef((function(e){return new Promise((function(t,r){return Promise.resolve(T.resetFilterCondition()).then((function(i){try{G.resetFields();if(e){void T.updateFilterCondition(e);G.setFieldsValue(e)}return t()}catch(e){return r(e)}}),r)}))}));var J=function e(t,r){if(E){var i;return i={},i[H.pageNo]=t,i[H.pageSize]=r||D,i}else{return{}}};var M=l.useCallbackRef((function(t){return new Promise((function(r,i){var n;n=a({},J(1,k.queryCondition[H.pageSize]),e.initialValues,t);return Promise.resolve(T.resetFilterCondition(n)).then((function(e){try{G.resetFields();if(t){G.setFieldsValue(t)}void Q(n);return r()}catch(e){return i(e)}}),i)}))}));var X=l.useCallbackRef((function(){return a({},k.queryCondition,G.getFieldsValue())}));var Z=function t(){return{onRequest:Q,clearQueryCondition:$,getRequestParams:X,onResetRequest:M,form:G,getDataSource:function e(){return B.current},onFilterDataSource:function e(t){h(t)},onClearDataSource:function e(){j(0);h([])},onUpdateDataSource:function t(r){h(r);B.current=r;e.onDataSourceChange==null?void 0:e.onDataSourceChange(r)}}};y(o,(function(){return Z()}));var ee=function e(t){V(t)};var te=function e(t){I.current=t};var re=function t(){var r=G.getFieldsValue();if(e.onFormFinish){e.onFormFinish(a({},r,J(1,k.queryCondition[H.pageSize])))}else{void Q(a({},r,J(1,k.queryCondition[H.pageSize])))}};var ie=r(e.isFull)?true:e.isFull;var ne=t("fba-easy-table",{"fba-easy-table-full":ie,"fba-easy-table-filter-fixed":e.filterFixed,"fba-easy-table-pagination-fixed":e.paginationFixed},e.className);var ae=g((function(){return a({showSizeChanger:true,current:k.queryCondition[H.pageNo]||1,pageSize:k.queryCondition[H.pageSize]||D,total:S,showTotal:function e(t){return"共 "+t+" 条记录"}},e.pagination)}),[H.pageNo,H.pageSize,D,e.pagination,k.queryCondition,S]);var oe=l.useCallbackRef((function(t,r){var i,n;void Q((i={},i[H.pageSize]=r,i[H.pageNo]=t,i));(n=e.pagination)==null||n.onChange==null?void 0:n.onChange(t,r)}));var le=t("fba-easy-table-wrapper",{"fba-easy-table-wrapper-inline":e.isInline},e.className);var se=a({overflowY:e.filterFixed||e.paginationFixed?"hidden":"auto"},e.style);var ue=typeof e.children==="function"?e.children(B.current):e.children;return R(W.Provider,{value:{onSetBaseColumns:te,getEasyTableRef:Z,modelKey:w,onRequest:Q,tableDataSource:p,tableTotal:S,loading:x,fieldNames:H,pageSize:D,initRequest:A,initialValues:e.initialValues||{},onSetPaginationStatus:ee,paginationStatus:E,onFormFinish:re,form:G,paginationFixed:e.paginationFixed||false,foldKeys:e.foldKeys||[],dynamicColumns:O},children:e.paginationFixed?N("div",{className:le,style:se,children:[R("div",{className:ne,children:ue}),S>0&&R("div",{className:"fba-easy-table-pagination",children:R(b,a({size:"small"},ae,{onChange:oe}))})]}):R("div",{className:le,style:e.style,children:ue})})}));var Q=function e(i){var n=E()||"md";var o=h(W);var s=i.queryButtonProps,u=i.resetButtonProps,c=i.filterOperate,d=i.formClassName,f=d===void 0?"":d,p=i.defaultResetButtonTriggerRequest,v=i.filterWrapperStyle,y=i.filterWrapperClassName,S=i.rightOperateAreaAppendType,b=i.easyFormProps;var j=o.modelKey,F=o.foldKeys,x=o.fieldNames,q=o.onRequest,z=o.pageSize,w=o.paginationStatus,B=o.initialValues,I=o.form,L=o.onFormFinish;var O=typeof i.children==="function"?i.children(I):i.children;var _=S||"cover";var H=g((function(){if(T(O)){return C.toArray(O.props.children)}else{return C.toArray(O)}}),[O]);var U=m(false),G=U[0],Q=U[1];var $=Y(j).useStore(),J=$[0],M=$[1];var X=l.useCallbackRef((function(){return new Promise((function(e,t){var i;return Promise.resolve(M.resetFilterCondition()).then((function(n){try{I.resetFields();if(r(p)||p){if(w){q(a((i={},i[x.pageNo]=1,i[x.pageSize]=z,i),B))}else{q(B)}}return e()}catch(e){return t(e)}}),t)}))}));var Z=g((function(){var e=[!(s!=null&&s.hidden)?R(A,a({type:"primary",htmlType:"submit"},s,{children:(s==null?void 0:s.text)||"查询"}),"1"):null,!(u!=null&&u.hidden)?R(A,a({onClick:X},u,{children:(u==null?void 0:u.text)||"重置"}),"2"):null].filter(Boolean);var t=c==null?void 0:c(I);var r=t==null?void 0:t.rightList;var i=(t==null?void 0:t.leftList)||[];var n=e;if(r){if(_==="afterAppend"){n=[].concat(e,r)}else if(_==="beforeAppend"){n=[].concat(r,e)}else{n=r}}if(F.length>0){var o=R(A,{type:"link",style:{padding:"0"},onClick:function e(){Q(!G)},children:G?N("span",{children:["收起",R(k,{style:{marginLeft:3,fontSize:12}})]}):N("span",{children:["展开",R(P,{style:{marginLeft:3,fontSize:12}})]})},"fold-trigger");if(n.length>0||i.length===0){n.push(o)}else if((i==null?void 0:i.length)>0){i.push(o)}}return H.map((function(e,t){if(!G&&F.find((function(t){return".$"+t===e.key})))return null;if(e.props["hidden"])return null;if(e.type["domTypeName"]==="FormCol")return e;return R(V.Col,{children:e},t)})).filter(Boolean).concat(R(V.OperateCol,a({},t,{leftList:i,rightList:n}),999))}),[H,c,F,I,X,G,s,u,_]);var ee=n==="xs"?"left":(b==null?void 0:b.labelAlign)||"right";return R(D,{className:t("easy-table-filter",y),style:v,children:R(K,a({form:I,autoComplete:"off",onFinish:L,initialValues:a({},B,J.queryCondition),className:f,style:i.formStyle,isPure:true,labelWidth:"80",formItemGap:"15"},b,{labelAlign:ee,children:i.isPure?O:R(V.Row,{gutter:[15,0],gridSize:i.formGridSize,children:Z})}))})};var $=function e(){var t=h(W);return t.getEasyTableRef()};var J=function e(){var t=h(W);return{current:t.getEasyTableRef()}};var M=["children","rowKey","pagination","isSync"],X=["tooltip","tipsWrapperProps","title"];var Z=function e(r){var i=h(W);var n=r.children,l=r.rowKey,s=r.pagination,u=r.isSync,c=o(r,M);var f=i.modelKey,p=i.fieldNames,m=i.onRequest,v=i.tableDataSource,y=i.initRequest,C=i.pageSize,b=i.tableTotal,F=i.loading,w=i.initialValues,P=i.paginationFixed,k=i.onSetPaginationStatus,T=i.dynamicColumns;var A=Y(f).useStore(),K=A[0],E=A[1];B.useEffectCustom((function(){i.onSetBaseColumns(r.columns||[])}),[r.columns]);var V=g((function(){if(P||s===false)return false;return a({showSizeChanger:true,current:K.queryCondition[p.pageNo]||1,pageSize:K.queryCondition[p.pageSize]||C,total:b,showTotal:function e(t){return"共 "+t+" 条记录"}},r.pagination,{selectComponentClass:j})}),[p.pageNo,p.pageSize,C,s,P,r.pagination,K.queryCondition,b]);var _=function e(t,i,n,a){if(a.action==="paginate"&&V){var o;m((o={},o[p.pageSize]=t.pageSize,o[p.pageNo]=t.current,o))}else{r.onChange==null?void 0:r.onChange(t,i,n,a)}};var H=g((function(){if(!v)return undefined;if(v.length===0){return[]}if(typeof l==="string"&&x(v[0][l])){return v.map((function(e){e[l]=q();return e}))}return v}),[v,l]);B.useEffectCustom((function(){var e=P||V!==false;k(e);if(y!==false||!K.isInit){if(e){var t;void m(a((t={},t[p.pageNo]=1,t[p.pageSize]=C,t),w,K.queryCondition))}else{void m(w)}}else{void E.updateFilterCondition(w)}void E.updateInitStatus()}),[]);var U=g((function(){var e=T?T:r.columns;return e.map((function(e){var t=e.tooltip,r=e.tipsWrapperProps,i=e.title,n=o(e,X);if(typeof i==="string"&&r){if(typeof r==="string"){return a({},n,{title:R(O,{tipType:"popover",popoverProps:{content:r},children:i})})}return a({},n,{title:R(O,a({},r,{children:i}))})}if(typeof i==="string"&&!!t){return a({},n,{title:R(L,{tooltip:t,title:i})})}return e}))}),[T,r.columns]);var G=function e(){if(u&&!H){return N(S,{children:[n,R(d,{size:"small",scroll:{x:"max-content"},bordered:true,columns:U,rowKey:l,loading:true},"1")]})}if(z()){return N(S,{children:[n,R(d,a({size:"small",scroll:{x:"max-content"},bordered:true},c,{columns:U,pagination:V,rowKey:l,onChange:_,loading:F,dataSource:H}),"2")]})}return N(S,{children:[n,R(I,{children:R(d,a({size:"small",scroll:{x:"max-content"},bordered:true},c,{columns:U,pagination:V,rowKey:l,onChange:_,loading:F,dataSource:H}),"3")})]})};return R(D,{className:t("easy-table-table",{"ett-empty-show-small":r.emptyShowSize==="small"},r.tableWrapperClassName),style:r.tableWrapperStyle,children:G()})};var ee=e.attachPropertiesToComponent(G,{Filter:Q,Table:Z,useEasyTablRef:J,useEasyTable:$});export{ee as EasyTable};
|
|
22
|
+
import{fbaUtils as e}from"../fba-utils/index.js";import{_ as n,a as i}from"../_rollupPluginBabelHelpers-a0769acd.js";import{classNames as t}from"@dimjs/utils/cjs/class-names";import{isUndefined as r}from"@dimjs/lang/cjs/is-undefined";import{get as a}from"@dimjs/utils/cjs/get";import{isString as o}from"@dimjs/lang/cjs/is-string";import{isArray as l}from"@dimjs/lang/cjs/is-array";import{hooks as s}from"@wove/react/cjs/hooks";import{cloneState as u}from"@dimjs/model";import{noop as d,localStorageCache as c,isUndefinedOrNull as f,getUuid as p,isMacEnv as m}from"@flatbiz/utils";import{Drawer as g,Table as v,Checkbox as h,Popover as y,Form as C,message as S}from"antd";import{createContext as x,useState as b,Fragment as F,forwardRef as j,useMemo as z,useRef as w,useImperativeHandle as R,cloneElement as q,useContext as N,Children as K}from"react";import{fbaHooks as P}from"../fba-hooks/index.js";import{FlexLayout as k}from"../flex-layout/index.js";import{IconWrapper as T}from"../icon-wrapper/index.js";import{P as I,S as _}from"../index-6677fbfc.js";import{SvgHttpView as L}from"../svg-http-view/index.js";import{TableTitleTooltip as D}from"../table-title-tooltip/index.js";import{TipsWrapper as E}from"../tips-wrapper/index.js";import{jsx as V,jsxs as A}from"react/jsx-runtime";import{Model as B}from"@dimjs/model-react";import O from"@ant-design/icons/es/icons/DownOutlined";import W from"@ant-design/icons/es/icons/UpOutlined";import{isFragment as U}from"react-is";import{BlockLayout as G}from"../block-layout/index.js";import{ButtonWrapper as H}from"../button-wrapper/index.js";import{EasyForm as Y}from"../easy-form/index.js";import{u as Q}from"../use-responsive-point-21b8c601.js";import{FormGrid as $}from"../form-grid/index.js";import{TableScrollbar as J}from"../table-scrollbar/index.js";import"@ant-design/icons/es/icons/QuestionCircleOutlined";import"@ant-design/icons/es/icons/LoadingOutlined";import"@dimjs/lang/cjs/is-promise";import"../index-7f4ad045.js";import"antd/es/locale/en_US";import"antd/es/locale/zh_CN";import"dayjs";import"dayjs/locale/en";import"dayjs/locale/zh-cn";import"dayjs/plugin/advancedFormat";import"dayjs/plugin/customParseFormat";import"dayjs/plugin/localeData";import"dayjs/plugin/utc";import"dayjs/plugin/weekday";import"dayjs/plugin/weekOfYear";import"dayjs/plugin/weekYear";import"@dimjs/utils/cjs/extend";import"../box-grid/index.js";import"@dimjs/lang/cjs/is-number";import"ahooks";import"../form-wrapper/index.js";import"../pre-defined-class-name/index.js";var M=x({onRequest:d,tableList:[],getEasyTableRef:function e(){}});var X=function e(n){var i=b(n.initSelectedRowKeys||[]),t=i[0],r=i[1];var a={type:"checkbox",selectedRowKeys:t,onChange:function e(i){r(i);n.onChange(i);if(n.cacheKey){c.set("easy_tab_"+n.cacheKey,{keys:i})}}};var o=[{title:"字段名称",dataIndex:"title",render:function e(n,i){return i["_isFoldTitle"]||n}},{title:"字段Key",dataIndex:"dataIndex"}];return V(F,{children:V(g,{title:"选择字段",open:n.open,onClose:n.onClose,width:"35%",styles:{body:{padding:15}},children:V(v,{bordered:true,size:"small",columns:o,rowSelection:a,rowKey:"dataIndex",pagination:false,scroll:{x:"max-content"},dataSource:n.dataList})})})};var Z=function e(n){var i=b(n.initSelectedRowKeys||[]),t=i[0],r=i[1];var a=function e(i){r(i);n.onChange(i);if(n.cacheKey){c.set("easy_tab_"+n.cacheKey,{keys:i})}};var o=V(F,{children:V(h.Group,{defaultValue:t,onChange:a,value:t,style:{display:"flex",flexDirection:"column"},children:n.dataList.map((function(e){var n=e["_isFoldTitle"]||e.title;return V(h,{value:e.dataIndex,style:{padding:"0 0 5px 0"},children:n},e.dataIndex)}))})});var l=function e(i){if(i.target.checked){a(n.dataList.map((function(e){return e.dataIndex})))}else{a([])}};return V(y,{content:o,title:V(h,{checked:t.length===n.dataList.length,onChange:l,children:"全选(字段列表)"}),placement:"bottomRight",overlayClassName:"fold-operate-popiver",children:n.children})};var ee={queryCondition:{},isInit:true};var ne={actions:{updateFilterCondition:function e(i){return function(e){e.queryCondition=n({},e.queryCondition,i)}},resetFilterCondition:function e(i){return function(e){e.queryCondition=n({},ee.queryCondition,i)}},updateInitStatus:function e(){return function(e){e.isInit=false}}},state:ee};var ie={};var te=function e(n){if(!ie[n]){ie[n]=B(ne)}return ie[n]};var re=["tooltip","tipsWrapperProps","title","hidden","isFold"];var ae=j((function(e,d){var f;var p=b(),m=p[0],g=p[1];var v=b(0),h=v[0],y=v[1];var x=b(false),F=x[0],j=x[1];var N=s.useId(undefined,"easy-table-key");var K=e.columnFoldConfig;var _=b(false),B=_[0],O=_[1];var W=b((function(){if(K!=null&&K.cacheKey){var e;var n=c.get("easy_tab_"+K.cacheKey);var i=l(n==null?void 0:n.keys)?n==null||(e=n.keys)==null?void 0:e.filter((function(e){return o(e)})):[];return i.length>0?i:(K==null?void 0:K.initSelectedKeys)||[]}else{return(K==null?void 0:K.initSelectedKeys)||[]}})),U=W[0],G=W[1];var H=z((function(){if(e.cacheSwitch===true){return location.pathname}if(typeof e.cacheSwitch==="string"){return e.cacheSwitch}return N}),[N,e.cacheSwitch]);var Y=te(H).useStore(),Q=Y[0],$=Y[1];var J=e.pageSize||((f=e.initialPaginationParams)==null?void 0:f.pageSize)||10;var ee=e.initRequest===undefined?true:e.initRequest;var ne=w(false);var ie=w();var ae=w([]);var oe=b(),le=oe[0],se=oe[1];var ue=n({list:"list",total:"total",pageNo:"pageNo",pageSize:"pageSize"},e.fieldNames);var de=C.useForm(e.form),ce=de[0];var fe=s.useCallbackRef((function(n){return new Promise((function(i,t){var r,o,s,d,c,f,p,m,v,h,C,x;var b=function(){try{return i()}catch(e){return t(e)}};var F=function(n){try{j(false);if(e.onRequestErrorHandle){e.onRequestErrorHandle(n)}else{void S.error(n.message)}return b()}catch(e){return t(e)}};try{j(true);return Promise.resolve($.updateFilterCondition(n)).then((function(n){try{r=n;o=u(r.queryCondition||{});s=e.serviceConfig,d=s.requestParamsAdapter,c=s.onRequest,f=s.requestResultAdapter,p=s.dynamicColumsAdapter;m=d?d(o):o;return Promise.resolve(c(m)).then((function(n){try{v=n||{};ie.current=v;e.onDataSourceChange==null?void 0:e.onDataSourceChange(v);h=v;if(f){h=f(v)}if(p){C=p(v,ae.current);se(C)}x=a(h,ue.list);g(l(x)?x:[]);y(a(h,ue.total));j(false);return b()}catch(e){return F(e)}}),F)}catch(e){return F(e)}}),F)}catch(e){F(e)}}))}));P.useEffectCustom((function(){var i=Pe();if(ee!==false||!Q.isInit){if(i){var t;void fe(n((t={},t[ue.pageNo]=1,t[ue.pageSize]=J,t),e.initialValues,Q.queryCondition))}else{void fe(e.initialValues)}}else{void $.updateFilterCondition(e.initialValues)}void $.updateInitStatus()}),[]);var pe=s.useCallbackRef((function(e){return new Promise((function(n,i){return Promise.resolve($.resetFilterCondition()).then((function(t){try{ce.resetFields();if(e){void $.updateFilterCondition(e);ce.setFieldsValue(e)}return n()}catch(e){return i(e)}}),i)}))}));var me=function e(n,i){if(Pe()){var t;return t={},t[ue.pageNo]=n,t[ue.pageSize]=i||J,t}else{var r;return r={},r[ue.pageNo]=undefined,r[ue.pageSize]=undefined,r}};var ge=s.useCallbackRef((function(i){return new Promise((function(t,r){var a;a=n({},me(1,Q.queryCondition[ue.pageSize]),e.initialValues,i);return Promise.resolve($.resetFilterCondition(a)).then((function(e){try{ce.resetFields();if(i){ce.setFieldsValue(i)}void fe(a);return t()}catch(e){return r(e)}}),r)}))}));var ve=s.useCallbackRef((function(){return n({},Q.queryCondition,ce.getFieldsValue())}));var he=s.useCallbackRef((function(){O(true)}));var ye=s.useCallbackRef((function(){O(false)}));var Ce=function n(){return{onRequest:fe,clearQueryCondition:pe,getRequestParams:ve,onResetRequest:ge,form:ce,getDataSource:function e(){return ie.current},onFilterDataSource:function e(n){g(n)},onClearDataSource:function e(){y(0);g([])},onUpdateDataSource:function n(i){g(i);ie.current=i;e.onDataSourceChange==null?void 0:e.onDataSourceChange(i)},columnFoldTriggerRender:function n(i){var t;if(((t=e.columnFoldConfig)==null?void 0:t.triggerType)==="drawer"){return q(i,{onClick:he})}return V(Z,{dataList:qe,onChange:Ne,cacheKey:K==null?void 0:K.cacheKey,initSelectedRowKeys:U,children:i})},loading:F}};R(d,(function(){return Ce()}));var Se=function e(n){ne.current=n};var xe=function e(n){ae.current=n};var be=function i(){var t=ce.getFieldsValue();if(e.onFormFinish){e.onFormFinish(n({},t,me(1,Q.queryCondition[ue.pageSize])))}else{void fe(n({},t,me(1,Q.queryCondition[ue.pageSize])))}};var Fe=r(e.isFull)?true:e.isFull;var je=t("fba-easy-table",{"fba-easy-table-full":Fe,"fba-easy-table-filter-fixed":e.filterFixed,"fba-easy-table-pagination-fixed":e.paginationFixed},e.className);var ze=z((function(){return n({showSizeChanger:true,current:Q.queryCondition[ue.pageNo]||1,pageSize:Q.queryCondition[ue.pageSize]||J,total:h,showTotal:function e(n){return"共 "+n+" 条记录"}},e.pagination)}),[ue.pageNo,ue.pageSize,J,e.pagination,Q.queryCondition,h]);var we=le?le:ae.current;var Re=z((function(){var e=we.map((function(e){var t=e.tooltip,r=e.tipsWrapperProps,a=e.title,o=e.hidden,l=e.isFold,s=i(e,re);if(o)return null;if(l&&!U.includes(e.dataIndex))return null;if(typeof a==="string"&&r){if(typeof r==="string"){return n({},s,{title:V(E,{tipType:"popover",popoverProps:{content:r},children:a})})}return n({},s,{title:V(E,n({},r,{children:a}))})}if(typeof a==="string"&&!!t){return n({},s,{title:V(D,{tooltip:t,title:a})})}return e})).filter(Boolean);return[].concat(e)}),[we,U]);var qe=we.filter((function(e){return!e.hidden&&e.isFold&&e.dataIndex}));var Ne=function e(n){G(n);K==null||K.onChange==null?void 0:K.onChange(n)};Re=z((function(){if(K!=null&&K.hidden)return Re;var e=Re[Re.length-1];if(qe.length>0&&Re.length>0){var n=Re.find((function(e){return e["_isFoldColumn"]}));if(n&&e.dataIndex!==n.dataIndex){n.title=n["_isFoldTitle"];n["_isFoldColumn"]=false}if(!e["_isFoldColumn"]){e["_isFoldTitle"]=e["_isFoldTitle"]||e.title;e["_isFoldColumn"]=true;var i=K==null?void 0:K.triggerType;e.title=A(k,{direction:"horizontal",fullIndex:0,style:{alignItems:"center"},children:[V("span",{children:e.title}),V("div",{style:{padding:"0 5px 0 20px",display:"flex"},children:i==="drawer"?V(T,{onClick:he,text:K==null?void 0:K.text,size:"small",icon:(K==null?void 0:K.icon)||V(L,{svgPath:"ionic/list-circle",color:"#868686"}),hoverTips:(K==null?void 0:K.hoverTipText)||"字段列表",style:{padding:0,margin:0}}):V(Z,{dataList:qe,onChange:Ne,cacheKey:K==null?void 0:K.cacheKey,initSelectedRowKeys:U,children:V(T,{text:K==null?void 0:K.text,style:{padding:0,margin:0},size:"small",icon:(K==null?void 0:K.icon)||V(L,{svgPath:"ionic/list-circle",color:"#868686"})})})})]})}}return Re}),[Re,qe,K]);var Ke=s.useCallbackRef((function(n,i){var t,r;void fe((t={},t[ue.pageSize]=i,t[ue.pageNo]=n,t));(r=e.pagination)==null||r.onChange==null?void 0:r.onChange(n,i)}));var Pe=function n(){return e.paginationFixed||ne.current};s.useUpdateEffect((function(){if(e.paginationFixed){var n;fe((n={},n[ue.pageSize]=Q.queryCondition[ue.pageSize]||J,n[ue.pageNo]=1,n))}else{var i;fe((i={},i[ue.pageSize]=undefined,i[ue.pageNo]=undefined,i))}}),[e.paginationFixed]);var ke=t("fba-easy-table-wrapper",{"fba-easy-table-wrapper-inline":e.isInline},e.className);var Te=n({overflowY:e.filterFixed||e.paginationFixed?"hidden":"auto"},e.style);var Ie=typeof e.children==="function"?e.children(ie.current):e.children;return A(M.Provider,{value:{onSetBaseColumns:xe,getEasyTableRef:Ce,modelKey:H,onRequest:fe,tableDataSource:m,tableTotal:h,loading:F,fieldNames:ue,pageSize:J,onSetPaginationStatus:Se,getPaginationStatus:Pe,onFormFinish:be,form:ce,paginationFixed:e.paginationFixed||false,foldKeys:e.foldKeys||[],columns:Re,initialValues:e.initialValues},children:[e.paginationFixed?A("div",{className:ke,style:Te,children:[V("div",{className:je,children:Ie}),h>0&&V("div",{className:"fba-easy-table-pagination",children:V(I,n({size:"small"},ze,{onChange:Ke}))})]}):V("div",{className:ke,style:e.style,children:Ie}),V(X,{dataList:qe,onClose:ye,open:B,onChange:Ne,cacheKey:K==null?void 0:K.cacheKey,initSelectedRowKeys:U})]})}));var oe=function e(i){var a=Q()||"md";var o=N(M);var l=i.queryButtonProps,u=i.resetButtonProps,d=i.filterOperate,c=i.formClassName,f=c===void 0?"":c,p=i.defaultResetButtonTriggerRequest,m=i.filterWrapperStyle,g=i.filterWrapperClassName,v=i.rightOperateAreaAppendType,h=i.easyFormProps;var y=o.modelKey,C=o.foldKeys,S=o.fieldNames,x=o.onRequest,F=o.pageSize,j=o.getPaginationStatus,w=o.initialValues,R=o.form,q=o.onFormFinish;var P=typeof i.children==="function"?i.children(R):i.children;var k=v||"cover";var T=z((function(){if(U(P)){return K.toArray(P.props.children)}else{return K.toArray(P)}}),[P]);var I=b(false),_=I[0],L=I[1];var D=te(y).useStore(),E=D[0],B=D[1];var J=s.useCallbackRef((function(){return new Promise((function(e,i){var t;return Promise.resolve(B.resetFilterCondition()).then((function(a){try{R.resetFields();if(r(p)||p){if(j()){x(n((t={},t[S.pageNo]=1,t[S.pageSize]=F,t),w))}else{x(w)}}return e()}catch(e){return i(e)}}),i)}))}));var X=z((function(){var e=[!(l!=null&&l.hidden)?V(H,n({type:"primary",htmlType:"submit"},l,{children:(l==null?void 0:l.text)||"查询"}),"1"):null,!(u!=null&&u.hidden)?V(H,n({onClick:J},u,{children:(u==null?void 0:u.text)||"重置"}),"2"):null].filter(Boolean);var i=d==null?void 0:d(R);var t=i==null?void 0:i.rightList;var r=(i==null?void 0:i.leftList)||[];var a=e;if(t){if(k==="afterAppend"){a=[].concat(e,t)}else if(k==="beforeAppend"){a=[].concat(t,e)}else{a=t}}if(C.length>0){var o=V(H,{type:"link",style:{padding:"0"},onClick:function e(){L(!_)},children:_?A("span",{children:["收起",V(W,{style:{marginLeft:3,fontSize:12}})]}):A("span",{children:["展开",V(O,{style:{marginLeft:3,fontSize:12}})]})},"fold-trigger");if(a.length>0||r.length===0){a.push(o)}else if((r==null?void 0:r.length)>0){r.push(o)}}return T.map((function(e,n){if(!_&&C.find((function(n){return".$"+n===e.key})))return null;if(e.props["hidden"])return null;if(e.type["domTypeName"]==="FormCol")return e;return V($.Col,{children:e},n)})).filter(Boolean).concat(V($.OperateCol,n({},i,{leftList:r,rightList:a}),999))}),[T,d,C,R,J,_,l,u,k]);var Z=a==="xs"?"left":(h==null?void 0:h.labelAlign)||"right";return V(G,{className:t("easy-table-filter",g),style:m,children:V(Y,n({form:R,autoComplete:"off",onFinish:q,initialValues:n({},w,E.queryCondition),className:f,style:i.formStyle,isPure:true,labelWidth:"80",formItemGap:"15"},h,{labelAlign:Z,children:i.isPure?P:V($.Row,{gutter:[15,0],gridSize:i.formGridSize,children:X})}))})};var le=function e(){var n=N(M);return n.getEasyTableRef()};var se=function e(){var n=N(M);return{current:n.getEasyTableRef()}};var ue=["children","rowKey","pagination","isSync"];var de=function e(r){var a=N(M);var o=r.children,l=r.rowKey,u=r.pagination,d=r.isSync,c=i(r,ue);var g=a.modelKey,h=a.fieldNames,y=a.onRequest,C=a.tableDataSource,S=a.pageSize,x=a.tableTotal,b=a.loading,j=a.paginationFixed,w=a.onSetPaginationStatus;var R=te(g).useStore(),q=R[0];P.useEffectCustom((function(){a.onSetBaseColumns(r.columns||[])}),[r.columns]);P.useEffectCustom((function(){w(u!==false)}),[u]);s.useUpdateEffect((function(){if(!j){if(u!==false){var e;y((e={},e[h.pageSize]=q.queryCondition[h.pageSize]||S,e[h.pageNo]=1,e))}else{var n;y((n={},n[h.pageSize]=undefined,n[h.pageNo]=undefined,n))}}}),[u]);var K=z((function(){if(j||u===false)return false;return n({showSizeChanger:true,current:q.queryCondition[h.pageNo]||1,pageSize:q.queryCondition[h.pageSize]||S,total:x,showTotal:function e(n){return"共 "+n+" 条记录"}},r.pagination,{selectComponentClass:_})}),[h.pageNo,h.pageSize,S,u,j,r.pagination,q.queryCondition,x]);var k=function e(n,i,t,a){if(a.action==="paginate"&&K){var o;y((o={},o[h.pageSize]=n.pageSize,o[h.pageNo]=n.current,o))}else{r.onChange==null?void 0:r.onChange(n,i,t,a)}};var T=z((function(){if(!C)return undefined;if(C.length===0){return[]}if(typeof l==="string"&&f(C[0][l])){return C.map((function(e){e[l]=p();return e}))}return C}),[C,l]);var I=function e(){if(d&&!T){return A(F,{children:[o,V(v,{size:"small",scroll:{x:"max-content"},bordered:true,rowKey:l,columns:a.columns,loading:true},"1")]})}if(m()){return A(F,{children:[o,V(v,n({size:"small",scroll:{x:"max-content"},bordered:true},c,{columns:a.columns,pagination:K,rowKey:l,onChange:k,loading:b,dataSource:T}),"2")]})}return A(F,{children:[o,V(J,{children:V(v,n({size:"small",scroll:{x:"max-content"},bordered:true},c,{columns:a.columns,pagination:K,rowKey:l,onChange:k,loading:b,dataSource:T}),"3")})]})};return V(G,{className:t("easy-table-table",{"ett-empty-show-small":r.emptyShowSize==="small"},r.tableWrapperClassName),style:r.tableWrapperStyle,children:I()})};var ce=e.attachPropertiesToComponent(ae,{Filter:oe,Table:de,useEasyTablRef:se,useEasyTable:le});export{ce as EasyTable};
|
|
19
23
|
//# sourceMappingURL=index.js.map
|