Skip to content

Commit

Permalink
Updates
Browse files Browse the repository at this point in the history
  • Loading branch information
Krinopotam committed Aug 16, 2024
1 parent f1da0d9 commit 8e950ae
Show file tree
Hide file tree
Showing 212 changed files with 2,113 additions and 2,081 deletions.

Large diffs are not rendered by default.

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import{r as s,j as t,D as d}from"./index-zp8t8nBI.js";import{P as p,C as c,h as u,d as f,a as F}from"./docco-qM7CaTt5.js";import{B as h}from"./dForm-CtyM7E66.js";import{D as b}from"./dFormModal-DQXWVkWJ.js";import{T as g}from"./tabulatorGridField-CzLBKUCX.js";import{I as r}from"./inputField-OIQHvMdf.js";import{F as m}from"./buttonsProps-B8gkb09z.js";import{b as D,G as a}from"./tabulatorData-BJ5jlgxT.js";import"./tabulatorGrid-LGmx6kUr.js";import"./EyeOutlined-B9jVFvSG.js";import"./DeleteOutlined-oAPYnq6c.js";import"./index-ClIb7A4b.js";import"./SearchOutlined-D8OXrZa4.js";const C=[{title:"Column 1",field:"col1"},{title:"Column 2",field:"col2"},{title:"Column 3",field:"col3"}],e={},l={},k={apiRef:l,formId:"formWithGrid",fieldsProps:{col1:{component:r,label:"Column 1"},col2:{component:r,label:"Column 2"},col3:{component:r,label:"Column 3"}},confirmChanges:!0,buttons:m(l)},n={},S={formId:"Test form",apiRef:e,confirmChanges:!0,fieldsProps:{grid:{component:g,apiRef:n,label:"Пользователи",columnDefaults:D,columns:C,layout:"fitColumns",height:300,editFormProps:k,confirmDelete:!0}},width:900,buttons:{...m(e),updateDataSet:{type:"button",title:"Update DataSet",position:"center",onClick:()=>{e.model.getField("grid").setValue(a(1e3,"Set field Value "))}},asyncUpdateDataSet:{type:"button",title:"Async update DataSet",position:"center",onClick:()=>{n.fetchData(()=>new Promise((o,i)=>{setTimeout(()=>{Math.random()<.1?i({message:"Ошибка загрузки данных",code:400}):o({data:a(1e3,"async ")})},1e3)}))}},clearDataSet:{type:"button",title:"Clear DataSet",position:"center",onClick:()=>{e.model.getField("grid").setValue([])}}}},y=()=>{const o=s.useCallback(()=>{e.open("update",{grid:a(1e3,"Initial ")})},[]);return t.jsxs(t.Fragment,{children:[t.jsx("h1",{children:"Example of a modal form with a TabulatorGrid field"}),t.jsxs("div",{style:{maxWidth:500},children:[t.jsx(h,{onClick:o,children:"Open form"}),t.jsx(b,{...S})]})]})},V=o=>t.jsxs(p,{children:[t.jsx("div",{children:t.jsx(y,{})}),t.jsx(d,{}),t.jsx("div",{children:t.jsx(c,{items:[{key:1,label:"Show source",children:t.jsx(u,{language:"javascript",style:o.darkMode?f:F,showLineNumbers:!0,children:`
import{r as s,j as t,D as d}from"./index-jRq8dFl9.js";import{P as p,C as c,h as u,d as f,a as F}from"./docco-DVswO1UK.js";import{B as h}from"./messageBox-A1wgNO27.js";import{D as b}from"./dFormModal-DuFw94ex.js";import{T as g}from"./tabulatorGridField-BMuYQ7dM.js";import{I as r}from"./inputField-DjpktlwZ.js";import{F as m}from"./buttonsProps-C8-j13mC.js";import{b as D,G as a}from"./tabulatorData-D9ENxapK.js";import"./dForm-CmpnCynY.js";import"./index-h_fYsjXx.js";import"./modal-Bq0KGAYX.js";import"./tabulatorGrid-Dp7y1jLu.js";import"./EyeOutlined-B_mcHe4i.js";import"./DeleteOutlined-KSC0BHZd.js";import"./index-CBQ57er9.js";import"./SearchOutlined-y0oc_54U.js";const C=[{title:"Column 1",field:"col1"},{title:"Column 2",field:"col2"},{title:"Column 3",field:"col3"}],e={},l={},k={apiRef:l,formId:"formWithGrid",fieldsProps:{col1:{component:r,label:"Column 1"},col2:{component:r,label:"Column 2"},col3:{component:r,label:"Column 3"}},confirmChanges:!0,buttons:m(l)},n={},S={formId:"Test form",apiRef:e,confirmChanges:!0,fieldsProps:{grid:{component:g,apiRef:n,label:"Пользователи",columnDefaults:D,columns:C,layout:"fitColumns",height:300,editFormProps:k,confirmDelete:!0}},width:900,buttons:{...m(e),updateDataSet:{type:"button",title:"Update DataSet",position:"center",onClick:()=>{e.model.getField("grid").setValue(a(1e3,"Set field Value "))}},asyncUpdateDataSet:{type:"button",title:"Async update DataSet",position:"center",onClick:()=>{n.fetchData(()=>new Promise((o,i)=>{setTimeout(()=>{Math.random()<.1?i({message:"Ошибка загрузки данных",code:400}):o({data:a(1e3,"async ")})},1e3)}))}},clearDataSet:{type:"button",title:"Clear DataSet",position:"center",onClick:()=>{e.model.getField("grid").setValue([])}}}},y=()=>{const o=s.useCallback(()=>{e.open("update",{grid:a(1e3,"Initial ")})},[]);return t.jsxs(t.Fragment,{children:[t.jsx("h1",{children:"Example of a modal form with a TabulatorGrid field"}),t.jsxs("div",{style:{maxWidth:500},children:[t.jsx(h,{onClick:o,children:"Open form"}),t.jsx(b,{...S})]})]})},U=o=>t.jsxs(p,{children:[t.jsx("div",{children:t.jsx(y,{})}),t.jsx(d,{}),t.jsx("div",{children:t.jsx(c,{items:[{key:1,label:"Show source",children:t.jsx(u,{language:"javascript",style:o.darkMode?f:F,showLineNumbers:!0,children:`
import React, {useCallback} from 'react';
import {Button} from @krinopotam/ui-kit/button';
import {DFormModal, IDFormModalApi, IDFormModalProps} from @krinopotam/ui-kit/dFormModal';
Expand Down Expand Up @@ -99,4 +99,4 @@ export const FormWithGridChangeDataSet = (): React.JSX.Element => {
</>
);
};
`})}]})})]});export{V as Pagee46220cb4aee478d8da5e3d12ea20a4d,V as default};
`})}]})})]});export{U as Page001a2f67e02c464dacb26181b43c4cdc,U as default};
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import{j as t,D as l}from"./index-zp8t8nBI.js";import{P as r,C as o,h as n,d as s,a as m}from"./docco-qM7CaTt5.js";import{D as c}from"./dForm-CtyM7E66.js";import{I as a}from"./inputField-OIQHvMdf.js";import{T as h}from"./treeSelectField-D84nWKgY.js";import"./index-ClIb7A4b.js";import"./EyeOutlined-B9jVFvSG.js";import"./SearchOutlined-D8OXrZa4.js";import"./dFormModal-DQXWVkWJ.js";import"./useShowArrow-Dt3J_uW-.js";import"./DeleteOutlined-oAPYnq6c.js";import"./useIcons-DXo1KyCf.js";const p=[{id:"01",title:"Департамент аналитики данных",children:[{id:"01-01",title:"Управление аналитики продаж",children:[{id:"01-01-01",title:"Отдел продаж север"},{id:"01-01-02",title:"Отдел продаж юг"},{id:"01-01-03",title:"Отдел продаж запад"}]},{id:"01-02",title:"Управление аналитики закупок",children:[{id:"01-02-01",title:"Отдел закупок север"},{id:"01-02-02",title:"Отдел закупок юг"},{id:"01-02-03",title:"Отдел закупок запад"}]},{id:"01-03",title:"Управление аналитики производства",children:[{id:"01-03-01",title:"Отдел производства север"},{id:"01-03-02",title:"Отдел производства юг"},{id:"01-03-03",title:"Отдел производства запад"}]}]},{id:"02",title:"Департамент инженерных работ",children:[{id:"02-01",title:"Управление строительства",children:[{id:"02-01-01",title:"Отдел строительства север"},{id:"02-01-02",title:"Отдел строительства юг"},{id:"02-01-03",title:"Отдел строительства запад"}]},{id:"02-02",title:"Управление демонтажа",children:[{id:"02-02-01",title:"Отдел демонтажа север"},{id:"02-02-02",title:"Отдел демонтажа юг"},{id:"02-02-03",title:"Отдел демонтажа запад"}]},{id:"02-03",title:"Управление реконструкции",children:[{id:"02-03-01",title:"Отдел реконструкции север"},{id:"02-03-02",title:"Отдел реконструкции юг"},{id:"02-03-03",title:"Отдел реконструкции запад"}]}]},{id:"03",title:"Департамент проектных работ",children:[{id:"03-01",title:"Управление проектирования",children:[{id:"03-01-01",title:"Отдел проектирования север"},{id:"03-01-02",title:"Отдел проектирования юг"},{id:"03-01-03",title:"Отдел проектирования запад"}]},{id:"03-02",title:"Управление согласования",children:[{id:"03-02-01",title:"Отдел согласования север"},{id:"03-02-02",title:"Отдел согласования юг"},{id:"03-02-03",title:"Отдел согласования запад"}]},{id:"03-03",title:"Управление анализа проектов",children:[{id:"03-03-01",title:"Отдел анализа север"},{id:"03-03-02",title:"Отдел анализа юг"},{id:"03-03-03",title:"Отдел анализа запад"}]}]}],u={formId:"EditForm",confirmChanges:!0,bodyHeight:100,fieldsProps:{title:{component:a,label:"Подразделение"}},onSubmit:e=>new Promise((i,d)=>{setTimeout(()=>{Math.random()<.3?d({message:"Ошибка сохранения",code:400}):i({data:e})},3e3)})},f={formId:"Test form",confirmChanges:!0,fieldsProps:{department:{component:h,label:"Подразделения",confirmDelete:!0,dataSet:p,editFormProps:u,onDelete:()=>new Promise((e,i)=>{setTimeout(()=>{Math.random()<.3?i({message:"Ошибка удаления строк",code:400}):e({data:{result:"OK"}})},2e3)})}},buttons:null},F=()=>t.jsxs(t.Fragment,{children:[t.jsx("h1",{children:"Пример TreeSelect с асинхронной формой редактирования"}),t.jsx("p",{children:"Для данного примера операция завершится ошибкой с вероятностью 30%"}),t.jsx("div",{style:{maxWidth:500},children:t.jsx(c,{...f})})]}),M=e=>t.jsxs(r,{children:[t.jsx("div",{children:t.jsx(F,{})}),t.jsx(l,{}),t.jsx("div",{children:t.jsx(o,{items:[{key:1,label:"Show source",children:t.jsx(n,{language:"javascript",style:e.darkMode?s:m,showLineNumbers:!0,children:`
import{j as t,D as r}from"./index-jRq8dFl9.js";import{P as l,C as o,h as n,d as s,a as m}from"./docco-DVswO1UK.js";import{D as c}from"./dForm-CmpnCynY.js";import"./messageBox-A1wgNO27.js";import{I as a}from"./inputField-DjpktlwZ.js";import{T as h}from"./treeSelectField-BB9lFwXw.js";import"./index-h_fYsjXx.js";import"./index-CBQ57er9.js";import"./EyeOutlined-B_mcHe4i.js";import"./SearchOutlined-y0oc_54U.js";import"./dFormModal-DuFw94ex.js";import"./modal-Bq0KGAYX.js";import"./useShowArrow-CrKdZmFJ.js";import"./DeleteOutlined-KSC0BHZd.js";import"./useIcons-BKWTrDFZ.js";const p=[{id:"01",title:"Департамент аналитики данных",children:[{id:"01-01",title:"Управление аналитики продаж",children:[{id:"01-01-01",title:"Отдел продаж север"},{id:"01-01-02",title:"Отдел продаж юг"},{id:"01-01-03",title:"Отдел продаж запад"}]},{id:"01-02",title:"Управление аналитики закупок",children:[{id:"01-02-01",title:"Отдел закупок север"},{id:"01-02-02",title:"Отдел закупок юг"},{id:"01-02-03",title:"Отдел закупок запад"}]},{id:"01-03",title:"Управление аналитики производства",children:[{id:"01-03-01",title:"Отдел производства север"},{id:"01-03-02",title:"Отдел производства юг"},{id:"01-03-03",title:"Отдел производства запад"}]}]},{id:"02",title:"Департамент инженерных работ",children:[{id:"02-01",title:"Управление строительства",children:[{id:"02-01-01",title:"Отдел строительства север"},{id:"02-01-02",title:"Отдел строительства юг"},{id:"02-01-03",title:"Отдел строительства запад"}]},{id:"02-02",title:"Управление демонтажа",children:[{id:"02-02-01",title:"Отдел демонтажа север"},{id:"02-02-02",title:"Отдел демонтажа юг"},{id:"02-02-03",title:"Отдел демонтажа запад"}]},{id:"02-03",title:"Управление реконструкции",children:[{id:"02-03-01",title:"Отдел реконструкции север"},{id:"02-03-02",title:"Отдел реконструкции юг"},{id:"02-03-03",title:"Отдел реконструкции запад"}]}]},{id:"03",title:"Департамент проектных работ",children:[{id:"03-01",title:"Управление проектирования",children:[{id:"03-01-01",title:"Отдел проектирования север"},{id:"03-01-02",title:"Отдел проектирования юг"},{id:"03-01-03",title:"Отдел проектирования запад"}]},{id:"03-02",title:"Управление согласования",children:[{id:"03-02-01",title:"Отдел согласования север"},{id:"03-02-02",title:"Отдел согласования юг"},{id:"03-02-03",title:"Отдел согласования запад"}]},{id:"03-03",title:"Управление анализа проектов",children:[{id:"03-03-01",title:"Отдел анализа север"},{id:"03-03-02",title:"Отдел анализа юг"},{id:"03-03-03",title:"Отдел анализа запад"}]}]}],u={formId:"EditForm",confirmChanges:!0,bodyHeight:100,fieldsProps:{title:{component:a,label:"Подразделение"}},onSubmit:e=>new Promise((i,d)=>{setTimeout(()=>{Math.random()<.3?d({message:"Ошибка сохранения",code:400}):i({data:e})},3e3)})},f={formId:"Test form",confirmChanges:!0,fieldsProps:{department:{component:h,label:"Подразделения",confirmDelete:!0,dataSet:p,editFormProps:u,onDelete:()=>new Promise((e,i)=>{setTimeout(()=>{Math.random()<.3?i({message:"Ошибка удаления строк",code:400}):e({data:{result:"OK"}})},2e3)})}},buttons:null},F=()=>t.jsxs(t.Fragment,{children:[t.jsx("h1",{children:"Пример TreeSelect с асинхронной формой редактирования"}),t.jsx("p",{children:"Для данного примера операция завершится ошибкой с вероятностью 30%"}),t.jsx("div",{style:{maxWidth:500},children:t.jsx(c,{...f})})]}),E=e=>t.jsxs(l,{children:[t.jsx("div",{children:t.jsx(F,{})}),t.jsx(r,{}),t.jsx("div",{children:t.jsx(o,{items:[{key:1,label:"Show source",children:t.jsx(n,{language:"javascript",style:e.darkMode?s:m,showLineNumbers:!0,children:`
import React from 'react';
import {DForm, IDFormProps} from @krinopotam/ui-kit/dForm';
import {IDFormModalProps} from @krinopotam/ui-kit/dFormModal';
Expand Down Expand Up @@ -152,4 +152,4 @@ export const TreeSelectWithFormAsync = (): React.JSX.Element => {
</>
);
};
`})}]})})]});export{M as Page30047908f9c5435d971903e9658f2a1f,M as default};
`})}]})})]});export{E as Page0204e497d0cd4b16b8c9a2f16e3a4c51,E as default};
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
import{r as i,j as o,D as s}from"./index-jRq8dFl9.js";import{P as n,C as a,h as m,d as l,a as d}from"./docco-DVswO1UK.js";import{B as p}from"./messageBox-A1wgNO27.js";import{D as c}from"./dFormModal-DuFw94ex.js";import{I as u}from"./inputField-DjpktlwZ.js";import{P as f}from"./passwordField-BcOkdDNE.js";import{F as h}from"./buttonsProps-C8-j13mC.js";import"./dForm-CmpnCynY.js";import"./index-h_fYsjXx.js";import"./modal-Bq0KGAYX.js";import"./index-CBQ57er9.js";import"./EyeOutlined-B_mcHe4i.js";import"./SearchOutlined-y0oc_54U.js";const e={},x={formId:"Test form",apiRef:e,confirmChanges:!0,fieldsProps:{field1:{component:u,label:"login",tooltip:"Login input"},field2:{component:f,label:"password",tooltip:"Password input"}},onSubmit:()=>new Promise((r,t)=>{setTimeout(()=>{Math.random()<.5?t({message:"Ошибка сохранения",code:400}):r({data:{login:"new login",password:"new password"}})},3e3)}),buttons:h(e)},F=()=>{const r=i.useCallback(()=>{e.open("create")},[]);return o.jsxs(o.Fragment,{children:[o.jsx("h1",{children:"Пример сохранения данных модальной формы"}),o.jsx("p",{children:"Для обеспечения сохранения необходимо в калбэк onSubmit передать функцию, возвращающую Promise, который при успешном ответе сервера (resolve) возвращает объект вида:"}),o.jsx("code",{children:'data:{имя_поля1: "значение", имя_поля2: "значение 2"...}'}),o.jsx("p",{children:"а при ошибке (reject)"}),o.jsx("code",{children:"error:{message: string, code: number}"}),o.jsx("p",{children:"Для примера, вероятность сбоя при сохранении 50%"}),o.jsx("p",{}),o.jsxs("div",{style:{maxWidth:500},children:[o.jsx(p,{onClick:r,children:"Open form"}),o.jsx(c,{...x})]})]})},A=r=>o.jsxs(n,{children:[o.jsx("div",{children:o.jsx(F,{})}),o.jsx(s,{}),o.jsx("div",{children:o.jsx(a,{items:[{key:1,label:"Show source",children:o.jsx(m,{language:"javascript",style:r.darkMode?l:d,showLineNumbers:!0,children:`
import React, {useCallback} from 'react';
import {Button} from @krinopotam/ui-kit/button';
import {IDFormModalApi, DFormModal, IDFormModalProps} from @krinopotam/ui-kit/dFormModal';
import {InputField} from @krinopotam/ui-kit/dForm/fields/input/inputField";
import {PasswordField} from @krinopotam/ui-kit/dForm/fields/password/passwordField";
import {FormLayoutSwitch} from "../../common/buttonsProps";
const formApi = {} as IDFormModalApi;
const formProps: IDFormModalProps = {
formId: 'Test form',
apiRef: formApi,
confirmChanges: true,
fieldsProps: {
field1: {component: InputField, label: 'login', tooltip: 'Login input'},
field2: {component: PasswordField, label: 'password', tooltip: 'Password input'},
},
onSubmit: () => {
return new Promise((resolve, reject) => {
setTimeout(() => {
if (Math.random() < 0.5) reject({message: 'Ошибка сохранения', code: 400});
else resolve({data: {login: 'new login', password: 'new password'}});
}, 3000);
});
},
buttons: FormLayoutSwitch(formApi),
}
export const ModalFormSubmitting = (): React.JSX.Element => {
const onClick = useCallback(() => {
formApi.open('create');
}, []);
return (
<>
<div style={{maxWidth: 500}}>
<Button onClick={onClick}>Open form</Button>
<DFormModal {...formProps} />
</div>
</>
);
};
`})}]})})]});export{A as Page05c3388fea664137be83236b516398dd,A as default};
Loading

0 comments on commit 8e950ae

Please sign in to comment.